<style include="shared-style cr-shared-style">
:host {
box-sizing: border-box;
display: block;
}
:host([is-empty]) {
padding-block: 80px;
}
.history-cards {
margin-block-start: var(--first-card-padding-top);
}
dialog [slot=body] {
white-space: pre-wrap;
}
</style>
<div id="no-results" class="centered-message"
hidden$="[[hasResults_(historyData_.length)]]">
[[noResultsMessage_(searchedTerm)]]
</div>
<iron-list class="history-cards"
items="[[historyData_]]" as="item" id="infinite-list"
role="grid" aria-rowcount$="[[historyData_.length]]"
hidden$="[[!hasResults_(historyData_.length)]]" preserve-focus
scroll-target="[[scrollTarget]]" scroll-offset="[[scrollOffset]]">
<template>
<history-item tabindex$="[[tabIndex]]"
item="[[item]]"
selected="[[item.selected]]"
is-card-start="[[isCardStart_(item, index, historyData_.length)]]"
is-card-end="[[isCardEnd_(item, index, historyData_.length)]]"
has-time-gap="[[needsTimeGap_(item, index, historyData_.length)]]"
search-term="[[searchedTerm]]"
number-of-items="[[historyData_.length]]"
index="[[index]]"
focus-row-index="[[index]]"
iron-list-tab-index="[[tabIndex]]"
last-focused="{{lastFocused_}}"
list-blurred="{{listBlurred_}}">
</history-item>
</template>
</iron-list>
<iron-scroll-threshold id="scroll-threshold"
lower-threshold="500" on-lower-threshold="onScrollToBottom_"
scroll-target="[[scrollTarget]]">
</iron-scroll-threshold>
<cr-lazy-render id="dialog">
<template>
<cr-dialog consume-keydown-event>
<div slot="title" id="title">$i18n{removeSelected}</div>
<div slot="body" id="body">$i18n{deleteWarning}</div>
<div slot="button-container">
<cr-button class="cancel-button" on-click="onDialogCancelClick_">
$i18n{cancel}
</cr-button>
<cr-button class="action-button" on-click="onDialogConfirmClick_"
<if expr="is_macosx">aria-describedby="title body"</if>>
$i18n{deleteConfirm}
</cr-button>
</div>
</cr-dialog>
</template>
</cr-lazy-render>
<cr-lazy-render id="sharedMenu">
<template>
<cr-action-menu role-description="$i18n{actionMenuDescription}">
<button id="menuMoreButton" class="dropdown-item"
hidden="[[!canSearchMoreFromSite_(
searchedTerm, actionMenuModel_.item.domain)]]"
on-click="onMoreFromSiteClick_">
$i18n{moreFromSite}
</button>
<button id="menuRemoveButton" class="dropdown-item"
hidden="[[!canDeleteHistory_]]" disabled="[[pendingDelete]]"
on-click="onRemoveFromHistoryClick_">
$i18n{removeFromHistory}
</button>
<button id="menuRemoveBookmarkButton" class="dropdown-item"
hidden="[[!actionMenuModel_.item.starred]]"
on-click="onRemoveBookmarkClick_">
$i18n{removeBookmark}
</button>
</cr-action-menu>
</template>
</cr-lazy-render>