@atlaskit/editor-plugin-media-insert 9.0.1 → 9.2.0

package/CHANGELOG.md

@@ -1,5 +1,27 @@
 # @atlaskit/editor-plugin-media-insert
 
+## 9.2.0
+
+### Minor Changes
+
+- [`12a4ac6a0a8cd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/12a4ac6a0a8cd) -
+  [ux] this change moves smart value logic out of atlaskit
+
+### Patch Changes
+
+- Updated dependencies
+
+## 9.1.0
+
+### Minor Changes
+
+- [`4903edc4a60f8`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4903edc4a60f8) -
+  [ux] Adds a configuration for media insert to allow for smart value input
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 9.0.1
 
 ### Patch Changes

package/dist/cjs/mediaInsertPlugin.js

@@ -118,7 +118,9 @@ var mediaInsertPlugin = exports.mediaInsertPlugin = function mediaInsertPlugin(_
         insertMediaSingle: insertMediaSingle,
         insertExternalMediaSingle: insertExternalMediaSingle,
         insertFile: insertFile,
-        isOnlyExternalLinks: config === null || config === void 0 ? void 0 : config.isOnlyExternalLinks
+        isOnlyExternalLinks: config === null || config === void 0 ? void 0 : config.isOnlyExternalLinks,
+        customizedUrlValidation: config === null || config === void 0 ? void 0 : config.customizedUrlValidation,
+        customizedHelperMessage: config === null || config === void 0 ? void 0 : config.customizedHelperMessage
       });
     },
     pluginsOptions: {

package/dist/cjs/ui/MediaFromURL.js

@@ -13,7 +13,7 @@ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"))
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _adfSchema = require("@atlaskit/adf-schema");
 var _buttonGroup = _interopRequireDefault(require("@atlaskit/button/button-group"));
@@ -52,6 +52,12 @@ var INITIAL_PREVIEW_STATE = Object.freeze({
   warning: null,
   previewInfo: null
 });
+var isValidInput = function isValidInput(value, customizedUrlValidation) {
+  if (customizedUrlValidation) {
+    return customizedUrlValidation(value);
+  }
+  return isValidUrl(value);
+};
 var MAX_URL_LENGTH = 2048;
 var isValidUrl = exports.isValidUrl = function isValidUrl(value) {
   try {
@@ -97,7 +103,9 @@ function MediaFromURL(_ref) {
     closeMediaInsertPicker = _ref.closeMediaInsertPicker,
     insertMediaSingle = _ref.insertMediaSingle,
     insertExternalMediaSingle = _ref.insertExternalMediaSingle,
-    isOnlyExternalLinks = _ref.isOnlyExternalLinks;
+    isOnlyExternalLinks = _ref.isOnlyExternalLinks,
+    customizedUrlValidation = _ref.customizedUrlValidation,
+    customizedHelperMessage = _ref.customizedHelperMessage;
   var intl = (0, _reactIntlNext.useIntl)();
   var strings = {
     loadPreview: intl.formatMessage(_messages.mediaInsertMessages.loadPreview),
@@ -114,8 +122,8 @@ function MediaFromURL(_ref) {
     dispatch = _React$useReducer2[1];
   var _React$useState = _react.default.useState(''),
     _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-    url = _React$useState2[0],
-    setUrl = _React$useState2[1];
+    input = _React$useState2[0],
+    setInput = _React$useState2[1];
   var pasteFlag = _react.default.useRef(false);
   var _useAnalyticsEvents = (0, _useAnalyticsEvents2.useAnalyticsEvents)(dispatchAnalyticsEvent),
     onUploadButtonClickedAnalytics = _useAnalyticsEvents.onUploadButtonClickedAnalytics,
@@ -205,8 +213,8 @@ function MediaFromURL(_ref) {
     dispatch({
       type: 'reset'
     });
-    setUrl(url);
-    if (!isValidUrl(url)) {
+    setInput(url);
+    if (!isValidInput(url, customizedUrlValidation)) {
       return;
     }
     if (pasteFlag.current) {
@@ -215,7 +223,7 @@ function MediaFromURL(_ref) {
         uploadExternalMedia(url);
       }
     }
-  }, [uploadExternalMedia, isOnlyExternalLinks]);
+  }, [uploadExternalMedia, isOnlyExternalLinks, customizedUrlValidation]);
   var _onPaste = _react.default.useCallback(function (e, inputUrl) {
     // Note: this is a little weird, but the paste event will always be
     // fired before the change event when pasting. We don't really want to
@@ -308,7 +316,7 @@ function MediaFromURL(_ref) {
         isRequired: true,
         name: "inputUrl",
         validate: function validate(value) {
-          return value && isValidUrl(value) ? undefined : strings.invalidUrl;
+          return value && isValidInput(value, customizedUrlValidation) ? undefined : strings.invalidUrl;
         }
       }, function (_ref5) {
         var _ref5$fieldProps = _ref5.fieldProps,
@@ -341,7 +349,7 @@ function MediaFromURL(_ref) {
               formProps.onSubmit();
             }
           }
-        })), /*#__PURE__*/_react.default.createElement(_form.MessageWrapper, null, error && /*#__PURE__*/_react.default.createElement(_form.ErrorMessage, null, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+        })), customizedHelperMessage && /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_form.HelperMessage, null, customizedHelperMessage)), /*#__PURE__*/_react.default.createElement(_form.MessageWrapper, null, error && /*#__PURE__*/_react.default.createElement(_form.ErrorMessage, null, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
           as: "span"
         }, error)))), !previewState.previewInfo && !previewState.error && !previewState.warning && !isOnlyExternalLinks && /*#__PURE__*/_react.default.createElement(_primitives.Flex, {
           xcss: PreviewBoxStyles,
@@ -377,9 +385,9 @@ function MediaFromURL(_ref) {
         appearance: "subtle",
         onClick: onCancel
       }, strings.cancel), /*#__PURE__*/_react.default.createElement(_new.default, {
-        type: "button",
+        type: "submit",
         appearance: "primary",
-        isDisabled: isOnlyExternalLinks ? !url || !isValidUrl(url) : !previewState.previewInfo && !previewState.warning,
+        isDisabled: isOnlyExternalLinks ? !input || !isValidInput(input, customizedUrlValidation) : !previewState.previewInfo && !previewState.warning,
         onClick: function onClick() {
           return formProps.onSubmit();
         }

package/dist/cjs/ui/MediaFromURLWithForm.js

@@ -13,7 +13,7 @@ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"))
 var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _adfSchema = require("@atlaskit/adf-schema");
 var _buttonGroup = _interopRequireDefault(require("@atlaskit/button/button-group"));
@@ -53,6 +53,12 @@ var INITIAL_PREVIEW_STATE = Object.freeze({
   previewInfo: null
 });
 var MAX_URL_LENGTH = 2048;
+var isValidInput = function isValidInput(value, customizedUrlValidation) {
+  if (customizedUrlValidation) {
+    return customizedUrlValidation(value);
+  }
+  return isValidUrl(value);
+};
 var isValidUrl = exports.isValidUrl = function isValidUrl(value) {
   try {
     // Check for spaces and length first to avoid the expensive URL parsing
@@ -97,7 +103,9 @@ function MediaFromURLWithForm(_ref) {
     closeMediaInsertPicker = _ref.closeMediaInsertPicker,
     insertMediaSingle = _ref.insertMediaSingle,
     insertExternalMediaSingle = _ref.insertExternalMediaSingle,
-    isOnlyExternalLinks = _ref.isOnlyExternalLinks;
+    isOnlyExternalLinks = _ref.isOnlyExternalLinks,
+    customizedUrlValidation = _ref.customizedUrlValidation,
+    customizedHelperMessage = _ref.customizedHelperMessage;
   var intl = (0, _reactIntlNext.useIntl)();
   var strings = {
     loadPreview: intl.formatMessage(_messages.mediaInsertMessages.loadPreview),
@@ -114,8 +122,8 @@ function MediaFromURLWithForm(_ref) {
     dispatch = _React$useReducer2[1];
   var _React$useState = _react.default.useState(''),
     _React$useState2 = (0, _slicedToArray2.default)(_React$useState, 2),
-    url = _React$useState2[0],
-    setUrl = _React$useState2[1];
+    input = _React$useState2[0],
+    setInput = _React$useState2[1];
   var pasteFlag = _react.default.useRef(false);
   var _useAnalyticsEvents = (0, _useAnalyticsEvents2.useAnalyticsEvents)(dispatchAnalyticsEvent),
     onUploadButtonClickedAnalytics = _useAnalyticsEvents.onUploadButtonClickedAnalytics,
@@ -205,8 +213,8 @@ function MediaFromURLWithForm(_ref) {
     dispatch({
       type: 'reset'
     });
-    setUrl(url);
-    if (!isValidUrl(url)) {
+    setInput(url);
+    if (!isValidInput(url, customizedUrlValidation)) {
       return;
     }
     if (pasteFlag.current) {
@@ -215,7 +223,7 @@ function MediaFromURLWithForm(_ref) {
         uploadExternalMedia(url);
       }
     }
-  }, [uploadExternalMedia, isOnlyExternalLinks]);
+  }, [uploadExternalMedia, isOnlyExternalLinks, customizedUrlValidation]);
   var _onPaste = _react.default.useCallback(function (e, inputUrl) {
     // Note: this is a little weird, but the paste event will always be
     // fired before the change event when pasting. We don't really want to
@@ -310,7 +318,7 @@ function MediaFromURLWithForm(_ref) {
         isRequired: true,
         name: "inputUrl",
         validate: function validate(value) {
-          return value && isValidUrl(value) ? undefined : strings.invalidUrl;
+          return value && isValidInput(value, customizedUrlValidation) ? undefined : strings.invalidUrl;
         }
       }, function (_ref5) {
         var _ref5$fieldProps = _ref5.fieldProps,
@@ -337,7 +345,7 @@ function MediaFromURLWithForm(_ref) {
             onURLChange(value);
             _onChange(value);
           }
-        })), /*#__PURE__*/_react.default.createElement(_form.MessageWrapper, null, error && /*#__PURE__*/_react.default.createElement(_form.ErrorMessage, null, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
+        })), customizedHelperMessage && /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_form.HelperMessage, null, customizedHelperMessage)), /*#__PURE__*/_react.default.createElement(_form.MessageWrapper, null, error && /*#__PURE__*/_react.default.createElement(_form.ErrorMessage, null, /*#__PURE__*/_react.default.createElement(_primitives.Box, {
           as: "span"
         }, error)))), !previewState.previewInfo && !previewState.error && !previewState.warning && !isOnlyExternalLinks && /*#__PURE__*/_react.default.createElement(_primitives.Flex, {
           xcss: PreviewBoxStyles,
@@ -372,7 +380,7 @@ function MediaFromURLWithForm(_ref) {
       }, strings.cancel), /*#__PURE__*/_react.default.createElement(_new.default, {
         type: "submit",
         appearance: "primary",
-        isDisabled: isOnlyExternalLinks ? !url || !isValidUrl(url) : !previewState.previewInfo && !previewState.warning
+        isDisabled: isOnlyExternalLinks ? !input || !isValidInput(input, customizedUrlValidation) : !previewState.previewInfo && !previewState.warning
       }, strings.insert)))))
     );
   });

package/dist/cjs/ui/MediaInsertPicker.js

@@ -75,7 +75,9 @@ var MediaInsertPicker = exports.MediaInsertPicker = function MediaInsertPicker(_
     insertExternalMediaSingle = _ref2.insertExternalMediaSingle,
     insertFile = _ref2.insertFile,
     _ref2$isOnlyExternalL = _ref2.isOnlyExternalLinks,
-    isOnlyExternalLinks = _ref2$isOnlyExternalL === void 0 ? false : _ref2$isOnlyExternalL;
+    isOnlyExternalLinks = _ref2$isOnlyExternalL === void 0 ? false : _ref2$isOnlyExternalL,
+    customizedUrlValidation = _ref2.customizedUrlValidation,
+    customizedHelperMessage = _ref2.customizedHelperMessage;
   var _useSharedState = useSharedState(api),
     mediaProvider = _useSharedState.mediaProvider,
     isOpen = _useSharedState.isOpen,
@@ -160,7 +162,9 @@ var MediaInsertPicker = exports.MediaInsertPicker = function MediaInsertPicker(_
       },
       insertMediaSingle: insertMediaSingle,
       insertExternalMediaSingle: insertExternalMediaSingle,
-      isOnlyExternalLinks: isOnlyExternalLinks
+      isOnlyExternalLinks: isOnlyExternalLinks,
+      customizedUrlValidation: customizedUrlValidation,
+      customizedHelperMessage: customizedHelperMessage
     }) : /*#__PURE__*/_react.default.createElement(_MediaFromURLWithForm.MediaFromURLWithForm, {
       mediaProvider: mediaProvider,
       dispatchAnalyticsEvent: dispatchAnalyticsEvent,
@@ -170,7 +174,9 @@ var MediaInsertPicker = exports.MediaInsertPicker = function MediaInsertPicker(_
       },
       insertMediaSingle: insertMediaSingle,
       insertExternalMediaSingle: insertExternalMediaSingle,
-      isOnlyExternalLinks: isOnlyExternalLinks
+      isOnlyExternalLinks: isOnlyExternalLinks,
+      customizedUrlValidation: customizedUrlValidation,
+      customizedHelperMessage: customizedHelperMessage
     }))));
   }));
 };

package/dist/es2019/mediaInsertPlugin.js

@@ -112,7 +112,9 @@ export const mediaInsertPlugin = ({
         insertMediaSingle: insertMediaSingle,
         insertExternalMediaSingle: insertExternalMediaSingle,
         insertFile: insertFile,
-        isOnlyExternalLinks: config === null || config === void 0 ? void 0 : config.isOnlyExternalLinks
+        isOnlyExternalLinks: config === null || config === void 0 ? void 0 : config.isOnlyExternalLinks,
+        customizedUrlValidation: config === null || config === void 0 ? void 0 : config.customizedUrlValidation,
+        customizedHelperMessage: config === null || config === void 0 ? void 0 : config.customizedHelperMessage
       });
     },
     pluginsOptions: {

package/dist/es2019/ui/MediaFromURL.js

@@ -1,12 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
+import React, { Fragment } from 'react';
 import { useIntl } from 'react-intl-next';
 import { isSafeUrl } from '@atlaskit/adf-schema';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/new';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { mediaInsertMessages } from '@atlaskit/editor-common/messages';
-import Form, { ErrorMessage, Field, FormFooter, MessageWrapper } from '@atlaskit/form';
+import Form, { ErrorMessage, Field, FormFooter, HelperMessage, MessageWrapper } from '@atlaskit/form';
 import ExpandIcon from '@atlaskit/icon/core/grow-diagonal';
 import { default as EditorFilePreviewIconLegacy } from '@atlaskit/icon/glyph/editor/file-preview';
 import { getMediaClient } from '@atlaskit/media-client-react';
@@ -35,6 +35,12 @@ const INITIAL_PREVIEW_STATE = Object.freeze({
   warning: null,
   previewInfo: null
 });
+const isValidInput = (value, customizedUrlValidation) => {
+  if (customizedUrlValidation) {
+    return customizedUrlValidation(value);
+  }
+  return isValidUrl(value);
+};
 const MAX_URL_LENGTH = 2048;
 export const isValidUrl = value => {
   try {
@@ -84,7 +90,9 @@ export function MediaFromURL({
   closeMediaInsertPicker,
   insertMediaSingle,
   insertExternalMediaSingle,
-  isOnlyExternalLinks
+  isOnlyExternalLinks,
+  customizedUrlValidation,
+  customizedHelperMessage
 }) {
   const intl = useIntl();
   const strings = {
@@ -97,7 +105,7 @@ export function MediaFromURL({
     invalidUrl: intl.formatMessage(mediaInsertMessages.invalidUrlErrorMessage)
   };
   const [previewState, dispatch] = React.useReducer(previewStateReducer, INITIAL_PREVIEW_STATE);
-  const [url, setUrl] = React.useState('');
+  const [input, setInput] = React.useState('');
   const pasteFlag = React.useRef(false);
   const {
     onUploadButtonClickedAnalytics,
@@ -169,8 +177,8 @@ export function MediaFromURL({
     dispatch({
       type: 'reset'
     });
-    setUrl(url);
-    if (!isValidUrl(url)) {
+    setInput(url);
+    if (!isValidInput(url, customizedUrlValidation)) {
       return;
     }
     if (pasteFlag.current) {
@@ -179,7 +187,7 @@ export function MediaFromURL({
         uploadExternalMedia(url);
       }
     }
-  }, [uploadExternalMedia, isOnlyExternalLinks]);
+  }, [uploadExternalMedia, isOnlyExternalLinks, customizedUrlValidation]);
   const onPaste = React.useCallback((e, inputUrl) => {
     // Note: this is a little weird, but the paste event will always be
     // fired before the change event when pasting. We don't really want to
@@ -272,7 +280,7 @@ export function MediaFromURL({
     "aria-required": true,
     isRequired: true,
     name: "inputUrl",
-    validate: value => value && isValidUrl(value) ? undefined : strings.invalidUrl
+    validate: value => value && isValidInput(value, customizedUrlValidation) ? undefined : strings.invalidUrl
   }, ({
     fieldProps: {
       value,
@@ -303,7 +311,7 @@ export function MediaFromURL({
         formProps.onSubmit();
       }
     }
-  })), /*#__PURE__*/React.createElement(MessageWrapper, null, error && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(Box, {
+  })), customizedHelperMessage && /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(HelperMessage, null, customizedHelperMessage)), /*#__PURE__*/React.createElement(MessageWrapper, null, error && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(Box, {
     as: "span"
   }, error)))), !previewState.previewInfo && !previewState.error && !previewState.warning && !isOnlyExternalLinks && /*#__PURE__*/React.createElement(Flex, {
     xcss: PreviewBoxStyles,
@@ -334,9 +342,9 @@ export function MediaFromURL({
     appearance: "subtle",
     onClick: onCancel
   }, strings.cancel), /*#__PURE__*/React.createElement(Button, {
-    type: "button",
+    type: "submit",
     appearance: "primary",
-    isDisabled: isOnlyExternalLinks ? !url || !isValidUrl(url) : !previewState.previewInfo && !previewState.warning,
+    isDisabled: isOnlyExternalLinks ? !input || !isValidInput(input, customizedUrlValidation) : !previewState.previewInfo && !previewState.warning,
     onClick: () => formProps.onSubmit()
   }, strings.insert))))));
 }

package/dist/es2019/ui/MediaFromURLWithForm.js

@@ -1,12 +1,12 @@
 import _extends from "@babel/runtime/helpers/extends";
-import React from 'react';
+import React, { Fragment } from 'react';
 import { useIntl } from 'react-intl-next';
 import { isSafeUrl } from '@atlaskit/adf-schema';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/new';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { mediaInsertMessages } from '@atlaskit/editor-common/messages';
-import Form, { ErrorMessage, Field, FormFooter, MessageWrapper } from '@atlaskit/form';
+import Form, { ErrorMessage, Field, FormFooter, MessageWrapper, HelperMessage } from '@atlaskit/form';
 import ExpandIcon from '@atlaskit/icon/core/grow-diagonal';
 import { default as EditorFilePreviewIconLegacy } from '@atlaskit/icon/glyph/editor/file-preview';
 import { getMediaClient } from '@atlaskit/media-client-react';
@@ -36,6 +36,12 @@ const INITIAL_PREVIEW_STATE = Object.freeze({
   previewInfo: null
 });
 const MAX_URL_LENGTH = 2048;
+const isValidInput = (value, customizedUrlValidation) => {
+  if (customizedUrlValidation) {
+    return customizedUrlValidation(value);
+  }
+  return isValidUrl(value);
+};
 export const isValidUrl = value => {
   try {
     // Check for spaces and length first to avoid the expensive URL parsing
@@ -84,7 +90,9 @@ export function MediaFromURLWithForm({
   closeMediaInsertPicker,
   insertMediaSingle,
   insertExternalMediaSingle,
-  isOnlyExternalLinks
+  isOnlyExternalLinks,
+  customizedUrlValidation,
+  customizedHelperMessage
 }) {
   const intl = useIntl();
   const strings = {
@@ -97,7 +105,7 @@ export function MediaFromURLWithForm({
     invalidUrl: intl.formatMessage(mediaInsertMessages.invalidUrlErrorMessage)
   };
   const [previewState, dispatch] = React.useReducer(previewStateReducer, INITIAL_PREVIEW_STATE);
-  const [url, setUrl] = React.useState('');
+  const [input, setInput] = React.useState('');
   const pasteFlag = React.useRef(false);
   const {
     onUploadButtonClickedAnalytics,
@@ -169,8 +177,8 @@ export function MediaFromURLWithForm({
     dispatch({
       type: 'reset'
     });
-    setUrl(url);
-    if (!isValidUrl(url)) {
+    setInput(url);
+    if (!isValidInput(url, customizedUrlValidation)) {
       return;
     }
     if (pasteFlag.current) {
@@ -179,7 +187,7 @@ export function MediaFromURLWithForm({
         uploadExternalMedia(url);
       }
     }
-  }, [uploadExternalMedia, isOnlyExternalLinks]);
+  }, [uploadExternalMedia, isOnlyExternalLinks, customizedUrlValidation]);
   const onPaste = React.useCallback((e, inputUrl) => {
     // Note: this is a little weird, but the paste event will always be
     // fired before the change event when pasting. We don't really want to
@@ -274,7 +282,7 @@ export function MediaFromURLWithForm({
     "aria-required": true,
     isRequired: true,
     name: "inputUrl",
-    validate: value => value && isValidUrl(value) ? undefined : strings.invalidUrl
+    validate: value => value && isValidInput(value, customizedUrlValidation) ? undefined : strings.invalidUrl
   }, ({
     fieldProps: {
       value,
@@ -299,7 +307,7 @@ export function MediaFromURLWithForm({
       onURLChange(value);
       onChange(value);
     }
-  })), /*#__PURE__*/React.createElement(MessageWrapper, null, error && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(Box, {
+  })), customizedHelperMessage && /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(HelperMessage, null, customizedHelperMessage)), /*#__PURE__*/React.createElement(MessageWrapper, null, error && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(Box, {
     as: "span"
   }, error)))), !previewState.previewInfo && !previewState.error && !previewState.warning && !isOnlyExternalLinks && /*#__PURE__*/React.createElement(Flex, {
     xcss: PreviewBoxStyles,
@@ -331,6 +339,6 @@ export function MediaFromURLWithForm({
   }, strings.cancel), /*#__PURE__*/React.createElement(Button, {
     type: "submit",
     appearance: "primary",
-    isDisabled: isOnlyExternalLinks ? !url || !isValidUrl(url) : !previewState.previewInfo && !previewState.warning
+    isDisabled: isOnlyExternalLinks ? !input || !isValidInput(input, customizedUrlValidation) : !previewState.previewInfo && !previewState.warning
   }, strings.insert))))));
 }

package/dist/es2019/ui/MediaInsertPicker.js

@@ -67,7 +67,9 @@ export const MediaInsertPicker = ({
   insertMediaSingle,
   insertExternalMediaSingle,
   insertFile,
-  isOnlyExternalLinks = false
+  isOnlyExternalLinks = false,
+  customizedUrlValidation,
+  customizedHelperMessage
 }) => {
   const {
     mediaProvider,
@@ -152,7 +154,9 @@ export const MediaInsertPicker = ({
     },
     insertMediaSingle: insertMediaSingle,
     insertExternalMediaSingle: insertExternalMediaSingle,
-    isOnlyExternalLinks: isOnlyExternalLinks
+    isOnlyExternalLinks: isOnlyExternalLinks,
+    customizedUrlValidation: customizedUrlValidation,
+    customizedHelperMessage: customizedHelperMessage
   }) : /*#__PURE__*/React.createElement(MediaFromURLWithForm, {
     mediaProvider: mediaProvider,
     dispatchAnalyticsEvent: dispatchAnalyticsEvent,
@@ -162,6 +166,8 @@ export const MediaInsertPicker = ({
     },
     insertMediaSingle: insertMediaSingle,
     insertExternalMediaSingle: insertExternalMediaSingle,
-    isOnlyExternalLinks: isOnlyExternalLinks
+    isOnlyExternalLinks: isOnlyExternalLinks,
+    customizedUrlValidation: customizedUrlValidation,
+    customizedHelperMessage: customizedHelperMessage
   }))))));
 };

package/dist/esm/mediaInsertPlugin.js

@@ -111,7 +111,9 @@ export var mediaInsertPlugin = function mediaInsertPlugin(_ref) {
         insertMediaSingle: insertMediaSingle,
         insertExternalMediaSingle: insertExternalMediaSingle,
         insertFile: insertFile,
-        isOnlyExternalLinks: config === null || config === void 0 ? void 0 : config.isOnlyExternalLinks
+        isOnlyExternalLinks: config === null || config === void 0 ? void 0 : config.isOnlyExternalLinks,
+        customizedUrlValidation: config === null || config === void 0 ? void 0 : config.customizedUrlValidation,
+        customizedHelperMessage: config === null || config === void 0 ? void 0 : config.customizedHelperMessage
       });
     },
     pluginsOptions: {

package/dist/esm/ui/MediaFromURL.js

@@ -7,14 +7,14 @@ var _excluded = ["value", "onChange"];
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-import React from 'react';
+import React, { Fragment } from 'react';
 import { useIntl } from 'react-intl-next';
 import { isSafeUrl } from '@atlaskit/adf-schema';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/new';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { mediaInsertMessages } from '@atlaskit/editor-common/messages';
-import Form, { ErrorMessage, Field, FormFooter, MessageWrapper } from '@atlaskit/form';
+import Form, { ErrorMessage, Field, FormFooter, HelperMessage, MessageWrapper } from '@atlaskit/form';
 import ExpandIcon from '@atlaskit/icon/core/grow-diagonal';
 import { default as EditorFilePreviewIconLegacy } from '@atlaskit/icon/glyph/editor/file-preview';
 import { getMediaClient } from '@atlaskit/media-client-react';
@@ -43,6 +43,12 @@ var INITIAL_PREVIEW_STATE = Object.freeze({
   warning: null,
   previewInfo: null
 });
+var isValidInput = function isValidInput(value, customizedUrlValidation) {
+  if (customizedUrlValidation) {
+    return customizedUrlValidation(value);
+  }
+  return isValidUrl(value);
+};
 var MAX_URL_LENGTH = 2048;
 export var isValidUrl = function isValidUrl(value) {
   try {
@@ -88,7 +94,9 @@ export function MediaFromURL(_ref) {
     closeMediaInsertPicker = _ref.closeMediaInsertPicker,
     insertMediaSingle = _ref.insertMediaSingle,
     insertExternalMediaSingle = _ref.insertExternalMediaSingle,
-    isOnlyExternalLinks = _ref.isOnlyExternalLinks;
+    isOnlyExternalLinks = _ref.isOnlyExternalLinks,
+    customizedUrlValidation = _ref.customizedUrlValidation,
+    customizedHelperMessage = _ref.customizedHelperMessage;
   var intl = useIntl();
   var strings = {
     loadPreview: intl.formatMessage(mediaInsertMessages.loadPreview),
@@ -105,8 +113,8 @@ export function MediaFromURL(_ref) {
     dispatch = _React$useReducer2[1];
   var _React$useState = React.useState(''),
     _React$useState2 = _slicedToArray(_React$useState, 2),
-    url = _React$useState2[0],
-    setUrl = _React$useState2[1];
+    input = _React$useState2[0],
+    setInput = _React$useState2[1];
   var pasteFlag = React.useRef(false);
   var _useAnalyticsEvents = useAnalyticsEvents(dispatchAnalyticsEvent),
     onUploadButtonClickedAnalytics = _useAnalyticsEvents.onUploadButtonClickedAnalytics,
@@ -196,8 +204,8 @@ export function MediaFromURL(_ref) {
     dispatch({
       type: 'reset'
     });
-    setUrl(url);
-    if (!isValidUrl(url)) {
+    setInput(url);
+    if (!isValidInput(url, customizedUrlValidation)) {
       return;
     }
     if (pasteFlag.current) {
@@ -206,7 +214,7 @@ export function MediaFromURL(_ref) {
         uploadExternalMedia(url);
       }
     }
-  }, [uploadExternalMedia, isOnlyExternalLinks]);
+  }, [uploadExternalMedia, isOnlyExternalLinks, customizedUrlValidation]);
   var _onPaste = React.useCallback(function (e, inputUrl) {
     // Note: this is a little weird, but the paste event will always be
     // fired before the change event when pasting. We don't really want to
@@ -299,7 +307,7 @@ export function MediaFromURL(_ref) {
         isRequired: true,
         name: "inputUrl",
         validate: function validate(value) {
-          return value && isValidUrl(value) ? undefined : strings.invalidUrl;
+          return value && isValidInput(value, customizedUrlValidation) ? undefined : strings.invalidUrl;
         }
       }, function (_ref5) {
         var _ref5$fieldProps = _ref5.fieldProps,
@@ -332,7 +340,7 @@ export function MediaFromURL(_ref) {
               formProps.onSubmit();
             }
           }
-        })), /*#__PURE__*/React.createElement(MessageWrapper, null, error && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(Box, {
+        })), customizedHelperMessage && /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(HelperMessage, null, customizedHelperMessage)), /*#__PURE__*/React.createElement(MessageWrapper, null, error && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(Box, {
           as: "span"
         }, error)))), !previewState.previewInfo && !previewState.error && !previewState.warning && !isOnlyExternalLinks && /*#__PURE__*/React.createElement(Flex, {
           xcss: PreviewBoxStyles,
@@ -368,9 +376,9 @@ export function MediaFromURL(_ref) {
         appearance: "subtle",
         onClick: onCancel
       }, strings.cancel), /*#__PURE__*/React.createElement(Button, {
-        type: "button",
+        type: "submit",
         appearance: "primary",
-        isDisabled: isOnlyExternalLinks ? !url || !isValidUrl(url) : !previewState.previewInfo && !previewState.warning,
+        isDisabled: isOnlyExternalLinks ? !input || !isValidInput(input, customizedUrlValidation) : !previewState.previewInfo && !previewState.warning,
         onClick: function onClick() {
           return formProps.onSubmit();
         }

package/dist/esm/ui/MediaFromURLWithForm.js

@@ -7,14 +7,14 @@ var _excluded = ["value", "onChange"];
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-import React from 'react';
+import React, { Fragment } from 'react';
 import { useIntl } from 'react-intl-next';
 import { isSafeUrl } from '@atlaskit/adf-schema';
 import ButtonGroup from '@atlaskit/button/button-group';
 import Button from '@atlaskit/button/new';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { mediaInsertMessages } from '@atlaskit/editor-common/messages';
-import Form, { ErrorMessage, Field, FormFooter, MessageWrapper } from '@atlaskit/form';
+import Form, { ErrorMessage, Field, FormFooter, MessageWrapper, HelperMessage } from '@atlaskit/form';
 import ExpandIcon from '@atlaskit/icon/core/grow-diagonal';
 import { default as EditorFilePreviewIconLegacy } from '@atlaskit/icon/glyph/editor/file-preview';
 import { getMediaClient } from '@atlaskit/media-client-react';
@@ -44,6 +44,12 @@ var INITIAL_PREVIEW_STATE = Object.freeze({
   previewInfo: null
 });
 var MAX_URL_LENGTH = 2048;
+var isValidInput = function isValidInput(value, customizedUrlValidation) {
+  if (customizedUrlValidation) {
+    return customizedUrlValidation(value);
+  }
+  return isValidUrl(value);
+};
 export var isValidUrl = function isValidUrl(value) {
   try {
     // Check for spaces and length first to avoid the expensive URL parsing
@@ -88,7 +94,9 @@ export function MediaFromURLWithForm(_ref) {
     closeMediaInsertPicker = _ref.closeMediaInsertPicker,
     insertMediaSingle = _ref.insertMediaSingle,
     insertExternalMediaSingle = _ref.insertExternalMediaSingle,
-    isOnlyExternalLinks = _ref.isOnlyExternalLinks;
+    isOnlyExternalLinks = _ref.isOnlyExternalLinks,
+    customizedUrlValidation = _ref.customizedUrlValidation,
+    customizedHelperMessage = _ref.customizedHelperMessage;
   var intl = useIntl();
   var strings = {
     loadPreview: intl.formatMessage(mediaInsertMessages.loadPreview),
@@ -105,8 +113,8 @@ export function MediaFromURLWithForm(_ref) {
     dispatch = _React$useReducer2[1];
   var _React$useState = React.useState(''),
     _React$useState2 = _slicedToArray(_React$useState, 2),
-    url = _React$useState2[0],
-    setUrl = _React$useState2[1];
+    input = _React$useState2[0],
+    setInput = _React$useState2[1];
   var pasteFlag = React.useRef(false);
   var _useAnalyticsEvents = useAnalyticsEvents(dispatchAnalyticsEvent),
     onUploadButtonClickedAnalytics = _useAnalyticsEvents.onUploadButtonClickedAnalytics,
@@ -196,8 +204,8 @@ export function MediaFromURLWithForm(_ref) {
     dispatch({
       type: 'reset'
     });
-    setUrl(url);
-    if (!isValidUrl(url)) {
+    setInput(url);
+    if (!isValidInput(url, customizedUrlValidation)) {
       return;
     }
     if (pasteFlag.current) {
@@ -206,7 +214,7 @@ export function MediaFromURLWithForm(_ref) {
         uploadExternalMedia(url);
       }
     }
-  }, [uploadExternalMedia, isOnlyExternalLinks]);
+  }, [uploadExternalMedia, isOnlyExternalLinks, customizedUrlValidation]);
   var _onPaste = React.useCallback(function (e, inputUrl) {
     // Note: this is a little weird, but the paste event will always be
     // fired before the change event when pasting. We don't really want to
@@ -301,7 +309,7 @@ export function MediaFromURLWithForm(_ref) {
         isRequired: true,
         name: "inputUrl",
         validate: function validate(value) {
-          return value && isValidUrl(value) ? undefined : strings.invalidUrl;
+          return value && isValidInput(value, customizedUrlValidation) ? undefined : strings.invalidUrl;
         }
       }, function (_ref5) {
         var _ref5$fieldProps = _ref5.fieldProps,
@@ -328,7 +336,7 @@ export function MediaFromURLWithForm(_ref) {
             onURLChange(value);
             _onChange(value);
           }
-        })), /*#__PURE__*/React.createElement(MessageWrapper, null, error && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(Box, {
+        })), customizedHelperMessage && /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(HelperMessage, null, customizedHelperMessage)), /*#__PURE__*/React.createElement(MessageWrapper, null, error && /*#__PURE__*/React.createElement(ErrorMessage, null, /*#__PURE__*/React.createElement(Box, {
           as: "span"
         }, error)))), !previewState.previewInfo && !previewState.error && !previewState.warning && !isOnlyExternalLinks && /*#__PURE__*/React.createElement(Flex, {
           xcss: PreviewBoxStyles,
@@ -363,7 +371,7 @@ export function MediaFromURLWithForm(_ref) {
       }, strings.cancel), /*#__PURE__*/React.createElement(Button, {
         type: "submit",
         appearance: "primary",
-        isDisabled: isOnlyExternalLinks ? !url || !isValidUrl(url) : !previewState.previewInfo && !previewState.warning
+        isDisabled: isOnlyExternalLinks ? !input || !isValidInput(input, customizedUrlValidation) : !previewState.previewInfo && !previewState.warning
       }, strings.insert)))))
     );
   });

package/dist/esm/ui/MediaInsertPicker.js

@@ -66,7 +66,9 @@ export var MediaInsertPicker = function MediaInsertPicker(_ref2) {
     insertExternalMediaSingle = _ref2.insertExternalMediaSingle,
     insertFile = _ref2.insertFile,
     _ref2$isOnlyExternalL = _ref2.isOnlyExternalLinks,
-    isOnlyExternalLinks = _ref2$isOnlyExternalL === void 0 ? false : _ref2$isOnlyExternalL;
+    isOnlyExternalLinks = _ref2$isOnlyExternalL === void 0 ? false : _ref2$isOnlyExternalL,
+    customizedUrlValidation = _ref2.customizedUrlValidation,
+    customizedHelperMessage = _ref2.customizedHelperMessage;
   var _useSharedState = useSharedState(api),
     mediaProvider = _useSharedState.mediaProvider,
     isOpen = _useSharedState.isOpen,
@@ -151,7 +153,9 @@ export var MediaInsertPicker = function MediaInsertPicker(_ref2) {
       },
       insertMediaSingle: insertMediaSingle,
       insertExternalMediaSingle: insertExternalMediaSingle,
-      isOnlyExternalLinks: isOnlyExternalLinks
+      isOnlyExternalLinks: isOnlyExternalLinks,
+      customizedUrlValidation: customizedUrlValidation,
+      customizedHelperMessage: customizedHelperMessage
     }) : /*#__PURE__*/React.createElement(MediaFromURLWithForm, {
       mediaProvider: mediaProvider,
       dispatchAnalyticsEvent: dispatchAnalyticsEvent,
@@ -161,7 +165,9 @@ export var MediaInsertPicker = function MediaInsertPicker(_ref2) {
       },
       insertMediaSingle: insertMediaSingle,
       insertExternalMediaSingle: insertExternalMediaSingle,
-      isOnlyExternalLinks: isOnlyExternalLinks
+      isOnlyExternalLinks: isOnlyExternalLinks,
+      customizedUrlValidation: customizedUrlValidation,
+      customizedHelperMessage: customizedHelperMessage
     }))));
   }));
 };

package/dist/types/mediaInsertPluginType.d.ts

@@ -2,6 +2,7 @@ import type { EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { MediaPlugin } from '@atlaskit/editor-plugin-media';
+import type { CustomizedHelperMessage } from './types';
 export type MediaInsertPluginState = {
     isOpen?: boolean;
     mountInfo?: {
@@ -50,6 +51,8 @@ export type MediaInsertPluginConfig = {
      * ```
      */
     isOnlyExternalLinks?: boolean;
+    customizedUrlValidation?: (input: string) => boolean;
+    customizedHelperMessage?: CustomizedHelperMessage;
 };
 export type MediaInsertPlugin = NextEditorPlugin<'mediaInsert', {
     dependencies: MediaInsertPluginDependencies;

package/dist/types/types/index.d.ts

@@ -7,6 +7,7 @@ export type InsertMediaSingle = (props: {
     mediaState: MediaState;
     inputMethod: InputMethodInsertMedia;
 }) => boolean;
+export type CustomizedHelperMessage = string;
 export type InsertExternalMediaSingle = (props: {
     url: string;
     alt: string;
@@ -25,4 +26,6 @@ export type MediaInsertPickerProps = Pick<UiComponentFactoryParams, 'editorView'
     insertExternalMediaSingle: InsertExternalMediaSingle;
     insertFile: InsertFile;
     isOnlyExternalLinks: MediaInsertPluginConfig['isOnlyExternalLinks'];
+    customizedUrlValidation?: MediaInsertPluginConfig['customizedUrlValidation'];
+    customizedHelperMessage?: MediaInsertPluginConfig['customizedHelperMessage'];
 };

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import type { MediaProvider } from '@atlaskit/editor-common/provider-factory';
-import { type InsertExternalMediaSingle, type InsertMediaSingle } from '../types';
+import { type CustomizedHelperMessage, type InsertExternalMediaSingle, type InsertMediaSingle } from '../types';
 export declare const isValidUrl: (value: string) => boolean;
 type Props = {
     mediaProvider: MediaProvider;
@@ -10,6 +10,8 @@ type Props = {
     insertMediaSingle: InsertMediaSingle;
     insertExternalMediaSingle: InsertExternalMediaSingle;
     isOnlyExternalLinks: boolean;
+    customizedUrlValidation?: (input: string) => boolean;
+    customizedHelperMessage?: CustomizedHelperMessage;
 };
-export declare function MediaFromURL({ mediaProvider, dispatchAnalyticsEvent, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, isOnlyExternalLinks, }: Props): React.JSX.Element;
+export declare function MediaFromURL({ mediaProvider, dispatchAnalyticsEvent, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, isOnlyExternalLinks, customizedUrlValidation, customizedHelperMessage, }: Props): React.JSX.Element;
 export {};

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import type { MediaProvider } from '@atlaskit/editor-common/provider-factory';
-import { type InsertExternalMediaSingle, type InsertMediaSingle } from '../types';
+import { type CustomizedHelperMessage, type InsertExternalMediaSingle, type InsertMediaSingle } from '../types';
 export declare const isValidUrl: (value: string) => boolean;
 type Props = {
     mediaProvider: MediaProvider;
@@ -10,6 +10,8 @@ type Props = {
     insertMediaSingle: InsertMediaSingle;
     insertExternalMediaSingle: InsertExternalMediaSingle;
     isOnlyExternalLinks: boolean;
+    customizedUrlValidation?: (input: string) => boolean;
+    customizedHelperMessage?: CustomizedHelperMessage;
 };
-export declare function MediaFromURLWithForm({ mediaProvider, dispatchAnalyticsEvent, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, isOnlyExternalLinks, }: Props): React.JSX.Element;
+export declare function MediaFromURLWithForm({ mediaProvider, dispatchAnalyticsEvent, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, isOnlyExternalLinks, customizedUrlValidation, customizedHelperMessage, }: Props): React.JSX.Element;
 export {};

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import { type MediaInsertPickerProps } from '../types';
-export declare const MediaInsertPicker: ({ api, editorView, dispatchAnalyticsEvent, popupsMountPoint, popupsBoundariesElement, popupsScrollableElement, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, insertFile, isOnlyExternalLinks, }: MediaInsertPickerProps) => React.JSX.Element | null;
+export declare const MediaInsertPicker: ({ api, editorView, dispatchAnalyticsEvent, popupsMountPoint, popupsBoundariesElement, popupsScrollableElement, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, insertFile, isOnlyExternalLinks, customizedUrlValidation, customizedHelperMessage, }: MediaInsertPickerProps) => React.JSX.Element | null;

package/dist/types-ts4.5/mediaInsertPluginType.d.ts

@@ -2,6 +2,7 @@ import type { EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
 import type { MediaPlugin } from '@atlaskit/editor-plugin-media';
+import type { CustomizedHelperMessage } from './types';
 export type MediaInsertPluginState = {
     isOpen?: boolean;
     mountInfo?: {
@@ -50,6 +51,8 @@ export type MediaInsertPluginConfig = {
      * ```
      */
     isOnlyExternalLinks?: boolean;
+    customizedUrlValidation?: (input: string) => boolean;
+    customizedHelperMessage?: CustomizedHelperMessage;
 };
 export type MediaInsertPlugin = NextEditorPlugin<'mediaInsert', {
     dependencies: MediaInsertPluginDependencies;

package/dist/types-ts4.5/types/index.d.ts

@@ -7,6 +7,7 @@ export type InsertMediaSingle = (props: {
     mediaState: MediaState;
     inputMethod: InputMethodInsertMedia;
 }) => boolean;
+export type CustomizedHelperMessage = string;
 export type InsertExternalMediaSingle = (props: {
     url: string;
     alt: string;
@@ -25,4 +26,6 @@ export type MediaInsertPickerProps = Pick<UiComponentFactoryParams, 'editorView'
     insertExternalMediaSingle: InsertExternalMediaSingle;
     insertFile: InsertFile;
     isOnlyExternalLinks: MediaInsertPluginConfig['isOnlyExternalLinks'];
+    customizedUrlValidation?: MediaInsertPluginConfig['customizedUrlValidation'];
+    customizedHelperMessage?: MediaInsertPluginConfig['customizedHelperMessage'];
 };

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import type { MediaProvider } from '@atlaskit/editor-common/provider-factory';
-import { type InsertExternalMediaSingle, type InsertMediaSingle } from '../types';
+import { type CustomizedHelperMessage, type InsertExternalMediaSingle, type InsertMediaSingle } from '../types';
 export declare const isValidUrl: (value: string) => boolean;
 type Props = {
     mediaProvider: MediaProvider;
@@ -10,6 +10,8 @@ type Props = {
     insertMediaSingle: InsertMediaSingle;
     insertExternalMediaSingle: InsertExternalMediaSingle;
     isOnlyExternalLinks: boolean;
+    customizedUrlValidation?: (input: string) => boolean;
+    customizedHelperMessage?: CustomizedHelperMessage;
 };
-export declare function MediaFromURL({ mediaProvider, dispatchAnalyticsEvent, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, isOnlyExternalLinks, }: Props): React.JSX.Element;
+export declare function MediaFromURL({ mediaProvider, dispatchAnalyticsEvent, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, isOnlyExternalLinks, customizedUrlValidation, customizedHelperMessage, }: Props): React.JSX.Element;
 export {};

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

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type DispatchAnalyticsEvent } from '@atlaskit/editor-common/analytics';
 import type { MediaProvider } from '@atlaskit/editor-common/provider-factory';
-import { type InsertExternalMediaSingle, type InsertMediaSingle } from '../types';
+import { type CustomizedHelperMessage, type InsertExternalMediaSingle, type InsertMediaSingle } from '../types';
 export declare const isValidUrl: (value: string) => boolean;
 type Props = {
     mediaProvider: MediaProvider;
@@ -10,6 +10,8 @@ type Props = {
     insertMediaSingle: InsertMediaSingle;
     insertExternalMediaSingle: InsertExternalMediaSingle;
     isOnlyExternalLinks: boolean;
+    customizedUrlValidation?: (input: string) => boolean;
+    customizedHelperMessage?: CustomizedHelperMessage;
 };
-export declare function MediaFromURLWithForm({ mediaProvider, dispatchAnalyticsEvent, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, isOnlyExternalLinks, }: Props): React.JSX.Element;
+export declare function MediaFromURLWithForm({ mediaProvider, dispatchAnalyticsEvent, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, isOnlyExternalLinks, customizedUrlValidation, customizedHelperMessage, }: Props): React.JSX.Element;
 export {};

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

@@ -1,3 +1,3 @@
 import React from 'react';
 import { type MediaInsertPickerProps } from '../types';
-export declare const MediaInsertPicker: ({ api, editorView, dispatchAnalyticsEvent, popupsMountPoint, popupsBoundariesElement, popupsScrollableElement, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, insertFile, isOnlyExternalLinks, }: MediaInsertPickerProps) => React.JSX.Element | null;
+export declare const MediaInsertPicker: ({ api, editorView, dispatchAnalyticsEvent, popupsMountPoint, popupsBoundariesElement, popupsScrollableElement, closeMediaInsertPicker, insertMediaSingle, insertExternalMediaSingle, insertFile, isOnlyExternalLinks, customizedUrlValidation, customizedHelperMessage, }: MediaInsertPickerProps) => React.JSX.Element | null;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-media-insert",
-	"version": "9.0.1",
+	"version": "9.2.0",
 	"description": "Media Insert plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -29,11 +29,11 @@
 		"@atlaskit/editor-plugin-analytics": "^3.0.0",
 		"@atlaskit/editor-plugin-media": "^5.2.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",
-		"@atlaskit/editor-shared-styles": "^3.5.0",
+		"@atlaskit/editor-shared-styles": "^3.6.0",
 		"@atlaskit/form": "^12.0.0",
-		"@atlaskit/icon": "^27.9.0",
-		"@atlaskit/media-card": "^79.4.0",
-		"@atlaskit/media-client": "^35.2.0",
+		"@atlaskit/icon": "^27.12.0",
+		"@atlaskit/media-card": "^79.5.0",
+		"@atlaskit/media-client": "^35.3.0",
 		"@atlaskit/media-client-react": "^4.1.0",
 		"@atlaskit/media-picker": "^70.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
@@ -41,19 +41,16 @@
 		"@atlaskit/section-message": "^8.5.0",
 		"@atlaskit/tabs": "^18.1.0",
 		"@atlaskit/textfield": "^8.0.0",
-		"@atlaskit/tmp-editor-statsig": "^9.22.0",
+		"@atlaskit/tmp-editor-statsig": "^9.28.0",
 		"@babel/runtime": "^7.0.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^107.16.0",
+		"@atlaskit/editor-common": "^107.23.0",
 		"@atlaskit/tokens": "^6.0.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0"
 	},
-	"devDependencies": {
-		"typescript": "~5.4.2"
-	},
 	"techstack": {
 		"@atlassian/frontend": {
 			"code-structure": [