@jupyterlab/filebrowser 4.6.0-alpha.1 → 4.6.0-alpha.3

package/src/listing.ts

@@ -8,19 +8,13 @@ import {
   showErrorMessage
 } from '@jupyterlab/apputils';
 import { PageConfig, PathExt, Time } from '@jupyterlab/coreutils';
-import {
-  IDocumentManager,
-  isValidFileName,
-  renameFile
-} from '@jupyterlab/docmanager';
+import type { IDocumentManager } from '@jupyterlab/docmanager';
+import { isValidFileName, renameFile } from '@jupyterlab/docmanager';
 import { DocumentRegistry } from '@jupyterlab/docregistry';
-import { Contents } from '@jupyterlab/services';
-import { IStateDB } from '@jupyterlab/statedb';
-import {
-  ITranslator,
-  nullTranslator,
-  TranslationBundle
-} from '@jupyterlab/translation';
+import type { Contents } from '@jupyterlab/services';
+import type { IStateDB } from '@jupyterlab/statedb';
+import type { ITranslator, TranslationBundle } from '@jupyterlab/translation';
+import { nullTranslator } from '@jupyterlab/translation';
 import {
   caretDownIcon,
   caretUpIcon,
@@ -28,19 +22,19 @@ import {
   LabIcon
 } from '@jupyterlab/ui-components';
 import { ArrayExt, filter, StringExt } from '@lumino/algorithm';
-import {
-  MimeData,
-  PromiseDelegate,
-  ReadonlyJSONObject
-} from '@lumino/coreutils';
+import type { ReadonlyJSONObject } from '@lumino/coreutils';
+import { MimeData, PromiseDelegate } from '@lumino/coreutils';
 import { ElementExt } from '@lumino/domutils';
-import { DisposableDelegate, IDisposable } from '@lumino/disposable';
+import type { IDisposable } from '@lumino/disposable';
+import { DisposableDelegate } from '@lumino/disposable';
 import { Drag } from '@lumino/dragdrop';
-import { Message, MessageLoop } from '@lumino/messaging';
-import { ISignal, Signal } from '@lumino/signaling';
+import type { Message } from '@lumino/messaging';
+import { MessageLoop } from '@lumino/messaging';
+import type { ISignal } from '@lumino/signaling';
+import { Signal } from '@lumino/signaling';
 import { h, VirtualDOM } from '@lumino/virtualdom';
 import { Widget } from '@lumino/widgets';
-import { FilterFileBrowserModel } from './model';
+import type { FilterFileBrowserModel } from './model';
 
 /**
  * The class name added to DirListing widget.
@@ -356,6 +350,7 @@ export class DirListing extends Widget {
       this.model.items(),
       state,
       this._sortNotebooksFirst,
+      this._sortFileNamesNaturally,
       this.translator
     );
     this._sortState = state;
@@ -962,8 +957,8 @@ export class DirListing extends Widget {
       this._modifiedWidth < 100
         ? 'narrow'
         : this._modifiedWidth > 120
-        ? 'long'
-        : 'short';
+          ? 'long'
+          : 'short';
   }
 
   /**
@@ -1361,6 +1356,19 @@ export class DirListing extends Widget {
     }
   }
 
+  /**
+   * Update the setting to sort file names naturally
+   * vs lexicographically. Default is true (natural).
+   * This sorts the items again if the internal value is modified.
+   */
+  setSortFileNamesNaturally(natural: boolean): void {
+    const previousValue = this._sortFileNamesNaturally;
+    this._sortFileNamesNaturally = natural;
+    if (this._sortFileNamesNaturally !== previousValue) {
+      this.sort(this._sortState);
+    }
+  }
+
   /**
    * Update the setting to allow single click navigation.
    * This enables opening files/directories with a single click.
@@ -2121,7 +2129,7 @@ export class DirListing extends Widget {
       } as DirListing.IContentsThunk);
     }
 
-    if (item && item.type !== 'directory') {
+    if (item.type !== 'directory') {
       const otherPaths = selectedPaths.slice(1).reverse();
       this._drag.mimeData.setData(FACTORY_MIME, () => {
         if (!item) {
@@ -2541,6 +2549,9 @@ export class DirListing extends Widget {
    * Handle a `pathChanged` signal from the model.
    */
   private _onPathChanged(): void {
+    // Check if the directory listing (or any of its children) has focus.
+    const hasFocus = this.node.contains(document.activeElement);
+
     // Reset the selection.
     this.clearSelectedItems();
     // Update the sorted items.
@@ -2548,7 +2559,16 @@ export class DirListing extends Widget {
     // Reset focus. But wait until the DOM has been updated (hence
     // `requestAnimationFrame`).
     requestAnimationFrame(() => {
-      this._focusItem(0);
+      if (this.isDisposed) {
+        return;
+      }
+      // Only focus the first item if the listing (or a child) previously had focus.
+      if (hasFocus) {
+        this._focusItem(0);
+      } else {
+        // Otherwise, just reset the internal focus index without moving DOM focus.
+        this._focusIndex = 0;
+      }
     });
   }
 
@@ -2645,6 +2665,7 @@ export class DirListing extends Widget {
     last_modified: null
   };
   private _sortNotebooksFirst = false;
+  private _sortFileNamesNaturally = true;
   private _allowSingleClick = false;
   private _allowDragDropUpload = true;
   // _focusIndex should never be set outside the range [0, this._items.length - 1]
@@ -3679,6 +3700,7 @@ namespace Private {
     items: Iterable<Contents.IModel>,
     state: DirListing.ISortState,
     sortNotebooksFirst: boolean = false,
+    sortFileNamesNaturally: boolean = true,
     translator: ITranslator
   ): Contents.IModel[] {
     const copy = Array.from(items);
@@ -3710,6 +3732,7 @@ namespace Private {
 
     /**
      * Compare two items by their name using `translator.languageCode`, with fallback to `navigator.language`.
+     * When sortFileNamesNaturally is true, uses natural order.
      */
     function compareByName(a: Contents.IModel, b: Contents.IModel) {
       // Wokaround for Chromium invalid language code on CI, see
@@ -3718,19 +3741,17 @@ namespace Private {
       const languageCode = (
         translator.languageCode ?? navigatorLanguage
       ).replace('_', '-');
+      const localeOptions: Intl.CollatorOptions = {
+        numeric: sortFileNamesNaturally,
+        sensitivity: 'base'
+      };
       try {
-        return a.name.localeCompare(b.name, languageCode, {
-          numeric: true,
-          sensitivity: 'base'
-        });
+        return a.name.localeCompare(b.name, languageCode, localeOptions);
       } catch (e) {
         console.warn(
           `localeCompare failed to compare ${a.name} and ${b.name} under languageCode: ${languageCode}`
         );
-        return a.name.localeCompare(b.name, navigatorLanguage, {
-          numeric: true,
-          sensitivity: 'base'
-        });
+        return a.name.localeCompare(b.name, navigatorLanguage, localeOptions);
       }
     }
 

package/src/model.ts

@@ -2,21 +2,22 @@
 // Distributed under the terms of the Modified BSD License.
 
 import { Dialog, showDialog } from '@jupyterlab/apputils';
-import { IChangedArgs, PageConfig, PathExt } from '@jupyterlab/coreutils';
-import { IDocumentManager, shouldOverwrite } from '@jupyterlab/docmanager';
-import { Contents, KernelSpec, Session } from '@jupyterlab/services';
-import { IStateDB } from '@jupyterlab/statedb';
-import {
-  ITranslator,
-  nullTranslator,
-  TranslationBundle
-} from '@jupyterlab/translation';
-import { IFilterBoxProps, IScore } from '@jupyterlab/ui-components';
+import type { IChangedArgs } from '@jupyterlab/coreutils';
+import { PageConfig, PathExt } from '@jupyterlab/coreutils';
+import type { IDocumentManager } from '@jupyterlab/docmanager';
+import { shouldOverwrite } from '@jupyterlab/docmanager';
+import type { Contents, KernelSpec, Session } from '@jupyterlab/services';
+import type { IStateDB } from '@jupyterlab/statedb';
+import type { ITranslator, TranslationBundle } from '@jupyterlab/translation';
+import { nullTranslator } from '@jupyterlab/translation';
+import type { IFilterBoxProps, IScore } from '@jupyterlab/ui-components';
 import { ArrayExt, filter } from '@lumino/algorithm';
-import { PromiseDelegate, ReadonlyJSONObject } from '@lumino/coreutils';
-import { IDisposable } from '@lumino/disposable';
+import type { ReadonlyJSONObject } from '@lumino/coreutils';
+import { PromiseDelegate } from '@lumino/coreutils';
+import type { IDisposable } from '@lumino/disposable';
 import { Poll } from '@lumino/polling';
-import { ISignal, Signal } from '@lumino/signaling';
+import type { ISignal } from '@lumino/signaling';
+import { Signal } from '@lumino/signaling';
 
 /**
  * The default duration of the auto-refresh in ms
@@ -633,10 +634,10 @@ export class FileBrowserModel implements IDisposable {
       prefix + PathExt.dirname(oldValue.path) === path
         ? oldValue
         : newValue &&
-          newValue.path &&
-          prefix + PathExt.dirname(newValue.path) === path
-        ? newValue
-        : undefined;
+            newValue.path &&
+            prefix + PathExt.dirname(newValue.path) === path
+          ? newValue
+          : undefined;
 
     // If either the old value or the new value is in the current path, update.
     if (value) {

package/src/opendialog.ts

@@ -3,14 +3,16 @@
 
 import { Dialog, setToolbar, ToolbarButton } from '@jupyterlab/apputils';
 import { PathExt } from '@jupyterlab/coreutils';
-import { IDocumentManager } from '@jupyterlab/docmanager';
-import { Contents } from '@jupyterlab/services';
-import { ITranslator, nullTranslator } from '@jupyterlab/translation';
-import { IScore, newFolderIcon, refreshIcon } from '@jupyterlab/ui-components';
+import type { IDocumentManager } from '@jupyterlab/docmanager';
+import type { Contents } from '@jupyterlab/services';
+import type { ITranslator } from '@jupyterlab/translation';
+import { nullTranslator } from '@jupyterlab/translation';
+import type { IScore } from '@jupyterlab/ui-components';
+import { newFolderIcon, refreshIcon } from '@jupyterlab/ui-components';
 import { PanelLayout, Widget } from '@lumino/widgets';
 import { FileBrowser } from './browser';
 import { FilterFileBrowserModel } from './model';
-import { IFileBrowserFactory } from './tokens';
+import type { IFileBrowserFactory } from './tokens';
 import { PromiseDelegate } from '@lumino/coreutils';
 
 /**
@@ -30,16 +32,15 @@ export namespace FileDialog {
   /**
    * Options for the open directory dialog
    */
-  export interface IDirectoryOptions
-    extends Partial<
-      Pick<
-        Dialog.IOptions<Promise<Contents.IModel[]>>,
-        Exclude<
-          keyof Dialog.IOptions<Promise<Contents.IModel[]>>,
-          'body' | 'buttons' | 'defaultButton'
-        >
+  export interface IDirectoryOptions extends Partial<
+    Pick<
+      Dialog.IOptions<Promise<Contents.IModel[]>>,
+      Exclude<
+        keyof Dialog.IOptions<Promise<Contents.IModel[]>>,
+        'body' | 'buttons' | 'defaultButton'
       >
-    > {
+    >
+  > {
     /**
      * Document manager
      */

package/src/upload.ts

@@ -2,15 +2,13 @@
 // Distributed under the terms of the Modified BSD License.
 
 import { showErrorMessage } from '@jupyterlab/apputils';
-import {
-  ITranslator,
-  nullTranslator,
-  TranslationBundle
-} from '@jupyterlab/translation';
+import type { ITranslator, TranslationBundle } from '@jupyterlab/translation';
+import { nullTranslator } from '@jupyterlab/translation';
 import { fileUploadIcon, ToolbarButton } from '@jupyterlab/ui-components';
-import { FileBrowserModel } from './model';
-import { Contents } from '@jupyterlab/services';
-import { ISignal, Signal } from '@lumino/signaling';
+import type { FileBrowserModel } from './model';
+import type { Contents } from '@jupyterlab/services';
+import type { ISignal } from '@lumino/signaling';
+import { Signal } from '@lumino/signaling';
 
 /**
  * A widget which provides an upload button.

package/src/uploadstatus.tsx

@@ -2,18 +2,15 @@
 // Distributed under the terms of the Modified BSD License.
 //
 
-import { WidgetTracker } from '@jupyterlab/apputils';
-import { IChangedArgs } from '@jupyterlab/coreutils';
+import type { WidgetTracker } from '@jupyterlab/apputils';
+import type { IChangedArgs } from '@jupyterlab/coreutils';
 import { GroupItem, ProgressBar, TextItem } from '@jupyterlab/statusbar';
-import {
-  ITranslator,
-  nullTranslator,
-  TranslationBundle
-} from '@jupyterlab/translation';
+import type { ITranslator, TranslationBundle } from '@jupyterlab/translation';
+import { nullTranslator } from '@jupyterlab/translation';
 import { VDomModel, VDomRenderer } from '@jupyterlab/ui-components';
 import { ArrayExt } from '@lumino/algorithm';
 import React from 'react';
-import { FileBrowser, FileBrowserModel, IUploadModel } from '.';
+import type { FileBrowser, FileBrowserModel, IUploadModel } from '.';
 
 /**
  * Half-spacing between items in the overall status item.