@webiny/app-headless-cms 0.0.0-unstable.eb196ccd2f → 0.0.0-unstable.eb81deee7e

package/presentation/fieldRenderers/ref/components/NewEntryDrawer.js

@@ -0,0 +1,97 @@
+import react, { useCallback, useEffect, useMemo } from "react";
+import { observer } from "mobx-react-lite";
+import { DiContainerProvider, useContainer, useFeature } from "@webiny/app";
+import { Drawer, OverlayLoader } from "@webiny/admin-ui";
+import { DialogsProvider, LeftPanel, RightPanel, SplitView } from "@webiny/app-admin";
+import { FormView } from "@webiny/app-admin/features/formModel/FormView.js";
+import { FoldersFeature } from "@webiny/app-aco/features/folders/feature.js";
+import { FolderTreePresenterFeature } from "@webiny/app-aco/presentation/folderTree/feature.js";
+import { FolderTree } from "@webiny/app-aco/presentation/folderTree/FolderTree.js";
+import { ContentEntryFeature } from "../../../../features/contentEntry/feature.js";
+import { CmsModelContext } from "../../../../features/contentEntry/CmsModelContext.js";
+import { ContentEntryFormPresenterFeature } from "../../../contentEntries/form/feature.js";
+import { NewEntryPresenterFeature } from "../newEntry/feature.js";
+import { GenericModelLoader } from "../../../contentEntries/views/GenericModelLoader.js";
+const NewEntryDrawer = ({ modelId, onClose, onChange })=>{
+    const parentContainer = useContainer();
+    const dialogContainer = useMemo(()=>{
+        const child = parentContainer.createChildContainer();
+        ContentEntryFeature.register(child);
+        child.register(CmsModelContext).inSingletonScope();
+        FoldersFeature.register(child, {
+            type: `cms:${modelId}`
+        });
+        FolderTreePresenterFeature.register(child);
+        ContentEntryFormPresenterFeature.register(child);
+        NewEntryPresenterFeature.register(child);
+        return child;
+    }, [
+        modelId
+    ]);
+    return /*#__PURE__*/ react.createElement(DiContainerProvider, {
+        container: dialogContainer
+    }, /*#__PURE__*/ react.createElement(DialogsProvider, null, /*#__PURE__*/ react.createElement(GenericModelLoader, {
+        modelId: modelId
+    }, (model)=>/*#__PURE__*/ react.createElement(NewEntryDrawerContent, {
+            model: model,
+            onClose: onClose,
+            onChange: onChange
+        }))));
+};
+const NewEntryDrawerContent = observer(({ model, onClose, onChange })=>{
+    const { presenter } = useFeature(NewEntryPresenterFeature);
+    useEffect(()=>{
+        presenter.init();
+        return ()=>presenter.dispose();
+    }, []);
+    const onSave = useCallback(async ()=>{
+        const saved = await presenter.form.saveRevision({
+            skipValidation: false
+        });
+        if (saved && presenter.form.vm.entry) {
+            onChange({
+                id: presenter.form.vm.entry.id,
+                modelId: model.modelId
+            });
+            onClose();
+        }
+    }, [
+        model.modelId
+    ]);
+    const vm = presenter.form.vm;
+    return /*#__PURE__*/ react.createElement(Drawer, {
+        open: true,
+        onClose: onClose,
+        width: 1000,
+        modal: true,
+        headerSeparator: true,
+        footerSeparator: true,
+        bodyPadding: false,
+        title: `New ${model.name} Entry`,
+        actions: /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(Drawer.CancelButton, null), /*#__PURE__*/ react.createElement(Drawer.ConfirmButton, {
+            onClick: onSave,
+            text: "Create Entry"
+        }))
+    }, /*#__PURE__*/ react.createElement(SplitView, null, /*#__PURE__*/ react.createElement(LeftPanel, {
+        span: 3
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "px-sm-extra py-sm"
+    }, /*#__PURE__*/ react.createElement(FolderTree, {
+        vm: presenter.folders.vm,
+        actions: presenter.folders,
+        enableActions: true,
+        enableCreate: true
+    }))), /*#__PURE__*/ react.createElement(RightPanel, {
+        span: 9
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "p-md relative"
+    }, vm.loading ? /*#__PURE__*/ react.createElement(OverlayLoader, {
+        text: "Creating entry..."
+    }) : null, vm.form ? /*#__PURE__*/ react.createElement(FormView, {
+        name: "NewRefEntryForm",
+        form: vm.form
+    }) : null))));
+});
+export { NewEntryDrawer };
+
+//# sourceMappingURL=NewEntryDrawer.js.map

package/presentation/fieldRenderers/ref/components/NewEntryDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/fieldRenderers/ref/components/NewEntryDrawer.js","sources":["../../../../../src/presentation/fieldRenderers/ref/components/NewEntryDrawer.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { DiContainerProvider, useContainer, useFeature } from \"@webiny/app\";\nimport { Drawer, OverlayLoader } from \"@webiny/admin-ui\";\nimport { SplitView, LeftPanel, RightPanel, DialogsProvider } from \"@webiny/app-admin\";\nimport { FormView } from \"@webiny/app-admin/features/formModel/FormView.js\";\nimport { FoldersFeature } from \"@webiny/app-aco/features/folders/feature.js\";\nimport { FolderTreePresenterFeature } from \"@webiny/app-aco/presentation/folderTree/feature.js\";\nimport { FolderTree } from \"@webiny/app-aco/presentation/folderTree/FolderTree.js\";\nimport { ContentEntryFeature } from \"~/features/contentEntry/feature.js\";\nimport { CmsModelContext } from \"~/features/contentEntry/CmsModelContext.js\";\nimport { ContentEntryFormPresenterFeature } from \"~/presentation/contentEntries/form/feature.js\";\nimport { NewEntryPresenterFeature } from \"../newEntry/feature.js\";\nimport { GenericModelLoader } from \"~/presentation/contentEntries/views/GenericModelLoader.js\";\nimport type { CmsModel } from \"~/types.js\";\nimport type { CmsReferenceValue } from \"~/features/contentEntry/refTypes.js\";\n\ninterface NewEntryDrawerProps {\n    modelId: string;\n    onClose: () => void;\n    onChange: (value: CmsReferenceValue) => void;\n}\n\nexport const NewEntryDrawer = ({ modelId, onClose, onChange }: NewEntryDrawerProps) => {\n    const parentContainer = useContainer();\n\n    const dialogContainer = useMemo(() => {\n        const child = parentContainer.createChildContainer();\n        ContentEntryFeature.register(child);\n        child.register(CmsModelContext).inSingletonScope();\n        FoldersFeature.register(child, { type: `cms:${modelId}` });\n        FolderTreePresenterFeature.register(child);\n        ContentEntryFormPresenterFeature.register(child);\n        NewEntryPresenterFeature.register(child);\n        return child;\n    }, [modelId]);\n\n    return (\n        <DiContainerProvider container={dialogContainer}>\n            <DialogsProvider>\n                <GenericModelLoader modelId={modelId}>\n                    {model => (\n                        <NewEntryDrawerContent\n                            model={model}\n                            onClose={onClose}\n                            onChange={onChange}\n                        />\n                    )}\n                </GenericModelLoader>\n            </DialogsProvider>\n        </DiContainerProvider>\n    );\n};\n\ninterface NewEntryDrawerContentProps {\n    model: CmsModel;\n    onClose: () => void;\n    onChange: (value: CmsReferenceValue) => void;\n}\n\nconst NewEntryDrawerContent = observer(\n    ({ model, onClose, onChange }: NewEntryDrawerContentProps) => {\n        const { presenter } = useFeature(NewEntryPresenterFeature);\n\n        useEffect(() => {\n            presenter.init();\n            return () => presenter.dispose();\n        }, []);\n\n        const onSave = useCallback(async () => {\n            const saved = await presenter.form.saveRevision({ skipValidation: false });\n            if (saved && presenter.form.vm.entry) {\n                onChange({\n                    id: presenter.form.vm.entry.id,\n                    modelId: model.modelId\n                });\n                onClose();\n            }\n        }, [model.modelId]);\n\n        const vm = presenter.form.vm;\n\n        return (\n            <Drawer\n                open={true}\n                onClose={onClose}\n                width={1000}\n                modal={true}\n                headerSeparator={true}\n                footerSeparator={true}\n                bodyPadding={false}\n                title={`New ${model.name} Entry`}\n                actions={\n                    <>\n                        <Drawer.CancelButton />\n                        <Drawer.ConfirmButton onClick={onSave} text=\"Create Entry\" />\n                    </>\n                }\n            >\n                <SplitView>\n                    <LeftPanel span={3}>\n                        <div className={\"px-sm-extra py-sm\"}>\n                            <FolderTree\n                                vm={presenter.folders.vm}\n                                actions={presenter.folders}\n                                enableActions={true}\n                                enableCreate={true}\n                            />\n                        </div>\n                    </LeftPanel>\n                    <RightPanel span={9}>\n                        <div className={\"p-md relative\"}>\n                            {vm.loading ? <OverlayLoader text={\"Creating entry...\"} /> : null}\n                            {vm.form ? <FormView name=\"NewRefEntryForm\" form={vm.form} /> : null}\n                        </div>\n                    </RightPanel>\n                </SplitView>\n            </Drawer>\n        );\n    }\n);\n"],"names":["NewEntryDrawer","modelId","onClose","onChange","parentContainer","useContainer","dialogContainer","useMemo","child","ContentEntryFeature","CmsModelContext","FoldersFeature","FolderTreePresenterFeature","ContentEntryFormPresenterFeature","NewEntryPresenterFeature","DiContainerProvider","DialogsProvider","GenericModelLoader","model","NewEntryDrawerContent","observer","presenter","useFeature","useEffect","onSave","useCallback","saved","vm","Drawer","SplitView","LeftPanel","FolderTree","RightPanel","OverlayLoader","FormView"],"mappings":";;;;;;;;;;;;;;AAuBO,MAAMA,iBAAiB,CAAC,EAAEC,OAAO,EAAEC,OAAO,EAAEC,QAAQ,EAAuB;IAC9E,MAAMC,kBAAkBC;IAExB,MAAMC,kBAAkBC,QAAQ;QAC5B,MAAMC,QAAQJ,gBAAgB,oBAAoB;QAClDK,oBAAoB,QAAQ,CAACD;QAC7BA,MAAM,QAAQ,CAACE,iBAAiB,gBAAgB;QAChDC,eAAe,QAAQ,CAACH,OAAO;YAAE,MAAM,CAAC,IAAI,EAAEP,SAAS;QAAC;QACxDW,2BAA2B,QAAQ,CAACJ;QACpCK,iCAAiC,QAAQ,CAACL;QAC1CM,yBAAyB,QAAQ,CAACN;QAClC,OAAOA;IACX,GAAG;QAACP;KAAQ;IAEZ,OAAO,WAAP,GACI,oBAACc,qBAAmBA;QAAC,WAAWT;qBAC5B,oBAACU,iBAAeA,MAAAA,WAAAA,GACZ,oBAACC,oBAAkBA;QAAC,SAAShB;OACxBiB,CAAAA,QAAAA,WAAAA,GACG,oBAACC,uBAAqBA;YAClB,OAAOD;YACP,SAAShB;YACT,UAAUC;;AAOtC;AAQA,MAAMgB,wBAAwBC,SAC1B,CAAC,EAAEF,KAAK,EAAEhB,OAAO,EAAEC,QAAQ,EAA8B;IACrD,MAAM,EAAEkB,SAAS,EAAE,GAAGC,WAAWR;IAEjCS,UAAU;QACNF,UAAU,IAAI;QACd,OAAO,IAAMA,UAAU,OAAO;IAClC,GAAG,EAAE;IAEL,MAAMG,SAASC,YAAY;QACvB,MAAMC,QAAQ,MAAML,UAAU,IAAI,CAAC,YAAY,CAAC;YAAE,gBAAgB;QAAM;QACxE,IAAIK,SAASL,UAAU,IAAI,CAAC,EAAE,CAAC,KAAK,EAAE;YAClClB,SAAS;gBACL,IAAIkB,UAAU,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE;gBAC9B,SAASH,MAAM,OAAO;YAC1B;YACAhB;QACJ;IACJ,GAAG;QAACgB,MAAM,OAAO;KAAC;IAElB,MAAMS,KAAKN,UAAU,IAAI,CAAC,EAAE;IAE5B,OAAO,WAAP,GACI,oBAACO,QAAMA;QACH,MAAM;QACN,SAAS1B;QACT,OAAO;QACP,OAAO;QACP,iBAAiB;QACjB,iBAAiB;QACjB,aAAa;QACb,OAAO,CAAC,IAAI,EAAEgB,MAAM,IAAI,CAAC,MAAM,CAAC;QAChC,uBACI,wDACI,oBAACU,OAAO,YAAY,uBACpB,oBAACA,OAAO,aAAa;YAAC,SAASJ;YAAQ,MAAK;;qBAIpD,oBAACK,WAASA,MAAAA,WAAAA,GACN,oBAACC,WAASA;QAAC,MAAM;qBACb,oBAAC;QAAI,WAAW;qBACZ,oBAACC,YAAUA;QACP,IAAIV,UAAU,OAAO,CAAC,EAAE;QACxB,SAASA,UAAU,OAAO;QAC1B,eAAe;QACf,cAAc;wBAI1B,oBAACW,YAAUA;QAAC,MAAM;qBACd,oBAAC;QAAI,WAAW;OACXL,GAAG,OAAO,GAAG,WAAH,GAAG,oBAACM,eAAaA;QAAC,MAAM;SAA0B,MAC5DN,GAAG,IAAI,GAAG,WAAH,GAAG,oBAACO,UAAQA;QAAC,MAAK;QAAkB,MAAMP,GAAG,IAAI;SAAO;AAMxF"}

package/presentation/fieldRenderers/ref/components/RefFieldOptions.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import type { CmsModel } from "../../../../types.js";
+interface RefFieldOptionsProps {
+    models: CmsModel[];
+    onNewRecord: (modelId: string) => void;
+    onLinkExistingRecord: (modelId: string) => void;
+}
+export declare const RefFieldOptions: (({ models, onNewRecord, onLinkExistingRecord }: RefFieldOptionsProps) => React.JSX.Element) & React.NamedExoticComponent<RefFieldOptionsProps> & {
+    readonly type: ({ models, onNewRecord, onLinkExistingRecord }: RefFieldOptionsProps) => React.JSX.Element;
+};
+export {};

package/presentation/fieldRenderers/ref/components/RefFieldOptions.js

@@ -0,0 +1,88 @@
+import react, { useCallback } from "react";
+import { ReactComponent } from "@webiny/icons/add.svg";
+import { ReactComponent as link_svg_ReactComponent } from "@webiny/icons/link.svg";
+import { Button, DropdownMenu, Icon, Text } from "@webiny/admin-ui";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { normalizeIcon } from "../../../../utils/normalizeIcon.js";
+import { observer } from "mobx-react-lite";
+const ModelListItem = ({ model, onClick: originalOnClick })=>{
+    const onClick = useCallback(()=>{
+        originalOnClick(model.modelId);
+    }, [
+        originalOnClick
+    ]);
+    const faIcon = normalizeIcon(model.icon);
+    const icon = faIcon ? /*#__PURE__*/ react.createElement(Icon, {
+        icon: /*#__PURE__*/ react.createElement(FontAwesomeIcon, {
+            icon: faIcon
+        }),
+        label: "Model icon",
+        size: "lg",
+        className: "text-neutral-strong"
+    }) : void 0;
+    return /*#__PURE__*/ react.createElement(DropdownMenu.Item, {
+        onClick: onClick,
+        icon: icon,
+        text: /*#__PURE__*/ react.createElement("div", null, /*#__PURE__*/ react.createElement(Text, {
+            as: "div"
+        }, model.name), /*#__PURE__*/ react.createElement(Text, {
+            as: "div",
+            size: "sm",
+            className: "text-neutral-strong"
+        }, model.description))
+    });
+};
+const RefFieldOptions = observer(({ 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)
+        })
+    }, models.map((model)=>/*#__PURE__*/ react.createElement(ModelListItem, {
+            key: model.modelId,
+            onClick: onNewRecord,
+            model: model
+        }))), /*#__PURE__*/ react.createElement(DropdownMenu, {
+        trigger: /*#__PURE__*/ react.createElement(Button, {
+            variant: "tertiary",
+            text: "Select an existing record",
+            icon: /*#__PURE__*/ react.createElement(link_svg_ReactComponent, null)
+        })
+    }, models.map((model)=>/*#__PURE__*/ react.createElement(ModelListItem, {
+            key: model.modelId,
+            onClick: onLinkExistingRecord,
+            model: model
+        }))));
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-wrap gap-sm"
+    }, /*#__PURE__*/ react.createElement(Button, {
+        variant: "tertiary",
+        text: "Create a new record",
+        icon: /*#__PURE__*/ react.createElement(ReactComponent, null),
+        onClick: onSingleNewRecord
+    }), /*#__PURE__*/ react.createElement(Button, {
+        variant: "tertiary",
+        text: "Select an existing record",
+        icon: /*#__PURE__*/ react.createElement(link_svg_ReactComponent, null),
+        onClick: onSingleExistingRecord
+    }));
+});
+export { RefFieldOptions };
+
+//# sourceMappingURL=RefFieldOptions.js.map

package/presentation/fieldRenderers/ref/components/RefFieldOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/fieldRenderers/ref/components/RefFieldOptions.js","sources":["../../../../../src/presentation/fieldRenderers/ref/components/RefFieldOptions.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport type { CmsModel } from \"~/types.js\";\nimport { ReactComponent as AddIcon } from \"@webiny/icons/add.svg\";\nimport { ReactComponent as LinkIcon } from \"@webiny/icons/link.svg\";\nimport { Button, DropdownMenu, Text, Icon } from \"@webiny/admin-ui\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport { normalizeIcon } from \"~/utils/normalizeIcon.js\";\nimport { observer } from \"mobx-react-lite\";\n\ninterface ModelListItemProps {\n    model: Pick<CmsModel, \"modelId\" | \"name\" | \"description\" | \"icon\">;\n    onClick: (modelId: string) => void;\n}\n\nconst ModelListItem = ({ model, onClick: originalOnClick }: ModelListItemProps) => {\n    const onClick = useCallback(() => {\n        originalOnClick(model.modelId);\n    }, [originalOnClick]);\n\n    const faIcon = normalizeIcon(model.icon);\n    const icon = faIcon ? (\n        <Icon\n            icon={<FontAwesomeIcon icon={faIcon} />}\n            label={\"Model icon\"}\n            size={\"lg\"}\n            className={\"text-neutral-strong\"}\n        />\n    ) : undefined;\n\n    return (\n        <DropdownMenu.Item\n            onClick={onClick}\n            icon={icon}\n            text={\n                <div>\n                    <Text as={\"div\"}>{model.name}</Text>\n                    <Text as={\"div\"} size={\"sm\"} className={\"text-neutral-strong\"}>\n                        {model.description}\n                    </Text>\n                </div>\n            }\n        />\n    );\n};\n\ninterface RefFieldOptionsProps {\n    models: CmsModel[];\n    onNewRecord: (modelId: string) => void;\n    onLinkExistingRecord: (modelId: string) => void;\n}\n\nexport const RefFieldOptions = observer(\n    ({ models, onNewRecord, onLinkExistingRecord }: RefFieldOptionsProps) => {\n        const hasMultipleModels = models.length > 1;\n\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                        {models.map(model => (\n                            <ModelListItem\n                                key={model.modelId}\n                                onClick={onNewRecord}\n                                model={model}\n                            />\n                        ))}\n                    </DropdownMenu>\n                    <DropdownMenu\n                        trigger={\n                            <Button\n                                variant={\"tertiary\"}\n                                text=\"Select an existing record\"\n                                icon={<LinkIcon />}\n                            />\n                        }\n                    >\n                        {models.map(model => (\n                            <ModelListItem\n                                key={model.modelId}\n                                onClick={onLinkExistingRecord}\n                                model={model}\n                            />\n                        ))}\n                    </DropdownMenu>\n                </div>\n            );\n        }\n\n        return (\n            <div className={\"flex flex-wrap gap-sm\"}>\n                <Button\n                    variant={\"tertiary\"}\n                    text=\"Create a new record\"\n                    icon={<AddIcon />}\n                    onClick={onSingleNewRecord}\n                />\n                <Button\n                    variant={\"tertiary\"}\n                    text=\"Select an existing record\"\n                    icon={<LinkIcon />}\n                    onClick={onSingleExistingRecord}\n                />\n            </div>\n        );\n    }\n);\n"],"names":["ModelListItem","model","originalOnClick","onClick","useCallback","faIcon","normalizeIcon","icon","Icon","FontAwesomeIcon","undefined","DropdownMenu","Text","RefFieldOptions","observer","models","onNewRecord","onLinkExistingRecord","hasMultipleModels","onSingleNewRecord","onSingleExistingRecord","Button","AddIcon","LinkIcon"],"mappings":";;;;;;;AAcA,MAAMA,gBAAgB,CAAC,EAAEC,KAAK,EAAE,SAASC,eAAe,EAAsB;IAC1E,MAAMC,UAAUC,YAAY;QACxBF,gBAAgBD,MAAM,OAAO;IACjC,GAAG;QAACC;KAAgB;IAEpB,MAAMG,SAASC,cAAcL,MAAM,IAAI;IACvC,MAAMM,OAAOF,SAAS,WAATA,GACT,oBAACG,MAAIA;QACD,oBAAM,oBAACC,iBAAeA;YAAC,MAAMJ;;QAC7B,OAAO;QACP,MAAM;QACN,WAAW;SAEfK;IAEJ,OAAO,WAAP,GACI,oBAACC,aAAa,IAAI;QACd,SAASR;QACT,MAAMI;QACN,oBACI,oBAAC,2BACG,oBAACK,MAAIA;YAAC,IAAI;WAAQX,MAAM,IAAI,iBAC5B,oBAACW,MAAIA;YAAC,IAAI;YAAO,MAAM;YAAM,WAAW;WACnCX,MAAM,WAAW;;AAM1C;AAQO,MAAMY,kBAAkBC,SAC3B,CAAC,EAAEC,MAAM,EAAEC,WAAW,EAAEC,oBAAoB,EAAwB;IAChE,MAAMC,oBAAoBH,OAAO,MAAM,GAAG;IAE1C,MAAMI,oBAAoBf,YAAY;QAClC,IAAIW,AAAkB,MAAlBA,OAAO,MAAM,IAAUG,mBACvB;QAEJF,YAAYD,MAAM,CAAC,EAAE,CAAC,OAAO;IACjC,GAAG;QAACA;KAAO;IAEX,MAAMK,yBAAyBhB,YAAY;QACvC,IAAIW,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,oBAACP,cAAYA;QACT,uBACI,oBAACU,QAAMA;YACH,SAAS;YACT,MAAK;YACL,oBAAM,oBAACC,gBAAOA;;OAIrBP,OAAO,GAAG,CAACd,CAAAA,QAAAA,WAAAA,GACR,oBAACD,eAAaA;YACV,KAAKC,MAAM,OAAO;YAClB,SAASe;YACT,OAAOf;4BAInB,oBAACU,cAAYA;QACT,uBACI,oBAACU,QAAMA;YACH,SAAS;YACT,MAAK;YACL,oBAAM,oBAACE,yBAAQA;;OAItBR,OAAO,GAAG,CAACd,CAAAA,QAAAA,WAAAA,GACR,oBAACD,eAAaA;YACV,KAAKC,MAAM,OAAO;YAClB,SAASgB;YACT,OAAOhB;;IAQ/B,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACoB,QAAMA;QACH,SAAS;QACT,MAAK;QACL,oBAAM,oBAACC,gBAAOA;QACd,SAASH;sBAEb,oBAACE,QAAMA;QACH,SAAS;QACT,MAAK;QACL,oBAAM,oBAACE,yBAAQA;QACf,SAASH;;AAIzB"}

package/presentation/fieldRenderers/ref/components/ReferencesDialog.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import type { CmsReferenceEntry, CmsReferenceValue } from "../../../../features/contentEntry/refTypes.js";
+import type { CmsModel } from "../../../../types.js";
+interface ReferencesDialogProps {
+    model: CmsModel;
+    values: CmsReferenceValue[];
+    onSave: (values: CmsReferenceValue[], entries: CmsReferenceEntry[]) => void;
+    onClose: () => void;
+    multiple: boolean;
+}
+export declare const ReferencesDialog: ({ model, values, onSave, onClose, multiple }: ReferencesDialogProps) => React.JSX.Element;
+export {};

package/presentation/fieldRenderers/ref/components/ReferencesDialog.js

@@ -0,0 +1,105 @@
+import react, { useEffect, useMemo, useState } from "react";
+import { observer } from "mobx-react-lite";
+import { DiContainerProvider, useContainer } from "@webiny/app";
+import { useFeature } from "@webiny/app-admin";
+import { DelayedOnChange, Dialog, Icon, Input, OverlayLoader } from "@webiny/admin-ui";
+import { ReactComponent } from "@webiny/icons/search.svg";
+import { ContentEntryFeature } from "../../../../features/contentEntry/feature.js";
+import { RefDialogPresenterFeature } from "../dialog/feature.js";
+import { EntryCard } from "./EntryCard.js";
+import { EntryList } from "./EntryList.js";
+import { parseIdentifier } from "@webiny/utils";
+const ReferencesDialog = ({ model, values, onSave, onClose, multiple })=>{
+    const parentContainer = useContainer();
+    const dialogContainer = useMemo(()=>{
+        const child = parentContainer.createChildContainer();
+        ContentEntryFeature.register(child);
+        RefDialogPresenterFeature.register(child);
+        return child;
+    }, []);
+    return /*#__PURE__*/ react.createElement(DiContainerProvider, {
+        container: dialogContainer
+    }, /*#__PURE__*/ react.createElement(ReferencesDialogContent, {
+        model: model,
+        initialValues: values,
+        onSave: onSave,
+        onClose: onClose,
+        multiple: multiple
+    }));
+};
+const ReferencesDialogContent = observer(({ model, initialValues, onSave, onClose, multiple })=>{
+    const { presenter } = useFeature(RefDialogPresenterFeature);
+    const [searchValue, setSearchValue] = useState("");
+    useEffect(()=>{
+        presenter.init({
+            modelId: model.modelId,
+            initialValues,
+            multiple
+        });
+        return ()=>presenter.dispose();
+    }, []);
+    const selectedValues = presenter.vm.selectedValues;
+    const isSelected = (entry)=>{
+        const { id: entryId } = parseIdentifier(entry.id);
+        return selectedValues.some((v)=>{
+            const { id: vEntryId } = parseIdentifier(v.id);
+            return vEntryId === entryId;
+        });
+    };
+    const onDialogSave = ()=>{
+        const savedValues = presenter.save();
+        const rows = presenter.list.vm.rows;
+        const selectedEntries = savedValues.map((v)=>{
+            const { id: entryId } = parseIdentifier(v.id);
+            return rows.find((r)=>r.entryId === entryId);
+        }).filter((e)=>null != e);
+        onSave(savedValues, selectedEntries);
+        onClose();
+    };
+    const onSearchChange = (value)=>{
+        setSearchValue(value);
+        presenter.list.actions.search.set(value);
+    };
+    const listVm = presenter.list.vm;
+    return /*#__PURE__*/ react.createElement(Dialog, {
+        className: "w-[800px]",
+        size: "lg",
+        open: true,
+        onClose: onClose,
+        title: "Select an existing record",
+        description: /*#__PURE__*/ react.createElement(react.Fragment, null, "Content model:", " ", /*#__PURE__*/ react.createElement("span", {
+            className: "font-bold text-neutral-primary"
+        }, model.name)),
+        actions: /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(Dialog.CancelAction, null), /*#__PURE__*/ react.createElement(Dialog.ConfirmAction, {
+            onClick: onDialogSave,
+            text: "Save"
+        }))
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "relative"
+    }, listVm.pagination.loading && /*#__PURE__*/ react.createElement(OverlayLoader, null), /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-md"
+    }, /*#__PURE__*/ react.createElement(DelayedOnChange, {
+        value: searchValue,
+        onChange: onSearchChange
+    }, ({ value, onChange })=>/*#__PURE__*/ react.createElement(Input, {
+            size: "lg",
+            placeholder: "Search entries...",
+            onChange: onChange,
+            value: value,
+            startIcon: /*#__PURE__*/ react.createElement(Icon, {
+                label: "Search",
+                icon: /*#__PURE__*/ react.createElement(ReactComponent, null)
+            })
+        })), /*#__PURE__*/ react.createElement(EntryList, {
+        entries: listVm.rows,
+        loadMore: ()=>presenter.list.actions.loadMore()
+    }, (entry)=>/*#__PURE__*/ react.createElement(EntryCard, {
+            model: model,
+            entry: entry,
+            selected: isSelected(entry),
+            onChange: (ref)=>presenter.toggleEntry(ref)
+        })))));
+});
+export { ReferencesDialog };
+
+//# sourceMappingURL=ReferencesDialog.js.map

package/presentation/fieldRenderers/ref/components/ReferencesDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/fieldRenderers/ref/components/ReferencesDialog.js","sources":["../../../../../src/presentation/fieldRenderers/ref/components/ReferencesDialog.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { DiContainerProvider, useContainer } from \"@webiny/app\";\nimport { useFeature } from \"@webiny/app-admin\";\nimport { Dialog, OverlayLoader } from \"@webiny/admin-ui\";\nimport { ReactComponent as SearchIcon } from \"@webiny/icons/search.svg\";\nimport { Input, DelayedOnChange, Icon } from \"@webiny/admin-ui\";\nimport { ContentEntryFeature } from \"~/features/contentEntry/feature.js\";\nimport { RefDialogPresenterFeature } from \"../dialog/feature.js\";\nimport type { CmsReferenceEntry, CmsReferenceValue } from \"~/features/contentEntry/refTypes.js\";\nimport type { CmsModel } from \"~/types.js\";\nimport { EntryCard } from \"./EntryCard.js\";\nimport { EntryList } from \"./EntryList.js\";\nimport { parseIdentifier } from \"@webiny/utils\";\n\ninterface ReferencesDialogProps {\n    model: CmsModel;\n    values: CmsReferenceValue[];\n    onSave: (values: CmsReferenceValue[], entries: CmsReferenceEntry[]) => void;\n    onClose: () => void;\n    multiple: boolean;\n}\n\nexport const ReferencesDialog = ({\n    model,\n    values,\n    onSave,\n    onClose,\n    multiple\n}: ReferencesDialogProps) => {\n    const parentContainer = useContainer();\n\n    const dialogContainer = useMemo(() => {\n        const child = parentContainer.createChildContainer();\n        ContentEntryFeature.register(child);\n        RefDialogPresenterFeature.register(child);\n        return child;\n    }, []);\n\n    return (\n        <DiContainerProvider container={dialogContainer}>\n            <ReferencesDialogContent\n                model={model}\n                initialValues={values}\n                onSave={onSave}\n                onClose={onClose}\n                multiple={multiple}\n            />\n        </DiContainerProvider>\n    );\n};\n\ninterface ReferencesDialogContentProps {\n    model: CmsModel;\n    initialValues: CmsReferenceValue[];\n    onSave: (values: CmsReferenceValue[], entries: CmsReferenceEntry[]) => void;\n    onClose: () => void;\n    multiple: boolean;\n}\n\nconst ReferencesDialogContent = observer(\n    ({ model, initialValues, onSave, onClose, multiple }: ReferencesDialogContentProps) => {\n        const { presenter } = useFeature(RefDialogPresenterFeature);\n        const [searchValue, setSearchValue] = useState(\"\");\n\n        useEffect(() => {\n            presenter.init({ modelId: model.modelId, initialValues, multiple });\n            return () => presenter.dispose();\n        }, []);\n\n        const selectedValues = presenter.vm.selectedValues;\n\n        const isSelected = (entry: CmsReferenceEntry): boolean => {\n            const { id: entryId } = parseIdentifier(entry.id);\n            return selectedValues.some(v => {\n                const { id: vEntryId } = parseIdentifier(v.id);\n                return vEntryId === entryId;\n            });\n        };\n\n        const onDialogSave = () => {\n            const savedValues = presenter.save();\n            const rows = presenter.list.vm.rows;\n            const selectedEntries = savedValues\n                .map(v => {\n                    const { id: entryId } = parseIdentifier(v.id);\n                    return rows.find(r => r.entryId === entryId);\n                })\n                .filter((e): e is CmsReferenceEntry => e != null);\n            onSave(savedValues, selectedEntries);\n            onClose();\n        };\n\n        const onSearchChange = (value: string) => {\n            setSearchValue(value);\n            presenter.list.actions.search.set(value);\n        };\n\n        const listVm = presenter.list.vm;\n\n        return (\n            <Dialog\n                className={\"w-[800px]\"}\n                size={\"lg\"}\n                open={true}\n                onClose={onClose}\n                title={\"Select an existing record\"}\n                description={\n                    <>\n                        Content model:{\" \"}\n                        <span className={\"font-bold text-neutral-primary\"}>{model.name}</span>\n                    </>\n                }\n                actions={\n                    <>\n                        <Dialog.CancelAction />\n                        <Dialog.ConfirmAction onClick={onDialogSave} text=\"Save\" />\n                    </>\n                }\n            >\n                <div className={\"relative\"}>\n                    {listVm.pagination.loading && <OverlayLoader />}\n                    <div className={\"flex flex-col gap-md\"}>\n                        <DelayedOnChange value={searchValue} onChange={onSearchChange}>\n                            {({ value, onChange }) => (\n                                <Input\n                                    size={\"lg\"}\n                                    placeholder={\"Search entries...\"}\n                                    onChange={onChange}\n                                    value={value}\n                                    startIcon={<Icon label=\"Search\" icon={<SearchIcon />} />}\n                                />\n                            )}\n                        </DelayedOnChange>\n                        <EntryList\n                            entries={listVm.rows}\n                            loadMore={() => presenter.list.actions.loadMore()}\n                        >\n                            {entry => (\n                                <EntryCard\n                                    model={model}\n                                    entry={entry}\n                                    selected={isSelected(entry)}\n                                    onChange={ref => presenter.toggleEntry(ref)}\n                                />\n                            )}\n                        </EntryList>\n                    </div>\n                </div>\n            </Dialog>\n        );\n    }\n);\n"],"names":["ReferencesDialog","model","values","onSave","onClose","multiple","parentContainer","useContainer","dialogContainer","useMemo","child","ContentEntryFeature","RefDialogPresenterFeature","DiContainerProvider","ReferencesDialogContent","observer","initialValues","presenter","useFeature","searchValue","setSearchValue","useState","useEffect","selectedValues","isSelected","entry","entryId","parseIdentifier","v","vEntryId","onDialogSave","savedValues","rows","selectedEntries","r","e","onSearchChange","value","listVm","Dialog","OverlayLoader","DelayedOnChange","onChange","Input","Icon","SearchIcon","EntryList","EntryCard","ref"],"mappings":"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"}

package/presentation/fieldRenderers/ref/detailed/RefDetailedPresenter.d.ts

@@ -0,0 +1,28 @@
+import { GetContentEntriesUseCase } from "../../../../features/contentEntry/getContentEntries/abstractions.js";
+import { ListModelsUseCase } from "../../../../features/model/listModels/abstractions.js";
+import type { CmsReferenceEntry, CmsReferenceEntryPatch, CmsReferenceValue } from "../../../../features/contentEntry/refTypes.js";
+import { RefDetailedPresenter as Abstraction, type IRefDetailedPresenterInitConfig, type IRefDetailedViewModel } from "./abstractions.js";
+declare class RefDetailedPresenterImpl implements Abstraction.Interface {
+    private getContentEntriesUseCase;
+    private listModelsUseCase;
+    private loading;
+    private entries;
+    private models;
+    private multiSelect;
+    private currentPage;
+    private allValues;
+    constructor(getContentEntriesUseCase: GetContentEntriesUseCase.Interface, listModelsUseCase: ListModelsUseCase.Interface);
+    get vm(): IRefDetailedViewModel;
+    init(config: IRefDetailedPresenterInitConfig): Promise<void>;
+    resolveValues(values: CmsReferenceValue[]): Promise<void>;
+    addEntries(entries: CmsReferenceEntry[]): void;
+    patchEntry(patch: CmsReferenceEntryPatch): void;
+    removeEntry(entryId: string): void;
+    loadMore(): void;
+    dispose(): void;
+    private loadPage;
+}
+export declare const RefDetailedPresenter: typeof RefDetailedPresenterImpl & {
+    __abstraction: import("@webiny/di").Abstraction<import("./abstractions.js").IRefDetailedPresenter>;
+};
+export {};

package/presentation/fieldRenderers/ref/detailed/RefDetailedPresenter.js

@@ -0,0 +1,120 @@
+import { computed, makeAutoObservable, runInAction } from "mobx";
+import { GetContentEntriesUseCase } from "../../../../features/contentEntry/getContentEntries/abstractions.js";
+import { ListModelsUseCase } from "../../../../features/model/listModels/abstractions.js";
+import { RefDetailedPresenter } from "./abstractions.js";
+const PER_PAGE = 10;
+class RefDetailedPresenterImpl {
+    constructor(getContentEntriesUseCase, listModelsUseCase){
+        this.getContentEntriesUseCase = getContentEntriesUseCase;
+        this.listModelsUseCase = listModelsUseCase;
+        this.loading = false;
+        this.entries = [];
+        this.models = [];
+        this.multiSelect = false;
+        this.currentPage = 0;
+        this.allValues = [];
+        makeAutoObservable(this, {
+            getContentEntriesUseCase: false,
+            listModelsUseCase: false,
+            vm: computed
+        });
+    }
+    get vm() {
+        return {
+            loading: this.loading,
+            entries: this.entries,
+            models: this.models,
+            multiSelect: this.multiSelect
+        };
+    }
+    async init(config) {
+        this.multiSelect = config.multiSelect;
+        const allModels = await this.listModelsUseCase.execute();
+        runInAction(()=>{
+            this.models = allModels.filter((m)=>config.modelIds.includes(m.modelId));
+        });
+    }
+    async resolveValues(values) {
+        this.allValues = values;
+        this.currentPage = 0;
+        if (0 === values.length) {
+            this.entries = [];
+            return;
+        }
+        await this.loadPage(0);
+    }
+    addEntries(entries) {
+        const existingIds = new Set(this.entries.map((e)=>e.entryId));
+        const newEntries = entries.filter((e)=>!existingIds.has(e.entryId));
+        this.entries = [
+            ...this.entries,
+            ...newEntries
+        ];
+    }
+    patchEntry(patch) {
+        this.entries = this.entries.map((e)=>e.entryId === patch.entryId ? {
+                ...e,
+                ...patch
+            } : e);
+    }
+    removeEntry(entryId) {
+        this.entries = this.entries.filter((e)=>e.entryId !== entryId);
+    }
+    loadMore() {
+        const nextPage = this.currentPage + 1;
+        const start = nextPage * PER_PAGE;
+        if (start >= this.allValues.length) return;
+        this.loadPage(nextPage);
+    }
+    dispose() {}
+    async loadPage(page) {
+        const start = page * PER_PAGE;
+        const chunk = this.allValues.slice(start, start + PER_PAGE);
+        if (0 === chunk.length) return;
+        this.loading = true;
+        try {
+            const result = await this.getContentEntriesUseCase.execute({
+                entries: chunk.map((v)=>({
+                        id: v.id,
+                        modelId: v.modelId
+                    }))
+            });
+            runInAction(()=>{
+                this.currentPage = page;
+                const entryMap = new Map();
+                for (const entry of result.latest)entryMap.set(entry.entryId, entry);
+                for (const entry of result.published){
+                    const existing = entryMap.get(entry.entryId);
+                    if (existing) existing.published = {
+                        id: entry.id,
+                        entryId: entry.entryId,
+                        title: entry.title
+                    };
+                }
+                const resolved = chunk.map((v)=>{
+                    const entryId = v.id.split("#")[0];
+                    return entryMap.get(entryId);
+                }).filter((e)=>null != e);
+                if (0 === page) this.entries = resolved;
+                else this.entries = [
+                    ...this.entries,
+                    ...resolved
+                ];
+            });
+        } finally{
+            runInAction(()=>{
+                this.loading = false;
+            });
+        }
+    }
+}
+const RefDetailedPresenter_RefDetailedPresenter = RefDetailedPresenter.createImplementation({
+    implementation: RefDetailedPresenterImpl,
+    dependencies: [
+        GetContentEntriesUseCase,
+        ListModelsUseCase
+    ]
+});
+export { RefDetailedPresenter_RefDetailedPresenter as RefDetailedPresenter };
+
+//# sourceMappingURL=RefDetailedPresenter.js.map

package/presentation/fieldRenderers/ref/detailed/RefDetailedPresenter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/fieldRenderers/ref/detailed/RefDetailedPresenter.js","sources":["../../../../../src/presentation/fieldRenderers/ref/detailed/RefDetailedPresenter.ts"],"sourcesContent":["import { computed, makeAutoObservable, runInAction } from \"mobx\";\nimport { GetContentEntriesUseCase } from \"~/features/contentEntry/getContentEntries/abstractions.js\";\nimport { ListModelsUseCase } from \"~/features/model/listModels/abstractions.js\";\nimport type { CmsModel } from \"~/types.js\";\nimport type {\n    CmsReferenceEntry,\n    CmsReferenceEntryPatch,\n    CmsReferenceValue\n} from \"~/features/contentEntry/refTypes.js\";\nimport {\n    RefDetailedPresenter as Abstraction,\n    type IRefDetailedPresenterInitConfig,\n    type IRefDetailedViewModel\n} from \"./abstractions.js\";\n\nconst PER_PAGE = 10;\n\nclass RefDetailedPresenterImpl implements Abstraction.Interface {\n    private loading = false;\n    private entries: CmsReferenceEntry[] = [];\n    private models: CmsModel[] = [];\n    private multiSelect = false;\n    private currentPage = 0;\n    private allValues: CmsReferenceValue[] = [];\n\n    constructor(\n        private getContentEntriesUseCase: GetContentEntriesUseCase.Interface,\n        private listModelsUseCase: ListModelsUseCase.Interface\n    ) {\n        makeAutoObservable<\n            RefDetailedPresenterImpl,\n            \"getContentEntriesUseCase\" | \"listModelsUseCase\"\n        >(this, {\n            getContentEntriesUseCase: false,\n            listModelsUseCase: false,\n            vm: computed\n        });\n    }\n\n    get vm(): IRefDetailedViewModel {\n        return {\n            loading: this.loading,\n            entries: this.entries,\n            models: this.models,\n            multiSelect: this.multiSelect\n        };\n    }\n\n    async init(config: IRefDetailedPresenterInitConfig): Promise<void> {\n        this.multiSelect = config.multiSelect;\n\n        const allModels = await this.listModelsUseCase.execute();\n        runInAction(() => {\n            this.models = allModels.filter(m => config.modelIds.includes(m.modelId));\n        });\n    }\n\n    async resolveValues(values: CmsReferenceValue[]): Promise<void> {\n        this.allValues = values;\n        this.currentPage = 0;\n\n        if (values.length === 0) {\n            this.entries = [];\n            return;\n        }\n\n        await this.loadPage(0);\n    }\n\n    addEntries(entries: CmsReferenceEntry[]): void {\n        const existingIds = new Set(this.entries.map(e => e.entryId));\n        const newEntries = entries.filter(e => !existingIds.has(e.entryId));\n        this.entries = [...this.entries, ...newEntries];\n    }\n\n    patchEntry(patch: CmsReferenceEntryPatch): void {\n        this.entries = this.entries.map(e =>\n            e.entryId === patch.entryId ? { ...e, ...patch } : e\n        );\n    }\n\n    removeEntry(entryId: string): void {\n        this.entries = this.entries.filter(e => e.entryId !== entryId);\n    }\n\n    loadMore(): void {\n        const nextPage = this.currentPage + 1;\n        const start = nextPage * PER_PAGE;\n        if (start >= this.allValues.length) {\n            return;\n        }\n        this.loadPage(nextPage);\n    }\n\n    dispose(): void {\n        // Cleanup if needed\n    }\n\n    private async loadPage(page: number): Promise<void> {\n        const start = page * PER_PAGE;\n        const chunk = this.allValues.slice(start, start + PER_PAGE);\n\n        if (chunk.length === 0) {\n            return;\n        }\n\n        this.loading = true;\n\n        try {\n            const result = await this.getContentEntriesUseCase.execute({\n                entries: chunk.map(v => ({ id: v.id, modelId: v.modelId }))\n            });\n\n            runInAction(() => {\n                this.currentPage = page;\n\n                const entryMap = new Map<string, CmsReferenceEntry>();\n                for (const entry of result.latest) {\n                    entryMap.set(entry.entryId, entry);\n                }\n\n                for (const entry of result.published) {\n                    const existing = entryMap.get(entry.entryId);\n                    if (existing) {\n                        existing.published = {\n                            id: entry.id,\n                            entryId: entry.entryId,\n                            title: entry.title\n                        };\n                    }\n                }\n\n                const resolved = chunk\n                    .map(v => {\n                        const entryId = v.id.split(\"#\")[0];\n                        return entryMap.get(entryId);\n                    })\n                    .filter((e): e is CmsReferenceEntry => e != null);\n\n                if (page === 0) {\n                    this.entries = resolved;\n                } else {\n                    this.entries = [...this.entries, ...resolved];\n                }\n            });\n        } finally {\n            runInAction(() => {\n                this.loading = false;\n            });\n        }\n    }\n}\n\nexport const RefDetailedPresenter = Abstraction.createImplementation({\n    implementation: RefDetailedPresenterImpl,\n    dependencies: [GetContentEntriesUseCase, ListModelsUseCase]\n});\n"],"names":["PER_PAGE","RefDetailedPresenterImpl","getContentEntriesUseCase","listModelsUseCase","makeAutoObservable","computed","config","allModels","runInAction","m","values","entries","existingIds","Set","e","newEntries","patch","entryId","nextPage","start","page","chunk","result","v","entryMap","Map","entry","existing","resolved","RefDetailedPresenter","Abstraction","GetContentEntriesUseCase","ListModelsUseCase"],"mappings":"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"}

package/presentation/fieldRenderers/ref/detailed/abstractions.d.ts

@@ -0,0 +1,28 @@
+import type { CmsModel } from "../../../../types.js";
+import type { CmsReferenceEntry, CmsReferenceEntryPatch, CmsReferenceValue } from "../../../../features/contentEntry/refTypes.js";
+export interface IRefDetailedPresenterInitConfig {
+    modelIds: string[];
+    multiSelect: boolean;
+}
+export interface IRefDetailedViewModel {
+    loading: boolean;
+    entries: CmsReferenceEntry[];
+    models: CmsModel[];
+    multiSelect: boolean;
+}
+export interface IRefDetailedPresenter {
+    readonly vm: IRefDetailedViewModel;
+    init(config: IRefDetailedPresenterInitConfig): Promise<void>;
+    resolveValues(values: CmsReferenceValue[]): Promise<void>;
+    addEntries(entries: CmsReferenceEntry[]): void;
+    patchEntry(patch: CmsReferenceEntryPatch): void;
+    removeEntry(entryId: string): void;
+    loadMore(): void;
+    dispose(): void;
+}
+export declare const RefDetailedPresenter: import("@webiny/di").Abstraction<IRefDetailedPresenter>;
+export declare namespace RefDetailedPresenter {
+    type Interface = IRefDetailedPresenter;
+    type InitConfig = IRefDetailedPresenterInitConfig;
+    type ViewModel = IRefDetailedViewModel;
+}

package/presentation/fieldRenderers/ref/detailed/abstractions.js

@@ -0,0 +1,5 @@
+import { createAbstraction } from "@webiny/feature/admin";
+const RefDetailedPresenter = createAbstraction("RefDetailedPresenter");
+export { RefDetailedPresenter };
+
+//# sourceMappingURL=abstractions.js.map

package/presentation/fieldRenderers/ref/detailed/abstractions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/fieldRenderers/ref/detailed/abstractions.js","sources":["../../../../../src/presentation/fieldRenderers/ref/detailed/abstractions.ts"],"sourcesContent":["import { createAbstraction } from \"@webiny/feature/admin\";\nimport type { CmsModel } from \"~/types.js\";\nimport type {\n    CmsReferenceEntry,\n    CmsReferenceEntryPatch,\n    CmsReferenceValue\n} from \"~/features/contentEntry/refTypes.js\";\n\nexport interface IRefDetailedPresenterInitConfig {\n    modelIds: string[];\n    multiSelect: boolean;\n}\n\nexport interface IRefDetailedViewModel {\n    loading: boolean;\n    entries: CmsReferenceEntry[];\n    models: CmsModel[];\n    multiSelect: boolean;\n}\n\nexport interface IRefDetailedPresenter {\n    readonly vm: IRefDetailedViewModel;\n    init(config: IRefDetailedPresenterInitConfig): Promise<void>;\n    resolveValues(values: CmsReferenceValue[]): Promise<void>;\n    addEntries(entries: CmsReferenceEntry[]): void;\n    patchEntry(patch: CmsReferenceEntryPatch): void;\n    removeEntry(entryId: string): void;\n    loadMore(): void;\n    dispose(): void;\n}\n\nexport const RefDetailedPresenter =\n    createAbstraction<IRefDetailedPresenter>(\"RefDetailedPresenter\");\n\nexport namespace RefDetailedPresenter {\n    export type Interface = IRefDetailedPresenter;\n    export type InitConfig = IRefDetailedPresenterInitConfig;\n    export type ViewModel = IRefDetailedViewModel;\n}\n"],"names":["RefDetailedPresenter","createAbstraction"],"mappings":";AA+BO,MAAMA,uBACTC,kBAAyC"}

package/presentation/fieldRenderers/ref/detailed/feature.d.ts

@@ -0,0 +1,3 @@
+export declare const RefDetailedPresenterFeature: import("@webiny/feature/admin").FeatureDefinition<{
+    presenter: import("./abstractions.js").IRefDetailedPresenter;
+}, []>;

package/presentation/fieldRenderers/ref/detailed/feature.js

@@ -0,0 +1,17 @@
+import { createFeature } from "@webiny/feature/admin";
+import { RefDetailedPresenter } from "./abstractions.js";
+import { RefDetailedPresenter as external_RefDetailedPresenter_js_RefDetailedPresenter } from "./RefDetailedPresenter.js";
+const RefDetailedPresenterFeature = createFeature({
+    name: "CmsRefField/DetailedPresenter",
+    register (container) {
+        container.register(external_RefDetailedPresenter_js_RefDetailedPresenter).inSingletonScope();
+    },
+    resolve (container) {
+        return {
+            presenter: container.resolve(RefDetailedPresenter)
+        };
+    }
+});
+export { RefDetailedPresenterFeature };
+
+//# sourceMappingURL=feature.js.map

package/presentation/fieldRenderers/ref/detailed/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presentation/fieldRenderers/ref/detailed/feature.js","sources":["../../../../../src/presentation/fieldRenderers/ref/detailed/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { RefDetailedPresenter as Abstraction } from \"./abstractions.js\";\nimport { RefDetailedPresenter } from \"./RefDetailedPresenter.js\";\n\nexport const RefDetailedPresenterFeature = createFeature({\n    name: \"CmsRefField/DetailedPresenter\",\n    register(container) {\n        container.register(RefDetailedPresenter).inSingletonScope();\n    },\n    resolve(container) {\n        return {\n            presenter: container.resolve(Abstraction)\n        };\n    }\n});\n"],"names":["RefDetailedPresenterFeature","createFeature","container","RefDetailedPresenter","Abstraction"],"mappings":";;;AAIO,MAAMA,8BAA8BC,cAAc;IACrD,MAAM;IACN,UAASC,SAAS;QACdA,UAAU,QAAQ,CAACC,uDAAsB,gBAAgB;IAC7D;IACA,SAAQD,SAAS;QACb,OAAO;YACH,WAAWA,UAAU,OAAO,CAACE;QACjC;IACJ;AACJ"}