npm - @ukic/web-components - Versions diffs - 2.26.0 → 3.0.0 - Mend

@ukic/web-components 2.26.0 → 3.0.0

Files changed (856) hide show

package/dist/collection/components/ic-page-header/test/basic/ic-page-header.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-page-header.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-page-header/test/basic/ic-page-header.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { PageHeader } from \"../../ic-page-header\";\nimport { DEVICE_SIZES } from \"../../../../utils/helpers\";\nimport { mockDeviceSize } from \"../../../../testspec.setup\";\nimport { Button } from \"../../../ic-button/ic-button\";\nimport * as helpers from \"../../../../utils/helpers\";\nimport { BreadcrumbGroup } from \"../../../ic-breadcrumb-group/ic-breadcrumb-group\";\nimport { Breadcrumb } from \"../../../ic-breadcrumb/ic-breadcrumb\";\n\ndescribe(\"simple ic-page-header renders\", () => {\n it(\"should render with a heading & sub-heading\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `<ic-page-header heading=\"Page header\" subheading=\"This is a simple page header component and this is the text.\"></ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\n \"should render with a heading & sub-heading\"\n );\n });\n\n it(\"should return null for slot 'tabs'\", async () => {\n expect(helpers.getSlot(undefined, \"tabs\")).toBeNull();\n });\n});\n\ndescribe(\"ic-page-header component renders additional functionality\", () => {\n it(\"should render actions\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header\n heading=\"Page header\"\n subheading=\"This is a simple page header component and this is the text.\"\n >\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render actions\");\n });\n\n it(\"should render an input field\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header\n heading=\"Page header\"\n subheading=\"This is a simple page header component and this is the text.\"\n >\n <ic-status-tag slot=\"heading-adornment\" label=\"Beta\"></ic-status-tag>\n <ic-text-field slot=\"input\" placeholder=\"Enter your input\" hide-label />\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render an input field\");\n });\n\n it(\"should render a stepper\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header heading=\"Create a coffee\">\n <ic-stepper slot=\"stepper\">\n <ic-step step-title=\"Warm kettle\" step-type=\"completed\"></ic-step>\n <ic-step\n step-title=\"Warm milk\"\n step-subtitle=\"Optional\"\n step-type=\"completed\"\n ></ic-step>\n <ic-step step-title=\"Pour milk\" step-type=\"current\"></ic-step>\n </ic-stepper>\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render a stepper\");\n });\n\n it(\"should render tabs\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header heading=\"Coffee recipes\" subheading=\"This is a simple page header component and this is the text.\">\n <ic-status-tag slot=\"heading-adornment\" label=\"Beta\"></ic-status-tag>\n <ic-navigation-item\n slot=\"tabs\"\n label=\"All recipes\"\n href=\"/all-recipes\"\n selected\n ></ic-navigation-item>\n <ic-navigation-item\n slot=\"tabs\"\n label=\"Favourites\"\n href=\"/favourites\"\n ></ic-navigation-item>\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render tabs\");\n });\n\n it(\"should render actions, input & tabs\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header heading=\"Coffee recipes\" subheading=\"This is a simple page header component and this is the text.\">\n <ic-status-tag slot=\"heading-adornment\" label=\"Beta\"></ic-status-tag>\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n <ic-navigation-item\n slot=\"tabs\"\n label=\"All recipes\"\n href=\"/all-recipes\"\n selected\n ></ic-navigation-item>\n <ic-navigation-item\n slot=\"tabs\"\n label=\"Favourites\"\n href=\"/favourites\"\n ></ic-navigation-item>\n <ic-text-field slot=\"input\" placeholder=\"Enter your input\" hide-label />\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render actions, input & tabs\");\n });\n\n it(\"should render actions, input & stepper\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header heading=\"Coffee recipes\" subheading=\"This is a simple page header component and this is the text.\">\n <ic-stepper slot=\"stepper\">\n <ic-step step-title=\"Warm kettle\" step-type=\"completed\"></ic-step>\n <ic-step\n step-title=\"Warm milk\"\n step-subtitle=\"Optional\"\n step-type=\"completed\"\n ></ic-step>\n <ic-step step-title=\"Pour milk\" step-type=\"current\"></ic-step>\n </ic-stepper>\n <ic-status-tag slot=\"heading-adornment\" label=\"Beta\"></ic-status-tag>\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n <ic-text-field slot=\"input\" placeholder=\"Enter your input\" hide-label />\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render actions, input & stepper\");\n });\n\n it(\"should render with breadcrumbs\", async () => {\n const page = await newSpecPage({\n components: [PageHeader, BreadcrumbGroup, Breadcrumb],\n html: `\n <ic-page-header heading=\"Coffee recipes\" subheading=\"This is a simple page header component and this is the text.\">\n <ic-breadcrumb-group slot=\"breadcrumbs\">\n <ic-breadcrumb\n page-title=\"Breadcrumb 1\"\n href=\"/breadcrumb-1\"\n ></ic-breadcrumb>\n <ic-breadcrumb\n current=\"true\"\n page-title=\"Breadcrumb 2\"\n href=\"/breadcrumb-2\"\n ></ic-breadcrumb>\n </ic-breadcrumb-group> \n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render with breadcrumbs\");\n });\n\n it(\"should render with a custom aria-label\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `<ic-page-header heading=\"Page header\" subheading=\"This is a simple page header component and this is the text.\" aria-label=\"header\"></ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render with a custom aria-label\");\n });\n});\n\ndescribe(\"resizeObserver for ic-page-header\", () => {\n it(\"should set the deviceSize prop correctly in resizeObserver\", async () => {\n const page = await newSpecPage({\n components: [PageHeader, Button],\n html: `\n <ic-page-header\n heading=\"Page header\"\n sub-heading=\"This is a page header component with additional functionality and this is the text.\"\n reverse-order\n >\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n </ic-page-header>\n `,\n });\n\n await page.waitForChanges();\n\n page.rootInstance.areButtonsReversed = true;\n await page.waitForChanges();\n\n mockDeviceSize(DEVICE_SIZES.S);\n\n await page.rootInstance.resizeObserverCallback();\n await page.waitForChanges();\n\n expect(page.rootInstance.deviceSize).toBe(DEVICE_SIZES.S);\n\n mockDeviceSize(DEVICE_SIZES.M);\n\n await page.rootInstance.resizeObserverCallback();\n await page.waitForChanges();\n expect(page.rootInstance.deviceSize).toBe(DEVICE_SIZES.M);\n\n mockDeviceSize(DEVICE_SIZES.L);\n\n await page.rootInstance.resizeObserverCallback();\n await page.waitForChanges();\n expect(page.rootInstance.deviceSize).toBe(DEVICE_SIZES.L);\n\n mockDeviceSize(DEVICE_SIZES.XL);\n\n await page.rootInstance.resizeObserverCallback();\n await page.waitForChanges();\n expect(page.rootInstance.deviceSize).toBe(DEVICE_SIZES.XL);\n });\n\n it(\"should not call the resizeObserver if the resizeObserver is null\", async () => {\n const page = await newSpecPage({\n components: [PageHeader, Button],\n html: `\n <ic-page-header\n heading=\"Page header\"\n sub-heading=\"This is a page header component with additional functionality and this is the text.\"\n reverse-order\n >\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n </ic-page-header>\n `,\n });\n\n await page.rootInstance.runResizeObserver();\n\n page.setContent(\"\");\n });\n});\n"]}
1	+ {"version":3,"file":"ic-page-header.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-page-header/test/basic/ic-page-header.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AAC5D,OAAO,EAAE,MAAM,EAAE,MAAM,8BAA8B,CAAC;AACtD,OAAO,KAAK,OAAO,MAAM,2BAA2B,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,kDAAkD,CAAC;AACnF,OAAO,EAAE,UAAU,EAAE,MAAM,sCAAsC,CAAC;AAElE,QAAQ,CAAC,+BAA+B,EAAE,GAAG,EAAE;IAC7C,EAAE,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;QAC1D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE,mIAAmI;SAC1I,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAC/B,4CAA4C,CAC7C,CAAC;IACJ,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oCAAoC,EAAE,KAAK,IAAI,EAAE;QAClD,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC;IACxD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,2DAA2D,EAAE,GAAG,EAAE;IACzE,EAAE,CAAC,uBAAuB,EAAE,KAAK,IAAI,EAAE;QACrC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE;;;;;;;;;;;;;;;;;;;;;;wBAsBY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,uBAAuB,CAAC,CAAC;IAC7D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,8BAA8B,EAAE,KAAK,IAAI,EAAE;QAC5C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE;;;;;;;wBAOY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,8BAA8B,CAAC,CAAC;IACpE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,yBAAyB,EAAE,KAAK,IAAI,EAAE;QACvC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE;;;;;;;;;;;wBAWY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,yBAAyB,CAAC,CAAC;IAC/D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,oBAAoB,EAAE,KAAK,IAAI,EAAE;QAClC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE;;;;;;;;;;;;;;wBAcY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,oBAAoB,CAAC,CAAC;IAC1D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,qCAAqC,EAAE,KAAK,IAAI,EAAE;QACnD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBAgCY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,qCAAqC,CAAC,CAAC;IAC3E,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wCAAwC,EAAE,KAAK,IAAI,EAAE;QACtD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;wBA8BY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,wCAAwC,CAAC,CAAC;IAC9E,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,gCAAgC,EAAE,KAAK,IAAI,EAAE;QAC9C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,eAAe,EAAE,UAAU,CAAC;YACrD,IAAI,EAAE;;;;;;;;;;;;;wBAaY;SACnB,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,gCAAgC,CAAC,CAAC;IACtE,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,wCAAwC,EAAE,KAAK,IAAI,EAAE;QACtD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,CAAC;YACxB,IAAI,EAAE,uJAAuJ;SAC9J,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,wCAAwC,CAAC,CAAC;IAC9E,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,mCAAmC,EAAE,GAAG,EAAE;IACjD,EAAE,CAAC,4DAA4D,EAAE,KAAK,IAAI,EAAE;QAC1E,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,MAAM,CAAC;YAChC,IAAI,EAAE;;;;;;;;;;;;;;;;;;;;;;;;KAwBP;SACA,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,IAAI,CAAC,YAAY,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAC5C,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAE/B,MAAM,IAAI,CAAC,YAAY,CAAC,sBAAsB,EAAE,CAAC;QACjD,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAE5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAE1D,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAE/B,MAAM,IAAI,CAAC,YAAY,CAAC,sBAAsB,EAAE,CAAC;QACjD,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAE1D,cAAc,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAE/B,MAAM,IAAI,CAAC,YAAY,CAAC,sBAAsB,EAAE,CAAC;QACjD,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC;QAE1D,cAAc,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;QAEhC,MAAM,IAAI,CAAC,YAAY,CAAC,sBAAsB,EAAE,CAAC;QACjD,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,UAAU,CAAC,CAAC,IAAI,CAAC,YAAY,CAAC,EAAE,CAAC,CAAC;IAC7D,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,kEAAkE,EAAE,KAAK,IAAI,EAAE;QAChF,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,UAAU,EAAE,MAAM,CAAC;YAChC,IAAI,EAAE;;;;;;;;;;;;;;;;;;;;;;;;KAwBP;SACA,CAAC,CAAC;QAEH,MAAM,IAAI,CAAC,YAAY,CAAC,iBAAiB,EAAE,CAAC;QAE5C,IAAI,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACtB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { PageHeader } from \"../../ic-page-header\";\nimport { DEVICE_SIZES } from \"../../../../utils/helpers\";\nimport { mockDeviceSize } from \"../../../../testspec.setup\";\nimport { Button } from \"../../../ic-button/ic-button\";\nimport * as helpers from \"../../../../utils/helpers\";\nimport { BreadcrumbGroup } from \"../../../ic-breadcrumb-group/ic-breadcrumb-group\";\nimport { Breadcrumb } from \"../../../ic-breadcrumb/ic-breadcrumb\";\n\ndescribe(\"simple ic-page-header renders\", () => {\n it(\"should render with a heading & sub-heading\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `<ic-page-header heading=\"Page header\" subheading=\"This is a simple page header component and this is the text.\"></ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\n \"should render with a heading & sub-heading\"\n );\n });\n\n it(\"should return null for slot 'tabs'\", async () => {\n expect(helpers.getSlot(undefined, \"tabs\")).toBeNull();\n });\n});\n\ndescribe(\"ic-page-header component renders additional functionality\", () => {\n it(\"should render actions\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header\n heading=\"Page header\"\n subheading=\"This is a simple page header component and this is the text.\"\n >\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"left-icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render actions\");\n });\n\n it(\"should render an input field\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header\n heading=\"Page header\"\n subheading=\"This is a simple page header component and this is the text.\"\n >\n <ic-status-tag slot=\"heading-adornment\" label=\"Beta\"></ic-status-tag>\n <ic-text-field slot=\"input\" placeholder=\"Enter your input\" hide-label />\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render an input field\");\n });\n\n it(\"should render a stepper\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header heading=\"Create a coffee\">\n <ic-stepper slot=\"stepper\">\n <ic-step heading=\"Warm kettle\" type=\"completed\"></ic-step>\n <ic-step\n heading=\"Warm milk\"\n subheading=\"Optional\"\n type=\"completed\"\n ></ic-step>\n <ic-step heading=\"Pour milk\" type=\"current\"></ic-step>\n </ic-stepper>\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render a stepper\");\n });\n\n it(\"should render tabs\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header heading=\"Coffee recipes\" subheading=\"This is a simple page header component and this is the text.\">\n <ic-status-tag slot=\"heading-adornment\" label=\"Beta\"></ic-status-tag>\n <ic-navigation-item\n slot=\"tabs\"\n label=\"All recipes\"\n href=\"/all-recipes\"\n selected\n ></ic-navigation-item>\n <ic-navigation-item\n slot=\"tabs\"\n label=\"Favourites\"\n href=\"/favourites\"\n ></ic-navigation-item>\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render tabs\");\n });\n\n it(\"should render actions, input & tabs\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header heading=\"Coffee recipes\" subheading=\"This is a simple page header component and this is the text.\">\n <ic-status-tag slot=\"heading-adornment\" label=\"Beta\"></ic-status-tag>\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"left-icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n <ic-navigation-item\n slot=\"tabs\"\n label=\"All recipes\"\n href=\"/all-recipes\"\n selected\n ></ic-navigation-item>\n <ic-navigation-item\n slot=\"tabs\"\n label=\"Favourites\"\n href=\"/favourites\"\n ></ic-navigation-item>\n <ic-text-field slot=\"input\" placeholder=\"Enter your input\" hide-label />\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render actions, input & tabs\");\n });\n\n it(\"should render actions, input & stepper\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `\n <ic-page-header heading=\"Coffee recipes\" subheading=\"This is a simple page header component and this is the text.\">\n <ic-stepper slot=\"stepper\">\n <ic-step heading=\"Warm kettle\" type=\"completed\"></ic-step>\n <ic-step\n heading=\"Warm milk\"\n subheading=\"Optional\"\n type=\"completed\"\n ></ic-step>\n <ic-step heading=\"Pour milk\" type=\"current\"></ic-step>\n </ic-stepper>\n <ic-status-tag slot=\"heading-adornment\" label=\"Beta\"></ic-status-tag>\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"left-icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n <ic-text-field slot=\"input\" placeholder=\"Enter your input\" hide-label />\n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render actions, input & stepper\");\n });\n\n it(\"should render with breadcrumbs\", async () => {\n const page = await newSpecPage({\n components: [PageHeader, BreadcrumbGroup, Breadcrumb],\n html: `\n <ic-page-header heading=\"Coffee recipes\" subheading=\"This is a simple page header component and this is the text.\">\n <ic-breadcrumb-group slot=\"breadcrumbs\">\n <ic-breadcrumb\n page-title=\"Breadcrumb 1\"\n href=\"/breadcrumb-1\"\n ></ic-breadcrumb>\n <ic-breadcrumb\n current=\"true\"\n page-title=\"Breadcrumb 2\"\n href=\"/breadcrumb-2\"\n ></ic-breadcrumb>\n </ic-breadcrumb-group> \n </ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render with breadcrumbs\");\n });\n\n it(\"should render with a custom aria-label\", async () => {\n const page = await newSpecPage({\n components: [PageHeader],\n html: `<ic-page-header heading=\"Page header\" subheading=\"This is a simple page header component and this is the text.\" aria-label=\"header\"></ic-page-header>`,\n });\n\n expect(page.root).toMatchSnapshot(\"should render with a custom aria-label\");\n });\n});\n\ndescribe(\"resizeObserver for ic-page-header\", () => {\n it(\"should set the deviceSize prop correctly in resizeObserver\", async () => {\n const page = await newSpecPage({\n components: [PageHeader, Button],\n html: `\n <ic-page-header\n heading=\"Page header\"\n sub-heading=\"This is a page header component with additional functionality and this is the text.\"\n reverse-order\n >\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"left-icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n </ic-page-header>\n `,\n });\n\n await page.waitForChanges();\n\n page.rootInstance.areButtonsReversed = true;\n await page.waitForChanges();\n\n mockDeviceSize(DEVICE_SIZES.S);\n\n await page.rootInstance.resizeObserverCallback();\n await page.waitForChanges();\n\n expect(page.rootInstance.deviceSize).toBe(DEVICE_SIZES.S);\n\n mockDeviceSize(DEVICE_SIZES.M);\n\n await page.rootInstance.resizeObserverCallback();\n await page.waitForChanges();\n expect(page.rootInstance.deviceSize).toBe(DEVICE_SIZES.M);\n\n mockDeviceSize(DEVICE_SIZES.L);\n\n await page.rootInstance.resizeObserverCallback();\n await page.waitForChanges();\n expect(page.rootInstance.deviceSize).toBe(DEVICE_SIZES.L);\n\n mockDeviceSize(DEVICE_SIZES.XL);\n\n await page.rootInstance.resizeObserverCallback();\n await page.waitForChanges();\n expect(page.rootInstance.deviceSize).toBe(DEVICE_SIZES.XL);\n });\n\n it(\"should not call the resizeObserver if the resizeObserver is null\", async () => {\n const page = await newSpecPage({\n components: [PageHeader, Button],\n html: `\n <ic-page-header\n heading=\"Page header\"\n sub-heading=\"This is a page header component with additional functionality and this is the text.\"\n reverse-order\n >\n <ic-button slot=\"actions\" variant=\"primary\"\n >Create coffee\n <svg\n slot=\"left-icon\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M19 13H13V19H11V13H5V11H11V5H13V11H19V13Z\"\n fill=\"currentColor\"\n />\n </svg>\n </ic-button>\n <ic-button slot=\"actions\" variant=\"tertiary\">Filter coffee</ic-button>\n </ic-page-header>\n `,\n });\n\n await page.rootInstance.runResizeObserver();\n\n page.setContent(\"\");\n });\n});\n"]}

package/dist/collection/components/ic-pagination/ic-pagination.css CHANGED Viewed

@@ -484,3 +484,8 @@ ic-button.first-last {
 .hide-current-page {
   display: none;
 }
+.sr-only {
+  position: absolute;
+  left: -9999px;
+}

package/dist/collection/components/ic-pagination/ic-pagination.js CHANGED Viewed

@@ -59,9 +59,9 @@ export class Pagination {
         this.midItems = [];
         this.startEllipsis = false;
         this.startItems = [];
-        this.adjacentCount = 1;
+        this.adjacentPageCount = 1;
         this.appearance = "default";
-        this.boundaryCount = 1;
+        this.boundaryPageCount = 1;
         this.defaultPage = 1;
         this.disabled = false;
         this.hideCurrentPage = false;
@@ -71,14 +71,14 @@ export class Pagination {
         this.type = "simple";
         this.currentPage = this.defaultPage;
     }
-    watchAdjacentCountHandler() {
-        if (this.adjacentCount > 2) {
-            this.adjacentCount = 2;
+    watchAdjacentPageCountHandler() {
+        if (this.adjacentPageCount > 2) {
+            this.adjacentPageCount = 2;
         }
     }
-    watchBoundaryCountHandler() {
-        if (this.boundaryCount > 2) {
-            this.boundaryCount = 2;
+    watchBoundaryPageCountHandler() {
+        if (this.boundaryPageCount > 2) {
+            this.boundaryPageCount = 2;
         }
     }
     watchNumberPagesHandler() {
@@ -105,7 +105,8 @@ export class Pagination {
         let midEnd;
         let startEllipsis = false;
         let endEllipsis = false;
-        if (this.pages <= this.boundaryCount * 2 + this.adjacentCount * 2 + 3) {
+        if (this.pages <=
+            this.boundaryPageCount * 2 + this.adjacentPageCount * 2 + 3) {
             this.startEllipsis = false;
             this.endEllipsis = false;
             for (let i = 1; i <= this.pages; i++) {
@@ -114,16 +115,17 @@ export class Pagination {
             this.startItems = startItems;
             return;
         }
-        startItemCount = this.boundaryCount === 0 ? 1 : this.boundaryCount;
+        startItemCount = this.boundaryPageCount === 0 ? 1 : this.boundaryPageCount;
         endStart =
-            this.boundaryCount === 0
+            this.boundaryPageCount === 0
                 ? this.pages
-                : this.pages - this.boundaryCount + 1;
-        if (this.currentPage <= this.adjacentCount + this.boundaryCount + 2) {
+                : this.pages - this.boundaryPageCount + 1;
+        if (this.currentPage <=
+            this.adjacentPageCount + this.boundaryPageCount + 2) {
             startEllipsis = false;
             endEllipsis = true;
-            let numItems = 2 * this.adjacentCount + 1;
-            if (this.boundaryCount === 0) {
+            let numItems = 2 * this.adjacentPageCount + 1;
+            if (this.boundaryPageCount === 0) {
                 numItems--;
             }
             midStart = startItemCount + 1;
@@ -132,33 +134,33 @@ export class Pagination {
         else {
             startEllipsis = true;
             if (this.currentPage >
-                this.pages - (this.adjacentCount + this.boundaryCount + 2)) {
-                let numItems = 2 * this.adjacentCount + 1;
-                if (this.boundaryCount === 0) {
+                this.pages - (this.adjacentPageCount + this.boundaryPageCount + 2)) {
+                let numItems = 2 * this.adjacentPageCount + 1;
+                if (this.boundaryPageCount === 0) {
                     numItems--;
                 }
                 midEnd =
-                    this.boundaryCount === 0
+                    this.boundaryPageCount === 0
                         ? this.pages - 1
-                        : this.pages - this.boundaryCount;
+                        : this.pages - this.boundaryPageCount;
                 midStart = midEnd - numItems;
             }
             else {
                 endEllipsis = true;
-                midStart = this.currentPage - this.adjacentCount;
-                midEnd = this.currentPage + this.adjacentCount;
+                midStart = this.currentPage - this.adjacentPageCount;
+                midEnd = this.currentPage + this.adjacentPageCount;
             }
         }
         //create array of start items
-        if (this.boundaryCount > 0 ||
-            (this.boundaryCount === 0 && startEllipsis === false)) {
+        if (this.boundaryPageCount > 0 ||
+            (this.boundaryPageCount === 0 && startEllipsis === false)) {
             for (let i = 1; i <= startItemCount; i++) {
                 startItems.push(i);
             }
         }
         //create array of end items
-        if (this.boundaryCount > 0 ||
-            (this.boundaryCount === 0 && endEllipsis === false)) {
+        if (this.boundaryPageCount > 0 ||
+            (this.boundaryPageCount === 0 && endEllipsis === false)) {
             for (let i = endStart; i <= this.pages; i++) {
                 endItems.push(i);
             }
@@ -175,8 +177,8 @@ export class Pagination {
     }
     componentWillLoad() {
         this.watchPageChangeHandler();
-        this.watchBoundaryCountHandler();
-        this.watchAdjacentCountHandler();
+        this.watchBoundaryPageCountHandler();
+        this.watchAdjacentPageCountHandler();
         removeDisabledFalse(this.disabled, this.el);
     }
     componentDidLoad() {
@@ -205,7 +207,7 @@ export class Pagination {
                 ["disabled"]: disabled,
             }, role: "navigation", "aria-label": "Pagination Navigation" }, hideFirstAndLastPageButton ? null : this.firstButton(), this.previousButton(), h("ic-pagination-item", { appearance: this.appearance, type: "simple-current", page: currentPage, label: label, class: { ["hide-current-page"]: hideCurrentPage }, disabled: disabled }), this.nextButton(), hideFirstAndLastPageButton ? null : this.lastButton())), type === "complex" && (h("nav", { class: {
                 ["disabled"]: disabled,
-            }, role: "navigation", "aria-label": "Pagination Navigation" }, hideFirstAndLastPageButton ? null : this.firstButton(), this.previousButton(), this.renderStartItems(), this.startEllipsis && this.renderStartEllipsis(), this.renderMiddleItems(), this.endEllipsis && this.renderEndEllipsis(), this.renderEndItems(), this.nextButton(), hideFirstAndLastPageButton ? null : this.lastButton()))));
+            }, role: "navigation", "aria-label": "Pagination Navigation" }, hideFirstAndLastPageButton ? null : this.firstButton(), this.previousButton(), this.renderStartItems(), this.startEllipsis && this.renderStartEllipsis(), this.renderMiddleItems(), this.endEllipsis && this.renderEndEllipsis(), this.renderEndItems(), this.nextButton(), hideFirstAndLastPageButton ? null : this.lastButton())), type === "complex" && (h("span", { class: "sr-only", "aria-live": "polite" }, "Page ", this.currentPage))));
     }
     static get is() { return "ic-pagination"; }
     static get encapsulation() { return "shadow"; }
@@ -221,7 +223,7 @@ export class Pagination {
     }
     static get properties() {
         return {
-            "adjacentCount": {
+            "adjacentPageCount": {
                 "type": "number",
                 "mutable": true,
                 "complexType": {
@@ -235,7 +237,7 @@ export class Pagination {
                     "tags": [],
                     "text": "The number of pages displayed adjacent to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2."
                 },
-                "attribute": "adjacent-count",
+                "attribute": "adjacent-page-count",
                 "reflect": false,
                 "defaultValue": "1"
             },
@@ -263,7 +265,7 @@ export class Pagination {
                 "reflect": false,
                 "defaultValue": "\"default\""
             },
-            "boundaryCount": {
+            "boundaryPageCount": {
                 "type": "number",
                 "mutable": true,
                 "complexType": {
@@ -277,7 +279,7 @@ export class Pagination {
                     "tags": [],
                     "text": "The number of pages displayed as boundary items to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2."
                 },
-                "attribute": "boundary-count",
+                "attribute": "boundary-page-count",
                 "reflect": false,
                 "defaultValue": "1"
             },
@@ -496,11 +498,11 @@ export class Pagination {
     static get elementRef() { return "el"; }
     static get watchers() {
         return [{
-                "propName": "adjacentCount",
-                "methodName": "watchAdjacentCountHandler"
+                "propName": "adjacentPageCount",
+                "methodName": "watchAdjacentPageCountHandler"
             }, {
-                "propName": "boundaryCount",
-                "methodName": "watchBoundaryCountHandler"
+                "propName": "boundaryPageCount",
+                "methodName": "watchBoundaryPageCountHandler"
             }, {
                 "propName": "pages",
                 "methodName": "watchNumberPagesHandler"

package/dist/collection/components/ic-pagination/ic-pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-pagination.js","sourceRoot":"","sources":["../../../src/components/ic-pagination/ic-pagination.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Host,\n Prop,\n h,\n Listen,\n State,\n Watch,\n Event,\n EventEmitter,\n Method,\n} from \"@stencil/core\";\nimport paginationNextPrevious from \"../../assets/pagination-next-previous.svg\";\nimport paginationFirstLast from \"../../assets/pagination-first-last.svg\";\nimport { IcThemeForeground } from \"../../utils/types\";\nimport { IcPaginationTypes, IcChangeEventDetail } from \"./ic-pagination.types\";\nimport {\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-pagination\",\n styleUrl: \"ic-pagination.css\",\n shadow: true,\n})\nexport class Pagination {\n @Element() el: HTMLIcPaginationElement;\n\n @State() endEllipsis: boolean = false;\n @State() endItems: number[] = [];\n @State() midItems: number[] = [];\n @State() startEllipsis: boolean = false;\n @State() startItems: number[] = [];\n\n /*\n The number of pages displayed adjacent to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.\n /\n @Prop({ mutable: true }) adjacentCount: number = 1;\n\n @Watch(\"adjacentCount\")\n watchAdjacentCountHandler(): void {\n if (this.adjacentCount > 2) {\n this.adjacentCount = 2;\n }\n }\n\n /\n The appearance of the pagination, e.g. dark, light or the default.\n /\n @Prop() appearance: IcThemeForeground = \"default\";\n\n /\n The number of pages displayed as boundary items to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.\n /\n @Prop({ mutable: true }) boundaryCount: number = 1;\n\n @Watch(\"boundaryCount\")\n watchBoundaryCountHandler(): void {\n if (this.boundaryCount > 2) {\n this.boundaryCount = 2;\n }\n }\n\n /\n The default page to display.\n /\n @Prop() defaultPage: number = 1;\n\n /\n If `true`, the pagination will not allow interaction.\n /\n @Prop() disabled: boolean = false;\n\n /\n If `true`, the current page of the simple pagination will not be displayed.\n /\n @Prop() hideCurrentPage: boolean = false;\n\n /\n If `true`, the first and last page buttons will not be displayed.\n /\n @Prop() hideFirstAndLastPageButton: boolean = false;\n\n /\n The label for the pagination item (applicable when simple pagination is being used).\n /\n @Prop() label: string = \"Page\";\n\n /\n The total number of pages.\n /\n @Prop() pages!: number;\n\n @Watch(\"pages\")\n watchNumberPagesHandler(): void {\n this.watchPageChangeHandler();\n }\n\n /\n The type of pagination to be used.\n /\n @Prop() type: IcPaginationTypes = \"simple\";\n\n @Watch(\"type\")\n watchTypeHandler(): void {\n this.watchPageChangeHandler();\n }\n\n /\n The current page displayed by the pagination.\n /\n @Prop({ mutable: true }) currentPage: number = this.defaultPage;\n\n @Watch(\"currentPage\")\n watchPageChangeHandler(): void {\n if (this.type === \"simple\") {\n return;\n }\n\n this.startEllipsis = false;\n this.endEllipsis = false;\n this.startItems = [];\n this.endItems = [];\n this.midItems = [];\n\n const startItems = [];\n let startItemCount = 0;\n const endItems = [];\n let endStart = this.pages;\n const midItems = [];\n let midStart;\n let midEnd;\n let startEllipsis = false;\n let endEllipsis = false;\n\n if (this.pages <= this.boundaryCount 2 + this.adjacentCount * 2 + 3) {\n this.startEllipsis = false;\n this.endEllipsis = false;\n for (let i = 1; i <= this.pages; i++) {\n startItems.push(i);\n }\n this.startItems = startItems;\n return;\n }\n\n startItemCount = this.boundaryCount === 0 ? 1 : this.boundaryCount;\n endStart =\n this.boundaryCount === 0\n ? this.pages\n : this.pages - this.boundaryCount + 1;\n\n if (this.currentPage <= this.adjacentCount + this.boundaryCount + 2) {\n startEllipsis = false;\n endEllipsis = true;\n\n let numItems = 2 * this.adjacentCount + 1;\n if (this.boundaryCount === 0) {\n numItems--;\n }\n midStart = startItemCount + 1;\n midEnd = midStart + numItems;\n } else {\n startEllipsis = true;\n if (\n this.currentPage >\n this.pages - (this.adjacentCount + this.boundaryCount + 2)\n ) {\n let numItems = 2 * this.adjacentCount + 1;\n if (this.boundaryCount === 0) {\n numItems--;\n }\n midEnd =\n this.boundaryCount === 0\n ? this.pages - 1\n : this.pages - this.boundaryCount;\n midStart = midEnd - numItems;\n } else {\n endEllipsis = true;\n midStart = this.currentPage - this.adjacentCount;\n midEnd = this.currentPage + this.adjacentCount;\n }\n }\n\n //create array of start items\n if (\n this.boundaryCount > 0 \|\|\n (this.boundaryCount === 0 && startEllipsis === false)\n ) {\n for (let i = 1; i <= startItemCount; i++) {\n startItems.push(i);\n }\n }\n\n //create array of end items\n if (\n this.boundaryCount > 0 \|\|\n (this.boundaryCount === 0 && endEllipsis === false)\n ) {\n for (let i = endStart; i <= this.pages; i++) {\n endItems.push(i);\n }\n }\n\n //create array of mid items\n for (let i = midStart; i <= midEnd; i++) {\n midItems.push(i);\n }\n\n this.startEllipsis = startEllipsis;\n this.endEllipsis = endEllipsis;\n this.startItems = startItems;\n this.endItems = endItems;\n this.midItems = midItems;\n }\n\n /*\n Emitted when a page is selected.\n /\n @Event() icPageChange: EventEmitter<IcChangeEventDetail>;\n\n componentWillLoad(): void {\n this.watchPageChangeHandler();\n this.watchBoundaryCountHandler();\n this.watchAdjacentCountHandler();\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.pages, propName: \"pages\" }],\n \"Pagination\"\n );\n }\n\n @Listen(\"paginationItemClick\")\n paginationItemClickHandler(ev: CustomEvent): void {\n const page = ev.detail.page;\n this.currentPage = page;\n this.icPageChange.emit({ value: this.currentPage });\n }\n\n /\n Sets the currently displayed page.\n * @param {number} page The page number to set as the current page\n */\n @Method()\n async setCurrentPage(page: number): Promise<void> {\n if (typeof page === \"number\" && page > 0 && page <= this.pages) {\n this.currentPage = page;\n } else {\n console.error(\n \"Current page must be a number greater than zero but less than or equal to the total number of pages\"\n );\n }\n }\n\n private handleClickFirst = () => {\n this.currentPage = 1;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n private handleClickPrevious = (): void => {\n this.currentPage--;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n private handleClickNext = (): void => {\n this.currentPage++;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n private handleClickLast = (): void => {\n this.currentPage = this.pages;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n // button rendering abstracted from component render methods for clarity\n private firstButton = () => {\n return (\n <ic-button\n id=\"first-page-button\"\n aria-label=\"Go to first page\"\n appearance={this.appearance}\n onClick={this.handleClickFirst}\n class=\"page-button first-last\"\n disabled={this.currentPage === 1 \|\| this.disabled}\n variant=\"icon\"\n innerHTML={paginationFirstLast}\n />\n );\n };\n\n private previousButton = () => {\n return (\n <ic-button\n id=\"previous-page-button\"\n aria-label=\"Go to previous page\"\n appearance={this.appearance}\n onClick={this.handleClickPrevious}\n class=\"page-button next-previous flip\"\n disabled={this.currentPage === 1 \|\| this.disabled}\n variant=\"icon\"\n innerHTML={paginationNextPrevious}\n />\n );\n };\n\n private nextButton = () => {\n return (\n <ic-button\n id=\"next-page-button\"\n aria-label=\"Go to next page\"\n appearance={this.appearance}\n onClick={this.handleClickNext}\n class=\"page-button next-previous\"\n disabled={this.currentPage === this.pages \|\| this.disabled}\n variant=\"icon\"\n innerHTML={paginationNextPrevious}\n />\n );\n };\n\n private lastButton = () => {\n return (\n <ic-button\n id=\"last-page-button\"\n aria-label=\"Go to last page\"\n appearance={this.appearance}\n onClick={this.handleClickLast}\n class=\"page-button first-last flip\"\n disabled={this.currentPage === this.pages \|\| this.disabled}\n variant=\"icon\"\n innerHTML={paginationFirstLast}\n />\n );\n };\n\n private renderStartEllipsis = () => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n type=\"ellipsis\"\n id=\"start-ellipsis\"\n disabled={this.disabled}\n />\n );\n };\n\n private renderEndEllipsis = () => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n type=\"ellipsis\"\n id=\"end-ellipsis\"\n disabled={this.disabled}\n />\n );\n };\n\n private renderStartItems = () => {\n return this.startItems.map((page: number) => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n selected={page === this.currentPage}\n id={`pagination-item-${page}`}\n type=\"page\"\n page={page}\n disabled={this.disabled}\n />\n );\n });\n };\n\n private renderEndItems = () => {\n return this.endItems.map((page: number) => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n selected={page === this.currentPage}\n id={`pagination-item-${page}`}\n type=\"page\"\n page={page}\n disabled={this.disabled}\n />\n );\n });\n };\n\n private renderMiddleItems = () => {\n return this.midItems.map((page: number) => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n selected={page === this.currentPage}\n id={`pagination-item-${page}`}\n type=\"page\"\n page={page}\n disabled={this.disabled}\n />\n );\n });\n };\n\n render() {\n const {\n type,\n currentPage,\n hideCurrentPage,\n disabled,\n hideFirstAndLastPageButton,\n label,\n } = this;\n\n return (\n <Host>\n {type === \"simple\" && (\n <nav\n class={{\n [\"disabled\"]: disabled,\n }}\n role=\"navigation\"\n aria-label=\"Pagination Navigation\"\n >\n {hideFirstAndLastPageButton ? null : this.firstButton()}\n {this.previousButton()}\n <ic-pagination-item\n appearance={this.appearance}\n type=\"simple-current\"\n page={currentPage}\n label={label}\n class={{ [\"hide-current-page\"]: hideCurrentPage }}\n disabled={disabled}\n />\n {this.nextButton()}\n {hideFirstAndLastPageButton ? null : this.lastButton()}\n </nav>\n )}\n {type === \"complex\" && (\n <nav\n class={{\n [\"disabled\"]: disabled,\n }}\n role=\"navigation\"\n aria-label=\"Pagination Navigation\"\n >\n {hideFirstAndLastPageButton ? null : this.firstButton()}\n {this.previousButton()}\n {this.renderStartItems()}\n {this.startEllipsis && this.renderStartEllipsis()}\n {this.renderMiddleItems()}\n {this.endEllipsis && this.renderEndEllipsis()}\n {this.renderEndItems()}\n {this.nextButton()}\n {hideFirstAndLastPageButton ? null : this.lastButton()}\n </nav>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-pagination.js","sourceRoot":"","sources":["../../../src/components/ic-pagination/ic-pagination.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Host,\n Prop,\n h,\n Listen,\n State,\n Watch,\n Event,\n EventEmitter,\n Method,\n} from \"@stencil/core\";\nimport paginationNextPrevious from \"../../assets/pagination-next-previous.svg\";\nimport paginationFirstLast from \"../../assets/pagination-first-last.svg\";\nimport { IcThemeForeground } from \"../../utils/types\";\nimport { IcPaginationTypes, IcChangeEventDetail } from \"./ic-pagination.types\";\nimport {\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-pagination\",\n styleUrl: \"ic-pagination.css\",\n shadow: true,\n})\nexport class Pagination {\n @Element() el: HTMLIcPaginationElement;\n\n @State() endEllipsis: boolean = false;\n @State() endItems: number[] = [];\n @State() midItems: number[] = [];\n @State() startEllipsis: boolean = false;\n @State() startItems: number[] = [];\n\n /*\n The number of pages displayed adjacent to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.\n /\n @Prop({ mutable: true }) adjacentPageCount: number = 1;\n\n @Watch(\"adjacentPageCount\")\n watchAdjacentPageCountHandler(): void {\n if (this.adjacentPageCount > 2) {\n this.adjacentPageCount = 2;\n }\n }\n\n /\n The appearance of the pagination, e.g. dark, light or the default.\n /\n @Prop() appearance: IcThemeForeground = \"default\";\n\n /\n The number of pages displayed as boundary items to the current page when using 'complex' type pagination. Accepted values are 0, 1 & 2.\n /\n @Prop({ mutable: true }) boundaryPageCount: number = 1;\n\n @Watch(\"boundaryPageCount\")\n watchBoundaryPageCountHandler(): void {\n if (this.boundaryPageCount > 2) {\n this.boundaryPageCount = 2;\n }\n }\n\n /\n The default page to display.\n /\n @Prop() defaultPage: number = 1;\n\n /\n If `true`, the pagination will not allow interaction.\n /\n @Prop() disabled: boolean = false;\n\n /\n If `true`, the current page of the simple pagination will not be displayed.\n /\n @Prop() hideCurrentPage: boolean = false;\n\n /\n If `true`, the first and last page buttons will not be displayed.\n /\n @Prop() hideFirstAndLastPageButton: boolean = false;\n\n /\n The label for the pagination item (applicable when simple pagination is being used).\n /\n @Prop() label: string = \"Page\";\n\n /\n The total number of pages.\n /\n @Prop() pages!: number;\n\n @Watch(\"pages\")\n watchNumberPagesHandler(): void {\n this.watchPageChangeHandler();\n }\n\n /\n The type of pagination to be used.\n /\n @Prop() type: IcPaginationTypes = \"simple\";\n\n @Watch(\"type\")\n watchTypeHandler(): void {\n this.watchPageChangeHandler();\n }\n\n /\n The current page displayed by the pagination.\n /\n @Prop({ mutable: true }) currentPage: number = this.defaultPage;\n\n @Watch(\"currentPage\")\n watchPageChangeHandler(): void {\n if (this.type === \"simple\") {\n return;\n }\n\n this.startEllipsis = false;\n this.endEllipsis = false;\n this.startItems = [];\n this.endItems = [];\n this.midItems = [];\n\n const startItems = [];\n let startItemCount = 0;\n const endItems = [];\n let endStart = this.pages;\n const midItems = [];\n let midStart;\n let midEnd;\n let startEllipsis = false;\n let endEllipsis = false;\n\n if (\n this.pages <=\n this.boundaryPageCount 2 + this.adjacentPageCount * 2 + 3\n ) {\n this.startEllipsis = false;\n this.endEllipsis = false;\n for (let i = 1; i <= this.pages; i++) {\n startItems.push(i);\n }\n this.startItems = startItems;\n return;\n }\n\n startItemCount = this.boundaryPageCount === 0 ? 1 : this.boundaryPageCount;\n endStart =\n this.boundaryPageCount === 0\n ? this.pages\n : this.pages - this.boundaryPageCount + 1;\n\n if (\n this.currentPage <=\n this.adjacentPageCount + this.boundaryPageCount + 2\n ) {\n startEllipsis = false;\n endEllipsis = true;\n\n let numItems = 2 * this.adjacentPageCount + 1;\n if (this.boundaryPageCount === 0) {\n numItems--;\n }\n midStart = startItemCount + 1;\n midEnd = midStart + numItems;\n } else {\n startEllipsis = true;\n if (\n this.currentPage >\n this.pages - (this.adjacentPageCount + this.boundaryPageCount + 2)\n ) {\n let numItems = 2 * this.adjacentPageCount + 1;\n if (this.boundaryPageCount === 0) {\n numItems--;\n }\n midEnd =\n this.boundaryPageCount === 0\n ? this.pages - 1\n : this.pages - this.boundaryPageCount;\n midStart = midEnd - numItems;\n } else {\n endEllipsis = true;\n midStart = this.currentPage - this.adjacentPageCount;\n midEnd = this.currentPage + this.adjacentPageCount;\n }\n }\n\n //create array of start items\n if (\n this.boundaryPageCount > 0 \|\|\n (this.boundaryPageCount === 0 && startEllipsis === false)\n ) {\n for (let i = 1; i <= startItemCount; i++) {\n startItems.push(i);\n }\n }\n\n //create array of end items\n if (\n this.boundaryPageCount > 0 \|\|\n (this.boundaryPageCount === 0 && endEllipsis === false)\n ) {\n for (let i = endStart; i <= this.pages; i++) {\n endItems.push(i);\n }\n }\n\n //create array of mid items\n for (let i = midStart; i <= midEnd; i++) {\n midItems.push(i);\n }\n\n this.startEllipsis = startEllipsis;\n this.endEllipsis = endEllipsis;\n this.startItems = startItems;\n this.endItems = endItems;\n this.midItems = midItems;\n }\n\n /*\n Emitted when a page is selected.\n /\n @Event() icPageChange: EventEmitter<IcChangeEventDetail>;\n\n componentWillLoad(): void {\n this.watchPageChangeHandler();\n this.watchBoundaryPageCountHandler();\n this.watchAdjacentPageCountHandler();\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.pages, propName: \"pages\" }],\n \"Pagination\"\n );\n }\n\n @Listen(\"paginationItemClick\")\n paginationItemClickHandler(ev: CustomEvent): void {\n const page = ev.detail.page;\n this.currentPage = page;\n this.icPageChange.emit({ value: this.currentPage });\n }\n\n /\n Sets the currently displayed page.\n * @param {number} page The page number to set as the current page\n */\n @Method()\n async setCurrentPage(page: number): Promise<void> {\n if (typeof page === \"number\" && page > 0 && page <= this.pages) {\n this.currentPage = page;\n } else {\n console.error(\n \"Current page must be a number greater than zero but less than or equal to the total number of pages\"\n );\n }\n }\n\n private handleClickFirst = () => {\n this.currentPage = 1;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n private handleClickPrevious = (): void => {\n this.currentPage--;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n private handleClickNext = (): void => {\n this.currentPage++;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n private handleClickLast = (): void => {\n this.currentPage = this.pages;\n this.icPageChange.emit({ value: this.currentPage });\n };\n\n // button rendering abstracted from component render methods for clarity\n private firstButton = () => {\n return (\n <ic-button\n id=\"first-page-button\"\n aria-label=\"Go to first page\"\n appearance={this.appearance}\n onClick={this.handleClickFirst}\n class=\"page-button first-last\"\n disabled={this.currentPage === 1 \|\| this.disabled}\n variant=\"icon\"\n innerHTML={paginationFirstLast}\n />\n );\n };\n\n private previousButton = () => {\n return (\n <ic-button\n id=\"previous-page-button\"\n aria-label=\"Go to previous page\"\n appearance={this.appearance}\n onClick={this.handleClickPrevious}\n class=\"page-button next-previous flip\"\n disabled={this.currentPage === 1 \|\| this.disabled}\n variant=\"icon\"\n innerHTML={paginationNextPrevious}\n />\n );\n };\n\n private nextButton = () => {\n return (\n <ic-button\n id=\"next-page-button\"\n aria-label=\"Go to next page\"\n appearance={this.appearance}\n onClick={this.handleClickNext}\n class=\"page-button next-previous\"\n disabled={this.currentPage === this.pages \|\| this.disabled}\n variant=\"icon\"\n innerHTML={paginationNextPrevious}\n />\n );\n };\n\n private lastButton = () => {\n return (\n <ic-button\n id=\"last-page-button\"\n aria-label=\"Go to last page\"\n appearance={this.appearance}\n onClick={this.handleClickLast}\n class=\"page-button first-last flip\"\n disabled={this.currentPage === this.pages \|\| this.disabled}\n variant=\"icon\"\n innerHTML={paginationFirstLast}\n />\n );\n };\n\n private renderStartEllipsis = () => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n type=\"ellipsis\"\n id=\"start-ellipsis\"\n disabled={this.disabled}\n />\n );\n };\n\n private renderEndEllipsis = () => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n type=\"ellipsis\"\n id=\"end-ellipsis\"\n disabled={this.disabled}\n />\n );\n };\n\n private renderStartItems = () => {\n return this.startItems.map((page: number) => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n selected={page === this.currentPage}\n id={`pagination-item-${page}`}\n type=\"page\"\n page={page}\n disabled={this.disabled}\n />\n );\n });\n };\n\n private renderEndItems = () => {\n return this.endItems.map((page: number) => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n selected={page === this.currentPage}\n id={`pagination-item-${page}`}\n type=\"page\"\n page={page}\n disabled={this.disabled}\n />\n );\n });\n };\n\n private renderMiddleItems = () => {\n return this.midItems.map((page: number) => {\n return (\n <ic-pagination-item\n appearance={this.appearance}\n selected={page === this.currentPage}\n id={`pagination-item-${page}`}\n type=\"page\"\n page={page}\n disabled={this.disabled}\n />\n );\n });\n };\n\n render() {\n const {\n type,\n currentPage,\n hideCurrentPage,\n disabled,\n hideFirstAndLastPageButton,\n label,\n } = this;\n\n return (\n <Host>\n {type === \"simple\" && (\n <nav\n class={{\n [\"disabled\"]: disabled,\n }}\n role=\"navigation\"\n aria-label=\"Pagination Navigation\"\n >\n {hideFirstAndLastPageButton ? null : this.firstButton()}\n {this.previousButton()}\n <ic-pagination-item\n appearance={this.appearance}\n type=\"simple-current\"\n page={currentPage}\n label={label}\n class={{ [\"hide-current-page\"]: hideCurrentPage }}\n disabled={disabled}\n />\n {this.nextButton()}\n {hideFirstAndLastPageButton ? null : this.lastButton()}\n </nav>\n )}\n {type === \"complex\" && (\n <nav\n class={{\n [\"disabled\"]: disabled,\n }}\n role=\"navigation\"\n aria-label=\"Pagination Navigation\"\n >\n {hideFirstAndLastPageButton ? null : this.firstButton()}\n {this.previousButton()}\n {this.renderStartItems()}\n {this.startEllipsis && this.renderStartEllipsis()}\n {this.renderMiddleItems()}\n {this.endEllipsis && this.renderEndEllipsis()}\n {this.renderEndItems()}\n {this.nextButton()}\n {hideFirstAndLastPageButton ? null : this.lastButton()}\n </nav>\n )}\n {type === \"complex\" && (\n <span class=\"sr-only\" aria-live=\"polite\">\n Page {this.currentPage}\n </span>\n )}\n </Host>\n );\n }\n}\n"]}

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

@@ -38,16 +38,16 @@ describe("ic-pagination simple appearance component", () => {
         });
         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 () => {
+    it("should render all pages when total pages less than min width based on boundary-page-count and adjacent-page-count", async () => {
         const page = await newSpecPage({
             components: [Pagination],
             html: `<ic-pagination
       pages="11"
       type="complex"
-      adjacent-count="2"
-      boundary-count="2"></ic-pagination>`,
+      adjacent-page-count="2"
+      boundary-page-count="2"></ic-pagination>`,
         });
-        expect(page.root).toMatchSnapshot("pages less than adjacent-count + boundary-count");
+        expect(page.root).toMatchSnapshot("pages less than adjacent-page-count + boundary-page-count");
     });
     it("should render with interactions disabled", async () => {
         const page = await newSpecPage({
@@ -140,7 +140,7 @@ describe("ic-pagination complex type", () => {
             html: `<ic-pagination
       pages=15
       type="complex"
-      adjacent-count=0
+      adjacent-page-count=0
     ></ic-pagination>`,
         });
         expect(page.root).toMatchSnapshot("render complex type with 0 adjacent items and 0 boundary items");
@@ -148,63 +148,63 @@ describe("ic-pagination complex type", () => {
     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>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=0 boundary-page-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>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=0 boundary-page-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>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=1 boundary-page-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>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=2 boundary-page-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>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=0 boundary-page-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>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=0 boundary-page-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>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=1 boundary-page-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>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=2 boundary-page-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>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=2 boundary-page-count=2></ic-pagination>`,
         });
         expect(page.root).toMatchSnapshot("render complex type with 2 adjacent items and 2 boundary items");
     });
@@ -280,37 +280,37 @@ describe("ic-pagination complex type", () => {
         await page.waitForChanges();
         expect(page.root.currentPage).toBe(1);
     });
-    it("should not allow boundaryCount greater than 2", async () => {
+    it("should not allow boundaryPageCount greater than 2", async () => {
         const page = await newSpecPage({
             components: [Pagination],
-            html: `<ic-pagination pages=15 type="complex" boundary-count=3></ic-pagination>`,
+            html: `<ic-pagination pages=15 type="complex" boundary-page-count=3></ic-pagination>`,
         });
-        expect(page.rootInstance.boundaryCount).toEqual(2);
+        expect(page.rootInstance.boundaryPageCount).toEqual(2);
     });
-    it("should not allow boundaryCount greater than 2 - when changed from initial value", async () => {
+    it("should not allow boundaryPageCount greater than 2 - when changed from initial value", async () => {
         const page = await newSpecPage({
             components: [Pagination],
             html: `<ic-pagination pages=15 type="complex"></ic-pagination>`,
         });
-        page.root.boundaryCount = 3;
+        page.root.boundaryPageCount = 3;
         await page.waitForChanges();
-        expect(page.rootInstance.boundaryCount).toEqual(2);
+        expect(page.rootInstance.boundaryPageCount).toEqual(2);
     });
-    it("should not allow adjacentCount greater than 2", async () => {
+    it("should not allow adjacentPageCount greater than 2", async () => {
         const page = await newSpecPage({
             components: [Pagination],
-            html: `<ic-pagination pages=15 type="complex" adjacent-count=3></ic-pagination>`,
+            html: `<ic-pagination pages=15 type="complex" adjacent-page-count=3></ic-pagination>`,
         });
-        expect(page.rootInstance.adjacentCount).toEqual(2);
+        expect(page.rootInstance.adjacentPageCount).toEqual(2);
     });
-    it("should not allow adjacentCount greater than 2 - when changed from initial value", async () => {
+    it("should not allow adjacentPageCount greater than 2 - when changed from initial value", async () => {
         const page = await newSpecPage({
             components: [Pagination],
             html: `<ic-pagination pages=15 type="complex"></ic-pagination>`,
         });
-        page.root.adjacentCount = 3;
+        page.root.adjacentPageCount = 3;
         await page.waitForChanges();
-        expect(page.rootInstance.adjacentCount).toEqual(2);
+        expect(page.rootInstance.adjacentPageCount).toEqual(2);
     });
     it("should test switching to complex pagination type", async () => {
         const page = await newSpecPage({