npm - @internetarchive/collection-browser - Versions diffs - 3.4.1-alpha-webdev7761.4 → 3.4.1 - Mend

@internetarchive/collection-browser 3.4.1-alpha-webdev7761.4 → 3.4.1

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.

Files changed (216) hide show

package/.editorconfig +29 -29
package/.github/workflows/ci.yml +27 -27
package/.github/workflows/gh-pages-main.yml +39 -39
package/.github/workflows/npm-publish.yml +39 -39
package/.github/workflows/pr-preview.yml +38 -38
package/.husky/pre-commit +4 -4
package/.prettierignore +1 -1
package/LICENSE +661 -661
package/README.md +83 -83
package/dist/src/app-root.js +28 -19
package/dist/src/app-root.js.map +1 -1
package/dist/src/collection-browser.d.ts +4 -24
package/dist/src/collection-browser.js +125 -286
package/dist/src/collection-browser.js.map +1 -1
package/dist/src/collection-facets/facet-row.js +143 -143
package/dist/src/collection-facets/facet-row.js.map +1 -1
package/dist/src/collection-facets/more-facets-content.d.ts +1 -1
package/dist/src/collection-facets/more-facets-content.js +48 -34
package/dist/src/collection-facets/more-facets-content.js.map +1 -1
package/dist/src/collection-facets/more-facets-pagination.js +10 -6
package/dist/src/collection-facets/more-facets-pagination.js.map +1 -1
package/dist/src/collection-facets/smart-facets/heuristics/wikidata/wikidata-heuristic.js +21 -16
package/dist/src/collection-facets/smart-facets/heuristics/wikidata/wikidata-heuristic.js.map +1 -1
package/dist/src/collection-facets/smart-facets/smart-facet-bar.js +10 -7
package/dist/src/collection-facets/smart-facets/smart-facet-bar.js.map +1 -1
package/dist/src/collection-facets/smart-facets/smart-facet-button.js +2 -3
package/dist/src/collection-facets/smart-facets/smart-facet-button.js.map +1 -1
package/dist/src/collection-facets/smart-facets/smart-facet-dropdown.js +11 -9
package/dist/src/collection-facets/smart-facets/smart-facet-dropdown.js.map +1 -1
package/dist/src/collection-facets/smart-facets/smart-facet-heuristics.js +7 -7
package/dist/src/collection-facets/smart-facets/smart-facet-heuristics.js.map +1 -1
package/dist/src/collection-facets/toggle-switch.js +6 -4
package/dist/src/collection-facets/toggle-switch.js.map +1 -1
package/dist/src/collection-facets.js +310 -309
package/dist/src/collection-facets.js.map +1 -1
package/dist/src/data-source/collection-browser-data-source-interface.d.ts +1 -10
package/dist/src/data-source/collection-browser-data-source-interface.js.map +1 -1
package/dist/src/data-source/collection-browser-data-source.d.ts +1 -19
package/dist/src/data-source/collection-browser-data-source.js +65 -71
package/dist/src/data-source/collection-browser-data-source.js.map +1 -1
package/dist/src/data-source/collection-browser-query-state.d.ts +2 -1
package/dist/src/data-source/collection-browser-query-state.js.map +1 -1
package/dist/src/data-source/models.d.ts +0 -11
package/dist/src/data-source/models.js.map +1 -1
package/dist/src/empty-placeholder.js +18 -19
package/dist/src/empty-placeholder.js.map +1 -1
package/dist/src/expanded-date-picker.js +10 -6
package/dist/src/expanded-date-picker.js.map +1 -1
package/dist/src/language-code-handler/language-code-handler.js +2 -2
package/dist/src/language-code-handler/language-code-handler.js.map +1 -1
package/dist/src/manage/manage-bar.js +15 -9
package/dist/src/manage/manage-bar.js.map +1 -1
package/dist/src/manage/remove-items-modal-content.js +2 -2
package/dist/src/manage/remove-items-modal-content.js.map +1 -1
package/dist/src/models.d.ts +6 -2
package/dist/src/models.js +54 -46
package/dist/src/models.js.map +1 -1
package/dist/src/restoration-state-handler.d.ts +2 -1
package/dist/src/restoration-state-handler.js +19 -12
package/dist/src/restoration-state-handler.js.map +1 -1
package/dist/src/sort-filter-bar/alpha-bar.js +14 -9
package/dist/src/sort-filter-bar/alpha-bar.js.map +1 -1
package/dist/src/sort-filter-bar/sort-filter-bar.js +24 -14
package/dist/src/sort-filter-bar/sort-filter-bar.js.map +1 -1
package/dist/src/tiles/base-tile-component.js +2 -1
package/dist/src/tiles/base-tile-component.js.map +1 -1
package/dist/src/tiles/grid/account-tile.js +7 -5
package/dist/src/tiles/grid/account-tile.js.map +1 -1
package/dist/src/tiles/grid/collection-tile.js +6 -3
package/dist/src/tiles/grid/collection-tile.js.map +1 -1
package/dist/src/tiles/grid/item-tile.js +33 -23
package/dist/src/tiles/grid/item-tile.js.map +1 -1
package/dist/src/tiles/grid/search-tile.js +2 -1
package/dist/src/tiles/grid/search-tile.js.map +1 -1
package/dist/src/tiles/grid/tile-stats.js +3 -2
package/dist/src/tiles/grid/tile-stats.js.map +1 -1
package/dist/src/tiles/hover/hover-pane-controller.js +28 -21
package/dist/src/tiles/hover/hover-pane-controller.js.map +1 -1
package/dist/src/tiles/hover/tile-hover-pane.js +4 -3
package/dist/src/tiles/hover/tile-hover-pane.js.map +1 -1
package/dist/src/tiles/image-block.js +8 -5
package/dist/src/tiles/image-block.js.map +1 -1
package/dist/src/tiles/item-image.js +19 -12
package/dist/src/tiles/item-image.js.map +1 -1
package/dist/src/tiles/list/tile-list-compact.js +25 -17
package/dist/src/tiles/list/tile-list-compact.js.map +1 -1
package/dist/src/tiles/list/tile-list.js +55 -34
package/dist/src/tiles/list/tile-list.js.map +1 -1
package/dist/src/tiles/overlay/icon-overlay.js +2 -1
package/dist/src/tiles/overlay/icon-overlay.js.map +1 -1
package/dist/src/tiles/overlay/text-overlay.js +4 -2
package/dist/src/tiles/overlay/text-overlay.js.map +1 -1
package/dist/src/tiles/text-snippet-block.js +4 -2
package/dist/src/tiles/text-snippet-block.js.map +1 -1
package/dist/src/tiles/tile-dispatcher.js +30 -22
package/dist/src/tiles/tile-dispatcher.js.map +1 -1
package/dist/src/tiles/tile-display-value-provider.js +9 -5
package/dist/src/tiles/tile-display-value-provider.js.map +1 -1
package/dist/src/tiles/tile-mediatype-icon.js +19 -12
package/dist/src/tiles/tile-mediatype-icon.js.map +1 -1
package/dist/src/utils/collapse-repeated-quotes.js +1 -1
package/dist/src/utils/collapse-repeated-quotes.js.map +1 -1
package/dist/src/utils/facet-utils.js +5 -3
package/dist/src/utils/facet-utils.js.map +1 -1
package/dist/src/utils/format-count.js +10 -10
package/dist/src/utils/format-count.js.map +1 -1
package/dist/src/utils/resolve-mediatype.js +3 -2
package/dist/src/utils/resolve-mediatype.js.map +1 -1
package/dist/test/collection-browser.test.js +380 -336
package/dist/test/collection-browser.test.js.map +1 -1
package/dist/test/collection-facets/facet-row.test.js +52 -37
package/dist/test/collection-facets/facet-row.test.js.map +1 -1
package/dist/test/collection-facets/facets-template.test.js +23 -17
package/dist/test/collection-facets/facets-template.test.js.map +1 -1
package/dist/test/collection-facets/more-facets-content.test.js +32 -22
package/dist/test/collection-facets/more-facets-content.test.js.map +1 -1
package/dist/test/collection-facets/more-facets-pagination.test.js +22 -16
package/dist/test/collection-facets/more-facets-pagination.test.js.map +1 -1
package/dist/test/collection-facets/toggle-switch.test.js +19 -22
package/dist/test/collection-facets/toggle-switch.test.js.map +1 -1
package/dist/test/collection-facets.test.js +77 -60
package/dist/test/collection-facets.test.js.map +1 -1
package/dist/test/empty-placeholder.test.js +17 -11
package/dist/test/empty-placeholder.test.js.map +1 -1
package/dist/test/expanded-date-picker.test.js +14 -8
package/dist/test/expanded-date-picker.test.js.map +1 -1
package/dist/test/icon-overlay.test.js +6 -7
package/dist/test/icon-overlay.test.js.map +1 -1
package/dist/test/image-block.test.js +26 -16
package/dist/test/image-block.test.js.map +1 -1
package/dist/test/item-image.test.js +32 -23
package/dist/test/item-image.test.js.map +1 -1
package/dist/test/manage/manage-bar.test.js +33 -21
package/dist/test/manage/manage-bar.test.js.map +1 -1
package/dist/test/manage/remove-items-modal-content.test.js +15 -10
package/dist/test/manage/remove-items-modal-content.test.js.map +1 -1
package/dist/test/mocks/mock-search-service.js +3 -2
package/dist/test/mocks/mock-search-service.js.map +1 -1
package/dist/test/restoration-state-handler.test.js +54 -14
package/dist/test/restoration-state-handler.test.js.map +1 -1
package/dist/test/review-block.test.js +18 -16
package/dist/test/review-block.test.js.map +1 -1
package/dist/test/sort-filter-bar/alpha-bar-tooltip.test.js +3 -2
package/dist/test/sort-filter-bar/alpha-bar-tooltip.test.js.map +1 -1
package/dist/test/sort-filter-bar/alpha-bar.test.js +24 -18
package/dist/test/sort-filter-bar/alpha-bar.test.js.map +1 -1
package/dist/test/sort-filter-bar/sort-filter-bar.test.js +180 -178
package/dist/test/sort-filter-bar/sort-filter-bar.test.js.map +1 -1
package/dist/test/text-overlay.test.js +15 -16
package/dist/test/text-overlay.test.js.map +1 -1
package/dist/test/text-snippet-block.test.js +19 -14
package/dist/test/text-snippet-block.test.js.map +1 -1
package/dist/test/tile-stats.test.js +34 -73
package/dist/test/tile-stats.test.js.map +1 -1
package/dist/test/tiles/grid/account-tile.test.js +25 -25
package/dist/test/tiles/grid/account-tile.test.js.map +1 -1
package/dist/test/tiles/grid/collection-tile.test.js +19 -13
package/dist/test/tiles/grid/collection-tile.test.js.map +1 -1
package/dist/test/tiles/grid/item-tile.test.js +91 -64
package/dist/test/tiles/grid/item-tile.test.js.map +1 -1
package/dist/test/tiles/grid/search-tile.test.js +13 -9
package/dist/test/tiles/grid/search-tile.test.js.map +1 -1
package/dist/test/tiles/hover/hover-pane-controller.test.js +35 -23
package/dist/test/tiles/hover/hover-pane-controller.test.js.map +1 -1
package/dist/test/tiles/hover/tile-hover-pane.test.js +16 -12
package/dist/test/tiles/hover/tile-hover-pane.test.js.map +1 -1
package/dist/test/tiles/list/tile-list-compact.test.js +48 -34
package/dist/test/tiles/list/tile-list-compact.test.js.map +1 -1
package/dist/test/tiles/list/tile-list.test.js +105 -76
package/dist/test/tiles/list/tile-list.test.js.map +1 -1
package/dist/test/tiles/tile-dispatcher.test.js +30 -17
package/dist/test/tiles/tile-dispatcher.test.js.map +1 -1
package/dist/test/tiles/tile-mediatype-icon.test.js +24 -12
package/dist/test/tiles/tile-mediatype-icon.test.js.map +1 -1
package/eslint.config.mjs +53 -53
package/index.html +24 -24
package/local.archive.org.cert +86 -86
package/local.archive.org.key +27 -27
package/package.json +118 -120
package/renovate.json +6 -6
package/src/collection-browser.ts +15 -246
package/src/collection-facets/facet-row.ts +296 -299
package/src/collection-facets/more-facets-content.ts +8 -5
package/src/collection-facets.ts +995 -1010
package/src/data-source/collection-browser-data-source-interface.ts +333 -345
package/src/data-source/collection-browser-data-source.ts +1401 -1441
package/src/data-source/collection-browser-query-state.ts +65 -59
package/src/data-source/models.ts +43 -56
package/src/models.ts +870 -866
package/src/restoration-state-handler.ts +544 -546
package/test/collection-browser.test.ts +2403 -2413
package/test/restoration-state-handler.test.ts +510 -480
package/tsconfig.json +20 -25
package/vite.config.ts +22 -29
package/web-dev-server.config.mjs +30 -30
package/web-test-runner.config.mjs +41 -41
package/dist/src/combo-box/caret-closed.d.ts +0 -2
package/dist/src/combo-box/caret-closed.js +0 -7
package/dist/src/combo-box/caret-closed.js.map +0 -1
package/dist/src/combo-box/caret-open.d.ts +0 -2
package/dist/src/combo-box/caret-open.js +0 -7
package/dist/src/combo-box/caret-open.js.map +0 -1
package/dist/src/combo-box/clear.d.ts +0 -2
package/dist/src/combo-box/clear.js +0 -11
package/dist/src/combo-box/clear.js.map +0 -1
package/dist/src/combo-box/ia-combo-box.d.ts +0 -422
package/dist/src/combo-box/ia-combo-box.js +0 -1203
package/dist/src/combo-box/ia-combo-box.js.map +0 -1
package/dist/src/combo-box/models.d.ts +0 -75
package/dist/src/combo-box/models.js +0 -40
package/dist/src/combo-box/models.js.map +0 -1
package/src/combo-box/caret-closed.ts +0 -7
package/src/combo-box/caret-open.ts +0 -7
package/src/combo-box/clear.ts +0 -11
package/src/combo-box/ia-combo-box.ts +0 -1288
package/src/combo-box/models.ts +0 -113

package/dist/src/tiles/hover/hover-pane-controller.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"hover-pane-controller.js","sourceRoot":"","sources":["../../../../src/tiles/hover/hover-pane-controller.ts"],"names":[],"mappings":"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","sourcesContent":["import type { SortParam } from '@internetarchive/search-service';\nimport {\n html,\n HTMLTemplateResult,\n nothing,\n ReactiveController,\n ReactiveControllerHost,\n} from 'lit';\nimport type { TileModel } from '../../models';\nimport type { CollectionTitles } from '../../data-source/models';\nimport { msg } from '@lit/localize';\n\ntype HoverPaneState = 'hidden' \| 'shown' \| 'fading-out';\n\n// the anchor point of the hover pane\n// can be either the mouse cursor or near the host element\n// in the case of mouse navigation, we want it to follow the cursor\n// in the case of keyboard navigation, we want it to appear near the host element\ntype HoverPanePositionAnchor = 'host' \| 'cursor';\n\nexport interface HoverPaneProperties {\n model?: TileModel;\n baseNavigationUrl?: string;\n baseImageUrl?: string;\n loggedIn: boolean;\n suppressBlurring: boolean;\n sortParam: SortParam \| null;\n collectionTitles?: CollectionTitles;\n}\n\nexport interface HoverPaneControllerOptions {\n offsetX?: number;\n offsetY?: number;\n enableLongPress?: boolean;\n showDelay?: number;\n hideDelay?: number;\n longPressDelay?: number;\n mobileBreakpoint?: number;\n}\n\n/** A common interface for providing a hover pane element. /\nexport interface HoverPaneProviderInterface {\n /* Returns the provider's currently rendered hover pane element. /\n getHoverPane(): HTMLElement \| undefined;\n /* Returns properties that should be passed to the hover pane. /\n getHoverPaneProps(): HoverPaneProperties;\n /* When user has keyboard navigated out of more info, we want the host to get focus /\n acquireFocus(): void;\n /* When user has keyboard navigated out of more info, we want the host to lose focus /\n releaseFocus(): void;\n}\n\nexport interface ToggleHoverPaneOptions {\n coords: { x: number; y: number };\n enableTouchBackdrop?: boolean;\n}\n\n/\n An interface for interacting with hover pane controllers (e.g.,\n * to retrieve their current hover pane template).\n /\nexport interface HoverPaneControllerInterface extends ReactiveController {\n /\n Returns the hover pane template to render based on this controller's\n * current state. The returned template may be `nothing` if the hover\n * pane should not currently be rendered.\n /\n getTemplate(): HTMLTemplateResult \| typeof nothing;\n\n /\n Requests to manually toggle the state of the hover pane.\n * If the hover pane is already shown, it will begin fading out and then\n * subsequently be hidden and removed. If the hover pane is already fading\n * out or hidden, it will fade back in and be shown.\n /\n toggleHoverPane(options: ToggleHoverPaneOptions): void;\n}\n\nconst clamp = (val: number, min = -Infinity, max = Infinity) =>\n Math.max(min, Math.min(val, max));\n\nexport class HoverPaneController implements HoverPaneControllerInterface {\n /\n The hover pane element attached to this controller's host.\n /\n private hoverPane?: HTMLElement;\n\n /\n The properties to be passed to the hover pane element\n /\n private hoverPaneProps?: HoverPaneProperties;\n\n /\n The breakpoint (in pixels) below which the mobile interface should be used.\n /\n private mobileBreakpoint?: number = 600;\n\n /\n The number of horizontal pixels the hover pane should be offset from the\n * pointer position.\n /\n private offsetX: number = -10;\n\n /\n The number of vertical pixels the hover pane should be offset from the\n * pointer position.\n /\n private offsetY: number = 15;\n\n /\n The delay between the mouse idling within the host element and when the hover\n * pane should begin fading in (in milliseconds).\n /\n private showDelay: number = 300;\n\n /\n The delay between when the mouse leaves the host element and when the hover\n * pane should begin fading out (in milliseconds).\n /\n private hideDelay: number = 100;\n\n /\n The delay between when a touch event begins on the host element and when the\n * hover pane should begin fading in (in milliseconds).\n /\n private longPressDelay: number = 600;\n\n /\n Whether long press interactions should cause the hover pane to appear (when\n * below the mobile breakpoint).\n /\n private enableLongPress: boolean = false;\n\n /\n Used to control the current state of this provider's hover pane.\n * - `'hidden'` => The hover pane is not present at all.\n * - `'shown'` => The hover pane is either fading in or fully visible.\n * - `'fading-out'` => The hover pane is fading out and about to be removed.\n /\n private hoverPaneState: HoverPaneState = 'hidden';\n\n /* The timer ID for showing the hover pane /\n private showTimer?: number;\n\n /* The timer ID for hiding the hover pane /\n private hideTimer?: number;\n\n /* The timer ID for recognizing a long press event /\n private longPressTimer?: number;\n\n /\n Whether the touch backdrop should currently be rendered irrespective of other touch\n * interactions being enabled.\n /\n private forceTouchBackdrop: boolean = false;\n\n /* A record of the last mouse position on the host element, for positioning the hover pane /\n private lastPointerClientPos = { x: 0, y: 0 };\n\n constructor(\n /* The host element to which this controller should attach listeners /\n private readonly host: ReactiveControllerHost &\n HoverPaneProviderInterface &\n HTMLElement,\n /* Options for adjusting the hover pane behavior (offsets, delays, etc.) /\n options: HoverPaneControllerOptions = {},\n ) {\n this.mobileBreakpoint = options.mobileBreakpoint ?? this.mobileBreakpoint;\n this.offsetX = options.offsetX ?? this.offsetX;\n this.offsetY = options.offsetY ?? this.offsetY;\n this.showDelay = options.showDelay ?? this.showDelay;\n this.hideDelay = options.hideDelay ?? this.hideDelay;\n this.longPressDelay = options.longPressDelay ?? this.longPressDelay;\n this.enableLongPress = options.enableLongPress ?? this.enableLongPress;\n\n this.host.addController(this);\n }\n\n hostConnected(): void {\n this.attachListeners();\n }\n\n hostDisconnected(): void {\n this.detachListeners();\n }\n\n hostUpdated(): void {\n this.hoverPane = this.host.getHoverPane();\n this.hoverPaneProps = this.host.getHoverPaneProps();\n }\n\n /* @inheritdoc /\n getTemplate(): HTMLTemplateResult \| typeof nothing {\n this.hoverPaneProps = this.host.getHoverPaneProps();\n\n return this.shouldRenderHoverPane\n ? html`\n ${this.touchBackdropTemplate}\n <tile-hover-pane\n popover\n tabindex=\"-1\"\n aria-describedby=\"tile-hover-pane-aria-description\"\n .model=${this.hoverPaneProps?.model}\n .baseNavigationUrl=${this.hoverPaneProps?.baseNavigationUrl}\n .baseImageUrl=${this.hoverPaneProps?.baseImageUrl}\n .loggedIn=${this.hoverPaneProps?.loggedIn}\n .suppressBlurring=${this.hoverPaneProps?.suppressBlurring}\n .sortParam=${this.hoverPaneProps?.sortParam}\n .collectionTitles=${this.hoverPaneProps?.collectionTitles}\n .mobileBreakpoint=${this.mobileBreakpoint}\n .currentWidth=${window.innerWidth}\n ></tile-hover-pane>\n <div id=\"tile-hover-pane-aria-description\" class=\"sr-only\">\n ${msg('Press Up Arrow to exit item detail preview')}\n </div>\n `\n : nothing;\n }\n\n /* @inheritdoc /\n toggleHoverPane(options: ToggleHoverPaneOptions): void {\n if (this.hoverPaneState === 'shown') {\n this.fadeOutHoverPane();\n this.forceTouchBackdrop = false;\n } else {\n this.lastPointerClientPos = options.coords;\n this.forceTouchBackdrop = options.enableTouchBackdrop ?? false;\n this.showHoverPane();\n }\n }\n\n /\n Produces a template for the invisible touch capture backdrop that\n * is used to cancel the hover pane on touch devices. We want any\n * touch interaction on the backdrop to remove the hover pane, and\n * we don't want to bubble up mouse events that would otherwise\n * affect the state of the hover pane (e.g., fading it back in).\n /\n private get touchBackdropTemplate(): HTMLTemplateResult \| typeof nothing {\n return this.showTouchBackdrop\n ? html`<div\n id=\"touch-backdrop\"\n @touchstart=${this.handleBackdropInteraction}\n @touchmove=${this.handleBackdropInteraction}\n @touchend=${this.handleBackdropInteraction}\n @touchcancel=${this.handleBackdropInteraction}\n @mouseenter=${(e: MouseEvent) => e.stopPropagation()}\n @mousemove=${(e: MouseEvent) => e.stopPropagation()}\n @mouseleave=${(e: MouseEvent) => e.stopPropagation()}\n ></div>`\n : nothing;\n }\n\n private get showTouchBackdrop(): boolean {\n return (\n (this.isTouchEnabled && this.enableLongPress) \|\| this.forceTouchBackdrop\n );\n }\n\n /* Whether to use the mobile layout /\n private get isMobileView(): boolean {\n return !!this.mobileBreakpoint && window.innerWidth < this.mobileBreakpoint;\n }\n\n private get isHoverEnabled(): boolean {\n return window.matchMedia('(hover: hover)').matches;\n }\n\n private get isTouchEnabled(): boolean {\n return (\n 'ontouchstart' in window &&\n window.matchMedia('(any-pointer: coarse)').matches\n );\n }\n\n /* Whether this controller should currently render its hover pane. /\n private get shouldRenderHoverPane(): boolean {\n return this.hoverPaneState !== 'hidden';\n }\n\n /\n Returns the desired top/left offsets (in pixels) for this tile's hover pane.\n * The desired offsets balance positioning the hover pane under the primary pointer\n * while preventing it from flowing outside the viewport. The returned offsets are\n * relative to the viewport, intended to position the pane as a popover element.\n \n These offsets are only valid if the hover pane is already rendered with its\n * correct width and height. If the hover pane is not present, the returned offsets\n * will simply represent the current pointer position.\n /\n private makePaneDesiredOffsets(anchor: HoverPanePositionAnchor): {\n top: number;\n left: number;\n } {\n // Try to find offsets for the hover pane that:\n // (a) cause it to lie entirely within the viewport, and\n // (b) to the extent possible, minimize the distance between the\n // nearest corner of the hover pane and the mouse/host element position\n // (with some additional offsets applied after the fact).\n\n let [left, top] = [0, 0];\n switch (anchor) {\n case 'host':\n const hostRect = this.host.getBoundingClientRect();\n // slight inset from host top left corner\n left = hostRect.left + 20;\n top = hostRect.top + 30;\n break;\n case 'cursor':\n left = this.lastPointerClientPos.x;\n top = this.lastPointerClientPos.y;\n break;\n }\n\n // Flip the hover pane according to which quadrant of the viewport the coordinates are in.\n // (Similar to how Wikipedia's link hover panes work)\n const flipHorizontal = left > window.innerWidth / 2;\n const flipVertical = top > window.innerHeight / 2;\n\n const hoverPaneRect = this.hoverPane?.getBoundingClientRect();\n if (hoverPaneRect) {\n // If we need to flip the hover pane, do so by subtracting its width/height from left/top\n if (flipHorizontal) {\n left -= hoverPaneRect.width;\n }\n if (flipVertical) {\n top -= hoverPaneRect.height;\n }\n\n // Apply desired offsets from the target position\n left += (flipHorizontal ? -1 : 1) this.offsetX;\n top += (flipVertical ? -1 : 1) * this.offsetY;\n\n // On mobile view, shunt the hover pane to avoid overflowing the viewport\n if (this.isMobileView) {\n left = clamp(left, 20, window.innerWidth - hoverPaneRect.width - 20);\n top = clamp(top, 20, window.innerHeight - hoverPaneRect.height - 20);\n }\n }\n\n left += window.scrollX;\n top += window.scrollY;\n\n return { left, top };\n }\n\n /*\n Adds to the host element all the listeners necessary to make the\n * hover pane functional.\n /\n private attachListeners(): void {\n // keyboard navigation listeners\n this.host.addEventListener('focus', this.handleFocus);\n this.host.addEventListener('blur', this.handleBlur);\n this.host.addEventListener('keyup', this.handleKeyUp);\n this.host.addEventListener('keydown', this.handleKeyDown);\n\n if (this.isHoverEnabled) {\n this.host.addEventListener('mouseenter', this.handleMouseEnter);\n this.host.addEventListener('mousemove', this.handleMouseMove);\n this.host.addEventListener('mouseleave', this.handleMouseLeave);\n }\n\n if (this.isTouchEnabled && this.enableLongPress) {\n this.host.addEventListener('touchstart', this.handleTouchStart);\n this.host.addEventListener('touchmove', this.handleLongPressCancel);\n this.host.addEventListener('touchend', this.handleLongPressCancel);\n this.host.addEventListener('touchcancel', this.handleLongPressCancel);\n this.host.addEventListener('contextmenu', this.handleContextMenu);\n }\n }\n\n /\n Removes all the hover pane listeners from the host element.\n /\n private detachListeners(): void {\n this.host.removeEventListener('mouseenter', this.handleMouseEnter);\n this.host.removeEventListener('mousemove', this.handleMouseMove);\n this.host.removeEventListener('mouseleave', this.handleMouseLeave);\n this.host.removeEventListener('touchstart', this.handleTouchStart);\n this.host.removeEventListener('touchmove', this.handleLongPressCancel);\n this.host.removeEventListener('touchend', this.handleLongPressCancel);\n this.host.removeEventListener('touchcancel', this.handleLongPressCancel);\n this.host.removeEventListener('contextmenu', this.handleContextMenu);\n\n // keyboard navigation listeners\n this.host.removeEventListener('focus', this.handleFocus);\n this.host.removeEventListener('blur', this.handleBlur);\n this.host.removeEventListener('keyup', this.handleKeyUp);\n this.host.removeEventListener('keydown', this.handleKeyDown);\n }\n\n private handleFocus = (): void => {\n if (this.hoverPaneState === 'hidden') {\n this.showHoverPane({\n anchor: 'host',\n });\n }\n };\n\n private handleBlur = (): void => {\n if (this.hoverPaneState !== 'hidden') {\n this.fadeOutHoverPane();\n }\n };\n\n private handleKeyDown = (e: KeyboardEvent): void => {\n if (\n (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp') &&\n this.hoverPaneState !== 'hidden'\n ) {\n e.preventDefault();\n }\n };\n\n private handleKeyUp = (e: KeyboardEvent): void => {\n if (this.hoverPaneState === 'hidden' \|\| !this.hoverPane) return;\n if (e.key === 'ArrowDown') {\n this.hoverPane.tabIndex = 1;\n this.hoverPane.focus();\n }\n\n const isArrowUp = e.key === 'ArrowUp';\n const isEscape = e.key === 'Escape' \|\| e.key === 'Esc';\n\n if (isEscape) {\n this.fadeOutHoverPane();\n }\n if (isArrowUp \|\| isEscape) {\n this.hoverPane.tabIndex = -1;\n this.host.acquireFocus();\n }\n };\n\n /\n Handler for the mouseenter event on the host element.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleMouseEnter = (e: MouseEvent): void => {\n // Delegate to the mousemove handler, as they are currently processed identically\n this.handleMouseMove(e);\n };\n\n /\n Handler for the mousemove event on the host element.\n * Aborts any pending hide/fade-out for the hover pane, and restarts the\n * timer to show it.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleMouseMove = (e: MouseEvent): void => {\n // The mouse is within the tile, so abort any pending removal of the hover pane\n clearTimeout(this.hideTimer);\n\n // If the hover pane is currently fading out, just make it fade back in where it is\n if (this.hoverPaneState === 'fading-out') {\n this.hoverPaneState = 'shown';\n this.hoverPane?.classList.add('fade-in');\n }\n\n // Restart the timer to show the hover pane anytime the mouse moves within the tile\n if (this.hoverPaneState === 'hidden') {\n this.restartShowHoverPaneTimer();\n this.lastPointerClientPos = { x: e.clientX, y: e.clientY };\n }\n };\n\n /\n Handler for the mouseleave event on the host element.\n * Hides the hover pane if present, and aborts the timer for showing it.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleMouseLeave = (): void => {\n this.host.releaseFocus();\n\n // Abort any timer to show the hover pane, as the mouse has left the tile\n clearTimeout(this.showTimer);\n\n // Hide the hover pane if it's already been shown\n if (this.hoverPaneState !== 'hidden') {\n this.hideTimer = window.setTimeout(() => {\n this.fadeOutHoverPane();\n }, this.hideDelay);\n }\n };\n\n /\n Handler for the touchstart event on the host element.\n * Begins the timer for recognizing a long press event.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleTouchStart = (e: TouchEvent): void => {\n clearTimeout(this.longPressTimer);\n\n if (e.touches.length === 1) {\n this.longPressTimer = window.setTimeout(() => {\n if (this.hoverPaneState === 'hidden') {\n this.showHoverPane();\n }\n }, this.longPressDelay);\n\n this.lastPointerClientPos = {\n x: e.touches[0].clientX,\n y: e.touches[0].clientY,\n };\n }\n };\n\n /\n Handler for events that should cancel a pending long press event\n * (touchmove, touchend, touchcancel). Aborts the timer for recognizing\n * a long press.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleLongPressCancel = (): void => {\n clearTimeout(this.longPressTimer);\n };\n\n /\n Handler for the contextmenu event, which should be suppressed during\n * mobile long-press events on the host element.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleContextMenu = (e: Event): void => {\n e.preventDefault();\n };\n\n /\n Immediately causes the hover pane to begin fading out, if it is present.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleBackdropInteraction = (e: Event): void => {\n if (this.hoverPaneState !== 'hidden') {\n this.fadeOutHoverPane();\n }\n e.stopPropagation();\n };\n\n /\n Aborts and restarts the timer for showing the hover pane.\n /\n private restartShowHoverPaneTimer(): void {\n clearTimeout(this.showTimer);\n this.showTimer = window.setTimeout(() => {\n this.host.acquireFocus();\n this.showHoverPane();\n }, this.showDelay);\n }\n\n /\n Causes this tile's hover pane to be rendered, positioned, and made visible.\n /\n private async showHoverPane(\n options: {\n anchor: HoverPanePositionAnchor;\n } = {\n anchor: 'cursor',\n },\n ): Promise<void> {\n this.hoverPaneState = 'shown';\n this.host.requestUpdate();\n\n // Wait for the state update to render the hover pane\n await this.host.updateComplete;\n\n // Ensure the hover pane element is still in the document before showing,\n // as it might have been removed by the previous update.\n if (!this.hoverPane?.isConnected) return;\n\n this.hoverPane?.showPopover?.();\n await new Promise(resolve => {\n // Pane sizes aren't accurate until next frame\n requestAnimationFrame(resolve);\n });\n\n // Apply the correct positioning to the hover pane\n this.repositionHoverPane(options.anchor);\n\n // The hover pane is initially not visible (to avoid it shifting around\n // while being positioned). Since it now has the correct positioning, we\n // can make it visible and begin its fade-in animation.\n this.hoverPane?.classList.add('visible', 'fade-in');\n }\n\n /\n Causes this tile's hover pane to begin fading out and starts\n * the timer for it to be removed.\n /\n private fadeOutHoverPane(): void {\n this.hoverPaneState = 'fading-out';\n this.hoverPane?.classList.remove('fade-in');\n\n clearTimeout(this.hideTimer);\n this.hideTimer = window.setTimeout(() => {\n this.hoverPaneState = 'hidden';\n if (this.hoverPane) {\n this.hoverPane.tabIndex = -1;\n }\n this.host.requestUpdate();\n }, 100);\n }\n\n /\n Positions the hover pane with the correct offsets.\n */\n private repositionHoverPane(anchor: HoverPanePositionAnchor): void {\n if (!this.hoverPane) return;\n\n const { top, left } = this.makePaneDesiredOffsets(anchor);\n\n this.hoverPane.style.top = `${top}px`;\n this.hoverPane.style.left = `${left}px`;\n }\n}\n"]}
1	+ {"version":3,"file":"hover-pane-controller.js","sourceRoot":"","sources":["../../../../src/tiles/hover/hover-pane-controller.ts"],"names":[],"mappings":"AACA,OAAO,EACL,IAAI,EAEJ,OAAO,GAGR,MAAM,KAAK,CAAC;AAGb,OAAO,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAoEpC,MAAM,KAAK,GAAG,CAAC,GAAW,EAAE,GAAG,GAAG,CAAC,QAAQ,EAAE,GAAG,GAAG,QAAQ,EAAE,EAAE,CAC7D,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,CAAC;AAEpC,MAAM,OAAO,mBAAmB;IA8E9B;IACE,wEAAwE;IACvD,IAEJ;IACb,4EAA4E;IAC5E,UAAsC,EAAE;;QAJvB,SAAI,GAAJ,IAAI,CAER;QAvEf;;WAEG;QACK,qBAAgB,GAAY,GAAG,CAAC;QAExC;;;WAGG;QACK,YAAO,GAAW,CAAC,EAAE,CAAC;QAE9B;;;WAGG;QACK,YAAO,GAAW,EAAE,CAAC;QAE7B;;;WAGG;QACK,cAAS,GAAW,GAAG,CAAC;QAEhC;;;WAGG;QACK,cAAS,GAAW,GAAG,CAAC;QAEhC;;;WAGG;QACK,mBAAc,GAAW,GAAG,CAAC;QAErC;;;WAGG;QACK,oBAAe,GAAY,KAAK,CAAC;QAEzC;;;;;WAKG;QACK,mBAAc,GAAmB,QAAQ,CAAC;QAWlD;;;WAGG;QACK,uBAAkB,GAAY,KAAK,CAAC;QAE5C,8FAA8F;QACtF,yBAAoB,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC;QA2OtC,gBAAW,GAAG,GAAS,EAAE;YAC/B,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE,CAAC;gBACrC,IAAI,CAAC,aAAa,CAAC;oBACjB,MAAM,EAAE,MAAM;iBACf,CAAC,CAAC;YACL,CAAC;QACH,CAAC,CAAC;QAEM,eAAU,GAAG,GAAS,EAAE;YAC9B,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE,CAAC;gBACrC,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC1B,CAAC;QACH,CAAC,CAAC;QAEM,kBAAa,GAAG,CAAC,CAAgB,EAAQ,EAAE;YACjD,IACE,CAAC,CAAC,CAAC,GAAG,KAAK,WAAW,IAAI,CAAC,CAAC,GAAG,KAAK,SAAS,CAAC;gBAC9C,IAAI,CAAC,cAAc,KAAK,QAAQ,EAChC,CAAC;gBACD,CAAC,CAAC,cAAc,EAAE,CAAC;YACrB,CAAC;QACH,CAAC,CAAC;QAEM,gBAAW,GAAG,CAAC,CAAgB,EAAQ,EAAE;YAC/C,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,IAAI,CAAC,IAAI,CAAC,SAAS;gBAAE,OAAO;YAChE,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,EAAE,CAAC;gBAC1B,IAAI,CAAC,SAAS,CAAC,QAAQ,GAAG,CAAC,CAAC;gBAC5B,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;YACzB,CAAC;YAED,MAAM,SAAS,GAAG,CAAC,CAAC,GAAG,KAAK,SAAS,CAAC;YACtC,MAAM,QAAQ,GAAG,CAAC,CAAC,GAAG,KAAK,QAAQ,IAAI,CAAC,CAAC,GAAG,KAAK,KAAK,CAAC;YAEvD,IAAI,QAAQ,EAAE,CAAC;gBACb,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC1B,CAAC;YACD,IAAI,SAAS,IAAI,QAAQ,EAAE,CAAC;gBAC1B,IAAI,CAAC,SAAS,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;gBAC7B,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YAC3B,CAAC;QACH,CAAC,CAAC;QAEF;;WAEG;QACH,+DAA+D;QACvD,qBAAgB,GAAG,CAAC,CAAa,EAAQ,EAAE;YACjD,iFAAiF;YACjF,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC;QAC1B,CAAC,CAAC;QAEF;;;;WAIG;QACH,+DAA+D;QACvD,oBAAe,GAAG,CAAC,CAAa,EAAQ,EAAE;;YAChD,+EAA+E;YAC/E,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;YAE7B,mFAAmF;YACnF,IAAI,IAAI,CAAC,cAAc,KAAK,YAAY,EAAE,CAAC;gBACzC,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC;gBAC9B,MAAA,IAAI,CAAC,SAAS,0CAAE,SAAS,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;YAC3C,CAAC;YAED,mFAAmF;YACnF,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE,CAAC;gBACrC,IAAI,CAAC,yBAAyB,EAAE,CAAC;gBACjC,IAAI,CAAC,oBAAoB,GAAG,EAAE,CAAC,EAAE,CAAC,CAAC,OAAO,EAAE,CAAC,EAAE,CAAC,CAAC,OAAO,EAAE,CAAC;YAC7D,CAAC;QACH,CAAC,CAAC;QAEF;;;WAGG;QACH,+DAA+D;QACvD,qBAAgB,GAAG,GAAS,EAAE;YACpC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YAEzB,yEAAyE;YACzE,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;YAE7B,iDAAiD;YACjD,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE,CAAC;gBACrC,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;oBACtC,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBAC1B,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;YACrB,CAAC;QACH,CAAC,CAAC;QAEF;;;WAGG;QACH,+DAA+D;QACvD,qBAAgB,GAAG,CAAC,CAAa,EAAQ,EAAE;YACjD,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;YAElC,IAAI,CAAC,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;gBAC3B,IAAI,CAAC,cAAc,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;oBAC3C,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE,CAAC;wBACrC,IAAI,CAAC,aAAa,EAAE,CAAC;oBACvB,CAAC;gBACH,CAAC,EAAE,IAAI,CAAC,cAAc,CAAC,CAAC;gBAExB,IAAI,CAAC,oBAAoB,GAAG;oBAC1B,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO;oBACvB,CAAC,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,OAAO;iBACxB,CAAC;YACJ,CAAC;QACH,CAAC,CAAC;QAEF;;;;WAIG;QACH,+DAA+D;QACvD,0BAAqB,GAAG,GAAS,EAAE;YACzC,YAAY,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QACpC,CAAC,CAAC;QAEF;;;WAGG;QACH,+DAA+D;QACvD,sBAAiB,GAAG,CAAC,CAAQ,EAAQ,EAAE;YAC7C,CAAC,CAAC,cAAc,EAAE,CAAC;QACrB,CAAC,CAAC;QAEF;;WAEG;QACH,+DAA+D;QACvD,8BAAyB,GAAG,CAAC,CAAQ,EAAQ,EAAE;YACrD,IAAI,IAAI,CAAC,cAAc,KAAK,QAAQ,EAAE,CAAC;gBACrC,IAAI,CAAC,gBAAgB,EAAE,CAAC;YAC1B,CAAC;YACD,CAAC,CAAC,eAAe,EAAE,CAAC;QACtB,CAAC,CAAC;QAhXA,IAAI,CAAC,gBAAgB,GAAG,MAAA,OAAO,CAAC,gBAAgB,mCAAI,IAAI,CAAC,gBAAgB,CAAC;QAC1E,IAAI,CAAC,OAAO,GAAG,MAAA,OAAO,CAAC,OAAO,mCAAI,IAAI,CAAC,OAAO,CAAC;QAC/C,IAAI,CAAC,OAAO,GAAG,MAAA,OAAO,CAAC,OAAO,mCAAI,IAAI,CAAC,OAAO,CAAC;QAC/C,IAAI,CAAC,SAAS,GAAG,MAAA,OAAO,CAAC,SAAS,mCAAI,IAAI,CAAC,SAAS,CAAC;QACrD,IAAI,CAAC,SAAS,GAAG,MAAA,OAAO,CAAC,SAAS,mCAAI,IAAI,CAAC,SAAS,CAAC;QACrD,IAAI,CAAC,cAAc,GAAG,MAAA,OAAO,CAAC,cAAc,mCAAI,IAAI,CAAC,cAAc,CAAC;QACpE,IAAI,CAAC,eAAe,GAAG,MAAA,OAAO,CAAC,eAAe,mCAAI,IAAI,CAAC,eAAe,CAAC;QAEvE,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;IAChC,CAAC;IAED,aAAa;QACX,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAED,gBAAgB;QACd,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAED,WAAW;QACT,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;QAC1C,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAC;IACtD,CAAC;IAED,kBAAkB;IAClB,WAAW;;QACT,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,IAAI,CAAC,iBAAiB,EAAE,CAAC;QAEpD,OAAO,IAAI,CAAC,qBAAqB;YAC/B,CAAC,CAAC,IAAI,CAAA;YACA,IAAI,CAAC,qBAAqB;;;;;qBAKjB,MAAA,IAAI,CAAC,cAAc,0CAAE,KAAK;iCACd,MAAA,IAAI,CAAC,cAAc,0CAAE,iBAAiB;4BAC3C,MAAA,IAAI,CAAC,cAAc,0CAAE,YAAY;wBACrC,MAAA,IAAI,CAAC,cAAc,0CAAE,QAAQ;gCACrB,MAAA,IAAI,CAAC,cAAc,0CAAE,gBAAgB;yBAC5C,MAAA,IAAI,CAAC,cAAc,0CAAE,SAAS;gCACvB,MAAA,IAAI,CAAC,cAAc,0CAAE,gBAAgB;gCACrC,IAAI,CAAC,gBAAgB;4BACzB,MAAM,CAAC,UAAU;;;cAG/B,GAAG,CAAC,4CAA4C,CAAC;;SAEtD;YACH,CAAC,CAAC,OAAO,CAAC;IACd,CAAC;IAED,kBAAkB;IAClB,eAAe,CAAC,OAA+B;;QAC7C,IAAI,IAAI,CAAC,cAAc,KAAK,OAAO,EAAE,CAAC;YACpC,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACxB,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC;QAClC,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,oBAAoB,GAAG,OAAO,CAAC,MAAM,CAAC;YAC3C,IAAI,CAAC,kBAAkB,GAAG,MAAA,OAAO,CAAC,mBAAmB,mCAAI,KAAK,CAAC;YAC/D,IAAI,CAAC,aAAa,EAAE,CAAC;QACvB,CAAC;IACH,CAAC;IAED;;;;;;OAMG;IACH,IAAY,qBAAqB;QAC/B,OAAO,IAAI,CAAC,iBAAiB;YAC3B,CAAC,CAAC,IAAI,CAAA;;wBAEY,IAAI,CAAC,yBAAyB;uBAC/B,IAAI,CAAC,yBAAyB;sBAC/B,IAAI,CAAC,yBAAyB;yBAC3B,IAAI,CAAC,yBAAyB;wBAC/B,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE;uBACvC,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE;wBACrC,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE;gBAC9C;YACV,CAAC,CAAC,OAAO,CAAC;IACd,CAAC;IAED,IAAY,iBAAiB;QAC3B,OAAO,CACL,CAAC,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,IAAI,CAAC,kBAAkB,CACzE,CAAC;IACJ,CAAC;IAED,uCAAuC;IACvC,IAAY,YAAY;QACtB,OAAO,CAAC,CAAC,IAAI,CAAC,gBAAgB,IAAI,MAAM,CAAC,UAAU,GAAG,IAAI,CAAC,gBAAgB,CAAC;IAC9E,CAAC;IAED,IAAY,cAAc;QACxB,OAAO,MAAM,CAAC,UAAU,CAAC,gBAAgB,CAAC,CAAC,OAAO,CAAC;IACrD,CAAC;IAED,IAAY,cAAc;QACxB,OAAO,CACL,cAAc,IAAI,MAAM;YACxB,MAAM,CAAC,UAAU,CAAC,uBAAuB,CAAC,CAAC,OAAO,CACnD,CAAC;IACJ,CAAC;IAED,sEAAsE;IACtE,IAAY,qBAAqB;QAC/B,OAAO,IAAI,CAAC,cAAc,KAAK,QAAQ,CAAC;IAC1C,CAAC;IAED;;;;;;;;;OASG;IACK,sBAAsB,CAAC,MAA+B;QAI5D,+CAA+C;QAC/C,yDAAyD;QACzD,iEAAiE;QACjE,4EAA4E;QAC5E,8DAA8D;;QAE9D,IAAI,CAAC,IAAI,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACzB,QAAQ,MAAM,EAAE,CAAC;YACf,KAAK,MAAM;gBACT,MAAM,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC;gBACnD,yCAAyC;gBACzC,IAAI,GAAG,QAAQ,CAAC,IAAI,GAAG,EAAE,CAAC;gBAC1B,GAAG,GAAG,QAAQ,CAAC,GAAG,GAAG,EAAE,CAAC;gBACxB,MAAM;YACR,KAAK,QAAQ;gBACX,IAAI,GAAG,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC;gBACnC,GAAG,GAAG,IAAI,CAAC,oBAAoB,CAAC,CAAC,CAAC;gBAClC,MAAM;QACV,CAAC;QAED,0FAA0F;QAC1F,qDAAqD;QACrD,MAAM,cAAc,GAAG,IAAI,GAAG,MAAM,CAAC,UAAU,GAAG,CAAC,CAAC;QACpD,MAAM,YAAY,GAAG,GAAG,GAAG,MAAM,CAAC,WAAW,GAAG,CAAC,CAAC;QAElD,MAAM,aAAa,GAAG,MAAA,IAAI,CAAC,SAAS,0CAAE,qBAAqB,EAAE,CAAC;QAC9D,IAAI,aAAa,EAAE,CAAC;YAClB,yFAAyF;YACzF,IAAI,cAAc,EAAE,CAAC;gBACnB,IAAI,IAAI,aAAa,CAAC,KAAK,CAAC;YAC9B,CAAC;YACD,IAAI,YAAY,EAAE,CAAC;gBACjB,GAAG,IAAI,aAAa,CAAC,MAAM,CAAC;YAC9B,CAAC;YAED,iDAAiD;YACjD,IAAI,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;YACjD,GAAG,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC;YAE9C,yEAAyE;YACzE,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;gBACtB,IAAI,GAAG,KAAK,CAAC,IAAI,EAAE,EAAE,EAAE,MAAM,CAAC,UAAU,GAAG,aAAa,CAAC,KAAK,GAAG,EAAE,CAAC,CAAC;gBACrE,GAAG,GAAG,KAAK,CAAC,GAAG,EAAE,EAAE,EAAE,MAAM,CAAC,WAAW,GAAG,aAAa,CAAC,MAAM,GAAG,EAAE,CAAC,CAAC;YACvE,CAAC;QACH,CAAC;QAED,IAAI,IAAI,MAAM,CAAC,OAAO,CAAC;QACvB,GAAG,IAAI,MAAM,CAAC,OAAO,CAAC;QAEtB,OAAO,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC;IACvB,CAAC;IAED;;;OAGG;IACK,eAAe;QACrB,gCAAgC;QAChC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;QACtD,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;QACpD,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;QACtD,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;QAE1D,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;YAChE,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;YAC9D,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QAClE,CAAC;QAED,IAAI,IAAI,CAAC,cAAc,IAAI,IAAI,CAAC,eAAe,EAAE,CAAC;YAChD,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;YAChE,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,WAAW,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;YACpE,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,UAAU,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;YACnE,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;YACtE,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;QACpE,CAAC;IACH,CAAC;IAED;;OAEG;IACK,eAAe;QACrB,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACnE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;QACjE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACnE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,gBAAgB,CAAC,CAAC;QACnE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,WAAW,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;QACvE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;QACtE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;QACzE,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,iBAAiB,CAAC,CAAC;QAErE,gCAAgC;QAChC,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;QACzD,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;QACvD,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;QACzD,IAAI,CAAC,IAAI,CAAC,mBAAmB,CAAC,SAAS,EAAE,IAAI,CAAC,aAAa,CAAC,CAAC;IAC/D,CAAC;IAmJD;;OAEG;IACK,yBAAyB;QAC/B,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC7B,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;YACtC,IAAI,CAAC,IAAI,CAAC,YAAY,EAAE,CAAC;YACzB,IAAI,CAAC,aAAa,EAAE,CAAC;QACvB,CAAC,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;IACrB,CAAC;IAED;;OAEG;IACK,KAAK,CAAC,aAAa,CACzB,UAEI;QACF,MAAM,EAAE,QAAQ;KACjB;;QAED,IAAI,CAAC,cAAc,GAAG,OAAO,CAAC;QAC9B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;QAE1B,qDAAqD;QACrD,MAAM,IAAI,CAAC,IAAI,CAAC,cAAc,CAAC;QAE/B,yEAAyE;QACzE,wDAAwD;QACxD,IAAI,CAAC,CAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,WAAW,CAAA;YAAE,OAAO;QAEzC,MAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,WAAW,kDAAI,CAAC;QAChC,MAAM,IAAI,OAAO,CAAC,OAAO,CAAC,EAAE;YAC1B,8CAA8C;YAC9C,qBAAqB,CAAC,OAAO,CAAC,CAAC;QACjC,CAAC,CAAC,CAAC;QAEH,kDAAkD;QAClD,IAAI,CAAC,mBAAmB,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC;QAEzC,uEAAuE;QACvE,wEAAwE;QACxE,uDAAuD;QACvD,MAAA,IAAI,CAAC,SAAS,0CAAE,SAAS,CAAC,GAAG,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IACtD,CAAC;IAED;;;OAGG;IACK,gBAAgB;;QACtB,IAAI,CAAC,cAAc,GAAG,YAAY,CAAC;QACnC,MAAA,IAAI,CAAC,SAAS,0CAAE,SAAS,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;QAE5C,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC7B,IAAI,CAAC,SAAS,GAAG,MAAM,CAAC,UAAU,CAAC,GAAG,EAAE;YACtC,IAAI,CAAC,cAAc,GAAG,QAAQ,CAAC;YAC/B,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;gBACnB,IAAI,CAAC,SAAS,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;YAC/B,CAAC;YACD,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC;QAC5B,CAAC,EAAE,GAAG,CAAC,CAAC;IACV,CAAC;IAED;;OAEG;IACK,mBAAmB,CAAC,MAA+B;QACzD,IAAI,CAAC,IAAI,CAAC,SAAS;YAAE,OAAO;QAE5B,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC,sBAAsB,CAAC,MAAM,CAAC,CAAC;QAE1D,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,GAAG,IAAI,CAAC;QACtC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,GAAG,GAAG,IAAI,IAAI,CAAC;IAC1C,CAAC;CACF","sourcesContent":["import type { SortParam } from '@internetarchive/search-service';\nimport {\n html,\n HTMLTemplateResult,\n nothing,\n ReactiveController,\n ReactiveControllerHost,\n} from 'lit';\nimport type { TileModel } from '../../models';\nimport type { CollectionTitles } from '../../data-source/models';\nimport { msg } from '@lit/localize';\n\ntype HoverPaneState = 'hidden' \| 'shown' \| 'fading-out';\n\n// the anchor point of the hover pane\n// can be either the mouse cursor or near the host element\n// in the case of mouse navigation, we want it to follow the cursor\n// in the case of keyboard navigation, we want it to appear near the host element\ntype HoverPanePositionAnchor = 'host' \| 'cursor';\n\nexport interface HoverPaneProperties {\n model?: TileModel;\n baseNavigationUrl?: string;\n baseImageUrl?: string;\n loggedIn: boolean;\n suppressBlurring: boolean;\n sortParam: SortParam \| null;\n collectionTitles?: CollectionTitles;\n}\n\nexport interface HoverPaneControllerOptions {\n offsetX?: number;\n offsetY?: number;\n enableLongPress?: boolean;\n showDelay?: number;\n hideDelay?: number;\n longPressDelay?: number;\n mobileBreakpoint?: number;\n}\n\n/** A common interface for providing a hover pane element. /\nexport interface HoverPaneProviderInterface {\n /* Returns the provider's currently rendered hover pane element. /\n getHoverPane(): HTMLElement \| undefined;\n /* Returns properties that should be passed to the hover pane. /\n getHoverPaneProps(): HoverPaneProperties;\n /* When user has keyboard navigated out of more info, we want the host to get focus /\n acquireFocus(): void;\n /* When user has keyboard navigated out of more info, we want the host to lose focus /\n releaseFocus(): void;\n}\n\nexport interface ToggleHoverPaneOptions {\n coords: { x: number; y: number };\n enableTouchBackdrop?: boolean;\n}\n\n/\n An interface for interacting with hover pane controllers (e.g.,\n * to retrieve their current hover pane template).\n /\nexport interface HoverPaneControllerInterface extends ReactiveController {\n /\n Returns the hover pane template to render based on this controller's\n * current state. The returned template may be `nothing` if the hover\n * pane should not currently be rendered.\n /\n getTemplate(): HTMLTemplateResult \| typeof nothing;\n\n /\n Requests to manually toggle the state of the hover pane.\n * If the hover pane is already shown, it will begin fading out and then\n * subsequently be hidden and removed. If the hover pane is already fading\n * out or hidden, it will fade back in and be shown.\n /\n toggleHoverPane(options: ToggleHoverPaneOptions): void;\n}\n\nconst clamp = (val: number, min = -Infinity, max = Infinity) =>\n Math.max(min, Math.min(val, max));\n\nexport class HoverPaneController implements HoverPaneControllerInterface {\n /\n The hover pane element attached to this controller's host.\n /\n private hoverPane?: HTMLElement;\n\n /\n The properties to be passed to the hover pane element\n /\n private hoverPaneProps?: HoverPaneProperties;\n\n /\n The breakpoint (in pixels) below which the mobile interface should be used.\n /\n private mobileBreakpoint?: number = 600;\n\n /\n The number of horizontal pixels the hover pane should be offset from the\n * pointer position.\n /\n private offsetX: number = -10;\n\n /\n The number of vertical pixels the hover pane should be offset from the\n * pointer position.\n /\n private offsetY: number = 15;\n\n /\n The delay between the mouse idling within the host element and when the hover\n * pane should begin fading in (in milliseconds).\n /\n private showDelay: number = 300;\n\n /\n The delay between when the mouse leaves the host element and when the hover\n * pane should begin fading out (in milliseconds).\n /\n private hideDelay: number = 100;\n\n /\n The delay between when a touch event begins on the host element and when the\n * hover pane should begin fading in (in milliseconds).\n /\n private longPressDelay: number = 600;\n\n /\n Whether long press interactions should cause the hover pane to appear (when\n * below the mobile breakpoint).\n /\n private enableLongPress: boolean = false;\n\n /\n Used to control the current state of this provider's hover pane.\n * - `'hidden'` => The hover pane is not present at all.\n * - `'shown'` => The hover pane is either fading in or fully visible.\n * - `'fading-out'` => The hover pane is fading out and about to be removed.\n /\n private hoverPaneState: HoverPaneState = 'hidden';\n\n /* The timer ID for showing the hover pane /\n private showTimer?: number;\n\n /* The timer ID for hiding the hover pane /\n private hideTimer?: number;\n\n /* The timer ID for recognizing a long press event /\n private longPressTimer?: number;\n\n /\n Whether the touch backdrop should currently be rendered irrespective of other touch\n * interactions being enabled.\n /\n private forceTouchBackdrop: boolean = false;\n\n /* A record of the last mouse position on the host element, for positioning the hover pane /\n private lastPointerClientPos = { x: 0, y: 0 };\n\n constructor(\n /* The host element to which this controller should attach listeners /\n private readonly host: ReactiveControllerHost &\n HoverPaneProviderInterface &\n HTMLElement,\n /* Options for adjusting the hover pane behavior (offsets, delays, etc.) /\n options: HoverPaneControllerOptions = {},\n ) {\n this.mobileBreakpoint = options.mobileBreakpoint ?? this.mobileBreakpoint;\n this.offsetX = options.offsetX ?? this.offsetX;\n this.offsetY = options.offsetY ?? this.offsetY;\n this.showDelay = options.showDelay ?? this.showDelay;\n this.hideDelay = options.hideDelay ?? this.hideDelay;\n this.longPressDelay = options.longPressDelay ?? this.longPressDelay;\n this.enableLongPress = options.enableLongPress ?? this.enableLongPress;\n\n this.host.addController(this);\n }\n\n hostConnected(): void {\n this.attachListeners();\n }\n\n hostDisconnected(): void {\n this.detachListeners();\n }\n\n hostUpdated(): void {\n this.hoverPane = this.host.getHoverPane();\n this.hoverPaneProps = this.host.getHoverPaneProps();\n }\n\n /* @inheritdoc /\n getTemplate(): HTMLTemplateResult \| typeof nothing {\n this.hoverPaneProps = this.host.getHoverPaneProps();\n\n return this.shouldRenderHoverPane\n ? html`\n ${this.touchBackdropTemplate}\n <tile-hover-pane\n popover\n tabindex=\"-1\"\n aria-describedby=\"tile-hover-pane-aria-description\"\n .model=${this.hoverPaneProps?.model}\n .baseNavigationUrl=${this.hoverPaneProps?.baseNavigationUrl}\n .baseImageUrl=${this.hoverPaneProps?.baseImageUrl}\n .loggedIn=${this.hoverPaneProps?.loggedIn}\n .suppressBlurring=${this.hoverPaneProps?.suppressBlurring}\n .sortParam=${this.hoverPaneProps?.sortParam}\n .collectionTitles=${this.hoverPaneProps?.collectionTitles}\n .mobileBreakpoint=${this.mobileBreakpoint}\n .currentWidth=${window.innerWidth}\n ></tile-hover-pane>\n <div id=\"tile-hover-pane-aria-description\" class=\"sr-only\">\n ${msg('Press Up Arrow to exit item detail preview')}\n </div>\n `\n : nothing;\n }\n\n /* @inheritdoc /\n toggleHoverPane(options: ToggleHoverPaneOptions): void {\n if (this.hoverPaneState === 'shown') {\n this.fadeOutHoverPane();\n this.forceTouchBackdrop = false;\n } else {\n this.lastPointerClientPos = options.coords;\n this.forceTouchBackdrop = options.enableTouchBackdrop ?? false;\n this.showHoverPane();\n }\n }\n\n /\n Produces a template for the invisible touch capture backdrop that\n * is used to cancel the hover pane on touch devices. We want any\n * touch interaction on the backdrop to remove the hover pane, and\n * we don't want to bubble up mouse events that would otherwise\n * affect the state of the hover pane (e.g., fading it back in).\n /\n private get touchBackdropTemplate(): HTMLTemplateResult \| typeof nothing {\n return this.showTouchBackdrop\n ? html`<div\n id=\"touch-backdrop\"\n @touchstart=${this.handleBackdropInteraction}\n @touchmove=${this.handleBackdropInteraction}\n @touchend=${this.handleBackdropInteraction}\n @touchcancel=${this.handleBackdropInteraction}\n @mouseenter=${(e: MouseEvent) => e.stopPropagation()}\n @mousemove=${(e: MouseEvent) => e.stopPropagation()}\n @mouseleave=${(e: MouseEvent) => e.stopPropagation()}\n ></div>`\n : nothing;\n }\n\n private get showTouchBackdrop(): boolean {\n return (\n (this.isTouchEnabled && this.enableLongPress) \|\| this.forceTouchBackdrop\n );\n }\n\n /* Whether to use the mobile layout /\n private get isMobileView(): boolean {\n return !!this.mobileBreakpoint && window.innerWidth < this.mobileBreakpoint;\n }\n\n private get isHoverEnabled(): boolean {\n return window.matchMedia('(hover: hover)').matches;\n }\n\n private get isTouchEnabled(): boolean {\n return (\n 'ontouchstart' in window &&\n window.matchMedia('(any-pointer: coarse)').matches\n );\n }\n\n /* Whether this controller should currently render its hover pane. /\n private get shouldRenderHoverPane(): boolean {\n return this.hoverPaneState !== 'hidden';\n }\n\n /\n Returns the desired top/left offsets (in pixels) for this tile's hover pane.\n * The desired offsets balance positioning the hover pane under the primary pointer\n * while preventing it from flowing outside the viewport. The returned offsets are\n * relative to the viewport, intended to position the pane as a popover element.\n \n These offsets are only valid if the hover pane is already rendered with its\n * correct width and height. If the hover pane is not present, the returned offsets\n * will simply represent the current pointer position.\n /\n private makePaneDesiredOffsets(anchor: HoverPanePositionAnchor): {\n top: number;\n left: number;\n } {\n // Try to find offsets for the hover pane that:\n // (a) cause it to lie entirely within the viewport, and\n // (b) to the extent possible, minimize the distance between the\n // nearest corner of the hover pane and the mouse/host element position\n // (with some additional offsets applied after the fact).\n\n let [left, top] = [0, 0];\n switch (anchor) {\n case 'host':\n const hostRect = this.host.getBoundingClientRect();\n // slight inset from host top left corner\n left = hostRect.left + 20;\n top = hostRect.top + 30;\n break;\n case 'cursor':\n left = this.lastPointerClientPos.x;\n top = this.lastPointerClientPos.y;\n break;\n }\n\n // Flip the hover pane according to which quadrant of the viewport the coordinates are in.\n // (Similar to how Wikipedia's link hover panes work)\n const flipHorizontal = left > window.innerWidth / 2;\n const flipVertical = top > window.innerHeight / 2;\n\n const hoverPaneRect = this.hoverPane?.getBoundingClientRect();\n if (hoverPaneRect) {\n // If we need to flip the hover pane, do so by subtracting its width/height from left/top\n if (flipHorizontal) {\n left -= hoverPaneRect.width;\n }\n if (flipVertical) {\n top -= hoverPaneRect.height;\n }\n\n // Apply desired offsets from the target position\n left += (flipHorizontal ? -1 : 1) this.offsetX;\n top += (flipVertical ? -1 : 1) * this.offsetY;\n\n // On mobile view, shunt the hover pane to avoid overflowing the viewport\n if (this.isMobileView) {\n left = clamp(left, 20, window.innerWidth - hoverPaneRect.width - 20);\n top = clamp(top, 20, window.innerHeight - hoverPaneRect.height - 20);\n }\n }\n\n left += window.scrollX;\n top += window.scrollY;\n\n return { left, top };\n }\n\n /*\n Adds to the host element all the listeners necessary to make the\n * hover pane functional.\n /\n private attachListeners(): void {\n // keyboard navigation listeners\n this.host.addEventListener('focus', this.handleFocus);\n this.host.addEventListener('blur', this.handleBlur);\n this.host.addEventListener('keyup', this.handleKeyUp);\n this.host.addEventListener('keydown', this.handleKeyDown);\n\n if (this.isHoverEnabled) {\n this.host.addEventListener('mouseenter', this.handleMouseEnter);\n this.host.addEventListener('mousemove', this.handleMouseMove);\n this.host.addEventListener('mouseleave', this.handleMouseLeave);\n }\n\n if (this.isTouchEnabled && this.enableLongPress) {\n this.host.addEventListener('touchstart', this.handleTouchStart);\n this.host.addEventListener('touchmove', this.handleLongPressCancel);\n this.host.addEventListener('touchend', this.handleLongPressCancel);\n this.host.addEventListener('touchcancel', this.handleLongPressCancel);\n this.host.addEventListener('contextmenu', this.handleContextMenu);\n }\n }\n\n /\n Removes all the hover pane listeners from the host element.\n /\n private detachListeners(): void {\n this.host.removeEventListener('mouseenter', this.handleMouseEnter);\n this.host.removeEventListener('mousemove', this.handleMouseMove);\n this.host.removeEventListener('mouseleave', this.handleMouseLeave);\n this.host.removeEventListener('touchstart', this.handleTouchStart);\n this.host.removeEventListener('touchmove', this.handleLongPressCancel);\n this.host.removeEventListener('touchend', this.handleLongPressCancel);\n this.host.removeEventListener('touchcancel', this.handleLongPressCancel);\n this.host.removeEventListener('contextmenu', this.handleContextMenu);\n\n // keyboard navigation listeners\n this.host.removeEventListener('focus', this.handleFocus);\n this.host.removeEventListener('blur', this.handleBlur);\n this.host.removeEventListener('keyup', this.handleKeyUp);\n this.host.removeEventListener('keydown', this.handleKeyDown);\n }\n\n private handleFocus = (): void => {\n if (this.hoverPaneState === 'hidden') {\n this.showHoverPane({\n anchor: 'host',\n });\n }\n };\n\n private handleBlur = (): void => {\n if (this.hoverPaneState !== 'hidden') {\n this.fadeOutHoverPane();\n }\n };\n\n private handleKeyDown = (e: KeyboardEvent): void => {\n if (\n (e.key === 'ArrowDown' \|\| e.key === 'ArrowUp') &&\n this.hoverPaneState !== 'hidden'\n ) {\n e.preventDefault();\n }\n };\n\n private handleKeyUp = (e: KeyboardEvent): void => {\n if (this.hoverPaneState === 'hidden' \|\| !this.hoverPane) return;\n if (e.key === 'ArrowDown') {\n this.hoverPane.tabIndex = 1;\n this.hoverPane.focus();\n }\n\n const isArrowUp = e.key === 'ArrowUp';\n const isEscape = e.key === 'Escape' \|\| e.key === 'Esc';\n\n if (isEscape) {\n this.fadeOutHoverPane();\n }\n if (isArrowUp \|\| isEscape) {\n this.hoverPane.tabIndex = -1;\n this.host.acquireFocus();\n }\n };\n\n /\n Handler for the mouseenter event on the host element.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleMouseEnter = (e: MouseEvent): void => {\n // Delegate to the mousemove handler, as they are currently processed identically\n this.handleMouseMove(e);\n };\n\n /\n Handler for the mousemove event on the host element.\n * Aborts any pending hide/fade-out for the hover pane, and restarts the\n * timer to show it.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleMouseMove = (e: MouseEvent): void => {\n // The mouse is within the tile, so abort any pending removal of the hover pane\n clearTimeout(this.hideTimer);\n\n // If the hover pane is currently fading out, just make it fade back in where it is\n if (this.hoverPaneState === 'fading-out') {\n this.hoverPaneState = 'shown';\n this.hoverPane?.classList.add('fade-in');\n }\n\n // Restart the timer to show the hover pane anytime the mouse moves within the tile\n if (this.hoverPaneState === 'hidden') {\n this.restartShowHoverPaneTimer();\n this.lastPointerClientPos = { x: e.clientX, y: e.clientY };\n }\n };\n\n /\n Handler for the mouseleave event on the host element.\n * Hides the hover pane if present, and aborts the timer for showing it.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleMouseLeave = (): void => {\n this.host.releaseFocus();\n\n // Abort any timer to show the hover pane, as the mouse has left the tile\n clearTimeout(this.showTimer);\n\n // Hide the hover pane if it's already been shown\n if (this.hoverPaneState !== 'hidden') {\n this.hideTimer = window.setTimeout(() => {\n this.fadeOutHoverPane();\n }, this.hideDelay);\n }\n };\n\n /\n Handler for the touchstart event on the host element.\n * Begins the timer for recognizing a long press event.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleTouchStart = (e: TouchEvent): void => {\n clearTimeout(this.longPressTimer);\n\n if (e.touches.length === 1) {\n this.longPressTimer = window.setTimeout(() => {\n if (this.hoverPaneState === 'hidden') {\n this.showHoverPane();\n }\n }, this.longPressDelay);\n\n this.lastPointerClientPos = {\n x: e.touches[0].clientX,\n y: e.touches[0].clientY,\n };\n }\n };\n\n /\n Handler for events that should cancel a pending long press event\n * (touchmove, touchend, touchcancel). Aborts the timer for recognizing\n * a long press.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleLongPressCancel = (): void => {\n clearTimeout(this.longPressTimer);\n };\n\n /\n Handler for the contextmenu event, which should be suppressed during\n * mobile long-press events on the host element.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleContextMenu = (e: Event): void => {\n e.preventDefault();\n };\n\n /\n Immediately causes the hover pane to begin fading out, if it is present.\n /\n // NB: Arrow function so 'this' remains bound to the controller\n private handleBackdropInteraction = (e: Event): void => {\n if (this.hoverPaneState !== 'hidden') {\n this.fadeOutHoverPane();\n }\n e.stopPropagation();\n };\n\n /\n Aborts and restarts the timer for showing the hover pane.\n /\n private restartShowHoverPaneTimer(): void {\n clearTimeout(this.showTimer);\n this.showTimer = window.setTimeout(() => {\n this.host.acquireFocus();\n this.showHoverPane();\n }, this.showDelay);\n }\n\n /\n Causes this tile's hover pane to be rendered, positioned, and made visible.\n /\n private async showHoverPane(\n options: {\n anchor: HoverPanePositionAnchor;\n } = {\n anchor: 'cursor',\n },\n ): Promise<void> {\n this.hoverPaneState = 'shown';\n this.host.requestUpdate();\n\n // Wait for the state update to render the hover pane\n await this.host.updateComplete;\n\n // Ensure the hover pane element is still in the document before showing,\n // as it might have been removed by the previous update.\n if (!this.hoverPane?.isConnected) return;\n\n this.hoverPane?.showPopover?.();\n await new Promise(resolve => {\n // Pane sizes aren't accurate until next frame\n requestAnimationFrame(resolve);\n });\n\n // Apply the correct positioning to the hover pane\n this.repositionHoverPane(options.anchor);\n\n // The hover pane is initially not visible (to avoid it shifting around\n // while being positioned). Since it now has the correct positioning, we\n // can make it visible and begin its fade-in animation.\n this.hoverPane?.classList.add('visible', 'fade-in');\n }\n\n /\n Causes this tile's hover pane to begin fading out and starts\n * the timer for it to be removed.\n /\n private fadeOutHoverPane(): void {\n this.hoverPaneState = 'fading-out';\n this.hoverPane?.classList.remove('fade-in');\n\n clearTimeout(this.hideTimer);\n this.hideTimer = window.setTimeout(() => {\n this.hoverPaneState = 'hidden';\n if (this.hoverPane) {\n this.hoverPane.tabIndex = -1;\n }\n this.host.requestUpdate();\n }, 100);\n }\n\n /\n Positions the hover pane with the correct offsets.\n */\n private repositionHoverPane(anchor: HoverPanePositionAnchor): void {\n if (!this.hoverPane) return;\n\n const { top, left } = this.makePaneDesiredOffsets(anchor);\n\n this.hoverPane.style.top = `${top}px`;\n this.hoverPane.style.left = `${left}px`;\n }\n}\n"]}

package/dist/src/tiles/hover/tile-hover-pane.js CHANGED Viewed

@@ -33,15 +33,16 @@ let TileHoverPane = class TileHoverPane extends LitElement {
     `;
     }
     get headerTemplate() {
+        var _a, _b, _c, _d, _e;
         // early return if item does't have parent collection
-        if (this.model?.collections?.length === 0)
+        if (((_b = (_a = this.model) === null || _a === void 0 ? void 0 : _a.collections) === null || _b === void 0 ? void 0 : _b.length) === 0)
             return nothing;
         let collectionTitle = '';
         let collectionIdentifier = '';
-        for (const collection of this.model?.collections || []) {
+        for (const collection of ((_c = this.model) === null || _c === void 0 ? void 0 : _c.collections) || []) {
             if (!suppressedCollections[collection] &&
                 !collection.startsWith('fav-')) {
-                collectionTitle = this.collectionTitles?.get(collection) ?? collection;
+                collectionTitle = (_e = (_d = this.collectionTitles) === null || _d === void 0 ? void 0 : _d.get(collection)) !== null && _e !== void 0 ? _e : collection;
                 collectionIdentifier = collection;
                 break;
             }

package/dist/src/tiles/hover/tile-hover-pane.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tile-hover-pane.js","sourceRoot":"","sources":["../../../../src/tiles/hover/tile-hover-pane.ts"],"names":[],"mappings":";AACA,OAAO,EACL,GAAG,EAEH,IAAI,EACJ,UAAU,EACV,OAAO,GAER,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,kBAAkB,CAAC;AAE1B,OAAO,EAAE,qBAAqB,EAAkB,MAAM,cAAc,CAAC;AAErE,OAAO,mBAAmB,CAAC;AAGpB,IAAM,aAAa,GAAnB,MAAM,aAAc,SAAQ,UAAU;IAAtC;;QAOwB,aAAQ,GAAY,KAAK,CAAC;QAE1B,qBAAgB,GAAY,KAAK,CAAC;IA6JjE,CAAC;IAlJW,MAAM;QACd,OAAO,IAAI,CAAA;;;YAGH,IAAI,CAAC,cAAc;;;uBAGR,IAAI,CAAC,KAAK;mCACE,IAAI,CAAC,iBAAiB;8BAC3B,IAAI,CAAC,YAAY;0BACrB,IAAI,CAAC,QAAQ;kCACL,IAAI,CAAC,gBAAgB;2BAC5B,IAAI,CAAC,SAAS;kCACP,IAAI,CAAC,gBAAgB;kCACrB,IAAI,CAAC,gBAAgB;8BACzB,IAAI,CAAC,YAAY;;;;;KAK1C,CAAC;IACJ,CAAC;IAED,IAAY,cAAc;QACxB,qDAAqD;QACrD,IAAI,IAAI,CAAC,KAAK,~~EAAE~~,WAAW,~~EAAE~~,MAAM,~~KAAK~~,CAAC;YAAE,OAAO,OAAO,CAAC;QAE1D,IAAI,eAAe,GAAG,EAAE,CAAC;QACzB,IAAI,oBAAoB,GAAG,EAAE,CAAC;QAE9B,KAAK,MAAM,UAAU,IAAI,IAAI,CAAC,KAAK,~~EAAE~~,WAAW,~~IAAI~~,EAAE,EAAE,CAAC;YACvD,IACE,CAAC,qBAAqB,CAAC,UAAU,CAAC;gBAClC,CAAC,UAAU,CAAC,UAAU,CAAC,MAAM,CAAC,EAC9B,CAAC;gBACD,eAAe,GAAG,IAAI,CAAC,gBAAgB,~~EAAE~~,GAAG,CAAC,UAAU,CAAC,~~IAAI~~,UAAU,CAAC;gBACvE,oBAAoB,GAAG,UAAU,CAAC;gBAClC,MAAM;YACR,CAAC;QACH,CAAC;QAED,oFAAoF;QACpF,wBAAwB;QACxB,IAAI,CAAC,oBAAoB;YAAE,OAAO,OAAO,CAAC;QAE1C,OAAO,IAAI,CAAA;;mBAEI,IAAI,CAAC,iBAAiB,YAAY,oBAAoB;;mBAEtD,IAAI,CAAC,YAAY,iBAAiB,oBAAoB;;oBAErD,eAAe;;;KAG9B,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,MAAM,sBAAsB,GAAG,GAAG,CAAA,wCAAwC,CAAC;QAC3E,MAAM,WAAW,GAAG,GAAG,CAAA,qCAAqC,CAAC;QAC7D,MAAM,YAAY,GAAG,GAAG,CAAA,mFAAmF,CAAC;QAE5G,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;sBAsDQ,sBAAsB;;;;;;;;;;;iBAW3B,WAAW;uBACL,YAAY;;;;;;;;;;;;;;;;KAgB9B,CAAC;IACJ,CAAC;CACF,CAAA;AArK6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDAA4B;AAE3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAuB;AAErB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;+CAA2B;AAE1B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uDAAmC;AAEnC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAuB;AAEtB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDAA2B;AAE1B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAuB;AAGlD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDACS;AAlBzB,aAAa;IADzB,aAAa,CAAC,iBAAiB,CAAC;GACpB,aAAa,CAsKzB","sourcesContent":["import type { SortParam } from '@internetarchive/search-service';\nimport {\n css,\n CSSResultGroup,\n html,\n LitElement,\n nothing,\n TemplateResult,\n} from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport '@a11y/focus-trap';\n\nimport { suppressedCollections, type TileModel } from '../../models';\nimport type { CollectionTitles } from '../../data-source/models';\nimport '../list/tile-list';\n\n@customElement('tile-hover-pane')\nexport class TileHoverPane extends LitElement {\n @property({ type: Object }) model?: TileModel;\n\n @property({ type: String }) baseNavigationUrl?: string;\n\n @property({ type: String }) baseImageUrl?: string;\n\n @property({ type: Boolean }) loggedIn: boolean = false;\n\n @property({ type: Boolean }) suppressBlurring: boolean = false;\n\n @property({ type: Object }) sortParam?: SortParam;\n\n @property({ type: Number }) mobileBreakpoint?: number;\n\n @property({ type: Number }) currentWidth?: number;\n\n @property({ type: Object })\n collectionTitles?: CollectionTitles;\n\n protected render(): TemplateResult {\n return html`\n <div id=\"container\">\n <focus-trap>\n ${this.headerTemplate}\n <div id=\"hover-tile-list\">\n <tile-list\n .model=${this.model}\n .baseNavigationUrl=${this.baseNavigationUrl}\n .baseImageUrl=${this.baseImageUrl}\n .loggedIn=${this.loggedIn}\n .suppressBlurring=${this.suppressBlurring}\n .sortParam=${this.sortParam}\n .collectionTitles=${this.collectionTitles}\n .mobileBreakpoint=${this.mobileBreakpoint}\n .currentWidth=${this.currentWidth}\n ></tile-list>\n </div>\n </focus-trap>\n </div>\n `;\n }\n\n private get headerTemplate(): TemplateResult \| typeof nothing {\n // early return if item does't have parent collection\n if (this.model?.collections?.length === 0) return nothing;\n\n let collectionTitle = '';\n let collectionIdentifier = '';\n\n for (const collection of this.model?.collections \|\| []) {\n if (\n !suppressedCollections[collection] &&\n !collection.startsWith('fav-')\n ) {\n collectionTitle = this.collectionTitles?.get(collection) ?? collection;\n collectionIdentifier = collection;\n break;\n }\n }\n\n // sometimes item does have collections but they are in suppressed or favorite list,\n // let's not render that\n if (!collectionIdentifier) return nothing;\n\n return html`\n <div id=\"list-line-header\">\n <a href=\"${this.baseNavigationUrl}/details/${collectionIdentifier}\">\n <img\n src=\"${this.baseImageUrl}/services/img/${collectionIdentifier}\"\n alt=\"\"\n /><span>${collectionTitle}</span>\n </a>\n </div>\n `;\n }\n\n static get styles(): CSSResultGroup {\n const hoverPaneHeaderBGColor = css`var(--hoverPaneHeaderBGColor, #edf0ff)`;\n const iaLinkColor = css`var(--ia-theme-link-color, #4b64ff)`;\n const iaFontFamily = css`var(--ia-theme-base-font-family, \"Helvetica Neue\", Helvetica, Arial, sans-serif);`;\n\n return css`\n :host {\n margin: 0;\n border: 0;\n padding: 0;\n overflow: visible;\n color: inherit;\n background: none;\n visibility: hidden;\n opacity: 0;\n transform: translateY(8px);\n transition:\n opacity 0.1s ease-in,\n transform 0.1s ease-in;\n --image-width: auto;\n }\n\n :host(.visible) {\n visibility: visible;\n }\n\n :host(.fade-in) {\n opacity: 1;\n transform: translateY(0);\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host {\n transition-duration: 0.001s !important; /* Imperceptibly fast /\n }\n }\n\n #container {\n width: max-content;\n max-width: min(45vw, 600px);\n border: 1px solid #ddd;\n border-radius: 4px;\n box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.8);\n background: white;\n }\n\n @media screen and (max-width: 600px) {\n #container {\n max-width: 80vw;\n }\n }\n\n / main tile-list container /\n #hover-tile-list {\n padding: 10px;\n }\n\n / header on hover panel to show collection icon and title */\n #list-line-header {\n background: ${hoverPaneHeaderBGColor};\n }\n #list-line-header a {\n display: flex;\n align-items: center;\n column-gap: 5px;\n height: 3.4rem;\n padding: 0 10px;\n border-radius: 4px 4px 0 0;\n width: fit-content;\n font-size: 1.4rem;\n color: ${iaLinkColor};\n font-family: ${iaFontFamily};\n text-decoration: none;\n width: auto;\n }\n #list-line-header a span {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n #list-line-header a:hover {\n text-decoration: underline;\n }\n #list-line-header a img {\n width: 30px;\n max-height: 30px;\n }\n `;\n }\n}\n"]}
1	+ {"version":3,"file":"tile-hover-pane.js","sourceRoot":"","sources":["../../../../src/tiles/hover/tile-hover-pane.ts"],"names":[],"mappings":"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","sourcesContent":["import type { SortParam } from '@internetarchive/search-service';\nimport {\n css,\n CSSResultGroup,\n html,\n LitElement,\n nothing,\n TemplateResult,\n} from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport '@a11y/focus-trap';\n\nimport { suppressedCollections, type TileModel } from '../../models';\nimport type { CollectionTitles } from '../../data-source/models';\nimport '../list/tile-list';\n\n@customElement('tile-hover-pane')\nexport class TileHoverPane extends LitElement {\n @property({ type: Object }) model?: TileModel;\n\n @property({ type: String }) baseNavigationUrl?: string;\n\n @property({ type: String }) baseImageUrl?: string;\n\n @property({ type: Boolean }) loggedIn: boolean = false;\n\n @property({ type: Boolean }) suppressBlurring: boolean = false;\n\n @property({ type: Object }) sortParam?: SortParam;\n\n @property({ type: Number }) mobileBreakpoint?: number;\n\n @property({ type: Number }) currentWidth?: number;\n\n @property({ type: Object })\n collectionTitles?: CollectionTitles;\n\n protected render(): TemplateResult {\n return html`\n <div id=\"container\">\n <focus-trap>\n ${this.headerTemplate}\n <div id=\"hover-tile-list\">\n <tile-list\n .model=${this.model}\n .baseNavigationUrl=${this.baseNavigationUrl}\n .baseImageUrl=${this.baseImageUrl}\n .loggedIn=${this.loggedIn}\n .suppressBlurring=${this.suppressBlurring}\n .sortParam=${this.sortParam}\n .collectionTitles=${this.collectionTitles}\n .mobileBreakpoint=${this.mobileBreakpoint}\n .currentWidth=${this.currentWidth}\n ></tile-list>\n </div>\n </focus-trap>\n </div>\n `;\n }\n\n private get headerTemplate(): TemplateResult \| typeof nothing {\n // early return if item does't have parent collection\n if (this.model?.collections?.length === 0) return nothing;\n\n let collectionTitle = '';\n let collectionIdentifier = '';\n\n for (const collection of this.model?.collections \|\| []) {\n if (\n !suppressedCollections[collection] &&\n !collection.startsWith('fav-')\n ) {\n collectionTitle = this.collectionTitles?.get(collection) ?? collection;\n collectionIdentifier = collection;\n break;\n }\n }\n\n // sometimes item does have collections but they are in suppressed or favorite list,\n // let's not render that\n if (!collectionIdentifier) return nothing;\n\n return html`\n <div id=\"list-line-header\">\n <a href=\"${this.baseNavigationUrl}/details/${collectionIdentifier}\">\n <img\n src=\"${this.baseImageUrl}/services/img/${collectionIdentifier}\"\n alt=\"\"\n /><span>${collectionTitle}</span>\n </a>\n </div>\n `;\n }\n\n static get styles(): CSSResultGroup {\n const hoverPaneHeaderBGColor = css`var(--hoverPaneHeaderBGColor, #edf0ff)`;\n const iaLinkColor = css`var(--ia-theme-link-color, #4b64ff)`;\n const iaFontFamily = css`var(--ia-theme-base-font-family, \"Helvetica Neue\", Helvetica, Arial, sans-serif);`;\n\n return css`\n :host {\n margin: 0;\n border: 0;\n padding: 0;\n overflow: visible;\n color: inherit;\n background: none;\n visibility: hidden;\n opacity: 0;\n transform: translateY(8px);\n transition:\n opacity 0.1s ease-in,\n transform 0.1s ease-in;\n --image-width: auto;\n }\n\n :host(.visible) {\n visibility: visible;\n }\n\n :host(.fade-in) {\n opacity: 1;\n transform: translateY(0);\n }\n\n @media (prefers-reduced-motion: reduce) {\n :host {\n transition-duration: 0.001s !important; /* Imperceptibly fast /\n }\n }\n\n #container {\n width: max-content;\n max-width: min(45vw, 600px);\n border: 1px solid #ddd;\n border-radius: 4px;\n box-shadow: 4px 4px 8px 0 rgba(0, 0, 0, 0.8);\n background: white;\n }\n\n @media screen and (max-width: 600px) {\n #container {\n max-width: 80vw;\n }\n }\n\n / main tile-list container /\n #hover-tile-list {\n padding: 10px;\n }\n\n / header on hover panel to show collection icon and title */\n #list-line-header {\n background: ${hoverPaneHeaderBGColor};\n }\n #list-line-header a {\n display: flex;\n align-items: center;\n column-gap: 5px;\n height: 3.4rem;\n padding: 0 10px;\n border-radius: 4px 4px 0 0;\n width: fit-content;\n font-size: 1.4rem;\n color: ${iaLinkColor};\n font-family: ${iaFontFamily};\n text-decoration: none;\n width: auto;\n }\n #list-line-header a span {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n #list-line-header a:hover {\n text-decoration: underline;\n }\n #list-line-header a img {\n width: 30px;\n max-height: 30px;\n }\n `;\n }\n}\n"]}

package/dist/src/tiles/image-block.js CHANGED Viewed

@@ -14,7 +14,8 @@ let ImageBlock = class ImageBlock extends LitElement {
         this.viewSize = 'desktop';
     }
     render() {
-        if (!this.model?.identifier)
+        var _a;
+        if (!((_a = this.model) === null || _a === void 0 ? void 0 : _a.identifier))
             return nothing;
         return html `
       <div class=${classMap(this.baseClass)}>
@@ -33,13 +34,14 @@ let ImageBlock = class ImageBlock extends LitElement {
     `;
     }
     get baseClass() {
+        var _a, _b;
         return {
             container: true,
             list: this.isListTile && !this.isCompactTile,
             'list-compact': this.isListTile && this.isCompactTile,
-            collection: this.model?.mediatype === 'collection', // fill the image in container
+            collection: ((_a = this.model) === null || _a === void 0 ? void 0 : _a.mediatype) === 'collection', // fill the image in container
             [this.viewSize]: true,
-            'search-image': this.model?.mediatype === 'search',
+            'search-image': ((_b = this.model) === null || _b === void 0 ? void 0 : _b.mediatype) === 'search',
         };
     }
     get iconOverlayTemplate() {
@@ -67,15 +69,16 @@ let ImageBlock = class ImageBlock extends LitElement {
         return html ` <text-overlay .type=${this.overlayType}></text-overlay> `;
     }
     get overlayType() {
+        var _a, _b;
         if (this.suppressBlurring)
             return undefined;
         // Prioritize showing the login-required overlay if needed.
         // Otherwise, if a content warning is required, show that overlay instead.
         // If neither flag is present, no overlay should be shown.
-        if (this.model?.loginRequired && !this.loggedIn) {
+        if (((_a = this.model) === null || _a === void 0 ? void 0 : _a.loginRequired) && !this.loggedIn) {
             return 'login-required';
         }
-        if (this.model?.contentWarning) {
+        if ((_b = this.model) === null || _b === void 0 ? void 0 : _b.contentWarning) {
             return 'content-warning';
         }
         return undefined;

package/dist/src/tiles/image-block.js.map CHANGED Viewed

	@@ -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;AAGzB,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,UAAU;IAAnC;;QAGwB,kBAAa,GAAG,KAAK,CAAC;QAEtB,eAAU,GAAG,KAAK,CAAC;QAEnB,aAAQ,GAAG,KAAK,CAAC;QAEjB,qBAAgB,GAAG,KAAK,CAAC;QAI1B,aAAQ,GAAW,SAAS,CAAC;IA0I3D,CAAC;IAxIC,MAAM;QACJ,IAAI,CAAC,IAAI,CAAC,KAAK,~~EAAE~~,UAAU;YAAE,OAAO,OAAO,CAAC;QAE5C,OAAO,IAAI,CAAA;mBACI,QAAQ,CAAC,IAAI,CAAC,SAAS,CAAC;;mBAExB,IAAI,CAAC,KAAK;0BACH,IAAI,CAAC,YAAY;wBACnB,IAAI,CAAC,UAAU;2BACZ,IAAI,CAAC,aAAa;sBACvB,IAAI,CAAC,QAAQ;8BACL,IAAI,CAAC,gBAAgB;;;;UAIzC,IAAI,CAAC,mBAAmB,IAAI,IAAI,CAAC,mBAAmB;;KAEzD,CAAC;IACJ,CAAC;IAED,IAAY,SAAS;QACnB,OAAO;YACL,SAAS,EAAE,IAAI;YACf,IAAI,EAAE,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,aAAa;YAC5C,cAAc,EAAE,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,aAAa;YACrD,UAAU,EAAE,IAAI,CAAC,KAAK,~~EAAE~~,SAAS,~~KAAK~~,YAAY,EAAE,8BAA8B;YAClF,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,IAAI;YACrB,cAAc,EAAE,IAAI,CAAC,KAAK,~~EAAE~~,SAAS,~~KAAK~~,QAAQ;SACnD,CAAC;IACJ,CAAC;IAED,IAAY,mBAAmB;QAC7B,uCAAuC;QACvC,IAAI,CAAC,IAAI,CAAC,UAAU;YAAE,OAAO,OAAO,CAAC;QAErC,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC;QAC7B,IAAI,CAAC,WAAW;YAAE,OAAO,OAAO,CAAC;QAEjC,OAAO,IAAI,CAAA;;gBAEC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,aAAa;gBACnD,IAAI,CAAC,WAAW;;;KAG3B,CAAC;IACJ,CAAC;IAED,IAAY,mBAAmB;QAC7B,6CAA6C;QAC7C,IAAI,IAAI,CAAC,UAAU;YAAE,OAAO,OAAO,CAAC;QAEpC,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC;QAC7B,IAAI,CAAC,WAAW;YAAE,OAAO,OAAO,CAAC;QAEjC,OAAO,IAAI,CAAA,wBAAwB,IAAI,CAAC,WAAW,mBAAmB,CAAC;IACzE,CAAC;IAED,IAAY,WAAW;QACrB,IAAI,IAAI,CAAC,gBAAgB;YAAE,OAAO,SAAS,CAAC;QAE5C,2DAA2D;QAC3D,0EAA0E;QAC1E,0DAA0D;QAC1D,IAAI,IAAI,CAAC,KAAK,~~EAAE~~,aAAa,~~IAAI~~,CAAC,IAAI,CAAC,QAAQ,EAAE,CAAC;YAChD,OAAO,gBAAgB,CAAC;QAC1B,CAAC;QACD,IAAI,IAAI,CAAC,KAAK,~~EAAE~~,cAAc,EAAE,CAAC;YAC/B,OAAO,iBAAiB,CAAC;QAC3B,CAAC;QACD,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,MAAM,KAAK,MAAM;QACf,MAAM,yBAAyB,GAAG,GAAG,CAAA,2CAA2C,CAAC;QAEjF,OAAO,GAAG,CAAA;;;;;4BAKc,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAsDhD,CAAC;IACJ,CAAC;CACF,CAAA;AAtJ6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;gDAAuB;AAErB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iDAAuB;AAEtB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;8CAAoB;AAEnB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;4CAAkB;AAEjB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;oDAA0B;AAE1B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAA8B;AAb9C,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,CAuJtB","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: Boolean }) suppressBlurring = 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 .suppressBlurring=${this.suppressBlurring}\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 if (this.suppressBlurring) return undefined;\n\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"]}
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: Boolean }) suppressBlurring = 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 .suppressBlurring=${this.suppressBlurring}\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 if (this.suppressBlurring) return undefined;\n\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/dist/src/tiles/item-image.js CHANGED Viewed

@@ -20,7 +20,8 @@ let ItemImage = class ItemImage extends LitElement {
     `;
     }
     get imageTemplate() {
-        if (this.model?.mediatype === 'search') {
+        var _a;
+        if (((_a = this.model) === null || _a === void 0 ? void 0 : _a.mediatype) === 'search') {
             return html `${searchIcon}`;
         }
         return html `
@@ -37,10 +38,11 @@ let ItemImage = class ItemImage extends LitElement {
      * Helpers
      */
     get imageSrc() {
+        var _a, _b, _c;
         if (this.isNotFound)
             return this.notFoundSrc;
         // Use the correct image for web capture tiles, if possible
-        if (this.model?.captureDates && this.model.identifier) {
+        if (((_a = this.model) === null || _a === void 0 ? void 0 : _a.captureDates) && this.model.identifier) {
             try {
                 const url = new URL(this.model.identifier);
                 const domain = encodeURIComponent(url.hostname);
@@ -48,15 +50,15 @@ let ItemImage = class ItemImage extends LitElement {
                     ? `https://web.archive.org/thumb/${domain}?generate=1`
                     : nothing;
             }
-            catch {
+            catch (_d) {
                 return `${this.baseImageUrl}/images/notfound.png`;
             }
         }
         // Use the thumbnail URL specified in the model if it exists
-        if (this.model?.thumbnailUrl)
+        if ((_b = this.model) === null || _b === void 0 ? void 0 : _b.thumbnailUrl)
             return this.model.thumbnailUrl;
         // Don't try to load invalid image URLs
-        return this.baseImageUrl && this.model?.identifier
+        return this.baseImageUrl && ((_c = this.model) === null || _c === void 0 ? void 0 : _c.identifier)
             ? `${this.baseImageUrl}/services/img/${this.model.identifier}`
             : nothing;
     }
@@ -66,7 +68,8 @@ let ItemImage = class ItemImage extends LitElement {
             : nothing;
     }
     get hashBasedGradient() {
-        if (!this.model?.identifier) {
+        var _a;
+        if (!((_a = this.model) === null || _a === void 0 ? void 0 : _a.identifier)) {
             return 'waveform-grad0';
         }
         const gradient = this.hashStrToInt(this.model.identifier) % 6; // returns 0-5
@@ -81,15 +84,17 @@ let ItemImage = class ItemImage extends LitElement {
      * Classes
      */
     get itemBaseClass() {
+        var _a;
         return {
             'drop-shadow': true,
             'list-box': this.isListTile,
-            'search-image': this.model?.mediatype === 'search',
+            'search-image': ((_a = this.model) === null || _a === void 0 ? void 0 : _a.mediatype) === 'search',
             [this.hashBasedGradient]: this.isWaveform,
         };
     }
     get itemImageClass() {
-        const hasSensitiveContent = !!(this.model?.contentWarning || this.model?.loginRequired);
+        var _a, _b, _c;
+        const hasSensitiveContent = !!(((_a = this.model) === null || _a === void 0 ? void 0 : _a.contentWarning) || ((_b = this.model) === null || _b === void 0 ? void 0 : _b.loginRequired));
         const shouldBlur = hasSensitiveContent && !this.suppressBlurring;
         return {
             contain: !this.isCompactTile && !this.isWaveform,
@@ -97,14 +102,15 @@ let ItemImage = class ItemImage extends LitElement {
             blur: shouldBlur,
             waveform: this.isWaveform,
             'account-image': this.isAccountImage, // for account tile image
-            'collection-image': this.model?.mediatype === 'collection', // for collection tile image
+            'collection-image': ((_c = this.model) === null || _c === void 0 ? void 0 : _c.mediatype) === 'collection', // for collection tile image
         };
     }
     /**
      * Helper function to determine if account tile image
      */
     get isAccountImage() {
-        return (this.model?.mediatype === 'account' &&
+        var _a;
+        return (((_a = this.model) === null || _a === void 0 ? void 0 : _a.mediatype) === 'account' &&
             !this.isCompactTile &&
             !this.isListTile);
     }
@@ -112,8 +118,9 @@ let ItemImage = class ItemImage extends LitElement {
      * Event listener sets isWaveform true if image is waveform
      */
     onLoad() {
-        if ((this.model?.mediatype === 'audio' ||
-            this.model?.mediatype === 'etree') &&
+        var _a, _b;
+        if ((((_a = this.model) === null || _a === void 0 ? void 0 : _a.mediatype) === 'audio' ||
+            ((_b = this.model) === null || _b === void 0 ? void 0 : _b.mediatype) === 'etree') &&
             this.baseImage.naturalWidth / this.baseImage.naturalHeight === 4) {
             this.isWaveform = true;
         }

package/dist/src/tiles/item-image.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"item-image.js","sourceRoot":"","sources":["../../../src/tiles/item-image.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAa,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAIlE,OAAO,EACL,mBAAmB,EACnB,sBAAsB,GACvB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAG3D,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAAlC;;QAKwB,eAAU,GAAG,KAAK,CAAC;QAEnB,kBAAa,GAAG,KAAK,CAAC;QAEtB,aAAQ,GAAG,KAAK,CAAC;QAEjB,qBAAgB,GAAG,KAAK,CAAC;QAErC,eAAU,GAAG,KAAK,CAAC;QAEnB,eAAU,GAAG,KAAK,CAAC;IA8JtC,CAAC;IA1JC,MAAM;QACJ,OAAO,IAAI,CAAA;mBACI,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,IAAI,CAAC,aAAa;KAChE,CAAC;IACJ,CAAC;IAED,IAAY,aAAa;QACvB,IAAI,IAAI,CAAC,KAAK,~~EAAE~~,SAAS,~~KAAK~~,QAAQ,EAAE,CAAC;YACvC,OAAO,IAAI,CAAA,GAAG,UAAU,EAAE,CAAC;QAC7B,CAAC;QAED,OAAO,IAAI,CAAA;;gBAEC,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC;eAC9B,IAAI,CAAC,QAAQ;;gBAEZ,IAAI,CAAC,MAAM;iBACV,IAAI,CAAC,OAAO;;KAExB,CAAC;IACJ,CAAC;IAED;;OAEG;IACH,IAAY,QAAQ;QAClB,IAAI,IAAI,CAAC,UAAU;YAAE,OAAO,IAAI,CAAC,WAAW,CAAC;QAE7C,2DAA2D;QAC3D,IAAI,IAAI,CAAC,KAAK,~~EAAE~~,YAAY,~~IAAI~~,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE,CAAC;YACtD,IAAI,CAAC;gBACH,MAAM,GAAG,GAAG,IAAI,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC;gBAC3C,MAAM,MAAM,GAAG,kBAAkB,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;gBAChD,OAAO,IAAI,CAAC,YAAY;oBACtB,CAAC,CAAC,iCAAiC,MAAM,aAAa;oBACtD,CAAC,CAAC,OAAO,CAAC;YACd,CAAC;YAAC,~~MAAM~~,CAAC;gBACP,OAAO,GAAG,IAAI,CAAC,YAAY,sBAAsB,CAAC;YACpD,CAAC;QACH,CAAC;QAED,4DAA4D;QAC5D,IAAI,IAAI,CAAC,KAAK,~~EAAE~~,YAAY;YAAE,OAAO,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;QAE7D,uCAAuC;QACvC,OAAO,IAAI,CAAC,YAAY,~~IAAI~~,IAAI,CAAC,KAAK,~~EAAE~~,UAAU;YAChD,CAAC,CAAC,GAAG,IAAI,CAAC,YAAY,iBAAiB,IAAI,CAAC,KAAK,CAAC,UAAU,EAAE;YAC9D,CAAC,CAAC,OAAO,CAAC;IACd,CAAC;IAED,IAAY,WAAW;QACrB,OAAO,IAAI,CAAC,YAAY;YACtB,CAAC,CAAC,GAAG,IAAI,CAAC,YAAY,sBAAsB;YAC5C,CAAC,CAAC,OAAO,CAAC;IACd,CAAC;IAED,IAAY,iBAAiB;QAC3B,IAAI,CAAC,IAAI,CAAC,KAAK,~~EAAE~~,UAAU,EAAE,CAAC;YAC5B,OAAO,gBAAgB,CAAC;QAC1B,CAAC;QACD,MAAM,QAAQ,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,cAAc;QAC7E,OAAO,gBAAgB,QAAQ,EAAE,CAAC;IACpC,CAAC;IAEO,YAAY,CAAC,GAAW;QAC9B,OAAO,GAAG;aACP,KAAK,CAAC,EAAE,CAAC;aACT,MAAM,CAAC,CAAC,GAAW,EAAE,IAAY,EAAE,EAAE,CAAC,GAAG,GAAG,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACxE,CAAC;IAED;;OAEG;IACH,IAAY,aAAa;QACvB,OAAO;YACL,aAAa,EAAE,IAAI;YACnB,UAAU,EAAE,IAAI,CAAC,UAAU;YAC3B,cAAc,EAAE,IAAI,CAAC,KAAK,~~EAAE~~,SAAS,~~KAAK~~,QAAQ;YAClD,CAAC,IAAI,CAAC,iBAAiB,CAAC,EAAE,IAAI,CAAC,UAAU;SAC1C,CAAC;IACJ,CAAC;IAED,IAAY,cAAc;QACxB,MAAM,mBAAmB,GAAG,CAAC,CAAC,CAC5B,IAAI,CAAC,KAAK,~~EAAE~~,cAAc,~~IAAI~~,IAAI,CAAC,KAAK,~~EAAE~~,aAAa,CACxD,CAAC;QACF,MAAM,UAAU,GAAG,mBAAmB,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC;QAEjE,OAAO;YACL,OAAO,EAAE,CAAC,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,UAAU;YAChD,KAAK,EAAE,IAAI,CAAC,aAAa;YACzB,IAAI,EAAE,UAAU;YAChB,QAAQ,EAAE,IAAI,CAAC,UAAU;YACzB,eAAe,EAAE,IAAI,CAAC,cAAc,EAAE,yBAAyB;YAC/D,kBAAkB,EAAE,IAAI,CAAC,KAAK,~~EAAE~~,SAAS,~~KAAK~~,YAAY,EAAE,4BAA4B;SACzF,CAAC;IACJ,CAAC;IAED;;OAEG;IACH,IAAY,cAAc;QACxB,OAAO,CACL,IAAI,CAAC,KAAK,~~EAAE~~,SAAS,~~KAAK~~,SAAS;YACnC,CAAC,IAAI,CAAC,aAAa;YACnB,CAAC,IAAI,CAAC,UAAU,CACjB,CAAC;IACJ,CAAC;IAED;;OAEG;IACK,MAAM;QACZ,IACE,CAAC,IAAI,CAAC,KAAK,~~EAAE~~,SAAS,~~KAAK~~,OAAO;YAChC,IAAI,CAAC,KAAK,~~EAAE~~,SAAS,~~KAAK~~,OAAO,CAAC;YACpC,IAAI,CAAC,SAAS,CAAC,YAAY,GAAG,IAAI,CAAC,SAAS,CAAC,aAAa,KAAK,CAAC,EAChE,CAAC;YACD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACzB,CAAC;IACH,CAAC;IAEO,OAAO;QACb,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;IACzB,CAAC;IAED;;OAEG;IACH,MAAM,KAAK,MAAM;QACf,OAAO;YACL,mBAAmB;YACnB,sBAAsB;YACtB,GAAG,CAAA;;;;;;;;;;;;;;;;;;OAkBF;SACF,CAAC;IACJ,CAAC;CACF,CAAA;AA5K6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAuB;AAErB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAoB;AAEnB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;gDAAuB;AAEtB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2CAAkB;AAEjB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;mDAA0B;AAErC;IAAhB,KAAK,EAAE;6CAA4B;AAEnB;IAAhB,KAAK,EAAE;6CAA4B;AAEd;IAArB,KAAK,CAAC,KAAK,CAAC;4CAAsC;AAjBxC,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CA6KrB","sourcesContent":["import { css, CSSResultGroup, html, LitElement, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\n\nimport type { TileModel } from '../models';\n\nimport {\n baseItemImageStyles,\n waveformGradientStyles,\n} from '../styles/item-image-styles';\nimport { searchIcon } from '../assets/img/icons/mediatype/search';\n\n@customElement('item-image')\nexport class ItemImage extends LitElement {\n @property({ type: Object }) model?: TileModel;\n\n @property({ type: String }) baseImageUrl?: string;\n\n @property({ type: Boolean }) isListTile = false;\n\n @property({ type: Boolean }) isCompactTile = false;\n\n @property({ type: Boolean }) loggedIn = false;\n\n @property({ type: Boolean }) suppressBlurring = false;\n\n @state() private isWaveform = false;\n\n @state() private isNotFound = false;\n\n @query('img') private baseImage!: HTMLImageElement;\n\n render() {\n return html`\n <div class=${classMap(this.itemBaseClass)}>${this.imageTemplate}</div>\n `;\n }\n\n private get imageTemplate() {\n if (this.model?.mediatype === 'search') {\n return html`${searchIcon}`;\n }\n\n return html`\n <img\n class=${classMap(this.itemImageClass)}\n src=\"${this.imageSrc}\"\n alt=\"\"\n @load=${this.onLoad}\n @error=${this.onError}\n />\n `;\n }\n\n /*\n Helpers\n /\n private get imageSrc() {\n if (this.isNotFound) return this.notFoundSrc;\n\n // Use the correct image for web capture tiles, if possible\n if (this.model?.captureDates && this.model.identifier) {\n try {\n const url = new URL(this.model.identifier);\n const domain = encodeURIComponent(url.hostname);\n return this.baseImageUrl\n ? `https://web.archive.org/thumb/${domain}?generate=1`\n : nothing;\n } catch {\n return `${this.baseImageUrl}/images/notfound.png`;\n }\n }\n\n // Use the thumbnail URL specified in the model if it exists\n if (this.model?.thumbnailUrl) return this.model.thumbnailUrl;\n\n // Don't try to load invalid image URLs\n return this.baseImageUrl && this.model?.identifier\n ? `${this.baseImageUrl}/services/img/${this.model.identifier}`\n : nothing;\n }\n\n private get notFoundSrc() {\n return this.baseImageUrl\n ? `${this.baseImageUrl}/images/notfound.png`\n : nothing;\n }\n\n private get hashBasedGradient() {\n if (!this.model?.identifier) {\n return 'waveform-grad0';\n }\n const gradient = this.hashStrToInt(this.model.identifier) % 6; // returns 0-5\n return `waveform-grad${gradient}`;\n }\n\n private hashStrToInt(str: string): number {\n return str\n .split('')\n .reduce((acc: number, char: string) => acc + char.charCodeAt(0), 0);\n }\n\n /\n Classes\n /\n private get itemBaseClass(): ClassInfo {\n return {\n 'drop-shadow': true,\n 'list-box': this.isListTile,\n 'search-image': this.model?.mediatype === 'search',\n [this.hashBasedGradient]: this.isWaveform,\n };\n }\n\n private get itemImageClass(): ClassInfo {\n const hasSensitiveContent = !!(\n this.model?.contentWarning \|\| this.model?.loginRequired\n );\n const shouldBlur = hasSensitiveContent && !this.suppressBlurring;\n\n return {\n contain: !this.isCompactTile && !this.isWaveform,\n cover: this.isCompactTile,\n blur: shouldBlur,\n waveform: this.isWaveform,\n 'account-image': this.isAccountImage, // for account tile image\n 'collection-image': this.model?.mediatype === 'collection', // for collection tile image\n };\n }\n\n /\n Helper function to determine if account tile image\n /\n private get isAccountImage() {\n return (\n this.model?.mediatype === 'account' &&\n !this.isCompactTile &&\n !this.isListTile\n );\n }\n\n /\n Event listener sets isWaveform true if image is waveform\n /\n private onLoad() {\n if (\n (this.model?.mediatype === 'audio' \|\|\n this.model?.mediatype === 'etree') &&\n this.baseImage.naturalWidth / this.baseImage.naturalHeight === 4\n ) {\n this.isWaveform = true;\n }\n }\n\n private onError() {\n this.isNotFound = true;\n }\n\n /\n CSS\n */\n static get styles(): CSSResultGroup {\n return [\n baseItemImageStyles,\n waveformGradientStyles,\n css`\n img {\n height: var(--imgHeight, 16rem);\n width: var(--imgWidth, 16rem);\n }\n\n .search-image {\n display: flex;\n align-items: center;\n justify-content: center;\n background: rgb(245, 245, 247);\n border-radius: 4px;\n }\n\n svg {\n height: 10rem;\n width: 10rem;\n }\n `,\n ];\n }\n}\n"]}
1	+ {"version":3,"file":"item-image.js","sourceRoot":"","sources":["../../../src/tiles/item-image.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, CSSResultGroup, html, LitElement, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js';\n\nimport type { TileModel } from '../models';\n\nimport {\n baseItemImageStyles,\n waveformGradientStyles,\n} from '../styles/item-image-styles';\nimport { searchIcon } from '../assets/img/icons/mediatype/search';\n\n@customElement('item-image')\nexport class ItemImage extends LitElement {\n @property({ type: Object }) model?: TileModel;\n\n @property({ type: String }) baseImageUrl?: string;\n\n @property({ type: Boolean }) isListTile = false;\n\n @property({ type: Boolean }) isCompactTile = false;\n\n @property({ type: Boolean }) loggedIn = false;\n\n @property({ type: Boolean }) suppressBlurring = false;\n\n @state() private isWaveform = false;\n\n @state() private isNotFound = false;\n\n @query('img') private baseImage!: HTMLImageElement;\n\n render() {\n return html`\n <div class=${classMap(this.itemBaseClass)}>${this.imageTemplate}</div>\n `;\n }\n\n private get imageTemplate() {\n if (this.model?.mediatype === 'search') {\n return html`${searchIcon}`;\n }\n\n return html`\n <img\n class=${classMap(this.itemImageClass)}\n src=\"${this.imageSrc}\"\n alt=\"\"\n @load=${this.onLoad}\n @error=${this.onError}\n />\n `;\n }\n\n /*\n Helpers\n /\n private get imageSrc() {\n if (this.isNotFound) return this.notFoundSrc;\n\n // Use the correct image for web capture tiles, if possible\n if (this.model?.captureDates && this.model.identifier) {\n try {\n const url = new URL(this.model.identifier);\n const domain = encodeURIComponent(url.hostname);\n return this.baseImageUrl\n ? `https://web.archive.org/thumb/${domain}?generate=1`\n : nothing;\n } catch {\n return `${this.baseImageUrl}/images/notfound.png`;\n }\n }\n\n // Use the thumbnail URL specified in the model if it exists\n if (this.model?.thumbnailUrl) return this.model.thumbnailUrl;\n\n // Don't try to load invalid image URLs\n return this.baseImageUrl && this.model?.identifier\n ? `${this.baseImageUrl}/services/img/${this.model.identifier}`\n : nothing;\n }\n\n private get notFoundSrc() {\n return this.baseImageUrl\n ? `${this.baseImageUrl}/images/notfound.png`\n : nothing;\n }\n\n private get hashBasedGradient() {\n if (!this.model?.identifier) {\n return 'waveform-grad0';\n }\n const gradient = this.hashStrToInt(this.model.identifier) % 6; // returns 0-5\n return `waveform-grad${gradient}`;\n }\n\n private hashStrToInt(str: string): number {\n return str\n .split('')\n .reduce((acc: number, char: string) => acc + char.charCodeAt(0), 0);\n }\n\n /\n Classes\n /\n private get itemBaseClass(): ClassInfo {\n return {\n 'drop-shadow': true,\n 'list-box': this.isListTile,\n 'search-image': this.model?.mediatype === 'search',\n [this.hashBasedGradient]: this.isWaveform,\n };\n }\n\n private get itemImageClass(): ClassInfo {\n const hasSensitiveContent = !!(\n this.model?.contentWarning \|\| this.model?.loginRequired\n );\n const shouldBlur = hasSensitiveContent && !this.suppressBlurring;\n\n return {\n contain: !this.isCompactTile && !this.isWaveform,\n cover: this.isCompactTile,\n blur: shouldBlur,\n waveform: this.isWaveform,\n 'account-image': this.isAccountImage, // for account tile image\n 'collection-image': this.model?.mediatype === 'collection', // for collection tile image\n };\n }\n\n /\n Helper function to determine if account tile image\n /\n private get isAccountImage() {\n return (\n this.model?.mediatype === 'account' &&\n !this.isCompactTile &&\n !this.isListTile\n );\n }\n\n /\n Event listener sets isWaveform true if image is waveform\n /\n private onLoad() {\n if (\n (this.model?.mediatype === 'audio' \|\|\n this.model?.mediatype === 'etree') &&\n this.baseImage.naturalWidth / this.baseImage.naturalHeight === 4\n ) {\n this.isWaveform = true;\n }\n }\n\n private onError() {\n this.isNotFound = true;\n }\n\n /\n CSS\n */\n static get styles(): CSSResultGroup {\n return [\n baseItemImageStyles,\n waveformGradientStyles,\n css`\n img {\n height: var(--imgHeight, 16rem);\n width: var(--imgWidth, 16rem);\n }\n\n .search-image {\n display: flex;\n align-items: center;\n justify-content: center;\n background: rgb(245, 245, 247);\n border-radius: 4px;\n }\n\n svg {\n height: 10rem;\n width: 10rem;\n }\n `,\n ];\n }\n}\n"]}

package/dist/src/tiles/list/tile-list-compact.js CHANGED Viewed

@@ -25,6 +25,7 @@ let TileListCompact = class TileListCompact extends BaseTileComponent {
      *  - useLocalTime = false;
      */
     render() {
+        var _a, _b, _c, _d;
         return html `
       <div id="list-line" class="${this.classSize}">
         <image-block
@@ -38,10 +39,10 @@ let TileListCompact = class TileListCompact extends BaseTileComponent {
         >
         </image-block>
         <a href=${this.href} id="title"
-          >${DOMPurify.sanitize(this.model?.title ?? '')}</a
+          >${DOMPurify.sanitize((_b = (_a = this.model) === null || _a === void 0 ? void 0 : _a.title) !== null && _b !== void 0 ? _b : '')}</a
         >
         <div id="creator">
-          ${this.model?.mediatype === 'account'
+          ${((_c = this.model) === null || _c === void 0 ? void 0 : _c.mediatype) === 'account'
             ? this.displayValueProvider.accountLabel
             : this.creator}
         </div>
@@ -51,12 +52,13 @@ let TileListCompact = class TileListCompact extends BaseTileComponent {
         <div id="icon">
           <tile-mediatype-icon .model=${this.model}> </tile-mediatype-icon>
         </div>
-        <div id="views">${formatCount(this.views ?? 0, this.formatSize)}</div>
+        <div id="views">${formatCount((_d = this.views) !== null && _d !== void 0 ? _d : 0, this.formatSize)}</div>
       </div>
     `;
     }
     get href() {
-        if (!this.model?.identifier || this.baseNavigationUrl == null)
+        var _a;
+        if (!((_a = this.model) === null || _a === void 0 ? void 0 : _a.identifier) || this.baseNavigationUrl == null)
             return nothing;
         // Use the server-specified href if available.
         // Otherwise, construct a details page URL from the item identifier.
@@ -66,7 +68,8 @@ let TileListCompact = class TileListCompact extends BaseTileComponent {
         return this.displayValueProvider.itemPageUrl(this.model.identifier, this.model.mediatype === 'collection');
     }
     get creator() {
-        return this.displayValueProvider.firstCreatorMatchingFilter ?? nothing;
+        var _a;
+        return (_a = this.displayValueProvider.firstCreatorMatchingFilter) !== null && _a !== void 0 ? _a : nothing;
     }
     /*
      * TODO: fix field names to match model in src/collection-browser.ts
@@ -74,33 +77,36 @@ let TileListCompact = class TileListCompact extends BaseTileComponent {
      * @see src/models.ts
      */
     get date() {
+        var _a, _b, _c, _d, _e;
         // Note on 'publicdate' vs. 'date':
         // The search engine metadata uses 'publicdate' as the key for the date the item
         // was created on archive.org, which in the UI is referred to as "Date Archived".
         // In contrast, the search engine metadata uses 'date' to refer to the actual
         // publication date of the underlying media ("Date Published" in the UI).
         // Refer to the full metadata schema for more info.
-        switch (this.effectiveSort?.field) {
+        switch ((_a = this.effectiveSort) === null || _a === void 0 ? void 0 : _a.field) {
             case 'publicdate':
-                return this.model?.dateArchived;
+                return (_b = this.model) === null || _b === void 0 ? void 0 : _b.dateArchived;
             case 'reviewdate':
-                return this.model?.dateReviewed;
+                return (_c = this.model) === null || _c === void 0 ? void 0 : _c.dateReviewed;
             case 'addeddate':
-                return this.model?.dateAdded;
+                return (_d = this.model) === null || _d === void 0 ? void 0 : _d.dateAdded;
             default:
-                return this.model?.datePublished;
+                return (_e = this.model) === null || _e === void 0 ? void 0 : _e.datePublished;
         }
     }
     get views() {
-        return this.effectiveSort?.field === 'week'
-            ? this.model?.weeklyViewCount // weekly views
-            : this.model?.viewCount; // all-time views
+        var _a, _b, _c;
+        return ((_a = this.effectiveSort) === null || _a === void 0 ? void 0 : _a.field) === 'week'
+            ? (_b = this.model) === null || _b === void 0 ? void 0 : _b.weeklyViewCount // weekly views
+            : (_c = this.model) === null || _c === void 0 ? void 0 : _c.viewCount; // all-time views
     }
     /**
      * Returns the active sort param if one is set, or the default sort param otherwise.
      */
     get effectiveSort() {
-        return this.sortParam ?? this.defaultSortParam;
+        var _a;
+        return (_a = this.sortParam) !== null && _a !== void 0 ? _a : this.defaultSortParam;
     }
     get classSize() {
         if (this.mobileBreakpoint &&
@@ -111,11 +117,12 @@ let TileListCompact = class TileListCompact extends BaseTileComponent {
         return 'desktop';
     }
     get dateFormatSize() {
+        var _a, _b;
         // If we're showing a date published of Jan 1 at midnight, only show the year.
         // This is because items with only a year for their publication date are normalized to
         // Jan 1 at midnight timestamps in the search engine documents.
-        if ((!this.isSortedByDate || this.effectiveSort?.field === 'date') && // Any sort except dates that aren't published date
-            isFirstMillisecondOfUTCYear(this.model?.datePublished)) {
+        if ((!this.isSortedByDate || ((_a = this.effectiveSort) === null || _a === void 0 ? void 0 : _a.field) === 'date') && // Any sort except dates that aren't published date
+            isFirstMillisecondOfUTCYear((_b = this.model) === null || _b === void 0 ? void 0 : _b.datePublished)) {
             return 'year-only';
         }
         return this.formatSize;
@@ -129,7 +136,8 @@ let TileListCompact = class TileListCompact extends BaseTileComponent {
         return 'long';
     }
     get isSortedByDate() {
-        return ['date', 'reviewdate', 'addeddate', 'publicdate'].includes(this.effectiveSort?.field);
+        var _a;
+        return ['date', 'reviewdate', 'addeddate', 'publicdate'].includes((_a = this.effectiveSort) === null || _a === void 0 ? void 0 : _a.field);
     }
     static get styles() {
         return css `