@internetarchive/collection-browser 2.6.4-alpha.2 → 2.6.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/collection-facets/smart-facet-bar.d.ts +8 -0
- package/dist/src/collection-facets/smart-facet-bar.js +27 -0
- package/dist/src/collection-facets/smart-facet-bar.js.map +1 -0
- package/dist/src/tiles/image-block.js +2 -1
- package/dist/src/tiles/image-block.js.map +1 -1
- package/package.json +2 -2
- package/src/collection-facets/smart-facet-bar.ts +35 -0
- package/src/tiles/image-block.ts +2 -1
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { LitElement, TemplateResult, CSSResultGroup } from 'lit';
|
|
2
|
+
import type { CollectionTitles } from '../data-source/models';
|
|
3
|
+
export declare class SmartFacetBar extends LitElement {
|
|
4
|
+
/** The collection name cache for converting collection identifiers to titles */
|
|
5
|
+
collectionTitles?: CollectionTitles;
|
|
6
|
+
render(): TemplateResult<1>;
|
|
7
|
+
static get styles(): CSSResultGroup;
|
|
8
|
+
}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { __decorate } from "tslib";
|
|
2
|
+
import { css, html, LitElement, } from 'lit';
|
|
3
|
+
import { customElement, property } from 'lit/decorators.js';
|
|
4
|
+
let SmartFacetBar = class SmartFacetBar extends LitElement {
|
|
5
|
+
//
|
|
6
|
+
// COMPONENT LIFECYCLE METHODS
|
|
7
|
+
//
|
|
8
|
+
render() {
|
|
9
|
+
return html ``;
|
|
10
|
+
}
|
|
11
|
+
//
|
|
12
|
+
// STYLES
|
|
13
|
+
//
|
|
14
|
+
static get styles() {
|
|
15
|
+
return css `
|
|
16
|
+
|
|
17
|
+
`;
|
|
18
|
+
}
|
|
19
|
+
};
|
|
20
|
+
__decorate([
|
|
21
|
+
property({ type: Object })
|
|
22
|
+
], SmartFacetBar.prototype, "collectionTitles", void 0);
|
|
23
|
+
SmartFacetBar = __decorate([
|
|
24
|
+
customElement('smart-facet-bar')
|
|
25
|
+
], SmartFacetBar);
|
|
26
|
+
export { SmartFacetBar };
|
|
27
|
+
//# sourceMappingURL=smart-facet-bar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"smart-facet-bar.js","sourceRoot":"","sources":["../../../src/collection-facets/smart-facet-bar.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,GAAG,EACH,IAAI,EACJ,UAAU,GAIX,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAI5D,IAAa,aAAa,GAA1B,MAAa,aAAc,SAAQ,UAAU;IAK3C,EAAE;IACF,8BAA8B;IAC9B,EAAE;IAEF,MAAM;QACJ,OAAO,IAAI,CAAA,EAAE,CAAC;IAChB,CAAC;IAED,EAAE;IACF,SAAS;IACT,EAAE;IAEF,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;KAET,CAAC;IACJ,CAAC;CACF,CAAA;AAnBC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDACS;AAHzB,aAAa;IADzB,aAAa,CAAC,iBAAiB,CAAC;GACpB,aAAa,CAsBzB;SAtBY,aAAa","sourcesContent":["import {\n css,\n html,\n LitElement,\n TemplateResult,\n CSSResultGroup,\n nothing,\n} from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport type { CollectionTitles } from '../data-source/models';\n\n@customElement('smart-facet-bar')\nexport class SmartFacetBar extends LitElement {\n /** The collection name cache for converting collection identifiers to titles */\n @property({ type: Object })\n collectionTitles?: CollectionTitles;\n\n //\n // COMPONENT LIFECYCLE METHODS\n //\n\n render() {\n return html``;\n }\n\n //\n // STYLES\n //\n\n static get styles(): CSSResultGroup {\n return css`\n \n `;\n }\n}\n"]}
|
|
@@ -34,6 +34,7 @@ let ImageBlock = class ImageBlock extends LitElement {
|
|
|
34
34
|
get baseClass() {
|
|
35
35
|
var _a, _b;
|
|
36
36
|
return {
|
|
37
|
+
container: true,
|
|
37
38
|
list: this.isListTile && !this.isCompactTile,
|
|
38
39
|
'list-compact': this.isListTile && this.isCompactTile,
|
|
39
40
|
collection: ((_a = this.model) === null || _a === void 0 ? void 0 : _a.mediatype) === 'collection',
|
|
@@ -125,7 +126,7 @@ let ImageBlock = class ImageBlock extends LitElement {
|
|
|
125
126
|
}
|
|
126
127
|
|
|
127
128
|
/** tile-list-compact view */
|
|
128
|
-
.list-compact {
|
|
129
|
+
.container.list-compact {
|
|
129
130
|
display: block;
|
|
130
131
|
text-align: center;
|
|
131
132
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"image-block.js","sourceRoot":"","sources":["../../../src/tiles/image-block.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAa,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAIlE,OAAO,wBAAwB,CAAC;AAChC,OAAO,wBAAwB,CAAC;AAGhC,IAAa,UAAU,GAAvB,MAAa,UAAW,SAAQ,UAAU;IAA1C;;QAG+B,kBAAa,GAAG,KAAK,CAAC;QAEtB,eAAU,GAAG,KAAK,CAAC;QAEnB,aAAQ,GAAG,KAAK,CAAC;QAIlB,aAAQ,GAAW,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"image-block.js","sourceRoot":"","sources":["../../../src/tiles/image-block.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, CSSResultGroup, html, LitElement, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\n\nimport type { TileModel, TileOverlayType } from '../models';\n\nimport './overlay/icon-overlay';\nimport './overlay/text-overlay';\n\n@customElement('image-block')\nexport class ImageBlock extends LitElement {\n @property({ type: String }) baseImageUrl?: string;\n\n @property({ type: Boolean }) isCompactTile = false;\n\n @property({ type: Boolean }) isListTile = false;\n\n @property({ type: Boolean }) loggedIn = false;\n\n @property({ type: Object }) model?: TileModel;\n\n @property({ type: String }) viewSize: string = 'desktop';\n\n render() {\n if (!this.model?.identifier) return nothing;\n\n return html`\n <div class=${classMap(this.baseClass)}>\n <item-image\n .model=${this.model}\n .baseImageUrl=${this.baseImageUrl}\n .isListTile=${this.isListTile}\n .isCompactTile=${this.isCompactTile}\n .loggedIn=${this.loggedIn}\n style=\"--imgHeight: 100%; --imgWidth: 100%\"\n >\n </item-image>\n ${this.textOverlayTemplate} ${this.iconOverlayTemplate}\n </div>\n `;\n }\n\n private get baseClass(): ClassInfo {\n return {\n container: true,\n list: this.isListTile && !this.isCompactTile,\n 'list-compact': this.isListTile && this.isCompactTile,\n collection: this.model?.mediatype === 'collection', // fill the image in container\n [this.viewSize]: true,\n 'search-image': this.model?.mediatype === 'search',\n };\n }\n\n private get iconOverlayTemplate() {\n // Only list tiles use the icon overlay\n if (!this.isListTile) return nothing;\n\n const { overlayType } = this;\n if (!overlayType) return nothing;\n\n return html`\n <icon-overlay\n class=${this.isCompactTile ? 'list-compact' : 'list-detail'}\n .type=${this.overlayType}\n >\n </icon-overlay>\n `;\n }\n\n private get textOverlayTemplate() {\n // List tiles do not require the text overlay\n if (this.isListTile) return nothing;\n\n const { overlayType } = this;\n if (!overlayType) return nothing;\n\n return html` <text-overlay .type=${this.overlayType}></text-overlay> `;\n }\n\n private get overlayType(): TileOverlayType | undefined {\n // Prioritize showing the login-required overlay if needed.\n // Otherwise, if a content warning is required, show that overlay instead.\n // If neither flag is present, no overlay should be shown.\n if (this.model?.loginRequired && !this.loggedIn) {\n return 'login-required';\n }\n if (this.model?.contentWarning) {\n return 'content-warning';\n }\n return undefined;\n }\n\n static get styles(): CSSResultGroup {\n const imageBlockBackgroundColor = css`var(--imageBlockBackgroundColor, #f1f1f4)`;\n\n return css`\n div {\n display: flex;\n justify-content: center;\n position: relative;\n background-color: ${imageBlockBackgroundColor};\n border-radius: 4px;\n }\n\n .grid {\n height: var(--imgBlockHeight, 16rem);\n flex: 1;\n position: initial;\n padding: 5px;\n border-radius: 4px 4px 0 0;\n }\n\n .collection.grid,\n .grid.search-image {\n display: block;\n }\n\n /** tile-list view */\n .list {\n border-radius: 0;\n background-color: var(--imageBlockListBackgroundColor, #ebebee);\n box-shadow: 1px 1px 2px rgb(0, 0, 0, 0.2);\n }\n\n .list.desktop {\n width: 100px;\n max-width: 100%;\n height: 100px;\n max-width: 100%;\n display: inline-block;\n position: relative;\n text-align: center;\n }\n\n .list.mobile {\n width: var(--image-width, 90px);\n height: 90px;\n }\n\n /** tile-list-compact view */\n .container.list-compact {\n display: block;\n text-align: center;\n }\n\n .list-compact.desktop {\n width: 45px;\n height: 45px;\n }\n\n .list-compact.mobile {\n width: 30px;\n height: 30px;\n }\n `;\n }\n}\n"]}
|
package/package.json
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
"description": "The Internet Archive Collection Browser.",
|
|
4
4
|
"license": "AGPL-3.0-only",
|
|
5
5
|
"author": "Internet Archive",
|
|
6
|
-
"version": "2.6.
|
|
6
|
+
"version": "2.6.5",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"module": "dist/index.js",
|
|
9
9
|
"scripts": {
|
|
@@ -58,7 +58,7 @@
|
|
|
58
58
|
"eslint-plugin-wc": "^1.3.2",
|
|
59
59
|
"gh-pages": "^4.0.0",
|
|
60
60
|
"husky": "^7.0.0",
|
|
61
|
-
"madge": "^
|
|
61
|
+
"madge": "^7.0.0",
|
|
62
62
|
"prettier": "^2.4.1",
|
|
63
63
|
"rimraf": "^3.0.2",
|
|
64
64
|
"sinon": "^12.0.1",
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import {
|
|
2
|
+
css,
|
|
3
|
+
html,
|
|
4
|
+
LitElement,
|
|
5
|
+
TemplateResult,
|
|
6
|
+
CSSResultGroup,
|
|
7
|
+
nothing,
|
|
8
|
+
} from 'lit';
|
|
9
|
+
import { customElement, property } from 'lit/decorators.js';
|
|
10
|
+
import type { CollectionTitles } from '../data-source/models';
|
|
11
|
+
|
|
12
|
+
@customElement('smart-facet-bar')
|
|
13
|
+
export class SmartFacetBar extends LitElement {
|
|
14
|
+
/** The collection name cache for converting collection identifiers to titles */
|
|
15
|
+
@property({ type: Object })
|
|
16
|
+
collectionTitles?: CollectionTitles;
|
|
17
|
+
|
|
18
|
+
//
|
|
19
|
+
// COMPONENT LIFECYCLE METHODS
|
|
20
|
+
//
|
|
21
|
+
|
|
22
|
+
render() {
|
|
23
|
+
return html``;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
//
|
|
27
|
+
// STYLES
|
|
28
|
+
//
|
|
29
|
+
|
|
30
|
+
static get styles(): CSSResultGroup {
|
|
31
|
+
return css`
|
|
32
|
+
|
|
33
|
+
`;
|
|
34
|
+
}
|
|
35
|
+
}
|
package/src/tiles/image-block.ts
CHANGED
|
@@ -42,6 +42,7 @@ export class ImageBlock extends LitElement {
|
|
|
42
42
|
|
|
43
43
|
private get baseClass(): ClassInfo {
|
|
44
44
|
return {
|
|
45
|
+
container: true,
|
|
45
46
|
list: this.isListTile && !this.isCompactTile,
|
|
46
47
|
'list-compact': this.isListTile && this.isCompactTile,
|
|
47
48
|
collection: this.model?.mediatype === 'collection', // fill the image in container
|
|
@@ -137,7 +138,7 @@ export class ImageBlock extends LitElement {
|
|
|
137
138
|
}
|
|
138
139
|
|
|
139
140
|
/** tile-list-compact view */
|
|
140
|
-
.list-compact {
|
|
141
|
+
.container.list-compact {
|
|
141
142
|
display: block;
|
|
142
143
|
text-align: center;
|
|
143
144
|
}
|