@atlaskit/share 1.0.0 → 2.0.0

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @atlaskit/share
 
+## 2.0.0
+
+### Major Changes
+
+- [`559b300e04b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/559b300e04b) - - Lazy-load form content of Share package
+  - Stop export `ShareServiceClient` and `ShareClient` in `@atlaskit/share`. So you should use `@atlaskit/share/clients` instead.
+
+## 1.0.3
+
+### Patch Changes
+
+- [`6eb7be4e83d`](https://bitbucket.org/atlassian/atlassian-frontend/commits/6eb7be4e83d) - [ux] Implementing the product specific tab share titles for the experiment
+
+## 1.0.2
+
+### Patch Changes
+
+- [`1bc9346871a`](https://bitbucket.org/atlassian/atlassian-frontend/commits/1bc9346871a) - Updates to prop passing from share to integration. The share-to-slack form needs to make use of this onClose prop in the actual form
+
+## 1.0.1
+
+### Patch Changes
+
+- [`b8afeefa482`](https://bitbucket.org/atlassian/atlassian-frontend/commits/b8afeefa482) - Analytics update to tabs onChange event
+
 ## 1.0.0
 
 ### Major Changes

package/clients/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@atlaskit/share/clients",
+  "main": "../dist/cjs/clients/index.js",
+  "module": "../dist/esm/clients/index.js",
+  "module:es2019": "../dist/es2019/clients/index.js",
+  "types": "../dist/types/clients/index.d.ts"
+}

package/dist/cjs/clients/index.js

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

package/dist/cjs/components/CopyLinkButton.js

@@ -2,8 +2,6 @@
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
-var _typeof = require("@babel/runtime/helpers/typeof");
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -45,15 +43,13 @@ var _reactIntlNext = require("react-intl-next");
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 
-var _styles = _interopRequireWildcard(require("./styles"));
+var _styles = _interopRequireDefault(require("./styles"));
 
 var _i18n = require("../i18n");
 
-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); }
+var _styled = require("./ShareFormWrapper/styled");
 
-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 _templateObject, _templateObject2;
 
 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); }; }
 
@@ -177,7 +173,7 @@ var CopyLinkButton = /*#__PURE__*/function (_React$Component) {
       }), /*#__PURE__*/_react.default.createElement(_popup.default, {
         zIndex: Z_INDEX,
         content: function content() {
-          return /*#__PURE__*/_react.default.createElement(_styles.InlineDialogContentWrapper, null, /*#__PURE__*/_react.default.createElement(MessageContainer, null, /*#__PURE__*/_react.default.createElement(_checkCircle.default, {
+          return /*#__PURE__*/_react.default.createElement(_styled.InlineDialogContentWrapper, null, /*#__PURE__*/_react.default.createElement(MessageContainer, null, /*#__PURE__*/_react.default.createElement(_checkCircle.default, {
             label: formatMessage(_i18n.messages.copiedToClipboardIconLabel),
             primaryColor: _colors.G300
           }), /*#__PURE__*/_react.default.createElement(MessageSpan, null, /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _i18n.messages.copiedToClipboardMessage))));

package/dist/cjs/components/IntegrationForm.js

@@ -23,8 +23,11 @@ exports.FormWrapper = FormWrapper;
 
 var IntegrationForm = function IntegrationForm(_ref) {
   var Content = _ref.Content,
-      onIntegrationClose = _ref.onIntegrationClose;
-  return /*#__PURE__*/_react.default.createElement(FormWrapper, null, /*#__PURE__*/_react.default.createElement(Content, {
+      _ref$onIntegrationClo = _ref.onIntegrationClose,
+      onIntegrationClose = _ref$onIntegrationClo === void 0 ? function () {
+    return undefined;
+  } : _ref$onIntegrationClo;
+  return /*#__PURE__*/_react.default.createElement(FormWrapper, null, Content && /*#__PURE__*/_react.default.createElement(Content, {
     onClose: onIntegrationClose
   }));
 };

package/dist/cjs/components/LazyShareForm/LazyShareForm.js

@@ -0,0 +1,105 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _analyticsNext = require("@atlaskit/analytics-next");
+
+var _ShareForm = require("../ShareForm");
+
+var _analytics = require("../analytics");
+
+var _IntegrationForm = require("../IntegrationForm");
+
+var _styled = require("./styled");
+
+var _ShareFormWrapper = require("../ShareFormWrapper");
+
+/**
+ * A Share form content which is lazy-loaded.
+ * Make sure this component is not exported inside main entry points `src/index.ts`
+ */
+function LazyShareForm(props) {
+  var copyLink = props.copyLink,
+      config = props.config,
+      isFetchingConfig = props.isFetchingConfig,
+      loadOptions = props.loadOptions,
+      shareFormTitle = props.shareFormTitle,
+      shareFormHelperMessage = props.shareFormHelperMessage,
+      bottomMessage = props.bottomMessage,
+      submitButtonLabel = props.submitButtonLabel,
+      product = props.product,
+      customFooter = props.customFooter,
+      enableSmartUserPicker = props.enableSmartUserPicker,
+      loggedInAccountId = props.loggedInAccountId,
+      cloudId = props.cloudId,
+      shareFieldsFooter = props.shareFieldsFooter,
+      onUserSelectionChange = props.onUserSelectionChange,
+      isPublicLink = props.isPublicLink,
+      copyTooltipText = props.copyTooltipText,
+      shareIntegrations = props.shareIntegrations,
+      integrationMode = props.integrationMode,
+      onLinkCopy = props.onLinkCopy,
+      onDismiss = props.onDismiss,
+      onSubmit = props.onSubmit,
+      onDialogClose = props.onDialogClose,
+      selectPortalRef = props.selectPortalRef,
+      showIntegrationForm = props.showIntegrationForm,
+      selectedIntegration = props.selectedIntegration,
+      isSharing = props.isSharing,
+      shareError = props.shareError,
+      defaultValue = props.defaultValue,
+      showTitle = props.showTitle;
+
+  var footer = /*#__PURE__*/_react.default.createElement("div", null, bottomMessage ? /*#__PURE__*/_react.default.createElement(_styled.BottomMessageWrapper, null, bottomMessage) : null, customFooter && /*#__PURE__*/_react.default.createElement(_styled.CustomFooterWrapper, null, customFooter));
+
+  return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
+    data: {
+      source: _analytics.ANALYTICS_SOURCE
+    }
+  }, /*#__PURE__*/_react.default.createElement(_ShareFormWrapper.ShareFormWrapper, {
+    footer: footer // form title will be determined by `title` and `showTitle` prop passed to `ShareForm`,
+    // so we don't need to show title via ShareFormWrapper
+    ,
+    shouldShowTitle: false
+  }, showIntegrationForm && selectedIntegration !== null ? /*#__PURE__*/_react.default.createElement(_IntegrationForm.IntegrationForm, {
+    Content: selectedIntegration.Content,
+    onIntegrationClose: onDialogClose
+  }) : /*#__PURE__*/_react.default.createElement(_ShareForm.ShareForm, {
+    copyLink: copyLink,
+    loadOptions: loadOptions,
+    title: shareFormTitle,
+    showTitle: showTitle,
+    helperMessage: shareFormHelperMessage,
+    shareError: shareError,
+    defaultValue: defaultValue,
+    config: config,
+    submitButtonLabel: submitButtonLabel,
+    product: product,
+    enableSmartUserPicker: enableSmartUserPicker,
+    loggedInAccountId: loggedInAccountId,
+    cloudId: cloudId,
+    fieldsFooter: shareFieldsFooter,
+    selectPortalRef: selectPortalRef,
+    copyTooltipText: copyTooltipText,
+    integrationMode: integrationMode,
+    shareIntegrations: shareIntegrations,
+    isSharing: isSharing,
+    isFetchingConfig: isFetchingConfig,
+    isPublicLink: isPublicLink,
+    onSubmit: onSubmit,
+    onDismiss: onDismiss,
+    onLinkCopy: onLinkCopy,
+    onUserSelectionChange: onUserSelectionChange,
+    handleCloseDialog: onDialogClose
+  })));
+}
+
+var _default = LazyShareForm;
+exports.default = _default;

package/dist/cjs/components/LazyShareForm/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function get() {
+    return _LazyShareForm.default;
+  }
+});
+
+var _LazyShareForm = _interopRequireDefault(require("./LazyShareForm"));

package/dist/cjs/components/LazyShareForm/lazy.js

@@ -0,0 +1,53 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactLooselyLazy = require("react-loosely-lazy");
+
+var _spinner = _interopRequireDefault(require("@atlaskit/spinner"));
+
+var _styled = require("./styled");
+
+var _ShareFormWrapper = require("../ShareFormWrapper");
+
+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 || (0, _typeof2.default)(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 LazyShareFormLazy = (0, _reactLooselyLazy.lazyForPaint)(function () {
+  return Promise.resolve().then(function () {
+    return _interopRequireWildcard(require('./LazyShareForm'));
+  });
+}, {
+  ssr: false
+});
+
+var LoadingDialog = function LoadingDialog(_ref) {
+  var shareFormTitle = _ref.shareFormTitle,
+      showTitle = _ref.showTitle;
+  return /*#__PURE__*/_react.default.createElement(_ShareFormWrapper.ShareFormWrapper, {
+    shareFormTitle: shareFormTitle // if `showTitle` is passed, we use it. Otherwise, we will show title for loading dialog.
+    ,
+    shouldShowTitle: typeof showTitle === 'boolean' ? showTitle : true
+  }, /*#__PURE__*/_react.default.createElement(_styled.SpinnerWrapper, null, /*#__PURE__*/_react.default.createElement(_spinner.default, null)));
+};
+
+var _default = function _default(props) {
+  return /*#__PURE__*/_react.default.createElement(_reactLooselyLazy.LazySuspense, {
+    fallback: /*#__PURE__*/_react.default.createElement(LoadingDialog, {
+      shareFormTitle: props.shareFormTitle,
+      showTitle: props.showTitle
+    })
+  }, /*#__PURE__*/_react.default.createElement(LazyShareFormLazy, props));
+};
+
+exports.default = _default;

package/dist/cjs/components/LazyShareForm/styled.js

@@ -0,0 +1,28 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SpinnerWrapper = exports.CustomFooterWrapper = exports.BottomMessageWrapper = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _constants = require("@atlaskit/theme/constants");
+
+var _templateObject, _templateObject2, _templateObject3;
+
+var BottomMessageWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", "px;\n"])), (0, _constants.gridSize)() * 44);
+
+exports.BottomMessageWrapper = BottomMessageWrapper;
+
+var CustomFooterWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  /* Must match inline dialog padding. */\n  margin: 0 ", "px ", "px ", "px;\n"])), -(0, _constants.gridSize)() * 3, -(0, _constants.gridSize)() * 2, -(0, _constants.gridSize)() * 3);
+
+exports.CustomFooterWrapper = CustomFooterWrapper;
+
+var SpinnerWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  widht: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-content: center;\n"])));
+
+exports.SpinnerWrapper = SpinnerWrapper;

package/dist/cjs/components/ShareDialogWithTrigger.js

@@ -25,6 +25,8 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
+var _react = _interopRequireDefault(require("react"));
+
 var _analyticsNext = require("@atlaskit/analytics-next");
 
 var _SplitButton = _interopRequireDefault(require("./SplitButton"));
@@ -39,8 +41,6 @@ var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 
 var _constants = require("@atlaskit/theme/constants");
 
-var _react = _interopRequireDefault(require("react"));
-
 var _reactIntlNext = require("react-intl-next");
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
@@ -53,15 +53,11 @@ var _analytics = require("./analytics");
 
 var _ShareButton = _interopRequireDefault(require("./ShareButton"));
 
-var _ShareForm = require("./ShareForm");
-
 var _utils = require("./utils");
 
-var _styles = require("./styles");
-
-var _IntegrationForm = require("./IntegrationForm");
+var _lazy = _interopRequireDefault(require("./LazyShareForm/lazy"));
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4;
+var _templateObject;
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
@@ -73,12 +69,6 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
 
 var ShareButtonWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-flex;\n  outline: none;\n"])));
 
-var InlineDialogFormWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  width: 352px;\n"])));
-
-var BottomMessageWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  width: 352px;\n"])));
-
-var CustomFooterWrapper = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  /* Must match inline dialog padding. */\n  margin: 0 ", "px ", "px ", "px;\n"])), -(0, _constants.gridSize)() * 3, -(0, _constants.gridSize)() * 2, -(0, _constants.gridSize)() * 3);
-
 var defaultShareContentState = {
   users: [],
   comment: {
@@ -150,6 +140,15 @@ var ShareDialogWithTriggerInternal = /*#__PURE__*/function (_React$PureComponent
         createAnalyticsEvent(payload).fire(_analytics.CHANNEL_ID);
       }
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "onTabChange", function (index) {
+      var subjectId = 'shareTab';
+
+      if (index === 1) {
+        subjectId = 'shareToSlackTab';
+      }
+
+      _this.createAndFireEvent((0, _analytics.shareTabClicked)(subjectId));
+    });
     (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "getFlags", function () {
       var formatMessage = _this.props.intl.formatMessage; // The reason for providing message property is that in jira,
       // the Flag system takes only Message Descriptor as payload
@@ -457,49 +456,49 @@ var ShareDialogWithTriggerInternal = /*#__PURE__*/function (_React$PureComponent
         style: style
       }, /*#__PURE__*/_react.default.createElement(_popup.default, {
         content: function content() {
-          return /*#__PURE__*/_react.default.createElement(_analyticsNext.AnalyticsContext, {
-            data: {
-              source: _analytics.ANALYTICS_SOURCE
-            }
-          }, /*#__PURE__*/_react.default.createElement(_styles.InlineDialogContentWrapper, {
-            innerRef: _this2.containerRef
-          }, showIntegrationForm && selectedIntegration !== null ? /*#__PURE__*/_react.default.createElement(InlineDialogFormWrapper, null, /*#__PURE__*/_react.default.createElement(_IntegrationForm.IntegrationForm, {
-            Content: selectedIntegration.Content,
-            onIntegrationClose: _this2.handleCloseDialog
-          })) : /*#__PURE__*/_react.default.createElement(InlineDialogFormWrapper, null, /*#__PURE__*/_react.default.createElement(_ShareForm.ShareForm, {
+          return /*#__PURE__*/_react.default.createElement("div", {
+            ref: _this2.containerRef
+          }, /*#__PURE__*/_react.default.createElement(_lazy.default, {
+            Content: selectedIntegration && selectedIntegration.Content,
+            selectedIntegration: selectedIntegration,
             copyLink: copyLink,
+            showIntegrationForm: showIntegrationForm,
+            bottomMessage: bottomMessage,
+            customFooter: customFooter,
             loadOptions: loadUserOptions,
             isSharing: isSharing,
-            onSubmit: _this2.handleShareSubmit,
-            title: shareFormTitle,
+            shareFormTitle: shareFormTitle,
             showTitle: integrationMode !== 'tabs' || !shareIntegrations || !shareIntegrations.length,
-            helperMessage: shareFormHelperMessage,
+            shareFormHelperMessage: shareFormHelperMessage,
             shareError: shareError,
-            onDismiss: _this2.handleFormDismiss,
             defaultValue: defaultValue,
             config: config,
             isFetchingConfig: isFetchingConfig,
-            onLinkCopy: _this2.handleCopyLink,
             submitButtonLabel: submitButtonLabel,
             product: product,
             enableSmartUserPicker: enableSmartUserPicker,
             loggedInAccountId: loggedInAccountId,
             cloudId: cloudId,
             onUserSelectionChange: onUserSelectionChange,
-            fieldsFooter: shareFieldsFooter,
-            selectPortalRef: _this2.selectPortalRef,
+            shareFieldsFooter: shareFieldsFooter,
             isPublicLink: isPublicLink,
             copyTooltipText: copyTooltipText,
             integrationMode: integrationMode,
-            shareIntegrations: shareIntegrations
-          })), bottomMessage ? /*#__PURE__*/_react.default.createElement(BottomMessageWrapper, null, bottomMessage) : null, customFooter && /*#__PURE__*/_react.default.createElement(CustomFooterWrapper, null, customFooter)));
+            shareIntegrations: shareIntegrations // actions
+            ,
+            onLinkCopy: _this2.handleCopyLink,
+            onSubmit: _this2.handleShareSubmit,
+            onDismiss: _this2.handleFormDismiss,
+            onDialogClose: _this2.handleCloseDialog,
+            onTabChange: _this2.onTabChange //ref
+            ,
+            selectPortalRef: _this2.selectPortalRef
+          }));
         },
         isOpen: isDialogOpen,
         onClose: this.handleCloseDialog,
         placement: dialogPlacement,
-        trigger: function trigger(triggerProps) {
-          return _this2.renderShareTriggerButton(triggerProps);
-        },
+        trigger: this.renderShareTriggerButton,
         zIndex: dialogZIndex
       }), /*#__PURE__*/_react.default.createElement(_portal.default, {
         zIndex: (0, _utils.generateSelectZIndex)(dialogZIndex)

package/dist/cjs/components/ShareForm.js

@@ -27,6 +27,8 @@ var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends")
 
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
+var _react = _interopRequireDefault(require("react"));
+
 var _customThemeButton = _interopRequireDefault(require("@atlaskit/button/custom-theme-button"));
 
 var _form = _interopRequireDefault(require("@atlaskit/form"));
@@ -41,8 +43,6 @@ var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
 
 var _tabs = _interopRequireWildcard(require("@atlaskit/tabs"));
 
-var _react = _interopRequireDefault(require("react"));
-
 var _reactIntlNext = require("react-intl-next");
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
@@ -65,6 +65,10 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 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(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 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; } }
@@ -145,7 +149,7 @@ var InternalForm = /*#__PURE__*/function (_React$PureComponent) {
         defaultValue: defaultValue && defaultValue.users,
         config: config,
         isLoading: isFetchingConfig,
-        product: product,
+        product: product || 'confluence',
         enableSmartUserPicker: enableSmartUserPicker,
         loggedInAccountId: loggedInAccountId,
         cloudId: cloudId,
@@ -188,15 +192,31 @@ var InternalForm = /*#__PURE__*/function (_React$PureComponent) {
         isDisabled: isDisabled
       }, /*#__PURE__*/_react.default.createElement(ButtonLabelWrapper, null, submitButtonLabel || /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, buttonLabel))));
     });
+    (0, _defineProperty2.default)((0, _assertThisInitialized2.default)(_this), "renderMainTabTitle", function () {
+      var _this$props3 = _this.props,
+          title = _this$props3.title,
+          product = _this$props3.product;
+
+      if (title) {
+        return title;
+      }
+
+      if (!product) {
+        return /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _i18n.messages.formTitle);
+      }
+
+      var productShareType = product === 'jira' ? _objectSpread({}, _i18n.messages.shareMainTabTextJira) : _objectSpread({}, _i18n.messages.shareMainTabTextConfluence);
+      return /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, productShareType);
+    });
     return _this;
   }
 
   (0, _createClass2.default)(InternalForm, [{
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
-      var _this$props3 = this.props,
-          onDismiss = _this$props3.onDismiss,
-          getValues = _this$props3.getValues;
+      var _this$props4 = this.props,
+          onDismiss = _this$props4.onDismiss,
+          getValues = _this$props4.getValues;
 
       if (onDismiss) {
         onDismiss(getValues());
@@ -205,11 +225,12 @@ var InternalForm = /*#__PURE__*/function (_React$PureComponent) {
   }, {
     key: "render",
     value: function render() {
-      var _this$props4 = this.props,
-          title = _this$props4.title,
-          _this$props4$integrat = _this$props4.integrationMode,
-          integrationMode = _this$props4$integrat === void 0 ? 'off' : _this$props4$integrat,
-          shareIntegrations = _this$props4.shareIntegrations;
+      var _this$props5 = this.props,
+          _this$props5$integrat = _this$props5.integrationMode,
+          integrationMode = _this$props5$integrat === void 0 ? 'off' : _this$props5$integrat,
+          shareIntegrations = _this$props5.shareIntegrations,
+          onTabChange = _this$props5.onTabChange,
+          handleCloseDialog = _this$props5.handleCloseDialog;
 
       if (integrationMode === 'off' || !shareIntegrations || !shareIntegrations.length) {
         return this.renderShareForm();
@@ -219,10 +240,13 @@ var InternalForm = /*#__PURE__*/function (_React$PureComponent) {
 
       if (integrationMode === 'tabs') {
         return /*#__PURE__*/_react.default.createElement(_tabs.default, {
-          id: "ShareForm-Tabs-Integrations"
+          id: "ShareForm-Tabs-Integrations",
+          onChange: function onChange(index) {
+            onTabChange === null || onTabChange === void 0 ? void 0 : onTabChange(index);
+          }
         }, /*#__PURE__*/_react.default.createElement(_tabs.TabList, null, /*#__PURE__*/_react.default.createElement(_tabs.Tab, {
           key: "share-tab-default"
-        }, title || /*#__PURE__*/_react.default.createElement(_reactIntlNext.FormattedMessage, _i18n.messages.formTitle)), /*#__PURE__*/_react.default.createElement(_tabs.Tab, {
+        }, this.renderMainTabTitle()), /*#__PURE__*/_react.default.createElement(_tabs.Tab, {
           key: "share-tab-".concat(firstIntegration.type)
         }, /*#__PURE__*/_react.default.createElement(IntegrationWrapper, null, /*#__PURE__*/_react.default.createElement(IntegrationIconWrapper, null, /*#__PURE__*/_react.default.createElement(firstIntegration.Icon, null)), integrationTabText(firstIntegration.type)))), /*#__PURE__*/_react.default.createElement(_tabs.TabPanel, {
           key: "share-tabPanel-default"
@@ -235,7 +259,7 @@ var InternalForm = /*#__PURE__*/function (_React$PureComponent) {
         }, /*#__PURE__*/_react.default.createElement(_IntegrationForm.IntegrationForm, {
           Content: firstIntegration.Content,
           onIntegrationClose: function onIntegrationClose() {
-            return null;
+            return handleCloseDialog === null || handleCloseDialog === void 0 ? void 0 : handleCloseDialog();
           }
         }))));
       }

package/dist/cjs/components/ShareFormWrapper/ShareFormWrapper.js

@@ -0,0 +1,29 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _styled = require("./styled");
+
+var _ShareHeader = require("../ShareHeader");
+
+var ShareFormWrapper = function ShareFormWrapper(_ref) {
+  var shareFormTitle = _ref.shareFormTitle,
+      shouldShowTitle = _ref.shouldShowTitle,
+      _ref$children = _ref.children,
+      children = _ref$children === void 0 ? null : _ref$children,
+      _ref$footer = _ref.footer,
+      footer = _ref$footer === void 0 ? null : _ref$footer;
+  return /*#__PURE__*/_react.default.createElement(_styled.InlineDialogContentWrapper, null, /*#__PURE__*/_react.default.createElement(_styled.InlineDialogFormWrapper, null, shouldShowTitle && /*#__PURE__*/_react.default.createElement(_ShareHeader.ShareHeader, {
+    title: shareFormTitle
+  }), children), footer);
+};
+
+var _default = ShareFormWrapper;
+exports.default = _default;

package/dist/cjs/components/ShareFormWrapper/index.js

@@ -0,0 +1,15 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "ShareFormWrapper", {
+  enumerable: true,
+  get: function get() {
+    return _ShareFormWrapper.default;
+  }
+});
+
+var _ShareFormWrapper = _interopRequireDefault(require("./ShareFormWrapper"));

package/dist/cjs/components/ShareFormWrapper/styled.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.InlineDialogFormWrapper = exports.InlineDialogContentWrapper = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _styledComponents = _interopRequireDefault(require("styled-components"));
+
+var _constants = require("@atlaskit/theme/constants");
+
+var _templateObject, _templateObject2;
+
+var InlineDialogFormWrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", "px;\n"])), (0, _constants.gridSize)() * 44);
+/**
+ * Apply the same styling, as previous @atlaskit/inline-dialog had,
+ * compared to the @atlaskit/popup we are now using.
+ *
+ * packages/design-system/inline-dialog/src/InlineDialog/styled.ts:20:3
+ */
+
+
+exports.InlineDialogFormWrapper = InlineDialogFormWrapper;
+
+var InlineDialogContentWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  padding: ", "px ", "px;\n"])), (0, _constants.gridSize)() * 2, (0, _constants.gridSize)() * 3);
+
+exports.InlineDialogContentWrapper = InlineDialogContentWrapper;