npm - @ukic/web-components - Versions diffs - 3.0.0-alpha.6 → 3.0.0-alpha.8 - Mend

@ukic/web-components 3.0.0-alpha.6 → 3.0.0-alpha.8

Files changed (385) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-toggle-button-group.js","sourceRoot":"","sources":["../../../src/components/ic-toggle-button-group/ic-toggle-button-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 State,\n Watch,\n} from \"@stencil/core\";\nimport {\n IcSizes,\n IcSelectTypes,\n IcSelectMethodTypes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-toggle-button-group.types\";\nimport { removeDisabledFalse } from \"../../utils/helpers\";\n\ninterface lastKey {\n key: string \| null;\n shift: boolean;\n}\n\nconst TOGGLE_GROUP = \"IC-TOGGLE-BUTTON-GROUP\";\n\n@Component({\n tag: \"ic-toggle-button-group\",\n styleUrl: \"ic-toggle-button-group.css\",\n shadow: true,\n})\nexport class ToggleButtonGroup {\n @Element() el: HTMLIcToggleButtonGroupElement;\n\n @State() lastKeyPressed: lastKey = {\n key: null,\n shift: false,\n };\n\n /*\n The accessible label of the toggle button group component to provide context for screen reader users.\n /\n @Prop() accessibleLabel?: string = \"Toggle button group\";\n\n /\n If `true`, the toggle button group will be set to the disabled state.\n /\n @Prop() disabled: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n this.getAllToggleButtons().forEach((el) => {\n el.disabled = this.disabled;\n });\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the toggle button group will fill the width of the container.\n /\n @Prop() fullWidth?: boolean = false;\n\n /\n The placement of the icons in relation to the toggle button labels.\n /\n @Prop() iconPlacement?: \"left\" \| \"right\" \| \"top\";\n\n /\n If `true`, the toggle button group will be in loading state.\n /\n @Prop() loading?: boolean = false;\n\n /\n If `true`, the toggle button group will display as black in the light theme, and white in dark theme.\n /\n @Prop() monochrome?: boolean = false;\n @Watch(\"monochrome\")\n watchMonochromeHandler(): void {\n this.getAllToggleButtons().forEach((el) => {\n el.monochrome = this.monochrome;\n });\n }\n\n /\n If `auto`, controls are toggled automatically when navigated to. If `manual`, the controls must be actioned to change their toggled state. The value of this prop is ignored if `selectType` is set to`multi`.\n /\n @Prop({ mutable: true }) selectMethod?: IcSelectMethodTypes = \"manual\";\n\n /\n Sets whether single or multiple options can be toggled. If `multi`, then the `selectMethod` is always `manual`.\n /\n @Prop() selectType?: IcSelectTypes = \"single\";\n\n /\n The size of the toggle buttons to be displayed. This does not affect the font size of the accessible label.\n /\n @Prop() size?: IcSizes = \"medium\";\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.getAllToggleButtons().forEach((el) => {\n el.theme = this.theme;\n });\n }\n\n /\n The variant of the toggle button.\n /\n @Prop({ reflect: true }) variant: \"default\" \| \"icon\" = \"default\";\n\n /\n Emitted when a toggle button is selected.\n */\n @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n @Listen(\"icToggleChecked\")\n selectHandler(ev: CustomEvent, tabTarget?: HTMLIcToggleButtonElement): void {\n const allToggles = this.getAllToggleButtons();\n let clickedToggle = ev.target as HTMLIcToggleButtonElement;\n // tabTarget used in proxySelectHandler\n tabTarget && tabTarget.focus();\n if (this.selectType === \"single\") {\n if (!clickedToggle) {\n clickedToggle = tabTarget;\n }\n allToggles.forEach((el) => {\n if (el.id !== clickedToggle.id && el.checked) {\n el.checked = false;\n }\n });\n\n this.icChange.emit({\n checked: ev.detail.checked,\n selectedOption: clickedToggle,\n });\n } else {\n const toggledOptions = this.getAllToggleButtons().filter(\n (el) => el.checked && !el.disabled\n );\n\n this.icChange.emit({\n checked: toggledOptions.map((opt) => opt.checked),\n toggledOptions: toggledOptions.map((opt) => ({\n toggleButton: opt,\n })),\n selectedOption: clickedToggle,\n });\n }\n }\n\n componentWillLoad(): void {\n this.selectType === \"multi\" && (this.selectMethod = \"manual\");\n this.selectMethod === \"auto\" && this.selectType === \"single\";\n document.addEventListener(\"keydown\", this.keyListener);\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n this.getAllToggleButtons().forEach((el, i) => {\n this.setSlottedAria(el);\n el.size = this.size;\n el.loading = this.loading;\n el.iconPlacement = this.iconPlacement;\n el.disabled ? null : (el.disabled = this.disabled);\n el.theme = this.theme;\n el.monochrome = this.monochrome;\n el.variant = this.variant;\n el.fullWidth = this.fullWidth;\n el.id = i.toString();\n el.tabIndex = -1;\n el.addEventListener(\"keydown\", (ev) => {\n this.handleKeyDown(ev);\n });\n el.classList.add(\"expand-toggle-group-child\");\n });\n }\n\n disconnectedCallback(): void {\n document?.removeEventListener(\"keydown\", this.keyListener);\n }\n\n private keyListener = (ev: KeyboardEvent) => {\n this.lastKeyPressed = {\n key: ev.key,\n shift: ev.shiftKey,\n };\n };\n\n private setSlottedAria = (el: HTMLIcToggleButtonElement) => {\n const btn = el.shadowRoot\n .querySelector(\"ic-button\")\n .shadowRoot.querySelector(\"button\") as HTMLButtonElement;\n let aria = btn.getAttribute(\"aria-label\");\n aria += \", \";\n aria += this.accessibleLabel;\n btn.setAttribute(\"aria-label\", aria);\n };\n\n private handleHostFocus = (ev: FocusEvent): void => {\n if (this.loading \|\| this.disabled) {\n return null;\n }\n const el = ev.target as HTMLIcToggleButtonGroupElement;\n const relEl = ev.relatedTarget as HTMLIcToggleButtonElement;\n const toggleButtons = Array.from(el.querySelectorAll(\"ic-toggle-button\"));\n if (\n ((toggleButtons.every((el) => !el.checked) \|\|\n this.selectType !== \"single\") &&\n this.lastKeyPressed.shift === false) \|\|\n (toggleButtons.every((el) => !el.checked) &&\n this.lastKeyPressed.shift === true &&\n relEl.tagName == TOGGLE_GROUP)\n ) {\n toggleButtons[0].focus();\n } else if (\n this.lastKeyPressed.shift === false \|\|\n (this.lastKeyPressed.shift === true && relEl.tagName == TOGGLE_GROUP)\n ) {\n // if checked is true and selectMethod is \"single\", focus that toggle\n const toggledButton = toggleButtons.filter((el) => el.checked);\n toggledButton[0].focus();\n }\n };\n\n // trigger selectHandler when unable to add 'target'\n private proxySelectHandler(toggle: HTMLIcToggleButtonElement): void {\n toggle.checked = true;\n const customEv = new CustomEvent(\"icToggleChecked\", {\n detail: {\n checked: toggle.checked,\n },\n });\n this.selectHandler(customEv, toggle);\n }\n\n private handleKeyDown = (event: KeyboardEvent): void => {\n const toggleButtonOptions = this.getAllToggleButtons();\n const focussedChild = toggleButtonOptions.indexOf(\n toggleButtonOptions.filter((el) => el === document.activeElement)[0]\n );\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowRight\":\n this.selectMethod === \"auto\"\n ? this.proxySelectHandler(\n toggleButtonOptions[this.getNextItemToSelect(focussedChild, true)]\n )\n : toggleButtonOptions[\n this.getNextItemToSelect(focussedChild, true)\n ].focus();\n break;\n case \"ArrowUp\":\n case \"ArrowLeft\":\n this.selectMethod === \"auto\"\n ? this.proxySelectHandler(\n toggleButtonOptions[\n this.getNextItemToSelect(focussedChild, false)\n ]\n )\n : toggleButtonOptions[\n this.getNextItemToSelect(focussedChild, false)\n ].focus();\n break;\n case \"Tab\":\n break;\n }\n };\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const toggleButtonOptions = this.getAllToggleButtons();\n const numToggles = toggleButtonOptions.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n if (nextItem < 0) {\n nextItem = numToggles;\n } else if (nextItem > numToggles) {\n nextItem = 0;\n }\n\n if (toggleButtonOptions[nextItem].disabled) {\n nextItem = this.getNextItemToSelect(nextItem, movingDown);\n }\n\n return nextItem;\n };\n\n private getAllToggleButtons(): HTMLIcToggleButtonElement[] {\n return Array.from(this.el.querySelectorAll(\"ic-toggle-button\"));\n }\n\n render() {\n return (\n <Host\n role=\"group\"\n aria-label={this.accessibleLabel}\n aria-disabled={this.disabled ? \"true\" : \"false\"}\n tabindex={0}\n class={{\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n [\"ic-toggle-button-group-full-width\"]: this.fullWidth,\n [\"ic-toggle-button-group-loading\"]: this.loading,\n [\"ic-toggle-button-group-disabled\"]: this.disabled,\n [`ic-toggle-button-group-monochrome`]: this.monochrome,\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n }}\n onFocus={this.handleHostFocus}\n >\n <slot></slot>\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-toggle-button-group.js","sourceRoot":"","sources":["../../../src/components/ic-toggle-button-group/ic-toggle-button-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 State,\n Watch,\n} from \"@stencil/core\";\nimport {\n IcSizes,\n IcSelectTypes,\n IcSelectMethodTypes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-toggle-button-group.types\";\nimport { removeDisabledFalse } from \"../../utils/helpers\";\n\ninterface lastKey {\n key: string \| null;\n shift: boolean;\n}\n\nconst TOGGLE_GROUP = \"IC-TOGGLE-BUTTON-GROUP\";\n\n@Component({\n tag: \"ic-toggle-button-group\",\n styleUrl: \"ic-toggle-button-group.css\",\n shadow: true,\n})\nexport class ToggleButtonGroup {\n @Element() el: HTMLIcToggleButtonGroupElement;\n\n @State() lastKeyPressed: lastKey = {\n key: null,\n shift: false,\n };\n\n /*\n The accessible label of the toggle button group component to provide context for screen reader users.\n /\n @Prop() accessibleLabel?: string = \"Toggle button group\";\n\n /\n If `true`, the toggle button group will be set to the disabled state.\n /\n @Prop() disabled: boolean = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n this.getAllToggleButtons().forEach((el) => {\n el.disabled = this.disabled;\n });\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the toggle button group will fill the width of the container.\n /\n @Prop() fullWidth?: boolean = false;\n @Watch(\"fullWidth\")\n watchFullWidthHandler(): void {\n this.getAllToggleButtons().forEach((el) => {\n el.fullWidth = this.fullWidth;\n });\n }\n\n /\n The placement of the icons in relation to the toggle button labels.\n /\n @Prop() iconPlacement?: \"left\" \| \"right\" \| \"top\";\n\n /\n If `true`, the toggle button group will be in loading state.\n /\n @Prop() loading?: boolean = false;\n @Watch(\"loading\")\n watchLoadingHandler(): void {\n this.getAllToggleButtons().forEach((el) => {\n el.loading = this.loading;\n });\n }\n\n /\n If `true`, the toggle button group will display as black in the light theme, and white in dark theme.\n /\n @Prop() monochrome?: boolean = false;\n @Watch(\"monochrome\")\n watchMonochromeHandler(): void {\n this.getAllToggleButtons().forEach((el) => {\n el.monochrome = this.monochrome;\n });\n }\n\n /\n If `auto`, controls are toggled automatically when navigated to. If `manual`, the controls must be actioned to change their toggled state. The value of this prop is ignored if `selectType` is set to`multi`.\n /\n @Prop({ mutable: true }) selectMethod?: IcSelectMethodTypes = \"manual\";\n\n /\n Sets whether single or multiple options can be toggled. If `multi`, then the `selectMethod` is always `manual`.\n /\n @Prop() selectType?: IcSelectTypes = \"single\";\n\n /\n The size of the toggle buttons to be displayed. This does not affect the font size of the accessible label.\n /\n @Prop() size?: IcSizes = \"medium\";\n @Watch(\"size\")\n watchSizeHandler(): void {\n this.getAllToggleButtons().forEach((el) => {\n el.size = this.size;\n });\n }\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.getAllToggleButtons().forEach((el) => {\n el.theme = this.theme;\n });\n }\n\n /\n The variant of the toggle button.\n /\n @Prop({ reflect: true }) variant: \"default\" \| \"icon\" = \"default\";\n @Watch(\"variant\")\n watchVariantHandler(): void {\n this.getAllToggleButtons().forEach((el) => {\n el.variant = this.variant;\n });\n }\n\n /\n Emitted when a toggle button is selected.\n */\n @Event() icChange: EventEmitter<IcChangeEventDetail>;\n\n @Listen(\"icToggleChecked\")\n selectHandler(ev: CustomEvent, tabTarget?: HTMLIcToggleButtonElement): void {\n const allToggles = this.getAllToggleButtons();\n let clickedToggle = ev.target as HTMLIcToggleButtonElement;\n // tabTarget used in proxySelectHandler\n tabTarget && tabTarget.focus();\n if (this.selectType === \"single\") {\n if (!clickedToggle) {\n clickedToggle = tabTarget;\n }\n allToggles.forEach((el) => {\n if (el.id !== clickedToggle.id && el.checked) {\n el.checked = false;\n }\n });\n\n this.icChange.emit({\n checked: ev.detail.checked,\n selectedOption: clickedToggle,\n });\n } else {\n const toggledOptions = this.getAllToggleButtons().filter(\n (el) => el.checked && !el.disabled\n );\n\n this.icChange.emit({\n checked: toggledOptions.map((opt) => opt.checked),\n toggledOptions: toggledOptions.map((opt) => ({\n toggleButton: opt,\n })),\n selectedOption: clickedToggle,\n });\n }\n }\n\n componentWillLoad(): void {\n this.selectType === \"multi\" && (this.selectMethod = \"manual\");\n this.selectMethod === \"auto\" && this.selectType === \"single\";\n document.addEventListener(\"keydown\", this.keyListener);\n removeDisabledFalse(this.disabled, this.el);\n }\n\n componentDidLoad(): void {\n this.getAllToggleButtons().forEach((el, i) => {\n this.setSlottedAria(el);\n el.id = i.toString();\n el.tabIndex = -1;\n el.addEventListener(\"keydown\", (ev) => {\n this.handleKeyDown(ev);\n });\n el.classList.add(\"expand-toggle-group-child\");\n });\n }\n\n disconnectedCallback(): void {\n document?.removeEventListener(\"keydown\", this.keyListener);\n }\n\n private keyListener = (ev: KeyboardEvent) => {\n this.lastKeyPressed = {\n key: ev.key,\n shift: ev.shiftKey,\n };\n };\n\n private setSlottedAria = (el: HTMLIcToggleButtonElement) => {\n const btn = el.shadowRoot\n .querySelector(\"ic-button\")\n .shadowRoot.querySelector(\"button\") as HTMLButtonElement;\n let aria = btn.getAttribute(\"aria-label\");\n aria += \", \";\n aria += this.accessibleLabel;\n btn.setAttribute(\"aria-label\", aria);\n };\n\n private handleHostFocus = (ev: FocusEvent): void => {\n if (this.loading \|\| this.disabled) {\n return null;\n }\n const el = ev.target as HTMLIcToggleButtonGroupElement;\n const relEl = ev.relatedTarget as HTMLIcToggleButtonElement;\n const toggleButtons = Array.from(el.querySelectorAll(\"ic-toggle-button\"));\n if (\n ((toggleButtons.every((el) => !el.checked) \|\|\n this.selectType !== \"single\") &&\n this.lastKeyPressed.shift === false) \|\|\n (toggleButtons.every((el) => !el.checked) &&\n this.lastKeyPressed.shift === true &&\n relEl.tagName == TOGGLE_GROUP)\n ) {\n toggleButtons[0].focus();\n } else if (\n this.lastKeyPressed.shift === false \|\|\n (this.lastKeyPressed.shift === true && relEl.tagName == TOGGLE_GROUP)\n ) {\n // if checked is true and selectMethod is \"single\", focus that toggle\n const toggledButton = toggleButtons.filter((el) => el.checked);\n toggledButton[0].focus();\n }\n };\n\n // trigger selectHandler when unable to add 'target'\n private proxySelectHandler(toggle: HTMLIcToggleButtonElement): void {\n toggle.checked = true;\n const customEv = new CustomEvent(\"icToggleChecked\", {\n detail: {\n checked: toggle.checked,\n },\n });\n this.selectHandler(customEv, toggle);\n }\n\n private handleKeyDown = (event: KeyboardEvent): void => {\n const toggleButtonOptions = this.getAllToggleButtons();\n const focussedChild = toggleButtonOptions.indexOf(\n toggleButtonOptions.filter((el) => el === document.activeElement)[0]\n );\n switch (event.key) {\n case \"ArrowDown\":\n case \"ArrowRight\":\n this.selectMethod === \"auto\"\n ? this.proxySelectHandler(\n toggleButtonOptions[this.getNextItemToSelect(focussedChild, true)]\n )\n : toggleButtonOptions[\n this.getNextItemToSelect(focussedChild, true)\n ].focus();\n break;\n case \"ArrowUp\":\n case \"ArrowLeft\":\n this.selectMethod === \"auto\"\n ? this.proxySelectHandler(\n toggleButtonOptions[\n this.getNextItemToSelect(focussedChild, false)\n ]\n )\n : toggleButtonOptions[\n this.getNextItemToSelect(focussedChild, false)\n ].focus();\n break;\n case \"Tab\":\n break;\n }\n };\n\n private getNextItemToSelect = (\n currentItem: number,\n movingDown: boolean\n ): number => {\n const toggleButtonOptions = this.getAllToggleButtons();\n const numToggles = toggleButtonOptions.length - 1;\n\n if (currentItem < 1) {\n currentItem = 0;\n }\n\n let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n if (nextItem < 0) {\n nextItem = numToggles;\n } else if (nextItem > numToggles) {\n nextItem = 0;\n }\n\n if (toggleButtonOptions[nextItem].disabled) {\n nextItem = this.getNextItemToSelect(nextItem, movingDown);\n }\n\n return nextItem;\n };\n\n private getAllToggleButtons(): HTMLIcToggleButtonElement[] {\n return Array.from(this.el.querySelectorAll(\"ic-toggle-button\"));\n }\n\n render() {\n return (\n <Host\n role=\"group\"\n aria-label={this.accessibleLabel}\n tabindex={0}\n class={{\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n [\"ic-toggle-button-group-full-width\"]: this.fullWidth,\n [\"ic-toggle-button-group-loading\"]: this.loading,\n [\"ic-toggle-button-group-disabled\"]: this.disabled,\n [`ic-toggle-button-group-monochrome`]: this.monochrome,\n [`ic-theme-${this.theme}`]: this.theme !== \"inherit\",\n }}\n onFocus={this.handleHostFocus}\n >\n <slot></slot>\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ic-toggle-button-group/test/ic-toggle-button-group.spec.js CHANGED Viewed

@@ -16,15 +16,15 @@ describe("ic-toggle-button-group component snapshot tests", () => {
             </ic-toggle-button-group>`,
         });
         expect(page.root)
-            .toEqualHtml(`<ic-toggle-button-group aria-disabled="true" aria-label="Toggle button group" class="ic-toggle-button-group-disabled" disabled="" role="group" select-type="single" tabindex="0" variant="default">
+            .toEqualHtml(`<ic-toggle-button-group aria-label="Toggle button group" class="ic-toggle-button-group-disabled" disabled="" role="group" select-type="single" tabindex="0" variant="default">
       <mock:shadow-root>
         <slot></slot>
       </mock:shadow-root>
       <ic-toggle-button class="expand-toggle-group-child ic-toggle-button-disabled ic-toggle-button-medium" id="0" label="Toggle" tabindex="-1" variant="default">
         <mock:shadow-root>
-          <ic-button aria-disabled="true" aria-pressed="false" class="ic-button-disabled ic-button-size-medium ic-button-variant-secondary" exportparts="button">
+          <ic-button aria-pressed="false" class="ic-button-disabled ic-button-size-medium ic-button-variant-secondary" exportparts="button">
             <mock:shadow-root>
-              <button aria-disabled="false" aria-label="Toggle, unticked, Toggle button group" class="button" disabled="" part="button" type="button">
+              <button aria-disabled="true" aria-label="Toggle, unticked, Toggle button group" class="button" disabled="" part="button" type="button">
                 <slot></slot>
               </button>
             </mock:shadow-root>
@@ -35,9 +35,9 @@ describe("ic-toggle-button-group component snapshot tests", () => {
       </ic-toggle-button>
       <ic-toggle-button class="expand-toggle-group-child ic-toggle-button-disabled ic-toggle-button-medium" id="1" label="Toggle" tabindex="-1" variant="default">
         <mock:shadow-root>
-          <ic-button aria-disabled="true" aria-pressed="false" class="ic-button-disabled ic-button-size-medium ic-button-variant-secondary" exportparts="button">
+          <ic-button aria-pressed="false" class="ic-button-disabled ic-button-size-medium ic-button-variant-secondary" exportparts="button">
             <mock:shadow-root>
-              <button aria-disabled="false" aria-label="Toggle, unticked, Toggle button group" class="button" disabled="" part="button" type="button">
+              <button aria-disabled="true" aria-label="Toggle, unticked, Toggle button group" class="button" disabled="" part="button" type="button">
                 <slot></slot>
               </button>
             </mock:shadow-root>
@@ -48,9 +48,9 @@ describe("ic-toggle-button-group component snapshot tests", () => {
       </ic-toggle-button>
       <ic-toggle-button class="expand-toggle-group-child ic-toggle-button-disabled ic-toggle-button-medium" id="2" label="Toggle" tabindex="-1" variant="default">
         <mock:shadow-root>
-          <ic-button aria-disabled="true" aria-pressed="false" class="ic-button-disabled ic-button-size-medium ic-button-variant-secondary" exportparts="button">
+          <ic-button aria-pressed="false" class="ic-button-disabled ic-button-size-medium ic-button-variant-secondary" exportparts="button">
             <mock:shadow-root>
-              <button aria-disabled="false" aria-label="Toggle, unticked, Toggle button group" class="button" disabled="" part="button" type="button">
+              <button aria-disabled="true" aria-label="Toggle, unticked, Toggle button group" class="button" disabled="" part="button" type="button">
                 <slot></slot>
               </button>
             </mock:shadow-root>
@@ -63,15 +63,15 @@ describe("ic-toggle-button-group component snapshot tests", () => {
         page.rootInstance.disabled = false;
         await page.waitForChanges();
         expect(page.root)
-            .toEqualHtml(`<ic-toggle-button-group aria-disabled="false" aria-label="Toggle button group" role="group" select-type="single" tabindex="0" variant="default">
+            .toEqualHtml(`<ic-toggle-button-group aria-label="Toggle button group" role="group" select-type="single" tabindex="0" variant="default">
       <mock:shadow-root>
         <slot></slot>
       </mock:shadow-root>
       <ic-toggle-button class="expand-toggle-group-child ic-toggle-button-medium" id="0" label="Toggle" tabindex="-1" variant="default">
         <mock:shadow-root>
-          <ic-button aria-disabled="false" aria-pressed="false" class="ic-button-size-medium ic-button-variant-secondary" exportparts="button">
+          <ic-button aria-pressed="false" class="ic-button-size-medium ic-button-variant-secondary" exportparts="button">
             <mock:shadow-root>
-              <button aria-disabled="false" aria-label="Toggle, unticked, Toggle button group" class="button" part="button" type="button">
+              <button aria-label="Toggle, unticked, Toggle button group" class="button" part="button" type="button">
                 <slot></slot>
               </button>
             </mock:shadow-root>
@@ -82,9 +82,9 @@ describe("ic-toggle-button-group component snapshot tests", () => {
       </ic-toggle-button>
       <ic-toggle-button class="expand-toggle-group-child ic-toggle-button-medium" id="1" label="Toggle" tabindex="-1" variant="default">
         <mock:shadow-root>
-          <ic-button aria-disabled="false" aria-pressed="false" class="ic-button-size-medium ic-button-variant-secondary" exportparts="button">
+          <ic-button aria-pressed="false" class="ic-button-size-medium ic-button-variant-secondary" exportparts="button">
             <mock:shadow-root>
-              <button aria-disabled="false" aria-label="Toggle, unticked, Toggle button group" class="button" part="button" type="button">
+              <button aria-label="Toggle, unticked, Toggle button group" class="button" part="button" type="button">
                 <slot></slot>
               </button>
             </mock:shadow-root>
@@ -95,9 +95,9 @@ describe("ic-toggle-button-group component snapshot tests", () => {
       </ic-toggle-button>
       <ic-toggle-button class="expand-toggle-group-child ic-toggle-button-medium" id="2" label="Toggle" tabindex="-1" variant="default">
         <mock:shadow-root>
-          <ic-button aria-disabled="false" aria-pressed="false" class="ic-button-size-medium ic-button-variant-secondary" exportparts="button">
+          <ic-button aria-pressed="false" class="ic-button-size-medium ic-button-variant-secondary" exportparts="button">
             <mock:shadow-root>
-              <button aria-disabled="false" aria-label="Toggle, unticked, Toggle button group" class="button" part="button" type="button">
+              <button aria-label="Toggle, unticked, Toggle button group" class="button" part="button" type="button">
                 <slot></slot>
               </button>
             </mock:shadow-root>
@@ -108,6 +108,71 @@ describe("ic-toggle-button-group component snapshot tests", () => {
       </ic-toggle-button>
     </ic-toggle-button-group>`);
     });
+    it("should render and update full-width", async () => {
+        const page = await newSpecPage({
+            components: [ToggleButtonGroup, ToggleButton, Button],
+            html: `<ic-toggle-button-group select-type="single" full-width>
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+            </ic-toggle-button-group>`,
+        });
+        expect(page.root).toMatchSnapshot();
+        page.rootInstance.fullWidth = false;
+        await page.waitForChanges();
+        expect(page.root).toMatchSnapshot();
+    });
+    it("should render and update loading", async () => {
+        const page = await newSpecPage({
+            components: [ToggleButtonGroup, ToggleButton, Button],
+            html: `<ic-toggle-button-group select-type="single" loading>
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+            </ic-toggle-button-group>`,
+        });
+        expect(page.root).toMatchSnapshot();
+        page.rootInstance.loading = false;
+        await page.waitForChanges();
+        expect(page.root).toMatchSnapshot();
+    });
+    it("should render and update monochrome", async () => {
+        const page = await newSpecPage({
+            components: [ToggleButtonGroup, ToggleButton, Button],
+            html: `<ic-toggle-button-group select-type="single" monochrome>
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+            </ic-toggle-button-group>`,
+        });
+        expect(page.root).toMatchSnapshot();
+        page.rootInstance.monochrome = false;
+        await page.waitForChanges();
+        expect(page.root).toMatchSnapshot();
+    });
+    it("should render and update size", async () => {
+        const page = await newSpecPage({
+            components: [ToggleButtonGroup, ToggleButton, Button],
+            html: `<ic-toggle-button-group select-type="single" size="small">
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+            </ic-toggle-button-group>`,
+        });
+        expect(page.root).toMatchSnapshot();
+        page.rootInstance.size = "large";
+        await page.waitForChanges();
+        expect(page.root).toMatchSnapshot();
+    });
+    it("should render and update variant", async () => {
+        const page = await newSpecPage({
+            components: [ToggleButtonGroup, ToggleButton, Button],
+            html: `<ic-toggle-button-group select-type="single" variant="icon">
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+              <ic-toggle-button label="Toggle"></ic-toggle-button>
+            </ic-toggle-button-group>`,
+        });
+        expect(page.root).toMatchSnapshot();
+        page.rootInstance.variant = "default";
+        await page.waitForChanges();
+        expect(page.root).toMatchSnapshot();
+    });
 });
 describe("ic-toggle-button-group component unit tests", () => {
     it("should getAllToggleButtons and return an array of slotted ic-toggle-buttons", async () => {

package/dist/collection/components/ic-toggle-button-group/test/ic-toggle-button-group.spec.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-toggle-button-group.spec.js","sourceRoot":"","sources":["../../../../src/components/ic-toggle-button-group/test/ic-toggle-button-group.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { ToggleButtonGroup } from \"../ic-toggle-button-group\";\nimport { ToggleButton } from \"../../ic-toggle-button/ic-toggle-button\";\nimport { Button } from \"../../ic-button/ic-button\";\n\nconst keyboard = (key: string): KeyboardEvent => {\n return new KeyboardEvent(\"keydown\", { key: key });\n};\n\ndescribe(\"ic-toggle-button-group component snapshot tests\", () => {\n it(\"should render and update disabled\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\" disabled>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n expect(page.root)\n .toEqualHtml(`<ic-toggle-button-group aria-disabled=\"true\" aria-label=\"Toggle button group\" class=\"ic-toggle-button-group-disabled\" disabled=\"\" role=\"group\" select-type=\"single\" tabindex=\"0\" variant=\"default\">\n <mock:shadow-root>\n <slot></slot>\n </mock:shadow-root>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-disabled ic-toggle-button-medium\" id=\"0\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-disabled=\"true\" aria-pressed=\"false\" class=\"ic-button-disabled ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-disabled=\"false\" aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" disabled=\"\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-disabled ic-toggle-button-medium\" id=\"1\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-disabled=\"true\" aria-pressed=\"false\" class=\"ic-button-disabled ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-disabled=\"false\" aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" disabled=\"\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-disabled ic-toggle-button-medium\" id=\"2\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-disabled=\"true\" aria-pressed=\"false\" class=\"ic-button-disabled ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-disabled=\"false\" aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" disabled=\"\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n </ic-toggle-button-group>`);\n\n page.rootInstance.disabled = false;\n\n await page.waitForChanges();\n expect(page.root)\n .toEqualHtml(`<ic-toggle-button-group aria-disabled=\"false\" aria-label=\"Toggle button group\" role=\"group\" select-type=\"single\" tabindex=\"0\" variant=\"default\">\n <mock:shadow-root>\n <slot></slot>\n </mock:shadow-root>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-medium\" id=\"0\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-disabled=\"false\" aria-pressed=\"false\" class=\"ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-disabled=\"false\" aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-medium\" id=\"1\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-disabled=\"false\" aria-pressed=\"false\" class=\"ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-disabled=\"false\" aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-medium\" id=\"2\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-disabled=\"false\" aria-pressed=\"false\" class=\"ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-disabled=\"false\" aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n </ic-toggle-button-group>`);\n });\n});\n\ndescribe(\"ic-toggle-button-group component unit tests\", () => {\n it(\"should getAllToggleButtons and return an array of slotted ic-toggle-buttons\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\" size=\"small\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const toggleButtonArray = page.rootInstance.getAllToggleButtons();\n await page.waitForChanges();\n expect(toggleButtonArray.length).toBe(3);\n });\n it(\"should test when the toggle button group receives focus, it should cause the first toggle button inside the group to get focused (when select method is 'single' and no item is already selected)\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.waitForChanges();\n toggleGroup.focus();\n\n await page.waitForChanges();\n\n expect(buttons[0].checked).toBeFalsy();\n });\n it(\"should test that focusing group when an ic-toggle-button selected should not select first option\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.waitForChanges();\n\n buttons[1].checked = true;\n\n toggleGroup.focus();\n\n await page.waitForChanges();\n\n expect(buttons[0].checked).toBeFalsy();\n expect(buttons[1].checked).toBeTruthy();\n });\n it(\"should test that focusing the toggle-button-group focuses, but does not not select, the first ic-toggle-button when select method is 'multi'\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"multi\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.waitForChanges();\n\n toggleGroup.focus();\n\n await page.waitForChanges();\n\n expect(buttons[0].checked).toBeFalsy();\n });\n it(\"should test that focusing the toggle-button-group focuses, but does not not select, the first ic-toggle-button when select method is 'multi'\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"multi\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const eventSpy = jest.fn();\n page.win.addEventListener(\"icChange\", eventSpy);\n\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.waitForChanges();\n buttons[0].checked = true;\n buttons[1].checked = true;\n\n const customEv = new CustomEvent(\"icToggleChecked\", {});\n\n page.rootInstance.selectHandler(customEv);\n\n await page.waitForChanges();\n\n expect(eventSpy).toHaveBeenCalled();\n });\n it(\"should test handleKeyDown function\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-method=\"auto\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const firstButton = (await document.querySelector(\n \"#0\"\n )) as HTMLIcToggleButtonElement;\n const secondButton = (await document.querySelector(\n \"#1\"\n )) as HTMLIcToggleButtonElement;\n const thirdButton = (await document.querySelector(\n \"#2\"\n )) as HTMLIcToggleButtonElement;\n\n expect(firstButton.checked).toBeFalsy();\n await firstButton.click();\n expect(firstButton.checked).toBeTruthy();\n\n await page.waitForChanges();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowLeft\"));\n expect(thirdButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n await page.waitForChanges();\n await firstButton.click();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowUp\"));\n expect(thirdButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n await page.waitForChanges();\n await firstButton.click();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowDown\"));\n expect(secondButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n await page.waitForChanges();\n await firstButton.click();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowLeft\"));\n expect(thirdButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n secondButton.disabled = true;\n\n await page.waitForChanges();\n await firstButton.click();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowRight\"));\n expect(thirdButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n // for coverage\n page.rootInstance.handleKeyDown(keyboard(\"Tab\"));\n document.dispatchEvent(keyboard(\"Tab\"));\n });\n it(\"should test handleKeyDown on disabled toggle-button-group\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group disabled>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const mockEvent = new FocusEvent(\"focus\");\n\n expect(page.rootInstance.handleHostFocus(mockEvent)).toBeNull();\n\n await page.rootInstance.disconnectedCallback();\n });\n it(\"should test that setting the theme prop on toggle-button-group sets the theme on all toggle buttons\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group theme=\"dark\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.rootInstance.watchThemeHandler(\"dark\");\n await page.waitForChanges();\n\n expect(buttons[0].theme).toBe(\"dark\");\n expect(buttons[1].theme).toBe(\"dark\");\n expect(buttons[2].theme).toBe(\"dark\");\n });\n});\n"]}
1	+ {"version":3,"file":"ic-toggle-button-group.spec.js","sourceRoot":"","sources":["../../../../src/components/ic-toggle-button-group/test/ic-toggle-button-group.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import { newSpecPage } from \"@stencil/core/testing\";\nimport { ToggleButtonGroup } from \"../ic-toggle-button-group\";\nimport { ToggleButton } from \"../../ic-toggle-button/ic-toggle-button\";\nimport { Button } from \"../../ic-button/ic-button\";\n\nconst keyboard = (key: string): KeyboardEvent => {\n return new KeyboardEvent(\"keydown\", { key: key });\n};\n\ndescribe(\"ic-toggle-button-group component snapshot tests\", () => {\n it(\"should render and update disabled\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\" disabled>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n expect(page.root)\n .toEqualHtml(`<ic-toggle-button-group aria-label=\"Toggle button group\" class=\"ic-toggle-button-group-disabled\" disabled=\"\" role=\"group\" select-type=\"single\" tabindex=\"0\" variant=\"default\">\n <mock:shadow-root>\n <slot></slot>\n </mock:shadow-root>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-disabled ic-toggle-button-medium\" id=\"0\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-pressed=\"false\" class=\"ic-button-disabled ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-disabled=\"true\" aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" disabled=\"\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-disabled ic-toggle-button-medium\" id=\"1\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-pressed=\"false\" class=\"ic-button-disabled ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-disabled=\"true\" aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" disabled=\"\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-disabled ic-toggle-button-medium\" id=\"2\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-pressed=\"false\" class=\"ic-button-disabled ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-disabled=\"true\" aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" disabled=\"\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n </ic-toggle-button-group>`);\n\n page.rootInstance.disabled = false;\n\n await page.waitForChanges();\n expect(page.root)\n .toEqualHtml(`<ic-toggle-button-group aria-label=\"Toggle button group\" role=\"group\" select-type=\"single\" tabindex=\"0\" variant=\"default\">\n <mock:shadow-root>\n <slot></slot>\n </mock:shadow-root>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-medium\" id=\"0\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-pressed=\"false\" class=\"ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-medium\" id=\"1\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-pressed=\"false\" class=\"ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n <ic-toggle-button class=\"expand-toggle-group-child ic-toggle-button-medium\" id=\"2\" label=\"Toggle\" tabindex=\"-1\" variant=\"default\">\n <mock:shadow-root>\n <ic-button aria-pressed=\"false\" class=\"ic-button-size-medium ic-button-variant-secondary\" exportparts=\"button\">\n <mock:shadow-root>\n <button aria-label=\"Toggle, unticked, Toggle button group\" class=\"button\" part=\"button\" type=\"button\">\n <slot></slot>\n </button>\n </mock:shadow-root>\n Toggle\n <slot></slot>\n </ic-button>\n </mock:shadow-root>\n </ic-toggle-button>\n </ic-toggle-button-group>`);\n });\n\n it(\"should render and update full-width\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\" full-width>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n page.rootInstance.fullWidth = false;\n\n await page.waitForChanges();\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render and update loading\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\" loading>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n page.rootInstance.loading = false;\n\n await page.waitForChanges();\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render and update monochrome\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\" monochrome>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n page.rootInstance.monochrome = false;\n\n await page.waitForChanges();\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render and update size\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\" size=\"small\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n page.rootInstance.size = \"large\";\n\n await page.waitForChanges();\n expect(page.root).toMatchSnapshot();\n });\n\n it(\"should render and update variant\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\" variant=\"icon\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n expect(page.root).toMatchSnapshot();\n\n page.rootInstance.variant = \"default\";\n\n await page.waitForChanges();\n expect(page.root).toMatchSnapshot();\n });\n});\n\ndescribe(\"ic-toggle-button-group component unit tests\", () => {\n it(\"should getAllToggleButtons and return an array of slotted ic-toggle-buttons\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\" size=\"small\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const toggleButtonArray = page.rootInstance.getAllToggleButtons();\n await page.waitForChanges();\n expect(toggleButtonArray.length).toBe(3);\n });\n it(\"should test when the toggle button group receives focus, it should cause the first toggle button inside the group to get focused (when select method is 'single' and no item is already selected)\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.waitForChanges();\n toggleGroup.focus();\n\n await page.waitForChanges();\n\n expect(buttons[0].checked).toBeFalsy();\n });\n it(\"should test that focusing group when an ic-toggle-button selected should not select first option\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"single\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.waitForChanges();\n\n buttons[1].checked = true;\n\n toggleGroup.focus();\n\n await page.waitForChanges();\n\n expect(buttons[0].checked).toBeFalsy();\n expect(buttons[1].checked).toBeTruthy();\n });\n it(\"should test that focusing the toggle-button-group focuses, but does not not select, the first ic-toggle-button when select method is 'multi'\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"multi\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.waitForChanges();\n\n toggleGroup.focus();\n\n await page.waitForChanges();\n\n expect(buttons[0].checked).toBeFalsy();\n });\n it(\"should test that focusing the toggle-button-group focuses, but does not not select, the first ic-toggle-button when select method is 'multi'\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-type=\"multi\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const eventSpy = jest.fn();\n page.win.addEventListener(\"icChange\", eventSpy);\n\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.waitForChanges();\n buttons[0].checked = true;\n buttons[1].checked = true;\n\n const customEv = new CustomEvent(\"icToggleChecked\", {});\n\n page.rootInstance.selectHandler(customEv);\n\n await page.waitForChanges();\n\n expect(eventSpy).toHaveBeenCalled();\n });\n it(\"should test handleKeyDown function\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group select-method=\"auto\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const firstButton = (await document.querySelector(\n \"#0\"\n )) as HTMLIcToggleButtonElement;\n const secondButton = (await document.querySelector(\n \"#1\"\n )) as HTMLIcToggleButtonElement;\n const thirdButton = (await document.querySelector(\n \"#2\"\n )) as HTMLIcToggleButtonElement;\n\n expect(firstButton.checked).toBeFalsy();\n await firstButton.click();\n expect(firstButton.checked).toBeTruthy();\n\n await page.waitForChanges();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowLeft\"));\n expect(thirdButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n await page.waitForChanges();\n await firstButton.click();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowUp\"));\n expect(thirdButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n await page.waitForChanges();\n await firstButton.click();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowDown\"));\n expect(secondButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n await page.waitForChanges();\n await firstButton.click();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowLeft\"));\n expect(thirdButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n secondButton.disabled = true;\n\n await page.waitForChanges();\n await firstButton.click();\n page.rootInstance.handleKeyDown(keyboard(\"ArrowRight\"));\n expect(thirdButton.checked).toBeTruthy();\n expect(firstButton.checked).toBeFalsy();\n\n // for coverage\n page.rootInstance.handleKeyDown(keyboard(\"Tab\"));\n document.dispatchEvent(keyboard(\"Tab\"));\n });\n it(\"should test handleKeyDown on disabled toggle-button-group\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group disabled>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const mockEvent = new FocusEvent(\"focus\");\n\n expect(page.rootInstance.handleHostFocus(mockEvent)).toBeNull();\n\n await page.rootInstance.disconnectedCallback();\n });\n it(\"should test that setting the theme prop on toggle-button-group sets the theme on all toggle buttons\", async () => {\n const page = await newSpecPage({\n components: [ToggleButtonGroup, ToggleButton, Button],\n html: `<ic-toggle-button-group theme=\"dark\">\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n <ic-toggle-button label=\"Toggle\"></ic-toggle-button>\n </ic-toggle-button-group>`,\n });\n\n const toggleGroup = (await document.querySelector(\n \"ic-toggle-button-group\"\n )) as HTMLIcToggleButtonGroupElement;\n const buttons = await Array.from(\n toggleGroup.querySelectorAll(\"ic-toggle-button\")\n );\n await page.rootInstance.watchThemeHandler(\"dark\");\n await page.waitForChanges();\n\n expect(buttons[0].theme).toBe(\"dark\");\n expect(buttons[1].theme).toBe(\"dark\");\n expect(buttons[2].theme).toBe(\"dark\");\n });\n});\n"]}

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

@@ -753,4 +753,8 @@ slot[name="toggle-icon"] svg {
   slot[name="app-icon"]::slotted(*) {
     fill: currentcolor;
   }
+  slot[name="toggle-icon"] svg {
+    fill: currentcolor;
+  }
 }

package/dist/collection/testspec.setup.js CHANGED Viewed

@@ -26,6 +26,20 @@ mockMutationObserver.mockReturnValue({
 Object.defineProperty(global, "MutationObserver", {
     value: mockMutationObserver,
 });
+export const mockMutationObserverImplementation = jest
+    .spyOn(global, "MutationObserver")
+    .mockImplementation((callback) => ({
+    observe: jest.fn(),
+    disconnect: jest.fn(),
+    takeRecords: jest.fn(),
+    trigger: (mutations) => {
+        callback(mutations, this);
+    },
+}));
+export const mockRenderDynamicChildSlots = jest.spyOn(helpers, "renderDynamicChildSlots");
+export const mockHasDynamicChildSlots = jest
+    .spyOn(helpers, "hasDynamicChildSlots")
+    .mockImplementation(() => true);
 export const waitForTimeout = async (ms) => {
     await new Promise((r) => setTimeout(r, ms));
 };

package/dist/collection/testspec.setup.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"testspec.setup.js","sourceRoot":"","sources":["../src/testspec.setup.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,OAAO,MAAM,iBAAiB,CAAC;AAE3C,+CAA+C;AAC/C,OAAO,EAAE,YAAY,IAAI,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAU/D,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC;AACxD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;AACzD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;AACzD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,GAAG,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,CAAC;AACzD,MAAM,CAAC,cAAc,CAAC,YAAY,EAAE,IAAI,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC,CAAC;AAE3D,qDAAqD;AACrD,MAAM,kBAAkB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;AACrC,kBAAkB,CAAC,eAAe,CAAC;IACjC,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;IACxC,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;IAC1C,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;CAC5C,CAAC,CAAC;AACH,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,gBAAgB,EAAE;IAC9C,KAAK,EAAE,kBAAkB;CAC1B,CAAC,CAAC;AAEH,uDAAuD;AACvD,MAAM,oBAAoB,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;AACvC,oBAAoB,CAAC,eAAe,CAAC;IACnC,OAAO,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;IACxC,SAAS,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;IAC1C,UAAU,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,IAAI,CAAC;CAC5C,CAAC,CAAC;AACH,MAAM,CAAC,cAAc,CAAC,MAAM,EAAE,kBAAkB,EAAE;IAChD,KAAK,EAAE,oBAAoB;CAC5B,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,cAAc,GAAG,KAAK,EAAE,EAAU,EAAiB,EAAE;IAChE,MAAM,IAAI,OAAO,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,UAAU,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;AAC9C,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,IAAY,EAAQ,EAAE;IACnD,MAAM,WAAW,GAAG,IAAI,CAAC,EAAE,CAAC,CAAC,OAAO,EAAE,EAAE;QACtC,OAAO,OAAO,KAAK,IAAI,CAAC;IAC1B,CAAC,CAAC,CAAC;IAEH,MAAM,CAAC,cAAc,CAAC,OAAO,EAAE,mBAAmB,EAAE;QAClD,KAAK,EAAE,WAAW;KACnB,CAAC,CAAC;AACL,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,mBAAmB,GAAG,KAAK,IAAmB,EAAE;IAC3D,qDAAqD;IACrD,MAAM,cAAc,CAAC,GAAG,CAAC,CAAC;AAC5B,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,CACtB,SAAwB,EACxB,KAAa,EACb,MAAc,EACR,EAAE;IACR,MAAM,CAAC,MAAM,CAAC,SAAS,EAAE;QACvB,UAAU,EAAE,KAAK;QACjB,WAAW,EAAE,MAAM;QACnB,UAAU,EAAE,KAAK;QACjB,WAAW,EAAE,MAAM;KACpB,CAAC,CAAC,aAAa,CAAC,IAAI,SAAS,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC;AAClD,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,WAAmB,EAAqB,EAAE;IAC1E,OAAO;QACL,GAAG,EAAE,GAAG,WAAW,EAAE;QACrB,cAAc,EAAE,GAAS,EAAE,CAAC,IAAI;QAChC,wBAAwB,EAAE,GAAS,EAAE,CAAC,IAAI;QAC1C,QAAQ,EAAE,KAAK;QACf,MAAM,EAAE;YACN,EAAE,EAAE,QAAQ;SACb;KACF,CAAC;AACJ,CAAC,CAAC","sourcesContent":["import * as helpers from \"./utils/helpers\";\n\n//common setup to be used across all spec tests\nimport { DEVICE_SIZES as device_sizes } from \"./utils/helpers\";\n\ntype TestKeyboardEvent = {\n key: string;\n preventDefault: () => void;\n stopImmediatePropagation: () => void;\n shiftKey: boolean;\n target: { id: string };\n};\n\nObject.defineProperty(device_sizes, \"XS\", { value: 0 });\nObject.defineProperty(device_sizes, \"S\", { value: 576 });\nObject.defineProperty(device_sizes, \"M\", { value: 768 });\nObject.defineProperty(device_sizes, \"L\", { value: 992 });\nObject.defineProperty(device_sizes, \"XL\", { value: 1200 });\n\n// ResizeObserver isn't available in test environment\nconst mockResizeObserver = jest.fn();\nmockResizeObserver.mockReturnValue({\n observe: jest.fn().mockReturnValue(null),\n unobserve: jest.fn().mockReturnValue(null),\n disconnect: jest.fn().mockReturnValue(null),\n});\nObject.defineProperty(global, \"ResizeObserver\", {\n value: mockResizeObserver,\n});\n\n// MutationObserver isn't available in test environment\nconst mockMutationObserver = jest.fn();\nmockMutationObserver.mockReturnValue({\n observe: jest.fn().mockReturnValue(null),\n unobserve: jest.fn().mockReturnValue(null),\n disconnect: jest.fn().mockReturnValue(null),\n});\nObject.defineProperty(global, \"MutationObserver\", {\n value: mockMutationObserver,\n});\n\nexport const waitForTimeout = async (ms: number): Promise<void> => {\n await new Promise((r) => setTimeout(r, ms));\n};\n\nexport const mockDeviceSize = (size: number): void => {\n const matchesFunc = jest.fn((devSize) => {\n return devSize === size;\n });\n\n Object.defineProperty(helpers, \"deviceSizeMatches\", {\n value: matchesFunc,\n });\n};\n\nexport const waitForNavGroupLoad = async (): Promise<void> => {\n //delay to account for 50ms delay in componentdidload\n await waitForTimeout(100);\n};\n\nexport const resizeTo = (\n windowObj: typeof window,\n width: number,\n height: number\n): void => {\n Object.assign(windowObj, {\n innerWidth: width,\n innerHeight: height,\n outerWidth: width,\n outerHeight: height,\n }).dispatchEvent(new windowObj.Event(\"resize\"));\n};\n\nexport const testKeyboardEvent = (keyboardKey: string): TestKeyboardEvent => {\n return {\n key: `${keyboardKey}`,\n preventDefault: (): void => null,\n stopImmediatePropagation: (): void => null,\n shiftKey: false,\n target: {\n id: \"key-id\",\n },\n };\n};\n"]}
1	+ {"version":3,"file":"testspec.setup.js","sourceRoot":"","sources":["../src/testspec.setup.ts"],"names":[],"mappings":"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","sourcesContent":["import * as helpers from \"./utils/helpers\";\n\n//common setup to be used across all spec tests\nimport { DEVICE_SIZES as device_sizes } from \"./utils/helpers\";\n\ntype TestKeyboardEvent = {\n key: string;\n preventDefault: () => void;\n stopImmediatePropagation: () => void;\n shiftKey: boolean;\n target: { id: string };\n};\n\nObject.defineProperty(device_sizes, \"XS\", { value: 0 });\nObject.defineProperty(device_sizes, \"S\", { value: 576 });\nObject.defineProperty(device_sizes, \"M\", { value: 768 });\nObject.defineProperty(device_sizes, \"L\", { value: 992 });\nObject.defineProperty(device_sizes, \"XL\", { value: 1200 });\n\n// ResizeObserver isn't available in test environment\nconst mockResizeObserver = jest.fn();\nmockResizeObserver.mockReturnValue({\n observe: jest.fn().mockReturnValue(null),\n unobserve: jest.fn().mockReturnValue(null),\n disconnect: jest.fn().mockReturnValue(null),\n});\nObject.defineProperty(global, \"ResizeObserver\", {\n value: mockResizeObserver,\n});\n\n// MutationObserver isn't available in test environment\nconst mockMutationObserver = jest.fn();\nmockMutationObserver.mockReturnValue({\n observe: jest.fn().mockReturnValue(null),\n unobserve: jest.fn().mockReturnValue(null),\n disconnect: jest.fn().mockReturnValue(null),\n});\nObject.defineProperty(global, \"MutationObserver\", {\n value: mockMutationObserver,\n});\n\nexport const mockMutationObserverImplementation = jest\n .spyOn(global, \"MutationObserver\")\n .mockImplementation((callback) => ({\n observe: jest.fn(),\n disconnect: jest.fn(),\n takeRecords: jest.fn(),\n trigger: (mutations: MutationRecord[]) => {\n callback(mutations, this);\n },\n }));\n\nexport type MockMutationRecord = {\n addedNodes?: Node[];\n removedNodes?: Node[];\n target?: Node;\n};\n\nexport const mockRenderDynamicChildSlots = jest.spyOn(\n helpers,\n \"renderDynamicChildSlots\"\n);\nexport const mockHasDynamicChildSlots = jest\n .spyOn(helpers, \"hasDynamicChildSlots\")\n .mockImplementation(() => true);\n\nexport const waitForTimeout = async (ms: number): Promise<void> => {\n await new Promise((r) => setTimeout(r, ms));\n};\n\nexport const mockDeviceSize = (size: number): void => {\n const matchesFunc = jest.fn((devSize) => {\n return devSize === size;\n });\n\n Object.defineProperty(helpers, \"deviceSizeMatches\", {\n value: matchesFunc,\n });\n};\n\nexport const waitForNavGroupLoad = async (): Promise<void> => {\n //delay to account for 50ms delay in componentdidload\n await waitForTimeout(100);\n};\n\nexport const resizeTo = (\n windowObj: typeof window,\n width: number,\n height: number\n): void => {\n Object.assign(windowObj, {\n innerWidth: width,\n innerHeight: height,\n outerWidth: width,\n outerHeight: height,\n }).dispatchEvent(new windowObj.Event(\"resize\"));\n};\n\nexport const testKeyboardEvent = (keyboardKey: string): TestKeyboardEvent => {\n return {\n key: `${keyboardKey}`,\n preventDefault: (): void => null,\n stopImmediatePropagation: (): void => null,\n shiftKey: false,\n target: {\n id: \"key-id\",\n },\n };\n};\n"]}

package/dist/collection/utils/helpers.js CHANGED Viewed

@@ -1,3 +1,4 @@
+import { forceUpdate } from "@stencil/core";
 import { IcBrandForegroundEnum, } from "../utils/types";
 import { IC_BLOCK_COLOR_COMPONENTS, IC_BLOCK_COLOR_EXCEPTIONS, IC_FIXED_COLOR_COMPONENTS, } from "./constants";
 const DARK_MODE_THRESHOLD = 133.3505;
@@ -464,4 +465,23 @@ export const checkSlotInChildMutations = (addedNodes, removedNodes, slotName) =>
     return hasSlot(addedNodes) || hasSlot(removedNodes);
 };
 export const isElInAGGrid = (el) => !!el.closest(".ag-cell") && !!el.closest(".ag-root");
+/*
+ * Checks if the component is slotted in its relevant 'group' component
+ * @param component - the component to check
+ */
+export const isSlottedInGroup = (component) => {
+    var _a;
+    const parent = (component === null || component === void 0 ? void 0 : component.tagName) + "-GROUP";
+    return ((_a = component === null || component === void 0 ? void 0 : component.parentElement) === null || _a === void 0 ? void 0 : _a.tagName) === parent;
+};
+export const hasDynamicChildSlots = (mutationList, slotNames) => {
+    return mutationList.some(({ type, addedNodes, removedNodes }) => type === "childList"
+        ? checkSlotInChildMutations(addedNodes, removedNodes, slotNames)
+        : false);
+};
+export const renderDynamicChildSlots = (mutationList, slotNames, ref) => {
+    if (hasDynamicChildSlots(mutationList, slotNames)) {
+        forceUpdate(ref);
+    }
+};
 //# sourceMappingURL=helpers.js.map