@webiny/app-headless-cms 5.33.5-beta.0 → 5.34.0-beta.0

package/admin/components/FieldEditor/Styled.js

@@ -12,18 +12,9 @@ var _emotion = require("emotion");
 var _styled = _interopRequireDefault(require("@emotion/styled"));
 
 var RowContainer = /*#__PURE__*/(0, _styled.default)("div", {
-  target: "e1pk1rsi0",
-  label: "RowContainer"
-})({
-  position: "relative",
-  display: "flex",
-  flexDirection: "column",
-  marginBottom: 20,
-  borderRadius: 2,
-  backgroundColor: "var(--mdc-theme-surface)",
-  border: "1px solid var(--mdc-theme-on-background)",
-  boxShadow: "var(--mdc-theme-on-background) 1px 1px 1px, var(--mdc-theme-on-background) 1px 1px 2px"
-});
+  label: "RowContainer",
+  target: "e1pk1rsi0"
+})("position:relative;display:flex;flex-direction:column;margin-bottom:20px;border-radius:2px;background-color:var(--mdc-theme-surface);border:1px solid var(--mdc-theme-on-background);box-shadow:var(--mdc-theme-on-background) 1px 1px 1px,var(--mdc-theme-on-background) 1px 1px 2px;:last-child{margin-bottom:5px;}");
 exports.RowContainer = RowContainer;
 var Row = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1pk1rsi1",
@@ -41,7 +32,7 @@ var fieldContainer = /*#__PURE__*/(0, _emotion.css)({
   position: "relative",
   flex: "1 100%",
   backgroundColor: "var(--mdc-theme-background)",
-  padding: "0 15px",
+  padding: "0 15px 5px",
   margin: 10,
   borderRadius: 2,
   border: "1px solid var(--mdc-theme-on-background)",

package/admin/components/FieldEditor/Styled.js.map

@@ -1 +1 @@
-{"version":3,"names":["RowContainer","styled","position","display","flexDirection","marginBottom","borderRadius","backgroundColor","border","boxShadow","Row","paddingLeft","paddingRight","fieldContainer","css","flex","padding","margin","transition","color","cursor","rowHandle","width","left","top","transform","zIndex","fieldHandle"],"sources":["Styled.ts"],"sourcesContent":["import { css } from \"emotion\";\nimport styled from \"@emotion/styled\";\n\nexport const RowContainer = styled(\"div\")({\n    position: \"relative\",\n    display: \"flex\",\n    flexDirection: \"column\",\n    marginBottom: 20,\n    borderRadius: 2,\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    border: \"1px solid var(--mdc-theme-on-background)\",\n    boxShadow:\n        \"var(--mdc-theme-on-background) 1px 1px 1px, var(--mdc-theme-on-background) 1px 1px 2px\"\n});\n\nexport const Row = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    paddingLeft: 40,\n    paddingRight: 10,\n    position: \"relative\"\n});\n\nexport const fieldContainer = css({\n    position: \"relative\",\n    flex: \"1 100%\",\n    backgroundColor: \"var(--mdc-theme-background)\",\n    padding: \"0 15px\",\n    margin: 10,\n    borderRadius: 2,\n    border: \"1px solid var(--mdc-theme-on-background)\",\n    transition: \"box-shadow 225ms\",\n    color: \"var(--mdc-theme-on-surface)\",\n    cursor: \"grab\",\n    \"&:hover\": {\n        boxShadow:\n            \"var(--mdc-theme-on-background) 1px 1px 1px, var(--mdc-theme-on-background) 1px 1px 2px\"\n    }\n});\n\nexport const rowHandle = css({\n    width: 30,\n    cursor: \"grab\",\n    position: \"absolute\",\n    left: 10,\n    top: \"50%\",\n    transform: \"translateY(-50%)\",\n    zIndex: 1,\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\nexport const fieldHandle = css({\n    cursor: \"grab\"\n});\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEO,IAAMA,YAAY,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACtCC,QAAQ,EAAE,UAD4B;EAEtCC,OAAO,EAAE,MAF6B;EAGtCC,aAAa,EAAE,QAHuB;EAItCC,YAAY,EAAE,EAJwB;EAKtCC,YAAY,EAAE,CALwB;EAMtCC,eAAe,EAAE,0BANqB;EAOtCC,MAAM,EAAE,0CAP8B;EAQtCC,SAAS,EACL;AATkC,CAAjB,CAAlB;;AAYA,IAAMC,GAAG,oBAAGT,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EAC7BE,OAAO,EAAE,MADoB;EAE7BC,aAAa,EAAE,KAFc;EAG7BG,eAAe,EAAE,0BAHY;EAI7BI,WAAW,EAAE,EAJgB;EAK7BC,YAAY,EAAE,EALe;EAM7BV,QAAQ,EAAE;AANmB,CAAjB,CAAT;;AASA,IAAMW,cAAc,gBAAG,IAAAC,YAAA,EAAI;EAC9BZ,QAAQ,EAAE,UADoB;EAE9Ba,IAAI,EAAE,QAFwB;EAG9BR,eAAe,EAAE,6BAHa;EAI9BS,OAAO,EAAE,QAJqB;EAK9BC,MAAM,EAAE,EALsB;EAM9BX,YAAY,EAAE,CANgB;EAO9BE,MAAM,EAAE,0CAPsB;EAQ9BU,UAAU,EAAE,kBARkB;EAS9BC,KAAK,EAAE,6BATuB;EAU9BC,MAAM,EAAE,MAVsB;EAW9B,WAAW;IACPX,SAAS,EACL;EAFG;AAXmB,CAAJ,0BAAvB;;AAiBA,IAAMY,SAAS,gBAAG,IAAAP,YAAA,EAAI;EACzBQ,KAAK,EAAE,EADkB;EAEzBF,MAAM,EAAE,MAFiB;EAGzBlB,QAAQ,EAAE,UAHe;EAIzBqB,IAAI,EAAE,EAJmB;EAKzBC,GAAG,EAAE,KALoB;EAMzBC,SAAS,EAAE,kBANc;EAOzBC,MAAM,EAAE,CAPiB;EAQzBP,KAAK,EAAE;AARkB,CAAJ,qBAAlB;;AAWA,IAAMQ,WAAW,gBAAG,IAAAb,YAAA,EAAI;EAC3BM,MAAM,EAAE;AADmB,CAAJ,uBAApB"}
+{"version":3,"names":["RowContainer","styled","Row","display","flexDirection","backgroundColor","paddingLeft","paddingRight","position","fieldContainer","css","flex","padding","margin","borderRadius","border","transition","color","cursor","boxShadow","rowHandle","width","left","top","transform","zIndex","fieldHandle"],"sources":["Styled.ts"],"sourcesContent":["import { css } from \"emotion\";\nimport styled from \"@emotion/styled\";\n\nexport const RowContainer = styled.div`\n    position: relative;\n    display: flex;\n    flex-direction: column;\n    margin-bottom: 20px;\n    border-radius: 2px;\n    background-color: var(--mdc-theme-surface);\n    border: 1px solid var(--mdc-theme-on-background);\n    box-shadow: var(--mdc-theme-on-background) 1px 1px 1px,\n        var(--mdc-theme-on-background) 1px 1px 2px;\n    :last-child {\n        margin-bottom: 5px;\n    }\n`;\n\nexport const Row = styled(\"div\")({\n    display: \"flex\",\n    flexDirection: \"row\",\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    paddingLeft: 40,\n    paddingRight: 10,\n    position: \"relative\"\n});\n\nexport const fieldContainer = css({\n    position: \"relative\",\n    flex: \"1 100%\",\n    backgroundColor: \"var(--mdc-theme-background)\",\n    padding: \"0 15px 5px\",\n    margin: 10,\n    borderRadius: 2,\n    border: \"1px solid var(--mdc-theme-on-background)\",\n    transition: \"box-shadow 225ms\",\n    color: \"var(--mdc-theme-on-surface)\",\n    cursor: \"grab\",\n    \"&:hover\": {\n        boxShadow:\n            \"var(--mdc-theme-on-background) 1px 1px 1px, var(--mdc-theme-on-background) 1px 1px 2px\"\n    }\n});\n\nexport const rowHandle = css({\n    width: 30,\n    cursor: \"grab\",\n    position: \"absolute\",\n    left: 10,\n    top: \"50%\",\n    transform: \"translateY(-50%)\",\n    zIndex: 1,\n    color: \"var(--mdc-theme-on-surface)\"\n});\n\nexport const fieldHandle = css({\n    cursor: \"grab\"\n});\n"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEO,IAAMA,YAAY,oBAAGC,eAAH;EAAA;EAAA;AAAA,0TAAlB;;AAeA,IAAMC,GAAG,oBAAGD,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EAC7BE,OAAO,EAAE,MADoB;EAE7BC,aAAa,EAAE,KAFc;EAG7BC,eAAe,EAAE,0BAHY;EAI7BC,WAAW,EAAE,EAJgB;EAK7BC,YAAY,EAAE,EALe;EAM7BC,QAAQ,EAAE;AANmB,CAAjB,CAAT;;AASA,IAAMC,cAAc,gBAAG,IAAAC,YAAA,EAAI;EAC9BF,QAAQ,EAAE,UADoB;EAE9BG,IAAI,EAAE,QAFwB;EAG9BN,eAAe,EAAE,6BAHa;EAI9BO,OAAO,EAAE,YAJqB;EAK9BC,MAAM,EAAE,EALsB;EAM9BC,YAAY,EAAE,CANgB;EAO9BC,MAAM,EAAE,0CAPsB;EAQ9BC,UAAU,EAAE,kBARkB;EAS9BC,KAAK,EAAE,6BATuB;EAU9BC,MAAM,EAAE,MAVsB;EAW9B,WAAW;IACPC,SAAS,EACL;EAFG;AAXmB,CAAJ,0BAAvB;;AAiBA,IAAMC,SAAS,gBAAG,IAAAV,YAAA,EAAI;EACzBW,KAAK,EAAE,EADkB;EAEzBH,MAAM,EAAE,MAFiB;EAGzBV,QAAQ,EAAE,UAHe;EAIzBc,IAAI,EAAE,EAJmB;EAKzBC,GAAG,EAAE,KALoB;EAMzBC,SAAS,EAAE,kBANc;EAOzBC,MAAM,EAAE,CAPiB;EAQzBR,KAAK,EAAE;AARkB,CAAJ,qBAAlB;;AAWA,IAAMS,WAAW,gBAAG,IAAAhB,YAAA,EAAI;EAC3BQ,MAAM,EAAE;AADmB,CAAJ,uBAApB"}

package/admin/components/FieldEditor/index.d.ts

@@ -1,2 +1,2 @@
 export { FieldEditor } from "./FieldEditor";
-export { useFieldEditor } from "./useFieldEditor";
+export { useModelFieldEditor } from "./useModelFieldEditor";

package/admin/components/FieldEditor/index.js

@@ -9,13 +9,13 @@ Object.defineProperty(exports, "FieldEditor", {
     return _FieldEditor.FieldEditor;
   }
 });
-Object.defineProperty(exports, "useFieldEditor", {
+Object.defineProperty(exports, "useModelFieldEditor", {
   enumerable: true,
   get: function get() {
-    return _useFieldEditor.useFieldEditor;
+    return _useModelFieldEditor.useModelFieldEditor;
   }
 });
 
 var _FieldEditor = require("./FieldEditor");
 
-var _useFieldEditor = require("./useFieldEditor");
+var _useModelFieldEditor = require("./useModelFieldEditor");

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { FieldEditor } from \"./FieldEditor\";\nexport { useFieldEditor } from \"./useFieldEditor\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;AACA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { FieldEditor } from \"./FieldEditor\";\nexport { useModelFieldEditor } from \"./useModelFieldEditor\";\n"],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;AACA"}

package/admin/components/FieldEditor/useModelFieldEditor.d.ts

@@ -0,0 +1,2 @@
+import { FieldEditorContext } from "./FieldEditorContext";
+export declare function useModelFieldEditor(): FieldEditorContext;

package/admin/components/FieldEditor/useModelFieldEditor.js

@@ -0,0 +1,20 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useModelFieldEditor = useModelFieldEditor;
+
+var _react = require("react");
+
+var _FieldEditorContext = require("./FieldEditorContext");
+
+function useModelFieldEditor() {
+  var context = (0, _react.useContext)(_FieldEditorContext.FieldEditorContext);
+
+  if (!context) {
+    throw Error("FieldEditorContext is missing in the component tree. Are you useing the \"useFieldEditor()\" hook in the right place?");
+  }
+
+  return context;
+}

package/admin/components/FieldEditor/useModelFieldEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useModelFieldEditor","context","useContext","FieldEditorContext","Error"],"sources":["useModelFieldEditor.ts"],"sourcesContent":["import { useContext } from \"react\";\nimport { FieldEditorContext } from \"./FieldEditorContext\";\n\nexport function useModelFieldEditor() {\n    const context = useContext(FieldEditorContext);\n    if (!context) {\n        throw Error(\n            `FieldEditorContext is missing in the component tree. Are you useing the \"useFieldEditor()\" hook in the right place?`\n        );\n    }\n\n    return context;\n}\n"],"mappings":";;;;;;;AAAA;;AACA;;AAEO,SAASA,mBAAT,GAA+B;EAClC,IAAMC,OAAO,GAAG,IAAAC,iBAAA,EAAWC,sCAAX,CAAhB;;EACA,IAAI,CAACF,OAAL,EAAc;IACV,MAAMG,KAAK,yHAAX;EAGH;;EAED,OAAOH,OAAP;AACH"}

package/admin/components/FieldEditor/utils/deleteField.d.ts

@@ -1,7 +1,7 @@
-import { CmsEditorField, CmsModel } from "../../../../types";
+import { CmsModelField, CmsModel } from "../../../../types";
 declare type DeleteFieldParamsData = Pick<CmsModel, "fields" | "layout">;
 interface DeleteFieldParams {
-    field: Pick<CmsEditorField, "id">;
+    field: Pick<CmsModelField, "id">;
     data: DeleteFieldParamsData;
 }
 declare const _default: (params: DeleteFieldParams) => any;

package/admin/components/FieldEditor/utils/deleteField.js.map

@@ -1 +1 @@
-{"version":3,"names":["params","field","prev","data","fieldIndex","fields","findIndex","item","id","dot","delete","set","layout","newLayout","currentRowIndex","forEach","row","fieldId","find","Array","isArray","push","length"],"sources":["deleteField.ts"],"sourcesContent":["import dot from \"dot-prop-immutable\";\nimport { CmsEditorField, CmsModel } from \"~/types\";\n\ntype DeleteFieldParamsData = Pick<CmsModel, \"fields\" | \"layout\">;\ninterface DeleteFieldParams {\n    field: Pick<CmsEditorField, \"id\">;\n    data: DeleteFieldParamsData;\n}\nexport default (params: DeleteFieldParams) => {\n    const { field, data: prev } = params;\n    // Remove the field from fields list...\n    const fieldIndex = prev.fields.findIndex(item => item.id === field.id);\n    const data = dot.delete(prev, `fields.${fieldIndex}`) as DeleteFieldParamsData;\n\n    // ...and rebuild the layout object.\n    return dot.set(data, \"layout\", (layout: DeleteFieldParamsData[\"layout\"]) => {\n        if (!layout) {\n            return [];\n        }\n        const newLayout: DeleteFieldParamsData[\"layout\"] = [];\n        let currentRowIndex = 0;\n        layout.forEach(row => {\n            row.forEach(fieldId => {\n                const field = data.fields.find(item => item.id === fieldId);\n                if (!field) {\n                    return;\n                }\n                if (!Array.isArray(newLayout[currentRowIndex])) {\n                    newLayout[currentRowIndex] = [];\n                }\n\n                newLayout[currentRowIndex].push(fieldId);\n            });\n            newLayout[currentRowIndex] && newLayout[currentRowIndex].length && currentRowIndex++;\n        });\n\n        return newLayout;\n    });\n};\n"],"mappings":";;;;;;;;;AAAA;;eAQe,kBAACA,MAAD,EAA+B;EAC1C,IAAQC,KAAR,GAA8BD,MAA9B,CAAQC,KAAR;EAAA,IAAqBC,IAArB,GAA8BF,MAA9B,CAAeG,IAAf,CAD0C,CAE1C;;EACA,IAAMC,UAAU,GAAGF,IAAI,CAACG,MAAL,CAAYC,SAAZ,CAAsB,UAAAC,IAAI;IAAA,OAAIA,IAAI,CAACC,EAAL,KAAYP,KAAK,CAACO,EAAtB;EAAA,CAA1B,CAAnB;;EACA,IAAML,IAAI,GAAGM,yBAAA,CAAIC,MAAJ,CAAWR,IAAX,mBAA2BE,UAA3B,EAAb,CAJ0C,CAM1C;;;EACA,OAAOK,yBAAA,CAAIE,GAAJ,CAAQR,IAAR,EAAc,QAAd,EAAwB,UAACS,MAAD,EAA6C;IACxE,IAAI,CAACA,MAAL,EAAa;MACT,OAAO,EAAP;IACH;;IACD,IAAMC,SAA0C,GAAG,EAAnD;IACA,IAAIC,eAAe,GAAG,CAAtB;IACAF,MAAM,CAACG,OAAP,CAAe,UAAAC,GAAG,EAAI;MAClBA,GAAG,CAACD,OAAJ,CAAY,UAAAE,OAAO,EAAI;QACnB,IAAMhB,KAAK,GAAGE,IAAI,CAACE,MAAL,CAAYa,IAAZ,CAAiB,UAAAX,IAAI;UAAA,OAAIA,IAAI,CAACC,EAAL,KAAYS,OAAhB;QAAA,CAArB,CAAd;;QACA,IAAI,CAAChB,KAAL,EAAY;UACR;QACH;;QACD,IAAI,CAACkB,KAAK,CAACC,OAAN,CAAcP,SAAS,CAACC,eAAD,CAAvB,CAAL,EAAgD;UAC5CD,SAAS,CAACC,eAAD,CAAT,GAA6B,EAA7B;QACH;;QAEDD,SAAS,CAACC,eAAD,CAAT,CAA2BO,IAA3B,CAAgCJ,OAAhC;MACH,CAVD;MAWAJ,SAAS,CAACC,eAAD,CAAT,IAA8BD,SAAS,CAACC,eAAD,CAAT,CAA2BQ,MAAzD,IAAmER,eAAe,EAAlF;IACH,CAbD;IAeA,OAAOD,SAAP;EACH,CAtBM,CAAP;AAuBH,C"}
+{"version":3,"names":["params","field","prev","data","fieldIndex","fields","findIndex","item","id","dot","delete","set","layout","newLayout","currentRowIndex","forEach","row","fieldId","find","Array","isArray","push","length"],"sources":["deleteField.ts"],"sourcesContent":["import dot from \"dot-prop-immutable\";\nimport { CmsModelField, CmsModel } from \"~/types\";\n\ntype DeleteFieldParamsData = Pick<CmsModel, \"fields\" | \"layout\">;\ninterface DeleteFieldParams {\n    field: Pick<CmsModelField, \"id\">;\n    data: DeleteFieldParamsData;\n}\nexport default (params: DeleteFieldParams) => {\n    const { field, data: prev } = params;\n    // Remove the field from fields list...\n    const fieldIndex = prev.fields.findIndex(item => item.id === field.id);\n    const data = dot.delete(prev, `fields.${fieldIndex}`) as DeleteFieldParamsData;\n\n    // ...and rebuild the layout object.\n    return dot.set(data, \"layout\", (layout: DeleteFieldParamsData[\"layout\"]) => {\n        if (!layout) {\n            return [];\n        }\n        const newLayout: DeleteFieldParamsData[\"layout\"] = [];\n        let currentRowIndex = 0;\n        layout.forEach(row => {\n            row.forEach(fieldId => {\n                const field = data.fields.find(item => item.id === fieldId);\n                if (!field) {\n                    return;\n                }\n                if (!Array.isArray(newLayout[currentRowIndex])) {\n                    newLayout[currentRowIndex] = [];\n                }\n\n                newLayout[currentRowIndex].push(fieldId);\n            });\n            newLayout[currentRowIndex] && newLayout[currentRowIndex].length && currentRowIndex++;\n        });\n\n        return newLayout;\n    });\n};\n"],"mappings":";;;;;;;;;AAAA;;eAQe,kBAACA,MAAD,EAA+B;EAC1C,IAAQC,KAAR,GAA8BD,MAA9B,CAAQC,KAAR;EAAA,IAAqBC,IAArB,GAA8BF,MAA9B,CAAeG,IAAf,CAD0C,CAE1C;;EACA,IAAMC,UAAU,GAAGF,IAAI,CAACG,MAAL,CAAYC,SAAZ,CAAsB,UAAAC,IAAI;IAAA,OAAIA,IAAI,CAACC,EAAL,KAAYP,KAAK,CAACO,EAAtB;EAAA,CAA1B,CAAnB;;EACA,IAAML,IAAI,GAAGM,yBAAA,CAAIC,MAAJ,CAAWR,IAAX,mBAA2BE,UAA3B,EAAb,CAJ0C,CAM1C;;;EACA,OAAOK,yBAAA,CAAIE,GAAJ,CAAQR,IAAR,EAAc,QAAd,EAAwB,UAACS,MAAD,EAA6C;IACxE,IAAI,CAACA,MAAL,EAAa;MACT,OAAO,EAAP;IACH;;IACD,IAAMC,SAA0C,GAAG,EAAnD;IACA,IAAIC,eAAe,GAAG,CAAtB;IACAF,MAAM,CAACG,OAAP,CAAe,UAAAC,GAAG,EAAI;MAClBA,GAAG,CAACD,OAAJ,CAAY,UAAAE,OAAO,EAAI;QACnB,IAAMhB,KAAK,GAAGE,IAAI,CAACE,MAAL,CAAYa,IAAZ,CAAiB,UAAAX,IAAI;UAAA,OAAIA,IAAI,CAACC,EAAL,KAAYS,OAAhB;QAAA,CAArB,CAAd;;QACA,IAAI,CAAChB,KAAL,EAAY;UACR;QACH;;QACD,IAAI,CAACkB,KAAK,CAACC,OAAN,CAAcP,SAAS,CAACC,eAAD,CAAvB,CAAL,EAAgD;UAC5CD,SAAS,CAACC,eAAD,CAAT,GAA6B,EAA7B;QACH;;QAEDD,SAAS,CAACC,eAAD,CAAT,CAA2BO,IAA3B,CAAgCJ,OAAhC;MACH,CAVD;MAWAJ,SAAS,CAACC,eAAD,CAAT,IAA8BD,SAAS,CAACC,eAAD,CAAT,CAA2BQ,MAAzD,IAAmER,eAAe,EAAlF;IACH,CAbD;IAeA,OAAOD,SAAP;EACH,CAtBM,CAAP;AAuBH,C"}

package/admin/components/FieldEditor/utils/getFieldPosition.d.ts

@@ -1,6 +1,6 @@
-import { CmsEditorField, CmsModel, FieldLayoutPosition } from "../../../../types";
+import { CmsModelField, CmsModel, FieldLayoutPosition } from "../../../../types";
 interface GetFieldPositionParams {
-    field: string | CmsEditorField;
+    field: string | CmsModelField;
     data: Pick<CmsModel, "layout">;
 }
 declare const _default: (params: GetFieldPositionParams) => FieldLayoutPosition | null;

package/admin/components/FieldEditor/utils/getFieldPosition.js.map

@@ -1 +1 @@
-{"version":3,"names":["params","field","data","id","layout","i","length","row","j","index"],"sources":["getFieldPosition.ts"],"sourcesContent":["import { CmsEditorField, CmsModel, FieldLayoutPosition } from \"~/types\";\n\ninterface GetFieldPositionParams {\n    field: string | CmsEditorField;\n    data: Pick<CmsModel, \"layout\">;\n}\nexport default (params: GetFieldPositionParams): FieldLayoutPosition | null => {\n    const { field, data } = params;\n    const id = typeof field === \"string\" ? field : field.id;\n    const layout = data.layout ? data.layout : [];\n    for (let i = 0; i < layout.length; i++) {\n        const row = layout[i];\n        for (let j = 0; j < row.length; j++) {\n            if (row[j] === id) {\n                return { row: i, index: j };\n            }\n        }\n    }\n\n    return null;\n};\n"],"mappings":";;;;;;;eAMe,kBAACA,MAAD,EAAgE;EAC3E,IAAQC,KAAR,GAAwBD,MAAxB,CAAQC,KAAR;EAAA,IAAeC,IAAf,GAAwBF,MAAxB,CAAeE,IAAf;EACA,IAAMC,EAAE,GAAG,OAAOF,KAAP,KAAiB,QAAjB,GAA4BA,KAA5B,GAAoCA,KAAK,CAACE,EAArD;EACA,IAAMC,MAAM,GAAGF,IAAI,CAACE,MAAL,GAAcF,IAAI,CAACE,MAAnB,GAA4B,EAA3C;;EACA,KAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGD,MAAM,CAACE,MAA3B,EAAmCD,CAAC,EAApC,EAAwC;IACpC,IAAME,GAAG,GAAGH,MAAM,CAACC,CAAD,CAAlB;;IACA,KAAK,IAAIG,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGD,GAAG,CAACD,MAAxB,EAAgCE,CAAC,EAAjC,EAAqC;MACjC,IAAID,GAAG,CAACC,CAAD,CAAH,KAAWL,EAAf,EAAmB;QACf,OAAO;UAAEI,GAAG,EAAEF,CAAP;UAAUI,KAAK,EAAED;QAAjB,CAAP;MACH;IACJ;EACJ;;EAED,OAAO,IAAP;AACH,C"}
+{"version":3,"names":["params","field","data","id","layout","i","length","row","j","index"],"sources":["getFieldPosition.ts"],"sourcesContent":["import { CmsModelField, CmsModel, FieldLayoutPosition } from \"~/types\";\n\ninterface GetFieldPositionParams {\n    field: string | CmsModelField;\n    data: Pick<CmsModel, \"layout\">;\n}\nexport default (params: GetFieldPositionParams): FieldLayoutPosition | null => {\n    const { field, data } = params;\n    const id = typeof field === \"string\" ? field : field.id;\n    const layout = data.layout ? data.layout : [];\n    for (let i = 0; i < layout.length; i++) {\n        const row = layout[i];\n        for (let j = 0; j < row.length; j++) {\n            if (row[j] === id) {\n                return { row: i, index: j };\n            }\n        }\n    }\n\n    return null;\n};\n"],"mappings":";;;;;;;eAMe,kBAACA,MAAD,EAAgE;EAC3E,IAAQC,KAAR,GAAwBD,MAAxB,CAAQC,KAAR;EAAA,IAAeC,IAAf,GAAwBF,MAAxB,CAAeE,IAAf;EACA,IAAMC,EAAE,GAAG,OAAOF,KAAP,KAAiB,QAAjB,GAA4BA,KAA5B,GAAoCA,KAAK,CAACE,EAArD;EACA,IAAMC,MAAM,GAAGF,IAAI,CAACE,MAAL,GAAcF,IAAI,CAACE,MAAnB,GAA4B,EAA3C;;EACA,KAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGD,MAAM,CAACE,MAA3B,EAAmCD,CAAC,EAApC,EAAwC;IACpC,IAAME,GAAG,GAAGH,MAAM,CAACC,CAAD,CAAlB;;IACA,KAAK,IAAIG,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGD,GAAG,CAACD,MAAxB,EAAgCE,CAAC,EAAjC,EAAqC;MACjC,IAAID,GAAG,CAACC,CAAD,CAAH,KAAWL,EAAf,EAAmB;QACf,OAAO;UAAEI,GAAG,EAAEF,CAAP;UAAUI,KAAK,EAAED;QAAjB,CAAP;MACH;IACJ;EACJ;;EAED,OAAO,IAAP;AACH,C"}

package/admin/components/FieldEditor/utils/moveField.d.ts

@@ -1,8 +1,8 @@
-import { CmsEditorField, CmsEditorFieldId, FieldLayoutPosition } from "../../../../types";
+import { CmsModelField, CmsEditorFieldId, CmsModel as BaseCmsModel, FieldLayoutPosition } from "../../../../types";
 interface MoveFieldParams<T> {
-    field: CmsEditorFieldId | Pick<CmsEditorField, "id">;
+    field: CmsEditorFieldId | Pick<CmsModelField, "id">;
     position: FieldLayoutPosition;
     data: T;
 }
-declare const _default: <T extends Required<Pick<import("../../../../types").CmsEditorContentModel, "layout" | "fields">>>(params: MoveFieldParams<T>) => T;
+declare const _default: <T extends Required<Pick<BaseCmsModel, "layout" | "fields">>>(params: MoveFieldParams<T>) => T;
 export default _default;

package/admin/components/FieldEditor/utils/moveField.js.map

@@ -1 +1 @@
-{"version":3,"names":["moveField","params","field","position","prev","data","row","index","fieldId","id","next","layout","existingPosition","getFieldPosition","dot","delete","set","newLayout","splice","filter","length"],"sources":["moveField.ts"],"sourcesContent":["import dot from \"dot-prop-immutable\";\nimport {\n    CmsEditorField,\n    CmsEditorFieldId,\n    CmsModel as BaseCmsModel,\n    FieldLayoutPosition\n} from \"~/types\";\nimport getFieldPosition from \"./getFieldPosition\";\n\ntype CmsModel = Required<Pick<BaseCmsModel, \"fields\" | \"layout\">>;\n\ninterface MoveFieldParams<T> {\n    field: CmsEditorFieldId | Pick<CmsEditorField, \"id\">;\n    position: FieldLayoutPosition;\n    data: T;\n}\n\nconst moveField = <T extends CmsModel>(params: MoveFieldParams<T>) => {\n    const { field, position, data: prev } = params;\n    const { row, index } = position;\n    const fieldId = typeof field === \"string\" ? field : field.id;\n\n    let next: T = {\n        ...prev,\n        layout: prev.layout ? prev.layout || [] : []\n    };\n\n    const existingPosition = getFieldPosition({ field: fieldId, data: prev });\n\n    if (existingPosition) {\n        next = dot.delete(prev, `layout.${existingPosition.row}.${existingPosition.index}`) as T;\n    }\n\n    // Setting a form field into a new non-existing row.\n    if (!next.layout[row]) {\n        return dot.set(next, `layout.${row}`, [fieldId]);\n    }\n\n    // Drop the field at the specified index.\n    if (index === null) {\n        // Create a new row with the new field at the given row index,\n        return dot.set(next, \"layout\", (layout: string[][]) => {\n            const newLayout = [...layout];\n            newLayout.splice(row, 0, [fieldId]);\n            return newLayout;\n        });\n    }\n\n    return dot.set(next, `layout.${row}`, (layout: string[]) => {\n        const newLayout = [...layout];\n        newLayout.splice(index, 0, fieldId);\n        return newLayout;\n    });\n};\n\nexport default <T extends CmsModel>(params: MoveFieldParams<T>): T => {\n    return dot.set(moveField<T>(params), \"layout\", (layout: string[][]) => {\n        return [...layout].filter(row => row.length > 0);\n    });\n};\n"],"mappings":";;;;;;;;;;;;;AAAA;;AAOA;;AAUA,IAAMA,SAAS,GAAG,SAAZA,SAAY,CAAqBC,MAArB,EAAoD;EAClE,IAAQC,KAAR,GAAwCD,MAAxC,CAAQC,KAAR;EAAA,IAAeC,QAAf,GAAwCF,MAAxC,CAAeE,QAAf;EAAA,IAA+BC,IAA/B,GAAwCH,MAAxC,CAAyBI,IAAzB;EACA,IAAQC,GAAR,GAAuBH,QAAvB,CAAQG,GAAR;EAAA,IAAaC,KAAb,GAAuBJ,QAAvB,CAAaI,KAAb;EACA,IAAMC,OAAO,GAAG,OAAON,KAAP,KAAiB,QAAjB,GAA4BA,KAA5B,GAAoCA,KAAK,CAACO,EAA1D;EAEA,IAAIC,IAAO,+DACJN,IADI;IAEPO,MAAM,EAAEP,IAAI,CAACO,MAAL,GAAcP,IAAI,CAACO,MAAL,IAAe,EAA7B,GAAkC;EAFnC,EAAX;EAKA,IAAMC,gBAAgB,GAAG,IAAAC,yBAAA,EAAiB;IAAEX,KAAK,EAAEM,OAAT;IAAkBH,IAAI,EAAED;EAAxB,CAAjB,CAAzB;;EAEA,IAAIQ,gBAAJ,EAAsB;IAClBF,IAAI,GAAGI,yBAAA,CAAIC,MAAJ,CAAWX,IAAX,mBAA2BQ,gBAAgB,CAACN,GAA5C,cAAmDM,gBAAgB,CAACL,KAApE,EAAP;EACH,CAdiE,CAgBlE;;;EACA,IAAI,CAACG,IAAI,CAACC,MAAL,CAAYL,GAAZ,CAAL,EAAuB;IACnB,OAAOQ,yBAAA,CAAIE,GAAJ,CAAQN,IAAR,mBAAwBJ,GAAxB,GAA+B,CAACE,OAAD,CAA/B,CAAP;EACH,CAnBiE,CAqBlE;;;EACA,IAAID,KAAK,KAAK,IAAd,EAAoB;IAChB;IACA,OAAOO,yBAAA,CAAIE,GAAJ,CAAQN,IAAR,EAAc,QAAd,EAAwB,UAACC,MAAD,EAAwB;MACnD,IAAMM,SAAS,oCAAON,MAAP,CAAf;MACAM,SAAS,CAACC,MAAV,CAAiBZ,GAAjB,EAAsB,CAAtB,EAAyB,CAACE,OAAD,CAAzB;MACA,OAAOS,SAAP;IACH,CAJM,CAAP;EAKH;;EAED,OAAOH,yBAAA,CAAIE,GAAJ,CAAQN,IAAR,mBAAwBJ,GAAxB,GAA+B,UAACK,MAAD,EAAsB;IACxD,IAAMM,SAAS,oCAAON,MAAP,CAAf;IACAM,SAAS,CAACC,MAAV,CAAiBX,KAAjB,EAAwB,CAAxB,EAA2BC,OAA3B;IACA,OAAOS,SAAP;EACH,CAJM,CAAP;AAKH,CApCD;;eAsCe,kBAAqBhB,MAArB,EAAuD;EAClE,OAAOa,yBAAA,CAAIE,GAAJ,CAAQhB,SAAS,CAAIC,MAAJ,CAAjB,EAA8B,QAA9B,EAAwC,UAACU,MAAD,EAAwB;IACnE,OAAO,iCAAIA,MAAJ,EAAYQ,MAAZ,CAAmB,UAAAb,GAAG;MAAA,OAAIA,GAAG,CAACc,MAAJ,GAAa,CAAjB;IAAA,CAAtB,CAAP;EACH,CAFM,CAAP;AAGH,C"}
+{"version":3,"names":["moveField","params","field","position","prev","data","row","index","fieldId","id","next","layout","existingPosition","getFieldPosition","dot","delete","set","newLayout","splice","filter","length"],"sources":["moveField.ts"],"sourcesContent":["import dot from \"dot-prop-immutable\";\nimport {\n    CmsModelField,\n    CmsEditorFieldId,\n    CmsModel as BaseCmsModel,\n    FieldLayoutPosition\n} from \"~/types\";\nimport getFieldPosition from \"./getFieldPosition\";\n\ntype CmsModel = Required<Pick<BaseCmsModel, \"fields\" | \"layout\">>;\n\ninterface MoveFieldParams<T> {\n    field: CmsEditorFieldId | Pick<CmsModelField, \"id\">;\n    position: FieldLayoutPosition;\n    data: T;\n}\n\nconst moveField = <T extends CmsModel>(params: MoveFieldParams<T>) => {\n    const { field, position, data: prev } = params;\n    const { row, index } = position;\n    const fieldId = typeof field === \"string\" ? field : field.id;\n\n    let next: T = {\n        ...prev,\n        layout: prev.layout ? prev.layout || [] : []\n    };\n\n    const existingPosition = getFieldPosition({ field: fieldId, data: prev });\n\n    if (existingPosition) {\n        next = dot.delete(prev, `layout.${existingPosition.row}.${existingPosition.index}`) as T;\n    }\n\n    // Setting a form field into a new non-existing row.\n    if (!next.layout[row]) {\n        return dot.set(next, `layout.${row}`, [fieldId]);\n    }\n\n    // Drop the field at the specified index.\n    if (index === null) {\n        // Create a new row with the new field at the given row index,\n        return dot.set(next, \"layout\", (layout: string[][]) => {\n            const newLayout = [...layout];\n            newLayout.splice(row, 0, [fieldId]);\n            return newLayout;\n        });\n    }\n\n    return dot.set(next, `layout.${row}`, (layout: string[]) => {\n        const newLayout = [...layout];\n        newLayout.splice(index, 0, fieldId);\n        return newLayout;\n    });\n};\n\nexport default <T extends CmsModel>(params: MoveFieldParams<T>): T => {\n    return dot.set(moveField<T>(params), \"layout\", (layout: string[][]) => {\n        return [...layout].filter(row => row.length > 0);\n    });\n};\n"],"mappings":";;;;;;;;;;;;;AAAA;;AAOA;;AAUA,IAAMA,SAAS,GAAG,SAAZA,SAAY,CAAqBC,MAArB,EAAoD;EAClE,IAAQC,KAAR,GAAwCD,MAAxC,CAAQC,KAAR;EAAA,IAAeC,QAAf,GAAwCF,MAAxC,CAAeE,QAAf;EAAA,IAA+BC,IAA/B,GAAwCH,MAAxC,CAAyBI,IAAzB;EACA,IAAQC,GAAR,GAAuBH,QAAvB,CAAQG,GAAR;EAAA,IAAaC,KAAb,GAAuBJ,QAAvB,CAAaI,KAAb;EACA,IAAMC,OAAO,GAAG,OAAON,KAAP,KAAiB,QAAjB,GAA4BA,KAA5B,GAAoCA,KAAK,CAACO,EAA1D;EAEA,IAAIC,IAAO,+DACJN,IADI;IAEPO,MAAM,EAAEP,IAAI,CAACO,MAAL,GAAcP,IAAI,CAACO,MAAL,IAAe,EAA7B,GAAkC;EAFnC,EAAX;EAKA,IAAMC,gBAAgB,GAAG,IAAAC,yBAAA,EAAiB;IAAEX,KAAK,EAAEM,OAAT;IAAkBH,IAAI,EAAED;EAAxB,CAAjB,CAAzB;;EAEA,IAAIQ,gBAAJ,EAAsB;IAClBF,IAAI,GAAGI,yBAAA,CAAIC,MAAJ,CAAWX,IAAX,mBAA2BQ,gBAAgB,CAACN,GAA5C,cAAmDM,gBAAgB,CAACL,KAApE,EAAP;EACH,CAdiE,CAgBlE;;;EACA,IAAI,CAACG,IAAI,CAACC,MAAL,CAAYL,GAAZ,CAAL,EAAuB;IACnB,OAAOQ,yBAAA,CAAIE,GAAJ,CAAQN,IAAR,mBAAwBJ,GAAxB,GAA+B,CAACE,OAAD,CAA/B,CAAP;EACH,CAnBiE,CAqBlE;;;EACA,IAAID,KAAK,KAAK,IAAd,EAAoB;IAChB;IACA,OAAOO,yBAAA,CAAIE,GAAJ,CAAQN,IAAR,EAAc,QAAd,EAAwB,UAACC,MAAD,EAAwB;MACnD,IAAMM,SAAS,oCAAON,MAAP,CAAf;MACAM,SAAS,CAACC,MAAV,CAAiBZ,GAAjB,EAAsB,CAAtB,EAAyB,CAACE,OAAD,CAAzB;MACA,OAAOS,SAAP;IACH,CAJM,CAAP;EAKH;;EAED,OAAOH,yBAAA,CAAIE,GAAJ,CAAQN,IAAR,mBAAwBJ,GAAxB,GAA+B,UAACK,MAAD,EAAsB;IACxD,IAAMM,SAAS,oCAAON,MAAP,CAAf;IACAM,SAAS,CAACC,MAAV,CAAiBX,KAAjB,EAAwB,CAAxB,EAA2BC,OAA3B;IACA,OAAOS,SAAP;EACH,CAJM,CAAP;AAKH,CApCD;;eAsCe,kBAAqBhB,MAArB,EAAuD;EAClE,OAAOa,yBAAA,CAAIE,GAAJ,CAAQhB,SAAS,CAAIC,MAAJ,CAAjB,EAA8B,QAA9B,EAAwC,UAACU,MAAD,EAAwB;IACnE,OAAO,iCAAIA,MAAJ,EAAYQ,MAAZ,CAAmB,UAAAb,GAAG;MAAA,OAAIA,GAAG,CAACc,MAAJ,GAAa,CAAjB;IAAA,CAAtB,CAAP;EACH,CAFM,CAAP;AAGH,C"}

package/admin/components/IconPicker.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import { FormComponentProps } from "@webiny/ui/types";
+export interface IconPickerProps extends FormComponentProps {
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+}
+export declare const IconPicker: React.FC<IconPickerProps>;

package/admin/{views/contentModelGroups → components}/IconPicker.js

@@ -7,11 +7,11 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.IconPicker = void 0;
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
-var React = _interopRequireWildcard(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _emotion = require("emotion");
 
@@ -39,11 +39,7 @@ var iconPickerLabel = /*#__PURE__*/(0, _emotion.css)({
   marginBottom: 5,
   marginLeft: 2
 }, "label:iconPickerLabel;");
-var MenuWrapper = /*#__PURE__*/(0, _emotion.css)({
-  color: "var(--mdc-theme-text-secondary-on-background)",
-  backgroundColor: "var(--mdc-theme-on-background)",
-  padding: "16px 8px"
-}, "label:MenuWrapper;");
+var MenuWrapper = /*#__PURE__*/(0, _emotion.css)("color:var(--mdc-theme-text-secondary-on-background);background-color:var(--mdc-theme-on-background);border-bottom:1px solid var(--mdc-theme-text-secondary-on-background,rgba(0,0,0,0.54));padding:16px 8px;cursor:pointer;:hover{border-bottom:1px solid rgba(0,0,0,1);}label:MenuWrapper;");
 var NoResultWrapper = /*#__PURE__*/(0, _emotion.css)({
   width: 640,
   color: "var(--mdc-theme-text-secondary-on-background)",
@@ -100,9 +96,9 @@ var searchInput = /*#__PURE__*/(0, _emotion.css)({
     padding: "20px 12px 20px"
   }
 }, "label:searchInput;");
-var useState = React.useState,
-    useCallback = React.useCallback,
-    useMemo = React.useMemo;
+var useState = _react.default.useState,
+    useCallback = _react.default.useCallback,
+    useMemo = _react.default.useMemo;
 
 var IconPicker = function IconPicker(_ref) {
   var value = _ref.value,
@@ -121,6 +117,14 @@ var IconPicker = function IconPicker(_ref) {
       mustRenderGrid = _useState4[0],
       setMustRenderGrid = _useState4[1];
 
+  var inputRef = (0, _react.useRef)(null);
+  (0, _react.useEffect)(function () {
+    setTimeout(function () {
+      if (mustRenderGrid && inputRef.current) {
+        inputRef.current.focus();
+      }
+    }, 50);
+  }, [mustRenderGrid]);
   var onFilterChange = useCallback(function (value, cb) {
     setFilter(value);
     cb();
@@ -150,7 +154,7 @@ var IconPicker = function IconPicker(_ref) {
         return null;
       }
 
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/_react.default.createElement("div", {
         key: key,
         style: style,
         className: gridItem,
@@ -161,34 +165,34 @@ var IconPicker = function IconPicker(_ref) {
 
           closeMenu();
         }
-      }, /*#__PURE__*/React.createElement(_reactFontawesome.FontAwesomeIcon, {
+      }, /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
         icon: item.id,
         size: "2x"
-      }), /*#__PURE__*/React.createElement(_Typography.Typography, {
+      }), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
         use: "body2"
       }, item.name));
     };
   }, [icons]);
   var renderGrid = useCallback(function (_ref4) {
     var closeMenu = _ref4.closeMenu;
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_DelayedOnChange.default, {
+    return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_DelayedOnChange.default, {
       value: filter,
       onChange: onFilterChange
     }, function (_ref5) {
       var value = _ref5.value,
           onChange = _ref5.onChange;
-      return /*#__PURE__*/React.createElement(_Input.Input, {
-        autoFocus: true,
+      return /*#__PURE__*/_react.default.createElement(_Input.Input, {
+        inputRef: inputRef,
         className: searchInput,
         value: value,
         onChange: onChange,
         placeholder: "Search icons..."
       });
-    }), icons.length === 0 ? /*#__PURE__*/React.createElement("div", {
+    }), icons.length === 0 ? /*#__PURE__*/_react.default.createElement("div", {
       className: NoResultWrapper
-    }, /*#__PURE__*/React.createElement(_Typography.Typography, {
+    }, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
       use: "body1"
-    }, "No results found.")) : /*#__PURE__*/React.createElement(_reactVirtualized.Grid, {
+    }, "No results found.")) : /*#__PURE__*/_react.default.createElement(_reactVirtualized.Grid, {
       className: grid,
       cellRenderer: renderCell({
         closeMenu: closeMenu
@@ -207,29 +211,28 @@ var IconPicker = function IconPicker(_ref) {
       validationIsValid = _ref6.isValid,
       validationMessage = _ref6.message;
 
-  return /*#__PURE__*/React.createElement(React.Fragment, null, label && /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, label && /*#__PURE__*/_react.default.createElement("div", {
     className: iconPickerLabel
-  }, /*#__PURE__*/React.createElement(_Typography.Typography, {
+  }, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     use: "body1"
-  }, label)), /*#__PURE__*/React.createElement("div", {
-    className: MenuWrapper
-  }, /*#__PURE__*/React.createElement(_Menu.Menu, {
+  }, label)), /*#__PURE__*/_react.default.createElement(_Menu.Menu, {
     onOpen: function onOpen() {
       return setMustRenderGrid(true);
     },
     onClose: function onClose() {
       return setMustRenderGrid(false);
     },
-    handle: /*#__PURE__*/React.createElement("div", {
+    handle: /*#__PURE__*/_react.default.createElement("div", {
+      className: MenuWrapper
+    }, /*#__PURE__*/_react.default.createElement("div", {
       className: pickIcon
-    }, /*#__PURE__*/React.createElement(_reactFontawesome.FontAwesomeIcon, {
+    }, /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
       icon: fontAwesomeIconValue,
       size: "2x"
-    }))
-  }, mustRenderGrid && renderGrid)), validationIsValid === false && /*#__PURE__*/React.createElement(_FormElementMessage.FormElementMessage, {
+    })))
+  }, mustRenderGrid && renderGrid), validationIsValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
     error: true
-  }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/React.createElement(_FormElementMessage.FormElementMessage, null, description));
+  }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
 };
 
-var _default = IconPicker;
-exports.default = _default;
+exports.IconPicker = IconPicker;

package/admin/components/IconPicker.js.map

@@ -0,0 +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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"}

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

@@ -0,0 +1,36 @@
+import React from "react";
+import { CmsModelField } from "../../../types";
+export declare type ModelFieldContext = CmsModelField;
+export declare const ModelFieldContext: React.Context<{
+    id: string;
+    type: string;
+    fieldId: string;
+    storageId?: string | undefined;
+    label?: string | undefined;
+    helpText?: string | undefined;
+    placeholderText?: string | undefined;
+    validation?: import("../../../types").CmsModelFieldValidator[] | undefined;
+    listValidation?: import("../../../types").CmsModelFieldValidator[] | undefined;
+    multipleValues?: boolean | undefined;
+    predefinedValues?: import("../../../types").CmsEditorFieldPredefinedValues | undefined;
+    settings?: {
+        [key: string]: any;
+        defaultValue?: string | null | undefined;
+        defaultSetValue?: string | undefined;
+        type?: string | undefined;
+        fields?: any[] | undefined;
+        layout?: string[][] | undefined;
+        models?: Pick<import("../../../types").CmsModel, "name" | "modelId">[] | undefined;
+        templates?: import("../../../types").CmsDynamicZoneTemplate[] | undefined;
+        imagesOnly?: boolean | undefined;
+    } | undefined;
+    renderer: {
+        name: string;
+    };
+    tags?: string[] | undefined;
+} | undefined>;
+export interface ModelFieldProviderProps {
+    field: CmsModelField;
+    children: React.ReactNode;
+}
+export declare const ModelFieldProvider: ({ field, children }: ModelFieldProviderProps) => JSX.Element;

package/admin/components/ModelFieldProvider/ModelFieldContext.js

@@ -0,0 +1,24 @@
+"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;
+  return /*#__PURE__*/_react.default.createElement(ModelFieldContext.Provider, {
+    value: field
+  }, children);
+};
+
+exports.ModelFieldProvider = ModelFieldProvider;

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

@@ -0,0 +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"}

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

@@ -0,0 +1,2 @@
+export * from "./ModelFieldContext";
+export * from "./useModelField";

package/admin/components/ModelFieldProvider/index.js

@@ -0,0 +1,31 @@
+"use strict";
+
+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;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _ModelFieldContext[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;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _useModelField[key];
+    }
+  });
+});

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

@@ -0,0 +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"}

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

@@ -0,0 +1,35 @@
+import { CmsModelFieldTypePlugin } from "../../../types";
+/**
+ * Get model field from the current context.
+ */
+export declare function useModelField(): {
+    field: {
+        id: string;
+        type: string;
+        fieldId: string;
+        storageId?: string | undefined;
+        label?: string | undefined;
+        helpText?: string | undefined;
+        placeholderText?: string | undefined;
+        validation?: import("../../../types").CmsModelFieldValidator[] | undefined;
+        listValidation?: import("../../../types").CmsModelFieldValidator[] | undefined;
+        multipleValues?: boolean | undefined;
+        predefinedValues?: import("../../../types").CmsEditorFieldPredefinedValues | undefined;
+        settings?: {
+            [key: string]: any;
+            defaultValue?: string | null | undefined;
+            defaultSetValue?: string | undefined;
+            type?: string | undefined;
+            fields?: any[] | undefined;
+            layout?: string[][] | undefined;
+            models?: Pick<import("../../../types").CmsModel, "name" | "modelId">[] | undefined;
+            templates?: import("../../../types").CmsDynamicZoneTemplate[] | undefined;
+            imagesOnly?: boolean | undefined;
+        } | undefined;
+        renderer: {
+            name: string;
+        };
+        tags?: string[] | undefined;
+    };
+    fieldPlugin: CmsModelFieldTypePlugin;
+};

package/admin/components/ModelFieldProvider/useModelField.js

@@ -0,0 +1,42 @@
+"use strict";
+
+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,
+    fieldPlugin: fieldPlugin
+  };
+}

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

@@ -0,0 +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"}

package/admin/components/ModelProvider/ModelContext.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { CmsModel } from "../../../types";
+export declare type ModelContext = CmsModel;
+export declare const ModelContext: React.Context<CmsModel | undefined>;
+export interface ModelProviderProps {
+    model: CmsModel;
+    children: React.ReactNode;
+}
+export declare const ModelProvider: ({ model, children }: ModelProviderProps) => JSX.Element;

package/admin/components/ModelProvider/ModelContext.js

@@ -0,0 +1,24 @@
+"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;
+  return /*#__PURE__*/_react.default.createElement(ModelContext.Provider, {
+    value: model
+  }, children);
+};
+
+exports.ModelProvider = ModelProvider;

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

@@ -0,0 +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"}