@api-client/ui 0.0.11 → 0.0.13

package/dist/pages/api-client/pages/Shared.page.js

@@ -4,46 +4,7 @@ export class SharedPage extends FilesPage {
     constructor(screen) {
         super(screen);
         this.dt.options.ariaLabel = 'Shared with you';
-    }
-    async listFiles(opts) {
-        return this.screen.bindings.store.shared.list(opts);
-    }
-    handleFileEvent(event) {
-        const typed = event;
-        if (typed.parent && typed.parent !== this.folder) {
-            return;
-        }
-        // if (typed.alt !== 'meta') {
-        //   return;
-        // }
-        switch (event.operation) {
-            case 'access-granted':
-                this.handleFileAccessGranted(typed);
-                break;
-            case 'access-removed':
-                this.handleFileAccessRemoved(typed);
-                break;
-            default: super.handleFileEvent(event);
-        }
-    }
-    async handleFileAccessGranted(event) {
-        const { key } = event;
-        try {
-            const file = await this.screen.bindings.store.files.read(key);
-            const index = this.files.findIndex(i => i.key === key);
-            if (index >= 0) {
-                this.files.splice(index, 1);
-            }
-            this.handleFileCreated(file);
-        }
-        catch (e) {
-            // eslint-disable-next-line no-console
-            console.warn(e);
-        }
-    }
-    handleFileAccessRemoved(event) {
-        const { key } = event;
-        this.removeFileFromList(key);
+        this.fs.source = 'shared';
     }
     render() {
         return html `

package/dist/pages/api-client/pages/Shared.page.js.map

@@ -1 +1 @@
-{"version":3,"file":"Shared.page.js","sourceRoot":"","sources":["../../../../src/pages/api-client/pages/Shared.page.ts"],"names":[],"mappings":"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","sourcesContent":["import { BroadcastEvent, BroadcastFileData, ContextListResult, ContextSpaceListOptions, FileAccessBroadcastEvent, IFile } from \"@api-client/core/build/browser.js\";\nimport { html, TemplateResult } from \"lit\";\nimport type ApiClientScreen from \"../ApiClient.screen.js\";\nimport { FilesPage } from \"./Files.page.js\";\n\nexport class SharedPage extends FilesPage {\n  constructor(screen: ApiClientScreen) {\n    super(screen);\n    this.dt.options.ariaLabel = 'Shared with you';\n  }\n\n  protected override async listFiles(opts: ContextSpaceListOptions): Promise<ContextListResult<IFile>> {\n    return this.screen.bindings.store.shared.list(opts);\n  }\n\n  override handleFileEvent(event: BroadcastEvent): void {\n    const typed = event as BroadcastEvent & BroadcastFileData;\n    if (typed.parent && typed.parent !== this.folder) {\n      return;\n    }\n    // if (typed.alt !== 'meta') {\n    //   return;\n    // }\n    switch (event.operation) {\n      case 'access-granted': this.handleFileAccessGranted(typed as FileAccessBroadcastEvent); break;\n      case 'access-removed': this.handleFileAccessRemoved(typed as FileAccessBroadcastEvent); break;\n      default: super.handleFileEvent(event);\n    }\n  }\n\n  async handleFileAccessGranted(event: FileAccessBroadcastEvent): Promise<void> {\n    const { key } = event;\n    try {\n      const file = await this.screen.bindings.store.files.read(key);\n      const index = this.files.findIndex(i => i.key === key);\n      if (index >= 0) {\n        this.files.splice(index, 1);\n      }\n      this.handleFileCreated(file);\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.warn(e);\n    }\n  }\n\n  handleFileAccessRemoved(event: FileAccessBroadcastEvent): void {\n    const { key } = event;\n    this.removeFileFromList(key);\n  }\n\n  override render(): TemplateResult {\n    return html`\n    <div class=\"section-header\">\n      <h2 class=\"headline-small\">Shared with you</h2>\n      ${this.renderBreadcrumbs()}\n    </div>\n    ${this.renderFilesTable()}\n    `;\n  }\n\n  protected override renderEmptyTable(): TemplateResult {\n    return html`\n    <p>You have no shared files.</p>\n    <p>Files will appear here once someone share them with you.</p>\n    `;\n  }\n\n  protected override renderTableHeader(): TemplateResult[] {\n    const result: TemplateResult[] = [];\n    result.push(this.dt.header('Name', { class: 'name-cell' }));\n    result.push(this.dt.header('Owner', { class: 'owner-cell' }));\n    result.push(this.dt.header('Updated', { class: 'updated-cell' }));\n    return result;\n  }\n\n  protected override renderTableItem(item: IFile): TemplateResult[] {\n    const result: TemplateResult[] = [];\n    result.push(this.nameCell(item));\n    result.push(this.ownerCell(item));\n    result.push(this.updatedCell(item));\n    return result;\n  }\n}\n"]}
+{"version":3,"file":"Shared.page.js","sourceRoot":"","sources":["../../../../src/pages/api-client/pages/Shared.page.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAE5C,MAAM,OAAO,UAAW,SAAQ,SAAS;IACvC,YAAY,MAAuB;QACjC,KAAK,CAAC,MAAM,CAAC,CAAC;QACd,IAAI,CAAC,EAAE,CAAC,OAAO,CAAC,SAAS,GAAG,iBAAiB,CAAC;QAC9C,IAAI,CAAC,EAAE,CAAC,MAAM,GAAG,QAAQ,CAAC;IAC5B,CAAC;IAEQ,MAAM;QACb,OAAO,IAAI,CAAA;;;QAGP,IAAI,CAAC,iBAAiB,EAAE;;MAE1B,IAAI,CAAC,gBAAgB,EAAE;KACxB,CAAC;IACJ,CAAC;IAEkB,gBAAgB;QACjC,OAAO,IAAI,CAAA;;;KAGV,CAAC;IACJ,CAAC;IAEkB,iBAAiB;QAClC,MAAM,MAAM,GAAqB,EAAE,CAAC;QACpC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,WAAW,EAAE,CAAC,CAAC,CAAC;QAC5D,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,OAAO,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,CAAC,CAAC;QAC9D,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,SAAS,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC,CAAC,CAAC;QAClE,OAAO,MAAM,CAAC;IAChB,CAAC;IAEkB,eAAe,CAAC,IAAW;QAC5C,MAAM,MAAM,GAAqB,EAAE,CAAC;QACpC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC;QACjC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CAAC;QAClC,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC;QACpC,OAAO,MAAM,CAAC;IAChB,CAAC;CACF","sourcesContent":["import { IFile } from \"@api-client/core/build/browser.js\";\nimport { html, TemplateResult } from \"lit\";\nimport type ApiClientScreen from \"../ApiClient.screen.js\";\nimport { FilesPage } from \"./Files.page.js\";\n\nexport class SharedPage extends FilesPage {\n  constructor(screen: ApiClientScreen) {\n    super(screen);\n    this.dt.options.ariaLabel = 'Shared with you';\n    this.fs.source = 'shared';\n  }\n\n  override render(): TemplateResult {\n    return html`\n    <div class=\"section-header\">\n      <h2 class=\"headline-small\">Shared with you</h2>\n      ${this.renderBreadcrumbs()}\n    </div>\n    ${this.renderFilesTable()}\n    `;\n  }\n\n  protected override renderEmptyTable(): TemplateResult {\n    return html`\n    <p>You have no shared files.</p>\n    <p>Files will appear here once someone share them with you.</p>\n    `;\n  }\n\n  protected override renderTableHeader(): TemplateResult[] {\n    const result: TemplateResult[] = [];\n    result.push(this.dt.header('Name', { class: 'name-cell' }));\n    result.push(this.dt.header('Owner', { class: 'owner-cell' }));\n    result.push(this.dt.header('Updated', { class: 'updated-cell' }));\n    return result;\n  }\n\n  protected override renderTableItem(item: IFile): TemplateResult[] {\n    const result: TemplateResult[] = [];\n    result.push(this.nameCell(item));\n    result.push(this.ownerCell(item));\n    result.push(this.updatedCell(item));\n    return result;\n  }\n}\n"]}

package/dist/pages/demo/DemoPage.d.ts

@@ -1,5 +1,6 @@
 import { TemplateResult, CSSResult } from 'lit';
 import '../../define/ui/ui-icon.js';
+import '../../define/ui/ui-button.js';
 declare const DemoPage_base: (new (...args: any[]) => import("../../mixins/RouteMixin.js").RouteMixinInterface) & (new (...args: any[]) => import("../../mixins/RenderableMixin.js").RenderableMixinInterface) & {
     new (): EventTarget;
     prototype: EventTarget;
@@ -22,6 +23,10 @@ export declare abstract class DemoPage extends DemoPage_base {
      * Whether or not the dark theme is active
      */
     darkThemeActive: boolean;
+    /**
+     * For some demo pages, whether the user is authenticated in the store.
+     */
+    authenticated: boolean;
     constructor();
     /**
      * Initializes media queries and observers.
@@ -69,6 +74,8 @@ export declare abstract class DemoPage extends DemoPage_base {
      * ```
      */
     abstract contentTemplate(): TemplateResult;
+    handleAuthenticate(): void;
+    authenticateTemplate(): TemplateResult;
 }
 export {};
 //# sourceMappingURL=DemoPage.d.ts.map

package/dist/pages/demo/DemoPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DemoPage.d.ts","sourceRoot":"","sources":["../../../src/pages/demo/DemoPage.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AAStD,OAAO,4BAA4B,CAAC;;;;;AAEpC;;GAEG;AACH,8BAAsB,QAAS,SAAQ,aAAwC;IAC7E,MAAM,KAAK,MAAM,IAAI,SAAS,EAAE,CAE/B;IAED;;OAEG;IACS,aAAa,SAAM;IAE/B;;;OAGG;IACM,aAAa,UAAS;IAE/B;;OAEG;IACS,eAAe,UAAS;;IAUpC;;OAEG;IACH,gBAAgB,IAAI,IAAI;IASxB,SAAS,CAAC,gBAAgB,CAAC,CAAC,EAAE,mBAAmB,GAAG,IAAI;IAKxD;;;;;;;OAOG;IACH,SAAS,CAAC,mBAAmB,IAAI,IAAI;IASrC,SAAS,CAAC,aAAa,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI;IAgBrD;;;;;;OAMG;IACH,SAAS,CAAC,oBAAoB,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAMxC,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;IAOjC;;;OAGG;IACM,YAAY,IAAI,cAAc;IASvC;;;OAGG;IACH,cAAc,IAAI,cAAc;IAQhC,kBAAkB,IAAI,cAAc;IAIpC;;;;;;;;;OASG;IACH,QAAQ,CAAC,eAAe,IAAI,cAAc;CAC3C"}
+{"version":3,"file":"DemoPage.d.ts","sourceRoot":"","sources":["../../../src/pages/demo/DemoPage.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC;AAStD,OAAO,4BAA4B,CAAC;AACpC,OAAO,8BAA8B,CAAC;;;;;AAEtC;;GAEG;AACH,8BAAsB,QAAS,SAAQ,aAAwC;IAC7E,MAAM,KAAK,MAAM,IAAI,SAAS,EAAE,CAE/B;IAED;;OAEG;IACS,aAAa,SAAM;IAE/B;;;OAGG;IACM,aAAa,UAAS;IAE/B;;OAEG;IACS,eAAe,UAAS;IAEpC;;OAEG;IACH,aAAa,UAAS;;IAUtB;;OAEG;IACH,gBAAgB,IAAI,IAAI;IASxB,SAAS,CAAC,gBAAgB,CAAC,CAAC,EAAE,mBAAmB,GAAG,IAAI;IAKxD;;;;;;;OAOG;IACH,SAAS,CAAC,mBAAmB,IAAI,IAAI;IASrC,SAAS,CAAC,aAAa,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,GAAG,IAAI;IAgBrD;;;;;;OAMG;IACH,SAAS,CAAC,oBAAoB,CAAC,CAAC,EAAE,KAAK,GAAG,IAAI;IAMxC,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC;IAOjC;;;OAGG;IACM,YAAY,IAAI,cAAc;IASvC;;;OAGG;IACH,cAAc,IAAI,cAAc;IAQhC,kBAAkB,IAAI,cAAc;IAIpC;;;;;;;;;OASG;IACH,QAAQ,CAAC,eAAe,IAAI,cAAc;IAE1C,kBAAkB,IAAI,IAAI;IAI1B,oBAAoB,IAAI,cAAc;CAMvC"}

package/dist/pages/demo/DemoPage.js

@@ -8,6 +8,7 @@ import * as MonacoLoader from "../../monaco/loader.js";
 import typography from "../../styles/m3/typography.module.js";
 import surface from "../../styles/m3/surface.module.js";
 import '../../define/ui/ui-icon.js';
+import '../../define/ui/ui-button.js';
 /**
  * A base class for demo pages in the API Client ecosystem.
  */
@@ -30,6 +31,10 @@ export class DemoPage extends RouteMixin(RenderableMixin(EventTarget)) {
          * Whether or not the dark theme is active
          */
         this.darkThemeActive = false;
+        /**
+         * For some demo pages, whether the user is authenticated in the store.
+         */
+        this.authenticated = false;
         this.handleMediaQuery = this.handleMediaQuery.bind(this);
         this.initMediaQueries();
         document.body.classList.add('demo');
@@ -125,6 +130,15 @@ export class DemoPage extends RouteMixin(RenderableMixin(EventTarget)) {
     navigationTemplate() {
         return html ``;
     }
+    handleAuthenticate() {
+        // ...
+    }
+    authenticateTemplate() {
+        return html `
+    <p>Store authorization required.</p>
+    <ui-button @click="${this.handleAuthenticate}">Authenticate</ui-button>
+    `;
+    }
 }
 __decorate([
     reactive()

package/dist/pages/demo/DemoPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"DemoPage.js","sourceRoot":"","sources":["../../../src/pages/demo/DemoPage.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, TemplateResult, CSSResult } from 'lit';\nimport { RenderableMixin } from '../../mixins/RenderableMixin.js';\nimport { reactive } from '../../lib/decorators.js';\nimport styles from './DemoStyles.js';\nimport { RouteMixin } from '../../mixins/RouteMixin.js';\nimport * as MonacoLoader from \"../../monaco/loader.js\";\nimport CheckboxElement from '../../ui/input/CheckboxElement.js';\nimport typography from \"../../styles/m3/typography.module.js\";\nimport surface from \"../../styles/m3/surface.module.js\";\nimport '../../define/ui/ui-icon.js';\n\n/**\n * A base class for demo pages in the API Client ecosystem.\n */\nexport abstract class DemoPage extends RouteMixin(RenderableMixin(EventTarget)) {\n  static get styles(): CSSResult[] {\n    return [typography, styles, surface];\n  }\n\n  /**\n   * Component name rendered in the header section.\n   */\n  @reactive() componentName = '';\n\n  /**\n   * Determines whether the initial render had run and the `firstRender()`\n   * function was called.\n   */\n  override firstRendered = false;\n\n  /**\n   * Whether or not the dark theme is active\n   */\n  @reactive() darkThemeActive = false;\n\n  constructor() {\n    super();\n    this.handleMediaQuery = this.handleMediaQuery.bind(this);\n    this.initMediaQueries();\n\n    document.body.classList.add('demo');\n  }\n\n  /**\n   * Initializes media queries and observers.\n   */\n  initMediaQueries(): void {\n    const matcher = window.matchMedia('(prefers-color-scheme: dark)');\n    if (matcher.matches) {\n      this.darkThemeActive = true;\n    }\n    this.themeActiveCallback();\n    matcher.addEventListener('change', this.handleMediaQuery);\n  }\n\n  protected handleMediaQuery(e: MediaQueryListEvent): void {\n    this.darkThemeActive = e.matches;\n    this.themeActiveCallback();\n  }\n\n  /**\n   * The callback is called when the `darkThemeActive` property change.\n   * Overwrite this function to change the theme of the demo page.\n   * \n   * Note, this is not called by the `darkThemeActive` setter. This is called during the \n   * initialization and then when the media query event is dispatched.\n   * Call this manually when changing this value in the child page.\n   */\n  protected themeActiveCallback(): void {\n    const { darkThemeActive } = this;\n    if (darkThemeActive) {\n      this.activateTheme('dark');\n    } else {\n      this.activateTheme('light');\n    }\n  }\n\n  protected activateTheme(type: 'light' | 'dark'): void {\n    const root = document.querySelector('html');\n    if (!root) {\n      return;\n    }\n    const { classList } = root;\n    // clear all themes\n    classList.forEach((value) => {\n      if (value.startsWith('theme-')) {\n        classList.remove(value);\n      }\n    });\n    const name = `theme-${type}`;\n    classList.add(name);\n  }\n\n  /**\n   * A handler for the `change` event for an element that has `checked` and `name` properties.\n   * This can be used with `ui-switch`, `ui-checkbox`, and `checkbox` elements.\n   *\n   * The `name` should correspond to a variable name to be set. The set value is the value\n   * of `checked` property read from the event's target.\n   */\n  protected _toggleBooleanOption(e: Event): void {\n    const { name, checked } = e.target as CheckboxElement;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (this as any)[name as string] = checked;\n  }\n\n  async loadMonaco(): Promise<void> {\n    const base = new URL('/node_modules/monaco-editor/', window.location.href).toString();\n    MonacoLoader.createEnvironment(base);\n    await MonacoLoader.loadMonaco(base);\n    await MonacoLoader.monacoReady();\n  }\n\n  /**\n   * The page render function. Usually you don't need to use it.\n   * It renders the header template, main section, and the content.\n   */\n  override pageTemplate(): TemplateResult {\n    return html`\n    ${this.headerTemplate()}\n    ${this.navigationTemplate()}\n    <main>\n      ${this.contentTemplate()}\n    </main>`;\n  }\n\n  /**\n   * Call this on the top of the `render()` method to render demo navigation\n   * @returns HTML template for demo header\n   */\n  headerTemplate(): TemplateResult {\n    const { componentName } = this;\n    return html`\n    <header>\n      ${componentName ? html`<h1 class=\"api-title\">${componentName}</h1>` : ''}\n    </header>`;\n  }\n\n  navigationTemplate(): TemplateResult {\n    return html``;\n  }\n\n  /**\n   * Abstract method. When not overriding `render()` method you can use\n   * this function to render content inside the standard API components layout.\n   *\n   * ```\n   * contentTemplate() {\n   *  return html`<p>Demo content</p>`;\n   * }\n   * ```\n   */\n  abstract contentTemplate(): TemplateResult;\n}\n"]}
+{"version":3,"file":"DemoPage.js","sourceRoot":"","sources":["../../../src/pages/demo/DemoPage.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAA6B,MAAM,KAAK,CAAC;AACtD,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACnD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,KAAK,YAAY,MAAM,wBAAwB,CAAC;AAEvD,OAAO,UAAU,MAAM,sCAAsC,CAAC;AAC9D,OAAO,OAAO,MAAM,mCAAmC,CAAC;AACxD,OAAO,4BAA4B,CAAC;AACpC,OAAO,8BAA8B,CAAC;AAEtC;;GAEG;AACH,MAAM,OAAgB,QAAS,SAAQ,UAAU,CAAC,eAAe,CAAC,WAAW,CAAC,CAAC;IAC7E,MAAM,KAAK,MAAM;QACf,OAAO,CAAC,UAAU,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;IACvC,CAAC;IAuBD;QACE,KAAK,EAAE,CAAC;QAtBV;;WAEG;QACS,kBAAa,GAAG,EAAE,CAAC;QAE/B;;;WAGG;QACM,kBAAa,GAAG,KAAK,CAAC;QAE/B;;WAEG;QACS,oBAAe,GAAG,KAAK,CAAC;QAEpC;;WAEG;QACH,kBAAa,GAAG,KAAK,CAAC;QAIpB,IAAI,CAAC,gBAAgB,GAAG,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACzD,IAAI,CAAC,gBAAgB,EAAE,CAAC;QAExB,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;IACtC,CAAC;IAED;;OAEG;IACH,gBAAgB;QACd,MAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC;QAClE,IAAI,OAAO,CAAC,OAAO,EAAE;YACnB,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;SAC7B;QACD,IAAI,CAAC,mBAAmB,EAAE,CAAC;QAC3B,OAAO,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;IAC5D,CAAC;IAES,gBAAgB,CAAC,CAAsB;QAC/C,IAAI,CAAC,eAAe,GAAG,CAAC,CAAC,OAAO,CAAC;QACjC,IAAI,CAAC,mBAAmB,EAAE,CAAC;IAC7B,CAAC;IAED;;;;;;;OAOG;IACO,mBAAmB;QAC3B,MAAM,EAAE,eAAe,EAAE,GAAG,IAAI,CAAC;QACjC,IAAI,eAAe,EAAE;YACnB,IAAI,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;SAC5B;aAAM;YACL,IAAI,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;SAC7B;IACH,CAAC;IAES,aAAa,CAAC,IAAsB;QAC5C,MAAM,IAAI,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC;QAC5C,IAAI,CAAC,IAAI,EAAE;YACT,OAAO;SACR;QACD,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;QAC3B,mBAAmB;QACnB,SAAS,CAAC,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE;YAC1B,IAAI,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC,EAAE;gBAC9B,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;aACzB;QACH,CAAC,CAAC,CAAC;QACH,MAAM,IAAI,GAAG,SAAS,IAAI,EAAE,CAAC;QAC7B,SAAS,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IACtB,CAAC;IAED;;;;;;OAMG;IACO,oBAAoB,CAAC,CAAQ;QACrC,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,GAAG,CAAC,CAAC,MAAyB,CAAC;QACtD,8DAA8D;QAC7D,IAAY,CAAC,IAAc,CAAC,GAAG,OAAO,CAAC;IAC1C,CAAC;IAED,KAAK,CAAC,UAAU;QACd,MAAM,IAAI,GAAG,IAAI,GAAG,CAAC,8BAA8B,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,CAAC;QACtF,YAAY,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC;QACrC,MAAM,YAAY,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QACpC,MAAM,YAAY,CAAC,WAAW,EAAE,CAAC;IACnC,CAAC;IAED;;;OAGG;IACM,YAAY;QACnB,OAAO,IAAI,CAAA;MACT,IAAI,CAAC,cAAc,EAAE;MACrB,IAAI,CAAC,kBAAkB,EAAE;;QAEvB,IAAI,CAAC,eAAe,EAAE;YAClB,CAAC;IACX,CAAC;IAED;;;OAGG;IACH,cAAc;QACZ,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC;QAC/B,OAAO,IAAI,CAAA;;QAEP,aAAa,CAAC,CAAC,CAAC,IAAI,CAAA,yBAAyB,aAAa,OAAO,CAAC,CAAC,CAAC,EAAE;cAChE,CAAC;IACb,CAAC;IAED,kBAAkB;QAChB,OAAO,IAAI,CAAA,EAAE,CAAC;IAChB,CAAC;IAcD,kBAAkB;QAChB,MAAM;IACR,CAAC;IAED,oBAAoB;QAClB,OAAO,IAAI,CAAA;;yBAEU,IAAI,CAAC,kBAAkB;KAC3C,CAAC;IACJ,CAAC;CACF;AAnJa;IAAX,QAAQ,EAAE;+CAAoB;AAWnB;IAAX,QAAQ,EAAE;iDAAyB","sourcesContent":["import { html, TemplateResult, CSSResult } from 'lit';\nimport { RenderableMixin } from '../../mixins/RenderableMixin.js';\nimport { reactive } from '../../lib/decorators.js';\nimport styles from './DemoStyles.js';\nimport { RouteMixin } from '../../mixins/RouteMixin.js';\nimport * as MonacoLoader from \"../../monaco/loader.js\";\nimport CheckboxElement from '../../ui/input/CheckboxElement.js';\nimport typography from \"../../styles/m3/typography.module.js\";\nimport surface from \"../../styles/m3/surface.module.js\";\nimport '../../define/ui/ui-icon.js';\nimport '../../define/ui/ui-button.js';\n\n/**\n * A base class for demo pages in the API Client ecosystem.\n */\nexport abstract class DemoPage extends RouteMixin(RenderableMixin(EventTarget)) {\n  static get styles(): CSSResult[] {\n    return [typography, styles, surface];\n  }\n\n  /**\n   * Component name rendered in the header section.\n   */\n  @reactive() componentName = '';\n\n  /**\n   * Determines whether the initial render had run and the `firstRender()`\n   * function was called.\n   */\n  override firstRendered = false;\n\n  /**\n   * Whether or not the dark theme is active\n   */\n  @reactive() darkThemeActive = false;\n\n  /**\n   * For some demo pages, whether the user is authenticated in the store.\n   */\n  authenticated = false;\n\n  constructor() {\n    super();\n    this.handleMediaQuery = this.handleMediaQuery.bind(this);\n    this.initMediaQueries();\n\n    document.body.classList.add('demo');\n  }\n\n  /**\n   * Initializes media queries and observers.\n   */\n  initMediaQueries(): void {\n    const matcher = window.matchMedia('(prefers-color-scheme: dark)');\n    if (matcher.matches) {\n      this.darkThemeActive = true;\n    }\n    this.themeActiveCallback();\n    matcher.addEventListener('change', this.handleMediaQuery);\n  }\n\n  protected handleMediaQuery(e: MediaQueryListEvent): void {\n    this.darkThemeActive = e.matches;\n    this.themeActiveCallback();\n  }\n\n  /**\n   * The callback is called when the `darkThemeActive` property change.\n   * Overwrite this function to change the theme of the demo page.\n   * \n   * Note, this is not called by the `darkThemeActive` setter. This is called during the \n   * initialization and then when the media query event is dispatched.\n   * Call this manually when changing this value in the child page.\n   */\n  protected themeActiveCallback(): void {\n    const { darkThemeActive } = this;\n    if (darkThemeActive) {\n      this.activateTheme('dark');\n    } else {\n      this.activateTheme('light');\n    }\n  }\n\n  protected activateTheme(type: 'light' | 'dark'): void {\n    const root = document.querySelector('html');\n    if (!root) {\n      return;\n    }\n    const { classList } = root;\n    // clear all themes\n    classList.forEach((value) => {\n      if (value.startsWith('theme-')) {\n        classList.remove(value);\n      }\n    });\n    const name = `theme-${type}`;\n    classList.add(name);\n  }\n\n  /**\n   * A handler for the `change` event for an element that has `checked` and `name` properties.\n   * This can be used with `ui-switch`, `ui-checkbox`, and `checkbox` elements.\n   *\n   * The `name` should correspond to a variable name to be set. The set value is the value\n   * of `checked` property read from the event's target.\n   */\n  protected _toggleBooleanOption(e: Event): void {\n    const { name, checked } = e.target as CheckboxElement;\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    (this as any)[name as string] = checked;\n  }\n\n  async loadMonaco(): Promise<void> {\n    const base = new URL('/node_modules/monaco-editor/', window.location.href).toString();\n    MonacoLoader.createEnvironment(base);\n    await MonacoLoader.loadMonaco(base);\n    await MonacoLoader.monacoReady();\n  }\n\n  /**\n   * The page render function. Usually you don't need to use it.\n   * It renders the header template, main section, and the content.\n   */\n  override pageTemplate(): TemplateResult {\n    return html`\n    ${this.headerTemplate()}\n    ${this.navigationTemplate()}\n    <main>\n      ${this.contentTemplate()}\n    </main>`;\n  }\n\n  /**\n   * Call this on the top of the `render()` method to render demo navigation\n   * @returns HTML template for demo header\n   */\n  headerTemplate(): TemplateResult {\n    const { componentName } = this;\n    return html`\n    <header>\n      ${componentName ? html`<h1 class=\"api-title\">${componentName}</h1>` : ''}\n    </header>`;\n  }\n\n  navigationTemplate(): TemplateResult {\n    return html``;\n  }\n\n  /**\n   * Abstract method. When not overriding `render()` method you can use\n   * this function to render content inside the standard API components layout.\n   *\n   * ```\n   * contentTemplate() {\n   *  return html`<p>Demo content</p>`;\n   * }\n   * ```\n   */\n  abstract contentTemplate(): TemplateResult;\n\n  handleAuthenticate(): void {\n    // ...\n  }\n\n  authenticateTemplate(): TemplateResult {\n    return html`\n    <p>Store authorization required.</p>\n    <ui-button @click=\"${this.handleAuthenticate}\">Authenticate</ui-button>\n    `;\n  }\n}\n"]}

package/dist/store/FileSystem.d.ts

@@ -0,0 +1,90 @@
+import { ContextListResult, ContextSpaceListOptions, DeletedBroadcastEvent, FileAccessBroadcastEvent, FileBreadcrumb, FilePatchBroadcastEvent, IFile, ListFileKind } from "@api-client/core/build/browser.js";
+type FilesSource = 'own' | 'shared';
+/**
+ * Contains a logic to read files from the store.
+ *
+ * It uses app events to query for the data.
+ */
+export declare class FileSystem extends EventTarget {
+    source: FilesSource;
+    /**
+     * The list of files to render.
+     * Do not overwrite this property or when you must then update the DataTable's `items` as well.
+     */
+    files: IFile[];
+    /**
+     * The pagination cursor for files.
+     */
+    cursor?: string;
+    /**
+     * This is set when the last files query did not yeld results.
+     */
+    queryEnded?: boolean;
+    /**
+     * The currently rendered breadcrumbs.
+     */
+    breadcrumbs?: FileBreadcrumb[];
+    /**
+     * Whether the UI is reading files
+     */
+    reading?: boolean;
+    /**
+     * The list of file kinds to list.
+     * Folders are always included.
+     */
+    kinds?: ListFileKind[];
+    /**
+     * The timeout for the query debouncer.
+     * When any property change this is the time the element will wait
+     * until the actual query is made.
+     */
+    debounceTimeout: number;
+    debouncerValue?: number;
+    /**
+     * The variable parent folder key.
+     * This is set when interacting with the UI or when the `folder` attribute change.
+     */
+    parent?: string;
+    /**
+     * The page limit. Defaults to the store defaults.
+     * @attribute
+     */
+    limit?: number;
+    filesChannel: BroadcastChannel;
+    eventsTarget: EventTarget;
+    constructor();
+    observe(): void;
+    unobserve(): void;
+    fileMetaMessageHandler(e: MessageEvent): void;
+    handleFileCreated(file: IFile): void;
+    handleFileDeleted(event: DeletedBroadcastEvent): void;
+    handleFileAccessGranted(event: FileAccessBroadcastEvent): Promise<void>;
+    handleFileAccessRemoved(event: FileAccessBroadcastEvent): void;
+    removeFileFromList(key: string): void;
+    handleFilePatch(event: FilePatchBroadcastEvent): void;
+    debounceQuery(): void;
+    resetList(): void;
+    queryPage(): Promise<void>;
+    queryBreadcrumbs(): Promise<void>;
+    getPageQueryOptions(): ContextSpaceListOptions;
+    listFiles(): Promise<ContextListResult<IFile>>;
+    listBreadcrumbs(folder: string): Promise<ContextListResult<FileBreadcrumb>>;
+    notifyError(error: string): void;
+    notifyUpdate(): void;
+    /**
+     * Sets a parent and makes the query.
+     * @param key The key of the parent to query. Empty for root folder.
+     */
+    selectFolder(key?: string): void;
+    /**
+     * Moves to a parent folder, if any.
+     */
+    parentUp(): Promise<void>;
+    /**
+     * @param target The HTML element that is a scrollable list if files.
+     * @returns True when the scroll position indicates that the user scrolled near the end of the list.
+     */
+    isListEnd(target: HTMLElement): boolean;
+}
+export {};
+//# sourceMappingURL=FileSystem.d.ts.map

package/dist/store/FileSystem.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileSystem.d.ts","sourceRoot":"","sources":["../../src/store/FileSystem.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EACjB,uBAAuB,EACvB,qBAAqB,EACrB,wBAAwB,EACxB,cAAc,EAEd,uBAAuB,EACvB,KAAK,EACL,YAAY,EACb,MAAM,mCAAmC,CAAC;AAM3C,KAAK,WAAW,GAAG,KAAK,GAAG,QAAQ,CAAC;AAEpC;;;;GAIG;AACH,qBAAa,UAAW,SAAQ,WAAW;IACzC,MAAM,EAAE,WAAW,CAAS;IAE5B;;;OAGG;IACH,KAAK,EAAE,KAAK,EAAE,CAAM;IAEpB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB;;OAEG;IACH,WAAW,CAAC,EAAE,cAAc,EAAE,CAAC;IAE/B;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;OAGG;IACH,KAAK,CAAC,EAAE,YAAY,EAAE,CAAC;IAEvB;;;;OAIG;IACH,eAAe,SAAO;IAEtB,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,YAAY,mBAA8C;IAE1D,YAAY,EAAE,WAAW,CAAiB;;IAO1C,OAAO,IAAI,IAAI;IAIf,SAAS,IAAI,IAAI;IAIjB,sBAAsB,CAAC,CAAC,EAAE,YAAY,GAAG,IAAI;IAkB7C,iBAAiB,CAAC,IAAI,EAAE,KAAK,GAAG,IAAI;IAOpC,iBAAiB,CAAC,KAAK,EAAE,qBAAqB,GAAG,IAAI;IAI/C,uBAAuB,CAAC,KAAK,EAAE,wBAAwB,GAAG,OAAO,CAAC,IAAI,CAAC;IAkB7E,uBAAuB,CAAC,KAAK,EAAE,wBAAwB,GAAG,IAAI;IAQ9D,kBAAkB,CAAC,GAAG,EAAE,MAAM,GAAG,IAAI;IAUrC,eAAe,CAAC,KAAK,EAAE,uBAAuB,GAAG,IAAI;IAYrD,aAAa,IAAI,IAAI;IAUrB,SAAS,IAAI,IAAI;IAOX,SAAS,IAAI,OAAO,CAAC,IAAI,CAAC;IAoC1B,gBAAgB,IAAI,OAAO,CAAC,IAAI,CAAC;IASvC,mBAAmB,IAAI,uBAAuB;IAkBxC,SAAS,IAAI,OAAO,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC;IAS9C,eAAe,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,iBAAiB,CAAC,cAAc,CAAC,CAAC;IAIjF,WAAW,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAMhC,YAAY,IAAI,IAAI;IAIpB;;;OAGG;IACH,YAAY,CAAC,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI;IAQhC;;OAEG;IACG,QAAQ,IAAI,OAAO,CAAC,IAAI,CAAC;IAsB/B;;;OAGG;IACH,SAAS,CAAC,MAAM,EAAE,WAAW,GAAG,OAAO;CAKxC"}

package/dist/store/FileSystem.js

@@ -0,0 +1,260 @@
+import { Patch } from "@api-client/json";
+import { filesSortFunction } from "../elements/store/FilesLib.js";
+import { Events } from "../events/Events.js";
+import { StoreBroadcast } from "../http-client/store/StoreBroadcast.js";
+/**
+ * Contains a logic to read files from the store.
+ *
+ * It uses app events to query for the data.
+ */
+export class FileSystem extends EventTarget {
+    constructor() {
+        super();
+        this.source = 'own';
+        /**
+         * The list of files to render.
+         * Do not overwrite this property or when you must then update the DataTable's `items` as well.
+         */
+        this.files = [];
+        /**
+         * The timeout for the query debouncer.
+         * When any property change this is the time the element will wait
+         * until the actual query is made.
+         */
+        this.debounceTimeout = 100;
+        this.filesChannel = new BroadcastChannel(StoreBroadcast.files);
+        this.eventsTarget = document.body;
+        this.fileMetaMessageHandler = this.fileMetaMessageHandler.bind(this);
+    }
+    observe() {
+        this.filesChannel.addEventListener('message', this.fileMetaMessageHandler);
+    }
+    unobserve() {
+        this.filesChannel.removeEventListener('message', this.fileMetaMessageHandler);
+    }
+    fileMetaMessageHandler(e) {
+        const event = e.data;
+        if (event.parent !== this.parent) {
+            return;
+        }
+        if (event.alt !== 'meta') {
+            return;
+        }
+        switch (event.operation) {
+            case 'created':
+                this.handleFileCreated(event.data);
+                break;
+            case 'deleted':
+                this.handleFileDeleted(event);
+                break;
+            case 'patch':
+                this.handleFilePatch(event);
+                break;
+            case 'access-granted':
+                this.handleFileAccessGranted(event);
+                break;
+            case 'access-removed':
+                this.handleFileAccessRemoved(event);
+                break;
+            default:
+        }
+    }
+    handleFileCreated(file) {
+        this.files.push(file);
+        // We don't sort here so files that appear at the end which makes sense because the list is scrolling.
+        // this.files.sort(filesSortFunction);
+        this.notifyUpdate();
+    }
+    handleFileDeleted(event) {
+        this.removeFileFromList(event.key);
+    }
+    async handleFileAccessGranted(event) {
+        if (this.source !== 'shared') {
+            return;
+        }
+        const { key } = event;
+        try {
+            const file = await Events.Store.File.read(key, false, this.eventsTarget);
+            const index = this.files.findIndex(i => i.key === key);
+            if (index >= 0) {
+                this.files.splice(index, 1);
+            }
+            this.handleFileCreated(file);
+        }
+        catch (e) {
+            // eslint-disable-next-line no-console
+            console.warn(e);
+        }
+    }
+    handleFileAccessRemoved(event) {
+        if (this.source !== 'shared') {
+            return;
+        }
+        const { key } = event;
+        this.removeFileFromList(key);
+    }
+    removeFileFromList(key) {
+        const index = this.files.findIndex(i => i.key === key);
+        if (index === -1) {
+            return;
+        }
+        this.files.splice(index, 1);
+        this.notifyUpdate();
+        this.dispatchEvent(new CustomEvent('delete', { detail: key }));
+    }
+    handleFilePatch(event) {
+        const { data, key } = event;
+        const index = this.files.findIndex(i => i.key === key);
+        if (index === -1) {
+            return;
+        }
+        const file = this.files[index];
+        const result = Patch.apply(file, data.patch);
+        this.files[index] = result.doc;
+        this.notifyUpdate();
+    }
+    debounceQuery() {
+        if (this.debouncerValue) {
+            clearTimeout(this.debouncerValue);
+        }
+        this.debouncerValue = window.setTimeout(() => {
+            this.queryPage();
+            this.queryBreadcrumbs();
+        }, this.debounceTimeout);
+    }
+    resetList() {
+        this.files = [];
+        this.cursor = undefined;
+        this.breadcrumbs = undefined;
+        this.queryEnded = false;
+    }
+    async queryPage() {
+        if (this.reading || this.queryEnded) {
+            return;
+        }
+        this.reading = true;
+        this.notifyUpdate();
+        try {
+            const result = await this.listFiles();
+            if (!result) {
+                throw new Error(`Files event not handled.`);
+            }
+            const { items, cursor } = result;
+            if (!items.length) {
+                this.queryEnded = true;
+            }
+            else {
+                if (!this.files.length) {
+                    // we only sort the first page as later the user scrolls and sorting would change the order.
+                    items.sort(filesSortFunction);
+                }
+                this.files = this.files.concat(items);
+            }
+            if (cursor) {
+                this.cursor = cursor;
+            }
+        }
+        catch (e) {
+            const err = e;
+            this.notifyError(`Unable to load files list. ${err.message}`);
+            // eslint-disable-next-line no-console
+            console.error(e);
+        }
+        finally {
+            this.reading = false;
+        }
+        this.dispatchEvent(new Event('querycomplete'));
+        this.notifyUpdate();
+    }
+    async queryBreadcrumbs() {
+        if (this.parent) {
+            const br = await this.listBreadcrumbs(this.parent);
+            this.breadcrumbs = br.items;
+        }
+        else {
+            this.breadcrumbs = undefined;
+        }
+    }
+    getPageQueryOptions() {
+        const { cursor: filesCursor, parent, limit } = this;
+        const opts = {
+            space: '',
+            descending: true,
+        };
+        if (filesCursor) {
+            opts.cursor = filesCursor;
+        }
+        if (parent) {
+            opts.parent = parent;
+        }
+        if (typeof limit === 'number' && limit) {
+            opts.limit = limit;
+        }
+        return opts;
+    }
+    async listFiles() {
+        const { kinds } = this;
+        const opts = this.getPageQueryOptions();
+        if (this.source === 'shared') {
+            return Events.Store.File.listShared(kinds, opts, this.eventsTarget);
+        }
+        return Events.Store.File.list(kinds, opts, this.eventsTarget);
+    }
+    async listBreadcrumbs(folder) {
+        return Events.Store.File.breadcrumbs(folder, this.eventsTarget);
+    }
+    notifyError(error) {
+        this.dispatchEvent(new CustomEvent('error', {
+            detail: error,
+        }));
+    }
+    notifyUpdate() {
+        this.dispatchEvent(new Event('change'));
+    }
+    /**
+     * Sets a parent and makes the query.
+     * @param key The key of the parent to query. Empty for root folder.
+     */
+    selectFolder(key) {
+        this.parent = key;
+        this.resetList();
+        this.debounceQuery();
+        // this.queryPage();
+        this.queryBreadcrumbs();
+    }
+    /**
+     * Moves to a parent folder, if any.
+     */
+    async parentUp() {
+        const { breadcrumbs = [] } = this;
+        const [, parent] = breadcrumbs;
+        if (!parent) {
+            if (!this.parent) {
+                return;
+            }
+            this.parent = undefined;
+        }
+        else {
+            if (this.parent === parent.key) {
+                return;
+            }
+            this.parent = parent.key;
+        }
+        this.resetList();
+        await Promise.all([
+            this.queryPage(),
+            this.queryBreadcrumbs(),
+        ]);
+        this.notifyUpdate();
+    }
+    /**
+     * @param target The HTML element that is a scrollable list if files.
+     * @returns True when the scroll position indicates that the user scrolled near the end of the list.
+     */
+    isListEnd(target) {
+        const { scrollTop, offsetHeight, scrollHeight } = target;
+        // 20 is the offset which qualifies as the end. An arbitrary number.
+        return scrollTop + offsetHeight >= scrollHeight - 20;
+    }
+}
+//# sourceMappingURL=FileSystem.js.map

package/dist/store/FileSystem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FileSystem.js","sourceRoot":"","sources":["../../src/store/FileSystem.ts"],"names":[],"mappings":"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","sourcesContent":["import { \n  BroadcastEvent,\n  BroadcastFileData,\n  ContextListResult,\n  ContextSpaceListOptions,\n  DeletedBroadcastEvent,\n  FileAccessBroadcastEvent,\n  FileBreadcrumb, \n  FileMetaCreatedBroadcastEvent, \n  FilePatchBroadcastEvent, \n  IFile,\n  ListFileKind,\n} from \"@api-client/core/build/browser.js\";\nimport { Patch } from \"@api-client/json\";\nimport { filesSortFunction } from \"../elements/store/FilesLib.js\";\nimport { Events } from \"../events/Events.js\";\nimport { StoreBroadcast } from \"../http-client/store/StoreBroadcast.js\";\n\ntype FilesSource = 'own' | 'shared';\n\n/**\n * Contains a logic to read files from the store.\n * \n * It uses app events to query for the data.\n */\nexport class FileSystem extends EventTarget {\n  source: FilesSource = 'own';\n\n  /**\n   * The list of files to render.\n   * Do not overwrite this property or when you must then update the DataTable's `items` as well.\n   */\n  files: IFile[] = [];\n\n  /**\n   * The pagination cursor for files.\n   */\n  cursor?: string;\n\n  /**\n   * This is set when the last files query did not yeld results.\n   */\n  queryEnded?: boolean;\n\n  /**\n   * The currently rendered breadcrumbs.\n   */\n  breadcrumbs?: FileBreadcrumb[];\n\n  /**\n   * Whether the UI is reading files \n   */\n  reading?: boolean;\n\n  /**\n   * The list of file kinds to list.\n   * Folders are always included.\n   */\n  kinds?: ListFileKind[];\n\n  /**\n   * The timeout for the query debouncer.\n   * When any property change this is the time the element will wait\n   * until the actual query is made.\n   */\n  debounceTimeout = 100;\n\n  debouncerValue?: number;\n\n  /**\n   * The variable parent folder key.\n   * This is set when interacting with the UI or when the `folder` attribute change.\n   */\n  parent?: string;\n\n  /**\n   * The page limit. Defaults to the store defaults.\n   * @attribute\n   */\n  limit?: number;\n\n  filesChannel = new BroadcastChannel(StoreBroadcast.files);\n\n  eventsTarget: EventTarget = document.body;\n\n  constructor() {\n    super();\n    this.fileMetaMessageHandler = this.fileMetaMessageHandler.bind(this);\n  }\n\n  observe(): void {\n    this.filesChannel.addEventListener('message', this.fileMetaMessageHandler);\n  }\n\n  unobserve(): void {\n    this.filesChannel.removeEventListener('message', this.fileMetaMessageHandler);\n  }\n\n  fileMetaMessageHandler(e: MessageEvent): void {\n    const event = e.data as BroadcastEvent & BroadcastFileData;\n    if (event.parent !== this.parent) {\n      return;\n    }\n    if (event.alt !== 'meta') {\n      return;\n    }\n    switch (event.operation) {\n      case 'created': this.handleFileCreated((event as FileMetaCreatedBroadcastEvent).data); break;\n      case 'deleted': this.handleFileDeleted(event as DeletedBroadcastEvent); break;\n      case 'patch': this.handleFilePatch(event as FilePatchBroadcastEvent); break;\n      case 'access-granted': this.handleFileAccessGranted(event as FileAccessBroadcastEvent); break;\n      case 'access-removed': this.handleFileAccessRemoved(event as FileAccessBroadcastEvent); break;\n      default:\n    }\n  }\n\n  handleFileCreated(file: IFile): void {\n    this.files.push(file);\n    // We don't sort here so files that appear at the end which makes sense because the list is scrolling.\n    // this.files.sort(filesSortFunction);\n    this.notifyUpdate();\n  }\n\n  handleFileDeleted(event: DeletedBroadcastEvent): void {\n    this.removeFileFromList(event.key);\n  }\n\n  async handleFileAccessGranted(event: FileAccessBroadcastEvent): Promise<void> {\n    if (this.source !== 'shared') {\n      return;\n    }\n    const { key } = event;\n    try {\n      const file = await Events.Store.File.read(key, false, this.eventsTarget);\n      const index = this.files.findIndex(i => i.key === key);\n      if (index >= 0) {\n        this.files.splice(index, 1);\n      }\n      this.handleFileCreated(file);\n    } catch (e) {\n      // eslint-disable-next-line no-console\n      console.warn(e);\n    }\n  }\n\n  handleFileAccessRemoved(event: FileAccessBroadcastEvent): void {\n    if (this.source !== 'shared') {\n      return;\n    }\n    const { key } = event;\n    this.removeFileFromList(key);\n  }\n\n  removeFileFromList(key: string): void {\n    const index = this.files.findIndex(i => i.key === key);\n    if (index === -1) {\n      return;\n    }\n    this.files.splice(index, 1);\n    this.notifyUpdate();\n    this.dispatchEvent(new CustomEvent('delete', { detail: key }));\n  }\n\n  handleFilePatch(event: FilePatchBroadcastEvent): void {\n    const { data, key } = event;\n    const index = this.files.findIndex(i => i.key === key);\n    if (index === -1) {\n      return;\n    }\n    const file = this.files[index];\n    const result = Patch.apply(file, data.patch);\n    this.files[index] = result.doc as IFile;\n    this.notifyUpdate();\n  }\n\n  debounceQuery(): void {\n    if (this.debouncerValue) {\n      clearTimeout(this.debouncerValue);\n    }\n    this.debouncerValue = window.setTimeout(() => { \n      this.queryPage();\n      this.queryBreadcrumbs();\n    }, this.debounceTimeout);\n  }\n\n  resetList(): void {\n    this.files = [];\n    this.cursor = undefined;\n    this.breadcrumbs = undefined;\n    this.queryEnded = false;\n  }\n\n  async queryPage(): Promise<void> {\n    if (this.reading || this.queryEnded) {\n      return;\n    }\n    this.reading = true;\n    this.notifyUpdate();\n    try {\n      const result = await this.listFiles();\n      if (!result) {\n        throw new Error(`Files event not handled.`);\n      }\n      const { items, cursor } = result;\n      if (!items.length) {\n        this.queryEnded = true;\n      } else {\n        if (!this.files.length) {\n          // we only sort the first page as later the user scrolls and sorting would change the order.\n          items.sort(filesSortFunction);\n        }\n        this.files = this.files.concat(items);\n      }\n      if (cursor) {\n        this.cursor = cursor;\n      }\n    } catch(e) {\n      const err = e as Error;\n      this.notifyError(`Unable to load files list. ${err.message}`);\n      // eslint-disable-next-line no-console\n      console.error(e);\n    } finally {\n      this.reading = false;\n    }\n    this.dispatchEvent(new Event('querycomplete'));\n    this.notifyUpdate();\n  }\n\n  async queryBreadcrumbs(): Promise<void> {\n    if (this.parent) {\n      const br = await this.listBreadcrumbs(this.parent);\n      this.breadcrumbs = br.items;\n    } else {\n      this.breadcrumbs = undefined;\n    }\n  }\n\n  getPageQueryOptions(): ContextSpaceListOptions {\n    const { cursor: filesCursor, parent, limit } = this;\n    const opts: ContextSpaceListOptions = {\n      space: '', // this is filled by the bindings.\n      descending: true,\n    };\n    if (filesCursor) {\n      opts.cursor = filesCursor;\n    }\n    if (parent) {\n      opts.parent = parent;\n    }\n    if (typeof limit === 'number' && limit) {\n      opts.limit = limit;\n    }\n    return opts;\n  }\n\n  async listFiles(): Promise<ContextListResult<IFile>> {\n    const { kinds } = this;\n    const opts = this.getPageQueryOptions();\n    if (this.source === 'shared') {\n      return Events.Store.File.listShared(kinds, opts, this.eventsTarget);\n    }\n    return Events.Store.File.list(kinds, opts, this.eventsTarget);\n  }\n\n  async listBreadcrumbs(folder: string): Promise<ContextListResult<FileBreadcrumb>> {\n    return Events.Store.File.breadcrumbs(folder, this.eventsTarget);\n  }\n\n  notifyError(error: string): void {\n    this.dispatchEvent(new CustomEvent<string>('error', {\n      detail: error,\n    }));\n  }\n\n  notifyUpdate(): void {\n    this.dispatchEvent(new Event('change'));\n  }\n\n  /**\n   * Sets a parent and makes the query.\n   * @param key The key of the parent to query. Empty for root folder.\n   */\n  selectFolder(key?: string): void {\n    this.parent = key;\n    this.resetList();\n    this.debounceQuery();\n    // this.queryPage();\n    this.queryBreadcrumbs();\n  }\n\n  /**\n   * Moves to a parent folder, if any.\n   */\n  async parentUp(): Promise<void> {\n    const { breadcrumbs = [] } = this;\n    const [, parent] = breadcrumbs;\n    if (!parent) {\n      if (!this.parent) {\n        return;\n      }\n      this.parent = undefined;\n    } else {\n      if (this.parent === parent.key) {\n        return;\n      }\n      this.parent = parent.key;\n    }\n    this.resetList();\n    await Promise.all([\n      this.queryPage(),\n      this.queryBreadcrumbs(),\n    ]);\n    this.notifyUpdate();\n  }\n\n  /**\n   * @param target The HTML element that is a scrollable list if files.\n   * @returns True when the scroll position indicates that the user scrolled near the end of the list.\n   */\n  isListEnd(target: HTMLElement): boolean {\n    const { scrollTop, offsetHeight, scrollHeight } = target;\n    // 20 is the offset which qualifies as the end. An arbitrary number.\n    return scrollTop + offsetHeight >= scrollHeight - 20; \n  }\n}\n"]}

package/dist/styles/global-styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"global-styles.d.ts","sourceRoot":"","sources":["../../src/styles/global-styles.ts"],"names":[],"mappings":"AAEA;;;;GAIG;;AACH,wBAoFE"}
+{"version":3,"file":"global-styles.d.ts","sourceRoot":"","sources":["../../src/styles/global-styles.ts"],"names":[],"mappings":"AAEA;;;;GAIG;;AACH,wBA2FE"}

package/dist/styles/global-styles.js

@@ -64,6 +64,13 @@ body {
   justify-content: center;
   position: absolute;
   inset: 0;
+  background-color: var(--md-sys-color-surface);
+}
+
+.message,
+.sub-message,
+.auth-required-screen {
+  color: var(--md-sys-color-on-surface);
 }
 
 .full-error {

package/dist/styles/global-styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"global-styles.js","sourceRoot":"","sources":["../../src/styles/global-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;;;GAIG;AACH,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoFjB,CAAC","sourcesContent":["import { css } from 'lit';\n\n/** \n * Global styles for all pages.\n * \n * Note, all colors used here should have a CSS variable assigned.\n */\nexport default css`\nhtml, body, #app {\n  width: 100vw;\n  min-height: 100vh;\n  margin: 0;\n  padding: 0;\n}\n\nbody {\n  user-select: none;\n  background-color: var(--md-sys-color-background);\n}\n\n[hidden] {\n  display: none !important;\n}\n\n.text-selectable {\n  user-select: text;\n}\n\n.general-error {\n  margin: 40px 0;\n  text-align: center;\n  user-select: text;\n}\n\n.start-page-header-title {\n  flex: 1;\n}\n\n.navigation-list {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n.navigation-item a {\n  display: flex;\n  align-items: center;\n  height: 48px;\n  padding-left: 24px;\n  text-decoration: none;\n}\n\n.title-area {\n  display: flex;\n  align-items: center;\n}\n\n.auth-required-screen,\n.app-loader,\n.full-page-alert {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  inset: 0;\n}\n\n.full-error {\n  flex: 1;\n  align-items: start;\n  justify-content: center;\n  display: flex;\n  flex-direction: column;\n  margin: 40px;\n}\n\n.full-error .description {\n  max-width: 800px;\n}\n\n.error-dialog {\n  background-color: var(--md-sys-color-error-container);\n  color: var(--md-sys-color-on-error-container);\n  min-width: 256px;\n}\n\n.error-dialog p {\n  user-select: text;\n}\n`;\n"]}
+{"version":3,"file":"global-styles.js","sourceRoot":"","sources":["../../src/styles/global-styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B;;;;GAIG;AACH,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2FjB,CAAC","sourcesContent":["import { css } from 'lit';\n\n/** \n * Global styles for all pages.\n * \n * Note, all colors used here should have a CSS variable assigned.\n */\nexport default css`\nhtml, body, #app {\n  width: 100vw;\n  min-height: 100vh;\n  margin: 0;\n  padding: 0;\n}\n\nbody {\n  user-select: none;\n  background-color: var(--md-sys-color-background);\n}\n\n[hidden] {\n  display: none !important;\n}\n\n.text-selectable {\n  user-select: text;\n}\n\n.general-error {\n  margin: 40px 0;\n  text-align: center;\n  user-select: text;\n}\n\n.start-page-header-title {\n  flex: 1;\n}\n\n.navigation-list {\n  margin: 0;\n  padding: 0;\n  list-style: none;\n}\n\n.navigation-item a {\n  display: flex;\n  align-items: center;\n  height: 48px;\n  padding-left: 24px;\n  text-decoration: none;\n}\n\n.title-area {\n  display: flex;\n  align-items: center;\n}\n\n.auth-required-screen,\n.app-loader,\n.full-page-alert {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  align-items: center;\n  justify-content: center;\n  position: absolute;\n  inset: 0;\n  background-color: var(--md-sys-color-surface);\n}\n\n.message,\n.sub-message,\n.auth-required-screen {\n  color: var(--md-sys-color-on-surface);\n}\n\n.full-error {\n  flex: 1;\n  align-items: start;\n  justify-content: center;\n  display: flex;\n  flex-direction: column;\n  margin: 40px;\n}\n\n.full-error .description {\n  max-width: 800px;\n}\n\n.error-dialog {\n  background-color: var(--md-sys-color-error-container);\n  color: var(--md-sys-color-on-error-container);\n  min-width: 256px;\n}\n\n.error-dialog p {\n  user-select: text;\n}\n`;\n"]}

package/dist/ui/button/SegmentedButtonsSet.d.ts

@@ -1,6 +1,20 @@
 import { TemplateResult } from "lit";
 import { UiElement } from "../UiElement.js";
 import SegmentedButton from "./SegmentedButton.js";
+export interface ISegmentedButtonSelectionDetail {
+    /**
+     * A reference to the selected button.
+     */
+    button: SegmentedButton;
+    /**
+     * Whether the button is selected.
+     */
+    selected: boolean;
+    /**
+     * The index of the selected button.
+     */
+    index: number;
+}
 /**
  * @fires select - When button's selection change.
  */

package/dist/ui/button/SegmentedButtonsSet.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedButtonsSet.d.ts","sourceRoot":"","sources":["../../../src/ui/button/SegmentedButtonsSet.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,eAAe,MAAM,sBAAsB,CAAC;AAEnD;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,SAAS;IACxD,QAAQ,UAAS;IAEjB;;;OAGG;IAC0B,WAAW,UAAS;IAEP,OAAO,EAAG,eAAe,EAAE,CAAC;;IAO7D,iBAAiB,IAAI,IAAI;IAKlC,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAKxC,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI;IAKzD,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAKxC,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI;IAwBzD,OAAO,CAAC,mBAAmB;IAK3B,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,aAAa;IAIrB,OAAO,CAAC,gBAAgB;IAYf,MAAM,IAAI,cAAc;CAGlC"}
+{"version":3,"file":"SegmentedButtonsSet.d.ts","sourceRoot":"","sources":["../../../src/ui/button/SegmentedButtonsSet.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,cAAc,EAAE,MAAM,KAAK,CAAC;AAE3C,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAC5C,OAAO,eAAe,MAAM,sBAAsB,CAAC;AAEnD,MAAM,WAAW,+BAA+B;IAC9C;;OAEG;IACH,MAAM,EAAE,eAAe,CAAC;IACxB;;OAEG;IACH,QAAQ,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,MAAM,CAAC,OAAO,OAAO,mBAAoB,SAAQ,SAAS;IACxD,QAAQ,UAAS;IAEjB;;;OAGG;IAC0B,WAAW,UAAS;IAEP,OAAO,EAAG,eAAe,EAAE,CAAC;;IAO7D,iBAAiB,IAAI,IAAI;IAKlC,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAKxC,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI;IAKzD,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO;IAKxC,iBAAiB,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,GAAG,IAAI;IAwBzD,OAAO,CAAC,mBAAmB;IAK3B,OAAO,CAAC,eAAe;IAIvB,OAAO,CAAC,aAAa;IAIrB,OAAO,CAAC,gBAAgB;IAYf,MAAM,IAAI,cAAc;CAGlC"}