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

package/admin/plugins/fields/object.js

@@ -1,31 +1,22 @@
-"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 _ballot = require("@material-design-icons/svg/outlined/ballot.svg");
-var _appHeadlessCmsCommon = require("@webiny/app-headless-cms-common");
-var _i18n = require("@webiny/app/i18n");
-var _ObjectFields = require("./object/ObjectFields");
-var _createTypeName = require("../../../utils/createTypeName");
-var _templateObject, _templateObject2, _templateObject3;
-var t = _i18n.i18n.ns("app-headless-cms/admin/fields");
-var plugin = {
+import React from "react";
+import { ReactComponent as ObjectIcon } from "@webiny/icons/ballot.svg";
+import { createFieldsList } from "@webiny/app-headless-cms-common";
+import { i18n } from "@webiny/app/i18n/index.js";
+import { ObjectFields } from "./object/ObjectFields.js";
+import { createTypeName } from "../../../utils/createTypeName.js";
+const t = i18n.ns("app-headless-cms/admin/fields");
+const plugin = {
   type: "cms-editor-field-type",
   name: "cms-editor-field-type-object",
   field: {
     type: "object",
-    label: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Object"]))),
-    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Store nested data structures."]))),
-    icon: /*#__PURE__*/_react.default.createElement(_ballot.ReactComponent, null),
-    allowMultipleValues: true,
+    label: t`Object`,
+    description: t`Store nested data structures.`,
+    icon: /*#__PURE__*/React.createElement(ObjectIcon, null),
+    allowList: true,
     allowPredefinedValues: false,
-    multipleValuesLabel: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Use as a repeatable object"]))),
-    createField: function createField() {
+    listLabel: t`Use as a repeatable object`,
+    createField() {
       return {
         type: this.type,
         validation: [],
@@ -38,25 +29,26 @@ var plugin = {
         }
       };
     },
-    render: function render(props) {
-      return /*#__PURE__*/_react.default.createElement(_ObjectFields.ObjectFields, props);
+    render(props) {
+      return /*#__PURE__*/React.createElement(ObjectFields, props);
     },
     graphql: {
-      queryField: function queryField(_ref) {
-        var field = _ref.field,
-          model = _ref.model,
-          graphQLTypePrefix = _ref.graphQLTypePrefix;
-        var typePrefix = "".concat(graphQLTypePrefix, "_").concat((0, _createTypeName.createTypeName)(field.fieldId));
-        var fields = field.settings ? field.settings.fields : [];
-        return "{ ".concat((0, _appHeadlessCmsCommon.createFieldsList)({
-          model: model,
-          fields: fields,
+      queryField({
+        field,
+        model,
+        graphQLTypePrefix
+      }) {
+        const typePrefix = `${graphQLTypePrefix}_${createTypeName(field.fieldId)}`;
+        const fields = field.settings ? field.settings.fields ?? [] : [];
+        return `{ ${createFieldsList({
+          model,
+          fields,
           graphQLTypePrefix: typePrefix
-        }), " }");
+        })} }`;
       }
     }
   }
 };
-var _default = exports.default = plugin;
+export default plugin;
 
 //# sourceMappingURL=object.js.map

package/admin/plugins/fields/object.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_ballot","_appHeadlessCmsCommon","_i18n","_ObjectFields","_createTypeName","_templateObject","_templateObject2","_templateObject3","t","i18n","ns","plugin","type","name","field","label","_taggedTemplateLiteral2","default","description","icon","createElement","ReactComponent","allowMultipleValues","allowPredefinedValues","multipleValuesLabel","createField","validation","settings","fields","layout","renderer","render","props","ObjectFields","graphql","queryField","_ref","model","graphQLTypePrefix","typePrefix","concat","createTypeName","fieldId","createFieldsList","_default","exports"],"sources":["object.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as ObjectIcon } from \"@material-design-icons/svg/outlined/ballot.svg\";\nimport { createFieldsList } from \"@webiny/app-headless-cms-common\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { ObjectFields } from \"./object/ObjectFields\";\nimport { CmsModelFieldTypePlugin, CmsModelField } from \"~/types\";\nimport { createTypeName } from \"~/utils/createTypeName\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields\");\n\nconst plugin: CmsModelFieldTypePlugin = {\n    type: \"cms-editor-field-type\",\n    name: \"cms-editor-field-type-object\",\n    field: {\n        type: \"object\",\n        label: t`Object`,\n        description: t`Store nested data structures.`,\n        icon: <ObjectIcon />,\n        allowMultipleValues: true,\n        allowPredefinedValues: false,\n        multipleValuesLabel: t`Use as a repeatable object`,\n        createField() {\n            return {\n                type: this.type,\n                validation: [],\n                settings: {\n                    fields: [],\n                    layout: []\n                },\n                renderer: {\n                    name: \"\"\n                }\n            };\n        },\n        render(props) {\n            return <ObjectFields {...props} />;\n        },\n        graphql: {\n            queryField({ field, model, graphQLTypePrefix }) {\n                const typePrefix = `${graphQLTypePrefix}_${createTypeName(field.fieldId)}`;\n                const fields = (field.settings ? field.settings.fields : []) as CmsModelField[];\n                return `{ ${createFieldsList({ model, fields, graphQLTypePrefix: typePrefix })} }`;\n            }\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,qBAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,aAAA,GAAAJ,OAAA;AAEA,IAAAK,eAAA,GAAAL,OAAA;AAAwD,IAAAM,eAAA,EAAAC,gBAAA,EAAAC,gBAAA;AAExD,IAAMC,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,+BAA+B,CAAC;AAElD,IAAMC,MAA+B,GAAG;EACpCC,IAAI,EAAE,uBAAuB;EAC7BC,IAAI,EAAE,8BAA8B;EACpCC,KAAK,EAAE;IACHF,IAAI,EAAE,QAAQ;IACdG,KAAK,EAAEP,CAAC,CAAAH,eAAA,KAAAA,eAAA,OAAAW,uBAAA,CAAAC,OAAA,eAAQ;IAChBC,WAAW,EAAEV,CAAC,CAAAF,gBAAA,KAAAA,gBAAA,OAAAU,uBAAA,CAAAC,OAAA,sCAA+B;IAC7CE,IAAI,eAAEtB,MAAA,CAAAoB,OAAA,CAAAG,aAAA,CAACpB,OAAA,CAAAqB,cAAU,MAAE,CAAC;IACpBC,mBAAmB,EAAE,IAAI;IACzBC,qBAAqB,EAAE,KAAK;IAC5BC,mBAAmB,EAAEhB,CAAC,CAAAD,gBAAA,KAAAA,gBAAA,OAAAS,uBAAA,CAAAC,OAAA,mCAA4B;IAClDQ,WAAW,WAAAA,YAAA,EAAG;MACV,OAAO;QACHb,IAAI,EAAE,IAAI,CAACA,IAAI;QACfc,UAAU,EAAE,EAAE;QACdC,QAAQ,EAAE;UACNC,MAAM,EAAE,EAAE;UACVC,MAAM,EAAE;QACZ,CAAC;QACDC,QAAQ,EAAE;UACNjB,IAAI,EAAE;QACV;MACJ,CAAC;IACL,CAAC;IACDkB,MAAM,WAAAA,OAACC,KAAK,EAAE;MACV,oBAAOnC,MAAA,CAAAoB,OAAA,CAAAG,aAAA,CAACjB,aAAA,CAAA8B,YAAY,EAAKD,KAAQ,CAAC;IACtC,CAAC;IACDE,OAAO,EAAE;MACLC,UAAU,WAAAA,WAAAC,IAAA,EAAsC;QAAA,IAAnCtB,KAAK,GAAAsB,IAAA,CAALtB,KAAK;UAAEuB,KAAK,GAAAD,IAAA,CAALC,KAAK;UAAEC,iBAAiB,GAAAF,IAAA,CAAjBE,iBAAiB;QACxC,IAAMC,UAAU,MAAAC,MAAA,CAAMF,iBAAiB,OAAAE,MAAA,CAAI,IAAAC,8BAAc,EAAC3B,KAAK,CAAC4B,OAAO,CAAC,CAAE;QAC1E,IAAMd,MAAM,GAAId,KAAK,CAACa,QAAQ,GAAGb,KAAK,CAACa,QAAQ,CAACC,MAAM,GAAG,EAAsB;QAC/E,YAAAY,MAAA,CAAY,IAAAG,sCAAgB,EAAC;UAAEN,KAAK,EAALA,KAAK;UAAET,MAAM,EAANA,MAAM;UAAEU,iBAAiB,EAAEC;QAAW,CAAC,CAAC;MAClF;IACJ;EACJ;AACJ,CAAC;AAAC,IAAAK,QAAA,GAAAC,OAAA,CAAA5B,OAAA,GAEaN,MAAM","ignoreList":[]}
+{"version":3,"names":["React","ReactComponent","ObjectIcon","createFieldsList","i18n","ObjectFields","createTypeName","t","ns","plugin","type","name","field","label","description","icon","createElement","allowList","allowPredefinedValues","listLabel","createField","validation","settings","fields","layout","renderer","render","props","graphql","queryField","model","graphQLTypePrefix","typePrefix","fieldId"],"sources":["object.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as ObjectIcon } from \"@webiny/icons/ballot.svg\";\nimport { createFieldsList } from \"@webiny/app-headless-cms-common\";\nimport { i18n } from \"@webiny/app/i18n/index.js\";\nimport { ObjectFields } from \"./object/ObjectFields.js\";\nimport type { CmsModelFieldTypePlugin, CmsModelField } from \"~/types.js\";\nimport { createTypeName } from \"~/utils/createTypeName.js\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields\");\n\nconst plugin: CmsModelFieldTypePlugin = {\n    type: \"cms-editor-field-type\",\n    name: \"cms-editor-field-type-object\",\n    field: {\n        type: \"object\",\n        label: t`Object`,\n        description: t`Store nested data structures.`,\n        icon: <ObjectIcon />,\n        allowList: true,\n        allowPredefinedValues: false,\n        listLabel: t`Use as a repeatable object`,\n        createField() {\n            return {\n                type: this.type,\n                validation: [],\n                settings: {\n                    fields: [],\n                    layout: []\n                },\n                renderer: {\n                    name: \"\"\n                }\n            };\n        },\n        render(props) {\n            return <ObjectFields {...props} />;\n        },\n        graphql: {\n            queryField({ field, model, graphQLTypePrefix }) {\n                const typePrefix = `${graphQLTypePrefix}_${createTypeName(field.fieldId)}`;\n                const fields = (\n                    field.settings ? (field.settings.fields ?? []) : []\n                ) as CmsModelField[];\n                return `{ ${createFieldsList({ model, fields, graphQLTypePrefix: typePrefix })} }`;\n            }\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,IAAIC,UAAU,QAAQ,0BAA0B;AACvE,SAASC,gBAAgB,QAAQ,iCAAiC;AAClE,SAASC,IAAI,QAAQ,2BAA2B;AAChD,SAASC,YAAY;AAErB,SAASC,cAAc;AAEvB,MAAMC,CAAC,GAAGH,IAAI,CAACI,EAAE,CAAC,+BAA+B,CAAC;AAElD,MAAMC,MAA+B,GAAG;EACpCC,IAAI,EAAE,uBAAuB;EAC7BC,IAAI,EAAE,8BAA8B;EACpCC,KAAK,EAAE;IACHF,IAAI,EAAE,QAAQ;IACdG,KAAK,EAAEN,CAAC,QAAQ;IAChBO,WAAW,EAAEP,CAAC,+BAA+B;IAC7CQ,IAAI,eAAEf,KAAA,CAAAgB,aAAA,CAACd,UAAU,MAAE,CAAC;IACpBe,SAAS,EAAE,IAAI;IACfC,qBAAqB,EAAE,KAAK;IAC5BC,SAAS,EAAEZ,CAAC,4BAA4B;IACxCa,WAAWA,CAAA,EAAG;MACV,OAAO;QACHV,IAAI,EAAE,IAAI,CAACA,IAAI;QACfW,UAAU,EAAE,EAAE;QACdC,QAAQ,EAAE;UACNC,MAAM,EAAE,EAAE;UACVC,MAAM,EAAE;QACZ,CAAC;QACDC,QAAQ,EAAE;UACNd,IAAI,EAAE;QACV;MACJ,CAAC;IACL,CAAC;IACDe,MAAMA,CAACC,KAAK,EAAE;MACV,oBAAO3B,KAAA,CAAAgB,aAAA,CAACX,YAAY,EAAKsB,KAAQ,CAAC;IACtC,CAAC;IACDC,OAAO,EAAE;MACLC,UAAUA,CAAC;QAAEjB,KAAK;QAAEkB,KAAK;QAAEC;MAAkB,CAAC,EAAE;QAC5C,MAAMC,UAAU,GAAG,GAAGD,iBAAiB,IAAIzB,cAAc,CAACM,KAAK,CAACqB,OAAO,CAAC,EAAE;QAC1E,MAAMV,MAAM,GACRX,KAAK,CAACU,QAAQ,GAAIV,KAAK,CAACU,QAAQ,CAACC,MAAM,IAAI,EAAE,GAAI,EACjC;QACpB,OAAO,KAAKpB,gBAAgB,CAAC;UAAE2B,KAAK;UAAEP,MAAM;UAAEQ,iBAAiB,EAAEC;QAAW,CAAC,CAAC,IAAI;MACtF;IACJ;EACJ;AACJ,CAAC;AAED,eAAevB,MAAM","ignoreList":[]}

package/admin/plugins/fields/ref/graphql.d.ts

@@ -1,4 +1,4 @@
-import { CmsErrorResponse, CmsModel } from "../../../../types";
+import type { CmsErrorResponse, CmsModel } from "../../../../types.js";
 export interface ListReferencedModelsQueryResult {
     listContentModels: {
         data: Pick<CmsModel, "modelId" | "name">[];

package/admin/plugins/fields/ref/graphql.js

@@ -1,13 +1,18 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.LIST_REFERENCED_MODELS = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _graphqlTag = _interopRequireDefault(require("graphql-tag"));
-var _templateObject;
-var LIST_REFERENCED_MODELS = exports.LIST_REFERENCED_MODELS = (0, _graphqlTag.default)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    query ListReferencedModels {\n        listContentModels {\n            data {\n                modelId\n                name\n            }\n            error {\n                message\n                data\n                code\n            }\n        }\n    }\n"])));
+import gql from "graphql-tag";
+export const LIST_REFERENCED_MODELS = gql`
+    query ListReferencedModels {
+        listContentModels {
+            data {
+                modelId
+                name
+            }
+            error {
+                message
+                data
+                code
+            }
+        }
+    }
+`;
 
 //# sourceMappingURL=graphql.js.map

package/admin/plugins/fields/ref/graphql.js.map

@@ -1 +1 @@
-{"version":3,"names":["_graphqlTag","_interopRequireDefault","require","_templateObject","LIST_REFERENCED_MODELS","exports","gql","_taggedTemplateLiteral2","default"],"sources":["graphql.ts"],"sourcesContent":["import gql from \"graphql-tag\";\nimport { CmsErrorResponse, CmsModel } from \"~/types\";\n\nexport interface ListReferencedModelsQueryResult {\n    listContentModels: {\n        data: Pick<CmsModel, \"modelId\" | \"name\">[];\n        error: CmsErrorResponse | null;\n    };\n}\nexport const LIST_REFERENCED_MODELS = gql`\n    query ListReferencedModels {\n        listContentModels {\n            data {\n                modelId\n                name\n            }\n            error {\n                message\n                data\n                code\n            }\n        }\n    }\n`;\n"],"mappings":";;;;;;;;AAAA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAA8B,IAAAC,eAAA;AASvB,IAAMC,sBAAsB,GAAAC,OAAA,CAAAD,sBAAA,OAAGE,mBAAG,EAAAH,eAAA,KAAAA,eAAA,OAAAI,uBAAA,CAAAC,OAAA,uRAcxC","ignoreList":[]}
+{"version":3,"names":["gql","LIST_REFERENCED_MODELS"],"sources":["graphql.ts"],"sourcesContent":["import gql from \"graphql-tag\";\nimport type { CmsErrorResponse, CmsModel } from \"~/types.js\";\n\nexport interface ListReferencedModelsQueryResult {\n    listContentModels: {\n        data: Pick<CmsModel, \"modelId\" | \"name\">[];\n        error: CmsErrorResponse | null;\n    };\n}\nexport const LIST_REFERENCED_MODELS = gql`\n    query ListReferencedModels {\n        listContentModels {\n            data {\n                modelId\n                name\n            }\n            error {\n                message\n                data\n                code\n            }\n        }\n    }\n`;\n"],"mappings":"AAAA,OAAOA,GAAG,MAAM,aAAa;AAS7B,OAAO,MAAMC,sBAAsB,GAAGD,GAAG;AACzC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/admin/plugins/fields/ref/renderInfo.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import { CmsModel as BaseCmsModel, CmsModelField } from "../../../../types";
-declare type CmsModel = Pick<BaseCmsModel, "modelId" | "name">;
+import type { CmsModel as BaseCmsModel, CmsModelField } from "../../../../types.js";
+type CmsModel = Pick<BaseCmsModel, "modelId" | "name">;
 interface RenderInfoParams {
     field: CmsModelField;
     model: CmsModel;

package/admin/plugins/fields/ref/renderInfo.js

@@ -1,89 +1,41 @@
-"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.renderInfo = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = _interopRequireWildcard(require("react"));
-var _hooks = require("../../../hooks");
-var _graphql = require("./graphql");
-var _appAdmin = require("@webiny/app-admin");
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-var Information = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1wj1cni2"
-} : {
-  target: "e1wj1cni2",
-  label: "Information"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1hbumu2",
-  styles: "display:flex;flex-direction:row;justify-content:right;align-items:center;flex:1"
-} : {
-  name: "1hbumu2",
-  styles: "display:flex;flex-direction:row;justify-content:right;align-items:center;flex:1",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInJlbmRlckluZm8udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQVlvQiIsImZpbGUiOiJyZW5kZXJJbmZvLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QsIHVzZU1lbW8sIHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyBDbXNNb2RlbCBhcyBCYXNlQ21zTW9kZWwsIENtc01vZGVsRmllbGQgfSBmcm9tIFwifi90eXBlc1wiO1xuaW1wb3J0IHsgdXNlUXVlcnkgfSBmcm9tIFwifi9hZG1pbi9ob29rc1wiO1xuaW1wb3J0IHtcbiAgICBMSVNUX1JFRkVSRU5DRURfTU9ERUxTLFxuICAgIExpc3RSZWZlcmVuY2VkTW9kZWxzUXVlcnlSZXN1bHRcbn0gZnJvbSBcIn4vYWRtaW4vcGx1Z2lucy9maWVsZHMvcmVmL2dyYXBocWxcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdXNlU25hY2tiYXIgfSBmcm9tIFwiQHdlYmlueS9hcHAtYWRtaW5cIjtcblxudHlwZSBDbXNNb2RlbCA9IFBpY2s8QmFzZUNtc01vZGVsLCBcIm1vZGVsSWRcIiB8IFwibmFtZVwiPjtcblxuY29uc3QgSW5mb3JtYXRpb24gPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGZsZXhEaXJlY3Rpb246IFwicm93XCIsXG4gICAganVzdGlmeUNvbnRlbnQ6IFwicmlnaHRcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIGZsZXg6IFwiMVwiXG59KTtcblxuY29uc3QgQmFkZ2VJdGVtID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBkaXNwbGF5OiBcImlubGluZS1ibG9ja1wiLFxuICAgIHBhZGRpbmc6IFwiNXB4IDIwcHggN3B4IDIwcHhcIixcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IFwiI0ZGRlwiLFxuICAgIGJvcmRlclJhZGl1czogXCI1cHhcIixcbiAgICBib3JkZXI6IFwiMXB4IHNvbGlkIGRhcmtncmV5XCIsXG4gICAgbWFyZ2luUmlnaHQ6IFwiMTBweFwiLFxuICAgIGN1cnNvcjogXCJkZWZhdWx0XCIsXG4gICAgZm9udFdlaWdodDogXCJub3JtYWxcIlxufSk7XG5cbmNvbnN0IEV4dHJhcyA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgZGlzcGxheTogXCJpbmxpbmUtYmxvY2tcIixcbiAgICBwYWRkaW5nOiBcIjVweCAxMHB4IDdweCAxMHB4XCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiNGRkZcIixcbiAgICBib3JkZXJSYWRpdXM6IFwiNXB4XCIsXG4gICAgYm9yZGVyOiBcIjFweCBzb2xpZCBkYXJrZ3JleVwiLFxuICAgIG1heFdpZHRoOiBcIjIwcHhcIixcbiAgICB0ZXh0QWxpZ246IFwiY2VudGVyXCIsXG4gICAgbWFyZ2luUmlnaHQ6IFwiMTBweFwiLFxuICAgIGN1cnNvcjogXCJkZWZhdWx0XCIsXG4gICAgZm9udFdlaWdodDogXCJub3JtYWxcIlxufSk7XG5cbmludGVyZmFjZSBCYWRnZVByb3BzIHtcbiAgICBtb2RlbDogQ21zTW9kZWw7XG59XG5cbmNvbnN0IEJhZGdlID0gKHsgbW9kZWwgfTogQmFkZ2VQcm9wcykgPT4ge1xuICAgIHJldHVybiA8QmFkZ2VJdGVtPnttb2RlbC5uYW1lfTwvQmFkZ2VJdGVtPjtcbn07XG5cbmludGVyZmFjZSBSZW5kZXJJbmZvUGFyYW1zIHtcbiAgICBmaWVsZDogQ21zTW9kZWxGaWVsZDtcbiAgICBtb2RlbDogQ21zTW9kZWw7XG59XG5cbmNvbnN0IHRha2VCYWRnZXMgPSAxO1xuXG5leHBvcnQgY29uc3QgcmVuZGVySW5mbyA9ICh7IG1vZGVsLCBmaWVsZCB9OiBSZW5kZXJJbmZvUGFyYW1zKSA9PiB7XG4gICAgcmV0dXJuIDxSZW5kZXJJbmZvIG1vZGVsPXttb2RlbH0gZmllbGQ9e2ZpZWxkfSAvPjtcbn07XG5cbmNvbnN0IFJlbmRlckluZm8gPSAoeyBmaWVsZCB9OiBSZW5kZXJJbmZvUGFyYW1zKSA9PiB7XG4gICAgY29uc3QgaGFzQW55TW9kZWxzID0gKGZpZWxkLnNldHRpbmdzPy5tb2RlbHMgfHwgW10pLmxlbmd0aCA+IDA7XG4gICAgY29uc3QgeyBkYXRhLCBsb2FkaW5nLCBlcnJvciB9ID0gdXNlUXVlcnk8TGlzdFJlZmVyZW5jZWRNb2RlbHNRdWVyeVJlc3VsdD4oXG4gICAgICAgIExJU1RfUkVGRVJFTkNFRF9NT0RFTFMsXG4gICAgICAgIHtcbiAgICAgICAgICAgIHNraXA6ICFoYXNBbnlNb2RlbHNcbiAgICAgICAgfVxuICAgICk7XG5cbiAgICBjb25zdCB7IHNob3dTbmFja2JhciB9ID0gdXNlU25hY2tiYXIoKTtcblxuICAgIGNvbnN0IFttb2RlbHMsIHNldE1vZGVsc10gPSB1c2VTdGF0ZTxDbXNNb2RlbFtdPihbXSk7XG5cbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgICAgICBpZiAoIWRhdGEgfHwgbG9hZGluZykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9IGVsc2UgaWYgKGVycm9yKSB7XG4gICAgICAgICAgICBzaG93U25hY2tiYXIoZXJyb3IubWVzc2FnZSk7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cblxuICAgICAgICBzZXRNb2RlbHMoZGF0YS5saXN0Q29udGVudE1vZGVscz8uZGF0YSB8fCBbXSk7XG4gICAgfSwgW2RhdGEsIGxvYWRpbmddKTtcblxuICAgIGNvbnN0IHsgaXRlbXMsIGJhZGdlcyB9ID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICAgIGNvbnN0IGZpZWxkTW9kZWxzID0gKGZpZWxkLnNldHRpbmdzPy5tb2RlbHMgfHwgW10pXG4gICAgICAgICAgICAubWFwKG1vZGVsID0+IHtcbiAgICAgICAgICAgICAgICByZXR1cm4gbW9kZWxzLmZpbmQobSA9PiBtLm1vZGVsSWQgPT09IG1vZGVsLm1vZGVsSWQpO1xuICAgICAgICAgICAgfSlcbiAgICAgICAgICAgIC5maWx0ZXIoQm9vbGVhbikgYXMgQ21zTW9kZWxbXTtcbiAgICAgICAgcmV0dXJuIHtcbiAgICAgICAgICAgIGl0ZW1zOiBmaWVsZE1vZGVscy5zbGljZSgwLCB0YWtlQmFkZ2VzKSxcbiAgICAgICAgICAgIGJhZGdlczogZmllbGRNb2RlbHMubGVuZ3RoIC0gdGFrZUJhZGdlc1xuICAgICAgICB9O1xuICAgIH0sIFttb2RlbHMsIGZpZWxkXSk7XG5cbiAgICBpZiAobW9kZWxzLmxlbmd0aCA9PT0gMCkge1xuICAgICAgICByZXR1cm4gbnVsbDtcbiAgICB9XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8SW5mb3JtYXRpb24+XG4gICAgICAgICAgICB7aXRlbXMubWFwKG1vZGVsID0+IHtcbiAgICAgICAgICAgICAgICByZXR1cm4gPEJhZGdlIGtleT17YG1vZGVsLSR7bW9kZWwubW9kZWxJZH1gfSBtb2RlbD17bW9kZWx9IC8+O1xuICAgICAgICAgICAgfSl9XG4gICAgICAgICAgICB7YmFkZ2VzID4gMCAmJiA8RXh0cmFzPit7YmFkZ2VzfTwvRXh0cmFzPn1cbiAgICAgICAgPC9JbmZvcm1hdGlvbj5cbiAgICApO1xufTtcbiJdfQ== */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var BadgeItem = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1wj1cni1"
-} : {
-  target: "e1wj1cni1",
-  label: "BadgeItem"
-})(process.env.NODE_ENV === "production" ? {
-  name: "rwtqpo",
-  styles: "display:inline-block;padding:5px 20px 7px 20px;background-color:#FFF;border-radius:5px;border:1px solid darkgrey;margin-right:10px;cursor:default;font-weight:normal"
-} : {
-  name: "rwtqpo",
-  styles: "display:inline-block;padding:5px 20px 7px 20px;background-color:#FFF;border-radius:5px;border:1px solid darkgrey;margin-right:10px;cursor:default;font-weight:normal",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInJlbmRlckluZm8udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQW9Ca0IiLCJmaWxlIjoicmVuZGVySW5mby50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QsIHsgdXNlRWZmZWN0LCB1c2VNZW1vLCB1c2VTdGF0ZSB9IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHsgQ21zTW9kZWwgYXMgQmFzZUNtc01vZGVsLCBDbXNNb2RlbEZpZWxkIH0gZnJvbSBcIn4vdHlwZXNcIjtcbmltcG9ydCB7IHVzZVF1ZXJ5IH0gZnJvbSBcIn4vYWRtaW4vaG9va3NcIjtcbmltcG9ydCB7XG4gICAgTElTVF9SRUZFUkVOQ0VEX01PREVMUyxcbiAgICBMaXN0UmVmZXJlbmNlZE1vZGVsc1F1ZXJ5UmVzdWx0XG59IGZyb20gXCJ+L2FkbWluL3BsdWdpbnMvZmllbGRzL3JlZi9ncmFwaHFsXCI7XG5pbXBvcnQgc3R5bGVkIGZyb20gXCJAZW1vdGlvbi9zdHlsZWRcIjtcbmltcG9ydCB7IHVzZVNuYWNrYmFyIH0gZnJvbSBcIkB3ZWJpbnkvYXBwLWFkbWluXCI7XG5cbnR5cGUgQ21zTW9kZWwgPSBQaWNrPEJhc2VDbXNNb2RlbCwgXCJtb2RlbElkXCIgfCBcIm5hbWVcIj47XG5cbmNvbnN0IEluZm9ybWF0aW9uID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBmbGV4RGlyZWN0aW9uOiBcInJvd1wiLFxuICAgIGp1c3RpZnlDb250ZW50OiBcInJpZ2h0XCIsXG4gICAgYWxpZ25JdGVtczogXCJjZW50ZXJcIixcbiAgICBmbGV4OiBcIjFcIlxufSk7XG5cbmNvbnN0IEJhZGdlSXRlbSA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgZGlzcGxheTogXCJpbmxpbmUtYmxvY2tcIixcbiAgICBwYWRkaW5nOiBcIjVweCAyMHB4IDdweCAyMHB4XCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiNGRkZcIixcbiAgICBib3JkZXJSYWRpdXM6IFwiNXB4XCIsXG4gICAgYm9yZGVyOiBcIjFweCBzb2xpZCBkYXJrZ3JleVwiLFxuICAgIG1hcmdpblJpZ2h0OiBcIjEwcHhcIixcbiAgICBjdXJzb3I6IFwiZGVmYXVsdFwiLFxuICAgIGZvbnRXZWlnaHQ6IFwibm9ybWFsXCJcbn0pO1xuXG5jb25zdCBFeHRyYXMgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIGRpc3BsYXk6IFwiaW5saW5lLWJsb2NrXCIsXG4gICAgcGFkZGluZzogXCI1cHggMTBweCA3cHggMTBweFwiLFxuICAgIGJhY2tncm91bmRDb2xvcjogXCIjRkZGXCIsXG4gICAgYm9yZGVyUmFkaXVzOiBcIjVweFwiLFxuICAgIGJvcmRlcjogXCIxcHggc29saWQgZGFya2dyZXlcIixcbiAgICBtYXhXaWR0aDogXCIyMHB4XCIsXG4gICAgdGV4dEFsaWduOiBcImNlbnRlclwiLFxuICAgIG1hcmdpblJpZ2h0OiBcIjEwcHhcIixcbiAgICBjdXJzb3I6IFwiZGVmYXVsdFwiLFxuICAgIGZvbnRXZWlnaHQ6IFwibm9ybWFsXCJcbn0pO1xuXG5pbnRlcmZhY2UgQmFkZ2VQcm9wcyB7XG4gICAgbW9kZWw6IENtc01vZGVsO1xufVxuXG5jb25zdCBCYWRnZSA9ICh7IG1vZGVsIH06IEJhZGdlUHJvcHMpID0+IHtcbiAgICByZXR1cm4gPEJhZGdlSXRlbT57bW9kZWwubmFtZX08L0JhZGdlSXRlbT47XG59O1xuXG5pbnRlcmZhY2UgUmVuZGVySW5mb1BhcmFtcyB7XG4gICAgZmllbGQ6IENtc01vZGVsRmllbGQ7XG4gICAgbW9kZWw6IENtc01vZGVsO1xufVxuXG5jb25zdCB0YWtlQmFkZ2VzID0gMTtcblxuZXhwb3J0IGNvbnN0IHJlbmRlckluZm8gPSAoeyBtb2RlbCwgZmllbGQgfTogUmVuZGVySW5mb1BhcmFtcykgPT4ge1xuICAgIHJldHVybiA8UmVuZGVySW5mbyBtb2RlbD17bW9kZWx9IGZpZWxkPXtmaWVsZH0gLz47XG59O1xuXG5jb25zdCBSZW5kZXJJbmZvID0gKHsgZmllbGQgfTogUmVuZGVySW5mb1BhcmFtcykgPT4ge1xuICAgIGNvbnN0IGhhc0FueU1vZGVscyA9IChmaWVsZC5zZXR0aW5ncz8ubW9kZWxzIHx8IFtdKS5sZW5ndGggPiAwO1xuICAgIGNvbnN0IHsgZGF0YSwgbG9hZGluZywgZXJyb3IgfSA9IHVzZVF1ZXJ5PExpc3RSZWZlcmVuY2VkTW9kZWxzUXVlcnlSZXN1bHQ+KFxuICAgICAgICBMSVNUX1JFRkVSRU5DRURfTU9ERUxTLFxuICAgICAgICB7XG4gICAgICAgICAgICBza2lwOiAhaGFzQW55TW9kZWxzXG4gICAgICAgIH1cbiAgICApO1xuXG4gICAgY29uc3QgeyBzaG93U25hY2tiYXIgfSA9IHVzZVNuYWNrYmFyKCk7XG5cbiAgICBjb25zdCBbbW9kZWxzLCBzZXRNb2RlbHNdID0gdXNlU3RhdGU8Q21zTW9kZWxbXT4oW10pO1xuXG4gICAgdXNlRWZmZWN0KCgpID0+IHtcbiAgICAgICAgaWYgKCFkYXRhIHx8IGxvYWRpbmcpIHtcbiAgICAgICAgICAgIHJldHVybjtcbiAgICAgICAgfSBlbHNlIGlmIChlcnJvcikge1xuICAgICAgICAgICAgc2hvd1NuYWNrYmFyKGVycm9yLm1lc3NhZ2UpO1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9XG5cbiAgICAgICAgc2V0TW9kZWxzKGRhdGEubGlzdENvbnRlbnRNb2RlbHM/LmRhdGEgfHwgW10pO1xuICAgIH0sIFtkYXRhLCBsb2FkaW5nXSk7XG5cbiAgICBjb25zdCB7IGl0ZW1zLCBiYWRnZXMgfSA9IHVzZU1lbW8oKCkgPT4ge1xuICAgICAgICBjb25zdCBmaWVsZE1vZGVscyA9IChmaWVsZC5zZXR0aW5ncz8ubW9kZWxzIHx8IFtdKVxuICAgICAgICAgICAgLm1hcChtb2RlbCA9PiB7XG4gICAgICAgICAgICAgICAgcmV0dXJuIG1vZGVscy5maW5kKG0gPT4gbS5tb2RlbElkID09PSBtb2RlbC5tb2RlbElkKTtcbiAgICAgICAgICAgIH0pXG4gICAgICAgICAgICAuZmlsdGVyKEJvb2xlYW4pIGFzIENtc01vZGVsW107XG4gICAgICAgIHJldHVybiB7XG4gICAgICAgICAgICBpdGVtczogZmllbGRNb2RlbHMuc2xpY2UoMCwgdGFrZUJhZGdlcyksXG4gICAgICAgICAgICBiYWRnZXM6IGZpZWxkTW9kZWxzLmxlbmd0aCAtIHRha2VCYWRnZXNcbiAgICAgICAgfTtcbiAgICB9LCBbbW9kZWxzLCBmaWVsZF0pO1xuXG4gICAgaWYgKG1vZGVscy5sZW5ndGggPT09IDApIHtcbiAgICAgICAgcmV0dXJuIG51bGw7XG4gICAgfVxuXG4gICAgcmV0dXJuIChcbiAgICAgICAgPEluZm9ybWF0aW9uPlxuICAgICAgICAgICAge2l0ZW1zLm1hcChtb2RlbCA9PiB7XG4gICAgICAgICAgICAgICAgcmV0dXJuIDxCYWRnZSBrZXk9e2Btb2RlbC0ke21vZGVsLm1vZGVsSWR9YH0gbW9kZWw9e21vZGVsfSAvPjtcbiAgICAgICAgICAgIH0pfVxuICAgICAgICAgICAge2JhZGdlcyA+IDAgJiYgPEV4dHJhcz4re2JhZGdlc308L0V4dHJhcz59XG4gICAgICAgIDwvSW5mb3JtYXRpb24+XG4gICAgKTtcbn07XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var Extras = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1wj1cni0"
-} : {
-  target: "e1wj1cni0",
-  label: "Extras"
-})(process.env.NODE_ENV === "production" ? {
-  name: "z7ir25",
-  styles: "display:inline-block;padding:5px 10px 7px 10px;background-color:#FFF;border-radius:5px;border:1px solid darkgrey;max-width:20px;text-align:center;margin-right:10px;cursor:default;font-weight:normal"
-} : {
-  name: "z7ir25",
-  styles: "display:inline-block;padding:5px 10px 7px 10px;background-color:#FFF;border-radius:5px;border:1px solid darkgrey;max-width:20px;text-align:center;margin-right:10px;cursor:default;font-weight:normal",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInJlbmRlckluZm8udHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQStCZSIsImZpbGUiOiJyZW5kZXJJbmZvLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCwgeyB1c2VFZmZlY3QsIHVzZU1lbW8sIHVzZVN0YXRlIH0gZnJvbSBcInJlYWN0XCI7XG5pbXBvcnQgeyBDbXNNb2RlbCBhcyBCYXNlQ21zTW9kZWwsIENtc01vZGVsRmllbGQgfSBmcm9tIFwifi90eXBlc1wiO1xuaW1wb3J0IHsgdXNlUXVlcnkgfSBmcm9tIFwifi9hZG1pbi9ob29rc1wiO1xuaW1wb3J0IHtcbiAgICBMSVNUX1JFRkVSRU5DRURfTU9ERUxTLFxuICAgIExpc3RSZWZlcmVuY2VkTW9kZWxzUXVlcnlSZXN1bHRcbn0gZnJvbSBcIn4vYWRtaW4vcGx1Z2lucy9maWVsZHMvcmVmL2dyYXBocWxcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgdXNlU25hY2tiYXIgfSBmcm9tIFwiQHdlYmlueS9hcHAtYWRtaW5cIjtcblxudHlwZSBDbXNNb2RlbCA9IFBpY2s8QmFzZUNtc01vZGVsLCBcIm1vZGVsSWRcIiB8IFwibmFtZVwiPjtcblxuY29uc3QgSW5mb3JtYXRpb24gPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIGRpc3BsYXk6IFwiZmxleFwiLFxuICAgIGZsZXhEaXJlY3Rpb246IFwicm93XCIsXG4gICAganVzdGlmeUNvbnRlbnQ6IFwicmlnaHRcIixcbiAgICBhbGlnbkl0ZW1zOiBcImNlbnRlclwiLFxuICAgIGZsZXg6IFwiMVwiXG59KTtcblxuY29uc3QgQmFkZ2VJdGVtID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBkaXNwbGF5OiBcImlubGluZS1ibG9ja1wiLFxuICAgIHBhZGRpbmc6IFwiNXB4IDIwcHggN3B4IDIwcHhcIixcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IFwiI0ZGRlwiLFxuICAgIGJvcmRlclJhZGl1czogXCI1cHhcIixcbiAgICBib3JkZXI6IFwiMXB4IHNvbGlkIGRhcmtncmV5XCIsXG4gICAgbWFyZ2luUmlnaHQ6IFwiMTBweFwiLFxuICAgIGN1cnNvcjogXCJkZWZhdWx0XCIsXG4gICAgZm9udFdlaWdodDogXCJub3JtYWxcIlxufSk7XG5cbmNvbnN0IEV4dHJhcyA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgZGlzcGxheTogXCJpbmxpbmUtYmxvY2tcIixcbiAgICBwYWRkaW5nOiBcIjVweCAxMHB4IDdweCAxMHB4XCIsXG4gICAgYmFja2dyb3VuZENvbG9yOiBcIiNGRkZcIixcbiAgICBib3JkZXJSYWRpdXM6IFwiNXB4XCIsXG4gICAgYm9yZGVyOiBcIjFweCBzb2xpZCBkYXJrZ3JleVwiLFxuICAgIG1heFdpZHRoOiBcIjIwcHhcIixcbiAgICB0ZXh0QWxpZ246IFwiY2VudGVyXCIsXG4gICAgbWFyZ2luUmlnaHQ6IFwiMTBweFwiLFxuICAgIGN1cnNvcjogXCJkZWZhdWx0XCIsXG4gICAgZm9udFdlaWdodDogXCJub3JtYWxcIlxufSk7XG5cbmludGVyZmFjZSBCYWRnZVByb3BzIHtcbiAgICBtb2RlbDogQ21zTW9kZWw7XG59XG5cbmNvbnN0IEJhZGdlID0gKHsgbW9kZWwgfTogQmFkZ2VQcm9wcykgPT4ge1xuICAgIHJldHVybiA8QmFkZ2VJdGVtPnttb2RlbC5uYW1lfTwvQmFkZ2VJdGVtPjtcbn07XG5cbmludGVyZmFjZSBSZW5kZXJJbmZvUGFyYW1zIHtcbiAgICBmaWVsZDogQ21zTW9kZWxGaWVsZDtcbiAgICBtb2RlbDogQ21zTW9kZWw7XG59XG5cbmNvbnN0IHRha2VCYWRnZXMgPSAxO1xuXG5leHBvcnQgY29uc3QgcmVuZGVySW5mbyA9ICh7IG1vZGVsLCBmaWVsZCB9OiBSZW5kZXJJbmZvUGFyYW1zKSA9PiB7XG4gICAgcmV0dXJuIDxSZW5kZXJJbmZvIG1vZGVsPXttb2RlbH0gZmllbGQ9e2ZpZWxkfSAvPjtcbn07XG5cbmNvbnN0IFJlbmRlckluZm8gPSAoeyBmaWVsZCB9OiBSZW5kZXJJbmZvUGFyYW1zKSA9PiB7XG4gICAgY29uc3QgaGFzQW55TW9kZWxzID0gKGZpZWxkLnNldHRpbmdzPy5tb2RlbHMgfHwgW10pLmxlbmd0aCA+IDA7XG4gICAgY29uc3QgeyBkYXRhLCBsb2FkaW5nLCBlcnJvciB9ID0gdXNlUXVlcnk8TGlzdFJlZmVyZW5jZWRNb2RlbHNRdWVyeVJlc3VsdD4oXG4gICAgICAgIExJU1RfUkVGRVJFTkNFRF9NT0RFTFMsXG4gICAgICAgIHtcbiAgICAgICAgICAgIHNraXA6ICFoYXNBbnlNb2RlbHNcbiAgICAgICAgfVxuICAgICk7XG5cbiAgICBjb25zdCB7IHNob3dTbmFja2JhciB9ID0gdXNlU25hY2tiYXIoKTtcblxuICAgIGNvbnN0IFttb2RlbHMsIHNldE1vZGVsc10gPSB1c2VTdGF0ZTxDbXNNb2RlbFtdPihbXSk7XG5cbiAgICB1c2VFZmZlY3QoKCkgPT4ge1xuICAgICAgICBpZiAoIWRhdGEgfHwgbG9hZGluZykge1xuICAgICAgICAgICAgcmV0dXJuO1xuICAgICAgICB9IGVsc2UgaWYgKGVycm9yKSB7XG4gICAgICAgICAgICBzaG93U25hY2tiYXIoZXJyb3IubWVzc2FnZSk7XG4gICAgICAgICAgICByZXR1cm47XG4gICAgICAgIH1cblxuICAgICAgICBzZXRNb2RlbHMoZGF0YS5saXN0Q29udGVudE1vZGVscz8uZGF0YSB8fCBbXSk7XG4gICAgfSwgW2RhdGEsIGxvYWRpbmddKTtcblxuICAgIGNvbnN0IHsgaXRlbXMsIGJhZGdlcyB9ID0gdXNlTWVtbygoKSA9PiB7XG4gICAgICAgIGNvbnN0IGZpZWxkTW9kZWxzID0gKGZpZWxkLnNldHRpbmdzPy5tb2RlbHMgfHwgW10pXG4gICAgICAgICAgICAubWFwKG1vZGVsID0+IHtcbiAgICAgICAgICAgICAgICByZXR1cm4gbW9kZWxzLmZpbmQobSA9PiBtLm1vZGVsSWQgPT09IG1vZGVsLm1vZGVsSWQpO1xuICAgICAgICAgICAgfSlcbiAgICAgICAgICAgIC5maWx0ZXIoQm9vbGVhbikgYXMgQ21zTW9kZWxbXTtcbiAgICAgICAgcmV0dXJuIHtcbiAgICAgICAgICAgIGl0ZW1zOiBmaWVsZE1vZGVscy5zbGljZSgwLCB0YWtlQmFkZ2VzKSxcbiAgICAgICAgICAgIGJhZGdlczogZmllbGRNb2RlbHMubGVuZ3RoIC0gdGFrZUJhZGdlc1xuICAgICAgICB9O1xuICAgIH0sIFttb2RlbHMsIGZpZWxkXSk7XG5cbiAgICBpZiAobW9kZWxzLmxlbmd0aCA9PT0gMCkge1xuICAgICAgICByZXR1cm4gbnVsbDtcbiAgICB9XG5cbiAgICByZXR1cm4gKFxuICAgICAgICA8SW5mb3JtYXRpb24+XG4gICAgICAgICAgICB7aXRlbXMubWFwKG1vZGVsID0+IHtcbiAgICAgICAgICAgICAgICByZXR1cm4gPEJhZGdlIGtleT17YG1vZGVsLSR7bW9kZWwubW9kZWxJZH1gfSBtb2RlbD17bW9kZWx9IC8+O1xuICAgICAgICAgICAgfSl9XG4gICAgICAgICAgICB7YmFkZ2VzID4gMCAmJiA8RXh0cmFzPit7YmFkZ2VzfTwvRXh0cmFzPn1cbiAgICAgICAgPC9JbmZvcm1hdGlvbj5cbiAgICApO1xufTtcbiJdfQ== */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var Badge = function Badge(_ref) {
-  var model = _ref.model;
-  return /*#__PURE__*/_react.default.createElement(BadgeItem, null, model.name);
+import React, { useEffect, useMemo, useState } from "react";
+import { useQuery } from "../../../hooks/index.js";
+import { LIST_REFERENCED_MODELS } from "./graphql.js";
+import { useSnackbar } from "@webiny/app-admin";
+import { Tag } from "@webiny/admin-ui";
+const Badge = ({
+  model
+}) => {
+  return /*#__PURE__*/React.createElement(Tag, {
+    content: model.name
+  });
 };
-var takeBadges = 1;
-var renderInfo = exports.renderInfo = function renderInfo(_ref2) {
-  var model = _ref2.model,
-    field = _ref2.field;
-  return /*#__PURE__*/_react.default.createElement(RenderInfo, {
+const takeBadges = 1;
+export const renderInfo = ({
+  model,
+  field
+}) => {
+  return /*#__PURE__*/React.createElement(RenderInfo, {
     model: model,
     field: field
   });
 };
-var RenderInfo = function RenderInfo(_ref3) {
-  var field = _ref3.field;
-  var hasAnyModels = (field.settings?.models || []).length > 0;
-  var _useQuery = (0, _hooks.useQuery)(_graphql.LIST_REFERENCED_MODELS, {
-      skip: !hasAnyModels
-    }),
-    data = _useQuery.data,
-    loading = _useQuery.loading,
-    error = _useQuery.error;
-  var _useSnackbar = (0, _appAdmin.useSnackbar)(),
-    showSnackbar = _useSnackbar.showSnackbar;
-  var _useState = (0, _react.useState)([]),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    models = _useState2[0],
-    setModels = _useState2[1];
-  (0, _react.useEffect)(function () {
+const RenderInfo = ({
+  field
+}) => {
+  const hasAnyModels = (field.settings?.models || []).length > 0;
+  const {
+    data,
+    loading,
+    error
+  } = useQuery(LIST_REFERENCED_MODELS, {
+    skip: !hasAnyModels
+  });
+  const {
+    showSnackbar
+  } = useSnackbar();
+  const [models, setModels] = useState([]);
+  useEffect(() => {
     if (!data || loading) {
       return;
     } else if (error) {
@@ -92,28 +44,31 @@ var RenderInfo = function RenderInfo(_ref3) {
     }
     setModels(data.listContentModels?.data || []);
   }, [data, loading]);
-  var _useMemo = (0, _react.useMemo)(function () {
-      var fieldModels = (field.settings?.models || []).map(function (model) {
-        return models.find(function (m) {
-          return m.modelId === model.modelId;
-        });
-      }).filter(Boolean);
-      return {
-        items: fieldModels.slice(0, takeBadges),
-        badges: fieldModels.length - takeBadges
-      };
-    }, [models, field]),
-    items = _useMemo.items,
-    badges = _useMemo.badges;
+  const {
+    items,
+    badges
+  } = useMemo(() => {
+    const fieldModels = (field.settings?.models || []).map(model => {
+      return models.find(m => m.modelId === model.modelId);
+    }).filter(Boolean);
+    return {
+      items: fieldModels.slice(0, takeBadges),
+      badges: fieldModels.length - takeBadges
+    };
+  }, [models, field]);
   if (models.length === 0) {
     return null;
   }
-  return /*#__PURE__*/_react.default.createElement(Information, null, items.map(function (model) {
-    return /*#__PURE__*/_react.default.createElement(Badge, {
-      key: "model-".concat(model.modelId),
+  return /*#__PURE__*/React.createElement("div", {
+    className: "flex justify-end items-center gap-sm"
+  }, items.map(model => {
+    return /*#__PURE__*/React.createElement(Badge, {
+      key: `model-${model.modelId}`,
       model: model
     });
-  }), badges > 0 && /*#__PURE__*/_react.default.createElement(Extras, null, "+", badges));
+  }), badges > 0 && /*#__PURE__*/React.createElement(Tag, {
+    content: `+${badges}`
+  }));
 };
 
 //# sourceMappingURL=renderInfo.js.map

package/admin/plugins/fields/ref/renderInfo.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_hooks","_graphql","_appAdmin","_EMOTION_STRINGIFIED_CSS_ERROR__","Information","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","BadgeItem","Extras","Badge","_ref","model","createElement","takeBadges","renderInfo","exports","_ref2","field","RenderInfo","_ref3","hasAnyModels","settings","models","length","_useQuery","useQuery","LIST_REFERENCED_MODELS","skip","data","loading","error","_useSnackbar","useSnackbar","showSnackbar","_useState","useState","_useState2","_slicedToArray2","setModels","useEffect","message","listContentModels","_useMemo","useMemo","fieldModels","find","m","modelId","filter","Boolean","items","slice","badges","key","concat"],"sources":["renderInfo.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\";\nimport { CmsModel as BaseCmsModel, CmsModelField } from \"~/types\";\nimport { useQuery } from \"~/admin/hooks\";\nimport {\n    LIST_REFERENCED_MODELS,\n    ListReferencedModelsQueryResult\n} from \"~/admin/plugins/fields/ref/graphql\";\nimport styled from \"@emotion/styled\";\nimport { useSnackbar } from \"@webiny/app-admin\";\n\ntype CmsModel = Pick<BaseCmsModel, \"modelId\" | \"name\">;\n\nconst Information = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    justifyContent: \"right\",\n    alignItems: \"center\",\n    flex: \"1\"\n});\n\nconst BadgeItem = styled(\"div\")({\n    display: \"inline-block\",\n    padding: \"5px 20px 7px 20px\",\n    backgroundColor: \"#FFF\",\n    borderRadius: \"5px\",\n    border: \"1px solid darkgrey\",\n    marginRight: \"10px\",\n    cursor: \"default\",\n    fontWeight: \"normal\"\n});\n\nconst Extras = styled(\"div\")({\n    display: \"inline-block\",\n    padding: \"5px 10px 7px 10px\",\n    backgroundColor: \"#FFF\",\n    borderRadius: \"5px\",\n    border: \"1px solid darkgrey\",\n    maxWidth: \"20px\",\n    textAlign: \"center\",\n    marginRight: \"10px\",\n    cursor: \"default\",\n    fontWeight: \"normal\"\n});\n\ninterface BadgeProps {\n    model: CmsModel;\n}\n\nconst Badge = ({ model }: BadgeProps) => {\n    return <BadgeItem>{model.name}</BadgeItem>;\n};\n\ninterface RenderInfoParams {\n    field: CmsModelField;\n    model: CmsModel;\n}\n\nconst takeBadges = 1;\n\nexport const renderInfo = ({ model, field }: RenderInfoParams) => {\n    return <RenderInfo model={model} field={field} />;\n};\n\nconst RenderInfo = ({ field }: RenderInfoParams) => {\n    const hasAnyModels = (field.settings?.models || []).length > 0;\n    const { data, loading, error } = useQuery<ListReferencedModelsQueryResult>(\n        LIST_REFERENCED_MODELS,\n        {\n            skip: !hasAnyModels\n        }\n    );\n\n    const { showSnackbar } = useSnackbar();\n\n    const [models, setModels] = useState<CmsModel[]>([]);\n\n    useEffect(() => {\n        if (!data || loading) {\n            return;\n        } else if (error) {\n            showSnackbar(error.message);\n            return;\n        }\n\n        setModels(data.listContentModels?.data || []);\n    }, [data, loading]);\n\n    const { items, badges } = useMemo(() => {\n        const fieldModels = (field.settings?.models || [])\n            .map(model => {\n                return models.find(m => m.modelId === model.modelId);\n            })\n            .filter(Boolean) as CmsModel[];\n        return {\n            items: fieldModels.slice(0, takeBadges),\n            badges: fieldModels.length - takeBadges\n        };\n    }, [models, field]);\n\n    if (models.length === 0) {\n        return null;\n    }\n\n    return (\n        <Information>\n            {items.map(model => {\n                return <Badge key={`model-${model.modelId}`} model={model} />;\n            })}\n            {badges > 0 && <Extras>+{badges}</Extras>}\n        </Information>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useEffect","useMemo","useState","useQuery","LIST_REFERENCED_MODELS","useSnackbar","Tag","Badge","model","createElement","content","name","takeBadges","renderInfo","field","RenderInfo","hasAnyModels","settings","models","length","data","loading","error","skip","showSnackbar","setModels","message","listContentModels","items","badges","fieldModels","map","find","m","modelId","filter","Boolean","slice","className","key"],"sources":["renderInfo.tsx"],"sourcesContent":["import React, { useEffect, useMemo, useState } from \"react\";\nimport type { CmsModel as BaseCmsModel, CmsModelField } from \"~/types.js\";\nimport { useQuery } from \"~/admin/hooks/index.js\";\nimport type { ListReferencedModelsQueryResult } from \"~/admin/plugins/fields/ref/graphql.js\";\nimport { LIST_REFERENCED_MODELS } from \"~/admin/plugins/fields/ref/graphql.js\";\nimport { useSnackbar } from \"@webiny/app-admin\";\nimport { Tag } from \"@webiny/admin-ui\";\n\ntype CmsModel = Pick<BaseCmsModel, \"modelId\" | \"name\">;\n\ninterface BadgeProps {\n    model: CmsModel;\n}\n\nconst Badge = ({ model }: BadgeProps) => {\n    return <Tag content={model.name} />;\n};\n\ninterface RenderInfoParams {\n    field: CmsModelField;\n    model: CmsModel;\n}\n\nconst takeBadges = 1;\n\nexport const renderInfo = ({ model, field }: RenderInfoParams) => {\n    return <RenderInfo model={model} field={field} />;\n};\n\nconst RenderInfo = ({ field }: RenderInfoParams) => {\n    const hasAnyModels = (field.settings?.models || []).length > 0;\n    const { data, loading, error } = useQuery<ListReferencedModelsQueryResult>(\n        LIST_REFERENCED_MODELS,\n        {\n            skip: !hasAnyModels\n        }\n    );\n\n    const { showSnackbar } = useSnackbar();\n\n    const [models, setModels] = useState<CmsModel[]>([]);\n\n    useEffect(() => {\n        if (!data || loading) {\n            return;\n        } else if (error) {\n            showSnackbar(error.message);\n            return;\n        }\n\n        setModels(data.listContentModels?.data || []);\n    }, [data, loading]);\n\n    const { items, badges } = useMemo(() => {\n        const fieldModels = (field.settings?.models || [])\n            .map(model => {\n                return models.find(m => m.modelId === model.modelId);\n            })\n            .filter(Boolean) as CmsModel[];\n        return {\n            items: fieldModels.slice(0, takeBadges),\n            badges: fieldModels.length - takeBadges\n        };\n    }, [models, field]);\n\n    if (models.length === 0) {\n        return null;\n    }\n\n    return (\n        <div className={\"flex justify-end items-center gap-sm\"}>\n            {items.map(model => {\n                return <Badge key={`model-${model.modelId}`} model={model} />;\n            })}\n            {badges > 0 && <Tag content={`+${badges}`}></Tag>}\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAE3D,SAASC,QAAQ;AAEjB,SAASC,sBAAsB;AAC/B,SAASC,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,GAAG,QAAQ,kBAAkB;AAQtC,MAAMC,KAAK,GAAGA,CAAC;EAAEC;AAAkB,CAAC,KAAK;EACrC,oBAAOT,KAAA,CAAAU,aAAA,CAACH,GAAG;IAACI,OAAO,EAAEF,KAAK,CAACG;EAAK,CAAE,CAAC;AACvC,CAAC;AAOD,MAAMC,UAAU,GAAG,CAAC;AAEpB,OAAO,MAAMC,UAAU,GAAGA,CAAC;EAAEL,KAAK;EAAEM;AAAwB,CAAC,KAAK;EAC9D,oBAAOf,KAAA,CAAAU,aAAA,CAACM,UAAU;IAACP,KAAK,EAAEA,KAAM;IAACM,KAAK,EAAEA;EAAM,CAAE,CAAC;AACrD,CAAC;AAED,MAAMC,UAAU,GAAGA,CAAC;EAAED;AAAwB,CAAC,KAAK;EAChD,MAAME,YAAY,GAAG,CAACF,KAAK,CAACG,QAAQ,EAAEC,MAAM,IAAI,EAAE,EAAEC,MAAM,GAAG,CAAC;EAC9D,MAAM;IAAEC,IAAI;IAAEC,OAAO;IAAEC;EAAM,CAAC,GAAGnB,QAAQ,CACrCC,sBAAsB,EACtB;IACImB,IAAI,EAAE,CAACP;EACX,CACJ,CAAC;EAED,MAAM;IAAEQ;EAAa,CAAC,GAAGnB,WAAW,CAAC,CAAC;EAEtC,MAAM,CAACa,MAAM,EAAEO,SAAS,CAAC,GAAGvB,QAAQ,CAAa,EAAE,CAAC;EAEpDF,SAAS,CAAC,MAAM;IACZ,IAAI,CAACoB,IAAI,IAAIC,OAAO,EAAE;MAClB;IACJ,CAAC,MAAM,IAAIC,KAAK,EAAE;MACdE,YAAY,CAACF,KAAK,CAACI,OAAO,CAAC;MAC3B;IACJ;IAEAD,SAAS,CAACL,IAAI,CAACO,iBAAiB,EAAEP,IAAI,IAAI,EAAE,CAAC;EACjD,CAAC,EAAE,CAACA,IAAI,EAAEC,OAAO,CAAC,CAAC;EAEnB,MAAM;IAAEO,KAAK;IAAEC;EAAO,CAAC,GAAG5B,OAAO,CAAC,MAAM;IACpC,MAAM6B,WAAW,GAAG,CAAChB,KAAK,CAACG,QAAQ,EAAEC,MAAM,IAAI,EAAE,EAC5Ca,GAAG,CAACvB,KAAK,IAAI;MACV,OAAOU,MAAM,CAACc,IAAI,CAACC,CAAC,IAAIA,CAAC,CAACC,OAAO,KAAK1B,KAAK,CAAC0B,OAAO,CAAC;IACxD,CAAC,CAAC,CACDC,MAAM,CAACC,OAAO,CAAe;IAClC,OAAO;MACHR,KAAK,EAAEE,WAAW,CAACO,KAAK,CAAC,CAAC,EAAEzB,UAAU,CAAC;MACvCiB,MAAM,EAAEC,WAAW,CAACX,MAAM,GAAGP;IACjC,CAAC;EACL,CAAC,EAAE,CAACM,MAAM,EAAEJ,KAAK,CAAC,CAAC;EAEnB,IAAII,MAAM,CAACC,MAAM,KAAK,CAAC,EAAE;IACrB,OAAO,IAAI;EACf;EAEA,oBACIpB,KAAA,CAAAU,aAAA;IAAK6B,SAAS,EAAE;EAAuC,GAClDV,KAAK,CAACG,GAAG,CAACvB,KAAK,IAAI;IAChB,oBAAOT,KAAA,CAAAU,aAAA,CAACF,KAAK;MAACgC,GAAG,EAAE,SAAS/B,KAAK,CAAC0B,OAAO,EAAG;MAAC1B,KAAK,EAAEA;IAAM,CAAE,CAAC;EACjE,CAAC,CAAC,EACDqB,MAAM,GAAG,CAAC,iBAAI9B,KAAA,CAAAU,aAAA,CAACH,GAAG;IAACI,OAAO,EAAE,IAAImB,MAAM;EAAG,CAAM,CAC/C,CAAC;AAEd,CAAC","ignoreList":[]}

package/admin/plugins/fields/ref.d.ts

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

package/admin/plugins/fields/ref.js

@@ -1,107 +1,97 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-var _react = _interopRequireWildcard(require("react"));
-var _get = _interopRequireDefault(require("lodash/get"));
-var _viewsGraphql = require("../../viewsGraphql");
-var _validation = require("@webiny/validation");
-var _Grid = require("@webiny/ui/Grid");
-var _AutoComplete = require("@webiny/ui/AutoComplete");
-var _useSnackbar2 = require("@webiny/app-admin/hooks/useSnackbar");
-var _roundLink24px = require("./icons/round-link-24px.svg");
-var _i18n = require("@webiny/app/i18n");
-var _form = require("@webiny/form");
-var _hooks = require("../../hooks");
-var _renderInfo = require("./ref/renderInfo");
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-var t = _i18n.i18n.ns("app-headless-cms/admin/fields");
-var RefFieldSettings = function RefFieldSettings() {
-  var _useModel = (0, _hooks.useModel)(),
-    model = _useModel.model;
-  var _useForm = (0, _form.useForm)(),
-    formData = _useForm.data;
-  var lockedFields = model.lockedFields || [];
-  var fieldId = (formData || {}).fieldId || null;
-  var isFieldLocked = lockedFields.some(function (lockedField) {
-    return fieldId && lockedField.fieldId === fieldId;
-  });
-  var _useQuery = (0, _hooks.useQuery)(_viewsGraphql.LIST_CONTENT_MODELS),
-    data = _useQuery.data,
-    loading = _useQuery.loading,
-    error = _useQuery.error;
-  var _useSnackbar = (0, _useSnackbar2.useSnackbar)(),
-    showSnackbar = _useSnackbar.showSnackbar;
+import React, { useCallback, useMemo } from "react";
+import { LIST_CONTENT_MODELS, withoutBeingDeletedModels } from "../../viewsGraphql.js";
+import { validation, ValidationError } from "@webiny/validation";
+import { useSnackbar } from "@webiny/app-admin";
+import { ReactComponent as RefIcon } from "@webiny/icons/link.svg";
+import { i18n } from "@webiny/app/i18n/index.js";
+import { Bind } from "@webiny/form";
+import { useQuery } from "../../hooks/index.js";
+import { renderInfo } from "./ref/renderInfo.js";
+import { CMS_MODEL_SINGLETON_TAG } from "@webiny/app-headless-cms-common";
+import { Grid, Label, MultiAutoComplete } from "@webiny/admin-ui";
+const t = i18n.ns("app-headless-cms/admin/fields");
+const RefFieldSettings = () => {
+  const {
+    data,
+    loading,
+    error
+  } = useQuery(LIST_CONTENT_MODELS);
+  const {
+    showSnackbar
+  } = useSnackbar();
   if (error) {
     showSnackbar(error.message);
     return null;
   }
 
   // Format options for the Autocomplete component.
-  var options = (0, _react.useMemo)(function () {
-    var models = (0, _get.default)(data, "listContentModels.data", []);
-    return models.map(function (model) {
+  const options = useMemo(() => {
+    if (!data?.listContentModels?.data) {
+      return [];
+    }
+    const models = withoutBeingDeletedModels(data.listContentModels.data);
+    return models
+    /**
+     * Remove singleton models from the list of options.
+     */.filter(model => {
+      return !model.tags?.includes(CMS_MODEL_SINGLETON_TAG);
+    }).map(model => {
       return {
-        id: model.modelId,
-        name: model.name
+        value: model.modelId,
+        label: model.name
       };
     });
   }, [data]);
-  var atLeastOneItem = (0, _react.useCallback)(async function (value) {
+  const atLeastOneItem = useCallback(async value => {
     try {
-      await _validation.validation.validate(value, "required,minLength:1");
-    } catch (err) {
-      throw new _validation.ValidationError("Please select at least 1 item");
+      await validation.validate(value, "required,minLength:1");
+    } catch {
+      throw new ValidationError(`Please select at least 1 item`);
     }
   }, []);
-  return /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+  return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Grid.Column, {
     span: 12
-  }, /*#__PURE__*/_react.default.createElement(_form.Bind, {
+  }, /*#__PURE__*/React.createElement(Bind, {
     name: "settings.models",
     validators: atLeastOneItem
-  }, function (bind) {
+  }, bind => {
     // Format value prop for MultiAutoComplete component.
-    var formattedValueForAutoComplete = options.filter(function (option) {
-      return bind.value.some(function (_ref) {
-        var modelId = _ref.modelId;
-        return option.id === modelId;
-      });
-    });
-    return /*#__PURE__*/_react.default.createElement(_AutoComplete.MultiAutoComplete, Object.assign({}, bind, {
-      value: formattedValueForAutoComplete,
-      onChange: function onChange(values) {
-        bind.onChange(values.map(function (value) {
-          return {
-            modelId: value.id
-          };
-        }));
+    const formattedValueForAutoComplete = options.filter(option => bind.value.some(({
+      modelId
+    }) => option.value === modelId)).map(({
+      value
+    }) => value);
+    return /*#__PURE__*/React.createElement(MultiAutoComplete, Object.assign({}, bind, {
+      size: "lg",
+      values: formattedValueForAutoComplete,
+      onValuesChange: values => {
+        bind.onChange(values.map(value => ({
+          modelId: value
+        })));
       },
-      label: loading ? t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Loading models..."]))) : t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Content models"]))),
-      description: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Cannot be changed later"]))),
+      label: loading ? t`Loading models...` : /*#__PURE__*/React.createElement(Label, {
+        text: t`Content models`,
+        description: "(cannot be changed later)"
+      }),
       options: options,
-      disabled: isFieldLocked || loading
+      disabled: loading
     }));
   })));
 };
-var plugin = {
+const plugin = {
   type: "cms-editor-field-type",
   name: "cms-editor-field-type-ref",
   field: {
     type: "ref",
     validators: ["required"],
     listValidators: ["minLength", "maxLength"],
-    label: t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Reference"]))),
-    description: t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Reference existing content entries. For example, a book can reference one or more authors."]))),
-    icon: /*#__PURE__*/_react.default.createElement(_roundLink24px.ReactComponent, null),
-    allowMultipleValues: true,
+    label: t`Reference`,
+    description: t`Reference existing content entries. For example, a book can reference one or more authors.`,
+    icon: /*#__PURE__*/React.createElement(RefIcon, null),
+    allowList: true,
     allowPredefinedValues: false,
-    multipleValuesLabel: t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Use as a list of references"]))),
-    createField: function createField() {
+    listLabel: t`Use as a list of references`,
+    createField() {
       return {
         type: this.type,
         settings: {
@@ -113,15 +103,20 @@ var plugin = {
         }
       };
     },
-    renderSettings: function renderSettings() {
-      return /*#__PURE__*/_react.default.createElement(RefFieldSettings, null);
+    renderSettings() {
+      return /*#__PURE__*/React.createElement(RefFieldSettings, null);
     },
     graphql: {
-      queryField: /* GraphQL */"\n                {\n                    modelId\n                    id\n                }\n            "
+      queryField: /* GraphQL */`
+                {
+                    modelId
+                    id
+                }
+            `
     },
-    renderInfo: _renderInfo.renderInfo
+    renderInfo
   }
 };
-var _default = exports.default = plugin;
+export default plugin;
 
 //# sourceMappingURL=ref.js.map