@webiny/app-headless-cms 0.0.0-mt-3 → 0.0.0-unstable.2af142b57e

package/admin/plugins/fields/dynamicZone/TemplateDialog.js

@@ -0,0 +1,141 @@
+"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.TemplateDialog = void 0;
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _Button = require("@webiny/ui/Button");
+var _Grid = require("@webiny/ui/Grid");
+var _Input = require("@webiny/ui/Input");
+var _form = require("@webiny/form");
+var _validation = require("@webiny/validation");
+var _utils = require("@webiny/utils");
+var _IconPicker = require("../../../components/IconPicker");
+var _Dialog = require("../../../components/Dialog");
+var _Alert = require("@webiny/ui/Alert");
+var typeNameValidator = function typeNameValidator(value) {
+  var regex = new RegExp("^[A-Z]+[_0-9A-Za-z]+$");
+  if (regex.test(value)) {
+    return true;
+  }
+  throw Error("Must start with a capital letter, may contain numbers, and must not contain spaces.");
+};
+var getGraphQLTypeName = function getGraphQLTypeName(value) {
+  var titleCase = value.charAt(0).toUpperCase() + value.slice(1);
+  return titleCase.replace(/[^a-zA-Z0-9]/g, "");
+};
+var TemplateDialog = function TemplateDialog(props) {
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    showWarning = _useState2[0],
+    setWarning = _useState2[1];
+  var newTemplate = !Boolean(props.template);
+  var dialogTitle = newTemplate ? "Add Template" : "Edit Template";
+  var submitLabel = newTemplate ? "Add Template" : "Update Template";
+  var onSubmit = function onSubmit(template) {
+    if (template.id) {
+      props.onTemplate(template);
+    } else {
+      props.onTemplate((0, _objectSpread2.default)((0, _objectSpread2.default)({}, template), {}, {
+        id: (0, _utils.generateAlphaNumericLowerCaseId)(),
+        fields: [],
+        layout: []
+      }));
+    }
+    props.onClose();
+  };
+  var showGqlTypeNameWarning = function showGqlTypeNameWarning() {
+    setWarning(true);
+  };
+  var hideGqlTypeNameWarning = function hideGqlTypeNameWarning() {
+    setWarning(false);
+  };
+  var checkGqlType = function checkGqlType(data) {
+    var _props$template;
+    if (newTemplate) {
+      return;
+    }
+    if (data.gqlTypeName !== ((_props$template = props.template) === null || _props$template === void 0 ? void 0 : _props$template.gqlTypeName)) {
+      showGqlTypeNameWarning();
+    } else {
+      hideGqlTypeNameWarning();
+    }
+  };
+  var nameOnBlur = function nameOnBlur(form) {
+    return function () {
+      if (!form.data.gqlTypeName) {
+        /**
+         * There is a possibility that name is undefined, so let's check for it.
+         */
+        var name = form.data.name;
+        if (!name) {
+          return;
+        }
+        form.setValue("gqlTypeName", getGraphQLTypeName(name));
+      }
+    };
+  };
+  var onFormChange = function onFormChange(data, form) {
+    checkGqlType(data, form);
+  };
+  return /*#__PURE__*/_react.default.createElement(_Dialog.Dialog, {
+    open: true,
+    onClose: props.onClose
+  }, /*#__PURE__*/_react.default.createElement(_form.Form, {
+    onSubmit: onSubmit,
+    data: props.template,
+    onChange: onFormChange
+  }, function (_ref) {
+    var Bind = _ref.Bind,
+      submit = _ref.submit,
+      form = _ref.form;
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Dialog.DialogTitle, null, dialogTitle), /*#__PURE__*/_react.default.createElement(_Dialog.DialogContent, null, /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, showWarning ? /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(_Alert.Alert, {
+      title: "GraphQL Schema Change",
+      type: "danger"
+    }, "You've changed the GraphQL schema type name! If your API is being queried by a 3rd party application, this will affect the GraphQL queries in those applications. Make sure your consumers are informed about this change!")) : null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "name",
+      validators: [_validation.validation.create("required")]
+    }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+      label: "Name",
+      onBlur: nameOnBlur(form)
+    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "gqlTypeName",
+      validators: [_validation.validation.create("required"), typeNameValidator]
+    }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+      autoFocus: false,
+      label: "GraphQL Type Name",
+      description: "This string will be used to generate the GraphQL schema. "
+    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "icon",
+      validators: [_validation.validation.create("required")]
+    }, /*#__PURE__*/_react.default.createElement(_IconPicker.IconPicker, {
+      label: "Icon"
+    }))), /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+      span: 12
+    }, /*#__PURE__*/_react.default.createElement(Bind, {
+      name: "description",
+      validators: [_validation.validation.create("required")]
+    }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+      rows: 3,
+      label: "Description"
+    }))))), /*#__PURE__*/_react.default.createElement(_Dialog.DialogActions, null, /*#__PURE__*/_react.default.createElement(_Button.ButtonDefault, {
+      onClick: props.onClose
+    }, "Cancel"), /*#__PURE__*/_react.default.createElement(_Button.ButtonPrimary, {
+      onClick: submit
+    }, submitLabel)));
+  }));
+};
+exports.TemplateDialog = TemplateDialog;

package/admin/plugins/fields/dynamicZone/TemplateDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["typeNameValidator","value","regex","RegExp","test","Error","getGraphQLTypeName","titleCase","charAt","toUpperCase","slice","replace","TemplateDialog","props","useState","showWarning","setWarning","newTemplate","Boolean","template","dialogTitle","submitLabel","onSubmit","id","onTemplate","generateAlphaNumericLowerCaseId","fields","layout","onClose","showGqlTypeNameWarning","hideGqlTypeNameWarning","checkGqlType","data","gqlTypeName","nameOnBlur","form","name","setValue","onFormChange","Bind","submit","validation","create"],"sources":["TemplateDialog.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { ButtonPrimary, ButtonDefault } from \"@webiny/ui/Button\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { Form, FormAPI, FormOnSubmit } from \"@webiny/form\";\nimport { validation } from \"@webiny/validation\";\nimport { CmsDynamicZoneTemplate } from \"~/types\";\nimport { generateAlphaNumericLowerCaseId } from \"@webiny/utils\";\nimport { IconPicker } from \"~/admin/components/IconPicker\";\nimport { Dialog, DialogTitle, DialogContent, DialogActions } from \"~/admin/components/Dialog\";\nimport { Alert } from \"@webiny/ui/Alert\";\n\nconst typeNameValidator = (value: string) => {\n    const regex = new RegExp(\"^[A-Z]+[_0-9A-Za-z]+$\");\n    if (regex.test(value)) {\n        return true;\n    }\n\n    throw Error(\n        `Must start with a capital letter, may contain numbers, and must not contain spaces.`\n    );\n};\n\nconst getGraphQLTypeName = (value: string) => {\n    const titleCase = value.charAt(0).toUpperCase() + value.slice(1);\n    return titleCase.replace(/[^a-zA-Z0-9]/g, \"\");\n};\n\ninterface TemplateDialogProps {\n    onClose: () => void;\n    template?: CmsDynamicZoneTemplate;\n    onTemplate: (template: CmsDynamicZoneTemplate) => void;\n}\n\nexport const TemplateDialog = (props: TemplateDialogProps) => {\n    const [showWarning, setWarning] = useState(false);\n    const newTemplate = !Boolean(props.template);\n    const dialogTitle = newTemplate ? \"Add Template\" : \"Edit Template\";\n    const submitLabel = newTemplate ? \"Add Template\" : \"Update Template\";\n\n    const onSubmit: FormOnSubmit<CmsDynamicZoneTemplate> = template => {\n        if (template.id) {\n            props.onTemplate(template);\n        } else {\n            props.onTemplate({\n                ...template,\n                id: generateAlphaNumericLowerCaseId(),\n                fields: [],\n                layout: []\n            });\n        }\n        props.onClose();\n    };\n\n    const showGqlTypeNameWarning = () => {\n        setWarning(true);\n    };\n\n    const hideGqlTypeNameWarning = () => {\n        setWarning(false);\n    };\n\n    const checkGqlType: FormOnSubmit<CmsDynamicZoneTemplate> = data => {\n        if (newTemplate) {\n            return;\n        }\n\n        if (data.gqlTypeName !== props.template?.gqlTypeName) {\n            showGqlTypeNameWarning();\n        } else {\n            hideGqlTypeNameWarning();\n        }\n    };\n\n    const nameOnBlur = (form: FormAPI<CmsDynamicZoneTemplate>) => () => {\n        if (!form.data.gqlTypeName) {\n            /**\n             * There is a possibility that name is undefined, so let's check for it.\n             */\n            const name = form.data.name;\n            if (!name) {\n                return;\n            }\n            form.setValue(\"gqlTypeName\", getGraphQLTypeName(name));\n        }\n    };\n\n    const onFormChange: FormOnSubmit<CmsDynamicZoneTemplate> = (data, form) => {\n        checkGqlType(data, form);\n    };\n\n    return (\n        <Dialog open={true} onClose={props.onClose}>\n            <Form<CmsDynamicZoneTemplate>\n                onSubmit={onSubmit}\n                data={props.template}\n                onChange={onFormChange}\n            >\n                {({ Bind, submit, form }) => (\n                    <>\n                        <DialogTitle>{dialogTitle}</DialogTitle>\n                        <DialogContent>\n                            <Grid>\n                                {showWarning ? (\n                                    <Cell span={12}>\n                                        <Alert title={\"GraphQL Schema Change\"} type={\"danger\"}>\n                                            You&apos;ve changed the GraphQL schema type name! If\n                                            your API is being queried by a 3rd party application,\n                                            this will affect the GraphQL queries in those\n                                            applications. Make sure your consumers are informed\n                                            about this change!\n                                        </Alert>\n                                    </Cell>\n                                ) : null}\n                                <Cell span={12}>\n                                    <Bind\n                                        name={\"name\"}\n                                        validators={[validation.create(\"required\")]}\n                                    >\n                                        <Input label={\"Name\"} onBlur={nameOnBlur(form)} />\n                                    </Bind>\n                                </Cell>\n                                <Cell span={12}>\n                                    <Bind\n                                        name={\"gqlTypeName\"}\n                                        validators={[\n                                            validation.create(\"required\"),\n                                            typeNameValidator\n                                        ]}\n                                    >\n                                        <Input\n                                            autoFocus={false}\n                                            label={\"GraphQL Type Name\"}\n                                            description={\n                                                \"This string will be used to generate the GraphQL schema. \"\n                                            }\n                                        />\n                                    </Bind>\n                                </Cell>\n                                <Cell span={12}>\n                                    <Bind\n                                        name={\"icon\"}\n                                        validators={[validation.create(\"required\")]}\n                                    >\n                                        <IconPicker label={\"Icon\"} />\n                                    </Bind>\n                                </Cell>\n                                <Cell span={12}>\n                                    <Bind\n                                        name={\"description\"}\n                                        validators={[validation.create(\"required\")]}\n                                    >\n                                        <Input rows={3} label={\"Description\"} />\n                                    </Bind>\n                                </Cell>\n                            </Grid>\n                        </DialogContent>\n                        <DialogActions>\n                            <ButtonDefault onClick={props.onClose}>Cancel</ButtonDefault>\n                            <ButtonPrimary onClick={submit}>{submitLabel}</ButtonPrimary>\n                        </DialogActions>\n                    </>\n                )}\n            </Form>\n        </Dialog>\n    );\n};\n"],"mappings":"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"}

package/admin/plugins/fields/dynamicZone/commonValidators.d.ts

@@ -0,0 +1,2 @@
+import { CmsModelFieldValidatorConfig } from "../../../../types";
+export declare const commonValidators: CmsModelFieldValidatorConfig[];

package/admin/plugins/fields/dynamicZone/commonValidators.js

@@ -0,0 +1,26 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.commonValidators = void 0;
+var commonValidators = [{
+  name: "minLength",
+  label: "Minimum number of entries",
+  description: "Define the minimum number of entries a user must create.",
+  defaultMessage: "You must create at least {value} entries.",
+  variables: [{
+    name: "value",
+    description: "This defines the minimum number of entries a user must create."
+  }]
+}, {
+  name: "maxLength",
+  label: "Maximum number of entries",
+  description: "Define the maximum number of entries a user can create.",
+  defaultMessage: "You have too many entries (max: {value}).",
+  variables: [{
+    name: "value",
+    description: "This defines the maximum number of entries a user can create."
+  }]
+}];
+exports.commonValidators = commonValidators;

package/admin/plugins/fields/dynamicZone/commonValidators.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["commonValidators","name","label","description","defaultMessage","variables"],"sources":["commonValidators.ts"],"sourcesContent":["import { CmsModelFieldValidatorConfig } from \"~/types\";\n\nexport const commonValidators: CmsModelFieldValidatorConfig[] = [\n    {\n        name: \"minLength\",\n        label: \"Minimum number of entries\",\n        description: \"Define the minimum number of entries a user must create.\",\n        defaultMessage: \"You must create at least {value} entries.\",\n        variables: [\n            {\n                name: \"value\",\n                description: \"This defines the minimum number of entries a user must create.\"\n            }\n        ]\n    },\n    {\n        name: \"maxLength\",\n        label: \"Maximum number of entries\",\n        description: \"Define the maximum number of entries a user can create.\",\n        defaultMessage: \"You have too many entries (max: {value}).\",\n        variables: [\n            {\n                name: \"value\",\n                description: \"This defines the maximum number of entries a user can create.\"\n            }\n        ]\n    }\n];\n"],"mappings":";;;;;;AAEO,IAAMA,gBAAgD,GAAG,CAC5D;EACIC,IAAI,EAAE,WAAW;EACjBC,KAAK,EAAE,2BAA2B;EAClCC,WAAW,EAAE,0DAA0D;EACvEC,cAAc,EAAE,2CAA2C;EAC3DC,SAAS,EAAE,CACP;IACIJ,IAAI,EAAE,OAAO;IACbE,WAAW,EAAE;EACjB,CAAC;AAET,CAAC,EACD;EACIF,IAAI,EAAE,WAAW;EACjBC,KAAK,EAAE,2BAA2B;EAClCC,WAAW,EAAE,yDAAyD;EACtEC,cAAc,EAAE,2CAA2C;EAC3DC,SAAS,EAAE,CACP;IACIJ,IAAI,EAAE,OAAO;IACbE,WAAW,EAAE;EACjB,CAAC;AAET,CAAC,CACJ;AAAC"}

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

@@ -0,0 +1,2 @@
+import { CmsEditorFieldTypePlugin } from "../../../types";
+export declare const dynamicZoneField: CmsEditorFieldTypePlugin;

package/admin/plugins/fields/dynamicZone.js

@@ -0,0 +1,83 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.dynamicZoneField = void 0;
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+var _react = _interopRequireDefault(require("react"));
+var _dynamic_form = require("@material-design-icons/svg/outlined/dynamic_form.svg");
+var _i18n = require("@webiny/app/i18n");
+var _DynamicZone = require("./dynamicZone/DynamicZone");
+var _createFieldsList = require("../../graphql/createFieldsList");
+var _createTypeName = require("../../../utils/createTypeName");
+var _commonValidators = require("./dynamicZone/commonValidators");
+var _templateObject, _templateObject2, _templateObject3;
+var t = _i18n.i18n.ns("app-headless-cms/admin/fields");
+var listValidators = {
+  validators: _commonValidators.commonValidators,
+  title: "List validators",
+  description: "These validators are applied to the entire dynamic zone."
+};
+var dynamicZoneField = {
+  type: "cms-editor-field-type",
+  name: "cms-editor-field-type-dynamic-zone",
+  field: {
+    type: "dynamicZone",
+    label: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Dynamic Zone"]))),
+    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Define content templates to be used during content creation."]))),
+    icon: /*#__PURE__*/_react.default.createElement(_dynamic_form.ReactComponent, null),
+    allowMultipleValues: true,
+    allowPredefinedValues: false,
+    validators: function validators(field) {
+      if (field.multipleValues) {
+        return {
+          validators: ["dynamicZone"],
+          title: "Template Validators",
+          description: "Validators for each of the templates in this dynamic zone."
+        };
+      }
+      return ["required"];
+    },
+    listValidators: listValidators,
+    canAccept: function canAccept(_, draggable) {
+      return draggable.fieldType !== "dynamicZone";
+    },
+    multipleValuesLabel: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Use as a list of values"]))),
+    createField: function createField() {
+      return {
+        type: this.type,
+        listValidation: [{
+          name: "dynamicZone"
+        }],
+        settings: {
+          templates: []
+        },
+        renderer: {
+          name: "dynamicZone"
+        }
+      };
+    },
+    render: function render() {
+      return /*#__PURE__*/_react.default.createElement(_DynamicZone.DynamicZone, null);
+    },
+    graphql: {
+      queryField: function queryField(_ref) {
+        var _field$settings;
+        var model = _ref.model,
+          field = _ref.field;
+        var prefix = "".concat((0, _createTypeName.createTypeName)(model.modelId), "_").concat((0, _createTypeName.createTypeName)(field.fieldId));
+        var templates = ((_field$settings = field.settings) === null || _field$settings === void 0 ? void 0 : _field$settings.templates) || [];
+        var fragments = templates.map(function (template) {
+          return "...on ".concat(prefix, "_").concat(template.gqlTypeName, " {\n                        ").concat((0, _createFieldsList.createFieldsList)({
+            model: model,
+            fields: template.fields || []
+          }), "\n                        _templateId \n                        __typename\n                    }");
+        });
+        return "{ ".concat(fragments.join("\n"), " }");
+      }
+    }
+  }
+};
+exports.dynamicZoneField = dynamicZoneField;

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

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","ns","listValidators","validators","commonValidators","title","description","dynamicZoneField","type","name","field","label","icon","allowMultipleValues","allowPredefinedValues","multipleValues","canAccept","_","draggable","fieldType","multipleValuesLabel","createField","listValidation","settings","templates","renderer","render","graphql","queryField","model","prefix","createTypeName","modelId","fieldId","fragments","map","template","gqlTypeName","createFieldsList","fields","join"],"sources":["dynamicZone.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as ObjectIcon } from \"@material-design-icons/svg/outlined/dynamic_form.svg\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { DynamicZone } from \"~/admin/plugins/fields/dynamicZone/DynamicZone\";\nimport { createFieldsList } from \"~/admin/graphql/createFieldsList\";\nimport { createTypeName } from \"~/utils/createTypeName\";\nimport { CmsEditorFieldTypePlugin, CmsModelFieldValidatorsGroup } from \"~/types\";\nimport { commonValidators } from \"./dynamicZone/commonValidators\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/fields\");\n\nconst listValidators: CmsModelFieldValidatorsGroup = {\n    validators: commonValidators,\n    title: \"List validators\",\n    description: \"These validators are applied to the entire dynamic zone.\"\n};\n\nexport const dynamicZoneField: CmsEditorFieldTypePlugin = {\n    type: \"cms-editor-field-type\",\n    name: \"cms-editor-field-type-dynamic-zone\",\n    field: {\n        type: \"dynamicZone\",\n        label: t`Dynamic Zone`,\n        description: t`Define content templates to be used during content creation.`,\n        icon: <ObjectIcon />,\n        allowMultipleValues: true,\n        allowPredefinedValues: false,\n        validators: field => {\n            if (field.multipleValues) {\n                return {\n                    validators: [\"dynamicZone\"],\n                    title: \"Template Validators\",\n                    description: \"Validators for each of the templates in this dynamic zone.\"\n                };\n            }\n\n            return [\"required\"];\n        },\n        listValidators,\n        canAccept(_, draggable) {\n            return draggable.fieldType !== \"dynamicZone\";\n        },\n        multipleValuesLabel: t`Use as a list of values`,\n        createField() {\n            return {\n                type: this.type,\n                listValidation: [{ name: \"dynamicZone\" }],\n                settings: {\n                    templates: []\n                },\n                renderer: {\n                    name: \"dynamicZone\"\n                }\n            };\n        },\n        render() {\n            return <DynamicZone />;\n        },\n        graphql: {\n            queryField({ model, field }) {\n                const prefix = `${createTypeName(model.modelId)}_${createTypeName(field.fieldId)}`;\n                const templates = field.settings?.templates || [];\n\n                const fragments = templates.map(template => {\n                    return `...on ${prefix}_${template.gqlTypeName} {\n                        ${createFieldsList({ model, fields: template.fields || [] })}\n                        _templateId \n                        __typename\n                    }`;\n                });\n                return `{ ${fragments.join(\"\\n\")} }`;\n            }\n        }\n    }\n};\n"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAEA;AAAkE;AAElE,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,+BAA+B,CAAC;AAElD,IAAMC,cAA4C,GAAG;EACjDC,UAAU,EAAEC,kCAAgB;EAC5BC,KAAK,EAAE,iBAAiB;EACxBC,WAAW,EAAE;AACjB,CAAC;AAEM,IAAMC,gBAA0C,GAAG;EACtDC,IAAI,EAAE,uBAAuB;EAC7BC,IAAI,EAAE,oCAAoC;EAC1CC,KAAK,EAAE;IACHF,IAAI,EAAE,aAAa;IACnBG,KAAK,EAAEZ,CAAC,+FAAc;IACtBO,WAAW,EAAEP,CAAC,iJAA8D;IAC5Ea,IAAI,eAAE,6BAAC,4BAAU,OAAG;IACpBC,mBAAmB,EAAE,IAAI;IACzBC,qBAAqB,EAAE,KAAK;IAC5BX,UAAU,EAAE,oBAAAO,KAAK,EAAI;MACjB,IAAIA,KAAK,CAACK,cAAc,EAAE;QACtB,OAAO;UACHZ,UAAU,EAAE,CAAC,aAAa,CAAC;UAC3BE,KAAK,EAAE,qBAAqB;UAC5BC,WAAW,EAAE;QACjB,CAAC;MACL;MAEA,OAAO,CAAC,UAAU,CAAC;IACvB,CAAC;IACDJ,cAAc,EAAdA,cAAc;IACdc,SAAS,qBAACC,CAAC,EAAEC,SAAS,EAAE;MACpB,OAAOA,SAAS,CAACC,SAAS,KAAK,aAAa;IAChD,CAAC;IACDC,mBAAmB,EAAErB,CAAC,4GAAyB;IAC/CsB,WAAW,yBAAG;MACV,OAAO;QACHb,IAAI,EAAE,IAAI,CAACA,IAAI;QACfc,cAAc,EAAE,CAAC;UAAEb,IAAI,EAAE;QAAc,CAAC,CAAC;QACzCc,QAAQ,EAAE;UACNC,SAAS,EAAE;QACf,CAAC;QACDC,QAAQ,EAAE;UACNhB,IAAI,EAAE;QACV;MACJ,CAAC;IACL,CAAC;IACDiB,MAAM,oBAAG;MACL,oBAAO,6BAAC,wBAAW,OAAG;IAC1B,CAAC;IACDC,OAAO,EAAE;MACLC,UAAU,4BAAmB;QAAA;QAAA,IAAhBC,KAAK,QAALA,KAAK;UAAEnB,KAAK,QAALA,KAAK;QACrB,IAAMoB,MAAM,aAAM,IAAAC,8BAAc,EAACF,KAAK,CAACG,OAAO,CAAC,cAAI,IAAAD,8BAAc,EAACrB,KAAK,CAACuB,OAAO,CAAC,CAAE;QAClF,IAAMT,SAAS,GAAG,oBAAAd,KAAK,CAACa,QAAQ,oDAAd,gBAAgBC,SAAS,KAAI,EAAE;QAEjD,IAAMU,SAAS,GAAGV,SAAS,CAACW,GAAG,CAAC,UAAAC,QAAQ,EAAI;UACxC,uBAAgBN,MAAM,cAAIM,QAAQ,CAACC,WAAW,yCACxC,IAAAC,kCAAgB,EAAC;YAAET,KAAK,EAALA,KAAK;YAAEU,MAAM,EAAEH,QAAQ,CAACG,MAAM,IAAI;UAAG,CAAC,CAAC;QAIpE,CAAC,CAAC;QACF,mBAAYL,SAAS,CAACM,IAAI,CAAC,IAAI,CAAC;MACpC;IACJ;EACJ;AACJ,CAAC;AAAC"}

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

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

package/admin/plugins/fields/file.js

@@ -1,26 +1,32 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+"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 _file_present = require("@material-design-icons/svg/outlined/file_present.svg");
+var _i18n = require("@webiny/app/i18n");
+var _Grid = require("@webiny/ui/Grid");
+var _Switch = require("@webiny/ui/Switch");
+var _form = require("@webiny/form");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-
-import React from "react";
-import { ReactComponent as FileIcon } from "@svgr/webpack!./icons/round_insert_drive_file-24px.svg";
-import { i18n } from "@webiny/app/i18n";
-import { Cell, Grid } from "@webiny/ui/Grid";
-import { Radio } from "@webiny/ui/Radio";
-var t = i18n.ns("app-headless-cms/admin/fields");
+var t = _i18n.i18n.ns("app-headless-cms/admin/fields");
 var plugin = {
   type: "cms-editor-field-type",
   name: "cms-editor-field-type-file",
   field: {
     type: "file",
-    label: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Files"]))),
-    description: t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Images, videos and other files."]))),
-    icon: /*#__PURE__*/React.createElement(FileIcon, null),
+    label: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Files"]))),
+    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Images, videos and other files."]))),
+    icon: /*#__PURE__*/_react.default.createElement(_file_present.ReactComponent, null),
     validators: ["required"],
     listValidators: ["minLength", "maxLength"],
     allowMultipleValues: true,
     allowPredefinedValues: false,
-    multipleValuesLabel: t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["Use as a list of files or an image gallery"]))),
+    multipleValuesLabel: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Use as a list of files or an image gallery"]))),
     createField: function createField() {
       return {
         type: this.type,
@@ -30,17 +36,17 @@ var plugin = {
         }
       };
     },
-    renderSettings: function renderSettings(_ref) {
-      var Bind = _ref.form.Bind;
-      return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Cell, {
+    renderSettings: function renderSettings() {
+      return /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
         span: 12
-      }, /*#__PURE__*/React.createElement(Bind, {
+      }, /*#__PURE__*/_react.default.createElement(_form.Bind, {
         name: "settings.imagesOnly"
-      }, /*#__PURE__*/React.createElement(Radio, {
-        label: t(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["Images only"]))),
-        description: t(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["Allow only images to be selected"])))
+      }, /*#__PURE__*/_react.default.createElement(_Switch.Switch, {
+        label: t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Images only"]))),
+        description: t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Allow only images to be selected"])))
       }))));
     }
   }
 };
-export default plugin;
+var _default = plugin;
+exports.default = _default;

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

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","ns","plugin","type","name","field","label","description","icon","validators","listValidators","allowMultipleValues","allowPredefinedValues","multipleValuesLabel","createField","validation","renderer","renderSettings"],"sources":["file.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as FileIcon } from \"@material-design-icons/svg/outlined/file_present.svg\";\nimport { CmsModelFieldTypePlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Cell, Grid } from \"@webiny/ui/Grid\";\nimport { Switch } from \"@webiny/ui/Switch\";\nimport { Bind } from \"@webiny/form\";\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-file\",\n    field: {\n        type: \"file\",\n        label: t`Files`,\n        description: t`Images, videos and other files.`,\n        icon: <FileIcon />,\n        validators: [\"required\"],\n        listValidators: [\"minLength\", \"maxLength\"],\n        allowMultipleValues: true,\n        allowPredefinedValues: false,\n        multipleValuesLabel: t`Use as a list of files or an image gallery`,\n        createField() {\n            return {\n                type: this.type,\n                validation: [],\n                renderer: {\n                    name: \"\"\n                }\n            };\n        },\n        renderSettings: () => {\n            return (\n                <Grid>\n                    <Cell span={12}>\n                        <Bind name={\"settings.imagesOnly\"}>\n                            <Switch\n                                label={t`Images only`}\n                                description={t`Allow only images to be selected`}\n                            />\n                        </Bind>\n                    </Cell>\n                </Grid>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AAAoC;AAEpC,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,+BAA+B,CAAC;AAElD,IAAMC,MAA+B,GAAG;EACpCC,IAAI,EAAE,uBAAuB;EAC7BC,IAAI,EAAE,4BAA4B;EAClCC,KAAK,EAAE;IACHF,IAAI,EAAE,MAAM;IACZG,KAAK,EAAEP,CAAC,wFAAO;IACfQ,WAAW,EAAER,CAAC,oHAAiC;IAC/CS,IAAI,eAAE,6BAAC,4BAAQ,OAAG;IAClBC,UAAU,EAAE,CAAC,UAAU,CAAC;IACxBC,cAAc,EAAE,CAAC,WAAW,EAAE,WAAW,CAAC;IAC1CC,mBAAmB,EAAE,IAAI;IACzBC,qBAAqB,EAAE,KAAK;IAC5BC,mBAAmB,EAAEd,CAAC,+HAA4C;IAClEe,WAAW,yBAAG;MACV,OAAO;QACHX,IAAI,EAAE,IAAI,CAACA,IAAI;QACfY,UAAU,EAAE,EAAE;QACdC,QAAQ,EAAE;UACNZ,IAAI,EAAE;QACV;MACJ,CAAC;IACL,CAAC;IACDa,cAAc,EAAE,0BAAM;MAClB,oBACI,6BAAC,UAAI,qBACD,6BAAC,UAAI;QAAC,IAAI,EAAE;MAAG,gBACX,6BAAC,UAAI;QAAC,IAAI,EAAE;MAAsB,gBAC9B,6BAAC,cAAM;QACH,KAAK,EAAElB,CAAC,gGAAc;QACtB,WAAW,EAAEA,CAAC;MAAmC,EACnD,CACC,CACJ,CACJ;IAEf;EACJ;AACJ,CAAC;AAAC,eAEaG,MAAM;AAAA"}

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

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

package/admin/plugins/fields/longText.js

@@ -1,26 +1,32 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+"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 _roundNotes = require("./icons/round-notes.svg");
+var _Grid = require("@webiny/ui/Grid");
+var _Input = require("@webiny/ui/Input");
+var _i18n = require("@webiny/app/i18n");
+var _form = require("@webiny/form");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-
-import React from "react";
-import { ReactComponent as LongTextIcon } from "@svgr/webpack!./icons/round-notes.svg";
-import { Grid, Cell } from "@webiny/ui/Grid";
-import { Input } from "@webiny/ui/Input";
-import { i18n } from "@webiny/app/i18n";
-var t = i18n.ns("app-headless-cms/admin/fields");
+var t = _i18n.i18n.ns("app-headless-cms/admin/fields");
 var plugin = {
   type: "cms-editor-field-type",
   name: "cms-editor-field-type-long-text",
   field: {
     type: "long-text",
     validators: ["required", "minLength", "maxLength", "pattern"],
-    label: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Long text"]))),
-    description: t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Long comments, notes, multi line values."]))),
-    icon: /*#__PURE__*/React.createElement(LongTextIcon, null),
+    label: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Long text"]))),
+    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Long comments, notes, multi line values."]))),
+    icon: /*#__PURE__*/_react.default.createElement(_roundNotes.ReactComponent, null),
     allowMultipleValues: true,
     allowPredefinedValues: false,
     // TODO: implement "renderPredefinedValues" and set to true.
-    multipleValuesLabel: t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["Use as a list of long texts"]))),
+    multipleValuesLabel: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Use as a list of long texts"]))),
     createField: function createField() {
       return {
         type: this.type,
@@ -30,17 +36,17 @@ var plugin = {
         }
       };
     },
-    renderSettings: function renderSettings(_ref) {
-      var Bind = _ref.form.Bind;
-      return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Cell, {
+    renderSettings: function renderSettings() {
+      return /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
         span: 12
-      }, /*#__PURE__*/React.createElement(Bind, {
+      }, /*#__PURE__*/_react.default.createElement(_form.Bind, {
         name: "placeholderText"
-      }, /*#__PURE__*/React.createElement(Input, {
-        label: t(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["Placeholder text"]))),
-        description: t(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["Placeholder text (optional)"])))
+      }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+        label: t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Placeholder text"]))),
+        description: t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Placeholder text (optional)"])))
       }))));
     }
   }
 };
-export default plugin;
+var _default = plugin;
+exports.default = _default;

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

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","ns","plugin","type","name","field","validators","label","description","icon","allowMultipleValues","allowPredefinedValues","multipleValuesLabel","createField","validation","renderer","renderSettings"],"sources":["longText.tsx"],"sourcesContent":["import React from \"react\";\nimport { ReactComponent as LongTextIcon } from \"./icons/round-notes.svg\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { CmsModelFieldTypePlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Bind } from \"@webiny/form\";\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-long-text\",\n    field: {\n        type: \"long-text\",\n        validators: [\"required\", \"minLength\", \"maxLength\", \"pattern\"],\n        label: t`Long text`,\n        description: t`Long comments, notes, multi line values.`,\n        icon: <LongTextIcon />,\n        allowMultipleValues: true,\n        allowPredefinedValues: false, // TODO: implement \"renderPredefinedValues\" and set to true.\n        multipleValuesLabel: t`Use as a list of long texts`,\n        createField() {\n            return {\n                type: this.type,\n                validation: [],\n                renderer: {\n                    name: \"\"\n                }\n            };\n        },\n        renderSettings() {\n            return (\n                <Grid>\n                    <Cell span={12}>\n                        <Bind name={\"placeholderText\"}>\n                            <Input\n                                label={t`Placeholder text`}\n                                description={t`Placeholder text (optional)`}\n                            />\n                        </Bind>\n                    </Cell>\n                </Grid>\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA;AAEA;AACA;AAAoC;AAEpC,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,+BAA+B,CAAC;AAElD,IAAMC,MAA+B,GAAG;EACpCC,IAAI,EAAE,uBAAuB;EAC7BC,IAAI,EAAE,iCAAiC;EACvCC,KAAK,EAAE;IACHF,IAAI,EAAE,WAAW;IACjBG,UAAU,EAAE,CAAC,UAAU,EAAE,WAAW,EAAE,WAAW,EAAE,SAAS,CAAC;IAC7DC,KAAK,EAAER,CAAC,4FAAW;IACnBS,WAAW,EAAET,CAAC,6HAA0C;IACxDU,IAAI,eAAE,6BAAC,0BAAY,OAAG;IACtBC,mBAAmB,EAAE,IAAI;IACzBC,qBAAqB,EAAE,KAAK;IAAE;IAC9BC,mBAAmB,EAAEb,CAAC,gHAA6B;IACnDc,WAAW,yBAAG;MACV,OAAO;QACHV,IAAI,EAAE,IAAI,CAACA,IAAI;QACfW,UAAU,EAAE,EAAE;QACdC,QAAQ,EAAE;UACNX,IAAI,EAAE;QACV;MACJ,CAAC;IACL,CAAC;IACDY,cAAc,4BAAG;MACb,oBACI,6BAAC,UAAI,qBACD,6BAAC,UAAI;QAAC,IAAI,EAAE;MAAG,gBACX,6BAAC,UAAI;QAAC,IAAI,EAAE;MAAkB,gBAC1B,6BAAC,YAAK;QACF,KAAK,EAAEjB,CAAC,qGAAmB;QAC3B,WAAW,EAAEA,CAAC;MAA8B,EAC9C,CACC,CACJ,CACJ;IAEf;EACJ;AACJ,CAAC;AAAC,eAEaG,MAAM;AAAA"}

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

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

package/admin/plugins/fields/number.js

@@ -1,26 +1,32 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
+"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 _Grid = require("@webiny/ui/Grid");
+var _i18n = require("@webiny/app/i18n");
+var _Input = require("@webiny/ui/Input");
+var _PredefinedValuesDynamicFieldset = _interopRequireDefault(require("./PredefinedValuesDynamicFieldset"));
+var _looks_ = require("@material-design-icons/svg/outlined/looks_3.svg");
+var _form = require("@webiny/form");
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-
-import React from "react";
-import { Grid, Cell } from "@webiny/ui/Grid";
-import { i18n } from "@webiny/app/i18n";
-import { Input } from "@webiny/ui/Input";
-import PredefinedValuesDynamicFieldset from "./PredefinedValuesDynamicFieldset";
-import { ReactComponent as FloatIcon } from "@svgr/webpack!./icons/round-looks_3-24px.svg";
-var t = i18n.ns("app-headless-cms/admin/fields");
+var t = _i18n.i18n.ns("app-headless-cms/admin/fields");
 var plugin = {
   type: "cms-editor-field-type",
   name: "cms-editor-field-type-number",
   field: {
     type: "number",
-    label: t(_templateObject || (_templateObject = _taggedTemplateLiteral(["Number"]))),
-    description: t(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["Store numbers."]))),
-    icon: /*#__PURE__*/React.createElement(FloatIcon, null),
+    label: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Number"]))),
+    description: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Store numbers."]))),
+    icon: /*#__PURE__*/_react.default.createElement(_looks_.ReactComponent, null),
     validators: ["required", "gte", "lte"],
     allowMultipleValues: true,
     allowPredefinedValues: true,
-    multipleValuesLabel: t(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["Use as a list of numbers"]))),
+    multipleValuesLabel: t(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["Use as a list of numbers"]))),
     createField: function createField() {
       return {
         type: this.type,
@@ -30,26 +36,25 @@ var plugin = {
         }
       };
     },
-    renderSettings: function renderSettings(_ref) {
-      var Bind = _ref.form.Bind;
-      return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Cell, {
+    renderSettings: function renderSettings() {
+      return /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
         span: 12
-      }, /*#__PURE__*/React.createElement(Bind, {
+      }, /*#__PURE__*/_react.default.createElement(_form.Bind, {
         name: "placeholderText"
-      }, /*#__PURE__*/React.createElement(Input, {
-        label: t(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["Placeholder text"]))),
-        description: t(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["Placeholder text (optional)"])))
+      }, /*#__PURE__*/_react.default.createElement(_Input.Input, {
+        label: t(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["Placeholder text"]))),
+        description: t(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["Placeholder text (optional)"])))
       }))));
     },
     renderPredefinedValues: function renderPredefinedValues(props) {
-      return /*#__PURE__*/React.createElement(PredefinedValuesDynamicFieldset, Object.assign({}, props, {
+      return /*#__PURE__*/_react.default.createElement(_PredefinedValuesDynamicFieldset.default, Object.assign({}, props, {
         renderValueInput: function renderValueInput(Bind) {
-          return /*#__PURE__*/React.createElement(Bind, {
+          return /*#__PURE__*/_react.default.createElement(Bind, {
             name: "value"
           }, function (bind) {
-            return /*#__PURE__*/React.createElement(Input, Object.assign({}, bind, {
+            return /*#__PURE__*/_react.default.createElement(_Input.Input, Object.assign({}, bind, {
               type: "number",
-              label: t(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["Value"]))),
+              label: t(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["Value"]))),
               onChange: function onChange(value) {
                 return bind.onChange(parseFloat(value));
               }
@@ -60,4 +65,5 @@ var plugin = {
     }
   }
 };
-export default plugin;
+var _default = plugin;
+exports.default = _default;

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

@@ -0,0 +1 @@
+{"version":3,"names":["t","i18n","ns","plugin","type","name","field","label","description","icon","validators","allowMultipleValues","allowPredefinedValues","multipleValuesLabel","createField","validation","renderer","renderSettings","renderPredefinedValues","props","Bind","bind","value","onChange","parseFloat"],"sources":["number.tsx"],"sourcesContent":["import React from \"react\";\nimport { Grid, Cell } from \"@webiny/ui/Grid\";\nimport { CmsModelFieldTypePlugin } from \"~/types\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { Input } from \"@webiny/ui/Input\";\nimport PredefinedValuesDynamicFieldset from \"./PredefinedValuesDynamicFieldset\";\nimport { ReactComponent as FloatIcon } from \"@material-design-icons/svg/outlined/looks_3.svg\";\nimport { Bind } from \"@webiny/form\";\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-number\",\n    field: {\n        type: \"number\",\n        label: t`Number`,\n        description: t`Store numbers.`,\n        icon: <FloatIcon />,\n        validators: [\"required\", \"gte\", \"lte\"],\n        allowMultipleValues: true,\n        allowPredefinedValues: true,\n        multipleValuesLabel: t`Use as a list of numbers`,\n        createField() {\n            return {\n                type: this.type,\n                validation: [],\n                renderer: {\n                    name: \"\"\n                }\n            };\n        },\n        renderSettings() {\n            return (\n                <Grid>\n                    <Cell span={12}>\n                        <Bind name={\"placeholderText\"}>\n                            <Input\n                                label={t`Placeholder text`}\n                                description={t`Placeholder text (optional)`}\n                            />\n                        </Bind>\n                    </Cell>\n                </Grid>\n            );\n        },\n        renderPredefinedValues(props) {\n            return (\n                <PredefinedValuesDynamicFieldset\n                    {...props}\n                    renderValueInput={Bind => (\n                        <Bind name={\"value\"}>\n                            {bind => (\n                                <Input\n                                    {...bind}\n                                    type=\"number\"\n                                    label={t`Value`}\n                                    onChange={value => bind.onChange(parseFloat(value))}\n                                />\n                            )}\n                        </Bind>\n                    )}\n                />\n            );\n        }\n    }\n};\n\nexport default plugin;\n"],"mappings":";;;;;;;;AAAA;AACA;AAEA;AACA;AACA;AACA;AACA;AAAoC;AAEpC,IAAMA,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,yFAAQ;IAChBQ,WAAW,EAAER,CAAC,mGAAgB;IAC9BS,IAAI,eAAE,6BAAC,sBAAS,OAAG;IACnBC,UAAU,EAAE,CAAC,UAAU,EAAE,KAAK,EAAE,KAAK,CAAC;IACtCC,mBAAmB,EAAE,IAAI;IACzBC,qBAAqB,EAAE,IAAI;IAC3BC,mBAAmB,EAAEb,CAAC,6GAA0B;IAChDc,WAAW,yBAAG;MACV,OAAO;QACHV,IAAI,EAAE,IAAI,CAACA,IAAI;QACfW,UAAU,EAAE,EAAE;QACdC,QAAQ,EAAE;UACNX,IAAI,EAAE;QACV;MACJ,CAAC;IACL,CAAC;IACDY,cAAc,4BAAG;MACb,oBACI,6BAAC,UAAI,qBACD,6BAAC,UAAI;QAAC,IAAI,EAAE;MAAG,gBACX,6BAAC,UAAI;QAAC,IAAI,EAAE;MAAkB,gBAC1B,6BAAC,YAAK;QACF,KAAK,EAAEjB,CAAC,qGAAmB;QAC3B,WAAW,EAAEA,CAAC;MAA8B,EAC9C,CACC,CACJ,CACJ;IAEf,CAAC;IACDkB,sBAAsB,kCAACC,KAAK,EAAE;MAC1B,oBACI,6BAAC,wCAA+B,oBACxBA,KAAK;QACT,gBAAgB,EAAE,0BAAAC,IAAI;UAAA,oBAClB,6BAAC,IAAI;YAAC,IAAI,EAAE;UAAQ,GACf,UAAAC,IAAI;YAAA,oBACD,6BAAC,YAAK,oBACEA,IAAI;cACR,IAAI,EAAC,QAAQ;cACb,KAAK,EAAErB,CAAC,0FAAQ;cAChB,QAAQ,EAAE,kBAAAsB,KAAK;gBAAA,OAAID,IAAI,CAACE,QAAQ,CAACC,UAAU,CAACF,KAAK,CAAC,CAAC;cAAA;YAAC,GACtD;UAAA,CACL,CACE;QAAA;MACT,GACJ;IAEV;EACJ;AACJ,CAAC;AAAC,eAEanB,MAAM;AAAA"}

package/admin/plugins/fields/object/ObjectFields.d.ts

@@ -1,4 +1,7 @@
-/// <reference types="react" />
-export declare const ObjectFields: ({ field }: {
-    field: any;
-}) => JSX.Element;
+import React from "react";
+import { CmsModelField } from "../../../../types";
+interface ObjectFieldsProps {
+    field: CmsModelField;
+}
+export declare const ObjectFields: React.FC<ObjectFieldsProps>;
+export {};