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

@ukic/web-components 2.26.0 → 3.0.0

Files changed (856) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-empty-state.js","sourceRoot":"","sources":["../../../src/components/ic-empty-state/ic-empty-state.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG/E,OAAO,EACL,UAAU,EACV,gCAAgC,EAChC,yBAAyB,GAC1B,MAAM,qBAAqB,CAAC;AAG7B;;;;;;GAMG;AAMH,MAAM,OAAO,UAAU;;QACb,yBAAoB,GAAqB,IAAI,CAAC;QAmD9C,yBAAoB,GAAG,CAAC,YAA8B,EAAQ,EAAE;YACtE,IACE,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,EAAE,CACvD,IAAI,KAAK,WAAW;gBAClB,CAAC,CAAC,yBAAyB,CAAC,UAAU,EAAE,YAAY,EAAE;oBAClD,OAAO;oBACP,SAAS;iBACV,CAAC;gBACJ,CAAC,CAAC,KAAK,CACV,EACD,CAAC;gBACD,WAAW,CAAC,IAAI,CAAC,CAAC;YACpB,CAAC;QACH,CAAC,CAAC;uBAzDwC,MAAM;;;;yBAoBlB,SAAS;;;IAOvC,oBAAoB;;QAClB,MAAA,IAAI,CAAC,oBAAoB,0CAAE,UAAU,EAAE,CAAC;IAC1C,CAAC;IAED,gBAAgB;QACd,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC;YAC7B,gCAAgC,CAC9B,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAC7C,aAAa,CACd,CAAC;QAEJ,IAAI,CAAC,oBAAoB,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;QAC5E,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE;YACzC,SAAS,EAAE,IAAI;SAChB,CAAC,CAAC;IACL,CAAC;IAiBD,MAAM;QACJ,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,~~YAAY~~,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,~~GACnE~~,IAAI,CAAC;~~QACP~~,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,CAAC,~~GAAG~~,OAAO,EAAE,CAAC,EAAE,IAAI;~~gBACpB~~,CAAC,SAAS,SAAS,EAAE,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC;aACrD;YAEA,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC,IAAI,YAAM,IAAI,EAAC,OAAO,GAAQ;YAC3D;gBACE,YAAM,IAAI,EAAC,SAAS;oBAClB,qBAAe,OAAO,EAAC,IAAI,IAAE,OAAO,CAAiB,CAChD;gBACP,YAAM,IAAI,EAAC,YAAY;oBACrB,qBAAe,OAAO,EAAC,gBAAgB,IAAE,UAAU,CAAiB,CAC/D;gBACP,YAAM,IAAI,EAAC,MAAM;oBACf,qBAAe,QAAQ,EAAE,~~YAAY~~,IAAG,IAAI,CAAiB,~~CACxD~~,CACH;YACL,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC,IAAI,CACjC,WAAK,KAAK,EAAC,aAAa;gBACtB,YAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { h, Component, Host, Prop, Element, forceUpdate } from \"@stencil/core\";\n\nimport { IcEmptyStateAlignment } from \"./ic-empty-state.types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n checkSlotInChildMutations,\n} from \"../../utils/helpers\";\nimport { IcSizes } from \"../../utils/types\";\n\n/*\n @slot image - Content is placed at the top above all other content.\n * @slot actions - Content is placed at the bottom below all other content.\n * @slot heading - Content will be rendered in place of the heading prop.\n * @slot subheading - Content will be rendered in place of the subheading prop.\n * @slot body - Content will be rendered in place of the body prop.\n /\n@Component({\n tag: \"ic-empty-state\",\n styleUrl: \"ic-empty-state.css\",\n shadow: true,\n})\nexport class EmptyState {\n private hostMutationObserver: MutationObserver = null;\n\n @Element() el: HTMLIcEmptyStateElement;\n\n /\n The alignment of the empty state container.\n /\n @Prop() aligned?: IcEmptyStateAlignment = \"left\";\n\n /\n The body text rendered in the empty state container.\n /\n @Prop() body?: string;\n\n /\n The number of lines of body text to display before truncating.\n /\n @Prop() ~~bodyMaxLines~~?: number;\n\n /\n The title rendered in the empty state container.\n /\n @Prop() heading?: string;\n\n /\n The size of the image or icon used in the image slot.\n /\n @Prop() imageSize?: IcSizes = \"default\";\n\n /\n The subtitle rendered in the empty state container.\n */\n @Prop() subheading?: string;\n\n disconnectedCallback(): void {\n this.hostMutationObserver?.disconnect();\n }\n\n componentDidLoad(): void {\n !isSlotUsed(this.el, \"heading\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Empty State\"\n );\n\n this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n\n private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n if (\n mutationList.some(({ type, addedNodes, removedNodes }) =>\n type === \"childList\"\n ? checkSlotInChildMutations(addedNodes, removedNodes, [\n \"image\",\n \"actions\",\n ])\n : false\n )\n ) {\n forceUpdate(this);\n }\n };\n\n render() {\n const { aligned, body, ~~bodyMaxLines~~, heading, imageSize, subheading } ~~=\n~~ this;\n return (\n <Host\n class={{\n [`${aligned}`]: true,\n [`image-${imageSize}`]: isSlotUsed(this.el, \"image\"),\n }}\n >\n {isSlotUsed(this.el, \"image\") && <slot name=\"image\"></slot>}\n <div>\n <slot name=\"heading\">\n <ic-typography variant=\"h4\">{heading}</ic-typography>\n </slot>\n <slot name=\"subheading\">\n <ic-typography variant=\"subtitle-small\">{subheading}</ic-typography>\n </slot>\n <slot name=\"body\">\n <ic-typography maxLines={~~bodyMaxLines~~}>{body}</ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"actions\") && (\n <div class=\"action-area\">\n <slot name=\"actions\" />\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-empty-state.js","sourceRoot":"","sources":["../../../src/components/ic-empty-state/ic-empty-state.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAG/E,OAAO,EACL,UAAU,EACV,gCAAgC,EAChC,yBAAyB,GAC1B,MAAM,qBAAqB,CAAC;AAG7B;;;;;;GAMG;AAMH,MAAM,OAAO,UAAU;;QACb,yBAAoB,GAAqB,IAAI,CAAC;QAmD9C,yBAAoB,GAAG,CAAC,YAA8B,EAAQ,EAAE;YACtE,IACE,YAAY,CAAC,IAAI,CAAC,CAAC,EAAE,IAAI,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,EAAE,CACvD,IAAI,KAAK,WAAW;gBAClB,CAAC,CAAC,yBAAyB,CAAC,UAAU,EAAE,YAAY,EAAE;oBAClD,OAAO;oBACP,SAAS;iBACV,CAAC;gBACJ,CAAC,CAAC,KAAK,CACV,EACD,CAAC;gBACD,WAAW,CAAC,IAAI,CAAC,CAAC;YACpB,CAAC;QACH,CAAC,CAAC;uBAzDwC,MAAM;;;;yBAoBlB,SAAS;;;IAOvC,oBAAoB;;QAClB,MAAA,IAAI,CAAC,oBAAoB,0CAAE,UAAU,EAAE,CAAC;IAC1C,CAAC;IAED,gBAAgB;QACd,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC;YAC7B,gCAAgC,CAC9B,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,CAAC,EAC7C,aAAa,CACd,CAAC;QAEJ,IAAI,CAAC,oBAAoB,GAAG,IAAI,gBAAgB,CAAC,IAAI,CAAC,oBAAoB,CAAC,CAAC;QAC5E,IAAI,CAAC,oBAAoB,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,EAAE;YACzC,SAAS,EAAE,IAAI;SAChB,CAAC,CAAC;IACL,CAAC;IAiBD,MAAM;QACJ,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QACzE,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,CAAC,kBAAkB,OAAO,EAAE,CAAC,EAAE,IAAI;gBACnC,CAAC,SAAS,SAAS,EAAE,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC;aACrD;YAEA,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,OAAO,CAAC,IAAI,YAAM,IAAI,EAAC,OAAO,GAAQ;YAC3D;gBACE,YAAM,IAAI,EAAC,SAAS;oBAClB,qBAAe,OAAO,EAAC,IAAI,IAAE,OAAO,CAAiB,CAChD;gBACP,YAAM,IAAI,EAAC,YAAY;oBACrB,qBAAe,OAAO,EAAC,gBAAgB,IAAE,UAAU,CAAiB,CAC/D;gBACP,YAAM,IAAI,EAAC,MAAM;oBACf,qBAAe,QAAQ,EAAE,QAAQ,IAAG,IAAI,CAAiB,CACpD,CACH;YACL,UAAU,CAAC,IAAI,CAAC,EAAE,EAAE,SAAS,CAAC,IAAI,CACjC,WAAK,KAAK,EAAC,aAAa;gBACtB,YAAM,IAAI,EAAC,SAAS,GAAG,CACnB,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { h, Component, Host, Prop, Element, forceUpdate } from \"@stencil/core\";\n\nimport { IcEmptyStateAlignment } from \"./ic-empty-state.types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n checkSlotInChildMutations,\n} from \"../../utils/helpers\";\nimport { IcSizes } from \"../../utils/types\";\n\n/*\n @slot image - Content is placed at the top above all other content.\n * @slot actions - Content is placed at the bottom below all other content.\n * @slot heading - Content will be rendered in place of the heading prop.\n * @slot subheading - Content will be rendered in place of the subheading prop.\n * @slot body - Content will be rendered in place of the body prop.\n /\n@Component({\n tag: \"ic-empty-state\",\n styleUrl: \"ic-empty-state.css\",\n shadow: true,\n})\nexport class EmptyState {\n private hostMutationObserver: MutationObserver = null;\n\n @Element() el: HTMLIcEmptyStateElement;\n\n /\n The alignment of the empty state container.\n /\n @Prop() aligned?: IcEmptyStateAlignment = \"left\";\n\n /\n The body text rendered in the empty state container.\n /\n @Prop() body?: string;\n\n /\n The number of lines of body text to display before truncating.\n /\n @Prop() maxLines?: number;\n\n /\n The title rendered in the empty state container.\n /\n @Prop() heading?: string;\n\n /\n The size of the image or icon used in the image slot.\n /\n @Prop() imageSize?: IcSizes = \"default\";\n\n /\n The subtitle rendered in the empty state container.\n */\n @Prop() subheading?: string;\n\n disconnectedCallback(): void {\n this.hostMutationObserver?.disconnect();\n }\n\n componentDidLoad(): void {\n !isSlotUsed(this.el, \"heading\") &&\n onComponentRequiredPropUndefined(\n [{ prop: this.heading, propName: \"heading\" }],\n \"Empty State\"\n );\n\n this.hostMutationObserver = new MutationObserver(this.hostMutationCallback);\n this.hostMutationObserver.observe(this.el, {\n childList: true,\n });\n }\n\n private hostMutationCallback = (mutationList: MutationRecord[]): void => {\n if (\n mutationList.some(({ type, addedNodes, removedNodes }) =>\n type === \"childList\"\n ? checkSlotInChildMutations(addedNodes, removedNodes, [\n \"image\",\n \"actions\",\n ])\n : false\n )\n ) {\n forceUpdate(this);\n }\n };\n\n render() {\n const { aligned, body, maxLines, heading, imageSize, subheading } = this;\n return (\n <Host\n class={{\n [`ic-empty-state-${aligned}`]: true,\n [`image-${imageSize}`]: isSlotUsed(this.el, \"image\"),\n }}\n >\n {isSlotUsed(this.el, \"image\") && <slot name=\"image\"></slot>}\n <div>\n <slot name=\"heading\">\n <ic-typography variant=\"h4\">{heading}</ic-typography>\n </slot>\n <slot name=\"subheading\">\n <ic-typography variant=\"subtitle-small\">{subheading}</ic-typography>\n </slot>\n <slot name=\"body\">\n <ic-typography maxLines={maxLines}>{body}</ic-typography>\n </slot>\n </div>\n {isSlotUsed(this.el, \"actions\") && (\n <div class=\"action-area\">\n <slot name=\"actions\" />\n </div>\n )}\n </Host>\n );\n }\n}\n"]}

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

@@ -447,31 +447,31 @@ video {
   --footer-compliance-padding: 1rem 0;
 }
-:host(.footer-sparse) {
+:host(.ic-footer-sparse) {
   --footer-links-padding: 1.5rem 0;
-  --footer-logo-margin-bottom: var(--ic-space-lg);
+  --footer-logo-margin-bottom: calc(var(--ic-space-md) + var(--ic-space-xxs));
   --footer-link-inner-flex-direction: row;
 }
-:host(.footer-small) {
+:host(.ic-footer-small) {
   --footer-links-padding: 0 0;
   --footer-logo-margin-bottom: var(--ic-space-md);
   --footer-link-inner-flex-direction: column;
 }
-:host(.footer-light) {
+:host(.ic-footer-foreground-light) {
   --footer-theme-secondary: var(--ic-theme-secondary);
   --footer-theme-tertiary: var(--ic-theme-tertiary);
   --footer-keyline: var(--ic-keyline-lighten);
 }
-:host(.footer-dark) {
+:host(.ic-footer-foreground-dark) {
   --footer-theme-secondary: var(--ic-theme-secondary-light);
   --footer-theme-tertiary: var(--ic-theme-tertiary-light);
   --footer-keyline: var(--ic-keyline-darken);
 }
-:host(.footer-small.footer-ungrouped) {
+:host(.ic-footer-small.ic-footer-ungrouped) {
   --footer-links-padding: var(--ic-space-md) 0 0 0;
 }

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

@@ -66,13 +66,13 @@ export class Footer {
         const { aligned, caption, copyright, description, groupLinks, foregroundColor, } = this;
         const small = this.isSmall();
         return (h(Host, { class: {
-                footer: true,
-                [`footer-${small ? "small" : "sparse"}`]: true,
-                [`footer-${groupLinks ? "grouped" : "ungrouped"}`]: true,
-                [`footer-${foregroundColor}`]: true,
+                ["ic-footer"]: true,
+                [`ic-footer-${small ? "small" : "sparse"}`]: true,
+                [`ic-footer-${groupLinks ? "grouped" : "ungrouped"}`]: true,
+                [`ic-footer-foreground-${foregroundColor}`]: true,
                 // Slots will be able to infer their own color
-                [IcThemeForegroundEnum.Dark]: foregroundColor === IcThemeForegroundEnum.Dark,
-                [IcThemeForegroundEnum.Light]: foregroundColor === IcThemeForegroundEnum.Light,
+                [`ic-footer-${IcThemeForegroundEnum.Dark}`]: foregroundColor === IcThemeForegroundEnum.Dark,
+                [`ic-footer-${IcThemeForegroundEnum.Light}`]: foregroundColor === IcThemeForegroundEnum.Light,
             } }, h("footer", { ref: (footerEl) => (this.footerEl = footerEl) }, (isSlotUsed(this.el, "description") || description) && (h("div", { class: "footer-description" }, h("ic-section-container", { aligned: aligned, fullHeight: true }, h("div", { class: "footer-description-inner" }, h("ic-typography", { variant: "body" }, h("slot", { name: "description" }, description)))))), isSlotUsed(this.el, "link") && (h("div", { class: "footer-links" }, groupLinks && small ? (h("div", { class: "footer-links-inner", role: "list" }, h("slot", { name: "link" }))) : (h("ic-section-container", { fullHeight: true, aligned: aligned }, h("div", { class: "footer-links-inner", role: "list" }, h("slot", { name: "link" })))))), h("div", { class: "footer-compliance" }, h("ic-section-container", { aligned: aligned, fullHeight: true }, h("div", { class: "footer-compliance-inner" }, isSlotUsed(this.el, "logo") && (h("div", { class: "footer-logo" }, h("slot", { name: "logo" }))), (isSlotUsed(this.el, "caption") || caption) && (h("div", { class: "footer-caption" }, h("ic-typography", { variant: this.deviceSize <= IC_DEVICE_SIZES.M
                 ? "caption"
                 : "body" }, h("slot", { name: "caption" }, caption)))), copyright && (h("div", { class: {

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-footer.js","sourceRoot":"","sources":["../../../src/components/ic-footer/ic-footer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Prop,\n State,\n h,\n Host,\n Listen,\n} from \"@stencil/core\";\nimport { IC_DEVICE_SIZES } from \"../../utils/constants\";\nimport {\n getCurrentDeviceSize,\n getThemeForegroundColor,\n checkResizeObserver,\n hasClassificationBanner,\n isSlotUsed,\n} from \"../../utils/helpers\";\nimport {\n IcAlignment,\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { IcFooterBreakpoints } from \"./ic-footer.types\";\n\n/*\n @slot description - Content will be rendered at the top of the footer.\n * @slot link - Content will be rendered between description and logos.\n * @slot logo - Content will be rendered underneath footer links.\n * @slot caption - Content will be rendered above Crown Copyright.\n /\n\n@Component({\n tag: \"ic-footer\",\n styleUrl: \"ic-footer.css\",\n shadow: true,\n})\nexport class Footer {\n private footerEl: HTMLElement;\n private resizeObserver: ResizeObserver = null;\n\n @Element() el: HTMLIcFooterElement;\n\n @State() deviceSize: number = IC_DEVICE_SIZES.XL;\n @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n\n /\n The alignment of the section containers used within the footer.\n /\n @Prop() aligned?: IcAlignment = \"left\";\n\n /\n The screen size breakpoint at which to switch to the small layout.\n /\n @Prop() breakpoint?: IcFooterBreakpoints = \"medium\";\n\n /\n The caption displayed at the bottom of the footer.\n /\n @Prop() caption: string;\n\n /\n If `true`, the footer will display the crown copyright at the bottom.\n /\n @Prop() copyright: boolean = true;\n\n /\n The description displayed at the top of the footer.\n /\n @Prop() description: string;\n\n /\n If `true`, the footer will be set up to handle link groups instead of standalone links.\n /\n @Prop() groupLinks?: boolean = false;\n\n /\n @internal Triggers on page resize and triggers style changes in footer links and link groups\n /\n @Event() footerResized: EventEmitter<void>;\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n }\n\n componentWillLoad(): void {\n this.deviceSize = getCurrentDeviceSize();\n }\n\n componentDidLoad(): void {\n checkResizeObserver(this.runResizeObserver);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.foregroundColor = theme.mode;\n }\n\n private isSmall() {\n const bp = this.breakpoint;\n\n return bp === \"extra small\"\n ? this.deviceSize < IC_DEVICE_SIZES.XS\n : bp === \"small\"\n ? this.deviceSize < IC_DEVICE_SIZES.S\n : bp === \"medium\"\n ? this.deviceSize < IC_DEVICE_SIZES.M\n : bp === \"large\"\n ? this.deviceSize < IC_DEVICE_SIZES.L\n : bp === \"extra large\"\n ? this.deviceSize < IC_DEVICE_SIZES.XL\n : false;\n }\n\n private resizeObserverCallback = (currSize: number) => {\n if (currSize !== this.deviceSize) {\n this.deviceSize = currSize;\n }\n this.footerResized.emit();\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n const currSize = getCurrentDeviceSize();\n this.resizeObserverCallback(currSize);\n });\n\n this.resizeObserver.observe(this.footerEl);\n };\n\n render() {\n const {\n aligned,\n caption,\n copyright,\n description,\n groupLinks,\n foregroundColor,\n } = this;\n const small = this.isSmall();\n\n return (\n <Host\n class={{\n footer: true,\n [`footer-${small ? \"small\" : \"sparse\"}`]: true,\n [`footer-${groupLinks ? \"grouped\" : \"ungrouped\"}`]: true,\n [`footer-${foregroundColor}`]: true,\n // Slots will be able to infer their own color\n [IcThemeForegroundEnum.Dark]:\n foregroundColor === IcThemeForegroundEnum.Dark,\n [IcThemeForegroundEnum.Light]:\n foregroundColor === IcThemeForegroundEnum.Light,\n }}\n >\n <footer ref={(footerEl) => (this.footerEl = footerEl)}>\n {/ Description /}\n {(isSlotUsed(this.el, \"description\") \|\| description) && (\n <div class=\"footer-description\">\n <ic-section-container aligned={aligned} fullHeight={true}>\n <div class=\"footer-description-inner\">\n <ic-typography variant=\"body\">\n <slot name=\"description\">{description}</slot>\n </ic-typography>\n </div>\n </ic-section-container>\n </div>\n )}\n\n {/ Links /}\n {isSlotUsed(this.el, \"link\") && (\n <div class=\"footer-links\">\n {groupLinks && small ? (\n <div class=\"footer-links-inner\" role=\"list\">\n <slot name=\"link\" />\n </div>\n ) : (\n <ic-section-container fullHeight aligned={aligned}>\n <div class=\"footer-links-inner\" role=\"list\">\n <slot name=\"link\" />\n </div>\n </ic-section-container>\n )}\n </div>\n )}\n\n {/ Compliance (logo, caption, copyright) /}\n <div class=\"footer-compliance\">\n <ic-section-container aligned={aligned} fullHeight={true}>\n <div class=\"footer-compliance-inner\">\n {isSlotUsed(this.el, \"logo\") && (\n <div class=\"footer-logo\">\n {/ Logo */}\n <slot name=\"logo\" />\n </div>\n )}\n {(isSlotUsed(this.el, \"caption\") \|\| caption) && (\n <div class=\"footer-caption\">\n <ic-typography\n variant={\n this.deviceSize <= IC_DEVICE_SIZES.M\n ? \"caption\"\n : \"body\"\n }\n >\n <slot name=\"caption\">{caption}</slot>\n </ic-typography>\n </div>\n )}\n {copyright && (\n <div\n class={{\n [\"footer-copyright\"]: true,\n [\"classification-spacing\"]: hasClassificationBanner(),\n }}\n >\n <ic-typography\n variant={\n this.deviceSize <= IC_DEVICE_SIZES.M\n ? \"caption-uppercase\"\n : \"label-uppercase\"\n }\n >\n © Crown Copyright\n </ic-typography>\n </div>\n )}\n </div>\n </ic-section-container>\n </div>\n </footer>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-footer.js","sourceRoot":"","sources":["../../../src/components/ic-footer/ic-footer.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Prop,\n State,\n h,\n Host,\n Listen,\n} from \"@stencil/core\";\nimport { IC_DEVICE_SIZES } from \"../../utils/constants\";\nimport {\n getCurrentDeviceSize,\n getThemeForegroundColor,\n checkResizeObserver,\n hasClassificationBanner,\n isSlotUsed,\n} from \"../../utils/helpers\";\nimport {\n IcAlignment,\n IcTheme,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport { IcFooterBreakpoints } from \"./ic-footer.types\";\n\n/*\n @slot description - Content will be rendered at the top of the footer.\n * @slot link - Content will be rendered between description and logos.\n * @slot logo - Content will be rendered underneath footer links.\n * @slot caption - Content will be rendered above Crown Copyright.\n /\n\n@Component({\n tag: \"ic-footer\",\n styleUrl: \"ic-footer.css\",\n shadow: true,\n})\nexport class Footer {\n private footerEl: HTMLElement;\n private resizeObserver: ResizeObserver = null;\n\n @Element() el: HTMLIcFooterElement;\n\n @State() deviceSize: number = IC_DEVICE_SIZES.XL;\n @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n\n /\n The alignment of the section containers used within the footer.\n /\n @Prop() aligned?: IcAlignment = \"left\";\n\n /\n The screen size breakpoint at which to switch to the small layout.\n /\n @Prop() breakpoint?: IcFooterBreakpoints = \"medium\";\n\n /\n The caption displayed at the bottom of the footer.\n /\n @Prop() caption: string;\n\n /\n If `true`, the footer will display the crown copyright at the bottom.\n /\n @Prop() copyright: boolean = true;\n\n /\n The description displayed at the top of the footer.\n /\n @Prop() description: string;\n\n /\n If `true`, the footer will be set up to handle link groups instead of standalone links.\n /\n @Prop() groupLinks?: boolean = false;\n\n /\n @internal Triggers on page resize and triggers style changes in footer links and link groups\n /\n @Event() footerResized: EventEmitter<void>;\n\n disconnectedCallback(): void {\n if (this.resizeObserver !== null) {\n this.resizeObserver.disconnect();\n }\n }\n\n componentWillLoad(): void {\n this.deviceSize = getCurrentDeviceSize();\n }\n\n componentDidLoad(): void {\n checkResizeObserver(this.runResizeObserver);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n themeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.foregroundColor = theme.mode;\n }\n\n private isSmall() {\n const bp = this.breakpoint;\n\n return bp === \"extra small\"\n ? this.deviceSize < IC_DEVICE_SIZES.XS\n : bp === \"small\"\n ? this.deviceSize < IC_DEVICE_SIZES.S\n : bp === \"medium\"\n ? this.deviceSize < IC_DEVICE_SIZES.M\n : bp === \"large\"\n ? this.deviceSize < IC_DEVICE_SIZES.L\n : bp === \"extra large\"\n ? this.deviceSize < IC_DEVICE_SIZES.XL\n : false;\n }\n\n private resizeObserverCallback = (currSize: number) => {\n if (currSize !== this.deviceSize) {\n this.deviceSize = currSize;\n }\n this.footerResized.emit();\n };\n\n private runResizeObserver = () => {\n this.resizeObserver = new ResizeObserver(() => {\n const currSize = getCurrentDeviceSize();\n this.resizeObserverCallback(currSize);\n });\n\n this.resizeObserver.observe(this.footerEl);\n };\n\n render() {\n const {\n aligned,\n caption,\n copyright,\n description,\n groupLinks,\n foregroundColor,\n } = this;\n const small = this.isSmall();\n\n return (\n <Host\n class={{\n [\"ic-footer\"]: true,\n [`ic-footer-${small ? \"small\" : \"sparse\"}`]: true,\n [`ic-footer-${groupLinks ? \"grouped\" : \"ungrouped\"}`]: true,\n [`ic-footer-foreground-${foregroundColor}`]: true,\n // Slots will be able to infer their own color\n [`ic-footer-${IcThemeForegroundEnum.Dark}`]:\n foregroundColor === IcThemeForegroundEnum.Dark,\n [`ic-footer-${IcThemeForegroundEnum.Light}`]:\n foregroundColor === IcThemeForegroundEnum.Light,\n }}\n >\n <footer ref={(footerEl) => (this.footerEl = footerEl)}>\n {/ Description /}\n {(isSlotUsed(this.el, \"description\") \|\| description) && (\n <div class=\"footer-description\">\n <ic-section-container aligned={aligned} fullHeight={true}>\n <div class=\"footer-description-inner\">\n <ic-typography variant=\"body\">\n <slot name=\"description\">{description}</slot>\n </ic-typography>\n </div>\n </ic-section-container>\n </div>\n )}\n\n {/ Links /}\n {isSlotUsed(this.el, \"link\") && (\n <div class=\"footer-links\">\n {groupLinks && small ? (\n <div class=\"footer-links-inner\" role=\"list\">\n <slot name=\"link\" />\n </div>\n ) : (\n <ic-section-container fullHeight aligned={aligned}>\n <div class=\"footer-links-inner\" role=\"list\">\n <slot name=\"link\" />\n </div>\n </ic-section-container>\n )}\n </div>\n )}\n\n {/ Compliance (logo, caption, copyright) /}\n <div class=\"footer-compliance\">\n <ic-section-container aligned={aligned} fullHeight={true}>\n <div class=\"footer-compliance-inner\">\n {isSlotUsed(this.el, \"logo\") && (\n <div class=\"footer-logo\">\n {/ Logo */}\n <slot name=\"logo\" />\n </div>\n )}\n {(isSlotUsed(this.el, \"caption\") \|\| caption) && (\n <div class=\"footer-caption\">\n <ic-typography\n variant={\n this.deviceSize <= IC_DEVICE_SIZES.M\n ? \"caption\"\n : \"body\"\n }\n >\n <slot name=\"caption\">{caption}</slot>\n </ic-typography>\n </div>\n )}\n {copyright && (\n <div\n class={{\n [\"footer-copyright\"]: true,\n [\"classification-spacing\"]: hasClassificationBanner(),\n }}\n >\n <ic-typography\n variant={\n this.deviceSize <= IC_DEVICE_SIZES.M\n ? \"caption-uppercase\"\n : \"label-uppercase\"\n }\n >\n © Crown Copyright\n </ic-typography>\n </div>\n )}\n </div>\n </ic-section-container>\n </div>\n </footer>\n </Host>\n );\n }\n}\n"]}

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

@@ -54,7 +54,7 @@ describe("ic-footer", () => {
             components: [Footer],
             html: `
             <ic-footer description="This is a footer" caption="Made by ICDS">
-                <ic-footer-link-group group-title="Links" slot="link">
+                <ic-footer-link-group label="Links" slot="link">
                     <ic-footer-link href="/">Link</ic-footer-link>
                     <ic-footer-link href="/">Link</ic-footer-link>
                 </ic-footer-link-group>

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-footer.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-footer/test/basic/ic-footer.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { Typography } from \"../../../ic-typography/ic-typography\";\nimport { Footer } from \"../../ic-footer\";\nimport { DEVICE_SIZES } from \"../../../../utils/helpers\";\n\ndescribe(\"ic-footer\", () => {\n it(\"should render\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-footer></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with a description via the description slot\", async () => {\n const page = await newSpecPage({\n components: [Footer, Typography],\n html: `<ic-footer><ic-typography slot=\"description\">This is a footer</ic-typography></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with a caption via the caption prop\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-footer description=\"This is a footer\" caption=\"Made by ICDS\"></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with a caption via the caption slot\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-footer description=\"This is a footer\"><ic-typography slot=\"caption\">Made by ICDS</ic-typography></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render without the copyright text when the copyright prop is false\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-footer description=\"This is a footer\" copyright=false><ic-typography slot=\"caption\">Made by ICDS</ic-typography></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with links\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `\n <ic-footer description=\"This is a footer\" caption=\"Made by ICDS\">\n <ic-footer-link href=\"/\" slot=\"link\">Link</ic-footer-link>\n <ic-footer-link href=\"/\" slot=\"link\">Link</ic-footer-link>\n </ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with link groups\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `\n <ic-footer description=\"This is a footer\" caption=\"Made by ICDS\">\n <ic-footer-link-group group-title=\"Links\" slot=\"link\">\n <ic-footer-link href=\"/\">Link</ic-footer-link>\n <ic-footer-link href=\"/\">Link</ic-footer-link>\n </ic-footer-link-group>\n </ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with classification banner\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-classification-banner></ic-classification-banner><ic-footer></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot(\"footer-classification-banner\");\n });\n\n it(\"should update foreground colour when the theme is updated\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer'></ic-footer></div>\",\n });\n\n await page.rootInstance.themeChangeHandler({ detail: { mode: \"light\" } });\n\n expect(page.rootInstance.foregroundColor).toBe(\"light\");\n });\n\n it(\"should update when resized\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption'></ic-footer></div>\",\n });\n\n await page.rootInstance.runResizeObserver();\n await page.waitForChanges();\n\n await page.rootInstance.resizeObserverCallback(DEVICE_SIZES.XL);\n await page.waitForChanges();\n\n expect(\n page.root.shadowRoot\n .querySelector(\".footer-caption\")\n .firstElementChild.getAttribute(\"variant\")\n ).toBe(\"body\");\n\n await page.rootInstance.resizeObserverCallback(DEVICE_SIZES.XS);\n await page.waitForChanges();\n\n expect(\n page.root.shadowRoot\n .querySelector(\".footer-caption\")\n .firstElementChild.getAttribute(\"variant\")\n ).toBe(\"caption\");\n\n await page.rootInstance.disconnectedCallback();\n });\n\n it(\"should render with the correct small breakpoint at extra small device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='extra small'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-xs-breakpoint\");\n });\n\n it(\"should render with the correct small breakpoint at small device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='small'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-s-breakpoint\");\n });\n\n it(\"should render with the correct small breakpoint at medium device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='medium'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-m-breakpoint\");\n });\n\n it(\"should render with the correct small breakpoint at large device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='large'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-l-breakpoint\");\n });\n\n it(\"should render with the correct small breakpoint at extra large device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='extra large'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-xl-breakpoint\");\n });\n});\n"]}
1	+ {"version":3,"file":"ic-footer.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-footer/test/basic/ic-footer.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { Typography } from \"../../../ic-typography/ic-typography\";\nimport { Footer } from \"../../ic-footer\";\nimport { DEVICE_SIZES } from \"../../../../utils/helpers\";\n\ndescribe(\"ic-footer\", () => {\n it(\"should render\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-footer></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with a description via the description slot\", async () => {\n const page = await newSpecPage({\n components: [Footer, Typography],\n html: `<ic-footer><ic-typography slot=\"description\">This is a footer</ic-typography></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with a caption via the caption prop\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-footer description=\"This is a footer\" caption=\"Made by ICDS\"></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with a caption via the caption slot\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-footer description=\"This is a footer\"><ic-typography slot=\"caption\">Made by ICDS</ic-typography></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render without the copyright text when the copyright prop is false\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-footer description=\"This is a footer\" copyright=false><ic-typography slot=\"caption\">Made by ICDS</ic-typography></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with links\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `\n <ic-footer description=\"This is a footer\" caption=\"Made by ICDS\">\n <ic-footer-link href=\"/\" slot=\"link\">Link</ic-footer-link>\n <ic-footer-link href=\"/\" slot=\"link\">Link</ic-footer-link>\n </ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with link groups\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `\n <ic-footer description=\"This is a footer\" caption=\"Made by ICDS\">\n <ic-footer-link-group label=\"Links\" slot=\"link\">\n <ic-footer-link href=\"/\">Link</ic-footer-link>\n <ic-footer-link href=\"/\">Link</ic-footer-link>\n </ic-footer-link-group>\n </ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render with classification banner\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: `<ic-classification-banner></ic-classification-banner><ic-footer></ic-footer>`,\n });\n\n expect(page.root).toMatchSnapshot(\"footer-classification-banner\");\n });\n\n it(\"should update foreground colour when the theme is updated\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer'></ic-footer></div>\",\n });\n\n await page.rootInstance.themeChangeHandler({ detail: { mode: \"light\" } });\n\n expect(page.rootInstance.foregroundColor).toBe(\"light\");\n });\n\n it(\"should update when resized\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption'></ic-footer></div>\",\n });\n\n await page.rootInstance.runResizeObserver();\n await page.waitForChanges();\n\n await page.rootInstance.resizeObserverCallback(DEVICE_SIZES.XL);\n await page.waitForChanges();\n\n expect(\n page.root.shadowRoot\n .querySelector(\".footer-caption\")\n .firstElementChild.getAttribute(\"variant\")\n ).toBe(\"body\");\n\n await page.rootInstance.resizeObserverCallback(DEVICE_SIZES.XS);\n await page.waitForChanges();\n\n expect(\n page.root.shadowRoot\n .querySelector(\".footer-caption\")\n .firstElementChild.getAttribute(\"variant\")\n ).toBe(\"caption\");\n\n await page.rootInstance.disconnectedCallback();\n });\n\n it(\"should render with the correct small breakpoint at extra small device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='extra small'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-xs-breakpoint\");\n });\n\n it(\"should render with the correct small breakpoint at small device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='small'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-s-breakpoint\");\n });\n\n it(\"should render with the correct small breakpoint at medium device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='medium'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-m-breakpoint\");\n });\n\n it(\"should render with the correct small breakpoint at large device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='large'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-l-breakpoint\");\n });\n\n it(\"should render with the correct small breakpoint at extra large device size\", async () => {\n const page = await newSpecPage({\n components: [Footer],\n html: \"<div><ic-footer id='ic-footer' caption='caption' breakpoint='extra large'></ic-footer></div>\",\n });\n\n expect(page.root).not.toBeNull;\n\n expect(page.root).toMatchSnapshot(\"footer-xl-breakpoint\");\n });\n});\n"]}

package/dist/collection/components/ic-footer-link/ic-footer-link.css CHANGED Viewed

@@ -471,136 +471,62 @@ video {
   margin-bottom: var(--footer-link-margin-bottom);
 }
-/* Link styling */
-:host(.footer-link) a,
-:host(.footer-link) a ::slotted(a) {
-  display: flex;
-  align-items: flex-end;
-  font-weight: var(--ic-font-weight-bold);
-  color: inherit;
-  width: -moz-fit-content;
-  width: fit-content;
-  font-size: var(--ic-font-size-regular);
-}
-:host(.footer-link) a:link,
-:host(.footer-link) a ::slotted(a:link) {
-  color: inherit;
-  text-decoration: underline;
-  font-weight: var(--ic-font-weight-bold);
-}
-:host(.footer-link) a:link > ::slotted(svg),
-:host(.footer-link) a:link > ::slotted(img),
-:host(.footer-link) a ::slotted(a:link > ::slotted(svg)),
-:host(.footer-link) a ::slotted(a:link > ::slotted(img)) {
-  padding: var(--ic-space-xxxs);
-  pointer-events: none;
-  transition: var(--ic-easing-transition-fast);
-}
-/*
-There's an apparent defect in Chrome that means this isn't always re-rendered if changed.
-Not an issue in Safari. Line 73-79 implement the same function but less clean.
-a:link > ::slotted(svg) ,
-a:link:visited > ::slotted(svg) {
-  fill: var(--ic-theme-text);
-}
-*/
-:host(.footer-link-light) ::slotted(svg) {
-  fill: var(--ic-architectural-white);
-}
-:host(.footer-link-dark) ::slotted(svg) {
-  fill: var(--ic-architectural-black);
+.ic-link-open-in-new-icon {
+  vertical-align: middle;
+  margin-left: var(--ic-space-xxs);
 }
-:host(.footer-link) a:link:hover,
-:host(.footer-link) a:link:focus,
-:host(.footer-link) a ::slotted(a:link:hover),
-:host(.footer-link) a ::slotted(a:link:focus) {
-  border-bottom: 0.25rem solid !important;
-  margin-bottom: -0.25rem !important;
-  text-decoration: none;
+.ic-link > .ic-link-open-in-new-icon {
+  fill: var(--ic-hyperlink);
 }
-@supports (text-underline-offset: 25%) {
-  :host(.footer-link) a:link:hover,
-  :host(.footer-link) a:link:focus,
-  :host(.footer-link) a ::slotted(a:link:hover),
-  :host(.footer-link) a ::slotted(a:link:focus) {
-    text-decoration-line: underline;
-    text-decoration-thickness: 25%;
-    text-underline-offset: 25%;
-    border-bottom: 0 !important;
-    margin-bottom: 0 !important;
-  }
+.ic-link-open-in-new-icon > svg {
+  width: var(--ic-space-md);
+  height: var(--ic-space-md);
+  fill: currentcolor;
 }
-:host(.footer-link) a:link:hover,
-:host(.footer-link) a ::slotted(a:link:hover) {
-  outline: none;
+.ic-link:visited > .ic-link-open-in-new-icon {
+  fill: var(--ic-hyperlink-visited);
 }
-:host(.footer-link) a:link:focus,
-:host(.footer-link) a ::slotted(a:link:focus) {
-  outline: none;
+.ic-link.light:visited > .ic-link-open-in-new-icon {
+  fill: var(--ic-hyperlink-contrast-visited);
 }
-:host(.footer-link) a:link:focus > ::slotted(svg),
-:host(.footer-link) a:link:focus > ::slotted(img),
-:host(.footer-link) a ::slotted(a:link:focus > ::slotted(svg)),
-:host(.footer-link) a ::slotted(a:link:focus > ::slotted(img)) {
-  box-shadow: var(--ic-border-focus);
-  border-radius: var(--ic-border-radius);
+:host(.breadcrumb-link) .ic-link {
+  display: var(--breadcrumb-link-display);
+  align-items: var(--breadcrumb-link-align-items);
+  gap: var(--breadcrumb-link-gap);
 }
-:host(.footer-link) a:focus,
-:host(.footer-link) a ::slotted(a:focus) {
-  outline: none;
-  transition: var(--ic-transition-duration-fast);
+:host(.breadcrumb-link) .ic-link ::slotted(.back-icon) {
+  height: var(--ic-space-lg);
+  width: var(--ic-space-lg);
 }
-:host(.footer-link) a:link:active,
-:host(.footer-link) a:link:focus:active,
-:host(.footer-link) a:link:visited:active,
-:host(.footer-link) a ::slotted(a:link:active),
-:host(.footer-link) a ::slotted(a:link:focus:active),
-:host(.footer-link) a ::slotted(a:link:visited:active) {
+:host(.breadcrumb-link.current-page) a,
+:host(.breadcrumb-link.current-page) ::slotted(a) {
+  font-weight: normal;
   color: inherit;
   text-decoration: none;
+  display: flex;
+  align-items: center;
 }
-:host(.footer-link) a:hover,
-:host(.footer-link) a ::slotted(a:hover) {
+:host(.breadcrumb-link.current-page) .ic-link,
+:host(.breadcrumb-link.current-page) ::slotted(a:focus) {
+  outline: var(--ic-hc-focus-outline);
   text-decoration: none;
 }
-.open-in-new-icon {
-  padding-left: var(--ic-space-xxs);
+:host(.breadcrumb-link.current-page) .ic-link:visited {
+  color: var(--ic-color-primary-text);
 }
-.open-in-new-icon,
-.open-in-new-icon svg {
-  height: var(--ic-space-md);
-  width: var(--ic-space-md);
-}
-:host(.footer-link-light) .open-in-new-icon svg {
-  fill: var(--ic-architectural-white);
-}
-:host(.footer-link-dark) .open-in-new-icon svg {
-  fill: var(--ic-architectural-black);
-}
-@media screen and (min-width: 769px) {
-  :host(.footer-link.footer-link-ungrouped-sparse:last-of-type) {
-    margin-right: 0;
-  }
+:host(.footer-link-light) ::slotted(svg),
+:host(.footer-link-dark) ::slotted(svg) {
+  fill: var(--ic-theme-text);
 }
 @media (forced-colors: active) {

package/dist/collection/components/ic-footer-link/ic-footer-link.js CHANGED Viewed

@@ -1,6 +1,5 @@
 import { Host, h, } from "@stencil/core";
 import { DEVICE_SIZES, getThemeForegroundColor } from "../../utils/helpers";
-import OpenInNew from "../../assets/OpenInNew.svg";
 export class FooterLink {
     constructor() {
         this.deviceSize = DEVICE_SIZES.XL;
@@ -25,10 +24,10 @@ export class FooterLink {
     }
     inferConfig(e) {
         if (e.parentElement !== null) {
-            if (e.parentElement.classList.contains("footer")) {
+            if (e.parentElement.classList.contains("ic-footer")) {
                 return {
-                    small: e.parentElement.classList.contains("footer-small"),
-                    grouped: e.parentElement.classList.contains("footer-grouped"),
+                    small: e.parentElement.classList.contains("ic-footer-small"),
+                    grouped: e.parentElement.classList.contains("ic-footer-grouped"),
                 };
             }
             else {
@@ -46,7 +45,7 @@ export class FooterLink {
                 "footer-link": true,
                 [`footer-link-${grouped ? "grouped" : "ungrouped"}-${small ? "small" : "sparse"}`]: true,
                 [`footer-link-${this.foregroundColor}`]: true,
-            }, role: "listitem" }, h("a", { href: href, hreflang: hreflang, referrerPolicy: referrerpolicy, rel: rel, download: download !== false ? download : null, target: target }, h("slot", null), target === "_blank" && (h("span", { class: "open-in-new-icon", innerHTML: OpenInNew })))));
+            }, role: "listitem" }, h("ic-link", { href: href, hreflang: hreflang, referrerpolicy: referrerpolicy, rel: rel, download: download !== false ? download : null, target: target }, h("slot", null))));
     }
     static get is() { return "ic-footer-link"; }
     static get encapsulation() { return "shadow"; }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-footer-link.js","sourceRoot":"","sources":["../../../src/components/ic-footer-link/ic-footer-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,OAAO,EACP,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,CAAC,EACD,KAAK,GACN,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,YAAY,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;~~AAG5E~~,~~OAAO,SAAS,~~MAAM,~~4BAA4B,CAAC;AAWnD,MAAM,~~OAAO,UAAU;;0BAGS,YAAY,CAAC,EAAE;4BACP,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE;+BACxB,uBAAuB,EAAE;wBAKjC,KAAK;oBAKnB,IAAI;;;;;;IAsB5B,iBAAiB;QACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChD,CAAC;IAGD,mBAAmB;QACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChD,CAAC;IAGD,wBAAwB,CAAC,EAAe;QACtC,MAAM,KAAK,GAAY,EAAE,CAAC,MAAM,CAAC;QACjC,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC;IACpC,CAAC;IAEO,WAAW,CAAC,CAAc;QAChC,IAAI,CAAC,CAAC,aAAa,KAAK,IAAI,EAAE,CAAC;YAC7B,IAAI,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,~~QAAQ~~,CAAC,EAAE,CAAC;~~gBACjD~~,OAAO;oBACL,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,~~cAAc~~,CAAC;~~oBACzD~~,OAAO,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,~~gBAAgB~~,CAAC;~~iBAC9D~~,CAAC;YACJ,CAAC;iBAAM,CAAC;gBACN,OAAO,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;YAC3C,CAAC;QACH,CAAC;aAAM,CAAC;YACN,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QAC1C,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,EACJ,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,GAAG,EACH,MAAM,EACN,QAAQ,GACT,GAAG,IAAI,CAAC;QACT,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,YAAY,CAAC;QAExC,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,aAAa,EAAE,IAAI;gBACnB,CAAC,eAAe,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,IAC/C,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QACpB,EAAE,CAAC,EAAE,IAAI;gBACT,CAAC,eAAe,IAAI,CAAC,eAAe,EAAE,CAAC,EAAE,IAAI;aAC9C,EACD,IAAI,EAAC,UAAU;YAEf,~~SACE~~,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,EAC9C,MAAM,EAAE,MAAM;gBAEd,eAAQ~~;gBACP~~,~~MAAM~~,~~KAAK~~,~~QAAQ,IAAI,CACtB,YAAM,KAAK,EAAC,kBAAkB,EAAC,SAAS,EAAE,SAAS,GAAI,CACxD,CACC,CACC,~~CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Element,\n Host,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport { DEVICE_SIZES, getThemeForegroundColor } from \"../../utils/helpers\";\nimport { IcTheme, IcThemeForeground } from \"../../utils/types\";\n\~~nimport OpenInNew from \"../../assets/OpenInNew.svg\";\n\~~ntype FooterConfig = { small: boolean; grouped: boolean };\n\n@Component({\n tag: \"ic-footer-link\",\n styleUrl: \"ic-footer-link.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLink {\n @Element() el: HTMLIcFooterLinkElement;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() footerConfig: FooterConfig = { small: false, grouped: false };\n @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n\n /*\n If `true`, the user can save the linked URL instead of navigating to it.\n /\n @Prop() download?: string \| boolean = false;\n\n /\n The URL that the link points to.\n /\n @Prop() href?: string = null;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string;\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n componentWillLoad(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.foregroundColor = theme.mode;\n }\n\n private inferConfig(e: HTMLElement): FooterConfig {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"footer\")) {\n return {\n small: e.parentElement.classList.contains(\"footer-small\"),\n grouped: e.parentElement.classList.contains(\"footer-grouped\"),\n };\n } else {\n return this.inferConfig(e.parentElement);\n }\n } else {\n return { small: false, grouped: false };\n }\n }\n\n render() {\n const {\n footerConfig,\n href,\n hreflang,\n referrerpolicy,\n rel,\n target,\n download,\n } = this;\n const { small, grouped } = footerConfig;\n\n return (\n <Host\n class={{\n \"footer-link\": true,\n [`footer-link-${grouped ? \"grouped\" : \"ungrouped\"}-${\n small ? \"small\" : \"sparse\"\n }`]: true,\n [`footer-link-${this.foregroundColor}`]: true,\n }}\n role=\"listitem\"\n >\n <a\n href={href}\n hreflang={hreflang}\n ~~referrerPolicy~~={referrerpolicy}\n rel={rel}\n download={download !== false ? download : null}\n target={target}\n >\n <slot />\n ~~{target === \"_blank\" && (\n <span class=\"open-in-new-icon\" innerHTML={OpenInNew} />\n )}\n~~ </a>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-footer-link.js","sourceRoot":"","sources":["../../../src/components/ic-footer-link/ic-footer-link.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,OAAO,EACP,IAAI,EACJ,MAAM,EACN,IAAI,EACJ,CAAC,EACD,KAAK,GACN,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,YAAY,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAY5E,MAAM,OAAO,UAAU;;0BAGS,YAAY,CAAC,EAAE;4BACP,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE;+BACxB,uBAAuB,EAAE;wBAKjC,KAAK;oBAKnB,IAAI;;;;;;IAsB5B,iBAAiB;QACf,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChD,CAAC;IAGD,mBAAmB;QACjB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IAChD,CAAC;IAGD,wBAAwB,CAAC,EAAe;QACtC,MAAM,KAAK,GAAY,EAAE,CAAC,MAAM,CAAC;QACjC,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC,IAAI,CAAC;IACpC,CAAC;IAEO,WAAW,CAAC,CAAc;QAChC,IAAI,CAAC,CAAC,aAAa,KAAK,IAAI,EAAE,CAAC;YAC7B,IAAI,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,WAAW,CAAC,EAAE,CAAC;gBACpD,OAAO;oBACL,KAAK,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,iBAAiB,CAAC;oBAC5D,OAAO,EAAE,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,mBAAmB,CAAC;iBACjE,CAAC;YACJ,CAAC;iBAAM,CAAC;gBACN,OAAO,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;YAC3C,CAAC;QACH,CAAC;aAAM,CAAC;YACN,OAAO,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,KAAK,EAAE,CAAC;QAC1C,CAAC;IACH,CAAC;IAED,MAAM;QACJ,MAAM,EACJ,YAAY,EACZ,IAAI,EACJ,QAAQ,EACR,cAAc,EACd,GAAG,EACH,MAAM,EACN,QAAQ,GACT,GAAG,IAAI,CAAC;QACT,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,YAAY,CAAC;QAExC,OAAO,CACL,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,aAAa,EAAE,IAAI;gBACnB,CAAC,eAAe,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,IAC/C,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QACpB,EAAE,CAAC,EAAE,IAAI;gBACT,CAAC,eAAe,IAAI,CAAC,eAAe,EAAE,CAAC,EAAE,IAAI;aAC9C,EACD,IAAI,EAAC,UAAU;YAEf,eACE,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,KAAK,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,EAC9C,MAAM,EAAE,MAAM;gBAEd,eAAQ,CACA,CACL,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Element,\n Host,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport { DEVICE_SIZES, getThemeForegroundColor } from \"../../utils/helpers\";\nimport { IcTheme, IcThemeForeground } from \"../../utils/types\";\n\ntype FooterConfig = { small: boolean; grouped: boolean };\n\n@Component({\n tag: \"ic-footer-link\",\n styleUrl: \"ic-footer-link.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLink {\n @Element() el: HTMLIcFooterLinkElement;\n\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() footerConfig: FooterConfig = { small: false, grouped: false };\n @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n\n /*\n If `true`, the user can save the linked URL instead of navigating to it.\n /\n @Prop() download?: string \| boolean = false;\n\n /\n The URL that the link points to.\n /\n @Prop() href?: string = null;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string;\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n */\n @Prop() target?: string;\n\n componentWillLoad(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.footerConfig = this.inferConfig(this.el);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.foregroundColor = theme.mode;\n }\n\n private inferConfig(e: HTMLElement): FooterConfig {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"ic-footer\")) {\n return {\n small: e.parentElement.classList.contains(\"ic-footer-small\"),\n grouped: e.parentElement.classList.contains(\"ic-footer-grouped\"),\n };\n } else {\n return this.inferConfig(e.parentElement);\n }\n } else {\n return { small: false, grouped: false };\n }\n }\n\n render() {\n const {\n footerConfig,\n href,\n hreflang,\n referrerpolicy,\n rel,\n target,\n download,\n } = this;\n const { small, grouped } = footerConfig;\n\n return (\n <Host\n class={{\n \"footer-link\": true,\n [`footer-link-${grouped ? \"grouped\" : \"ungrouped\"}-${\n small ? \"small\" : \"sparse\"\n }`]: true,\n [`footer-link-${this.foregroundColor}`]: true,\n }}\n role=\"listitem\"\n >\n <ic-link\n href={href}\n hreflang={hreflang}\n referrerpolicy={referrerpolicy}\n rel={rel}\n download={download !== false ? download : null}\n target={target}\n >\n <slot />\n </ic-link>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.css CHANGED Viewed

@@ -444,14 +444,14 @@ video {
 :host(.footer-link-group-sparse) {
   --footer-link-group-margin-right: 5.938rem;
   --footer-link-group-border-bottom: 0 solid transparent;
-  --footer-link-group-title-margin-top: 0;
-  --footer-link-group-title-margin-bottom: var(--ic-space-md);
+  --footer-link-label-margin-top: 0;
+  --footer-link-label-margin-bottom: var(--ic-space-md);
 }
 :host(.footer-link-group-small) {
   --footer-link-group-margin-right: 0;
-  --footer-link-group-title-margin-top: var(--ic-space-md);
-  --footer-link-group-title-margin-bottom: var(--ic-space-md);
+  --footer-link-label-margin-top: var(--ic-space-md);
+  --footer-link-label-margin-bottom: var(--ic-space-md);
   --footer-link-group-links-padding-left: var(--ic-space-md);
   --footer-link-group-links-padding-bottom: var(--ic-space-md);
 }
@@ -501,9 +501,9 @@ video {
   background-color: var(--ic-action-dark-bg-active);
 }
-.footer-link-group-title {
-  margin-top: var(--footer-link-group-title-margin-top);
-  margin-bottom: var(--footer-link-group-title-margin-bottom);
+.footer-link-label {
+  margin-top: var(--footer-link-label-margin-top);
+  margin-bottom: var(--footer-link-label-margin-bottom);
   flex-grow: 1;
 }

package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.js CHANGED Viewed

@@ -14,13 +14,13 @@ export class FooterLinkGroup {
         this.deviceSize = DEVICE_SIZES.XL;
         this.dropdownIconStyle = getThemeForegroundColor();
         this.small = false;
-        this.groupTitle = undefined;
+        this.label = undefined;
     }
     componentWillLoad() {
         this.small = this.isSmall(this.el);
     }
     componentDidLoad() {
-        onComponentRequiredPropUndefined([{ prop: this.groupTitle, propName: "group-title" }], "Footer Link Group");
+        onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Footer Link Group");
     }
     footerResizeHandler() {
         this.small = this.isSmall(this.el);
@@ -31,8 +31,8 @@ export class FooterLinkGroup {
     }
     isSmall(e) {
         if (e.parentElement !== null) {
-            if (e.parentElement.classList.contains("footer")) {
-                return e.parentElement.classList.contains("footer-small");
+            if (e.parentElement.classList.contains("ic-footer")) {
+                return e.parentElement.classList.contains("ic-footer-small");
             }
             else {
                 return this.isSmall(e.parentElement);
@@ -43,14 +43,14 @@ export class FooterLinkGroup {
         }
     }
     render() {
-        const { small, groupTitle } = this;
+        const { small, label } = this;
         return !small ? (h(Host, { class: {
                 ["footer-link-group footer-link-group-sparse"]: true,
                 [`footer-link-group-${this.dropdownIconStyle}`]: true,
-            }, role: "listitem" }, h("div", { class: "footer-link-group-title" }, h("ic-typography", { variant: "subtitle-small" }, groupTitle)), h("div", { class: "footer-link-group-links", role: "list" }, h("slot", null)))) : (h(Host, { class: {
+            }, role: "listitem" }, h("div", { class: "footer-link-label" }, h("ic-typography", { variant: "subtitle-small" }, label)), h("div", { class: "footer-link-group-links", role: "list" }, h("slot", null)))) : (h(Host, { class: {
                 ["footer-link-group footer-link-group-small"]: true,
                 [`footer-link-group-${this.dropdownIconStyle}`]: true,
-            }, tabIndex: "1", onClick: this.toggleExpanded, onKeydown: this.handleKeydown, "aria-expanded": this.expanded }, h("ic-section-container", { fullHeight: true }, h("div", { class: "footer-link-group-header" }, h("div", { class: "footer-link-group-title" }, h("ic-typography", { variant: "label" }, groupTitle)), this.expanded ? (h("svg", { class: "footer-link-group-toggle", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "1em", height: "1em", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 1200 1200" }, h("path", { fill: "currentColor", d: "M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z" }))) : (h("svg", { class: "footer-link-group-toggle", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "1em", height: "1em", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 1200 1200" }, h("g", { transform: "translate(0 1200) scale(1 -1)" }, h("path", { fill: "currentColor", d: "M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z" }))))), this.expanded && (h("div", { class: "footer-link-group-links", role: "list" }, h("slot", null))))));
+            }, tabIndex: "1", onClick: this.toggleExpanded, onKeydown: this.handleKeydown, "aria-expanded": this.expanded }, h("ic-section-container", { fullHeight: true }, h("div", { class: "footer-link-group-header" }, h("div", { class: "footer-link-label" }, h("ic-typography", { variant: "label" }, label)), this.expanded ? (h("svg", { class: "footer-link-group-toggle", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "1em", height: "1em", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 1200 1200" }, h("path", { fill: "currentColor", d: "M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z" }))) : (h("svg", { class: "footer-link-group-toggle", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", role: "img", width: "1em", height: "1em", preserveAspectRatio: "xMidYMid meet", viewBox: "0 0 1200 1200" }, h("g", { transform: "translate(0 1200) scale(1 -1)" }, h("path", { fill: "currentColor", d: "M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z" }))))), this.expanded && (h("div", { class: "footer-link-group-links", role: "list" }, h("slot", null))))));
     }
     static get is() { return "ic-footer-link-group"; }
     static get encapsulation() { return "shadow"; }
@@ -67,7 +67,7 @@ export class FooterLinkGroup {
     }
     static get properties() {
         return {
-            "groupTitle": {
+            "label": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -81,7 +81,7 @@ export class FooterLinkGroup {
                     "tags": [],
                     "text": "The title of the link group to be displayed."
                 },
-                "attribute": "group-title",
+                "attribute": "label",
                 "reflect": false
             }
         };

package/dist/collection/components/ic-footer-link-group/ic-footer-link-group.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-footer-link-group.js","sourceRoot":"","sources":["../../../src/components/ic-footer-link-group/ic-footer-link-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,IAAI,EACJ,OAAO,EACP,MAAM,EACN,IAAI,EACJ,CAAC,EACD,KAAK,GACN,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,YAAY,EACZ,uBAAuB,EACvB,gCAAgC,GACjC,MAAM,qBAAqB,CAAC;AAU7B,MAAM,OAAO,eAAe;;QA+ClB,kBAAa,GAAG,CAAC,KAAoB,EAAQ,EAAE;YACrD,IAAI,KAAK,CAAC,GAAG,KAAK,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;gBAC/C,IAAI,CAAC,cAAc,EAAE,CAAC;YACxB,CAAC;QACH,CAAC,CAAC;QAEM,mBAAc,GAAG,GAAS,EAAE;YAClC,IAAI,CAAC,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC;QACjC,CAAC,CAAC;wBApD2B,KAAK;0BACJ,YAAY,CAAC,EAAE;iCAChB,uBAAuB,EAAE;qBAC5B,KAAK;;;IAO/B,iBAAiB;QACf,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACrC,CAAC;IAED,gBAAgB;QACd,gCAAgC,CAC9B,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,~~UAAU~~,EAAE,QAAQ,EAAE,~~aAAa~~,EAAE,CAAC,~~EACpD~~,mBAAmB,CACpB,CAAC;IACJ,CAAC;IAGD,mBAAmB;QACjB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;IACrC,CAAC;IAGD,wBAAwB,CAAC,EAAe;QACtC,MAAM,KAAK,GAAY,EAAE,CAAC,MAAM,CAAC;QACjC,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC,IAAI,CAAC;IACtC,CAAC;IAEO,OAAO,CAAC,CAAc;QAC5B,IAAI,CAAC,CAAC,aAAa,KAAK,IAAI,EAAE,CAAC;YAC7B,IAAI,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,~~QAAQ~~,CAAC,EAAE,CAAC;~~gBACjD~~,OAAO,CAAC,CAAC,aAAa,CAAC,SAAS,CAAC,QAAQ,CAAC,~~cAAc~~,CAAC,CAAC;~~YAC5D~~,CAAC;iBAAM,CAAC;gBACN,OAAO,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC;YACvC,CAAC;QACH,CAAC;aAAM,CAAC;YACN,OAAO,KAAK,CAAC;QACf,CAAC;IACH,CAAC;IAYD,MAAM;QACJ,MAAM,EAAE,KAAK,EAAE,~~UAAU~~,EAAE,GAAG,IAAI,CAAC;~~QAEnC~~,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CACd,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,CAAC,4CAA4C,CAAC,EAAE,IAAI;gBACpD,CAAC,qBAAqB,IAAI,CAAC,iBAAiB,EAAE,CAAC,EAAE,IAAI;aACtD,EACD,IAAI,EAAC,UAAU;YAEf,WAAK,KAAK,EAAC,~~yBAAyB~~;~~gBAClC~~,qBAAe,OAAO,EAAC,gBAAgB,IAAE,~~UAAU~~,CAAiB,~~CAChE~~;YACN,WAAK,KAAK,EAAC,yBAAyB,EAAC,IAAI,EAAC,MAAM;gBAC9C,eAAQ,CACJ,CACD,CACR,CAAC,CAAC,CAAC,CACF,EAAC,IAAI,IACH,KAAK,EAAE;gBACL,CAAC,2CAA2C,CAAC,EAAE,IAAI;gBACnD,CAAC,qBAAqB,IAAI,CAAC,iBAAiB,EAAE,CAAC,EAAE,IAAI;aACtD,EACD,QAAQ,EAAC,GAAG,EACZ,OAAO,EAAE,IAAI,CAAC,cAAc,EAC5B,SAAS,EAAE,IAAI,CAAC,aAAa,mBACd,IAAI,CAAC,QAAQ;YAE5B,4BAAsB,UAAU,EAAE,IAAI;gBACpC,WAAK,KAAK,EAAC,0BAA0B;oBACnC,WAAK,KAAK,EAAC,~~yBAAyB~~;~~wBAClC~~,qBAAe,OAAO,EAAC,OAAO,IAAE,~~UAAU~~,CAAiB,~~CACvD~~;oBACL,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CACf,WACE,KAAK,EAAC,0BAA0B,EAChC,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK,EACZ,mBAAmB,EAAC,eAAe,EACnC,OAAO,EAAC,eAAe;wBAEvB,YACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,0IAA0I,GAC5I,CACE,CACP,CAAC,CAAC,CAAC,CACF,WACE,KAAK,EAAC,0BAA0B,EAChC,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,KAAK,EACX,MAAM,EAAC,KAAK,EACZ,mBAAmB,EAAC,eAAe,EACnC,OAAO,EAAC,eAAe;wBAEvB,SAAG,SAAS,EAAC,+BAA+B;4BAC1C,YACE,IAAI,EAAC,cAAc,EACnB,CAAC,EAAC,0IAA0I,GAC5I,CACA,CACA,CACP,CACG;gBACL,IAAI,CAAC,QAAQ,IAAI,CAChB,WAAK,KAAK,EAAC,yBAAyB,EAAC,IAAI,EAAC,MAAM;oBAC9C,eAAQ,CACJ,CACP,CACoB,CAClB,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {\n Component,\n Host,\n Element,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport {\n DEVICE_SIZES,\n getThemeForegroundColor,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcTheme } from \"../../utils/types\";\n\n@Component({\n tag: \"ic-footer-link-group\",\n styleUrl: \"ic-footer-link-group.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLinkGroup {\n @Element() el: HTMLIcFooterLinkGroupElement;\n\n @State() expanded: boolean = false;\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() dropdownIconStyle = getThemeForegroundColor();\n @State() small: boolean = false;\n\n /*\n The title of the link group to be displayed.\n */\n @Prop() ~~groupTitle~~!: string;\n\n componentWillLoad(): void {\n this.small = this.isSmall(this.el);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.~~groupTitle~~, propName: \"~~group-title~~\" }],\n \"Footer Link Group\"\n );\n }\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.small = this.isSmall(this.el);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.dropdownIconStyle = theme.mode;\n }\n\n private isSmall(e: HTMLElement): boolean {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"footer\")) {\n return e.parentElement.classList.contains(\"footer-small\");\n } else {\n return this.isSmall(e.parentElement);\n }\n } else {\n return false;\n }\n }\n\n private handleKeydown = (event: KeyboardEvent): void => {\n if (event.key === \" \" \|\| event.key === \"Enter\") {\n this.toggleExpanded();\n }\n };\n\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n render() {\n const { small, ~~groupTitle~~ } = this;\n\n return !small ? (\n <Host\n class={{\n [\"footer-link-group footer-link-group-sparse\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n role=\"listitem\"\n >\n <div class=\"footer-link-~~group-title~~\">\n <ic-typography variant=\"subtitle-small\">{~~groupTitle~~}</ic-typography>\n </div>\n <div class=\"footer-link-group-links\" role=\"list\">\n <slot />\n </div>\n </Host>\n ) : (\n <Host\n class={{\n [\"footer-link-group footer-link-group-small\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n tabIndex=\"1\"\n onClick={this.toggleExpanded}\n onKeydown={this.handleKeydown}\n aria-expanded={this.expanded}\n >\n <ic-section-container fullHeight={true}>\n <div class=\"footer-link-group-header\">\n <div class=\"footer-link-~~group-title~~\">\n <ic-typography variant=\"label\">{~~groupTitle~~}</ic-typography>\n </div>\n {this.expanded ? (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </svg>\n ) : (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <g transform=\"translate(0 1200) scale(1 -1)\">\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </g>\n </svg>\n )}\n </div>\n {this.expanded && (\n <div class=\"footer-link-group-links\" role=\"list\">\n <slot />\n </div>\n )}\n </ic-section-container>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-footer-link-group.js","sourceRoot":"","sources":["../../../src/components/ic-footer-link-group/ic-footer-link-group.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Host,\n Element,\n Listen,\n Prop,\n h,\n State,\n} from \"@stencil/core\";\nimport {\n DEVICE_SIZES,\n getThemeForegroundColor,\n onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcTheme } from \"../../utils/types\";\n\n@Component({\n tag: \"ic-footer-link-group\",\n styleUrl: \"ic-footer-link-group.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class FooterLinkGroup {\n @Element() el: HTMLIcFooterLinkGroupElement;\n\n @State() expanded: boolean = false;\n @State() deviceSize: number = DEVICE_SIZES.XL;\n @State() dropdownIconStyle = getThemeForegroundColor();\n @State() small: boolean = false;\n\n /*\n The title of the link group to be displayed.\n */\n @Prop() label!: string;\n\n componentWillLoad(): void {\n this.small = this.isSmall(this.el);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [{ prop: this.label, propName: \"label\" }],\n \"Footer Link Group\"\n );\n }\n\n @Listen(\"footerResized\", { target: \"document\" })\n footerResizeHandler(): void {\n this.small = this.isSmall(this.el);\n }\n\n @Listen(\"themeChange\", { target: \"document\" })\n footerThemeChangeHandler(ev: CustomEvent): void {\n const theme: IcTheme = ev.detail;\n this.dropdownIconStyle = theme.mode;\n }\n\n private isSmall(e: HTMLElement): boolean {\n if (e.parentElement !== null) {\n if (e.parentElement.classList.contains(\"ic-footer\")) {\n return e.parentElement.classList.contains(\"ic-footer-small\");\n } else {\n return this.isSmall(e.parentElement);\n }\n } else {\n return false;\n }\n }\n\n private handleKeydown = (event: KeyboardEvent): void => {\n if (event.key === \" \" \|\| event.key === \"Enter\") {\n this.toggleExpanded();\n }\n };\n\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n };\n\n render() {\n const { small, label } = this;\n\n return !small ? (\n <Host\n class={{\n [\"footer-link-group footer-link-group-sparse\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n role=\"listitem\"\n >\n <div class=\"footer-link-label\">\n <ic-typography variant=\"subtitle-small\">{label}</ic-typography>\n </div>\n <div class=\"footer-link-group-links\" role=\"list\">\n <slot />\n </div>\n </Host>\n ) : (\n <Host\n class={{\n [\"footer-link-group footer-link-group-small\"]: true,\n [`footer-link-group-${this.dropdownIconStyle}`]: true,\n }}\n tabIndex=\"1\"\n onClick={this.toggleExpanded}\n onKeydown={this.handleKeydown}\n aria-expanded={this.expanded}\n >\n <ic-section-container fullHeight={true}>\n <div class=\"footer-link-group-header\">\n <div class=\"footer-link-label\">\n <ic-typography variant=\"label\">{label}</ic-typography>\n </div>\n {this.expanded ? (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </svg>\n ) : (\n <svg\n class=\"footer-link-group-toggle\"\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n role=\"img\"\n width=\"1em\"\n height=\"1em\"\n preserveAspectRatio=\"xMidYMid meet\"\n viewBox=\"0 0 1200 1200\"\n >\n <g transform=\"translate(0 1200) scale(1 -1)\">\n <path\n fill=\"currentColor\"\n d=\"M600.002 210.605L421.285 389.336L0 810.559l178.721 178.836l421.281-421.341l421.281 421.341L1200 810.559L778.733 389.336L600.002 210.605z\"\n />\n </g>\n </svg>\n )}\n </div>\n {this.expanded && (\n <div class=\"footer-link-group-links\" role=\"list\">\n <slot />\n </div>\n )}\n </ic-section-container>\n </Host>\n );\n }\n}\n"]}