@atlaskit/editor-core 189.4.8 → 189.4.10

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/editor-core
 
+## 189.4.10
+
+### Patch Changes
+
+- [#55514](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/55514) [`9e0ff045562e`](https://bitbucket.org/atlassian/atlassian-frontend/commits/9e0ff045562e) - Re-add safe parameters to config panel analytic event
+
+## 189.4.9
+
+### Patch Changes
+
+- [#57079](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/57079) [`d15db1b00c5a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d15db1b00c5a) - [ED-21267] Improve arrow navigation across MultiBodiedExtensions
+
 ## 189.4.8
 
 ### Patch Changes

package/dist/cjs/plugins/extension/ui/Extension/MultiBodiedExtension/index.js

@@ -6,13 +6,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("@emotion/react");
 var _colors = require("@atlaskit/theme/colors");
 var _react2 = _interopRequireWildcard(require("react"));
-var _templateObject;
+var _templateObject, _templateObject2;
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -104,6 +104,7 @@ var useMultiBodiedExtensionActions = function useMultiBodiedExtensionActions(_re
   }, [node, editorView, getPos, updateActiveChild]);
   return actions;
 };
+var navigationCSS = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  // make sure the user can't see a range selection inside the navigation\n  // This is really important to keep the navigation working properly\n  user-select: none;\n  -webkit-user-modify: read-only;\n"])));
 var MultiBodiedExtension = function MultiBodiedExtension(_ref2) {
   var node = _ref2.node,
     handleContentDOMRef = _ref2.handleContentDOMRef,
@@ -136,14 +137,15 @@ var MultiBodiedExtension = function MultiBodiedExtension(_ref2) {
   var articleRef = _react2.default.useCallback(function (node) {
     return handleContentDOMRef(node);
   }, [handleContentDOMRef]);
-  var containerCss = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n    border: 1px solid ", ";\n    padding: ", ";\n    .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'] {\n      display: none;\n    }\n\n    .multiBodiedExtension-content-dom-wrapper\n      > [data-extension-frame='true']:nth-of-type(", ") {\n      display: block;\n    }\n  "])), "var(--ds-border, ".concat(_colors.N30, ")"), "var(--ds-space-050, 4px)", activeChildIndex + 1);
+  var containerCSS = (0, _react.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n    border: 1px solid ", ";\n    padding: ", ";\n    .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'] {\n      display: none;\n    }\n\n    .multiBodiedExtension-content-dom-wrapper\n      > [data-extension-frame='true']:nth-of-type(", ") {\n      display: block;\n    }\n  "])), "var(--ds-border, ".concat(_colors.N30, ")"), "var(--ds-space-050, 4px)", activeChildIndex + 1);
   return (0, _react.jsx)("section", {
     className: "multiBodiedExtension--container",
-    css: containerCss,
+    css: containerCSS,
     "data-testid": "multiBodiedExtension--container",
     "data-active-child-index": activeChildIndex
   }, (0, _react.jsx)("nav", {
     className: "multiBodiedExtension-navigation",
+    css: navigationCSS,
     "data-testid": "multiBodiedExtension-navigation"
   }, extensionHandlerResult), (0, _react.jsx)("article", {
     className: "multiBodiedExtension--frames",

package/dist/cjs/ui/ConfigPanel/ConfigPanel.js

@@ -36,8 +36,12 @@ var _WithPluginState = _interopRequireDefault(require("../WithPluginState"));
 var _FormContent = _interopRequireDefault(require("./FormContent"));
 var _messages = require("./messages");
 var _FormErrorBoundary = require("./FormErrorBoundary");
+var _utils = require("./utils");
+var _constants = require("./constants");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
 function ConfigForm(_ref) {
@@ -336,16 +340,20 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
     value: function componentWillUnmount() {
       var _this$props4 = this.props,
         createAnalyticsEvent = _this$props4.createAnalyticsEvent,
-        extensionManifest = _this$props4.extensionManifest;
+        extensionManifest = _this$props4.extensionManifest,
+        fields = _this$props4.fields;
+      var currentParameters = this.state.currentParameters;
       (0, _analytics.fireAnalyticsEvent)(createAnalyticsEvent)({
         payload: {
           action: _analytics.ACTION.CLOSED,
           actionSubject: _analytics.ACTION_SUBJECT.CONFIG_PANEL,
           eventType: _analytics.EVENT_TYPE.UI,
-          attributes: {
+          attributes: _objectSpread({
             extensionKey: extensionManifest === null || extensionManifest === void 0 ? void 0 : extensionManifest.key,
             extensionType: extensionManifest === null || extensionManifest === void 0 ? void 0 : extensionManifest.type
-          }
+          }, extensionManifest !== null && extensionManifest !== void 0 && extensionManifest.key && _constants.ALLOWED_LOGGED_MACRO_PARAMS[extensionManifest.key] ? {
+            parameters: (0, _utils.getLoggedParameters)(extensionManifest.key, currentParameters, fields)
+          } : {})
         }
       });
     }

package/dist/cjs/ui/ConfigPanel/constants.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.ALLOWED_PARAM_TYPES = exports.ALLOWED_LOGGED_MACRO_PARAMS = void 0;
+// Allowlist of { macroKey: parameterName[] } for analytics logging
+var ALLOWED_LOGGED_MACRO_PARAMS = exports.ALLOWED_LOGGED_MACRO_PARAMS = {
+  children: ['all', 'first', 'depth', 'style', 'excerptType', 'sort', 'reverse'],
+  'recently-updated': ['width', 'types', 'max', 'theme', 'showProfilePic', 'hideHeading'],
+  excerpt: ['hidden']
+};
+var ALLOWED_PARAM_TYPES = exports.ALLOWED_PARAM_TYPES = ['enum', 'number', 'boolean'];

package/dist/cjs/ui/ConfigPanel/utils.js

@@ -1,10 +1,15 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.validateRequired = exports.validate = exports.isDuplicateField = exports.getSafeParentedName = exports.getOptionFromValue = exports.getNameFromDuplicateField = void 0;
+exports.validateRequired = exports.validate = exports.isDuplicateField = exports.getSafeParentedName = exports.getOptionFromValue = exports.getNameFromDuplicateField = exports.getLoggedParameters = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _types = require("./types");
+var _constants = require("./constants");
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var validate = exports.validate = function validate(field, value) {
   return validateRequired(field, value);
 };
@@ -53,4 +58,42 @@ var isDuplicateField = exports.isDuplicateField = function isDuplicateField(key)
 };
 var getNameFromDuplicateField = exports.getNameFromDuplicateField = function getNameFromDuplicateField(key) {
   return key.replace(duplicateFieldRegex, '');
+};
+
+// An overly cautious parser for sanitizing configuration parameters of UGC
+var parseParamType = function parseParamType(paramValue, paramField) {
+  if (paramValue && paramField) {
+    if (paramField.type === 'string') {
+      if (paramField.name === 'types') {
+        // Parse types field as an array of valid content types
+        var contentTypes = ['page', 'blogpost', 'comment', 'attachment'];
+        return paramValue && paramValue.split(',').map(function (type) {
+          return type.trim();
+        }).filter(function (type) {
+          return contentTypes.includes(type);
+        });
+      }
+      if (paramField.name === 'width') {
+        return parseFloat(paramValue);
+      }
+      // Strings are very risky - return empty string in case anything slips through
+      return '';
+    }
+    if (_constants.ALLOWED_PARAM_TYPES.includes(paramField.type)) {
+      // The param types defined here are already parsed and safe to log
+      return paramValue;
+    }
+  }
+  // Safety net
+  return null;
+};
+var getLoggedParameters = exports.getLoggedParameters = function getLoggedParameters(macroKey, currentParams, macroFields) {
+  // Get the parameters only defined in the allowlist of logged macro/parameter keys
+  return Object.keys(currentParams).filter(function (paramKey) {
+    return _constants.ALLOWED_LOGGED_MACRO_PARAMS[macroKey].includes(paramKey);
+  }).reduce(function (obj, param) {
+    return _objectSpread(_objectSpread({}, obj), {}, (0, _defineProperty2.default)({}, param, parseParamType(currentParams[param], macroFields === null || macroFields === void 0 ? void 0 : macroFields.find(function (field) {
+      return field.name === param;
+    }))));
+  }, {});
 };

package/dist/cjs/version-wrapper.js

@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.version = exports.name = void 0;
 var name = exports.name = "@atlaskit/editor-core";
-var version = exports.version = "189.4.8";
+var version = exports.version = "189.4.10";

package/dist/es2019/plugins/extension/ui/Extension/MultiBodiedExtension/index.js

@@ -100,6 +100,12 @@ const useMultiBodiedExtensionActions = ({
   }, [node, editorView, getPos, updateActiveChild]);
   return actions;
 };
+const navigationCSS = css`
+  // make sure the user can't see a range selection inside the navigation
+  // This is really important to keep the navigation working properly
+  user-select: none;
+  -webkit-user-modify: read-only;
+`;
 const MultiBodiedExtension = ({
   node,
   handleContentDOMRef,
@@ -130,7 +136,7 @@ const MultiBodiedExtension = ({
   const articleRef = React.useCallback(node => {
     return handleContentDOMRef(node);
   }, [handleContentDOMRef]);
-  const containerCss = css`
+  const containerCSS = css`
     border: 1px solid ${`var(--ds-border, ${N30})`};
     padding: ${"var(--ds-space-050, 4px)"};
     .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'] {
@@ -144,11 +150,12 @@ const MultiBodiedExtension = ({
   `;
   return jsx("section", {
     className: "multiBodiedExtension--container",
-    css: containerCss,
+    css: containerCSS,
     "data-testid": "multiBodiedExtension--container",
     "data-active-child-index": activeChildIndex
   }, jsx("nav", {
     className: "multiBodiedExtension-navigation",
+    css: navigationCSS,
     "data-testid": "multiBodiedExtension-navigation"
   }, extensionHandlerResult), jsx("article", {
     className: "multiBodiedExtension--frames",

package/dist/es2019/ui/ConfigPanel/ConfigPanel.js

@@ -21,6 +21,8 @@ import WithPluginState from '../WithPluginState';
 import FormContent from './FormContent';
 import { messages } from './messages';
 import { FormErrorBoundary } from './FormErrorBoundary';
+import { getLoggedParameters } from './utils';
+import { ALLOWED_LOGGED_MACRO_PARAMS } from './constants';
 function ConfigForm({
   canSave,
   errorMessage,
@@ -276,8 +278,12 @@ class ConfigPanel extends React.Component {
   componentWillUnmount() {
     const {
       createAnalyticsEvent,
-      extensionManifest
+      extensionManifest,
+      fields
     } = this.props;
+    const {
+      currentParameters
+    } = this.state;
     fireAnalyticsEvent(createAnalyticsEvent)({
       payload: {
         action: ACTION.CLOSED,
@@ -285,7 +291,10 @@ class ConfigPanel extends React.Component {
         eventType: EVENT_TYPE.UI,
         attributes: {
           extensionKey: extensionManifest === null || extensionManifest === void 0 ? void 0 : extensionManifest.key,
-          extensionType: extensionManifest === null || extensionManifest === void 0 ? void 0 : extensionManifest.type
+          extensionType: extensionManifest === null || extensionManifest === void 0 ? void 0 : extensionManifest.type,
+          ...(extensionManifest !== null && extensionManifest !== void 0 && extensionManifest.key && ALLOWED_LOGGED_MACRO_PARAMS[extensionManifest.key] ? {
+            parameters: getLoggedParameters(extensionManifest.key, currentParameters, fields)
+          } : {})
         }
       }
     });

package/dist/es2019/ui/ConfigPanel/constants.js

@@ -0,0 +1,7 @@
+// Allowlist of { macroKey: parameterName[] } for analytics logging
+export const ALLOWED_LOGGED_MACRO_PARAMS = {
+  children: ['all', 'first', 'depth', 'style', 'excerptType', 'sort', 'reverse'],
+  'recently-updated': ['width', 'types', 'max', 'theme', 'showProfilePic', 'hideHeading'],
+  excerpt: ['hidden']
+};
+export const ALLOWED_PARAM_TYPES = ['enum', 'number', 'boolean'];

package/dist/es2019/ui/ConfigPanel/utils.js

@@ -1,4 +1,5 @@
 import { ValidationError } from './types';
+import { ALLOWED_LOGGED_MACRO_PARAMS, ALLOWED_PARAM_TYPES } from './constants';
 export const validate = (field, value) => {
   return validateRequired(field, value);
 };
@@ -36,4 +37,37 @@ export const getSafeParentedName = (name, parentName) => {
 };
 const duplicateFieldRegex = /:[0-9]+$/;
 export const isDuplicateField = key => duplicateFieldRegex.test(key);
-export const getNameFromDuplicateField = key => key.replace(duplicateFieldRegex, '');
+export const getNameFromDuplicateField = key => key.replace(duplicateFieldRegex, '');
+
+// An overly cautious parser for sanitizing configuration parameters of UGC
+const parseParamType = (paramValue, paramField) => {
+  if (paramValue && paramField) {
+    if (paramField.type === 'string') {
+      if (paramField.name === 'types') {
+        // Parse types field as an array of valid content types
+        const contentTypes = ['page', 'blogpost', 'comment', 'attachment'];
+        return paramValue && paramValue.split(',').map(type => type.trim()).filter(type => contentTypes.includes(type));
+      }
+      if (paramField.name === 'width') {
+        return parseFloat(paramValue);
+      }
+      // Strings are very risky - return empty string in case anything slips through
+      return '';
+    }
+    if (ALLOWED_PARAM_TYPES.includes(paramField.type)) {
+      // The param types defined here are already parsed and safe to log
+      return paramValue;
+    }
+  }
+  // Safety net
+  return null;
+};
+export const getLoggedParameters = (macroKey, currentParams, macroFields) => {
+  // Get the parameters only defined in the allowlist of logged macro/parameter keys
+  return Object.keys(currentParams).filter(paramKey => ALLOWED_LOGGED_MACRO_PARAMS[macroKey].includes(paramKey)).reduce((obj, param) => {
+    return {
+      ...obj,
+      [param]: parseParamType(currentParams[param], macroFields === null || macroFields === void 0 ? void 0 : macroFields.find(field => field.name === param))
+    };
+  }, {});
+};

package/dist/es2019/version-wrapper.js

@@ -1,2 +1,2 @@
 export const name = "@atlaskit/editor-core";
-export const version = "189.4.8";
+export const version = "189.4.10";

package/dist/esm/plugins/extension/ui/Extension/MultiBodiedExtension/index.js

@@ -1,7 +1,7 @@
-import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _taggedTemplateLiteral from "@babel/runtime/helpers/taggedTemplateLiteral";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _templateObject;
+var _templateObject, _templateObject2;
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 /** @jsx jsx */
@@ -96,6 +96,7 @@ var useMultiBodiedExtensionActions = function useMultiBodiedExtensionActions(_re
   }, [node, editorView, getPos, updateActiveChild]);
   return actions;
 };
+var navigationCSS = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  // make sure the user can't see a range selection inside the navigation\n  // This is really important to keep the navigation working properly\n  user-select: none;\n  -webkit-user-modify: read-only;\n"])));
 var MultiBodiedExtension = function MultiBodiedExtension(_ref2) {
   var node = _ref2.node,
     handleContentDOMRef = _ref2.handleContentDOMRef,
@@ -128,14 +129,15 @@ var MultiBodiedExtension = function MultiBodiedExtension(_ref2) {
   var articleRef = React.useCallback(function (node) {
     return handleContentDOMRef(node);
   }, [handleContentDOMRef]);
-  var containerCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n    border: 1px solid ", ";\n    padding: ", ";\n    .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'] {\n      display: none;\n    }\n\n    .multiBodiedExtension-content-dom-wrapper\n      > [data-extension-frame='true']:nth-of-type(", ") {\n      display: block;\n    }\n  "])), "var(--ds-border, ".concat(N30, ")"), "var(--ds-space-050, 4px)", activeChildIndex + 1);
+  var containerCSS = css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n    border: 1px solid ", ";\n    padding: ", ";\n    .multiBodiedExtension-content-dom-wrapper > [data-extension-frame='true'] {\n      display: none;\n    }\n\n    .multiBodiedExtension-content-dom-wrapper\n      > [data-extension-frame='true']:nth-of-type(", ") {\n      display: block;\n    }\n  "])), "var(--ds-border, ".concat(N30, ")"), "var(--ds-space-050, 4px)", activeChildIndex + 1);
   return jsx("section", {
     className: "multiBodiedExtension--container",
-    css: containerCss,
+    css: containerCSS,
     "data-testid": "multiBodiedExtension--container",
     "data-active-child-index": activeChildIndex
   }, jsx("nav", {
     className: "multiBodiedExtension-navigation",
+    css: navigationCSS,
     "data-testid": "multiBodiedExtension-navigation"
   }, extensionHandlerResult), jsx("article", {
     className: "multiBodiedExtension--frames",

package/dist/esm/ui/ConfigPanel/ConfigPanel.js

@@ -7,6 +7,8 @@ import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
 function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -31,6 +33,8 @@ import WithPluginState from '../WithPluginState';
 import FormContent from './FormContent';
 import { messages } from './messages';
 import { FormErrorBoundary } from './FormErrorBoundary';
+import { getLoggedParameters } from './utils';
+import { ALLOWED_LOGGED_MACRO_PARAMS } from './constants';
 function ConfigForm(_ref) {
   var canSave = _ref.canSave,
     errorMessage = _ref.errorMessage,
@@ -327,16 +331,20 @@ var ConfigPanel = /*#__PURE__*/function (_React$Component) {
     value: function componentWillUnmount() {
       var _this$props4 = this.props,
         createAnalyticsEvent = _this$props4.createAnalyticsEvent,
-        extensionManifest = _this$props4.extensionManifest;
+        extensionManifest = _this$props4.extensionManifest,
+        fields = _this$props4.fields;
+      var currentParameters = this.state.currentParameters;
       fireAnalyticsEvent(createAnalyticsEvent)({
         payload: {
           action: ACTION.CLOSED,
           actionSubject: ACTION_SUBJECT.CONFIG_PANEL,
           eventType: EVENT_TYPE.UI,
-          attributes: {
+          attributes: _objectSpread({
             extensionKey: extensionManifest === null || extensionManifest === void 0 ? void 0 : extensionManifest.key,
             extensionType: extensionManifest === null || extensionManifest === void 0 ? void 0 : extensionManifest.type
-          }
+          }, extensionManifest !== null && extensionManifest !== void 0 && extensionManifest.key && ALLOWED_LOGGED_MACRO_PARAMS[extensionManifest.key] ? {
+            parameters: getLoggedParameters(extensionManifest.key, currentParameters, fields)
+          } : {})
         }
       });
     }

package/dist/esm/ui/ConfigPanel/constants.js

@@ -0,0 +1,7 @@
+// Allowlist of { macroKey: parameterName[] } for analytics logging
+export var ALLOWED_LOGGED_MACRO_PARAMS = {
+  children: ['all', 'first', 'depth', 'style', 'excerptType', 'sort', 'reverse'],
+  'recently-updated': ['width', 'types', 'max', 'theme', 'showProfilePic', 'hideHeading'],
+  excerpt: ['hidden']
+};
+export var ALLOWED_PARAM_TYPES = ['enum', 'number', 'boolean'];

package/dist/esm/ui/ConfigPanel/utils.js

@@ -1,4 +1,8 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { ValidationError } from './types';
+import { ALLOWED_LOGGED_MACRO_PARAMS, ALLOWED_PARAM_TYPES } from './constants';
 export var validate = function validate(field, value) {
   return validateRequired(field, value);
 };
@@ -47,4 +51,42 @@ export var isDuplicateField = function isDuplicateField(key) {
 };
 export var getNameFromDuplicateField = function getNameFromDuplicateField(key) {
   return key.replace(duplicateFieldRegex, '');
+};
+
+// An overly cautious parser for sanitizing configuration parameters of UGC
+var parseParamType = function parseParamType(paramValue, paramField) {
+  if (paramValue && paramField) {
+    if (paramField.type === 'string') {
+      if (paramField.name === 'types') {
+        // Parse types field as an array of valid content types
+        var contentTypes = ['page', 'blogpost', 'comment', 'attachment'];
+        return paramValue && paramValue.split(',').map(function (type) {
+          return type.trim();
+        }).filter(function (type) {
+          return contentTypes.includes(type);
+        });
+      }
+      if (paramField.name === 'width') {
+        return parseFloat(paramValue);
+      }
+      // Strings are very risky - return empty string in case anything slips through
+      return '';
+    }
+    if (ALLOWED_PARAM_TYPES.includes(paramField.type)) {
+      // The param types defined here are already parsed and safe to log
+      return paramValue;
+    }
+  }
+  // Safety net
+  return null;
+};
+export var getLoggedParameters = function getLoggedParameters(macroKey, currentParams, macroFields) {
+  // Get the parameters only defined in the allowlist of logged macro/parameter keys
+  return Object.keys(currentParams).filter(function (paramKey) {
+    return ALLOWED_LOGGED_MACRO_PARAMS[macroKey].includes(paramKey);
+  }).reduce(function (obj, param) {
+    return _objectSpread(_objectSpread({}, obj), {}, _defineProperty({}, param, parseParamType(currentParams[param], macroFields === null || macroFields === void 0 ? void 0 : macroFields.find(function (field) {
+      return field.name === param;
+    }))));
+  }, {});
 };

package/dist/esm/version-wrapper.js

@@ -1,2 +1,2 @@
 export var name = "@atlaskit/editor-core";
-export var version = "189.4.8";
+export var version = "189.4.10";

package/dist/types/ui/ConfigPanel/ConfigPanel.d.ts

@@ -1,8 +1,7 @@
 import React from 'react';
-import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-import type { ExtensionManifest } from '@atlaskit/editor-common/extensions';
-import { FieldDefinition, Parameters, OnSaveCallback } from '@atlaskit/editor-common/extensions';
-import { FeatureFlags } from '@atlaskit/editor-common/types';
+import type { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
+import type { ExtensionManifest, FieldDefinition, Parameters, OnSaveCallback } from '@atlaskit/editor-common/extensions';
+import type { FeatureFlags } from '@atlaskit/editor-common/types';
 type Props = {
     extensionManifest?: ExtensionManifest;
     fields?: FieldDefinition[];

package/dist/types/ui/ConfigPanel/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const ALLOWED_LOGGED_MACRO_PARAMS: Record<string, Array<string>>;
+export declare const ALLOWED_PARAM_TYPES: string[];

package/dist/types/ui/ConfigPanel/utils.d.ts

@@ -1,4 +1,4 @@
-import { Option, FieldDefinition } from '@atlaskit/editor-common/extensions';
+import type { Option, FieldDefinition, Parameters } from '@atlaskit/editor-common/extensions';
 import { ValidationError } from './types';
 export declare const validate: <T>(field: Partial<FieldDefinition>, value: T) => ValidationError | undefined;
 type ValidationProps = {
@@ -10,4 +10,5 @@ export declare const getOptionFromValue: (options: Option[], value: string | str
 export declare const getSafeParentedName: (name: string, parentName?: string) => string;
 export declare const isDuplicateField: (key: string) => boolean;
 export declare const getNameFromDuplicateField: (key: string) => string;
+export declare const getLoggedParameters: (macroKey: string, currentParams: Parameters, macroFields?: FieldDefinition[]) => {};
 export {};

package/dist/types-ts4.5/ui/ConfigPanel/ConfigPanel.d.ts

@@ -1,8 +1,7 @@
 import React from 'react';
-import { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
-import type { ExtensionManifest } from '@atlaskit/editor-common/extensions';
-import { FieldDefinition, Parameters, OnSaveCallback } from '@atlaskit/editor-common/extensions';
-import { FeatureFlags } from '@atlaskit/editor-common/types';
+import type { WithAnalyticsEventsProps } from '@atlaskit/analytics-next';
+import type { ExtensionManifest, FieldDefinition, Parameters, OnSaveCallback } from '@atlaskit/editor-common/extensions';
+import type { FeatureFlags } from '@atlaskit/editor-common/types';
 type Props = {
     extensionManifest?: ExtensionManifest;
     fields?: FieldDefinition[];

package/dist/types-ts4.5/ui/ConfigPanel/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const ALLOWED_LOGGED_MACRO_PARAMS: Record<string, Array<string>>;
+export declare const ALLOWED_PARAM_TYPES: string[];

package/dist/types-ts4.5/ui/ConfigPanel/utils.d.ts

@@ -1,4 +1,4 @@
-import { Option, FieldDefinition } from '@atlaskit/editor-common/extensions';
+import type { Option, FieldDefinition, Parameters } from '@atlaskit/editor-common/extensions';
 import { ValidationError } from './types';
 export declare const validate: <T>(field: Partial<FieldDefinition>, value: T) => ValidationError | undefined;
 type ValidationProps = {
@@ -10,4 +10,5 @@ export declare const getOptionFromValue: (options: Option[], value: string | str
 export declare const getSafeParentedName: (name: string, parentName?: string) => string;
 export declare const isDuplicateField: (key: string) => boolean;
 export declare const getNameFromDuplicateField: (key: string) => string;
+export declare const getLoggedParameters: (macroKey: string, currentParams: Parameters, macroFields?: FieldDefinition[]) => {};
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-core",
-  "version": "189.4.8",
+  "version": "189.4.10",
   "description": "A package contains Atlassian editor core functionality",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -168,7 +168,7 @@
     "@af/integration-testing": "*",
     "@af/visual-regression": "*",
     "@atlaskit/analytics-listeners": "^8.7.0",
-    "@atlaskit/collab-provider": "9.17.2",
+    "@atlaskit/collab-provider": "9.17.3",
     "@atlaskit/dropdown-menu": "^12.1.0",
     "@atlaskit/editor-extension-dropbox": "^0.4.0",
     "@atlaskit/editor-palette": "1.5.2",