npm - @ukic/web-components - Versions diffs - 2.6.0 → 2.8.0 - Mend

@ukic/web-components 2.6.0 → 2.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (509) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-accordion.js","sourceRoot":"","sources":["../../../src/components/ic-accordion/ic-accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n Host,\n Watch,\n Method,\n} from \"@stencil/core\";\nimport { isSlotUsed } from \"../../utils/helpers\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport { IcThemeForeground, IcSizes } from \"../../utils/types\";\n\nlet accordionIds = 0;\n\n/*\n @slot heading - Content is placed as the accordion heading.\n * @slot icon - Content is placed to the left of the heading.\n /\n\n@Component({\n tag: \"ic-accordion\",\n styleUrl: \"ic-accordion.css\",\n shadow: true,\n})\nexport class Accordion {\n private accordionId = `ic-accordion-${accordionIds++}`;\n private expandedContentEl: HTMLDivElement;\n private accordionBtnHeading: HTMLButtonElement;\n\n @Element() el: HTMLIcAccordionElement;\n /\n @internal Determines whether the light or dark variant of the accordion should be displayed.\n /\n @Prop() appearance?: IcThemeForeground = \"default\";\n\n /\n If `true`, the accordion will be disabled.\n /\n @Prop() disabled?: boolean = false;\n\n /\n If `true`, the accordion appears expanded.\n /\n @Prop({ mutable: true }) expanded: boolean = false;\n\n /\n The section header outlining section content.\n /\n @Prop() heading?: string = \"\";\n\n /\n The main body message of the accordion.\n /\n @Prop() message?: string = \"\";\n\n /\n The size of the accordion.\n /\n @Prop() size?: IcSizes = \"default\";\n\n /\n @internal Emitted when accordion is clicked.\n /\n @Event() accordionClicked: EventEmitter<{ id: string }>;\n\n // Every time expanded is set via toggleExpanded or accordionGroup, animate to open or close\n @Watch(\"expanded\")\n handleExpandedWatch(): void {\n this.animateExpandedContent();\n }\n\n /\n Sets focus on accordion heading.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.accordionBtnHeading) {\n this.accordionBtnHeading.focus();\n }\n }\n\n disconnectedCallback(): void {\n if (this.expandedContentEl) {\n this.expandedContentEl.removeEventListener(\n \"transitionend\",\n (e) => this.setExpandedContentStyle(e, this.expandedContentEl),\n true\n );\n this.expandedContentEl.removeEventListener(\n \"transitionend\",\n (e) => this.hideExpandedContent(e, this.expandedContentEl),\n true\n );\n }\n }\n\n componentDidLoad(): void {\n // So accordion opens by default if expanded set to true\n if (this.expanded) {\n this.expandedContentEl.style.height = \"auto\";\n }\n }\n\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n this.accordionClicked.emit({ id: this.accordionId });\n };\n\n // Set accordion animation\n private setAccordionAnimation = (\n el: HTMLElement,\n duration: string,\n property: string,\n delay: string\n ) => {\n el.style.transitionDuration = `${duration}ms`;\n el.style.transitionProperty = property;\n el.style.transitionDelay = delay;\n };\n\n private setExpandedContentStyle = (\n ev: TransitionEvent,\n expandedContent: HTMLDivElement\n ) => {\n if (ev.propertyName === \"height\" && expandedContent.clientHeight > 0) {\n expandedContent.classList.add(\"expanded-content-opened\");\n expandedContent.style.height = \"auto\";\n }\n };\n\n private hideExpandedContent = (\n ev: TransitionEvent,\n expandedContent: HTMLDivElement\n ) => {\n if (ev.propertyName === \"height\" && expandedContent.clientHeight === 0) {\n expandedContent.style.setProperty(\n \"--ic-expanded-content-visiblity\",\n \"hidden\"\n );\n }\n };\n\n private animateExpandedContent = () => {\n const elementHeight = this.expandedContentEl.scrollHeight;\n if (elementHeight > 0 && this.expanded) {\n this.expandedContentEl.style.setProperty(\n \"--ic-expanded-content-visiblity\",\n \"visible\"\n );\n this.expandedContentEl.style.height = `${elementHeight}px`;\n this.setAccordionAnimation(\n this.expandedContentEl,\n \"300\",\n \"height\",\n \"ease-out\"\n );\n\n this.expandedContentEl.addEventListener(\n \"transitionend\",\n (e: TransitionEvent) => {\n this.setExpandedContentStyle(e, this.expandedContentEl);\n }\n );\n } else if (!this.expanded) {\n this.expandedContentEl.style.height = `${this.expandedContentEl.scrollHeight}px`;\n if (this.expandedContentEl.scrollHeight > 0 && !this.expanded) {\n this.expandedContentEl.style.height = \"0\";\n this.setAccordionAnimation(\n this.expandedContentEl,\n \"300\",\n \"height\",\n \"ease-in\"\n );\n this.expandedContentEl.classList.remove(\"expanded-content-opened\");\n }\n this.expandedContentEl.addEventListener(\"transitionend\", (e) => {\n this.hideExpandedContent(e, this.expandedContentEl);\n });\n }\n };\n\n render() {\n const { appearance, size, disabled, expanded } = this;\n return (\n <Host\n id={this.accordionId}\n class={{\n [`${appearance}`]: true,\n [\"disabled\"]: disabled,\n }}\n aria-disabled={disabled ? \"true\" : \"false\"}\n >\n <button\n ref={(el) => (this.accordionBtnHeading = el)}\n id={`${this.accordionId}-button`}\n disabled={disabled}\n tabindex={disabled ? -1 : 0}\n class={{\n [`${size}`]: true,\n [\"section-button\"]: true,\n [\"section-button-open\"]: expanded && !disabled,\n }}\n aria-expanded={`${expanded}`}\n aria-controls=\"expanded-content-area\"\n onClick={this.toggleExpanded}\n >\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography variant=\"subtitle-large\" class=\"section-header\">\n {isSlotUsed(this.el, \"heading\") ? (\n <slot name=\"heading\" />\n ) : (\n this.heading\n )}\n </ic-typography>\n <span\n class={{\n [\"expand-chevron\"]: true,\n [\"content-expanded-chevron\"]: expanded && !disabled,\n }}\n aria-hidden=\"true\"\n innerHTML={chevronIcon}\n />\n </button>\n <div\n class={{\n [\"expanded-content\"]: true,\n }}\n aria-labelledby={`${this.accordionId}-button`}\n role=\"region\"\n aria-hidden={`${!expanded}`}\n id=\"expanded-content-area\"\n ref={(el) => (this.expandedContentEl = el)}\n >\n <div class=\"expanded-content-inner\">\n <slot />\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-accordion.js","sourceRoot":"","sources":["../../../src/components/ic-accordion/ic-accordion.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n Host,\n Watch,\n Method,\n} from \"@stencil/core\";\nimport { isSlotUsed } from \"../../utils/helpers\";\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\nimport { IcThemeForeground, IcSizes } from \"../../utils/types\";\n\nlet accordionIds = 0;\n\n/*\n @slot heading - Content is placed as the accordion heading.\n * @slot icon - Content is placed to the left of the heading.\n /\n\n@Component({\n tag: \"ic-accordion\",\n styleUrl: \"ic-accordion.css\",\n shadow: true,\n})\nexport class Accordion {\n private accordionId = `ic-accordion-${accordionIds++}`;\n private expandedContentEl: HTMLDivElement;\n private accordionBtnHeading: HTMLButtonElement;\n private CONTENT_VISIBILITY_PROPERTY = \"--ic-expanded-content-visiblity\";\n\n @Element() el: HTMLIcAccordionElement;\n /\n @internal Determines whether the light or dark variant of the accordion should be displayed.\n /\n @Prop() appearance?: IcThemeForeground = \"default\";\n\n /\n If `true`, the accordion will be disabled.\n /\n @Prop() disabled?: boolean = false;\n\n /\n If `true`, the accordion appears expanded.\n /\n @Prop({ mutable: true }) expanded: boolean = false;\n\n /\n The section header outlining section content.\n /\n @Prop() heading?: string = \"\";\n\n /\n The main body message of the accordion.\n /\n @Prop() message?: string = \"\";\n\n /\n The size of the accordion.\n /\n @Prop() size?: IcSizes = \"default\";\n\n /\n @internal Emitted when accordion is clicked.\n /\n @Event() accordionClicked: EventEmitter<{ id: string }>;\n\n // Every time expanded is set via toggleExpanded or accordionGroup, animate to open or close\n @Watch(\"expanded\")\n handleExpandedWatch(): void {\n this.animateExpandedContent();\n }\n\n /\n Sets focus on accordion heading.\n */\n @Method()\n async setFocus(): Promise<void> {\n if (this.accordionBtnHeading) {\n this.accordionBtnHeading.focus();\n }\n }\n\n disconnectedCallback(): void {\n if (this.expandedContentEl) {\n this.expandedContentEl.removeEventListener(\n \"transitionend\",\n (e) => this.setExpandedContentStyle(e, this.expandedContentEl),\n true\n );\n this.expandedContentEl.removeEventListener(\n \"transitionend\",\n (e) => this.hideExpandedContent(e, this.expandedContentEl),\n true\n );\n }\n }\n\n componentDidLoad(): void {\n // So accordion opens by default if expanded set to true\n if (this.expanded) {\n this.expandedContentEl.style.height = \"auto\";\n this.expandedContentEl.style.setProperty(\n this.CONTENT_VISIBILITY_PROPERTY,\n \"visible\"\n );\n }\n }\n\n private toggleExpanded = (): void => {\n this.expanded = !this.expanded;\n this.accordionClicked.emit({ id: this.accordionId });\n };\n\n // Set accordion animation\n private setAccordionAnimation = (\n el: HTMLElement,\n duration: string,\n property: string,\n delay: string\n ) => {\n el.style.transitionDuration = `${duration}ms`;\n el.style.transitionProperty = property;\n el.style.transitionDelay = delay;\n };\n\n private setExpandedContentStyle = (\n ev: TransitionEvent,\n expandedContent: HTMLDivElement\n ) => {\n if (ev.propertyName === \"height\" && expandedContent.clientHeight > 0) {\n expandedContent.classList.add(\"expanded-content-opened\");\n expandedContent.style.height = \"auto\";\n }\n };\n\n private hideExpandedContent = (\n ev: TransitionEvent,\n expandedContent: HTMLDivElement\n ) => {\n if (ev.propertyName === \"height\" && expandedContent.clientHeight === 0) {\n expandedContent.style.setProperty(\n this.CONTENT_VISIBILITY_PROPERTY,\n \"hidden\"\n );\n }\n };\n\n private animateExpandedContent = () => {\n const elementHeight = this.expandedContentEl.scrollHeight;\n if (elementHeight > 0 && this.expanded) {\n this.expandedContentEl.style.setProperty(\n this.CONTENT_VISIBILITY_PROPERTY,\n \"visible\"\n );\n this.expandedContentEl.style.height = `${elementHeight}px`;\n this.setAccordionAnimation(\n this.expandedContentEl,\n \"300\",\n \"height\",\n \"ease-out\"\n );\n\n this.expandedContentEl.addEventListener(\n \"transitionend\",\n (e: TransitionEvent) => {\n this.setExpandedContentStyle(e, this.expandedContentEl);\n }\n );\n } else if (!this.expanded) {\n this.expandedContentEl.style.height = `${this.expandedContentEl.scrollHeight}px`;\n if (this.expandedContentEl.scrollHeight > 0 && !this.expanded) {\n this.expandedContentEl.style.height = \"0\";\n this.setAccordionAnimation(\n this.expandedContentEl,\n \"300\",\n \"height\",\n \"ease-in\"\n );\n this.expandedContentEl.classList.remove(\"expanded-content-opened\");\n }\n this.expandedContentEl.addEventListener(\"transitionend\", (e) => {\n this.hideExpandedContent(e, this.expandedContentEl);\n });\n }\n };\n\n render() {\n const { appearance, size, disabled, expanded } = this;\n return (\n <Host\n id={this.accordionId}\n class={{\n [`${appearance}`]: true,\n [\"disabled\"]: disabled,\n }}\n aria-disabled={disabled ? \"true\" : \"false\"}\n >\n <button\n ref={(el) => (this.accordionBtnHeading = el)}\n id={`${this.accordionId}-button`}\n disabled={disabled}\n tabindex={disabled ? -1 : 0}\n class={{\n [`${size}`]: true,\n [\"section-button\"]: true,\n [\"section-button-open\"]: expanded && !disabled,\n }}\n aria-expanded={`${expanded}`}\n aria-controls=\"expanded-content-area\"\n onClick={this.toggleExpanded}\n >\n {isSlotUsed(this.el, \"icon\") && (\n <div class=\"icon-container\">\n <slot name=\"icon\" />\n </div>\n )}\n <ic-typography variant=\"subtitle-large\" class=\"section-header\">\n {isSlotUsed(this.el, \"heading\") ? (\n <slot name=\"heading\" />\n ) : (\n this.heading\n )}\n </ic-typography>\n <span\n class={{\n [\"expand-chevron\"]: true,\n [\"content-expanded-chevron\"]: expanded && !disabled,\n }}\n aria-hidden=\"true\"\n innerHTML={chevronIcon}\n />\n </button>\n <div\n class={{\n [\"expanded-content\"]: true,\n }}\n aria-labelledby={`${this.accordionId}-button`}\n role=\"region\"\n aria-hidden={`${!expanded}`}\n id=\"expanded-content-area\"\n ref={(el) => (this.expandedContentEl = el)}\n >\n <div class=\"expanded-content-inner\">\n <slot />\n </div>\n </div>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ic-accordion-group/test/basic/ic-accordion-group.e2e.js CHANGED Viewed

@@ -1,4 +1,7 @@
 import { newE2EPage } from "@stencil/core/testing";
+beforeAll(() => {
+  jest.spyOn(console, "warn").mockImplementation(jest.fn());
+});
 describe("ic-accordion-group", () => {
   it("button text should change to 'See all' when expanded accordion clicked", async () => {
     const page = await newE2EPage();

package/dist/collection/components/ic-accordion-group/test/basic/ic-accordion-group.e2e.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-accordion-group.e2e.js","sourceRoot":"","sources":["../../../../../src/components/ic-accordion-group/test/basic/ic-accordion-group.e2e.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;EAClC,EAAE,CAAC,wEAAwE,EAAE,KAAK,IAAI,EAAE;IACtF,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CACnB;;4BAEsB,CACvB,CAAC;IACF,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,kCAAkC,CAAC,CAAC;IACtE,IAAI,IAAI,GAAG,MAAM,SAAS,CAAC,SAAS,CAAC;IAErC,MAAM,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IAC9B,MAAM,SAAS,CAAC,KAAK,EAAE,CAAC;IACxB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAC5B,IAAI,GAAG,MAAM,SAAS,CAAC,SAAS,CAAC;IACjC,MAAM,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;EAC/B,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,8CAA8C,EAAE,KAAK,IAAI,EAAE;IAC5D,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CACnB;;6BAEuB,CACxB,CAAC;IAEF,MAAM,SAAS,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,kCAAkC,CAAC,CAAC;IAEtE,MAAM,SAAS,CAAC,KAAK,EAAE,CAAC;IACxB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,iBAAiB,GAAG,MAAM,IAAI,CAAC,IAAI,CACvC,uCAAuC,CACxC,CAAC;IAEF,MAAM,CAAC,iBAAiB,CAAC,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;EAC3C,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;IAC1D,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC;;;;;;;;;;;;;KAarB,CAAC,CAAC;IAEH,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;IACtD,MAAM,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IACjC,MAAM,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IACjC,MAAM,eAAe,GAAG,MAAM,IAAI,CAAC,IAAI,CAAC,kCAAkC,CAAC,CAAC;IAE5E,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7D,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5D,MAAM,CAAC,CAAC,MAAM,eAAe,CAAC,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IAE1D,MAAM,eAAe,CAAC,KAAK,EAAE,CAAC;IAC9B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5D,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5D,MAAM,CAAC,CAAC,MAAM,eAAe,CAAC,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;IAE3D,MAAM,eAAe,CAAC,KAAK,EAAE,CAAC;IAC9B,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7D,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7D,MAAM,CAAC,CAAC,MAAM,eAAe,CAAC,CAAC,SAAS,CAAC,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;EAC5D,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,4EAA4E,EAAE,KAAK,IAAI,EAAE;IAC1F,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC;;;;;;;;;;;;;KAarB,CAAC,CAAC;IACH,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;IACtD,MAAM,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IACjC,MAAM,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IAEjC,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5D,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAE7D,MAAM,UAAU,CAAC,KAAK,EAAE,CAAC;IACzB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC7D,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EAC9D,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,4DAA4D,EAAE,KAAK,IAAI,EAAE;IAC1E,MAAM,IAAI,GAAG,MAAM,UAAU,EAAE,CAAC;IAChC,MAAM,IAAI,CAAC,UAAU,CAAC;;;;;;;;;;;;;KAarB,CAAC,CAAC;IACH,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC;IACtD,MAAM,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IACjC,MAAM,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IAEjC,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5D,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAE7D,MAAM,UAAU,CAAC,KAAK,EAAE,CAAC;IACzB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAE5B,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5D,MAAM,CAAC,MAAM,UAAU,CAAC,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EAC9D,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newE2EPage } from \"@stencil/core/testing\";\n\ndescribe(\"ic-accordion-group\", () => {\n it(\"button text should change to 'See all' when expanded accordion clicked\", async () => {\n const page = await newE2EPage();\n await page.setContent(\n `<ic-accordion-group>\n <ic-accordion expanded heading=\"Accordion 1\"></ic-accordion>\n </ic-accordion-group>`\n );\n const seeAllBtn = await page.find(\"ic-accordion-group >>> ic-button\");\n let text = await seeAllBtn.innerText;\n\n expect(text).toBe(\"Hide all\");\n await seeAllBtn.click();\n await page.waitForChanges();\n text = await seeAllBtn.innerText;\n expect(text).toBe(\"See all\");\n });\n\n it(\"should open accordion when 'See all' clicked\", async () => {\n const page = await newE2EPage();\n await page.setContent(\n `<ic-accordion-group>\n <ic-accordion></ic-accordion>\n </ic-accordion-group>`\n );\n\n const seeAllBtn = await page.find(\"ic-accordion-group >>> ic-button\");\n\n await seeAllBtn.click();\n await page.waitForChanges();\n\n const accordionExpanded = await page.find(\n \"ic-accordion >>> .section-button-open\"\n );\n\n expect(accordionExpanded).not.toBeNull();\n });\n\n it(\"should test the See all/ Hide all function\", async () => {\n const page = await newE2EPage();\n await page.setContent(`\n <ic-accordion-group group-title=\"Test heading\">\n <ic-accordion heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion heading=\"Accordion 2\" expanded>\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group> \n `);\n\n const accordions = await page.findAll(\"ic-accordion\");\n const accordion1 = accordions[0];\n const accordion2 = accordions[1];\n const accordionButton = await page.find(\"ic-accordion-group >>> ic-button\");\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(false);\n expect(await accordion2.getProperty(\"expanded\")).toBe(true);\n expect((await accordionButton).innerText).toBe(\"See all\");\n\n await accordionButton.click();\n await page.waitForChanges();\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(true);\n expect(await accordion2.getProperty(\"expanded\")).toBe(true);\n expect((await accordionButton).innerText).toBe(\"Hide all\");\n\n await accordionButton.click();\n await page.waitForChanges();\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(false);\n expect(await accordion2.getProperty(\"expanded\")).toBe(false);\n expect((await accordionButton).innerText).toBe(\"See all\");\n });\n\n it(\"should open second accordion and close first accordion on single expansion\", async () => {\n const page = await newE2EPage();\n await page.setContent(`\n <ic-accordion-group single-expansion=\"true\" group-title=\"Test heading\">\n <ic-accordion expanded heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion heading=\"Accordion 2\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group> \n `);\n const accordions = await page.findAll(\"ic-accordion\");\n const accordion1 = accordions[0];\n const accordion2 = accordions[1];\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(true);\n expect(await accordion2.getProperty(\"expanded\")).toBe(false);\n\n await accordion2.click();\n await page.waitForChanges();\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(false);\n expect(await accordion2.getProperty(\"expanded\")).toBe(true);\n });\n\n it(\"both accordions should open when single expansion is false\", async () => {\n const page = await newE2EPage();\n await page.setContent(`\n <ic-accordion-group group-title=\"Test heading\">\n <ic-accordion expanded heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion heading=\"Accordion 2\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group> \n `);\n const accordions = await page.findAll(\"ic-accordion\");\n const accordion1 = accordions[0];\n const accordion2 = accordions[1];\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(true);\n expect(await accordion2.getProperty(\"expanded\")).toBe(false);\n\n await accordion2.click();\n await page.waitForChanges();\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(true);\n expect(await accordion2.getProperty(\"expanded\")).toBe(true);\n });\n});\n"]}
1	+ {"version":3,"file":"ic-accordion-group.e2e.js","sourceRoot":"","sources":["../../../../../src/components/ic-accordion-group/test/basic/ic-accordion-group.e2e.ts"],"names":[],"mappings":"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","sourcesContent":["import { newE2EPage } from \"@stencil/core/testing\";\n\nbeforeAll(() => {\n jest.spyOn(console, \"warn\").mockImplementation(jest.fn());\n});\n\ndescribe(\"ic-accordion-group\", () => {\n it(\"button text should change to 'See all' when expanded accordion clicked\", async () => {\n const page = await newE2EPage();\n await page.setContent(\n `<ic-accordion-group>\n <ic-accordion expanded heading=\"Accordion 1\"></ic-accordion>\n </ic-accordion-group>`\n );\n const seeAllBtn = await page.find(\"ic-accordion-group >>> ic-button\");\n let text = await seeAllBtn.innerText;\n\n expect(text).toBe(\"Hide all\");\n await seeAllBtn.click();\n await page.waitForChanges();\n text = await seeAllBtn.innerText;\n expect(text).toBe(\"See all\");\n });\n\n it(\"should open accordion when 'See all' clicked\", async () => {\n const page = await newE2EPage();\n await page.setContent(\n `<ic-accordion-group>\n <ic-accordion></ic-accordion>\n </ic-accordion-group>`\n );\n\n const seeAllBtn = await page.find(\"ic-accordion-group >>> ic-button\");\n\n await seeAllBtn.click();\n await page.waitForChanges();\n\n const accordionExpanded = await page.find(\n \"ic-accordion >>> .section-button-open\"\n );\n\n expect(accordionExpanded).not.toBeNull();\n });\n\n it(\"should test the See all/ Hide all function\", async () => {\n const page = await newE2EPage();\n await page.setContent(`\n <ic-accordion-group group-title=\"Test heading\">\n <ic-accordion heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion heading=\"Accordion 2\" expanded>\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group> \n `);\n\n const accordions = await page.findAll(\"ic-accordion\");\n const accordion1 = accordions[0];\n const accordion2 = accordions[1];\n const accordionButton = await page.find(\"ic-accordion-group >>> ic-button\");\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(false);\n expect(await accordion2.getProperty(\"expanded\")).toBe(true);\n expect((await accordionButton).innerText).toBe(\"See all\");\n\n await accordionButton.click();\n await page.waitForChanges();\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(true);\n expect(await accordion2.getProperty(\"expanded\")).toBe(true);\n expect((await accordionButton).innerText).toBe(\"Hide all\");\n\n await accordionButton.click();\n await page.waitForChanges();\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(false);\n expect(await accordion2.getProperty(\"expanded\")).toBe(false);\n expect((await accordionButton).innerText).toBe(\"See all\");\n });\n\n it(\"should open second accordion and close first accordion on single expansion\", async () => {\n const page = await newE2EPage();\n await page.setContent(`\n <ic-accordion-group single-expansion=\"true\" group-title=\"Test heading\">\n <ic-accordion expanded heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion heading=\"Accordion 2\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group> \n `);\n const accordions = await page.findAll(\"ic-accordion\");\n const accordion1 = accordions[0];\n const accordion2 = accordions[1];\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(true);\n expect(await accordion2.getProperty(\"expanded\")).toBe(false);\n\n await accordion2.click();\n await page.waitForChanges();\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(false);\n expect(await accordion2.getProperty(\"expanded\")).toBe(true);\n });\n\n it(\"both accordions should open when single expansion is false\", async () => {\n const page = await newE2EPage();\n await page.setContent(`\n <ic-accordion-group group-title=\"Test heading\">\n <ic-accordion expanded heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion heading=\"Accordion 2\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group> \n `);\n const accordions = await page.findAll(\"ic-accordion\");\n const accordion1 = accordions[0];\n const accordion2 = accordions[1];\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(true);\n expect(await accordion2.getProperty(\"expanded\")).toBe(false);\n\n await accordion2.click();\n await page.waitForChanges();\n\n expect(await accordion1.getProperty(\"expanded\")).toBe(true);\n expect(await accordion2.getProperty(\"expanded\")).toBe(true);\n });\n});\n"]}

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

@@ -2,6 +2,9 @@ import { newSpecPage } from "@stencil/core/testing";
 import { AccordionGroup } from "../../ic-accordion-group";
 import { Accordion } from "../../../ic-accordion/ic-accordion";
 const event = { detail: { id: "ic-accordion-0" } };
+beforeAll(() => {
+  jest.spyOn(console, "warn").mockImplementation(jest.fn());
+});
 describe("ic-accordion-group snapshots", () => {
   it("should match default snapshot", async () => {
     const page = await newSpecPage({

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-accordion-group.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-accordion-group/test/basic/ic-accordion-group.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAE,SAAS,EAAE,MAAM,oCAAoC,CAAC;AAE/D,MAAM,KAAK,GAAG,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,gBAAgB,EAAE,EAAE,CAAC;AAEnD,QAAQ,CAAC,8BAA8B,EAAE,GAAG,EAAE;EAC5C,EAAE,CAAC,+BAA+B,EAAE,KAAK,IAAI,EAAE;IAC7C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,CAAC;MAC5B,IAAI,EAAE,sEAAsE;KAC7E,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,oBAAoB,CAAC,CAAC;EAC1D,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,6BAA6B,EAAE,KAAK,IAAI,EAAE;IAC3C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,CAAC;MAC5B,IAAI,EAAE,yFAAyF;KAChG,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,eAAe,CAAC,kBAAkB,CAAC,CAAC;EACxD,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,wCAAwC,EAAE,GAAG,EAAE;EACtD,EAAE,CAAC,yEAAyE,EAAE,KAAK,IAAI,EAAE;IACvF,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC;MACvC,IAAI,EAAE;;;;;;;;;;;;0BAYc;KACrB,CAAC,CAAC;IACH,MAAM,oCAAoC,GAAG,IAAI,CAAC,KAAK,CACrD,IAAI,CAAC,YAAY,EACjB,mCAAmC,CACpC,CAAC;IACF,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,IAAI,CAAC,YAAY,CAAC,sBAAsB,CAAC,KAAK,CAAC,CAAC;IACtD,MAAM,CAAC,oCAAoC,CAAC,CAAC,UAAU,EAAE,CAAC;EAC5D,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,uBAAuB,EAAE,KAAK,IAAI,EAAE;IACrC,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,CAAC;MAC5B,IAAI,EAAE,+EAA+E;KACtF,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACtC,MAAM,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,CAAC;IACzC,MAAM,IAAI,CAAC,cAAc,CAAC;IAC1B,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EACzC,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC;AAEH,QAAQ,CAAC,8BAA8B,EAAE,GAAG,EAAE;EAC5C,EAAE,CAAC,4CAA4C,EAAE,KAAK,IAAI,EAAE;IAC1D,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC;MACvC,IAAI,EAAE;;;;;;;4BAOgB;KACvB,CAAC,CAAC;IACH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACtC,MAAM,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,CAAC;IACzC,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAC5B,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EACzC,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,yCAAyC,EAAE,KAAK,IAAI,EAAE;IACvD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC;MACvC,IAAI,EAAE;;;;;;;;;;;;4BAYgB;KACvB,CAAC,CAAC;IAEH,MAAM,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAC9D,MAAM,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IACjC,MAAM,UAAU,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC;IACjC,MAAM,eAAe,GAAG,UAAU,CAAC,UAAU,CAAC,aAAa,CACzD,iBAAiB,CACG,CAAC;IACvB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAC5B,MAAM,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACxC,MAAM,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACvC,eAAe,CAAC,KAAK,EAAE,CAAC;IACxB,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;IAC5B,MAAM,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACvC,MAAM,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EAC1C,CAAC,CAAC,CAAC;EAEH,EAAE,CAAC,0CAA0C,EAAE,KAAK,IAAI,EAAE;IACxD,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;MAC7B,UAAU,EAAE,CAAC,cAAc,EAAE,SAAS,CAAC;MACvC,IAAI,EAAE;;;;;;;4BAOgB;KACvB,CAAC,CAAC;IACH,4EAA4E;IAC5E,MAAM,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,CAAC;IACzC,MAAM,IAAI,CAAC,cAAc,CAAC;IAC1B,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACtC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,oBAAoB,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAE1D,8EAA8E;IAC9E,MAAM,IAAI,CAAC,YAAY,CAAC,cAAc,EAAE,CAAC;IACzC,MAAM,IAAI,CAAC,cAAc,CAAC;IAC1B,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;IACvC,MAAM,CAAC,IAAI,CAAC,YAAY,CAAC,oBAAoB,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;EAC7D,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { AccordionGroup } from \"../../ic-accordion-group\";\nimport { Accordion } from \"../../../ic-accordion/ic-accordion\";\n\nconst event = { detail: { id: \"ic-accordion-0\" } };\n\ndescribe(\"ic-accordion-group snapshots\", () => {\n it(\"should match default snapshot\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup],\n html: `<ic-accordion-group group-title=\"Test heading\"></ic-accordion-group>`,\n });\n expect(page.root).toMatchSnapshot(\"renders as default\");\n });\n\n it(\"should match light snapshot\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup],\n html: `<ic-accordion-group appearance=\"light\" group-title=\"Test heading\"></ic-accordion-group>`,\n });\n expect(page.root).toMatchSnapshot(\"renders as light\");\n });\n});\n\ndescribe(\"ic-accordion-group functions unit test\", () => {\n it(\"checks setExpandedToAreAllAccordionsOpen when single expansion is false\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup, Accordion],\n html: `\n <ic-accordion-group group-title=\"Test heading\">\n <ic-accordion>\n <ic-typography variant=\"body\" >\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion expanded>\n <ic-typography variant=\"body\" >\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group>`,\n });\n const spySetExpandedToAreAllAccordionsOpen = jest.spyOn(\n page.rootInstance,\n \"setExpandedToAreAllAccordionsOpen\"\n );\n expect(page.root.singleExpansion).toBe(false);\n await page.rootInstance.handleAccordionClicked(event);\n expect(spySetExpandedToAreAllAccordionsOpen).toBeCalled();\n });\n\n it(\"checks handleExpanded\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup],\n html: `<ic-accordion-group group-title=\"Test heading\" expanded></ic-accordion-group>`,\n });\n expect(page.root.expanded).toBe(true);\n await page.rootInstance.handleExpanded();\n await page.waitForChanges;\n expect(page.root.expanded).toBe(false);\n });\n});\n\ndescribe(\"ic-accordion-group component\", () => {\n it(\"it should test the handleExpanded function\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup, Accordion],\n html: `\n <ic-accordion-group expanded=\"true\" group-title=\"Test heading\">\n <ic-accordion heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group>`,\n });\n expect(page.root.expanded).toBe(true);\n await page.rootInstance.handleExpanded();\n await page.waitForChanges();\n expect(page.root.expanded).toBe(false);\n });\n\n it(\"it should test singleExpansion function\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup, Accordion],\n html: `\n <ic-accordion-group group-title=\"Test heading\" single-expansion=\"true\">\n <ic-accordion heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion heading=\"Accordion 2\" expanded>\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group>`,\n });\n\n const accordions = page.root.querySelectorAll(\"ic-accordion\");\n const accordion1 = accordions[0];\n const accordion2 = accordions[1];\n const accordionButton = accordion1.shadowRoot.querySelector(\n \".section-button\"\n ) as HTMLButtonElement;\n await page.waitForChanges();\n expect(accordion1.expanded).toBe(false);\n expect(accordion2.expanded).toBe(true);\n accordionButton.click();\n await page.waitForChanges();\n expect(accordion1.expanded).toBe(true);\n expect(accordion2.expanded).toBe(false);\n });\n\n it(\"checks the areAllAccordionsOpen function\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup, Accordion],\n html: `\n <ic-accordion-group group-title=\"Test heading\">\n <ic-accordion heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group>`,\n });\n // uses handleExpanded to open accordion, making areAllAccordionsOpen = true\n await page.rootInstance.handleExpanded();\n await page.waitForChanges;\n expect(page.root.expanded).toBe(true);\n expect(page.rootInstance.areAllAccordionsOpen).toBe(true);\n\n // uses handleExpanded to close accordion, making areAllAccordionsOpen = false\n await page.rootInstance.handleExpanded();\n await page.waitForChanges;\n expect(page.root.expanded).toBe(false);\n expect(page.rootInstance.areAllAccordionsOpen).toBe(false);\n });\n});\n"]}
1	+ {"version":3,"file":"ic-accordion-group.spec.js","sourceRoot":"","sources":["../../../../../src/components/ic-accordion-group/test/basic/ic-accordion-group.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { AccordionGroup } from \"../../ic-accordion-group\";\nimport { Accordion } from \"../../../ic-accordion/ic-accordion\";\n\nconst event = { detail: { id: \"ic-accordion-0\" } };\n\nbeforeAll(() => {\n jest.spyOn(console, \"warn\").mockImplementation(jest.fn());\n});\n\ndescribe(\"ic-accordion-group snapshots\", () => {\n it(\"should match default snapshot\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup],\n html: `<ic-accordion-group group-title=\"Test heading\"></ic-accordion-group>`,\n });\n expect(page.root).toMatchSnapshot(\"renders as default\");\n });\n\n it(\"should match light snapshot\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup],\n html: `<ic-accordion-group appearance=\"light\" group-title=\"Test heading\"></ic-accordion-group>`,\n });\n expect(page.root).toMatchSnapshot(\"renders as light\");\n });\n});\n\ndescribe(\"ic-accordion-group functions unit test\", () => {\n it(\"checks setExpandedToAreAllAccordionsOpen when single expansion is false\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup, Accordion],\n html: `\n <ic-accordion-group group-title=\"Test heading\">\n <ic-accordion>\n <ic-typography variant=\"body\" >\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion expanded>\n <ic-typography variant=\"body\" >\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group>`,\n });\n const spySetExpandedToAreAllAccordionsOpen = jest.spyOn(\n page.rootInstance,\n \"setExpandedToAreAllAccordionsOpen\"\n );\n expect(page.root.singleExpansion).toBe(false);\n await page.rootInstance.handleAccordionClicked(event);\n expect(spySetExpandedToAreAllAccordionsOpen).toBeCalled();\n });\n\n it(\"checks handleExpanded\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup],\n html: `<ic-accordion-group group-title=\"Test heading\" expanded></ic-accordion-group>`,\n });\n expect(page.root.expanded).toBe(true);\n await page.rootInstance.handleExpanded();\n await page.waitForChanges;\n expect(page.root.expanded).toBe(false);\n });\n});\n\ndescribe(\"ic-accordion-group component\", () => {\n it(\"it should test the handleExpanded function\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup, Accordion],\n html: `\n <ic-accordion-group expanded=\"true\" group-title=\"Test heading\">\n <ic-accordion heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group>`,\n });\n expect(page.root.expanded).toBe(true);\n await page.rootInstance.handleExpanded();\n await page.waitForChanges();\n expect(page.root.expanded).toBe(false);\n });\n\n it(\"it should test singleExpansion function\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup, Accordion],\n html: `\n <ic-accordion-group group-title=\"Test heading\" single-expansion=\"true\">\n <ic-accordion heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n <ic-accordion heading=\"Accordion 2\" expanded>\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group>`,\n });\n\n const accordions = page.root.querySelectorAll(\"ic-accordion\");\n const accordion1 = accordions[0];\n const accordion2 = accordions[1];\n const accordionButton = accordion1.shadowRoot.querySelector(\n \".section-button\"\n ) as HTMLButtonElement;\n await page.waitForChanges();\n expect(accordion1.expanded).toBe(false);\n expect(accordion2.expanded).toBe(true);\n accordionButton.click();\n await page.waitForChanges();\n expect(accordion1.expanded).toBe(true);\n expect(accordion2.expanded).toBe(false);\n });\n\n it(\"checks the areAllAccordionsOpen function\", async () => {\n const page = await newSpecPage({\n components: [AccordionGroup, Accordion],\n html: `\n <ic-accordion-group group-title=\"Test heading\">\n <ic-accordion heading=\"Accordion 1\">\n <ic-typography variant=\"body\">\n This is an example of the main body text.\n </ic-typography>\n </ic-accordion>\n </ic-accordion-group>`,\n });\n // uses handleExpanded to open accordion, making areAllAccordionsOpen = true\n await page.rootInstance.handleExpanded();\n await page.waitForChanges;\n expect(page.root.expanded).toBe(true);\n expect(page.rootInstance.areAllAccordionsOpen).toBe(true);\n\n // uses handleExpanded to close accordion, making areAllAccordionsOpen = false\n await page.rootInstance.handleExpanded();\n await page.waitForChanges;\n expect(page.root.expanded).toBe(false);\n expect(page.rootInstance.areAllAccordionsOpen).toBe(false);\n });\n});\n"]}

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

@@ -463,7 +463,7 @@ button {
   gap: var(--ic-space-xs);
   display: flex;
   background-color: var(--ic-architectural-white);
-  border: var(--ic-space-1px) solid var(--ic-action-default);
+  border: var(--ic-border-width) solid var(--ic-action-default);
   outline-width: inherit;
   box-sizing: border-box;
   box-shadow: var(--ic-elevation-overlay);
@@ -480,13 +480,13 @@ button {
 button:hover {
   text-decoration: none;
   background-color: var(--ic-action-default-bg-hover-no-alpha);
-  border: var(--ic-space-1px) solid var(--ic-action-default-hover);
+  border: var(--ic-border-width) solid var(--ic-action-default-hover);
 }
 button:active {
   text-decoration: none;
   background-color: var(--ic-action-default-bg-active-no-alpha);
-  border: var(--ic-space-1px) solid var(--ic-action-default-active);
+  border: var(--ic-border-width) solid var(--ic-action-default-active);
 }
 button:focus {

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

@@ -1,6 +1,9 @@
 import { Host, h } from "@stencil/core";
 import { IcThemeForegroundEnum, } from "../../utils/types";
 import { getCssProperty, getParentElement, getParentElementType, hexToRgba, isPropDefined, onComponentRequiredPropUndefined, rgbaStrToObj, } from "../../utils/helpers";
+/**
+ * @slot badge-icon - Icon will be rendered inside the badge if type is set to icon.
+ */
 export class Badge {
   constructor() {
     this.setBadgeColour = () => {
@@ -330,7 +333,7 @@ export class Badge {
       },
       "visible": {
         "type": "boolean",
-        "mutable": false,
+        "mutable": true,
         "complexType": {
           "original": "boolean",
           "resolved": "boolean",

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-badge.js","sourceRoot":"","sources":["../../../src/components/ic-badge/ic-badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, Method, Prop, h } from \"@stencil/core\";\nimport {\n IcBadgePositions,\n IcBadgeTypes,\n IcBadgeVariants,\n IcColor,\n} from \"./ic-badge.types\";\nimport {\n IcColorRGBA,\n IcSizes,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport {\n getCssProperty,\n getParentElement,\n getParentElementType,\n hexToRgba,\n isPropDefined,\n onComponentRequiredPropUndefined,\n rgbaStrToObj,\n} from \"../../utils/helpers\";\n\n@Component({\n tag: \"ic-badge\",\n styleUrl: \"ic-badge.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Badge {\n private customColorRGBA: IcColorRGBA;\n private foregroundColour: IcThemeForeground;\n\n @Element() el: HTMLIcBadgeElement;\n\n /*\n The accessible label of the badge component to provide context for screen reader users.\n /\n @Prop() accessibleLabel?: string;\n\n /\n The custom badge colour. This will only style the badge component if variant=\"custom\".\n * Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\".\n /\n @Prop() customColor?: IcColor = null;\n\n /\n The maximum number shown on the badge appended with a +.\n * This will only be displayed if type=\"text\" and textLabel is not empty.\n /\n @Prop() maxNumber?: number;\n\n /\n The positioning of the badge in reference to the parent element.\n /\n @Prop() position?: IcBadgePositions = \"far\";\n\n /\n The size of the badge to be displayed.\n /\n @Prop() size?: IcSizes = \"default\";\n\n /\n The text displayed in the badge. This will only be displayed if type=\"text\".\n /\n @Prop() textLabel?: string;\n\n /\n The type of badge to be displayed.\n /\n @Prop() type?: IcBadgeTypes = \"text\";\n\n /\n The variant of the badge to be displayed.\n /\n @Prop() variant?: IcBadgeVariants = \"neutral\";\n\n /\n If `true`, the badge will be displayed.\n /\n @Prop() visible: boolean = true;\n\n componentWillLoad(): void {\n this.variant === \"custom\" && this.setBadgeColour();\n\n this.getBadgeForeground();\n\n this.isAccessibleLabelDefined() && this.setAccessibleLabel();\n }\n\n componentDidLoad(): void {\n this.type === \"text\" &&\n onComponentRequiredPropUndefined(\n [{ prop: this.textLabel, propName: \"text-label\" }],\n \"Badge\"\n );\n }\n\n /\n @deprecated This method should not be used anymore. Use visible prop to set badge visibility.\n /\n @Method()\n async showBadge(): Promise<void> {\n this.visible = true;\n }\n\n /\n @deprecated This method should not be used anymore. Use visible prop to set badge visibility.\n /\n @Method()\n async hideBadge(): Promise<void> {\n this.visible = false;\n }\n\n private setBadgeColour = () => {\n let colorRGBA = null;\n if (this.customColor !== null) {\n const firstChar = this.customColor.slice(0, 1);\n if (firstChar === \"#\") {\n colorRGBA = hexToRgba(this.customColor);\n } else if (firstChar.toLowerCase() === \"r\") {\n colorRGBA = rgbaStrToObj(this.customColor);\n }\n this.customColorRGBA = colorRGBA;\n this.el.style.backgroundColor = `rgba(${colorRGBA.r.toString()}, ${colorRGBA.g.toString()}, ${colorRGBA.b.toString()}, ${colorRGBA.a.toString()})`;\n }\n };\n\n private getBadgeForeground = () => {\n let red: number;\n let green: number;\n let blue: number;\n\n switch (this.variant) {\n case \"custom\":\n red = this.customColorRGBA.r;\n green = this.customColorRGBA.g;\n blue = this.customColorRGBA.b;\n break;\n case \"error\":\n red = parseInt(getCssProperty(\"--ic-status-error-r\"));\n green = parseInt(getCssProperty(\"--ic-status-error-g\"));\n blue = parseInt(getCssProperty(\"--ic-status-error-b\"));\n break;\n case \"success\":\n red = parseInt(getCssProperty(\"--ic-status-success-r\"));\n green = parseInt(getCssProperty(\"--ic-status-success-g\"));\n blue = parseInt(getCssProperty(\"--ic-status-success-b\"));\n break;\n case \"warning\":\n red = parseInt(getCssProperty(\"--ic-status-warning-r\"));\n green = parseInt(getCssProperty(\"--ic-status-warning-g\"));\n blue = parseInt(getCssProperty(\"--ic-status-warning-b\"));\n break;\n case \"info\": {\n const info = hexToRgba(getCssProperty(\"--ic-status-info\"));\n red = info.r;\n green = info.g;\n blue = info.b;\n break;\n }\n case \"neutral\": {\n const neutral = hexToRgba(getCssProperty(\"--ic-architectural-500\"));\n red = neutral.r;\n green = neutral.g;\n blue = neutral.b;\n break;\n }\n case \"light\": {\n const light = hexToRgba(getCssProperty(\"--ic-architectural-40\"));\n red = light.r;\n green = light.g;\n blue = light.b;\n break;\n }\n }\n\n const brightness = (red 299 + green * 587 + blue * 114) / 1000;\n this.foregroundColour =\n brightness > 133.3505\n ? IcThemeForegroundEnum.Dark\n : IcThemeForegroundEnum.Light;\n };\n\n private getTextLabel = () => {\n let label;\n if (this.textLabel !== null) {\n if (this.maxNumber !== null) {\n label =\n Number(this.textLabel) > this.maxNumber\n ? `${this.maxNumber}+`\n : this.textLabel;\n } else {\n label = this.textLabel;\n }\n }\n return label;\n };\n\n private setAccessibleLabel = () => {\n if (getParentElement(this.el) !== null) {\n if (getParentElementType(this.el) === \"IC-TAB\") {\n getParentElement(this.el).setAttribute(\"aria-describedby\", \"badge\");\n } else {\n getParentElement(\n this.el\n ).ariaLabel = `badge displaying ${this.accessibleLabel}`;\n }\n }\n };\n\n private isAccessibleLabelDefined = () => {\n return isPropDefined(this.accessibleLabel) && this.accessibleLabel !== null;\n };\n\n render() {\n const { position, size, type, variant, foregroundColour, visible } = this;\n\n return (\n <Host\n class={{\n [`${position}`]: true,\n [`${size}`]: true,\n [`${variant}`]: true,\n [`${type}`]: true,\n [`foreground-${foregroundColour}`]: foregroundColour !== null,\n [\"show\"]: visible,\n [\"hide\"]: !visible,\n }}\n id=\"badge\"\n aria-label={\n this.isAccessibleLabelDefined() &&\n `badge displaying ${this.accessibleLabel}`\n }\n >\n {type === \"icon\" && <slot name=\"badge-icon\"></slot>}\n {type === \"text\" && (\n <ic-typography variant={size === \"small\" ? \"badge-small\" : \"badge\"}>\n {this.getTextLabel()}\n </ic-typography>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-badge.js","sourceRoot":"","sources":["../../../src/components/ic-badge/ic-badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Host, Method, Prop, h } from \"@stencil/core\";\nimport {\n IcBadgePositions,\n IcBadgeTypes,\n IcBadgeVariants,\n IcColor,\n} from \"./ic-badge.types\";\nimport {\n IcColorRGBA,\n IcSizes,\n IcThemeForeground,\n IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport {\n getCssProperty,\n getParentElement,\n getParentElementType,\n hexToRgba,\n isPropDefined,\n onComponentRequiredPropUndefined,\n rgbaStrToObj,\n} from \"../../utils/helpers\";\n\n/*\n @slot badge-icon - Icon will be rendered inside the badge if type is set to icon.\n /\n@Component({\n tag: \"ic-badge\",\n styleUrl: \"ic-badge.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Badge {\n private customColorRGBA: IcColorRGBA;\n private foregroundColour: IcThemeForeground;\n\n @Element() el: HTMLIcBadgeElement;\n\n /\n The accessible label of the badge component to provide context for screen reader users.\n /\n @Prop() accessibleLabel?: string;\n\n /\n The custom badge colour. This will only style the badge component if variant=\"custom\".\n * Can be a hex value e.g. \"#ff0000\", RGB e.g. \"rgb(255, 0, 0)\", or RGBA e.g. \"rgba(255, 0, 0, 1)\".\n /\n @Prop() customColor?: IcColor = null;\n\n /\n The maximum number shown on the badge appended with a +.\n * This will only be displayed if type=\"text\" and textLabel is not empty.\n /\n @Prop() maxNumber?: number;\n\n /\n The positioning of the badge in reference to the parent element.\n /\n @Prop() position?: IcBadgePositions = \"far\";\n\n /\n The size of the badge to be displayed.\n /\n @Prop() size?: IcSizes = \"default\";\n\n /\n The text displayed in the badge. This will only be displayed if type=\"text\".\n /\n @Prop() textLabel?: string;\n\n /\n The type of badge to be displayed.\n /\n @Prop() type?: IcBadgeTypes = \"text\";\n\n /\n The variant of the badge to be displayed.\n /\n @Prop() variant?: IcBadgeVariants = \"neutral\";\n\n /\n If `true`, the badge will be displayed.\n /\n @Prop({ mutable: true }) visible: boolean = true;\n\n componentWillLoad(): void {\n this.variant === \"custom\" && this.setBadgeColour();\n\n this.getBadgeForeground();\n\n this.isAccessibleLabelDefined() && this.setAccessibleLabel();\n }\n\n componentDidLoad(): void {\n this.type === \"text\" &&\n onComponentRequiredPropUndefined(\n [{ prop: this.textLabel, propName: \"text-label\" }],\n \"Badge\"\n );\n }\n\n /\n @deprecated This method should not be used anymore. Use visible prop to set badge visibility.\n /\n @Method()\n async showBadge(): Promise<void> {\n this.visible = true;\n }\n\n /\n @deprecated This method should not be used anymore. Use visible prop to set badge visibility.\n /\n @Method()\n async hideBadge(): Promise<void> {\n this.visible = false;\n }\n\n private setBadgeColour = () => {\n let colorRGBA = null;\n if (this.customColor !== null) {\n const firstChar = this.customColor.slice(0, 1);\n if (firstChar === \"#\") {\n colorRGBA = hexToRgba(this.customColor);\n } else if (firstChar.toLowerCase() === \"r\") {\n colorRGBA = rgbaStrToObj(this.customColor);\n }\n this.customColorRGBA = colorRGBA;\n this.el.style.backgroundColor = `rgba(${colorRGBA.r.toString()}, ${colorRGBA.g.toString()}, ${colorRGBA.b.toString()}, ${colorRGBA.a.toString()})`;\n }\n };\n\n private getBadgeForeground = () => {\n let red: number;\n let green: number;\n let blue: number;\n\n switch (this.variant) {\n case \"custom\":\n red = this.customColorRGBA.r;\n green = this.customColorRGBA.g;\n blue = this.customColorRGBA.b;\n break;\n case \"error\":\n red = parseInt(getCssProperty(\"--ic-status-error-r\"));\n green = parseInt(getCssProperty(\"--ic-status-error-g\"));\n blue = parseInt(getCssProperty(\"--ic-status-error-b\"));\n break;\n case \"success\":\n red = parseInt(getCssProperty(\"--ic-status-success-r\"));\n green = parseInt(getCssProperty(\"--ic-status-success-g\"));\n blue = parseInt(getCssProperty(\"--ic-status-success-b\"));\n break;\n case \"warning\":\n red = parseInt(getCssProperty(\"--ic-status-warning-r\"));\n green = parseInt(getCssProperty(\"--ic-status-warning-g\"));\n blue = parseInt(getCssProperty(\"--ic-status-warning-b\"));\n break;\n case \"info\": {\n const info = hexToRgba(getCssProperty(\"--ic-status-info\"));\n red = info.r;\n green = info.g;\n blue = info.b;\n break;\n }\n case \"neutral\": {\n const neutral = hexToRgba(getCssProperty(\"--ic-architectural-500\"));\n red = neutral.r;\n green = neutral.g;\n blue = neutral.b;\n break;\n }\n case \"light\": {\n const light = hexToRgba(getCssProperty(\"--ic-architectural-40\"));\n red = light.r;\n green = light.g;\n blue = light.b;\n break;\n }\n }\n\n const brightness = (red 299 + green * 587 + blue * 114) / 1000;\n this.foregroundColour =\n brightness > 133.3505\n ? IcThemeForegroundEnum.Dark\n : IcThemeForegroundEnum.Light;\n };\n\n private getTextLabel = () => {\n let label;\n if (this.textLabel !== null) {\n if (this.maxNumber !== null) {\n label =\n Number(this.textLabel) > this.maxNumber\n ? `${this.maxNumber}+`\n : this.textLabel;\n } else {\n label = this.textLabel;\n }\n }\n return label;\n };\n\n private setAccessibleLabel = () => {\n if (getParentElement(this.el) !== null) {\n if (getParentElementType(this.el) === \"IC-TAB\") {\n getParentElement(this.el).setAttribute(\"aria-describedby\", \"badge\");\n } else {\n getParentElement(\n this.el\n ).ariaLabel = `badge displaying ${this.accessibleLabel}`;\n }\n }\n };\n\n private isAccessibleLabelDefined = () => {\n return isPropDefined(this.accessibleLabel) && this.accessibleLabel !== null;\n };\n\n render() {\n const { position, size, type, variant, foregroundColour, visible } = this;\n\n return (\n <Host\n class={{\n [`${position}`]: true,\n [`${size}`]: true,\n [`${variant}`]: true,\n [`${type}`]: true,\n [`foreground-${foregroundColour}`]: foregroundColour !== null,\n [\"show\"]: visible,\n [\"hide\"]: !visible,\n }}\n id=\"badge\"\n aria-label={\n this.isAccessibleLabelDefined() &&\n `badge displaying ${this.accessibleLabel}`\n }\n >\n {type === \"icon\" && <slot name=\"badge-icon\"></slot>}\n {type === \"text\" && (\n <ic-typography variant={size === \"small\" ? \"badge-small\" : \"badge\"}>\n {this.getTextLabel()}\n </ic-typography>\n )}\n </Host>\n );\n }\n}\n"]}

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

@@ -558,6 +558,7 @@ video {
 :host(.button-variant-primary.loading) .button {
   background-color: var(--button-default-active);
 }
 :host(.button-variant-primary) .button:active:focus {
   background-color: var(--button-default-active);
 }
@@ -583,7 +584,7 @@ video {
 /* Secondary  */
 :host(.button-variant-secondary) .button {
-  border: var(--ic-space-1px) solid var(--button-default);
+  border: var(--ic-border-width) solid var(--button-default);
   color: var(--button-default);
 }
@@ -863,6 +864,7 @@ div.icon-container {
 }
 :host(.popout-menu-button) .button {
+  height: var(--height);
   justify-content: left;
   border-radius: 0;
   white-space: pre-line;

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

@@ -473,7 +473,7 @@ button {
 .dark.card,
 .dark.card.clickable {
-  border: var(--ic-space-1px) solid var(--ic-architectural-700);
+  border: var(--ic-border-width) solid var(--ic-architectural-700);
 }
 .card.clickable:hover {

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

@@ -470,7 +470,7 @@ video {
   height: var(--ic-space-lg);
   width: var(--ic-space-lg);
   background-color: transparent;
-  border: var(--ic-space-1px) solid var(--ic-architectural-300);
+  border: var(--ic-border-width) solid var(--ic-architectural-300);
   border-radius: var(--ic-border-radius);
   outline: none;
   cursor: pointer;
@@ -492,7 +492,7 @@ video {
 .checkbox:checked {
   background-color: var(--ic-action-default);
-  border: var(--ic-space-1px) solid var(--ic-action-default);
+  border: var(--ic-border-width) solid var(--ic-action-default);
   transition: var(--ic-easing-transition-slow);
 }
@@ -529,13 +529,13 @@ video {
 .checkbox:hover {
   background-color: var(--ic-action-default-bg-hover);
   box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-hover);
-  border: var(--ic-space-1px) solid var(--ic-action-default-hover);
+  border: var(--ic-border-width) solid var(--ic-action-default-hover);
 }
 .checkbox:active {
   background-color: var(--ic-action-default-bg-active);
   box-shadow: 0 0 0 0.25rem var(--ic-action-default-bg-active);
-  border: var(--ic-space-1px) solid var(--ic-action-default-active);
+  border: var(--ic-border-width) solid var(--ic-action-default-active);
 }
 .checkbox:focus {
@@ -543,7 +543,7 @@ video {
 }
 .checkbox:disabled {
-  border: var(--ic-space-1px) dashed var(--ic-architectural-200);
+  border: var(--ic-border-width) dashed var(--ic-architectural-200);
 }
 .checkbox-label {

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

@@ -7,9 +7,6 @@ import { isSlotUsed, onComponentRequiredPropUndefined, renderHiddenInput, remove
 export class Checkbox {
   constructor() {
     this.IC_TEXT_FIELD = "ic-text-field";
-    this.eventHandler = (event) => {
-      event.stopImmediatePropagation();
-    };
     this.handleClick = () => {
       this.checked = !this.checked;
       this.icCheck.emit();
@@ -38,11 +35,8 @@ export class Checkbox {
     this.value = undefined;
   }
   componentWillLoad() {
-    var _a;
     removeDisabledFalse(this.disabled, this.el);
     addFormResetListener(this.el, this.handleFormReset);
-    (_a = this.el
-      .querySelector(this.IC_TEXT_FIELD)) === null || _a === void 0 ? void 0 : _a.addEventListener("icChange", this.eventHandler);
   }
   componentDidLoad() {
     onComponentRequiredPropUndefined([
@@ -70,10 +64,7 @@ export class Checkbox {
     }
   }
   disconnectedCallback() {
-    var _a;
     removeFormResetListener(this.el, this.handleFormReset);
-    (_a = this.el
-      .querySelector(this.IC_TEXT_FIELD)) === null || _a === void 0 ? void 0 : _a.removeEventListener("icChange", this.eventHandler);
   }
   /**
    * Sets focus on the checkbox.

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-checkbox.js","sourceRoot":"","sources":["../../../src/components/ic-checkbox/ic-checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n Method,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes, IcSizes } from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n removeHiddenInput,\n addFormResetListener,\n removeFormResetListener,\n removeDisabledFalse,\n isPropDefined,\n} from \"../../utils/helpers\";\n\n/*\n @slot additional-field - Content to be displayed alongside a checkbox.\n /\n@Component({\n tag: \"ic-checkbox\",\n styleUrl: \"ic-checkbox.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class Checkbox {\n private additionalFieldContainer: HTMLDivElement;\n private IC_TEXT_FIELD: string = \"ic-text-field\";\n\n @Element() el: HTMLIcCheckboxElement;\n\n /\n The style of additionalField that will be displayed if used.\n /\n @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n \"static\";\n\n /\n If `true`, the checkbox will be set to the checked state.\n /\n @Prop({ reflect: true, mutable: true }) checked?: boolean = false;\n @State() initiallyChecked = this.checked;\n\n /\n If `true`, the checkbox will be set to the disabled state.\n /\n @Prop() disabled?: boolean = false;\n\n /\n The text to be displayed when dynamic.\n /\n\n @Prop() dynamicText: string = \"This selection requires additional answers\";\n\n /\n The <form> element to associate the checkbox with.\n /\n @Prop() form?: string;\n\n /\n The URL that processes the information submitted by the checkbox. It overrides the action attribute of the checkbox's form owner. Does nothing if there is no form owner.\n /\n @Prop() formaction?: string;\n\n /\n The way the submitted form data is encoded.\n /\n @Prop() formenctype?: string;\n\n /\n The HTTP method used to submit the form.\n /\n @Prop() formmethod?: string;\n\n /\n If `true`, the form will not be validated when submitted.\n /\n @Prop() formnovalidate?: boolean;\n\n /\n The place to display the response from submitting the form. It overrides the target attribute of the checkbox's form owner.\n /\n @Prop() formtarget?: string;\n\n /\n The group label for the checkbox.\n /\n @Prop() groupLabel: string;\n\n /\n If `true`, the indeterminate state will be displayed when checked.\n /\n @Prop() indeterminate: boolean = false;\n\n /\n The label for the checkbox.\n /\n @Prop() label!: string;\n\n /\n The name for the checkbox. If not set when used in a checkbox group, the name will be based on the group name.\n /\n @Prop() name: string;\n\n /\n The size of the checkbox to be displayed. This does not affect the font size of the label. If a checkbox is contained in a checkbox group, this will override the size set on checkbox group.\n /\n @Prop() size?: IcSizes;\n\n /\n @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n /\n @Prop() small?: boolean = false;\n\n /\n The value for the checkbox.\n /\n @Prop() value!: string;\n\n /\n @deprecated This event should not be used anymore. Use icCheck instead.\n /\n @Event() checkboxChecked: EventEmitter<void>;\n\n /\n Emitted when a checkbox has been checked.\n /\n @Event() icCheck: EventEmitter<void>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n addFormResetListener(this.el, this.handleFormReset);\n this.el\n .querySelector(this.IC_TEXT_FIELD)\n ?.addEventListener(\"icChange\", this.eventHandler);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.value, propName: \"value\" },\n ],\n \"Checkbox\"\n );\n }\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n const textfield = this.el.querySelector(this.IC_TEXT_FIELD);\n if (!this.checked) {\n textfield && textfield.setAttribute(\"disabled\", \"\");\n } else {\n textfield && textfield.removeAttribute(\"disabled\");\n }\n } else if (this.additionalFieldContainer) {\n if (!this.checked) {\n this.additionalFieldContainer.style.display = \"none\";\n } else {\n this.additionalFieldContainer.style.display = \"flex\";\n }\n }\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.el, this.handleFormReset);\n this.el\n .querySelector(this.IC_TEXT_FIELD)\n ?.removeEventListener(\"icChange\", this.eventHandler);\n }\n\n /\n Sets focus on the checkbox.\n */\n @Method()\n async setFocus(): Promise<void> {\n const checkboxEl: HTMLElement =\n this.el.shadowRoot.querySelector(\".checkbox\");\n if (checkboxEl) {\n checkboxEl.focus();\n }\n }\n\n private eventHandler = (event: CustomEvent) => {\n event.stopImmediatePropagation();\n };\n\n private handleClick = () => {\n this.checked = !this.checked;\n this.icCheck.emit();\n this.checkboxChecked.emit();\n };\n\n private handleFormReset = (): void => {\n this.checked = this.initiallyChecked;\n };\n\n render() {\n let id = `ic-checkbox-${\n isPropDefined(this.label) ? this.label : this.value\n }-${this.groupLabel}`;\n\n id = id.replace(/ /g, \"-\");\n\n const parentElementSize = (\n this.el.parentElement as HTMLIcCheckboxGroupElement\n ).size;\n\n this.checked\n ? renderHiddenInput(\n true,\n this.el,\n this.name,\n this.checked && this.value,\n this.disabled\n )\n : removeHiddenInput(this.el);\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled,\n [\"small\"]: this.small,\n [`${this.size \|\| parentElementSize}`]: true,\n }}\n >\n <div class=\"container\">\n {this.checked && !this.indeterminate && (\n <svg\n class=\"checkmark\"\n width=\"1.5rem\"\n height=\"1.5rem\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n >\n <title>checkmark icon</title>\n <path d=\"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z\" />\n </svg>\n )}\n {this.checked && this.indeterminate && (\n <div class=\"indeterminate-symbol\" />\n )}\n <input\n role=\"checkbox\"\n class={{\n [\"checkbox\"]: true,\n [\"checked\"]: this.checked,\n [\"indeterminate\"]: this.indeterminate,\n }}\n type=\"checkbox\"\n name={this.name}\n id={id}\n value={this.value}\n disabled={this.disabled ? true : null}\n checked={this.checked}\n indeterminate={this.indeterminate}\n onClick={this.handleClick}\n form={this.form}\n formaction={this.formaction}\n formenctype={this.formenctype}\n formmethod={this.formmethod}\n formnovalidate={this.formnovalidate}\n formtarget={this.formtarget}\n ></input>\n <ic-typography class=\"checkbox-label\" variant=\"body\">\n <label htmlFor={id}>{this.label}</label>\n </ic-typography>\n </div>\n {isSlotUsed(this.el, \"additional-field\") && (\n <div\n class=\"dynamic-container\"\n ref={(el) => (this.additionalFieldContainer = el)}\n >\n {this.additionalFieldDisplay === \"dynamic\" && (\n <div class=\"branch-corner\"></div>\n )}\n <div>\n {this.additionalFieldDisplay === \"dynamic\" && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\" aria-live=\"polite\">\n {this.dynamicText}\n </p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\":\n this.additionalFieldDisplay === \"static\",\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-checkbox.js","sourceRoot":"","sources":["../../../src/components/ic-checkbox/ic-checkbox.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Host,\n h,\n Prop,\n Element,\n Event,\n EventEmitter,\n State,\n Method,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes, IcSizes } from \"../../utils/types\";\nimport {\n isSlotUsed,\n onComponentRequiredPropUndefined,\n renderHiddenInput,\n removeHiddenInput,\n addFormResetListener,\n removeFormResetListener,\n removeDisabledFalse,\n isPropDefined,\n} from \"../../utils/helpers\";\n\n/*\n @slot additional-field - Content to be displayed alongside a checkbox.\n /\n@Component({\n tag: \"ic-checkbox\",\n styleUrl: \"ic-checkbox.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class Checkbox {\n private additionalFieldContainer: HTMLDivElement;\n private IC_TEXT_FIELD: string = \"ic-text-field\";\n\n @Element() el: HTMLIcCheckboxElement;\n\n /\n The style of additionalField that will be displayed if used.\n /\n @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n \"static\";\n\n /\n If `true`, the checkbox will be set to the checked state.\n /\n @Prop({ reflect: true, mutable: true }) checked?: boolean = false;\n @State() initiallyChecked = this.checked;\n\n /\n If `true`, the checkbox will be set to the disabled state.\n /\n @Prop() disabled?: boolean = false;\n\n /\n The text to be displayed when dynamic.\n /\n\n @Prop() dynamicText: string = \"This selection requires additional answers\";\n\n /\n The <form> element to associate the checkbox with.\n /\n @Prop() form?: string;\n\n /\n The URL that processes the information submitted by the checkbox. It overrides the action attribute of the checkbox's form owner. Does nothing if there is no form owner.\n /\n @Prop() formaction?: string;\n\n /\n The way the submitted form data is encoded.\n /\n @Prop() formenctype?: string;\n\n /\n The HTTP method used to submit the form.\n /\n @Prop() formmethod?: string;\n\n /\n If `true`, the form will not be validated when submitted.\n /\n @Prop() formnovalidate?: boolean;\n\n /\n The place to display the response from submitting the form. It overrides the target attribute of the checkbox's form owner.\n /\n @Prop() formtarget?: string;\n\n /\n The group label for the checkbox.\n /\n @Prop() groupLabel: string;\n\n /\n If `true`, the indeterminate state will be displayed when checked.\n /\n @Prop() indeterminate: boolean = false;\n\n /\n The label for the checkbox.\n /\n @Prop() label!: string;\n\n /\n The name for the checkbox. If not set when used in a checkbox group, the name will be based on the group name.\n /\n @Prop() name: string;\n\n /\n The size of the checkbox to be displayed. This does not affect the font size of the label. If a checkbox is contained in a checkbox group, this will override the size set on checkbox group.\n /\n @Prop() size?: IcSizes;\n\n /\n @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n /\n @Prop() small?: boolean = false;\n\n /\n The value for the checkbox.\n /\n @Prop() value!: string;\n\n /\n @deprecated This event should not be used anymore. Use icCheck instead.\n /\n @Event() checkboxChecked: EventEmitter<void>;\n\n /\n Emitted when a checkbox has been checked.\n /\n @Event() icCheck: EventEmitter<void>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n\n addFormResetListener(this.el, this.handleFormReset);\n }\n\n componentDidLoad(): void {\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.value, propName: \"value\" },\n ],\n \"Checkbox\"\n );\n }\n\n componentDidRender(): void {\n if (this.additionalFieldDisplay === \"static\") {\n const textfield = this.el.querySelector(this.IC_TEXT_FIELD);\n if (!this.checked) {\n textfield && textfield.setAttribute(\"disabled\", \"\");\n } else {\n textfield && textfield.removeAttribute(\"disabled\");\n }\n } else if (this.additionalFieldContainer) {\n if (!this.checked) {\n this.additionalFieldContainer.style.display = \"none\";\n } else {\n this.additionalFieldContainer.style.display = \"flex\";\n }\n }\n }\n\n disconnectedCallback(): void {\n removeFormResetListener(this.el, this.handleFormReset);\n }\n\n /\n Sets focus on the checkbox.\n */\n @Method()\n async setFocus(): Promise<void> {\n const checkboxEl: HTMLElement =\n this.el.shadowRoot.querySelector(\".checkbox\");\n if (checkboxEl) {\n checkboxEl.focus();\n }\n }\n\n private handleClick = () => {\n this.checked = !this.checked;\n this.icCheck.emit();\n this.checkboxChecked.emit();\n };\n\n private handleFormReset = (): void => {\n this.checked = this.initiallyChecked;\n };\n\n render() {\n let id = `ic-checkbox-${\n isPropDefined(this.label) ? this.label : this.value\n }-${this.groupLabel}`;\n\n id = id.replace(/ /g, \"-\");\n\n const parentElementSize = (\n this.el.parentElement as HTMLIcCheckboxGroupElement\n ).size;\n\n this.checked\n ? renderHiddenInput(\n true,\n this.el,\n this.name,\n this.checked && this.value,\n this.disabled\n )\n : removeHiddenInput(this.el);\n\n return (\n <Host\n class={{\n [\"disabled\"]: this.disabled,\n [\"small\"]: this.small,\n [`${this.size \|\| parentElementSize}`]: true,\n }}\n >\n <div class=\"container\">\n {this.checked && !this.indeterminate && (\n <svg\n class=\"checkmark\"\n width=\"1.5rem\"\n height=\"1.5rem\"\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n >\n <title>checkmark icon</title>\n <path d=\"M21 6.285l-11.16 12.733-6.84-6.018 1.319-1.49 5.341 4.686 9.865-11.196 1.475 1.285z\" />\n </svg>\n )}\n {this.checked && this.indeterminate && (\n <div class=\"indeterminate-symbol\" />\n )}\n <input\n role=\"checkbox\"\n class={{\n [\"checkbox\"]: true,\n [\"checked\"]: this.checked,\n [\"indeterminate\"]: this.indeterminate,\n }}\n type=\"checkbox\"\n name={this.name}\n id={id}\n value={this.value}\n disabled={this.disabled ? true : null}\n checked={this.checked}\n indeterminate={this.indeterminate}\n onClick={this.handleClick}\n form={this.form}\n formaction={this.formaction}\n formenctype={this.formenctype}\n formmethod={this.formmethod}\n formnovalidate={this.formnovalidate}\n formtarget={this.formtarget}\n ></input>\n <ic-typography class=\"checkbox-label\" variant=\"body\">\n <label htmlFor={id}>{this.label}</label>\n </ic-typography>\n </div>\n {isSlotUsed(this.el, \"additional-field\") && (\n <div\n class=\"dynamic-container\"\n ref={(el) => (this.additionalFieldContainer = el)}\n >\n {this.additionalFieldDisplay === \"dynamic\" && (\n <div class=\"branch-corner\"></div>\n )}\n <div>\n {this.additionalFieldDisplay === \"dynamic\" && (\n <ic-typography variant=\"caption\">\n <p class=\"dynamic-text\" aria-live=\"polite\">\n {this.dynamicText}\n </p>\n </ic-typography>\n )}\n <div\n class={{\n \"additional-field-wrapper\":\n this.additionalFieldDisplay === \"static\",\n }}\n >\n <slot name=\"additional-field\"></slot>\n </div>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"]}

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

@@ -14,6 +14,13 @@ export class CheckboxGroup {
     this.validationStatus = "";
     this.validationText = "";
   }
+  handleChange(ev) {
+    //don't pass on the event if it has come from slotted text field
+    //otherwise any icChange handler bound to the checkbox group will also run
+    if (ev.target.tagName === "IC-TEXT-FIELD") {
+      ev.stopImmediatePropagation();
+    }
+  }
   componentWillLoad() {
     removeDisabledFalse(this.disabled, this.el);
   }
@@ -287,6 +294,12 @@ export class CheckboxGroup {
   static get elementRef() { return "el"; }
   static get listeners() {
     return [{
+        "name": "icChange",
+        "method": "handleChange",
+        "target": undefined,
+        "capture": false,
+        "passive": false
+      }, {
         "name": "icCheck",
         "method": "selectHandler",
         "target": undefined,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-checkbox-group.js","sourceRoot":"","sources":["../../../src/components/ic-checkbox-group/ic-checkbox-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,IAAI,EACJ,CAAC,EACD,IAAI,EACJ,MAAM,EACN,OAAO,EACP,KAAK,GAEN,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,uBAAuB,EACvB,mBAAmB,EACnB,gCAAgC,EAChC,mBAAmB,GACpB,MAAM,qBAAqB,CAAC;AAS7B,6DAA6D;AAC7D,MAAM,OAAO,aAAa;;oBAMI,KAAK;sBAKJ,EAAE;qBAKF,KAAK;;;oBAeN,KAAK;gBAKR,SAAS;iBAKT,KAAK;4BAKyB,EAAE;0BAKxB,EAAE;;~~EAOnC~~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","sourcesContent":["import {\n Component,\n Host,\n h,\n Prop,\n Listen,\n Element,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\nimport {\n getInputDescribedByText,\n hasValidationStatus,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcInformationStatusOrEmpty, IcSizes } from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-checkbox-group.types\";\n\n@Component({\n tag: \"ic-checkbox-group\",\n styleUrl: \"ic-checkbox-group.css\",\n shadow: true,\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class CheckboxGroup {\n @Element() el: HTMLIcCheckboxGroupElement;\n\n /*\n If `true`, the checkbox group will be set to the disabled state.\n /\n @Prop() disabled: boolean = false;\n\n /\n The helper text that will be displayed for additional field guidance.\n /\n @Prop() helperText: string = \"\";\n\n /\n If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n /\n @Prop() hideLabel: boolean = false;\n\n /\n The label for the checkbox group to be displayed.\n /\n @Prop() label!: string;\n\n /\n The name for the checkbox group to differentiate from other groups.\n /\n @Prop() name!: string;\n\n /\n If `true`, the checkbox group will require a value.\n /\n @Prop() required: boolean = false;\n\n /\n The size of the checkboxes to be displayed. This does not affect the font size of the label.\n /\n @Prop() size?: IcSizes = \"default\";\n\n /\n @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n /\n @Prop() small: boolean = false;\n\n /\n The validation status - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n /\n The validation text - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationText: string = \"\";\n\n /\n Emitted when a checkbox is checked.\n */\n @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n Array.from(this.el.querySelectorAll(\"ic-checkbox\")).forEach((checkbox) => {\n if (!checkbox.name) checkbox.name = this.name;\n checkbox.groupLabel = this.label;\n });\n\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.name, propName: \"name\" },\n ],\n \"Checkbox Group\"\n );\n }\n\n @Listen(\"icCheck\")\n selectHandler(ev: CustomEvent): void {\n const checkedOptions = Array.from(\n this.el.querySelectorAll(\"ic-checkbox\")\n ).filter((checkbox) => checkbox.checked && !checkbox.disabled);\n this.icChange.emit({\n value: checkedOptions.map((opt) => opt.value),\n checkedOptions: checkedOptions.map((opt) => ({\n checkbox: opt,\n textFieldValue: opt.querySelector(\"ic-text-field\")?.value,\n })),\n selectedOption: ev.target as HTMLIcCheckboxElement,\n });\n }\n\n render() {\n const describedBy = getInputDescribedByText(\n this.name,\n this.helperText !== \"\",\n this.validationStatus !== \"\"\n );\n const hadValidationStatus = hasValidationStatus(\n this.validationStatus,\n this.disabled\n );\n\n return (\n <Host class={{ [\"small\"]: this.small, [`${this.size}`]: true }}>\n {(this.validationStatus === \"error\" \|\|\n this.required \|\|\n this.hideLabel) && (\n <span\n id=\"screenReaderOnlyText\"\n class=\"screen-reader-only-text\"\n aria-hidden=\"true\"\n >\n {this.label}{\" \"}\n {this.validationStatus === \"error\" ? \"invalid data \" : null}{\" \"}\n {this.required ? \"required\" : null}\n </span>\n )}\n <fieldset\n id={this.name}\n aria-labelledby={`${\n this.validationStatus === \"error\" \|\| this.required \|\| this.hideLabel\n ? \"screenReaderOnlyText\"\n : \"\"\n } ${describedBy}`.trim()}\n disabled={this.disabled}\n >\n {!this.hideLabel && (\n <legend>\n <ic-input-label\n class={{ [`${this.validationStatus}`]: true }}\n label={this.label}\n helperText={this.helperText}\n required={this.required}\n disabled={this.disabled}\n for={this.name}\n ></ic-input-label>\n </legend>\n )}\n <div class=\"checkboxes-container\">\n <slot></slot>\n </div>\n </fieldset>\n {hadValidationStatus && (\n <ic-input-validation\n for={this.name}\n ariaLiveMode=\"polite\"\n status={this.validationStatus}\n message={this.validationText}\n ></ic-input-validation>\n )}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-checkbox-group.js","sourceRoot":"","sources":["../../../src/components/ic-checkbox-group/ic-checkbox-group.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Host,\n h,\n Prop,\n Listen,\n Element,\n Event,\n EventEmitter,\n} from \"@stencil/core\";\nimport {\n getInputDescribedByText,\n hasValidationStatus,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcInformationStatusOrEmpty, IcSizes } from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-checkbox-group.types\";\n\n@Component({\n tag: \"ic-checkbox-group\",\n styleUrl: \"ic-checkbox-group.css\",\n shadow: true,\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\nexport class CheckboxGroup {\n @Element() el: HTMLIcCheckboxGroupElement;\n\n /*\n If `true`, the checkbox group will be set to the disabled state.\n /\n @Prop() disabled: boolean = false;\n\n /\n The helper text that will be displayed for additional field guidance.\n /\n @Prop() helperText: string = \"\";\n\n /\n If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n /\n @Prop() hideLabel: boolean = false;\n\n /\n The label for the checkbox group to be displayed.\n /\n @Prop() label!: string;\n\n /\n The name for the checkbox group to differentiate from other groups.\n /\n @Prop() name!: string;\n\n /\n If `true`, the checkbox group will require a value.\n /\n @Prop() required: boolean = false;\n\n /\n The size of the checkboxes to be displayed. This does not affect the font size of the label.\n /\n @Prop() size?: IcSizes = \"default\";\n\n /\n @deprecated This prop should not be used anymore. Set prop `size` to \"small\" instead.\n /\n @Prop() small: boolean = false;\n\n /\n The validation status - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n /\n The validation text - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationText: string = \"\";\n\n /\n Emitted when a checkbox is checked.\n */\n @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n @Listen(\"icChange\")\n handleChange(ev: CustomEvent): void {\n //don't pass on the event if it has come from slotted text field\n //otherwise any icChange handler bound to the checkbox group will also run\n if ((ev.target as HTMLElement).tagName === \"IC-TEXT-FIELD\") {\n ev.stopImmediatePropagation();\n }\n }\n\n componentWillLoad(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n Array.from(this.el.querySelectorAll(\"ic-checkbox\")).forEach((checkbox) => {\n if (!checkbox.name) checkbox.name = this.name;\n checkbox.groupLabel = this.label;\n });\n\n onComponentRequiredPropUndefined(\n [\n { prop: this.label, propName: \"label\" },\n { prop: this.name, propName: \"name\" },\n ],\n \"Checkbox Group\"\n );\n }\n\n @Listen(\"icCheck\")\n selectHandler(ev: CustomEvent): void {\n const checkedOptions = Array.from(\n this.el.querySelectorAll(\"ic-checkbox\")\n ).filter((checkbox) => checkbox.checked && !checkbox.disabled);\n this.icChange.emit({\n value: checkedOptions.map((opt) => opt.value),\n checkedOptions: checkedOptions.map((opt) => ({\n checkbox: opt,\n textFieldValue: opt.querySelector(\"ic-text-field\")?.value,\n })),\n selectedOption: ev.target as HTMLIcCheckboxElement,\n });\n }\n\n render() {\n const describedBy = getInputDescribedByText(\n this.name,\n this.helperText !== \"\",\n this.validationStatus !== \"\"\n );\n const hadValidationStatus = hasValidationStatus(\n this.validationStatus,\n this.disabled\n );\n\n return (\n <Host class={{ [\"small\"]: this.small, [`${this.size}`]: true }}>\n {(this.validationStatus === \"error\" \|\|\n this.required \|\|\n this.hideLabel) && (\n <span\n id=\"screenReaderOnlyText\"\n class=\"screen-reader-only-text\"\n aria-hidden=\"true\"\n >\n {this.label}{\" \"}\n {this.validationStatus === \"error\" ? \"invalid data \" : null}{\" \"}\n {this.required ? \"required\" : null}\n </span>\n )}\n <fieldset\n id={this.name}\n aria-labelledby={`${\n this.validationStatus === \"error\" \|\| this.required \|\| this.hideLabel\n ? \"screenReaderOnlyText\"\n : \"\"\n } ${describedBy}`.trim()}\n disabled={this.disabled}\n >\n {!this.hideLabel && (\n <legend>\n <ic-input-label\n class={{ [`${this.validationStatus}`]: true }}\n label={this.label}\n helperText={this.helperText}\n required={this.required}\n disabled={this.disabled}\n for={this.name}\n ></ic-input-label>\n </legend>\n )}\n <div class=\"checkboxes-container\">\n <slot></slot>\n </div>\n </fieldset>\n {hadValidationStatus && (\n <ic-input-validation\n for={this.name}\n ariaLiveMode=\"polite\"\n status={this.validationStatus}\n message={this.validationText}\n ></ic-input-validation>\n )}\n </Host>\n );\n }\n}\n"]}

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

@@ -502,7 +502,7 @@ ic-tooltip:focus-within {
 .outline,
 .outlined {
   color: var(--ic-architectural-900);
-  border: var(--ic-space-1px) solid var(--ic-architectural-900);
+  border: var(--ic-border-width) solid var(--ic-architectural-900);
   padding: calc(var(--ic-space-xxs) - var(--ic-space-1px));
 }

package/dist/collection/components/ic-data-entity/ic-data-entity.css CHANGED Viewed

@@ -458,7 +458,7 @@ video {
 .divider {
   margin-top: var(--ic-space-lg);
   margin-bottom: var(--ic-space-md);
-  height: var(--ic-space-1px);
+  height: var(--ic-border-width);
   background-color: var(--ic-architectural-300);
 }

package/dist/collection/components/ic-data-row/ic-data-row.css CHANGED Viewed

@@ -488,7 +488,7 @@ slot[name="value"]::slotted(ic-text-field[readonly][hide-label][rows]) {
 .divider {
   margin-top: var(--ic-space-md);
-  height: var(--ic-space-1px);
+  height: var(--ic-border-width);
   background-color: var(--ic-architectural-300);
 }

package/dist/collection/components/ic-data-row/test/a11y/ic-data-row.test.a11y.js CHANGED Viewed

@@ -1,8 +1,10 @@
 import { fixture } from "@open-wc/testing-helpers";
 import { axe } from "jest-axe";
 import { checkShadowElementRendersCorrectly } from "../../../../utils/testa11y.helpers";
-describe("skeleton component", () => {
+describe("data row component", () => {
   it("passes accessibility", async () => {
+    const matchMedia = jest.fn().mockReturnValue(true);
+    window.matchMedia = matchMedia;
     const el = await fixture("<ic-data-row />");
     checkShadowElementRendersCorrectly(el);
     expect(await axe(el, {

package/dist/collection/components/ic-data-row/test/a11y/ic-data-row.test.a11y.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-data-row.test.a11y.js","sourceRoot":"","sources":["../../../../../src/components/ic-data-row/test/a11y/ic-data-row.test.a11y.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAC/B,OAAO,EAAE,kCAAkC,EAAE,MAAM,oCAAoC,CAAC;AAExF,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;EAClC,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;IACpC,MAAM,EAAE,GAAG,MAAM,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAC5C,kCAAkC,CAAC,EAAE,CAAC,CAAC;IACvC,MAAM,CACJ,MAAM,GAAG,CAAC,EAAE,EAAE;MACZ,wDAAwD;MACxD,KAAK,EAAE;QACL,sBAAsB,EAAE;UACtB,OAAO,EAAE,KAAK;SACf;OACF;KACF,CAAC,CACH,CAAC,kBAAkB,EAAE,CAAC;EACzB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { fixture } from \"@open-wc/testing-helpers\";\nimport { axe } from \"jest-axe\";\nimport { checkShadowElementRendersCorrectly } from \"../../../../utils/testa11y.helpers\";\n\ndescribe(\"~~skeleton~~ component\", () => {\n it(\"passes accessibility\", async () => {\n const el = await fixture(\"<ic-data-row />\");\n checkShadowElementRendersCorrectly(el);\n expect(\n await axe(el, {\n // Rule met by wrapping slot in parent component in <ul>\n rules: {\n \"aria-required-parent\": {\n enabled: false,\n },\n },\n })\n ).toHaveNoViolations();\n });\n});\n"]}
1	+ {"version":3,"file":"ic-data-row.test.a11y.js","sourceRoot":"","sources":["../../../../../src/components/ic-data-row/test/a11y/ic-data-row.test.a11y.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,UAAU,CAAC;AAC/B,OAAO,EAAE,kCAAkC,EAAE,MAAM,oCAAoC,CAAC;AAExF,QAAQ,CAAC,oBAAoB,EAAE,GAAG,EAAE;EAClC,EAAE,CAAC,sBAAsB,EAAE,KAAK,IAAI,EAAE;IACpC,MAAM,UAAU,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;IACnD,MAAM,CAAC,UAAU,GAAG,UAAU,CAAC;IAC/B,MAAM,EAAE,GAAG,MAAM,OAAO,CAAC,iBAAiB,CAAC,CAAC;IAC5C,kCAAkC,CAAC,EAAE,CAAC,CAAC;IACvC,MAAM,CACJ,MAAM,GAAG,CAAC,EAAE,EAAE;MACZ,wDAAwD;MACxD,KAAK,EAAE;QACL,sBAAsB,EAAE;UACtB,OAAO,EAAE,KAAK;SACf;OACF;KACF,CAAC,CACH,CAAC,kBAAkB,EAAE,CAAC;EACzB,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { fixture } from \"@open-wc/testing-helpers\";\nimport { axe } from \"jest-axe\";\nimport { checkShadowElementRendersCorrectly } from \"../../../../utils/testa11y.helpers\";\n\ndescribe(\"data row component\", () => {\n it(\"passes accessibility\", async () => {\n const matchMedia = jest.fn().mockReturnValue(true);\n window.matchMedia = matchMedia;\n const el = await fixture(\"<ic-data-row />\");\n checkShadowElementRendersCorrectly(el);\n expect(\n await axe(el, {\n // Rule met by wrapping slot in parent component in <ul>\n rules: {\n \"aria-required-parent\": {\n enabled: false,\n },\n },\n })\n ).toHaveNoViolations();\n });\n});\n"]}