@internetarchive/collection-browser - npm Package Compare versions

Comparing version 0.0.1-alpha.42 to 0.0.1-alpha.43

demo/app-root.ts

@@ -17,3 +17,3 @@ import {
     new DefaultSearchBackend({
-      baseUrl: 'ia-petabox-offshoot-search.archive.org',
+      baseUrl: 'ia-petabox-webdev-5245-advancedsearch-cors.archive.org',
     })
@@ -20,0 +20,0 @@ );

dist/demo/app-root.js

@@ -13,3 +13,3 @@ import { __decorate } from "tslib";
         this.searchService = new SearchService(new DefaultSearchBackend({
-            baseUrl: 'ia-petabox-offshoot-search.archive.org',
+            baseUrl: 'ia-petabox-webdev-5245-advancedsearch-cors.archive.org',
         }));
@@ -16,0 +16,0 @@ this.resizeObserver = new SharedResizeObserver();

dist/src/sort-filter-bar/img/list.js

 import { svg } from 'lit';
 export const listIcon = svg `
-<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><g fill="#000" fill-rule="nonzero"><path d="m97.8975061 6h-65.7343743c-.6409315 0-1.1612995-.29021372-1.5611039-.87064117-.3998043-.58042745-.6004844-1.3048369-.60204-2.17322835 0-.81214848.20068-1.50731158.60204-2.08548931.4013601-.57817773.921728-.86839145 1.5611039-.87064117h65.7343743c.5600372 0 1.0508477.29021372 1.4724313.87064117s.6315976 1.27559055.6300505 2.08548931c0 .86839145-.2100226 1.5928009-.6300505 2.17322835-.420028.58042745-.9108384.87064117-1.4724313.87064117z"/><path d="m97.8975061 65h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 13h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 72h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 20h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 79h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 27h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 86h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 34h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 93h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 41h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 100h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m0 0h25v25h-25z"/><path d="m0 59h25v25h-25z"/></g></svg>
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><g fill="#000" fill-rule="nonzero"><path d="m97.8975061 6h-65.7343743c-.6409315 0-1.1612995-.29021372-1.5611039-.87064117-.3998043-.58042745-.6004844-1.3048369-.60204-2.17322835 0-.81214848.20068-1.50731158.60204-2.08548931.4013601-.57817773.921728-.86839145 1.5611039-.87064117h65.7343743c.5600372 0 1.0508477.29021372 1.4724313.87064117s.6315976 1.27559055.6300505 2.08548931c0 .86839145-.2100226 1.5928009-.6300505 2.17322835-.420028.58042745-.9108384.87064117-1.4724313.87064117z"/><path d="m97.8975061 61h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 19h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 74h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 32h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 87h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 45h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 100h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m0 0h25v25h-25z"/><path d="m0 55h25v25h-25z"/></g></svg>
 `;
 //# sourceMappingURL=list.js.map

dist/src/tiles/grid/item-tile.d.ts

 import { CSSResultGroup, LitElement } from 'lit';
 import { TileModel } from '../../models';
 import '../../mediatype-icon';
+import '../../waveform-thumbnail';
 export declare class ItemTile extends LitElement {
@@ -5,0 +6,0 @@ model?: TileModel;

dist/src/tiles/grid/item-tile.js

@@ -7,2 +7,3 @@ import { __decorate } from "tslib";
 import '../../mediatype-icon';
+import '../../waveform-thumbnail';
 import { favoriteFilledIcon } from './icons/favorite-filled';
@@ -30,3 +31,3 @@ import { reviewsIcon } from './icons/reviews';
     get renderItemImageView() {
-        var _a, _b;
+        var _a, _b, _c;
         const imgSrcUrl = `${this.baseNavigationUrl}/services/img/${(_a = this.model) === null || _a === void 0 ? void 0 : _a.identifier}`;
@@ -37,4 +38,15 @@ const containsDeemphasize = (_b = this.model) === null || _b === void 0 ? void 0 : _b.collections.includes('deemphasize');
         const tileActionClass = `tile-action no-preview${!containsDeemphasize ? ' hidden' : ''}`;
-        return html `
-      <div class=${itemImageBoxClass}>
+        const isMediatypeAudio = ((_c = this.model) === null || _c === void 0 ? void 0 : _c.mediatype) === 'audio';
+        const renderView = () => {
+            var _a;
+            if (isMediatypeAudio) {
+                return html `
+          <waveform-thumbnail
+            .baseNavigationUrl=${this.baseNavigationUrl}
+            .identifier=${(_a = this.model) === null || _a === void 0 ? void 0 : _a.identifier}
+          >
+          </waveform-thumbnail>
+        `;
+            }
+            return html `
         <div
@@ -44,2 +56,7 @@ class=${itemImageClass}
         ></div>
+      `;
+        };
+        return html `
+      <div class=${itemImageBoxClass}>
+        ${renderView()}
         <div class=${tileActionClass}>Content may be inappropriate</div>
@@ -46,0 +63,0 @@ </div>

dist/src/tiles/list/tile-list.js

@@ -173,4 +173,4 @@ import { __decorate } from "tslib";
       <div id="collections" class="metadata">
-        ${this.labelTemplate('Collections', true)}
-        ${join(map(this.model.collections, id => this.collectionLink(id)), html `,&nbsp;`)}
+        ${this.labelTemplate('Collections')}
+        ${join(map(this.model.collections, id => this.collectionLink(id)), html `, `)}
       </div>
@@ -193,3 +193,3 @@ `;
     }
-    labelTemplate(label, isFlex = false) {
+    labelTemplate(label) {
         // Note nobreak space needed to use display:flex
@@ -199,3 +199,3 @@ // in parent element when making , delimnited list
         return html `${label
-            ? html `<span class="label">${label}:${isFlex ? html `&nbsp;` : ` `}</span>`
+            ? html `<span class="label">${label}: </span>`
             : nothing}`;
@@ -373,10 +373,2 @@ }
 
-      #collections {
-        /*
-          Hack to collapse line whitespace between text and ,
-          Use &nbsp; for required spaces
-        */
-        display: flex;
-      }
-
       #description {
@@ -399,3 +391,3 @@ padding-top: 10px;
         display: flex;
-        column-gap: 5px;
+        column-gap: 10px;
       }
@@ -407,2 +399,6 @@
 
+      async-collection-name {
+        display: inline-block;
+      }
+
       div a:hover {
@@ -409,0 +405,0 @@ text-decoration: underline;

package.json

@@ -6,3 +6,3 @@ {
   "author": "Internet Archive",
-  "version": "0.0.1-alpha.42",
+  "version": "0.0.1-alpha.43",
   "main": "dist/index.js",
@@ -22,3 +22,3 @@ "module": "dist/index.js",
   "dependencies": {
-    "@internetarchive/collection-name-cache": "^0.1.0",
+    "@internetarchive/collection-name-cache": "^0.1.1",
     "@internetarchive/feature-feedback": "^0.1.2",
@@ -28,3 +28,3 @@ "@internetarchive/field-parsers": "^0.1.3",
     "@internetarchive/infinite-scroller": "^0.1.0",
-    "@internetarchive/search-service": "^0.3.0",
+    "@internetarchive/search-service": "^0.3.1",
     "@internetarchive/shared-resize-observer": "^0.2.0",
@@ -31,0 +31,0 @@ "@lit/localize": "^0.11.2",

src/sort-filter-bar/img/list.ts

 import { svg } from 'lit';
 
 export const listIcon = svg`
-<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><g fill="#000" fill-rule="nonzero"><path d="m97.8975061 6h-65.7343743c-.6409315 0-1.1612995-.29021372-1.5611039-.87064117-.3998043-.58042745-.6004844-1.3048369-.60204-2.17322835 0-.81214848.20068-1.50731158.60204-2.08548931.4013601-.57817773.921728-.86839145 1.5611039-.87064117h65.7343743c.5600372 0 1.0508477.29021372 1.4724313.87064117s.6315976 1.27559055.6300505 2.08548931c0 .86839145-.2100226 1.5928009-.6300505 2.17322835-.420028.58042745-.9108384.87064117-1.4724313.87064117z"/><path d="m97.8975061 65h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 13h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 72h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 20h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 79h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 27h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 86h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 34h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 93h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 41h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m97.8975061 100h-65.7343743c-.6409315 0-1.1612995-.0967379-1.5611039-.2902137-.3998043-.1934758-.6004844-.4349457-.60204-.7244095 0-.2707161.20068-.5024372.60204-.6951631.4013601-.1927259.921728-.2894638 1.5611039-.2902137h65.7343743c.5600372 0 1.0508477.0967379 1.4724313.2902137s.6315976.4251969.6300505.6951631c0 .2894638-.2100226.5309337-.6300505.7244095-.420028.1934758-.9108384.2902137-1.4724313.2902137z"/><path d="m0 0h25v25h-25z"/><path d="m0 59h25v25h-25z"/></g></svg>
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"><g fill="#000" fill-rule="nonzero"><path d="m97.8975061 6h-65.7343743c-.6409315 0-1.1612995-.29021372-1.5611039-.87064117-.3998043-.58042745-.6004844-1.3048369-.60204-2.17322835 0-.81214848.20068-1.50731158.60204-2.08548931.4013601-.57817773.921728-.86839145 1.5611039-.87064117h65.7343743c.5600372 0 1.0508477.29021372 1.4724313.87064117s.6315976 1.27559055.6300505 2.08548931c0 .86839145-.2100226 1.5928009-.6300505 2.17322835-.420028.58042745-.9108384.87064117-1.4724313.87064117z"/><path d="m97.8975061 61h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 19h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 74h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 32h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 87h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 45h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m97.8975061 100h-65.7343743c-.6409315 0-1.1612995-.2902137-1.5611039-.8706412-.3998043-.5804274-.6004844-1.3048369-.60204-2.1732283 0-.8121485.20068-1.5073116.60204-2.0854893.4013601-.5781778.921728-.8683915 1.5611039-.8706412h65.7343743c.5600372 0 1.0508477.2902137 1.4724313.8706412.4215836.5804274.6315976 1.2755905.6300505 2.0854893 0 .8683914-.2100226 1.5928009-.6300505 2.1732283-.420028.5804275-.9108384.8706412-1.4724313.8706412z"/><path d="m0 0h25v25h-25z"/><path d="m0 55h25v25h-25z"/></g></svg>
 `;

src/tiles/grid/item-tile.ts

@@ -8,2 +8,3 @@ /* eslint-disable import/no-duplicates */
 import '../../mediatype-icon';
+import '../../waveform-thumbnail';
 
@@ -47,4 +48,15 @@ import { favoriteFilledIcon } from './icons/favorite-filled';
 
-    return html`
-      <div class=${itemImageBoxClass}>
+    const isMediatypeAudio = this.model?.mediatype === 'audio';
+
+    const renderView = () => {
+      if (isMediatypeAudio) {
+        return html`
+          <waveform-thumbnail
+            .baseNavigationUrl=${this.baseNavigationUrl}
+            .identifier=${this.model?.identifier}
+          >
+          </waveform-thumbnail>
+        `;
+      }
+      return html`
         <div
@@ -54,2 +66,8 @@ class=${itemImageClass}
         ></div>
+      `;
+    };
+
+    return html`
+      <div class=${itemImageBoxClass}>
+        ${renderView()}
         <div class=${tileActionClass}>Content may be inappropriate</div>
@@ -56,0 +74,0 @@ </div>

src/tiles/list/tile-list.ts

@@ -207,6 +207,6 @@ import { css, html, LitElement, nothing } from 'lit';
       <div id="collections" class="metadata">
-        ${this.labelTemplate('Collections', true)}
+        ${this.labelTemplate('Collections')}
         ${join(
           map(this.model.collections, id => this.collectionLink(id)),
-          html`,&nbsp;`
+          html`, `
         )}
@@ -235,3 +235,3 @@ </div>
 
-  private labelTemplate(label: string, isFlex = false) {
+  private labelTemplate(label: string) {
     // Note nobreak space needed to use display:flex
@@ -241,3 +241,3 @@ // in parent element when making , delimnited list
     return html`${label
-      ? html`<span class="label">${label}:${isFlex ? html`&nbsp;` : ` `}</span>`
+      ? html`<span class="label">${label}: </span>`
       : nothing}`;
@@ -427,10 +427,2 @@ }
 
-      #collections {
-        /*
-          Hack to collapse line whitespace between text and ,
-          Use &nbsp; for required spaces
-        */
-        display: flex;
-      }
-
       #description {
@@ -453,3 +445,3 @@ padding-top: 10px;
         display: flex;
-        column-gap: 5px;
+        column-gap: 10px;
       }
@@ -461,2 +453,6 @@
 
+      async-collection-name {
+        display: inline-block;
+      }
+
       div a:hover {
@@ -463,0 +459,0 @@ text-decoration: underline;

No alert changes

Improved metrics

Total package byte prevSize

935492

increased by0.6%

Number of package files

248

increased by1.64%

Lines of code

13331

increased by1.59%

Dependency changes

• Updated@internetarchive/collection-name-cache@^0.1.1

• Updated@internetarchive/search-service@^0.3.1