@internetarchive/collection-browser 0.1.7 → 0.1.9

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

@@ -28,7 +28,9 @@ export class TileListCompact extends LitElement {
   render() {
     return html`
       <div id="list-line" class="${this.classSize}">
-        <div id="thumb">${this.imageTemplate}</div>
+        <div id="thumb" class="${ifDefined(this.model?.mediatype)}">
+          ${this.imageTemplate}
+        </div>
         <div id="title">${DOMPurify.sanitize(this.model?.title ?? '')}</div>
         <div id="creator">
           ${this.model?.mediatype === 'account'
@@ -63,11 +65,15 @@ export class TileListCompact extends LitElement {
     if (!this.model?.identifier) {
       return nothing;
     }
-    return html` <img
-      src="${this.baseImageUrl}/services/img/${this.model.identifier}"
-      alt="${this.model.identifier}"
-      class="${this.model?.mediatype}"
-    />`;
+    return html`
+      <item-image
+        .model=${this.model}
+        .baseImageUrl=${this.baseImageUrl}
+        .isListTile=${true}
+        .isCompactTile=${true}
+      >
+      </item-image>
+    `;
   }
 
   /*
@@ -120,43 +126,58 @@ export class TileListCompact extends LitElement {
         font-size: 14px;
       }
 
-      /* fields */
+      #list-line {
+        display: grid;
+        column-gap: 10px;
+        border-top: 1px solid #ddd;
+        align-items: center;
+        line-height: 20px;
+      }
 
-      #thumb {
-        padding-left: 6px;
+      #list-line.mobile {
+        grid-template-columns: 36px 3fr 2fr 62px 19px;
+      }
+
+      #list-line.desktop {
+        grid-template-columns: 51px 3fr 2fr 100px 20px 60px;
+      }
+
+      #list-line:hover #title {
+        text-decoration: underline;
       }
 
-      #thumb img {
+      /* fields */
+      #thumb {
         object-fit: cover;
         display: block;
       }
 
-      .mobile #thumb img {
+      .mobile #thumb {
         width: 30px;
         height: 30px;
+        padding-top: 2px;
+        padding-bottom: 2px;
+        padding-left: 4px;
       }
 
-      .desktop #thumb img {
+      .desktop #thumb {
         width: 45px;
         height: 45px;
+        padding-top: 5px;
+        padding-bottom: 5px;
+        padding-left: 6px;
       }
 
-      #thumb img.collection {
-        border-radius: 8px;
-        -webkit-border-radius: 8px;
-        -moz-border-radius: 8px;
+      #thumb.collection {
+        --border-radius: 8px;
       }
 
-      .mobile #thumb img.account {
-        border-radius: 15px;
-        -webkit-border-radius: 15px;
-        -moz-border-radius: 15px;
+      .mobile #thumb.account {
+        --border-radius: 15px;
       }
 
-      .desktop #thumb img.account {
-        border-radius: 22.5px;
-        -webkit-border-radius: 22.5px;
-        -moz-border-radius: 22.5px;
+      .desktop #thumb.account {
+        --border-radius: 22.5px;
       }
 
       #title {
@@ -189,32 +210,6 @@ export class TileListCompact extends LitElement {
         --iconHeight: 20px;
         --iconWidth: 20px;
       }
-
-      /* list-line */
-
-      #list-line {
-        display: grid;
-        column-gap: 10px;
-        border-top: 1px solid #ddd;
-        align-items: center;
-        line-height: 20px;
-      }
-
-      #list-line.mobile {
-        grid-template-columns: 36px 3fr 2fr 62px 19px;
-        padding-top: 2px;
-        padding-bottom: 2px;
-      }
-
-      #list-line.desktop {
-        grid-template-columns: 51px 3fr 2fr 100px 20px 60px;
-        padding-top: 5px;
-        padding-bottom: 5px;
-      }
-
-      #list-line:hover #title {
-        text-decoration: underline;
-      }
     `;
   }
 }

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

@@ -87,7 +87,9 @@ export class TileList extends LitElement {
     return html`
       <div id="list-line-top">
         <div id="list-line-left">
-          <div id="thumb">${this.imgTemplate}</div>
+          <div id="thumb" class="${ifDefined(this.model?.mediatype)}">
+            ${this.imgTemplate}
+          </div>
         </div>
         <div id="list-line-right">
           <div id="title-line">
@@ -103,7 +105,9 @@ export class TileList extends LitElement {
   private get desktopTemplate() {
     return html`
       <div id="list-line-left">
-        <div id="thumb">${this.imgTemplate}</div>
+        <div id="thumb" class="${ifDefined(this.model?.mediatype)}">
+          ${this.imgTemplate}
+        </div>
       </div>
       <div id="list-line-right">
         <div id="title-line">
@@ -134,11 +138,14 @@ export class TileList extends LitElement {
     if (!this.model?.identifier) {
       return nothing;
     }
-    return html` <img
-      src="${this.baseImageUrl}/services/img/${this.model.identifier}"
-      alt="${this.model.identifier}"
-      class=${this.model?.mediatype}
-    />`;
+    return html`
+      <item-image
+        .model=${this.model}
+        .baseImageUrl=${this.baseImageUrl}
+        .isListTile=${true}
+      >
+      </item-image>
+    `;
   }
 
   private get iconRightTemplate() {
@@ -412,32 +419,26 @@ export class TileList extends LitElement {
         display: block;
       }
 
-      .mobile #thumb img {
+      .mobile #thumb {
         width: 90px;
         height: 90px;
       }
 
-      .desktop #thumb img {
+      .desktop #thumb {
         width: 100px;
         height: 100px;
       }
 
-      #thumb img.collection {
-        border-radius: 8px;
-        -webkit-border-radius: 8px;
-        -moz-border-radius: 8px;
+      #thumb.collection {
+        --border-radius: 8px;
       }
 
-      .mobile #thumb img.account {
-        border-radius: 45px;
-        -webkit-border-radius: 45px;
-        -moz-border-radius: 45px;
+      .mobile #thumb.account {
+        --border-radius: 45px;
       }
 
-      .desktop #thumb img.account {
-        border-radius: 50px;
-        -webkit-border-radius: 50px;
-        -moz-border-radius: 50px;
+      .desktop #thumb.account {
+        --border-radius: 50px;
       }
 
       #icon-right {

package/tsconfig.json

@@ -16,5 +16,5 @@
     "rootDir": "./",
     "declaration": true
   },
-  "include": ["**/*.ts"]
+  "include": ["src", "test", "index.ts"],
 }

package/vite.config.ts

@@ -0,0 +1,22 @@
+import { defineConfig } from 'vite';
+import { resolve } from 'path';
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  base: '',
+  build: {
+    outDir: 'ghpages',
+    manifest: true,
+    rollupOptions: {
+      input: {
+        main: resolve(__dirname, 'index.html'),
+      },
+    },
+  },
+  server: {
+    host: true,
+    port: 8080,
+    open: true,
+    cors: true,
+  },
+});

package/web-dev-server.config.mjs

@@ -5,7 +5,7 @@ const hmr = process.argv.includes('--hmr');
 
 export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
   nodeResolve: true,
-  open: '/demo/',
+  open: '/',
   watch: !hmr,
 
   /** Compile JS for older browsers. Requires @web/dev-server-esbuild plugin */

package/dist/demo/app-root.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"app-root.js","sourceRoot":"","sources":["../../demo/app-root.ts"],"names":[],"mappings":"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","sourcesContent":["import { SearchService } from '@internetarchive/search-service';\nimport { LocalCache } from '@internetarchive/local-cache';\nimport { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport { SharedResizeObserver } from '@internetarchive/shared-resize-observer';\nimport { CollectionNameCache } from '@internetarchive/collection-name-cache';\nimport type { CollectionBrowser } from '../src/collection-browser';\nimport '../src/collection-browser';\n\n@customElement('app-root')\nexport class AppRoot extends LitElement {\n  private searchService = SearchService.default;\n\n  private resizeObserver = new SharedResizeObserver();\n\n  private localCache = new LocalCache();\n\n  private collectionNameCache = new CollectionNameCache({\n    searchService: this.searchService,\n    localCache: this.localCache,\n  });\n\n  @state() private currentPage?: number;\n\n  @state() private searchQuery?: string;\n\n  @state() private cellWidth: number = 18;\n\n  @state() private cellHeight: number = 29;\n\n  @state() private rowGap: number = 1.7;\n\n  @state() private colGap: number = 1.7;\n\n  @query('#base-query-field') private baseQueryField!: HTMLInputElement;\n\n  @query('#page-number-input') private pageNumberInput!: HTMLInputElement;\n\n  @query('collection-browser') private collectionBrowser!: CollectionBrowser;\n\n  private searchPressed(e: Event) {\n    e.preventDefault();\n    this.searchQuery = this.baseQueryField.value;\n    if ((this.currentPage ?? 1) > 1) {\n      this.collectionBrowser.goToPage(this.currentPage ?? 1);\n    }\n  }\n\n  private changePagePressed(e: Event) {\n    e.preventDefault();\n    this.currentPage = this.pageNumberInput.valueAsNumber;\n    this.collectionBrowser.goToPage(this.currentPage);\n  }\n\n  protected updated(changed: PropertyValues): void {\n    if (changed.has('currentPage') && this.currentPage) {\n      this.pageNumberInput.value = this.currentPage.toString();\n    }\n\n    if (changed.has('searchQuery')) {\n      this.queryUpdated();\n    }\n  }\n\n  private queryUpdated() {\n    this.collectionBrowser.baseQuery = this.searchQuery;\n  }\n\n  render() {\n    return html`\n      <div id=\"dev-tools\">\n        <form @submit=${this.searchPressed}>\n          Query:\n          <input\n            type=\"text\"\n            id=\"base-query-field\"\n            .value=${this.searchQuery ?? ''}\n          />\n          <input type=\"submit\" value=\"Search\" />\n        </form>\n\n        <form @submit=${this.changePagePressed}>\n          Page: <input type=\"number\" value=\"1\" id=\"page-number-input\" />\n          <input type=\"submit\" value=\"Go\" />\n        </form>\n\n        <div id=\"cell-controls\">\n          <div id=\"cell-size-control\">\n            <div>\n              <label for=\"cell-width-slider\">Minimum cell width:</label>\n              <input\n                type=\"range\"\n                min=\"10\"\n                max=\"100\"\n                value=\"18\"\n                step=\"0.1\"\n                id=\"cell-width-slider\"\n                @input=${this.widthChanged}\n              />\n              <span>${this.cellWidth}rem</span>\n            </div>\n            <div>\n              <label for=\"cell-height-slider\">Cell height:</label>\n              <input\n                type=\"range\"\n                min=\"10\"\n                max=\"100\"\n                value=\"29\"\n                step=\"0.1\"\n                id=\"cell-height-slider\"\n                @input=${this.heightChanged}\n              />\n              <span>${this.cellHeight}rem</span>\n            </div>\n            <div>\n              <label for=\"show-outline-check\">Show outlines:</label>\n              <input\n                type=\"checkbox\"\n                id=\"show-outline-check\"\n                @click=${this.outlineChanged}\n              />\n            </div>\n          </div>\n          <div id=\"cell-gap-control\">\n            <div>\n              <label for=\"cell-row-gap-slider\">Row gap:</label>\n              <input\n                type=\"range\"\n                min=\"0\"\n                max=\"5\"\n                value=\"1.7\"\n                step=\"0.1\"\n                id=\"cell-row-gap-slider\"\n                @input=${this.rowGapChanged}\n              />\n              <span>${this.rowGap}rem</span>\n            </div>\n            <div>\n              <label for=\"cell-col-gap-slider\">Col gap:</label>\n              <input\n                type=\"range\"\n                min=\"0\"\n                max=\"5\"\n                value=\"1.7\"\n                step=\"0.1\"\n                id=\"cell-col-gap-slider\"\n                @input=${this.colGapChanged}\n              />\n              <span>${this.colGap}rem</span>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div id=\"collection-browser-container\">\n        <collection-browser\n          .baseNavigationUrl=${'https://archive.org'}\n          .baseImageUrl=${'https://archive.org'}\n          .searchService=${this.searchService}\n          .resizeObserver=${this.resizeObserver}\n          .collectionNameCache=${this.collectionNameCache}\n          .showHistogramDatePicker=${true}\n          @visiblePageChanged=${this.visiblePageChanged}\n          @baseQueryChanged=${this.baseQueryChanged}\n        >\n        </collection-browser>\n      </div>\n    `;\n  }\n\n  private baseQueryChanged(e: CustomEvent<{ baseQuery?: string }>) {\n    this.searchQuery = e.detail.baseQuery;\n  }\n\n  private outlineChanged(e: Event) {\n    const target = e.target as HTMLInputElement;\n    if (target.checked) {\n      this.collectionBrowser.style.setProperty(\n        '--infiniteScrollerCellOutline',\n        '1px solid #33D1FF'\n      );\n    } else {\n      this.collectionBrowser.style.removeProperty(\n        '--infiniteScrollerCellOutline'\n      );\n    }\n  }\n\n  private rowGapChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.rowGap = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserRowGap',\n      `${input.value}rem`\n    );\n  }\n\n  private colGapChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.colGap = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserColGap',\n      `${input.value}rem`\n    );\n  }\n\n  private widthChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.cellWidth = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserCellMinWidth',\n      `${input.value}rem`\n    );\n  }\n\n  private heightChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.cellHeight = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserCellMinHeight',\n      `${input.value}rem`\n    );\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserCellMaxHeight',\n      `${input.value}rem`\n    );\n  }\n\n  private visiblePageChanged(e: CustomEvent<{ pageNumber: number }>) {\n    const { pageNumber } = e.detail;\n    if (pageNumber === this.currentPage) return;\n    this.currentPage = pageNumber;\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n    }\n\n    input,\n    button {\n      font-size: 1.6rem;\n    }\n\n    collection-browser {\n      margin-top: 30rem;\n    }\n\n    #base-query-field {\n      width: 300px;\n    }\n\n    #dev-tools {\n      position: fixed;\n      top: 0;\n      left: 0;\n      z-index: 10;\n      -webkit-backdrop-filter: blur(10px);\n      backdrop-filter: blur(10px);\n      padding: 0.5rem 1rem;\n      border: 1px solid black;\n    }\n\n    #cell-controls {\n      display: flex;\n    }\n\n    #cell-controls label {\n      display: inline-block;\n      width: 10rem;\n    }\n\n    #cell-gap-control {\n      margin-left: 1rem;\n    }\n  `;\n}\n"]}

package/dist/src/assets/img/icons/mediatype/livemusic.d.ts

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

package/dist/src/assets/img/icons/mediatype/livemusic.js

@@ -1,7 +0,0 @@
-import { svg } from 'lit';
-export const livemusicIcon = 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="gray" fill-rule="evenodd" transform="matrix(1 0 0 -1 0 301)"/>
-</svg>
-`;
-//# sourceMappingURL=livemusic.js.map

package/dist/src/assets/img/icons/mediatype/livemusic.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"livemusic.js","sourceRoot":"","sources":["../../../../../../src/assets/img/icons/mediatype/livemusic.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,CAAA;;;;CAI/B,CAAC","sourcesContent":["import { svg } from 'lit';\n\nexport const livemusicIcon = svg`\n<svg viewBox=\"0 0 300 300\" 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=\"gray\" fill-rule=\"evenodd\" transform=\"matrix(1 0 0 -1 0 301)\"/>\n</svg>\n`;\n"]}

package/dist/src/assets/img/icons/mediatype/photos.d.ts

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

package/dist/src/assets/img/icons/mediatype/photos.js

@@ -1,7 +0,0 @@
-import { svg } from 'lit';
-export const photosIcon = 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="gray" transform="matrix(1 0 0 -1 0 301)"/>
-</svg>
-`;
-//# sourceMappingURL=photos.js.map

package/dist/src/assets/img/icons/mediatype/photos.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"photos.js","sourceRoot":"","sources":["../../../../../../src/assets/img/icons/mediatype/photos.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,UAAU,GAAG,GAAG,CAAA;;;;CAI5B,CAAC","sourcesContent":["import { svg } from 'lit';\n\nexport const photosIcon = svg`\n<svg viewBox=\"0 0 300 300\" 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=\"gray\" transform=\"matrix(1 0 0 -1 0 301)\"/>\n</svg>\n`;\n"]}

package/dist/src/helpers.d.ts

@@ -1 +0,0 @@
-export declare const nFormatter: (num: any, digits: number) => string;

package/dist/src/helpers.js

@@ -1,20 +0,0 @@
-export const nFormatter = (num, digits) => {
-    const lookup = [
-        { value: 1, symbol: '' },
-        { value: 1e3, symbol: 'K' },
-        { value: 1e6, symbol: 'M' },
-        { value: 1e9, symbol: 'B' },
-        { value: 1e12, symbol: 'T' },
-        { value: 1e15, symbol: 'P' },
-        { value: 1e18, symbol: 'E' },
-    ];
-    const rx = /\.0+$|(\.[0-9]*[1-9])0+$/;
-    const item = lookup
-        .slice()
-        .reverse()
-        .find(i => num >= i.value);
-    return item
-        ? (num / item.value).toFixed(digits).replace(rx, '$1') + item.symbol
-        : '0';
-};
-//# sourceMappingURL=helpers.js.map

package/dist/src/helpers.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"helpers.js","sourceRoot":"","sources":["../../src/helpers.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,GAAQ,EAAE,MAAc,EAAE,EAAE;IACrD,MAAM,MAAM,GAAG;QACb,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE;QACxB,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE;QAC3B,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE;QAC3B,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE;QAC3B,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE;QAC5B,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE;QAC5B,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE;KAC7B,CAAC;IACF,MAAM,EAAE,GAAG,0BAA0B,CAAC;IACtC,MAAM,IAAI,GAAG,MAAM;SAChB,KAAK,EAAE;SACP,OAAO,EAAE;SACT,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,CAAC,KAAK,CAAC,CAAC;IAC7B,OAAO,IAAI;QACT,CAAC,CAAC,CAAC,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAAE,EAAE,IAAI,CAAC,GAAG,IAAI,CAAC,MAAM;QACpE,CAAC,CAAC,GAAG,CAAC;AACV,CAAC,CAAC","sourcesContent":["export const nFormatter = (num: any, digits: number) => {\n  const lookup = [\n    { value: 1, symbol: '' },\n    { value: 1e3, symbol: 'K' },\n    { value: 1e6, symbol: 'M' },\n    { value: 1e9, symbol: 'B' },\n    { value: 1e12, symbol: 'T' },\n    { value: 1e15, symbol: 'P' },\n    { value: 1e18, symbol: 'E' },\n  ];\n  const rx = /\\.0+$|(\\.[0-9]*[1-9])0+$/;\n  const item = lookup\n    .slice()\n    .reverse()\n    .find(i => num >= i.value);\n  return item\n    ? (num / item.value).toFixed(digits).replace(rx, '$1') + item.symbol\n    : '0';\n};\n"]}

package/dist/src/mediatype/mediatype-color.d.ts

@@ -1,3 +0,0 @@
-export declare const mediatypeColor: {
-    [key: string]: string;
-};

package/dist/src/mediatype/mediatype-color.js

@@ -1,15 +0,0 @@
-export const mediatypeColor = {
-    account: '#000000',
-    audio: '#8fdaef',
-    data: '#333333',
-    etree: '#3871c1',
-    film: '#bf1b2c',
-    image: '#62c4a9',
-    movies: '#bf1b2c',
-    software: '#80cc28',
-    texts: '#f9a72b',
-    tv: '#f25d54',
-    video: '#bf1b2c',
-    web: '#fddd10',
-};
-//# sourceMappingURL=mediatype-color.js.map

package/dist/src/mediatype/mediatype-color.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mediatype-color.js","sourceRoot":"","sources":["../../../src/mediatype/mediatype-color.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,cAAc,GAA8B;IACvD,OAAO,EAAE,SAAS;IAClB,KAAK,EAAE,SAAS;IAChB,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,SAAS;IAChB,IAAI,EAAE,SAAS;IACf,KAAK,EAAE,SAAS;IAChB,MAAM,EAAE,SAAS;IACjB,QAAQ,EAAE,SAAS;IACnB,KAAK,EAAE,SAAS;IAChB,EAAE,EAAE,SAAS;IACb,KAAK,EAAE,SAAS;IAChB,GAAG,EAAE,SAAS;CACf,CAAC","sourcesContent":["export const mediatypeColor: { [key: string]: string } = {\n  account: '#000000',\n  audio: '#8fdaef',\n  data: '#333333',\n  etree: '#3871c1',\n  film: '#bf1b2c',\n  image: '#62c4a9',\n  movies: '#bf1b2c',\n  software: '#80cc28',\n  texts: '#f9a72b',\n  tv: '#f25d54',\n  video: '#bf1b2c',\n  web: '#fddd10',\n};\n"]}

package/dist/src/mediatype/mediatype-display.d.ts

@@ -1,3 +0,0 @@
-export declare const mediatypeData: {
-    [key: string]: any;
-};

package/dist/src/mediatype/mediatype-display.js

@@ -1,86 +0,0 @@
-import { accountIcon } from '../assets/img/icons/mediatype/account';
-import { audioIcon } from '../assets/img/icons/mediatype/audio';
-import { collectionIcon } from '../assets/img/icons/mediatype/collection';
-import { dataIcon } from '../assets/img/icons/mediatype/data';
-import { etreeIcon } from '../assets/img/icons/mediatype/etree';
-import { imagesIcon } from '../assets/img/icons/mediatype/images';
-import { filmIcon } from '../assets/img/icons/mediatype/film';
-import { radioIcon } from '../assets/img/icons/mediatype/radio';
-import { softwareIcon } from '../assets/img/icons/mediatype/software';
-import { textsIcon } from '../assets/img/icons/mediatype/texts';
-import { tvIcon } from '../assets/img/icons/mediatype/tv';
-import { videoIcon } from '../assets/img/icons/mediatype/video';
-import { webIcon } from '../assets/img/icons/mediatype/web';
-export const mediatypeData = {
-    account: {
-        color: '#000000',
-        icon: accountIcon,
-        text: 'Account',
-    },
-    audio: {
-        color: '#8fdaef',
-        icon: audioIcon,
-        text: 'Audio',
-    },
-    collection: {
-        color: '#000000',
-        icon: collectionIcon,
-        text: 'Collection',
-    },
-    data: {
-        color: '#333333',
-        icon: dataIcon,
-        text: 'Data',
-    },
-    etree: {
-        color: '#3871c1',
-        icon: etreeIcon,
-        text: 'E-tree',
-    },
-    film: {
-        color: '#bf1b2c',
-        icon: filmIcon,
-        text: 'Film',
-    },
-    image: {
-        color: '#62c4a9',
-        icon: imagesIcon,
-        text: 'Image',
-    },
-    movies: {
-        color: '#bf1b2c',
-        icon: filmIcon,
-        text: 'Movie',
-    },
-    radio: {
-        color: '#8fdaef',
-        icon: radioIcon,
-        text: 'Radio',
-    },
-    software: {
-        color: '#80cc28',
-        icon: softwareIcon,
-        text: 'Software',
-    },
-    texts: {
-        color: '#f9a72b',
-        icon: textsIcon,
-        text: 'Text',
-    },
-    tv: {
-        color: '#f25d54',
-        icon: tvIcon,
-        text: 'TV',
-    },
-    video: {
-        color: '#bf1b2c',
-        icon: videoIcon,
-        text: 'Video',
-    },
-    web: {
-        color: '#fddd10',
-        icon: webIcon,
-        text: 'Web',
-    },
-};
-//# sourceMappingURL=mediatype-display.js.map

package/dist/src/mediatype/mediatype-display.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mediatype-display.js","sourceRoot":"","sources":["../../../src/mediatype/mediatype-display.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AACtE,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAC1D,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,mCAAmC,CAAC;AAE5D,MAAM,CAAC,MAAM,aAAa,GAA2B;IACnD,OAAO,EAAE;QACP,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,WAAW;QACjB,IAAI,EAAE,SAAS;KAChB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,OAAO;KACd;IACD,UAAU,EAAE;QACV,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,cAAc;QACpB,IAAI,EAAE,YAAY;KACnB;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,MAAM;KACb;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,QAAQ;KACf;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,MAAM;KACb;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,UAAU;QAChB,IAAI,EAAE,OAAO;KACd;IACD,MAAM,EAAE;QACN,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,OAAO;KACd;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,OAAO;KACd;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE,UAAU;KACjB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,MAAM;KACb;IACD,EAAE,EAAE;QACF,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,IAAI;KACX;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,OAAO;KACd;IACD,GAAG,EAAE;QACH,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,KAAK;KACZ;CACF,CAAC","sourcesContent":["import { accountIcon } from '../assets/img/icons/mediatype/account';\nimport { audioIcon } from '../assets/img/icons/mediatype/audio';\nimport { collectionIcon } from '../assets/img/icons/mediatype/collection';\nimport { dataIcon } from '../assets/img/icons/mediatype/data';\nimport { etreeIcon } from '../assets/img/icons/mediatype/etree';\nimport { imagesIcon } from '../assets/img/icons/mediatype/images';\nimport { filmIcon } from '../assets/img/icons/mediatype/film';\nimport { radioIcon } from '../assets/img/icons/mediatype/radio';\nimport { softwareIcon } from '../assets/img/icons/mediatype/software';\nimport { textsIcon } from '../assets/img/icons/mediatype/texts';\nimport { tvIcon } from '../assets/img/icons/mediatype/tv';\nimport { videoIcon } from '../assets/img/icons/mediatype/video';\nimport { webIcon } from '../assets/img/icons/mediatype/web';\n\nexport const mediatypeData: { [key: string]: any } = {\n  account: {\n    color: '#000000',\n    icon: accountIcon,\n    text: 'Account',\n  },\n  audio: {\n    color: '#8fdaef',\n    icon: audioIcon,\n    text: 'Audio',\n  },\n  collection: {\n    color: '#000000',\n    icon: collectionIcon,\n    text: 'Collection',\n  },\n  data: {\n    color: '#333333',\n    icon: dataIcon,\n    text: 'Data',\n  },\n  etree: {\n    color: '#3871c1',\n    icon: etreeIcon,\n    text: 'E-tree',\n  },\n  film: {\n    color: '#bf1b2c',\n    icon: filmIcon,\n    text: 'Film',\n  },\n  image: {\n    color: '#62c4a9',\n    icon: imagesIcon,\n    text: 'Image',\n  },\n  movies: {\n    color: '#bf1b2c',\n    icon: filmIcon,\n    text: 'Movie',\n  },\n  radio: {\n    color: '#8fdaef',\n    icon: radioIcon,\n    text: 'Radio',\n  },\n  software: {\n    color: '#80cc28',\n    icon: softwareIcon,\n    text: 'Software',\n  },\n  texts: {\n    color: '#f9a72b',\n    icon: textsIcon,\n    text: 'Text',\n  },\n  tv: {\n    color: '#f25d54',\n    icon: tvIcon,\n    text: 'TV',\n  },\n  video: {\n    color: '#bf1b2c',\n    icon: videoIcon,\n    text: 'Video',\n  },\n  web: {\n    color: '#fddd10',\n    icon: webIcon,\n    text: 'Web',\n  },\n};\n"]}

package/dist/src/mediatype/mediatype-icon.d.ts

@@ -1,10 +0,0 @@
-import { CSSResultGroup, LitElement } from 'lit';
-export declare class MediatypeIcon extends LitElement {
-    mediatype: string | undefined;
-    collections: string[] | undefined;
-    showText: boolean;
-    private readonly mediatypeIcons;
-    private get displayMediaType();
-    render(): import("lit-html").TemplateResult<1>;
-    static get styles(): CSSResultGroup;
-}

package/dist/src/mediatype/mediatype-icon.js

@@ -1,105 +0,0 @@
-import { __decorate } from "tslib";
-import { css, html, LitElement } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-import { accountIcon } from '../assets/img/icons/mediatype/account';
-import { audioIcon } from '../assets/img/icons/mediatype/audio';
-import { collectionIcon } from '../assets/img/icons/mediatype/collection';
-import { dataIcon } from '../assets/img/icons/mediatype/data';
-import { etreeIcon } from '../assets/img/icons/mediatype/etree';
-import { imagesIcon } from '../assets/img/icons/mediatype/images';
-import { filmIcon } from '../assets/img/icons/mediatype/film';
-import { radioIcon } from '../assets/img/icons/mediatype/radio';
-import { softwareIcon } from '../assets/img/icons/mediatype/software';
-import { textsIcon } from '../assets/img/icons/mediatype/texts';
-import { tvIcon } from '../assets/img/icons/mediatype/tv';
-import { videoIcon } from '../assets/img/icons/mediatype/video';
-import { webIcon } from '../assets/img/icons/mediatype/web';
-import { mediatypeColor } from './mediatype-color';
-import { mediatypeText } from './mediatype-text';
-let MediatypeIcon = class MediatypeIcon extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.showText = false;
-        this.mediatypeIcons = {
-            account: accountIcon,
-            audio: audioIcon,
-            collection: collectionIcon,
-            data: dataIcon,
-            etree: etreeIcon,
-            film: filmIcon,
-            image: imagesIcon,
-            movies: filmIcon,
-            radio: radioIcon,
-            software: softwareIcon,
-            texts: textsIcon,
-            tv: tvIcon,
-            video: videoIcon,
-            web: webIcon,
-        };
-    }
-    get displayMediaType() {
-        var _a, _b;
-        const tvIdentifier = ['tvnews', 'tvarchive', 'television'];
-        const radioIdentifier = ['radio', 'radioprogram'];
-        if (this.mediatype === 'movies' &&
-            ((_a = this.collections) === null || _a === void 0 ? void 0 : _a.some(id => tvIdentifier.indexOf(id) >= 0))) {
-            return 'tv';
-        }
-        if (this.mediatype === 'audio' &&
-            ((_b = this.collections) === null || _b === void 0 ? void 0 : _b.some(id => radioIdentifier.indexOf(id) >= 0))) {
-            return 'radio';
-        }
-        return this.mediatype;
-    }
-    render() {
-        if (!this.mediatype) {
-            return html ``;
-        }
-        const displayMediatype = this.displayMediaType || '';
-        const fillColor = mediatypeColor[displayMediatype];
-        return html `
-      <div id="icon" class="${this.showText ? 'show-text' : 'hide-text'}" style="--iconFillColor=${fillColor}">
-        ${this.mediatypeIcons[displayMediatype]}
-        <p class="status-text">${mediatypeText[displayMediatype]}</p>
-      </div>
-    `;
-    }
-    static get styles() {
-        return css `
-      .status-text {
-        font-size: 14px;
-        color: #2c2c2c;
-        margin: auto;
-        display: block;
-        text-align: center;
-      }
-
-      #icon.hide-text p {
-        display: none;
-      }
-
-      svg {
-        height: var(--iconHeight, 10px);
-        width: var(--iconWidth, 10px);
-      }
-
-      .fill-color {
-        fill: var(--iconFillColor, '#000000');
-      }
-    `;
-    }
-};
-__decorate([
-    property({ type: String })
-], MediatypeIcon.prototype, "mediatype", void 0);
-__decorate([
-    property({ type: Array })
-], MediatypeIcon.prototype, "collections", void 0);
-__decorate([
-    property({ type: Boolean })
-], MediatypeIcon.prototype, "showText", void 0);
-MediatypeIcon = __decorate([
-    customElement('mediatype-icon')
-], MediatypeIcon);
-export { MediatypeIcon };
-//# sourceMappingURL=mediatype-icon.js.map

package/dist/src/mediatype/mediatype-icon.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"mediatype-icon.js","sourceRoot":"","sources":["../../../src/mediatype/mediatype-icon.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, CSSResultGroup, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { accountIcon } from '../assets/img/icons/mediatype/account';\nimport { audioIcon } from '../assets/img/icons/mediatype/audio';\nimport { collectionIcon } from '../assets/img/icons/mediatype/collection';\nimport { dataIcon } from '../assets/img/icons/mediatype/data';\nimport { etreeIcon } from '../assets/img/icons/mediatype/etree';\nimport { imagesIcon } from '../assets/img/icons/mediatype/images';\nimport { filmIcon } from '../assets/img/icons/mediatype/film';\nimport { radioIcon } from '../assets/img/icons/mediatype/radio';\nimport { softwareIcon } from '../assets/img/icons/mediatype/software';\nimport { textsIcon } from '../assets/img/icons/mediatype/texts';\nimport { tvIcon } from '../assets/img/icons/mediatype/tv';\nimport { videoIcon } from '../assets/img/icons/mediatype/video';\nimport { webIcon } from '../assets/img/icons/mediatype/web';\n\nimport { mediatypeColor } from './mediatype-color';\nimport { mediatypeText } from './mediatype-text';\n\n@customElement('mediatype-icon')\nexport class MediatypeIcon extends LitElement {\n  @property({ type: String }) mediatype: string | undefined;\n\n  @property({ type: Array }) collections: string[] | undefined;\n\n  @property({ type: Boolean }) showText = false;\n\n  private readonly mediatypeIcons: { [key: string]: any } = {\n    account: accountIcon,\n    audio: audioIcon,\n    collection: collectionIcon,\n    data: dataIcon,\n    etree: etreeIcon,\n    film: filmIcon,\n    image: imagesIcon,\n    movies: filmIcon,\n    radio: radioIcon,\n    software: softwareIcon,\n    texts: textsIcon,\n    tv: tvIcon,\n    video: videoIcon,\n    web: webIcon,\n  };\n\n  private get displayMediaType() {\n    const tvIdentifier = ['tvnews', 'tvarchive', 'television'];\n    const radioIdentifier = ['radio', 'radioprogram'];\n\n    if (\n      this.mediatype === 'movies' &&\n      this.collections?.some(id => tvIdentifier.indexOf(id) >= 0)\n    ) {\n      return 'tv';\n    }\n    if (\n      this.mediatype === 'audio' &&\n      this.collections?.some(id => radioIdentifier.indexOf(id) >= 0)\n    ) {\n      return 'radio';\n    }\n    return this.mediatype;\n  }\n\n  render() {\n    if (!this.mediatype) {\n      return html``;\n    }\n\n    const displayMediatype = this.displayMediaType || '';\n    const fillColor = mediatypeColor[displayMediatype];\n\n    return html`\n      <div id=\"icon\" class=\"${this.showText ? 'show-text' : 'hide-text'}\" style=\"--iconFillColor=${fillColor}\">\n        ${this.mediatypeIcons[displayMediatype]}\n        <p class=\"status-text\">${mediatypeText[displayMediatype]}</p>\n      </div>\n    `;\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      .status-text {\n        font-size: 14px;\n        color: #2c2c2c;\n        margin: auto;\n        display: block;\n        text-align: center;\n      }\n\n      #icon.hide-text p {\n        display: none;\n      }\n\n      svg {\n        height: var(--iconHeight, 10px);\n        width: var(--iconWidth, 10px);\n      }\n\n      .fill-color {\n        fill: var(--iconFillColor, '#000000');\n      }\n    `;\n  }\n}\n"]}

package/dist/src/mediatype/mediatype-text.d.ts

@@ -1,3 +0,0 @@
-export declare const mediatypeText: {
-    [key: string]: any;
-};