@jupyterlab/filebrowser 4.0.0-alpha.2 → 4.0.0-alpha.20

package/src/uploadstatus.tsx

@@ -0,0 +1,259 @@
+// Copyright (c) Jupyter Development Team.
+// Distributed under the terms of the Modified BSD License.
+//
+
+import { WidgetTracker } from '@jupyterlab/apputils';
+import { IChangedArgs } from '@jupyterlab/coreutils';
+import { GroupItem, ProgressBar, TextItem } from '@jupyterlab/statusbar';
+import {
+  ITranslator,
+  nullTranslator,
+  TranslationBundle
+} from '@jupyterlab/translation';
+import { VDomModel, VDomRenderer } from '@jupyterlab/ui-components';
+import { ArrayExt } from '@lumino/algorithm';
+import React from 'react';
+import { FileBrowser, FileBrowserModel, IUploadModel } from '.';
+
+/**
+ * Half-spacing between items in the overall status item.
+ */
+const HALF_SPACING = 4;
+
+/**
+ * A pure function component for a FileUpload status item.
+ *
+ * @param props: the props for the component.
+ *
+ * @returns a tsx component for the file upload status.
+ */
+function FileUploadComponent(
+  props: FileUploadComponent.IProps
+): React.ReactElement<FileUploadComponent.IProps> {
+  const translator = props.translator || nullTranslator;
+  const trans = translator.load('jupyterlab');
+  return (
+    <GroupItem spacing={HALF_SPACING}>
+      <TextItem source={trans.__('Uploading…')} />
+      <ProgressBar percentage={props.upload} />
+    </GroupItem>
+  );
+}
+
+/**
+ * A namespace for FileUploadComponent statics.
+ */
+namespace FileUploadComponent {
+  /**
+   * The props for the FileUploadComponent.
+   */
+  export interface IProps {
+    /**
+     * The current upload percentage, from 0 to 100.
+     */
+    upload: number;
+
+    /**
+     * The language translator.
+     */
+    translator?: ITranslator;
+  }
+}
+
+/**
+ * The time for which to show the "Complete!" message after uploading.
+ */
+const UPLOAD_COMPLETE_MESSAGE_MILLIS: number = 2000;
+
+/**
+ * Status bar item to display file upload progress.
+ */
+export class FileUploadStatus extends VDomRenderer<FileUploadStatus.Model> {
+  /**
+   * Construct a new FileUpload status item.
+   */
+  constructor(opts: FileUploadStatus.IOptions) {
+    super(
+      new FileUploadStatus.Model(
+        opts.tracker.currentWidget && opts.tracker.currentWidget.model
+      )
+    );
+    this.translator = opts.translator || nullTranslator;
+    this._trans = this.translator.load('jupyterlab');
+    this._tracker = opts.tracker;
+    this._tracker.currentChanged.connect(this._onBrowserChange);
+  }
+
+  /**
+   * Render the FileUpload status.
+   */
+  render(): JSX.Element {
+    const uploadPaths = this.model!.items;
+    if (uploadPaths.length > 0) {
+      const item = this.model!.items[0];
+
+      if (item.complete) {
+        return <TextItem source={this._trans.__('Complete!')} />;
+      } else {
+        return (
+          <FileUploadComponent
+            upload={this.model!.items[0].progress}
+            translator={this.translator}
+          />
+        );
+      }
+    } else {
+      return <FileUploadComponent upload={100} translator={this.translator} />;
+    }
+  }
+
+  dispose(): void {
+    super.dispose();
+    this._tracker.currentChanged.disconnect(this._onBrowserChange);
+  }
+
+  private _onBrowserChange = (
+    tracker: WidgetTracker<FileBrowser>,
+    browser: FileBrowser | null
+  ) => {
+    if (browser === null) {
+      this.model!.browserModel = null;
+    } else {
+      this.model!.browserModel = browser.model;
+    }
+  };
+
+  private readonly translator: ITranslator;
+  private _trans: TranslationBundle;
+  private _tracker: WidgetTracker<FileBrowser>;
+}
+
+/**
+ * A namespace for FileUpload class statics.
+ */
+export namespace FileUploadStatus {
+  /**
+   * The VDomModel for the FileUpload renderer.
+   */
+  export class Model extends VDomModel {
+    /**
+     * Construct a new model.
+     */
+    constructor(browserModel: FileBrowserModel | null) {
+      super();
+      this.browserModel = browserModel;
+    }
+
+    /**
+     * The currently uploading items.
+     */
+    get items(): IFileUploadItem[] {
+      return this._items;
+    }
+
+    /**
+     * The current file browser model.
+     */
+    get browserModel(): FileBrowserModel | null {
+      return this._browserModel;
+    }
+    set browserModel(browserModel: FileBrowserModel | null) {
+      const oldBrowserModel = this._browserModel;
+      if (oldBrowserModel) {
+        oldBrowserModel.uploadChanged.disconnect(this._uploadChanged);
+      }
+
+      this._browserModel = browserModel;
+      this._items = [];
+
+      if (this._browserModel !== null) {
+        this._browserModel.uploadChanged.connect(this._uploadChanged);
+      }
+
+      this.stateChanged.emit(void 0);
+    }
+
+    /**
+     * Handle an uploadChanged event in the filebrowser model.
+     */
+    private _uploadChanged = (
+      browse: FileBrowserModel,
+      uploads: IChangedArgs<IUploadModel>
+    ) => {
+      if (uploads.name === 'start') {
+        this._items.push({
+          path: uploads.newValue.path,
+          progress: uploads.newValue.progress * 100,
+          complete: false
+        });
+      } else if (uploads.name === 'update') {
+        const idx = ArrayExt.findFirstIndex(
+          this._items,
+          val => val.path === uploads.oldValue.path
+        );
+        if (idx !== -1) {
+          this._items[idx].progress = uploads.newValue.progress * 100;
+        }
+      } else if (uploads.name === 'finish') {
+        const finishedItem = ArrayExt.findFirstValue(
+          this._items,
+          val => val.path === uploads.oldValue.path
+        );
+
+        if (finishedItem) {
+          finishedItem.complete = true;
+          setTimeout(() => {
+            ArrayExt.removeFirstOf(this._items, finishedItem);
+            this.stateChanged.emit(void 0);
+          }, UPLOAD_COMPLETE_MESSAGE_MILLIS);
+        }
+      } else if (uploads.name === 'failure') {
+        ArrayExt.removeFirstWhere(
+          this._items,
+          val => val.path === uploads.newValue.path
+        );
+      }
+
+      this.stateChanged.emit(void 0);
+    };
+
+    private _items: Array<IFileUploadItem> = [];
+    private _browserModel: FileBrowserModel | null = null;
+  }
+
+  /**
+   * Options for creating the upload status item.
+   */
+  export interface IOptions {
+    /**
+     * The application file browser tracker.
+     */
+    readonly tracker: WidgetTracker<FileBrowser>;
+
+    /**
+     * The translation language bundle.
+     */
+    readonly translator?: ITranslator;
+  }
+}
+
+/**
+ * The interface for an item that is being uploaded to
+ * the file system.
+ */
+interface IFileUploadItem {
+  /**
+   * The path on the filesystem that is being uploaded to.
+   */
+  path: string;
+
+  /**
+   * The upload progress fraction.
+   */
+  progress: number;
+
+  /**
+   * Whether the upload is complete.
+   */
+  complete: boolean;
+}

package/style/base.css

@@ -17,31 +17,36 @@
 | Distributed under the terms of the Modified BSD License.
 |----------------------------------------------------------------------------*/
 
-.jp-FileBrowser {
+.jp-FileBrowser .jp-SidePanel-content {
   display: flex;
   flex-direction: column;
-  color: var(--jp-ui-font-color1);
-  background: var(--jp-layout-color1);
-  /* This is needed so that all font sizing of children done in ems is
-   * relative to this base size */
-  font-size: var(--jp-ui-font-size1);
 }
 
 .jp-FileBrowser-toolbar.jp-Toolbar {
+  flex-wrap: wrap;
+  row-gap: 12px;
   border-bottom: none;
   height: auto;
-  margin: var(--jp-toolbar-header-margin);
+  margin: 8px 12px 0;
   box-shadow: none;
+  padding: 0;
+  justify-content: flex-start;
+}
+
+.jp-FileBrowser-Panel {
+  flex: 1 1 auto;
+  display: flex;
+  flex-direction: column;
 }
 
 .jp-BreadCrumbs {
   flex: 0 0 auto;
-  margin: 8px 12px 8px 12px;
+  margin: 8px 12px;
 }
 
 .jp-BreadCrumbs-item {
-  margin: 0px 2px;
-  padding: 0px 2px;
+  margin: 0 2px;
+  padding: 0 2px;
   border-radius: var(--jp-border-radius);
   cursor: pointer;
 }
@@ -51,7 +56,7 @@
 }
 
 .jp-BreadCrumbs-item:first-child {
-  margin-left: 0px;
+  margin-left: 0;
 }
 
 .jp-BreadCrumbs-item.jp-mod-dropTarget {
@@ -63,45 +68,18 @@
 | Buttons
 |----------------------------------------------------------------------------*/
 
-.jp-FileBrowser-toolbar.jp-Toolbar {
-  padding: 0px;
-  margin: 8px 12px 0px 12px;
-}
-
-.jp-FileBrowser-toolbar.jp-Toolbar {
-  justify-content: flex-start;
-}
-
-.jp-FileBrowser-toolbar.jp-Toolbar .jp-Toolbar-item {
+.jp-FileBrowser-toolbar > .jp-Toolbar-item {
   flex: 0 0 auto;
-  padding-left: 0px;
+  padding-left: 0;
   padding-right: 2px;
+  align-items: center;
+  height: unset;
 }
 
-.jp-FileBrowser-toolbar.jp-Toolbar .jp-ToolbarButtonComponent {
+.jp-FileBrowser-toolbar > .jp-Toolbar-item .jp-ToolbarButtonComponent {
   width: 40px;
 }
 
-.jp-FileBrowser-toolbar.jp-Toolbar
-  .jp-Toolbar-item:first-child
-  .jp-ToolbarButtonComponent {
-  width: 72px;
-  background: var(--jp-accept-color-normal, var(--jp-brand-color1));
-}
-
-.jp-FileBrowser-toolbar.jp-Toolbar
-  .jp-Toolbar-item:first-child
-  .jp-ToolbarButtonComponent:focus-visible {
-  background-color: var(--jp-accept-color-active, var(--jp-brand-color0));
-}
-
-.jp-FileBrowser-toolbar.jp-Toolbar
-  .jp-Toolbar-item:first-child
-  .jp-ToolbarButtonComponent
-  .jp-icon3 {
-  fill: white;
-}
-
 /*-----------------------------------------------------------------------------
 | Other styles
 |----------------------------------------------------------------------------*/
@@ -118,10 +96,12 @@
   display: none;
 }
 
-.jp-FileBrowser-filterBox {
-  padding: 0px;
-  flex: 0 0 auto;
-  margin: 8px 12px 0px 12px;
+.jp-FileSize-hidden {
+  display: none;
+}
+
+.jp-FileBrowser .lm-AccordionPanel > h3:first-child {
+  display: none;
 }
 
 /*-----------------------------------------------------------------------------
@@ -136,13 +116,15 @@
 }
 
 .jp-DirListing:focus-visible {
-  border: 1px solid var(--jp-brand-color1);
+  outline: 1px solid var(--jp-brand-color1);
+  outline-offset: -2px;
 }
 
 .jp-DirListing-header {
   flex: 0 0 auto;
   display: flex;
   flex-direction: row;
+  align-items: center;
   overflow: hidden;
   border-top: var(--jp-border-width) solid var(--jp-border-color2);
   border-bottom: var(--jp-border-width) solid var(--jp-border-color1);
@@ -151,7 +133,7 @@
 }
 
 .jp-DirListing-headerItem {
-  padding: 4px 12px 2px 12px;
+  padding: 4px 12px 2px;
   font-weight: 500;
 }
 
@@ -169,10 +151,16 @@
   text-align: right;
 }
 
+.jp-DirListing-headerItem.jp-id-filesize {
+  flex: 0 0 75px;
+  border-left: var(--jp-border-width) solid var(--jp-border-color2);
+  text-align: right;
+}
+
 .jp-id-narrow {
   display: none;
   flex: 0 0 5px;
-  padding: 4px 4px;
+  padding: 4px;
   border-left: var(--jp-border-width) solid var(--jp-border-color2);
   text-align: right;
   color: var(--jp-border-color2);
@@ -221,6 +209,7 @@
 .jp-DirListing-item {
   display: flex;
   flex-direction: row;
+  align-items: center;
   padding: 4px 12px;
   -webkit-user-select: none;
   -moz-user-select: none;
@@ -228,6 +217,40 @@
   user-select: none;
 }
 
+.jp-DirListing-checkboxWrapper {
+  /* Increases hit area of checkbox. */
+  padding: 4px;
+}
+
+.jp-DirListing-header
+  .jp-DirListing-checkboxWrapper
+  + .jp-DirListing-headerItem {
+  padding-left: 4px;
+}
+
+.jp-DirListing-content .jp-DirListing-checkboxWrapper {
+  position: relative;
+  left: -4px;
+  margin: -4px 0 -4px -8px;
+}
+
+.jp-DirListing-checkboxWrapper.jp-mod-visible {
+  visibility: visible;
+}
+
+/* For devices that support hovering, hide checkboxes until hovered, selected...
+*/
+@media (hover: hover) {
+  .jp-DirListing-checkboxWrapper {
+    visibility: hidden;
+  }
+
+  .jp-DirListing-item:hover .jp-DirListing-checkboxWrapper,
+  .jp-DirListing-item.jp-mod-selected .jp-DirListing-checkboxWrapper {
+    visibility: visible;
+  }
+}
+
 .jp-DirListing-item[data-is-dot] {
   opacity: 75%;
 }
@@ -263,13 +286,20 @@
   text-align: right;
 }
 
+.jp-DirListing-itemFileSize {
+  flex: 0 0 90px;
+  text-align: right;
+}
+
 .jp-DirListing-editor {
   flex: 1 0 64px;
   outline: none;
   border: none;
+  color: var(--jp-ui-font-color1);
+  background-color: var(--jp-layout-color1);
 }
 
-.jp-DirListing-item.jp-mod-running .jp-DirListing-itemIcon:before {
+.jp-DirListing-item.jp-mod-running .jp-DirListing-itemIcon::before {
   color: var(--jp-success-color1);
   content: '\25CF';
   font-size: 8px;
@@ -278,7 +308,7 @@
 }
 
 .jp-DirListing-item.jp-mod-running.jp-mod-selected
-  .jp-DirListing-itemIcon:before {
+  .jp-DirListing-itemIcon::before {
   color: var(--jp-ui-inverse-font-color1);
 }
 
@@ -290,20 +320,11 @@
   width: 160px;
   background-color: var(--jp-ui-inverse-font-color2);
   box-shadow: var(--jp-elevation-z2);
-  border-radius: 0px;
+  border-radius: 0;
   color: var(--jp-ui-font-color1);
   transform: translateX(-40%) translateY(-58%);
 }
 
-.jp-DirListing-deadSpace {
-  flex: 1 1 auto;
-  margin: 0;
-  padding: 0;
-  list-style-type: none;
-  overflow: auto;
-  background-color: var(--jp-layout-color1);
-}
-
 .jp-Document {
   min-width: 120px;
   min-height: 120px;

package/lib/search.d.ts

@@ -1,15 +0,0 @@
-import { ReactWidget } from '@jupyterlab/ui-components';
-import { DirListing } from './listing';
-/**
- * The class name added to the filebrowser crumbs node.
- */
-export interface IFilterBoxProps {
-    listing: DirListing;
-    useFuzzyFilter: boolean;
-    placeholder?: string;
-    forceRefresh?: boolean;
-}
-/**
- * A widget which hosts a input textbox to filter on file names.
- */
-export declare const FilenameSearcher: (props: IFilterBoxProps) => ReactWidget;

package/lib/search.js

@@ -1,92 +0,0 @@
-// Copyright (c) Jupyter Development Team.
-// Distributed under the terms of the Modified BSD License.
-import { InputGroup, ReactWidget } from '@jupyterlab/ui-components';
-import { StringExt } from '@lumino/algorithm';
-import React, { useEffect, useState } from 'react';
-/**
- * Perform a fuzzy search on a single item.
- */
-function fuzzySearch(source, query) {
-    // Set up the match score and indices array.
-    let score = Infinity;
-    let indices = null;
-    // The regex for search word boundaries
-    const rgx = /\b\w/g;
-    let continueSearch = true;
-    // Search the source by word boundary.
-    while (continueSearch) {
-        // Find the next word boundary in the source.
-        let rgxMatch = rgx.exec(source);
-        // Break if there is no more source context.
-        if (!rgxMatch) {
-            break;
-        }
-        // Run the string match on the relevant substring.
-        let match = StringExt.matchSumOfDeltas(source, query, rgxMatch.index);
-        // Break if there is no match.
-        if (!match) {
-            break;
-        }
-        // Update the match if the score is better.
-        if (match && match.score <= score) {
-            score = match.score;
-            indices = match.indices;
-        }
-    }
-    // Bail if there was no match.
-    if (!indices || score === Infinity) {
-        return null;
-    }
-    // Handle a split match.
-    return {
-        score,
-        indices
-    };
-}
-const FilterBox = (props) => {
-    const [filter, setFilter] = useState('');
-    if (props.forceRefresh) {
-        useEffect(() => {
-            props.listing.model.setFilter((item) => {
-                return true;
-            });
-        }, []);
-    }
-    /**
-     * Handler for search input changes.
-     */
-    const handleChange = (e) => {
-        const target = e.target;
-        setFilter(target.value);
-        props.listing.model.setFilter((item) => {
-            if (props.useFuzzyFilter) {
-                // Run the fuzzy search for the item and query.
-                const name = item.name.toLowerCase();
-                const query = target.value.toLowerCase();
-                let score = fuzzySearch(name, query);
-                // Ignore the item if it is not a match.
-                if (!score) {
-                    item.indices = [];
-                    return false;
-                }
-                item.indices = score.indices;
-                return true;
-            }
-            const i = item.name.indexOf(target.value);
-            if (i === -1) {
-                item.indices = [];
-                return false;
-            }
-            item.indices = [...Array(target.value.length).keys()].map(x => x + i);
-            return true;
-        });
-    };
-    return (React.createElement(InputGroup, { type: "text", rightIcon: "ui-components:search", placeholder: props.placeholder, onChange: handleChange, value: filter }));
-};
-/**
- * A widget which hosts a input textbox to filter on file names.
- */
-export const FilenameSearcher = (props) => {
-    return ReactWidget.create(React.createElement(FilterBox, { listing: props.listing, useFuzzyFilter: props.useFuzzyFilter, placeholder: props.placeholder, forceRefresh: props.forceRefresh }));
-};
-//# sourceMappingURL=search.js.map

package/lib/search.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"search.js","sourceRoot":"","sources":["../src/search.tsx"],"names":[],"mappings":"AAAA,0CAA0C;AAC1C,2DAA2D;AAG3D,OAAO,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AACpE,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AA4BnD;;GAEG;AACH,SAAS,WAAW,CAAC,MAAc,EAAE,KAAa;IAChD,4CAA4C;IAC5C,IAAI,KAAK,GAAG,QAAQ,CAAC;IACrB,IAAI,OAAO,GAAoB,IAAI,CAAC;IAEpC,uCAAuC;IACvC,MAAM,GAAG,GAAG,OAAO,CAAC;IAEpB,IAAI,cAAc,GAAG,IAAI,CAAC;IAE1B,sCAAsC;IACtC,OAAO,cAAc,EAAE;QACrB,6CAA6C;QAC7C,IAAI,QAAQ,GAAG,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;QAEhC,4CAA4C;QAC5C,IAAI,CAAC,QAAQ,EAAE;YACb,MAAM;SACP;QAED,kDAAkD;QAClD,IAAI,KAAK,GAAG,SAAS,CAAC,gBAAgB,CAAC,MAAM,EAAE,KAAK,EAAE,QAAQ,CAAC,KAAK,CAAC,CAAC;QAEtE,8BAA8B;QAC9B,IAAI,CAAC,KAAK,EAAE;YACV,MAAM;SACP;QAED,2CAA2C;QAC3C,IAAI,KAAK,IAAI,KAAK,CAAC,KAAK,IAAI,KAAK,EAAE;YACjC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC;YACpB,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;SACzB;KACF;IAED,8BAA8B;IAC9B,IAAI,CAAC,OAAO,IAAI,KAAK,KAAK,QAAQ,EAAE;QAClC,OAAO,IAAI,CAAC;KACb;IAED,wBAAwB;IACxB,OAAO;QACL,KAAK;QACL,OAAO;KACR,CAAC;AACJ,CAAC;AAED,MAAM,SAAS,GAAG,CAAC,KAAsB,EAAE,EAAE;IAC3C,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAEzC,IAAI,KAAK,CAAC,YAAY,EAAE;QACtB,SAAS,CAAC,GAAG,EAAE;YACb,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,IAAqB,EAAE,EAAE;gBACtD,OAAO,IAAI,CAAC;YACd,CAAC,CAAC,CAAC;QACL,CAAC,EAAE,EAAE,CAAC,CAAC;KACR;IAED;;OAEG;IACH,MAAM,YAAY,GAAG,CAAC,CAA+B,EAAE,EAAE;QACvD,MAAM,MAAM,GAAG,CAAC,CAAC,MAA0B,CAAC;QAC5C,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACxB,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,IAAqB,EAAE,EAAE;YACtD,IAAI,KAAK,CAAC,cAAc,EAAE;gBACxB,+CAA+C;gBAC/C,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC;gBACrC,MAAM,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC;gBACzC,IAAI,KAAK,GAAG,WAAW,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;gBACrC,wCAAwC;gBACxC,IAAI,CAAC,KAAK,EAAE;oBACV,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;oBAClB,OAAO,KAAK,CAAC;iBACd;gBACD,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC,OAAO,CAAC;gBAC7B,OAAO,IAAI,CAAC;aACb;YACD,MAAM,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAC1C,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE;gBACZ,IAAI,CAAC,OAAO,GAAG,EAAE,CAAC;gBAClB,OAAO,KAAK,CAAC;aACd;YACD,IAAI,CAAC,OAAO,GAAG,CAAC,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;YACtE,OAAO,IAAI,CAAC;QACd,CAAC,CAAC,CAAC;IACL,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,UAAU,IACT,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,sBAAsB,EAChC,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,QAAQ,EAAE,YAAY,EACtB,KAAK,EAAE,MAAM,GACb,CACH,CAAC;AACJ,CAAC,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,KAAsB,EAAe,EAAE;IACtE,OAAO,WAAW,CAAC,MAAM,CACvB,oBAAC,SAAS,IACR,OAAO,EAAE,KAAK,CAAC,OAAO,EACtB,cAAc,EAAE,KAAK,CAAC,cAAc,EACpC,WAAW,EAAE,KAAK,CAAC,WAAW,EAC9B,YAAY,EAAE,KAAK,CAAC,YAAY,GAChC,CACH,CAAC;AACJ,CAAC,CAAC"}