@webiny/app-headless-cms 0.0.0-ee-vpcs.549378cf03

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

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

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

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

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _default = function _default(params) {
+  var field = params.field,
+      data = params.data;
+  var id = typeof field === "string" ? field : field.id;
+  var layout = data.layout ? data.layout : [];
+
+  for (var i = 0; i < layout.length; i++) {
+    var row = layout[i];
+
+    for (var j = 0; j < row.length; j++) {
+      if (row[j] === id) {
+        return {
+          row: i,
+          index: j
+        };
+      }
+    }
+  }
+
+  return null;
+};
+
+exports.default = _default;

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

@@ -0,0 +1 @@
+{"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/index.d.ts

@@ -0,0 +1,4 @@
+export { default as getFieldPosition } from "./getFieldPosition";
+export { default as moveField } from "./moveField";
+export { default as deleteField } from "./deleteField";
+export { default as moveRow } from "./moveRow";

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

@@ -0,0 +1,39 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "deleteField", {
+  enumerable: true,
+  get: function get() {
+    return _deleteField.default;
+  }
+});
+Object.defineProperty(exports, "getFieldPosition", {
+  enumerable: true,
+  get: function get() {
+    return _getFieldPosition.default;
+  }
+});
+Object.defineProperty(exports, "moveField", {
+  enumerable: true,
+  get: function get() {
+    return _moveField.default;
+  }
+});
+Object.defineProperty(exports, "moveRow", {
+  enumerable: true,
+  get: function get() {
+    return _moveRow.default;
+  }
+});
+
+var _getFieldPosition = _interopRequireDefault(require("./getFieldPosition"));
+
+var _moveField = _interopRequireDefault(require("./moveField"));
+
+var _deleteField = _interopRequireDefault(require("./deleteField"));
+
+var _moveRow = _interopRequireDefault(require("./moveRow"));

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as getFieldPosition } from \"./getFieldPosition\";\nexport { default as moveField } from \"./moveField\";\nexport { default as deleteField } from \"./deleteField\";\nexport { default as moveRow } from \"./moveRow\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA"}

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

@@ -0,0 +1,8 @@
+import { CmsModelField, CmsEditorFieldId, CmsModel as BaseCmsModel, FieldLayoutPosition } from "../../../../types";
+interface MoveFieldParams<T> {
+    field: CmsEditorFieldId | Pick<CmsModelField, "id">;
+    position: FieldLayoutPosition;
+    data: 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

@@ -0,0 +1,67 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
+
+var _dotPropImmutable = _interopRequireDefault(require("dot-prop-immutable"));
+
+var _getFieldPosition = _interopRequireDefault(require("./getFieldPosition"));
+
+var moveField = function moveField(params) {
+  var field = params.field,
+      position = params.position,
+      prev = params.data;
+  var row = position.row,
+      index = position.index;
+  var fieldId = typeof field === "string" ? field : field.id;
+  var next = (0, _objectSpread2.default)((0, _objectSpread2.default)({}, prev), {}, {
+    layout: prev.layout ? prev.layout || [] : []
+  });
+  var existingPosition = (0, _getFieldPosition.default)({
+    field: fieldId,
+    data: prev
+  });
+
+  if (existingPosition) {
+    next = _dotPropImmutable.default.delete(prev, "layout.".concat(existingPosition.row, ".").concat(existingPosition.index));
+  } // Setting a form field into a new non-existing row.
+
+
+  if (!next.layout[row]) {
+    return _dotPropImmutable.default.set(next, "layout.".concat(row), [fieldId]);
+  } // Drop the field at the specified index.
+
+
+  if (index === null) {
+    // Create a new row with the new field at the given row index,
+    return _dotPropImmutable.default.set(next, "layout", function (layout) {
+      var newLayout = (0, _toConsumableArray2.default)(layout);
+      newLayout.splice(row, 0, [fieldId]);
+      return newLayout;
+    });
+  }
+
+  return _dotPropImmutable.default.set(next, "layout.".concat(row), function (layout) {
+    var newLayout = (0, _toConsumableArray2.default)(layout);
+    newLayout.splice(index, 0, fieldId);
+    return newLayout;
+  });
+};
+
+var _default = function _default(params) {
+  return _dotPropImmutable.default.set(moveField(params), "layout", function (layout) {
+    return (0, _toConsumableArray2.default)(layout).filter(function (row) {
+      return row.length > 0;
+    });
+  });
+};
+
+exports.default = _default;

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

@@ -0,0 +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    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/FieldEditor/utils/moveRow.d.ts

@@ -0,0 +1,8 @@
+import { CmsModel } from "../../../../types";
+interface Params {
+    source: number;
+    destination: number;
+    data: Pick<CmsModel, "layout">;
+}
+declare const _default: ({ data, source, destination }: Params) => any;
+export default _default;

package/admin/components/FieldEditor/utils/moveRow.js

@@ -0,0 +1,23 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+
+var _dotPropImmutable = _interopRequireDefault(require("dot-prop-immutable"));
+
+var _default = function _default(_ref) {
+  var data = _ref.data,
+      source = _ref.source,
+      destination = _ref.destination;
+  return _dotPropImmutable.default.set(data, "layout", function (layout) {
+    return source < destination ? [].concat((0, _toConsumableArray2.default)(layout.slice(0, source)), (0, _toConsumableArray2.default)(layout.slice(source + 1, destination)), [layout[source]], (0, _toConsumableArray2.default)(layout.slice(destination))) : [].concat((0, _toConsumableArray2.default)(layout.slice(0, destination)), [layout[source]], (0, _toConsumableArray2.default)(layout.slice(destination, source)), (0, _toConsumableArray2.default)(layout.slice(source + 1)));
+  });
+};
+
+exports.default = _default;

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

@@ -0,0 +1 @@
+{"version":3,"names":["data","source","destination","dot","set","layout","slice"],"sources":["moveRow.ts"],"sourcesContent":["import dot from \"dot-prop-immutable\";\nimport { CmsModel } from \"~/types\";\n\ninterface Params {\n    source: number;\n    destination: number;\n    data: Pick<CmsModel, \"layout\">;\n}\nexport default ({ data, source, destination }: Params) => {\n    return dot.set(data, \"layout\", (layout: string[][]) => {\n        return source < destination\n            ? [\n                  ...layout.slice(0, source),\n                  ...layout.slice(source + 1, destination),\n                  layout[source],\n                  ...layout.slice(destination)\n              ]\n            : [\n                  ...layout.slice(0, destination),\n                  layout[source],\n                  ...layout.slice(destination, source),\n                  ...layout.slice(source + 1)\n              ];\n    });\n};\n"],"mappings":";;;;;;;;;;;AAAA;;eAQe,wBAA2C;EAAA,IAAxCA,IAAwC,QAAxCA,IAAwC;EAAA,IAAlCC,MAAkC,QAAlCA,MAAkC;EAAA,IAA1BC,WAA0B,QAA1BA,WAA0B;EACtD,OAAOC,yBAAA,CAAIC,GAAJ,CAAQJ,IAAR,EAAc,QAAd,EAAwB,UAACK,MAAD,EAAwB;IACnD,OAAOJ,MAAM,GAAGC,WAAT,8CAEMG,MAAM,CAACC,KAAP,CAAa,CAAb,EAAgBL,MAAhB,CAFN,oCAGMI,MAAM,CAACC,KAAP,CAAaL,MAAM,GAAG,CAAtB,EAAyBC,WAAzB,CAHN,IAIGG,MAAM,CAACJ,MAAD,CAJT,oCAKMI,MAAM,CAACC,KAAP,CAAaJ,WAAb,CALN,gDAQMG,MAAM,CAACC,KAAP,CAAa,CAAb,EAAgBJ,WAAhB,CARN,IASGG,MAAM,CAACJ,MAAD,CATT,oCAUMI,MAAM,CAACC,KAAP,CAAaJ,WAAb,EAA0BD,MAA1B,CAVN,oCAWMI,MAAM,CAACC,KAAP,CAAaL,MAAM,GAAG,CAAtB,CAXN,EAAP;EAaH,CAdM,CAAP;AAeH,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/components/IconPicker.js

@@ -0,0 +1,238 @@
+"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}
+ */
+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);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)",
+  padding: "16px 12px"
+}, "label:NoResultWrapper;");
+var COLUMN_COUNT = 6;
+var gridItem = /*#__PURE__*/(0, _emotion.css)({
+  display: "flex",
+  flexDirection: "column",
+  justifyContent: "flex-start",
+  boxSizing: "border-box",
+  paddingTop: 15,
+  alignItems: "center",
+  textAlign: "center",
+  cursor: "pointer",
+  transform: "translateZ(0)",
+  borderRadius: 2,
+  color: "var(--mdc-theme-text-secondary-on-background)",
+  transition: "all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1)",
+  "&::after": {
+    boxShadow: "0 0.25rem 0.125rem 0 rgba(0,0,0,0.05)",
+    transition: "opacity 0.5s cubic-bezier(0.165, 0.84, 0.44, 1)",
+    content: '""',
+    position: "absolute",
+    top: 0,
+    left: 0,
+    width: "100%",
+    height: "100%",
+    zIndex: -1,
+    opacity: 0
+  },
+  "&:hover": {
+    backgroundColor: "var(--mdc-theme-background)",
+    color: "var(--mdc-theme-text-primary-on-background)",
+    "&::after": {
+      opacity: 1
+    }
+  },
+  ">svg": {
+    width: 42,
+    marginBottom: 5
+  }
+}, "label:gridItem;");
+var grid = /*#__PURE__*/(0, _emotion.css)({
+  padding: 20
+}, "label:grid;");
+var pickIcon = /*#__PURE__*/(0, _emotion.css)({
+  width: 50,
+  textAlign: "center",
+  cursor: "pointer"
+}, "label:pickIcon;");
+var searchInput = /*#__PURE__*/(0, _emotion.css)({
+  input: {
+    padding: "20px 12px 20px"
+  }
+}, "label:searchInput;");
+var useState = _react.default.useState,
+    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;
+
+  var _useState = useState(""),
+      _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];
+
+  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();
+  }, [filter]);
+  var allIcons = useMemo(function () {
+    var iconPlugins = _plugins.plugins.byType("cms-icons");
+
+    return iconPlugins.reduce(function (icons, pl) {
+      return icons.concat(pl.getIcons());
+    }, []);
+  }, []);
+  var icons = useMemo(function () {
+    return filter ? allIcons.filter(function (ic) {
+      return ic.name.includes(filter);
+    }) : allIcons;
+  }, [filter]);
+  var renderCell = useCallback(function (_ref2) {
+    var closeMenu = _ref2.closeMenu;
+    return function renderCell(_ref3) {
+      var columnIndex = _ref3.columnIndex,
+          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,
+        className: gridItem,
+        onClick: function onClick() {
+          if (onChange) {
+            onChange(item.id.join("/"));
+          }
+
+          closeMenu();
+        }
+      }, /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
+        icon: item.id,
+        size: "2x"
+      }), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
+        use: "body2"
+      }, item.name));
+    };
+  }, [icons]);
+  var renderGrid = useCallback(function (_ref4) {
+    var closeMenu = _ref4.closeMenu;
+    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.default.createElement(_Input.Input, {
+        inputRef: inputRef,
+        className: searchInput,
+        value: value,
+        onChange: onChange,
+        placeholder: "Search icons..."
+      });
+    }), icons.length === 0 ? /*#__PURE__*/_react.default.createElement("div", {
+      className: NoResultWrapper
+    }, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
+      use: "body1"
+    }, "No results found.")) : /*#__PURE__*/_react.default.createElement(_reactVirtualized.Grid, {
+      className: grid,
+      cellRenderer: renderCell({
+        closeMenu: closeMenu
+      }),
+      columnCount: COLUMN_COUNT,
+      columnWidth: 100,
+      height: 440,
+      rowCount: Math.ceil(icons.length / COLUMN_COUNT),
+      rowHeight: 100,
+      width: 640
+    }));
+  }, [icons]);
+  var fontAwesomeIconValue = typeof value === "string" && value.includes("/") ? value.split("/") : ["fas", "star"];
+
+  var _ref6 = validation || {},
+      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, {
+    use: "body1"
+  }, label)), /*#__PURE__*/_react.default.createElement(_Menu.Menu, {
+    onOpen: function onOpen() {
+      return setMustRenderGrid(true);
+    },
+    onClose: function onClose() {
+      return setMustRenderGrid(false);
+    },
+    handle: /*#__PURE__*/_react.default.createElement("div", {
+      className: MenuWrapper
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: pickIcon
+    }, /*#__PURE__*/_react.default.createElement(_reactFontawesome.FontAwesomeIcon, {
+      icon: fontAwesomeIconValue,
+      size: "2x"
+    })))
+  }, mustRenderGrid && renderGrid), validationIsValid === false && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, {
+    error: true
+  }, validationMessage), validationIsValid !== false && description && /*#__PURE__*/_react.default.createElement(_FormElementMessage.FormElementMessage, null, description));
+};
+
+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"}