@internetarchive/collection-browser 0.4.11 → 0.4.12

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

@@ -1,24 +1,24 @@
-import { __decorate } from "tslib";
-/* eslint-disable import/no-duplicates */
-import { css, html, LitElement, nothing, } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-import { ifDefined } from 'lit/directives/if-defined.js';
-import { formatDate } from '../../utils/format-date';
-import { baseTileStyles } from './styles/tile-grid-shared-styles';
-import '../image-block';
-import '../text-snippet-block';
-import '../item-image';
-import '../mediatype-icon';
-import './tile-stats';
-let ItemTile = class ItemTile extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.loggedIn = false;
-        this.showInfoButton = false;
-    }
-    render() {
-        var _a, _b, _c, _d, _e;
-        const itemTitle = (_a = this.model) === null || _a === void 0 ? void 0 : _a.title;
+import { __decorate } from "tslib";
+/* eslint-disable import/no-duplicates */
+import { css, html, LitElement, nothing, } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import { formatDate } from '../../utils/format-date';
+import { baseTileStyles } from './styles/tile-grid-shared-styles';
+import '../image-block';
+import '../text-snippet-block';
+import '../item-image';
+import '../mediatype-icon';
+import './tile-stats';
+let ItemTile = class ItemTile extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.loggedIn = false;
+        this.showInfoButton = false;
+    }
+    render() {
+        var _a, _b, _c, _d, _e;
+        const itemTitle = (_a = this.model) === null || _a === void 0 ? void 0 : _a.title;
         return html `
       <div class="container">
         ${this.infoButtonTemplate}
@@ -33,8 +33,8 @@ let ItemTile = class ItemTile extends LitElement {
             </div>
 
             ${this.volumeIssueTemplate}
-            ${this.doesSortedByDate
-            ? this.sortedDateInfoTemplate
+            ${this.doesSortedByDate
+            ? this.sortedDateInfoTemplate
             : this.creatorTemplate}
             ${this.textSnippetsTemplate}
           </div>
@@ -48,24 +48,24 @@ let ItemTile = class ItemTile extends LitElement {
           </tile-stats>
         </div>
       </div>
-    `;
-    }
-    /**
-     * Templates
-     */
-    get creatorTemplate() {
-        var _a, _b, _c;
-        if (!((_a = this.model) === null || _a === void 0 ? void 0 : _a.creator))
-            return nothing;
+    `;
+    }
+    /**
+     * Templates
+     */
+    get creatorTemplate() {
+        var _a, _b, _c;
+        if (!((_a = this.model) === null || _a === void 0 ? void 0 : _a.creator))
+            return nothing;
         return html `
       <div class="created-by">
         <span class="truncated" title=${ifDefined((_b = this.model) === null || _b === void 0 ? void 0 : _b.creator)}>
           by&nbsp;${(_c = this.model) === null || _c === void 0 ? void 0 : _c.creator}
         </span>
       </div>
-    `;
-    }
-    get imageBlockTemplate() {
+    `;
+    }
+    get imageBlockTemplate() {
         return html `
       <image-block
         .model=${this.model}
@@ -76,88 +76,88 @@ let ItemTile = class ItemTile extends LitElement {
         .viewSize=${'grid'}
       >
       </image-block>
-    `;
-    }
-    get sortedDateInfoTemplate() {
-        var _a, _b, _c, _d, _e;
-        let sortedValue;
-        switch ((_a = this.sortParam) === null || _a === void 0 ? void 0 : _a.field) {
-            case 'date':
-                sortedValue = { field: 'published', value: (_b = this.model) === null || _b === void 0 ? void 0 : _b.datePublished };
-                break;
-            case 'reviewdate':
-                sortedValue = { field: 'reviewed', value: (_c = this.model) === null || _c === void 0 ? void 0 : _c.dateReviewed };
-                break;
-            case 'addeddate':
-                sortedValue = { field: 'added', value: (_d = this.model) === null || _d === void 0 ? void 0 : _d.dateAdded };
-                break;
-            case 'publicdate':
-                sortedValue = { field: 'archived', value: (_e = this.model) === null || _e === void 0 ? void 0 : _e.dateArchived };
-                break;
-            default:
-                break;
-        }
-        if (!(sortedValue === null || sortedValue === void 0 ? void 0 : sortedValue.value)) {
-            return nothing;
-        }
+    `;
+    }
+    get sortedDateInfoTemplate() {
+        var _a, _b, _c, _d, _e;
+        let sortedValue;
+        switch ((_a = this.sortParam) === null || _a === void 0 ? void 0 : _a.field) {
+            case 'date':
+                sortedValue = { field: 'published', value: (_b = this.model) === null || _b === void 0 ? void 0 : _b.datePublished };
+                break;
+            case 'reviewdate':
+                sortedValue = { field: 'reviewed', value: (_c = this.model) === null || _c === void 0 ? void 0 : _c.dateReviewed };
+                break;
+            case 'addeddate':
+                sortedValue = { field: 'added', value: (_d = this.model) === null || _d === void 0 ? void 0 : _d.dateAdded };
+                break;
+            case 'publicdate':
+                sortedValue = { field: 'archived', value: (_e = this.model) === null || _e === void 0 ? void 0 : _e.dateArchived };
+                break;
+            default:
+                break;
+        }
+        if (!(sortedValue === null || sortedValue === void 0 ? void 0 : sortedValue.value)) {
+            return nothing;
+        }
         return html `
       <div class="date-sorted-by truncated">
         <span>
           ${sortedValue === null || sortedValue === void 0 ? void 0 : sortedValue.field} ${formatDate(sortedValue === null || sortedValue === void 0 ? void 0 : sortedValue.value, 'long')}
         </span>
       </div>
-    `;
-    }
-    get infoButtonTemplate() {
-        // &#9432; is an information icon
-        return this.showInfoButton
+    `;
+    }
+    get infoButtonTemplate() {
+        // &#9432; is an information icon
+        return this.showInfoButton
             ? html `<button class="info-button" @click=${this.infoButtonPressed}>
           &#9432;
           <span class="sr-only">More info</span>
-        </button>`
-            : nothing;
-    }
-    get textSnippetsTemplate() {
-        var _a;
-        if (!this.hasSnippets)
-            return nothing;
+        </button>`
+            : nothing;
+    }
+    get textSnippetsTemplate() {
+        var _a;
+        if (!this.hasSnippets)
+            return nothing;
         return html `
       <text-snippet-block viewsize="grid" .snippets=${(_a = this.model) === null || _a === void 0 ? void 0 : _a.snippets}>
       </text-snippet-block>
-    `;
-    }
-    get volumeIssueTemplate() {
-        var _a, _b, _c, _d;
-        if (!((_a = this.model) === null || _a === void 0 ? void 0 : _a.volume) || !((_b = this.model) === null || _b === void 0 ? void 0 : _b.issue))
-            return nothing;
+    `;
+    }
+    get volumeIssueTemplate() {
+        var _a, _b, _c, _d;
+        if (!((_a = this.model) === null || _a === void 0 ? void 0 : _a.volume) || !((_b = this.model) === null || _b === void 0 ? void 0 : _b.issue))
+            return nothing;
         return html `
       <div class="volume-issue">
         <span class="truncated" title="volume|issue">
           Volume&nbsp;${(_c = this.model) === null || _c === void 0 ? void 0 : _c.volume}, Issue&nbsp;${(_d = this.model) === null || _d === void 0 ? void 0 : _d.issue}
         </span>
       </div>
-    `;
-    }
-    get doesSortedByDate() {
-        var _a;
-        return ['date', 'reviewdate', 'addeddate', 'publicdate'].includes((_a = this.sortParam) === null || _a === void 0 ? void 0 : _a.field);
-    }
-    get hasSnippets() {
-        var _a, _b;
-        return !!((_b = (_a = this.model) === null || _a === void 0 ? void 0 : _a.snippets) === null || _b === void 0 ? void 0 : _b.length);
-    }
-    infoButtonPressed(e) {
-        e.preventDefault();
-        const event = new CustomEvent('infoButtonPressed', { detail: { x: e.clientX, y: e.clientY } });
-        this.dispatchEvent(event);
-    }
-    /**
-     * CSS
-     */
-    static get styles() {
-        const tileBorderColor = css `var(--tileBorderColor, #dddddd)`;
-        return [
-            baseTileStyles,
+    `;
+    }
+    get doesSortedByDate() {
+        var _a;
+        return ['date', 'reviewdate', 'addeddate', 'publicdate'].includes((_a = this.sortParam) === null || _a === void 0 ? void 0 : _a.field);
+    }
+    get hasSnippets() {
+        var _a, _b;
+        return !!((_b = (_a = this.model) === null || _a === void 0 ? void 0 : _a.snippets) === null || _b === void 0 ? void 0 : _b.length);
+    }
+    infoButtonPressed(e) {
+        e.preventDefault();
+        const event = new CustomEvent('infoButtonPressed', { detail: { x: e.clientX, y: e.clientY } });
+        this.dispatchEvent(event);
+    }
+    /**
+     * CSS
+     */
+    static get styles() {
+        const tileBorderColor = css `var(--tileBorderColor, #dddddd)`;
+        return [
+            baseTileStyles,
             css `
         .container {
           border: 1px solid ${tileBorderColor};
@@ -181,27 +181,27 @@ let ItemTile = class ItemTile extends LitElement {
             -webkit-touch-callout: default;
           }
         }
-      `,
-        ];
-    }
-};
-__decorate([
-    property({ type: String })
-], ItemTile.prototype, "baseImageUrl", void 0);
-__decorate([
-    property({ type: Boolean })
-], ItemTile.prototype, "loggedIn", void 0);
-__decorate([
-    property({ type: Object })
-], ItemTile.prototype, "model", void 0);
-__decorate([
-    property({ type: Object })
-], ItemTile.prototype, "sortParam", void 0);
-__decorate([
-    property({ type: Boolean })
-], ItemTile.prototype, "showInfoButton", void 0);
-ItemTile = __decorate([
-    customElement('item-tile')
-], ItemTile);
-export { ItemTile };
+      `,
+        ];
+    }
+};
+__decorate([
+    property({ type: String })
+], ItemTile.prototype, "baseImageUrl", void 0);
+__decorate([
+    property({ type: Boolean })
+], ItemTile.prototype, "loggedIn", void 0);
+__decorate([
+    property({ type: Object })
+], ItemTile.prototype, "model", void 0);
+__decorate([
+    property({ type: Object })
+], ItemTile.prototype, "sortParam", void 0);
+__decorate([
+    property({ type: Boolean })
+], ItemTile.prototype, "showInfoButton", void 0);
+ItemTile = __decorate([
+    customElement('item-tile')
+], ItemTile);
+export { ItemTile };
 //# sourceMappingURL=item-tile.js.map

package/dist/src/tiles/grid/styles/tile-grid-shared-styles.d.ts

@@ -1 +1 @@
-export declare const baseTileStyles: import("lit").CSSResult;
+export declare const baseTileStyles: import("lit").CSSResult;

package/dist/src/tiles/grid/styles/tile-grid-shared-styles.js

@@ -1,9 +1,9 @@
-import { css } from 'lit';
-/**
- * Base tile styles
- */
-const tileBackgroundColor = css `var(--tileBackgroundColor, #ffffff)`;
-const tileCornerRadius = css `var(--tileCornerRadius, 4px)`;
+import { css } from 'lit';
+/**
+ * Base tile styles
+ */
+const tileBackgroundColor = css `var(--tileBackgroundColor, #ffffff)`;
+const tileCornerRadius = css `var(--tileCornerRadius, 4px)`;
 export const baseTileStyles = css `
   .container {
     background-color: ${tileBackgroundColor};
@@ -133,5 +133,5 @@ export const baseTileStyles = css `
     -webkit-clip-path: inset(50%) !important;
     clip-path: inset(50%) !important;
   }
-`;
+`;
 //# sourceMappingURL=tile-grid-shared-styles.js.map

package/dist/src/tiles/grid/tile-stats.d.ts

@@ -1,10 +1,10 @@
-import { CSSResultGroup, LitElement } from 'lit';
-export declare class TileStats extends LitElement {
-    mediatype?: string;
-    itemCount?: number;
-    viewCount?: number;
-    favCount?: number;
-    commentCount?: number;
-    render(): import("lit-html").TemplateResult<1>;
-    static get styles(): CSSResultGroup;
-}
+import { CSSResultGroup, LitElement } from 'lit';
+export declare class TileStats extends LitElement {
+    mediatype?: string;
+    itemCount?: number;
+    viewCount?: number;
+    favCount?: number;
+    commentCount?: number;
+    render(): import("lit-html").TemplateResult<1>;
+    static get styles(): CSSResultGroup;
+}

package/dist/src/tiles/grid/tile-stats.js

@@ -1,18 +1,18 @@
-import { __decorate } from "tslib";
-import { css, html, LitElement } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-import { favoriteFilledIcon } from '../../assets/img/icons/favorite-filled';
-import { reviewsIcon } from '../../assets/img/icons/reviews';
-import { uploadIcon } from '../../assets/img/icons/upload';
-import { viewsIcon } from '../../assets/img/icons/views';
-import { formatCount } from '../../utils/format-count';
-let TileStats = class TileStats extends LitElement {
-    render() {
-        const formattedFavCount = formatCount(this.favCount, 'short', 'short');
-        const formattedReviewCount = formatCount(this.commentCount, 'short', 'short');
-        const uploadsOrViewsTitle = this.mediatype === 'account'
-            ? `${this.itemCount} uploads`
-            : `${this.viewCount} all-time views`;
+import { __decorate } from "tslib";
+import { css, html, LitElement } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { favoriteFilledIcon } from '../../assets/img/icons/favorite-filled';
+import { reviewsIcon } from '../../assets/img/icons/reviews';
+import { uploadIcon } from '../../assets/img/icons/upload';
+import { viewsIcon } from '../../assets/img/icons/views';
+import { formatCount } from '../../utils/format-count';
+let TileStats = class TileStats extends LitElement {
+    render() {
+        const formattedFavCount = formatCount(this.favCount, 'short', 'short');
+        const formattedReviewCount = formatCount(this.commentCount, 'short', 'short');
+        const uploadsOrViewsTitle = this.mediatype === 'account'
+            ? `${this.itemCount} uploads`
+            : `${this.viewCount} all-time views`;
         return html `
       <div class="item-stats">
         <p class="sr-only">
@@ -48,9 +48,9 @@ let TileStats = class TileStats extends LitElement {
           </li>
         </ul>
       </div>
-    `;
-    }
-    static get styles() {
+    `;
+    }
+    static get styles() {
         return css `
       mediatype-icon {
         --iconHeight: 25px;
@@ -123,26 +123,26 @@ let TileStats = class TileStats extends LitElement {
         display: block;
         text-align: center;
       }
-    `;
-    }
-};
-__decorate([
-    property({ type: String })
-], TileStats.prototype, "mediatype", void 0);
-__decorate([
-    property({ type: Number })
-], TileStats.prototype, "itemCount", void 0);
-__decorate([
-    property({ type: Number })
-], TileStats.prototype, "viewCount", void 0);
-__decorate([
-    property({ type: Number })
-], TileStats.prototype, "favCount", void 0);
-__decorate([
-    property({ type: Number })
-], TileStats.prototype, "commentCount", void 0);
-TileStats = __decorate([
-    customElement('tile-stats')
-], TileStats);
-export { TileStats };
+    `;
+    }
+};
+__decorate([
+    property({ type: String })
+], TileStats.prototype, "mediatype", void 0);
+__decorate([
+    property({ type: Number })
+], TileStats.prototype, "itemCount", void 0);
+__decorate([
+    property({ type: Number })
+], TileStats.prototype, "viewCount", void 0);
+__decorate([
+    property({ type: Number })
+], TileStats.prototype, "favCount", void 0);
+__decorate([
+    property({ type: Number })
+], TileStats.prototype, "commentCount", void 0);
+TileStats = __decorate([
+    customElement('tile-stats')
+], TileStats);
+export { TileStats };
 //# sourceMappingURL=tile-stats.js.map