@webiny/app-headless-cms 5.34.8 → 5.35.0-beta.0

package/admin/components/IconPicker.js

@@ -1,36 +1,22 @@
 "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.IconPicker = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _emotion = require("emotion");
-
 var _plugins = require("@webiny/plugins");
-
 var _Typography = require("@webiny/ui/Typography");
-
 var _reactVirtualized = require("react-virtualized");
-
 var _reactFontawesome = require("@fortawesome/react-fontawesome");
-
 var _DelayedOnChange = _interopRequireDefault(require("./DelayedOnChange"));
-
 var _Menu = require("@webiny/ui/Menu");
-
 var _Input = require("@webiny/ui/Input");
-
 var _FormElementMessage = require("@webiny/ui/FormElementMessage");
-
 /**
  * Controls the helper text below the checkbox.
  * @type {string}
@@ -97,26 +83,22 @@ var searchInput = /*#__PURE__*/(0, _emotion.css)({
   }
 }, "label:searchInput;");
 var useState = _react.default.useState,
-    useCallback = _react.default.useCallback,
-    useMemo = _react.default.useMemo;
-
+  useCallback = _react.default.useCallback,
+  useMemo = _react.default.useMemo;
 var IconPicker = function IconPicker(_ref) {
   var value = _ref.value,
-      onChange = _ref.onChange,
-      label = _ref.label,
-      description = _ref.description,
-      validation = _ref.validation;
-
+    onChange = _ref.onChange,
+    label = _ref.label,
+    description = _ref.description,
+    validation = _ref.validation;
   var _useState = useState(""),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      filter = _useState2[0],
-      setFilter = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    filter = _useState2[0],
+    setFilter = _useState2[1];
   var _useState3 = useState(false),
-      _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-      mustRenderGrid = _useState4[0],
-      setMustRenderGrid = _useState4[1];
-
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    mustRenderGrid = _useState4[0],
+    setMustRenderGrid = _useState4[1];
   var inputRef = (0, _react.useRef)(null);
   (0, _react.useEffect)(function () {
     setTimeout(function () {
@@ -131,7 +113,6 @@ var IconPicker = function IconPicker(_ref) {
   }, [filter]);
   var allIcons = useMemo(function () {
     var iconPlugins = _plugins.plugins.byType("cms-icons");
-
     return iconPlugins.reduce(function (icons, pl) {
       return icons.concat(pl.getIcons());
     }, []);
@@ -145,15 +126,13 @@ var IconPicker = function IconPicker(_ref) {
     var closeMenu = _ref2.closeMenu;
     return function renderCell(_ref3) {
       var columnIndex = _ref3.columnIndex,
-          key = _ref3.key,
-          rowIndex = _ref3.rowIndex,
-          style = _ref3.style;
+        key = _ref3.key,
+        rowIndex = _ref3.rowIndex,
+        style = _ref3.style;
       var item = icons[rowIndex * COLUMN_COUNT + columnIndex];
-
       if (!item) {
         return null;
       }
-
       return /*#__PURE__*/_react.default.createElement("div", {
         key: key,
         style: style,
@@ -162,7 +141,6 @@ var IconPicker = function IconPicker(_ref) {
           if (onChange) {
             onChange(item.id.join("/"));
           }
-
           closeMenu();
         }
       }, /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
@@ -180,7 +158,7 @@ var IconPicker = function IconPicker(_ref) {
       onChange: onFilterChange
     }, function (_ref5) {
       var value = _ref5.value,
-          onChange = _ref5.onChange;
+        onChange = _ref5.onChange;
       return /*#__PURE__*/_react.default.createElement(_Input.Input, {
         inputRef: inputRef,
         className: searchInput,
@@ -206,11 +184,9 @@ var IconPicker = function IconPicker(_ref) {
     }));
   }, [icons]);
   var fontAwesomeIconValue = typeof value === "string" && value.includes("/") ? value.split("/") : ["fas", "star"];
-
   var _ref6 = validation || {},
-      validationIsValid = _ref6.isValid,
-      validationMessage = _ref6.message;
-
+    validationIsValid = _ref6.isValid,
+    validationMessage = _ref6.message;
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, label && /*#__PURE__*/_react.default.createElement("div", {
     className: iconPickerLabel
   }, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
@@ -234,5 +210,4 @@ var IconPicker = function IconPicker(_ref) {
     error: true
   }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
 };
-
 exports.IconPicker = IconPicker;

package/admin/components/IconPicker.js.map

@@ -1 +1 @@
-{"version":3,"names":["iconPickerLabel","css","marginBottom","marginLeft","MenuWrapper","NoResultWrapper","width","color","padding","COLUMN_COUNT","gridItem","display","flexDirection","justifyContent","boxSizing","paddingTop","alignItems","textAlign","cursor","transform","borderRadius","transition","boxShadow","content","position","top","left","height","zIndex","opacity","backgroundColor","grid","pickIcon","searchInput","input","useState","React","useCallback","useMemo","IconPicker","value","onChange","label","description","validation","filter","setFilter","mustRenderGrid","setMustRenderGrid","inputRef","useRef","useEffect","setTimeout","current","focus","onFilterChange","cb","allIcons","iconPlugins","plugins","byType","reduce","icons","pl","concat","getIcons","ic","name","includes","renderCell","closeMenu","columnIndex","key","rowIndex","style","item","id","join","renderGrid","length","Math","ceil","fontAwesomeIconValue","split","validationIsValid","isValid","validationMessage","message"],"sources":["IconPicker.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\nimport { css } from \"emotion\";\nimport { plugins } from \"@webiny/plugins\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { Grid } from \"react-virtualized\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport DelayedOnChange from \"./DelayedOnChange\";\nimport { Menu } from \"@webiny/ui/Menu\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { CmsIcon, CmsIconsPlugin } from \"~/types\";\nimport { FormComponentProps } from \"@webiny/ui/types\";\nimport { FormElementMessage } from \"@webiny/ui/FormElementMessage\";\nimport { GridCellProps } from \"react-virtualized/dist/es/Grid\";\n\n/**\n * Controls the helper text below the checkbox.\n * @type {string}\n */\nconst iconPickerLabel = css({ marginBottom: 5, marginLeft: 2 });\n\nconst MenuWrapper = css`\n    color: var(--mdc-theme-text-secondary-on-background);\n    background-color: var(--mdc-theme-on-background);\n    border-bottom: 1px solid var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54));\n    padding: 16px 8px;\n    cursor: pointer;\n    :hover {\n        border-bottom: 1px solid rgba(0, 0, 0, 1);\n    }\n`;\n\nconst NoResultWrapper = css({\n    width: 640,\n    color: \"var(--mdc-theme-text-secondary-on-background)\",\n    padding: \"16px 12px\"\n});\n\nconst COLUMN_COUNT = 6;\n\nconst gridItem = css({\n    display: \"flex\",\n    flexDirection: \"column\",\n    justifyContent: \"flex-start\",\n    boxSizing: \"border-box\",\n    paddingTop: 15,\n    alignItems: \"center\",\n    textAlign: \"center\",\n    cursor: \"pointer\",\n    transform: \"translateZ(0)\",\n    borderRadius: 2,\n    color: \"var(--mdc-theme-text-secondary-on-background)\",\n    transition: \"all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1)\",\n    \"&::after\": {\n        boxShadow: \"0 0.25rem 0.125rem 0 rgba(0,0,0,0.05)\",\n        transition: \"opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1)\",\n        content: '\"\"',\n        position: \"absolute\",\n        top: 0,\n        left: 0,\n        width: \"100%\",\n        height: \"100%\",\n        zIndex: -1,\n        opacity: 0\n    },\n    \"&:hover\": {\n        backgroundColor: \"var(--mdc-theme-background)\",\n        color: \"var(--mdc-theme-text-primary-on-background)\",\n        \"&::after\": {\n            opacity: 1\n        }\n    },\n    \">svg\": {\n        width: 42,\n        marginBottom: 5\n    }\n});\n\nconst grid = css({\n    padding: 20\n});\n\nconst pickIcon = css({\n    width: 50,\n    textAlign: \"center\",\n    cursor: \"pointer\"\n});\n\nconst searchInput = css({\n    input: {\n        padding: \"20px 12px 20px\"\n    }\n});\n\nconst { useState, useCallback, useMemo } = React;\n\nexport interface IconPickerProps extends FormComponentProps {\n    label?: React.ReactNode;\n    description?: React.ReactNode;\n}\n\nexport const IconPicker: React.FC<IconPickerProps> = ({\n    value,\n    onChange,\n    label,\n    description,\n    validation\n}) => {\n    const [filter, setFilter] = useState(\"\");\n    const [mustRenderGrid, setMustRenderGrid] = useState(false);\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    useEffect(() => {\n        setTimeout(() => {\n            if (mustRenderGrid && inputRef.current) {\n                inputRef.current.focus();\n            }\n        }, 50);\n    }, [mustRenderGrid]);\n\n    const onFilterChange = useCallback(\n        (value, cb) => {\n            setFilter(value);\n            cb();\n        },\n        [filter]\n    );\n\n    const allIcons: CmsIcon[] = useMemo(() => {\n        const iconPlugins = plugins.byType<CmsIconsPlugin>(\"cms-icons\");\n        return iconPlugins.reduce((icons: Array<CmsIcon>, pl) => {\n            return icons.concat(pl.getIcons());\n        }, []);\n    }, []);\n\n    const icons = useMemo(() => {\n        return filter ? allIcons.filter(ic => ic.name.includes(filter)) : allIcons;\n    }, [filter]);\n\n    const renderCell = useCallback(\n        ({ closeMenu }) => {\n            return function renderCell({\n                columnIndex,\n                key,\n                rowIndex,\n                style\n            }: GridCellProps): React.ReactNode {\n                const item = icons[rowIndex * COLUMN_COUNT + columnIndex];\n                if (!item) {\n                    return null;\n                }\n\n                return (\n                    <div\n                        key={key}\n                        style={style}\n                        className={gridItem}\n                        onClick={() => {\n                            if (onChange) {\n                                onChange(item.id.join(\"/\"));\n                            }\n                            closeMenu();\n                        }}\n                    >\n                        <FontAwesomeIcon icon={item.id} size={\"2x\"} />\n                        <Typography use={\"body2\"}>{item.name}</Typography>\n                    </div>\n                );\n            };\n        },\n        [icons]\n    );\n\n    const renderGrid = useCallback(\n        ({ closeMenu }) => {\n            return (\n                <>\n                    <DelayedOnChange value={filter} onChange={onFilterChange}>\n                        {({ value, onChange }) => (\n                            <Input\n                                inputRef={inputRef}\n                                className={searchInput}\n                                value={value}\n                                onChange={onChange}\n                                placeholder={\"Search icons...\"}\n                            />\n                        )}\n                    </DelayedOnChange>\n                    {icons.length === 0 ? (\n                        <div className={NoResultWrapper}>\n                            <Typography use=\"body1\">No results found.</Typography>\n                        </div>\n                    ) : (\n                        <Grid\n                            className={grid}\n                            cellRenderer={renderCell({ closeMenu })}\n                            columnCount={COLUMN_COUNT}\n                            columnWidth={100}\n                            height={440}\n                            rowCount={Math.ceil(icons.length / COLUMN_COUNT)}\n                            rowHeight={100}\n                            width={640}\n                        />\n                    )}\n                </>\n            );\n        },\n        [icons]\n    );\n\n    const fontAwesomeIconValue: any =\n        typeof value === \"string\" && value.includes(\"/\") ? value.split(\"/\") : [\"fas\", \"star\"];\n\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n    return (\n        <>\n            {label && (\n                <div className={iconPickerLabel}>\n                    <Typography use={\"body1\"}>{label}</Typography>\n                </div>\n            )}\n\n            <Menu\n                onOpen={() => setMustRenderGrid(true)}\n                onClose={() => setMustRenderGrid(false)}\n                handle={\n                    <div className={MenuWrapper}>\n                        <div className={pickIcon}>\n                            <FontAwesomeIcon icon={fontAwesomeIconValue} size={\"2x\"} />\n                        </div>\n                    </div>\n                }\n            >\n                {mustRenderGrid && renderGrid}\n            </Menu>\n\n            {validationIsValid === false && (\n                <FormElementMessage error>{validationMessage}</FormElementMessage>\n            )}\n            {validationIsValid !== false && description && (\n                <FormElementMessage>{description}</FormElementMessage>\n            )}\n        </>\n    );\n};\n"],"mappings":"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"}
+{"version":3,"names":["iconPickerLabel","css","marginBottom","marginLeft","MenuWrapper","NoResultWrapper","width","color","padding","COLUMN_COUNT","gridItem","display","flexDirection","justifyContent","boxSizing","paddingTop","alignItems","textAlign","cursor","transform","borderRadius","transition","boxShadow","content","position","top","left","height","zIndex","opacity","backgroundColor","grid","pickIcon","searchInput","input","useState","React","useCallback","useMemo","IconPicker","value","onChange","label","description","validation","filter","setFilter","mustRenderGrid","setMustRenderGrid","inputRef","useRef","useEffect","setTimeout","current","focus","onFilterChange","cb","allIcons","iconPlugins","plugins","byType","reduce","icons","pl","concat","getIcons","ic","name","includes","renderCell","closeMenu","columnIndex","key","rowIndex","style","item","id","join","renderGrid","length","Math","ceil","fontAwesomeIconValue","split","validationIsValid","isValid","validationMessage","message"],"sources":["IconPicker.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\nimport { css } from \"emotion\";\nimport { plugins } from \"@webiny/plugins\";\nimport { Typography } from \"@webiny/ui/Typography\";\nimport { Grid } from \"react-virtualized\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport DelayedOnChange from \"./DelayedOnChange\";\nimport { Menu } from \"@webiny/ui/Menu\";\nimport { Input } from \"@webiny/ui/Input\";\nimport { CmsIcon, CmsIconsPlugin } from \"~/types\";\nimport { FormComponentProps } from \"@webiny/ui/types\";\nimport { FormElementMessage } from \"@webiny/ui/FormElementMessage\";\nimport { GridCellProps } from \"react-virtualized/dist/es/Grid\";\n\n/**\n * Controls the helper text below the checkbox.\n * @type {string}\n */\nconst iconPickerLabel = css({ marginBottom: 5, marginLeft: 2 });\n\nconst MenuWrapper = css`\n    color: var(--mdc-theme-text-secondary-on-background);\n    background-color: var(--mdc-theme-on-background);\n    border-bottom: 1px solid var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54));\n    padding: 16px 8px;\n    cursor: pointer;\n    :hover {\n        border-bottom: 1px solid rgba(0, 0, 0, 1);\n    }\n`;\n\nconst NoResultWrapper = css({\n    width: 640,\n    color: \"var(--mdc-theme-text-secondary-on-background)\",\n    padding: \"16px 12px\"\n});\n\nconst COLUMN_COUNT = 6;\n\nconst gridItem = css({\n    display: \"flex\",\n    flexDirection: \"column\",\n    justifyContent: \"flex-start\",\n    boxSizing: \"border-box\",\n    paddingTop: 15,\n    alignItems: \"center\",\n    textAlign: \"center\",\n    cursor: \"pointer\",\n    transform: \"translateZ(0)\",\n    borderRadius: 2,\n    color: \"var(--mdc-theme-text-secondary-on-background)\",\n    transition: \"all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1)\",\n    \"&::after\": {\n        boxShadow: \"0 0.25rem 0.125rem 0 rgba(0,0,0,0.05)\",\n        transition: \"opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1)\",\n        content: '\"\"',\n        position: \"absolute\",\n        top: 0,\n        left: 0,\n        width: \"100%\",\n        height: \"100%\",\n        zIndex: -1,\n        opacity: 0\n    },\n    \"&:hover\": {\n        backgroundColor: \"var(--mdc-theme-background)\",\n        color: \"var(--mdc-theme-text-primary-on-background)\",\n        \"&::after\": {\n            opacity: 1\n        }\n    },\n    \">svg\": {\n        width: 42,\n        marginBottom: 5\n    }\n});\n\nconst grid = css({\n    padding: 20\n});\n\nconst pickIcon = css({\n    width: 50,\n    textAlign: \"center\",\n    cursor: \"pointer\"\n});\n\nconst searchInput = css({\n    input: {\n        padding: \"20px 12px 20px\"\n    }\n});\n\nconst { useState, useCallback, useMemo } = React;\n\nexport interface IconPickerProps extends FormComponentProps {\n    label?: React.ReactNode;\n    description?: React.ReactNode;\n}\n\nexport const IconPicker: React.FC<IconPickerProps> = ({\n    value,\n    onChange,\n    label,\n    description,\n    validation\n}) => {\n    const [filter, setFilter] = useState(\"\");\n    const [mustRenderGrid, setMustRenderGrid] = useState(false);\n    const inputRef = useRef<HTMLInputElement>(null);\n\n    useEffect(() => {\n        setTimeout(() => {\n            if (mustRenderGrid && inputRef.current) {\n                inputRef.current.focus();\n            }\n        }, 50);\n    }, [mustRenderGrid]);\n\n    const onFilterChange = useCallback(\n        (value, cb) => {\n            setFilter(value);\n            cb();\n        },\n        [filter]\n    );\n\n    const allIcons: CmsIcon[] = useMemo(() => {\n        const iconPlugins = plugins.byType<CmsIconsPlugin>(\"cms-icons\");\n        return iconPlugins.reduce((icons: Array<CmsIcon>, pl) => {\n            return icons.concat(pl.getIcons());\n        }, []);\n    }, []);\n\n    const icons = useMemo(() => {\n        return filter ? allIcons.filter(ic => ic.name.includes(filter)) : allIcons;\n    }, [filter]);\n\n    const renderCell = useCallback(\n        ({ closeMenu }) => {\n            return function renderCell({\n                columnIndex,\n                key,\n                rowIndex,\n                style\n            }: GridCellProps): React.ReactNode {\n                const item = icons[rowIndex * COLUMN_COUNT + columnIndex];\n                if (!item) {\n                    return null;\n                }\n\n                return (\n                    <div\n                        key={key}\n                        style={style}\n                        className={gridItem}\n                        onClick={() => {\n                            if (onChange) {\n                                onChange(item.id.join(\"/\"));\n                            }\n                            closeMenu();\n                        }}\n                    >\n                        <FontAwesomeIcon icon={item.id} size={\"2x\"} />\n                        <Typography use={\"body2\"}>{item.name}</Typography>\n                    </div>\n                );\n            };\n        },\n        [icons]\n    );\n\n    const renderGrid = useCallback(\n        ({ closeMenu }) => {\n            return (\n                <>\n                    <DelayedOnChange value={filter} onChange={onFilterChange}>\n                        {({ value, onChange }) => (\n                            <Input\n                                inputRef={inputRef}\n                                className={searchInput}\n                                value={value}\n                                onChange={onChange}\n                                placeholder={\"Search icons...\"}\n                            />\n                        )}\n                    </DelayedOnChange>\n                    {icons.length === 0 ? (\n                        <div className={NoResultWrapper}>\n                            <Typography use=\"body1\">No results found.</Typography>\n                        </div>\n                    ) : (\n                        <Grid\n                            className={grid}\n                            cellRenderer={renderCell({ closeMenu })}\n                            columnCount={COLUMN_COUNT}\n                            columnWidth={100}\n                            height={440}\n                            rowCount={Math.ceil(icons.length / COLUMN_COUNT)}\n                            rowHeight={100}\n                            width={640}\n                        />\n                    )}\n                </>\n            );\n        },\n        [icons]\n    );\n\n    const fontAwesomeIconValue: any =\n        typeof value === \"string\" && value.includes(\"/\") ? value.split(\"/\") : [\"fas\", \"star\"];\n\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n\n    return (\n        <>\n            {label && (\n                <div className={iconPickerLabel}>\n                    <Typography use={\"body1\"}>{label}</Typography>\n                </div>\n            )}\n\n            <Menu\n                onOpen={() => setMustRenderGrid(true)}\n                onClose={() => setMustRenderGrid(false)}\n                handle={\n                    <div className={MenuWrapper}>\n                        <div className={pickIcon}>\n                            <FontAwesomeIcon icon={fontAwesomeIconValue} size={\"2x\"} />\n                        </div>\n                    </div>\n                }\n            >\n                {mustRenderGrid && renderGrid}\n            </Menu>\n\n            {validationIsValid === false && (\n                <FormElementMessage error>{validationMessage}</FormElementMessage>\n            )}\n            {validationIsValid !== false && description && (\n                <FormElementMessage>{description}</FormElementMessage>\n            )}\n        </>\n    );\n};\n"],"mappings":"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"}

package/admin/components/ModelFieldProvider/ModelFieldContext.d.ts

@@ -20,7 +20,7 @@ export declare const ModelFieldContext: React.Context<{
         type?: string | undefined;
         fields?: any[] | undefined;
         layout?: string[][] | undefined;
-        models?: Pick<import("../../../types").CmsModel, "name" | "modelId">[] | undefined;
+        models?: Pick<import("../../../types").CmsModel, "modelId">[] | undefined;
         templates?: import("../../../types").CmsDynamicZoneTemplate[] | undefined;
         imagesOnly?: boolean | undefined;
     } | undefined;

package/admin/components/ModelFieldProvider/ModelFieldContext.js

@@ -1,24 +1,18 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ModelFieldProvider = exports.ModelFieldContext = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var ModelFieldContext = /*#__PURE__*/_react.default.createContext(undefined);
-
 exports.ModelFieldContext = ModelFieldContext;
-
 var ModelFieldProvider = function ModelFieldProvider(_ref) {
   var field = _ref.field,
-      children = _ref.children;
+    children = _ref.children;
   return /*#__PURE__*/_react.default.createElement(ModelFieldContext.Provider, {
     value: field
   }, children);
 };
-
 exports.ModelFieldProvider = ModelFieldProvider;

package/admin/components/ModelFieldProvider/ModelFieldContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["ModelFieldContext","React","createContext","undefined","ModelFieldProvider","field","children"],"sources":["ModelFieldContext.tsx"],"sourcesContent":["import React from \"react\";\nimport { CmsModelField } from \"~/types\";\n\nexport type ModelFieldContext = CmsModelField;\n\nexport const ModelFieldContext = React.createContext<ModelFieldContext | undefined>(undefined);\n\nexport interface ModelFieldProviderProps {\n    field: CmsModelField;\n    children: React.ReactNode;\n}\n\nexport const ModelFieldProvider = ({ field, children }: ModelFieldProviderProps) => {\n    return <ModelFieldContext.Provider value={field}>{children}</ModelFieldContext.Provider>;\n};\n"],"mappings":";;;;;;;;;AAAA;;AAKO,IAAMA,iBAAiB,gBAAGC,cAAA,CAAMC,aAAN,CAAmDC,SAAnD,CAA1B;;;;AAOA,IAAMC,kBAAkB,GAAG,SAArBA,kBAAqB,OAAkD;EAAA,IAA/CC,KAA+C,QAA/CA,KAA+C;EAAA,IAAxCC,QAAwC,QAAxCA,QAAwC;EAChF,oBAAO,6BAAC,iBAAD,CAAmB,QAAnB;IAA4B,KAAK,EAAED;EAAnC,GAA2CC,QAA3C,CAAP;AACH,CAFM"}
+{"version":3,"names":["ModelFieldContext","React","createContext","undefined","ModelFieldProvider","field","children"],"sources":["ModelFieldContext.tsx"],"sourcesContent":["import React from \"react\";\nimport { CmsModelField } from \"~/types\";\n\nexport type ModelFieldContext = CmsModelField;\n\nexport const ModelFieldContext = React.createContext<ModelFieldContext | undefined>(undefined);\n\nexport interface ModelFieldProviderProps {\n    field: CmsModelField;\n    children: React.ReactNode;\n}\n\nexport const ModelFieldProvider = ({ field, children }: ModelFieldProviderProps) => {\n    return <ModelFieldContext.Provider value={field}>{children}</ModelFieldContext.Provider>;\n};\n"],"mappings":";;;;;;;AAAA;AAKO,IAAMA,iBAAiB,gBAAGC,cAAK,CAACC,aAAa,CAAgCC,SAAS,CAAC;AAAC;AAOxF,IAAMC,kBAAkB,GAAG,SAArBA,kBAAkB,OAAqD;EAAA,IAA/CC,KAAK,QAALA,KAAK;IAAEC,QAAQ,QAARA,QAAQ;EAChD,oBAAO,6BAAC,iBAAiB,CAAC,QAAQ;IAAC,KAAK,EAAED;EAAM,GAAEC,QAAQ,CAA8B;AAC5F,CAAC;AAAC"}

package/admin/components/ModelFieldProvider/index.js

@@ -3,9 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
 var _ModelFieldContext = require("./ModelFieldContext");
-
 Object.keys(_ModelFieldContext).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _ModelFieldContext[key]) return;
@@ -16,9 +14,7 @@ Object.keys(_ModelFieldContext).forEach(function (key) {
     }
   });
 });
-
 var _useModelField = require("./useModelField");
-
 Object.keys(_useModelField).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _useModelField[key]) return;

package/admin/components/ModelFieldProvider/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./ModelFieldContext\";\nexport * from \"./useModelField\";\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./ModelFieldContext\";\nexport * from \"./useModelField\";\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}

package/admin/components/ModelFieldProvider/useModelField.d.ts

@@ -22,7 +22,7 @@ export declare function useModelField(): {
             type?: string | undefined;
             fields?: any[] | undefined;
             layout?: string[][] | undefined;
-            models?: Pick<import("../../../types").CmsModel, "name" | "modelId">[] | undefined;
+            models?: Pick<import("../../../types").CmsModel, "modelId">[] | undefined;
             templates?: import("../../../types").CmsDynamicZoneTemplate[] | undefined;
             imagesOnly?: boolean | undefined;
         } | undefined;

package/admin/components/ModelFieldProvider/useModelField.js

@@ -4,36 +4,27 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useModelField = useModelField;
-
 var _react = require("react");
-
 var _ModelFieldContext = require("./ModelFieldContext");
-
 var _plugins = require("@webiny/plugins");
-
 var getFieldPlugin = function getFieldPlugin(type) {
   var plugin = _plugins.plugins.byType("cms-editor-field-type").find(function (plugin) {
     return plugin.field.type === type;
   });
-
   if (!plugin) {
     throw Error("Missing plugin for field type \"".concat(type, "\"!"));
   }
-
   return plugin;
 };
+
 /**
  * Get model field from the current context.
  */
-
-
 function useModelField() {
   var field = (0, _react.useContext)(_ModelFieldContext.ModelFieldContext);
-
   if (!field) {
     throw Error("Missing \"ModelFieldProvider\" in the component tree. Are you using the \"useModelField()\" hook in the right place?");
   }
-
   var fieldPlugin = getFieldPlugin(field.type);
   return {
     field: field,

package/admin/components/ModelFieldProvider/useModelField.js.map

@@ -1 +1 @@
-{"version":3,"names":["getFieldPlugin","type","plugin","plugins","byType","find","field","Error","useModelField","useContext","ModelFieldContext","fieldPlugin"],"sources":["useModelField.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { ModelFieldContext } from \"./ModelFieldContext\";\nimport { plugins } from \"@webiny/plugins\";\nimport { CmsModelFieldTypePlugin } from \"~/types\";\n\ninterface GetFieldPlugin {\n    (type: string): CmsModelFieldTypePlugin;\n}\n\nconst getFieldPlugin: GetFieldPlugin = type => {\n    const plugin = plugins\n        .byType<CmsModelFieldTypePlugin>(\"cms-editor-field-type\")\n        .find(plugin => plugin.field.type === type);\n\n    if (!plugin) {\n        throw Error(`Missing plugin for field type \"${type}\"!`);\n    }\n\n    return plugin;\n};\n\n/**\n * Get model field from the current context.\n */\nexport function useModelField() {\n    const field = useContext(ModelFieldContext);\n    if (!field) {\n        throw Error(\n            `Missing \"ModelFieldProvider\" in the component tree. Are you using the \"useModelField()\" hook in the right place?`\n        );\n    }\n\n    const fieldPlugin = getFieldPlugin(field.type);\n\n    return { field, fieldPlugin };\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAOA,IAAMA,cAA8B,GAAG,SAAjCA,cAAiC,CAAAC,IAAI,EAAI;EAC3C,IAAMC,MAAM,GAAGC,gBAAA,CACVC,MADU,CACsB,uBADtB,EAEVC,IAFU,CAEL,UAAAH,MAAM;IAAA,OAAIA,MAAM,CAACI,KAAP,CAAaL,IAAb,KAAsBA,IAA1B;EAAA,CAFD,CAAf;;EAIA,IAAI,CAACC,MAAL,EAAa;IACT,MAAMK,KAAK,2CAAmCN,IAAnC,SAAX;EACH;;EAED,OAAOC,MAAP;AACH,CAVD;AAYA;AACA;AACA;;;AACO,SAASM,aAAT,GAAyB;EAC5B,IAAMF,KAAK,GAAG,IAAAG,iBAAA,EAAWC,oCAAX,CAAd;;EACA,IAAI,CAACJ,KAAL,EAAY;IACR,MAAMC,KAAK,wHAAX;EAGH;;EAED,IAAMI,WAAW,GAAGX,cAAc,CAACM,KAAK,CAACL,IAAP,CAAlC;EAEA,OAAO;IAAEK,KAAK,EAALA,KAAF;IAASK,WAAW,EAAXA;EAAT,CAAP;AACH"}
+{"version":3,"names":["getFieldPlugin","type","plugin","plugins","byType","find","field","Error","useModelField","useContext","ModelFieldContext","fieldPlugin"],"sources":["useModelField.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { ModelFieldContext } from \"./ModelFieldContext\";\nimport { plugins } from \"@webiny/plugins\";\nimport { CmsModelFieldTypePlugin } from \"~/types\";\n\ninterface GetFieldPlugin {\n    (type: string): CmsModelFieldTypePlugin;\n}\n\nconst getFieldPlugin: GetFieldPlugin = type => {\n    const plugin = plugins\n        .byType<CmsModelFieldTypePlugin>(\"cms-editor-field-type\")\n        .find(plugin => plugin.field.type === type);\n\n    if (!plugin) {\n        throw Error(`Missing plugin for field type \"${type}\"!`);\n    }\n\n    return plugin;\n};\n\n/**\n * Get model field from the current context.\n */\nexport function useModelField() {\n    const field = useContext(ModelFieldContext);\n    if (!field) {\n        throw Error(\n            `Missing \"ModelFieldProvider\" in the component tree. Are you using the \"useModelField()\" hook in the right place?`\n        );\n    }\n\n    const fieldPlugin = getFieldPlugin(field.type);\n\n    return { field, fieldPlugin };\n}\n"],"mappings":";;;;;;AAAA;AACA;AACA;AAOA,IAAMA,cAA8B,GAAG,SAAjCA,cAA8B,CAAGC,IAAI,EAAI;EAC3C,IAAMC,MAAM,GAAGC,gBAAO,CACjBC,MAAM,CAA0B,uBAAuB,CAAC,CACxDC,IAAI,CAAC,UAAAH,MAAM;IAAA,OAAIA,MAAM,CAACI,KAAK,CAACL,IAAI,KAAKA,IAAI;EAAA,EAAC;EAE/C,IAAI,CAACC,MAAM,EAAE;IACT,MAAMK,KAAK,2CAAmCN,IAAI,SAAK;EAC3D;EAEA,OAAOC,MAAM;AACjB,CAAC;;AAED;AACA;AACA;AACO,SAASM,aAAa,GAAG;EAC5B,IAAMF,KAAK,GAAG,IAAAG,iBAAU,EAACC,oCAAiB,CAAC;EAC3C,IAAI,CAACJ,KAAK,EAAE;IACR,MAAMC,KAAK,wHAEV;EACL;EAEA,IAAMI,WAAW,GAAGX,cAAc,CAACM,KAAK,CAACL,IAAI,CAAC;EAE9C,OAAO;IAAEK,KAAK,EAALA,KAAK;IAAEK,WAAW,EAAXA;EAAY,CAAC;AACjC"}

package/admin/components/ModelProvider/ModelContext.js

@@ -1,24 +1,18 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ModelProvider = exports.ModelContext = void 0;
-
 var _react = _interopRequireDefault(require("react"));
-
 var ModelContext = /*#__PURE__*/_react.default.createContext(undefined);
-
 exports.ModelContext = ModelContext;
-
 var ModelProvider = function ModelProvider(_ref) {
   var model = _ref.model,
-      children = _ref.children;
+    children = _ref.children;
   return /*#__PURE__*/_react.default.createElement(ModelContext.Provider, {
     value: model
   }, children);
 };
-
 exports.ModelProvider = ModelProvider;

package/admin/components/ModelProvider/ModelContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["ModelContext","React","createContext","undefined","ModelProvider","model","children"],"sources":["ModelContext.tsx"],"sourcesContent":["import React from \"react\";\nimport { CmsModel } from \"~/types\";\n\nexport type ModelContext = CmsModel;\n\nexport const ModelContext = React.createContext<ModelContext | undefined>(undefined);\n\nexport interface ModelProviderProps {\n    model: CmsModel;\n    children: React.ReactNode;\n}\n\nexport const ModelProvider = ({ model, children }: ModelProviderProps) => {\n    return <ModelContext.Provider value={model}>{children}</ModelContext.Provider>;\n};\n"],"mappings":";;;;;;;;;AAAA;;AAKO,IAAMA,YAAY,gBAAGC,cAAA,CAAMC,aAAN,CAA8CC,SAA9C,CAArB;;;;AAOA,IAAMC,aAAa,GAAG,SAAhBA,aAAgB,OAA6C;EAAA,IAA1CC,KAA0C,QAA1CA,KAA0C;EAAA,IAAnCC,QAAmC,QAAnCA,QAAmC;EACtE,oBAAO,6BAAC,YAAD,CAAc,QAAd;IAAuB,KAAK,EAAED;EAA9B,GAAsCC,QAAtC,CAAP;AACH,CAFM"}
+{"version":3,"names":["ModelContext","React","createContext","undefined","ModelProvider","model","children"],"sources":["ModelContext.tsx"],"sourcesContent":["import React from \"react\";\nimport { CmsModel } from \"~/types\";\n\nexport type ModelContext = CmsModel;\n\nexport const ModelContext = React.createContext<ModelContext | undefined>(undefined);\n\nexport interface ModelProviderProps {\n    model: CmsModel;\n    children: React.ReactNode;\n}\n\nexport const ModelProvider = ({ model, children }: ModelProviderProps) => {\n    return <ModelContext.Provider value={model}>{children}</ModelContext.Provider>;\n};\n"],"mappings":";;;;;;;AAAA;AAKO,IAAMA,YAAY,gBAAGC,cAAK,CAACC,aAAa,CAA2BC,SAAS,CAAC;AAAC;AAO9E,IAAMC,aAAa,GAAG,SAAhBA,aAAa,OAAgD;EAAA,IAA1CC,KAAK,QAALA,KAAK;IAAEC,QAAQ,QAARA,QAAQ;EAC3C,oBAAO,6BAAC,YAAY,CAAC,QAAQ;IAAC,KAAK,EAAED;EAAM,GAAEC,QAAQ,CAAyB;AAClF,CAAC;AAAC"}

package/admin/components/ModelProvider/index.js

@@ -3,9 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-
 var _ModelContext = require("./ModelContext");
-
 Object.keys(_ModelContext).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _ModelContext[key]) return;
@@ -16,9 +14,7 @@ Object.keys(_ModelContext).forEach(function (key) {
     }
   });
 });
-
 var _useModel = require("./useModel");
-
 Object.keys(_useModel).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _useModel[key]) return;

package/admin/components/ModelProvider/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./ModelContext\";\nexport * from \"./useModel\";\n"],"mappings":";;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./ModelContext\";\nexport * from \"./useModel\";\n"],"mappings":";;;;;AAAA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AACA;AAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}

package/admin/components/ModelProvider/useModel.js

@@ -4,21 +4,16 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.useModel = useModel;
-
 var _react = require("react");
-
 var _ModelContext = require("./ModelContext");
-
 /**
  * Get model from the current context.
  */
 function useModel() {
   var model = (0, _react.useContext)(_ModelContext.ModelContext);
-
   if (!model) {
     throw Error("Missing \"ModelContext\" in the component tree. Are you using the \"useModel()\" hook in the right place?");
   }
-
   return {
     model: model
   };

package/admin/components/ModelProvider/useModel.js.map

@@ -1 +1 @@
-{"version":3,"names":["useModel","model","useContext","ModelContext","Error"],"sources":["useModel.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { ModelContext } from \"./ModelContext\";\nimport { CmsModel } from \"~/types\";\n\ntype UseModelReturnType = {\n    model: CmsModel;\n};\n\n/**\n * Get model from the current context.\n */\nexport function useModel(): UseModelReturnType {\n    const model = useContext(ModelContext);\n    if (!model) {\n        throw Error(\n            `Missing \"ModelContext\" in the component tree. Are you using the \"useModel()\" hook in the right place?`\n        );\n    }\n\n    return { model };\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAOA;AACA;AACA;AACO,SAASA,QAAT,GAAwC;EAC3C,IAAMC,KAAK,GAAG,IAAAC,iBAAA,EAAWC,0BAAX,CAAd;;EACA,IAAI,CAACF,KAAL,EAAY;IACR,MAAMG,KAAK,6GAAX;EAGH;;EAED,OAAO;IAAEH,KAAK,EAALA;EAAF,CAAP;AACH"}
+{"version":3,"names":["useModel","model","useContext","ModelContext","Error"],"sources":["useModel.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { ModelContext } from \"./ModelContext\";\nimport { CmsModel } from \"~/types\";\n\ntype UseModelReturnType = {\n    model: CmsModel;\n};\n\n/**\n * Get model from the current context.\n */\nexport function useModel(): UseModelReturnType {\n    const model = useContext(ModelContext);\n    if (!model) {\n        throw Error(\n            `Missing \"ModelContext\" in the component tree. Are you using the \"useModel()\" hook in the right place?`\n        );\n    }\n\n    return { model };\n}\n"],"mappings":";;;;;;AAAA;AACA;AAOA;AACA;AACA;AACO,SAASA,QAAQ,GAAuB;EAC3C,IAAMC,KAAK,GAAG,IAAAC,iBAAU,EAACC,0BAAY,CAAC;EACtC,IAAI,CAACF,KAAK,EAAE;IACR,MAAMG,KAAK,6GAEV;EACL;EAEA,OAAO;IAAEH,KAAK,EAALA;EAAM,CAAC;AACpB"}

package/admin/constants/statusLabels.js

@@ -1,20 +1,14 @@
 "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 _i18n = require("@webiny/app/i18n");
-
 var _templateObject, _templateObject2, _templateObject3;
-
 var t = _i18n.i18n.ns("app-headless-cms/admin/content-entries/status");
-
 var statuses = {
   draft: t(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["Draft"]))),
   published: t(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["Published"]))),

package/admin/constants/statusLabels.js.map

@@ -1 +1 @@
-{"version":3,"names":["t","i18n","ns","statuses","draft","published","unpublished"],"sources":["statusLabels.ts"],"sourcesContent":["import { i18n } from \"@webiny/app/i18n\";\nconst t = i18n.ns(\"app-headless-cms/admin/content-entries/status\");\n\nconst statuses: Record<string, string> = {\n    draft: t`Draft`,\n    published: t`Published`,\n    unpublished: t`Unpublished`\n};\nexport default statuses;\n"],"mappings":";;;;;;;;;;;AAAA;;;;AACA,IAAMA,CAAC,GAAGC,UAAA,CAAKC,EAAL,CAAQ,+CAAR,CAAV;;AAEA,IAAMC,QAAgC,GAAG;EACrCC,KAAK,EAAEJ,CAAF,wFADgC;EAErCK,SAAS,EAAEL,CAAF,8FAF4B;EAGrCM,WAAW,EAAEN,CAAF;AAH0B,CAAzC;eAKeG,Q"}
+{"version":3,"names":["t","i18n","ns","statuses","draft","published","unpublished"],"sources":["statusLabels.ts"],"sourcesContent":["import { i18n } from \"@webiny/app/i18n\";\nconst t = i18n.ns(\"app-headless-cms/admin/content-entries/status\");\n\nconst statuses: Record<string, string> = {\n    draft: t`Draft`,\n    published: t`Published`,\n    unpublished: t`Unpublished`\n};\nexport default statuses;\n"],"mappings":";;;;;;;;AAAA;AAAwC;AACxC,IAAMA,CAAC,GAAGC,UAAI,CAACC,EAAE,CAAC,+CAA+C,CAAC;AAElE,IAAMC,QAAgC,GAAG;EACrCC,KAAK,EAAEJ,CAAC,wFAAO;EACfK,SAAS,EAAEL,CAAC,8FAAW;EACvBM,WAAW,EAAEN,CAAC;AAClB,CAAC;AAAC,eACaG,QAAQ;AAAA"}

package/admin/contexts/Cms/NetworkError.js

@@ -1,17 +1,12 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.GET_ERROR = void 0;
-
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
-
 var _graphqlTag = _interopRequireDefault(require("graphql-tag"));
-
 var _templateObject;
-
 var GET_ERROR = (0, _graphqlTag.default)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    {\n        networkError\n    }\n"])));
 exports.GET_ERROR = GET_ERROR;

package/admin/contexts/Cms/NetworkError.js.map

@@ -1 +1 @@
-{"version":3,"names":["GET_ERROR","gql"],"sources":["NetworkError.tsx"],"sourcesContent":["import gql from \"graphql-tag\";\n\nconst GET_ERROR = gql`\n    {\n        networkError\n    }\n`;\n\nexport { GET_ERROR };\n"],"mappings":";;;;;;;;;;;AAAA;;;;AAEA,IAAMA,SAAS,OAAGC,mBAAH,0HAAf"}
+{"version":3,"names":["GET_ERROR","gql"],"sources":["NetworkError.tsx"],"sourcesContent":["import gql from \"graphql-tag\";\n\nconst GET_ERROR = gql`\n    {\n        networkError\n    }\n`;\n\nexport { GET_ERROR };\n"],"mappings":";;;;;;;;AAAA;AAA8B;AAE9B,IAAMA,SAAS,OAAGC,mBAAG,0HAIpB;AAAC"}