@atlaskit/editor-extension-dropbox 19.0.2 → 19.1.0

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 # @atlaskit/editor-extension-dropbox
 
+## 19.1.0
+
+### Minor Changes
+
+- [`a034f535638cc`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/a034f535638cc) -
+  Add structured Quick Insert previews with localised title, description and attribution under
+  platform_editor_slash_command.
+
+  Exclude footer and category navigation actions from previews. Left-align attribution, use subtle
+  title and attribution text, and default description text.
+
+  Show text previews even without preview metadata, and reserve a fixed image area while images load
+  or when they fail. Keep previews within the viewport, flipping left when needed, with compact
+  panel dimensions and typography.
+
+  Replace baked panel screenshots with image-only assets. Remove image fields from text-only legacy
+  previews while preserving their attribution.
+
+  Let extension providers own their preview images and attribution. Pass preview metadata through
+  the Company Hub manifest factory and remove Editor's fallback preview registry.
+
+  Localize provider attribution names and display Confluence and Jira product icons instead of the
+  attribution prefix when an icon is present. Allow the Dropbox manifest to receive the host's
+  message formatter.
+
+### Patch Changes
+
+- Updated dependencies
+
+## 19.0.3
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 19.0.2
 
 ### Patch Changes

package/dist/cjs/manifest.js

@@ -11,12 +11,21 @@ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/
 var _react = _interopRequireDefault(require("react"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _client = require("react-dom/client");
+var _reactIntl = require("react-intl");
 var _builders = require("@atlaskit/adf-utils/builders");
 var _isExperimentEnabled = require("@atlaskit/platform-feature-experiments/is-experiment-enabled");
 var _constants = require("./constants");
 var _enableDropbox = _interopRequireDefault(require("./enable-dropbox"));
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t3 in e) "default" !== _t3 && {}.hasOwnProperty.call(e, _t3) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t3)) && (i.get || i.set) ? o(f, _t3, i) : f[_t3] = e[_t3]); return f; })(e, t); }
 var reactRoots = new WeakMap();
+var defaultIntl = (0, _reactIntl.createIntl)({
+  locale: 'en'
+});
+var dropboxName = (0, _reactIntl.defineMessage)({
+  id: 'editor-extension-dropbox.attribution-name.ai-non-final',
+  defaultMessage: 'Dropbox',
+  description: 'Dropbox product name displayed as the creator in the slash-command preview attribution.'
+});
 
 /** Mounts `element` into `mountPoint` using `createRoot` when the migration experiment is on. */
 var renderToMountPoint = function renderToMountPoint(element, mountPoint) {
@@ -165,11 +174,22 @@ function _pickFromDropbox() {
 }
 var manifestFunction = function manifestFunction(_ref) {
   var appKey = _ref.appKey,
-    canMountinIframe = _ref.canMountinIframe;
+    canMountinIframe = _ref.canMountinIframe,
+    _ref$intl = _ref.intl,
+    intl = _ref$intl === void 0 ? defaultIntl : _ref$intl;
   return {
     title: 'Dropbox',
     type: 'com.dropbox.fabric',
     key: 'dropbox',
+    preview: {
+      attribution: {
+        name: intl.formatMessage(dropboxName)
+      },
+      image: {
+        dark: 'https://dam-cdn.atl.orangelogic.com/CDNLink/AT12OVH2.png',
+        light: 'https://dam-cdn.atl.orangelogic.com/CDNLink/AT12OVKI.png'
+      }
+    },
     description: 'Embed Dropbox file to collaborate with your team',
     icons: {
       '16': function _() {

package/dist/es2019/manifest.js

@@ -1,11 +1,20 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { createRoot } from 'react-dom/client';
+import { createIntl, defineMessage } from 'react-intl';
 import { inlineCard } from '@atlaskit/adf-utils/builders';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { POPUP_MOUNTPOINT, DROPBOX_IFRAME_NAME } from './constants';
 import enableDropbox from './enable-dropbox';
 const reactRoots = new WeakMap();
+const defaultIntl = createIntl({
+  locale: 'en'
+});
+const dropboxName = defineMessage({
+  id: 'editor-extension-dropbox.attribution-name.ai-non-final',
+  defaultMessage: 'Dropbox',
+  description: 'Dropbox product name displayed as the creator in the slash-command preview attribution.'
+});
 
 /** Mounts `element` into `mountPoint` using `createRoot` when the migration experiment is on. */
 const renderToMountPoint = (element, mountPoint) => {
@@ -124,11 +133,21 @@ async function pickFromDropbox(appKey, canMountinIframe) {
 }
 const manifestFunction = ({
   appKey,
-  canMountinIframe
+  canMountinIframe,
+  intl = defaultIntl
 }) => ({
   title: 'Dropbox',
   type: 'com.dropbox.fabric',
   key: 'dropbox',
+  preview: {
+    attribution: {
+      name: intl.formatMessage(dropboxName)
+    },
+    image: {
+      dark: 'https://dam-cdn.atl.orangelogic.com/CDNLink/AT12OVH2.png',
+      light: 'https://dam-cdn.atl.orangelogic.com/CDNLink/AT12OVKI.png'
+    }
+  },
   description: 'Embed Dropbox file to collaborate with your team',
   icons: {
     '16': () => import( /* webpackChunkName: "@atlaskit-internal_editor-dropbox" */'./icons/DropboxIcon').then(mod => mod.default),

package/dist/esm/manifest.js

@@ -3,11 +3,20 @@ import _regeneratorRuntime from "@babel/runtime/regenerator";
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { createRoot } from 'react-dom/client';
+import { createIntl, defineMessage } from 'react-intl';
 import { inlineCard } from '@atlaskit/adf-utils/builders';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
 import { POPUP_MOUNTPOINT, DROPBOX_IFRAME_NAME } from './constants';
 import enableDropbox from './enable-dropbox';
 var reactRoots = new WeakMap();
+var defaultIntl = createIntl({
+  locale: 'en'
+});
+var dropboxName = defineMessage({
+  id: 'editor-extension-dropbox.attribution-name.ai-non-final',
+  defaultMessage: 'Dropbox',
+  description: 'Dropbox product name displayed as the creator in the slash-command preview attribution.'
+});
 
 /** Mounts `element` into `mountPoint` using `createRoot` when the migration experiment is on. */
 var renderToMountPoint = function renderToMountPoint(element, mountPoint) {
@@ -154,11 +163,22 @@ function _pickFromDropbox() {
 }
 var manifestFunction = function manifestFunction(_ref) {
   var appKey = _ref.appKey,
-    canMountinIframe = _ref.canMountinIframe;
+    canMountinIframe = _ref.canMountinIframe,
+    _ref$intl = _ref.intl,
+    intl = _ref$intl === void 0 ? defaultIntl : _ref$intl;
   return {
     title: 'Dropbox',
     type: 'com.dropbox.fabric',
     key: 'dropbox',
+    preview: {
+      attribution: {
+        name: intl.formatMessage(dropboxName)
+      },
+      image: {
+        dark: 'https://dam-cdn.atl.orangelogic.com/CDNLink/AT12OVH2.png',
+        light: 'https://dam-cdn.atl.orangelogic.com/CDNLink/AT12OVKI.png'
+      }
+    },
     description: 'Embed Dropbox file to collaborate with your team',
     icons: {
       '16': function _() {

package/dist/types/manifest.d.ts

@@ -1,3 +1,4 @@
+import { type IntlShape } from 'react-intl';
 import type { ExtensionManifest } from '@atlaskit/editor-common/extensions';
 import type { DropboxFile } from './types';
 declare global {
@@ -13,8 +14,9 @@ declare global {
         };
     }
 }
-declare const manifestFunction: ({ appKey, canMountinIframe, }: {
+declare const manifestFunction: ({ appKey, canMountinIframe, intl, }: {
     appKey: string;
     canMountinIframe: boolean;
+    intl?: Pick<IntlShape, 'formatMessage'>;
 }) => ExtensionManifest;
 export default manifestFunction;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-extension-dropbox",
-	"version": "19.0.2",
+	"version": "19.1.0",
 	"description": "A an atlassian editor extension to add a native dropbox picker",
 	"publishConfig": {
 		"registry": "https://registry.npmjs.org/"
@@ -43,14 +43,15 @@
 		"@atlaskit/primitives": "^22.5.0",
 		"@atlaskit/react-compiler-gating": "^0.2.0",
 		"@atlaskit/section-message": "^10.2.0",
-		"@atlaskit/tmp-editor-statsig": "^207.0.0",
+		"@atlaskit/tmp-editor-statsig": "^209.0.0",
 		"@atlaskit/tokens": "^20.0.0",
 		"@babel/runtime": "^7.0.0",
 		"@compiled/react": "^1.0.2",
-		"@emotion/react": "^11.7.1"
+		"@emotion/react": "^11.7.1",
+		"react-intl": "^7.0.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^125.2.0",
+		"@atlaskit/editor-common": "^125.4.0",
 		"react": "^18.2.0 || ^19.2.0",
 		"react-dom": "^18.2.0 || ^19.2.0"
 	},