@webiny/app-headless-cms 0.0.0-unstable.40876133bb → 0.0.0-unstable.496cf268ac

package/admin/plugins/fieldRenderers/object/multipleObjectsAccordion.js.map

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","Actions","setHighlightIndex","bind","index","field","moveValueDown","moveValueUp","onDown","useCallback","e","stopPropagation","map","generateAlphaNumericLowerCaseId","onUp","removeValue","ObjectsRenderer","props","useState","highlightMap","contentModel","label","helpText","dynamicSectionGridStyle","Bind","fieldsWrapperStyle","settings","fields","layout","fieldsGridStyle","plugin","type","name","renderer","rendererName","description","canUse","Boolean","multipleValues","render"],"sources":["multipleObjectsAccordion.tsx"],"sourcesContent":["import React, { Dispatch, SetStateAction, useState, useCallback } from \"react\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { Cell } from \"@webiny/ui/Grid\";\nimport { Accordion as RootAccordion, AccordionItem } from \"@webiny/ui/Accordion\";\nimport {\n    BindComponentRenderProp,\n    CmsEditorFieldRendererPlugin,\n    CmsEditorFieldRendererProps\n} from \"~/types\";\nimport DynamicSection from \"../DynamicSection\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport { ReactComponent as DeleteIcon } from \"~/admin/icons/close.svg\";\nimport { ReactComponent as ArrowUp } from \"./arrow_drop_up.svg\";\nimport { ReactComponent as ArrowDown } from \"./arrow_drop_down.svg\";\nimport Accordion from \"~/admin/plugins/fieldRenderers/Accordion\";\nimport {\n    fieldsWrapperStyle,\n    dynamicSectionGridStyle,\n    fieldsGridStyle,\n    ItemHighLight,\n    ObjectItem\n} from \"./StyledComponents\";\nimport { generateAlphaNumericLowerCaseId } from \"@webiny/utils\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\ninterface ActionsProps {\n    setHighlightIndex: Dispatch<SetStateAction<{ [key: number]: string }>>;\n    index: number;\n    bind: {\n        index: BindComponentRenderProp;\n        field: BindComponentRenderProp;\n    };\n}\n\nconst Actions: React.FC<ActionsProps> = ({ setHighlightIndex, bind, index }) => {\n    const { moveValueDown, moveValueUp } = bind.field;\n\n    const onDown = useCallback(\n        e => {\n            e.stopPropagation();\n            moveValueDown(index);\n            setHighlightIndex(map => ({\n                ...map,\n                [index + 1]: generateAlphaNumericLowerCaseId(12)\n            }));\n        },\n        [moveValueDown, index]\n    );\n\n    const onUp = useCallback(\n        e => {\n            e.stopPropagation();\n            moveValueUp(index);\n            setHighlightIndex(map => ({\n                ...map,\n                [index - 1]: generateAlphaNumericLowerCaseId(12)\n            }));\n        },\n        [moveValueUp, index]\n    );\n\n    return index > 0 ? (\n        <>\n            <IconButton icon={<ArrowDown />} onClick={onDown} />\n            <IconButton icon={<ArrowUp />} onClick={onUp} />\n            <IconButton icon={<DeleteIcon />} onClick={() => bind.field.removeValue(index)} />\n        </>\n    ) : null;\n};\n\nconst ObjectsRenderer: React.FC<CmsEditorFieldRendererProps> = props => {\n    const [highlightMap, setHighlightIndex] = useState<{ [key: number]: string }>({});\n    const { field, contentModel } = props;\n\n    return (\n        <RootAccordion>\n            <AccordionItem title={field.label} description={field.helpText}>\n                <DynamicSection\n                    {...props}\n                    emptyValue={{}}\n                    showLabel={false}\n                    gridClassName={dynamicSectionGridStyle}\n                >\n                    {({ Bind, bind, index }) => (\n                        <ObjectItem>\n                            {highlightMap[index] ? (\n                                <ItemHighLight key={highlightMap[index]} />\n                            ) : null}\n                            <Accordion\n                                title={`${props.field.label} #${index + 1}`}\n                                action={\n                                    <Actions\n                                        setHighlightIndex={setHighlightIndex}\n                                        index={index}\n                                        bind={bind}\n                                    />\n                                }\n                                // Open first Accordion by default\n                                defaultValue={index === 0}\n                            >\n                                <Cell span={12} className={fieldsWrapperStyle}>\n                                    <Fields\n                                        Bind={Bind}\n                                        {...bind.index}\n                                        contentModel={contentModel}\n                                        fields={(field.settings || {}).fields || []}\n                                        layout={(field.settings || {}).layout || []}\n                                        gridClassName={fieldsGridStyle}\n                                    />\n                                </Cell>\n                            </Accordion>\n                        </ObjectItem>\n                    )}\n                </DynamicSection>\n            </AccordionItem>\n        </RootAccordion>\n    );\n};\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-objects-accordion\",\n    renderer: {\n        rendererName: \"objects-accordion\",\n        name: t`Accordion`,\n        description: t`Renders fields within an accordion.`,\n        canUse({ field }) {\n            return field.type === \"object\" && Boolean(field.multipleValues);\n        },\n        render(props) {\n            return <ObjectsRenderer {...props} />;\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"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"}
+{"version":3,"names":["t","i18n","ns","Actions","setHighlightIndex","bind","index","field","moveValueDown","moveValueUp","onDown","useCallback","e","stopPropagation","map","generateAlphaNumericLowerCaseId","onUp","removeValue","ObjectsRenderer","props","useState","highlightMap","contentModel","label","helpText","dynamicSectionGridStyle","Bind","fieldsWrapperStyle","settings","fields","layout","fieldsGridStyle","plugin","type","name","renderer","rendererName","description","canUse","Boolean","multipleValues","render"],"sources":["multipleObjectsAccordion.tsx"],"sourcesContent":["import React, { Dispatch, SetStateAction, useState, useCallback } from \"react\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { IconButton } from \"@webiny/ui/Button\";\nimport { Cell } from \"@webiny/ui/Grid\";\nimport { Accordion as RootAccordion, AccordionItem } from \"@webiny/ui/Accordion\";\nimport {\n    BindComponentRenderProp,\n    CmsEditorFieldRendererPlugin,\n    CmsEditorFieldRendererProps\n} from \"~/types\";\nimport DynamicSection from \"../DynamicSection\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport { ReactComponent as DeleteIcon } from \"~/admin/icons/close.svg\";\nimport { ReactComponent as ArrowUp } from \"./arrow_drop_up.svg\";\nimport { ReactComponent as ArrowDown } from \"./arrow_drop_down.svg\";\nimport Accordion from \"~/admin/plugins/fieldRenderers/Accordion\";\nimport {\n    fieldsWrapperStyle,\n    dynamicSectionGridStyle,\n    fieldsGridStyle,\n    ItemHighLight,\n    ObjectItem\n} from \"./StyledComponents\";\nimport { generateAlphaNumericLowerCaseId } from \"@webiny/utils\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\ninterface ActionsProps {\n    setHighlightIndex: Dispatch<SetStateAction<{ [key: number]: string }>>;\n    index: number;\n    bind: {\n        index: BindComponentRenderProp;\n        field: BindComponentRenderProp;\n    };\n}\n\nconst Actions: React.FC<ActionsProps> = ({ setHighlightIndex, bind, index }) => {\n    const { moveValueDown, moveValueUp } = bind.field;\n\n    const onDown = useCallback(\n        e => {\n            e.stopPropagation();\n            moveValueDown(index);\n            setHighlightIndex(map => ({\n                ...map,\n                [index + 1]: generateAlphaNumericLowerCaseId(12)\n            }));\n        },\n        [moveValueDown, index]\n    );\n\n    const onUp = useCallback(\n        e => {\n            e.stopPropagation();\n            moveValueUp(index);\n            setHighlightIndex(map => ({\n                ...map,\n                [index - 1]: generateAlphaNumericLowerCaseId(12)\n            }));\n        },\n        [moveValueUp, index]\n    );\n\n    return index > 0 ? (\n        <>\n            <IconButton icon={<ArrowDown />} onClick={onDown} />\n            <IconButton icon={<ArrowUp />} onClick={onUp} />\n            <IconButton icon={<DeleteIcon />} onClick={() => bind.field.removeValue(index)} />\n        </>\n    ) : null;\n};\n\nconst ObjectsRenderer: React.FC<CmsEditorFieldRendererProps> = props => {\n    const [highlightMap, setHighlightIndex] = useState<{ [key: number]: string }>({});\n    const { field, contentModel } = props;\n\n    return (\n        <RootAccordion>\n            <AccordionItem title={field.label} description={field.helpText}>\n                <DynamicSection\n                    {...props}\n                    emptyValue={{}}\n                    showLabel={false}\n                    gridClassName={dynamicSectionGridStyle}\n                >\n                    {({ Bind, bind, index }) => (\n                        <ObjectItem>\n                            {highlightMap[index] ? (\n                                <ItemHighLight key={highlightMap[index]} />\n                            ) : null}\n                            <Accordion\n                                title={`${props.field.label} #${index + 1}`}\n                                action={\n                                    <Actions\n                                        setHighlightIndex={setHighlightIndex}\n                                        index={index}\n                                        bind={bind}\n                                    />\n                                }\n                                // Open first Accordion by default\n                                defaultValue={index === 0}\n                            >\n                                <Cell span={12} className={fieldsWrapperStyle}>\n                                    <Fields\n                                        Bind={Bind}\n                                        {...bind.index}\n                                        contentModel={contentModel}\n                                        fields={(field.settings || {}).fields || []}\n                                        layout={(field.settings || {}).layout || []}\n                                        gridClassName={fieldsGridStyle}\n                                    />\n                                </Cell>\n                            </Accordion>\n                        </ObjectItem>\n                    )}\n                </DynamicSection>\n            </AccordionItem>\n        </RootAccordion>\n    );\n};\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-objects-accordion\",\n    renderer: {\n        rendererName: \"objects-accordion\",\n        name: t`Accordion`,\n        description: t`Renders fields within an accordion.`,\n        canUse({ field }) {\n            return field.type === \"object\" && Boolean(field.multipleValues);\n        },\n        render(props) {\n            return <ObjectsRenderer {...props} />;\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"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"}

package/admin/plugins/fieldRenderers/object/singleObjectAccordion.js

@@ -1,26 +1,17 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _i18n = require("@webiny/app/i18n");
-
 var _Fields = require("../../../components/ContentEntryForm/Fields");
-
 var _Accordion = require("@webiny/ui/Accordion");
-
 var _templateObject, _templateObject2;
-
 var t = _i18n.i18n.ns("app-headless-cms/admin/fields/text");
-
 var plugin = {
   type: "cms-editor-field-renderer",
   name: "cms-editor-field-renderer-object-accordion",
@@ -34,8 +25,8 @@ var plugin = {
     },
     render: function render(_ref2) {
       var field = _ref2.field,
-          getBind = _ref2.getBind,
-          contentModel = _ref2.contentModel;
+        getBind = _ref2.getBind,
+        contentModel = _ref2.contentModel;
       var Bind = getBind();
       var settings = field.settings || {};
       return /*#__PURE__*/_react.default.createElement(_Accordion.Accordion, null, /*#__PURE__*/_react.default.createElement(_Accordion.AccordionItem, {

package/admin/plugins/fieldRenderers/object/singleObjectAccordion.js.map

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","render","getBind","contentModel","Bind","settings","label","helpText","fields","layout"],"sources":["singleObjectAccordion.tsx"],"sourcesContent":["import React from \"react\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport { Accordion, AccordionItem } from \"@webiny/ui/Accordion\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-object-accordion\",\n    renderer: {\n        rendererName: \"object-accordion\",\n        name: t`Accordion`,\n        description: t`Renders fields within an accordion.`,\n        canUse({ field }) {\n            return field.type === \"object\" && !field.multipleValues;\n        },\n        render({ field, getBind, contentModel }) {\n            const Bind = getBind();\n\n            const settings = field.settings || {};\n\n            return (\n                <Accordion>\n                    <AccordionItem title={field.label} description={field.helpText}>\n                        <Fields\n                            Bind={Bind}\n                            contentModel={contentModel}\n                            fields={settings.fields || []}\n                            layout={settings.layout || []}\n                        />\n                    </AccordionItem>\n                </Accordion>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;AAEA,IAAMA,CAAC,GAAGC,UAAA,CAAKC,EAAL,CAAQ,oCAAR,CAAV;;AAEA,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BADmC;EAEzCC,IAAI,EAAE,4CAFmC;EAGzCC,QAAQ,EAAE;IACNC,YAAY,EAAE,kBADR;IAENF,IAAI,EAAEL,CAAF,4FAFE;IAGNQ,WAAW,EAAER,CAAF,wHAHL;IAINS,MAJM,wBAIY;MAAA,IAATC,KAAS,QAATA,KAAS;MACd,OAAOA,KAAK,CAACN,IAAN,KAAe,QAAf,IAA2B,CAACM,KAAK,CAACC,cAAzC;IACH,CANK;IAONC,MAPM,yBAOmC;MAAA,IAAhCF,KAAgC,SAAhCA,KAAgC;MAAA,IAAzBG,OAAyB,SAAzBA,OAAyB;MAAA,IAAhBC,YAAgB,SAAhBA,YAAgB;MACrC,IAAMC,IAAI,GAAGF,OAAO,EAApB;MAEA,IAAMG,QAAQ,GAAGN,KAAK,CAACM,QAAN,IAAkB,EAAnC;MAEA,oBACI,6BAAC,oBAAD,qBACI,6BAAC,wBAAD;QAAe,KAAK,EAAEN,KAAK,CAACO,KAA5B;QAAmC,WAAW,EAAEP,KAAK,CAACQ;MAAtD,gBACI,6BAAC,cAAD;QACI,IAAI,EAAEH,IADV;QAEI,YAAY,EAAED,YAFlB;QAGI,MAAM,EAAEE,QAAQ,CAACG,MAAT,IAAmB,EAH/B;QAII,MAAM,EAAEH,QAAQ,CAACI,MAAT,IAAmB;MAJ/B,EADJ,CADJ,CADJ;IAYH;EAxBK;AAH+B,CAA7C;eA+BejB,M"}
+{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","render","getBind","contentModel","Bind","settings","label","helpText","fields","layout"],"sources":["singleObjectAccordion.tsx"],"sourcesContent":["import React from \"react\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport { Accordion, AccordionItem } from \"@webiny/ui/Accordion\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-object-accordion\",\n    renderer: {\n        rendererName: \"object-accordion\",\n        name: t`Accordion`,\n        description: t`Renders fields within an accordion.`,\n        canUse({ field }) {\n            return field.type === \"object\" && !field.multipleValues;\n        },\n        render({ field, getBind, contentModel }) {\n            const Bind = getBind();\n\n            const settings = field.settings || {};\n\n            return (\n                <Accordion>\n                    <AccordionItem title={field.label} description={field.helpText}>\n                        <Fields\n                            Bind={Bind}\n                            contentModel={contentModel}\n                            fields={settings.fields || []}\n                            layout={settings.layout || []}\n                        />\n                    </AccordionItem>\n                </Accordion>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AACA;AAEA;AACA;AAAgE;AAEhE,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,oCAAoC,CAAC;AAEvD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,4CAA4C;EAClDC,QAAQ,EAAE;IACNC,YAAY,EAAE,kBAAkB;IAChCF,IAAI,EAAEL,CAAC,4FAAW;IAClBQ,WAAW,EAAER,CAAC,wHAAqC;IACnDS,MAAM,wBAAY;MAAA,IAATC,KAAK,QAALA,KAAK;MACV,OAAOA,KAAK,CAACN,IAAI,KAAK,QAAQ,IAAI,CAACM,KAAK,CAACC,cAAc;IAC3D,CAAC;IACDC,MAAM,yBAAmC;MAAA,IAAhCF,KAAK,SAALA,KAAK;QAAEG,OAAO,SAAPA,OAAO;QAAEC,YAAY,SAAZA,YAAY;MACjC,IAAMC,IAAI,GAAGF,OAAO,EAAE;MAEtB,IAAMG,QAAQ,GAAGN,KAAK,CAACM,QAAQ,IAAI,CAAC,CAAC;MAErC,oBACI,6BAAC,oBAAS,qBACN,6BAAC,wBAAa;QAAC,KAAK,EAAEN,KAAK,CAACO,KAAM;QAAC,WAAW,EAAEP,KAAK,CAACQ;MAAS,gBAC3D,6BAAC,cAAM;QACH,IAAI,EAAEH,IAAK;QACX,YAAY,EAAED,YAAa;QAC3B,MAAM,EAAEE,QAAQ,CAACG,MAAM,IAAI,EAAG;QAC9B,MAAM,EAAEH,QAAQ,CAACI,MAAM,IAAI;MAAG,EAChC,CACU,CACR;IAEpB;EACJ;AACJ,CAAC;AAAC,eAEajB,MAAM;AAAA"}

package/admin/plugins/fieldRenderers/object/singleObjectInline.js

@@ -1,32 +1,20 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _i18n = require("@webiny/app/i18n");
-
 var _Fields = require("../../../components/ContentEntryForm/Fields");
-
 var _SimpleForm = require("@webiny/app-admin/components/SimpleForm");
-
 var _Grid = require("@webiny/ui/Grid");
-
 var _FormElementMessage = require("@webiny/ui/FormElementMessage");
-
 var _StyledComponents = require("./StyledComponents");
-
 var _templateObject, _templateObject2;
-
 var t = _i18n.i18n.ns("app-headless-cms/admin/fields/text");
-
 var plugin = {
   type: "cms-editor-field-renderer",
   name: "cms-editor-field-renderer-object",
@@ -40,8 +28,8 @@ var plugin = {
     },
     render: function render(_ref2) {
       var field = _ref2.field,
-          getBind = _ref2.getBind,
-          contentModel = _ref2.contentModel;
+        getBind = _ref2.getBind,
+        contentModel = _ref2.contentModel;
       var Bind = getBind();
       var settings = field.settings || {};
       return /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {

package/admin/plugins/fieldRenderers/object/singleObjectInline.js.map

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","render","getBind","contentModel","Bind","settings","label","helpText","fieldsWrapperStyle","fields","layout"],"sources":["singleObjectInline.tsx"],"sourcesContent":["import React from \"react\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport { SimpleFormHeader } from \"@webiny/app-admin/components/SimpleForm\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { FormElementMessage } from \"@webiny/ui/FormElementMessage\";\nimport { fieldsWrapperStyle } from \"./StyledComponents\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-object\",\n    renderer: {\n        rendererName: \"object\",\n        name: t`Inline Form`,\n        description: t`Renders a set of fields.`,\n        canUse({ field }) {\n            return field.type === \"object\" && !field.multipleValues;\n        },\n        render({ field, getBind, contentModel }) {\n            const Bind = getBind();\n\n            const settings = field.settings || {};\n\n            return (\n                <Grid>\n                    <Cell span={12}>\n                        <SimpleFormHeader title={field.label} />\n                        {field.helpText && (\n                            <FormElementMessage>{field.helpText}</FormElementMessage>\n                        )}\n                    </Cell>\n                    <Cell span={12} className={fieldsWrapperStyle}>\n                        <Fields\n                            Bind={Bind}\n                            contentModel={contentModel}\n                            fields={settings.fields || []}\n                            layout={settings.layout || []}\n                        />\n                    </Cell>\n                </Grid>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;AAEA,IAAMA,CAAC,GAAGC,UAAA,CAAKC,EAAL,CAAQ,oCAAR,CAAV;;AAEA,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BADmC;EAEzCC,IAAI,EAAE,kCAFmC;EAGzCC,QAAQ,EAAE;IACNC,YAAY,EAAE,QADR;IAENF,IAAI,EAAEL,CAAF,8FAFE;IAGNQ,WAAW,EAAER,CAAF,6GAHL;IAINS,MAJM,wBAIY;MAAA,IAATC,KAAS,QAATA,KAAS;MACd,OAAOA,KAAK,CAACN,IAAN,KAAe,QAAf,IAA2B,CAACM,KAAK,CAACC,cAAzC;IACH,CANK;IAONC,MAPM,yBAOmC;MAAA,IAAhCF,KAAgC,SAAhCA,KAAgC;MAAA,IAAzBG,OAAyB,SAAzBA,OAAyB;MAAA,IAAhBC,YAAgB,SAAhBA,YAAgB;MACrC,IAAMC,IAAI,GAAGF,OAAO,EAApB;MAEA,IAAMG,QAAQ,GAAGN,KAAK,CAACM,QAAN,IAAkB,EAAnC;MAEA,oBACI,6BAAC,UAAD,qBACI,6BAAC,UAAD;QAAM,IAAI,EAAE;MAAZ,gBACI,6BAAC,4BAAD;QAAkB,KAAK,EAAEN,KAAK,CAACO;MAA/B,EADJ,EAEKP,KAAK,CAACQ,QAAN,iBACG,6BAAC,sCAAD,QAAqBR,KAAK,CAACQ,QAA3B,CAHR,CADJ,eAOI,6BAAC,UAAD;QAAM,IAAI,EAAE,EAAZ;QAAgB,SAAS,EAAEC;MAA3B,gBACI,6BAAC,cAAD;QACI,IAAI,EAAEJ,IADV;QAEI,YAAY,EAAED,YAFlB;QAGI,MAAM,EAAEE,QAAQ,CAACI,MAAT,IAAmB,EAH/B;QAII,MAAM,EAAEJ,QAAQ,CAACK,MAAT,IAAmB;MAJ/B,EADJ,CAPJ,CADJ;IAkBH;EA9BK;AAH+B,CAA7C;eAqCelB,M"}
+{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","render","getBind","contentModel","Bind","settings","label","helpText","fieldsWrapperStyle","fields","layout"],"sources":["singleObjectInline.tsx"],"sourcesContent":["import React from \"react\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { Fields } from \"~/admin/components/ContentEntryForm/Fields\";\nimport { SimpleFormHeader } from \"@webiny/app-admin/components/SimpleForm\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { FormElementMessage } from \"@webiny/ui/FormElementMessage\";\nimport { fieldsWrapperStyle } from \"./StyledComponents\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-object\",\n    renderer: {\n        rendererName: \"object\",\n        name: t`Inline Form`,\n        description: t`Renders a set of fields.`,\n        canUse({ field }) {\n            return field.type === \"object\" && !field.multipleValues;\n        },\n        render({ field, getBind, contentModel }) {\n            const Bind = getBind();\n\n            const settings = field.settings || {};\n\n            return (\n                <Grid>\n                    <Cell span={12}>\n                        <SimpleFormHeader title={field.label} />\n                        {field.helpText && (\n                            <FormElementMessage>{field.helpText}</FormElementMessage>\n                        )}\n                    </Cell>\n                    <Cell span={12} className={fieldsWrapperStyle}>\n                        <Fields\n                            Bind={Bind}\n                            contentModel={contentModel}\n                            fields={settings.fields || []}\n                            layout={settings.layout || []}\n                        />\n                    </Cell>\n                </Grid>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAwD;AAExD,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,oCAAoC,CAAC;AAEvD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,kCAAkC;EACxCC,QAAQ,EAAE;IACNC,YAAY,EAAE,QAAQ;IACtBF,IAAI,EAAEL,CAAC,8FAAa;IACpBQ,WAAW,EAAER,CAAC,6GAA0B;IACxCS,MAAM,wBAAY;MAAA,IAATC,KAAK,QAALA,KAAK;MACV,OAAOA,KAAK,CAACN,IAAI,KAAK,QAAQ,IAAI,CAACM,KAAK,CAACC,cAAc;IAC3D,CAAC;IACDC,MAAM,yBAAmC;MAAA,IAAhCF,KAAK,SAALA,KAAK;QAAEG,OAAO,SAAPA,OAAO;QAAEC,YAAY,SAAZA,YAAY;MACjC,IAAMC,IAAI,GAAGF,OAAO,EAAE;MAEtB,IAAMG,QAAQ,GAAGN,KAAK,CAACM,QAAQ,IAAI,CAAC,CAAC;MAErC,oBACI,6BAAC,UAAI,qBACD,6BAAC,UAAI;QAAC,IAAI,EAAE;MAAG,gBACX,6BAAC,4BAAgB;QAAC,KAAK,EAAEN,KAAK,CAACO;MAAM,EAAG,EACvCP,KAAK,CAACQ,QAAQ,iBACX,6BAAC,sCAAkB,QAAER,KAAK,CAACQ,QAAQ,CACtC,CACE,eACP,6BAAC,UAAI;QAAC,IAAI,EAAE,EAAG;QAAC,SAAS,EAAEC;MAAmB,gBAC1C,6BAAC,cAAM;QACH,IAAI,EAAEJ,IAAK;QACX,YAAY,EAAED,YAAa;QAC3B,MAAM,EAAEE,QAAQ,CAACI,MAAM,IAAI,EAAG;QAC9B,MAAM,EAAEJ,QAAQ,CAACK,MAAM,IAAI;MAAG,EAChC,CACC,CACJ;IAEf;EACJ;AACJ,CAAC;AAAC,eAEalB,MAAM;AAAA"}

package/admin/plugins/fieldRenderers/radioButtons.js

@@ -1,26 +1,17 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _get = _interopRequireDefault(require("lodash/get"));
-
 var _i18n = require("@webiny/app/i18n");
-
 var _Radio = require("@webiny/ui/Radio");
-
 var _templateObject, _templateObject2;
-
 var t = _i18n.i18n.ns("app-headless-cms/admin/fields/text");
-
 var plugin = {
   type: "cms-editor-field-renderer",
   name: "cms-editor-field-renderer-radio-buttons",
@@ -34,21 +25,19 @@ var plugin = {
     },
     render: function render(_ref2) {
       var field = _ref2.field,
-          getBind = _ref2.getBind;
+        getBind = _ref2.getBind;
       var Bind = getBind();
-
       var _ref3 = field.predefinedValues || {
-        options: []
-      },
-          _ref3$values = _ref3.values,
-          options = _ref3$values === void 0 ? [] : _ref3$values;
-
+          options: []
+        },
+        _ref3$values = _ref3.values,
+        options = _ref3$values === void 0 ? [] : _ref3$values;
       return /*#__PURE__*/_react.default.createElement(Bind, null, /*#__PURE__*/_react.default.createElement(_Radio.RadioGroup, {
         label: field.label,
         description: field.helpText
       }, function (_ref4) {
         var onChange = _ref4.onChange,
-            getValue = _ref4.getValue;
+          getValue = _ref4.getValue;
         return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, options.map(function (option, index) {
           var value = field.type === "number" ? Number(option.value) : option.value;
           return /*#__PURE__*/_react.default.createElement("div", {

package/admin/plugins/fieldRenderers/radioButtons.js.map

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","get","render","getBind","Bind","predefinedValues","options","values","label","helpText","onChange","getValue","map","option","index","value","Number","String"],"sources":["radioButtons.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Radio, RadioGroup } from \"@webiny/ui/Radio\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-radio-buttons\",\n    renderer: {\n        rendererName: \"radio-buttons\",\n        name: t`Radio Buttons`,\n        description: t`Renders radio buttons, allowing selection of a single value.`,\n        canUse({ field }) {\n            return !field.multipleValues && !!get(field, \"predefinedValues.enabled\");\n        },\n        render({ field, getBind }) {\n            const Bind = getBind();\n\n            const { values: options = [] } = field.predefinedValues || {\n                options: []\n            };\n\n            return (\n                <Bind>\n                    <RadioGroup label={field.label} description={field.helpText}>\n                        {({ onChange, getValue }) => (\n                            <React.Fragment>\n                                {options.map((option, index) => {\n                                    const value =\n                                        field.type === \"number\"\n                                            ? Number(option.value)\n                                            : option.value;\n                                    return (\n                                        <div key={String(option.value) + index}>\n                                            <Radio\n                                                label={option.label}\n                                                value={getValue(value)}\n                                                onChange={onChange(value)}\n                                                data-testid={`fr.input.${field.label}.${option.label}`}\n                                            />\n                                        </div>\n                                    );\n                                })}\n                            </React.Fragment>\n                        )}\n                    </RadioGroup>\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AAEA;;AACA;;;;AAEA,IAAMA,CAAC,GAAGC,UAAA,CAAKC,EAAL,CAAQ,oCAAR,CAAV;;AAEA,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BADmC;EAEzCC,IAAI,EAAE,yCAFmC;EAGzCC,QAAQ,EAAE;IACNC,YAAY,EAAE,eADR;IAENF,IAAI,EAAEL,CAAF,gGAFE;IAGNQ,WAAW,EAAER,CAAF,iJAHL;IAINS,MAJM,wBAIY;MAAA,IAATC,KAAS,QAATA,KAAS;MACd,OAAO,CAACA,KAAK,CAACC,cAAP,IAAyB,CAAC,CAAC,IAAAC,YAAA,EAAIF,KAAJ,EAAW,0BAAX,CAAlC;IACH,CANK;IAONG,MAPM,yBAOqB;MAAA,IAAlBH,KAAkB,SAAlBA,KAAkB;MAAA,IAAXI,OAAW,SAAXA,OAAW;MACvB,IAAMC,IAAI,GAAGD,OAAO,EAApB;;MAEA,YAAiCJ,KAAK,CAACM,gBAAN,IAA0B;QACvDC,OAAO,EAAE;MAD8C,CAA3D;MAAA,yBAAQC,MAAR;MAAA,IAAgBD,OAAhB,6BAA0B,EAA1B;;MAIA,oBACI,6BAAC,IAAD,qBACI,6BAAC,iBAAD;QAAY,KAAK,EAAEP,KAAK,CAACS,KAAzB;QAAgC,WAAW,EAAET,KAAK,CAACU;MAAnD,GACK;QAAA,IAAGC,QAAH,SAAGA,QAAH;QAAA,IAAaC,QAAb,SAAaA,QAAb;QAAA,oBACG,6BAAC,cAAD,CAAO,QAAP,QACKL,OAAO,CAACM,GAAR,CAAY,UAACC,MAAD,EAASC,KAAT,EAAmB;UAC5B,IAAMC,KAAK,GACPhB,KAAK,CAACN,IAAN,KAAe,QAAf,GACMuB,MAAM,CAACH,MAAM,CAACE,KAAR,CADZ,GAEMF,MAAM,CAACE,KAHjB;UAIA,oBACI;YAAK,GAAG,EAAEE,MAAM,CAACJ,MAAM,CAACE,KAAR,CAAN,GAAuBD;UAAjC,gBACI,6BAAC,YAAD;YACI,KAAK,EAAED,MAAM,CAACL,KADlB;YAEI,KAAK,EAAEG,QAAQ,CAACI,KAAD,CAFnB;YAGI,QAAQ,EAAEL,QAAQ,CAACK,KAAD,CAHtB;YAII,kCAAyBhB,KAAK,CAACS,KAA/B,cAAwCK,MAAM,CAACL,KAA/C;UAJJ,EADJ,CADJ;QAUH,CAfA,CADL,CADH;MAAA,CADL,CADJ,CADJ;IA0BH;EAxCK;AAH+B,CAA7C;eA+CehB,M"}
+{"version":3,"names":["t","i18n","ns","plugin","type","name","renderer","rendererName","description","canUse","field","multipleValues","get","render","getBind","Bind","predefinedValues","options","values","label","helpText","onChange","getValue","map","option","index","value","Number","String"],"sources":["radioButtons.tsx"],"sourcesContent":["import React from \"react\";\nimport get from \"lodash/get\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Radio, RadioGroup } from \"@webiny/ui/Radio\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields/text\");\n\nconst plugin: CmsEditorFieldRendererPlugin = {\n    type: \"cms-editor-field-renderer\",\n    name: \"cms-editor-field-renderer-radio-buttons\",\n    renderer: {\n        rendererName: \"radio-buttons\",\n        name: t`Radio Buttons`,\n        description: t`Renders radio buttons, allowing selection of a single value.`,\n        canUse({ field }) {\n            return !field.multipleValues && !!get(field, \"predefinedValues.enabled\");\n        },\n        render({ field, getBind }) {\n            const Bind = getBind();\n\n            const { values: options = [] } = field.predefinedValues || {\n                options: []\n            };\n\n            return (\n                <Bind>\n                    <RadioGroup label={field.label} description={field.helpText}>\n                        {({ onChange, getValue }) => (\n                            <React.Fragment>\n                                {options.map((option, index) => {\n                                    const value =\n                                        field.type === \"number\"\n                                            ? Number(option.value)\n                                            : option.value;\n                                    return (\n                                        <div key={String(option.value) + index}>\n                                            <Radio\n                                                label={option.label}\n                                                value={getValue(value)}\n                                                onChange={onChange(value)}\n                                                data-testid={`fr.input.${field.label}.${option.label}`}\n                                            />\n                                        </div>\n                                    );\n                                })}\n                            </React.Fragment>\n                        )}\n                    </RadioGroup>\n                </Bind>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AACA;AAEA;AACA;AAAqD;AAErD,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,oCAAoC,CAAC;AAEvD,IAAMC,MAAoC,GAAG;EACzCC,IAAI,EAAE,2BAA2B;EACjCC,IAAI,EAAE,yCAAyC;EAC/CC,QAAQ,EAAE;IACNC,YAAY,EAAE,eAAe;IAC7BF,IAAI,EAAEL,CAAC,gGAAe;IACtBQ,WAAW,EAAER,CAAC,iJAA8D;IAC5ES,MAAM,wBAAY;MAAA,IAATC,KAAK,QAALA,KAAK;MACV,OAAO,CAACA,KAAK,CAACC,cAAc,IAAI,CAAC,CAAC,IAAAC,YAAG,EAACF,KAAK,EAAE,0BAA0B,CAAC;IAC5E,CAAC;IACDG,MAAM,yBAAqB;MAAA,IAAlBH,KAAK,SAALA,KAAK;QAAEI,OAAO,SAAPA,OAAO;MACnB,IAAMC,IAAI,GAAGD,OAAO,EAAE;MAEtB,YAAiCJ,KAAK,CAACM,gBAAgB,IAAI;UACvDC,OAAO,EAAE;QACb,CAAC;QAAA,qBAFOC,MAAM;QAAED,OAAO,6BAAG,EAAE;MAI5B,oBACI,6BAAC,IAAI,qBACD,6BAAC,iBAAU;QAAC,KAAK,EAAEP,KAAK,CAACS,KAAM;QAAC,WAAW,EAAET,KAAK,CAACU;MAAS,GACvD;QAAA,IAAGC,QAAQ,SAARA,QAAQ;UAAEC,QAAQ,SAARA,QAAQ;QAAA,oBAClB,6BAAC,cAAK,CAAC,QAAQ,QACVL,OAAO,CAACM,GAAG,CAAC,UAACC,MAAM,EAAEC,KAAK,EAAK;UAC5B,IAAMC,KAAK,GACPhB,KAAK,CAACN,IAAI,KAAK,QAAQ,GACjBuB,MAAM,CAACH,MAAM,CAACE,KAAK,CAAC,GACpBF,MAAM,CAACE,KAAK;UACtB,oBACI;YAAK,GAAG,EAAEE,MAAM,CAACJ,MAAM,CAACE,KAAK,CAAC,GAAGD;UAAM,gBACnC,6BAAC,YAAK;YACF,KAAK,EAAED,MAAM,CAACL,KAAM;YACpB,KAAK,EAAEG,QAAQ,CAACI,KAAK,CAAE;YACvB,QAAQ,EAAEL,QAAQ,CAACK,KAAK,CAAE;YAC1B,kCAAyBhB,KAAK,CAACS,KAAK,cAAIK,MAAM,CAACL,KAAK;UAAG,EACzD,CACA;QAEd,CAAC,CAAC,CACW;MAAA,CACpB,CACQ,CACV;IAEf;EACJ;AACJ,CAAC;AAAC,eAEahB,MAAM;AAAA"}

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

@@ -0,0 +1,8 @@
+import React from "react";
+import { BindComponentRenderProp, CmsEditorFieldRendererProps } from "../../../../../../types";
+import { CmsReferenceValue } from "../../components/types";
+interface Props extends CmsEditorFieldRendererProps {
+    bind: BindComponentRenderProp<CmsReferenceValue[] | undefined | null>;
+}
+export declare const AdvancedMultipleReferenceField: React.VFC<Props>;
+export {};

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

@@ -0,0 +1,275 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.AdvancedMultipleReferenceField = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireWildcard(require("react"));
+var _styled = _interopRequireDefault(require("@emotion/styled"));
+var GQL = _interopRequireWildcard(require("../../../../../viewsGraphql"));
+var _Options = require("./Options");
+var _useReferences2 = require("../hooks/useReferences");
+var _Entry = require("./Entry");
+var _ReferencesDialog = require("./ReferencesDialog");
+var _hooks = require("../../../../../hooks");
+var _appAdmin = require("@webiny/app-admin");
+var _Loader = require("./Loader");
+var _NewReferencedEntryDialog = require("../components/NewReferencedEntryDialog");
+var _utils = require("@webiny/utils");
+var _Entries = require("./Entries");
+var FieldLabel = /*#__PURE__*/(0, _styled.default)("h3", {
+  target: "e11vg9uk0",
+  label: "FieldLabel"
+})({
+  fontSize: 24,
+  fontWeight: "normal",
+  borderBottom: "1px solid var(--mdc-theme-background)",
+  marginBottom: "20px",
+  paddingBottom: "5px",
+  display: "flex",
+  justifyContent: "space-between"
+});
+var OptionsContainer = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e11vg9uk1",
+  label: "OptionsContainer"
+})({
+  borderTop: "1px solid var(--mdc-theme-on-background)",
+  borderRight: "1px solid var(--mdc-theme-surface)",
+  backgroundColor: "var(--mdc-theme-surface)",
+  marginLeft: "-21px",
+  marginBottom: "-21px",
+  marginRight: "-1px"
+});
+var Container = /*#__PURE__*/(0, _styled.default)("div", {
+  target: "e11vg9uk2",
+  label: "Container"
+})({
+  border: "1px solid var(--mdc-theme-on-background)",
+  paddingLeft: "10px",
+  width: "100%",
+  boxSizing: "border-box",
+  position: "relative",
+  padding: "20px 0 20px 20px",
+  backgroundColor: "var(--mdc-theme-background)",
+  "&.no-entries": (0, _defineProperty2.default)({
+    backgroundColor: "var(--mdc-theme-surface)",
+    border: "none",
+    borderLeft: "3px solid var(--mdc-theme-background)",
+    padding: 0,
+    paddingLeft: 10
+  }, OptionsContainer, {
+    border: "none",
+    margin: 0
+  }),
+  "&.single-entry": {
+    height: 295,
+    ">div": {
+      height: 270
+    }
+  }
+});
+var FieldName = /*#__PURE__*/(0, _styled.default)("span", {
+  target: "e11vg9uk3",
+  label: "FieldName"
+})({});
+var RecordCount = /*#__PURE__*/(0, _styled.default)("span", {
+  target: "e11vg9uk4",
+  label: "RecordCount"
+})({
+  color: "var(--mdc-theme-text-secondary-on-background)",
+  fontSize: "0.6em",
+  lineHeight: "100%",
+  alignSelf: "center"
+});
+var getRecordCountMessage = function getRecordCountMessage(count) {
+  switch (count) {
+    case 0:
+      return "no records selected";
+    case 1:
+      return "1 record selected";
+    default:
+      return "".concat(count, " records selected");
+  }
+};
+var AdvancedMultipleReferenceField = function AdvancedMultipleReferenceField(props) {
+  var bind = props.bind,
+    field = props.field;
+  var _useSnackbar = (0, _appAdmin.useSnackbar)(),
+    showSnackbar = _useSnackbar.showSnackbar;
+  var values = (0, _react.useMemo)(function () {
+    return bind.value || [];
+  }, [bind.value]);
+  var _useState = (0, _react.useState)(null),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    linkEntryDialogModel = _useState2[0],
+    setLinkEntryDialogModel = _useState2[1];
+  var _useState3 = (0, _react.useState)(null),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    newEntryDialogModel = _useState4[0],
+    setNewEntryDialogModel = _useState4[1];
+  var _useState5 = (0, _react.useState)([]),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    loadedModels = _useState6[0],
+    setLoadedModels = _useState6[1];
+  var _useQuery = (0, _hooks.useQuery)(GQL.LIST_CONTENT_MODELS),
+    data = _useQuery.data,
+    loadingModels = _useQuery.loading;
+  (0, _react.useEffect)(function () {
+    var _data$listContentMode;
+    if (loadingModels || !(data !== null && data !== void 0 && (_data$listContentMode = data.listContentModels) !== null && _data$listContentMode !== void 0 && _data$listContentMode.data)) {
+      return;
+    } else if (data.listContentModels.error) {
+      setLoadedModels([]);
+      showSnackbar(data.listContentModels.error.message);
+      return;
+    }
+    setLoadedModels(data.listContentModels.data);
+  }, [data]);
+  var onNewRecord = (0, _react.useCallback)(function (modelId) {
+    var model = loadedModels.find(function (model) {
+      return model.modelId === modelId;
+    });
+    if (!model) {
+      console.log("Cannot find model by modelId \"".concat(modelId, "\"."));
+      return;
+    }
+    setNewEntryDialogModel(model);
+  }, [loadedModels, linkEntryDialogModel]);
+  var onNewEntryDialogClose = (0, _react.useCallback)(function () {
+    setNewEntryDialogModel(null);
+  }, [linkEntryDialogModel]);
+  var onExistingRecord = (0, _react.useCallback)(function (modelId) {
+    var model = loadedModels.find(function (model) {
+      return model.modelId === modelId;
+    });
+    if (!model) {
+      console.log("Cannot find model by modelId \"".concat(modelId, "\"."));
+      return;
+    }
+    setLinkEntryDialogModel(model);
+  }, [loadedModels, linkEntryDialogModel]);
+  var onLinkEntryDialogClose = (0, _react.useCallback)(function () {
+    setLinkEntryDialogModel(null);
+  }, []);
+  var _useReferences = (0, _useReferences2.useReferences)({
+      values: values,
+      perPage: 10
+    }),
+    entries = _useReferences.entries,
+    loadingEntries = _useReferences.loading,
+    loadMore = _useReferences.loadMore;
+  var onRemove = (0, _react.useCallback)(function (id) {
+    if (!values || !Array.isArray(values)) {
+      return;
+    }
+    var _parseIdentifier = (0, _utils.parseIdentifier)(id),
+      entryId = _parseIdentifier.id;
+    bind.onChange(values.filter(function (value) {
+      var _parseIdentifier2 = (0, _utils.parseIdentifier)(value.id),
+        valueEntryId = _parseIdentifier2.id;
+      return valueEntryId !== entryId;
+    }));
+  }, [entries, values]);
+  var models = (0, _react.useMemo)(function () {
+    var _field$settings;
+    if (!loadedModels || !((_field$settings = field.settings) !== null && _field$settings !== void 0 && _field$settings.models) || !Array.isArray(field.settings.models)) {
+      return [];
+    }
+    return field.settings.models.reduce(function (collection, ref) {
+      var model = loadedModels.find(function (model) {
+        return model.modelId === ref.modelId;
+      });
+      if (!model) {
+        return collection;
+      }
+      collection.push(model);
+      return collection;
+    }, []);
+  }, [loadedModels, entries]);
+  var storeValues = (0, _react.useCallback)(function (values) {
+    bind.onChange(values);
+    return;
+  }, [values]);
+  var onNewEntryCreate = (0, _react.useCallback)(function (data) {
+    if (!data) {
+      console.log("Could not store new entry to the reference field. Missing whole entry.");
+      return;
+    } else if (!data.id) {
+      console.log("Could not store new entry to the reference field. Missing \"id\" value.");
+      return;
+    } else if (!data.modelId) {
+      console.log("Could not store new entry to the reference field. Missing \"modelId\" value.");
+      return;
+    }
+    storeValues(values.concat([{
+      id: data.id,
+      modelId: data.modelId
+    }]));
+  }, [storeValues]);
+  var onMoveUp = (0, _react.useCallback)(function (index, toTop) {
+    if (values.length === 0) {
+      return;
+    } else if (toTop) {
+      var arr = values.splice(index, 1);
+      bind.onChange(arr.concat(values));
+      return;
+    }
+    bind.moveValueUp(index);
+  }, [values]);
+  var onMoveDown = (0, _react.useCallback)(function (index, toBottom) {
+    if (values.length === 0) {
+      return;
+    } else if (toBottom === true) {
+      var arr = values.splice(index, 1);
+      bind.onChange(values.concat(arr));
+      return;
+    }
+    bind.moveValueDown(index);
+  }, [values]);
+  var loading = loadingEntries || loadingModels;
+  var message = getRecordCountMessage(values.length);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(FieldLabel, null, /*#__PURE__*/_react.default.createElement(FieldName, null, field.label), /*#__PURE__*/_react.default.createElement(RecordCount, null, "(", message, ")")), /*#__PURE__*/_react.default.createElement(Container, {
+    className: (entries.length < 1 ? "no-entries" : "has-entries") + (entries.length == 1 ? " single-entry" : "")
+  }, loading && /*#__PURE__*/_react.default.createElement(_Loader.AbsoluteLoader, null), /*#__PURE__*/_react.default.createElement(_Entries.Entries, {
+    entries: entries,
+    loadMore: loadMore
+  }, function (entry, index) {
+    var isFirst = index === 0;
+    var isLast = index >= values.length - 1;
+    var model = loadedModels.find(function (model) {
+      return model.modelId === entry.model.modelId;
+    });
+    if (!model) {
+      return null;
+    }
+    return /*#__PURE__*/_react.default.createElement(_Entry.Entry, {
+      model: model,
+      placement: "multiRef",
+      key: "reference-entry-".concat(entry.id),
+      index: index,
+      entry: entry,
+      onRemove: onRemove,
+      onMoveUp: !isFirst ? onMoveUp : undefined,
+      onMoveDown: !isLast ? onMoveDown : undefined
+    });
+  }), /*#__PURE__*/_react.default.createElement(OptionsContainer, null, /*#__PURE__*/_react.default.createElement(_Options.Options, {
+    models: models,
+    onNewRecord: onNewRecord,
+    onLinkExistingRecord: onExistingRecord
+  }), newEntryDialogModel && /*#__PURE__*/_react.default.createElement(_NewReferencedEntryDialog.NewReferencedEntryDialog, {
+    model: newEntryDialogModel,
+    onClose: onNewEntryDialogClose,
+    onChange: onNewEntryCreate
+  }), linkEntryDialogModel && /*#__PURE__*/_react.default.createElement(_ReferencesDialog.ReferencesDialog, Object.assign({}, props, {
+    multiple: true,
+    values: values,
+    contentModel: linkEntryDialogModel,
+    storeValues: storeValues,
+    onDialogClose: onLinkEntryDialogClose
+  })))));
+};
+exports.AdvancedMultipleReferenceField = AdvancedMultipleReferenceField;

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

@@ -0,0 +1 @@
+{"version":3,"names":["FieldLabel","styled","fontSize","fontWeight","borderBottom","marginBottom","paddingBottom","display","justifyContent","OptionsContainer","borderTop","borderRight","backgroundColor","marginLeft","marginRight","Container","border","paddingLeft","width","boxSizing","position","padding","borderLeft","margin","height","FieldName","RecordCount","color","lineHeight","alignSelf","getRecordCountMessage","count","AdvancedMultipleReferenceField","props","bind","field","useSnackbar","showSnackbar","values","useMemo","value","useState","linkEntryDialogModel","setLinkEntryDialogModel","newEntryDialogModel","setNewEntryDialogModel","loadedModels","setLoadedModels","useQuery","GQL","LIST_CONTENT_MODELS","data","loadingModels","loading","useEffect","listContentModels","error","message","onNewRecord","useCallback","modelId","model","find","console","log","onNewEntryDialogClose","onExistingRecord","onLinkEntryDialogClose","useReferences","perPage","entries","loadingEntries","loadMore","onRemove","id","Array","isArray","parseIdentifier","entryId","onChange","filter","valueEntryId","models","settings","reduce","collection","ref","push","storeValues","onNewEntryCreate","concat","onMoveUp","index","toTop","length","arr","splice","moveValueUp","onMoveDown","toBottom","moveValueDown","label","entry","isFirst","isLast","undefined"],"sources":["AdvancedMultipleReferenceField.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport styled from \"@emotion/styled\";\nimport * as GQL from \"~/admin/viewsGraphql\";\nimport {\n    BindComponentRenderProp,\n    CmsEditorContentEntry,\n    CmsEditorFieldRendererProps,\n    CmsModel\n} from \"~/types\";\nimport { Options } from \"./Options\";\nimport { useReferences } from \"../hooks/useReferences\";\nimport { Entry } from \"./Entry\";\nimport { ReferencesDialog } from \"./ReferencesDialog\";\nimport { useQuery } from \"~/admin/hooks\";\nimport { ListCmsModelsQueryResponse } from \"~/admin/viewsGraphql\";\nimport { useSnackbar } from \"@webiny/app-admin\";\nimport { CmsReferenceValue } from \"~/admin/plugins/fieldRenderers/ref/components/types\";\nimport { AbsoluteLoader as Loader } from \"./Loader\";\nimport { NewReferencedEntryDialog } from \"../components/NewReferencedEntryDialog\";\nimport { parseIdentifier } from \"@webiny/utils\";\nimport { Entries } from \"./Entries\";\n\nconst FieldLabel = styled(\"h3\")({\n    fontSize: 24,\n    fontWeight: \"normal\",\n    borderBottom: \"1px solid var(--mdc-theme-background)\",\n    marginBottom: \"20px\",\n    paddingBottom: \"5px\",\n    display: \"flex\",\n    justifyContent: \"space-between\"\n});\n\nconst OptionsContainer: any = styled(\"div\")({\n    borderTop: \"1px solid var(--mdc-theme-on-background)\",\n    borderRight: \"1px solid var(--mdc-theme-surface)\",\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    marginLeft: \"-21px\",\n    marginBottom: \"-21px\",\n    marginRight: \"-1px\"\n});\n\nconst Container = styled(\"div\")({\n    border: \"1px solid var(--mdc-theme-on-background)\",\n    paddingLeft: \"10px\",\n    width: \"100%\",\n    boxSizing: \"border-box\",\n    position: \"relative\",\n    padding: \"20px 0 20px 20px\",\n    backgroundColor: \"var(--mdc-theme-background)\",\n    \"&.no-entries\": {\n        backgroundColor: \"var(--mdc-theme-surface)\",\n        border: \"none\",\n        borderLeft: \"3px solid var(--mdc-theme-background)\",\n        padding: 0,\n        paddingLeft: 10,\n        [OptionsContainer]: {\n            border: \"none\",\n            margin: 0\n        }\n    },\n    \"&.single-entry\": {\n        height: 295,\n        \">div\": {\n            height: 270\n        }\n    }\n});\n\nconst FieldName = styled(\"span\")({});\nconst RecordCount = styled(\"span\")({\n    color: \"var(--mdc-theme-text-secondary-on-background)\",\n    fontSize: \"0.6em\",\n    lineHeight: \"100%\",\n    alignSelf: \"center\"\n});\n\nconst getRecordCountMessage = (count: number) => {\n    switch (count) {\n        case 0:\n            return \"no records selected\";\n        case 1:\n            return \"1 record selected\";\n        default:\n            return `${count} records selected`;\n    }\n};\n\ninterface Props extends CmsEditorFieldRendererProps {\n    bind: BindComponentRenderProp<CmsReferenceValue[] | undefined | null>;\n}\n\nexport const AdvancedMultipleReferenceField: React.VFC<Props> = props => {\n    const { bind, field } = props;\n    const { showSnackbar } = useSnackbar();\n\n    const values = useMemo(() => {\n        return bind.value || [];\n    }, [bind.value]);\n\n    const [linkEntryDialogModel, setLinkEntryDialogModel] = useState<CmsModel | null>(null);\n    const [newEntryDialogModel, setNewEntryDialogModel] = useState<CmsModel | null>(null);\n\n    const [loadedModels, setLoadedModels] = useState<CmsModel[]>([]);\n\n    const { data, loading: loadingModels } = useQuery<ListCmsModelsQueryResponse>(\n        GQL.LIST_CONTENT_MODELS\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 {\n        entries,\n        loading: loadingEntries,\n        loadMore\n    } = useReferences({\n        values,\n        perPage: 10\n    });\n\n    const onRemove = useCallback(\n        (id: string) => {\n            if (!values || !Array.isArray(values)) {\n                return;\n            }\n            const { id: entryId } = parseIdentifier(id);\n            bind.onChange(\n                values.filter(value => {\n                    const { id: valueEntryId } = parseIdentifier(value.id);\n                    return valueEntryId !== entryId;\n                })\n            );\n        },\n        [entries, values]\n    );\n\n    const models = useMemo(() => {\n        if (!loadedModels || !field.settings?.models || !Array.isArray(field.settings.models)) {\n            return [];\n        }\n\n        return field.settings.models.reduce<CmsModel[]>((collection, ref) => {\n            const model = loadedModels.find(model => model.modelId === ref.modelId);\n            if (!model) {\n                return collection;\n            }\n            collection.push(model);\n\n            return collection;\n        }, []);\n    }, [loadedModels, entries]);\n\n    const storeValues = useCallback(\n        (values: CmsReferenceValue[]) => {\n            bind.onChange(values);\n            return;\n        },\n        [values]\n    );\n\n    const onNewEntryCreate = useCallback(\n        (data: Partial<CmsEditorContentEntry> | 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                values.concat([\n                    {\n                        id: data.id,\n                        modelId: data.modelId\n                    }\n                ])\n            );\n        },\n        [storeValues]\n    );\n\n    const onMoveUp = useCallback(\n        (index: number, toTop?: boolean) => {\n            if (values.length === 0) {\n                return;\n            } else if (toTop) {\n                const arr = values.splice(index, 1);\n                bind.onChange(arr.concat(values));\n                return;\n            }\n            bind.moveValueUp(index);\n        },\n        [values]\n    );\n    const onMoveDown = useCallback(\n        (index: number, toBottom?: boolean) => {\n            if (values.length === 0) {\n                return;\n            } else if (toBottom === true) {\n                const arr = values.splice(index, 1);\n                bind.onChange(values.concat(arr));\n                return;\n            }\n            bind.moveValueDown(index);\n        },\n        [values]\n    );\n\n    const loading = loadingEntries || loadingModels;\n\n    const message = getRecordCountMessage(values.length);\n\n    return (\n        <>\n            <FieldLabel>\n                <FieldName>{field.label}</FieldName>\n                <RecordCount>({message})</RecordCount>\n            </FieldLabel>\n            <Container\n                className={\n                    (entries.length < 1 ? \"no-entries\" : \"has-entries\") +\n                    (entries.length == 1 ? \" single-entry\" : \"\")\n                }\n            >\n                {loading && <Loader />}\n                <Entries entries={entries} loadMore={loadMore}>\n                    {(entry, index) => {\n                        const isFirst = index === 0;\n                        const isLast = index >= values.length - 1;\n                        const model = loadedModels.find(\n                            model => model.modelId === entry.model.modelId\n                        );\n                        if (!model) {\n                            return null;\n                        }\n                        return (\n                            <Entry\n                                model={model}\n                                placement=\"multiRef\"\n                                key={`reference-entry-${entry.id}`}\n                                index={index}\n                                entry={entry}\n                                onRemove={onRemove}\n                                onMoveUp={!isFirst ? onMoveUp : undefined}\n                                onMoveDown={!isLast ? onMoveDown : undefined}\n                            />\n                        );\n                    }}\n                </Entries>\n\n                <OptionsContainer>\n                    <Options\n                        models={models}\n                        onNewRecord={onNewRecord}\n                        onLinkExistingRecord={onExistingRecord}\n                    />\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={true}\n                            values={values}\n                            contentModel={linkEntryDialogModel}\n                            storeValues={storeValues}\n                            onDialogClose={onLinkEntryDialogClose}\n                        />\n                    )}\n                </OptionsContainer>\n            </Container>\n        </>\n    );\n};\n"],"mappings":"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"}

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

@@ -0,0 +1,8 @@
+import React from "react";
+import { BindComponentRenderProp, CmsEditorFieldRendererProps } from "../../../../../../types";
+import { CmsReferenceValue } from "../../components/types";
+interface Props extends CmsEditorFieldRendererProps {
+    bind: BindComponentRenderProp<CmsReferenceValue | null>;
+}
+export declare const AdvancedSingleReferenceField: React.VFC<Props>;
+export {};