@webiny/app-headless-cms 5.24.0 → 5.25.0-beta.2

package/admin/components/ContentEntryForm/useContentEntryForm.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useContentEntryForm.ts"],"names":["useCallback","useMemo","useState","pick","useRouter","useSnackbar","createCreateFromMutation","createCreateMutation","createUpdateMutation","useMutation","GQLCache","prepareFormData","useContentEntry","plugins","convertDefaultValue","field","value","type","Boolean","Number","useContentEntryForm","params","listQueryVariables","contentModel","entry","history","showSnackbar","invalidFields","setInvalidFields","loading","setLoading","renderPlugins","byType","goToRevision","id","push","modelId","encodeURIComponent","CREATE_CONTENT","UPDATE_CONTENT","CREATE_CONTENT_FROM","createMutation","updateMutation","createFromMutation","setInvalidFieldValues","errors","values","reduce","acc","er","fieldId","error","resetInvalidFieldValues","createContent","data","variables","update","cache","response","content","message","addEntryToListCache","name","onSubmit","updateContent","revision","createContentFrom","formData","newRevision","updateLatestRevisionInListCache","addRevisionToRevisionsCache","fieldsIds","fields","map","item","gqlData","meta","isLocked","locked","getDefaultValues","overrides","settings","multipleValues","defaultValue","undefined","predefinedValues","enabled","Array","isArray","selectedValue","find","selected","filter","onChange"],"mappings":"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","sourcesContent":["import { Dispatch, SetStateAction, useCallback, useMemo, useState } from \"react\";\nimport pick from \"lodash/pick\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport { FormOnSubmit } from \"@webiny/form\";\nimport {\n    createCreateFromMutation,\n    createCreateMutation,\n    createUpdateMutation,\n    CmsEntryCreateMutationResponse,\n    CmsEntryCreateMutationVariables,\n    CmsEntryUpdateMutationResponse,\n    CmsEntryUpdateMutationVariables,\n    CmsEntryCreateFromMutationResponse,\n    CmsEntryCreateFromMutationVariables\n} from \"~/admin/graphql/contentEntries\";\nimport { useMutation } from \"~/admin/hooks\";\nimport * as GQLCache from \"~/admin/views/contentEntries/ContentEntry/cache\";\nimport { prepareFormData } from \"~/admin/views/contentEntries/ContentEntry/prepareFormData\";\nimport {\n    CmsEditorContentEntry,\n    CmsEditorContentModel,\n    CmsEditorField,\n    CmsEditorFieldRendererPlugin\n} from \"~/types\";\nimport { useContentEntry } from \"~/admin/views/contentEntries/hooks/useContentEntry\";\nimport { plugins } from \"@webiny/plugins\";\n\n/**\n * Used for some fields to convert their values.\n */\nconst convertDefaultValue = (field: CmsEditorField, value: any): string | number | boolean => {\n    switch (field.type) {\n        case \"boolean\":\n            return Boolean(value);\n        case \"number\":\n            return Number(value);\n        default:\n            return value;\n    }\n};\n\ninterface InvalidFieldError {\n    fieldId: string;\n    error: string;\n}\n\ninterface UseContentEntryForm {\n    data: Record<string, any>;\n    loading: boolean;\n    setLoading: Dispatch<SetStateAction<boolean>>;\n    onChange: FormOnSubmit;\n    onSubmit: (data: Record<string, any>) => void;\n    invalidFields: Record<string, string>;\n    renderPlugins: CmsEditorFieldRendererPlugin[];\n}\n\nexport interface UseContentEntryFormParams {\n    contentModel: CmsEditorContentModel;\n    entry: Partial<CmsEditorContentEntry>;\n    onChange?: FormOnSubmit;\n    onSubmit?: FormOnSubmit;\n    addEntryToListCache: boolean;\n}\n\nexport function useContentEntryForm(params: UseContentEntryFormParams): UseContentEntryForm {\n    const { listQueryVariables } = useContentEntry();\n    const { contentModel, entry } = params;\n    const { history } = useRouter();\n    const { showSnackbar } = useSnackbar();\n    const [invalidFields, setInvalidFields] = useState<Record<string, string>>({});\n    const [loading, setLoading] = useState(false);\n\n    const renderPlugins = useMemo(\n        () => plugins.byType<CmsEditorFieldRendererPlugin>(\"cms-editor-field-renderer\"),\n        []\n    );\n\n    const goToRevision = useCallback(id => {\n        history.push(`/cms/content-entries/${contentModel.modelId}?id=${encodeURIComponent(id)}`);\n    }, []);\n\n    const { CREATE_CONTENT, UPDATE_CONTENT, CREATE_CONTENT_FROM } = useMemo(() => {\n        return {\n            // LIST_CONTENT: createListQuery(contentModel),\n            CREATE_CONTENT: createCreateMutation(contentModel),\n            UPDATE_CONTENT: createUpdateMutation(contentModel),\n            CREATE_CONTENT_FROM: createCreateFromMutation(contentModel)\n        };\n    }, [contentModel.modelId]);\n\n    const [createMutation] = useMutation<\n        CmsEntryCreateMutationResponse,\n        CmsEntryCreateMutationVariables\n    >(CREATE_CONTENT);\n    const [updateMutation] = useMutation<\n        CmsEntryUpdateMutationResponse,\n        CmsEntryUpdateMutationVariables\n    >(UPDATE_CONTENT);\n    const [createFromMutation] = useMutation<\n        CmsEntryCreateFromMutationResponse,\n        CmsEntryCreateFromMutationVariables\n    >(CREATE_CONTENT_FROM);\n\n    /**\n     * Note that when passing error.data variable we cast as InvalidFieldError[] because we know it is so.\n     */\n    const setInvalidFieldValues = (errors?: InvalidFieldError[]): void => {\n        const values = (errors || []).reduce((acc, er) => {\n            acc[er.fieldId] = er.error;\n            return acc;\n        }, {} as Record<string, string>);\n        setInvalidFields(() => values);\n    };\n\n    const resetInvalidFieldValues = (): void => {\n        setInvalidFields(() => ({}));\n    };\n\n    const createContent = useCallback(\n        async data => {\n            setLoading(true);\n            const response = await createMutation({\n                variables: { data },\n                update(cache, response) {\n                    if (!response.data) {\n                        showSnackbar(\"Missing response data in Create Entry.\");\n                        return;\n                    }\n                    const { data } = response;\n                    const { data: entry, error } = data.content || {};\n                    if (error) {\n                        showSnackbar(error.message);\n                        setInvalidFieldValues(error.data as InvalidFieldError[]);\n                        return;\n                    } else if (!entry) {\n                        showSnackbar(\n                            \"Missing entry data in update callback on Create Entry Response.\"\n                        );\n                        return;\n                    }\n                    resetInvalidFieldValues();\n                    if (params.addEntryToListCache) {\n                        GQLCache.addEntryToListCache(\n                            contentModel,\n                            cache,\n                            entry,\n                            listQueryVariables\n                        );\n                    }\n                }\n            });\n            setLoading(false);\n\n            const { error, data: entry } = response.data?.content || {};\n            if (error) {\n                showSnackbar(error.message);\n                setInvalidFieldValues(error.data as InvalidFieldError[]);\n                return null;\n            } else if (!entry) {\n                showSnackbar(\"Missing entry data in Create Entry Response.\");\n                return null;\n            }\n            resetInvalidFieldValues();\n            showSnackbar(`${contentModel.name} entry created successfully!`);\n            if (typeof params.onSubmit === \"function\") {\n                params.onSubmit(entry);\n            } else {\n                goToRevision(entry.id);\n            }\n            return entry;\n        },\n        [contentModel.modelId, listQueryVariables, params.onSubmit, params.addEntryToListCache]\n    );\n\n    const updateContent = useCallback(\n        async (revision, data) => {\n            setLoading(true);\n            const response = await updateMutation({\n                variables: { revision, data }\n            });\n            setLoading(false);\n            if (!response.data) {\n                showSnackbar(\"Missing response data on Update Entry Response.\");\n                return;\n            }\n\n            const { error } = response.data.content;\n            if (error) {\n                showSnackbar(error.message);\n                setInvalidFieldValues(error.data as InvalidFieldError[]);\n                return null;\n            }\n\n            resetInvalidFieldValues();\n            showSnackbar(\"Content saved successfully.\");\n            const { data: entry } = response.data.content;\n            return entry;\n        },\n        [contentModel.modelId]\n    );\n\n    const createContentFrom = useCallback(\n        async (revision: string, formData: Record<string, any>) => {\n            setLoading(true);\n            const response = await createFromMutation({\n                variables: { revision, data: formData },\n                update(cache, response) {\n                    if (!response.data) {\n                        showSnackbar(\n                            \"Missing data in update callback on Create From Entry Response.\"\n                        );\n                        return;\n                    }\n                    const { data: newRevision, error } = response.data.content;\n                    if (error) {\n                        showSnackbar(error.message);\n                        setInvalidFieldValues(error.data as InvalidFieldError[]);\n                        return;\n                    } else if (!newRevision) {\n                        showSnackbar(\"Missing entry data in update callback on Create From Entry.\");\n                        return;\n                    }\n                    resetInvalidFieldValues();\n                    GQLCache.updateLatestRevisionInListCache(\n                        contentModel,\n                        cache,\n                        newRevision,\n                        listQueryVariables\n                    );\n                    GQLCache.addRevisionToRevisionsCache(contentModel, cache, newRevision);\n\n                    showSnackbar(\"A new revision was created!\");\n                    goToRevision(newRevision.id);\n                }\n            });\n            setLoading(false);\n\n            if (!response.data) {\n                showSnackbar(\"Missing response data on Create From Entry Mutation.\");\n                return;\n            }\n\n            const { data, error } = response.data.content;\n            if (error) {\n                showSnackbar(error.message);\n                setInvalidFieldValues(error.data as InvalidFieldError[]);\n                return null;\n            }\n            resetInvalidFieldValues();\n\n            return data;\n        },\n        [contentModel.modelId, listQueryVariables]\n    );\n\n    const onSubmit = async (data: Record<string, any>) => {\n        const fieldsIds = contentModel.fields.map(item => item.fieldId);\n        const formData = pick(data, [...fieldsIds]);\n\n        const gqlData = prepareFormData(formData, contentModel);\n        if (!entry.id) {\n            return createContent(gqlData);\n        }\n\n        const { meta } = entry;\n        const { locked: isLocked } = meta || {};\n\n        if (!isLocked) {\n            return updateContent(entry.id, gqlData);\n        }\n        return createContentFrom(entry.id, gqlData);\n    };\n\n    const getDefaultValues = (overrides: Record<string, any> = {}): Record<string, any> => {\n        const values: Record<string, any> = {};\n        /**\n         * Assign the default values:\n         * * check the settings.defaultValue\n         * * check the predefinedValues for selected value\n         */\n        for (const field of contentModel.fields) {\n            /**\n             * When checking if defaultValue is set in settings, we do the undefined check because it can be null, 0, empty string, false, etc...\n             */\n            const { settings, multipleValues = false } = field;\n            if (settings && settings.defaultValue !== undefined) {\n                /**\n                 * Special type of field is the boolean one.\n                 * We MUST set true/false for default value.\n                 */\n                values[field.fieldId] = convertDefaultValue(field, settings.defaultValue);\n                continue;\n            }\n            /**\n             * No point in going further if predefined values are not enabled.\n             */\n            const { predefinedValues } = field;\n            if (\n                !predefinedValues ||\n                !predefinedValues.enabled ||\n                Array.isArray(predefinedValues.values) === false\n            ) {\n                continue;\n            }\n            /**\n             * When field is not a multiple values one, we find the first possible default selected value and set it as field value.\n             */\n            if (!multipleValues) {\n                const selectedValue = predefinedValues.values.find(({ selected }) => {\n                    return !!selected;\n                });\n                if (selectedValue) {\n                    values[field.fieldId] = convertDefaultValue(field, selectedValue.value);\n                }\n                continue;\n            }\n            /**\n             *\n             */\n            values[field.fieldId] = predefinedValues.values\n                .filter(({ selected }) => !!selected)\n                .map(({ value }) => {\n                    return convertDefaultValue(field, value);\n                });\n        }\n        return { ...values, ...overrides };\n    };\n    return {\n        /**\n         * If entry is not set or entry.id does not exist, it means that form is for the new entry, so fetch default values.\n         */\n        data: entry && entry.id ? entry : getDefaultValues(),\n        loading,\n        setLoading,\n        onChange:\n            params.onChange ||\n            (() => {\n                return void 0;\n            }),\n        onSubmit,\n        invalidFields,\n        renderPlugins\n    };\n}\n"]}

package/admin/components/ContentEntryForm/useRenderPlugins.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useRenderPlugins.ts"],"names":["plugins","useMemo","useRenderPlugins","byType"],"mappings":"AAAA,SAASA,OAAT,QAAwB,iBAAxB;AACA,SAASC,OAAT,QAAwB,OAAxB;AAGA,OAAO,SAASC,gBAAT,GAA4B;AAC/B,SAAOD,OAAO,CACV;AAAA,WAAMD,OAAO,CAACG,MAAR,CAA6C,2BAA7C,CAAN;AAAA,GADU,EAEV,EAFU,CAAd;AAIH","sourcesContent":["import { plugins } from \"@webiny/plugins\";\nimport { useMemo } from \"react\";\nimport { CmsEditorFieldRendererPlugin } from \"~/types\";\n\nexport function useRenderPlugins() {\n    return useMemo(\n        () => plugins.byType<CmsEditorFieldRendererPlugin>(\"cms-editor-field-renderer\"),\n        []\n    );\n}\n"]}

package/admin/components/ContentModelEditor/Context.d.ts

@@ -1,19 +1,21 @@
 import React from "react";
 import { ApolloClient } from "apollo-client";
+import { GetCmsModelQueryResponse, UpdateCmsModelMutationResponse } from "../../graphql/contentModels";
 import { CmsEditorContentModel, CmsModel } from "../../../types";
-export interface Context {
+import { FetchResult } from "apollo-link";
+export interface ContentModelEditorProviderContext {
     apolloClient: ApolloClient<any>;
-    data: CmsEditorContentModel | null;
+    data: CmsEditorContentModel;
     isPristine: boolean;
-    getContentModel: (modelId: string) => Promise<any>;
-    saveContentModel: (data?: Record<string, any>) => Promise<any>;
+    getContentModel: (modelId: string) => Promise<FetchResult<GetCmsModelQueryResponse>>;
+    saveContentModel: (data?: CmsModel) => Promise<UpdateCmsModelMutationResponse["updateContentModel"]>;
     setData: (setter: (model: CmsModel) => void, saveContentModel?: boolean) => Promise<any>;
 }
-export declare const contentModelEditorContext: React.Context<Context>;
+export declare const contentModelEditorContext: React.Context<ContentModelEditorProviderContext>;
 interface State {
     modelId: string | null;
     isPristine: boolean;
-    data: CmsModel | null;
+    data: CmsModel;
 }
 interface Action {
     data: Partial<State> | Partial<CmsModel>;
@@ -25,7 +27,7 @@ interface Reducer {
 export declare const contentModelEditorReducer: Reducer;
 interface ContentModelEditorProviderProps {
     apolloClient: ApolloClient<any>;
-    modelId: string;
+    modelId?: string;
     children: React.ReactElement;
 }
 export declare const ContentModelEditorProvider: React.FC<ContentModelEditorProviderProps>;

package/admin/components/ContentModelEditor/Context.js

@@ -1,6 +1,6 @@
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 // TODO @ts-refactor verify that types are correct
 import React, { useEffect, useMemo, useReducer } from "react";
@@ -10,7 +10,82 @@ import { useRouter } from "@webiny/react-router";
 import { useSnackbar } from "@webiny/app-admin/hooks/useSnackbar";
 import { GET_CONTENT_MODEL, UPDATE_CONTENT_MODEL } from "../../graphql/contentModels";
 import { LIST_MENU_CONTENT_GROUPS_MODELS } from "../../viewsGraphql";
-export var contentModelEditorContext = /*#__PURE__*/React.createContext(null);
+export var contentModelEditorContext = /*#__PURE__*/React.createContext({
+  apolloClient: null,
+  data: null,
+  isPristine: false,
+  getContentModel: function () {
+    var _getContentModel = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              return _context.abrupt("return", {
+                data: null
+              });
+
+            case 1:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+
+    function getContentModel() {
+      return _getContentModel.apply(this, arguments);
+    }
+
+    return getContentModel;
+  }(),
+  saveContentModel: function () {
+    var _saveContentModel = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              return _context2.abrupt("return", {
+                data: null,
+                error: null
+              });
+
+            case 1:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+
+    function saveContentModel() {
+      return _saveContentModel.apply(this, arguments);
+    }
+
+    return saveContentModel;
+  }(),
+  setData: function () {
+    var _setData = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
+      return _regeneratorRuntime.wrap(function _callee3$(_context3) {
+        while (1) {
+          switch (_context3.prev = _context3.next) {
+            case 0:
+              return _context3.abrupt("return", void 0);
+
+            case 1:
+            case "end":
+              return _context3.stop();
+          }
+        }
+      }, _callee3);
+    }));
+
+    function setData() {
+      return _setData.apply(this, arguments);
+    }
+
+    return setData;
+  }()
+});
 export var contentModelEditorReducer = function contentModelEditorReducer(prev, action) {
   var data = action.data,
       type = action.type;
@@ -23,9 +98,10 @@ export var contentModelEditorReducer = function contentModelEditorReducer(prev,
       return _objectSpread(_objectSpread({}, prev), {}, {
         data: data
       });
-  }
 
-  return prev;
+    default:
+      return prev;
+  }
 };
 /**
  * Cleanup is required because backend always expects string value in predefined values entries
@@ -71,7 +147,7 @@ export var ContentModelEditorProvider = function ContentModelEditorProvider(_ref
       modelId = _ref3.modelId;
 
   var _useReducer = useReducer(contentModelEditorReducer, {
-    modelId: modelId,
+    modelId: modelId || null,
     isPristine: true,
     data: null
   }),
@@ -95,18 +171,18 @@ export var ContentModelEditorProvider = function ContentModelEditorProvider(_ref
   };
 
   var saveContentModel = /*#__PURE__*/function () {
-    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(data) {
+    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee4(data) {
       var modelData, response;
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
+      return _regeneratorRuntime.wrap(function _callee4$(_context4) {
         while (1) {
-          switch (_context.prev = _context.next) {
+          switch (_context4.prev = _context4.next) {
             case 0:
               if (!data) {
                 data = state.data;
               }
 
               modelData = pick(data, ["group", "layout", "fields", "name", "settings", "description", "titleFieldId"]);
-              _context.next = 4;
+              _context4.next = 4;
               return apolloClient.mutate({
                 mutation: UPDATE_CONTENT_MODEL,
                 variables: {
@@ -119,16 +195,28 @@ export var ContentModelEditorProvider = function ContentModelEditorProvider(_ref
               });
 
             case 4:
-              response = _context.sent;
+              response = _context4.sent;
               setPristine(true);
-              return _context.abrupt("return", get(response, "data.updateContentModel"));
 
-            case 7:
+              if (!(!response.data || !response.data.updateContentModel)) {
+                _context4.next = 8;
+                break;
+              }
+
+              return _context4.abrupt("return", {
+                data: null,
+                error: null
+              });
+
+            case 8:
+              return _context4.abrupt("return", response.data.updateContentModel);
+
+            case 9:
             case "end":
-              return _context.stop();
+              return _context4.stop();
           }
         }
-      }, _callee);
+      }, _callee4);
     }));
 
     return function saveContentModel(_x) {
@@ -141,26 +229,56 @@ export var ContentModelEditorProvider = function ContentModelEditorProvider(_ref
    */
 
 
-  var setData = function setData(setter) {
-    var saveModel = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-    setPristine(false);
-    var data = setter(state.data);
-    dispatch({
-      type: "data",
-      data: data
-    });
-    return saveModel !== false && saveContentModel(data);
-  };
+  var setData = /*#__PURE__*/function () {
+    var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee5(setter) {
+      var saveModel,
+          data,
+          _args5 = arguments;
+      return _regeneratorRuntime.wrap(function _callee5$(_context5) {
+        while (1) {
+          switch (_context5.prev = _context5.next) {
+            case 0:
+              saveModel = _args5.length > 1 && _args5[1] !== undefined ? _args5[1] : false;
+              setPristine(false);
+              data = setter(state.data);
+              dispatch({
+                type: "data",
+                data: data
+              });
+
+              if (saveModel) {
+                _context5.next = 6;
+                break;
+              }
+
+              return _context5.abrupt("return");
+
+            case 6:
+              _context5.next = 8;
+              return saveContentModel(data);
+
+            case 8:
+            case "end":
+              return _context5.stop();
+          }
+        }
+      }, _callee5);
+    }));
+
+    return function setData(_x2) {
+      return _ref5.apply(this, arguments);
+    };
+  }();
 
   var getContentModel = /*#__PURE__*/function () {
-    var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(modelId) {
+    var _ref6 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee6(modelId) {
       var response, _get, data, error;
 
-      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+      return _regeneratorRuntime.wrap(function _callee6$(_context6) {
         while (1) {
-          switch (_context2.prev = _context2.next) {
+          switch (_context6.prev = _context6.next) {
             case 0:
-              _context2.next = 2;
+              _context6.next = 2;
               return apolloClient.query({
                 query: GET_CONTENT_MODEL,
                 variables: {
@@ -169,40 +287,44 @@ export var ContentModelEditorProvider = function ContentModelEditorProvider(_ref
               });
 
             case 2:
-              response = _context2.sent;
+              response = _context6.sent;
               _get = get(response, "data.getContentModel"), data = _get.data, error = _get.error;
 
               if (!error) {
-                _context2.next = 6;
+                _context6.next = 6;
                 break;
               }
 
               throw new Error(error);
 
             case 6:
-              _context2.next = 8;
+              _context6.next = 8;
               return setData(function () {
                 return data;
               }, false);
 
             case 8:
               setPristine(true);
-              return _context2.abrupt("return", response);
+              return _context6.abrupt("return", response);
 
             case 10:
             case "end":
-              return _context2.stop();
+              return _context6.stop();
           }
         }
-      }, _callee2);
+      }, _callee6);
     }));
 
-    return function getContentModel(_x2) {
-      return _ref5.apply(this, arguments);
+    return function getContentModel(_x3) {
+      return _ref6.apply(this, arguments);
     };
   }();
 
   useEffect(function () {
+    if (!modelId) {
+      return;
+    }
+
     getContentModel(modelId).catch(function () {
       history.push("/cms/content-models");
       showSnackbar("Could not load content model with given ID.");

package/admin/components/ContentModelEditor/Context.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Context.tsx"],"names":["React","useEffect","useMemo","useReducer","get","pick","useRouter","useSnackbar","GET_CONTENT_MODEL","UPDATE_CONTENT_MODEL","LIST_MENU_CONTENT_GROUPS_MODELS","contentModelEditorContext","createContext","apolloClient","data","isPristine","getContentModel","saveContentModel","error","setData","contentModelEditorReducer","prev","action","type","cleanupModelDataFields","fields","map","field","predefinedValues","enabled","values","label","value","selected","String","cleanupModelData","ContentModelEditorProvider","children","modelId","state","dispatch","history","showSnackbar","setPristine","flag","modelData","mutate","mutation","variables","refetchQueries","query","response","updateContentModel","setter","saveModel","Error","catch","push","Provider"],"mappings":"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","sourcesContent":["// TODO @ts-refactor verify that types are correct\nimport React, { useEffect, useMemo, useReducer } from \"react\";\nimport get from \"lodash/get\";\nimport pick from \"lodash/pick\";\nimport { ApolloClient } from \"apollo-client\";\nimport { useRouter } from \"@webiny/react-router\";\nimport { useSnackbar } from \"@webiny/app-admin/hooks/useSnackbar\";\nimport {\n    GET_CONTENT_MODEL,\n    GetCmsModelQueryResponse,\n    GetCmsModelQueryVariables,\n    UPDATE_CONTENT_MODEL,\n    UpdateCmsModelMutationResponse,\n    UpdateCmsModelMutationVariables\n} from \"~/admin/graphql/contentModels\";\nimport { LIST_MENU_CONTENT_GROUPS_MODELS } from \"~/admin/viewsGraphql\";\nimport { CmsEditorContentModel, CmsEditorField, CmsModel } from \"~/types\";\nimport { FetchResult } from \"apollo-link\";\n\nexport interface ContentModelEditorProviderContext {\n    apolloClient: ApolloClient<any>;\n    data: CmsEditorContentModel;\n    isPristine: boolean;\n    getContentModel: (modelId: string) => Promise<FetchResult<GetCmsModelQueryResponse>>;\n    saveContentModel: (\n        data?: CmsModel\n    ) => Promise<UpdateCmsModelMutationResponse[\"updateContentModel\"]>;\n    setData: (setter: (model: CmsModel) => void, saveContentModel?: boolean) => Promise<any>;\n}\n\nexport const contentModelEditorContext = React.createContext<ContentModelEditorProviderContext>({\n    apolloClient: null as unknown as ApolloClient<any>,\n    data: null as unknown as CmsEditorContentModel,\n    isPristine: false,\n    getContentModel: async () => {\n        return {\n            data: null\n        };\n    },\n    saveContentModel: async () => {\n        return {\n            data: null,\n            error: null\n        };\n    },\n    setData: async () => {\n        return void 0;\n    }\n});\n\ntype PickedCmsEditorContentModel = Pick<\n    CmsEditorContentModel,\n    \"layout\" | \"fields\" | \"name\" | \"settings\" | \"description\" | \"titleFieldId\" | \"group\"\n>;\ninterface State {\n    modelId: string | null;\n    isPristine: boolean;\n    data: CmsModel;\n}\ninterface Action {\n    data: Partial<State> | Partial<CmsModel>;\n    type: \"state\" | \"data\";\n}\ninterface Reducer {\n    (prev: State, action: Action): State;\n}\nexport const contentModelEditorReducer: Reducer = (prev: State, action: Action): State => {\n    const { data, type } = action;\n    switch (type) {\n        case \"state\":\n            return { ...prev, ...data };\n\n        case \"data\":\n            return { ...prev, data: data as CmsModel };\n        default:\n            return prev;\n    }\n};\n\n/**\n * Cleanup is required because backend always expects string value in predefined values entries\n */\nconst cleanupModelDataFields = (fields: CmsEditorField[]): CmsEditorField[] => {\n    return fields.map(field => {\n        const { predefinedValues } = field;\n        const { enabled = false, values = [] } = predefinedValues || {};\n        return {\n            ...field,\n            predefinedValues: {\n                enabled,\n                values: values.map(({ label, value, selected }) => {\n                    return {\n                        label,\n                        selected: selected || false,\n                        value: String(value)\n                    };\n                })\n            }\n        };\n    });\n};\n\nconst cleanupModelData = (data: PickedCmsEditorContentModel): PickedCmsEditorContentModel => {\n    return {\n        ...data,\n        fields: cleanupModelDataFields(data.fields)\n    };\n};\n\ninterface ContentModelEditorProviderProps {\n    apolloClient: ApolloClient<any>;\n    modelId?: string;\n    children: React.ReactElement;\n}\n\nexport const ContentModelEditorProvider: React.FC<ContentModelEditorProviderProps> = ({\n    children,\n    apolloClient,\n    modelId\n}) => {\n    const [state, dispatch] = useReducer<Reducer>(contentModelEditorReducer, {\n        modelId: modelId || null,\n        isPristine: true,\n        data: null as unknown as CmsModel\n    });\n    const { history } = useRouter();\n    const { showSnackbar } = useSnackbar();\n\n    const setPristine = (flag: boolean): void => {\n        dispatch({ type: \"state\", data: { isPristine: flag } });\n    };\n\n    const saveContentModel = async (\n        data?: CmsModel\n    ): Promise<UpdateCmsModelMutationResponse[\"updateContentModel\"]> => {\n        if (!data) {\n            data = state.data;\n        }\n        const modelData: PickedCmsEditorContentModel = pick(data, [\n            \"group\",\n            \"layout\",\n            \"fields\",\n            \"name\",\n            \"settings\",\n            \"description\",\n            \"titleFieldId\"\n        ]);\n        const response = await apolloClient.mutate<\n            UpdateCmsModelMutationResponse,\n            UpdateCmsModelMutationVariables\n        >({\n            mutation: UPDATE_CONTENT_MODEL,\n            variables: {\n                modelId: data.modelId,\n                data: cleanupModelData(modelData)\n            },\n            refetchQueries: [\n                {\n                    query: LIST_MENU_CONTENT_GROUPS_MODELS\n                }\n            ]\n        });\n\n        setPristine(true);\n\n        if (!response.data || !response.data.updateContentModel) {\n            return {\n                data: null,\n                error: null\n            };\n        }\n\n        return response.data.updateContentModel;\n    };\n\n    /**\n     * Set form data by providing a callback, which receives a fresh copy of data on which you can work on.\n     * Return new data once finished.\n     */\n    const setData = async (setter: (value: any) => any, saveModel = false): Promise<void> => {\n        setPristine(false);\n        const data = setter(state.data);\n        dispatch({ type: \"data\", data });\n        if (!saveModel) {\n            return;\n        }\n        await saveContentModel(data);\n    };\n\n    const getContentModel = async (\n        modelId: string\n    ): Promise<FetchResult<GetCmsModelQueryResponse>> => {\n        const response = await apolloClient.query<\n            GetCmsModelQueryResponse,\n            GetCmsModelQueryVariables\n        >({\n            query: GET_CONTENT_MODEL,\n            variables: {\n                modelId\n            }\n        });\n\n        const { data, error } = get(response, \"data.getContentModel\");\n        if (error) {\n            throw new Error(error);\n        }\n\n        await setData(() => data, false);\n        setPristine(true);\n        return response;\n    };\n\n    useEffect(() => {\n        if (!modelId) {\n            return;\n        }\n        getContentModel(modelId).catch(() => {\n            history.push(`/cms/content-models`);\n            showSnackbar(`Could not load content model with given ID.`);\n        });\n    }, [modelId]);\n\n    const value = useMemo(\n        () => ({\n            data: state.data,\n            modelId,\n            apolloClient,\n            dispatch,\n            isPristine: state.isPristine,\n            getContentModel,\n            saveContentModel,\n            setData\n        }),\n        [state, apolloClient]\n    );\n\n    const { Provider } = contentModelEditorContext;\n\n    return <Provider value={value}>{children}</Provider>;\n};\n"]}

package/admin/components/ContentModelEditor/Editor.d.ts

@@ -1,3 +1,3 @@
 import React from "react";
-export declare const EditContainer: import("@emotion/styled-base").StyledComponent<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "hidden" | "dir" | "slot" | "style" | "title" | "color" | "translate" | "children" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "draggable" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture">, object>;
+export declare const EditContainer: import("@emotion/styled-base").StyledComponent<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Pick<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, keyof React.HTMLAttributes<HTMLDivElement>>, object>;
 export declare const Editor: React.FC;

package/admin/components/ContentModelEditor/Editor.js

@@ -110,9 +110,11 @@ export var Editor = function Editor() {
     use: "headline6"
   }, "Fields")), /*#__PURE__*/React.createElement(LeftBarFieldList, null, /*#__PURE__*/React.createElement(FieldsSidebar, {
     onFieldDragStart: function onFieldDragStart() {
-      if (tabsRef.current) {
-        tabsRef.current.switchTab(0);
+      if (!tabsRef.current) {
+        return;
       }
+
+      tabsRef.current.switchTab(0);
     }
   }))), /*#__PURE__*/React.createElement(RightPanel, {
     span: 8
@@ -127,7 +129,7 @@ export var Editor = function Editor() {
     "data-testid": "cms.editor.tab.edit"
   }, /*#__PURE__*/React.createElement(EditContainer, null, /*#__PURE__*/React.createElement(FieldEditor, {
     fields: data.fields,
-    layout: data.layout,
+    layout: data.layout || [],
     onChange: onChange
   }))), /*#__PURE__*/React.createElement(Tab, {
     label: "Preview",

package/admin/components/ContentModelEditor/Editor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Editor.tsx"],"names":["React","useRef","useState","Prompt","styled","css","i18n","CircularProgress","LeftPanel","RightPanel","SplitView","Icon","Typography","Tab","Tabs","ReactComponent","FormIcon","FieldsSidebar","FieldEditor","PreviewTab","Header","DragPreview","useContentModelEditor","t","ns","prompt","ContentContainer","paddingTop","EditContainer","padding","position","LeftBarTitle","borderBottom","display","alignItems","color","titleIcon","height","marginRight","LeftBarFieldList","overflow","formTabs","backgroundColor","Editor","data","setData","isPristine","tabsRef","activeTabIndex","setActiveTabIndex","onChange","fields","layout","current","switchTab","e"],"mappings":"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","sourcesContent":["import React, { useRef, useState } from \"react\";\nimport { Prompt } from \"@webiny/react-router\";\nimport styled from \"@emotion/styled\";\nimport { css } from \"emotion\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CircularProgress } from \"@webiny/ui/Progress\";\nimport { LeftPanel, RightPanel, SplitView } from \"@webiny/app-admin/components/SplitView\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { Tab, Tabs } from \"@webiny/ui/Tabs\";\nimport { ReactComponent as FormIcon } from \"./icons/round-assignment-24px.svg\";\nimport { FieldsSidebar } from \"./FieldsSidebar\";\nimport { FieldEditor } from \"../FieldEditor\";\nimport { PreviewTab } from \"./PreviewTab\";\nimport Header from \"./Header\";\nimport DragPreview from \"../DragPreview\";\nimport { useContentModelEditor } from \"./useContentModelEditor\";\nimport { CmsEditorField, CmsEditorFieldsLayout } from \"~/types\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/editor\");\n\nconst prompt = t`There are some unsaved changes! Are you sure you want to navigate away and discard all changes?`;\n\nconst ContentContainer = styled(\"div\")({\n    paddingTop: 65\n});\n\nexport const EditContainer = styled(\"div\")({\n    padding: 40,\n    position: \"relative\"\n});\n\nconst LeftBarTitle = styled(\"div\")({\n    borderBottom: \"1px solid var(--mdc-theme-on-background)\",\n    display: \"flex\",\n    alignItems: \"center\",\n    padding: 25,\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\nconst titleIcon = css({\n    height: 24,\n    marginRight: 15,\n    color: \"var(--mdc-theme-primary)\"\n});\n\nconst LeftBarFieldList = styled(\"div\")({\n    padding: 40,\n    overflow: \"auto\",\n    height: \"calc(100vh - 250px)\"\n});\n\nconst formTabs = css({\n    \"&.webiny-ui-tabs\": {\n        \".webiny-ui-tabs__tab-bar\": {\n            backgroundColor: \"var(--mdc-theme-surface)\"\n        }\n    }\n});\n\ninterface OnChangeParams {\n    fields: CmsEditorField[];\n    layout: CmsEditorFieldsLayout;\n}\n\nexport const Editor: React.FC = () => {\n    const { data, setData, isPristine } = useContentModelEditor();\n\n    const tabsRef = useRef<Tabs | null>(null);\n    const [activeTabIndex, setActiveTabIndex] = useState<number>(0);\n\n    const onChange = ({ fields, layout }: OnChangeParams) => {\n        setData(data => ({ ...data, fields, layout }));\n    };\n\n    if (!data) {\n        return <CircularProgress label={\"Loading content model...\"} />;\n    }\n\n    return (\n        <div className={\"content-model-editor\"}>\n            <Prompt when={!isPristine} message={prompt} />\n            <Header />\n            <ContentContainer>\n                <SplitView>\n                    <LeftPanel span={4}>\n                        <LeftBarTitle>\n                            <Icon className={titleIcon} icon={<FormIcon />} />\n                            <Typography use={\"headline6\"}>Fields</Typography>\n                        </LeftBarTitle>\n                        <LeftBarFieldList>\n                            <FieldsSidebar\n                                onFieldDragStart={() => {\n                                    if (!tabsRef.current) {\n                                        return;\n                                    }\n                                    tabsRef.current.switchTab(0);\n                                }}\n                            />\n                        </LeftBarFieldList>\n                    </LeftPanel>\n                    <RightPanel span={8}>\n                        <Tabs\n                            className={formTabs}\n                            ref={tabsRef}\n                            onActivate={e => setActiveTabIndex(e)}\n                        >\n                            <Tab label={\"Edit\"} data-testid={\"cms.editor.tab.edit\"}>\n                                <EditContainer>\n                                    <FieldEditor\n                                        fields={data.fields}\n                                        layout={data.layout || []}\n                                        onChange={onChange}\n                                    />\n                                </EditContainer>\n                            </Tab>\n                            <Tab label={\"Preview\"} data-testid={\"cms.editor.tab.preview\"}>\n                                <PreviewTab activeTab={activeTabIndex === 1} />\n                            </Tab>\n                        </Tabs>\n                    </RightPanel>\n                </SplitView>\n            </ContentContainer>\n            <DragPreview />\n        </div>\n    );\n};\n"]}

package/admin/components/ContentModelEditor/FieldsSidebar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["FieldsSidebar.tsx"],"names":["React","plugins","styled","Icon","Draggable","FieldContainer","padding","marginBottom","display","width","backgroundColor","borderRadius","boxSizing","cursor","opacity","transition","FileInfo","FieldLabel","textTransform","lineHeight","color","FieldDescription","fontSize","FieldHandle","marginRight","Field","props","onFieldDragStart","fieldType","type","label","icon","description","drag","FieldsSidebar","fieldTypePlugin","byType","map","fieldPlugin","field"],"mappings":"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","sourcesContent":["import React, { DragEventHandler } from \"react\";\nimport { plugins } from \"@webiny/plugins\";\nimport styled from \"@emotion/styled\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport Draggable from \"../Draggable\";\nimport { CmsEditorFieldTypePlugin } from \"~/types\";\n\nconst FieldContainer = styled(\"div\")({\n    padding: \"10px 15px\",\n    marginBottom: 20,\n    display: \"flex\",\n    width: \"100%\",\n    backgroundColor: \"var(--mdc-theme-on-background)\",\n    borderRadius: 15,\n    boxSizing: \"border-box\",\n    cursor: \"grab\",\n    opacity: 1,\n    transition: \"opacity 225ms\",\n    \"&:hover\": {\n        opacity: 0.8\n    },\n    \"&:last-child\": {\n        marginBottom: 0\n    }\n});\n\nconst FileInfo = styled(\"div\")({});\n\nconst FieldLabel = styled(\"div\")({\n    textTransform: \"uppercase\",\n    lineHeight: \"145%\",\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\nconst FieldDescription = styled(\"div\")({\n    fontSize: 14,\n    color: \"var(--mdc-theme-text-secondary-on-background)\"\n});\n\nconst FieldHandle = styled(\"div\")({\n    marginRight: 15,\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\ninterface FieldProps {\n    onFieldDragStart: DragEventHandler;\n    fieldType: CmsEditorFieldTypePlugin[\"field\"];\n}\nconst Field: React.FC<FieldProps> = props => {\n    const {\n        onFieldDragStart,\n        fieldType: { type, label, icon, description }\n    } = props;\n    return (\n        <Draggable beginDrag={{ type: \"newField\", fieldType: type }}>\n            {({ drag }) => (\n                <div\n                    ref={drag}\n                    style={{ marginBottom: 10 }}\n                    data-testid={`cms-editor-fields-field-${type}`}\n                    onDragStart={onFieldDragStart}\n                >\n                    <FieldContainer>\n                        <FieldHandle>\n                            <Icon icon={icon as React.ReactElement} />\n                        </FieldHandle>\n                        <FileInfo>\n                            <FieldLabel>{label}</FieldLabel>\n                            <FieldDescription>{description}</FieldDescription>\n                        </FileInfo>\n                    </FieldContainer>\n                </div>\n            )}\n        </Draggable>\n    );\n};\n\ninterface FieldsSidebarProps {\n    onFieldDragStart: DragEventHandler;\n}\nexport const FieldsSidebar: React.FC<FieldsSidebarProps> = ({ onFieldDragStart }) => {\n    const fieldTypePlugin = plugins.byType<CmsEditorFieldTypePlugin>(\"cms-editor-field-type\");\n\n    return (\n        <React.Fragment>\n            {fieldTypePlugin.map(fieldPlugin => (\n                <Field\n                    key={fieldPlugin.field.type}\n                    fieldType={fieldPlugin.field}\n                    onFieldDragStart={onFieldDragStart}\n                />\n            ))}\n        </React.Fragment>\n    );\n};\n"]}

package/admin/components/ContentModelEditor/Header.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Header.tsx"],"names":["React","TopAppBar","TopAppBarSection","renderPlugins","css","topBar","boxShadow","EditorBar","width"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,SAAT,EAAoBC,gBAApB,QAA4C,sBAA5C;AACA,SAASC,aAAT,QAA8B,qBAA9B;AAEA,SAASC,GAAT,QAAoB,SAApB;AAEA,IAAMC,MAAM,gBAAGD,GAAG,CAAC;AACfE,EAAAA,SAAS,EAAE;AADI,CAAD,kBAAlB;;AAIA,IAAMC,SAAmB,GAAG,SAAtBA,SAAsB,GAAM;AAC9B,sBACI,oBAAC,SAAD;AAAW,IAAA,SAAS,EAAEF,MAAtB;AAA8B,IAAA,KAAK,MAAnC;AAAoC,mBAAa;AAAjD,kBACI,oBAAC,gBAAD;AAAkB,IAAA,KAAK,EAAE;AAAEG,MAAAA,KAAK,EAAE;AAAT,KAAzB;AAA2C,IAAA,QAAQ;AAAnD,KACKL,aAAa,CAAC,uCAAD,CADlB,CADJ,eAKI,oBAAC,gBAAD;AAAkB,IAAA,KAAK,EAAE;AAAEK,MAAAA,KAAK,EAAE;AAAT,KAAzB;AAA2C,IAAA,QAAQ;AAAnD,KACKL,aAAa,CAAC,wCAAD,CADlB,CALJ,CADJ;AAWH,CAZD;;AAcA,eAAeI,SAAf","sourcesContent":["import React from \"react\";\nimport { TopAppBar, TopAppBarSection } from \"@webiny/ui/TopAppBar\";\nimport { renderPlugins } from \"@webiny/app/plugins\";\n\nimport { css } from \"emotion\";\n\nconst topBar = css({\n    boxShadow: \"1px 0px 5px 0px rgba(128,128,128,1)\"\n});\n\nconst EditorBar: React.FC = () => {\n    return (\n        <TopAppBar className={topBar} fixed data-testid={\"cms-editor-top-bar\"}>\n            <TopAppBarSection style={{ width: \"50%\" }} alignEnd>\n                {renderPlugins(\"content-model-editor-default-bar-left\")}\n            </TopAppBarSection>\n\n            <TopAppBarSection style={{ width: \"50%\" }} alignEnd>\n                {renderPlugins(\"content-model-editor-default-bar-right\")}\n            </TopAppBarSection>\n        </TopAppBar>\n    );\n};\n\nexport default EditorBar;\n"]}

package/admin/components/ContentModelEditor/PreviewTab.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PreviewTab.tsx"],"names":["React","css","Elevation","i18n","useContentModelEditor","ContentEntryFormPreview","t","ns","formPreviewWrapper","padding","margin","boxSizing","style","noFieldsMessage","textAlign","PreviewTab","activeTab","data","fields","length"],"mappings":";;;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,GAAT,QAAoB,SAApB;AACA,SAASC,SAAT,QAA0B,sBAA1B;AACA,SAASC,IAAT,QAAqB,kBAArB;AAEA,SAASC,qBAAT;AACA,SAASC,uBAAT;AAEA,IAAMC,CAAC,GAAGH,IAAI,CAACI,EAAL,CAAQ,uDAAR,CAAV;AAEA,IAAMC,kBAAkB,gBAAGP,GAAG,CAAC;AAC3BQ,EAAAA,OAAO,EAAE,EADkB;AAE3BC,EAAAA,MAAM,EAAE,EAFmB;AAG3BC,EAAAA,SAAS,EAAE;AAHgB,CAAD,8BAA9B;AAMA,IAAMC,KAAK,GAAG;AACVC,EAAAA,eAAe,eAAEZ,GAAG,CAAC;AACjBa,IAAAA,SAAS,EAAE;AADM,GAAD;AADV,CAAd;AAMA,OAAO,IAAMC,UAA+B,GAAG,SAAlCA,UAAkC,OAAmB;AAAA,MAAhBC,SAAgB,QAAhBA,SAAgB;;AAC9D,8BAAiBZ,qBAAqB,EAAtC;AAAA,MAAQa,IAAR,yBAAQA,IAAR;;AAEA,sBACI,oBAAC,SAAD;AAAW,IAAA,CAAC,EAAE,CAAd;AAAiB,IAAA,SAAS,EAAET;AAA5B,KACKS,IAAI,CAACC,MAAL,IAAeD,IAAI,CAACC,MAAL,CAAYC,MAA3B,IAAqCH,SAArC,gBACG,oBAAC,uBAAD;AAAyB,IAAA,YAAY,EAAEC;AAAvC,IADH,gBAGG;AAAK,IAAA,SAAS,EAAEL,KAAK,CAACC;AAAtB,KACKP,CADL,qJAJR,CADJ;AAWH,CAdM","sourcesContent":["import React from \"react\";\nimport { css } from \"emotion\";\nimport { Elevation } from \"@webiny/ui/Elevation\";\nimport { i18n } from \"@webiny/app/i18n\";\nimport { CmsEditorContentTab } from \"~/types\";\nimport { useContentModelEditor } from \"~/admin/components/ContentModelEditor/useContentModelEditor\";\nimport { ContentEntryFormPreview } from \"../ContentEntryForm/ContentEntryFormPreview\";\n\nconst t = i18n.ns(\"app-headless-cms/admin/components/editor/tabs/preview\");\n\nconst formPreviewWrapper = css({\n    padding: 40,\n    margin: 40,\n    boxSizing: \"border-box\"\n});\n\nconst style = {\n    noFieldsMessage: css({\n        textAlign: \"center\"\n    })\n};\n\nexport const PreviewTab: CmsEditorContentTab = ({ activeTab }) => {\n    const { data } = useContentModelEditor();\n\n    return (\n        <Elevation z={1} className={formPreviewWrapper}>\n            {data.fields && data.fields.length && activeTab ? (\n                <ContentEntryFormPreview contentModel={data} />\n            ) : (\n                <div className={style.noFieldsMessage}>\n                    {t`Before previewing the form, please add at least one field to the content model.`}\n                </div>\n            )}\n        </Elevation>\n    );\n};\n"]}

package/admin/components/ContentModelEditor/useContentModelEditor.d.ts

@@ -1 +1 @@
-export declare function useContentModelEditor(): import("./Context").Context;
+export declare function useContentModelEditor(): import("./Context").ContentModelEditorProviderContext;

package/admin/components/ContentModelEditor/useContentModelEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useContentModelEditor.ts"],"names":["React","contentModelEditorContext","useContentModelEditor","context","useContext","Error"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,SAASC,yBAAT;AAEA,OAAO,SAASC,qBAAT,GAAiC;AACpC,MAAMC,OAAO,GAAGH,KAAK,CAACI,UAAN,CAAiBH,yBAAjB,CAAhB;;AACA,MAAI,CAACE,OAAL,EAAc;AACV,UAAM,IAAIE,KAAJ,CAAU,wEAAV,CAAN;AACH;;AAED,SAAOF,OAAP;AACH","sourcesContent":["import React from \"react\";\nimport { contentModelEditorContext } from \"./Context\";\n\nexport function useContentModelEditor() {\n    const context = React.useContext(contentModelEditorContext);\n    if (!context) {\n        throw new Error(\"useContentModelEditor must be used within a ContentModelEditorProvider\");\n    }\n\n    return context;\n}\n"]}

package/admin/components/DragPreview.js

@@ -29,7 +29,12 @@ var DragPreview = function DragPreview() {
       dragHelperOpacity = _useState2[0],
       setDragHelperOpacity = _useState2[1];
 
-  var _useDragLayer = useDragLayer(function (monitor) {
+  var _useDragLayer = useDragLayer(function (initialMonitor) {
+    /**
+     * We must cast because TS is complaining. We know that casting as DragSourceMonitorImpl is ok.
+     */
+    var monitor = initialMonitor;
+
     if (!subscribedToOffsetChange) {
       monitor.subscribeToOffsetChange(onOffsetChange(monitor));
       subscribedToOffsetChange = true;

package/admin/components/DragPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["DragPreview.tsx"],"names":["React","useEffect","useState","useDragLayer","subscribedToOffsetChange","dragPreviewRef","onOffsetChange","monitor","offset","getClientOffset","transform","x","y","style","DragPreview","dragHelperOpacity","setDragHelperOpacity","initialMonitor","subscribeToOffsetChange","isDragging","setTimeout","position","pointerEvents","zIndex","left","top","width","height","el","transition","display","opacity","backgroundColor","borderRadius"],"mappings":"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","sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { useDragLayer } from \"react-dnd\";\nimport { DragSourceMonitor } from \"react-dnd/lib/interfaces/monitors\";\nimport { DragSourceMonitorImpl } from \"react-dnd/lib/common/DragSourceMonitorImpl\";\n\nlet subscribedToOffsetChange = false;\n\nlet dragPreviewRef: HTMLDivElement | null = null;\n\nconst onOffsetChange = (monitor: DragSourceMonitor) => () => {\n    if (!dragPreviewRef) {\n        return;\n    }\n\n    const offset = monitor.getClientOffset();\n    if (!offset) {\n        return;\n    }\n\n    const transform = `translate(${offset.x - 15}px, ${offset.y - 15}px)`;\n    dragPreviewRef.style[\"transform\"] = transform;\n    // TODO @ts-refactor figure out better type\n    dragPreviewRef.style[\"-webkit-transform\" as any] = transform;\n};\n\nconst DragPreview: React.FC = () => {\n    const [dragHelperOpacity, setDragHelperOpacity] = useState(0);\n    const { isDragging } = useDragLayer(initialMonitor => {\n        /**\n         * We must cast because TS is complaining. We know that casting as DragSourceMonitorImpl is ok.\n         */\n        const monitor = initialMonitor as unknown as DragSourceMonitorImpl;\n        if (!subscribedToOffsetChange) {\n            monitor.subscribeToOffsetChange(onOffsetChange(monitor));\n            subscribedToOffsetChange = true;\n        }\n\n        return {\n            isDragging: monitor.isDragging()\n        };\n    });\n\n    useEffect(() => {\n        return () => {\n            subscribedToOffsetChange = false;\n            dragPreviewRef = null;\n        };\n    }, []);\n\n    // We track the value of \"isDragging\" and apply opacity=1 (after 100ms), when it switches to true.\n    // Without this, the drag cursor would be shown in the top-left corner for a short amount of time, and then it\n    // would be repositioned correctly. Definitely looks like a glitch. This also adds a nice little fade-in effect.\n    useEffect(() => {\n        if (isDragging) {\n            setTimeout(() => {\n                setDragHelperOpacity(isDragging ? 1 : 0);\n            }, 100);\n        } else {\n            setDragHelperOpacity(0);\n        }\n    }, [isDragging]);\n\n    if (!isDragging) {\n        return null;\n    }\n\n    if (!isDragging) {\n        return null;\n    }\n\n    return (\n        <div\n            style={{\n                position: \"fixed\",\n                pointerEvents: \"none\",\n                zIndex: 1001,\n                left: 0,\n                top: 0,\n                width: \"100%\",\n                height: \"100%\"\n            }}\n        >\n            <div\n                ref={el => (dragPreviewRef = el)}\n                style={{\n                    transition: \"opacity .25s ease-in-out\",\n                    display: \"block\",\n                    opacity: dragHelperOpacity\n                }}\n            >\n                <div\n                    style={{\n                        width: 30,\n                        height: 30,\n                        backgroundColor: \"var(--mdc-theme-primary)\",\n                        borderRadius: \"50%\"\n                    }}\n                />\n            </div>\n        </div>\n    );\n};\nexport default DragPreview;\n"]}

package/admin/components/Draggable.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Draggable.tsx"],"names":["React","useDrag","DragPreviewImage","emptyImage","Draggable","props","children","beginDrag","endDrag","target","item","type","collect","monitor","isDragging","begin","end","drag","preview","MemoizedDraggable","memo"],"mappings":";AAAA,OAAOA,KAAP,MAAoC,OAApC;AACA,SAASC,OAAT,EAAkBC,gBAAlB,QAA6D,WAA7D;AAEA,IAAMC,UAAU,GAAG,4EAAnB;;AAiBA,IAAMC,SAAmC,GAAG,SAAtCA,SAAsC,CAAAC,KAAK,EAAI;AACjD,MAAQC,QAAR,GAAiDD,KAAjD,CAAQC,QAAR;AAAA,MAAkBC,SAAlB,GAAiDF,KAAjD,CAAkBE,SAAlB;AAAA,MAA6BC,OAA7B,GAAiDH,KAAjD,CAA6BG,OAA7B;AAAA,MAAsCC,MAAtC,GAAiDJ,KAAjD,CAAsCI,MAAtC;;AAEA,iBAAwCR,OAAO,CAAC;AAC5CS,IAAAA,IAAI,EAAE;AAAEC,MAAAA,IAAI,EAAE,SAAR;AAAmBF,MAAAA,MAAM,EAANA;AAAnB,KADsC;AAE5CG,IAAAA,OAAO,EAAE,iBAAAC,OAAO;AAAA,aAAK;AACjBC,QAAAA,UAAU,EAAED,OAAO,CAACC,UAAR;AADK,OAAL;AAAA,KAF4B;AAK5CC,IAAAA,KAL4C,iBAKtCF,OALsC,EAK7B;AACX,UAAI,OAAON,SAAP,KAAqB,UAAzB,EAAqC;AACjC,eAAOA,SAAS,CAACF,KAAD,EAAQQ,OAAR,CAAhB;AACH;;AACD,aAAON,SAAP;AACH,KAV2C;AAW5CS,IAAAA,GAX4C,eAWxCN,IAXwC,EAWlCG,OAXkC,EAWzB;AACf,UAAI,OAAOL,OAAP,KAAmB,UAAvB,EAAmC;AAC/B,eAAOA,OAAO,CAACE,IAAD,EAAOG,OAAP,CAAd;AACH;;AACD,aAAOL,OAAP;AACH;AAhB2C,GAAD,CAA/C;AAAA;AAAA,MAASM,UAAT,gBAASA,UAAT;AAAA,MAAuBG,IAAvB;AAAA,MAA6BC,OAA7B;;AAmBA,sBACI,uDACI,oBAAC,gBAAD;AAAkB,IAAA,OAAO,EAAEA,OAA3B;AAAoC,IAAA,GAAG,EAAEf;AAAzC,IADJ,EAEKG,QAAQ,CAAC;AAAEQ,IAAAA,UAAU,EAAVA,UAAF;AAAcG,IAAAA,IAAI,EAAJA;AAAd,GAAD,CAFb,CADJ;AAMH,CA5BD;;AA8BA,IAAME,iBAA2C,gBAAGnB,KAAK,CAACoB,IAAN,CAAWhB,SAAX,CAApD;AACA,eAAee,iBAAf","sourcesContent":["import React, { ReactElement } from \"react\";\nimport { useDrag, DragPreviewImage, ConnectDragSource } from \"react-dnd\";\n\nconst emptyImage = \"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\";\n\ninterface DraggableChildrenFunctionParams {\n    isDragging: boolean;\n    drag: ConnectDragSource;\n}\nexport interface DraggableChildrenFunction {\n    (params: DraggableChildrenFunctionParams): ReactElement;\n}\n\nexport interface DraggableProps {\n    children: DraggableChildrenFunction;\n    beginDrag?: any;\n    endDrag?: any;\n    target?: string[];\n}\n\nconst Draggable: React.FC<DraggableProps> = props => {\n    const { children, beginDrag, endDrag, target } = props;\n\n    const [{ isDragging }, drag, preview] = useDrag({\n        item: { type: \"element\", target },\n        collect: monitor => ({\n            isDragging: monitor.isDragging()\n        }),\n        begin(monitor) {\n            if (typeof beginDrag === \"function\") {\n                return beginDrag(props, monitor);\n            }\n            return beginDrag;\n        },\n        end(item, monitor) {\n            if (typeof endDrag === \"function\") {\n                return endDrag(item, monitor);\n            }\n            return endDrag;\n        }\n    });\n\n    return (\n        <>\n            <DragPreviewImage connect={preview} src={emptyImage} />\n            {children({ isDragging, drag })}\n        </>\n    );\n};\n\nconst MemoizedDraggable: React.FC<DraggableProps> = React.memo(Draggable);\nexport default MemoizedDraggable;\n"]}

package/admin/components/DropZone/Center.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Center.tsx"],"names":["React","styled","Droppable","Container","isOver","backgroundColor","boxSizing","height","minHeight","position","userSelect","width","border","opacity","Add","top","left","transform","margin","color","Center","onDrop","children","style","drop"],"mappings":";AAAA,OAAOA,KAAP,MAAqC,OAArC;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AACA,SAASC,SAAT,yB,CAEA;;AACA,IAAMC,SAAS,gBAAGF,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AAAA,MAAGG,MAAH,QAAGA,MAAH;AAAA,SAAsC;AAClEC,IAAAA,eAAe,EAAE,aADiD;AAElEC,IAAAA,SAAS,EAAE,YAFuD;AAGlEC,IAAAA,MAAM,EAAE,MAH0D;AAIlEC,IAAAA,SAAS,EAAE,GAJuD;AAKlEC,IAAAA,QAAQ,EAAE,UALwD;AAMlEC,IAAAA,UAAU,EAAE,MANsD;AAOlEC,IAAAA,KAAK,EAAE,MAP2D;AAQlEC,IAAAA,MAAM,EAAER,MAAM,GACR,qCADQ,GAER,uCAV4D;AAWlES,IAAAA,OAAO,EAAE;AAXyD,GAAtC;AAAA,CAAjB,CAAf,C,CAcA;;AACA,IAAMC,GAAG,gBAAGb,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AAAA,MAAGG,MAAH,SAAGA,MAAH;AAAA,SAAsC;AAC5DK,IAAAA,QAAQ,EAAE,UADkD;AAE5DM,IAAAA,GAAG,EAAE,KAFuD;AAG5DC,IAAAA,IAAI,EAAE,KAHsD;AAI5DC,IAAAA,SAAS,EAAE,sBAJiD;AAK5DC,IAAAA,MAAM,EAAE,CALoD;AAM5DC,IAAAA,KAAK,EAAEf,MAAM,GAAG,0BAAH,GAAgC;AANe,GAAtC;AAAA,CAAjB,CAAT;;AAkBA,IAAMgB,MAA6B,GAAG,SAAhCA,MAAgC,QAAiC;AAAA,MAA9BC,MAA8B,SAA9BA,MAA8B;AAAA,MAAtBC,QAAsB,SAAtBA,QAAsB;AAAA,MAAZC,KAAY,SAAZA,KAAY;AACnE,sBACI,oBAAC,SAAD;AAAW,IAAA,MAAM,EAAEF;AAAnB,KACK;AAAA,QAAGjB,MAAH,SAAGA,MAAH;AAAA,QAAWoB,IAAX,SAAWA,IAAX;AAAA,wBACG;AACI,MAAA,GAAG,EAAEA,IADT;AAEI,MAAA,KAAK;AAAIb,QAAAA,KAAK,EAAE,MAAX;AAAmBJ,QAAAA,MAAM,EAAE;AAA3B,SAAsCgB,KAAtC,CAFT;AAGI,qBAAa;AAHjB,oBAKI,oBAAC,SAAD;AAAW,MAAA,MAAM,EAAEnB;AAAnB,oBACI,oBAAC,GAAD;AAAK,MAAA,MAAM,EAAEA;AAAb,OAAsBkB,QAAtB,CADJ,CALJ,CADH;AAAA,GADL,CADJ;AAeH,CAhBD;;AAkBA,eAAeF,MAAf","sourcesContent":["import React, { CSSProperties } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, OnDropCallable } from \"./../Droppable\";\n\n// @ts-ignore\nconst Container = styled(\"div\")(({ isOver }: { isOver: boolean }) => ({\n    backgroundColor: \"transparent\",\n    boxSizing: \"border-box\",\n    height: \"100%\",\n    minHeight: 100,\n    position: \"relative\",\n    userSelect: \"none\",\n    width: \"100%\",\n    border: isOver\n        ? \"2px dashed var(--mdc-theme-primary)\"\n        : \"2px dashed var(--mdc-theme-secondary)\",\n    opacity: 1\n}));\n\n// @ts-ignore\nconst Add = styled(\"div\")(({ isOver }: { isOver: boolean }) => ({\n    position: \"absolute\",\n    top: \"50%\",\n    left: \"50%\",\n    transform: \"translate(-50%,-50%)\",\n    margin: 0,\n    color: isOver ? \"var(--mdc-theme-primary)\" : \"var(--mdc-theme-secondary)\"\n}));\n\ninterface CenterProps {\n    type?: string;\n    onDrop: OnDropCallable;\n    children: React.ReactNode;\n    active?: boolean;\n    highlight?: boolean;\n    style?: CSSProperties;\n}\n\nconst Center: React.FC<CenterProps> = ({ onDrop, children, style }) => {\n    return (\n        <Droppable onDrop={onDrop}>\n            {({ isOver, drop }) => (\n                <div\n                    ref={drop}\n                    style={{ width: \"100%\", height: \"100%\", ...style }}\n                    data-testid={\"cms-editor-first-field-area\"}\n                >\n                    <Container isOver={isOver}>\n                        <Add isOver={isOver}>{children}</Add>\n                    </Container>\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Center;\n"]}

package/admin/components/DropZone/Horizontal.js

@@ -75,7 +75,7 @@ var Horizontal = function Horizontal(_ref2) {
     }, /*#__PURE__*/React.createElement(OuterDiv, {
       isOver: isOver,
       isDragging: isDragging,
-      last: last
+      last: last ? true : false
     }, /*#__PURE__*/React.createElement(InnerDiv, null, /*#__PURE__*/React.createElement(BackgroundColorDiv, null))));
   });
 };

package/admin/components/DropZone/Horizontal.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Horizontal.tsx"],"names":["React","styled","Droppable","InnerDiv","height","width","zIndex","borderRadius","boxSizing","display","border","borderSpacing","BackgroundColorDiv","OuterDiv","margin","padding","backgroundColor","position","justifyContent","props","last","borderColor","isOver","isDragging","opacity","Horizontal","onDrop","isVisible","rest","drop"],"mappings":";;;AAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,MAAP,MAAmB,iBAAnB;AACA,SAASC,SAAT;AAGA,IAAMC,QAAQ,gBAAGF,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AAC3BG,EAAAA,MAAM,EAAE,EADmB;AAE3BC,EAAAA,KAAK,EAAE,MAFoB;AAG3BC,EAAAA,MAAM,EAAE,CAHmB;AAI3BC,EAAAA,YAAY,EAAE,CAJa;AAK3BC,EAAAA,SAAS,EAAE,YALgB;AAM3BC,EAAAA,OAAO,EAAE,MANkB;AAO3BC,EAAAA,MAAM,EAAE,kBAPmB;AAQ3BC,EAAAA,aAAa,EAAE;AARY,CAAjB,CAAd;AAWA,IAAMC,kBAAkB,gBAAGX,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GAAiB;AACrCI,EAAAA,KAAK,EAAE,MAD8B;AAErCD,EAAAA,MAAM,EAAE;AAF6B,CAAjB,CAAxB;AAWA,IAAMS,QAAQ,gBAAGZ,MAAH,CAAU,KAAV;AAAA;AAAA;AAAA,GACV;AACIa,EAAAA,MAAM,EAAE,CADZ;AAEIC,EAAAA,OAAO,EAAE,CAFb;AAGIV,EAAAA,KAAK,EAAE,kBAHX;AAIIC,EAAAA,MAAM,EAAE,EAJZ;AAKIU,EAAAA,eAAe,EAAE,aALrB;AAMIC,EAAAA,QAAQ,EAAE,UANd;AAOIR,EAAAA,OAAO,EAAE,MAPb;AAQIS,EAAAA,cAAc,EAAE;AARpB,CADU,EAWV,UAACC,KAAD;AAAA;;AAAA,0CACKA,KAAK,CAACC,IAAN,GAAa,QAAb,GAAwB,KAD7B,EACqC,CAAC,EADtC,yBAGKjB,QAHL;AAIQkB,IAAAA,WAAW,EAAEF,KAAK,CAACG,MAAN,GAAe,0BAAf,GAA4C,4BAJjE;AAKQb,IAAAA,OAAO,EAAEU,KAAK,CAACI,UAAN,GAAmB,OAAnB,GAA6B;AAL9C,KAOSX,kBAPT,EAO8B;AAClBY,IAAAA,OAAO,EAAE,GADS;AAElBR,IAAAA,eAAe,EAAEG,KAAK,CAACG,MAAN,GACX,0BADW,GAEX;AAJY,GAP9B;AAAA,CAXU,CAAd;;AAmCA,IAAMG,UAAqC,GAAG,SAAxCA,UAAwC,QAA0C;AAAA,MAAvCL,IAAuC,SAAvCA,IAAuC;AAAA,MAAjCM,MAAiC,SAAjCA,MAAiC;AAAA,MAAzBC,SAAyB,SAAzBA,SAAyB;AAAA,MAAXC,IAAW;;AACpF,sBACI,oBAAC,SAAD;AAAW,IAAA,MAAM,EAAEF,MAAnB;AAA2B,IAAA,SAAS,EAAEC;AAAtC,KACK;AAAA;;AAAA,QAAGL,MAAH,SAAGA,MAAH;AAAA,QAAWC,UAAX,SAAWA,UAAX;AAAA,QAAuBM,IAAvB,SAAuBA,IAAvB;AAAA,wBACG;AACI,MAAA,GAAG,EAAEA,IADT;AAEI,qBAAaD,IAAI,CAAC,aAAD,CAFrB;AAGI,MAAA,KAAK;AACD;AACAxB,QAAAA,MAAM,EAAE,MAFP;AAGDC,QAAAA,KAAK,EAAE,MAHN;AAIDY,QAAAA,QAAQ,EAAE;AAJT,gCAKAG,IAAI,GAAG,QAAH,GAAc,KALlB,EAK0B,CAL1B,kCAMK,CANL,oCAOOG,UAAU,GAAG,IAAH,GAAU,CAAC,CAP5B;AAHT,oBAaI,oBAAC,QAAD;AAAU,MAAA,MAAM,EAAED,MAAlB;AAA0B,MAAA,UAAU,EAAEC,UAAtC;AAAkD,MAAA,IAAI,EAAEH,IAAI,GAAG,IAAH,GAAU;AAAtE,oBACI,oBAAC,QAAD,qBACI,oBAAC,kBAAD,OADJ,CADJ,CAbJ,CADH;AAAA,GADL,CADJ;AAyBH,CA1BD;;AA4BA,eAAeK,UAAf","sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, IsVisibleCallable } from \"../Droppable\";\nimport { DragSource } from \"~/admin/components/FieldEditor/FieldEditorContext\";\n\nconst InnerDiv = styled(\"div\")({\n    height: 15,\n    width: \"100%\",\n    zIndex: 3,\n    borderRadius: 0,\n    boxSizing: \"border-box\",\n    display: \"none\",\n    border: \"1px dashed black\",\n    borderSpacing: 5\n});\n\nconst BackgroundColorDiv = styled(\"div\")({\n    width: \"100%\",\n    height: \"100%\"\n});\n\ninterface OuterDivProps {\n    isOver: boolean;\n    isDragging: boolean;\n    last: boolean;\n}\n\nconst OuterDiv = styled(\"div\")(\n    {\n        margin: 0,\n        padding: 0,\n        width: \"calc(100% + 2px)\",\n        zIndex: 10,\n        backgroundColor: \"transparent\",\n        position: \"absolute\",\n        display: \"flex\",\n        justifyContent: \"center\"\n    },\n    (props: OuterDivProps) => ({\n        [props.last ? \"bottom\" : \"top\"]: -15,\n        // @ts-ignore\n        [InnerDiv]: {\n            borderColor: props.isOver ? \"var(--mdc-theme-primary)\" : \"var(--mdc-theme-secondary)\",\n            display: props.isDragging ? \"block\" : \"none\",\n            // @ts-ignore\n            [BackgroundColorDiv]: {\n                opacity: 0.5,\n                backgroundColor: props.isOver\n                    ? \"var(--mdc-theme-primary)\"\n                    : \"var(--mdc-theme-secondary)\"\n            }\n        }\n    })\n);\n\ninterface HorizontalProps {\n    onDrop(item: DragSource): void;\n    last?: boolean;\n    isVisible?: IsVisibleCallable;\n    [\"data-testid\"]?: string;\n}\n\nconst Horizontal: React.FC<HorizontalProps> = ({ last, onDrop, isVisible, ...rest }) => {\n    return (\n        <Droppable onDrop={onDrop} isVisible={isVisible}>\n            {({ isOver, isDragging, drop }) => (\n                <div\n                    ref={drop}\n                    data-testid={rest[\"data-testid\"]}\n                    style={{\n                        /* For dropzone debugging: border: \"1px solid blue\",*/\n                        height: \"15px\",\n                        width: \"100%\",\n                        position: \"absolute\",\n                        [last ? \"bottom\" : \"top\"]: 0,\n                        left: 0,\n                        zIndex: isDragging ? 1000 : -1\n                    }}\n                >\n                    <OuterDiv isOver={isOver} isDragging={isDragging} last={last ? true : false}>\n                        <InnerDiv>\n                            <BackgroundColorDiv />\n                        </InnerDiv>\n                    </OuterDiv>\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Horizontal;\n"]}