@ukic/web-components 3.19.0 → 3.21.0

package/dist/collection/components/ic-accordion-group/ic-accordion-group.css

@@ -458,3 +458,14 @@ video {
 :host(.ic-accordion-group-large) .label-container {
   padding: var(--ic-space-sm) var(--ic-space-xs);
 }
+
+.sr-only {
+  border: 0;
+  clip: rect(0, 0, 0, 0);
+  height: var(--ic-space-1px);
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  white-space: nowrap;
+  width: var(--ic-space-1px);
+}

package/dist/collection/components/ic-accordion-group/ic-accordion-group.js

@@ -3,6 +3,7 @@ import { isSlotUsed } from "../../utils/helpers";
 let accordionGroupIds = 0;
 /**
  * @slot label - Content is placed as the accordion group title.
+ * @slot accessibleButtonLabel - Content is placed as the accessible label for the 'See all/Hide all' button for screen reader users. If this slot is not used, the `accessibleButtonLabel` prop will be used as the accessible label instead.
  */
 export class AccordionGroup {
     constructor() {
@@ -112,11 +113,14 @@ export class AccordionGroup {
     }
     render() {
         const { size, label, singleExpansion, accessibleButtonLabel, theme } = this;
-        return (h(Host, { key: 'ec057d7f6e128e8429ebd9e14497a86d1eaf1abe', "context-id": this.accordionGroupId, class: {
+        const accessibleLabelSlotUsed = isSlotUsed(this.el, "accessibleButtonLabel");
+        return (h(Host, { key: 'fa56ccaebd2207db5b0041ff2d245c1e58e53fb6', "context-id": this.accordionGroupId, class: {
                 [`ic-accordion-group-${size}`]: true,
                 ["ic-accordion-group"]: true,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("div", { key: '86acdf79730dc3d2dcc95a5928e1a1bebf83412f', class: "label-container" }, h("ic-typography", { key: '5f2b615ebe87304b410b896d5b102da42ff5bcd6', variant: "h4" }, h("h3", { key: '9b33f5f102e27e4268b0edd894d8d725fd8cc5a4' }, isSlotUsed(this.el, "label") ? h("slot", { name: "label" }) : label)), !singleExpansion && (h("ic-button", { key: '1b8d8332cd10fed2eea6959f02841cb4b1586902', ref: (el) => (this.allButtonEl = el), onClick: this.handleExpanded, variant: "tertiary", "aria-label": `${this.accordionOpenBtnText()} ${accessibleButtonLabel}` }, this.accordionOpenBtnText()))), h("slot", { key: 'b93775721fd0cc7560115c6bb62824db59b2ea27' })));
+            } }, h("div", { key: '91a744e3133f6bc5acbbb8d505def4c2bfb27a95', class: "label-container" }, h("ic-typography", { key: '515632628d3b68b1c73747672888748bcb2f1f70', variant: "h4" }, h("h3", { key: 'fb82f68ba6b343d81f66355ed7d153bf877a59f9' }, isSlotUsed(this.el, "label") ? h("slot", { name: "label" }) : label)), !singleExpansion && (h("ic-button", { key: '70e5da5029b295dffbe07a2695607d479a6ad72a', ref: (el) => (this.allButtonEl = el), onClick: this.handleExpanded, variant: "tertiary", "aria-label": accessibleLabelSlotUsed
+                ? undefined
+                : `${this.accordionOpenBtnText()} ${accessibleButtonLabel}` }, this.accordionOpenBtnText(), accessibleLabelSlotUsed && (h("span", { key: '2bbf1190c1f3ad4bfd8e0095c574e9208d1895de', class: "sr-only" }, h("slot", { key: '4e94d881f2406b2dc713f562534984536b2e8aee', name: "accessibleButtonLabel" })))))), h("slot", { key: '168a33ac4f0bc53740dfcd1c15658ef9b85a912c' })));
     }
     static get is() { return "ic-accordion-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-accordion-group/ic-accordion-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"ic-accordion-group.js","sourceRoot":"","sources":["../../../src/components/ic-accordion-group/ic-accordion-group.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Method,\n  Watch,\n} from \"@stencil/core\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\nimport { isSlotUsed } from \"../../utils/helpers\";\n\nlet accordionGroupIds = 0;\n\n/**\n * @slot label - Content is placed as the accordion group title.\n */\n@Component({\n  tag: \"ic-accordion-group\",\n  styleUrl: \"ic-accordion-group.css\",\n  shadow: true,\n})\nexport class AccordionGroup {\n  private accordionGroupId = `ic-accordion-group-${accordionGroupIds++}`;\n  private allButtonEl?: HTMLIcButtonElement;\n\n  @Element() el: HTMLIcAccordionGroupElement;\n\n  @State() accordions: HTMLIcAccordionElement[];\n\n  @State() areAllAccordionsOpen: boolean;\n\n  /**\n   * The accessible button label to provide more context to the 'See all/Hide all' button for screen reader users.\n   */\n  @Prop() accessibleButtonLabel?: string = \"accordions\";\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme?: IcThemeMode = \"inherit\";\n  @Watch(\"theme\")\n  watchThemeHandler(): void {\n    this.accordions.forEach((acc) => {\n      acc.theme = this.theme;\n    });\n  }\n\n  /**\n   * If `true`, the accordion will load in an expanded state.\n   */\n  @Prop({ mutable: true }) expanded?: boolean = false;\n  @Watch(\"expanded\")\n  watchExpandedHandler() {\n    this.handleExpanded();\n  }\n\n  /**\n   * The header for the accordion group.\n   */\n  @Prop() label?: string = \"\";\n\n  /**\n   * If `true`, only one accordion will open at a time.\n   */\n  @Prop() singleExpansion?: boolean = false;\n\n  /**\n   * The size of the accordion.\n   */\n  @Prop() size?: IcSizes = \"medium\";\n\n  componentDidLoad(): void {\n    const accordionDirectChildren = (this.el as HTMLElement).children;\n    this.accordions = Array.from(accordionDirectChildren).filter(\n      (child) => child.tagName === \"IC-ACCORDION\"\n    ) as HTMLIcAccordionElement[];\n    this.linkAccordions();\n    this.accordions.forEach((acc) => {\n      acc.theme = this.theme;\n    });\n    this.accordions.forEach((acc) => {\n      acc.size = this.size;\n    });\n    if (this.expanded) {\n      this.accordions.forEach((acc) => {\n        acc.expanded = true;\n      });\n      this.setExpandedToAreAllAccordionsOpen();\n    } else {\n      this.setExpandedToAreAllAccordionsOpen();\n      this.expanded = this.areAllAccordionsOpen;\n    }\n  }\n\n  @Listen(\"accordionClicked\")\n  handleAccordionClicked(event: CustomEvent): void {\n    if (!this.singleExpansion) {\n      // 'See all' should be visible until all accordions are open, then 'Hide all' should be visible\n      this.setExpandedToAreAllAccordionsOpen();\n    } else {\n      this.accordions.forEach((acc) => {\n        if (acc.expanded && event.detail.id !== acc.id) {\n          acc.expanded = false;\n        }\n      });\n    }\n  }\n\n  /**\n   * Sets the focus on first focusable element in the accordion group. If the \"See/Hide all\" button is present, it will be focused.\n   * Otherwise, the first accordion will be focused.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    const focusEl = this.singleExpansion\n      ? this.accordions[0]\n      : this.allButtonEl;\n    focusEl?.setFocus();\n  }\n\n  private handleExpanded = () => {\n    if (this.areAllAccordionsOpen) {\n      this.expanded = false;\n      this.accordions.forEach((acc) => {\n        acc.expanded = this.expanded;\n      });\n    } else {\n      this.expanded = true;\n      this.accordions.forEach((acc) => {\n        acc.expanded = this.expanded;\n      });\n    }\n    this.setExpandedToAreAllAccordionsOpen();\n  };\n\n  private linkAccordions = () => {\n    this.accordions.forEach((accordion) => {\n      accordion.setAttribute(\"context-id\", this.accordionGroupId);\n    });\n  };\n\n  private setExpandedToAreAllAccordionsOpen = () => {\n    this.areAllAccordionsOpen = this.accordions.every(\n      (accordion) => !!accordion.expanded\n    );\n  };\n\n  private accordionOpenBtnText = () => {\n    return !this.areAllAccordionsOpen ? \"See all\" : \"Hide all\";\n  };\n\n  render() {\n    const { size, label, singleExpansion, accessibleButtonLabel, theme } = this;\n    return (\n      <Host\n        context-id={this.accordionGroupId}\n        class={{\n          [`ic-accordion-group-${size}`]: true,\n          [\"ic-accordion-group\"]: true,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <div class=\"label-container\">\n          <ic-typography variant=\"h4\">\n            <h3>\n              {isSlotUsed(this.el, \"label\") ? <slot name=\"label\" /> : label}\n            </h3>\n          </ic-typography>\n          {!singleExpansion && (\n            <ic-button\n              ref={(el) => (this.allButtonEl = el)}\n              onClick={this.handleExpanded}\n              variant=\"tertiary\"\n              aria-label={`${this.accordionOpenBtnText()} ${accessibleButtonLabel}`}\n            >\n              {this.accordionOpenBtnText()}\n            </ic-button>\n          )}\n        </div>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"ic-accordion-group.js","sourceRoot":"","sources":["../../../src/components/ic-accordion-group/ic-accordion-group.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Element,\n  h,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Method,\n  Watch,\n} from \"@stencil/core\";\nimport { IcSizes, IcThemeMode } from \"../../utils/types\";\nimport { isSlotUsed } from \"../../utils/helpers\";\n\nlet accordionGroupIds = 0;\n\n/**\n * @slot label - Content is placed as the accordion group title.\n * @slot accessibleButtonLabel - Content is placed as the accessible label for the 'See all/Hide all' button for screen reader users. If this slot is not used, the `accessibleButtonLabel` prop will be used as the accessible label instead.\n */\n@Component({\n  tag: \"ic-accordion-group\",\n  styleUrl: \"ic-accordion-group.css\",\n  shadow: true,\n})\nexport class AccordionGroup {\n  private accordionGroupId = `ic-accordion-group-${accordionGroupIds++}`;\n  private allButtonEl?: HTMLIcButtonElement;\n\n  @Element() el: HTMLIcAccordionGroupElement;\n\n  @State() accordions: HTMLIcAccordionElement[];\n\n  @State() areAllAccordionsOpen: boolean;\n\n  /**\n   * The accessible button label to provide more context to the 'See all/Hide all' button for screen reader users.\n   */\n  @Prop() accessibleButtonLabel?: string = \"accordions\";\n\n  /**\n   * Sets the theme color to the dark or light theme color. \"inherit\" will set the color based on the system settings or ic-theme component.\n   */\n  @Prop() theme?: IcThemeMode = \"inherit\";\n  @Watch(\"theme\")\n  watchThemeHandler(): void {\n    this.accordions.forEach((acc) => {\n      acc.theme = this.theme;\n    });\n  }\n\n  /**\n   * If `true`, the accordion will load in an expanded state.\n   */\n  @Prop({ mutable: true }) expanded?: boolean = false;\n  @Watch(\"expanded\")\n  watchExpandedHandler() {\n    this.handleExpanded();\n  }\n\n  /**\n   * The header for the accordion group.\n   */\n  @Prop() label?: string = \"\";\n\n  /**\n   * If `true`, only one accordion will open at a time.\n   */\n  @Prop() singleExpansion?: boolean = false;\n\n  /**\n   * The size of the accordion.\n   */\n  @Prop() size?: IcSizes = \"medium\";\n\n  componentDidLoad(): void {\n    const accordionDirectChildren = (this.el as HTMLElement).children;\n    this.accordions = Array.from(accordionDirectChildren).filter(\n      (child) => child.tagName === \"IC-ACCORDION\"\n    ) as HTMLIcAccordionElement[];\n    this.linkAccordions();\n    this.accordions.forEach((acc) => {\n      acc.theme = this.theme;\n    });\n    this.accordions.forEach((acc) => {\n      acc.size = this.size;\n    });\n    if (this.expanded) {\n      this.accordions.forEach((acc) => {\n        acc.expanded = true;\n      });\n      this.setExpandedToAreAllAccordionsOpen();\n    } else {\n      this.setExpandedToAreAllAccordionsOpen();\n      this.expanded = this.areAllAccordionsOpen;\n    }\n  }\n\n  @Listen(\"accordionClicked\")\n  handleAccordionClicked(event: CustomEvent): void {\n    if (!this.singleExpansion) {\n      // 'See all' should be visible until all accordions are open, then 'Hide all' should be visible\n      this.setExpandedToAreAllAccordionsOpen();\n    } else {\n      this.accordions.forEach((acc) => {\n        if (acc.expanded && event.detail.id !== acc.id) {\n          acc.expanded = false;\n        }\n      });\n    }\n  }\n\n  /**\n   * Sets the focus on first focusable element in the accordion group. If the \"See/Hide all\" button is present, it will be focused.\n   * Otherwise, the first accordion will be focused.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    const focusEl = this.singleExpansion\n      ? this.accordions[0]\n      : this.allButtonEl;\n    focusEl?.setFocus();\n  }\n\n  private handleExpanded = () => {\n    if (this.areAllAccordionsOpen) {\n      this.expanded = false;\n      this.accordions.forEach((acc) => {\n        acc.expanded = this.expanded;\n      });\n    } else {\n      this.expanded = true;\n      this.accordions.forEach((acc) => {\n        acc.expanded = this.expanded;\n      });\n    }\n    this.setExpandedToAreAllAccordionsOpen();\n  };\n\n  private linkAccordions = () => {\n    this.accordions.forEach((accordion) => {\n      accordion.setAttribute(\"context-id\", this.accordionGroupId);\n    });\n  };\n\n  private setExpandedToAreAllAccordionsOpen = () => {\n    this.areAllAccordionsOpen = this.accordions.every(\n      (accordion) => !!accordion.expanded\n    );\n  };\n\n  private accordionOpenBtnText = () => {\n    return !this.areAllAccordionsOpen ? \"See all\" : \"Hide all\";\n  };\n\n  render() {\n    const { size, label, singleExpansion, accessibleButtonLabel, theme } = this;\n    const accessibleLabelSlotUsed = isSlotUsed(\n      this.el,\n      \"accessibleButtonLabel\"\n    );\n    return (\n      <Host\n        context-id={this.accordionGroupId}\n        class={{\n          [`ic-accordion-group-${size}`]: true,\n          [\"ic-accordion-group\"]: true,\n          [`ic-theme-${theme}`]: theme !== \"inherit\",\n        }}\n      >\n        <div class=\"label-container\">\n          <ic-typography variant=\"h4\">\n            <h3>\n              {isSlotUsed(this.el, \"label\") ? <slot name=\"label\" /> : label}\n            </h3>\n          </ic-typography>\n          {!singleExpansion && (\n            <ic-button\n              ref={(el) => (this.allButtonEl = el)}\n              onClick={this.handleExpanded}\n              variant=\"tertiary\"\n              aria-label={\n                accessibleLabelSlotUsed\n                  ? undefined\n                  : `${this.accordionOpenBtnText()} ${accessibleButtonLabel}`\n              }\n            >\n              {this.accordionOpenBtnText()}\n              {accessibleLabelSlotUsed && (\n                <span class=\"sr-only\">\n                  <slot name=\"accessibleButtonLabel\" />\n                </span>\n              )}\n            </ic-button>\n          )}\n        </div>\n\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/ic-action-chip/ic-action-chip.js

@@ -87,16 +87,16 @@ export class ActionChip {
                 rel,
                 target,
             };
-        return (h(Host, { key: '2c65125774e7ce4fc9cb0d447e0ebff984caad5a', class: {
+        return (h(Host, { key: '095711b5abc9fe760f9c14245a1ce327696818a2', class: {
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h(TagType, Object.assign({ key: 'af57a8bb5d0b29b4ff1023747bc0d4ca3824af73', class: {
+            } }, h(TagType, Object.assign({ key: '8b352bcd66bb27be4eff90246371eac0bfa266cb', class: {
                 chip: true,
                 disabled: isButtonElement && disabled,
                 monochrome,
                 "non-transparent": variant === "outlined" && !transparentBackground,
                 [`${size}`]: true,
                 [`${variant}`]: true,
-            }, ref: (el) => (this.chipEl = el) }, chipAttrs), isSlotUsed(this.el, "icon") && (h("div", { key: '755a2318e2968614423a5b88b2831e259caef7e3', class: "icon" }, h("slot", { key: '4137b19dc8fc2be40a7ccf696f820e30c1b668b0', name: "icon" }))), h("ic-typography", { key: '2b8615d3bce8b9b0d4b5e89cceac2b97b8d95105', variant: "label", class: { label: true, "in-ag-grid": isElInAGGrid(this.el) } }, h("span", { key: '3f5d55931b36640b30b472fcc4febecb6d502189' }, label)), !isButtonElement && target === "_blank" && (h("span", { key: 'd0c2331424af931db24f5d9fe2dc3500bf31db46', class: "open-in-new-icon", innerHTML: OpenInNew })), isSlotUsed(this.el, "badge") && h("slot", { key: 'b0451850fd5b42f4120b7fa6e943332d64e52690', name: "badge" }))));
+            }, ref: (el) => (this.chipEl = el) }, chipAttrs), isSlotUsed(this.el, "icon") && (h("div", { key: 'cac34c4420e0b92337b4421088389e79dc2d3e78', class: "icon" }, h("slot", { key: 'fbbdfcf2089a6a31785a33ddc74c66ad433ebe4c', name: "icon" }))), h("ic-typography", { key: '867dfd5c7651cfbce4b5c3ee439fe1a3e78dbecd', variant: "label", class: { label: true, "in-ag-grid": isElInAGGrid(this.el) } }, h("span", { key: 'ce77ac12d3e9a09b409b2ff6bffd1aa09747fad9' }, label)), !isButtonElement && target === "_blank" && (h("span", { key: '994fcfd7c5be9cba20489792f4ec8a26f481e4cb', class: "open-in-new-icon", innerHTML: OpenInNew })), isSlotUsed(this.el, "badge") && h("slot", { key: '7883e63e166ee3e39d70cbe6110fd1fe6f0b63a5', name: "badge" }))));
     }
     static get is() { return "ic-action-chip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/ic-back-to-top/ic-back-to-top.css

@@ -547,3 +547,10 @@ ic-button.by-footer {
     padding-left: calc(var(--ic-space-xs) - var(--ic-space-xxxs));
   }
 }
+
+@media (prefers-reduced-motion: reduce) {
+  ic-button,
+  ic-button.show {
+    transition: none;
+  }
+}

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

@@ -131,16 +131,16 @@ export class BackToTop {
         const btnVariant = variant === "icon" ? "icon-secondary" : "secondary";
         const size = variant === "icon" ? "large" : "medium";
         const label = variant === "icon" ? "" : backToTopLabel;
-        return (h(Host, { key: '2c281b238cd14437e120084c35ae86089cd49fe9', class: {
+        return (h(Host, { key: '849c28a0432db633c5f6cc18e93ab184ef2366b3', class: {
                 [`ic-theme-${this.theme}`]: this.theme !== "inherit",
                 [`ic-back-to-top-${this.position}`]: true,
                 [`ic-back-to-top-variant-icon`]: variant === "icon",
-            } }, h("ic-button", { key: '15bcf38bcc837a9723e5af644551b24845d4cbbb', "aria-label": backToTopLabel, variant: btnVariant, size: size, onClick: this.handleClick, class: {
+            } }, h("ic-button", { key: '847930311aa52347cabcc2c8cc13a8806524722e', "aria-label": backToTopLabel, variant: btnVariant, size: size, onClick: this.handleClick, class: {
                 ["offset-banner"]: bannerOffset,
                 ["show"]: !targetElVisible,
                 ["by-footer"]: footerVisible,
                 ["icon-only"]: variant === "icon",
-            }, theme: this.theme }, h("span", { key: '4d6d2e0390eda5cd6db7f26bd597db7fef9c81c0', class: "ic-back-to-top-icon", innerHTML: ArrowUpward }), label)));
+            }, theme: this.theme }, h("span", { key: 'a8f92084d51b98b034ebb0379c291a169f42f88b', class: "ic-back-to-top-icon", innerHTML: ArrowUpward }), label)));
     }
     static get is() { return "ic-back-to-top"; }
     static get encapsulation() { return "shadow"; }

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

@@ -214,3 +214,9 @@
     transform: scale(0);
   }
 }
+
+@media (prefers-reduced-motion: reduce) {
+  :host(.ic-badge-hide) {
+    transition: none;
+  }
+}

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

@@ -154,7 +154,7 @@ export class Badge {
     }
     render() {
         const { ariaLabel, el, foregroundColour, getLabel, position, size, label, type, variant, visible, theme, } = this;
-        return (h(Host, { key: '0a7aab65643b79886f4134e59c195e33d8340e43', class: {
+        return (h(Host, { key: '80362128f0009037af8ecb10ddbe465ed847044b', class: {
                 [`ic-badge-${position}`]: true,
                 [`ic-badge-${size}`]: true,
                 [`ic-badge-${variant}`]: true,
@@ -162,7 +162,7 @@ export class Badge {
                 [`ic-badge-foreground-${foregroundColour}`]: foregroundColour !== null && variant === "custom",
                 [`${visible ? "ic-badge-show" : "ic-badge-hide"}`]: true,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            }, id: el.id || null, "aria-label": ariaLabel, role: "status" }, type === "icon" && h("slot", { key: 'e9684e9e92784e628f984a4980b512268565de0f', name: "badge-icon" }), type === "text" && label && (h("ic-typography", { key: 'f02681caadcec768afe078a9fe94aa1fe8314895', variant: size === "small" ? "badge-small" : "badge" }, getLabel())), type === "dot" && h("span", { key: '5065cf6a359ef976dac4c914bca25e8999f54ae1', class: "sr-only" }, "badge")));
+            }, id: el.id || null, "aria-label": ariaLabel, role: "status" }, type === "icon" && h("slot", { key: '4df4a2ab27b18a2247bc047d940b16378451e8ae', name: "badge-icon" }), type === "text" && label && (h("ic-typography", { key: '56b2205ae5e36f5af3e60f0b76866c696d06eb7a', variant: size === "small" ? "badge-small" : "badge" }, getLabel())), type === "dot" && h("span", { key: '3a12c77ef89a454564358588908b31b69e04f500', class: "sr-only" }, "badge")));
     }
     static get is() { return "ic-badge"; }
     static get encapsulation() { return "shadow"; }

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

@@ -88,12 +88,12 @@ export class Breadcrumb {
     render() {
         const { current, href, monochrome, pageTitle, showBackIcon, theme } = this;
         const describedById = `${pageTitle === null || pageTitle === void 0 ? void 0 : pageTitle.toLowerCase().replace(" ", "-")}-describedby`;
-        return (h(Host, { key: '35d95efd65cb713a1b9b614aa7162a328f1fd5bd', class: {
+        return (h(Host, { key: 'a7096975249f31144ffd6cd3c4cf6953169118ee', class: {
                 "ic-breadcrumb-back": showBackIcon,
                 "ic-breadcrumb-monochrome": monochrome,
                 [`ic-theme-${theme}`]: theme !== "inherit",
                 [`ic-breadcrumb-aria-current-page`]: current,
-            }, "aria-current": current && "page", role: "listitem" }, h("div", { key: '126bfcb069004244fc0beb4b3f5e3dab652a4057', class: "breadcrumb" }, h("span", { key: '24c4bd1741b5a65b8d348280bd3c680db15edcfc', innerHTML: chevronIcon, class: "chevron", "aria-hidden": "true" }), showBackIcon && (h("span", { key: '501ae0ebd6ce1b77026ab8c447f59abf00db7c73', id: describedById, class: "hide" }, `Back to ${pageTitle}`)), !href ? (h("div", { class: "slotted-link-container" }, showBackIcon && this.renderBackIcon(), h("span", { class: "link-wrapper" }, h("slot", null)))) : current ? (h("span", { class: "current-page-container" }, isSlotUsed(this.el, "icon") && h("slot", { name: "icon" }), pageTitle)) : (h("ic-link", { theme: theme, monochrome: monochrome, href: href, class: "breadcrumb-link", "aria-describedby": showBackIcon && describedById }, showBackIcon && this.renderBackIcon(), isSlotUsed(this.el, "icon") && h("slot", { name: "icon" }), pageTitle)))));
+            }, "aria-current": current && "page", role: "listitem" }, h("div", { key: '8b8254900371f6888fcbf7c9ef800acdb6804dfb', class: "breadcrumb" }, h("span", { key: '1a0159b54b3f432098ba881c6563eaf563916872', innerHTML: chevronIcon, class: "chevron", "aria-hidden": "true" }), showBackIcon && (h("span", { key: '512f88714836b57162c1920cbea4eb1203f7573b', id: describedById, class: "hide" }, `Back to ${pageTitle}`)), !href ? (h("div", { class: "slotted-link-container" }, showBackIcon && this.renderBackIcon(), h("span", { class: "link-wrapper" }, h("slot", null)))) : current ? (h("span", { class: "current-page-container" }, isSlotUsed(this.el, "icon") && h("slot", { name: "icon" }), pageTitle)) : (h("ic-link", { theme: theme, monochrome: monochrome, href: href, class: "breadcrumb-link", "aria-describedby": showBackIcon && describedById }, showBackIcon && this.renderBackIcon(), isSlotUsed(this.el, "icon") && h("slot", { name: "icon" }), pageTitle)))));
     }
     static get is() { return "ic-breadcrumb"; }
     static get encapsulation() { return "shadow"; }

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

@@ -36,3 +36,11 @@
 :host(.ic-breadcrumb-group-collapsed) ol ::slotted(ic-breadcrumb.fade) {
   opacity: 1;
 }
+
+@media (prefers-reduced-motion: reduce) {
+  :host(.ic-breadcrumb-group-collapsed)
+    ol
+    ::slotted(ic-breadcrumb.visuallyhidden) {
+    transition: none;
+  }
+}

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

@@ -212,11 +212,11 @@ export class BreadcrumbGroup {
     }
     render() {
         const { backBreadcrumbOnly, collapsed, theme } = this;
-        return (h(Host, { key: 'c2828a2c275ac4341d26054b2de81bd93591a783', class: {
+        return (h(Host, { key: '6bee18e1a84707b5d493149d23094af6a0fb1be8', class: {
                 "ic-breadcrumb-group-back": backBreadcrumbOnly,
                 "ic-breadcrumb-group-collapsed": collapsed,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, h("nav", { key: '44c0b96801da788bbfa96b138348d05214270b60', "aria-label": "breadcrumbs" }, h("ol", { key: '1f0549af4262e1f3181168dce91b7af6c6820dc3' }, h("slot", { key: '8603a718735d00643bedf8b3b3fed554234d710e' })))));
+            } }, h("nav", { key: '144ad11cead96e18ae62eba8fc2dead82e188854', "aria-label": "breadcrumbs" }, h("ol", { key: 'c101766f5e9b0e5d9a5aaebd5d0d8eda63ffc9ea' }, h("slot", { key: 'c761cdbb01472d0d8c2550254063b59fa714f722' })))));
     }
     static get is() { return "ic-breadcrumb-group"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1654,6 +1654,13 @@ slot[name="router-item"]::slotted(a) {
   }
 }
 
+@media (prefers-reduced-motion: reduce) {
+  .button,
+  ::slotted(a) {
+    transition: none;
+  }
+}
+
 /** Pagination **/
 
 :host(.flip) ::slotted(svg) {

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

@@ -398,7 +398,7 @@ export class Button {
                 variant !== "destructive" && (h("span", { class: dropdownExpanded
                     ? "dropdown-expanded"
                     : "arrow-dropdown", innerHTML: arrowDropdown }))))));
-        return (h(Host, { key: '742d4ee3daabdb12a7ef9f30803ed01a49414849', class: {
+        return (h(Host, { key: '9af3124fa3bb001b9b744b4df20d0e107f865df1', class: {
                 "ic-button-disabled": disabled && !loading,
                 "ic-button-full-width": fullWidth,
                 "ic-button-loading": loading,
@@ -414,7 +414,7 @@ export class Button {
                 monochrome,
                 "top-icon": isSlotUsed(this.el, "top-icon"),
                 "with-badge": isSlotUsed(this.el, "badge"),
-            }, onClick: handleClick, onKeyDown: handleKeyDown, "aria-owns": ariaOwnsId, "aria-controls": ariaControlsId, "aria-expanded": dropdown && `${dropdownExpanded}` }, hasTooltip && (h("ic-tooltip", { key: '6526412bc27a6725714bc73f671e76d8cf30d28e', id: describedby, label: title || ariaLabel, target: buttonId, placement: tooltipPlacement, fixedPositioning: tooltipFixedPositioning, silent: isIconVariant() && !!ariaLabel }, h(ButtonContent, { key: 'f7df2578a6539a40373d599788d1097e2bcaa5a5' }))), isSlotUsed(this.el, "badge") && h("slot", { key: 'b790a201f342345bafe97cfd19bd53d7ffd1811c', name: "badge" }), !hasTooltip && h(ButtonContent, { key: 'fa2a22102dbd45b0c4c02a7608fc913bc50f641d' })));
+            }, onClick: handleClick, onKeyDown: handleKeyDown, "aria-owns": ariaOwnsId, "aria-controls": ariaControlsId, "aria-expanded": dropdown && `${dropdownExpanded}` }, hasTooltip && (h("ic-tooltip", { key: '533f8aac9579f16eaae0a167a683f7c42973de95', id: describedby, label: title || ariaLabel, target: buttonId, placement: tooltipPlacement, fixedPositioning: tooltipFixedPositioning, silent: isIconVariant() && !!ariaLabel }, h(ButtonContent, { key: '67502a4253722031847e36ae3275ca48c7d01bd4' }))), isSlotUsed(this.el, "badge") && h("slot", { key: 'e4e5081c6f415f0447ae43398fd11fcf51a426f3', name: "badge" }), !hasTooltip && h(ButtonContent, { key: '5185de2240ddaddbc0bb35bdab51bc63e91492a5' })));
     }
     static get is() { return "ic-button"; }
     static get encapsulation() { return "shadow"; }