@ukic/web-components 2.8.0 → 2.9.0

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

@@ -1 +1 @@
-{"version":3,"file":"ic-badge.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-badge/test/basic/ic-badge.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { Badge } from \"../../ic-badge\";\nimport { Button } from \"../../../ic-button/ic-button\";\nimport { Chip } from \"../../../ic-chip/ic-chip\";\nimport { Tab } from \"../../../ic-tab/ic-tab\";\nimport { Card } from \"../../../ic-card/ic-card\";\nimport { NavigationButton } from \"../../../ic-navigation-button/ic-navigation-button\";\nimport { NavigationItem } from \"../../../ic-navigation-item/ic-navigation-item\";\n\ndescribe(\"ic-badge\", () => {\n  it(\"should render with text slotted in a button\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render with text slotted in a button\"\n    );\n  });\n\n  it(\"should render light variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"light\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render light variant\");\n  });\n\n  it(\"should render error variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"error\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render error variant\");\n  });\n\n  it(\"should render success variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"success\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render success variant\");\n  });\n\n  it(\"should render warning variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"warning\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render warning variant\");\n  });\n  it(\"should render info variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"info\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render info variant\");\n  });\n\n  it(\"should render custom variant with custom colour in hex\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"custom\" text-label=\"1\" custom-color=\"#F8C8DC\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render custom variant with custom colour in hex\"\n    );\n  });\n\n  it(\"should render custom variant with custom colour in rgb\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"custom\" text-label=\"1\" custom-color=\"rgb(248,200,220)\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render custom variant with custom colour in rgb\"\n    );\n  });\n\n  it(\"should render with max number prop set\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"100\" max-number=\"9\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with max number prop set\");\n  });\n\n  it(\"should render with accessible label\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"1\" accessible-label=\"1 notification found\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with accessible label\");\n  });\n\n  it(\"should render size small\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"100\" size=\"small\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render size small\");\n  });\n\n  it(\"should render size large\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"100\" size=\"large\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render size large\");\n  });\n\n  it(\"should render type dot\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" type=\"dot\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render type dot\");\n  });\n\n  it(\"should render type icon\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" type=\"icon\">\n            <svg slot='badge-icon' xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\">\n            <path d=\"M0 0h24v24H0V0z\" fill=\"none\"/>\n            <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\"/>\n            </svg>\n            </ic-badge></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render type icon\");\n  });\n\n  it(\"should render with visible false\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" visible=\"false\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with visible false\");\n  });\n\n  it(\"should render slotted in a chip\", async () => {\n    const page = await newSpecPage({\n      components: [Chip, Badge],\n      html: `<ic-chip label=\"Badge\"><ic-badge slot=\"badge\" text-label=\"1\" position=\"near\"/></ic-chip>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render slotted in a chip\");\n  });\n\n  it(\"should render slotted in a tab\", async () => {\n    const page = await newSpecPage({\n      components: [Tab, Badge],\n      html: `<ic-tab>Tab<ic-badge slot=\"badge\" text-label=\"1\" position=\"inline\"/></ic-tab>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render slotted in a tab\");\n  });\n\n  it(\"should render slotted in a card\", async () => {\n    const page = await newSpecPage({\n      components: [Card, Badge],\n      html: `<ic-card heading=\"Badge\"><ic-badge slot=\"badge\" text-label=\"1\" position=\"near\"/></ic-card>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render slotted in a card\");\n  });\n\n  it(\"should render slotted in a navigation button\", async () => {\n    const page = await newSpecPage({\n      components: [NavigationButton, Badge],\n      html: `<ic-navigation-button\n      label=\"Button One\"\n      slot=\"buttons\"\n      href=\"https://www.google.com\"\n      target=\"_blank\"\n      title=\"Google 1\"\n    >\n      <svg\n        slot=\"icon\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        height=\"24px\"\n        viewBox=\"0 0 24 24\"\n        width=\"24px\"\n        fill=\"#000000\"\n      >\n        <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n        <path\n          d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-5.5-2.5l7.51-3.49L17.5 6.5 9.99 9.99 6.5 17.5zm5.5-6.6c.61 0 1.1.49 1.1 1.1s-.49 1.1-1.1 1.1-1.1-.49-1.1-1.1.49-1.1 1.1-1.1z\"\n        />\n      </svg>\n      <ic-badge\n        text-label=\"1\"\n        slot=\"badge\"\n        position=\"near\"\n        variant=\"light\"\n      ></ic-badge>\n    </ic-navigation-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render slotted in a navigation button\"\n    );\n  });\n\n  it(\"should render slotted in a navigation item\", async () => {\n    const page = await newSpecPage({\n      components: [NavigationItem, Badge],\n      html: `<ic-navigation-item label=\"Navigation\" href=\"/\">\n      <ic-badge\n        text-label=\"1\"\n        slot=\"badge\"\n        variant=\"light\"\n        position=\"far\"\n      ></ic-badge>\n      <svg\n        slot=\"icon\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          d=\"M23 8C23 9.1 22.1 10 21 10C20.82 10 20.65 9.98 20.49 9.93L16.93 13.48C16.98 13.64 17 13.82 17 14C17 15.1 16.1 16 15 16C13.9 16 13 15.1 13 14C13 13.82 13.02 13.64 13.07 13.48L10.52 10.93C10.36 10.98 10.18 11 10 11C9.82 11 9.64 10.98 9.48 10.93L4.93 15.49C4.98 15.65 5 15.82 5 16C5 17.1 4.1 18 3 18C1.9 18 1 17.1 1 16C1 14.9 1.9 14 3 14C3.18 14 3.35 14.02 3.51 14.07L8.07 9.52C8.02 9.36 8 9.18 8 9C8 7.9 8.9 7 10 7C11.1 7 12 7.9 12 9C12 9.18 11.98 9.36 11.93 9.52L14.48 12.07C14.64 12.02 14.82 12 15 12C15.18 12 15.36 12.02 15.52 12.07L19.07 8.51C19.02 8.35 19 8.18 19 8C19 6.9 19.9 6 21 6C22.1 6 23 6.9 23 8Z\"\n          fill=\"currentColor\"\n        />\n      </svg>\n    </ic-navigation-item>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render slotted in a navigation item\"\n    );\n  });\n\n  it(\"should hide and show the badge using visible prop\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"1\"/></ic-button>`,\n    });\n\n    const badge = document.querySelector(\"ic-badge\");\n\n    expect(page.rootInstance.visible).toBe(true);\n\n    badge.visible = false;\n    await page.waitForChanges();\n\n    expect(page.rootInstance.visible).toBe(false);\n\n    badge.visible = true;\n    await page.waitForChanges();\n\n    expect(page.rootInstance.visible).toBe(true);\n  });\n\n  //To be removed when we remove show and hide methods\n  it(\"should hide and show the badge using methods\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"1\"/></ic-button>`,\n    });\n\n    const badge = document.querySelector(\"ic-badge\");\n\n    expect(page.rootInstance.visible).toBe(true);\n\n    await badge.hideBadge();\n    await page.waitForChanges();\n\n    expect(page.rootInstance.visible).toBe(false);\n\n    await badge.showBadge();\n    await page.waitForChanges();\n\n    expect(page.rootInstance.visible).toBe(true);\n  });\n\n  it(\"should set the correct badge colour\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"custom\" text-label=\"1\" custom-color=\"#F8C8DC\"/></ic-button>`,\n    });\n\n    await page.rootInstance.setBadgeColour();\n\n    expect(page.rootInstance.customColorRGBA).toEqual({\n      a: 1,\n      b: 220,\n      g: 200,\n      r: 248,\n    });\n  });\n\n  it(\"should set the correct foreground colour\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"custom\" text-label=\"1\" custom-color=\"#F8C8DC\"/></ic-button>`,\n    });\n\n    await page.rootInstance.getBadgeForeground();\n\n    expect(page.rootInstance.foregroundColour).toBe(\"dark\");\n  });\n\n  it(\"should set the correct text label when max number is set\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"100\" max-number=\"9\"/></ic-button>`,\n    });\n\n    expect(page.rootInstance.getTextLabel()).toBe(\"9+\");\n  });\n});\n"]}
+{"version":3,"file":"ic-badge.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-badge/test/basic/ic-badge.spec.tsx"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { Badge } from \"../../ic-badge\";\nimport { Button } from \"../../../ic-button/ic-button\";\nimport { Chip } from \"../../../ic-chip/ic-chip\";\nimport { Tab } from \"../../../ic-tab/ic-tab\";\nimport { Card } from \"../../../ic-card/ic-card\";\nimport { NavigationButton } from \"../../../ic-navigation-button/ic-navigation-button\";\nimport { NavigationItem } from \"../../../ic-navigation-item/ic-navigation-item\";\n\ndescribe(\"ic-badge\", () => {\n  it(\"should render with text slotted in a button\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render with text slotted in a button\"\n    );\n  });\n\n  it(\"should render light variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"light\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render light variant\");\n  });\n\n  it(\"should render error variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"error\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render error variant\");\n  });\n\n  it(\"should render success variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"success\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render success variant\");\n  });\n\n  it(\"should render warning variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"warning\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render warning variant\");\n  });\n  it(\"should render info variant\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"info\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render info variant\");\n  });\n\n  it(\"should render custom variant with custom colour in hex\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"custom\" text-label=\"1\" custom-color=\"#F8C8DC\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render custom variant with custom colour in hex\"\n    );\n  });\n\n  it(\"should render custom variant with custom colour in rgb\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"custom\" text-label=\"1\" custom-color=\"rgb(248,200,220)\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render custom variant with custom colour in rgb\"\n    );\n  });\n\n  it(\"should render with max number prop set\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"100\" max-number=\"9\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with max number prop set\");\n  });\n\n  it(\"should render with accessible label\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"1\" accessible-label=\"1 notification found\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with accessible label\");\n  });\n\n  it(\"should render size small\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"100\" size=\"small\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render size small\");\n  });\n\n  it(\"should render size large\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"100\" size=\"large\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render size large\");\n  });\n\n  it(\"should render type dot\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" type=\"dot\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render type dot\");\n  });\n\n  it(\"should render type icon\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" type=\"icon\">\n            <svg slot='badge-icon' xmlns=\"http://www.w3.org/2000/svg\" height=\"24px\" viewBox=\"0 0 24 24\" width=\"24px\" fill=\"#000000\">\n            <path d=\"M0 0h24v24H0V0z\" fill=\"none\"/>\n            <path d=\"M9 16.2L4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2z\"/>\n            </svg>\n            </ic-badge></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render type icon\");\n  });\n\n  it(\"should render with visible false\", async () => {\n    const page = await newSpecPage({\n      components: [Button, Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" visible=\"false\" text-label=\"1\"/></ic-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render with visible false\");\n  });\n\n  it(\"should render slotted in a chip\", async () => {\n    const page = await newSpecPage({\n      components: [Chip, Badge],\n      html: `<ic-chip label=\"Badge\"><ic-badge slot=\"badge\" text-label=\"1\" position=\"near\"/></ic-chip>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render slotted in a chip\");\n  });\n\n  it(\"should render slotted in a tab\", async () => {\n    const page = await newSpecPage({\n      components: [Tab, Badge],\n      html: `<ic-tab>Tab<ic-badge slot=\"badge\" text-label=\"1\" position=\"inline\"/></ic-tab>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render slotted in a tab\");\n  });\n\n  it(\"should render slotted in a card\", async () => {\n    const page = await newSpecPage({\n      components: [Card, Badge],\n      html: `<ic-card heading=\"Badge\"><ic-badge slot=\"badge\" text-label=\"1\" position=\"near\"/></ic-card>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\"should render slotted in a card\");\n  });\n\n  it(\"should render slotted in a navigation button\", async () => {\n    const page = await newSpecPage({\n      components: [NavigationButton, Badge],\n      html: `<ic-navigation-button\n      label=\"Button One\"\n      slot=\"buttons\"\n      href=\"https://www.google.com\"\n      target=\"_blank\"\n      title=\"Google 1\"\n    >\n      <svg\n        slot=\"icon\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n        height=\"24px\"\n        viewBox=\"0 0 24 24\"\n        width=\"24px\"\n        fill=\"#000000\"\n      >\n        <path d=\"M0 0h24v24H0V0z\" fill=\"none\" />\n        <path\n          d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm-5.5-2.5l7.51-3.49L17.5 6.5 9.99 9.99 6.5 17.5zm5.5-6.6c.61 0 1.1.49 1.1 1.1s-.49 1.1-1.1 1.1-1.1-.49-1.1-1.1.49-1.1 1.1-1.1z\"\n        />\n      </svg>\n      <ic-badge\n        text-label=\"1\"\n        slot=\"badge\"\n        position=\"near\"\n        variant=\"light\"\n      ></ic-badge>\n    </ic-navigation-button>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render slotted in a navigation button\"\n    );\n  });\n\n  it(\"should render slotted in a navigation item\", async () => {\n    const page = await newSpecPage({\n      components: [NavigationItem, Badge],\n      html: `<ic-navigation-item label=\"Navigation\" href=\"/\">\n      <ic-badge\n        text-label=\"1\"\n        slot=\"badge\"\n        variant=\"light\"\n        position=\"far\"\n      ></ic-badge>\n      <svg\n        slot=\"icon\"\n        width=\"24\"\n        height=\"24\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        xmlns=\"http://www.w3.org/2000/svg\"\n      >\n        <path\n          d=\"M23 8C23 9.1 22.1 10 21 10C20.82 10 20.65 9.98 20.49 9.93L16.93 13.48C16.98 13.64 17 13.82 17 14C17 15.1 16.1 16 15 16C13.9 16 13 15.1 13 14C13 13.82 13.02 13.64 13.07 13.48L10.52 10.93C10.36 10.98 10.18 11 10 11C9.82 11 9.64 10.98 9.48 10.93L4.93 15.49C4.98 15.65 5 15.82 5 16C5 17.1 4.1 18 3 18C1.9 18 1 17.1 1 16C1 14.9 1.9 14 3 14C3.18 14 3.35 14.02 3.51 14.07L8.07 9.52C8.02 9.36 8 9.18 8 9C8 7.9 8.9 7 10 7C11.1 7 12 7.9 12 9C12 9.18 11.98 9.36 11.93 9.52L14.48 12.07C14.64 12.02 14.82 12 15 12C15.18 12 15.36 12.02 15.52 12.07L19.07 8.51C19.02 8.35 19 8.18 19 8C19 6.9 19.9 6 21 6C22.1 6 23 6.9 23 8Z\"\n          fill=\"currentColor\"\n        />\n      </svg>\n    </ic-navigation-item>`,\n    });\n\n    expect(page.root).toMatchSnapshot(\n      \"should render slotted in a navigation item\"\n    );\n  });\n\n  it(\"should hide and show the badge using visible prop\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"1\"/></ic-button>`,\n    });\n\n    const badge = document.querySelector(\"ic-badge\");\n\n    expect(page.rootInstance.visible).toBe(true);\n\n    badge.visible = false;\n    await page.waitForChanges();\n\n    expect(page.rootInstance.visible).toBe(false);\n\n    badge.visible = true;\n    await page.waitForChanges();\n\n    expect(page.rootInstance.visible).toBe(true);\n  });\n\n  //To be removed when we remove show and hide methods\n  it(\"should hide and show the badge using methods\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"1\"/></ic-button>`,\n    });\n\n    const badge = document.querySelector(\"ic-badge\");\n\n    expect(page.rootInstance.visible).toBe(true);\n\n    await badge.hideBadge();\n    await page.waitForChanges();\n\n    expect(page.rootInstance.visible).toBe(false);\n\n    await badge.showBadge();\n    await page.waitForChanges();\n\n    expect(page.rootInstance.visible).toBe(true);\n  });\n\n  it(\"should set the correct badge colour\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"custom\" text-label=\"1\" custom-color=\"#F8C8DC\"/></ic-button>`,\n    });\n\n    await page.rootInstance.setBadgeColour();\n\n    expect(page.rootInstance.customColorRGBA).toEqual({\n      a: 1,\n      b: 220,\n      g: 200,\n      r: 248,\n    });\n  });\n\n  it(\"should set the correct foreground colour\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" variant=\"custom\" text-label=\"1\" custom-color=\"#F8C8DC\"/></ic-button>`,\n    });\n\n    await page.rootInstance.getBadgeForeground();\n\n    expect(page.rootInstance.foregroundColour).toBe(\"dark\");\n  });\n\n  it(\"should set the correct text label when max number is set\", async () => {\n    const page = await newSpecPage({\n      components: [Badge],\n      html: `<ic-button>Button<ic-badge slot=\"badge\" text-label=\"100\" max-number=\"9\"/></ic-button>`,\n    });\n\n    expect(page.rootInstance.getTextLabel()).toBe(\"9+\");\n  });\n});\n"]}

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

@@ -25,7 +25,7 @@
 }
 
 .back-icon svg {
-  color: var(--ic-hyperlink);
+  color: currentcolor;
 }
 
 :host(.back) {
@@ -49,6 +49,14 @@ ic-link {
   gap: var(--ic-space-xs);
 }
 
+:host([aria-current="page"]) .current-page-container.dark {
+  color: var(--ic-color-primary-text);
+}
+
+:host([aria-current="page"]) .current-page-container.light {
+  color: var(--ic-color-white-text);
+}
+
 :host(.collapsed-breadcrumb-wrapper) {
   margin-right: var(--ic-space-xs) !important;
   display: flex;

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

@@ -6,165 +6,194 @@ import { isPropDefined, isSlotUsed } from "../../utils/helpers";
  * @slot icon - Content will be rendered to the left of the breadcrumb page title.
  */
 export class Breadcrumb {
-  constructor() {
-    this.renderDefaultBreadcrumb = (current, pageTitle, describedById, href) => {
-      const hasPageTitle = pageTitle !== null && isPropDefined(pageTitle) && 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);
-          }
+    constructor() {
+        this.renderDefaultBreadcrumb = (current, pageTitle, describedById, href) => {
+            const hasPageTitle = pageTitle !== null && isPropDefined(pageTitle) && pageTitle !== "";
+            if (current && hasPageTitle) {
+                return (h("span", { class: {
+                        "current-page-container": current,
+                        [this.appearance]: true,
+                    } }, isSlotUsed(this.el, "icon") && h("slot", { name: "icon" }), pageTitle));
+            }
+            return (h("ic-link", { appearance: this.appearance, 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.appearance = "default";
+        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();
         }
-      }
-    };
-    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 && isPropDefined(pageTitle) && pageTitle !== "";
-    const hasHref = href !== null && isPropDefined(href) && 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",
-              "id": "global::Promise"
+    render() {
+        const { current, href, pageTitle } = this;
+        const describedById = `${pageTitle && pageTitle.toLowerCase().replace(" ", "-")}-describedby`;
+        const hasPageTitle = pageTitle !== null && isPropDefined(pageTitle) && pageTitle !== "";
+        const hasHref = href !== null && isPropDefined(href) && 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 {
+            "appearance": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "IcThemeForeground",
+                    "resolved": "\"dark\" | \"default\" | \"light\"",
+                    "references": {
+                        "IcThemeForeground": {
+                            "location": "import",
+                            "path": "../../utils/types",
+                            "id": "src/utils/types.ts::IcThemeForeground"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "internal",
+                            "text": "The appearance of the breadcrumb."
+                        }],
+                    "text": ""
+                },
+                "attribute": "appearance",
+                "reflect": false,
+                "defaultValue": "\"default\""
+            },
+            "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"
             }
-          },
-          "return": "Promise<void>"
-        },
-        "docs": {
-          "text": "Sets focus on the breadcrumb.",
-          "tags": []
-        }
-      }
-    };
-  }
-  static get elementRef() { return "el"; }
+        };
+    }
+    static get methods() {
+        return {
+            "setFocus": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "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

@@ -1 +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 { isPropDefined, isSlotUsed } from \"../../utils/helpers\";\n\n/**\n * @slot icon - Content will be rendered to the left of the breadcrumb page title.\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   * 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 && isPropDefined(pageTitle) && 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 && isPropDefined(pageTitle) && pageTitle !== \"\";\n    const hasHref = href !== null && isPropDefined(href) && 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"]}
+{"version":3,"file":"ic-breadcrumb.js","sourceRoot":"","sources":["../../../src/components/ic-breadcrumb/ic-breadcrumb.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAG1E,OAAO,WAAW,MAAM,+BAA+B,CAAC;AACxD,OAAO,QAAQ,MAAM,4BAA4B,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAGhE;;GAEG;AAQH,MAAM,OAAO,UAAU;;QA0Cb,4BAAuB,GAAG,CAChC,OAAgB,EAChB,SAAiB,EACjB,aAAqB,EACrB,IAAY,EACS,EAAE;YACvB,MAAM,YAAY,GAChB,SAAS,KAAK,IAAI,IAAI,aAAa,CAAC,SAAS,CAAC,IAAI,SAAS,KAAK,EAAE,CAAC;YAErE,IAAI,OAAO,IAAI,YAAY,EAAE;gBAC3B,OAAO,CACL,YACE,KAAK,EAAE;wBACL,wBAAwB,EAAE,OAAO;wBACjC,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,IAAI;qBACxB;oBAEA,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,IAAI,YAAM,IAAI,EAAC,MAAM,GAAQ;oBACxD,SAAS,CACL,CACR,CAAC;aACH;YAED,OAAO,CACL,eACE,UAAU,EAAE,IAAI,CAAC,UAAU,EAC3B,IAAI,EAAE,IAAI,EACV,KAAK,EAAC,iBAAiB,sBACL,IAAI,CAAC,YAAY,IAAI,aAAa,IAAI,aAAa;gBAEpE,IAAI,CAAC,YAAY,IAAI,CACpB,WAAK,KAAK,EAAC,WAAW,EAAC,SAAS,EAAE,QAAQ,GAAQ,CACnD;gBACA,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,IAAI,YAAM,IAAI,EAAC,MAAM,GAAQ;gBACxD,SAAS,CACF,CACX,CAAC;QACJ,CAAC,CAAC;QAEM,+BAA0B,GAAG,GAAG,EAAE;YACxC,MAAM,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;YAChD,MAAM,WAAW,GAAG,cAAc,CAAC;YACnC,IAAI,MAAM,EAAE;gBACV,MAAM,CAAC,SAAS,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;gBACrC,IAAI,IAAI,CAAC,OAAO,EAAE;oBAChB,MAAM,mBAAmB,GAAG,MAAM,CAAC,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC,CAAC;oBACnE,IAAI,CAAC,mBAAmB,EAAE;wBACxB,MAAM,CAAC,SAAS,CAAC,GAAG,CAAC,iBAAiB,EAAE,WAAW,CAAC,CAAC;qBACtD;iBACF;aACF;QACH,CAAC,CAAC;0BAvFsC,SAAS;uBAKrB,KAAK;;;4BAegB,KAAK;;IAEtD,mBAAmB;QACjB,IAAI,CAAC,0BAA0B,EAAE,CAAC;IACpC,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,QAAQ;QACZ,IAAI,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,SAAS,CAAC,EAAE;YAC/C,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC,KAAK,EAAE,CAAC;SACrD;IACH,CAAC;IAuDD,MAAM;QACJ,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;QAC1C,MAAM,aAAa,GAAG,GACpB,SAAS,IAAI,SAAS,CAAC,WAAW,EAAE,CAAC,OAAO,CAAC,GAAG,EAAE,GAAG,CACvD,cAAc,CAAC;QAEf,MAAM,YAAY,GAChB,SAAS,KAAK,IAAI,IAAI,aAAa,CAAC,SAAS,CAAC,IAAI,SAAS,KAAK,EAAE,CAAC;QACrE,MAAM,OAAO,GAAG,IAAI,KAAK,IAAI,IAAI,aAAa,CAAC,IAAI,CAAC,IAAI,IAAI,KAAK,EAAE,CAAC;QAEpE,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,IAAI,EAAE,IAAI,CAAC,YAAY;aACxB,kBACa,OAAO,IAAI,MAAM,EAC/B,IAAI,EAAC,UAAU;YAEf,WAAK,KAAK,EAAC,YAAY;gBACrB,YAAM,SAAS,EAAE,WAAW,EAAE,KAAK,EAAC,SAAS,iBAAa,MAAM,GAAG;gBAClE,IAAI,CAAC,YAAY,IAAI,aAAa,IAAI,CACrC,YACE,EAAE,EAAE,aAAa,EACjB,KAAK,EAAC,MAAM,IACZ,WAAW,SAAS,EAAE,CAAQ,CACjC;gBACA,YAAY,IAAI,OAAO,CAAC,CAAC,CAAC,CACzB,IAAI,CAAC,uBAAuB,CAC1B,OAAO,EACP,SAAS,EACT,aAAa,EACb,IAAI,CACL,CACF,CAAC,CAAC,CAAC,CACF,eAAQ,CACT,CACG,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","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 { isPropDefined, isSlotUsed } from \"../../utils/helpers\";\nimport { IcThemeForeground } from \"../../utils/types\";\n\n/**\n * @slot icon - Content will be rendered to the left of the breadcrumb page title.\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   * @internal The appearance of the breadcrumb.\n   */\n  @Prop() appearance: IcThemeForeground = \"default\";\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 && isPropDefined(pageTitle) && pageTitle !== \"\";\n\n    if (current && hasPageTitle) {\n      return (\n        <span\n          class={{\n            \"current-page-container\": current,\n            [this.appearance]: true,\n          }}\n        >\n          {isSlotUsed(this.el, \"icon\") && <slot name=\"icon\"></slot>}\n          {pageTitle}\n        </span>\n      );\n    }\n\n    return (\n      <ic-link\n        appearance={this.appearance}\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 && isPropDefined(pageTitle) && pageTitle !== \"\";\n    const hasHref = href !== null && isPropDefined(href) && 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"]}