@atlaskit/link-create 1.9.3 → 1.9.5

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/link-create
 
+## 1.9.5
+
+### Patch Changes
+
+- [#43257](https://bitbucket.org/atlassian/atlassian-frontend/pull-requests/43257) [`cf4d4a94b14`](https://bitbucket.org/atlassian/atlassian-frontend/commits/cf4d4a94b14) - EDM-8493: fire analytics event for modal screens and buttons associated with link-create edit flow
+
+## 1.9.4
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.9.3
 
 ### Patch Changes

package/analytics.spec.yaml

@@ -35,6 +35,13 @@ events:
         <<: *PackageMetaDataContext
         <<: *LinkCreateAnalyticContext
 
+  - linkCreateEditScreen viewed:
+      type: screen
+      description: fired when the link create edit modal is shown to the users
+      attributes:
+        <<: *PackageMetaDataContext
+        <<: *LinkCreateAnalyticContext
+
   - linkCreateExitWarningScreen viewed:
       type: screen
       description: fired when the link create warning modal is shown to the users to warn them of losing their changes
@@ -49,9 +56,16 @@ events:
         <<: *PackageMetaDataContext
         <<: *LinkCreateAnalyticContext
 
+  - button clicked (edit):
+      type: ui
+      description: fired when the edit button is clicked
+      attributes:
+        <<: *PackageMetaDataContext
+        <<: *LinkCreateAnalyticContext
+
   - button clicked (cancel):
       type: ui
-      description: fired when the create button is clicked
+      description: fired when the cancel button is clicked
       attributes:
         <<: *PackageMetaDataContext
         <<: *LinkCreateAnalyticContext
@@ -65,7 +79,15 @@ events:
 
   - modalDialog closed (linkCreate):
       type: ui
-      description: fired when the link create component is unmounted/dismissed for any reason
+      description: fired when a link create modal component is unmounted/dismissed for any reason
+      attributes:
+        <<: *PackageMetaDataContext
+        <<: *LinkCreateAnalyticContext
+
+
+  - modalDialog opened (linkCreate):
+      type: ui
+      description: fired when a link create modal component is mounted
       attributes:
         <<: *PackageMetaDataContext
         <<: *LinkCreateAnalyticContext

package/dist/cjs/common/ui/ModalDialog/index.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.Modal = void 0;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireWildcard(require("react"));
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _modalDialog = _interopRequireDefault(require("@atlaskit/modal-dialog"));
+var _constants = require("../../constants");
+var _analytics = _interopRequireDefault(require("../../utils/analytics/analytics.codegen"));
+var _components = require("../../utils/analytics/components");
+var _excluded = ["screen", "children"];
+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; }
+var ModalOpenCloseEvents = function ModalOpenCloseEvents() {
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
+  (0, _react.useEffect)(function () {
+    //will fire when modal is mounted
+    createAnalyticsEvent((0, _analytics.default)("ui.modalDialog.opened.linkCreate", {})).fire(_constants.ANALYTICS_CHANNEL);
+
+    //will fire when modal is unmounted
+    return function () {
+      createAnalyticsEvent((0, _analytics.default)("ui.modalDialog.closed.linkCreate", {})).fire(_constants.ANALYTICS_CHANNEL);
+    };
+  }, [createAnalyticsEvent]);
+  return null;
+};
+
+/**
+ * AkModal component with built-in analytics for screen event + open + close events + source context
+ */
+var Modal = exports.Modal = function Modal(_ref) {
+  var screen = _ref.screen,
+    children = _ref.children,
+    props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
+  return /*#__PURE__*/_react.default.createElement(_modalDialog.default, props, /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
+    data: {
+      source: screen,
+      component: 'modal'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_components.ScreenViewedEvent, {
+    screen: screen
+  }), /*#__PURE__*/_react.default.createElement(ModalOpenCloseEvents, null), children));
+};

package/dist/cjs/common/utils/analytics/analytics.codegen.js

@@ -11,7 +11,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
  *
  * Generates Typescript types for analytics events from analytics.spec.yaml
  *
- * @codegen <<SignedSource::af0139619517f37a8bca32ddb6b7d6e0>>
+ * @codegen <<SignedSource::be704bbbca0e49c927d1268b9a0f1d6a>>
  * @codegenCommand yarn workspace @atlaskit/link-create run codegen-analytics
  */
 

package/dist/cjs/common/utils/form/index.js

@@ -3,12 +3,23 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.validateSubmitErrors = void 0;
+exports.shouldShowValidationErrors = void 0;
 /**
  * This function checks if there have been changes since last submit
  * to let a Field know if it should hide the error message until
  * the next submit, or if it returns to the previous error state
  */
-var validateSubmitErrors = exports.validateSubmitErrors = function validateSubmitErrors(meta) {
-  return !!(meta.touched && (meta.error || meta.submitError && !meta.dirtySinceLastSubmit));
+var shouldShowValidationErrors = exports.shouldShowValidationErrors = function shouldShowValidationErrors(meta) {
+  if (!meta.touched) {
+    return false;
+  }
+  if (meta.submitFailed) {
+    if (meta.error) {
+      return !meta.dirtySinceLastSubmit;
+    }
+    if (meta.submitError) {
+      return !meta.dirtySinceLastSubmit;
+    }
+  }
+  return false;
 };

package/dist/cjs/controllers/create-field/main.js

@@ -6,15 +6,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.CreateField = CreateField;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = require("react");
-var _react2 = require("@emotion/react");
+var _react = require("@emotion/react");
 var _reactFinalForm = require("react-final-form");
 var _form = require("@atlaskit/form");
 var _form2 = require("../../common/utils/form");
-var _formContext = require("../form-context");
 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; } /** @jsx jsx */
-var fieldWrapperStyles = (0, _react2.css)({
+var fieldWrapperStyles = (0, _react.css)({
   marginTop: "var(--ds-space-100, 8px)"
 });
 function CreateField(_ref) {
@@ -26,37 +24,36 @@ function CreateField(_ref) {
     validationHelpText = _ref.validationHelpText,
     testId = _ref.testId,
     children = _ref.children;
-  var _useFormContext = (0, _formContext.useFormContext)(),
-    assignValidator = _useFormContext.assignValidator;
-  (0, _react.useEffect)(function () {
-    if (validators) {
-      assignValidator(name, validators);
+  var fieldId = id ? id : "link-create-field-".concat(name);
+  return (0, _react.jsx)(_reactFinalForm.Field, {
+    name: name,
+    validate: function validate(value) {
+      var _find;
+      return (_find = (validators !== null && validators !== void 0 ? validators : []).find(function (validator) {
+        return !validator.isValid(value);
+      })) === null || _find === void 0 ? void 0 : _find.errorMessage;
     }
-  }, [name, validators, assignValidator]);
-  var fieldId = (0, _react.useMemo)(function () {
-    return id ? id : "link-create-field-".concat(name);
-  }, [id, name]);
-  return (0, _react2.jsx)("div", {
-    css: fieldWrapperStyles,
-    "data-testid": testId
-  }, (0, _react2.jsx)(_reactFinalForm.Field, {
-    name: name
   }, function (_ref2) {
     var input = _ref2.input,
       meta = _ref2.meta;
-    var isInvalid = (0, _form2.validateSubmitErrors)(meta);
-    var submitError = meta.submitError;
-    return (0, _react2.jsx)(_react.Fragment, null, label && (0, _react2.jsx)(_form.Label, {
+    var isInvalid = (0, _form2.shouldShowValidationErrors)(meta);
+    var submitError = meta.submitError,
+      error = meta.error;
+    var hasError = !!submitError || !!error;
+    return (0, _react.jsx)("div", {
+      css: fieldWrapperStyles,
+      "data-testid": testId
+    }, label && (0, _react.jsx)(_form.Label, {
       htmlFor: fieldId,
       id: "".concat(fieldId, "-label"),
       testId: "".concat(testId, "-label")
-    }, label, isRequired && (0, _react2.jsx)(_form.RequiredAsterisk, null)), children(_objectSpread(_objectSpread({}, input), {}, {
+    }, label, isRequired && (0, _react.jsx)(_form.RequiredAsterisk, null)), children(_objectSpread(_objectSpread({}, input), {}, {
       fieldId: fieldId,
       isInvalid: isInvalid
-    })), !submitError && validationHelpText && (0, _react2.jsx)(_form.HelperMessage, {
+    })), !hasError && validationHelpText && (0, _react.jsx)(_form.HelperMessage, {
       testId: "".concat(testId, "-helper-message")
-    }, validationHelpText), submitError && isInvalid && (0, _react2.jsx)(_form.ErrorMessage, {
+    }, validationHelpText), hasError && isInvalid && (0, _react.jsx)(_form.ErrorMessage, {
       testId: "".concat(testId, "-error-message")
-    }, submitError));
-  }));
+    }, submitError || error));
+  });
 }

package/dist/cjs/controllers/form-context/main.js

@@ -6,18 +6,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.withLinkCreateFormContext = exports.useFormContext = exports.FormContextProvider = exports.FormContext = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 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; }
 var FormContext = exports.FormContext = /*#__PURE__*/(0, _react.createContext)({
-  assignValidator: function assignValidator() {},
-  getValidators: function getValidators() {
-    return {};
-  },
   setFormErrorMessage: function setFormErrorMessage() {},
   enableEditView: undefined
 });
@@ -28,22 +21,6 @@ var FormContextProvider = exports.FormContextProvider = function FormContextProv
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     error = _useState2[0],
     setError = _useState2[1];
-  var _useState3 = (0, _react.useState)({}),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    validators = _useState4[0],
-    setValidators = _useState4[1];
-
-  // Add validators to the form
-  var assignValidator = (0, _react.useCallback)(function (name, fieldValidators) {
-    setValidators(function (prevValidators) {
-      return _objectSpread(_objectSpread({}, prevValidators), {}, (0, _defineProperty2.default)({}, name, fieldValidators));
-    });
-  }, []);
-
-  // Returns a validator function array
-  var getValidators = (0, _react.useCallback)(function () {
-    return validators;
-  }, [validators]);
 
   // Sets the form footer error message
   var setFormErrorMessage = (0, _react.useCallback)(function (errorMessage) {
@@ -51,8 +28,6 @@ var FormContextProvider = exports.FormContextProvider = function FormContextProv
   }, [setError]);
   return /*#__PURE__*/_react.default.createElement(FormContext.Provider, {
     value: {
-      assignValidator: assignValidator,
-      getValidators: getValidators,
       setFormErrorMessage: setFormErrorMessage,
       formErrorMessage: error,
       enableEditView: enableEditView

package/dist/cjs/ui/create-form/form-footer/edit-button/index.js

@@ -8,8 +8,10 @@ exports.EditButton = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactFinalForm = require("react-final-form");
 var _reactIntlNext = require("react-intl-next");
+var _analyticsNext = require("@atlaskit/analytics-next");
 var _loadingButton = _interopRequireDefault(require("@atlaskit/button/loading-button"));
 var _constants = require("../../../../common/constants");
+var _analytics = _interopRequireDefault(require("../../../../common/utils/analytics/analytics.codegen"));
 var _formContext = require("../../../../controllers/form-context");
 var _formSpy = require("../../form-spy");
 var _messages = require("./messages");
@@ -17,6 +19,8 @@ var _messages = require("./messages");
 
 var EditButton = exports.EditButton = function EditButton() {
   var intl = (0, _reactIntlNext.useIntl)();
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var _useFormState = (0, _reactFinalForm.useFormState)(),
     submitting = _useFormState.submitting;
   var _useForm = (0, _reactFinalForm.useForm)(),
@@ -40,6 +44,7 @@ var EditButton = exports.EditButton = function EditButton() {
       submitting && values[_constants.LINK_CREATE_FORM_POST_CREATE_FIELD] === true,
       onClick: function onClick() {
         var _mutators$setField;
+        createAnalyticsEvent((0, _analytics.default)('ui.button.clicked.edit', {})).fire(_constants.ANALYTICS_CHANNEL);
         /**
          * Setting this field to true indicates that the edit button was clicked and that
          * we have the intention of triggering the edit/post create flow

package/dist/cjs/ui/create-form/form-footer/main.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,15 +8,17 @@ exports.CreateFormFooter = CreateFormFooter;
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
-var _button = _interopRequireWildcard(require("@atlaskit/button"));
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _button = require("@atlaskit/button");
 var _loadingButton = _interopRequireDefault(require("@atlaskit/button/loading-button"));
 var _error = _interopRequireDefault(require("@atlaskit/icon/glyph/error"));
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _constants = require("../../../common/constants");
+var _Button = require("../../../common/ui/Button");
+var _analytics = _interopRequireDefault(require("../../../common/utils/analytics/analytics.codegen"));
 var _editButton = require("./edit-button");
 var _messages = require("./messages");
 var _submitButton = require("./submit-button");
-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; }
 /** @jsx jsx */
 
 var formFooterWrapperStyles = (0, _react2.css)({
@@ -41,6 +42,8 @@ function CreateFormFooter(_ref) {
     submitting = _ref.submitting,
     testId = _ref.testId;
   var intl = (0, _reactIntlNext.useIntl)();
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   return (0, _react2.jsx)("footer", {
     "data-testid": "".concat(testId, "-footer"),
     css: formFooterWrapperStyles
@@ -50,8 +53,9 @@ function CreateFormFooter(_ref) {
   }, (0, _react2.jsx)(_error.default, {
     label: formErrorMessage,
     primaryColor: "var(--ds-icon-danger, #E34935)"
-  }), formErrorMessage), (0, _react2.jsx)(_button.ButtonGroup, null, (0, _react2.jsx)(_button.default, {
+  }), formErrorMessage), (0, _react2.jsx)(_button.ButtonGroup, null, (0, _react2.jsx)(_Button.Button, {
     type: "button",
+    actionSubjectId: "cancel",
     appearance: "subtle",
     onClick: handleCancel,
     testId: "".concat(testId, "-button-cancel")
@@ -59,6 +63,9 @@ function CreateFormFooter(_ref) {
     type: "submit",
     appearance: "primary",
     isLoading: submitting,
-    testId: "".concat(testId, "-button-submit")
+    testId: "".concat(testId, "-button-submit"),
+    onClick: function onClick() {
+      createAnalyticsEvent((0, _analytics.default)('ui.button.clicked.create', {})).fire(_constants.ANALYTICS_CHANNEL);
+    }
   }, intl.formatMessage(_messages.messages.create))));
 }

package/dist/cjs/ui/create-form/form-footer/submit-button/index.js

@@ -8,8 +8,10 @@ exports.SubmitButton = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactFinalForm = require("react-final-form");
 var _reactIntlNext = require("react-intl-next");
+var _analyticsNext = require("@atlaskit/analytics-next");
 var _loadingButton = _interopRequireDefault(require("@atlaskit/button/loading-button"));
 var _constants = require("../../../../common/constants");
+var _analytics = _interopRequireDefault(require("../../../../common/utils/analytics/analytics.codegen"));
 var _formSpy = require("../../form-spy");
 var _messages = require("../messages");
 // eslint-disable-next-line @atlassian/tangerine/import/no-parent-imports
@@ -18,6 +20,8 @@ var _messages = require("../messages");
 
 var SubmitButton = exports.SubmitButton = function SubmitButton() {
   var intl = (0, _reactIntlNext.useIntl)();
+  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
+    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var _useFormState = (0, _reactFinalForm.useFormState)(),
     submitting = _useFormState.submitting;
   var _useForm = (0, _reactFinalForm.useForm)(),
@@ -36,6 +40,7 @@ var SubmitButton = exports.SubmitButton = function SubmitButton() {
       testId: "link-create-form-button-submit",
       onClick: function onClick() {
         var _mutators$setField;
+        createAnalyticsEvent((0, _analytics.default)('ui.button.clicked.create', {})).fire(_constants.ANALYTICS_CHANNEL);
         (_mutators$setField = mutators.setField) === null || _mutators$setField === void 0 || _mutators$setField.call(mutators, _constants.LINK_CREATE_FORM_POST_CREATE_FIELD, false);
       }
     }, intl.formatMessage(_messages.messages.create));

package/dist/cjs/ui/create-form/main.js

@@ -12,16 +12,13 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _reactFinalForm = require("react-final-form");
-var _analyticsNext = require("@atlaskit/analytics-next");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
 var _constants = require("../../common/constants");
-var _analytics = _interopRequireDefault(require("../../common/utils/analytics/analytics.codegen"));
 var _exitWarningModalContext = require("../../controllers/exit-warning-modal-context");
 var _formContext = require("../../controllers/form-context");
 var _formFooter = require("./form-footer");
 var _formLoader = require("./form-loader");
-var _utils = require("./utils");
 var _excluded = ["submitting"];
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); } /** @jsx jsx */
@@ -41,34 +38,19 @@ var CreateForm = exports.CreateForm = function CreateForm(_ref) {
     isLoading = _ref.isLoading,
     hideFooter = _ref.hideFooter,
     initialValues = _ref.initialValues;
-  var _useAnalyticsEvents = (0, _analyticsNext.useAnalyticsEvents)(),
-    createAnalyticsEvent = _useAnalyticsEvents.createAnalyticsEvent;
   var _useFormContext = (0, _formContext.useFormContext)(),
-    getValidators = _useFormContext.getValidators,
     formErrorMessage = _useFormContext.formErrorMessage,
     enableEditView = _useFormContext.enableEditView;
   var _useExitWarningModal = (0, _exitWarningModalContext.useExitWarningModal)(),
     setShouldShowWarning = _useExitWarningModal.setShouldShowWarning;
   var handleSubmit = (0, _react.useCallback)( /*#__PURE__*/function () {
     var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(data) {
-      var validators, errors, shouldEnableEditView, formData;
+      var shouldEnableEditView, formData;
       return _regenerator.default.wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
-            createAnalyticsEvent((0, _analytics.default)('ui.button.clicked.create', {})).fire(_constants.ANALYTICS_CHANNEL);
-            validators = getValidators();
-            errors = (0, _utils.validateFormData)({
-              data: data,
-              validators: validators
-            });
-            if (!(Object.keys(errors).length !== 0)) {
-              _context.next = 5;
-              break;
-            }
-            return _context.abrupt("return", errors);
-          case 5:
             if (!(0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.link-create.enable-edit')) {
-              _context.next = 9;
+              _context.next = 4;
               break;
             }
             shouldEnableEditView = data[_constants.LINK_CREATE_FORM_POST_CREATE_FIELD], formData = (0, _objectWithoutProperties2.default)(data, [_constants.LINK_CREATE_FORM_POST_CREATE_FIELD].map(_toPropertyKey));
@@ -79,9 +61,9 @@ var CreateForm = exports.CreateForm = function CreateForm(_ref) {
              */
             enableEditView === null || enableEditView === void 0 || enableEditView(!!shouldEnableEditView);
             return _context.abrupt("return", onSubmit(formData));
-          case 9:
+          case 4:
             return _context.abrupt("return", onSubmit(data));
-          case 10:
+          case 5:
           case "end":
             return _context.stop();
         }
@@ -90,11 +72,10 @@ var CreateForm = exports.CreateForm = function CreateForm(_ref) {
     return function (_x) {
       return _ref2.apply(this, arguments);
     };
-  }(), [createAnalyticsEvent, getValidators, onSubmit, enableEditView]);
+  }(), [onSubmit, enableEditView]);
   var handleCancel = (0, _react.useCallback)(function () {
-    createAnalyticsEvent((0, _analytics.default)('ui.button.clicked.cancel', {})).fire(_constants.ANALYTICS_CHANNEL);
     onCancel && onCancel();
-  }, [createAnalyticsEvent, onCancel]);
+  }, [onCancel]);
   if (isLoading) {
     return (0, _react2.jsx)(_formLoader.CreateFormLoader, null);
   }

package/dist/cjs/ui/link-create/confirm-dismiss-dialog/main.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,13 +8,11 @@ exports.ConfirmDismissDialog = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _analyticsNext = require("@atlaskit/analytics-next");
-var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
+var _modalDialog = require("@atlaskit/modal-dialog");
 var _Button = require("../../../common/ui/Button");
-var _components = require("../../../common/utils/analytics/components");
+var _ModalDialog = require("../../../common/ui/ModalDialog");
 var _callbackContext = require("../../../controllers/callback-context");
 var _messages = _interopRequireDefault(require("./messages"));
-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; }
 var screen = 'linkCreateExitWarningScreen';
 var context = {
   component: screen,
@@ -36,13 +33,12 @@ var ConfirmDismissDialog = exports.ConfirmDismissDialog = function ConfirmDismis
   };
   return /*#__PURE__*/_react.default.createElement(_modalDialog.ModalTransition, null, active && /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
     data: context
-  }, /*#__PURE__*/_react.default.createElement(_modalDialog.default, {
+  }, /*#__PURE__*/_react.default.createElement(_ModalDialog.Modal, {
     testId: "link-create-confirm-dismiss-dialog",
+    screen: screen,
     onClose: onCancelDismiss,
     width: "small"
-  }, /*#__PURE__*/_react.default.createElement(_components.ScreenViewedEvent, {
-    screen: screen
-  }), /*#__PURE__*/_react.default.createElement(_modalDialog.ModalHeader, null, /*#__PURE__*/_react.default.createElement(_modalDialog.ModalTitle, null, intl.formatMessage(_messages.default.title))), /*#__PURE__*/_react.default.createElement(_modalDialog.ModalBody, null, intl.formatMessage(_messages.default.description)), /*#__PURE__*/_react.default.createElement(_modalDialog.ModalFooter, null, /*#__PURE__*/_react.default.createElement(_Button.Button, {
+  }, /*#__PURE__*/_react.default.createElement(_modalDialog.ModalHeader, null, /*#__PURE__*/_react.default.createElement(_modalDialog.ModalTitle, null, intl.formatMessage(_messages.default.title))), /*#__PURE__*/_react.default.createElement(_modalDialog.ModalBody, null, intl.formatMessage(_messages.default.description)), /*#__PURE__*/_react.default.createElement(_modalDialog.ModalFooter, null, /*#__PURE__*/_react.default.createElement(_Button.Button, {
     actionSubjectId: "cancel",
     appearance: "subtle",
     onClick: onCancelDismiss

package/dist/cjs/ui/link-create/edit-modal/index.js

@@ -1,17 +1,16 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.EditModal = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
+var _modalDialog = require("@atlaskit/modal-dialog");
+var _ModalDialog = require("../../../common/ui/ModalDialog");
 var _editPostCreateContext = require("../../../controllers/edit-post-create-context");
 var _pluginContext = require("../../../controllers/plugin-context");
-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; }
+var SCREEN = 'linkCreateEditScreen';
 var EditModal = exports.EditModal = function EditModal(_ref) {
   var _activePlugin$editVie;
   var onClose = _ref.onClose,
@@ -20,8 +19,9 @@ var EditModal = exports.EditModal = function EditModal(_ref) {
     editViewPayload = _useEditPostCreateMod.editViewPayload;
   var _useLinkCreatePlugins = (0, _pluginContext.useLinkCreatePlugins)(),
     activePlugin = _useLinkCreatePlugins.activePlugin;
-  return /*#__PURE__*/_react.default.createElement(_modalDialog.ModalTransition, null, !!editViewPayload && /*#__PURE__*/_react.default.createElement(_modalDialog.default, {
+  return /*#__PURE__*/_react.default.createElement(_modalDialog.ModalTransition, null, !!editViewPayload && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ModalDialog.Modal, {
     testId: "link-create-edit-modal",
+    screen: SCREEN,
     onClose: onClose,
     shouldScrollInViewport: true,
     width: "calc(100vw - 120px)",
@@ -30,5 +30,5 @@ var EditModal = exports.EditModal = function EditModal(_ref) {
   }, activePlugin === null || activePlugin === void 0 || (_activePlugin$editVie = activePlugin.editView) === null || _activePlugin$editVie === void 0 ? void 0 : _activePlugin$editVie.call(activePlugin, {
     payload: editViewPayload,
     onClose: onClose
-  })));
+  }))));
 };

package/dist/cjs/ui/link-create/main.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -13,10 +12,11 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _reactIntlNext = require("react-intl-next");
-var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
+var _modalDialog = require("@atlaskit/modal-dialog");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _primitives = require("@atlaskit/primitives");
 var _constants = require("../../common/constants");
+var _ModalDialog = require("../../common/ui/ModalDialog");
 var _callbackContext = require("../../controllers/callback-context");
 var _editPostCreateContext = require("../../controllers/edit-post-create-context");
 var _exitWarningModalContext = require("../../controllers/exit-warning-modal-context");
@@ -26,12 +26,10 @@ var _confirmDismissDialog = require("./confirm-dismiss-dialog");
 var _editModal = require("./edit-modal");
 var _errorBoundary = require("./error-boundary");
 var _messages = require("./messages");
-var _trackMount = _interopRequireDefault(require("./track-mount"));
-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; }
 /** @jsx jsx */
 
 var TEST_ID = exports.TEST_ID = 'link-create';
+var SCREEN_ID = 'linkCreateScreen';
 var LinkCreateContent = function LinkCreateContent(_ref) {
   var plugins = _ref.plugins,
     entityKey = _ref.entityKey;
@@ -109,8 +107,9 @@ var LinkCreateWithModal = function LinkCreateWithModal(_ref2) {
     onCreate: handleCreate,
     onFailure: handleFailure,
     onCancel: handleCancel
-  }, (0, _react2.jsx)(_modalDialog.ModalTransition, null, active && (0, _react2.jsx)(_modalDialog.default, {
+  }, (0, _react2.jsx)(_modalDialog.ModalTransition, null, active && (0, _react2.jsx)(_ModalDialog.Modal, {
     testId: "link-create-modal",
+    screen: SCREEN_ID,
     onClose: handleCancel,
     shouldScrollInViewport: true,
     onOpenComplete: onOpenComplete,
@@ -118,7 +117,7 @@ var LinkCreateWithModal = function LinkCreateWithModal(_ref2) {
     width: "".concat(_constants.CREATE_FORM_MAX_WIDTH_IN_PX, "px")
   }, (0, _react2.jsx)(_modalDialog.ModalHeader, null, (0, _react2.jsx)(_modalDialog.ModalTitle, null, modalTitle || intl.formatMessage(_messages.messages.heading))), (0, _react2.jsx)(_modalDialog.ModalBody, null, (0, _react2.jsx)(_primitives.Box, {
     testId: testId
-  }, (0, _react2.jsx)(_errorBoundary.ErrorBoundary, null, (0, _react2.jsx)(_trackMount.default, null), (0, _react2.jsx)(LinkCreateContent, {
+  }, (0, _react2.jsx)(_errorBoundary.ErrorBoundary, null, (0, _react2.jsx)(LinkCreateContent, {
     plugins: plugins,
     entityKey: entityKey
   })))))), (0, _platformFeatureFlags.getBooleanFF)('platform.linking-platform.link-create.enable-edit') && onComplete && (0, _react2.jsx)(_editModal.EditModal, {

package/dist/cjs/ui/main.js

@@ -31,7 +31,7 @@ var LinkCreateWithAnalyticsContext = (0, _analytics.withLinkCreateAnalyticsConte
 }));
 var PACKAGE_DATA = exports.PACKAGE_DATA = {
   packageName: "@atlaskit/link-create" || '',
-  packageVersion: "1.9.3" || '',
+  packageVersion: "1.9.5" || '',
   componentName: _constants.COMPONENT_NAME,
   source: _constants.COMPONENT_NAME
 };