@ukic/web-components 2.35.2 → 3.0.0-alpha.10

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

@@ -5,6 +5,7 @@ const defaultArgs = {
   maxLines: 3,
   placement: "bottom",
   label: "This is a description of the button",
+  theme: "inherit",
 };
 
 export default {
@@ -317,6 +318,7 @@ export const Playground = {
         disable-hover=${args.disableHover}
         id="ic-tooltip-test-button-default"
         target="button-id"
+        theme=${args.theme}
       >
         <button
           id="button-id"
@@ -350,6 +352,14 @@ export const Playground = {
         type: "select",
       },
     },
+
+    theme: {
+      options: ["inherit", "light", "dark"],
+
+      control: {
+        type: "inline-radio",
+      },
+    },
   },
 
   name: "Playground",

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

@@ -13,6 +13,20 @@ describe("ic-tooltip component", () => {
         });
         expect(page.root).toMatchSnapshot(`ic-tooltip-render`);
     });
+    it("should test dark theme", async () => {
+        const page = await newSpecPage({
+            components: [Tooltip],
+            html: `<ic-tooltip theme="dark" label="tooltip"</ic-tooltip>`,
+        });
+        expect(page.root).toMatchSnapshot();
+    });
+    it("should test light theme", async () => {
+        const page = await newSpecPage({
+            components: [Typography],
+            html: `<ic-tooltip theme="light" label="tooltip"</ic-tooltip>`,
+        });
+        expect(page.root).toMatchSnapshot();
+    });
     it("should appear when triggered", async () => {
         const page = await newSpecPage({
             components: [Tooltip],

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

@@ -1 +1 @@
-{"version":3,"file":"ic-tooltip.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-tooltip/test/basic/ic-tooltip.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { waitForTimeout } from \"../../../../testspec.setup\";\nimport { Tooltip } from \"../../ic-tooltip\";\nimport { Typography } from \"../../../ic-typography/ic-typography\";\n\nbeforeAll(() => {\n  jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n});\n\ndescribe(\"ic-tooltip component\", () => {\n  it(\"should render\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip label=\"tooltip\"></ic-tooltip>`,\n    });\n\n    expect(page.root).toMatchSnapshot(`ic-tooltip-render`);\n  });\n\n  it(\"should appear when triggered\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n  });\n\n  it(\"should appear when triggered by click\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" disable-hover=true><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n  });\n\n  it(\"should disappear when triggered\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n\n    await page.rootInstance.hide(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n  });\n\n  it(\"should disappear on mouseleave\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n\n    await page.rootInstance.mouseLeaveTooltip(page.rootInstance.popperInstance);\n\n    await waitForTimeout(200);\n\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n  });\n\n  it(\"should remain when mouse remains on tooltip\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n\n    await page.rootInstance.mouseEnterTooltip();\n    await page.waitForChanges();\n\n    await page.rootInstance.checkCloseTooltip(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n  });\n\n  it(\"should close the tooltip on Escape keydown\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n\n    const body = window.document.body;\n\n    body.dispatchEvent(\n      new window.window.KeyboardEvent(\"keydown\", {\n        key: \"Escape\",\n        bubbles: true,\n        cancelable: true,\n      })\n    );\n\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n  });\n\n  it(\"should log warning to console and not render if label hasn't been set\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\"><button id=\"test-button\"></button></ic-tooltip>`,\n    });\n    jest.spyOn(console, \"warn\").mockImplementation();\n\n    await page.rootInstance.displayTooltip(true, true);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n    expect(console.warn).toBeCalledWith(\n      \"Tooltip can't display without prop 'label' set\"\n    );\n  });\n\n  it(\"should watch for label updates\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.label).toBe(\"tooltip\");\n\n    page.root.label = \"new tooltip\";\n\n    await page.waitForChanges();\n\n    expect(page.rootInstance.label).toBe(\"new tooltip\");\n\n    page.rootInstance.disconnectedCallback();\n  });\n\n  it(\"should open the tooltip using the displayTooltip method and should persist when persistTooltip is true\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.displayTooltip(true, true);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).not.toBeNull;\n\n    window.document.body.dispatchEvent(\n      new window.window.KeyboardEvent(\"keydown\", {\n        key: \"Escape\",\n        bubbles: true,\n        cancelable: true,\n      })\n    );\n\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).not.toBeNull;\n\n    await page.rootInstance.displayTooltip(false, false);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n  });\n\n  describe(\"getTooltipTranslate\", () => {\n    it(\"should update for bottom\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for bottom-start\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"bottom-start\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for bottom-end\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"bottom-end\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for top\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"top\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for top-start\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"top-start\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for top-end\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"top-end\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for left\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"left\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for left-end\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"left-end\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for right\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"right\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for right-end\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"right-end\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update when tooltip is outside of dialog\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"left\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      page.rootInstance.dialogOverflow = true;\n      await page.waitForChanges();\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n      expect(page.root.placement).toBe(\"right\");\n    });\n  });\n\n  it(\"should truncate text and pass the maxLines value to ic-typography if maxLines prop has been set\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip, Typography],\n      html: `<ic-tooltip target=\"test-button\" label=\"This is a body of text that is truncated to three lines within a tooltip. It has been truncated based on the max-lines property. The number of lines in the text is clamped to the number passed through the max-lines property.\" max-lines=\"2\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.root).toMatchSnapshot();\n\n    const typographyEl = page.root.shadowRoot.querySelector(\n      \"div > ic-typography\"\n    ) as HTMLIcTypographyElement;\n    expect(typographyEl.maxLines).toEqual(2);\n  });\n});\n"]}
+{"version":3,"file":"ic-tooltip.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-tooltip/test/basic/ic-tooltip.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { waitForTimeout } from \"../../../../testspec.setup\";\nimport { Tooltip } from \"../../ic-tooltip\";\nimport { Typography } from \"../../../ic-typography/ic-typography\";\n\nbeforeAll(() => {\n  jest.spyOn(console, \"error\").mockImplementation(jest.fn());\n});\n\ndescribe(\"ic-tooltip component\", () => {\n  it(\"should render\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip label=\"tooltip\"></ic-tooltip>`,\n    });\n\n    expect(page.root).toMatchSnapshot(`ic-tooltip-render`);\n  });\n\n  it(\"should test dark theme\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip theme=\"dark\" label=\"tooltip\"</ic-tooltip>`,\n    });\n\n    expect(page.root).toMatchSnapshot();\n  });\n\n  it(\"should test light theme\", async () => {\n    const page = await newSpecPage({\n      components: [Typography],\n      html: `<ic-tooltip theme=\"light\" label=\"tooltip\"</ic-tooltip>`,\n    });\n\n    expect(page.root).toMatchSnapshot();\n  });\n\n  it(\"should appear when triggered\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n  });\n\n  it(\"should appear when triggered by click\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" disable-hover=true><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n  });\n\n  it(\"should disappear when triggered\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n\n    await page.rootInstance.hide(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n  });\n\n  it(\"should disappear on mouseleave\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n\n    await page.rootInstance.mouseLeaveTooltip(page.rootInstance.popperInstance);\n\n    await waitForTimeout(200);\n\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n  });\n\n  it(\"should remain when mouse remains on tooltip\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n\n    await page.rootInstance.mouseEnterTooltip();\n    await page.waitForChanges();\n\n    await page.rootInstance.checkCloseTooltip(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n  });\n\n  it(\"should close the tooltip on Escape keydown\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.show(page.rootInstance.popperInstance);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBe(\"\");\n\n    const body = window.document.body;\n\n    body.dispatchEvent(\n      new window.window.KeyboardEvent(\"keydown\", {\n        key: \"Escape\",\n        bubbles: true,\n        cancelable: true,\n      })\n    );\n\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n  });\n\n  it(\"should log warning to console and not render if label hasn't been set\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\"><button id=\"test-button\"></button></ic-tooltip>`,\n    });\n    jest.spyOn(console, \"warn\").mockImplementation();\n\n    await page.rootInstance.displayTooltip(true, true);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n    expect(console.warn).toBeCalledWith(\n      \"Tooltip can't display without prop 'label' set\"\n    );\n  });\n\n  it(\"should watch for label updates\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.label).toBe(\"tooltip\");\n\n    page.root.label = \"new tooltip\";\n\n    await page.waitForChanges();\n\n    expect(page.rootInstance.label).toBe(\"new tooltip\");\n\n    page.rootInstance.disconnectedCallback();\n  });\n\n  it(\"should open the tooltip using the displayTooltip method and should persist when persistTooltip is true\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip],\n      html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n\n    await page.rootInstance.displayTooltip(true, true);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).not.toBeNull;\n\n    window.document.body.dispatchEvent(\n      new window.window.KeyboardEvent(\"keydown\", {\n        key: \"Escape\",\n        bubbles: true,\n        cancelable: true,\n      })\n    );\n\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).not.toBeNull;\n\n    await page.rootInstance.displayTooltip(false, false);\n    await page.waitForChanges();\n\n    expect(page.rootInstance.toolTip.getAttribute(\"data-show\")).toBeNull;\n  });\n\n  describe(\"getTooltipTranslate\", () => {\n    it(\"should update for bottom\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for bottom-start\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"bottom-start\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for bottom-end\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"bottom-end\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for top\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"top\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for top-start\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"top-start\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for top-end\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"top-end\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for left\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"left\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for left-end\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"left-end\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for right\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"right\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update for right-end\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"right-end\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n    });\n\n    it(\"should update when tooltip is outside of dialog\", async () => {\n      const page = await newSpecPage({\n        components: [Tooltip],\n        html: `<ic-tooltip target=\"test-button\" label=\"tooltip\" placement=\"left\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n      });\n\n      page.rootInstance.dialogOverflow = true;\n      await page.waitForChanges();\n\n      await page.rootInstance.getTooltipTranslate({\n        left: 0,\n        right: 40,\n        top: 100,\n        bottom: 132,\n      });\n      await page.waitForChanges();\n\n      expect(page.root).toMatchSnapshot();\n      expect(page.root.placement).toBe(\"right\");\n    });\n  });\n\n  it(\"should truncate text and pass the maxLines value to ic-typography if maxLines prop has been set\", async () => {\n    const page = await newSpecPage({\n      components: [Tooltip, Typography],\n      html: `<ic-tooltip target=\"test-button\" label=\"This is a body of text that is truncated to three lines within a tooltip. It has been truncated based on the max-lines property. The number of lines in the text is clamped to the number passed through the max-lines property.\" max-lines=\"2\"><button id=\"test-button\">Click</button></ic-tooltip>`,\n    });\n\n    expect(page.root).toMatchSnapshot();\n\n    const typographyEl = page.root.shadowRoot.querySelector(\n      \"div > ic-typography\"\n    ) as HTMLIcTypographyElement;\n    expect(typographyEl.maxLines).toEqual(2);\n  });\n});\n"]}

package/dist/collection/components/ic-top-navigation/ic-top-navigation.css

@@ -443,13 +443,42 @@ video {
 
 :host {
   display: block;
-  color: var(--ic-theme-text);
+  color: var(--ic-top-navigation-text);
   width: 100%;
   position: relative;
+
+  --ic-typography-color: var(--ic-top-navigation-text);
+
+  --ic-button-secondary-text-monochrome: var(--ic-brand-text-color);
+  --ic-button-secondary-border-monochrome: var(--ic-brand-text-color);
+}
+
+:host(.dark) {
+  color: var(--ic-color-text-primary-light);
+  --ic-typography-color: var(--ic-color-text-primary-light);
+  --ic-top-navigation-logo: var(--ic-color-icon-neutral);
+  --ic-top-navigation-icon: var(--ic-color-icon-neutral);
+  --ic-top-navigation-theme: var(--ic-color-icon-neutral);
+  --ic-top-navigation-status-tag: var(--ic-color-background-primary-dark);
+  --ic-top-navigation-status-tag-text: var(--ic-color-brand-text);
+  --ic-top-navigation-status-tag-secondary: var(--ic-state-layer-darken-10);
+  --navigation-link-colour: var(--ic-color-text-primary-light);
+}
+
+:host ::slotted(ic-navigation-item) {
+  --navigation-link-colour: var(--ic-top-navigation-text);
+}
+
+:host(.dark) ::slotted(ic-navigation-button) {
+  --ic-button-icon-monochrome: var(--ic-color-text-primary-light);
+}
+
+::slotted(ic-navigation-button) {
+  --ic-button-icon-monochrome: white;
 }
 
 :host .top-navigation {
-  background-color: var(--ic-theme-primary);
+  background-color: var(--ic-top-navigation-background);
   height: -moz-max-content;
   height: max-content;
 }
@@ -472,17 +501,17 @@ video {
 :host .title-link ::slotted(a),
 :host .title-link:visited ::slotted(a),
 :host .title-link:active ::slotted(a) {
-  color: var(--ic-theme-text);
+  color: var(--ic-top-navigation-icon-and-label);
   text-decoration: none;
   outline: none;
 }
 
 :host .title-link:hover:not(:focus) {
-  background-color: var(--ic-theme-hover);
+  background-color: var(--ic-top-navigation-title-hover);
 }
 
 :host .title-link:active:not(:focus) {
-  background-color: var(--ic-theme-active);
+  background-color: var(--ic-top-navigation-title-pressed);
 }
 
 :host .title-link:hover {
@@ -501,7 +530,7 @@ video {
 }
 
 :host .nav-panel-container {
-  border-top: var(--ic-keyline-lighten);
+  border-top: var(--ic-space-1px) solid var(--ic-top-navigation-keyline);
   padding: 0 var(--ic-space-lg);
   margin-left: calc(-1 * var(--section-container-margin));
   margin-right: calc(-1 * var(--section-container-margin));
@@ -509,7 +538,7 @@ video {
 }
 
 :host(.dark) .nav-panel-container {
-  border-top: var(--ic-keyline-darken);
+  border-top: var(--ic-border-keyline-darken);
 }
 
 .top-panel-container {
@@ -554,8 +583,9 @@ video {
 
 :host .app-status {
   border-radius: var(--ic-space-md);
-  background-color: var(--ic-architectural-white);
-  color: var(--ic-color-primary-text);
+  background-color: var(--ic-top-navigation-status-tag);
+  color: var(--ic-top-navigation-status-tag-text);
+  --ic-typography-color: var(--ic-top-navigation-status-tag-text);
   padding: var(--ic-space-xxs) var(--ic-space-lg);
   margin-left: var(--ic-space-md);
   flex: 1 1 0;
@@ -563,14 +593,10 @@ video {
   max-width: fit-content;
 }
 
-:host(.dark) .app-status {
-  background-color: var(--ic-theme-text);
-  color: var(--ic-color-white-text);
-}
-
 :host .app-version {
   border-radius: var(--ic-space-md);
-  background-color: var(--ic-theme-active);
+  background-color: var(--ic-top-navigation-status-tag-secondary);
+  color: var(--ic-top-navigation-status-tag);
   padding: var(--ic-space-xxs) var(--ic-space-sm);
   margin-left: var(--ic-space-xs);
   flex: 1 1 0;
@@ -579,13 +605,13 @@ video {
 }
 
 slot[name="app-icon"]::slotted(*) {
-  fill: var(--ic-theme-text);
+  fill: var(--ic-top-navigation-logo);
   width: 2em;
   height: 2em;
 }
 
 slot[name="toggle-icon"] svg {
-  fill: var(--ic-theme-text);
+  fill: var(--ic-top-navigation-icon);
 }
 
 .search-menu-container {
@@ -671,7 +697,7 @@ slot[name="toggle-icon"] svg {
   display: flex;
   justify-content: center;
   align-items: center;
-  border-top: var(--ic-keyline-darken);
+  border-top: var(--ic-border-keyline-darken);
   height: 4rem;
   padding-left: var(--ic-space-md);
   padding-right: var(--ic-space-md);
@@ -716,12 +742,12 @@ slot[name="toggle-icon"] svg {
 
 @media (forced-colors: active) {
   :host .top-navigation {
-    border-bottom: var(--ic-hc-border);
+    border-bottom: var(--ic-border-hc);
   }
 
   .app-status,
   .app-version {
-    border: var(--ic-hc-border);
+    border: var(--ic-border-hc);
   }
 
   slot[name="app-icon"]::slotted(*) {

package/dist/collection/components/ic-top-navigation/ic-top-navigation.js

@@ -1,6 +1,6 @@
 import { Host, h, } from "@stencil/core";
-import { IcThemeForegroundEnum, } from "../../utils/types";
-import { checkResizeObserver, DEVICE_SIZES, getCurrentDeviceSize, getThemeForegroundColor, getSlot, onComponentPropUndefinedChange, onComponentRequiredPropUndefined, isSlotUsed, isEmptyString, isPropDefined, } from "../../utils/helpers";
+import { IcBrandForegroundEnum, } from "../../utils/types";
+import { checkResizeObserver, DEVICE_SIZES, getCurrentDeviceSize, getBrandForegroundAppearance, getSlot, onComponentPropUndefinedChange, onComponentRequiredPropUndefined, isSlotUsed, isEmptyString, isPropDefined, } from "../../utils/helpers";
 /**
  * @slot app-icon - Content will be rendered to left of app title. Anything that is slotted here will be hidden from screen readers.
  * @slot app-title - Handle routing by nesting a route in the app title.
@@ -57,7 +57,7 @@ export class TopNavigation {
                         this.toggleSearchBar();
                     }
                 }
-                this.topNavResized.emit({
+                this.icTopNavResized.emit({
                     size: currSize,
                 });
                 if (this.searchBar && document.activeElement === this.searchBar) {
@@ -77,7 +77,7 @@ export class TopNavigation {
             this.resizeObserver.observe(this.el);
         };
         this.deviceSize = DEVICE_SIZES.XL;
-        this.foregroundColor = getThemeForegroundColor();
+        this.foregroundColor = getBrandForegroundAppearance();
         this.hasFullWidthSearchBar = false;
         this.mobileSearchBarVisible = false;
         this.mobileSearchHiddenOnBlur = false;
@@ -90,6 +90,7 @@ export class TopNavigation {
         this.inline = false;
         this.shortAppTitle = "";
         this.status = "";
+        this.theme = "inherit";
         this.version = "";
         this.appTitle = undefined;
     }
@@ -131,7 +132,7 @@ export class TopNavigation {
     searchValueChangeHandler({ detail }) {
         this.searchValue = detail.value;
     }
-    themeChangeHandler({ detail }) {
+    brandChangeHandler({ detail }) {
         this.foregroundColor = detail.mode;
     }
     toggleSearchBar() {
@@ -154,11 +155,11 @@ export class TopNavigation {
         document.body.style.overflow = show ? "hidden" : "auto";
     }
     render() {
-        const { appTitle, contentAligned, customMobileBreakpoint, deviceSize, el, foregroundColor, hasAppIcon, hasFullWidthSearchBar, hasIconButtons, hasNavigation, hasSearchSlotContent, href, inline, menuButtonClick, mobileSearchBarVisible, navMenuVisible, searchButtonClickHandler, searchButtonMouseDownHandler, shortAppTitle, status, version, } = this;
+        const { appTitle, contentAligned, customMobileBreakpoint, deviceSize, el, foregroundColor, hasAppIcon, hasFullWidthSearchBar, hasIconButtons, hasNavigation, hasSearchSlotContent, href, inline, menuButtonClick, mobileSearchBarVisible, navMenuVisible, searchButtonClickHandler, searchButtonMouseDownHandler, shortAppTitle, status, version, theme, } = this;
         const hasStatus = status !== "";
         const hasVersion = version !== "";
         const hasMenuContent = hasNavigation || hasIconButtons || hasStatus || hasVersion;
-        const searchButtonSize = deviceSize <= DEVICE_SIZES.S ? "default" : "large";
+        const searchButtonSize = deviceSize <= DEVICE_SIZES.S ? "medium" : "large";
         const hasTitle = appTitle !== "" && isPropDefined(appTitle);
         const overMobileBreakpoint = deviceSize <= customMobileBreakpoint;
         const appTitleVariant = overMobileBreakpoint
@@ -167,7 +168,7 @@ export class TopNavigation {
                 : "h4"
             : "h3";
         const mobileSearchButtonTitle = `${mobileSearchBarVisible ? "Hide" : "Show"} search`;
-        const menuSize = deviceSize <= DEVICE_SIZES.S ? "small" : "default";
+        const menuSize = deviceSize <= DEVICE_SIZES.S ? "small" : "medium";
         const shortAppTitleSlot = isSlotUsed(el, "short-app-title");
         const hasAppTitleSlot = isSlotUsed(el, "app-title");
         const Component = hasAppTitleSlot ? "div" : "a";
@@ -177,10 +178,15 @@ export class TopNavigation {
         return (h(Host, { class: {
                 "fullwidth-searchbar": hasFullWidthSearchBar,
                 "mobile-mode": overMobileBreakpoint,
-                [IcThemeForegroundEnum.Dark]: foregroundColor === IcThemeForegroundEnum.Dark,
+                [IcBrandForegroundEnum.Dark]: foregroundColor === IcBrandForegroundEnum.Dark,
+                [`ic-theme-${theme}`]: theme !== "inherit",
             } }, h("div", { class: "top-navigation" }, h("ic-section-container", { aligned: contentAligned, "full-height": true }, h("header", { role: "banner" }, h("div", { class: "top-panel-container" }, h("div", { class: "app-details-container" }, (hasTitle || hasAppTitleSlot) && (h(Component, Object.assign({ class: "title-link" }, attrs), hasAppIcon && (h("div", { class: "app-icon-container" }, h("slot", { name: "app-icon" }))), deviceSize <= DEVICE_SIZES.S &&
             (!isEmptyString(shortAppTitle) || shortAppTitleSlot) ? (h("ic-typography", { variant: "subtitle-small", "aria-label": (!hasAppTitleSlot || !shortAppTitleSlot) &&
-                `${appTitle} (${shortAppTitle})` }, h("h1", null, shortAppTitleSlot ? (h("slot", { name: "short-app-title" })) : (shortAppTitle)))) : (h("ic-typography", { variant: appTitleVariant }, h("h1", { class: "title-wrap" }, hasAppTitleSlot ? (h("slot", { name: "app-title" })) : (appTitle)))))), hasStatus && (h("div", { class: "app-status" }, h("ic-typography", { "aria-label": "app tag", variant: "label-uppercase", class: "app-status-text" }, status))), hasVersion && (h("div", { class: "app-version" }, h("ic-typography", { variant: "label", class: "app-version-text", "aria-label": "app version" }, version)))), (hasSearchSlotContent || hasMenuContent) && (h("div", { class: "search-menu-container" }, h("div", { class: "search-actions-container" }, !overMobileBreakpoint && h("slot", { name: "search" }), hasSearchSlotContent && overMobileBreakpoint && (h("ic-button", { id: "search-toggle-button", ref: (el) => (this.mobileSearchButtonEl = el), onMouseDown: searchButtonMouseDownHandler, variant: "icon", size: searchButtonSize, "aria-label": mobileSearchButtonTitle, appearance: foregroundColor, onClick: searchButtonClickHandler }, h("slot", { name: "toggle-icon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "#ffffff" }, h("path", { d: "M0 0h24v24H0V0z", fill: "none" }), h("path", { d: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" }))))), hasIconButtons && !overMobileBreakpoint && (h("div", { class: "icon-buttons-container" }, h("slot", { name: "buttons" }))), hasMenuContent && overMobileBreakpoint && (h("div", { class: "menu-button-container" }, h("span", { id: "navigation-landmark-button-text", class: "navigation-landmark-button-text", "aria-hidden": "true" }, "Main navigation button"), h("nav", { "aria-labelledby": "navigation-landmark-button-text", "aria-hidden": `${navMenuVisible}` }, h("ic-button", { id: "menu-button", appearance: foregroundColor, variant: "secondary", "aria-expanded": "false", "aria-haspopup": "true", "aria-label": `Open ${hasNavigation ? "navigation" : "app"} menu`, size: menuSize, onClick: menuButtonClick }, "Menu", h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#ffffff", slot: "icon" }, h("path", { d: "M0 0h24v24H0V0z", fill: "none" }), h("path", { d: "M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" })))))))))), mobileSearchBarVisible && (h("div", { class: "search-bar-container" }, h("slot", { name: "search" }))), hasNavigation && !overMobileBreakpoint && (h("div", { class: "navigation-tabs" }, h("span", { id: "navigation-landmark-text", class: "navigation-landmark-text", "aria-hidden": "true" }, "Main pages"), h("nav", { "aria-labelledby": "navigation-landmark-text", class: "nav-panel-container" }, h("ic-horizontal-scroll", { appearance: foregroundColor }, h("ul", { class: "navigation-item-list", tabindex: "-1" }, h("slot", { name: "navigation" }))))))))), navMenuVisible && (h("ic-navigation-menu", { version: version, status: status, class: {
+                `${appTitle} (${shortAppTitle})` }, h("h1", null, shortAppTitleSlot ? (h("slot", { name: "short-app-title" })) : (shortAppTitle)))) : (h("ic-typography", { variant: appTitleVariant }, h("h1", { class: "title-wrap" }, hasAppTitleSlot ? (h("slot", { name: "app-title" })) : (appTitle)))))), hasStatus && (h("div", { class: "app-status" }, h("ic-typography", { "aria-label": "app tag", variant: "label-uppercase", class: "app-status-text" }, status))), hasVersion && (h("div", { class: "app-version" }, h("ic-typography", { variant: "label", class: "app-version-text", "aria-label": "app version" }, version)))), (hasSearchSlotContent || hasMenuContent) && (h("div", { class: "search-menu-container" }, h("div", { class: "search-actions-container" }, !overMobileBreakpoint && h("slot", { name: "search" }), hasSearchSlotContent && overMobileBreakpoint && (h("ic-button", { id: "search-toggle-button", ref: (el) => (this.mobileSearchButtonEl = el), onMouseDown: searchButtonMouseDownHandler, variant: "icon-tertiary", monochrome: true, size: searchButtonSize, "aria-label": mobileSearchButtonTitle, theme: foregroundColor == IcBrandForegroundEnum.Light
+                ? IcBrandForegroundEnum.Dark
+                : IcBrandForegroundEnum.Light, onClick: searchButtonClickHandler }, h("slot", { name: "toggle-icon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "#ffffff" }, h("path", { d: "M0 0h24v24H0V0z", fill: "none" }), h("path", { d: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z" }))))), hasIconButtons && !overMobileBreakpoint && (h("div", { class: "icon-buttons-container" }, h("slot", { name: "buttons" }))), hasMenuContent && overMobileBreakpoint && (h("div", { class: "menu-button-container" }, h("span", { id: "navigation-landmark-button-text", class: "navigation-landmark-button-text", "aria-hidden": "true" }, "Main navigation button"), h("nav", { "aria-labelledby": "navigation-landmark-button-text", "aria-hidden": `${navMenuVisible}` }, h("ic-button", { id: "menu-button", theme: foregroundColor == IcBrandForegroundEnum.Light
+                ? IcBrandForegroundEnum.Dark
+                : IcBrandForegroundEnum.Light, variant: "secondary", monochrome: true, "aria-expanded": "false", "aria-haspopup": "true", "aria-label": `Open ${hasNavigation ? "navigation" : "app"} menu`, size: menuSize, onClick: menuButtonClick }, "Menu", h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#ffffff", slot: "left-icon" }, h("path", { d: "M0 0h24v24H0V0z", fill: "none" }), h("path", { d: "M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" })))))))))), mobileSearchBarVisible && (h("div", { class: "search-bar-container" }, h("slot", { name: "search" }))), hasNavigation && !overMobileBreakpoint && (h("div", { class: "navigation-tabs" }, h("span", { id: "navigation-landmark-text", class: "navigation-landmark-text", "aria-hidden": "true" }, "Main pages"), h("nav", { "aria-labelledby": "navigation-landmark-text", class: "nav-panel-container" }, h("ic-horizontal-scroll", { monochrome: true, appearance: foregroundColor }, h("ul", { class: "navigation-item-list", tabindex: "-1" }, h("slot", { name: "navigation" }))))))))), navMenuVisible && (h("ic-navigation-menu", { version: version, status: status, class: {
                 ["inline"]: inline,
             } }, hasIconButtons && (h("div", { class: "menu-buttons-slot", slot: "buttons" }, h("slot", { name: "buttons" }))), h("ul", { slot: "navigation" }, h("slot", { name: "navigation" }))))));
     }
@@ -318,6 +324,30 @@ export class TopNavigation {
                 "reflect": false,
                 "defaultValue": "\"\""
             },
+            "theme": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "IcThemeMode",
+                    "resolved": "\"dark\" | \"inherit\" | \"light\"",
+                    "references": {
+                        "IcThemeMode": {
+                            "location": "import",
+                            "path": "../../utils/types",
+                            "id": "src/utils/types.ts::IcThemeMode"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component."
+                },
+                "attribute": "theme",
+                "reflect": false,
+                "defaultValue": "\"inherit\""
+            },
             "version": {
                 "type": "string",
                 "mutable": false,
@@ -405,8 +435,8 @@ export class TopNavigation {
                     "references": {}
                 }
             }, {
-                "method": "topNavResized",
-                "name": "topNavResized",
+                "method": "icTopNavResized",
+                "name": "icTopNavResized",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
@@ -448,8 +478,8 @@ export class TopNavigation {
                 "capture": false,
                 "passive": false
             }, {
-                "name": "themeChange",
-                "method": "themeChangeHandler",
+                "name": "brandChange",
+                "method": "brandChangeHandler",
                 "target": "document",
                 "capture": false,
                 "passive": false