@internetarchive/collection-browser 0.0.1-alpha.2 → 0.0.1-alpha.22

package/src/tiles/list/tile-list.ts

@@ -1,22 +1,16 @@
-import { css, html, LitElement } from 'lit';
+/* eslint-disable lit/no-invalid-html */
+import { css, html, LitElement, nothing } from 'lit';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import { join } from 'lit/directives/join.js';
+import { map } from 'lit/directives/map.js';
 import { customElement, property } from 'lit/decorators.js';
 import { SortParam } from '@internetarchive/search-service';
 import DOMPurify from 'dompurify';
-// import * as HtmlSanitizer from '@jitbit/htmlsanitizer';
-// import sanitizeHtml from 'sanitize-html';
-// - error
-// import DOMPurify from 'dompurify';
-// - no types
-import { CollectionDisplayMode, TileModel } from '../../models';
+import { TileModel } from '../../models';
 import { formatCount, NumberFormat } from '../../utils/format-count';
 import { formatDate, DateFormat } from '../../utils/format-date';
 import '../../mediatype-icon';
 
-/*
-at 750 creator, title trimmed
-at 530
-*/
-
 @customElement('tile-list')
 export class TileList extends LitElement {
   @property({ type: Object }) model?: TileModel;
@@ -29,65 +23,201 @@ export class TileList extends LitElement {
 
   @property({ type: Object }) sortParam?: SortParam;
 
-  @property({ type: String }) displayMode: CollectionDisplayMode =
-    'list-compact';
-
-  // private HtmlSanitizer = HtmlSanitizer();
-
   render() {
     return html`
       <div id="list-line" class="${this.classSize}">
-        <div id="views">
-          ${formatCount(this.model?.viewCount ?? 0, this.formatSize)}
+        <div id="list-line-left">
+          <div id="thumb">${this.imgTemplate}</div>
+          ${this.iconLeftTemplate}
         </div>
-        <div id="title">${this.model?.title}</div>
-        <div id="date">${formatDate(this.date, this.formatSize)}</div>
-        <div id="creator">${this.model?.creator}</div>
-        <div id="icon">
-          <mediatype-icon .mediatype=${this.model?.mediatype}></mediatype-icon>
+        <div id="list-line-right">
+          <div id="title">${this.titleTemplate}</div>
+          ${this.itemLineTemplate} ${this.creatorTemplate}
+          <div id="date" class="metadata">
+            <span class="label">Published:</span> ${formatDate(
+              this.date,
+              this.formatSize
+            )}
+          </div>
+          <div id="views-line">
+            ${this.viewsTemplate} ${this.ratingTemplate} ${this.reviewsTemplate}
+          </div>
+          ${this.topicsTemplate} ${this.collectionsTemplate}
+          ${this.descriptionTemplate}
         </div>
       </div>
-      ${this.displayMode === 'list-detail' ? this.detail() : html``}
     `;
   }
 
-  private detail() {
-    const descriptionHtml = this.description();
-    const topicHtml = this.topic();
-    const sourceHtml = this.source();
+  // Display templates
+  private get imgTemplate() {
+    if (!this.model?.identifier) {
+      return nothing;
+    }
+    return html` <img
+      src="${this.baseNavigationUrl}/services/img/${this.model.identifier}"
+      alt="${this.model.identifier}"
+      class=${this.model?.mediatype}
+    />`;
+  }
 
-    if (descriptionHtml || topicHtml || sourceHtml) {
-      return html`
-        <div id="list-detail" class="${this.classSize}">
-          <div></div>
-          <div id="details">${descriptionHtml} ${topicHtml} ${sourceHtml}</div>
-          <div></div>
-        </div>
-      `;
+  private get iconLeftTemplate() {
+    if (this.classSize !== 'desktop') {
+      return nothing;
     }
-    return html``;
+    return html`
+      <div id="icon-left">
+        <mediatype-icon
+          .mediatype=${this.model?.mediatype}
+          .showText=${true}
+          style="--iconHeight: 20px; --iconWidth: 20px;text-align: center;"
+        >
+        </mediatype-icon>
+      </div>
+    `;
+  }
+
+  private get titleTemplate() {
+    if (!this.model?.title) {
+      return nothing;
+    }
+    return html` ${this.detailsLink(this.model.identifier, this.model.title)} `;
+  }
+
+  private get itemLineTemplate() {
+    const source = this.sourceTemplate;
+    const volume = this.volumeTemplate;
+    const issue = this.issueTemplate;
+    if (!source && !volume && !issue) {
+      return nothing;
+    }
+    return html` <div id="item-line">${source} ${volume} ${issue}</div> `;
+  }
+
+  private get volumeTemplate() {
+    return this.metadataTemplate(this.model?.volume, 'Volume');
+  }
+
+  private get issueTemplate() {
+    return this.metadataTemplate(this.model?.issue, 'Issue');
+  }
+
+  private get sourceTemplate() {
+    if (!this.model?.source) {
+      return nothing;
+    }
+    return html`
+      <div id="source">
+        ${this.labelTemplate('Source')}
+        ${this.searchLink('source', this.model.source)}
+      </div>
+    `;
   }
 
-  private description() {
-    if (this.model?.description) {
-      const description = DOMPurify.sanitize(`${this.model?.description}`);
-      return html` <div id="description">${description}</div> `;
+  private get creatorTemplate() {
+    if (!this.model?.creators || this.model.creators.length === 0) {
+      return nothing;
     }
-    return html``;
+    return html`
+      <div id="creator" class="metadata">
+        ${this.labelTemplate('By')}
+        ${join(
+          map(this.model.creators, id => this.searchLink('creator', id)),
+          html`, `
+        )}
+      </div>
+    `;
+  }
+
+  private get viewsTemplate() {
+    return this.metadataTemplate(
+      `${formatCount(this.model?.viewCount ?? 0, this.formatSize)}`,
+      'Views'
+    );
+  }
+
+  private get ratingTemplate() {
+    return this.metadataTemplate(this.model?.averageRating, 'Avg Rating');
   }
 
-  private topic() {
-    if (this.model?.subject) {
-      return html` <div id="topic">Topic: ${this.model?.subject}</div> `;
+  private get reviewsTemplate() {
+    return this.metadataTemplate(this.model?.commentCount, 'Reviews');
+  }
+
+  private get topicsTemplate() {
+    if (!this.model?.subjects || this.model.subjects.length === 0) {
+      return nothing;
     }
-    return html``;
+    return html`
+      <div id="topics" class="metadata">
+        ${this.labelTemplate('Topics')}
+        ${join(
+          map(this.model.subjects, id => this.searchLink('subject', id)),
+          html`, `
+        )}
+      </div>
+    `;
   }
 
-  private source() {
-    if (this.model?.source) {
-      return html` <div id="source">Source: ${this.model?.source}</div> `;
+  private get collectionsTemplate() {
+    if (!this.model?.collections) {
+      return nothing;
     }
-    return html``;
+    return html`
+      <div id="collections" class="metadata">
+        ${this.labelTemplate('Collections')}
+        ${join(
+          map(this.model.collections, id => this.detailsLink(id)),
+          html`, `
+        )}
+      </div>
+    `;
+  }
+
+  private get descriptionTemplate() {
+    return this.metadataTemplate(
+      DOMPurify.sanitize(this.model?.description ?? ''),
+      '',
+      'description'
+    );
+  }
+
+  // Utility functions
+  private metadataTemplate(text: any, label = '', id?: string) {
+    if (!text) return nothing;
+    return html`
+      <div id=${ifDefined(id)} class="metadata">
+        ${this.labelTemplate(label)} ${text}
+      </div>
+    `;
+  }
+
+  private labelTemplate(label: string) {
+    return html`${label
+      ? html`<span class="label">${label}: </span>`
+      : nothing}`;
+  }
+
+  private searchLink(field: string, searchTerm: string) {
+    if (!field || !searchTerm) {
+      return nothing;
+    }
+    const query = encodeURIComponent(`${field}:"${searchTerm}"`);
+    // No whitespace after closing tag
+    return html` <a href="${this.baseNavigationUrl}/search.php?query=${query}">
+      ${DOMPurify.sanitize(searchTerm)}</a
+    >`;
+  }
+
+  private detailsLink(identifier: string, text?: string) {
+    if (!identifier) {
+      return nothing;
+    }
+    const linkText = text ?? identifier;
+    // No whitespace after closing tag
+    return html` <a href="${this.baseNavigationUrl}/details/${identifier}"
+      >${DOMPurify.sanitize(linkText)}</a
+    >`;
   }
 
   /*
@@ -118,21 +248,85 @@ export class TileList extends LitElement {
 
   static get styles() {
     return css`
-      .mobile div {
-        font-size: 11px;
+      html {
+        font-size: unset;
       }
-      .desktop div {
+
+      div {
         font-size: 14px;
       }
 
+      div a {
+        text-decoration: none;
+      }
+
+      .label {
+        font-weight: bold;
+      }
+
+      .mobile {
+        --infiniteScrollerRowGap: 20px;
+        --infiniteScrollerRowHeight: auto;
+      }
+
+      .desktop {
+        --infiniteScrollerRowGap: 30px;
+        --infiniteScrollerRowHeight: auto;
+      }
       /* fields */
 
+      #thumb img {
+        object-fit: cover;
+        display: block;
+      }
+
+      .mobile #thumb img {
+        width: 90px;
+        height: 90px;
+      }
+
+      .desktop #thumb img {
+        width: 100px;
+        height: 100px;
+      }
+
+      #thumb img.collection {
+        border-radius: 8px;
+        -webkit-border-radius: 8px;
+        -moz-border-radius: 8px;
+      }
+
+      .mobile #thumb img.account {
+        border-radius: 45px;
+        -webkit-border-radius: 45px;
+        -moz-border-radius: 45px;
+      }
+
+      .desktop #thumb img.account {
+        border-radius: 50px;
+        -webkit-border-radius: 50px;
+        -moz-border-radius: 50px;
+      }
+
+      #icon-left {
+        padding-top: 5px;
+      }
+
       #title {
         color: #4b64ff;
         text-decoration: none;
+        font-size: 22px;
+        font-weight: bold;
+        /* align top of text with image */
+        line-height: 25px;
+        margin-top: -4px;
+        padding-bottom: 2px;
+      }
+
+      .metadata {
+        line-height: 20px;
       }
 
-      #title,
       #creator,
       #topic,
       #source {
@@ -140,38 +334,16 @@ export class TileList extends LitElement {
         overflow: hidden;
       }
 
-      #title,
-      #creator {
-        white-space: nowrap;
-      }
-
-      #views,
-      #date {
-        text-align: right;
-      }
-
-      #views,
-      #details {
-        color: #767676;
-      }
-
       #icon {
-        padding-right: 6px;
-      }
-
-      .desktop #description,
-      .desktop #topic,
-      .desktop #source {
-        font-size: 12px;
+        padding-top: 5px;
       }
 
-      .mobile #description,
-      .mobile #topic,
-      .mobile #source {
-        font-size: 11px;
+      mediatype-icon {
+        --iconHeight: 20px;
       }
 
       #description {
+        padding-top: 10px;
         overflow: hidden;
         text-overflow: ellipsis;
         -webkit-line-clamp: 2;
@@ -187,40 +359,19 @@ export class TileList extends LitElement {
       /* list-line */
 
       #list-line {
-        display: grid;
-        column-gap: 10px;
-        line-height: 1.42857143;
-        border-top: 1px solid #ddd !important;
-        padding-top: 5px;
-        align-items: center;
-      }
-
-      #list-line.mobile {
-        grid-template-columns: 33px 3fr 30px 2fr 29.5px;
-      }
-      #list-line.desktop {
-        grid-template-columns: 60px 3fr 90px 2fr 29.5px;
+        display: flex;
+        column-gap: 5px;
       }
 
-      #list-line:hover #title {
+      div a:hover {
         text-decoration: underline;
       }
 
-      /* list-detail */
-
-      #list-detail {
-        display: grid;
-        column-gap: 10px;
-        line-height: 1.42857143;
-        align-items: center;
-      }
-
-      #list-detail.mobile {
-        grid-template-columns: 33px auto 29.5px;
-      }
-
-      #list-detail.desktop {
-        grid-template-columns: 60px auto 29.5px;
+      #item-line,
+      #views-line {
+        display: flex;
+        flex-direction: row;
+        gap: 10px;
       }
     `;
   }

package/src/tiles/tile-dispatcher.ts

@@ -6,18 +6,21 @@ import {
   SharedResizeObserverResizeHandlerInterface,
 } from '@internetarchive/shared-resize-observer';
 import { SortParam } from '@internetarchive/search-service';
+import type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';
 import type { CollectionDisplayMode, TileModel } from '../models';
 import './grid/collection-tile';
 import './grid/item-tile';
 import './grid/account-tile';
 import './list/tile-list';
+import './list/tile-list-compact';
+import './list/tile-list-compact-header';
 
 @customElement('tile-dispatcher')
 export class TileDispatcher
   extends LitElement
   implements SharedResizeObserverResizeHandlerInterface
 {
-  @property({ type: String }) displayMode: CollectionDisplayMode = 'grid';
+  @property({ type: String }) displayMode?: CollectionDisplayMode;
 
   @property({ type: Object }) model?: TileModel;
 
@@ -33,24 +36,53 @@ export class TileDispatcher
 
   @property({ type: Object }) sortParam?: SortParam;
 
+  @property({ type: Object })
+  collectionNameCache?: CollectionNameCacheInterface;
+
   @query('#container') private container!: HTMLDivElement;
 
   render() {
     return html`
       <div id="container">
-        ${this.showDeleteButton
-          ? html`<button id="delete-button">X</button>`
-          : nothing}
-        <a
-          href="${this.baseNavigationUrl}/details/${this.model?.identifier}"
-          title=${ifDefined(this.model?.title)}
-        >
-          ${this.tile}
-        </a>
+        ${this.displayMode === 'list-header'
+          ? this.headerTemplate
+          : this.tileTemplate}
       </div>
     `;
   }
 
+  private get headerTemplate() {
+    const { currentWidth, sortParam } = this;
+    return html`
+      <tile-list-compact-header
+        class="header"
+        .currentWidth=${currentWidth}
+        .sortParam=${sortParam}
+      >
+      </tile-list-compact-header>
+    `;
+  }
+
+  private get tileTemplate() {
+    return html`
+      ${this.showDeleteButton
+        ? html`<button id="delete-button">X</button>`
+        : nothing}
+      ${this.displayMode === 'list-detail' ? this.tile : this.linkTileTemplate}
+    `;
+  }
+
+  private get linkTileTemplate() {
+    return html`
+      <a
+        href="${this.baseNavigationUrl}/details/${this.model?.identifier}"
+        title=${ifDefined(this.model?.title)}
+      >
+        ${this.tile}
+      </a>
+    `;
+  }
+
   handleResize(entry: ResizeObserverEntry): void {
     this.currentWidth = entry.contentRect.width;
     this.currentHeight = entry.contentRect.height;
@@ -110,11 +142,20 @@ export class TileDispatcher
           default:
             return html`<item-tile
               .model=${model}
+              .baseNavigationUrl=${baseNavigationUrl}
               .currentWidth=${currentWidth}
               .currentHeight=${currentHeight}
+              .collectionNameCache=${this.collectionNameCache}
             ></item-tile>`;
         }
       case 'list-compact':
+        return html`<tile-list-compact
+          .model=${model}
+          .currentWidth=${currentWidth}
+          .currentHeight=${currentHeight}
+          .baseNavigationUrl=${baseNavigationUrl}
+          .sortParam=${sortParam}
+        ></tile-list-compact>`;
       case 'list-detail':
         return html`<tile-list
           .model=${model}
@@ -122,7 +163,6 @@ export class TileDispatcher
           .currentHeight=${currentHeight}
           .baseNavigationUrl=${baseNavigationUrl}
           .sortParam=${sortParam}
-          .displayMode=${this.displayMode}
         ></tile-list>`;
       default:
         return nothing;

package/src/utils/format-date.ts

@@ -19,8 +19,7 @@ export function formatDate(
   };
   switch (format) {
     case 'short':
-      options.month = '2-digit';
-      options.year = '2-digit';
+      options.year = 'numeric';
       break;
     case 'long':
       options.year = 'numeric';

package/dist/src/assets/img/icons/audio.d.ts

@@ -1 +0,0 @@
-export declare const audioIcon: import("lit-html").TemplateResult<2>;

package/dist/src/assets/img/icons/audio.js

@@ -1,9 +0,0 @@
-import { svg } from 'lit';
-export const audioIcon = svg `
-<svg viewBox="0 0 300 300"
-  xmlns="http://www.w3.org/2000/svg">
-  <path d="m225.568345 20c20.949641 0 28.431655 8.5714286 28.431655 28.5714286-.928802 21.2807881-.704608 42.5615763-.400898 63.8423644l.153512 10.640394c.13351 9.458128.247386 18.916256.247386 28.374384v100c0 18.571429-5.985612 28.571429-28.431655 28.571429-50.877698-1.428571-100.258992-1.428571-151.1366903 0-20.9496403 0-28.4316547-8.571429-28.4316547-28.571429v-202.8571424c0-18.5714286 5.9856115-28.5714286 28.4316547-28.5714286 50.8776983 1.4285714 100.2589923 1.4285714 151.1366903 0zm-74.268345 127.4c-30.251351 0-53.3 24.489189-53.3 53.3 0 30.251351 24.489189 53.3 53.3 53.3 30.251351 0 53.3-24.489189 53.3-53.3s-24.489189-53.3-53.3-53.3zm0 39c7.897672 0 14.3 6.402328 14.3 14.3s-6.402328 14.3-14.3 14.3-14.3-6.402328-14.3-14.3 6.402328-14.3 14.3-14.3zm-1.3-137.8c-20.384 0-36.4 16.016-36.4 36.4s16.016 36.4 36.4 36.4 36.4-16.016 36.4-36.4-17.472-36.4-36.4-36.4z" fill="black" fill-rule="evenodd"/>
-
-</svg>
-`;
-//# sourceMappingURL=audio.js.map

package/dist/src/assets/img/icons/audio.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"audio.js","sourceRoot":"","sources":["../../../../../src/assets/img/icons/audio.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA;;;;;;CAM3B,CAAC","sourcesContent":["import { svg } from 'lit';\n\nexport const audioIcon = svg`\n<svg viewBox=\"0 0 300 300\"\n  xmlns=\"http://www.w3.org/2000/svg\">\n  <path d=\"m225.568345 20c20.949641 0 28.431655 8.5714286 28.431655 28.5714286-.928802 21.2807881-.704608 42.5615763-.400898 63.8423644l.153512 10.640394c.13351 9.458128.247386 18.916256.247386 28.374384v100c0 18.571429-5.985612 28.571429-28.431655 28.571429-50.877698-1.428571-100.258992-1.428571-151.1366903 0-20.9496403 0-28.4316547-8.571429-28.4316547-28.571429v-202.8571424c0-18.5714286 5.9856115-28.5714286 28.4316547-28.5714286 50.8776983 1.4285714 100.2589923 1.4285714 151.1366903 0zm-74.268345 127.4c-30.251351 0-53.3 24.489189-53.3 53.3 0 30.251351 24.489189 53.3 53.3 53.3 30.251351 0 53.3-24.489189 53.3-53.3s-24.489189-53.3-53.3-53.3zm0 39c7.897672 0 14.3 6.402328 14.3 14.3s-6.402328 14.3-14.3 14.3-14.3-6.402328-14.3-14.3 6.402328-14.3 14.3-14.3zm-1.3-137.8c-20.384 0-36.4 16.016-36.4 36.4s16.016 36.4 36.4 36.4 36.4-16.016 36.4-36.4-17.472-36.4-36.4-36.4z\" fill=\"black\" fill-rule=\"evenodd\"/>\n\n</svg>\n`;\n"]}

package/dist/src/assets/img/icons/collection.d.ts

@@ -1 +0,0 @@
-export declare const collectionIcon: import("lit-html").TemplateResult<2>;

package/dist/src/assets/img/icons/collection.js

@@ -1,9 +0,0 @@
-import { svg } from 'lit';
-export const collectionIcon = svg `
-  <svg viewBox="0 0 300 300"
-  xmlns="http://www.w3.org/2000/svg">
-<path d="m280 262.122891v-156.834044c0-4.877026-2.063112-9.1444235-6.189337-12.8021929s-8.220563-5.4866541-12.283013-5.4866541h-225.4946834c-4.4642309 0-8.2524498 1.726748-11.3646565 5.1802441s-4.6683101 7.8230299-4.6683101 13.1086029v156.834044c0 5.279189 1.5210273 9.578505 4.5630818 12.897946 3.0420545 3.319442 6.8653495 4.979163 11.4698848 4.979163h225.4946834c4.06245 0 8.156788-1.726748 12.283013-5.180244s6.189337-7.685784 6.189337-12.696865zm-200.9382244-131.440315v7.918783c0 1.487366-.7780516 3.00984-2.334155 4.567424-1.5561034 1.557585-3.1472828 2.336377-4.7735384 2.336377h-14.8180581c-1.7601825 0-3.4183254-.743683-4.9744288-2.231048-1.5561033-1.487365-2.334155-3.044949-2.334155-4.672753v-7.918783c0-1.761858.8131278-3.964179 2.4393834-6.606966 1.6262555-2.642786 3.2493223-3.964179 4.8692004-3.964179h14.8180581c1.4859512 0 3.0420545 1.321393 4.6683101 3.964179 1.6262556 2.642787 2.4393833 4.845108 2.4393833 6.606966zm169.2740724 0v7.918783c0 1.627804-.711089 3.185388-2.133265 4.672753-1.422177 1.487365-3.080319 2.231048-4.974429 2.231048h-131.114463c-2.028037 0-3.753143-.743683-5.175319-2.231048-1.422177-1.487365-2.133265-3.044949-2.133265-4.672753v-7.918783c0-1.895912.742975-4.130152 2.228927-6.702719 1.485951-2.572567 3.175981-3.858851 5.070091-3.858851h131.114463c1.760182 0 3.383249 1.286284 4.8692 3.858851 1.485952 2.572567 2.228927 4.806807 2.228927 6.702719zm-169.2740724 50.988539v7.918784c0 1.487365-.7780516 2.977922-2.334155 4.471671s-3.1472828 2.237431-4.7735384 2.231088h-14.8180581c-1.7601825 0-3.4183254-.743723-4.9744288-2.231088-1.5561033-1.487365-2.334155-2.977922-2.334155-4.471671v-7.918784c0-1.895912.8131278-4.165261 2.4393834-6.808047 1.6262555-2.642786 3.2493223-3.964179 4.8692004-3.964179h14.8180581c1.4859512 0 3.0420545 1.353311 4.6683101 4.059932 1.6262556 2.706622 2.4393833 4.940861 2.4393833 6.702719zm169.2740724 0v7.918784c0 1.487365-.711089 2.977922-2.133265 4.471671-1.422177 1.493749-3.080319 2.237431-4.974429 2.231088h-131.114463c-2.028037 0-3.753143-.743723-5.175319-2.231088-1.422177-1.487365-2.133265-2.977922-2.133265-4.471671v-7.918784c0-2.029966.742975-4.331233 2.228927-6.9038 1.485951-2.572567 3.175981-3.858851 5.070091-3.858851h131.114463c1.760182 0 3.383249 1.321393 4.8692 3.964179 1.485952 2.642787 2.228927 4.912136 2.228927 6.808048zm-169.2740724 51.400278v6.9038c0 1.761858-.7780516 3.421579-2.334155 4.979163s-3.1472828 2.336376-4.7735384 2.336376h-14.8180581c-1.7601825 0-3.4183254-.778792-4.9744288-2.336376-1.5561033-1.557584-2.334155-3.217305-2.334155-4.979163v-6.9038c0-2.029966.7780517-4.366342 2.334155-7.009129 1.5561034-2.642786 3.2142463-3.964179 4.9744288-3.964179h14.8180581c1.4859512 0 3.0420545 1.321393 4.6683101 3.964179 1.6262556 2.642787 2.4393833 4.979163 2.4393833 7.009129zm169.2740724 0v6.9038c0 1.761858-.711089 3.421579-2.133265 4.979163-1.422177 1.557584-3.080319 2.336376-4.974429 2.336376h-131.114463c-2.028037 0-3.753143-.778792-5.175319-2.336376-1.422177-1.557584-2.133265-3.217305-2.133265-4.979163v-6.9038c0-2.170404.742975-4.54189 2.228927-7.114457 1.485951-2.572567 3.175981-3.858851 5.070091-3.858851h131.114463c1.760182 0 3.383249 1.321393 4.8692 3.964179 1.485952 2.642787 2.228927 4.979163 2.228927 7.009129z" fill="white"/>
-
-</svg>
-`;
-//# sourceMappingURL=collection.js.map

package/dist/src/assets/img/icons/collection.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"collection.js","sourceRoot":"","sources":["../../../../../src/assets/img/icons/collection.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAAA;;;;;;CAMhC,CAAC","sourcesContent":["import { svg } from 'lit';\n\nexport const collectionIcon = svg`\n  <svg viewBox=\"0 0 300 300\"\n  xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"m280 262.122891v-156.834044c0-4.877026-2.063112-9.1444235-6.189337-12.8021929s-8.220563-5.4866541-12.283013-5.4866541h-225.4946834c-4.4642309 0-8.2524498 1.726748-11.3646565 5.1802441s-4.6683101 7.8230299-4.6683101 13.1086029v156.834044c0 5.279189 1.5210273 9.578505 4.5630818 12.897946 3.0420545 3.319442 6.8653495 4.979163 11.4698848 4.979163h225.4946834c4.06245 0 8.156788-1.726748 12.283013-5.180244s6.189337-7.685784 6.189337-12.696865zm-200.9382244-131.440315v7.918783c0 1.487366-.7780516 3.00984-2.334155 4.567424-1.5561034 1.557585-3.1472828 2.336377-4.7735384 2.336377h-14.8180581c-1.7601825 0-3.4183254-.743683-4.9744288-2.231048-1.5561033-1.487365-2.334155-3.044949-2.334155-4.672753v-7.918783c0-1.761858.8131278-3.964179 2.4393834-6.606966 1.6262555-2.642786 3.2493223-3.964179 4.8692004-3.964179h14.8180581c1.4859512 0 3.0420545 1.321393 4.6683101 3.964179 1.6262556 2.642787 2.4393833 4.845108 2.4393833 6.606966zm169.2740724 0v7.918783c0 1.627804-.711089 3.185388-2.133265 4.672753-1.422177 1.487365-3.080319 2.231048-4.974429 2.231048h-131.114463c-2.028037 0-3.753143-.743683-5.175319-2.231048-1.422177-1.487365-2.133265-3.044949-2.133265-4.672753v-7.918783c0-1.895912.742975-4.130152 2.228927-6.702719 1.485951-2.572567 3.175981-3.858851 5.070091-3.858851h131.114463c1.760182 0 3.383249 1.286284 4.8692 3.858851 1.485952 2.572567 2.228927 4.806807 2.228927 6.702719zm-169.2740724 50.988539v7.918784c0 1.487365-.7780516 2.977922-2.334155 4.471671s-3.1472828 2.237431-4.7735384 2.231088h-14.8180581c-1.7601825 0-3.4183254-.743723-4.9744288-2.231088-1.5561033-1.487365-2.334155-2.977922-2.334155-4.471671v-7.918784c0-1.895912.8131278-4.165261 2.4393834-6.808047 1.6262555-2.642786 3.2493223-3.964179 4.8692004-3.964179h14.8180581c1.4859512 0 3.0420545 1.353311 4.6683101 4.059932 1.6262556 2.706622 2.4393833 4.940861 2.4393833 6.702719zm169.2740724 0v7.918784c0 1.487365-.711089 2.977922-2.133265 4.471671-1.422177 1.493749-3.080319 2.237431-4.974429 2.231088h-131.114463c-2.028037 0-3.753143-.743723-5.175319-2.231088-1.422177-1.487365-2.133265-2.977922-2.133265-4.471671v-7.918784c0-2.029966.742975-4.331233 2.228927-6.9038 1.485951-2.572567 3.175981-3.858851 5.070091-3.858851h131.114463c1.760182 0 3.383249 1.321393 4.8692 3.964179 1.485952 2.642787 2.228927 4.912136 2.228927 6.808048zm-169.2740724 51.400278v6.9038c0 1.761858-.7780516 3.421579-2.334155 4.979163s-3.1472828 2.336376-4.7735384 2.336376h-14.8180581c-1.7601825 0-3.4183254-.778792-4.9744288-2.336376-1.5561033-1.557584-2.334155-3.217305-2.334155-4.979163v-6.9038c0-2.029966.7780517-4.366342 2.334155-7.009129 1.5561034-2.642786 3.2142463-3.964179 4.9744288-3.964179h14.8180581c1.4859512 0 3.0420545 1.321393 4.6683101 3.964179 1.6262556 2.642787 2.4393833 4.979163 2.4393833 7.009129zm169.2740724 0v6.9038c0 1.761858-.711089 3.421579-2.133265 4.979163-1.422177 1.557584-3.080319 2.336376-4.974429 2.336376h-131.114463c-2.028037 0-3.753143-.778792-5.175319-2.336376-1.422177-1.557584-2.133265-3.217305-2.133265-4.979163v-6.9038c0-2.170404.742975-4.54189 2.228927-7.114457 1.485951-2.572567 3.175981-3.858851 5.070091-3.858851h131.114463c1.760182 0 3.383249 1.321393 4.8692 3.964179 1.485952 2.642787 2.228927 4.979163 2.228927 7.009129z\" fill=\"white\"/>\n\n</svg>\n`;\n"]}

package/dist/src/assets/img/icons/etree.d.ts

@@ -1 +0,0 @@
-export declare const etreeIcon: import("lit-html").TemplateResult<2>;

package/dist/src/assets/img/icons/etree.js

@@ -1,9 +0,0 @@
-import { svg } from 'lit';
-export const etreeIcon = svg `
-<svg viewBox="0 0 300 300"
-  xmlns="http://www.w3.org/2000/svg">
-<path d="m136.125893 117.288073c14.41013-4.850562 27.83316-2.109766 39.480173 7.796632 10.335962 8.792594 14.330094 20.428621 14.288498 33.809481-.091795 25.476855-.015572 50.965113-.049872 76.441968-.003811 2.805419-.034301 5.648851-.457344 8.401051-3.376719 21.854139-21.133078 36.299386-43.127486 35.204588-20.210769-1.003564-37.307792-18.132586-37.799436-38.393946-.346818-14.513672-.060979-29.057755-.301084-43.586633 0-12.597776-.06479-25.191751.034301-37.789527.0343-3.656928.16007-7.401288.903253-10.963182 3.18997-15.36138 12.272049-25.963431 27.028997-30.920432zm69.082871-95.288073v20.8201628h-42.6892v27.2482979s2.61448.5740085 3.574902.8363038c23.797103 6.5155667 41.073252 15.8669636 55.262332 37.0824705 8.594246 12.852468 11.643202 31.380398 11.643202 46.760785v15.304359h-20.889162c0-5.538611.099091-10.750305-.038112-15.961998-.099091-3.896415-.167692-7.857454-.842274-11.689246-5.328051-30.262793-30.775402-49.8170956-57.026916-51.5315184-29.311903-1.9120945-57.1907972 18.1858064-64.1500399 46.8520184-1.6657464 6.843753-1.7799637 13.736569-1.7780383 20.63947l.0023262 1.88283c.0030489 1.883022.0050308 3.76653-.0231721 5.649734-.0228671 1.364696 0 2.72559 0 4.052272h-20.5918884c-5.5529117-51.542923 24.3078039-93.7420516 70.1221835-99.8660762v-27.3889489h-42.6205979v-20.6909159z" fill="black" fill-rule="evenodd" transform="matrix(1 0 0 -1 0 301)"/>
-
-</svg>
-`;
-//# sourceMappingURL=etree.js.map

package/dist/src/assets/img/icons/etree.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"etree.js","sourceRoot":"","sources":["../../../../../src/assets/img/icons/etree.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,SAAS,GAAG,GAAG,CAAA;;;;;;CAM3B,CAAC","sourcesContent":["import { svg } from 'lit';\n\nexport const etreeIcon = svg`\n<svg viewBox=\"0 0 300 300\"\n  xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"m136.125893 117.288073c14.41013-4.850562 27.83316-2.109766 39.480173 7.796632 10.335962 8.792594 14.330094 20.428621 14.288498 33.809481-.091795 25.476855-.015572 50.965113-.049872 76.441968-.003811 2.805419-.034301 5.648851-.457344 8.401051-3.376719 21.854139-21.133078 36.299386-43.127486 35.204588-20.210769-1.003564-37.307792-18.132586-37.799436-38.393946-.346818-14.513672-.060979-29.057755-.301084-43.586633 0-12.597776-.06479-25.191751.034301-37.789527.0343-3.656928.16007-7.401288.903253-10.963182 3.18997-15.36138 12.272049-25.963431 27.028997-30.920432zm69.082871-95.288073v20.8201628h-42.6892v27.2482979s2.61448.5740085 3.574902.8363038c23.797103 6.5155667 41.073252 15.8669636 55.262332 37.0824705 8.594246 12.852468 11.643202 31.380398 11.643202 46.760785v15.304359h-20.889162c0-5.538611.099091-10.750305-.038112-15.961998-.099091-3.896415-.167692-7.857454-.842274-11.689246-5.328051-30.262793-30.775402-49.8170956-57.026916-51.5315184-29.311903-1.9120945-57.1907972 18.1858064-64.1500399 46.8520184-1.6657464 6.843753-1.7799637 13.736569-1.7780383 20.63947l.0023262 1.88283c.0030489 1.883022.0050308 3.76653-.0231721 5.649734-.0228671 1.364696 0 2.72559 0 4.052272h-20.5918884c-5.5529117-51.542923 24.3078039-93.7420516 70.1221835-99.8660762v-27.3889489h-42.6205979v-20.6909159z\" fill=\"black\" fill-rule=\"evenodd\" transform=\"matrix(1 0 0 -1 0 301)\"/>\n\n</svg>\n`;\n"]}

package/dist/src/assets/img/icons/images.d.ts

@@ -1 +0,0 @@
-export declare const imagesIcon: import("lit-html").TemplateResult<2>;

package/dist/src/assets/img/icons/images.js

@@ -1,10 +0,0 @@
-import { svg } from 'lit';
-export const imagesIcon = svg `
-<svg viewBox="0 0 300 300"
-  xmlns="http://www.w3.org/2000/svg">
-<path d="m43.0952612 181.159979c2.1744514 0 21.7161099 3.336499 21.7161099 3.336499v21.030628l-44.8113711-6.289709c4.5382599-51.29161 9.6729948-105.5332879 14.6089046-156.237397 66.1329874 6.484496 144.5110704 16.1138469 211.0385514 22.4035567-.987813 6.4876377-1.581132 21.8160564-1.972471 28.3005524-4.939065-.5906421-15.599873 0-20.535783-.5906421v-9.0418506c-56.065498-5.3032118-112.326666-12.180422-168.3953197-17.6847035 0 0-7.7005244 74.2858081-11.6486211 114.7730661zm31.7867547-81.562016h205.1179841v158.402037h-205.1179841zm18.9514955 140.126691h167.8051566v-64.461671l-21.122791 35.963191-28.428821-67.408598-24.2819 28.891194-66.530637-54.634392h-27.4410076zm64.5550106-40.487257c0-11.394994-9.082832-20.436845-20.731453-20.436845-11.250971 0-20.923965 9.041851-20.923965 20.436845 0 11.203349 9.672994 20.439986 20.923965 20.439986 11.648621 0 20.731453-9.236637 20.731453-20.439986z" fill="black" transform="matrix(1 0 0 -1 0 301)"/>
-
-
-</svg>
-`;
-//# sourceMappingURL=images.js.map

package/dist/src/assets/img/icons/images.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"images.js","sourceRoot":"","sources":["../../../../../src/assets/img/icons/images.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAA;;;;;;;CAO5B,CAAC","sourcesContent":["import { svg } from 'lit';\n\nexport const imagesIcon = svg`\n<svg viewBox=\"0 0 300 300\"\n  xmlns=\"http://www.w3.org/2000/svg\">\n<path d=\"m43.0952612 181.159979c2.1744514 0 21.7161099 3.336499 21.7161099 3.336499v21.030628l-44.8113711-6.289709c4.5382599-51.29161 9.6729948-105.5332879 14.6089046-156.237397 66.1329874 6.484496 144.5110704 16.1138469 211.0385514 22.4035567-.987813 6.4876377-1.581132 21.8160564-1.972471 28.3005524-4.939065-.5906421-15.599873 0-20.535783-.5906421v-9.0418506c-56.065498-5.3032118-112.326666-12.180422-168.3953197-17.6847035 0 0-7.7005244 74.2858081-11.6486211 114.7730661zm31.7867547-81.562016h205.1179841v158.402037h-205.1179841zm18.9514955 140.126691h167.8051566v-64.461671l-21.122791 35.963191-28.428821-67.408598-24.2819 28.891194-66.530637-54.634392h-27.4410076zm64.5550106-40.487257c0-11.394994-9.082832-20.436845-20.731453-20.436845-11.250971 0-20.923965 9.041851-20.923965 20.436845 0 11.203349 9.672994 20.439986 20.923965 20.439986 11.648621 0 20.731453-9.236637 20.731453-20.439986z\" fill=\"black\" transform=\"matrix(1 0 0 -1 0 301)\"/>\n\n\n</svg>\n`;\n"]}

package/dist/src/assets/img/icons/mediatype/etree copy.d.ts

@@ -1 +0,0 @@
-export declare const etreeIcon: import("lit-html").TemplateResult<2>;