@duyluonganduin/acl-web-components 0.0.40 → 0.0.41

package/dist/jsx.d.ts

@@ -532,6 +532,22 @@ declare module 'react' {
         /** Render a visible grip on the divider */
         'with-handle'?: boolean | string
       }
+
+      // ── anduin-pagination ─────────────────────────────────────────────────
+      'anduin-pagination': Base & {
+        /** Total number of pages; the bar hides itself when 0 or 1 */
+        'number-of-pages'?: number | string
+        /** Initial active page for uncontrolled usage (default: 1) */
+        'default-value'?: number | string
+        /** Controlled active page; omit for uncontrolled usage */
+        value?: number | string
+      }
+
+      // ── anduin-pagination-first-page ──────────────────────────────────────
+      'anduin-pagination-first-page': Base
+
+      // ── anduin-pagination-last-page ───────────────────────────────────────
+      'anduin-pagination-last-page': Base
     }
   }
 }

package/dist/react.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),t=require("@lit/react"),e=require("./anduin-resizable-B6jlFgZC.cjs"),a=t.createComponent({react:n,tagName:"anduin-spinner",elementClass:e.AnduinSpinner}),o=t.createComponent({react:n,tagName:"anduin-sparkle-spinner",elementClass:e.AnduinSparkleSpinner}),s=t.createComponent({react:n,tagName:"anduin-icon",elementClass:e.AnduinIcon}),l=t.createComponent({react:n,tagName:"anduin-badge",elementClass:e.AnduinBadge}),C=t.createComponent({react:n,tagName:"anduin-badge-count",elementClass:e.AnduinBadgeCount}),r=t.createComponent({react:n,tagName:"anduin-button",elementClass:e.AnduinButton}),i=t.createComponent({react:n,tagName:"anduin-callout",elementClass:e.AnduinCallout}),c=t.createComponent({react:n,tagName:"anduin-divider",elementClass:e.AnduinDivider}),m=t.createComponent({react:n,tagName:"anduin-dot",elementClass:e.AnduinDot}),E=t.createComponent({react:n,tagName:"anduin-progress",elementClass:e.AnduinProgress}),d=t.createComponent({react:n,tagName:"anduin-skeleton",elementClass:e.AnduinSkeleton}),u=t.createComponent({react:n,tagName:"anduin-loading-state",elementClass:e.AnduinLoadingState}),g=t.createComponent({react:n,tagName:"anduin-field",elementClass:e.AnduinField}),A=t.createComponent({react:n,tagName:"anduin-field-label",elementClass:e.AnduinFieldLabel}),N=t.createComponent({react:n,tagName:"anduin-field-description",elementClass:e.AnduinFieldDescription}),T=t.createComponent({react:n,tagName:"anduin-field-error",elementClass:e.AnduinFieldError}),p=t.createComponent({react:n,tagName:"anduin-field-group",elementClass:e.AnduinFieldGroup}),_=t.createComponent({react:n,tagName:"anduin-radio",elementClass:e.AnduinRadio,events:{onChange:e.RADIO_CHANGE}}),G=t.createComponent({react:n,tagName:"anduin-radio-group",elementClass:e.AnduinRadioGroup,events:{onChange:e.RADIO_GROUP_CHANGE}}),O=t.createComponent({react:n,tagName:"anduin-checkbox",elementClass:e.AnduinCheckbox,events:{onChange:e.CHECKBOX_CHANGE}}),S=t.createComponent({react:n,tagName:"anduin-input",elementClass:e.AnduinInput,events:{onChange:e.INPUT_CHANGE,onClear:e.INPUT_CLEAR}}),R=t.createComponent({react:n,tagName:"anduin-textarea",elementClass:e.AnduinTextarea,events:{onChange:e.TEXTAREA_CHANGE}}),L=t.createComponent({react:n,tagName:"anduin-popover",elementClass:e.AnduinPopover}),I=t.createComponent({react:n,tagName:"anduin-popover-close",elementClass:e.AnduinPopoverClose}),D=t.createComponent({react:n,tagName:"anduin-menu",elementClass:e.AnduinMenu}),H=t.createComponent({react:n,tagName:"anduin-menu-item",elementClass:e.AnduinMenuItem}),b=t.createComponent({react:n,tagName:"anduin-modal",elementClass:e.AnduinModal,events:{onClose:e.MODAL_CLOSE_EVENT,onAfterClose:e.MODAL_AFTER_CLOSE_EVENT}}),v=t.createComponent({react:n,tagName:"anduin-modal-close",elementClass:e.AnduinModalClose}),P=t.createComponent({react:n,tagName:"anduin-tabs",elementClass:e.AnduinTabs,events:{onChange:e.TAB_CHANGE}}),M=t.createComponent({react:n,tagName:"anduin-tabs-list",elementClass:e.AnduinTabsList}),U=t.createComponent({react:n,tagName:"anduin-tab-trigger",elementClass:e.AnduinTabTrigger}),F=t.createComponent({react:n,tagName:"anduin-tab-content",elementClass:e.AnduinTabContent}),h=t.createComponent({react:n,tagName:"anduin-tag",elementClass:e.AnduinTag}),W=t.createComponent({react:n,tagName:"anduin-tag-close",elementClass:e.AnduinTagClose,events:{onClick:e.TAG_CLOSE_CLICK}}),w=t.createComponent({react:n,tagName:"anduin-toggle-group",elementClass:e.AnduinToggleGroup,events:{onChange:e.TOGGLE_GROUP_CHANGE}}),V=t.createComponent({react:n,tagName:"anduin-toggle-group-item",elementClass:e.AnduinToggleGroupItem,events:{onChange:e.TOGGLE_GROUP_ITEM_CHANGE,onSelect:e.TOGGLE_GROUP_ITEM_SELECT,onDeselect:e.TOGGLE_GROUP_ITEM_DESELECT}}),B=t.createComponent({react:n,tagName:"anduin-tooltip",elementClass:e.AnduinTooltip}),k=t.createComponent({react:n,tagName:"anduin-tooltip-trigger",elementClass:e.AnduinTooltipTrigger}),z=t.createComponent({react:n,tagName:"anduin-tooltip-content",elementClass:e.AnduinTooltipContent}),K=t.createComponent({react:n,tagName:"anduin-well",elementClass:e.AnduinWell}),f=t.createComponent({react:n,tagName:"anduin-well-close",elementClass:e.AnduinWellClose,events:{onClick:e.WELL_CLOSE_CLICK}}),x=t.createComponent({react:n,tagName:"anduin-avatar",elementClass:e.AnduinAvatar}),X=t.createComponent({react:n,tagName:"anduin-file-icon",elementClass:e.AnduinFileIcon}),q=t.createComponent({react:n,tagName:"anduin-toast",elementClass:e.AnduinToast}),Z=t.createComponent({react:n,tagName:"anduin-toaster",elementClass:e.AnduinToaster}),y=t.createComponent({react:n,tagName:"anduin-dropdown",elementClass:e.AnduinDropdown,events:{onChange:e.DROPDOWN_CHANGE}}),j=t.createComponent({react:n,tagName:"anduin-drawer",elementClass:e.AnduinDrawer,events:{onClose:e.DRAWER_CLOSE_EVENT,onAfterClose:e.DRAWER_AFTER_CLOSE_EVENT}}),J=t.createComponent({react:n,tagName:"anduin-drawer-close",elementClass:e.AnduinDrawerClose}),Q=t.createComponent({react:n,tagName:"anduin-switcher",elementClass:e.AnduinSwitcher,events:{onChange:e.SWITCHER_CHANGE}}),Y=t.createComponent({react:n,tagName:"anduin-suggestion",elementClass:e.AnduinSuggestion,events:{onChange:e.SUGGESTION_CHANGE,onSelect:e.SUGGESTION_SELECT,onClear:e.SUGGESTION_CLEAR}}),$=t.createComponent({react:n,tagName:"anduin-navigation",elementClass:e.AnduinNavigation,events:{onChange:e.NAVIGATION_CHANGE}}),ee=t.createComponent({react:n,tagName:"anduin-navigation-item",elementClass:e.AnduinNavigationItem}),ne=t.createComponent({react:n,tagName:"anduin-resizable-panel-group",elementClass:e.AnduinResizablePanelGroup}),te=t.createComponent({react:n,tagName:"anduin-resizable-panel",elementClass:e.AnduinResizablePanel}),ae=t.createComponent({react:n,tagName:"anduin-resizable-handle",elementClass:e.AnduinResizableHandle,events:{onResize:e.RESIZE_EVENT}});exports.CHECKBOX_CHANGE=e.CHECKBOX_CHANGE;exports.DRAWER_AFTER_CLOSE_EVENT=e.DRAWER_AFTER_CLOSE_EVENT;exports.DRAWER_CLOSE_EVENT=e.DRAWER_CLOSE_EVENT;exports.DROPDOWN_CHANGE=e.DROPDOWN_CHANGE;exports.INPUT_CHANGE=e.INPUT_CHANGE;exports.INPUT_CLEAR=e.INPUT_CLEAR;exports.MENU_ITEM_CLICK=e.MENU_ITEM_CLICK;exports.MODAL_AFTER_CLOSE_EVENT=e.MODAL_AFTER_CLOSE_EVENT;exports.MODAL_CLOSE_EVENT=e.MODAL_CLOSE_EVENT;exports.NAVIGATION_CHANGE=e.NAVIGATION_CHANGE;exports.RADIO_CHANGE=e.RADIO_CHANGE;exports.RADIO_GROUP_CHANGE=e.RADIO_GROUP_CHANGE;exports.RESIZE_EVENT=e.RESIZE_EVENT;exports.SUGGESTION_CHANGE=e.SUGGESTION_CHANGE;exports.SUGGESTION_CLEAR=e.SUGGESTION_CLEAR;exports.SUGGESTION_SELECT=e.SUGGESTION_SELECT;exports.SWITCHER_CHANGE=e.SWITCHER_CHANGE;exports.TAB_CHANGE=e.TAB_CHANGE;exports.TAG_CLOSE_CLICK=e.TAG_CLOSE_CLICK;exports.TEXTAREA_CHANGE=e.TEXTAREA_CHANGE;exports.TOGGLE_GROUP_CHANGE=e.TOGGLE_GROUP_CHANGE;exports.TOGGLE_GROUP_ITEM_CHANGE=e.TOGGLE_GROUP_ITEM_CHANGE;exports.TOGGLE_GROUP_ITEM_DESELECT=e.TOGGLE_GROUP_ITEM_DESELECT;exports.TOGGLE_GROUP_ITEM_SELECT=e.TOGGLE_GROUP_ITEM_SELECT;exports.WELL_CLOSE_CLICK=e.WELL_CLOSE_CLICK;exports.Avatar=x;exports.Badge=l;exports.BadgeCount=C;exports.Button=r;exports.Callout=i;exports.Checkbox=O;exports.Divider=c;exports.Dot=m;exports.Drawer=j;exports.DrawerClose=J;exports.Dropdown=y;exports.Field=g;exports.FieldDescription=N;exports.FieldError=T;exports.FieldGroup=p;exports.FieldLabel=A;exports.FileIcon=X;exports.Icon=s;exports.Input=S;exports.LoadingState=u;exports.Menu=D;exports.MenuItem=H;exports.Modal=b;exports.ModalClose=v;exports.Navigation=$;exports.NavigationItem=ee;exports.Popover=L;exports.PopoverClose=I;exports.Progress=E;exports.Radio=_;exports.RadioGroup=G;exports.ResizableHandle=ae;exports.ResizablePanel=te;exports.ResizablePanelGroup=ne;exports.Skeleton=d;exports.SparkleSpinner=o;exports.Spinner=a;exports.Suggestion=Y;exports.Switcher=Q;exports.TabContent=F;exports.TabTrigger=U;exports.Tabs=P;exports.TabsList=M;exports.Tag=h;exports.TagClose=W;exports.Textarea=R;exports.Toast=q;exports.Toaster=Z;exports.ToggleGroup=w;exports.ToggleGroupItem=V;exports.Tooltip=B;exports.TooltipContent=z;exports.TooltipTrigger=k;exports.Well=K;exports.WellClose=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react"),a=require("@lit/react"),e=require("./anduin-pagination-B-A3Nk_J.cjs"),t=a.createComponent({react:n,tagName:"anduin-spinner",elementClass:e.AnduinSpinner}),o=a.createComponent({react:n,tagName:"anduin-sparkle-spinner",elementClass:e.AnduinSparkleSpinner}),s=a.createComponent({react:n,tagName:"anduin-icon",elementClass:e.AnduinIcon}),i=a.createComponent({react:n,tagName:"anduin-badge",elementClass:e.AnduinBadge}),l=a.createComponent({react:n,tagName:"anduin-badge-count",elementClass:e.AnduinBadgeCount}),C=a.createComponent({react:n,tagName:"anduin-button",elementClass:e.AnduinButton}),r=a.createComponent({react:n,tagName:"anduin-callout",elementClass:e.AnduinCallout}),c=a.createComponent({react:n,tagName:"anduin-divider",elementClass:e.AnduinDivider}),m=a.createComponent({react:n,tagName:"anduin-dot",elementClass:e.AnduinDot}),d=a.createComponent({react:n,tagName:"anduin-progress",elementClass:e.AnduinProgress}),E=a.createComponent({react:n,tagName:"anduin-skeleton",elementClass:e.AnduinSkeleton}),u=a.createComponent({react:n,tagName:"anduin-loading-state",elementClass:e.AnduinLoadingState}),g=a.createComponent({react:n,tagName:"anduin-field",elementClass:e.AnduinField}),A=a.createComponent({react:n,tagName:"anduin-field-label",elementClass:e.AnduinFieldLabel}),N=a.createComponent({react:n,tagName:"anduin-field-description",elementClass:e.AnduinFieldDescription}),T=a.createComponent({react:n,tagName:"anduin-field-error",elementClass:e.AnduinFieldError}),p=a.createComponent({react:n,tagName:"anduin-field-group",elementClass:e.AnduinFieldGroup}),_=a.createComponent({react:n,tagName:"anduin-radio",elementClass:e.AnduinRadio,events:{onChange:e.RADIO_CHANGE}}),G=a.createComponent({react:n,tagName:"anduin-radio-group",elementClass:e.AnduinRadioGroup,events:{onChange:e.RADIO_GROUP_CHANGE}}),O=a.createComponent({react:n,tagName:"anduin-checkbox",elementClass:e.AnduinCheckbox,events:{onChange:e.CHECKBOX_CHANGE}}),L=a.createComponent({react:n,tagName:"anduin-input",elementClass:e.AnduinInput,events:{onChange:e.INPUT_CHANGE,onClear:e.INPUT_CLEAR}}),I=a.createComponent({react:n,tagName:"anduin-textarea",elementClass:e.AnduinTextarea,events:{onChange:e.TEXTAREA_CHANGE}}),S=a.createComponent({react:n,tagName:"anduin-popover",elementClass:e.AnduinPopover}),R=a.createComponent({react:n,tagName:"anduin-popover-close",elementClass:e.AnduinPopoverClose}),P=a.createComponent({react:n,tagName:"anduin-menu",elementClass:e.AnduinMenu}),H=a.createComponent({react:n,tagName:"anduin-menu-item",elementClass:e.AnduinMenuItem}),D=a.createComponent({react:n,tagName:"anduin-modal",elementClass:e.AnduinModal,events:{onClose:e.MODAL_CLOSE_EVENT,onAfterClose:e.MODAL_AFTER_CLOSE_EVENT}}),v=a.createComponent({react:n,tagName:"anduin-modal-close",elementClass:e.AnduinModalClose}),b=a.createComponent({react:n,tagName:"anduin-tabs",elementClass:e.AnduinTabs,events:{onChange:e.TAB_CHANGE}}),M=a.createComponent({react:n,tagName:"anduin-tabs-list",elementClass:e.AnduinTabsList}),U=a.createComponent({react:n,tagName:"anduin-tab-trigger",elementClass:e.AnduinTabTrigger}),F=a.createComponent({react:n,tagName:"anduin-tab-content",elementClass:e.AnduinTabContent}),h=a.createComponent({react:n,tagName:"anduin-tag",elementClass:e.AnduinTag}),W=a.createComponent({react:n,tagName:"anduin-tag-close",elementClass:e.AnduinTagClose,events:{onClick:e.TAG_CLOSE_CLICK}}),V=a.createComponent({react:n,tagName:"anduin-toggle-group",elementClass:e.AnduinToggleGroup,events:{onChange:e.TOGGLE_GROUP_CHANGE}}),w=a.createComponent({react:n,tagName:"anduin-toggle-group-item",elementClass:e.AnduinToggleGroupItem,events:{onChange:e.TOGGLE_GROUP_ITEM_CHANGE,onSelect:e.TOGGLE_GROUP_ITEM_SELECT,onDeselect:e.TOGGLE_GROUP_ITEM_DESELECT}}),B=a.createComponent({react:n,tagName:"anduin-tooltip",elementClass:e.AnduinTooltip}),k=a.createComponent({react:n,tagName:"anduin-tooltip-trigger",elementClass:e.AnduinTooltipTrigger}),z=a.createComponent({react:n,tagName:"anduin-tooltip-content",elementClass:e.AnduinTooltipContent}),K=a.createComponent({react:n,tagName:"anduin-well",elementClass:e.AnduinWell}),f=a.createComponent({react:n,tagName:"anduin-well-close",elementClass:e.AnduinWellClose,events:{onClick:e.WELL_CLOSE_CLICK}}),x=a.createComponent({react:n,tagName:"anduin-avatar",elementClass:e.AnduinAvatar}),X=a.createComponent({react:n,tagName:"anduin-file-icon",elementClass:e.AnduinFileIcon}),q=a.createComponent({react:n,tagName:"anduin-toast",elementClass:e.AnduinToast}),Z=a.createComponent({react:n,tagName:"anduin-toaster",elementClass:e.AnduinToaster}),y=a.createComponent({react:n,tagName:"anduin-dropdown",elementClass:e.AnduinDropdown,events:{onChange:e.DROPDOWN_CHANGE}}),j=a.createComponent({react:n,tagName:"anduin-drawer",elementClass:e.AnduinDrawer,events:{onClose:e.DRAWER_CLOSE_EVENT,onAfterClose:e.DRAWER_AFTER_CLOSE_EVENT}}),J=a.createComponent({react:n,tagName:"anduin-drawer-close",elementClass:e.AnduinDrawerClose}),Q=a.createComponent({react:n,tagName:"anduin-switcher",elementClass:e.AnduinSwitcher,events:{onChange:e.SWITCHER_CHANGE}}),Y=a.createComponent({react:n,tagName:"anduin-suggestion",elementClass:e.AnduinSuggestion,events:{onChange:e.SUGGESTION_CHANGE,onSelect:e.SUGGESTION_SELECT,onClear:e.SUGGESTION_CLEAR}}),$=a.createComponent({react:n,tagName:"anduin-navigation",elementClass:e.AnduinNavigation,events:{onChange:e.NAVIGATION_CHANGE}}),ee=a.createComponent({react:n,tagName:"anduin-navigation-item",elementClass:e.AnduinNavigationItem}),ne=a.createComponent({react:n,tagName:"anduin-resizable-panel-group",elementClass:e.AnduinResizablePanelGroup}),ae=a.createComponent({react:n,tagName:"anduin-resizable-panel",elementClass:e.AnduinResizablePanel}),te=a.createComponent({react:n,tagName:"anduin-resizable-handle",elementClass:e.AnduinResizableHandle,events:{onResize:e.RESIZE_EVENT}}),oe=a.createComponent({react:n,tagName:"anduin-pagination",elementClass:e.AnduinPagination,events:{onValueChange:e.PAGINATION_CHANGE}}),se=a.createComponent({react:n,tagName:"anduin-pagination-first-page",elementClass:e.AnduinPaginationFirstPage}),ie=a.createComponent({react:n,tagName:"anduin-pagination-last-page",elementClass:e.AnduinPaginationLastPage});exports.CHECKBOX_CHANGE=e.CHECKBOX_CHANGE;exports.DRAWER_AFTER_CLOSE_EVENT=e.DRAWER_AFTER_CLOSE_EVENT;exports.DRAWER_CLOSE_EVENT=e.DRAWER_CLOSE_EVENT;exports.DROPDOWN_CHANGE=e.DROPDOWN_CHANGE;exports.INPUT_CHANGE=e.INPUT_CHANGE;exports.INPUT_CLEAR=e.INPUT_CLEAR;exports.MENU_ITEM_CLICK=e.MENU_ITEM_CLICK;exports.MODAL_AFTER_CLOSE_EVENT=e.MODAL_AFTER_CLOSE_EVENT;exports.MODAL_CLOSE_EVENT=e.MODAL_CLOSE_EVENT;exports.NAVIGATION_CHANGE=e.NAVIGATION_CHANGE;exports.PAGINATION_CHANGE=e.PAGINATION_CHANGE;exports.RADIO_CHANGE=e.RADIO_CHANGE;exports.RADIO_GROUP_CHANGE=e.RADIO_GROUP_CHANGE;exports.RESIZE_EVENT=e.RESIZE_EVENT;exports.SUGGESTION_CHANGE=e.SUGGESTION_CHANGE;exports.SUGGESTION_CLEAR=e.SUGGESTION_CLEAR;exports.SUGGESTION_SELECT=e.SUGGESTION_SELECT;exports.SWITCHER_CHANGE=e.SWITCHER_CHANGE;exports.TAB_CHANGE=e.TAB_CHANGE;exports.TAG_CLOSE_CLICK=e.TAG_CLOSE_CLICK;exports.TEXTAREA_CHANGE=e.TEXTAREA_CHANGE;exports.TOGGLE_GROUP_CHANGE=e.TOGGLE_GROUP_CHANGE;exports.TOGGLE_GROUP_ITEM_CHANGE=e.TOGGLE_GROUP_ITEM_CHANGE;exports.TOGGLE_GROUP_ITEM_DESELECT=e.TOGGLE_GROUP_ITEM_DESELECT;exports.TOGGLE_GROUP_ITEM_SELECT=e.TOGGLE_GROUP_ITEM_SELECT;exports.WELL_CLOSE_CLICK=e.WELL_CLOSE_CLICK;exports.Avatar=x;exports.Badge=i;exports.BadgeCount=l;exports.Button=C;exports.Callout=r;exports.Checkbox=O;exports.Divider=c;exports.Dot=m;exports.Drawer=j;exports.DrawerClose=J;exports.Dropdown=y;exports.Field=g;exports.FieldDescription=N;exports.FieldError=T;exports.FieldGroup=p;exports.FieldLabel=A;exports.FileIcon=X;exports.Icon=s;exports.Input=L;exports.LoadingState=u;exports.Menu=P;exports.MenuItem=H;exports.Modal=D;exports.ModalClose=v;exports.Navigation=$;exports.NavigationItem=ee;exports.Pagination=oe;exports.PaginationFirstPage=se;exports.PaginationLastPage=ie;exports.Popover=S;exports.PopoverClose=R;exports.Progress=d;exports.Radio=_;exports.RadioGroup=G;exports.ResizableHandle=te;exports.ResizablePanel=ae;exports.ResizablePanelGroup=ne;exports.Skeleton=E;exports.SparkleSpinner=o;exports.Spinner=t;exports.Suggestion=Y;exports.Switcher=Q;exports.TabContent=F;exports.TabTrigger=U;exports.Tabs=b;exports.TabsList=M;exports.Tag=h;exports.TagClose=W;exports.Textarea=I;exports.Toast=q;exports.Toaster=Z;exports.ToggleGroup=V;exports.ToggleGroupItem=w;exports.Tooltip=B;exports.TooltipContent=z;exports.TooltipTrigger=k;exports.Well=K;exports.WellClose=f;

package/dist/react.d.ts

@@ -323,6 +323,61 @@ declare class AnduinNavigationItem extends LitElement {
     render(): TemplateResult<1>;
 }
 
+/**
+ * Page navigation controls for paginated content. Renders a row of page-number
+ * buttons with previous/next navigators, ellipsis menus for skipped ranges, and
+ * a sliding highlight on the active page.
+ *
+ * Uncontrolled (default): manages its own page state — set `number-of-pages`
+ * (and optionally `default-value`). Controlled: set `value` and update it in
+ * response to the `anduin-pagination:change` event (React `onValueChange`).
+ *
+ * Slot in `<anduin-pagination-first-page>` / `<anduin-pagination-last-page>` as
+ * children to add jump-to-boundary buttons.
+ */
+declare class AnduinPagination extends LitElement {
+    static styles: CSSResult;
+    /** Total number of pages. The bar hides itself when this is 0 or 1. */
+    numberOfPages: number;
+    /** Initial active page for uncontrolled usage. */
+    defaultValue: number;
+    /** Controlled active page. Leave unset (null) for uncontrolled usage. */
+    value: number | null;
+    private internalValue;
+    private indicatorEl?;
+    private indicatorReady;
+    private get isControlled();
+    private get count();
+    private get selection();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    private onJump;
+    /** MUI-style windowing: boundaryCount = 1, siblingCount = 1. */
+    private buildItems;
+    private goTo;
+    updated(): void;
+    /** Push disabled state onto slotted first/last-page buttons. */
+    private syncBoundaryButtons;
+    private positionIndicator;
+    private onSlotChange;
+    render(): typeof nothing | TemplateResult<1>;
+    private renderItem;
+}
+
+/** Jumps to page 1. Slot into `<anduin-pagination>` as a child. */
+declare class AnduinPaginationFirstPage extends BoundaryButton {
+    protected icon: string;
+    protected label: string;
+    protected target: "first";
+}
+
+/** Jumps to the last page. Slot into `<anduin-pagination>` as a child. */
+declare class AnduinPaginationLastPage extends BoundaryButton {
+    protected icon: string;
+    protected label: string;
+    protected target: "last";
+}
+
 declare class AnduinPopover extends LitElement {
     static styles: CSSResult;
     open: boolean;
@@ -736,6 +791,18 @@ export declare const Badge: ReactWebComponent<AnduinBadge, {}>;
 
 export declare const BadgeCount: ReactWebComponent<AnduinBadgeCount, {}>;
 
+/** Base for the jump-to-boundary buttons. */
+declare class BoundaryButton extends LitElement {
+    static styles: CSSResult;
+    disabled: boolean;
+    protected icon: string;
+    protected label: string;
+    protected target: 'first' | 'last';
+    connectedCallback(): void;
+    private onClick;
+    render(): TemplateResult<1>;
+}
+
 export declare const Button: ReactWebComponent<AnduinButton, {}>;
 
 declare type ButtonAppearance = 'filled' | 'outlined' | 'plain' | 'text';
@@ -853,6 +920,17 @@ export declare const NavigationItem: ReactWebComponent<AnduinNavigationItem, {}>
 
 declare type NavigationTheme = 'light' | 'dark';
 
+export declare const Pagination: ReactWebComponent<AnduinPagination, {
+onValueChange: string;
+}>;
+
+/** Fired when a page is requested. `event.detail` is the target page number. */
+export declare const PAGINATION_CHANGE = "anduin-pagination:change";
+
+export declare const PaginationFirstPage: ReactWebComponent<AnduinPaginationFirstPage, {}>;
+
+export declare const PaginationLastPage: ReactWebComponent<AnduinPaginationLastPage, {}>;
+
 export declare const Popover: ReactWebComponent<AnduinPopover, {}>;
 
 export declare const PopoverClose: ReactWebComponent<AnduinPopoverClose, {}>;

package/dist/react.js

@@ -1,180 +1,189 @@
-import e from "react";
-import { createComponent as a } from "@lit/react";
-import { K as n, J as t, q as s, a as o, b as l, c as i, d as r, f as d, g as u, C as c, I as m, s as C, k as g, o as A, l as N, m as E, n as T, ah as p, D as G, ai as _, E as v, a2 as S, e as b, aa as R, a9 as I, r as L, as as O, T as D, z as h, B as P, t as H, u as w, ac as M, ad as F, v as f, w as k, ao as U, P as z, Q as x, O as W, N as B, R as V, ar as K, S as X, at as j, W as Z, aw as q, ax as y, au as J, X as Q, Y, _ as $, Z as ee, $ as ae, aE as ne, a0 as te, A as se, p as oe, U as le, V as ie, a5 as re, j as de, a3 as ue, a4 as ce, h as me, i as Ce, an as ge, M as Ae, al as Ne, am as Ee, ak as Te, L as pe, ae as Ge, x as _e, y as ve, H as Se, G as be, aj as Re, F as Ie } from "./anduin-resizable-2JzM-nGd.js";
-import { ab as wa } from "./anduin-resizable-2JzM-nGd.js";
-const he = a({ react: e, tagName: "anduin-spinner", elementClass: n }), Pe = a({ react: e, tagName: "anduin-sparkle-spinner", elementClass: t }), He = a({ react: e, tagName: "anduin-icon", elementClass: s }), we = a({ react: e, tagName: "anduin-badge", elementClass: o }), Me = a({ react: e, tagName: "anduin-badge-count", elementClass: l }), Fe = a({ react: e, tagName: "anduin-button", elementClass: i }), fe = a({ react: e, tagName: "anduin-callout", elementClass: r }), ke = a({ react: e, tagName: "anduin-divider", elementClass: d }), Ue = a({ react: e, tagName: "anduin-dot", elementClass: u }), ze = a({ react: e, tagName: "anduin-progress", elementClass: c }), xe = a({ react: e, tagName: "anduin-skeleton", elementClass: m }), We = a({ react: e, tagName: "anduin-loading-state", elementClass: C }), Be = a({ react: e, tagName: "anduin-field", elementClass: g }), Ve = a({ react: e, tagName: "anduin-field-label", elementClass: A }), Ke = a({ react: e, tagName: "anduin-field-description", elementClass: N }), Xe = a({ react: e, tagName: "anduin-field-error", elementClass: E }), je = a({ react: e, tagName: "anduin-field-group", elementClass: T }), Ze = a({
-  react: e,
+import a from "react";
+import { createComponent as e } from "@lit/react";
+import { N as n, M as t, q as s, a as o, b as i, c as l, d as r, f as d, g as u, F as c, L as g, s as m, k as C, o as A, l as N, m as p, n as E, am as T, G, an as _, H as v, a5 as S, e as I, ad as R, ac as b, r as L, ax as P, W as O, D, E as h, t as H, u as F, af as w, ag as M, v as f, w as k, at as z, S as U, T as x, R as B, Q as W, U as V, aw as K, V as X, ay as j, Z as q, aB as y, aC as J, az as Z, _ as Q, $ as Y, a1 as $, a0 as aa, a2 as ea, aJ as na, a3 as ta, A as sa, p as oa, X as ia, Y as la, a8 as ra, j as da, a6 as ua, a7 as ca, h as ga, i as ma, as as Ca, P as Aa, aq as Na, ar as pa, ap as Ea, O as Ta, ah as Ga, x as _a, y as va, K as Sa, J as Ia, ao as Ra, I as ba, aj as La, z as Pa, B as Oa, C as Da } from "./anduin-pagination-Dym6znEk.js";
+import { ae as xe } from "./anduin-pagination-Dym6znEk.js";
+const wa = e({ react: a, tagName: "anduin-spinner", elementClass: n }), Ma = e({ react: a, tagName: "anduin-sparkle-spinner", elementClass: t }), fa = e({ react: a, tagName: "anduin-icon", elementClass: s }), ka = e({ react: a, tagName: "anduin-badge", elementClass: o }), za = e({ react: a, tagName: "anduin-badge-count", elementClass: i }), Ua = e({ react: a, tagName: "anduin-button", elementClass: l }), xa = e({ react: a, tagName: "anduin-callout", elementClass: r }), Ba = e({ react: a, tagName: "anduin-divider", elementClass: d }), Wa = e({ react: a, tagName: "anduin-dot", elementClass: u }), Va = e({ react: a, tagName: "anduin-progress", elementClass: c }), Ka = e({ react: a, tagName: "anduin-skeleton", elementClass: g }), Xa = e({ react: a, tagName: "anduin-loading-state", elementClass: m }), ja = e({ react: a, tagName: "anduin-field", elementClass: C }), qa = e({ react: a, tagName: "anduin-field-label", elementClass: A }), ya = e({ react: a, tagName: "anduin-field-description", elementClass: N }), Ja = e({ react: a, tagName: "anduin-field-error", elementClass: p }), Za = e({ react: a, tagName: "anduin-field-group", elementClass: E }), Qa = e({
+  react: a,
   tagName: "anduin-radio",
   elementClass: G,
-  events: { onChange: p }
-}), qe = a({
-  react: e,
+  events: { onChange: T }
+}), Ya = e({
+  react: a,
   tagName: "anduin-radio-group",
   elementClass: v,
   events: { onChange: _ }
-}), ye = a({
-  react: e,
+}), $a = e({
+  react: a,
   tagName: "anduin-checkbox",
-  elementClass: b,
+  elementClass: I,
   events: { onChange: S }
-}), Je = a({
-  react: e,
+}), ae = e({
+  react: a,
   tagName: "anduin-input",
   elementClass: L,
-  events: { onChange: I, onClear: R }
-}), Qe = a({
-  react: e,
+  events: { onChange: b, onClear: R }
+}), ee = e({
+  react: a,
   tagName: "anduin-textarea",
-  elementClass: D,
-  events: { onChange: O }
-}), Ye = a({ react: e, tagName: "anduin-popover", elementClass: h }), $e = a({ react: e, tagName: "anduin-popover-close", elementClass: P }), ea = a({ react: e, tagName: "anduin-menu", elementClass: H }), aa = a({
-  react: e,
+  elementClass: O,
+  events: { onChange: P }
+}), ne = e({ react: a, tagName: "anduin-popover", elementClass: D }), te = e({ react: a, tagName: "anduin-popover-close", elementClass: h }), se = e({ react: a, tagName: "anduin-menu", elementClass: H }), oe = e({
+  react: a,
   tagName: "anduin-menu-item",
-  elementClass: w
-}), na = a({
-  react: e,
+  elementClass: F
+}), ie = e({
+  react: a,
   tagName: "anduin-modal",
   elementClass: f,
-  events: { onClose: F, onAfterClose: M }
-}), ta = a({ react: e, tagName: "anduin-modal-close", elementClass: k }), sa = a({
-  react: e,
+  events: { onClose: M, onAfterClose: w }
+}), le = e({ react: a, tagName: "anduin-modal-close", elementClass: k }), re = e({
+  react: a,
   tagName: "anduin-tabs",
-  elementClass: z,
-  events: { onChange: U }
-}), oa = a({ react: e, tagName: "anduin-tabs-list", elementClass: x }), la = a({ react: e, tagName: "anduin-tab-trigger", elementClass: W }), ia = a({ react: e, tagName: "anduin-tab-content", elementClass: B }), ra = a({ react: e, tagName: "anduin-tag", elementClass: V }), da = a({
-  react: e,
+  elementClass: U,
+  events: { onChange: z }
+}), de = e({ react: a, tagName: "anduin-tabs-list", elementClass: x }), ue = e({ react: a, tagName: "anduin-tab-trigger", elementClass: B }), ce = e({ react: a, tagName: "anduin-tab-content", elementClass: W }), ge = e({ react: a, tagName: "anduin-tag", elementClass: V }), me = e({
+  react: a,
   tagName: "anduin-tag-close",
   elementClass: X,
   events: { onClick: K }
-}), ua = a({
-  react: e,
+}), Ce = e({
+  react: a,
   tagName: "anduin-toggle-group",
-  elementClass: Z,
+  elementClass: q,
   events: { onChange: j }
-}), ca = a({
-  react: e,
+}), Ae = e({
+  react: a,
   tagName: "anduin-toggle-group-item",
   elementClass: Q,
-  events: { onChange: J, onSelect: y, onDeselect: q }
-}), ma = a({ react: e, tagName: "anduin-tooltip", elementClass: Y }), Ca = a({ react: e, tagName: "anduin-tooltip-trigger", elementClass: $ }), ga = a({ react: e, tagName: "anduin-tooltip-content", elementClass: ee }), Aa = a({ react: e, tagName: "anduin-well", elementClass: ae }), Na = a({
-  react: e,
+  events: { onChange: Z, onSelect: J, onDeselect: y }
+}), Ne = e({ react: a, tagName: "anduin-tooltip", elementClass: Y }), pe = e({ react: a, tagName: "anduin-tooltip-trigger", elementClass: $ }), Ee = e({ react: a, tagName: "anduin-tooltip-content", elementClass: aa }), Te = e({ react: a, tagName: "anduin-well", elementClass: ea }), Ge = e({
+  react: a,
   tagName: "anduin-well-close",
-  elementClass: te,
-  events: { onClick: ne }
-}), Ea = a({ react: e, tagName: "anduin-avatar", elementClass: se }), Ta = a({ react: e, tagName: "anduin-file-icon", elementClass: oe }), pa = a({ react: e, tagName: "anduin-toast", elementClass: le }), Ga = a({ react: e, tagName: "anduin-toaster", elementClass: ie }), _a = a({
-  react: e,
+  elementClass: ta,
+  events: { onClick: na }
+}), _e = e({ react: a, tagName: "anduin-avatar", elementClass: sa }), ve = e({ react: a, tagName: "anduin-file-icon", elementClass: oa }), Se = e({ react: a, tagName: "anduin-toast", elementClass: ia }), Ie = e({ react: a, tagName: "anduin-toaster", elementClass: la }), Re = e({
+  react: a,
   tagName: "anduin-dropdown",
-  elementClass: de,
-  events: { onChange: re }
-}), va = a({
-  react: e,
+  elementClass: da,
+  events: { onChange: ra }
+}), be = e({
+  react: a,
   tagName: "anduin-drawer",
-  elementClass: me,
-  events: { onClose: ce, onAfterClose: ue }
-}), Sa = a({ react: e, tagName: "anduin-drawer-close", elementClass: Ce }), ba = a({
-  react: e,
+  elementClass: ga,
+  events: { onClose: ca, onAfterClose: ua }
+}), Le = e({ react: a, tagName: "anduin-drawer-close", elementClass: ma }), Pe = e({
+  react: a,
   tagName: "anduin-switcher",
-  elementClass: Ae,
-  events: { onChange: ge }
-}), Ra = a({
-  react: e,
+  elementClass: Aa,
+  events: { onChange: Ca }
+}), Oe = e({
+  react: a,
   tagName: "anduin-suggestion",
-  elementClass: pe,
-  events: { onChange: Te, onSelect: Ee, onClear: Ne }
-}), Ia = a({
-  react: e,
+  elementClass: Ta,
+  events: { onChange: Ea, onSelect: pa, onClear: Na }
+}), De = e({
+  react: a,
   tagName: "anduin-navigation",
-  elementClass: _e,
-  events: { onChange: Ge }
-}), La = a({
-  react: e,
+  elementClass: _a,
+  events: { onChange: Ga }
+}), he = e({
+  react: a,
   tagName: "anduin-navigation-item",
-  elementClass: ve
-}), Oa = a({ react: e, tagName: "anduin-resizable-panel-group", elementClass: Se }), Da = a({ react: e, tagName: "anduin-resizable-panel", elementClass: be }), ha = a({
-  react: e,
+  elementClass: va
+}), He = e({ react: a, tagName: "anduin-resizable-panel-group", elementClass: Sa }), Fe = e({ react: a, tagName: "anduin-resizable-panel", elementClass: Ia }), we = e({
+  react: a,
   tagName: "anduin-resizable-handle",
-  elementClass: Ie,
-  events: { onResize: Re }
-});
+  elementClass: ba,
+  events: { onResize: Ra }
+}), Me = e({
+  react: a,
+  tagName: "anduin-pagination",
+  elementClass: Pa,
+  events: { onValueChange: La }
+}), fe = e({ react: a, tagName: "anduin-pagination-first-page", elementClass: Oa }), ke = e({ react: a, tagName: "anduin-pagination-last-page", elementClass: Da });
 export {
-  Ea as Avatar,
-  we as Badge,
-  Me as BadgeCount,
-  Fe as Button,
+  _e as Avatar,
+  ka as Badge,
+  za as BadgeCount,
+  Ua as Button,
   S as CHECKBOX_CHANGE,
-  fe as Callout,
-  ye as Checkbox,
-  ue as DRAWER_AFTER_CLOSE_EVENT,
-  ce as DRAWER_CLOSE_EVENT,
-  re as DROPDOWN_CHANGE,
-  ke as Divider,
-  Ue as Dot,
-  va as Drawer,
-  Sa as DrawerClose,
-  _a as Dropdown,
-  Be as Field,
-  Ke as FieldDescription,
-  Xe as FieldError,
-  je as FieldGroup,
-  Ve as FieldLabel,
-  Ta as FileIcon,
-  I as INPUT_CHANGE,
+  xa as Callout,
+  $a as Checkbox,
+  ua as DRAWER_AFTER_CLOSE_EVENT,
+  ca as DRAWER_CLOSE_EVENT,
+  ra as DROPDOWN_CHANGE,
+  Ba as Divider,
+  Wa as Dot,
+  be as Drawer,
+  Le as DrawerClose,
+  Re as Dropdown,
+  ja as Field,
+  ya as FieldDescription,
+  Ja as FieldError,
+  Za as FieldGroup,
+  qa as FieldLabel,
+  ve as FileIcon,
+  b as INPUT_CHANGE,
   R as INPUT_CLEAR,
-  He as Icon,
-  Je as Input,
-  We as LoadingState,
-  wa as MENU_ITEM_CLICK,
-  M as MODAL_AFTER_CLOSE_EVENT,
-  F as MODAL_CLOSE_EVENT,
-  ea as Menu,
-  aa as MenuItem,
-  na as Modal,
-  ta as ModalClose,
-  Ge as NAVIGATION_CHANGE,
-  Ia as Navigation,
-  La as NavigationItem,
-  Ye as Popover,
-  $e as PopoverClose,
-  ze as Progress,
-  p as RADIO_CHANGE,
+  fa as Icon,
+  ae as Input,
+  Xa as LoadingState,
+  xe as MENU_ITEM_CLICK,
+  w as MODAL_AFTER_CLOSE_EVENT,
+  M as MODAL_CLOSE_EVENT,
+  se as Menu,
+  oe as MenuItem,
+  ie as Modal,
+  le as ModalClose,
+  Ga as NAVIGATION_CHANGE,
+  De as Navigation,
+  he as NavigationItem,
+  La as PAGINATION_CHANGE,
+  Me as Pagination,
+  fe as PaginationFirstPage,
+  ke as PaginationLastPage,
+  ne as Popover,
+  te as PopoverClose,
+  Va as Progress,
+  T as RADIO_CHANGE,
   _ as RADIO_GROUP_CHANGE,
-  Re as RESIZE_EVENT,
-  Ze as Radio,
-  qe as RadioGroup,
-  ha as ResizableHandle,
-  Da as ResizablePanel,
-  Oa as ResizablePanelGroup,
-  Te as SUGGESTION_CHANGE,
-  Ne as SUGGESTION_CLEAR,
-  Ee as SUGGESTION_SELECT,
-  ge as SWITCHER_CHANGE,
-  xe as Skeleton,
-  Pe as SparkleSpinner,
-  he as Spinner,
-  Ra as Suggestion,
-  ba as Switcher,
-  U as TAB_CHANGE,
+  Ra as RESIZE_EVENT,
+  Qa as Radio,
+  Ya as RadioGroup,
+  we as ResizableHandle,
+  Fe as ResizablePanel,
+  He as ResizablePanelGroup,
+  Ea as SUGGESTION_CHANGE,
+  Na as SUGGESTION_CLEAR,
+  pa as SUGGESTION_SELECT,
+  Ca as SWITCHER_CHANGE,
+  Ka as Skeleton,
+  Ma as SparkleSpinner,
+  wa as Spinner,
+  Oe as Suggestion,
+  Pe as Switcher,
+  z as TAB_CHANGE,
   K as TAG_CLOSE_CLICK,
-  O as TEXTAREA_CHANGE,
+  P as TEXTAREA_CHANGE,
   j as TOGGLE_GROUP_CHANGE,
-  J as TOGGLE_GROUP_ITEM_CHANGE,
-  q as TOGGLE_GROUP_ITEM_DESELECT,
-  y as TOGGLE_GROUP_ITEM_SELECT,
-  ia as TabContent,
-  la as TabTrigger,
-  sa as Tabs,
-  oa as TabsList,
-  ra as Tag,
-  da as TagClose,
-  Qe as Textarea,
-  pa as Toast,
-  Ga as Toaster,
-  ua as ToggleGroup,
-  ca as ToggleGroupItem,
-  ma as Tooltip,
-  ga as TooltipContent,
-  Ca as TooltipTrigger,
-  ne as WELL_CLOSE_CLICK,
-  Aa as Well,
-  Na as WellClose
+  Z as TOGGLE_GROUP_ITEM_CHANGE,
+  y as TOGGLE_GROUP_ITEM_DESELECT,
+  J as TOGGLE_GROUP_ITEM_SELECT,
+  ce as TabContent,
+  ue as TabTrigger,
+  re as Tabs,
+  de as TabsList,
+  ge as Tag,
+  me as TagClose,
+  ee as Textarea,
+  Se as Toast,
+  Ie as Toaster,
+  Ce as ToggleGroup,
+  Ae as ToggleGroupItem,
+  Ne as Tooltip,
+  Ee as TooltipContent,
+  pe as TooltipTrigger,
+  na as WELL_CLOSE_CLICK,
+  Te as Well,
+  Ge as WellClose
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@duyluonganduin/acl-web-components",
-  "version": "0.0.40",
+  "version": "0.0.41",
   "type": "module",
   "main": "./dist/acl-web-components.cjs",
   "module": "./dist/acl-web-components.js",