@ukic/canary-web-components 2.0.0-canary.0

package/dist/collection/components/ic-pagination/test/basic/ic-pagination.e2e.js

@@ -0,0 +1,128 @@
+import { newE2EPage } from "@stencil/core/testing";
+describe("ic-pagination", () => {
+  it("should emit the correct page value when `page 2` is clicked", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<ic-pagination pages="15"
+    type="complex"
+    adjacent-count="1"
+    boundary-count="1" />`);
+    const pagItem = await page.find("ic-pagination >>> #pagination-item-2");
+    const icPageChange = await page.spyOnEvent("icPageChange");
+    await page.waitForChanges();
+    await pagItem.click();
+    await page.waitForChanges();
+    expect(icPageChange).toHaveReceivedEventDetail({ value: 2 });
+  });
+  it("should emit the correct page value when `next page` is clicked", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<ic-pagination pages="15"
+    type="complex"
+    adjacent-count="1"
+    boundary-count="1" />`);
+    const nextPage = await page.find("ic-pagination >>> #next-page-button");
+    const icPageChange = await page.spyOnEvent("icPageChange");
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    expect(icPageChange).toHaveReceivedEventDetail({ value: 2 });
+  });
+  it("should emit the correct page value when `page 13` is clicked", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<ic-pagination pages="15"
+    type="complex"
+    adjacent-count="1"
+    boundary-count="1" />`);
+    const lastPage = await page.find("ic-pagination >>> #last-page-button");
+    const icPageChange = await page.spyOnEvent("icPageChange");
+    await page.waitForChanges();
+    await lastPage.click();
+    await page.waitForChanges();
+    const pagItem = await page.find("ic-pagination >>> #pagination-item-13");
+    await page.waitForChanges();
+    await pagItem.click();
+    await page.waitForChanges();
+    expect(icPageChange).toHaveReceivedEventDetail({ value: 13 });
+  });
+  it("should emit the correct page value when the `previous page` button is clicked", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<ic-pagination pages="15"
+    type="complex"
+    adjacent-count="1"
+    boundary-count="1" />`);
+    const lastPage = await page.find("ic-pagination >>> #last-page-button");
+    const icPageChange = await page.spyOnEvent("icPageChange");
+    await page.waitForChanges();
+    await lastPage.click();
+    await page.waitForChanges();
+    const previousPage = await page.find("ic-pagination >>> #previous-page-button");
+    await page.waitForChanges();
+    await previousPage.click();
+    await page.waitForChanges();
+    expect(icPageChange).toHaveReceivedEventDetail({ value: 14 });
+  });
+  it("should emit the correct page value when the `first page` button is clicked", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<ic-pagination pages="15"
+    type="complex"
+    adjacent-count="1"
+    boundary-count="1" />`);
+    const lastPage = await page.find("ic-pagination >>> #last-page-button");
+    const icPageChange = await page.spyOnEvent("icPageChange");
+    await page.waitForChanges();
+    await lastPage.click();
+    await page.waitForChanges();
+    const previousPage = await page.find("ic-pagination >>> #first-page-button");
+    await page.waitForChanges();
+    await previousPage.click();
+    await page.waitForChanges();
+    expect(icPageChange).toHaveReceivedEventDetail({ value: 1 });
+  });
+  it("should emit the correct page value when the midddle state is reached and the adjacent-count `page 7` button is clicked", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<ic-pagination pages="15"
+    type="complex"
+    adjacent-count="1"
+    boundary-count="1" />`);
+    const nextPage = await page.find("ic-pagination >>> #next-page-button");
+    const icPageChange = await page.spyOnEvent("icPageChange");
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    const pagItem = await page.find("ic-pagination >>> #pagination-item-7");
+    await page.waitForChanges();
+    await pagItem.click();
+    await page.waitForChanges();
+    expect(icPageChange).toHaveReceivedEventDetail({ value: 7 });
+  });
+  it("should return false when the midddle state is reached and the adjacent-count `page 8` (out of bounds) button is clicked", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<ic-pagination pages="15"
+    type="complex"
+    adjacent-count="1"
+    boundary-count="1" />`);
+    const nextPage = await page.find("ic-pagination >>> #next-page-button");
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    await nextPage.click();
+    await page.waitForChanges();
+    const pagItem = await page.find("ic-pagination >>> #pagination-item-8");
+    await page.waitForChanges();
+    expect(pagItem).toBe(null);
+  });
+});
+//# sourceMappingURL=ic-pagination.e2e.js.map

package/dist/collection/components/ic-pagination/test/basic/ic-pagination.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ic-pagination.e2e.js","sourceRoot":"","sources":["../../../../../src/components/ic-pagination/test/basic/ic-pagination.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import { newE2EPage } from \"@stencil/core/testing\";\n\ndescribe(\"ic-pagination\", () => {\n  it(\"should emit the correct page value when `page 2` is clicked\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`<ic-pagination pages=\"15\"\n    type=\"complex\"\n    adjacent-count=\"1\"\n    boundary-count=\"1\" />`);\n\n    const pagItem = await page.find(\"ic-pagination >>> #pagination-item-2\");\n\n    const icPageChange = await page.spyOnEvent(\"icPageChange\");\n\n    await page.waitForChanges();\n\n    await pagItem.click();\n\n    await page.waitForChanges();\n\n    expect(icPageChange).toHaveReceivedEventDetail({ value: 2 });\n  });\n  it(\"should emit the correct page value when `next page` is clicked\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`<ic-pagination pages=\"15\"\n    type=\"complex\"\n    adjacent-count=\"1\"\n    boundary-count=\"1\" />`);\n\n    const nextPage = await page.find(\"ic-pagination >>> #next-page-button\");\n\n    const icPageChange = await page.spyOnEvent(\"icPageChange\");\n\n    await page.waitForChanges();\n\n    await nextPage.click();\n\n    await page.waitForChanges();\n\n    expect(icPageChange).toHaveReceivedEventDetail({ value: 2 });\n  });\n  it(\"should emit the correct page value when `page 13` is clicked\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`<ic-pagination pages=\"15\"\n    type=\"complex\"\n    adjacent-count=\"1\"\n    boundary-count=\"1\" />`);\n\n    const lastPage = await page.find(\"ic-pagination >>> #last-page-button\");\n\n    const icPageChange = await page.spyOnEvent(\"icPageChange\");\n\n    await page.waitForChanges();\n\n    await lastPage.click();\n\n    await page.waitForChanges();\n\n    const pagItem = await page.find(\"ic-pagination >>> #pagination-item-13\");\n\n    await page.waitForChanges();\n\n    await pagItem.click();\n\n    await page.waitForChanges();\n\n    expect(icPageChange).toHaveReceivedEventDetail({ value: 13 });\n  });\n  it(\"should emit the correct page value when the `previous page` button is clicked\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`<ic-pagination pages=\"15\"\n    type=\"complex\"\n    adjacent-count=\"1\"\n    boundary-count=\"1\" />`);\n\n    const lastPage = await page.find(\"ic-pagination >>> #last-page-button\");\n\n    const icPageChange = await page.spyOnEvent(\"icPageChange\");\n\n    await page.waitForChanges();\n\n    await lastPage.click();\n\n    await page.waitForChanges();\n\n    const previousPage = await page.find(\n      \"ic-pagination >>> #previous-page-button\"\n    );\n\n    await page.waitForChanges();\n\n    await previousPage.click();\n\n    await page.waitForChanges();\n\n    expect(icPageChange).toHaveReceivedEventDetail({ value: 14 });\n  });\n  it(\"should emit the correct page value when the `first page` button is clicked\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`<ic-pagination pages=\"15\"\n    type=\"complex\"\n    adjacent-count=\"1\"\n    boundary-count=\"1\" />`);\n\n    const lastPage = await page.find(\"ic-pagination >>> #last-page-button\");\n\n    const icPageChange = await page.spyOnEvent(\"icPageChange\");\n\n    await page.waitForChanges();\n\n    await lastPage.click();\n\n    await page.waitForChanges();\n\n    const previousPage = await page.find(\n      \"ic-pagination >>> #first-page-button\"\n    );\n\n    await page.waitForChanges();\n\n    await previousPage.click();\n\n    await page.waitForChanges();\n\n    expect(icPageChange).toHaveReceivedEventDetail({ value: 1 });\n  });\n  it(\"should emit the correct page value when the midddle state is reached and the adjacent-count `page 7` button is clicked\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`<ic-pagination pages=\"15\"\n    type=\"complex\"\n    adjacent-count=\"1\"\n    boundary-count=\"1\" />`);\n\n    const nextPage = await page.find(\"ic-pagination >>> #next-page-button\");\n\n    const icPageChange = await page.spyOnEvent(\"icPageChange\");\n\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n\n    const pagItem = await page.find(\"ic-pagination >>> #pagination-item-7\");\n\n    await page.waitForChanges();\n\n    await pagItem.click();\n\n    await page.waitForChanges();\n\n    expect(icPageChange).toHaveReceivedEventDetail({ value: 7 });\n  });\n  it(\"should return false when the midddle state is reached and the adjacent-count `page 8` (out of bounds) button is clicked\", async () => {\n    const page = await newE2EPage();\n\n    await page.setContent(`<ic-pagination pages=\"15\"\n    type=\"complex\"\n    adjacent-count=\"1\"\n    boundary-count=\"1\" />`);\n\n    const nextPage = await page.find(\"ic-pagination >>> #next-page-button\");\n\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n    await nextPage.click();\n    await page.waitForChanges();\n\n    const pagItem = await page.find(\"ic-pagination >>> #pagination-item-8\");\n\n    await page.waitForChanges();\n\n    expect(pagItem).toBe(null);\n  });\n});\n"]}

package/dist/collection/components/ic-pagination/test/basic/ic-pagination.spec.js

@@ -0,0 +1,335 @@
+import { Pagination } from "../../ic-pagination";
+import { Button } from "../../../ic-button/ic-button";
+import { newSpecPage } from "@stencil/core/testing";
+import { PaginationItem } from "../../../ic-pagination-item/ic-pagination-item";
+describe("ic-pagination simple appearance component", () => {
+  it("should render with 10 pages", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=10 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render with ten pages");
+  });
+  it("should renderon the last pages", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages="15" default-page="15" ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render with ten pages");
+  });
+  it("should render with the default page selected", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages="15" default-page=4 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render at the default page");
+  });
+  it("should render with first and last buttons disabled", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages="15" hide-first-page-button=true hide-last-page-button=true></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("no first or last page button");
+  });
+  it("should render without current page", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages="15" hide-current-page=true ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("no current page");
+  });
+  it("should render all pages when total pages less than min width based on boundary-count and adjacent-count", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination
+      pages="11"
+      type="complex"
+      adjacent-count="2"
+      boundary-count="2" ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("pages less than adjacent-count + boundary-count");
+  });
+  it("should render with interactions disabled", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages="15" loading=true ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("loading");
+  });
+  it("should click the next page button", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" ></ic-pagination>
+      `,
+    });
+    const btn = (await page.root.shadowRoot.querySelector("#next-page-button"));
+    const pageEl = (await page.root.shadowRoot.querySelector("ic-pagination-item"));
+    await btn.click();
+    await page.waitForChanges();
+    expect(pageEl.page).toBe(2);
+  });
+  it("should click the last page button", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" ></ic-pagination>
+      `,
+    });
+    const btn = (await page.root.shadowRoot.querySelector("#last-page-button"));
+    const pageEl = (await page.root.shadowRoot.querySelector("ic-pagination-item"));
+    await btn.click();
+    await page.waitForChanges();
+    expect(pageEl.page).toBe(15);
+  });
+  it("should click the previous page button", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" default-page=5 ></ic-pagination>
+      `,
+    });
+    const btn = (await page.root.shadowRoot.querySelector("#previous-page-button"));
+    const pageEl = (await page.root.shadowRoot.querySelector("ic-pagination-item"));
+    await btn.click();
+    await page.waitForChanges();
+    expect(pageEl.page).toBe(4);
+  });
+  it("should click the first page button", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" default-page=5 ></ic-pagination>
+      `,
+    });
+    const btn = (await page.root.shadowRoot.querySelector("#first-page-button"));
+    const pageEl = (await page.root.shadowRoot.querySelector("ic-pagination-item"));
+    await btn.click();
+    await page.waitForChanges();
+    expect(pageEl.page).toBe(1);
+  });
+});
+describe("ic-pagination complex type", () => {
+  it("should render as complex type", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type='complex' ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex pagination");
+  });
+  it("should render as complex type without first page button", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type='complex' hide-first-page-button=true ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex pagination with no first page button");
+  });
+  it("should render as complex type without last page button", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type='complex' hide-last-page-button=true ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex pagination with no last page button");
+  });
+  it("should render as complex type with 20 pages", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination type="complex" pages=20 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex pagination with 20 pages");
+  });
+  it("should render as complex type with 0 adjacent items and 0 boundary items", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination
+      pages=15
+      type="complex"
+      adjacent-count=0
+    ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 0 adjacent items and 0 boundary items");
+  });
+  it("should render as complex type with 0 adjacent items and 0 boundary items with default page set at 7", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type="complex" adjacent-count=0 boundary-count=0 default-page=7 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 0 adjacent items and 0 boundary items and default page 7");
+  });
+  it("should render as complex type with 0 adjacent items and 0 boundary items with default page set at 15", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type="complex" adjacent-count=0 boundary-count=0 default-page=15 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 0 adjacent items and 0 boundary items and default page 15");
+  });
+  it("should render in complex type with 1 adjacent items and 0 boundary items", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type="complex" adjacent-count=1 boundary-count=0 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 1 adjacent items and 0 boundary items");
+  });
+  it("should render as complex type with 2 adjacent items and 0 boundary items", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type="complex" adjacent-count=2 boundary-count=0 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 2 adjacent items and 0 boundary items");
+  });
+  it("should render as complex type with 0 adjacent items and 1 boundary items", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type="complex" adjacent-count=0 boundary-count=1 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 0 adjacent items and 1 boundary items");
+  });
+  it("should render as complex type with 0 adjacent items and 2 boundary items", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type="complex" adjacent-count=0 boundary-count=2 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 0 adjacent items and 2 boundary items");
+  });
+  it("should render as complex type with 1 adjacent items and 2 boundary items", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type="complex" adjacent-count=1 boundary-count=2 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 1 adjacent items and 2 boundary items");
+  });
+  it("should render as complex type with 2 adjacent items and 1 boundary items", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type="complex" adjacent-count=2 boundary-count=1 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 2 adjacent items and 1 boundary items");
+  });
+  it("should render as complex type with 2 adjacent items and 2 boundary items", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 type="complex" adjacent-count=2 boundary-count=2 ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render complex type with 2 adjacent items and 2 boundary items");
+  });
+  it("should click the next page button in complex type", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages=15 type="complex" default-page=5 ></ic-pagination>
+      `,
+    });
+    const btn = (await page.root.shadowRoot.querySelector("#next-page-button"));
+    const pageEl = (await page.root.shadowRoot.querySelector("ic-pagination-item"));
+    await btn.click();
+    await page.waitForChanges();
+    expect(pageEl.page).toBe(1);
+  });
+  it("should click the previous page button in complex type", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" type="complex" default-page=5 ></ic-pagination>
+      `,
+    });
+    const btn = (await page.root.shadowRoot.querySelector("#previous-page-button"));
+    const pageEl = (await page.root.shadowRoot.querySelector("ic-pagination-item"));
+    await btn.click();
+    await page.waitForChanges();
+    expect(pageEl.page).toBe(1);
+  });
+  it("should click the last page button in complex type", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" type="complex" default-page=5 ></ic-pagination>
+      `,
+    });
+    const btn = (await page.root.shadowRoot.querySelector("#last-page-button"));
+    const pageEl = (await page.root.shadowRoot.querySelector("ic-pagination-item"));
+    await btn.click();
+    await page.waitForChanges();
+    expect(pageEl.page).toBe(1);
+  });
+  it("should click the first page button in complex type", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" type="complex" default-page="15" ></ic-pagination>
+      `,
+    });
+    const btn = (await page.root.shadowRoot.querySelector("#first-page-button"));
+    const pageEl = (await page.root.shadowRoot.querySelector("ic-pagination-item"));
+    await pageEl.click();
+    await btn.click();
+    await page.waitForChanges();
+    expect(pageEl.page).toBe(1);
+  });
+  it("should click the pagination-item in complex type", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" type="complex" default-page=2 pages="15" ></ic-pagination>
+      `,
+    });
+    const icPagItem = (await page.root.shadowRoot.querySelector("ic-pagination-item"));
+    const btn = (await icPagItem.shadowRoot.querySelector(".item-container.default.page"));
+    await btn.click();
+    await icPagItem.click();
+    await page.waitForChanges();
+    expect(icPagItem.page).toBe(1);
+  });
+  it("should emit an event", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" type="complex" default-page=2 pages="15" ></ic-pagination>
+      `,
+    });
+    await page.rootInstance.paginationItemClickHandler({ detail: { page: 1 } });
+    await page.waitForChanges();
+    expect(page.root.currentPage).toBe(1);
+  });
+});
+describe("ic-pagination appearance tests", () => {
+  it("should render as simple type in dark appearance", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages="15" appearance='dark' ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render dark simple pagination");
+  });
+  it("should render as simple type in light appearance", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages="15" appearance='light' ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render light simple pagination");
+  });
+  it("should render as complex type in dark appearance", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages="15" type='complex' appearance='dark' ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render dark complex pagination");
+  });
+  it("should render as complex type in light appearance", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages="15" type='complex' appearance='light' ></ic-pagination>`,
+    });
+    expect(page.root).toMatchSnapshot("render light complex pagination");
+  });
+  it("should change page when current page set with public method", async () => {
+    const page = await newSpecPage({
+      components: [Pagination, Button, PaginationItem],
+      html: `<ic-pagination pages="15" type="complex"></ic-pagination>
+      `,
+    });
+    expect(page.rootInstance.currentPage).toBe(1);
+    await page.root.setCurrentPage(3);
+    await page.waitForChanges();
+    expect(page.rootInstance.currentPage).toBe(3);
+  });
+  it("should update number of pages dynamically if the prop is updated", async () => {
+    const page = await newSpecPage({
+      components: [Pagination],
+      html: `<ic-pagination pages=15 ></ic-pagination>`,
+    });
+    expect(page.rootInstance.pages).toEqual(15);
+    page.rootInstance.pages = 7;
+    await page.waitForChanges();
+    expect(page.rootInstance.pages).toEqual(7);
+  });
+});
+//# sourceMappingURL=ic-pagination.spec.js.map

package/dist/collection/components/ic-pagination/test/basic/ic-pagination.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ic-pagination.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-pagination/test/basic/ic-pagination.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { Pagination } from \"../../ic-pagination\";\nimport { Button } from \"../../../ic-button/ic-button\";\nimport { newSpecPage } from \"@stencil/core/testing\";\nimport { AnyHTMLElement } from \"@stencil/core/internal\";\nimport { PaginationItem } from \"../../../ic-pagination-item/ic-pagination-item\";\n\ndescribe(\"ic-pagination simple appearance component\", () => {\n  it(\"should render with 10 pages\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=10 ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"render with ten pages\");\n  });\n  it(\"should renderon the last pages\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=\"15\" default-page=\"15\" ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"render with ten pages\");\n  });\n\n  it(\"should render with the default page selected\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=\"15\" default-page=4 ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"render at the default page\");\n  });\n\n  it(\"should render with first and last buttons disabled\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=\"15\" hide-first-page-button=true hide-last-page-button=true></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"no first or last page button\");\n  });\n  it(\"should render without current page\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=\"15\" hide-current-page=true ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"no current page\");\n  });\n  it(\"should render all pages when total pages less than min width based on boundary-count and adjacent-count\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination\n      pages=\"11\"\n      type=\"complex\"\n      adjacent-count=\"2\"\n      boundary-count=\"2\" ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"pages less than adjacent-count + boundary-count\"\n    );\n  });\n  it(\"should render with interactions disabled\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=\"15\" loading=true ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"loading\");\n  });\n  it(\"should click the next page button\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" ></ic-pagination>\n      `,\n    });\n\n    const btn = (await page.root.shadowRoot.querySelector(\n      \"#next-page-button\"\n    )) as HTMLIcButtonElement;\n    const pageEl = (await page.root.shadowRoot.querySelector(\n      \"ic-pagination-item\"\n    )) as HTMLIcPaginationItemElement;\n\n    await btn.click();\n    await page.waitForChanges();\n\n    expect(pageEl.page).toBe(2);\n  });\n\n  it(\"should click the last page button\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" ></ic-pagination>\n      `,\n    });\n\n    const btn = (await page.root.shadowRoot.querySelector(\n      \"#last-page-button\"\n    )) as HTMLIcButtonElement;\n    const pageEl = (await page.root.shadowRoot.querySelector(\n      \"ic-pagination-item\"\n    )) as HTMLIcPaginationItemElement;\n\n    await btn.click();\n    await page.waitForChanges();\n\n    expect(pageEl.page).toBe(15);\n  });\n  it(\"should click the previous page button\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" default-page=5 ></ic-pagination>\n      `,\n    });\n\n    const btn = (await page.root.shadowRoot.querySelector(\n      \"#previous-page-button\"\n    )) as HTMLIcButtonElement;\n    const pageEl = (await page.root.shadowRoot.querySelector(\n      \"ic-pagination-item\"\n    )) as HTMLIcPaginationItemElement;\n\n    await btn.click();\n    await page.waitForChanges();\n\n    expect(pageEl.page).toBe(4);\n  });\n  it(\"should click the first page button\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" default-page=5 ></ic-pagination>\n      `,\n    });\n\n    const btn = (await page.root.shadowRoot.querySelector(\n      \"#first-page-button\"\n    )) as HTMLIcButtonElement;\n    const pageEl = (await page.root.shadowRoot.querySelector(\n      \"ic-pagination-item\"\n    )) as HTMLIcPaginationItemElement;\n\n    await btn.click();\n    await page.waitForChanges();\n\n    expect(pageEl.page).toBe(1);\n  });\n});\ndescribe(\"ic-pagination complex type\", () => {\n  it(\"should render as complex type\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type='complex' ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\"render complex pagination\");\n  });\n\n  it(\"should render as complex type without first page button\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type='complex' hide-first-page-button=true ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex pagination with no first page button\"\n    );\n  });\n\n  it(\"should render as complex type without last page button\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type='complex' hide-last-page-button=true ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex pagination with no last page button\"\n    );\n  });\n\n  it(\"should render as complex type with 20 pages\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination type=\"complex\" pages=20 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex pagination with 20 pages\"\n    );\n  });\n\n  it(\"should render as complex type with 0 adjacent items and 0 boundary items\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination\n      pages=15\n      type=\"complex\"\n      adjacent-count=0\n    ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 0 adjacent items and 0 boundary items\"\n    );\n  });\n\n  it(\"should render as complex type with 0 adjacent items and 0 boundary items with default page set at 7\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type=\"complex\" adjacent-count=0 boundary-count=0 default-page=7 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 0 adjacent items and 0 boundary items and default page 7\"\n    );\n  });\n\n  it(\"should render as complex type with 0 adjacent items and 0 boundary items with default page set at 15\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type=\"complex\" adjacent-count=0 boundary-count=0 default-page=15 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 0 adjacent items and 0 boundary items and default page 15\"\n    );\n  });\n\n  it(\"should render in complex type with 1 adjacent items and 0 boundary items\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type=\"complex\" adjacent-count=1 boundary-count=0 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 1 adjacent items and 0 boundary items\"\n    );\n  });\n\n  it(\"should render as complex type with 2 adjacent items and 0 boundary items\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type=\"complex\" adjacent-count=2 boundary-count=0 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 2 adjacent items and 0 boundary items\"\n    );\n  });\n\n  it(\"should render as complex type with 0 adjacent items and 1 boundary items\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type=\"complex\" adjacent-count=0 boundary-count=1 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 0 adjacent items and 1 boundary items\"\n    );\n  });\n\n  it(\"should render as complex type with 0 adjacent items and 2 boundary items\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type=\"complex\" adjacent-count=0 boundary-count=2 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 0 adjacent items and 2 boundary items\"\n    );\n  });\n\n  it(\"should render as complex type with 1 adjacent items and 2 boundary items\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type=\"complex\" adjacent-count=1 boundary-count=2 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 1 adjacent items and 2 boundary items\"\n    );\n  });\n\n  it(\"should render as complex type with 2 adjacent items and 1 boundary items\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type=\"complex\" adjacent-count=2 boundary-count=1 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 2 adjacent items and 1 boundary items\"\n    );\n  });\n\n  it(\"should render as complex type with 2 adjacent items and 2 boundary items\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 type=\"complex\" adjacent-count=2 boundary-count=2 ></ic-pagination>`,\n    });\n    expect(page.root).toMatchSnapshot(\n      \"render complex type with 2 adjacent items and 2 boundary items\"\n    );\n  });\n\n  it(\"should click the next page button in complex type\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=15 type=\"complex\" default-page=5 ></ic-pagination>\n      `,\n    });\n\n    const btn = (await page.root.shadowRoot.querySelector(\n      \"#next-page-button\"\n    )) as HTMLIcButtonElement;\n    const pageEl = (await page.root.shadowRoot.querySelector(\n      \"ic-pagination-item\"\n    )) as HTMLIcPaginationItemElement;\n\n    await btn.click();\n    await page.waitForChanges();\n\n    expect(pageEl.page).toBe(1);\n  });\n  it(\"should click the previous page button in complex type\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" type=\"complex\" default-page=5 ></ic-pagination>\n      `,\n    });\n\n    const btn = (await page.root.shadowRoot.querySelector(\n      \"#previous-page-button\"\n    )) as HTMLIcButtonElement;\n    const pageEl = (await page.root.shadowRoot.querySelector(\n      \"ic-pagination-item\"\n    )) as HTMLIcPaginationItemElement;\n\n    await btn.click();\n    await page.waitForChanges();\n\n    expect(pageEl.page).toBe(1);\n  });\n  it(\"should click the last page button in complex type\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" type=\"complex\" default-page=5 ></ic-pagination>\n      `,\n    });\n\n    const btn = (await page.root.shadowRoot.querySelector(\n      \"#last-page-button\"\n    )) as HTMLIcButtonElement;\n    const pageEl = (await page.root.shadowRoot.querySelector(\n      \"ic-pagination-item\"\n    )) as HTMLIcPaginationItemElement;\n\n    await btn.click();\n    await page.waitForChanges();\n\n    expect(pageEl.page).toBe(1);\n  });\n  it(\"should click the first page button in complex type\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" type=\"complex\" default-page=\"15\" ></ic-pagination>\n      `,\n    });\n\n    const btn = (await page.root.shadowRoot.querySelector(\n      \"#first-page-button\"\n    )) as HTMLIcButtonElement;\n    const pageEl = (await page.root.shadowRoot.querySelector(\n      \"ic-pagination-item\"\n    )) as HTMLIcPaginationItemElement;\n\n    await pageEl.click();\n    await btn.click();\n    await page.waitForChanges();\n\n    expect(pageEl.page).toBe(1);\n  });\n  it(\"should click the pagination-item in complex type\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" type=\"complex\" default-page=2 pages=\"15\" ></ic-pagination>\n      `,\n    });\n\n    const icPagItem = (await page.root.shadowRoot.querySelector(\n      \"ic-pagination-item\"\n    )) as HTMLIcPaginationItemElement;\n\n    const btn = (await icPagItem.shadowRoot.querySelector(\n      \".item-container.default.page\"\n    )) as AnyHTMLElement;\n\n    await btn.click();\n    await icPagItem.click();\n    await page.waitForChanges();\n\n    expect(icPagItem.page).toBe(1);\n  });\n\n  it(\"should emit an event\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" type=\"complex\" default-page=2 pages=\"15\" ></ic-pagination>\n      `,\n    });\n    await page.rootInstance.paginationItemClickHandler({ detail: { page: 1 } });\n    await page.waitForChanges();\n\n    expect(page.root.currentPage).toBe(1);\n  });\n});\ndescribe(\"ic-pagination appearance tests\", () => {\n  it(\"should render as simple type in dark appearance\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=\"15\" appearance='dark' ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"render dark simple pagination\");\n  });\n  it(\"should render as simple type in light appearance\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=\"15\" appearance='light' ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"render light simple pagination\");\n  });\n  it(\"should render as complex type in dark appearance\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=\"15\" type='complex' appearance='dark' ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"render dark complex pagination\");\n  });\n  it(\"should render as complex type in light appearance\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=\"15\" type='complex' appearance='light' ></ic-pagination>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"render light complex pagination\");\n  });\n\n  it(\"should change page when current page set with public method\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination, Button, PaginationItem],\n      html: `<ic-pagination pages=\"15\" type=\"complex\"></ic-pagination>\n      `,\n    });\n    expect(page.rootInstance.currentPage).toBe(1);\n\n    await page.root.setCurrentPage(3);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.currentPage).toBe(3);\n  });\n\n  it(\"should update number of pages dynamically if the prop is updated\", async () => {\n    const page = await newSpecPage({\n      components: [Pagination],\n      html: `<ic-pagination pages=15 ></ic-pagination>`,\n    });\n\n    expect(page.rootInstance.pages).toEqual(15);\n\n    page.rootInstance.pages = 7;\n\n    await page.waitForChanges();\n\n    expect(page.rootInstance.pages).toEqual(7);\n  });\n});\n"]}

package/dist/collection/components/ic-pagination-bar/ic-pagination-bar.css

@@ -0,0 +1,107 @@
+:host() {
+  display: block;
+}
+
+.pagination-bar {
+  height: 3.5rem;
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: var(--ic-space-xl);
+  padding: var(--ic-space-xs) var(--ic-space-md);
+  box-sizing: border-box;
+}
+
+.pagination-bar-left {
+  justify-content: flex-start;
+}
+
+.item-controls {
+  display: flex;
+  align-items: center;
+  gap: var(--ic-space-xl);
+}
+
+.pagination-bar-space-between .item-controls {
+  margin-right: auto;
+}
+
+.items-per-page-holder {
+  display: flex;
+  align-items: center;
+  gap: var(--ic-space-xs);
+}
+
+.items-per-page-input {
+  --input-width: 5rem;
+}
+
+.pagination-controls {
+  display: flex;
+  align-items: center;
+  gap: var(--ic-space-xl);
+}
+
+.pagination-controls-wrap {
+  flex-direction: column;
+  align-items: flex-end;
+  gap: var(--ic-space-xs);
+}
+
+.pagination-bar-space-between .pagination-controls {
+  margin-left: auto;
+}
+
+.go-to-page-holder {
+  display: flex;
+  align-items: center;
+  gap: var(--ic-space-xs);
+}
+
+.go-to-page-input {
+  --input-width: var(--ic-space-xl);
+}
+
+.go-to-page-button {
+  --min-width: var(--ic-space-xl);
+}
+
+.pagination-text-default,
+.pagination-text-dark,
+.pagination-text-light {
+  white-space: nowrap;
+}
+
+.pagination-text-light {
+  color: var(--ic-color-white-text);
+}
+
+@media screen and (max-width: 768px) {
+  .pagination-bar {
+    flex-direction: column;
+    align-items: flex-end;
+    height: -moz-fit-content;
+    height: fit-content;
+    gap: var(--ic-space-xs);
+  }
+
+  .pagination-bar-left {
+    align-items: flex-start;
+  }
+}
+
+@media screen and (max-width: 320px) {
+  .item-controls,
+  .pagination-controls {
+    flex-direction: column;
+    align-items: flex-end;
+    gap: var(--ic-space-xs);
+  }
+
+  .pagination-bar-left .item-controls,
+  .pagination-bar-left .pagination-controls,
+  .pagination-bar-space-between .item-controls,
+  .pagination-bar-space-between .pagination-controls {
+    align-items: flex-start;
+  }
+}