@warp-ds/elements 2.10.0-next.9 → 2.10.1-next.1

package/dist/packages/pagination/pagination.a11y.test.js

@@ -1,36 +1,70 @@
-import { html } from 'lit';
-import { describe, expect, test } from 'vitest';
-import { render } from 'vitest-browser-lit';
-import './pagination.js';
-describe('w-pagination accessibility (WCAG 2.2)', () => {
-    describe('axe-core automated checks', () => {
-        test('default state has no violations', async () => {
-            const page = render(html `<w-pagination current-page="5" pages="10" base-url="/page/"></w-pagination>`);
+import { html } from "lit";
+import { describe, expect, test } from "vitest";
+import { render } from "vitest-browser-lit";
+import "./pagination.js";
+describe("w-pagination accessibility (WCAG 2.2)", () => {
+    describe("axe-core automated checks", () => {
+        test("default state has no violations", async () => {
+            const page = render(html `<w-pagination
+					current-page="5"
+					pages="10"
+					base-url="/page/"
+				></w-pagination>`);
             await expect(page).toHaveNoAxeViolations();
         });
-        test('first page (no first or previous links) has no violations', async () => {
-            const page = render(html `<w-pagination current-page="1" pages="10" base-url="/page/"></w-pagination>`);
+        test("first page (no first or previous links) has no violations", async () => {
+            const page = render(html `<w-pagination
+					current-page="1"
+					pages="10"
+					base-url="/page/"
+				></w-pagination>`);
             await expect(page).toHaveNoAxeViolations();
         });
     });
-    describe('WCAG 1.3.1 - Info and Relationships', () => {
-        test('page links expose accessible names', async () => {
-            const page = render(html `<w-pagination current-page="3" pages="5" base-url="/page/"></w-pagination>`);
-            await expect.element(page.getByRole('link', { name: 'Page 3' })).toBeVisible();
-            await expect.element(page.getByRole('link', { name: 'Page 2' })).toBeVisible();
+    describe("WCAG 1.3.1 - Info and Relationships", () => {
+        test("page links expose accessible names", async () => {
+            const page = render(html `<w-pagination
+					current-page="3"
+					pages="5"
+					base-url="/page/"
+				></w-pagination>`);
+            await expect
+                .element(page.getByRole("link", { name: "Page 3" }))
+                .toBeVisible();
+            await expect
+                .element(page.getByRole("link", { name: "Page 2" }))
+                .toBeVisible();
         });
     });
-    describe('WCAG 4.1.2 - Name, Role, Value', () => {
-        test('current page is exposed via aria-current', async () => {
-            const page = render(html `<w-pagination current-page="4" pages="8" base-url="/page/"></w-pagination>`);
-            await expect.element(page.getByRole('link', { name: 'Page 4' })).toHaveAttribute('aria-current', 'page');
-            await expect.element(page.getByRole('link', { name: 'Page 3' })).not.toHaveAttribute('aria-current', 'page');
+    describe("WCAG 4.1.2 - Name, Role, Value", () => {
+        test("current page is exposed via aria-current", async () => {
+            const page = render(html `<w-pagination
+					current-page="4"
+					pages="8"
+					base-url="/page/"
+				></w-pagination>`);
+            await expect
+                .element(page.getByRole("link", { name: "Page 4" }))
+                .toHaveAttribute("aria-current", "page");
+            await expect
+                .element(page.getByRole("link", { name: "Page 3" }))
+                .not.toHaveAttribute("aria-current", "page");
         });
-        test('navigation controls have accessible names', async () => {
-            const page = render(html `<w-pagination current-page="4" pages="8" base-url="/page/"></w-pagination>`);
-            await expect.element(page.getByRole('link', { name: 'First page' })).toBeVisible();
-            await expect.element(page.getByRole('link', { name: 'Previous page' })).toBeVisible();
-            await expect.element(page.getByRole('link', { name: 'Next page' })).toBeVisible();
+        test("navigation controls have accessible names", async () => {
+            const page = render(html `<w-pagination
+					current-page="4"
+					pages="8"
+					base-url="/page/"
+				></w-pagination>`);
+            await expect
+                .element(page.getByRole("link", { name: "First page" }))
+                .toBeVisible();
+            await expect
+                .element(page.getByRole("link", { name: "Previous page" }))
+                .toBeVisible();
+            await expect
+                .element(page.getByRole("link", { name: "Next page" }))
+                .toBeVisible();
         });
     });
 });

package/dist/packages/pagination/pagination.d.ts

@@ -1,8 +1,10 @@
-import { LitElement } from 'lit';
-import '../icon/icon.js';
+import { LitElement } from "lit";
+import "../icon/icon.js";
 /**
  * Pagination allows users to navigate through multiple pages of content by providing navigation controls with page numbers and directional arrows.
  *
+ * [Warp component reference](https://warp-ds.github.io/docs/components/pagination/frameworks/elements)
+ *
  * @fires {CustomEvent} page-click - Triggered when a link in the pagination is clicked. Contains the page number in `string` form.
  */
 declare class WarpPagination extends LitElement {
@@ -12,30 +14,22 @@ declare class WarpPagination extends LitElement {
      *
      * The page number is appended to this URL.
      */
-    baseUrl: string;
+    baseUrl: string | undefined;
     /**
      * The total number of pages.
      */
     pages: number;
     /**
      * The currently active page number.
-     *
-     * @default 1
      */
     currentPageNumber: number;
     /**
      * The maximum number of page numbers visible.
-     *
-     * @default 7
      */
     visiblePages: number;
     static styles: import("lit").CSSResult[];
     constructor();
     /** @internal */
-    get _currentPage(): number;
-    /** @internal */
-    get _visiblePages(): number;
-    /** @internal */
     get shouldShowShowFirstPageButton(): boolean;
     /** @internal */
     get shouldShowPreviousPageButton(): boolean;
@@ -47,4 +41,16 @@ declare class WarpPagination extends LitElement {
     get visiblePageNumbers(): number[];
     render(): import("lit").TemplateResult<1>;
 }
+declare global {
+    interface GlobalEventHandlersEventMap {
+        "page-click": CustomEvent<{
+            clickedPage: string;
+        }>;
+    }
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        "w-pagination": WarpPagination;
+    }
+}
 export { WarpPagination };

package/dist/packages/pagination/pagination.hydration.test.d.ts

@@ -1 +1 @@
-import './pagination.js';
+import "./pagination.js";

package/dist/packages/pagination/pagination.hydration.test.js

@@ -1,37 +1,37 @@
-import { afterEach, beforeEach, describe, expect, test } from 'vitest';
-import { setupHydrationWarningCapture, testHydration } from '../../tests/react-hydration';
-import './pagination.js';
-describe('w-pagination React SSR hydration', () => {
+import { afterEach, beforeEach, describe, expect, test } from "vitest";
+import { setupHydrationWarningCapture, testHydration, } from "../../tests/react-hydration";
+import "./pagination.js";
+describe("w-pagination React SSR hydration", () => {
     beforeEach(() => setupHydrationWarningCapture());
     afterEach(() => {
         window.__HYDRATION_WARNINGS__ = [];
     });
-    test('default (no attributes) hydrates without warnings', async () => {
-        const warnings = await testHydration('w-pagination', {});
+    test("default (no attributes) hydrates without warnings", async () => {
+        const warnings = await testHydration("w-pagination", {});
         expect(warnings).toEqual([]);
     });
-    test('with base-url and pages hydrates without warnings', async () => {
-        const warnings = await testHydration('w-pagination', {
-            'base-url': '/page/',
+    test("with base-url and pages hydrates without warnings", async () => {
+        const warnings = await testHydration("w-pagination", {
+            "base-url": "/page/",
             pages: 10,
-            'current-page': 1,
+            "current-page": 1,
         });
         expect(warnings).toEqual([]);
     });
-    test('with current page hydrates without warnings', async () => {
-        const warnings = await testHydration('w-pagination', {
-            'base-url': '/page/',
+    test("with current page hydrates without warnings", async () => {
+        const warnings = await testHydration("w-pagination", {
+            "base-url": "/page/",
             pages: 10,
-            'current-page': 5,
+            "current-page": 5,
         });
         expect(warnings).toEqual([]);
     });
-    test('with visible pages hydrates without warnings', async () => {
-        const warnings = await testHydration('w-pagination', {
-            'base-url': '/page/',
+    test("with visible pages hydrates without warnings", async () => {
+        const warnings = await testHydration("w-pagination", {
+            "base-url": "/page/",
             pages: 20,
-            'current-page': 10,
-            'visible-pages': 5,
+            "current-page": 10,
+            "visible-pages": 5,
         });
         expect(warnings).toEqual([]);
     });