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

package/dist/collection/components/ic-back-to-top/ic-back-to-top.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ic-back-to-top.js","sourceRoot":"","sources":["../../../src/components/ic-back-to-top/ic-back-to-top.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Element, Prop, State, Watch } from \"@stencil/core\";\nimport ArrowUpward from \"./assets/ArrowUpward.svg\";\nimport {\n  onComponentPropUndefinedChange,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\n\nconst backToTopLabel = \"Back to top\";\n\n@Component({\n  tag: \"ic-back-to-top\",\n  styleUrl: \"ic-back-to-top.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class BackToTop {\n  private isTargetElNull: boolean;\n  private targetEl: Element;\n  private topObserver: IntersectionObserver = null;\n\n  @Element() el: HTMLIcBackToTopElement;\n\n  @State() bannerOffset: boolean = false;\n  @State() footerVisible: boolean = false;\n  @State() targetElVisible: boolean = true;\n\n  /**\n   * The ID of the element to jump back to when the link is clicked.\n   */\n  @Prop() target!: string;\n\n  @Watch(\"target\")\n  watchPropHandler(newValue: string, oldValue: string): void {\n    //added for gatsby rehydration issue where prop is initially undefined but then changes to actual value\n    onComponentPropUndefinedChange(oldValue, newValue, () => {\n      this.createTopObserver(newValue);\n    });\n  }\n\n  componentWillLoad(): void {\n    this.createTopObserver(this.target);\n    this.checkForClassificationBanner();\n\n    //observer for when footer scrolls into view\n    let footers = document.querySelectorAll(\n      \"ic-footer\"\n    ) as NodeListOf<HTMLElement>;\n    if (footers.length === 0) {\n      footers = document.querySelectorAll(\"footer\");\n    }\n\n    if (footers.length) {\n      const footerEl = footers[footers.length - 1];\n      const threshold = this.bannerOffset ? 0.15 : 0;\n      const footerObserver = new IntersectionObserver(\n        this.footerObserverCallback,\n        { threshold: [threshold] }\n      );\n      footerObserver.observe(footerEl);\n    }\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.target, propName: \"target\" }],\n      \"Back to Top\"\n    );\n  }\n\n  private setTargetElVisible = (visible: boolean) => {\n    this.targetElVisible = visible;\n  };\n\n  private setFooterVisible = (visible: boolean) => {\n    this.checkForClassificationBanner();\n    if (typeof window !== \"undefined\" && window.scrollY === 0) {\n      this.footerVisible = false;\n    } else {\n      this.footerVisible = visible;\n    }\n  };\n\n  private targetElObserverCallback = (entries: IntersectionObserverEntry[]) => {\n    this.setTargetElVisible(entries[0].isIntersecting);\n  };\n\n  private footerObserverCallback = (entries: IntersectionObserverEntry[]) => {\n    this.setFooterVisible(entries[0].isIntersecting);\n  };\n\n  private findTargetEl = (target: string): Element => {\n    let targetElement: Element = null;\n    if (target === null || target === undefined) {\n      console.log(\n        \"Error: No target ID specified for back to top component - defaulting to top of page\"\n      );\n    } else {\n      targetElement = document.querySelector(\n        target.indexOf(\"#\") === 0 ? target : \"#\" + target\n      );\n      if (targetElement === null) {\n        console.log(\n          `Error: Back to top target element '${target}' not found - defaulting to top of page`\n        );\n      }\n    }\n    return targetElement;\n  };\n\n  private createTopObserver = (target: string) => {\n    this.targetEl = this.findTargetEl(target);\n    let objParent: HTMLElement;\n\n    //remove old element & observer\n    if (this.topObserver !== null) {\n      const observedEl = document.querySelector(\"#ic-back-to-top-target\");\n      if (observedEl !== null) {\n        this.topObserver.unobserve(observedEl);\n        observedEl.remove();\n      }\n    }\n\n    if (this.targetEl === null) {\n      objParent = document.body;\n      this.targetEl = objParent.firstElementChild;\n      this.isTargetElNull = true;\n    } else {\n      objParent = this.targetEl.parentNode as HTMLElement;\n      this.isTargetElNull = false;\n    }\n\n    //insert a new 0px height element before specified target that can be used to determine when page is scrolled\n    const objBackToTopTargetEl = document.createElement(\"div\");\n    objBackToTopTargetEl.setAttribute(\"id\", \"ic-back-to-top-target\");\n    objParent.insertBefore(objBackToTopTargetEl, this.targetEl);\n\n    // resize observer needs to factor in any top margin on the target el\n    const marginTop = getComputedStyle(this.targetEl).marginTop;\n    this.topObserver = new IntersectionObserver(this.targetElObserverCallback, {\n      threshold: [0],\n      rootMargin: `${marginTop} 0px 0px 0px`,\n    });\n    this.topObserver.observe(objBackToTopTargetEl);\n  };\n\n  private handleClick = () => {\n    if (this.isTargetElNull) {\n      window.scrollTo(0, 0);\n    } else {\n      this.targetEl.scrollIntoView();\n    }\n  };\n\n  private checkForClassificationBanner = () => {\n    //adjust position for classification banner at bottom\n    const banners = document.querySelectorAll(\n      \"ic-classification-banner:not([inline='true'])\"\n    );\n    this.bannerOffset = banners.length > 0;\n  };\n\n  render() {\n    const { bannerOffset, targetElVisible, footerVisible } = this;\n    return (\n      <button\n        class={{\n          [\"ic-back-to-top-link\"]: true,\n          [\"offset-banner\"]: bannerOffset,\n          [\"show\"]: !targetElVisible,\n          [\"by-footer\"]: footerVisible,\n        }}\n        aria-label={backToTopLabel}\n        onClick={this.handleClick}\n      >\n        <span class=\"ic-back-to-top-icon\" innerHTML={ArrowUpward} />\n\n        <ic-typography variant=\"subtitle-small\">\n          <span>{backToTopLabel}</span>\n        </ic-typography>\n      </button>\n    );\n  }\n}\n"]}

package/dist/collection/components/ic-back-to-top/test/a11y/ic-back-to-top.test.a11y.js

@@ -0,0 +1,28 @@
+import { fixture } from "@open-wc/testing-helpers";
+import { axe } from "jest-axe";
+beforeEach(() => {
+  // IntersectionObserver isn't available in test environment
+  const mockIntersectionObserver = jest.fn();
+  mockIntersectionObserver.mockReturnValue({
+    observe: jest.fn().mockReturnValue(null),
+    unobserve: jest.fn().mockReturnValue(null),
+    disconnect: jest.fn().mockReturnValue(null),
+  });
+  window.IntersectionObserver = mockIntersectionObserver;
+});
+describe("ic-back-to-top", () => {
+  it("passes accessibility", async () => {
+    const el = await fixture(`
+      <div>
+        <div id="topEl" style="margin-top:-20px;">
+          <ic-typography variant="h2">Top of the page</ic-typography>
+        </div>
+        <div style="height:1000px;"></div>
+        <ic-back-to-top target="topEl"></ic-back-to-top>
+      </div>`);
+    const backToTop = el.lastElementChild;
+    expect(backToTop.shadowRoot.innerHTML).not.toBe("");
+    expect(await axe(backToTop)).toHaveNoViolations();
+  });
+});
+//# sourceMappingURL=ic-back-to-top.test.a11y.js.map

package/dist/collection/components/ic-back-to-top/test/a11y/ic-back-to-top.test.a11y.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ic-back-to-top.test.a11y.js","sourceRoot":"","sources":["../../../../../src/components/ic-back-to-top/test/a11y/ic-back-to-top.test.a11y.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAE/B,UAAU,CAAC,GAAG,EAAE;EACd,2DAA2D;EAC3D,MAAM,wBAAwB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;EAC3C,wBAAwB,CAAC,eAAe,CAAC;IACvC,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;IACxC,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;IAC1C,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;GAC5C,CAAC,CAAC;EACH,MAAM,CAAC,oBAAoB,GAAG,wBAAwB,CAAC;AACzD,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,gBAAgB,EAAE,GAAG,EAAE;EAC9B,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;IACpC,MAAM,EAAE,GAAG,MAAM,OAAO,CAAC;;;;;;;aAOhB,CAAC,CAAC;IACX,MAAM,SAAS,GAAG,EAAE,CAAC,gBAA2B,CAAC;IACjD,MAAM,CAAC,SAAS,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACpD,MAAM,CAAC,MAAM,GAAG,CAAC,SAAS,CAAC,CAAC,CAAC,kBAAkB,EAAE,CAAC;EACpD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { fixture } from \"@open-wc/testing-helpers\";\nimport { axe } from \"jest-axe\";\n\nbeforeEach(() => {\n  // IntersectionObserver isn't available in test environment\n  const mockIntersectionObserver = jest.fn();\n  mockIntersectionObserver.mockReturnValue({\n    observe: jest.fn().mockReturnValue(null),\n    unobserve: jest.fn().mockReturnValue(null),\n    disconnect: jest.fn().mockReturnValue(null),\n  });\n  window.IntersectionObserver = mockIntersectionObserver;\n});\n\ndescribe(\"ic-back-to-top\", () => {\n  it(\"passes accessibility\", async () => {\n    const el = await fixture(`\n      <div>\n        <div id=\"topEl\" style=\"margin-top:-20px;\">\n          <ic-typography variant=\"h2\">Top of the page</ic-typography>\n        </div>\n        <div style=\"height:1000px;\"></div>\n        <ic-back-to-top target=\"topEl\"></ic-back-to-top>\n      </div>`);\n    const backToTop = el.lastElementChild as Element;\n    expect(backToTop.shadowRoot.innerHTML).not.toBe(\"\");\n    expect(await axe(backToTop)).toHaveNoViolations();\n  });\n});\n"]}

package/dist/collection/components/ic-back-to-top/test/basic/ic-back-to-top.e2e.js

@@ -0,0 +1,68 @@
+import { newE2EPage } from "@stencil/core/testing";
+describe("ic-back-to-top", () => {
+  it("should be hidden", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<div id="topEl" style="height:1200px"></div>
+        <ic-back-to-top target="topEl"></ic-back-to-top>
+      `);
+    await page.waitForChanges();
+    const backToTop = await page.find("ic-back-to-top >>> .ic-back-to-top-link");
+    expect(await backToTop.isVisible()).toBe(false);
+  });
+  it("should have correct text", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<div id="topEl"></div>
+        <ic-back-to-top target="topEl"></ic-back-to-top>
+      `);
+    await page.waitForChanges();
+    const backToTop = await page.find("ic-back-to-top >>> ic-typography");
+    const text = await backToTop.innerText;
+    expect(text).toBe("Back to top");
+  });
+  it("should appear when top is off screen", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<div id="topEl" style="margin-top:-20px;">
+          <ic-typography variant="h2">Top of the page</ic-typography>
+        </div>
+        <div style="height:1200px;"></div>
+        <ic-back-to-top target="topEl"></ic-back-to-top>
+    `);
+    await page.waitForChanges();
+    const backToTop = await page.find("ic-back-to-top >>> .ic-back-to-top-link");
+    expect(await backToTop.isVisible()).toBe(true);
+  });
+  it("should appear when page scrolled", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<div id="topEl">
+          <ic-typography variant="h2">Top of the page</ic-typography>
+        </div>
+        <div style="height:1200px;"></div>
+        <button style="bottom:0px; left:0px">Test Button</button>
+        <ic-back-to-top target="topEl"></ic-back-to-top>
+    `);
+    await page.waitForChanges();
+    const backToTop = await page.find("ic-back-to-top >>> .ic-back-to-top-link");
+    const button = await page.find("button");
+    expect(await backToTop.isVisible()).toBe(false);
+    await button.focus();
+    expect(await backToTop.isVisible()).toBe(true);
+  });
+  it("should hide and scroll page to top when clicked", async () => {
+    const page = await newE2EPage();
+    await page.setContent(`<div id="topEl">
+          <ic-typography variant="h2">Top of the page</ic-typography>
+        </div>
+        <div style="height:1200px;"></div>
+        <button style="bottom:0px; left:0px">Test Button</button>
+        <ic-back-to-top target="topEl"></ic-back-to-top>
+    `);
+    await page.waitForChanges();
+    const backToTop = await page.find("ic-back-to-top >>> .ic-back-to-top-link");
+    const button = await page.find("button");
+    await button.focus();
+    await backToTop.click();
+    await page.waitForTimeout(300);
+    expect(await backToTop.isVisible()).toBe(false);
+  });
+});
+//# sourceMappingURL=ic-back-to-top.e2e.js.map

package/dist/collection/components/ic-back-to-top/test/basic/ic-back-to-top.e2e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ic-back-to-top.e2e.js","sourceRoot":"","sources":["../../../../../src/components/ic-back-to-top/test/basic/ic-back-to-top.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import { newE2EPage } from \"@stencil/core/testing\";\n\ndescribe(\"ic-back-to-top\", () => {\n  it(\"should be hidden\", async () => {\n    const page = await newE2EPage();\n    await page.setContent(\n      `<div id=\"topEl\" style=\"height:1200px\"></div>\n        <ic-back-to-top target=\"topEl\"></ic-back-to-top>\n      `\n    );\n    await page.waitForChanges();\n    const backToTop = await page.find(\n      \"ic-back-to-top >>> .ic-back-to-top-link\"\n    );\n\n    expect(await backToTop.isVisible()).toBe(false);\n  });\n\n  it(\"should have correct text\", async () => {\n    const page = await newE2EPage();\n    await page.setContent(\n      `<div id=\"topEl\"></div>\n        <ic-back-to-top target=\"topEl\"></ic-back-to-top>\n      `\n    );\n    await page.waitForChanges();\n    const backToTop = await page.find(\"ic-back-to-top >>> ic-typography\");\n    const text = await backToTop.innerText;\n\n    expect(text).toBe(\"Back to top\");\n  });\n\n  it(\"should appear when top is off screen\", async () => {\n    const page = await newE2EPage();\n    await page.setContent(\n      `<div id=\"topEl\" style=\"margin-top:-20px;\">\n          <ic-typography variant=\"h2\">Top of the page</ic-typography>\n        </div>\n        <div style=\"height:1200px;\"></div>\n        <ic-back-to-top target=\"topEl\"></ic-back-to-top>\n    `\n    );\n    await page.waitForChanges();\n    const backToTop = await page.find(\n      \"ic-back-to-top >>> .ic-back-to-top-link\"\n    );\n\n    expect(await backToTop.isVisible()).toBe(true);\n  });\n\n  it(\"should appear when page scrolled\", async () => {\n    const page = await newE2EPage();\n    await page.setContent(\n      `<div id=\"topEl\">\n          <ic-typography variant=\"h2\">Top of the page</ic-typography>\n        </div>\n        <div style=\"height:1200px;\"></div>\n        <button style=\"bottom:0px; left:0px\">Test Button</button>\n        <ic-back-to-top target=\"topEl\"></ic-back-to-top>\n    `\n    );\n    await page.waitForChanges();\n\n    const backToTop = await page.find(\n      \"ic-back-to-top >>> .ic-back-to-top-link\"\n    );\n    const button = await page.find(\"button\");\n\n    expect(await backToTop.isVisible()).toBe(false);\n\n    await button.focus();\n\n    expect(await backToTop.isVisible()).toBe(true);\n  });\n\n  it(\"should hide and scroll page to top when clicked\", async () => {\n    const page = await newE2EPage();\n    await page.setContent(\n      `<div id=\"topEl\">\n          <ic-typography variant=\"h2\">Top of the page</ic-typography>\n        </div>\n        <div style=\"height:1200px;\"></div>\n        <button style=\"bottom:0px; left:0px\">Test Button</button>\n        <ic-back-to-top target=\"topEl\"></ic-back-to-top>\n    `\n    );\n    await page.waitForChanges();\n\n    const backToTop = await page.find(\n      \"ic-back-to-top >>> .ic-back-to-top-link\"\n    );\n    const button = await page.find(\"button\");\n\n    await button.focus();\n    await backToTop.click();\n    await page.waitForTimeout(300);\n\n    expect(await backToTop.isVisible()).toBe(false);\n  });\n});\n"]}

package/dist/collection/components/ic-back-to-top/test/basic/ic-back-to-top.spec.js

@@ -0,0 +1,123 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { ClassificationBanner } from "../../../ic-classification-banner/ic-classification-banner";
+import { Footer } from "../../../ic-footer/ic-footer";
+import { BackToTop } from "../../ic-back-to-top";
+beforeAll(() => {
+  // IntersectionObserver isn't available in test environment
+  const mockIntersectionObserver = jest.fn();
+  mockIntersectionObserver.mockReturnValue({
+    observe: jest.fn().mockReturnValue(null),
+    unobserve: jest.fn().mockReturnValue(null),
+    disconnect: jest.fn().mockReturnValue(null),
+  });
+  Object.defineProperty(global, "IntersectionObserver", {
+    value: mockIntersectionObserver,
+  });
+});
+describe("ic-back-to-top", () => {
+  it("should render", async () => {
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
+    });
+    expect(page.root).toMatchSnapshot("should render");
+  });
+  it("should render with footer", async () => {
+    const page = await newSpecPage({
+      components: [BackToTop, Footer],
+      html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div><ic-footer></ic-footer>`,
+    });
+    expect(page.root).toMatchSnapshot("should render with footer");
+  });
+  it("should render with no targetId set", async () => {
+    jest.spyOn(console, "error").mockImplementation(jest.fn());
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<ic-back-to-top></ic-back-to-top>`,
+    });
+    expect(page.root).toMatchSnapshot("should render with no targetId set");
+  });
+  it("should render when target starts with #", async () => {
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<div id="topEl"><ic-back-to-top target="#topEl"></ic-back-to-top></div>`,
+    });
+    expect(page.root).toMatchSnapshot("should render when target starts with #");
+  });
+  it("should offset due to classification banner", async () => {
+    const page = await newSpecPage({
+      components: [BackToTop, ClassificationBanner],
+      html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top><ic-classification-banner></ic-classification-banner></div>`,
+    });
+    expect(page.rootInstance.bannerOffset).toBe(true);
+  });
+  it("should scroll to 0,0 if target is null", async () => {
+    jest.spyOn(console, "error").mockImplementation(jest.fn());
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<div id="topEl"><ic-back-to-top></ic-back-to-top></div>`,
+    });
+    expect(page.rootInstance.isTargetElNull).toBe(true);
+    page.root.shadowRoot.querySelector("button").click();
+    expect(page.win.screenX).toBe(0);
+    expect(page.win.screenY).toBe(0);
+  });
+  it("should scroll targetEl into view", async () => {
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
+    });
+    page.root.shadowRoot.querySelector("button").click();
+    expect(page.rootInstance.targetElVisible).toBe(true);
+  });
+  it("should return null targetElement when there's no target matching that given in back to top", async () => {
+    jest.spyOn(console, "error").mockImplementation(jest.fn());
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<div><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
+    });
+    const findTarget = page.rootInstance.findTargetEl("topEl");
+    expect(findTarget).toBeNull();
+  });
+  it("should stop observing observedEl when topObserver exists", async () => {
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
+    });
+    page.rootInstance.watchPropHandler(undefined, "topEl");
+    page.rootInstance.createTopObserver("topEl");
+    expect(page.rootInstance.topObserver).not.toBeNull();
+  });
+  it("should set footerVisible", async () => {
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
+    });
+    page.rootInstance.footerObserverCallback([{ isIntersecting: true }]);
+    //value is false as scrollY is always 0
+    expect(page.rootInstance.footerVisible).toBe(false);
+    page.rootInstance.footerObserverCallback([{ isIntersecting: false }]);
+    expect(page.rootInstance.footerVisible).toBe(false);
+  });
+  it("should set targetElVisible", async () => {
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<div id="topEl"><ic-back-to-top target="topEl"></ic-back-to-top></div>`,
+    });
+    page.rootInstance.targetElObserverCallback([{ isIntersecting: true }]);
+    expect(page.rootInstance.targetElVisible).toBe(true);
+    page.rootInstance.targetElObserverCallback([{ isIntersecting: false }]);
+    expect(page.rootInstance.targetElVisible).toBe(false);
+  });
+  it("should test update of target from undefined to value", async () => {
+    jest.spyOn(console, "error").mockImplementation(jest.fn());
+    const page = await newSpecPage({
+      components: [BackToTop],
+      html: `<div id="topEl"><ic-back-to-top></ic-back-to-top></div>`,
+    });
+    page.root.target = "topEl";
+    await page.waitForChanges();
+    expect(page.rootInstance.target).toBe("topEl");
+  });
+});
+//# sourceMappingURL=ic-back-to-top.spec.js.map

package/dist/collection/components/ic-back-to-top/test/basic/ic-back-to-top.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ic-back-to-top.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-back-to-top/test/basic/ic-back-to-top.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { ClassificationBanner } from \"../../../ic-classification-banner/ic-classification-banner\";\nimport { Footer } from \"../../../ic-footer/ic-footer\";\nimport { BackToTop } from \"../../ic-back-to-top\";\n\nbeforeAll(() => {\n  // IntersectionObserver isn't available in test environment\n  const mockIntersectionObserver = jest.fn();\n  mockIntersectionObserver.mockReturnValue({\n    observe: jest.fn().mockReturnValue(null),\n    unobserve: jest.fn().mockReturnValue(null),\n    disconnect: jest.fn().mockReturnValue(null),\n  });\n\n  Object.defineProperty(global, \"IntersectionObserver\", {\n    value: mockIntersectionObserver,\n  });\n});\n\ndescribe(\"ic-back-to-top\", () => {\n  it(\"should render\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render\");\n  });\n\n  it(\"should render with footer\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop, Footer],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div><ic-footer></ic-footer>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with footer\");\n  });\n\n  it(\"should render with no targetId set\", async () => {\n    jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<ic-back-to-top></ic-back-to-top>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with no targetId set\");\n  });\n\n  it(\"should render when target starts with #\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"#topEl\"></ic-back-to-top></div>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render when target starts with #\"\n    );\n  });\n\n  it(\"should offset due to classification banner\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop, ClassificationBanner],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top><ic-classification-banner></ic-classification-banner></div>`,\n    });\n\n    expect(page.rootInstance.bannerOffset).toBe(true);\n  });\n\n  it(\"should scroll to 0,0 if target is null\", async () => {\n    jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top></ic-back-to-top></div>`,\n    });\n\n    expect(page.rootInstance.isTargetElNull).toBe(true);\n\n    page.root.shadowRoot.querySelector(\"button\").click();\n    expect(page.win.screenX).toBe(0);\n    expect(page.win.screenY).toBe(0);\n  });\n\n  it(\"should scroll targetEl into view\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    page.root.shadowRoot.querySelector(\"button\").click();\n    expect(page.rootInstance.targetElVisible).toBe(true);\n  });\n\n  it(\"should return null targetElement when there's no target matching that given in back to top\", async () => {\n    jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    const findTarget = page.rootInstance.findTargetEl(\"topEl\");\n\n    expect(findTarget).toBeNull();\n  });\n\n  it(\"should stop observing observedEl when topObserver exists\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    page.rootInstance.watchPropHandler(undefined, \"topEl\");\n    page.rootInstance.createTopObserver(\"topEl\");\n    expect(page.rootInstance.topObserver).not.toBeNull();\n  });\n\n  it(\"should set footerVisible\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    page.rootInstance.footerObserverCallback([{ isIntersecting: true }]);\n    //value is false as scrollY is always 0\n    expect(page.rootInstance.footerVisible).toBe(false);\n\n    page.rootInstance.footerObserverCallback([{ isIntersecting: false }]);\n    expect(page.rootInstance.footerVisible).toBe(false);\n  });\n\n  it(\"should set targetElVisible\", async () => {\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top target=\"topEl\"></ic-back-to-top></div>`,\n    });\n\n    page.rootInstance.targetElObserverCallback([{ isIntersecting: true }]);\n    expect(page.rootInstance.targetElVisible).toBe(true);\n\n    page.rootInstance.targetElObserverCallback([{ isIntersecting: false }]);\n    expect(page.rootInstance.targetElVisible).toBe(false);\n  });\n\n  it(\"should test update of target from undefined to value\", async () => {\n    jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n    const page = await newSpecPage({\n      components: [BackToTop],\n      html: `<div id=\"topEl\"><ic-back-to-top></ic-back-to-top></div>`,\n    });\n\n    page.root.target = \"topEl\";\n    await page.waitForChanges();\n\n    expect(page.rootInstance.target).toBe(\"topEl\");\n  });\n});\n"]}

package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.css

@@ -0,0 +1,100 @@
+:host {
+  display: block;
+  margin: var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0;
+}
+
+:host .breadcrumb {
+  display: flex;
+  align-items: center;
+  white-space: nowrap;
+  gap: var(--ic-space-xs);
+  min-height: var(--ic-space-lg);
+}
+
+:host .chevron {
+  width: var(--ic-space-lg);
+  height: var(--ic-space-lg);
+}
+
+:host .chevron svg {
+  color: var(--ic-architectural-400);
+}
+
+:host(:first-child) .chevron {
+  display: none;
+}
+
+.back-icon svg {
+  color: var(--ic-hyperlink);
+}
+
+:host(.back) {
+  display: flex;
+  align-items: center;
+}
+
+:host(.back) .chevron {
+  display: none;
+}
+
+ic-link {
+  --breadcrumb-link-display: inline-flex;
+  --breadcrumb-link-align-items: center;
+  --breadcrumb-link-gap: var(--ic-space-xs);
+}
+
+:host([aria-current="page"]) .current-page-container {
+  display: flex;
+  align-items: center;
+  gap: var(--ic-space-xs);
+}
+
+:host(.collapsed-breadcrumb-wrapper) {
+  margin-right: var(--ic-space-xs) !important;
+  display: flex;
+  align-items: center;
+  gap: var(--ic-space-xs);
+}
+
+:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb) {
+  border: none;
+  background-color: transparent;
+  color: var(--ic-hyperlink);
+  text-decoration: underline;
+  font-weight: var(--ic-font-weight-bold);
+  cursor: pointer;
+}
+
+:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),
+:host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {
+  outline: var(--ic-hc-focus-outline);
+  border-bottom: 0.25rem solid !important;
+  margin-bottom: -0.25rem !important;
+  text-decoration: none;
+}
+
+.hide,
+:host(.collapsed-breadcrumb-wrapper) ::slotted(.hide) {
+  display: none;
+}
+
+@media (forced-colors: active) {
+  .back-icon svg {
+    color: currentcolor;
+  }
+}
+
+@supports (text-decoration-thickness: 25%) {
+  ic-link {
+    --breadcrumb-link-display: flex;
+  }
+
+  :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:hover),
+  :host(.collapsed-breadcrumb-wrapper) ::slotted(.collapsed-breadcrumb:focus) {
+    text-decoration-line: underline;
+    text-decoration-thickness: 25%;
+    text-underline-offset: 25%;
+    border-bottom: 0 !important;
+    margin-bottom: 0 !important;
+  }
+}

package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.js

@@ -0,0 +1,166 @@
+import { Host, h } from "@stencil/core";
+import chevronIcon from "../../assets/chevron-icon.svg";
+import backIcon from "../../assets/back-icon.svg";
+import { isSlotUsed } from "../../utils/helpers";
+export class Breadcrumb {
+  constructor() {
+    this.renderDefaultBreadcrumb = (current, pageTitle, describedById, href) => {
+      const hasPageTitle = pageTitle !== null && pageTitle !== undefined && pageTitle !== "";
+      if (current && hasPageTitle) {
+        return (h("span", { class: {
+            "current-page-container": current,
+          } }, isSlotUsed(this.el, "icon") && h("slot", { name: "icon" }), pageTitle));
+      }
+      return (h("ic-link", { href: href, class: "breadcrumb-link", "aria-describedby": this.showBackIcon && describedById && describedById }, this.showBackIcon && (h("div", { class: "back-icon", innerHTML: backIcon })), isSlotUsed(this.el, "icon") && h("slot", { name: "icon" }), pageTitle));
+    };
+    this.setSlottedCurrentPageClass = () => {
+      const icLink = this.el.querySelector("ic-link");
+      const currentPage = "current-page";
+      if (icLink) {
+        icLink.classList.remove(currentPage);
+        if (this.current) {
+          const hasCurrentPageClass = icLink.classList.contains(currentPage);
+          if (!hasCurrentPageClass) {
+            icLink.classList.add("breadcrumb-link", currentPage);
+          }
+        }
+      }
+    };
+    this.current = false;
+    this.href = undefined;
+    this.pageTitle = undefined;
+    this.showBackIcon = false;
+  }
+  componentWillRender() {
+    this.setSlottedCurrentPageClass();
+  }
+  /**
+   * Sets focus on the breadcrumb.
+   */
+  async setFocus() {
+    if (this.el.shadowRoot.querySelector("ic-link")) {
+      this.el.shadowRoot.querySelector("ic-link").focus();
+    }
+  }
+  render() {
+    const { current, href, pageTitle } = this;
+    const describedById = `${pageTitle && pageTitle.toLowerCase().replace(" ", "-")}-describedby`;
+    const hasPageTitle = pageTitle !== null && pageTitle !== undefined && pageTitle !== "";
+    const hasHref = href !== null && href !== undefined && href !== "";
+    return (h(Host, { class: {
+        back: this.showBackIcon,
+      }, "aria-current": current && "page", role: "listitem" }, h("div", { class: "breadcrumb" }, h("span", { innerHTML: chevronIcon, class: "chevron", "aria-hidden": "true" }), this.showBackIcon && describedById && (h("span", { id: describedById, class: "hide" }, `Back to ${pageTitle}`)), hasPageTitle && hasHref ? (this.renderDefaultBreadcrumb(current, pageTitle, describedById, href)) : (h("slot", null)))));
+  }
+  static get is() { return "ic-breadcrumb"; }
+  static get encapsulation() { return "shadow"; }
+  static get delegatesFocus() { return true; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["ic-breadcrumb.css"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["ic-breadcrumb.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "current": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "If `true`, aria-current will be set on the breadcrumb."
+        },
+        "attribute": "current",
+        "reflect": false,
+        "defaultValue": "false"
+      },
+      "href": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The URL that the breadcrumb link points to."
+        },
+        "attribute": "href",
+        "reflect": false
+      },
+      "pageTitle": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": true,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The title of the breadcrumb."
+        },
+        "attribute": "page-title",
+        "reflect": false
+      },
+      "showBackIcon": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "internal",
+              "text": "If `true`, back icon will be displayed."
+            }],
+          "text": ""
+        },
+        "attribute": "show-back-icon",
+        "reflect": true,
+        "defaultValue": "false"
+      }
+    };
+  }
+  static get methods() {
+    return {
+      "setFocus": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {
+            "Promise": {
+              "location": "global"
+            }
+          },
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "Sets focus on the breadcrumb.",
+          "tags": []
+        }
+      }
+    };
+  }
+  static get elementRef() { return "el"; }
+}
+//# sourceMappingURL=ic-breadcrumb.js.map

package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ic-breadcrumb.js","sourceRoot":"","sources":["../../../src/components/ic-breadcrumb/ic-breadcrumb.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, Prop, h, Element, Method } from \"@stencil/core\";\nimport { IcBreadcrumbDefault } from \"./ic-breadcrumb.types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport backIcon from \"../../assets/back-icon.svg\";\nimport { isSlotUsed } from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-breadcrumb\",\n  styleUrl: \"ic-breadcrumb.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class Breadcrumb {\n  @Element() el: HTMLIcBreadcrumbElement;\n\n  /**\n   * @slot icon - Content will be rendered to the left of the breadcrumb page title.\n   */\n\n  /**\n   * If `true`, aria-current will be set on the breadcrumb.\n   */\n  @Prop() current?: boolean = false;\n\n  /**\n   * The URL that the breadcrumb link points to.\n   */\n  @Prop() href?: string;\n\n  /**\n   * The title of the breadcrumb.\n   */\n  @Prop() pageTitle!: string;\n\n  /**\n   * @internal If `true`, back icon will be displayed.\n   */\n  @Prop({ reflect: true }) showBackIcon: boolean = false;\n\n  componentWillRender(): void {\n    this.setSlottedCurrentPageClass();\n  }\n\n  /**\n   * Sets focus on the breadcrumb.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.el.shadowRoot.querySelector(\"ic-link\")) {\n      this.el.shadowRoot.querySelector(\"ic-link\").focus();\n    }\n  }\n\n  private renderDefaultBreadcrumb = (\n    current: boolean,\n    pageTitle: string,\n    describedById: string,\n    href: string\n  ): IcBreadcrumbDefault => {\n    const hasPageTitle =\n      pageTitle !== null && pageTitle !== undefined && pageTitle !== \"\";\n\n    if (current && hasPageTitle) {\n      return (\n        <span\n          class={{\n            \"current-page-container\": current,\n          }}\n        >\n          {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n          {pageTitle}\n        </span>\n      );\n    }\n\n    return (\n      <ic-link\n        href={href}\n        class=\"breadcrumb-link\"\n        aria-describedby={this.showBackIcon && describedById && describedById}\n      >\n        {this.showBackIcon && (\n          <div class=\"back-icon\" innerHTML={backIcon}></div>\n        )}\n        {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n        {pageTitle}\n      </ic-link>\n    );\n  };\n\n  private setSlottedCurrentPageClass = () => {\n    const icLink = this.el.querySelector(\"ic-link\");\n    const currentPage = \"current-page\";\n    if (icLink) {\n      icLink.classList.remove(currentPage);\n      if (this.current) {\n        const hasCurrentPageClass = icLink.classList.contains(currentPage);\n        if (!hasCurrentPageClass) {\n          icLink.classList.add(\"breadcrumb-link\", currentPage);\n        }\n      }\n    }\n  };\n\n  render() {\n    const { current, href, pageTitle } = this;\n    const describedById = `${\n      pageTitle && pageTitle.toLowerCase().replace(\" \", \"-\")\n    }-describedby`;\n\n    const hasPageTitle =\n      pageTitle !== null && pageTitle !== undefined && pageTitle !== \"\";\n    const hasHref = href !== null && href !== undefined && href !== \"\";\n\n    return (\n      <Host\n        class={{\n          back: this.showBackIcon,\n        }}\n        aria-current={current && \"page\"}\n        role=\"listitem\"\n      >\n        <div class=\"breadcrumb\">\n          <span innerHTML={chevronIcon} class=\"chevron\" aria-hidden=\"true\" />\n          {this.showBackIcon && describedById && (\n            <span\n              id={describedById}\n              class=\"hide\"\n            >{`Back to ${pageTitle}`}</span>\n          )}\n          {hasPageTitle && hasHref ? (\n            this.renderDefaultBreadcrumb(\n              current,\n              pageTitle,\n              describedById,\n              href\n            )\n          ) : (\n            <slot />\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=ic-breadcrumb.types.js.map

package/dist/collection/components/ic-breadcrumb/ic-breadcrumb.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ic-breadcrumb.types.js","sourceRoot":"","sources":["../../../src/components/ic-breadcrumb/ic-breadcrumb.types.ts"],"names":[],"mappings":"","sourcesContent":["export type IcBreadcrumbDefault = string | HTMLIcLinkElement | null;\n"]}