@internetarchive/collection-browser 0.3.1-alpha.2 → 0.3.1-alpha.3

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

@@ -44,76 +44,76 @@ let TileList = class TileList extends LitElement {
         this.collectionLinks = newCollellectionLinks;
     }
     render() {
-        return html `
-      <div id="list-line" class="${this.classSize}">
+        return html `
+      <div id="list-line" class="${this.classSize}">
         ${this.classSize === 'mobile'
             ? this.mobileTemplate
-            : this.desktopTemplate}
-      </div>
+            : this.desktopTemplate}
+      </div>
     `;
     }
     get mobileTemplate() {
-        return html `
-      <div id="list-line-top">
-        <div id="list-line-left">${this.imageBlockTemplate}</div>
-        <div id="list-line-right">
-          <div id="title-line">
-            <div id="title">${this.titleTemplate}</div>
-            ${this.iconRightTemplate}
-          </div>
-        </div>
-      </div>
-      <div id="list-line-bottom">${this.detailsTemplate}</div>
+        return html `
+      <div id="list-line-top">
+        <div id="list-line-left">${this.imageBlockTemplate}</div>
+        <div id="list-line-right">
+          <div id="title-line">
+            <div id="title">${this.titleTemplate}</div>
+            ${this.iconRightTemplate}
+          </div>
+        </div>
+      </div>
+      <div id="list-line-bottom">${this.detailsTemplate}</div>
     `;
     }
     get desktopTemplate() {
-        return html `
-      <div id="list-line-left">${this.imageBlockTemplate}</div>
-      <div id="list-line-right">
-        <div id="title-line">
-          <div id="title">${this.titleTemplate}</div>
-          ${this.iconRightTemplate}
-        </div>
-        ${this.detailsTemplate}
-      </div>
+        return html `
+      <div id="list-line-left">${this.imageBlockTemplate}</div>
+      <div id="list-line-right">
+        <div id="title-line">
+          <div id="title">${this.titleTemplate}</div>
+          ${this.iconRightTemplate}
+        </div>
+        ${this.detailsTemplate}
+      </div>
     `;
     }
     get imageBlockTemplate() {
-        return html `
-      <image-block
-        .model=${this.model}
-        .baseImageUrl=${this.baseImageUrl}
-        .isCompactTile=${false}
-        .isListTile=${true}
-        .viewSize=${this.classSize}
-      >
-      </image-block>
+        return html `
+      <image-block
+        .model=${this.model}
+        .baseImageUrl=${this.baseImageUrl}
+        .isCompactTile=${false}
+        .isListTile=${true}
+        .viewSize=${this.classSize}
+      >
+      </image-block>
     `;
     }
     get detailsTemplate() {
-        return html `
-      ${this.itemLineTemplate} ${this.creatorTemplate}
-      <div id="dates-line">
-        ${this.datePublishedTemplate} ${this.dateSortByTemplate}
-      </div>
-      <div id="views-line">
-        ${this.viewsTemplate} ${this.ratingTemplate} ${this.reviewsTemplate}
-      </div>
-      ${this.topicsTemplate} ${this.collectionsTemplate}
-      ${this.descriptionTemplate} ${this.textSnippetsTemplate}
+        return html `
+      ${this.itemLineTemplate} ${this.creatorTemplate}
+      <div id="dates-line">
+        ${this.datePublishedTemplate} ${this.dateSortByTemplate}
+      </div>
+      <div id="views-line">
+        ${this.viewsTemplate} ${this.ratingTemplate} ${this.reviewsTemplate}
+      </div>
+      ${this.topicsTemplate} ${this.collectionsTemplate}
+      ${this.descriptionTemplate} ${this.textSnippetsTemplate}
     `;
     }
     // Data templates
     get iconRightTemplate() {
         var _a, _b;
-        return html `
-      <div id="icon-right">
-        <mediatype-icon
-          .mediatype=${(_a = this.model) === null || _a === void 0 ? void 0 : _a.mediatype}
-          .collections=${(_b = this.model) === null || _b === void 0 ? void 0 : _b.collections}
-        >
-        </mediatype-icon>
-      </div>
+        return html `
+      <div id="icon-right">
+        <mediatype-icon
+          .mediatype=${(_a = this.model) === null || _a === void 0 ? void 0 : _a.mediatype}
+          .collections=${(_b = this.model) === null || _b === void 0 ? void 0 : _b.collections}
+        >
+        </mediatype-icon>
+      </div>
     `;
     }
     get titleTemplate() {
@@ -137,11 +137,11 @@ let TileList = class TileList extends LitElement {
         if (!((_a = this.model) === null || _a === void 0 ? void 0 : _a.source)) {
             return nothing;
         }
-        return html `
-      <div id="source" class="metadata">
-        ${this.labelTemplate('Source')}
-        ${this.searchLink('source', this.model.source)}
-      </div>
+        return html `
+      <div id="source" class="metadata">
+        ${this.labelTemplate('Source')}
+        ${this.searchLink('source', this.model.source)}
+      </div>
     `;
     }
     get volumeTemplate() {
@@ -156,21 +156,21 @@ let TileList = class TileList extends LitElement {
         var _a, _b, _c;
         // "Achivist since" if account
         if (((_a = this.model) === null || _a === void 0 ? void 0 : _a.mediatype) === 'account') {
-            return html `
-        <div id="creator" class="metadata">
-          <span class="label"> ${accountLabel((_b = this.model) === null || _b === void 0 ? void 0 : _b.dateAdded)} </span>
-        </div>
+            return html `
+        <div id="creator" class="metadata">
+          <span class="label"> ${accountLabel((_b = this.model) === null || _b === void 0 ? void 0 : _b.dateAdded)} </span>
+        </div>
       `;
         }
         // "Creator" if not account tile
         if (!((_c = this.model) === null || _c === void 0 ? void 0 : _c.creators) || this.model.creators.length === 0) {
             return nothing;
         }
-        return html `
-      <div id="creator" class="metadata">
-        ${this.labelTemplate('By')}
-        ${join(map(this.model.creators, id => this.searchLink('creator', id)), html `, `)}
-      </div>
+        return html `
+      <div id="creator" class="metadata">
+        ${this.labelTemplate('By')}
+        ${join(map(this.model.creators, id => this.searchLink('creator', id)), html `, `)}
+      </div>
     `;
     }
     get datePublishedTemplate() {
@@ -205,22 +205,22 @@ let TileList = class TileList extends LitElement {
         if (!((_a = this.model) === null || _a === void 0 ? void 0 : _a.subjects) || this.model.subjects.length === 0) {
             return nothing;
         }
-        return html `
-      <div id="topics" class="metadata">
-        ${this.labelTemplate('Topics')}
-        ${join(map(this.model.subjects, id => this.searchLink('subject', id)), html `, `)}
-      </div>
+        return html `
+      <div id="topics" class="metadata">
+        ${this.labelTemplate('Topics')}
+        ${join(map(this.model.subjects, id => this.searchLink('subject', id)), html `, `)}
+      </div>
     `;
     }
     get collectionsTemplate() {
         if (!this.collectionLinks || this.collectionLinks.length === 0) {
             return nothing;
         }
-        return html `
-      <div id="collections" class="metadata">
-        ${this.labelTemplate('Collections')}
-        ${join(this.collectionLinks, html `, `)}
-      </div>
+        return html `
+      <div id="collections" class="metadata">
+        ${this.labelTemplate('Collections')}
+        ${join(this.collectionLinks, html `, `)}
+      </div>
     `;
     }
     get descriptionTemplate() {
@@ -231,9 +231,9 @@ let TileList = class TileList extends LitElement {
         var _a;
         if (!this.hasSnippets)
             return nothing;
-        return html `<text-snippet-block
-      viewsize="list"
-      .snippets=${(_a = this.model) === null || _a === void 0 ? void 0 : _a.snippets}
+        return html `<text-snippet-block
+      viewsize="list"
+      .snippets=${(_a = this.model) === null || _a === void 0 ? void 0 : _a.snippets}
     ></text-snippet-block>`;
     }
     get hasSnippets() {
@@ -241,13 +241,14 @@ let TileList = class TileList extends LitElement {
         return !!((_b = (_a = this.model) === null || _a === void 0 ? void 0 : _a.snippets) === null || _b === void 0 ? void 0 : _b.length);
     }
     // Utility functions
+    // eslint-disable-next-line default-param-last
     metadataTemplate(text, label = '', id) {
         if (!text)
             return nothing;
-        return html `
-      <div id=${ifDefined(id)} class="metadata">
-        ${this.labelTemplate(label)} ${text}
-      </div>
+        return html `
+      <div id=${ifDefined(id)} class="metadata">
+        ${this.labelTemplate(label)} ${text}
+      </div>
     `;
     }
     labelTemplate(label) {
@@ -263,17 +264,17 @@ let TileList = class TileList extends LitElement {
         // No whitespace after closing tag
         // Note: single ' for href='' to wrap " in query var gets changed back by yarn format
         // eslint-disable-next-line lit/no-invalid-html
-        return html `<a href="${this.baseNavigationUrl}/search.php?query=${query}">
-      ${DOMPurify.sanitize(searchTerm)}</a
+        return html `<a href="${this.baseNavigationUrl}/search.php?query=${query}">
+      ${DOMPurify.sanitize(searchTerm)}</a
     >`;
     }
     detailsLink(identifier, text) {
         const linkText = text !== null && text !== void 0 ? text : identifier;
         // No whitespace after closing tag
         // identifiers (all ASCII in their creation) should be safe to use in href, but sanitize anyway
-        return html `<a
-      href="${this.baseNavigationUrl}/details/${encodeURI(identifier)}"
-      >${DOMPurify.sanitize(linkText)}</a
+        return html `<a
+      href="${this.baseNavigationUrl}/details/${encodeURI(identifier)}"
+      >${DOMPurify.sanitize(linkText)}</a
     >`;
     }
     /*
@@ -311,123 +312,123 @@ let TileList = class TileList extends LitElement {
         return 'long';
     }
     static get styles() {
-        return css `
-      html {
-        font-size: unset;
-      }
-
-      div {
-        font-size: 14px;
-      }
-
-      div a {
-        text-decoration: none;
-      }
-
-      .label {
-        font-weight: bold;
-      }
-
-      #list-line.mobile {
-        --infiniteScrollerRowGap: 20px;
-        --infiniteScrollerRowHeight: auto;
-      }
-
-      #list-line.desktop {
-        --infiniteScrollerRowGap: 30px;
-        --infiniteScrollerRowHeight: auto;
-      }
-
-      /* fields */
-      #icon-right {
-        width: 20px;
-        padding-top: 5px;
-        --iconHeight: 20px;
-        --iconWidth: 20px;
-        --iconTextAlign: right;
-        margin-top: -8px;
-        text-align: right;
-      }
-
-      #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;
-        flex-grow: 1;
-      }
-
-      .metadata {
-        line-height: 20px;
-      }
-
-      #description,
-      #creator,
-      #topics,
-      #source {
-        text-align: left;
-        overflow: hidden;
-        text-overflow: ellipsis;
-        -webkit-box-orient: vertical;
-        display: -webkit-box;
-        word-break: break-word;
-        -webkit-line-clamp: 3; /* number of lines to show */
-        line-clamp: 3;
-      }
-
-      #icon {
-        padding-top: 5px;
-      }
-
-      #description {
-        padding-top: 10px;
-      }
-
-      /* Top level container */
-      #list-line {
-        display: flex;
-      }
-
-      #list-line.mobile {
-        flex-direction: column;
-      }
-
-      #list-line.desktop {
-        column-gap: 10px;
-      }
-
-      #list-line-top {
-        display: flex;
-        column-gap: 7px;
-      }
-
-      #list-line-bottom {
-        padding-top: 4px;
-      }
-
-      #list-line-right,
-      #list-line-top,
-      #list-line-bottom {
-        width: 100%;
-      }
-
-      div a:hover {
-        text-decoration: underline;
-      }
-
-      /* Lines containing multiple div as row */
-      #item-line,
-      #dates-line,
-      #views-line,
-      #title-line {
-        display: flex;
-        flex-direction: row;
-        gap: 10px;
-      }
+        return css `
+      html {
+        font-size: unset;
+      }
+
+      div {
+        font-size: 14px;
+      }
+
+      div a {
+        text-decoration: none;
+      }
+
+      .label {
+        font-weight: bold;
+      }
+
+      #list-line.mobile {
+        --infiniteScrollerRowGap: 20px;
+        --infiniteScrollerRowHeight: auto;
+      }
+
+      #list-line.desktop {
+        --infiniteScrollerRowGap: 30px;
+        --infiniteScrollerRowHeight: auto;
+      }
+
+      /* fields */
+      #icon-right {
+        width: 20px;
+        padding-top: 5px;
+        --iconHeight: 20px;
+        --iconWidth: 20px;
+        --iconTextAlign: right;
+        margin-top: -8px;
+        text-align: right;
+      }
+
+      #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;
+        flex-grow: 1;
+      }
+
+      .metadata {
+        line-height: 20px;
+      }
+
+      #description,
+      #creator,
+      #topics,
+      #source {
+        text-align: left;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        -webkit-box-orient: vertical;
+        display: -webkit-box;
+        word-break: break-word;
+        -webkit-line-clamp: 3; /* number of lines to show */
+        line-clamp: 3;
+      }
+
+      #icon {
+        padding-top: 5px;
+      }
+
+      #description {
+        padding-top: 10px;
+      }
+
+      /* Top level container */
+      #list-line {
+        display: flex;
+      }
+
+      #list-line.mobile {
+        flex-direction: column;
+      }
+
+      #list-line.desktop {
+        column-gap: 10px;
+      }
+
+      #list-line-top {
+        display: flex;
+        column-gap: 7px;
+      }
+
+      #list-line-bottom {
+        padding-top: 4px;
+      }
+
+      #list-line-right,
+      #list-line-top,
+      #list-line-bottom {
+        width: 100%;
+      }
+
+      div a:hover {
+        text-decoration: underline;
+      }
+
+      /* Lines containing multiple div as row */
+      #item-line,
+      #dates-line,
+      #views-line,
+      #title-line {
+        display: flex;
+        flex-direction: row;
+        gap: 10px;
+      }
     `;
     }
 };

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

@@ -1 +1 @@
-{"version":3,"file":"tile-list.js","sourceRoot":"","sources":["../../../../src/tiles/list/tile-list.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,GAAG,EACH,IAAI,EACJ,UAAU,EACV,OAAO,GAGR,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AACzD,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,SAAS,MAAM,WAAW,CAAC;AAMlC,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAgB,MAAM,0BAA0B,CAAC;AACrE,OAAO,EAAE,UAAU,EAAc,MAAM,yBAAyB,CAAC;AAEjE,OAAO,gBAAgB,CAAC;AACxB,OAAO,mBAAmB,CAAC;AAG3B,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,UAAU;IAAxC;;QAY8B,cAAS,GAAqB,IAAI,CAAC;QAI9C,oBAAe,GAAqB,EAAE,CAAC;QAI3B,aAAQ,GAAG,KAAK,CAAC;IA4chD,CAAC;IA1cW,OAAO,CAAC,OAAuB;QACvC,IAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;YACxB,IAAI,CAAC,oBAAoB,EAAE,CAAC;SAC7B;IACH,CAAC;IAEO,KAAK,CAAC,oBAAoB;;QAChC,IACE,CAAC,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,WAAW,CAAA;YACxB,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,MAAM,KAAK,CAAC;YACnC,CAAC,IAAI,CAAC,mBAAmB,EACzB;YACA,OAAO;SACR;QACD,6DAA6D;QAC7D,iEAAiE;QACjE,IAAI,CAAC,eAAe,GAAG,EAAE,CAAC;QAC1B,MAAM,qBAAqB,GAAqB,EAAE,CAAC;QACnD,MAAM,QAAQ,GAAoB,EAAE,CAAC;QACrC,KAAK,MAAM,UAAU,IAAI,IAAI,CAAC,KAAK,CAAC,WAAW,EAAE;YAC/C,QAAQ,CAAC,IAAI,CACX,MAAA,IAAI,CAAC,mBAAmB,0CAAE,iBAAiB,CAAC,UAAU,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE;gBAClE,qBAAqB,CAAC,IAAI,CACxB,IAAI,CAAC,WAAW,CAAC,UAAU,EAAE,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,UAAU,CAAC,CACjD,CAAC;YACJ,CAAC,CAAC,CACH,CAAC;SACH;QACD,MAAM,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC5B,IAAI,CAAC,eAAe,GAAG,qBAAqB,CAAC;IAC/C,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;mCACoB,IAAI,CAAC,SAAS;UACvC,IAAI,CAAC,SAAS,KAAK,QAAQ;YAC3B,CAAC,CAAC,IAAI,CAAC,cAAc;YACrB,CAAC,CAAC,IAAI,CAAC,eAAe;;KAE3B,CAAC;IACJ,CAAC;IAED,IAAY,cAAc;QACxB,OAAO,IAAI,CAAA;;mCAEoB,IAAI,CAAC,kBAAkB;;;8BAG5B,IAAI,CAAC,aAAa;cAClC,IAAI,CAAC,iBAAiB;;;;mCAID,IAAI,CAAC,eAAe;KAClD,CAAC;IACJ,CAAC;IAED,IAAY,eAAe;QACzB,OAAO,IAAI,CAAA;iCACkB,IAAI,CAAC,kBAAkB;;;4BAG5B,IAAI,CAAC,aAAa;YAClC,IAAI,CAAC,iBAAiB;;UAExB,IAAI,CAAC,eAAe;;KAEzB,CAAC;IACJ,CAAC;IAED,IAAY,kBAAkB;QAC5B,OAAO,IAAI,CAAA;;iBAEE,IAAI,CAAC,KAAK;wBACH,IAAI,CAAC,YAAY;yBAChB,KAAK;sBACR,IAAI;oBACN,IAAI,CAAC,SAAS;;;KAG7B,CAAC;IACJ,CAAC;IAED,IAAY,eAAe;QACzB,OAAO,IAAI,CAAA;QACP,IAAI,CAAC,gBAAgB,IAAI,IAAI,CAAC,eAAe;;UAE3C,IAAI,CAAC,qBAAqB,IAAI,IAAI,CAAC,kBAAkB;;;UAGrD,IAAI,CAAC,aAAa,IAAI,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,eAAe;;QAEnE,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,mBAAmB;QAC/C,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,oBAAoB;KACxD,CAAC;IACJ,CAAC;IAED,iBAAiB;IACjB,IAAY,iBAAiB;;QAC3B,OAAO,IAAI,CAAA;;;uBAGQ,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS;yBACnB,MAAA,IAAI,CAAC,KAAK,0CAAE,WAAW;;;;KAI3C,CAAC;IACJ,CAAC;IAED,IAAY,aAAa;;QACvB,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,CAAA,EAAE;YACtB,OAAO,OAAO,CAAC;SAChB;QACD,OAAO,IAAI,CAAA,IAAI,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;IAC9E,CAAC;IAED,IAAY,gBAAgB;QAC1B,MAAM,MAAM,GAAG,IAAI,CAAC,cAAc,CAAC;QACnC,MAAM,MAAM,GAAG,IAAI,CAAC,cAAc,CAAC;QACnC,MAAM,KAAK,GAAG,IAAI,CAAC,aAAa,CAAC;QACjC,IAAI,CAAC,MAAM,IAAI,CAAC,MAAM,IAAI,CAAC,KAAK,EAAE;YAChC,OAAO,OAAO,CAAC;SAChB;QACD,OAAO,IAAI,CAAA,wBAAwB,MAAM,IAAI,MAAM,IAAI,KAAK,SAAS,CAAC;IACxE,CAAC;IAED,IAAY,cAAc;;QACxB,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,CAAA,EAAE;YACvB,OAAO,OAAO,CAAC;SAChB;QACD,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC;UAC5B,IAAI,CAAC,UAAU,CAAC,QAAQ,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;;KAEjD,CAAC;IACJ,CAAC;IAED,IAAY,cAAc;;QACxB,OAAO,IAAI,CAAC,gBAAgB,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,EAAE,QAAQ,CAAC,CAAC;IAC7D,CAAC;IAED,IAAY,aAAa;;QACvB,OAAO,IAAI,CAAC,gBAAgB,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,EAAE,OAAO,CAAC,CAAC;IAC3D,CAAC;IAED,IAAY,eAAe;;QACzB,8BAA8B;QAC9B,IAAI,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,MAAK,SAAS,EAAE;YACvC,OAAO,IAAI,CAAA;;iCAEgB,YAAY,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,CAAC;;OAE7D,CAAC;SACH;QACD,gCAAgC;QAChC,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ,CAAA,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;YAC7D,OAAO,OAAO,CAAC;SAChB;QACD,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;UACxB,IAAI,CACJ,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAC9D,IAAI,CAAA,IAAI,CACT;;KAEJ,CAAC;IACJ,CAAC;IAED,IAAY,qBAAqB;;QAC/B,OAAO,IAAI,CAAC,gBAAgB,CAC1B,UAAU,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,aAAa,EAAE,MAAM,CAAC,EAC7C,WAAW,CACZ,CAAC;IACJ,CAAC;IAED,iDAAiD;IACjD,6CAA6C;IAC7C,IAAY,kBAAkB;QAC5B,IACE,IAAI,CAAC,SAAS;YACd,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,KAAK,WAAW;gBACnC,IAAI,CAAC,SAAS,CAAC,KAAK,KAAK,YAAY;gBACrC,IAAI,CAAC,SAAS,CAAC,KAAK,KAAK,YAAY,CAAC,EACxC;YACA,OAAO,IAAI,CAAC,gBAAgB,CAC1B,UAAU,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC,EAC7B,SAAS,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,CAChC,CAAC;SACH;QACD,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,IAAY,aAAa;;QACvB,OAAO,IAAI,CAAC,gBAAgB,CAC1B,GAAG,WAAW,CAAC,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,mCAAI,CAAC,EAAE,IAAI,CAAC,UAAU,CAAC,EAAE,EAC7D,OAAO,CACR,CAAC;IACJ,CAAC;IAED,IAAY,cAAc;;QACxB,OAAO,IAAI,CAAC,gBAAgB,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,aAAa,EAAE,YAAY,CAAC,CAAC;IACxE,CAAC;IAED,IAAY,eAAe;;QACzB,OAAO,IAAI,CAAC,gBAAgB,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,YAAY,EAAE,SAAS,CAAC,CAAC;IACpE,CAAC;IAED,IAAY,cAAc;;QACxB,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ,CAAA,IAAI,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE;YAC7D,OAAO,OAAO,CAAC;SAChB;QACD,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC;UAC5B,IAAI,CACJ,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,EAC9D,IAAI,CAAA,IAAI,CACT;;KAEJ,CAAC;IACJ,CAAC;IAED,IAAY,mBAAmB;QAC7B,IAAI,CAAC,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,eAAe,CAAC,MAAM,KAAK,CAAC,EAAE;YAC9D,OAAO,OAAO,CAAC;SAChB;QACD,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC;UACjC,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,CAAA,IAAI,CAAC;;KAEzC,CAAC;IACJ,CAAC;IAED,IAAY,mBAAmB;;QAC7B,OAAO,IAAI,CAAC,gBAAgB,CAC1B,SAAS,CAAC,QAAQ,CAAC,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,WAAW,mCAAI,EAAE,CAAC,EACjD,EAAE,EACF,aAAa,CACd,CAAC;IACJ,CAAC;IAED,IAAY,oBAAoB;;QAC9B,IAAI,CAAC,IAAI,CAAC,WAAW;YAAE,OAAO,OAAO,CAAC;QAEtC,OAAO,IAAI,CAAA;;kBAEG,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ;2BACX,CAAC;IAC1B,CAAC;IAED,IAAY,WAAW;;QACrB,OAAO,CAAC,CAAC,CAAA,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ,0CAAE,MAAM,CAAA,CAAC;IACxC,CAAC;IAED,oBAAoB;IACZ,gBAAgB,CAAC,IAAS,EAAE,KAAK,GAAG,EAAE,EAAE,EAAW;QACzD,IAAI,CAAC,IAAI;YAAE,OAAO,OAAO,CAAC;QAC1B,OAAO,IAAI,CAAA;gBACC,SAAS,CAAC,EAAE,CAAC;UACnB,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,IAAI,IAAI;;KAEtC,CAAC;IACJ,CAAC;IAEO,aAAa,CAAC,KAAa;QACjC,OAAO,IAAI,CAAA,IAAI,KAAK;YAClB,CAAC,CAAC,IAAI,CAAA,uBAAuB,KAAK,WAAW;YAC7C,CAAC,CAAC,OAAO,EAAE,CAAC;IAChB,CAAC;IAEO,UAAU,CAAC,KAAa,EAAE,UAAkB;QAClD,IAAI,CAAC,KAAK,IAAI,CAAC,UAAU,EAAE;YACzB,OAAO,OAAO,CAAC;SAChB;QACD,MAAM,KAAK,GAAG,kBAAkB,CAAC,GAAG,KAAK,KAAK,UAAU,GAAG,CAAC,CAAC;QAC7D,kCAAkC;QAClC,qFAAqF;QAErF,+CAA+C;QAC/C,OAAO,IAAI,CAAA,YAAY,IAAI,CAAC,iBAAiB,qBAAqB,KAAK;QACnE,SAAS,CAAC,QAAQ,CAAC,UAAU,CAAC;MAChC,CAAC;IACL,CAAC;IAEO,WAAW,CAAC,UAAkB,EAAE,IAAa;QACnD,MAAM,QAAQ,GAAG,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,UAAU,CAAC;QACpC,kCAAkC;QAClC,+FAA+F;QAC/F,OAAO,IAAI,CAAA;cACD,IAAI,CAAC,iBAAiB,YAAY,SAAS,CAAC,UAAU,CAAC;SAC5D,SAAS,CAAC,QAAQ,CAAC,QAAQ,CAAC;MAC/B,CAAC;IACL,CAAC;IAED;;;;OAIG;IACH,IAAY,IAAI;;QACd,QAAQ,MAAA,IAAI,CAAC,SAAS,0CAAE,KAAK,EAAE;YAC7B,KAAK,MAAM;gBACT,OAAO,MAAA,IAAI,CAAC,KAAK,0CAAE,aAAa,CAAC;YACnC,KAAK,YAAY;gBACf,OAAO,MAAA,IAAI,CAAC,KAAK,0CAAE,YAAY,CAAC;YAClC,KAAK,WAAW;gBACd,OAAO,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,CAAC;YAC/B;gBACE,OAAO,MAAA,IAAI,CAAC,KAAK,0CAAE,YAAY,CAAC,CAAC,aAAa;SACjD;IACH,CAAC;IAED,IAAY,SAAS;QACnB,IACE,IAAI,CAAC,gBAAgB;YACrB,IAAI,CAAC,YAAY;YACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,gBAAgB,EACzC;YACA,OAAO,QAAQ,CAAC;SACjB;QACD,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,IAAY,UAAU;QACpB,IACE,IAAI,CAAC,gBAAgB;YACrB,IAAI,CAAC,YAAY;YACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,gBAAgB,EACzC;YACA,OAAO,OAAO,CAAC;SAChB;QACD,OAAO,MAAM,CAAC;IAChB,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAqHT,CAAC;IACJ,CAAC;CACF,CAAA;AA/d6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAA4B;AAGvD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDACwB;AAEvB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAuB;AAEtB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAwB;AAEvB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAAoC;AAEnC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;kDAA2B;AAE7C;IAAR,KAAK,EAAE;iDAAgD;AAE5B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAuB;AAErB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0CAAkB;AApBnC,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAgepB;SAheY,QAAQ","sourcesContent":["import {\n  css,\n  html,\n  LitElement,\n  nothing,\n  PropertyValues,\n  TemplateResult,\n} from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { join } from 'lit/directives/join.js';\nimport { map } from 'lit/directives/map.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport DOMPurify from 'dompurify';\n\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport type { SortParam } from '@internetarchive/search-service';\nimport type { TileModel } from '../../models';\n\nimport { dateLabel } from './date-label';\nimport { accountLabel } from './account-label';\nimport { formatCount, NumberFormat } from '../../utils/format-count';\nimport { formatDate, DateFormat } from '../../utils/format-date';\n\nimport '../image-block';\nimport '../mediatype-icon';\n\n@customElement('tile-list')\nexport class TileList extends LitElement {\n  @property({ type: Object }) model?: TileModel;\n\n  @property({ type: String }) baseNavigationUrl?: string;\n\n  @property({ type: Object })\n  collectionNameCache?: CollectionNameCacheInterface;\n\n  @property({ type: Number }) currentWidth?: number;\n\n  @property({ type: Number }) currentHeight?: number;\n\n  @property({ type: Object }) sortParam: SortParam | null = null;\n\n  @property({ type: Number }) mobileBreakpoint?: number;\n\n  @state() private collectionLinks: TemplateResult[] = [];\n\n  @property({ type: String }) baseImageUrl?: string;\n\n  @property({ type: Boolean }) loggedIn = false;\n\n  protected updated(changed: PropertyValues): void {\n    if (changed.has('model')) {\n      this.fetchCollectionNames();\n    }\n  }\n\n  private async fetchCollectionNames() {\n    if (\n      !this.model?.collections ||\n      this.model.collections.length === 0 ||\n      !this.collectionNameCache\n    ) {\n      return;\n    }\n    // Note: quirk of Lit: need to replace collectionLinks array,\n    // otherwise it will not re-render. Can't simply alter the array.\n    this.collectionLinks = [];\n    const newCollellectionLinks: TemplateResult[] = [];\n    const promises: Promise<void>[] = [];\n    for (const collection of this.model.collections) {\n      promises.push(\n        this.collectionNameCache?.collectionNameFor(collection).then(name => {\n          newCollellectionLinks.push(\n            this.detailsLink(collection, name ?? collection)\n          );\n        })\n      );\n    }\n    await Promise.all(promises);\n    this.collectionLinks = newCollellectionLinks;\n  }\n\n  render() {\n    return html`\n      <div id=\"list-line\" class=\"${this.classSize}\">\n        ${this.classSize === 'mobile'\n          ? this.mobileTemplate\n          : this.desktopTemplate}\n      </div>\n    `;\n  }\n\n  private get mobileTemplate() {\n    return html`\n      <div id=\"list-line-top\">\n        <div id=\"list-line-left\">${this.imageBlockTemplate}</div>\n        <div id=\"list-line-right\">\n          <div id=\"title-line\">\n            <div id=\"title\">${this.titleTemplate}</div>\n            ${this.iconRightTemplate}\n          </div>\n        </div>\n      </div>\n      <div id=\"list-line-bottom\">${this.detailsTemplate}</div>\n    `;\n  }\n\n  private get desktopTemplate() {\n    return html`\n      <div id=\"list-line-left\">${this.imageBlockTemplate}</div>\n      <div id=\"list-line-right\">\n        <div id=\"title-line\">\n          <div id=\"title\">${this.titleTemplate}</div>\n          ${this.iconRightTemplate}\n        </div>\n        ${this.detailsTemplate}\n      </div>\n    `;\n  }\n\n  private get imageBlockTemplate() {\n    return html`\n      <image-block\n        .model=${this.model}\n        .baseImageUrl=${this.baseImageUrl}\n        .isCompactTile=${false}\n        .isListTile=${true}\n        .viewSize=${this.classSize}\n      >\n      </image-block>\n    `;\n  }\n\n  private get detailsTemplate() {\n    return html`\n      ${this.itemLineTemplate} ${this.creatorTemplate}\n      <div id=\"dates-line\">\n        ${this.datePublishedTemplate} ${this.dateSortByTemplate}\n      </div>\n      <div id=\"views-line\">\n        ${this.viewsTemplate} ${this.ratingTemplate} ${this.reviewsTemplate}\n      </div>\n      ${this.topicsTemplate} ${this.collectionsTemplate}\n      ${this.descriptionTemplate} ${this.textSnippetsTemplate}\n    `;\n  }\n\n  // Data templates\n  private get iconRightTemplate() {\n    return html`\n      <div id=\"icon-right\">\n        <mediatype-icon\n          .mediatype=${this.model?.mediatype}\n          .collections=${this.model?.collections}\n        >\n        </mediatype-icon>\n      </div>\n    `;\n  }\n\n  private get titleTemplate() {\n    if (!this.model?.title) {\n      return nothing;\n    }\n    return html` ${this.detailsLink(this.model.identifier, this.model.title)} `;\n  }\n\n  private get itemLineTemplate() {\n    const source = this.sourceTemplate;\n    const volume = this.volumeTemplate;\n    const issue = this.issueTemplate;\n    if (!source && !volume && !issue) {\n      return nothing;\n    }\n    return html` <div id=\"item-line\">${source} ${volume} ${issue}</div> `;\n  }\n\n  private get sourceTemplate() {\n    if (!this.model?.source) {\n      return nothing;\n    }\n    return html`\n      <div id=\"source\" class=\"metadata\">\n        ${this.labelTemplate('Source')}\n        ${this.searchLink('source', this.model.source)}\n      </div>\n    `;\n  }\n\n  private get volumeTemplate() {\n    return this.metadataTemplate(this.model?.volume, 'Volume');\n  }\n\n  private get issueTemplate() {\n    return this.metadataTemplate(this.model?.issue, 'Issue');\n  }\n\n  private get creatorTemplate() {\n    // \"Achivist since\" if account\n    if (this.model?.mediatype === 'account') {\n      return html`\n        <div id=\"creator\" class=\"metadata\">\n          <span class=\"label\"> ${accountLabel(this.model?.dateAdded)} </span>\n        </div>\n      `;\n    }\n    // \"Creator\" if not account tile\n    if (!this.model?.creators || this.model.creators.length === 0) {\n      return nothing;\n    }\n    return html`\n      <div id=\"creator\" class=\"metadata\">\n        ${this.labelTemplate('By')}\n        ${join(\n          map(this.model.creators, id => this.searchLink('creator', id)),\n          html`, `\n        )}\n      </div>\n    `;\n  }\n\n  private get datePublishedTemplate() {\n    return this.metadataTemplate(\n      formatDate(this.model?.datePublished, 'long'),\n      'Published'\n    );\n  }\n\n  // Show date label/value when sorted by date type\n  // Except datePublished which is always shown\n  private get dateSortByTemplate() {\n    if (\n      this.sortParam &&\n      (this.sortParam.field === 'addeddate' ||\n        this.sortParam.field === 'reviewdate' ||\n        this.sortParam.field === 'publicdate')\n    ) {\n      return this.metadataTemplate(\n        formatDate(this.date, 'long'),\n        dateLabel(this.sortParam.field)\n      );\n    }\n    return nothing;\n  }\n\n  private get viewsTemplate() {\n    return this.metadataTemplate(\n      `${formatCount(this.model?.viewCount ?? 0, this.formatSize)}`,\n      'Views'\n    );\n  }\n\n  private get ratingTemplate() {\n    return this.metadataTemplate(this.model?.averageRating, 'Avg Rating');\n  }\n\n  private get reviewsTemplate() {\n    return this.metadataTemplate(this.model?.commentCount, 'Reviews');\n  }\n\n  private get topicsTemplate() {\n    if (!this.model?.subjects || this.model.subjects.length === 0) {\n      return nothing;\n    }\n    return html`\n      <div id=\"topics\" class=\"metadata\">\n        ${this.labelTemplate('Topics')}\n        ${join(\n          map(this.model.subjects, id => this.searchLink('subject', id)),\n          html`, `\n        )}\n      </div>\n    `;\n  }\n\n  private get collectionsTemplate() {\n    if (!this.collectionLinks || this.collectionLinks.length === 0) {\n      return nothing;\n    }\n    return html`\n      <div id=\"collections\" class=\"metadata\">\n        ${this.labelTemplate('Collections')}\n        ${join(this.collectionLinks, html`, `)}\n      </div>\n    `;\n  }\n\n  private get descriptionTemplate() {\n    return this.metadataTemplate(\n      DOMPurify.sanitize(this.model?.description ?? ''),\n      '',\n      'description'\n    );\n  }\n\n  private get textSnippetsTemplate(): TemplateResult | typeof nothing {\n    if (!this.hasSnippets) return nothing;\n\n    return html`<text-snippet-block\n      viewsize=\"list\"\n      .snippets=${this.model?.snippets}\n    ></text-snippet-block>`;\n  }\n\n  private get hasSnippets(): boolean {\n    return !!this.model?.snippets?.length;\n  }\n\n  // Utility functions\n  private metadataTemplate(text: any, label = '', id?: string) {\n    if (!text) return nothing;\n    return html`\n      <div id=${ifDefined(id)} class=\"metadata\">\n        ${this.labelTemplate(label)} ${text}\n      </div>\n    `;\n  }\n\n  private labelTemplate(label: string) {\n    return html` ${label\n      ? html`<span class=\"label\">${label}: </span>`\n      : nothing}`;\n  }\n\n  private searchLink(field: string, searchTerm: string) {\n    if (!field || !searchTerm) {\n      return nothing;\n    }\n    const query = encodeURIComponent(`${field}:\"${searchTerm}\"`);\n    // No whitespace after closing tag\n    // Note: single ' for href='' to wrap \" in query var gets changed back by yarn format\n\n    // eslint-disable-next-line lit/no-invalid-html\n    return html`<a href=\"${this.baseNavigationUrl}/search.php?query=${query}\">\n      ${DOMPurify.sanitize(searchTerm)}</a\n    >`;\n  }\n\n  private detailsLink(identifier: string, text?: string): TemplateResult {\n    const linkText = text ?? identifier;\n    // No whitespace after closing tag\n    // identifiers (all ASCII in their creation) should be safe to use in href, but sanitize anyway\n    return html`<a\n      href=\"${this.baseNavigationUrl}/details/${encodeURI(identifier)}\"\n      >${DOMPurify.sanitize(linkText)}</a\n    >`;\n  }\n\n  /*\n   * TODO: fix field names to match model in src/collection-browser.ts\n   * private get dateSortSelector()\n   * @see src/models.ts\n   */\n  private get date(): Date | undefined {\n    switch (this.sortParam?.field) {\n      case 'date':\n        return this.model?.datePublished;\n      case 'reviewdate':\n        return this.model?.dateReviewed;\n      case 'addeddate':\n        return this.model?.dateAdded;\n      default:\n        return this.model?.dateArchived; // publicdate\n    }\n  }\n\n  private get classSize(): string {\n    if (\n      this.mobileBreakpoint &&\n      this.currentWidth &&\n      this.currentWidth < this.mobileBreakpoint\n    ) {\n      return 'mobile';\n    }\n    return 'desktop';\n  }\n\n  private get formatSize(): DateFormat | NumberFormat {\n    if (\n      this.mobileBreakpoint &&\n      this.currentWidth &&\n      this.currentWidth < this.mobileBreakpoint\n    ) {\n      return 'short';\n    }\n    return 'long';\n  }\n\n  static get styles() {\n    return css`\n      html {\n        font-size: unset;\n      }\n\n      div {\n        font-size: 14px;\n      }\n\n      div a {\n        text-decoration: none;\n      }\n\n      .label {\n        font-weight: bold;\n      }\n\n      #list-line.mobile {\n        --infiniteScrollerRowGap: 20px;\n        --infiniteScrollerRowHeight: auto;\n      }\n\n      #list-line.desktop {\n        --infiniteScrollerRowGap: 30px;\n        --infiniteScrollerRowHeight: auto;\n      }\n\n      /* fields */\n      #icon-right {\n        width: 20px;\n        padding-top: 5px;\n        --iconHeight: 20px;\n        --iconWidth: 20px;\n        --iconTextAlign: right;\n        margin-top: -8px;\n        text-align: right;\n      }\n\n      #title {\n        color: #4b64ff;\n        text-decoration: none;\n        font-size: 22px;\n        font-weight: bold;\n        /* align top of text with image */\n        line-height: 25px;\n        margin-top: -4px;\n        padding-bottom: 2px;\n        flex-grow: 1;\n      }\n\n      .metadata {\n        line-height: 20px;\n      }\n\n      #description,\n      #creator,\n      #topics,\n      #source {\n        text-align: left;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        -webkit-box-orient: vertical;\n        display: -webkit-box;\n        word-break: break-word;\n        -webkit-line-clamp: 3; /* number of lines to show */\n        line-clamp: 3;\n      }\n\n      #icon {\n        padding-top: 5px;\n      }\n\n      #description {\n        padding-top: 10px;\n      }\n\n      /* Top level container */\n      #list-line {\n        display: flex;\n      }\n\n      #list-line.mobile {\n        flex-direction: column;\n      }\n\n      #list-line.desktop {\n        column-gap: 10px;\n      }\n\n      #list-line-top {\n        display: flex;\n        column-gap: 7px;\n      }\n\n      #list-line-bottom {\n        padding-top: 4px;\n      }\n\n      #list-line-right,\n      #list-line-top,\n      #list-line-bottom {\n        width: 100%;\n      }\n\n      div a:hover {\n        text-decoration: underline;\n      }\n\n      /* Lines containing multiple div as row */\n      #item-line,\n      #dates-line,\n      #views-line,\n      #title-line {\n        display: flex;\n        flex-direction: row;\n        gap: 10px;\n      }\n    `;\n  }\n}\n"]}
+{"version":3,"file":"tile-list.js","sourceRoot":"","sources":["../../../../src/tiles/list/tile-list.ts"],"names":[],"mappings":"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","sourcesContent":["import {\r\n  css,\r\n  html,\r\n  LitElement,\r\n  nothing,\r\n  PropertyValues,\r\n  TemplateResult,\r\n} from 'lit';\r\nimport { ifDefined } from 'lit/directives/if-defined.js';\r\nimport { join } from 'lit/directives/join.js';\r\nimport { map } from 'lit/directives/map.js';\r\nimport { customElement, property, state } from 'lit/decorators.js';\r\nimport DOMPurify from 'dompurify';\r\n\r\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\r\nimport type { SortParam } from '@internetarchive/search-service';\r\nimport type { TileModel } from '../../models';\r\n\r\nimport { dateLabel } from './date-label';\r\nimport { accountLabel } from './account-label';\r\nimport { formatCount, NumberFormat } from '../../utils/format-count';\r\nimport { formatDate, DateFormat } from '../../utils/format-date';\r\n\r\nimport '../image-block';\r\nimport '../mediatype-icon';\r\n\r\n@customElement('tile-list')\r\nexport class TileList extends LitElement {\r\n  @property({ type: Object }) model?: TileModel;\r\n\r\n  @property({ type: String }) baseNavigationUrl?: string;\r\n\r\n  @property({ type: Object })\r\n  collectionNameCache?: CollectionNameCacheInterface;\r\n\r\n  @property({ type: Number }) currentWidth?: number;\r\n\r\n  @property({ type: Number }) currentHeight?: number;\r\n\r\n  @property({ type: Object }) sortParam: SortParam | null = null;\r\n\r\n  @property({ type: Number }) mobileBreakpoint?: number;\r\n\r\n  @state() private collectionLinks: TemplateResult[] = [];\r\n\r\n  @property({ type: String }) baseImageUrl?: string;\r\n\r\n  @property({ type: Boolean }) loggedIn = false;\r\n\r\n  protected updated(changed: PropertyValues): void {\r\n    if (changed.has('model')) {\r\n      this.fetchCollectionNames();\r\n    }\r\n  }\r\n\r\n  private async fetchCollectionNames() {\r\n    if (\r\n      !this.model?.collections ||\r\n      this.model.collections.length === 0 ||\r\n      !this.collectionNameCache\r\n    ) {\r\n      return;\r\n    }\r\n    // Note: quirk of Lit: need to replace collectionLinks array,\r\n    // otherwise it will not re-render. Can't simply alter the array.\r\n    this.collectionLinks = [];\r\n    const newCollellectionLinks: TemplateResult[] = [];\r\n    const promises: Promise<void>[] = [];\r\n    for (const collection of this.model.collections) {\r\n      promises.push(\r\n        this.collectionNameCache?.collectionNameFor(collection).then(name => {\r\n          newCollellectionLinks.push(\r\n            this.detailsLink(collection, name ?? collection)\r\n          );\r\n        })\r\n      );\r\n    }\r\n    await Promise.all(promises);\r\n    this.collectionLinks = newCollellectionLinks;\r\n  }\r\n\r\n  render() {\r\n    return html`\r\n      <div id=\"list-line\" class=\"${this.classSize}\">\r\n        ${this.classSize === 'mobile'\r\n          ? this.mobileTemplate\r\n          : this.desktopTemplate}\r\n      </div>\r\n    `;\r\n  }\r\n\r\n  private get mobileTemplate() {\r\n    return html`\r\n      <div id=\"list-line-top\">\r\n        <div id=\"list-line-left\">${this.imageBlockTemplate}</div>\r\n        <div id=\"list-line-right\">\r\n          <div id=\"title-line\">\r\n            <div id=\"title\">${this.titleTemplate}</div>\r\n            ${this.iconRightTemplate}\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div id=\"list-line-bottom\">${this.detailsTemplate}</div>\r\n    `;\r\n  }\r\n\r\n  private get desktopTemplate() {\r\n    return html`\r\n      <div id=\"list-line-left\">${this.imageBlockTemplate}</div>\r\n      <div id=\"list-line-right\">\r\n        <div id=\"title-line\">\r\n          <div id=\"title\">${this.titleTemplate}</div>\r\n          ${this.iconRightTemplate}\r\n        </div>\r\n        ${this.detailsTemplate}\r\n      </div>\r\n    `;\r\n  }\r\n\r\n  private get imageBlockTemplate() {\r\n    return html`\r\n      <image-block\r\n        .model=${this.model}\r\n        .baseImageUrl=${this.baseImageUrl}\r\n        .isCompactTile=${false}\r\n        .isListTile=${true}\r\n        .viewSize=${this.classSize}\r\n      >\r\n      </image-block>\r\n    `;\r\n  }\r\n\r\n  private get detailsTemplate() {\r\n    return html`\r\n      ${this.itemLineTemplate} ${this.creatorTemplate}\r\n      <div id=\"dates-line\">\r\n        ${this.datePublishedTemplate} ${this.dateSortByTemplate}\r\n      </div>\r\n      <div id=\"views-line\">\r\n        ${this.viewsTemplate} ${this.ratingTemplate} ${this.reviewsTemplate}\r\n      </div>\r\n      ${this.topicsTemplate} ${this.collectionsTemplate}\r\n      ${this.descriptionTemplate} ${this.textSnippetsTemplate}\r\n    `;\r\n  }\r\n\r\n  // Data templates\r\n  private get iconRightTemplate() {\r\n    return html`\r\n      <div id=\"icon-right\">\r\n        <mediatype-icon\r\n          .mediatype=${this.model?.mediatype}\r\n          .collections=${this.model?.collections}\r\n        >\r\n        </mediatype-icon>\r\n      </div>\r\n    `;\r\n  }\r\n\r\n  private get titleTemplate() {\r\n    if (!this.model?.title) {\r\n      return nothing;\r\n    }\r\n    return html` ${this.detailsLink(this.model.identifier, this.model.title)} `;\r\n  }\r\n\r\n  private get itemLineTemplate() {\r\n    const source = this.sourceTemplate;\r\n    const volume = this.volumeTemplate;\r\n    const issue = this.issueTemplate;\r\n    if (!source && !volume && !issue) {\r\n      return nothing;\r\n    }\r\n    return html` <div id=\"item-line\">${source} ${volume} ${issue}</div> `;\r\n  }\r\n\r\n  private get sourceTemplate() {\r\n    if (!this.model?.source) {\r\n      return nothing;\r\n    }\r\n    return html`\r\n      <div id=\"source\" class=\"metadata\">\r\n        ${this.labelTemplate('Source')}\r\n        ${this.searchLink('source', this.model.source)}\r\n      </div>\r\n    `;\r\n  }\r\n\r\n  private get volumeTemplate() {\r\n    return this.metadataTemplate(this.model?.volume, 'Volume');\r\n  }\r\n\r\n  private get issueTemplate() {\r\n    return this.metadataTemplate(this.model?.issue, 'Issue');\r\n  }\r\n\r\n  private get creatorTemplate() {\r\n    // \"Achivist since\" if account\r\n    if (this.model?.mediatype === 'account') {\r\n      return html`\r\n        <div id=\"creator\" class=\"metadata\">\r\n          <span class=\"label\"> ${accountLabel(this.model?.dateAdded)} </span>\r\n        </div>\r\n      `;\r\n    }\r\n    // \"Creator\" if not account tile\r\n    if (!this.model?.creators || this.model.creators.length === 0) {\r\n      return nothing;\r\n    }\r\n    return html`\r\n      <div id=\"creator\" class=\"metadata\">\r\n        ${this.labelTemplate('By')}\r\n        ${join(\r\n          map(this.model.creators, id => this.searchLink('creator', id)),\r\n          html`, `\r\n        )}\r\n      </div>\r\n    `;\r\n  }\r\n\r\n  private get datePublishedTemplate() {\r\n    return this.metadataTemplate(\r\n      formatDate(this.model?.datePublished, 'long'),\r\n      'Published'\r\n    );\r\n  }\r\n\r\n  // Show date label/value when sorted by date type\r\n  // Except datePublished which is always shown\r\n  private get dateSortByTemplate() {\r\n    if (\r\n      this.sortParam &&\r\n      (this.sortParam.field === 'addeddate' ||\r\n        this.sortParam.field === 'reviewdate' ||\r\n        this.sortParam.field === 'publicdate')\r\n    ) {\r\n      return this.metadataTemplate(\r\n        formatDate(this.date, 'long'),\r\n        dateLabel(this.sortParam.field)\r\n      );\r\n    }\r\n    return nothing;\r\n  }\r\n\r\n  private get viewsTemplate() {\r\n    return this.metadataTemplate(\r\n      `${formatCount(this.model?.viewCount ?? 0, this.formatSize)}`,\r\n      'Views'\r\n    );\r\n  }\r\n\r\n  private get ratingTemplate() {\r\n    return this.metadataTemplate(this.model?.averageRating, 'Avg Rating');\r\n  }\r\n\r\n  private get reviewsTemplate() {\r\n    return this.metadataTemplate(this.model?.commentCount, 'Reviews');\r\n  }\r\n\r\n  private get topicsTemplate() {\r\n    if (!this.model?.subjects || this.model.subjects.length === 0) {\r\n      return nothing;\r\n    }\r\n    return html`\r\n      <div id=\"topics\" class=\"metadata\">\r\n        ${this.labelTemplate('Topics')}\r\n        ${join(\r\n          map(this.model.subjects, id => this.searchLink('subject', id)),\r\n          html`, `\r\n        )}\r\n      </div>\r\n    `;\r\n  }\r\n\r\n  private get collectionsTemplate() {\r\n    if (!this.collectionLinks || this.collectionLinks.length === 0) {\r\n      return nothing;\r\n    }\r\n    return html`\r\n      <div id=\"collections\" class=\"metadata\">\r\n        ${this.labelTemplate('Collections')}\r\n        ${join(this.collectionLinks, html`, `)}\r\n      </div>\r\n    `;\r\n  }\r\n\r\n  private get descriptionTemplate() {\r\n    return this.metadataTemplate(\r\n      DOMPurify.sanitize(this.model?.description ?? ''),\r\n      '',\r\n      'description'\r\n    );\r\n  }\r\n\r\n  private get textSnippetsTemplate(): TemplateResult | typeof nothing {\r\n    if (!this.hasSnippets) return nothing;\r\n\r\n    return html`<text-snippet-block\r\n      viewsize=\"list\"\r\n      .snippets=${this.model?.snippets}\r\n    ></text-snippet-block>`;\r\n  }\r\n\r\n  private get hasSnippets(): boolean {\r\n    return !!this.model?.snippets?.length;\r\n  }\r\n\r\n  // Utility functions\r\n  // eslint-disable-next-line default-param-last\r\n  private metadataTemplate(text: any, label = '', id?: string) {\r\n    if (!text) return nothing;\r\n    return html`\r\n      <div id=${ifDefined(id)} class=\"metadata\">\r\n        ${this.labelTemplate(label)} ${text}\r\n      </div>\r\n    `;\r\n  }\r\n\r\n  private labelTemplate(label: string) {\r\n    return html` ${label\r\n      ? html`<span class=\"label\">${label}: </span>`\r\n      : nothing}`;\r\n  }\r\n\r\n  private searchLink(field: string, searchTerm: string) {\r\n    if (!field || !searchTerm) {\r\n      return nothing;\r\n    }\r\n    const query = encodeURIComponent(`${field}:\"${searchTerm}\"`);\r\n    // No whitespace after closing tag\r\n    // Note: single ' for href='' to wrap \" in query var gets changed back by yarn format\r\n\r\n    // eslint-disable-next-line lit/no-invalid-html\r\n    return html`<a href=\"${this.baseNavigationUrl}/search.php?query=${query}\">\r\n      ${DOMPurify.sanitize(searchTerm)}</a\r\n    >`;\r\n  }\r\n\r\n  private detailsLink(identifier: string, text?: string): TemplateResult {\r\n    const linkText = text ?? identifier;\r\n    // No whitespace after closing tag\r\n    // identifiers (all ASCII in their creation) should be safe to use in href, but sanitize anyway\r\n    return html`<a\r\n      href=\"${this.baseNavigationUrl}/details/${encodeURI(identifier)}\"\r\n      >${DOMPurify.sanitize(linkText)}</a\r\n    >`;\r\n  }\r\n\r\n  /*\r\n   * TODO: fix field names to match model in src/collection-browser.ts\r\n   * private get dateSortSelector()\r\n   * @see src/models.ts\r\n   */\r\n  private get date(): Date | undefined {\r\n    switch (this.sortParam?.field) {\r\n      case 'date':\r\n        return this.model?.datePublished;\r\n      case 'reviewdate':\r\n        return this.model?.dateReviewed;\r\n      case 'addeddate':\r\n        return this.model?.dateAdded;\r\n      default:\r\n        return this.model?.dateArchived; // publicdate\r\n    }\r\n  }\r\n\r\n  private get classSize(): string {\r\n    if (\r\n      this.mobileBreakpoint &&\r\n      this.currentWidth &&\r\n      this.currentWidth < this.mobileBreakpoint\r\n    ) {\r\n      return 'mobile';\r\n    }\r\n    return 'desktop';\r\n  }\r\n\r\n  private get formatSize(): DateFormat | NumberFormat {\r\n    if (\r\n      this.mobileBreakpoint &&\r\n      this.currentWidth &&\r\n      this.currentWidth < this.mobileBreakpoint\r\n    ) {\r\n      return 'short';\r\n    }\r\n    return 'long';\r\n  }\r\n\r\n  static get styles() {\r\n    return css`\r\n      html {\r\n        font-size: unset;\r\n      }\r\n\r\n      div {\r\n        font-size: 14px;\r\n      }\r\n\r\n      div a {\r\n        text-decoration: none;\r\n      }\r\n\r\n      .label {\r\n        font-weight: bold;\r\n      }\r\n\r\n      #list-line.mobile {\r\n        --infiniteScrollerRowGap: 20px;\r\n        --infiniteScrollerRowHeight: auto;\r\n      }\r\n\r\n      #list-line.desktop {\r\n        --infiniteScrollerRowGap: 30px;\r\n        --infiniteScrollerRowHeight: auto;\r\n      }\r\n\r\n      /* fields */\r\n      #icon-right {\r\n        width: 20px;\r\n        padding-top: 5px;\r\n        --iconHeight: 20px;\r\n        --iconWidth: 20px;\r\n        --iconTextAlign: right;\r\n        margin-top: -8px;\r\n        text-align: right;\r\n      }\r\n\r\n      #title {\r\n        color: #4b64ff;\r\n        text-decoration: none;\r\n        font-size: 22px;\r\n        font-weight: bold;\r\n        /* align top of text with image */\r\n        line-height: 25px;\r\n        margin-top: -4px;\r\n        padding-bottom: 2px;\r\n        flex-grow: 1;\r\n      }\r\n\r\n      .metadata {\r\n        line-height: 20px;\r\n      }\r\n\r\n      #description,\r\n      #creator,\r\n      #topics,\r\n      #source {\r\n        text-align: left;\r\n        overflow: hidden;\r\n        text-overflow: ellipsis;\r\n        -webkit-box-orient: vertical;\r\n        display: -webkit-box;\r\n        word-break: break-word;\r\n        -webkit-line-clamp: 3; /* number of lines to show */\r\n        line-clamp: 3;\r\n      }\r\n\r\n      #icon {\r\n        padding-top: 5px;\r\n      }\r\n\r\n      #description {\r\n        padding-top: 10px;\r\n      }\r\n\r\n      /* Top level container */\r\n      #list-line {\r\n        display: flex;\r\n      }\r\n\r\n      #list-line.mobile {\r\n        flex-direction: column;\r\n      }\r\n\r\n      #list-line.desktop {\r\n        column-gap: 10px;\r\n      }\r\n\r\n      #list-line-top {\r\n        display: flex;\r\n        column-gap: 7px;\r\n      }\r\n\r\n      #list-line-bottom {\r\n        padding-top: 4px;\r\n      }\r\n\r\n      #list-line-right,\r\n      #list-line-top,\r\n      #list-line-bottom {\r\n        width: 100%;\r\n      }\r\n\r\n      div a:hover {\r\n        text-decoration: underline;\r\n      }\r\n\r\n      /* Lines containing multiple div as row */\r\n      #item-line,\r\n      #dates-line,\r\n      #views-line,\r\n      #title-line {\r\n        display: flex;\r\n        flex-direction: row;\r\n        gap: 10px;\r\n      }\r\n    `;\r\n  }\r\n}\r\n"]}

package/dist/src/utils/format-count.js

@@ -23,6 +23,7 @@ function magnitude(number, numberFormat) {
  * Round a number given passed magnitude.
  * Significant digits of value less than 10 get a decimal.
  */
+// eslint-disable-next-line default-param-last
 function round(number = 0, divisor) {
     const result = number / divisor;
     const roundToOne = result < 10;

package/dist/src/utils/format-count.js.map

@@ -1 +1 @@
-{"version":3,"file":"format-count.js","sourceRoot":"","sources":["../../../src/utils/format-count.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAUzC;;GAEG;AACH,SAAS,SAAS,CAAC,MAAc,EAAE,YAA0B;IAC3D,IAAI,OAAO,GAAY,CAAC,CAAC;IACzB,IAAI,MAAM,IAAI,UAAa,EAAE;QAC3B,OAAO,GAAG,UAAa,CAAC;KACzB;SAAM,IAAI,MAAM,IAAI,OAAS,EAAE;QAC9B,OAAO,GAAG,OAAS,CAAC;KACrB;SAAM,IAAI,MAAM,IAAI,IAAK,IAAI,YAAY,KAAK,OAAO,EAAE;QACtD,OAAO,GAAG,IAAK,CAAC;KACjB;IACD,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;;;GAGG;AACH,SAAS,KAAK,CAAC,SAAiB,CAAC,EAAE,OAAgB;IACjD,MAAM,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;IAChC,MAAM,UAAU,GAAG,MAAM,GAAG,EAAE,CAAC;IAC/B,IAAI,OAAO,GAAW,CAAC,CAAC;IACxB,IAAI,UAAU,EAAE;QACd,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC;KAC3D;SAAM;QACL,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;KAC9B;IACD,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;;GAEG;AACH,SAAS,QAAQ,CACf,OAAe,EACf,OAAgB,EAChB,MAAmB,EACnB,MAAc;IAEd,QAAQ,OAAO,EAAE;QACf,KAAK,UAAa;YAChB,IAAI,MAAM,KAAK,OAAO,EAAE;gBACtB,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,GAAG,CAAC,CAAC;aAC9B;YACD,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,UAAU,CAAC,CAAC;QACtC,KAAK,OAAS;YACZ,IAAI,MAAM,KAAK,OAAO,EAAE;gBACtB,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,GAAG,CAAC,CAAC;aAC9B;YACD,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,UAAU,CAAC,CAAC;QACtC,KAAK,IAAK;YACR,IAAI,MAAM,KAAK,OAAO,EAAE;gBACtB,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,GAAG,CAAC,CAAC;aAC9B;YACD,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,WAAW,CAAC,CAAC;QAEvC;YACE,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;KACxD;AACH,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,WAAW,CACzB,KAAyB,EACzB,eAA6B,MAAM,EACnC,cAA2B,OAAO,EAClC,SAAiB,OAAO;IAExB,4BAA4B;IAC5B,MAAM,MAAM,GAAG,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,CAAC,CAAC,CAAC;IAC3B,IAAI,MAAM,GAAG,CAAC,EAAE;QACd,OAAO,EAAE,CAAC;KACX;IACD,MAAM,OAAO,GAAG,SAAS,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;IAChD,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACvC,OAAO,QAAQ,CAAC,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,CAAC,CAAC;AACzD,CAAC","sourcesContent":["/*\n * Replaces Petabox www/common/Util::number_format()\n * For positive numbers only.\n */\nimport { msg, str } from '@lit/localize';\n\nexport type NumberFormat =\n  | 'short' // 1.2 [K | thousand]\n  | 'long'; // 1,200 [No label for numbers < 1,000,000]\nexport type LabelFormat =\n  | 'short' // [1.2]K\n  | 'long'; // [1.2] thousand\ntype Divisor = 1_000_000_000 | 1_000_000 | 1_000 | 1;\n\n/**\n * Return the magnitude of a number.\n */\nfunction magnitude(number: number, numberFormat: NumberFormat): Divisor {\n  let divisor: Divisor = 1;\n  if (number >= 1_000_000_000) {\n    divisor = 1_000_000_000;\n  } else if (number >= 1_000_000) {\n    divisor = 1_000_000;\n  } else if (number >= 1_000 && numberFormat === 'short') {\n    divisor = 1_000;\n  }\n  return divisor;\n}\n\n/**\n * Round a number given passed magnitude.\n * Significant digits of value less than 10 get a decimal.\n */\nfunction round(number: number = 0, divisor: Divisor): number {\n  const result = number / divisor;\n  const roundToOne = result < 10;\n  let rounded: number = 0;\n  if (roundToOne) {\n    rounded = Math.round((result + Number.EPSILON) * 10) / 10;\n  } else {\n    rounded = Math.round(result);\n  }\n  return rounded;\n}\n\n/**\n * Return a label for a number and format.\n */\nfunction labelize(\n  rounded: number,\n  divisor: Divisor,\n  format: LabelFormat,\n  locale: string\n): string {\n  switch (divisor) {\n    case 1_000_000_000:\n      if (format === 'short') {\n        return msg(str`${rounded}B`);\n      }\n      return msg(str`${rounded} billion`);\n    case 1_000_000:\n      if (format === 'short') {\n        return msg(str`${rounded}M`);\n      }\n      return msg(str`${rounded} million`);\n    case 1_000:\n      if (format === 'short') {\n        return msg(str`${rounded}K`);\n      }\n      return msg(str`${rounded} thousand`);\n\n    default:\n      return new Intl.NumberFormat(locale).format(rounded);\n  }\n}\n\n/**\n * Format a \"count\" number into short \"icon\" or longer text string.\n * For positive numbers only.\n */\nexport function formatCount(\n  count: number | undefined,\n  numberFormat: NumberFormat = 'long',\n  labelFormat: LabelFormat = 'short',\n  locale: string = 'en-US'\n): string {\n  // Return blank if undefined\n  const number = count ?? -1;\n  if (number < 0) {\n    return '';\n  }\n  const divisor = magnitude(number, numberFormat);\n  const rounded = round(number, divisor);\n  return labelize(rounded, divisor, labelFormat, locale);\n}\n"]}
+{"version":3,"file":"format-count.js","sourceRoot":"","sources":["../../../src/utils/format-count.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAUzC;;GAEG;AACH,SAAS,SAAS,CAAC,MAAc,EAAE,YAA0B;IAC3D,IAAI,OAAO,GAAY,CAAC,CAAC;IACzB,IAAI,MAAM,IAAI,UAAa,EAAE;QAC3B,OAAO,GAAG,UAAa,CAAC;KACzB;SAAM,IAAI,MAAM,IAAI,OAAS,EAAE;QAC9B,OAAO,GAAG,OAAS,CAAC;KACrB;SAAM,IAAI,MAAM,IAAI,IAAK,IAAI,YAAY,KAAK,OAAO,EAAE;QACtD,OAAO,GAAG,IAAK,CAAC;KACjB;IACD,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;;;GAGG;AACH,8CAA8C;AAC9C,SAAS,KAAK,CAAC,SAAiB,CAAC,EAAE,OAAgB;IACjD,MAAM,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;IAChC,MAAM,UAAU,GAAG,MAAM,GAAG,EAAE,CAAC;IAC/B,IAAI,OAAO,GAAW,CAAC,CAAC;IACxB,IAAI,UAAU,EAAE;QACd,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,CAAC;KAC3D;SAAM;QACL,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;KAC9B;IACD,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;;GAEG;AACH,SAAS,QAAQ,CACf,OAAe,EACf,OAAgB,EAChB,MAAmB,EACnB,MAAc;IAEd,QAAQ,OAAO,EAAE;QACf,KAAK,UAAa;YAChB,IAAI,MAAM,KAAK,OAAO,EAAE;gBACtB,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,GAAG,CAAC,CAAC;aAC9B;YACD,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,UAAU,CAAC,CAAC;QACtC,KAAK,OAAS;YACZ,IAAI,MAAM,KAAK,OAAO,EAAE;gBACtB,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,GAAG,CAAC,CAAC;aAC9B;YACD,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,UAAU,CAAC,CAAC;QACtC,KAAK,IAAK;YACR,IAAI,MAAM,KAAK,OAAO,EAAE;gBACtB,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,GAAG,CAAC,CAAC;aAC9B;YACD,OAAO,GAAG,CAAC,GAAG,CAAA,GAAG,OAAO,WAAW,CAAC,CAAC;QAEvC;YACE,OAAO,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC;KACxD;AACH,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,WAAW,CACzB,KAAyB,EACzB,eAA6B,MAAM,EACnC,cAA2B,OAAO,EAClC,SAAiB,OAAO;IAExB,4BAA4B;IAC5B,MAAM,MAAM,GAAG,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,CAAC,CAAC,CAAC;IAC3B,IAAI,MAAM,GAAG,CAAC,EAAE;QACd,OAAO,EAAE,CAAC;KACX;IACD,MAAM,OAAO,GAAG,SAAS,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC;IAChD,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACvC,OAAO,QAAQ,CAAC,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,CAAC,CAAC;AACzD,CAAC","sourcesContent":["/*\r\n * Replaces Petabox www/common/Util::number_format()\r\n * For positive numbers only.\r\n */\r\nimport { msg, str } from '@lit/localize';\r\n\r\nexport type NumberFormat =\r\n  | 'short' // 1.2 [K | thousand]\r\n  | 'long'; // 1,200 [No label for numbers < 1,000,000]\r\nexport type LabelFormat =\r\n  | 'short' // [1.2]K\r\n  | 'long'; // [1.2] thousand\r\ntype Divisor = 1_000_000_000 | 1_000_000 | 1_000 | 1;\r\n\r\n/**\r\n * Return the magnitude of a number.\r\n */\r\nfunction magnitude(number: number, numberFormat: NumberFormat): Divisor {\r\n  let divisor: Divisor = 1;\r\n  if (number >= 1_000_000_000) {\r\n    divisor = 1_000_000_000;\r\n  } else if (number >= 1_000_000) {\r\n    divisor = 1_000_000;\r\n  } else if (number >= 1_000 && numberFormat === 'short') {\r\n    divisor = 1_000;\r\n  }\r\n  return divisor;\r\n}\r\n\r\n/**\r\n * Round a number given passed magnitude.\r\n * Significant digits of value less than 10 get a decimal.\r\n */\r\n// eslint-disable-next-line default-param-last\r\nfunction round(number: number = 0, divisor: Divisor): number {\r\n  const result = number / divisor;\r\n  const roundToOne = result < 10;\r\n  let rounded: number = 0;\r\n  if (roundToOne) {\r\n    rounded = Math.round((result + Number.EPSILON) * 10) / 10;\r\n  } else {\r\n    rounded = Math.round(result);\r\n  }\r\n  return rounded;\r\n}\r\n\r\n/**\r\n * Return a label for a number and format.\r\n */\r\nfunction labelize(\r\n  rounded: number,\r\n  divisor: Divisor,\r\n  format: LabelFormat,\r\n  locale: string\r\n): string {\r\n  switch (divisor) {\r\n    case 1_000_000_000:\r\n      if (format === 'short') {\r\n        return msg(str`${rounded}B`);\r\n      }\r\n      return msg(str`${rounded} billion`);\r\n    case 1_000_000:\r\n      if (format === 'short') {\r\n        return msg(str`${rounded}M`);\r\n      }\r\n      return msg(str`${rounded} million`);\r\n    case 1_000:\r\n      if (format === 'short') {\r\n        return msg(str`${rounded}K`);\r\n      }\r\n      return msg(str`${rounded} thousand`);\r\n\r\n    default:\r\n      return new Intl.NumberFormat(locale).format(rounded);\r\n  }\r\n}\r\n\r\n/**\r\n * Format a \"count\" number into short \"icon\" or longer text string.\r\n * For positive numbers only.\r\n */\r\nexport function formatCount(\r\n  count: number | undefined,\r\n  numberFormat: NumberFormat = 'long',\r\n  labelFormat: LabelFormat = 'short',\r\n  locale: string = 'en-US'\r\n): string {\r\n  // Return blank if undefined\r\n  const number = count ?? -1;\r\n  if (number < 0) {\r\n    return '';\r\n  }\r\n  const divisor = magnitude(number, numberFormat);\r\n  const rounded = round(number, divisor);\r\n  return labelize(rounded, divisor, labelFormat, locale);\r\n}\r\n"]}