@internetarchive/collection-browser 2.7.7-alpha.2 → 2.7.8-alpha1

package/dist/src/manage/manage-bar.js

@@ -3,7 +3,9 @@ import { msg } from '@lit/localize';
 import { LitElement, html, css } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
 import { when } from 'lit/directives/when.js';
+import { ModalConfig, } from '@internetarchive/modal-manager';
 import iaButtonStyle from '../styles/ia-button';
+import './remove-items-modal-content';
 let ManageBar = class ManageBar extends LitElement {
     constructor() {
         super(...arguments);
@@ -11,6 +13,10 @@ let ManageBar = class ManageBar extends LitElement {
          * The label displayed in front of the management buttons
          */
         this.label = msg('Select items to remove');
+        /**
+         * Array of items that have been selected for management
+         */
+        this.selectedItems = [];
         /**
          * Whether to show the "Select All" button (default false)
          */
@@ -19,6 +25,10 @@ let ManageBar = class ManageBar extends LitElement {
          * Whether to show the "Unselect All" button (default false)
          */
         this.showUnselectAll = false;
+        /**
+         * Whether to show "Item Manager the items" button (default false)
+         */
+        this.showItemManageButton = false;
         /**
          * Whether to active delete button for selectable items
          */
@@ -35,34 +45,30 @@ let ManageBar = class ManageBar extends LitElement {
           <button
             class="ia-button danger"
             ?disabled=${!this.removeAllowed}
-            @click=${this.removeClicked}
+            @click=${this.showRemoveItemsModal}
           >
-            ${msg('Remove selected items')}
+            ${msg('Remove selected items')} (${this.selectedItems.length})
           </button>
-          ${this.pageContext === 'search'
-            ? html `
-                <button
-                  class="ia-button warning"
-                  ?disabled=${!this.removeAllowed}
-                  @click=${this.itemsManagerClicked}
-                >
-                  ${msg('Item Manager the items')}
-                </button>
-              `
-            : ''}
+          ${when(this.showItemManageButton, () => html ` <button
+              class="ia-button warning"
+              ?disabled=${!this.removeAllowed}
+              @click=${this.manageItemsClicked}
+            >
+              ${msg('Item Manager the items')} (${this.selectedItems.length})
+            </button>`)}
           <div class="selection-buttons">
             ${when(this.showSelectAll, () => html ` <button
-                  class="ia-button link select-all-btn"
-                  @click=${this.selectAllClicked}
-                >
-                  ${msg('Select all')}
-                </button>`)}
+                class="ia-button link select-all-btn"
+                @click=${this.selectAllClicked}
+              >
+                ${msg('Select all')}
+              </button>`)}
             ${when(this.showUnselectAll, () => html ` <button
-                  class="ia-button link unselect-all-btn"
-                  @click=${this.unselectAllClicked}
-                >
-                  ${msg('Unselect all')}
-                </button>`)}
+                class="ia-button link unselect-all-btn"
+                @click=${this.unselectAllClicked}
+              >
+                ${msg('Unselect all')}
+              </button>`)}
           </div>
         </div>
       </div>
@@ -71,11 +77,11 @@ let ManageBar = class ManageBar extends LitElement {
     cancelClicked() {
         this.dispatchEvent(new CustomEvent('cancel'));
     }
-    removeClicked() {
+    removeItemsClicked() {
         this.dispatchEvent(new CustomEvent('removeItems'));
     }
-    itemsManagerClicked() {
-        this.dispatchEvent(new CustomEvent('itemsManager'));
+    manageItemsClicked() {
+        this.dispatchEvent(new CustomEvent('manageItems'));
     }
     selectAllClicked() {
         this.dispatchEvent(new CustomEvent('selectAll'));
@@ -83,6 +89,85 @@ let ManageBar = class ManageBar extends LitElement {
     unselectAllClicked() {
         this.dispatchEvent(new CustomEvent('unselectAll'));
     }
+    /**
+     * Shows a modal dialog confirming the list of items to be removed
+     * @param items Which items to list in the modal
+     */
+    showRemoveItemsModal() {
+        var _a, _b;
+        const customModalContent = html `
+      <remove-items-modal-content
+        .items=${this.selectedItems}
+        .message=${this.manageViewModalMsg}
+        @confirm=${() => this.removeItemsClicked()}
+      ></remove-items-modal-content>
+    `;
+        const config = new ModalConfig({
+            showProcessingIndicator: false,
+            processingImageMode: 'processing',
+            bodyColor: '#fff',
+            headerColor: '#194880',
+            showHeaderLogo: false,
+            closeOnBackdropClick: true,
+            title: html `${msg('Are you sure you want to remove these items?')}`,
+        });
+        (_a = this.modalManager) === null || _a === void 0 ? void 0 : _a.classList.add('remove-items');
+        (_b = this.modalManager) === null || _b === void 0 ? void 0 : _b.showModal({
+            config,
+            customModalContent,
+            userClosedModalCallback: () => {
+                var _a;
+                (_a = this.modalManager) === null || _a === void 0 ? void 0 : _a.classList.remove('remove-items');
+            },
+        });
+    }
+    /**
+     * Shows a modal dialog indicating that item removal is being processed
+     */
+    showRemoveItemsProcessingModal() {
+        var _a, _b;
+        const config = new ModalConfig({
+            showProcessingIndicator: true,
+            processingImageMode: 'processing',
+            bodyColor: '#fff',
+            headerColor: '#194880',
+            showHeaderLogo: false,
+            closeOnBackdropClick: true,
+            title: html `${msg('Removing selected items...')}`,
+        });
+        (_a = this.modalManager) === null || _a === void 0 ? void 0 : _a.classList.add('remove-items');
+        (_b = this.modalManager) === null || _b === void 0 ? void 0 : _b.showModal({
+            config,
+            userClosedModalCallback: () => {
+                var _a;
+                (_a = this.modalManager) === null || _a === void 0 ? void 0 : _a.classList.remove('remove-items');
+            },
+        });
+    }
+    /**
+     * Shows a modal dialog indicating that an error occurred while removing items
+     */
+    showRemoveItemsErrorModal() {
+        var _a, _b;
+        const config = new ModalConfig({
+            showProcessingIndicator: false,
+            processingImageMode: 'processing',
+            bodyColor: '#fff',
+            headerColor: '#691916',
+            showHeaderLogo: false,
+            closeOnBackdropClick: true,
+            title: html `${msg('Error: unable to remove items')}`,
+            message: html `${msg('An error occurred while removing items. Please try again in a few minutes.')}`,
+        });
+        (_a = this.modalManager) === null || _a === void 0 ? void 0 : _a.classList.add('remove-items');
+        (_b = this.modalManager) === null || _b === void 0 ? void 0 : _b.showModal({
+            config,
+            userClosedModalCallback: () => {
+                var _a;
+                (_a = this.modalManager) === null || _a === void 0 ? void 0 : _a.classList.remove('remove-items');
+            },
+        });
+    }
     static get styles() {
         return css `
       ${iaButtonStyle}
@@ -124,15 +209,24 @@ let ManageBar = class ManageBar extends LitElement {
 __decorate([
     property({ type: String })
 ], ManageBar.prototype, "label", void 0);
+__decorate([
+    property({ type: Object })
+], ManageBar.prototype, "modalManager", void 0);
+__decorate([
+    property({ type: Object })
+], ManageBar.prototype, "selectedItems", void 0);
 __decorate([
     property({ type: String })
-], ManageBar.prototype, "pageContext", void 0);
+], ManageBar.prototype, "manageViewModalMsg", void 0);
 __decorate([
     property({ type: Boolean })
 ], ManageBar.prototype, "showSelectAll", void 0);
 __decorate([
     property({ type: Boolean })
 ], ManageBar.prototype, "showUnselectAll", void 0);
+__decorate([
+    property({ type: Boolean })
+], ManageBar.prototype, "showItemManageButton", void 0);
 __decorate([
     property({ type: Boolean })
 ], ManageBar.prototype, "removeAllowed", void 0);

package/dist/src/manage/manage-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"manage-bar.js","sourceRoot":"","sources":["../../../src/manage/manage-bar.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpC,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAkC,MAAM,KAAK,CAAC;AAC5E,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAC;AAC9C,OAAO,aAAa,MAAM,qBAAqB,CAAC;AASzC,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAAlC;;QACL;;WAEG;QACyB,UAAK,GAAG,GAAG,CAAC,wBAAwB,CAAC,CAAC;QAOlE;;WAEG;QAC0B,kBAAa,GAAG,KAAK,CAAC;QAEnD;;WAEG;QAC0B,oBAAe,GAAG,KAAK,CAAC;QAErD;;WAEG;QAC0B,kBAAa,GAAG,KAAK,CAAC;IAgHrD,CAAC;IA9GC,MAAM;QACJ,OAAO,IAAI,CAAA;;qCAEsB,IAAI,CAAC,KAAK;;kDAEG,IAAI,CAAC,aAAa;cACtD,GAAG,CAAC,QAAQ,CAAC;;;;wBAIH,CAAC,IAAI,CAAC,aAAa;qBACtB,IAAI,CAAC,aAAa;;cAEzB,GAAG,CAAC,uBAAuB,CAAC;;YAE9B,IAAI,CAAC,WAAW,KAAK,QAAQ;YAC7B,CAAC,CAAC,IAAI,CAAA;;;8BAGY,CAAC,IAAI,CAAC,aAAa;2BACtB,IAAI,CAAC,mBAAmB;;oBAE/B,GAAG,CAAC,wBAAwB,CAAC;;eAElC;YACH,CAAC,CAAC,EAAE;;cAEF,IAAI,CACJ,IAAI,CAAC,aAAa,EAClB,GAAG,EAAE,CACH,IAAI,CAAA;;2BAEO,IAAI,CAAC,gBAAgB;;oBAE5B,GAAG,CAAC,YAAY,CAAC;0BACX,CACb;cACC,IAAI,CACJ,IAAI,CAAC,eAAe,EACpB,GAAG,EAAE,CACH,IAAI,CAAA;;2BAEO,IAAI,CAAC,kBAAkB;;oBAE9B,GAAG,CAAC,cAAc,CAAC;0BACb,CACb;;;;KAIR,CAAC;IACJ,CAAC;IAEO,aAAa;QACnB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC;IAChD,CAAC;IAEO,aAAa;QACnB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,aAAa,CAAC,CAAC,CAAC;IACrD,CAAC;IAEO,mBAAmB;QACzB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,cAAc,CAAC,CAAC,CAAC;IACtD,CAAC;IAEO,gBAAgB;QACtB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,WAAW,CAAC,CAAC,CAAC;IACnD,CAAC;IAEO,kBAAkB;QACxB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,aAAa,CAAC,CAAC,CAAC;IACrD,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;QACN,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAiChB,CAAC;IACJ,CAAC;CACF,CAAA;AApI6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAuC;AAKtC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAsB;AAKpB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gDAAuB;AAKtB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kDAAyB;AAKxB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gDAAuB;AAxBxC,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CAwIrB","sourcesContent":["import { msg } from '@lit/localize';\nimport { LitElement, html, css, TemplateResult, CSSResultGroup } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { when } from 'lit/directives/when.js';\nimport iaButtonStyle from '../styles/ia-button';\n\nexport interface ManageableItem {\n  identifier: string;\n  title?: string;\n  dateStr?: string;\n}\n\n@customElement('manage-bar')\nexport class ManageBar extends LitElement {\n  /**\n   * The label displayed in front of the management buttons\n   */\n  @property({ type: String }) label = msg('Select items to remove');\n\n  /**\n   * Specifies the context in which the collection browser is being used\n   */\n  @property({ type: String }) pageContext?: string;\n\n  /**\n   * Whether to show the \"Select All\" button (default false)\n   */\n  @property({ type: Boolean }) showSelectAll = false;\n\n  /**\n   * Whether to show the \"Unselect All\" button (default false)\n   */\n  @property({ type: Boolean }) showUnselectAll = false;\n\n  /**\n   * Whether to active delete button for selectable items\n   */\n  @property({ type: Boolean }) removeAllowed = false;\n\n  render(): TemplateResult {\n    return html`\n      <div class=\"manage-container\">\n        <span class=\"manage-label\">${this.label}</span>\n        <div class=\"manage-buttons\">\n          <button class=\"ia-button dark\" @click=${this.cancelClicked}>\n            ${msg('Cancel')}\n          </button>\n          <button\n            class=\"ia-button danger\"\n            ?disabled=${!this.removeAllowed}\n            @click=${this.removeClicked}\n          >\n            ${msg('Remove selected items')}\n          </button>\n          ${this.pageContext === 'search'\n            ? html`\n                <button\n                  class=\"ia-button warning\"\n                  ?disabled=${!this.removeAllowed}\n                  @click=${this.itemsManagerClicked}\n                >\n                  ${msg('Item Manager the items')}\n                </button>\n              `\n            : ''}\n          <div class=\"selection-buttons\">\n            ${when(\n              this.showSelectAll,\n              () =>\n                html` <button\n                  class=\"ia-button link select-all-btn\"\n                  @click=${this.selectAllClicked}\n                >\n                  ${msg('Select all')}\n                </button>`,\n            )}\n            ${when(\n              this.showUnselectAll,\n              () =>\n                html` <button\n                  class=\"ia-button link unselect-all-btn\"\n                  @click=${this.unselectAllClicked}\n                >\n                  ${msg('Unselect all')}\n                </button>`,\n            )}\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  private cancelClicked(): void {\n    this.dispatchEvent(new CustomEvent('cancel'));\n  }\n\n  private removeClicked(): void {\n    this.dispatchEvent(new CustomEvent('removeItems'));\n  }\n\n  private itemsManagerClicked(): void {\n    this.dispatchEvent(new CustomEvent('itemsManager'));\n  }\n\n  private selectAllClicked(): void {\n    this.dispatchEvent(new CustomEvent('selectAll'));\n  }\n\n  private unselectAllClicked(): void {\n    this.dispatchEvent(new CustomEvent('unselectAll'));\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      ${iaButtonStyle}\n      .manage-container {\n        display: flex;\n        align-items: center;\n        column-gap: 5px;\n        padding: 20px 0 20px;\n        flex-wrap: wrap;\n      }\n\n      .manage-label {\n        display: inline-block;\n        font-weight: bold;\n        font-size: 1.8rem;\n        padding-right: 10px;\n      }\n\n      .manage-buttons {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        column-gap: 5px;\n      }\n\n      .selection-buttons {\n        display: inherit;\n      }\n\n      .ia-button,\n      button {\n        padding: 6px 12px;\n        font-size: 1.4rem;\n        margin: 3px 0;\n      }\n    `;\n  }\n}\n"]}
+{"version":3,"file":"manage-bar.js","sourceRoot":"","sources":["../../../src/manage/manage-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import { msg } from '@lit/localize';\nimport { LitElement, html, css, TemplateResult, CSSResultGroup } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { when } from 'lit/directives/when.js';\nimport {\n  ModalConfig,\n  type ModalManagerInterface,\n} from '@internetarchive/modal-manager';\nimport type { ManageableItem } from '../models';\nimport iaButtonStyle from '../styles/ia-button';\nimport './remove-items-modal-content';\n\n@customElement('manage-bar')\nexport class ManageBar extends LitElement {\n  /**\n   * The label displayed in front of the management buttons\n   */\n  @property({ type: String }) label = msg('Select items to remove');\n\n  /**\n   * The shared modal manager component for displaying modal dialogs on this page\n   */\n  @property({ type: Object }) modalManager?: ModalManagerInterface;\n\n  /**\n   * Array of items that have been selected for management\n   */\n  @property({ type: Object }) selectedItems: Array<ManageableItem> = [];\n\n  /**\n   * Message shows as note in the modal when removing items\n   */\n  @property({ type: String }) manageViewModalMsg?: string;\n\n  /**\n   * Whether to show the \"Select All\" button (default false)\n   */\n  @property({ type: Boolean }) showSelectAll = false;\n\n  /**\n   * Whether to show the \"Unselect All\" button (default false)\n   */\n  @property({ type: Boolean }) showUnselectAll = false;\n\n  /**\n   * Whether to show \"Item Manager the items\" button (default false)\n   */\n  @property({ type: Boolean }) showItemManageButton = false;\n\n  /**\n   * Whether to active delete button for selectable items\n   */\n  @property({ type: Boolean }) removeAllowed = false;\n\n  render(): TemplateResult {\n    return html`\n      <div class=\"manage-container\">\n        <span class=\"manage-label\">${this.label}</span>\n        <div class=\"manage-buttons\">\n          <button class=\"ia-button dark\" @click=${this.cancelClicked}>\n            ${msg('Cancel')}\n          </button>\n          <button\n            class=\"ia-button danger\"\n            ?disabled=${!this.removeAllowed}\n            @click=${this.showRemoveItemsModal}\n          >\n            ${msg('Remove selected items')} (${this.selectedItems.length})\n          </button>\n          ${when(\n            this.showItemManageButton,\n            () => html` <button\n              class=\"ia-button warning\"\n              ?disabled=${!this.removeAllowed}\n              @click=${this.manageItemsClicked}\n            >\n              ${msg('Item Manager the items')} (${this.selectedItems.length})\n            </button>`\n          )}\n          <div class=\"selection-buttons\">\n            ${when(\n              this.showSelectAll,\n              () => html` <button\n                class=\"ia-button link select-all-btn\"\n                @click=${this.selectAllClicked}\n              >\n                ${msg('Select all')}\n              </button>`\n            )}\n            ${when(\n              this.showUnselectAll,\n              () => html` <button\n                class=\"ia-button link unselect-all-btn\"\n                @click=${this.unselectAllClicked}\n              >\n                ${msg('Unselect all')}\n              </button>`\n            )}\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  private cancelClicked(): void {\n    this.dispatchEvent(new CustomEvent('cancel'));\n  }\n\n  private removeItemsClicked(): void {\n    this.dispatchEvent(new CustomEvent('removeItems'));\n  }\n\n  private manageItemsClicked(): void {\n    this.dispatchEvent(new CustomEvent('manageItems'));\n  }\n\n  private selectAllClicked(): void {\n    this.dispatchEvent(new CustomEvent('selectAll'));\n  }\n\n  private unselectAllClicked(): void {\n    this.dispatchEvent(new CustomEvent('unselectAll'));\n  }\n\n  /**\n   * Shows a modal dialog confirming the list of items to be removed\n   * @param items Which items to list in the modal\n   */\n  private showRemoveItemsModal(): void {\n    const customModalContent = html`\n      <remove-items-modal-content\n        .items=${this.selectedItems}\n        .message=${this.manageViewModalMsg}\n        @confirm=${() => this.removeItemsClicked()}\n      ></remove-items-modal-content>\n    `;\n\n    const config = new ModalConfig({\n      showProcessingIndicator: false,\n      processingImageMode: 'processing',\n      bodyColor: '#fff',\n      headerColor: '#194880',\n      showHeaderLogo: false,\n      closeOnBackdropClick: true,\n      title: html`${msg('Are you sure you want to remove these items?')}`,\n    });\n\n    this.modalManager?.classList.add('remove-items');\n    this.modalManager?.showModal({\n      config,\n      customModalContent,\n      userClosedModalCallback: () => {\n        this.modalManager?.classList.remove('remove-items');\n      },\n    });\n  }\n\n  /**\n   * Shows a modal dialog indicating that item removal is being processed\n   */\n  showRemoveItemsProcessingModal(): void {\n    const config = new ModalConfig({\n      showProcessingIndicator: true,\n      processingImageMode: 'processing',\n      bodyColor: '#fff',\n      headerColor: '#194880',\n      showHeaderLogo: false,\n      closeOnBackdropClick: true,\n      title: html`${msg('Removing selected items...')}`,\n    });\n\n    this.modalManager?.classList.add('remove-items');\n    this.modalManager?.showModal({\n      config,\n      userClosedModalCallback: () => {\n        this.modalManager?.classList.remove('remove-items');\n      },\n    });\n  }\n\n  /**\n   * Shows a modal dialog indicating that an error occurred while removing items\n   */\n  showRemoveItemsErrorModal(): void {\n    const config = new ModalConfig({\n      showProcessingIndicator: false,\n      processingImageMode: 'processing',\n      bodyColor: '#fff',\n      headerColor: '#691916',\n      showHeaderLogo: false,\n      closeOnBackdropClick: true,\n      title: html`${msg('Error: unable to remove items')}`,\n      message: html`${msg(\n        'An error occurred while removing items. Please try again in a few minutes.'\n      )}`,\n    });\n\n    this.modalManager?.classList.add('remove-items');\n    this.modalManager?.showModal({\n      config,\n      userClosedModalCallback: () => {\n        this.modalManager?.classList.remove('remove-items');\n      },\n    });\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      ${iaButtonStyle}\n      .manage-container {\n        display: flex;\n        align-items: center;\n        column-gap: 5px;\n        padding: 20px 0 20px;\n        flex-wrap: wrap;\n      }\n\n      .manage-label {\n        display: inline-block;\n        font-weight: bold;\n        font-size: 1.8rem;\n        padding-right: 10px;\n      }\n\n      .manage-buttons {\n        display: flex;\n        flex-wrap: wrap;\n        align-items: center;\n        column-gap: 5px;\n      }\n\n      .selection-buttons {\n        display: inherit;\n      }\n\n      .ia-button,\n      button {\n        padding: 6px 12px;\n        font-size: 1.4rem;\n        margin: 3px 0;\n      }\n    `;\n  }\n}\n"]}

package/dist/src/manage/remove-items-modal-content.d.ts

@@ -0,0 +1,9 @@
+import { LitElement, TemplateResult, CSSResult } from 'lit';
+import type { ManageableItem } from '../models';
+export declare class RemoveItemsModalContent extends LitElement {
+    items: ManageableItem[];
+    message?: string;
+    render(): TemplateResult;
+    private removeItemsBtnClicked;
+    static get styles(): CSSResult;
+}

package/dist/src/manage/remove-items-modal-content.js

@@ -0,0 +1,104 @@
+import { __decorate } from "tslib";
+import { LitElement, html, css, nothing } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { msg } from '@lit/localize';
+import { map } from 'lit/directives/map.js';
+let RemoveItemsModalContent = class RemoveItemsModalContent extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.items = [];
+    }
+    render() {
+        return html `
+      <ul>
+        ${map(this.items, ({ title, date }) => html `
+            <li>
+              <span class="item-title">${title !== null && title !== void 0 ? title : '[untitled]'}</span>
+              <span class="item-date">${date !== null && date !== void 0 ? date : ''}</span>
+            </li>
+          `)}
+      </ul>
+      ${this.message ? html `<p class="message">${this.message}</p>` : nothing}
+      <div class="button-bar">
+        <button class="remove-items-btn" @click=${this.removeItemsBtnClicked}>
+          ${msg('Remove items')}
+        </button>
+      </div>
+    `;
+    }
+    removeItemsBtnClicked() {
+        this.dispatchEvent(new CustomEvent('confirm', {
+            detail: {
+                items: this.items,
+            },
+        }));
+    }
+    static get styles() {
+        return css `
+      ul {
+        margin: 0;
+        padding: 0 10px;
+        font-size: 1.4rem;
+        list-style-type: none;
+        max-height: min(400px, 40vh);
+        overflow-y: auto;
+      }
+
+      li {
+        display: flex;
+        justify-content: space-between;
+        padding: 2px 0;
+      }
+      li:not(:last-of-type) {
+        border-bottom: 1px solid rgb(232, 232, 232);
+      }
+
+      .item-title {
+        word-break: break-word;
+      }
+
+      .item-date {
+        white-space: nowrap;
+      }
+
+      .message {
+        font-size: 1.4rem;
+        padding: 5px 10px;
+      }
+
+      .button-bar {
+        display: flex;
+        justify-content: center;
+        margin: 10px 5px;
+      }
+
+      .remove-items-btn {
+        margin-bottom: 10px;
+        padding: 10px;
+        border: 1px solid var(--primaryErrorCTABorder, #d43f3a);
+        border-radius: 4px;
+        color: white;
+        background: var(--primaryErrorCTAFill, #d9534f);
+        appearance: none;
+        cursor: pointer;
+      }
+      .remove-items-btn:hover {
+        background: rgba(var(--primaryErrorCTAFillRGB, 229, 28, 38), 0.9);
+      }
+      .remove-items-btn:active {
+        background: rgba(var(--primaryErrorCTAFillRGB, 229, 28, 38), 0.7);
+      }
+    `;
+    }
+};
+__decorate([
+    property({ type: Object })
+], RemoveItemsModalContent.prototype, "items", void 0);
+__decorate([
+    property({ type: String })
+], RemoveItemsModalContent.prototype, "message", void 0);
+RemoveItemsModalContent = __decorate([
+    customElement('remove-items-modal-content')
+], RemoveItemsModalContent);
+export { RemoveItemsModalContent };
+//# sourceMappingURL=remove-items-modal-content.js.map

package/dist/src/manage/remove-items-modal-content.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"remove-items-modal-content.js","sourceRoot":"","sources":["../../../src/manage/remove-items-modal-content.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,OAAO,EAA6B,MAAM,KAAK,CAAC;AAChF,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AACpC,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAI5C,IAAa,uBAAuB,GAApC,MAAa,uBAAwB,SAAQ,UAAU;IAAvD;;QAC8B,UAAK,GAAqB,EAAE,CAAC;IA6F3D,CAAC;IAzFC,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,GAAG,CACH,IAAI,CAAC,KAAK,EACV,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,IAAI,CAAA;;yCAEM,KAAK,aAAL,KAAK,cAAL,KAAK,GAAI,YAAY;wCACtB,IAAI,aAAJ,IAAI,cAAJ,IAAI,GAAI,EAAE;;WAEvC,CACF;;QAED,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA,sBAAsB,IAAI,CAAC,OAAO,MAAM,CAAC,CAAC,CAAC,OAAO;;kDAE3B,IAAI,CAAC,qBAAqB;YAChE,GAAG,CAAC,cAAc,CAAC;;;KAG1B,CAAC;IACJ,CAAC;IAEO,qBAAqB;QAC3B,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAA8B,SAAS,EAAE;YACtD,MAAM,EAAE;gBACN,KAAK,EAAE,IAAI,CAAC,KAAK;aAClB;SACF,CAAC,CACH,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAsDT,CAAC;IACJ,CAAC;CACF,CAAA;AA7F6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDAA8B;AAE7B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDAAkB;AAHlC,uBAAuB;IADnC,aAAa,CAAC,4BAA4B,CAAC;GAC/B,uBAAuB,CA8FnC;SA9FY,uBAAuB","sourcesContent":["import { LitElement, html, css, nothing, TemplateResult, CSSResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { msg } from '@lit/localize';\nimport { map } from 'lit/directives/map.js';\nimport type { ManageableItem } from '../models';\n\n@customElement('remove-items-modal-content')\nexport class RemoveItemsModalContent extends LitElement {\n  @property({ type: Object }) items: ManageableItem[] = [];\n\n  @property({ type: String }) message?: string;\n\n  render(): TemplateResult {\n    return html`\n      <ul>\n        ${map(\n          this.items,\n          ({ title, date }) => html`\n            <li>\n              <span class=\"item-title\">${title ?? '[untitled]'}</span>\n              <span class=\"item-date\">${date ?? ''}</span>\n            </li>\n          `\n        )}\n      </ul>\n      ${this.message ? html`<p class=\"message\">${this.message}</p>` : nothing}\n      <div class=\"button-bar\">\n        <button class=\"remove-items-btn\" @click=${this.removeItemsBtnClicked}>\n          ${msg('Remove items')}\n        </button>\n      </div>\n    `;\n  }\n\n  private removeItemsBtnClicked(): void {\n    this.dispatchEvent(\n      new CustomEvent<{ items: ManageableItem[] }>('confirm', {\n        detail: {\n          items: this.items,\n        },\n      })\n    );\n  }\n\n  static get styles(): CSSResult {\n    return css`\n      ul {\n        margin: 0;\n        padding: 0 10px;\n        font-size: 1.4rem;\n        list-style-type: none;\n        max-height: min(400px, 40vh);\n        overflow-y: auto;\n      }\n\n      li {\n        display: flex;\n        justify-content: space-between;\n        padding: 2px 0;\n      }\n      li:not(:last-of-type) {\n        border-bottom: 1px solid rgb(232, 232, 232);\n      }\n\n      .item-title {\n        word-break: break-word;\n      }\n\n      .item-date {\n        white-space: nowrap;\n      }\n\n      .message {\n        font-size: 1.4rem;\n        padding: 5px 10px;\n      }\n\n      .button-bar {\n        display: flex;\n        justify-content: center;\n        margin: 10px 5px;\n      }\n\n      .remove-items-btn {\n        margin-bottom: 10px;\n        padding: 10px;\n        border: 1px solid var(--primaryErrorCTABorder, #d43f3a);\n        border-radius: 4px;\n        color: white;\n        background: var(--primaryErrorCTAFill, #d9534f);\n        appearance: none;\n        cursor: pointer;\n      }\n      .remove-items-btn:hover {\n        background: rgba(var(--primaryErrorCTAFillRGB, 229, 28, 38), 0.9);\n      }\n      .remove-items-btn:active {\n        background: rgba(var(--primaryErrorCTAFillRGB, 229, 28, 38), 0.7);\n      }\n    `;\n  }\n}\n"]}

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

@@ -12,7 +12,6 @@ import { tvIcon } from '../assets/img/icons/mediatype/tv';
 import { videoIcon } from '../assets/img/icons/mediatype/video';
 import { webIcon } from '../assets/img/icons/mediatype/web';
 import { searchIcon } from '../assets/img/icons/mediatype/search';
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
 export const mediatypeConfig = {
     account: {
         color: '#000000',

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

@@ -1 +1 @@
-{"version":3,"file":"mediatype-config.js","sourceRoot":"","sources":["../../../src/mediatype/mediatype-config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AACtE,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAC1D,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,mCAAmC,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAElE,8DAA8D;AAC9D,MAAM,CAAC,MAAM,eAAe,GAA2B;IACrD,OAAO,EAAE;QACP,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,WAAW;QACjB,IAAI,EAAE,SAAS;KAChB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,OAAO;KACd;IACD,UAAU,EAAE;QACV,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,cAAc;QACpB,IAAI,EAAE,YAAY;KACnB;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,MAAM;KACb;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,QAAQ;KACf;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,MAAM;KACb;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,UAAU;QAChB,IAAI,EAAE,OAAO;KACd;IACD,MAAM,EAAE;QACN,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,OAAO;KACd;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,OAAO;KACd;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE,UAAU;KACjB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,MAAM;KACb;IACD,EAAE,EAAE;QACF,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,IAAI;KACX;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,OAAO;KACd;IACD,GAAG,EAAE;QACH,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,KAAK;KACZ;IACD,MAAM,EAAE;QACN,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,UAAU;QAChB,IAAI,EAAE,QAAQ;KACf;CACF,CAAC","sourcesContent":["import { accountIcon } from '../assets/img/icons/mediatype/account';\nimport { audioIcon } from '../assets/img/icons/mediatype/audio';\nimport { collectionIcon } from '../assets/img/icons/mediatype/collection';\nimport { dataIcon } from '../assets/img/icons/mediatype/data';\nimport { etreeIcon } from '../assets/img/icons/mediatype/etree';\nimport { imagesIcon } from '../assets/img/icons/mediatype/images';\nimport { filmIcon } from '../assets/img/icons/mediatype/film';\nimport { radioIcon } from '../assets/img/icons/mediatype/radio';\nimport { softwareIcon } from '../assets/img/icons/mediatype/software';\nimport { textsIcon } from '../assets/img/icons/mediatype/texts';\nimport { tvIcon } from '../assets/img/icons/mediatype/tv';\nimport { videoIcon } from '../assets/img/icons/mediatype/video';\nimport { webIcon } from '../assets/img/icons/mediatype/web';\nimport { searchIcon } from '../assets/img/icons/mediatype/search';\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport const mediatypeConfig: { [key: string]: any } = {\n  account: {\n    color: '#000000',\n    icon: accountIcon,\n    text: 'Account',\n  },\n  audio: {\n    color: '#00adef',\n    icon: audioIcon,\n    text: 'Audio',\n  },\n  collection: {\n    color: '#4666ff',\n    icon: collectionIcon,\n    text: 'Collection',\n  },\n  data: {\n    color: '#333333',\n    icon: dataIcon,\n    text: 'Data',\n  },\n  etree: {\n    color: '#00adef',\n    icon: etreeIcon,\n    text: 'E-tree',\n  },\n  film: {\n    color: '#bf1b2c',\n    icon: filmIcon,\n    text: 'Film',\n  },\n  image: {\n    color: '#aa99c9',\n    icon: imagesIcon,\n    text: 'Image',\n  },\n  movies: {\n    color: '#f1644b',\n    icon: filmIcon,\n    text: 'Movie',\n  },\n  radio: {\n    color: '#8fdaef',\n    icon: radioIcon,\n    text: 'Radio',\n  },\n  software: {\n    color: '#9ecc4f',\n    icon: softwareIcon,\n    text: 'Software',\n  },\n  texts: {\n    color: '#faab3c',\n    icon: textsIcon,\n    text: 'Text',\n  },\n  tv: {\n    color: '#f1644b',\n    icon: tvIcon,\n    text: 'TV',\n  },\n  video: {\n    color: '#f1644b',\n    icon: videoIcon,\n    text: 'Video',\n  },\n  web: {\n    color: '#ffcd27',\n    icon: webIcon,\n    text: 'Web',\n  },\n  search: {\n    color: '#000000',\n    icon: searchIcon,\n    text: 'Search',\n  },\n};\n"]}
+{"version":3,"file":"mediatype-config.js","sourceRoot":"","sources":["../../../src/mediatype/mediatype-config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uCAAuC,CAAC;AACpE,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAC1E,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAClE,OAAO,EAAE,QAAQ,EAAE,MAAM,oCAAoC,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AACtE,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,kCAAkC,CAAC;AAC1D,OAAO,EAAE,SAAS,EAAE,MAAM,qCAAqC,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,mCAAmC,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAElE,MAAM,CAAC,MAAM,eAAe,GAA2B;IACrD,OAAO,EAAE;QACP,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,WAAW;QACjB,IAAI,EAAE,SAAS;KAChB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,OAAO;KACd;IACD,UAAU,EAAE;QACV,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,cAAc;QACpB,IAAI,EAAE,YAAY;KACnB;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,MAAM;KACb;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,QAAQ;KACf;IACD,IAAI,EAAE;QACJ,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,MAAM;KACb;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,UAAU;QAChB,IAAI,EAAE,OAAO;KACd;IACD,MAAM,EAAE;QACN,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,QAAQ;QACd,IAAI,EAAE,OAAO;KACd;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,OAAO;KACd;IACD,QAAQ,EAAE;QACR,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,YAAY;QAClB,IAAI,EAAE,UAAU;KACjB;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,MAAM;KACb;IACD,EAAE,EAAE;QACF,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,MAAM;QACZ,IAAI,EAAE,IAAI;KACX;IACD,KAAK,EAAE;QACL,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,SAAS;QACf,IAAI,EAAE,OAAO;KACd;IACD,GAAG,EAAE;QACH,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,KAAK;KACZ;IACD,MAAM,EAAE;QACN,KAAK,EAAE,SAAS;QAChB,IAAI,EAAE,UAAU;QAChB,IAAI,EAAE,QAAQ;KACf;CACF,CAAC","sourcesContent":["import { accountIcon } from '../assets/img/icons/mediatype/account';\nimport { audioIcon } from '../assets/img/icons/mediatype/audio';\nimport { collectionIcon } from '../assets/img/icons/mediatype/collection';\nimport { dataIcon } from '../assets/img/icons/mediatype/data';\nimport { etreeIcon } from '../assets/img/icons/mediatype/etree';\nimport { imagesIcon } from '../assets/img/icons/mediatype/images';\nimport { filmIcon } from '../assets/img/icons/mediatype/film';\nimport { radioIcon } from '../assets/img/icons/mediatype/radio';\nimport { softwareIcon } from '../assets/img/icons/mediatype/software';\nimport { textsIcon } from '../assets/img/icons/mediatype/texts';\nimport { tvIcon } from '../assets/img/icons/mediatype/tv';\nimport { videoIcon } from '../assets/img/icons/mediatype/video';\nimport { webIcon } from '../assets/img/icons/mediatype/web';\nimport { searchIcon } from '../assets/img/icons/mediatype/search';\n\nexport const mediatypeConfig: { [key: string]: any } = {\n  account: {\n    color: '#000000',\n    icon: accountIcon,\n    text: 'Account',\n  },\n  audio: {\n    color: '#00adef',\n    icon: audioIcon,\n    text: 'Audio',\n  },\n  collection: {\n    color: '#4666ff',\n    icon: collectionIcon,\n    text: 'Collection',\n  },\n  data: {\n    color: '#333333',\n    icon: dataIcon,\n    text: 'Data',\n  },\n  etree: {\n    color: '#00adef',\n    icon: etreeIcon,\n    text: 'E-tree',\n  },\n  film: {\n    color: '#bf1b2c',\n    icon: filmIcon,\n    text: 'Film',\n  },\n  image: {\n    color: '#aa99c9',\n    icon: imagesIcon,\n    text: 'Image',\n  },\n  movies: {\n    color: '#f1644b',\n    icon: filmIcon,\n    text: 'Movie',\n  },\n  radio: {\n    color: '#8fdaef',\n    icon: radioIcon,\n    text: 'Radio',\n  },\n  software: {\n    color: '#9ecc4f',\n    icon: softwareIcon,\n    text: 'Software',\n  },\n  texts: {\n    color: '#faab3c',\n    icon: textsIcon,\n    text: 'Text',\n  },\n  tv: {\n    color: '#f1644b',\n    icon: tvIcon,\n    text: 'TV',\n  },\n  video: {\n    color: '#f1644b',\n    icon: videoIcon,\n    text: 'Video',\n  },\n  web: {\n    color: '#ffcd27',\n    icon: webIcon,\n    text: 'Web',\n  },\n  search: {\n    color: '#000000',\n    icon: searchIcon,\n    text: 'Search',\n  },\n};\n"]}

package/dist/src/models.d.ts

@@ -4,7 +4,7 @@ import { AggregationSortType, Review, SearchResult, SortDirection } from '@inter
 /**
  * Different types of tile overlays, corresponding to the above flags.
  */
-export type TileOverlayType = 'login-required' | 'content-warning';
+export declare type TileOverlayType = 'login-required' | 'content-warning';
 export declare const TILE_OVERLAY_TEXT: Record<TileOverlayType, string>;
 export declare const TILE_OVERLAY_ICONS: Record<TileOverlayType, TemplateResult>;
 /**
@@ -56,15 +56,15 @@ export declare class TileModel {
     private getFlags;
     private static cleanIdentifier;
 }
-export type RequestKind = 'full' | 'hits' | 'aggregations';
-export type CollectionDisplayMode = 'grid' | 'list-compact' | 'list-detail';
-export type TileDisplayMode = 'grid' | 'list-compact' | 'list-detail' | 'list-header';
+export declare type RequestKind = 'full' | 'hits' | 'aggregations';
+export declare type CollectionDisplayMode = 'grid' | 'list-compact' | 'list-detail';
+export declare type TileDisplayMode = 'grid' | 'list-compact' | 'list-detail' | 'list-header';
 /**
  * This is mainly used to set the cookies for the collection display mode.
  *
  * It allows the user to set different modes for different contexts (collection page, search page, profile page etc).
  */
-export type CollectionBrowserContext = 'collection' | 'search' | 'profile';
+export declare type CollectionBrowserContext = 'collection' | 'search' | 'profile';
 /**
  * The sort fields shown in the sort filter bar
  */
@@ -133,9 +133,9 @@ export declare const SORT_OPTIONS: Record<SortField, SortOption>;
 export declare function sortOptionFromAPIString(sortName?: string | null): SortOption;
 export declare const defaultProfileElementSorts: Record<string, Exclude<SortField, SortField.default>>;
 /** A union of the fields that permit prefix filtering (e.g., alphabetical filtering) */
-export type PrefixFilterType = 'title' | 'creator';
+export declare type PrefixFilterType = 'title' | 'creator';
 /** A map from prefixes (e.g., initial letters) to the number of items matching that prefix */
-export type PrefixFilterCounts = Record<string, number>;
+export declare type PrefixFilterCounts = Record<string, number>;
 /**
  * A map from prefix filter types to the corresponding aggregation keys
  * that are needed to fetch the filter counts from the backend.
@@ -153,13 +153,13 @@ export declare const prefixFilterAggregationKeys: Record<PrefixFilterType, strin
  *  - `off`: Facet data will never be loaded, and a message will be displayed in place of facets
  *     indicating that they are unavailable.
  */
-export type FacetLoadStrategy = 'eager' | 'lazy-mobile' | 'opt-in-or-login' | 'opt-in' | 'off';
+export declare type FacetLoadStrategy = 'eager' | 'lazy-mobile' | 'opt-in-or-login' | 'opt-in' | 'off';
 /**
  * Union of the facet types that are available in the sidebar.
  */
-export type FacetOption = 'subject' | 'lending' | 'mediatype' | 'language' | 'creator' | 'collection' | 'year';
-export type SelectedFacetState = 'selected' | 'hidden';
-export type FacetState = SelectedFacetState | 'none';
+export declare type FacetOption = 'subject' | 'lending' | 'mediatype' | 'language' | 'creator' | 'collection' | 'year';
+export declare type SelectedFacetState = 'selected' | 'hidden';
+export declare type FacetState = SelectedFacetState | 'none';
 export interface FacetBucket {
     displayText?: string;
     key: string;
@@ -174,7 +174,7 @@ export interface FacetGroup {
 /**
  * Information about a user interaction event on a facet.
  */
-export type FacetEventDetails = {
+export declare type FacetEventDetails = {
     /**
      * The type of facet that was interacted with (e.g., 'mediatype', 'language', ...).
      */
@@ -189,8 +189,8 @@ export type FacetEventDetails = {
      */
     negative: boolean;
 };
-export type FacetValue = string;
-export type SelectedFacets = Record<FacetOption, Record<FacetValue, FacetBucket>>;
+export declare type FacetValue = string;
+export declare type SelectedFacets = Record<FacetOption, Record<FacetValue, FacetBucket>>;
 export declare const getDefaultSelectedFacets: () => SelectedFacets;
 export declare const facetDisplayOrder: FacetOption[];
 export declare const facetTitles: Record<FacetOption, string>;
@@ -203,7 +203,7 @@ export declare const defaultFacetSort: Record<FacetOption, AggregationSortType>;
  * (i.e., the opposite of "sort by count" for that type).
  */
 export declare const valueFacetSort: Record<FacetOption, AggregationSortType>;
-export type LendingFacetKey = 'is_lendable' | 'is_borrowable' | 'available_to_borrow' | 'is_browsable' | 'available_to_browse' | 'is_readable' | 'available_to_waitlist';
+export declare type LendingFacetKey = 'is_lendable' | 'is_borrowable' | 'available_to_borrow' | 'is_browsable' | 'available_to_browse' | 'is_readable' | 'available_to_waitlist';
 /**
  * Maps valid lending keys to whether they should be visible in the facet sidebar
  */
@@ -217,3 +217,12 @@ export declare const lendingFacetDisplayNames: Partial<Record<LendingFacetKey, s
  * as facets or in an item's list of collections.
  */
 export declare const suppressedCollections: Record<string, boolean>;
+/**
+ * A record of manageable item
+ */
+export interface ManageableItem {
+    identifier: string;
+    title?: string;
+    dateStr?: string;
+    date?: string;
+}

package/dist/src/models.js

@@ -157,7 +157,7 @@ export const SORT_OPTIONS = {
         canSetDirection: false,
         shownInSortBar: false,
         shownInURL: false,
-        handledBySearchService: false, // We rely on the PPS default sort handling in these cases
+        handledBySearchService: false,
         displayName: '',
         urlNames: ['', null, undefined], // Empty or nullish sort params result in default sorting
     },
@@ -171,7 +171,7 @@ export const SORT_OPTIONS = {
         canSetDirection: true,
         shownInSortBar: false,
         shownInURL: false,
-        handledBySearchService: true, // The unrecognized sort param is passed along as-is
+        handledBySearchService: true,
         displayName: '',
         urlNames: [],
     },
@@ -269,7 +269,7 @@ export const SORT_OPTIONS = {
         field: SortField.datefavorited,
         defaultSortDirection: 'desc',
         canSetDirection: false,
-        shownInSortBar: true, // But only when viewing fav-* collections
+        shownInSortBar: true,
         shownInURL: false,
         handledBySearchService: false,
         searchServiceKey: 'favoritedate',