@ebay/ebayui-core
Version:
Collection of core eBay components; considered to be the building blocks for all composite structures, pages & apps.
61 lines (60 loc) • 2.04 kB
TypeScript
import type { WithNormalizedProps } from "../../global";
export interface SelectEvent {
el?: HTMLElement;
originalEvent?: Event;
value: string;
index: number;
}
export interface NavigationEvent {
el: HTMLElement;
originalEvent: Event;
}
export interface Item extends Omit<Marko.HTML.Button, "type" | `on${string}`> {
type?: "previous" | "next" | "page";
current?: boolean;
href?: string;
variant?: "link" | "button";
}
interface PaginationInput extends Omit<Marko.HTML.Nav, `on${string}`> {
item?: Marko.AttrTag<Item>;
variant?: "show-range" | "show-last" | "overflow";
"a11y-current-text"?: Marko.HTMLAttributes["aria-label"];
"a11y-previous-text"?: Marko.HTMLAttributes["aria-label"];
"a11y-next-text"?: Marko.HTMLAttributes["aria-label"];
"on-select"?: (event: SelectEvent) => void;
"on-next"?: (event: NavigationEvent) => void;
"on-previous"?: (event: NavigationEvent) => void;
}
export interface Input extends WithNormalizedProps<PaginationInput> {
}
interface State {
maxItems: number;
}
declare class Pagination extends Marko.Component<Input, State> {
_itemWidth: number;
handlePageNumberClick(index: number, originalEvent: MouseEvent, el: HTMLElement): void;
handleMenuPageNumber({ originalEvent, el, }: {
originalEvent?: Event;
el?: HTMLElement;
}): void;
handleNextPageClick(originalEvent: MouseEvent, el: HTMLElement): void;
handlePreviousPageClick(originalEvent: MouseEvent, el: HTMLElement): void;
onCreate(): void;
onMount(): void;
getItemTag(item: Item): "button" | "a";
/**
* Calculates the start and end offsets given the current maximum items
* that can be displayed.
*/
_getVisibleRange(items: Item[]): {
start: number;
end: number;
hideDots: boolean;
dotsIndex: number;
hasOverflow: boolean;
leadingDotsIndex: number;
hideLeadingDots: boolean;
};
_calculateMaxItems(): void;
}
export default Pagination;