@uppy/dashboard - npm Package Compare versions

Comparing version 4.0.0 to 4.0.1

CHANGELOG.md

 # @uppy/dashboard
 
+## 4.0.1
+
+Released: 2024-07-15
+Included in: Uppy v4.0.1
+
+- @uppy/dashboard: propagate `setOptions` to `StatusBar` (Mikael Finstad / #5260)
+- @uppy/dashboard,@uppy/drag-drop,@uppy/drop-target: `<Dashboard/>`, `<DragDrop/>`, `drop-target` - new anti-flickering solution (Evgenia Karunus / #5326)
+
 ## 4.0.0-beta.9
@@ -4,0 +12,0 @@

lib/Dashboard.d.ts

@@ -161,3 +161,2 @@ import { UIPlugin, type UIPluginOptions, type UnknownPlugin, type Uppy, type State } from '@uppy/core';
     private makeDashboardInsidesVisibleAnywayTimeout;
-    private removeDragOverClassTimeout;
     constructor(uppy: Uppy<M, B>, opts?: DashboardOptions<M, B>);
@@ -212,2 +211,3 @@ removeTarget: (plugin: UnknownPlugin<M, B>) => void;
     render: (state: State<M, B>) => import("preact").JSX.Element;
+    setOptions(opts: Partial<DashboardOptions<M, B>>): void;
     install: () => void;
@@ -214,0 +214,0 @@ uninstall: () => void;

lib/Dashboard.js

@@ -21,3 +21,3 @@ function _classPrivateFieldLooseBase(e, t) { if (!{}.hasOwnProperty.call(e, t)) throw new TypeError("attempted to use private field on non-instance"); return e; }
 const packageJson = {
-  "version": "4.0.0"
+  "version": "4.0.1"
 };
@@ -94,2 +94,8 @@ import locale from "./locale.js";
 var _addSupportedPluginIfNoTarget = /*#__PURE__*/_classPrivateFieldLooseKey("addSupportedPluginIfNoTarget");
+var _getStatusBarOpts = /*#__PURE__*/_classPrivateFieldLooseKey("getStatusBarOpts");
+var _getThumbnailGeneratorOpts = /*#__PURE__*/_classPrivateFieldLooseKey("getThumbnailGeneratorOpts");
+var _getInformerOpts = /*#__PURE__*/_classPrivateFieldLooseKey("getInformerOpts");
+var _getStatusBarId = /*#__PURE__*/_classPrivateFieldLooseKey("getStatusBarId");
+var _getThumbnailGeneratorId = /*#__PURE__*/_classPrivateFieldLooseKey("getThumbnailGeneratorId");
+var _getInformerId = /*#__PURE__*/_classPrivateFieldLooseKey("getInformerId");
 export default class Dashboard extends UIPlugin {
@@ -106,2 +112,21 @@ // Timeouts
     });
+    Object.defineProperty(this, _getInformerId, {
+      value: _getInformerId2
+    });
+    Object.defineProperty(this, _getThumbnailGeneratorId, {
+      value: _getThumbnailGeneratorId2
+    });
+    Object.defineProperty(this, _getStatusBarId, {
+      value: _getStatusBarId2
+    });
+    // eslint-disable-next-line class-methods-use-this
+    Object.defineProperty(this, _getInformerOpts, {
+      value: _getInformerOpts2
+    });
+    Object.defineProperty(this, _getThumbnailGeneratorOpts, {
+      value: _getThumbnailGeneratorOpts2
+    });
+    Object.defineProperty(this, _getStatusBarOpts, {
+      value: _getStatusBarOpts2
+    });
     Object.defineProperty(this, _disabledNodes, {
@@ -565,3 +590,2 @@ writable: true,
         event.dataTransfer.dropEffect = 'none'; // eslint-disable-line no-param-reassign
-        clearTimeout(this.removeDragOverClassTimeout);
         return;
@@ -575,3 +599,2 @@ }
 
-      clearTimeout(this.removeDragOverClassTimeout);
       this.setPluginState({
@@ -586,10 +609,5 @@ isDraggingOver: true
       event.stopPropagation();
-      clearTimeout(this.removeDragOverClassTimeout);
-      // Timeout against flickering, this solution is taken from drag-drop library.
-      // Solution with 'pointer-events: none' didn't work across browsers.
-      this.removeDragOverClassTimeout = setTimeout(() => {
-        this.setPluginState({
-          isDraggingOver: false
-        });
-      }, 50);
+      this.setPluginState({
+        isDraggingOver: false
+      });
       (_this$opts$onDragLeav = (_this$opts2 = this.opts).onDragLeave) == null || _this$opts$onDragLeav.call(_this$opts2, event);
@@ -601,3 +619,2 @@ };
       event.stopPropagation();
-      clearTimeout(this.removeDragOverClassTimeout);
       this.setPluginState({
@@ -1058,12 +1075,5 @@ isDraggingOver: false
         this.uppy.use(StatusBar, {
-          id: `${this.id}:StatusBar`,
+          id: _classPrivateFieldLooseBase(this, _getStatusBarId)[_getStatusBarId](),
           target: this,
-          hideUploadButton: this.opts.hideUploadButton,
-          hideRetryButton: this.opts.hideRetryButton,
-          hidePauseResumeButton: this.opts.hidePauseResumeButton,
-          hideCancelButton: this.opts.hideCancelButton,
-          showProgressDetails: this.opts.showProgressDetails,
-          hideAfterFinish: this.opts.hideProgressAfterFinish,
-          locale: this.opts.locale,
-          doneButtonHandler: this.opts.doneButtonHandler
+          ..._classPrivateFieldLooseBase(this, _getStatusBarOpts)[_getStatusBarOpts]()
         });
@@ -1073,4 +1083,5 @@ }
         this.uppy.use(Informer, {
-          id: `${this.id}:Informer`,
-          target: this
+          id: _classPrivateFieldLooseBase(this, _getInformerId)[_getInformerId](),
+          target: this,
+          ..._classPrivateFieldLooseBase(this, _getInformerOpts)[_getInformerOpts]()
         });
@@ -1080,9 +1091,4 @@ }
         this.uppy.use(ThumbnailGenerator, {
-          id: `${this.id}:ThumbnailGenerator`,
-          thumbnailWidth: this.opts.thumbnailWidth,
-          thumbnailHeight: this.opts.thumbnailHeight,
-          thumbnailType: this.opts.thumbnailType,
-          waitForThumbnailsBeforeUpload: this.opts.waitForThumbnailsBeforeUpload,
-          // If we don't block on thumbnails, we can lazily generate them
-          lazy: !this.opts.waitForThumbnailsBeforeUpload
+          id: _classPrivateFieldLooseBase(this, _getThumbnailGeneratorId)[_getThumbnailGeneratorId](),
+          ..._classPrivateFieldLooseBase(this, _getThumbnailGeneratorOpts)[_getThumbnailGeneratorOpts]()
         });
@@ -1151,3 +1157,61 @@ }
   }
+  setOptions(opts) {
+    var _this$uppy$getPlugin, _this$uppy$getPlugin2;
+    super.setOptions(opts);
+    (_this$uppy$getPlugin = this.uppy.getPlugin(_classPrivateFieldLooseBase(this, _getStatusBarId)[_getStatusBarId]())) == null || _this$uppy$getPlugin.setOptions(_classPrivateFieldLooseBase(this, _getStatusBarOpts)[_getStatusBarOpts]());
+    (_this$uppy$getPlugin2 = this.uppy.getPlugin(_classPrivateFieldLooseBase(this, _getThumbnailGeneratorId)[_getThumbnailGeneratorId]())) == null || _this$uppy$getPlugin2.setOptions(_classPrivateFieldLooseBase(this, _getThumbnailGeneratorOpts)[_getThumbnailGeneratorOpts]());
+  }
 }
+function _getStatusBarOpts2() {
+  const {
+    hideUploadButton,
+    hideRetryButton,
+    hidePauseResumeButton,
+    hideCancelButton,
+    showProgressDetails,
+    hideProgressAfterFinish,
+    locale: l,
+    doneButtonHandler
+  } = this.opts;
+  return {
+    hideUploadButton,
+    hideRetryButton,
+    hidePauseResumeButton,
+    hideCancelButton,
+    showProgressDetails,
+    hideAfterFinish: hideProgressAfterFinish,
+    locale: l,
+    doneButtonHandler
+  };
+}
+function _getThumbnailGeneratorOpts2() {
+  const {
+    thumbnailWidth,
+    thumbnailHeight,
+    thumbnailType,
+    waitForThumbnailsBeforeUpload
+  } = this.opts;
+  return {
+    thumbnailWidth,
+    thumbnailHeight,
+    thumbnailType,
+    waitForThumbnailsBeforeUpload,
+    // If we don't block on thumbnails, we can lazily generate them
+    lazy: !waitForThumbnailsBeforeUpload
+  };
+}
+function _getInformerOpts2() {
+  return {
+    // currently no options
+  };
+}
+function _getStatusBarId2() {
+  return `${this.id}:StatusBar`;
+}
+function _getThumbnailGeneratorId2() {
+  return `${this.id}:ThumbnailGenerator`;
+}
+function _getInformerId2() {
+  return `${this.id}:Informer`;
+}
 Dashboard.VERSION = packageJson.version;

package.json

 {
   "name": "@uppy/dashboard",
   "description": "Universal UI plugin for Uppy.",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "license": "MIT",
@@ -47,4 +47,4 @@ "main": "lib/index.js",
   "peerDependencies": {
-    "@uppy/core": "^4.0.0"
+    "@uppy/core": "^4.0.1"
   }
 }

No alert changes

Improved metrics

Total package byte prevSize

755264

0.64%

Lines of code

10845

1.01%

No dependency changes