@atlaskit/link-create 2.1.0 → 2.3.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @atlaskit/link-create
 
+## 2.3.0
+
+### Minor Changes
+
+- [#107796](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/107796)
+  [`15f419051682`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/15f419051682) -
+  Fire screen viewed analytics event for Inline Create
+
+### Patch Changes
+
+- [#107877](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/107877)
+  [`3f82794369ce`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/3f82794369ce) -
+  Internal changes to types. No expected functional changes.
+
+## 2.2.0
+
+### Minor Changes
+
+- [#105330](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/105330)
+  [`9fb53f33cb33`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/9fb53f33cb33) -
+  [ux] Added a goal owner selector component to the goal creation modal. Additionally, added a new
+  user-picker component to be used in CreateForm. Goal picker has a new mandatory default owner prop
+
 ## 2.1.0
 
 ### Minor Changes

package/dist/cjs/common/constants.js

@@ -3,15 +3,17 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.PACKAGE_DATA = exports.LINK_CREATE_FORM_POST_CREATE_FIELD = exports.CREATE_FORM_MIN_HEIGHT_IN_PX = exports.CREATE_FORM_MAX_WIDTH_IN_PX = exports.COMPONENT_NAME = exports.ANALYTICS_CHANNEL = void 0;
+exports.SCREEN_ID = exports.PACKAGE_DATA = exports.LINK_CREATE_FORM_POST_CREATE_FIELD = exports.DEFAULT_TEST_ID = exports.CREATE_FORM_MIN_HEIGHT_IN_PX = exports.CREATE_FORM_MAX_WIDTH_IN_PX = exports.COMPONENT_NAME = exports.ANALYTICS_CHANNEL = void 0;
 var ANALYTICS_CHANNEL = exports.ANALYTICS_CHANNEL = 'media';
 var COMPONENT_NAME = exports.COMPONENT_NAME = 'linkCreate';
+var SCREEN_ID = exports.SCREEN_ID = 'linkCreateScreen';
+var DEFAULT_TEST_ID = exports.DEFAULT_TEST_ID = 'link-create';
 var CREATE_FORM_MAX_WIDTH_IN_PX = exports.CREATE_FORM_MAX_WIDTH_IN_PX = '480';
 var CREATE_FORM_MIN_HEIGHT_IN_PX = exports.CREATE_FORM_MIN_HEIGHT_IN_PX = '200';
 var LINK_CREATE_FORM_POST_CREATE_FIELD = exports.LINK_CREATE_FORM_POST_CREATE_FIELD = '__post_create__';
 var PACKAGE_DATA = exports.PACKAGE_DATA = {
   packageName: "@atlaskit/link-create" || '',
-  packageVersion: "2.1.0" || '',
+  packageVersion: "2.3.0" || '',
   component: COMPONENT_NAME,
   componentName: COMPONENT_NAME
 };

package/dist/cjs/index.js

@@ -52,6 +52,12 @@ Object.defineProperty(exports, "TextField", {
     return _index.TextField;
   }
 });
+Object.defineProperty(exports, "UserPicker", {
+  enumerable: true,
+  get: function get() {
+    return _index.UserPicker;
+  }
+});
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {

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

@@ -156,7 +156,7 @@ var CreateForm = exports.CreateForm = function CreateForm(_ref) {
       }
     }), (0, _react2.jsx)("p", {
       "aria-hidden": "true"
-    }, intl.formatMessage(_messages.default.requiredFieldInstruction), ' ', (0, _react2.jsx)(_form.RequiredAsterisk, null)), (0, _react2.jsx)(_primitives.Box, null, children), !hideFooter && (0, _react2.jsx)(_formFooter.CreateFormFooter
+    }, intl.formatMessage(_messages.default.requiredFieldInstruction), " ", (0, _react2.jsx)(_form.RequiredAsterisk, null)), (0, _react2.jsx)(_primitives.Box, null, children), !hideFooter && (0, _react2.jsx)(_formFooter.CreateFormFooter
     /**
      * We will prefer to render the error message connected to
      * react final form state (submitError) otherwise we can

package/dist/cjs/ui/create-form/user-picker/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "UserPicker", {
+  enumerable: true,
+  get: function get() {
+    return _main.UserPicker;
+  }
+});
+var _main = require("./main");

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

@@ -0,0 +1,59 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.TEST_ID = void 0;
+exports.UserPicker = UserPicker;
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = require("@emotion/react");
+var _smartUserPicker = _interopRequireDefault(require("@atlaskit/smart-user-picker"));
+var _createField = require("../../../controllers/create-field");
+var _excluded = ["fieldId"];
+/** @jsx jsx */
+var TEST_ID = exports.TEST_ID = 'link-create-user-picker';
+var DEFAULT_DEBOUNCE_TIME = 400;
+var UserPickerWidth = "100%";
+
+/**
+ * A user picker utilising the SmartUserPicker.
+ */
+
+function UserPicker(_ref) {
+  var productKey = _ref.productKey,
+    siteId = _ref.siteId,
+    name = _ref.name,
+    label = _ref.label,
+    placeholder = _ref.placeholder,
+    validators = _ref.validators,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? TEST_ID : _ref$testId,
+    defaultValue = _ref.defaultValue;
+  return (0, _react.jsx)(_createField.CreateField, {
+    name: name,
+    label: label,
+    isRequired: true,
+    testId: testId,
+    validators: validators
+  }, function (_ref2) {
+    var fieldId = _ref2.fieldId,
+      fieldProps = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+    return (0, _react.jsx)(_smartUserPicker.default, {
+      defaultValue: defaultValue,
+      placeholder: placeholder,
+      onChange: function onChange(value) {
+        return fieldProps.onChange(value);
+      },
+      subtle: true,
+      isMulti: false,
+      productKey: productKey,
+      siteId: siteId,
+      fieldId: fieldId,
+      debounceTime: DEFAULT_DEBOUNCE_TIME,
+      prefetch: true,
+      isClearable: false,
+      width: UserPickerWidth
+    });
+  });
+}

package/dist/cjs/ui/create-form/user-picker/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

package/dist/cjs/ui/index.js

@@ -46,6 +46,12 @@ Object.defineProperty(exports, "TextField", {
     return _textfield.TextField;
   }
 });
+Object.defineProperty(exports, "UserPicker", {
+  enumerable: true,
+  get: function get() {
+    return _userPicker.UserPicker;
+  }
+});
 Object.defineProperty(exports, "default", {
   enumerable: true,
   get: function get() {
@@ -59,4 +65,5 @@ var _main = require("./create-form/main");
 var _formLoader = require("./create-form/form-loader");
 var _select = require("./create-form/select");
 var _asyncSelect = require("./create-form/async-select");
-var _formSpy = require("./create-form/form-spy");
+var _formSpy = require("./create-form/form-spy");
+var _userPicker = require("./create-form/user-picker");

package/dist/cjs/ui/inline-create/inline-analytics/index.js

@@ -0,0 +1,22 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InlineAnalytics = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _analyticsNext = require("@atlaskit/analytics-next");
+var _components = require("../../..//common/utils/analytics/components");
+var InlineAnalytics = exports.InlineAnalytics = function InlineAnalytics(_ref) {
+  var screen = _ref.screen,
+    children = _ref.children;
+  return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
+    data: {
+      source: screen,
+      component: 'inline-create'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_components.ScreenViewedEvent, {
+    screen: screen
+  }), children);
+};

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

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.TEST_ID = void 0;
+exports.default = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
@@ -12,6 +12,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _react = require("react");
 var _react2 = require("@emotion/react");
 var _primitives = require("@atlaskit/primitives");
+var _constants = require("../../common/constants");
 var _confirmDismissDialog = require("../../common/ui/confirm-dismiss-dialog");
 var _editModal = require("../../common/ui/edit-modal");
 var _errorBoundary = require("../../common/ui/error-boundary");
@@ -21,12 +22,9 @@ var _editPostCreateContext = require("../../controllers/edit-post-create-context
 var _exitWarningModalContext = require("../../controllers/exit-warning-modal-context");
 var _formContext = require("../../controllers/form-context");
 var _pluginContext = require("../../controllers/plugin-context");
+var _inlineAnalytics = require("./inline-analytics");
 /** @jsx jsx */
 
-var TEST_ID = exports.TEST_ID = 'link-create';
-// todo: EDM-10075 trigger the screen.viewed_linkCreateScreen event when inline-create is mounted
-// const SCREEN_ID = 'linkCreateScreen';
-
 var InlineCreateContent = function InlineCreateContent(_ref) {
   var onCreate = _ref.onCreate,
     onFailure = _ref.onFailure,
@@ -34,7 +32,8 @@ var InlineCreateContent = function InlineCreateContent(_ref) {
     onComplete = _ref.onComplete,
     plugins = _ref.plugins,
     entityKey = _ref.entityKey,
-    testId = _ref.testId;
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? _constants.DEFAULT_TEST_ID : _ref$testId;
   var _useExitWarningModal = (0, _exitWarningModalContext.useExitWarningModal)(),
     getShouldShowWarning = _useExitWarningModal.getShouldShowWarning;
   var _useState = (0, _react.useState)(false),
@@ -59,12 +58,14 @@ var InlineCreateContent = function InlineCreateContent(_ref) {
     onCreate: onCreate,
     onFailure: onFailure,
     onCancel: handleCancel
-  }, (0, _react2.jsx)(_errorBoundary.ErrorBoundary, null, (0, _react2.jsx)(_primitives.Box, {
+  }, (0, _react2.jsx)(_errorBoundary.ErrorBoundary, null, (0, _react2.jsx)(_inlineAnalytics.InlineAnalytics, {
+    screen: _constants.SCREEN_ID
+  }, (0, _react2.jsx)(_primitives.Box, {
     testId: testId
   }, (0, _react2.jsx)(_linkCreateContent.LinkCreateContent, {
     plugins: plugins,
     entityKey: entityKey
-  }))), onComplete && (0, _react2.jsx)(_editModal.EditModal, {
+  })))), onComplete && (0, _react2.jsx)(_editModal.EditModal, {
     onClose: onComplete,
     editViewPayload: editViewPayload,
     activePlugin: activePlugin

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

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = exports.TEST_ID = void 0;
+exports.default = void 0;
 var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
@@ -29,8 +29,6 @@ var _pluginContext = require("../../controllers/plugin-context");
 var _messages = require("./messages");
 /** @jsx jsx */
 
-var TEST_ID = exports.TEST_ID = 'link-create';
-var SCREEN_ID = 'linkCreateScreen';
 var LinkCreateWithModal = function LinkCreateWithModal(_ref) {
   var active = _ref.active,
     modalTitle = _ref.modalTitle,
@@ -41,7 +39,7 @@ var LinkCreateWithModal = function LinkCreateWithModal(_ref) {
     onOpenComplete = _ref.onOpenComplete,
     onCloseComplete = _ref.onCloseComplete,
     _ref$testId = _ref.testId,
-    testId = _ref$testId === void 0 ? TEST_ID : _ref$testId,
+    testId = _ref$testId === void 0 ? _constants.DEFAULT_TEST_ID : _ref$testId,
     plugins = _ref.plugins,
     entityKey = _ref.entityKey,
     modalHero = _ref.modalHero;
@@ -72,7 +70,7 @@ var LinkCreateWithModal = function LinkCreateWithModal(_ref) {
     onCancel: handleCancel
   }, (0, _react2.jsx)(_modalDialog.ModalTransition, null, active && (0, _react2.jsx)(_ModalDialog.Modal, {
     testId: "link-create-modal",
-    screen: SCREEN_ID,
+    screen: _constants.SCREEN_ID,
     onClose: handleCancel,
     shouldScrollInViewport: true,
     onOpenComplete: onOpenComplete,

package/dist/es2019/common/constants.js

@@ -1,11 +1,13 @@
 export const ANALYTICS_CHANNEL = 'media';
 export const COMPONENT_NAME = 'linkCreate';
+export const SCREEN_ID = 'linkCreateScreen';
+export const DEFAULT_TEST_ID = 'link-create';
 export const CREATE_FORM_MAX_WIDTH_IN_PX = '480';
 export const CREATE_FORM_MIN_HEIGHT_IN_PX = '200';
 export const LINK_CREATE_FORM_POST_CREATE_FIELD = '__post_create__';
 export const PACKAGE_DATA = {
   packageName: "@atlaskit/link-create" || '',
-  packageVersion: "2.1.0" || '',
+  packageVersion: "2.3.0" || '',
   component: COMPONENT_NAME,
   componentName: COMPONENT_NAME
 };

package/dist/es2019/index.js

@@ -1,6 +1,6 @@
-export { default, TextField, CreateForm, Select, AsyncSelect, CreateFormLoader, FormSpy
+export { default, TextField, CreateForm, Select, AsyncSelect, CreateFormLoader, FormSpy,
 // todo: EDM-10077 - export this once inline-create is tested/ready
 //InlineCreate,
-} from './ui/index';
+UserPicker } from './ui/index';
 export { useLinkCreateCallback, LinkCreateCallbackProvider } from './controllers/callback-context';
 export { FORM_ERROR } from 'final-form';

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

@@ -121,7 +121,7 @@ export const CreateForm = ({
       }
     }), jsx("p", {
       "aria-hidden": "true"
-    }, intl.formatMessage(messages.requiredFieldInstruction), ' ', jsx(RequiredAsterisk, null)), jsx(Box, null, children), !hideFooter && jsx(CreateFormFooter
+    }, intl.formatMessage(messages.requiredFieldInstruction), " ", jsx(RequiredAsterisk, null)), jsx(Box, null, children), !hideFooter && jsx(CreateFormFooter
     /**
      * We will prefer to render the error message connected to
      * react final form state (submitError) otherwise we can

package/dist/es2019/ui/create-form/user-picker/index.js

@@ -0,0 +1 @@
+export { UserPicker } from './main';

package/dist/es2019/ui/create-form/user-picker/main.js

@@ -0,0 +1,48 @@
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import SmartUserPicker from '@atlaskit/smart-user-picker';
+import { CreateField } from '../../../controllers/create-field';
+export const TEST_ID = 'link-create-user-picker';
+const DEFAULT_DEBOUNCE_TIME = 400;
+const UserPickerWidth = "100%";
+
+/**
+ * A user picker utilising the SmartUserPicker.
+ */
+
+export function UserPicker({
+  productKey,
+  siteId,
+  name,
+  label,
+  placeholder,
+  validators,
+  testId = TEST_ID,
+  defaultValue
+}) {
+  return jsx(CreateField, {
+    name: name,
+    label: label,
+    isRequired: true,
+    testId: testId,
+    validators: validators
+  }, ({
+    fieldId,
+    ...fieldProps
+  }) => {
+    return jsx(SmartUserPicker, {
+      defaultValue: defaultValue,
+      placeholder: placeholder,
+      onChange: value => fieldProps.onChange(value),
+      subtle: true,
+      isMulti: false,
+      productKey: productKey,
+      siteId: siteId,
+      fieldId: fieldId,
+      debounceTime: DEFAULT_DEBOUNCE_TIME,
+      prefetch: true,
+      isClearable: false,
+      width: UserPickerWidth
+    });
+  });
+}

package/dist/es2019/ui/create-form/user-picker/types.js

@@ -0,0 +1 @@
+export {};

package/dist/es2019/ui/index.js

@@ -5,4 +5,5 @@ export { CreateForm } from './create-form/main';
 export { CreateFormLoader } from './create-form/form-loader';
 export { Select } from './create-form/select';
 export { AsyncSelect } from './create-form/async-select';
-export { FormSpy } from './create-form/form-spy';
+export { FormSpy } from './create-form/form-spy';
+export { UserPicker } from './create-form/user-picker';

package/dist/es2019/ui/inline-create/inline-analytics/index.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import { AnalyticsContext } from '@atlaskit/analytics-next';
+import { ScreenViewedEvent } from '../../..//common/utils/analytics/components';
+export const InlineAnalytics = ({
+  screen,
+  children
+}) => /*#__PURE__*/React.createElement(AnalyticsContext, {
+  data: {
+    source: screen,
+    component: 'inline-create'
+  }
+}, /*#__PURE__*/React.createElement(ScreenViewedEvent, {
+  screen: screen
+}), children);

package/dist/es2019/ui/inline-create/main.js

@@ -3,21 +3,17 @@ import _extends from "@babel/runtime/helpers/extends";
 import { useCallback, useState } from 'react';
 import { jsx } from '@emotion/react';
 import { Box } from '@atlaskit/primitives';
+import { DEFAULT_TEST_ID, SCREEN_ID } from '../../common/constants';
 import { ConfirmDismissDialog } from '../../common/ui/confirm-dismiss-dialog';
 import { EditModal } from '../../common/ui/edit-modal';
 import { ErrorBoundary } from '../../common/ui/error-boundary';
 import { LinkCreateContent } from '../../common/ui/link-create-content';
-import { LinkCreateCallbackProvider
-// useLinkCreateCallback,
-} from '../../controllers/callback-context';
+import { LinkCreateCallbackProvider } from '../../controllers/callback-context';
 import { EditPostCreateModalProvider, useEditPostCreateModal } from '../../controllers/edit-post-create-context';
 import { ExitWarningModalProvider, useExitWarningModal } from '../../controllers/exit-warning-modal-context';
 import { FormContextProvider } from '../../controllers/form-context';
 import { LinkCreatePluginsProvider, useLinkCreatePlugins } from '../../controllers/plugin-context';
-export const TEST_ID = 'link-create';
-// todo: EDM-10075 trigger the screen.viewed_linkCreateScreen event when inline-create is mounted
-// const SCREEN_ID = 'linkCreateScreen';
-
+import { InlineAnalytics } from './inline-analytics';
 const InlineCreateContent = ({
   onCreate,
   onFailure,
@@ -25,7 +21,7 @@ const InlineCreateContent = ({
   onComplete,
   plugins,
   entityKey,
-  testId
+  testId = DEFAULT_TEST_ID
 }) => {
   const {
     getShouldShowWarning
@@ -49,12 +45,14 @@ const InlineCreateContent = ({
     onCreate: onCreate,
     onFailure: onFailure,
     onCancel: handleCancel
-  }, jsx(ErrorBoundary, null, jsx(Box, {
+  }, jsx(ErrorBoundary, null, jsx(InlineAnalytics, {
+    screen: SCREEN_ID
+  }, jsx(Box, {
     testId: testId
   }, jsx(LinkCreateContent, {
     plugins: plugins,
     entityKey: entityKey
-  }))), onComplete && jsx(EditModal, {
+  })))), onComplete && jsx(EditModal, {
     onClose: onComplete,
     editViewPayload: editViewPayload,
     activePlugin: activePlugin

package/dist/es2019/ui/modal-create/main.js

@@ -5,7 +5,7 @@ import { jsx } from '@emotion/react';
 import { useIntl } from 'react-intl-next';
 import { ModalBody, ModalHeader, ModalTitle, ModalTransition } from '@atlaskit/modal-dialog';
 import { Box } from '@atlaskit/primitives';
-import { CREATE_FORM_MAX_WIDTH_IN_PX } from '../../common/constants';
+import { CREATE_FORM_MAX_WIDTH_IN_PX, DEFAULT_TEST_ID, SCREEN_ID } from '../../common/constants';
 import { ConfirmDismissDialog } from '../../common/ui/confirm-dismiss-dialog';
 import { EditModal } from '../../common/ui/edit-modal';
 import { ErrorBoundary } from '../../common/ui/error-boundary';
@@ -18,8 +18,6 @@ import { ExitWarningModalProvider, useExitWarningModal } from '../../controllers
 import { FormContextProvider } from '../../controllers/form-context';
 import { LinkCreatePluginsProvider, useLinkCreatePlugins } from '../../controllers/plugin-context';
 import { messages } from './messages';
-export const TEST_ID = 'link-create';
-const SCREEN_ID = 'linkCreateScreen';
 const LinkCreateWithModal = ({
   active,
   modalTitle,
@@ -29,7 +27,7 @@ const LinkCreateWithModal = ({
   onComplete,
   onOpenComplete,
   onCloseComplete,
-  testId = TEST_ID,
+  testId = DEFAULT_TEST_ID,
   plugins,
   entityKey,
   modalHero

package/dist/esm/common/constants.js

@@ -1,11 +1,13 @@
 export var ANALYTICS_CHANNEL = 'media';
 export var COMPONENT_NAME = 'linkCreate';
+export var SCREEN_ID = 'linkCreateScreen';
+export var DEFAULT_TEST_ID = 'link-create';
 export var CREATE_FORM_MAX_WIDTH_IN_PX = '480';
 export var CREATE_FORM_MIN_HEIGHT_IN_PX = '200';
 export var LINK_CREATE_FORM_POST_CREATE_FIELD = '__post_create__';
 export var PACKAGE_DATA = {
   packageName: "@atlaskit/link-create" || '',
-  packageVersion: "2.1.0" || '',
+  packageVersion: "2.3.0" || '',
   component: COMPONENT_NAME,
   componentName: COMPONENT_NAME
 };

package/dist/esm/index.js

@@ -1,6 +1,6 @@
-export { default, TextField, CreateForm, Select, AsyncSelect, CreateFormLoader, FormSpy
+export { default, TextField, CreateForm, Select, AsyncSelect, CreateFormLoader, FormSpy,
 // todo: EDM-10077 - export this once inline-create is tested/ready
 //InlineCreate,
-} from './ui/index';
+UserPicker } from './ui/index';
 export { useLinkCreateCallback, LinkCreateCallbackProvider } from './controllers/callback-context';
 export { FORM_ERROR } from 'final-form';

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

@@ -150,7 +150,7 @@ export var CreateForm = function CreateForm(_ref) {
       }
     }), jsx("p", {
       "aria-hidden": "true"
-    }, intl.formatMessage(messages.requiredFieldInstruction), ' ', jsx(RequiredAsterisk, null)), jsx(Box, null, children), !hideFooter && jsx(CreateFormFooter
+    }, intl.formatMessage(messages.requiredFieldInstruction), " ", jsx(RequiredAsterisk, null)), jsx(Box, null, children), !hideFooter && jsx(CreateFormFooter
     /**
      * We will prefer to render the error message connected to
      * react final form state (submitError) otherwise we can

package/dist/esm/ui/create-form/user-picker/index.js

@@ -0,0 +1 @@
+export { UserPicker } from './main';

package/dist/esm/ui/create-form/user-picker/main.js

@@ -0,0 +1,51 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+var _excluded = ["fieldId"];
+/** @jsx jsx */
+import { jsx } from '@emotion/react';
+import SmartUserPicker from '@atlaskit/smart-user-picker';
+import { CreateField } from '../../../controllers/create-field';
+export var TEST_ID = 'link-create-user-picker';
+var DEFAULT_DEBOUNCE_TIME = 400;
+var UserPickerWidth = "100%";
+
+/**
+ * A user picker utilising the SmartUserPicker.
+ */
+
+export function UserPicker(_ref) {
+  var productKey = _ref.productKey,
+    siteId = _ref.siteId,
+    name = _ref.name,
+    label = _ref.label,
+    placeholder = _ref.placeholder,
+    validators = _ref.validators,
+    _ref$testId = _ref.testId,
+    testId = _ref$testId === void 0 ? TEST_ID : _ref$testId,
+    defaultValue = _ref.defaultValue;
+  return jsx(CreateField, {
+    name: name,
+    label: label,
+    isRequired: true,
+    testId: testId,
+    validators: validators
+  }, function (_ref2) {
+    var fieldId = _ref2.fieldId,
+      fieldProps = _objectWithoutProperties(_ref2, _excluded);
+    return jsx(SmartUserPicker, {
+      defaultValue: defaultValue,
+      placeholder: placeholder,
+      onChange: function onChange(value) {
+        return fieldProps.onChange(value);
+      },
+      subtle: true,
+      isMulti: false,
+      productKey: productKey,
+      siteId: siteId,
+      fieldId: fieldId,
+      debounceTime: DEFAULT_DEBOUNCE_TIME,
+      prefetch: true,
+      isClearable: false,
+      width: UserPickerWidth
+    });
+  });
+}

package/dist/esm/ui/create-form/user-picker/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/ui/index.js

@@ -5,4 +5,5 @@ export { CreateForm } from './create-form/main';
 export { CreateFormLoader } from './create-form/form-loader';
 export { Select } from './create-form/select';
 export { AsyncSelect } from './create-form/async-select';
-export { FormSpy } from './create-form/form-spy';
+export { FormSpy } from './create-form/form-spy';
+export { UserPicker } from './create-form/user-picker';

package/dist/esm/ui/inline-create/inline-analytics/index.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import { AnalyticsContext } from '@atlaskit/analytics-next';
+import { ScreenViewedEvent } from '../../..//common/utils/analytics/components';
+export var InlineAnalytics = function InlineAnalytics(_ref) {
+  var screen = _ref.screen,
+    children = _ref.children;
+  return /*#__PURE__*/React.createElement(AnalyticsContext, {
+    data: {
+      source: screen,
+      component: 'inline-create'
+    }
+  }, /*#__PURE__*/React.createElement(ScreenViewedEvent, {
+    screen: screen
+  }), children);
+};