@ukic/web-components 2.35.0 → 2.35.2

package/dist/collection/components/ic-toast/ic-toast.stories.js

@@ -0,0 +1,413 @@
+import { html } from "lit-html";
+
+const defaultArgs = {
+  autoDismissTimeout: 5000,
+  dismissButtonAriaLabel: "dismiss",
+  dismissMode: "manual",
+  heading: "This is the heading",
+  message: "This is the message",
+  neutralIconAriaLabel: "",
+  variant: "neutral",
+  actionSlot: "action",
+  neutralIconSlot: "neutral-icon",
+};
+
+export default {
+  title: "Web Components/Toast",
+  component: "ic-toast",
+};
+
+export const Default = {
+  render: (args) =>
+    html`<button onclick="func()">Display toast</button>
+      <script>
+        var toastRegion = document.querySelector("ic-toast-region");
+        function func() {
+          var x = document.getElementById("toast1");
+          toastRegion.openToast = x;
+        }
+      </script>
+      <ic-toast-region>
+        <ic-toast id="toast1" heading="Your coffee is ready"></ic-toast>
+      </ic-toast-region>`,
+
+  name: "Default",
+};
+
+export const WithVariant = {
+  render: (args) =>
+    html`<button onclick="func()">Display toast</button>
+      <script>
+        var toastRegion = document.querySelector("ic-toast-region");
+        function func() {
+          var x = document.getElementById("toast1");
+          toastRegion.openToast = x;
+        }
+      </script>
+      <ic-toast-region>
+        <ic-toast
+          id="toast1"
+          heading="Your coffee is ready"
+          message="Please dismiss and collect"
+          variant="success"
+        ></ic-toast>
+      </ic-toast-region>`,
+
+  name: "With variant",
+};
+
+export const MultilineMessage = {
+  render: (args) =>
+    html`<button onclick="func()">Display toast</button>
+      <script>
+        var toastRegion = document.querySelector("ic-toast-region");
+        function func() {
+          var x = document.getElementById("toast1");
+          toastRegion.openToast = x;
+        }
+      </script>
+      <ic-toast-region>
+        <ic-toast
+          id="toast1"
+          heading="Your coffee is ready"
+          message="Please dismiss and come to collect your delicious coffee from the barista right away before it gets cold. Don't delay! We wouldn't want you to lose out on your fantastic coffee now would we?"
+        ></ic-toast>
+      </ic-toast-region>`,
+
+  name: "Multiline message",
+};
+
+export const SlottedActionElements = {
+  render: (args) =>
+    html`<button onclick="func()">Display toast 1</button>
+      <button onclick="func2()">Display toast 2</button>
+      <script>
+        var toastRegion = document.querySelector("ic-toast-region");
+        function func() {
+          var x = document.getElementById("toast1");
+          toastRegion.openToast = x;
+        }
+        function func2() {
+          var x = document.getElementById("toast2");
+          toastRegion.openToast = x;
+        }
+      </script>
+      <ic-toast-region>
+        <ic-toast
+          id="toast1"
+          heading="Your coffee had issues"
+          message="Please dismiss and try again"
+          variant="warning"
+        >
+          <ic-button slot="action" appearance="light">Click me</ic-button>
+        </ic-toast>
+        <ic-toast
+          id="toast2"
+          heading="Your coffee was lost"
+          message="Please dismiss and try again"
+          variant="error"
+        >
+          <ic-link href="/" slot="action" appearance="light">Click me</ic-link>
+        </ic-toast>
+      </ic-toast-region>`,
+
+  name: "Slotted action elements",
+};
+
+export const AutoDismiss = {
+  render: (args) =>
+    html`<button onclick="func()">Display toast 1</button>
+      <button onclick="func2()">Display toast 2</button>
+      <script>
+        var toastRegion = document.querySelector("ic-toast-region");
+        function func() {
+          var x = document.getElementById("toast1");
+          toastRegion.openToast = x;
+        }
+        function func2() {
+          var x = document.getElementById("toast2");
+          toastRegion.openToast = x;
+        }
+      </script>
+      <ic-toast-region>
+        <ic-toast
+          id="toast1"
+          variant="info"
+          heading="Your coffee is ready"
+          message="This alert will dismiss itself, please collect your java"
+          dismiss-mode="automatic"
+          auto-dismiss-timeout="10000"
+        ></ic-toast>
+        <ic-toast
+          id="toast2"
+          heading="Your coffee was lost"
+          message="This alert will dismiss itself, sorry about the coffee"
+          variant="error"
+          dismiss-mode="automatic"
+          auto-dismiss-timeout="10000"
+        ></ic-toast>
+      </ic-toast-region>`,
+
+  name: "Auto dismiss",
+};
+
+export const CustomNeutralIconAndDismissAriaLabel = {
+  render: (args) =>
+    html`<button onclick="func()">Display toast</button>
+      <script>
+        var toastRegion = document.querySelector("ic-toast-region");
+        function func() {
+          var x = document.getElementById("toast1");
+          toastRegion.openToast = x;
+        }
+      </script>
+      <ic-toast-region>
+        <ic-toast
+          id="toast1"
+          heading="Your coffee is ready"
+          variant="neutral"
+          neutral-icon-aria-label="Hello world"
+          dismiss-button-aria-label="dismiss me"
+        >
+          <svg
+            slot="neutral-icon"
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M8.79502 15.875L4.62502 11.705L3.20502 13.115L8.79502 18.705L20.795 6.70501L19.385 5.29501L8.79502 15.875Z"
+            />
+          </svg>
+        </ic-toast>
+      </ic-toast-region>`,
+
+  name: "Custom neutral icon and dismiss aria-label",
+};
+
+export const ExampleOnPage = {
+  render: (args) =>
+    html` <script>
+        var toastRegion = document.querySelector("ic-toast-region");
+        function func() {
+          var x = document.getElementById("toast1");
+          toastRegion.openToast = x;
+        }
+      </script>
+      <ic-toast-region>
+        <ic-toast id="toast1" heading="Your coffee is ready"></ic-toast>
+      </ic-toast-region>
+      <div
+        id="header"
+        style="width:100%;height:80px;background-color:#23508e;color:var(--ic-architectural-white)"
+      >
+        <ic-typography variant="h1">Header</ic-typography>
+      </div>
+      <div id="topPageEl">
+        <ic-typography variant="h2">Top of the page</ic-typography>
+      </div>
+      <ic-typography variant="h3">Some content</ic-typography>
+      <button onclick="func()">Display toast</button>
+      <p>
+        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vel velit
+        turpis. Cras ac ligula et lectus mollis molestie in a enim. In ac turpis
+        in leo rutrum eleifend. Fusce consectetur posuere ligula, vitae semper
+        lorem mollis vitae. Fusce vel blandit turpis. Nulla justo ligula,
+        egestas quis rutrum id, vulputate eget diam. Integer mattis quis nisi id
+        blandit. Duis nisi lectus, suscipit elementum iaculis sed, porta et
+        risus.
+      </p>
+      <br />
+      <br />
+      <br />
+      <ic-typography variant="h3">More content</ic-typography>
+      <p>
+        Phasellus accumsan ligula enim, a iaculis sapien rhoncus vitae.
+        Curabitur pulvinar posuere diam in luctus. Sed blandit diam id odio
+        aliquam aliquet. Pellentesque eros enim, tristique vel mattis eu,
+        blandit at enim. Pellentesque sollicitudin pellentesque tellus vel
+        eleifend. Nulla mauris lorem, porttitor vel orci eu, iaculis maximus
+        nunc. Ut rhoncus ex ipsum. Mauris ultricies, augue sed eleifend
+        pellentesque, leo purus efficitur orci, sit amet volutpat tortor diam
+        non lorem. Morbi venenatis neque vel accumsan sagittis. Nunc rutrum
+        augue non urna tincidunt auctor in at libero. Sed in risus sit amet nisl
+        tempor viverra. Phasellus maximus sapien eu erat maximus iaculis.
+        Praesent ultricies id orci eu euismod. Fusce eu urna turpis. Praesent ut
+        neque tincidunt, porta sem id, accumsan massa.
+      </p>
+      <br />
+      <br />
+      <br />
+      <ic-typography variant="h3">Some other content</ic-typography>
+      <p>
+        Curabitur eu tempor justo. Nunc congue viverra tristique. Maecenas massa
+        enim, tincidunt consequat maximus at, fermentum vel lectus. Curabitur at
+        ligula tellus. Ut a elit sit amet augue sagittis feugiat. Mauris mi
+        enim, viverra id turpis ac, auctor vulputate ipsum. Nunc efficitur
+        volutpat augue eget sollicitudin. Pellentesque eget pharetra ligula.
+        Integer finibus feugiat sapien a pulvinar. Phasellus fermentum est
+        lacus, quis volutpat justo pellentesque vitae. Sed vitae diam porta,
+        facilisis metus ut, dictum lorem. Proin sed bibendum libero. Maecenas
+        justo neque, ultricies sed magna ac, mattis vehicula elit. Donec ac
+        lacus eget sapien luctus ultricies in in nibh.
+      </p>
+      <p>
+        Curabitur in nulla urna. Donec ligula est, suscipit eget malesuada
+        vitae, elementum et quam. Lorem ipsum dolor sit amet, consectetur
+        adipiscing elit. Nulla eu dui a quam mollis porta. Nulla ante nunc,
+        ultrices luctus dolor at, ullamcorper convallis erat. Aenean viverra
+        semper arcu nec semper. Sed non magna purus. Integer accumsan dui et
+        volutpat auctor. Phasellus nec risus ultricies, maximus nunc eu,
+        placerat diam. Etiam pulvinar lacinia urna eget molestie. Suspendisse
+        semper hendrerit ipsum, vel porttitor lacus venenatis sit amet. Nullam
+        non elit in sem vestibulum molestie tempor eget augue. Sed neque ligula,
+        tempus ac mollis bibendum, ultrices suscipit risus. Duis suscipit
+        pulvinar varius.
+      </p>
+      <br />
+      <br />
+      <br />
+      <ic-typography variant="h3">Some more</ic-typography>
+      <p>
+        Etiam accumsan nibh erat, condimentum tempus metus suscipit nec. Duis
+        placerat varius dolor eget ornare. Vestibulum egestas tellus non tellus
+        ornare, eu scelerisque erat pulvinar. Nam tempus lacus eu libero
+        consequat, in elementum magna ultricies. Etiam at suscipit odio. Duis
+        quis quam vitae quam varius luctus. Aliquam erat volutpat. Fusce laoreet
+        consectetur tortor, ac suscipit sem feugiat non. Etiam tempus tellus
+        aliquet orci pretium, nec pretium nulla faucibus
+      </p>
+      <br />
+      <br />
+      <br />
+      <ic-typography variant="h3">Nearly there</ic-typography>
+      <p>
+        Curabitur eu tempor justo. Nunc congue viverra tristique. Maecenas massa
+        enim, tincidunt consequat maximus at, fermentum vel lectus. Curabitur at
+        ligula tellus. Ut a elit sit amet augue sagittis feugiat. Mauris mi
+        enim, viverra id turpis ac, auctor vulputate ipsum. Nunc efficitur
+        volutpat augue eget sollicitudin. Pellentesque eget pharetra ligula.
+        Integer finibus feugiat sapien a pulvinar. Phasellus fermentum est
+        lacus, quis volutpat justo pellentesque vitae. Sed vitae diam porta,
+        facilisis metus ut, dictum lorem. Proin sed bibendum libero. Maecenas
+        justo neque, ultricies sed magna ac, mattis vehicula elit. Donec ac
+        lacus eget sapien luctus ultricies in in nibh.
+      </p>
+      <p>
+        Curabitur in nulla urna. Donec ligula est, suscipit eget malesuada
+        vitae, elementum et quam. Lorem ipsum dolor sit amet, consectetur
+        adipiscing elit. Nulla eu dui a quam mollis porta. Nulla ante nunc,
+        ultrices luctus dolor at, ullamcorper convallis erat. Aenean viverra
+        semper arcu nec semper. Sed non magna purus. Integer accumsan dui et
+        volutpat auctor. Phasellus nec risus ultricies, maximus nunc eu,
+        placerat diam. Etiam pulvinar lacinia urna eget molestie. Suspendisse
+        semper hendrerit ipsum, vel porttitor lacus venenatis sit amet. Nullam
+        non elit in sem vestibulum molestie tempor eget augue. Sed neque ligula,
+        tempus ac mollis bibendum, ultrices suscipit risus. Duis suscipit
+        pulvinar varius.
+      </p>
+      <br />
+      <br />
+      <br />
+      <ic-typography variant="h3">The end</ic-typography>
+      <br />`,
+
+  name: "Example on page",
+};
+
+export const DeprecatedSetVisible = {
+  render: (args) =>
+    html`<button onclick="func()">Display toast</button>
+      <script>
+        var toastRegion = document.querySelector("ic-toast-region");
+        function func() {
+          var x = document.getElementById("toast1");
+          toastRegion.setVisible(x);
+        }
+      </script>
+      <ic-toast-region>
+        <ic-toast id="toast1" heading="Your coffee is ready"></ic-toast>
+      </ic-toast-region>`,
+
+  name: "Deprecated - setVisible",
+};
+
+export const Playground = {
+  render: (args) =>
+    html`<button onclick="func()">Display toast</button>
+      <script>
+        var toastRegion = document.querySelector("ic-toast-region");
+        function func() {
+          var x = document.getElementById("toast1");
+          toastRegion.openToast = x;
+        }
+      </script>
+      <ic-toast-region>
+        <ic-toast
+          id="toast1"
+          heading=${args.heading}
+          message=${args.message}
+          variant=${args.variant}
+          dismiss-mode=${args.dismissMode}
+          auto-dismiss-timeout=${args.autoDismissTimeout}
+          neutral-icon-aria-label=${args.neutralIconAriaLabel}
+          dismiss-button-aria-label=${args.dismissButtonAriaLabel}
+        >
+          <ic-button slot=${args.actionSlot} appearance="light"
+            >Click me</ic-button
+          >
+          <svg
+            slot=${args.neutralIconSlot}
+            width="24"
+            height="24"
+            viewBox="0 0 24 24"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M8.79502 15.875L4.62502 11.705L3.20502 13.115L8.79502 18.705L20.795 6.70501L19.385 5.29501L8.79502 15.875Z"
+            />
+          </svg>
+        </ic-toast>
+      </ic-toast-region>`,
+
+  args: defaultArgs,
+
+  argTypes: {
+    dismissMode: {
+      options: ["manual", "automatic"],
+
+      control: {
+        type: "inline-radio",
+      },
+    },
+
+    variant: {
+      options: ["neutral", "info", "warning", "error", "success", ""],
+
+      control: {
+        type: "select",
+      },
+    },
+
+    actionSlot: {
+      options: ["action", ""],
+
+      control: {
+        type: "select",
+      },
+    },
+
+    neutralIconSlot: {
+      options: ["neutral-icon", ""],
+
+      control: {
+        type: "select",
+      },
+    },
+  },
+
+  name: "Playground",
+};

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

@@ -104,15 +104,15 @@ describe("ic-toast component", () => {
         page.rootInstance.setVisible();
         await page.waitForChanges();
         expect(page.root)
-            .toEqualHtml(`<ic-toast heading="Heading" role="status" dismiss-mode="automatic">
+            .toEqualHtml(`<ic-toast heading="Heading" role="alert" aria-live="polite" dismiss-mode="automatic">
       <mock:shadow-root>
         <div class="container">
           <div class="toast-content">
             <div class="toast-message">
               <ic-typography variant="subtitle-large">
-                <h5>
+                <p>
                   Heading
-                </h5>
+                </p>
               </ic-typography>
             </div>
           </div>

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

@@ -1 +1 @@
-{"version":3,"file":"ic-toast.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-toast/test/basic/ic-toast.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { waitForTimeout } from \"../../../../testspec.setup\";\nimport { Button } from \"../../../ic-button/ic-button\";\nimport { Link } from \"../../../ic-link/ic-link\";\nimport { Toast } from \"../../ic-toast\";\n\ndescribe(\"ic-toast component\", () => {\n  it(\"should render when heading is supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\"></ic-toast>`,\n    });\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    expect(page.root)\n      .toEqualHtml(`<ic-toast aria-label=\"Heading\" heading=\"Heading\" role=\"dialog\">\n      <mock:shadow-root>\n        <div class=\"container\">\n          <div class=\"toast-content\">\n            <div class=\"toast-message\">\n              <ic-typography variant=\"subtitle-large\">\n                <h5>\n                  Heading\n                </h5>\n              </ic-typography>\n            </div>\n          </div>\n          <ic-button appearance=\"light\" id=\"dismiss-button\" aria-label=\"dismiss\" variant=\"icon\">\n            svg\n          </ic-button>\n        </div>\n      </mock:shadow-root>\n    </ic-toast>`);\n  });\n\n  it(\"should render when a heading and message is supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" message=\"toast message\"></ic-toast>`,\n    });\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    expect(page.root)\n      .toEqualHtml(`<ic-toast aria-label=\"Heading\" aria-description=\"toast message\" message=\"toast message\" heading=\"Heading\" role=\"dialog\">\n      <mock:shadow-root>\n        <div class=\"container\">\n          <div class=\"toast-content\">\n            <div class=\"toast-message\">\n              <ic-typography variant=\"subtitle-large\">\n                <h5>\n                  Heading\n                </h5>\n              </ic-typography>\n              <ic-typography variant=\"body\">\n                <p>\n                  toast message\n                </p>\n              </ic-typography>\n            </div>\n          </div>\n          <ic-button appearance=\"light\" id=\"dismiss-button\" aria-label=\"dismiss\" variant=\"icon\">\n            svg\n          </ic-button>\n        </div>\n      </mock:shadow-root>\n    </ic-toast>`);\n  });\n\n  it(\"should render a variant icon and banner when a variant is supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" variant=\"success\"></ic-toast>`,\n    });\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    expect(page.root)\n      .toEqualHtml(`<ic-toast aria-label=\"Success\" aria-description=\"Heading\" heading=\"Heading\" role=\"dialog\" variant=\"success\">\n      <mock:shadow-root>\n        <div class=\"container\">\n          <div class=\"toast-icon-container\">\n            <div class=\"divider divider-success\"></div>\n            <span class=\"toast-icon\">\n              svg\n            </span>\n          </div>\n          <div class=\"toast-content\">\n            <div class=\"toast-message\">\n              <ic-typography variant=\"subtitle-large\">\n                <h5>\n                  Heading\n                </h5>\n              </ic-typography>\n            </div>\n          </div>\n          <ic-button appearance=\"light\" id=\"dismiss-button\" aria-label=\"dismiss\" variant=\"icon\">\n            svg\n          </ic-button>\n        </div>\n      </mock:shadow-root>\n    </ic-toast>`);\n  });\n\n  it(\"should render a loading indicator instead of a dismiss button when dismissMode is automatic\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" dismiss-mode=\"automatic\"></ic-toast>`,\n    });\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    expect(page.root)\n      .toEqualHtml(`<ic-toast heading=\"Heading\" role=\"status\" dismiss-mode=\"automatic\">\n      <mock:shadow-root>\n        <div class=\"container\">\n          <div class=\"toast-content\">\n            <div class=\"toast-message\">\n              <ic-typography variant=\"subtitle-large\">\n                <h5>\n                  Heading\n                </h5>\n              </ic-typography>\n            </div>\n          </div>\n          <ic-loading-indicator appearance=\"light\" class=\"toast-dismiss-timer\" progress=\"100\" size=\"icon\"></ic-loading-indicator>\n        </div>\n      </mock:shadow-root>\n    </ic-toast>`);\n  });\n\n  it(\"should display the toast when setVisible is ran\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Button],\n      html: `<ic-toast heading=\"Heading\"></ic-toast>`,\n    });\n\n    expect(page.root.classList.contains(\"hidden\")).toBeTruthy();\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n    expect(page.root.classList.contains(\"hidden\")).toBeFalsy();\n  });\n\n  it(\"should emit the icDismiss event when dismissed with by clicking the button\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Button],\n      html: `<ic-toast heading=\"Heading\"></ic-toast>`,\n    });\n\n    const callbackFn = jest.fn();\n    page.doc.addEventListener(\"icDismiss\", callbackFn);\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    const dismissButton = page.root.shadowRoot.querySelector(\"ic-button\");\n    dismissButton.click();\n    await page.waitForChanges();\n\n    expect(callbackFn).toHaveBeenCalled();\n  });\n\n  it(\"should emit the icDismiss event when dismissed with by pressing Escape\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Button],\n      html: `<ic-toast heading=\"Heading\"></ic-toast>`,\n    });\n\n    const callbackFn = jest.fn();\n    page.doc.addEventListener(\"icDismiss\", callbackFn);\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    const event = new KeyboardEvent(\"keydown\", { key: \"Escape\" });\n    page.rootInstance.handleKeyboard(event);\n    await page.waitForChanges();\n\n    expect(callbackFn).toHaveBeenCalled();\n  });\n\n  it(\"should emit icDismiss after the timer expires when an auto dismiss toast is made visible\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" dismiss-mode=\"automatic\"></ic-toast>`,\n    });\n\n    const callbackFn = jest.fn();\n    page.doc.addEventListener(\"icDismiss\", callbackFn);\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n    expect(callbackFn).not.toHaveBeenCalled();\n\n    await waitForTimeout(6000);\n    expect(callbackFn).toHaveBeenCalled();\n  });\n\n  it(\"should pause timer when mouse is hovered over, and resume when mouse leaves\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" dismiss-mode=\"automatic\" auto-dismiss-timeout=\"10000\"></ic-toast>`,\n    });\n\n    const intervalCb = jest.spyOn(window, \"setInterval\");\n    const clearCb = jest.spyOn(window, \"clearInterval\");\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    await waitForTimeout(3000);\n    expect(intervalCb).toHaveBeenCalledTimes(1);\n\n    page.rootInstance.handleTimer({ type: \"mouseenter\" });\n    await page.waitForChanges();\n    expect(clearCb).toHaveBeenCalled();\n\n    page.rootInstance.handleTimer({ type: \"mouseleave\" });\n    await page.waitForChanges();\n    await waitForTimeout(1000);\n    expect(intervalCb).toHaveBeenCalledTimes(2);\n    page.setContent(\"\");\n  });\n\n  it(\"should post a console error message if the message or header is too long\", async () => {\n    const longText =\n      \"lorem donec massa sapien faucibus et molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit sed ullamcorper morbi tincidunt ornare massa eget egestas purus viverra accumsan in nisl nisi scelerisque eu ultrices vitae auctor eu augue ut lectus arcu bibendum at varius vel pharetra vel turpis nunc eget lorem dolor\";\n    const consoleCb = jest\n      .spyOn(console, \"error\")\n      .mockImplementation(jest.fn());\n    await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"${longText}\" message=\"${longText}\"></ic-toast>`,\n    });\n    expect(consoleCb).toHaveBeenCalledTimes(1);\n  });\n\n  it(\"should only focus the two interactive elements in the manual toast when using tab\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Button],\n      html: `<ic-toast heading=\"Heading\"><ic-button id=\"slottedButton\" slot=\"action\">Click me</ic-button></ic-toast>`,\n    });\n    const focusCallback = jest.spyOn(Button.prototype, \"setFocus\");\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n    await waitForTimeout(300);\n    expect(focusCallback).toHaveBeenCalledTimes(1);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: false,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(2);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: false,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(3);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: false,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(4);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: true,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(5);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: true,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(6);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: true,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(7);\n  });\n\n  it(\"should focus a link element that has been slotted into the action slot\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Link],\n      html: `<ic-toast heading=\"Heading\"><ic-link href=\"/\" slot=\"action\">Text</ic-link></ic-toast>`,\n    });\n    const focusCallback = jest.spyOn(Link.prototype, \"setFocus\");\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n    await waitForTimeout(300);\n    expect(focusCallback).toHaveBeenCalledTimes(1);\n  });\n\n  it(\"should update the dialog's label if the prop neutralIconAriaLabel prop is provided\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast variant=\"neutral\" neutral-icon-aria-label=\"Hello World\" heading=\"Heading\"></ic-toast>`,\n    });\n\n    expect(page.root.getAttribute(\"aria-label\")).toBe(\"Hello World\");\n  });\n});\n"]}
+{"version":3,"file":"ic-toast.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-toast/test/basic/ic-toast.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { waitForTimeout } from \"../../../../testspec.setup\";\nimport { Button } from \"../../../ic-button/ic-button\";\nimport { Link } from \"../../../ic-link/ic-link\";\nimport { Toast } from \"../../ic-toast\";\n\ndescribe(\"ic-toast component\", () => {\n  it(\"should render when heading is supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\"></ic-toast>`,\n    });\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    expect(page.root)\n      .toEqualHtml(`<ic-toast aria-label=\"Heading\" heading=\"Heading\" role=\"dialog\">\n      <mock:shadow-root>\n        <div class=\"container\">\n          <div class=\"toast-content\">\n            <div class=\"toast-message\">\n              <ic-typography variant=\"subtitle-large\">\n                <h5>\n                  Heading\n                </h5>\n              </ic-typography>\n            </div>\n          </div>\n          <ic-button appearance=\"light\" id=\"dismiss-button\" aria-label=\"dismiss\" variant=\"icon\">\n            svg\n          </ic-button>\n        </div>\n      </mock:shadow-root>\n    </ic-toast>`);\n  });\n\n  it(\"should render when a heading and message is supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" message=\"toast message\"></ic-toast>`,\n    });\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    expect(page.root)\n      .toEqualHtml(`<ic-toast aria-label=\"Heading\" aria-description=\"toast message\" message=\"toast message\" heading=\"Heading\" role=\"dialog\">\n      <mock:shadow-root>\n        <div class=\"container\">\n          <div class=\"toast-content\">\n            <div class=\"toast-message\">\n              <ic-typography variant=\"subtitle-large\">\n                <h5>\n                  Heading\n                </h5>\n              </ic-typography>\n              <ic-typography variant=\"body\">\n                <p>\n                  toast message\n                </p>\n              </ic-typography>\n            </div>\n          </div>\n          <ic-button appearance=\"light\" id=\"dismiss-button\" aria-label=\"dismiss\" variant=\"icon\">\n            svg\n          </ic-button>\n        </div>\n      </mock:shadow-root>\n    </ic-toast>`);\n  });\n\n  it(\"should render a variant icon and banner when a variant is supplied\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" variant=\"success\"></ic-toast>`,\n    });\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    expect(page.root)\n      .toEqualHtml(`<ic-toast aria-label=\"Success\" aria-description=\"Heading\" heading=\"Heading\" role=\"dialog\" variant=\"success\">\n      <mock:shadow-root>\n        <div class=\"container\">\n          <div class=\"toast-icon-container\">\n            <div class=\"divider divider-success\"></div>\n            <span class=\"toast-icon\">\n              svg\n            </span>\n          </div>\n          <div class=\"toast-content\">\n            <div class=\"toast-message\">\n              <ic-typography variant=\"subtitle-large\">\n                <h5>\n                  Heading\n                </h5>\n              </ic-typography>\n            </div>\n          </div>\n          <ic-button appearance=\"light\" id=\"dismiss-button\" aria-label=\"dismiss\" variant=\"icon\">\n            svg\n          </ic-button>\n        </div>\n      </mock:shadow-root>\n    </ic-toast>`);\n  });\n\n  it(\"should render a loading indicator instead of a dismiss button when dismissMode is automatic\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" dismiss-mode=\"automatic\"></ic-toast>`,\n    });\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    expect(page.root)\n      .toEqualHtml(`<ic-toast heading=\"Heading\" role=\"alert\" aria-live=\"polite\" dismiss-mode=\"automatic\">\n      <mock:shadow-root>\n        <div class=\"container\">\n          <div class=\"toast-content\">\n            <div class=\"toast-message\">\n              <ic-typography variant=\"subtitle-large\">\n                <p>\n                  Heading\n                </p>\n              </ic-typography>\n            </div>\n          </div>\n          <ic-loading-indicator appearance=\"light\" class=\"toast-dismiss-timer\" progress=\"100\" size=\"icon\"></ic-loading-indicator>\n        </div>\n      </mock:shadow-root>\n    </ic-toast>`);\n  });\n\n  it(\"should display the toast when setVisible is ran\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Button],\n      html: `<ic-toast heading=\"Heading\"></ic-toast>`,\n    });\n\n    expect(page.root.classList.contains(\"hidden\")).toBeTruthy();\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n    expect(page.root.classList.contains(\"hidden\")).toBeFalsy();\n  });\n\n  it(\"should emit the icDismiss event when dismissed with by clicking the button\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Button],\n      html: `<ic-toast heading=\"Heading\"></ic-toast>`,\n    });\n\n    const callbackFn = jest.fn();\n    page.doc.addEventListener(\"icDismiss\", callbackFn);\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    const dismissButton = page.root.shadowRoot.querySelector(\"ic-button\");\n    dismissButton.click();\n    await page.waitForChanges();\n\n    expect(callbackFn).toHaveBeenCalled();\n  });\n\n  it(\"should emit the icDismiss event when dismissed with by pressing Escape\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Button],\n      html: `<ic-toast heading=\"Heading\"></ic-toast>`,\n    });\n\n    const callbackFn = jest.fn();\n    page.doc.addEventListener(\"icDismiss\", callbackFn);\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    const event = new KeyboardEvent(\"keydown\", { key: \"Escape\" });\n    page.rootInstance.handleKeyboard(event);\n    await page.waitForChanges();\n\n    expect(callbackFn).toHaveBeenCalled();\n  });\n\n  it(\"should emit icDismiss after the timer expires when an auto dismiss toast is made visible\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" dismiss-mode=\"automatic\"></ic-toast>`,\n    });\n\n    const callbackFn = jest.fn();\n    page.doc.addEventListener(\"icDismiss\", callbackFn);\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n    expect(callbackFn).not.toHaveBeenCalled();\n\n    await waitForTimeout(6000);\n    expect(callbackFn).toHaveBeenCalled();\n  });\n\n  it(\"should pause timer when mouse is hovered over, and resume when mouse leaves\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"Heading\" dismiss-mode=\"automatic\" auto-dismiss-timeout=\"10000\"></ic-toast>`,\n    });\n\n    const intervalCb = jest.spyOn(window, \"setInterval\");\n    const clearCb = jest.spyOn(window, \"clearInterval\");\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n\n    await waitForTimeout(3000);\n    expect(intervalCb).toHaveBeenCalledTimes(1);\n\n    page.rootInstance.handleTimer({ type: \"mouseenter\" });\n    await page.waitForChanges();\n    expect(clearCb).toHaveBeenCalled();\n\n    page.rootInstance.handleTimer({ type: \"mouseleave\" });\n    await page.waitForChanges();\n    await waitForTimeout(1000);\n    expect(intervalCb).toHaveBeenCalledTimes(2);\n    page.setContent(\"\");\n  });\n\n  it(\"should post a console error message if the message or header is too long\", async () => {\n    const longText =\n      \"lorem donec massa sapien faucibus et molestie ac feugiat sed lectus vestibulum mattis ullamcorper velit sed ullamcorper morbi tincidunt ornare massa eget egestas purus viverra accumsan in nisl nisi scelerisque eu ultrices vitae auctor eu augue ut lectus arcu bibendum at varius vel pharetra vel turpis nunc eget lorem dolor\";\n    const consoleCb = jest\n      .spyOn(console, \"error\")\n      .mockImplementation(jest.fn());\n    await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast heading=\"${longText}\" message=\"${longText}\"></ic-toast>`,\n    });\n    expect(consoleCb).toHaveBeenCalledTimes(1);\n  });\n\n  it(\"should only focus the two interactive elements in the manual toast when using tab\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Button],\n      html: `<ic-toast heading=\"Heading\"><ic-button id=\"slottedButton\" slot=\"action\">Click me</ic-button></ic-toast>`,\n    });\n    const focusCallback = jest.spyOn(Button.prototype, \"setFocus\");\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n    await waitForTimeout(300);\n    expect(focusCallback).toHaveBeenCalledTimes(1);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: false,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(2);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: false,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(3);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: false,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(4);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: true,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(5);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: true,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(6);\n\n    page.rootInstance.handleKeyboard({\n      key: \"Tab\",\n      shiftKey: true,\n      preventDefault: (): void => null,\n    });\n    await page.waitForChanges();\n    expect(focusCallback).toHaveBeenCalledTimes(7);\n  });\n\n  it(\"should focus a link element that has been slotted into the action slot\", async () => {\n    const page = await newSpecPage({\n      components: [Toast, Link],\n      html: `<ic-toast heading=\"Heading\"><ic-link href=\"/\" slot=\"action\">Text</ic-link></ic-toast>`,\n    });\n    const focusCallback = jest.spyOn(Link.prototype, \"setFocus\");\n\n    page.rootInstance.setVisible();\n    await page.waitForChanges();\n    await waitForTimeout(300);\n    expect(focusCallback).toHaveBeenCalledTimes(1);\n  });\n\n  it(\"should update the dialog's label if the prop neutralIconAriaLabel prop is provided\", async () => {\n    const page = await newSpecPage({\n      components: [Toast],\n      html: `<ic-toast variant=\"neutral\" neutral-icon-aria-label=\"Hello World\" heading=\"Heading\"></ic-toast>`,\n    });\n\n    expect(page.root.getAttribute(\"aria-label\")).toBe(\"Hello World\");\n  });\n});\n"]}