@internetarchive/collection-browser 0.2.12 → 0.2.14

package/dist/src/empty-placeholder.js

@@ -0,0 +1,83 @@
+import { __decorate } from "tslib";
+import { css, html, LitElement, nothing } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import { choose } from 'lit/directives/choose.js';
+import emptyQueryIcon from './assets/img/icons/empty-query';
+import nullResultIcon from './assets/img/icons/null-result';
+let EmptyPlaceholder = class EmptyPlaceholder extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.placeholderType = null;
+    }
+    render() {
+        return this.placeholderType ? html `${this.placeholderTemplate}` : nothing;
+    }
+    get placeholderTemplate() {
+        return html `
+      <div
+        class="placeholder ${this.placeholderType} ${this.isMobileView
+            ? 'mobile'
+            : 'desktop'}"
+      >
+        ${choose(this.placeholderType, [
+            ['empty-query', () => this.emptyQueryTemplate],
+            ['null-result', () => this.nullResultTemplate],
+        ])}
+      </div>
+    `;
+    }
+    get emptyQueryTemplate() {
+        return html `
+      <h2 class="title">
+        To begin searching, enter a search term in the box above and hit "Go".
+      </h2>
+      <div>${emptyQueryIcon}</div>
+    `;
+    }
+    get nullResultTemplate() {
+        return html `
+      <h2 class="title">
+        Your search did not match any items in the Archive. Try different
+        keywords or a more general search.
+      </h2>
+      <div>${nullResultIcon}</div>
+    `;
+    }
+    static get styles() {
+        return css `
+      :host {
+        text-align: center;
+        width: 100%;
+      }
+
+      .placeholder {
+        display: block;
+      }
+
+      .desktop svg {
+        max-height: 40rem;
+      }
+      .desktop .title {
+        margin: 4rem 0;
+      }
+
+      .mobile svg {
+        max-height: 20rem;
+      }
+      .mobile .title {
+        margin: 2rem 0.5;
+      }
+    `;
+    }
+};
+__decorate([
+    property({ type: String })
+], EmptyPlaceholder.prototype, "placeholderType", void 0);
+__decorate([
+    property({ type: Boolean })
+], EmptyPlaceholder.prototype, "isMobileView", void 0);
+EmptyPlaceholder = __decorate([
+    customElement('empty-placeholder')
+], EmptyPlaceholder);
+export { EmptyPlaceholder };
+//# sourceMappingURL=empty-placeholder.js.map

package/dist/src/empty-placeholder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty-placeholder.js","sourceRoot":"","sources":["../../src/empty-placeholder.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,OAAO,EAAE,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,0BAA0B,CAAC;AAElD,OAAO,cAAc,MAAM,gCAAgC,CAAC;AAC5D,OAAO,cAAc,MAAM,gCAAgC,CAAC;AAI5D,IAAa,gBAAgB,GAA7B,MAAa,gBAAiB,SAAQ,UAAU;IAAhD;;QAC8B,oBAAe,GAAoB,IAAI,CAAC;IAoEtE,CAAC;IAhEC,MAAM;QACJ,OAAO,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,IAAI,CAAA,GAAG,IAAI,CAAC,mBAAmB,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;IAC5E,CAAC;IAED,IAAY,mBAAmB;QAC7B,OAAO,IAAI,CAAA;;6BAEc,IAAI,CAAC,eAAe,IAAI,IAAI,CAAC,YAAY;YAC5D,CAAC,CAAC,QAAQ;YACV,CAAC,CAAC,SAAS;;UAEX,MAAM,CAAC,IAAI,CAAC,eAAe,EAAE;YAC7B,CAAC,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC;YAC9C,CAAC,aAAa,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,kBAAkB,CAAC;SAC/C,CAAC;;KAEL,CAAC;IACJ,CAAC;IAED,IAAY,kBAAkB;QAC5B,OAAO,IAAI,CAAA;;;;aAIF,cAAc;KACtB,CAAC;IACJ,CAAC;IAED,IAAY,kBAAkB;QAC5B,OAAO,IAAI,CAAA;;;;;aAKF,cAAc;KACtB,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;KAuBT,CAAC;IACJ,CAAC;CACF,CAAA;AApE6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yDAAyC;AAEvC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;sDAAsB;AAHvC,gBAAgB;IAD5B,aAAa,CAAC,mBAAmB,CAAC;GACtB,gBAAgB,CAqE5B;SArEY,gBAAgB","sourcesContent":["import { css, html, LitElement, CSSResultGroup, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { choose } from 'lit/directives/choose.js';\n\nimport emptyQueryIcon from './assets/img/icons/empty-query';\nimport nullResultIcon from './assets/img/icons/null-result';\n\nexport type PlaceholderType = 'empty-query' | 'null-result' | null;\n@customElement('empty-placeholder')\nexport class EmptyPlaceholder extends LitElement {\n  @property({ type: String }) placeholderType: PlaceholderType = null;\n\n  @property({ type: Boolean }) isMobileView?: false;\n\n  render() {\n    return this.placeholderType ? html`${this.placeholderTemplate}` : nothing;\n  }\n\n  private get placeholderTemplate() {\n    return html`\n      <div\n        class=\"placeholder ${this.placeholderType} ${this.isMobileView\n          ? 'mobile'\n          : 'desktop'}\"\n      >\n        ${choose(this.placeholderType, [\n          ['empty-query', () => this.emptyQueryTemplate],\n          ['null-result', () => this.nullResultTemplate],\n        ])}\n      </div>\n    `;\n  }\n\n  private get emptyQueryTemplate() {\n    return html`\n      <h2 class=\"title\">\n        To begin searching, enter a search term in the box above and hit \"Go\".\n      </h2>\n      <div>${emptyQueryIcon}</div>\n    `;\n  }\n\n  private get nullResultTemplate() {\n    return html`\n      <h2 class=\"title\">\n        Your search did not match any items in the Archive. Try different\n        keywords or a more general search.\n      </h2>\n      <div>${nullResultIcon}</div>\n    `;\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      :host {\n        text-align: center;\n        width: 100%;\n      }\n\n      .placeholder {\n        display: block;\n      }\n\n      .desktop svg {\n        max-height: 40rem;\n      }\n      .desktop .title {\n        margin: 4rem 0;\n      }\n\n      .mobile svg {\n        max-height: 20rem;\n      }\n      .mobile .title {\n        margin: 2rem 0.5;\n      }\n    `;\n  }\n}\n"]}

package/dist/src/language-code-handler/language-code-handler.d.ts

@@ -0,0 +1,37 @@
+export interface LanguageCodeHandlerInterface {
+    /**
+     * This takes a list of codes in the format `en-us|en|en-gb` and
+     * returns the first language code in the list.
+     *
+     * The codes in the string should always represent the same language name.
+     * eg `en-us`, `en-gb`, and `en` should always be "English"
+     *
+     * @param languageCodes
+     */
+    getLanguageNameFromCodeString(languageCodes: string): string;
+    /**
+     * This creates a serialized string of language codes for the given language.
+     *
+     * eg. `English` becomes `en-us|en|en-gb|.....`
+     *
+     * @param languageName
+     */
+    getCodeStringFromLanguageName(languageName: string): string;
+    /**
+     * Get an array of langauge codes from a serialized string.
+     *
+     * eg. `en-us|en|en-gb` becomes `['en-us', 'en', 'en-gb']`
+     *
+     * @param languageCodes
+     */
+    getCodeArrayFromCodeString(languageCodes: string): string[];
+}
+export declare class LanguageCodeHandler implements LanguageCodeHandlerInterface {
+    private delimeter;
+    /** @inheritdoc */
+    getLanguageNameFromCodeString(languageCodes: string): string;
+    /** @inheritdoc */
+    getCodeStringFromLanguageName(languageName: string): string;
+    /** @inheritdoc */
+    getCodeArrayFromCodeString(languageCodes: string): string[];
+}

package/dist/src/language-code-handler/language-code-handler.js

@@ -0,0 +1,27 @@
+import { codeToLanguageMap } from './language-code-mapping';
+export class LanguageCodeHandler {
+    constructor() {
+        this.delimeter = '|';
+    }
+    /** @inheritdoc */
+    getLanguageNameFromCodeString(languageCodes) {
+        const split = this.getCodeArrayFromCodeString(languageCodes);
+        if (split.length === 0)
+            return '';
+        const languageCode = split[0];
+        const languageName = codeToLanguageMap[languageCode];
+        return languageName !== null && languageName !== void 0 ? languageName : languageCodes;
+    }
+    /** @inheritdoc */
+    getCodeStringFromLanguageName(languageName) {
+        const languageCodes = Object.keys(codeToLanguageMap).filter(code => codeToLanguageMap[code] === languageName);
+        const stringifiedCodes = languageCodes === null || languageCodes === void 0 ? void 0 : languageCodes.join(this.delimeter);
+        return stringifiedCodes;
+    }
+    /** @inheritdoc */
+    getCodeArrayFromCodeString(languageCodes) {
+        const split = languageCodes.split(this.delimeter);
+        return split;
+    }
+}
+//# sourceMappingURL=language-code-handler.js.map

package/dist/src/language-code-handler/language-code-handler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"language-code-handler.js","sourceRoot":"","sources":["../../../src/language-code-handler/language-code-handler.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAqC5D,MAAM,OAAO,mBAAmB;IAAhC;QACU,cAAS,GAAG,GAAG,CAAC;IAyB1B,CAAC;IAvBC,kBAAkB;IAClB,6BAA6B,CAAC,aAAqB;QACjD,MAAM,KAAK,GAAG,IAAI,CAAC,0BAA0B,CAAC,aAAa,CAAC,CAAC;QAC7D,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO,EAAE,CAAC;QAClC,MAAM,YAAY,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC;QAC9B,MAAM,YAAY,GAAG,iBAAiB,CAAC,YAAY,CAAC,CAAC;QACrD,OAAO,YAAY,aAAZ,YAAY,cAAZ,YAAY,GAAI,aAAa,CAAC;IACvC,CAAC;IAED,kBAAkB;IAClB,6BAA6B,CAAC,YAAoB;QAChD,MAAM,aAAa,GAAG,MAAM,CAAC,IAAI,CAAC,iBAAiB,CAAC,CAAC,MAAM,CACzD,IAAI,CAAC,EAAE,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,YAAY,CACjD,CAAC;QACF,MAAM,gBAAgB,GAAG,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC7D,OAAO,gBAAgB,CAAC;IAC1B,CAAC;IAED,kBAAkB;IAClB,0BAA0B,CAAC,aAAqB;QAC9C,MAAM,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAClD,OAAO,KAAK,CAAC;IACf,CAAC;CACF","sourcesContent":["import { codeToLanguageMap } from './language-code-mapping';\n\n// To serialize the list of potential language codes, we store\n// the string in the format `en-us|en|en-gb` with `|` being the separator.\n// This allows us to generate a query of `language:(en-us OR en OR en-gb)`\n// when we deserialize the string.\nexport interface LanguageCodeHandlerInterface {\n  /**\n   * This takes a list of codes in the format `en-us|en|en-gb` and\n   * returns the first language code in the list.\n   *\n   * The codes in the string should always represent the same language name.\n   * eg `en-us`, `en-gb`, and `en` should always be \"English\"\n   *\n   * @param languageCodes\n   */\n  getLanguageNameFromCodeString(languageCodes: string): string;\n\n  /**\n   * This creates a serialized string of language codes for the given language.\n   *\n   * eg. `English` becomes `en-us|en|en-gb|.....`\n   *\n   * @param languageName\n   */\n  getCodeStringFromLanguageName(languageName: string): string;\n\n  /**\n   * Get an array of langauge codes from a serialized string.\n   *\n   * eg. `en-us|en|en-gb` becomes `['en-us', 'en', 'en-gb']`\n   *\n   * @param languageCodes\n   */\n  getCodeArrayFromCodeString(languageCodes: string): string[];\n}\n\nexport class LanguageCodeHandler implements LanguageCodeHandlerInterface {\n  private delimeter = '|';\n\n  /** @inheritdoc */\n  getLanguageNameFromCodeString(languageCodes: string): string {\n    const split = this.getCodeArrayFromCodeString(languageCodes);\n    if (split.length === 0) return '';\n    const languageCode = split[0];\n    const languageName = codeToLanguageMap[languageCode];\n    return languageName ?? languageCodes;\n  }\n\n  /** @inheritdoc */\n  getCodeStringFromLanguageName(languageName: string): string {\n    const languageCodes = Object.keys(codeToLanguageMap).filter(\n      code => codeToLanguageMap[code] === languageName\n    );\n    const stringifiedCodes = languageCodes?.join(this.delimeter);\n    return stringifiedCodes;\n  }\n\n  /** @inheritdoc */\n  getCodeArrayFromCodeString(languageCodes: string): string[] {\n    const split = languageCodes.split(this.delimeter);\n    return split;\n  }\n}\n"]}

package/dist/src/language-code-handler/language-code-mapping.d.ts

@@ -0,0 +1 @@
+export declare const codeToLanguageMap: Record<string, string>;