npm - @ukic/web-components - Versions diffs - 3.17.0 → 3.19.0 - Mend

@ukic/web-components 3.17.0 → 3.19.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 (398) hide show

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

@@ -391,14 +391,14 @@ export class Button {
         const describedby = !hasTooltip ? describedById : `ic-tooltip-${buttonId}`;
         const hasLeftIcon = !!this.getSlottedIcon("left");
         const hasRightIcon = !!this.getSlottedIcon("right");
-        const ButtonContent = () => this.hasRouterSlot() ? (h("slot", { name: "router-item" })) : (h(TagType, Object.assign({ class: "button", tabindex: 0, "aria-disabled": loading || disabled ? "true" : null, "aria-label": loading ? "Loading" : ariaLabel, "aria-expanded": dropdown && `${dropdownExpanded}` }, buttonAttrs, inheritedAttributes, { onFocus: onFocus, onBlur: onBlur, ref: (el) => (this.buttonEl = el), "aria-describedby": describedby, part: "button" }), loading ? (h("div", { class: "loading-container" }, h("ic-loading-indicator", { type: "linear", monochrome: monochrome, theme: theme }))) : (h(Fragment, null, (hasLeftIcon ||
+        const ButtonContent = () => this.hasRouterSlot() ? (h("slot", { name: "router-item" })) : (h(TagType, Object.assign({ class: "button", tabindex: 0, "aria-disabled": loading || disabled ? "true" : null, "aria-label": loading ? "Loading" : ariaLabel, "aria-expanded": dropdown && `${dropdownExpanded}` }, buttonAttrs, inheritedAttributes, { onFocus: onFocus, onBlur: onBlur, ref: (el) => (this.buttonEl = el), "aria-describedby": describedby, part: "button" }), loading ? (h("div", { class: "loading-container" }, h("ic-loading-indicator", { type: isIconVariant() ? "circular" : "linear", class: { "loading-indicator-icon-button": isIconVariant() }, monochrome: monochrome, theme: theme }))) : (h(Fragment, null, (hasLeftIcon ||
             (!!this.getSlottedIcon("top") && !hasRightIcon)) && (h("div", { class: "icon-container" }, h("slot", { name: `${hasLeftIcon ? "left" : "top"}-icon` }))), h("slot", null), !dropdown
             ? hasRightIcon && (h("div", { class: { "icon-container": true, "right-icon": true } }, h("slot", { name: "right-icon" })))
             : variant !== "icon" &&
                 variant !== "destructive" && (h("span", { class: dropdownExpanded
                     ? "dropdown-expanded"
                     : "arrow-dropdown", innerHTML: arrowDropdown }))))));
-        return (h(Host, { key: '4e15c7ddb5f7d220f52848c36fc9b26932daeb8e', class: {
+        return (h(Host, { key: '742d4ee3daabdb12a7ef9f30803ed01a49414849', class: {
                 "ic-button-disabled": disabled && !loading,
                 "ic-button-full-width": fullWidth,
                 "ic-button-loading": loading,
@@ -414,7 +414,7 @@ export class Button {
                 monochrome,
                 "top-icon": isSlotUsed(this.el, "top-icon"),
                 "with-badge": isSlotUsed(this.el, "badge"),
-            }, onClick: handleClick, onKeyDown: handleKeyDown, "aria-owns": ariaOwnsId, "aria-controls": ariaControlsId, "aria-expanded": dropdown && `${dropdownExpanded}` }, hasTooltip && (h("ic-tooltip", { key: 'a6b3305c993a950f41b2cc44812a35239b4ef717', id: describedby, label: title || ariaLabel, target: buttonId, placement: tooltipPlacement, fixedPositioning: tooltipFixedPositioning, silent: isIconVariant() && !!ariaLabel }, h(ButtonContent, { key: '146f8c894991641b88313d8947c5ac4e1d204049' }))), isSlotUsed(this.el, "badge") && h("slot", { key: '4aede0d2f30748690130dfba00612b3adc859c10', name: "badge" }), !hasTooltip && h(ButtonContent, { key: 'bf1fd18f9c47ea1199babace3584855499a2776c' })));
+            }, onClick: handleClick, onKeyDown: handleKeyDown, "aria-owns": ariaOwnsId, "aria-controls": ariaControlsId, "aria-expanded": dropdown && `${dropdownExpanded}` }, hasTooltip && (h("ic-tooltip", { key: '6526412bc27a6725714bc73f671e76d8cf30d28e', id: describedby, label: title || ariaLabel, target: buttonId, placement: tooltipPlacement, fixedPositioning: tooltipFixedPositioning, silent: isIconVariant() && !!ariaLabel }, h(ButtonContent, { key: 'f7df2578a6539a40373d599788d1097e2bcaa5a5' }))), isSlotUsed(this.el, "badge") && h("slot", { key: 'b790a201f342345bafe97cfd19bd53d7ffd1811c', name: "badge" }), !hasTooltip && h(ButtonContent, { key: 'fa2a22102dbd45b0c4c02a7608fc913bc50f641d' })));
     }
     static get is() { return "ic-button"; }
     static get encapsulation() { return "shadow"; }

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ic-button.js","sourceRoot":"","sources":["../../../src/components/ic-button/ic-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Method,\n Prop,\n State,\n forceUpdate,\n h,\n Watch,\n Fragment,\n} from \"@stencil/core\";\n\nimport {\n getBrandFromContext,\n handleHiddenFormButtonClick,\n inheritAttributes,\n isSlotUsed,\n removeDisabledFalse,\n renderFileHiddenInput,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport { IcButtonTypes, IcButtonVariants } from \"./ic-button.types\";\nimport {\n IcSizes,\n IcBrand,\n IcBrandForeground,\n IcBrandForegroundEnum,\n IcThemeMode,\n IcButtonTooltipPlacement,\n IcIconPlacementOptions,\n} from \"../../utils/types\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet buttonIds = 0;\n\n/*\n @slot left-icon - Content will be placed to the left of the button label.\n * @slot right-icon - Content will be placed to the right of the button label.\n * @slot top-icon - Content will be placed above the button label.\n * @slot badge - Badge component overlaying the top right of the button.\n * @slot router-item - Handle routing by nesting your routes in this slot. Setting loading to true will have no impact on this slot.\n /\n@Component({\n tag: \"ic-button\",\n styleUrl: \"ic-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Button {\n private buttonEl?: HTMLElement;\n private buttonIdNum = buttonIds++;\n private hasTooltip = false;\n private id: string \| null;\n private inheritedAttributes: { [k: string]: string } = {};\n private describedbyEl: HTMLElement \| null = null;\n private describedById?: string;\n private mutationObserver: MutationObserver \| null = null;\n private hostMutationObserver: MutationObserver \| null = null;\n private routerSlot: HTMLElement \| null;\n\n @Element() el: HTMLIcButtonElement;\n\n @State() ariaLabel = \"\";\n @State() describedbyNode: Node \| null;\n @Watch(\"describedbyNode\")\n watchDescribedbyNodeHandler(): void {\n this.updateAriaDescribedbyClone();\n }\n @State() title = \"\";\n\n /\n If `fileUpload` is set to `true`, this is the accepted list of file types.\n /\n @Prop() accept = \"\";\n\n /*\n @internal Used to identify any related child component\n /\n @Prop() ariaControlsId?: string \| boolean;\n\n /\n @internal Used to identify any related child component\n /\n @Prop() ariaOwnsId?: string \| boolean;\n\n /\n If `true`, the button will be in disabled state.\n /\n @Prop() disabled = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.\n /\n @Prop() disableTooltip = false;\n\n /\n If `true`, the user can save the linked URL instead of navigating to it.\n /\n @Prop() download: string \| boolean = false;\n\n /\n If `true`, the button will show a dropdown icon.\n /\n @Prop() dropdown = false;\n\n /\n If `true`, the aria-expanded value will be set to true. This is only applied if the dropdown prop is also true.\n /\n @Prop({ mutable: true, reflect: true }) dropdownExpanded = false;\n\n /\n If `true`, when the button is clicked the native file explorer will be launched.\n /\n @Prop() fileUpload = false;\n\n /\n The name of the control for the file input, which is submitted with the form data.\n /\n @Prop() fileInputName = `ic-button-file-upload-input-${buttonIds++}`;\n\n /\n The <form> element to associate the button with.\n /\n @Prop() form?: string;\n\n /\n The URL that processes the information submitted by the button. It overrides the action attribute of the button'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 button's form owner.\n /\n @Prop() formtarget?: string;\n\n /\n If `true`, the button will fill the width of the container.\n /\n @Prop() fullWidth = false;\n\n /\n The URL that the link points to. This will render the button as an \"a\" tag.\n /\n @Prop() href?: string;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string;\n\n /\n If `true`, the button will be in loading state.\n /\n @Prop() loading = false;\n\n /\n If `true`, the button will display as monochromatic in either `light` or `dark` theme.\n /\n @Prop({ mutable: true }) monochrome = false;\n\n /\n If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted.\n /\n @Prop() multiple = false;\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n The list of the files that have been selected by a user.\n /\n @Prop() selectedFiles?: FileList;\n\n /\n The size of the button to be displayed.\n /\n @Prop() size: IcSizes = \"medium\";\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n /\n @Prop() target?: string;\n\n /\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({ mutable: true }) theme: IcThemeMode = \"inherit\";\n\n /\n Setting to `true` can help in situations where tooltip content is clipped by a parent element.\n /\n @Prop() tooltipFixedPositioning: boolean = false;\n\n /\n The position of the tooltip in relation to the button.\n /\n @Prop() tooltipPlacement: IcButtonTooltipPlacement = \"bottom\";\n\n /\n If `true`, the secondary & tertiary variants of button will have a transparent background when not hovered, pressed or loading.\n /\n @Prop() transparentBackground = true;\n\n /\n The type of the button.\n /\n @Prop() type: IcButtonTypes = \"button\";\n\n /\n The variant of the button to be displayed.\n /\n @Prop({ mutable: true }) variant: IcButtonVariants = \"primary\";\n @Watch(\"variant\")\n watchVariantHandler(newVariant: IcButtonVariants): void {\n if (newVariant === \"icon\") this.variant = \"icon-tertiary\";\n }\n\n /\n Emitted when button has blur\n /\n @Event() icBlur!: EventEmitter<void>;\n\n /\n If `fileUpload` is set to `true`, this will be emitted when a file is selected in the native explorer.\n /\n @Event() icFileSelection!: EventEmitter<FileList>;\n\n /\n Emitted when button has focus\n /\n @Event() icFocus!: EventEmitter<void>;\n\n disconnectedCallback(): void {\n this.mutationObserver?.disconnect();\n this.hostMutationObserver?.disconnect();\n }\n\n componentWillUpdate(): void {\n if (this.loading) {\n this.el.style.setProperty(\n \"--min-width\",\n `${this.el.getBoundingClientRect().width}px`\n );\n }\n this.setHasTooltip();\n }\n\n componentWillLoad(): void {\n const {\n title,\n \"aria-label\": ariaLabel,\n ...restInheritedAttributes\n } = inheritAttributes(this.el, [...IC_INHERITED_ARIA, \"title\"]);\n\n this.title = title;\n this.ariaLabel = ariaLabel;\n this.inheritedAttributes = restInheritedAttributes;\n\n removeDisabledFalse(this.disabled, this.el);\n\n this.el.setAttribute(\"exportparts\", \"button\");\n\n this.id = this.el.id \|\| null;\n this.setHasTooltip();\n\n if (!this.hasTooltip) {\n const describedById = this.inheritedAttributes[\"aria-describedby\"];\n if (describedById) {\n this.describedById = describedById;\n const el = document.querySelector<HTMLElement>(`#${describedById}`);\n if (el) {\n this.describedbyEl = el;\n this.describedbyNode = el.cloneNode(true);\n }\n }\n }\n\n if (this.variant === \"icon\") {\n this.variant = \"icon-tertiary\";\n }\n }\n\n componentDidLoad(): void {\n this.updateTheme();\n\n if (typeof MutationObserver !== \"undefined\") {\n if (this.describedbyEl && this.describedById) {\n this.mutationObserver = new MutationObserver(this.mutationCallback);\n this.mutationObserver.observe(this.describedbyEl, {\n characterData: true,\n childList: true,\n subtree: true,\n });\n }\n\n this.hostMutationObserver = new MutationObserver(\n this.hostMutationCallback\n );\n this.hostMutationObserver.observe(this.el, {\n attributes: true,\n });\n\n if (this.hasRouterSlot()) this.arrangeRouterItem();\n }\n\n this.updateAriaDescribedbyClone();\n }\n\n componentWillRender(): void {\n const iconEl = this.getSlottedIcon(\"left\") \|\| this.getSlottedIcon(\"right\");\n iconEl?.setAttribute(\"viewBox\", \"0 0 24 24\");\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (!this.hasRouterSlot()) {\n if (this.fileUpload) {\n renderFileHiddenInput(\n this.icFileSelection,\n this.el,\n !!this.multiple,\n !!this.disabled,\n this.accept,\n this.fileInputName,\n this.selectedFiles\n );\n }\n if (this.disabled \|\| this.loading) {\n event.stopImmediatePropagation();\n }\n if (this.dropdown) {\n this.dropdownExpanded = !this.dropdownExpanded;\n }\n }\n }\n\n @Listen(\"brandChange\", { target: \"document\" })\n brandChangeHandler({ detail }: CustomEvent<IcBrand>): void {\n this.updateTheme(detail.mode);\n }\n\n /\n Sets focus on the native `button`.\n /\n @Method()\n async setFocus(): Promise<void> {\n this.buttonEl?.focus();\n }\n\n private async closeButtonTooltip(ev: KeyboardEvent) {\n const tooltip = this.el.shadowRoot?.querySelector(\"ic-tooltip\");\n if (tooltip && (await tooltip.isTooltipVisible())) {\n tooltip.displayTooltip(false);\n ev.preventDefault();\n ev.stopImmediatePropagation();\n }\n }\n\n private getSlottedIcon = (position: IcIconPlacementOptions) =>\n this.el.querySelector(`[slot=\"${position}-icon\"]`);\n\n private hasRouterSlot() {\n this.routerSlot = this.el.querySelector('[slot=\"router-item\"]');\n if (this.routerSlot) {\n this.routerSlot.ariaLabel = this.routerSlot.textContent;\n }\n return !!this.routerSlot;\n }\n\n private handleClick = () => {\n if (\n (this.el.type === \"submit\" \|\| this.el.type === \"reset\") &&\n !this.hasRouterSlot() &&\n (this.form \|\| !!this.el.closest(\"FORM\"))\n ) {\n const form = this.form\n ? document.querySelector<HTMLFormElement>(`form[id=${this.form}]`)\n : this.el.closest<HTMLFormElement>(\"FORM\");\n\n handleHiddenFormButtonClick(form, this.el);\n }\n };\n\n private handleKeyDown = (ev: KeyboardEvent) => {\n if (ev.key === \"Escape\" && this.hasTooltip) {\n this.closeButtonTooltip(ev);\n }\n };\n\n private onFocus = () => {\n this.icFocus.emit();\n };\n\n private onBlur = () => {\n this.icBlur.emit();\n };\n\n private updateTheme(mode: IcBrandForeground \| null = null) {\n const foregroundColor = getBrandFromContext(this.el, mode);\n if (foregroundColor !== IcBrandForegroundEnum.Default) {\n this.theme =\n foregroundColor === IcBrandForegroundEnum.Light\n ? IcBrandForegroundEnum.Dark\n : IcBrandForegroundEnum.Light;\n this.monochrome = true;\n }\n }\n\n /\n Creates/updates clone of aria-describedby element node tree in shadow dom\n * Required due to ids being scoped to the shadow dom\n /\n private updateAriaDescribedbyClone = () => {\n if (this.describedbyNode) {\n const wrapper = this.el.shadowRoot?.querySelector(\"#describedby-wrapper\");\n if (!wrapper) {\n this.el.shadowRoot?.appendChild(\n Object.assign(document.createElement(\"div\"), {\n id: \"describedby-wrapper\",\n className: \"ic-button-describedby\",\n })\n );\n }\n\n while (wrapper?.firstChild) wrapper.firstChild.remove();\n wrapper?.appendChild(this.describedbyNode);\n }\n };\n\n /\n Triggered when light dom aria-describedby element updates\n /\n private mutationCallback = () => {\n if (this.describedbyEl)\n this.describedbyNode = this.describedbyEl?.cloneNode(true);\n };\n\n /\n Triggered when attributes of host element change\n * @param mutationList the list of changes made to the host element\n */\n private hostMutationCallback = (mutationList: MutationRecord[]) => {\n let forceComponentUpdate = false;\n mutationList.forEach(({ attributeName }) => {\n if (attributeName) {\n const attribute = this.el.getAttribute(attributeName);\n if (attribute) {\n if (attributeName === \"title\") this.title = attribute;\n else if (attributeName === \"aria-label\") this.ariaLabel = attribute;\n\n if (IC_INHERITED_ARIA.includes(attributeName)) {\n this.inheritedAttributes[attributeName] = attribute;\n forceComponentUpdate = true;\n }\n }\n }\n });\n if (forceComponentUpdate) {\n forceUpdate(this);\n }\n };\n\n private setHasTooltip = () => {\n this.hasTooltip =\n !this.disableTooltip && (!!this.title \|\| !!this.isIconVariant());\n };\n\n private isIconVariant = () => this.variant.startsWith(\"icon\");\n\n private arrangeRouterItem = () => {\n const setStyles = (\n element: HTMLElement \| SVGElement,\n styles: { [key: string]: string }\n ) => {\n Object.entries(styles).forEach(([key, value]) => {\n element.style.setProperty(key, value);\n });\n };\n\n if (this.routerSlot) {\n const icTypography = document.createElement(\"ic-typography\");\n\n setStyles(icTypography, {\n \"font-family\": \"var(--ic-font-body-family)\",\n \"font-size\": \"0.875rem\",\n \"font-weight\": \"600\",\n });\n setStyles(this.routerSlot, {\n gap: \"0\",\n });\n\n const icon = this.routerSlot.querySelector(\"svg\");\n const iconSlot = icon?.getAttribute(\"slot\");\n const iconWrapper = document.createElement(\"div\");\n\n if (icon) {\n setStyles(icon, {\n fill: \"currentcolor\",\n });\n\n if (iconSlot === \"top-icon\") {\n setStyles(this.routerSlot, {\n display: \"flex\",\n \"flex-direction\": \"column\",\n \"--height\": \"fit-content\",\n });\n } else if (iconSlot) {\n const marginPlacement = iconSlot === \"left-icon\" ? \"right\" : \"left\";\n setStyles(iconWrapper, {\n [`margin-${marginPlacement}`]: \"var(--ic-space-xs)\",\n });\n }\n\n iconWrapper.append(icon);\n }\n\n const badge = this.routerSlot.querySelector(\"ic-badge\");\n const label = this.routerSlot.textContent?.trim();\n\n if (badge) iconWrapper.append(badge);\n if (label) icTypography.textContent = label;\n\n this.routerSlot.textContent = \"\";\n\n if (iconSlot === \"right-icon\") {\n this.routerSlot.append(icTypography);\n this.routerSlot.append(iconWrapper);\n } else {\n this.routerSlot.append(iconWrapper);\n this.routerSlot.append(icTypography);\n }\n }\n };\n\n render() {\n const {\n ariaControlsId,\n ariaLabel,\n ariaOwnsId,\n buttonIdNum,\n describedById,\n disabled,\n download,\n dropdown,\n dropdownExpanded,\n form,\n formaction,\n formenctype,\n formmethod,\n formnovalidate,\n formtarget,\n fullWidth,\n handleClick,\n handleKeyDown,\n hasTooltip,\n href,\n hreflang,\n id,\n inheritedAttributes,\n isIconVariant,\n loading,\n monochrome,\n onBlur,\n onFocus,\n referrerpolicy,\n rel,\n size,\n target,\n theme,\n title,\n tooltipFixedPositioning,\n tooltipPlacement,\n transparentBackground,\n type,\n variant,\n } = this;\n\n const TagType = href ? \"a\" : \"button\";\n const buttonAttrs =\n TagType === \"button\"\n ? {\n type,\n disabled,\n form,\n formaction,\n formenctype,\n formmethod,\n formnovalidate,\n formtarget,\n }\n : {\n download: download !== false ? download : null,\n href,\n rel,\n target,\n referrerpolicy,\n hreflang,\n };\n\n const buttonId = hasTooltip\n ? `ic-button-with-tooltip-${id \|\| buttonIdNum}`\n : undefined;\n\n const describedby = !hasTooltip ? describedById : `ic-tooltip-${buttonId}`;\n\n const hasLeftIcon = !!this.getSlottedIcon(\"left\");\n const hasRightIcon = !!this.getSlottedIcon(\"right\");\n\n const ButtonContent = () =>\n this.hasRouterSlot() ? (\n <slot name=\"router-item\"></slot>\n ) : (\n <TagType\n class=\"button\"\n tabindex={0}\n aria-disabled={loading \|\| disabled ? \"true\" : null}\n aria-label={loading ? \"Loading\" : ariaLabel}\n aria-expanded={dropdown && `${dropdownExpanded}`}\n {...buttonAttrs}\n {...inheritedAttributes}\n onFocus={onFocus}\n onBlur={onBlur}\n ref={(el) => (this.buttonEl = el)}\n aria-describedby={describedby}\n part=\"button\"\n >\n {loading ? (\n <div class=\"loading-container\">\n <ic-loading-indicator\n type=\"linear\"\n monochrome={monochrome}\n theme={theme}\n ></ic-loading-indicator>\n </div>\n ) : (\n <Fragment>\n {(hasLeftIcon \|\|\n (!!this.getSlottedIcon(\"top\") && !hasRightIcon)) && (\n <div class=\"icon-container\">\n <slot name={`${hasLeftIcon ? \"left\" : \"top\"}-icon`} />\n </div>\n )}\n <slot />\n {!dropdown\n ? hasRightIcon && (\n <div class={{ \"icon-container\": true, \"right-icon\": true }}>\n <slot name=\"right-icon\" />\n </div>\n )\n : variant !== \"icon\" &&\n variant !== \"destructive\" && (\n <span\n class={\n dropdownExpanded\n ? \"dropdown-expanded\"\n : \"arrow-dropdown\"\n }\n innerHTML={arrowDropdown}\n />\n )}\n </Fragment>\n )}\n </TagType>\n );\n\n return (\n <Host\n class={{\n \"ic-button-disabled\": disabled && !loading,\n \"ic-button-full-width\": fullWidth,\n \"ic-button-loading\": loading,\n [`ic-button-size-${size}`]: true,\n [`ic-button-variant-${variant}`]: true,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n background:\n (variant === \"secondary\" \|\| variant === \"tertiary\") &&\n !transparentBackground &&\n !disabled,\n \"dropdown-no-icon\":\n dropdown &&\n !isSlotUsed(this.el, \"icon\") &&\n !isSlotUsed(this.el, \"left-icon\"),\n monochrome,\n \"top-icon\": isSlotUsed(this.el, \"top-icon\"),\n \"with-badge\": isSlotUsed(this.el, \"badge\"),\n }}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n aria-owns={ariaOwnsId}\n aria-controls={ariaControlsId}\n aria-expanded={dropdown && `${dropdownExpanded}`}\n >\n {hasTooltip && (\n <ic-tooltip\n id={describedby}\n label={title \|\| ariaLabel}\n target={buttonId}\n placement={tooltipPlacement}\n fixedPositioning={tooltipFixedPositioning}\n silent={isIconVariant() && !!ariaLabel}\n >\n <ButtonContent />\n </ic-tooltip>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n {!hasTooltip && <ButtonContent />}\n </Host>\n );\n }\n}\n"]}
1	+ {"version":3,"file":"ic-button.js","sourceRoot":"","sources":["../../../src/components/ic-button/ic-button.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n Component,\n Element,\n Event,\n EventEmitter,\n Host,\n Listen,\n Method,\n Prop,\n State,\n forceUpdate,\n h,\n Watch,\n Fragment,\n} from \"@stencil/core\";\n\nimport {\n getBrandFromContext,\n handleHiddenFormButtonClick,\n inheritAttributes,\n isSlotUsed,\n removeDisabledFalse,\n renderFileHiddenInput,\n} from \"../../utils/helpers\";\nimport { IC_INHERITED_ARIA } from \"../../utils/constants\";\nimport { IcButtonTypes, IcButtonVariants } from \"./ic-button.types\";\nimport {\n IcSizes,\n IcBrand,\n IcBrandForeground,\n IcBrandForegroundEnum,\n IcThemeMode,\n IcButtonTooltipPlacement,\n IcIconPlacementOptions,\n} from \"../../utils/types\";\nimport arrowDropdown from \"../../assets/arrow-dropdown.svg\";\n\nlet buttonIds = 0;\n\n/*\n @slot left-icon - Content will be placed to the left of the button label.\n * @slot right-icon - Content will be placed to the right of the button label.\n * @slot top-icon - Content will be placed above the button label.\n * @slot badge - Badge component overlaying the top right of the button.\n * @slot router-item - Handle routing by nesting your routes in this slot. Setting loading to true will have no impact on this slot.\n /\n@Component({\n tag: \"ic-button\",\n styleUrl: \"ic-button.css\",\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class Button {\n private buttonEl?: HTMLElement;\n private buttonIdNum = buttonIds++;\n private hasTooltip = false;\n private id: string \| null;\n private inheritedAttributes: { [k: string]: string } = {};\n private describedbyEl: HTMLElement \| null = null;\n private describedById?: string;\n private mutationObserver: MutationObserver \| null = null;\n private hostMutationObserver: MutationObserver \| null = null;\n private routerSlot: HTMLElement \| null;\n\n @Element() el: HTMLIcButtonElement;\n\n @State() ariaLabel = \"\";\n @State() describedbyNode: Node \| null;\n @Watch(\"describedbyNode\")\n watchDescribedbyNodeHandler(): void {\n this.updateAriaDescribedbyClone();\n }\n @State() title = \"\";\n\n /\n If `fileUpload` is set to `true`, this is the accepted list of file types.\n /\n @Prop() accept = \"\";\n\n /*\n @internal Used to identify any related child component\n /\n @Prop() ariaControlsId?: string \| boolean;\n\n /\n @internal Used to identify any related child component\n /\n @Prop() ariaOwnsId?: string \| boolean;\n\n /\n If `true`, the button will be in disabled state.\n /\n @Prop() disabled = false;\n @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\n\n /\n If `true`, the ic-tooltip which is shown for icon variant will be disabled. Title or aria-label must be set if this prop is not applied.\n /\n @Prop() disableTooltip = false;\n\n /\n If `true`, the user can save the linked URL instead of navigating to it.\n /\n @Prop() download: string \| boolean = false;\n\n /\n If `true`, the button will show a dropdown icon.\n /\n @Prop() dropdown = false;\n\n /\n If `true`, the aria-expanded value will be set to true. This is only applied if the dropdown prop is also true.\n /\n @Prop({ mutable: true, reflect: true }) dropdownExpanded = false;\n\n /\n If `true`, when the button is clicked the native file explorer will be launched.\n /\n @Prop() fileUpload = false;\n\n /\n The name of the control for the file input, which is submitted with the form data.\n /\n @Prop() fileInputName = `ic-button-file-upload-input-${buttonIds++}`;\n\n /\n The <form> element to associate the button with.\n /\n @Prop() form?: string;\n\n /\n The URL that processes the information submitted by the button. It overrides the action attribute of the button'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 button's form owner.\n /\n @Prop() formtarget?: string;\n\n /\n If `true`, the button will fill the width of the container.\n /\n @Prop() fullWidth = false;\n\n /\n The URL that the link points to. This will render the button as an \"a\" tag.\n /\n @Prop() href?: string;\n\n /\n The human language of the linked URL.\n /\n @Prop() hreflang?: string;\n\n /\n If `true`, the button will be in loading state.\n /\n @Prop() loading = false;\n\n /\n If `true`, the button will display as monochromatic in either `light` or `dark` theme.\n /\n @Prop({ mutable: true }) monochrome = false;\n\n /\n If `fileUpload` is set to `true`, this boolean determines whether multiple files are accepted.\n /\n @Prop() multiple = false;\n\n /\n How much of the referrer to send when following the link.\n /\n @Prop() referrerpolicy?: ReferrerPolicy;\n\n /\n The relationship of the linked URL as space-separated link types.\n /\n @Prop() rel?: string;\n\n /\n The list of the files that have been selected by a user.\n /\n @Prop() selectedFiles?: FileList;\n\n /\n The size of the button to be displayed.\n /\n @Prop() size: IcSizes = \"medium\";\n\n /\n The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n /\n @Prop() target?: string;\n\n /\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({ mutable: true }) theme: IcThemeMode = \"inherit\";\n\n /\n Setting to `true` can help in situations where tooltip content is clipped by a parent element.\n /\n @Prop() tooltipFixedPositioning: boolean = false;\n\n /\n The position of the tooltip in relation to the button.\n /\n @Prop() tooltipPlacement: IcButtonTooltipPlacement = \"bottom\";\n\n /\n If `true`, the secondary & tertiary variants of button will have a transparent background when not hovered, pressed or loading.\n /\n @Prop() transparentBackground = true;\n\n /\n The type of the button.\n /\n @Prop() type: IcButtonTypes = \"button\";\n\n /\n The variant of the button to be displayed.\n /\n @Prop({ mutable: true }) variant: IcButtonVariants = \"primary\";\n @Watch(\"variant\")\n watchVariantHandler(newVariant: IcButtonVariants): void {\n if (newVariant === \"icon\") this.variant = \"icon-tertiary\";\n }\n\n /\n Emitted when button has blur\n /\n @Event() icBlur!: EventEmitter<void>;\n\n /\n If `fileUpload` is set to `true`, this will be emitted when a file is selected in the native explorer.\n /\n @Event() icFileSelection!: EventEmitter<FileList>;\n\n /\n Emitted when button has focus\n /\n @Event() icFocus!: EventEmitter<void>;\n\n disconnectedCallback(): void {\n this.mutationObserver?.disconnect();\n this.hostMutationObserver?.disconnect();\n }\n\n componentWillUpdate(): void {\n if (this.loading) {\n this.el.style.setProperty(\n \"--min-width\",\n `${this.el.getBoundingClientRect().width}px`\n );\n }\n this.setHasTooltip();\n }\n\n componentWillLoad(): void {\n const {\n title,\n \"aria-label\": ariaLabel,\n ...restInheritedAttributes\n } = inheritAttributes(this.el, [...IC_INHERITED_ARIA, \"title\"]);\n\n this.title = title;\n this.ariaLabel = ariaLabel;\n this.inheritedAttributes = restInheritedAttributes;\n\n removeDisabledFalse(this.disabled, this.el);\n\n this.el.setAttribute(\"exportparts\", \"button\");\n\n this.id = this.el.id \|\| null;\n this.setHasTooltip();\n\n if (!this.hasTooltip) {\n const describedById = this.inheritedAttributes[\"aria-describedby\"];\n if (describedById) {\n this.describedById = describedById;\n const el = document.querySelector<HTMLElement>(`#${describedById}`);\n if (el) {\n this.describedbyEl = el;\n this.describedbyNode = el.cloneNode(true);\n }\n }\n }\n\n if (this.variant === \"icon\") {\n this.variant = \"icon-tertiary\";\n }\n }\n\n componentDidLoad(): void {\n this.updateTheme();\n\n if (typeof MutationObserver !== \"undefined\") {\n if (this.describedbyEl && this.describedById) {\n this.mutationObserver = new MutationObserver(this.mutationCallback);\n this.mutationObserver.observe(this.describedbyEl, {\n characterData: true,\n childList: true,\n subtree: true,\n });\n }\n\n this.hostMutationObserver = new MutationObserver(\n this.hostMutationCallback\n );\n this.hostMutationObserver.observe(this.el, {\n attributes: true,\n });\n\n if (this.hasRouterSlot()) this.arrangeRouterItem();\n }\n\n this.updateAriaDescribedbyClone();\n }\n\n componentWillRender(): void {\n const iconEl = this.getSlottedIcon(\"left\") \|\| this.getSlottedIcon(\"right\");\n iconEl?.setAttribute(\"viewBox\", \"0 0 24 24\");\n }\n\n @Listen(\"click\", { capture: true })\n handleHostClick(event: Event): void {\n if (!this.hasRouterSlot()) {\n if (this.fileUpload) {\n renderFileHiddenInput(\n this.icFileSelection,\n this.el,\n !!this.multiple,\n !!this.disabled,\n this.accept,\n this.fileInputName,\n this.selectedFiles\n );\n }\n if (this.disabled \|\| this.loading) {\n event.stopImmediatePropagation();\n }\n if (this.dropdown) {\n this.dropdownExpanded = !this.dropdownExpanded;\n }\n }\n }\n\n @Listen(\"brandChange\", { target: \"document\" })\n brandChangeHandler({ detail }: CustomEvent<IcBrand>): void {\n this.updateTheme(detail.mode);\n }\n\n /\n Sets focus on the native `button`.\n /\n @Method()\n async setFocus(): Promise<void> {\n this.buttonEl?.focus();\n }\n\n private async closeButtonTooltip(ev: KeyboardEvent) {\n const tooltip = this.el.shadowRoot?.querySelector(\"ic-tooltip\");\n if (tooltip && (await tooltip.isTooltipVisible())) {\n tooltip.displayTooltip(false);\n ev.preventDefault();\n ev.stopImmediatePropagation();\n }\n }\n\n private getSlottedIcon = (position: IcIconPlacementOptions) =>\n this.el.querySelector(`[slot=\"${position}-icon\"]`);\n\n private hasRouterSlot() {\n this.routerSlot = this.el.querySelector('[slot=\"router-item\"]');\n if (this.routerSlot) {\n this.routerSlot.ariaLabel = this.routerSlot.textContent;\n }\n return !!this.routerSlot;\n }\n\n private handleClick = () => {\n if (\n (this.el.type === \"submit\" \|\| this.el.type === \"reset\") &&\n !this.hasRouterSlot() &&\n (this.form \|\| !!this.el.closest(\"FORM\"))\n ) {\n const form = this.form\n ? document.querySelector<HTMLFormElement>(`form[id=${this.form}]`)\n : this.el.closest<HTMLFormElement>(\"FORM\");\n\n handleHiddenFormButtonClick(form, this.el);\n }\n };\n\n private handleKeyDown = (ev: KeyboardEvent) => {\n if (ev.key === \"Escape\" && this.hasTooltip) {\n this.closeButtonTooltip(ev);\n }\n };\n\n private onFocus = () => {\n this.icFocus.emit();\n };\n\n private onBlur = () => {\n this.icBlur.emit();\n };\n\n private updateTheme(mode: IcBrandForeground \| null = null) {\n const foregroundColor = getBrandFromContext(this.el, mode);\n if (foregroundColor !== IcBrandForegroundEnum.Default) {\n this.theme =\n foregroundColor === IcBrandForegroundEnum.Light\n ? IcBrandForegroundEnum.Dark\n : IcBrandForegroundEnum.Light;\n this.monochrome = true;\n }\n }\n\n /\n Creates/updates clone of aria-describedby element node tree in shadow dom\n * Required due to ids being scoped to the shadow dom\n /\n private updateAriaDescribedbyClone = () => {\n if (this.describedbyNode) {\n const wrapper = this.el.shadowRoot?.querySelector(\"#describedby-wrapper\");\n if (!wrapper) {\n this.el.shadowRoot?.appendChild(\n Object.assign(document.createElement(\"div\"), {\n id: \"describedby-wrapper\",\n className: \"ic-button-describedby\",\n })\n );\n }\n\n while (wrapper?.firstChild) wrapper.firstChild.remove();\n wrapper?.appendChild(this.describedbyNode);\n }\n };\n\n /\n Triggered when light dom aria-describedby element updates\n /\n private mutationCallback = () => {\n if (this.describedbyEl)\n this.describedbyNode = this.describedbyEl?.cloneNode(true);\n };\n\n /\n Triggered when attributes of host element change\n * @param mutationList the list of changes made to the host element\n */\n private hostMutationCallback = (mutationList: MutationRecord[]) => {\n let forceComponentUpdate = false;\n mutationList.forEach(({ attributeName }) => {\n if (attributeName) {\n const attribute = this.el.getAttribute(attributeName);\n if (attribute) {\n if (attributeName === \"title\") this.title = attribute;\n else if (attributeName === \"aria-label\") this.ariaLabel = attribute;\n\n if (IC_INHERITED_ARIA.includes(attributeName)) {\n this.inheritedAttributes[attributeName] = attribute;\n forceComponentUpdate = true;\n }\n }\n }\n });\n if (forceComponentUpdate) {\n forceUpdate(this);\n }\n };\n\n private setHasTooltip = () => {\n this.hasTooltip =\n !this.disableTooltip && (!!this.title \|\| !!this.isIconVariant());\n };\n\n private isIconVariant = () => this.variant.startsWith(\"icon\");\n\n private arrangeRouterItem = () => {\n const setStyles = (\n element: HTMLElement \| SVGElement,\n styles: { [key: string]: string }\n ) => {\n Object.entries(styles).forEach(([key, value]) => {\n element.style.setProperty(key, value);\n });\n };\n\n if (this.routerSlot) {\n const icTypography = document.createElement(\"ic-typography\");\n\n setStyles(icTypography, {\n \"font-family\": \"var(--ic-font-body-family)\",\n \"font-size\": \"0.875rem\",\n \"font-weight\": \"600\",\n });\n setStyles(this.routerSlot, {\n gap: \"0\",\n });\n\n const icon = this.routerSlot.querySelector(\"svg\");\n const iconSlot = icon?.getAttribute(\"slot\");\n const iconWrapper = document.createElement(\"div\");\n\n if (icon) {\n setStyles(icon, {\n fill: \"currentcolor\",\n });\n\n if (iconSlot === \"top-icon\") {\n setStyles(this.routerSlot, {\n display: \"flex\",\n \"flex-direction\": \"column\",\n \"--height\": \"fit-content\",\n });\n } else if (iconSlot) {\n const marginPlacement = iconSlot === \"left-icon\" ? \"right\" : \"left\";\n setStyles(iconWrapper, {\n [`margin-${marginPlacement}`]: \"var(--ic-space-xs)\",\n });\n }\n\n iconWrapper.append(icon);\n }\n\n const badge = this.routerSlot.querySelector(\"ic-badge\");\n const label = this.routerSlot.textContent?.trim();\n\n if (badge) iconWrapper.append(badge);\n if (label) icTypography.textContent = label;\n\n this.routerSlot.textContent = \"\";\n\n if (iconSlot === \"right-icon\") {\n this.routerSlot.append(icTypography);\n this.routerSlot.append(iconWrapper);\n } else {\n this.routerSlot.append(iconWrapper);\n this.routerSlot.append(icTypography);\n }\n }\n };\n\n render() {\n const {\n ariaControlsId,\n ariaLabel,\n ariaOwnsId,\n buttonIdNum,\n describedById,\n disabled,\n download,\n dropdown,\n dropdownExpanded,\n form,\n formaction,\n formenctype,\n formmethod,\n formnovalidate,\n formtarget,\n fullWidth,\n handleClick,\n handleKeyDown,\n hasTooltip,\n href,\n hreflang,\n id,\n inheritedAttributes,\n isIconVariant,\n loading,\n monochrome,\n onBlur,\n onFocus,\n referrerpolicy,\n rel,\n size,\n target,\n theme,\n title,\n tooltipFixedPositioning,\n tooltipPlacement,\n transparentBackground,\n type,\n variant,\n } = this;\n\n const TagType = href ? \"a\" : \"button\";\n const buttonAttrs =\n TagType === \"button\"\n ? {\n type,\n disabled,\n form,\n formaction,\n formenctype,\n formmethod,\n formnovalidate,\n formtarget,\n }\n : {\n download: download !== false ? download : null,\n href,\n rel,\n target,\n referrerpolicy,\n hreflang,\n };\n\n const buttonId = hasTooltip\n ? `ic-button-with-tooltip-${id \|\| buttonIdNum}`\n : undefined;\n\n const describedby = !hasTooltip ? describedById : `ic-tooltip-${buttonId}`;\n\n const hasLeftIcon = !!this.getSlottedIcon(\"left\");\n const hasRightIcon = !!this.getSlottedIcon(\"right\");\n\n const ButtonContent = () =>\n this.hasRouterSlot() ? (\n <slot name=\"router-item\"></slot>\n ) : (\n <TagType\n class=\"button\"\n tabindex={0}\n aria-disabled={loading \|\| disabled ? \"true\" : null}\n aria-label={loading ? \"Loading\" : ariaLabel}\n aria-expanded={dropdown && `${dropdownExpanded}`}\n {...buttonAttrs}\n {...inheritedAttributes}\n onFocus={onFocus}\n onBlur={onBlur}\n ref={(el) => (this.buttonEl = el)}\n aria-describedby={describedby}\n part=\"button\"\n >\n {loading ? (\n <div class=\"loading-container\">\n <ic-loading-indicator\n type={isIconVariant() ? \"circular\" : \"linear\"}\n class={{ \"loading-indicator-icon-button\": isIconVariant() }}\n monochrome={monochrome}\n theme={theme}\n ></ic-loading-indicator>\n </div>\n ) : (\n <Fragment>\n {(hasLeftIcon \|\|\n (!!this.getSlottedIcon(\"top\") && !hasRightIcon)) && (\n <div class=\"icon-container\">\n <slot name={`${hasLeftIcon ? \"left\" : \"top\"}-icon`} />\n </div>\n )}\n <slot />\n {!dropdown\n ? hasRightIcon && (\n <div class={{ \"icon-container\": true, \"right-icon\": true }}>\n <slot name=\"right-icon\" />\n </div>\n )\n : variant !== \"icon\" &&\n variant !== \"destructive\" && (\n <span\n class={\n dropdownExpanded\n ? \"dropdown-expanded\"\n : \"arrow-dropdown\"\n }\n innerHTML={arrowDropdown}\n />\n )}\n </Fragment>\n )}\n </TagType>\n );\n\n return (\n <Host\n class={{\n \"ic-button-disabled\": disabled && !loading,\n \"ic-button-full-width\": fullWidth,\n \"ic-button-loading\": loading,\n [`ic-button-size-${size}`]: true,\n [`ic-button-variant-${variant}`]: true,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n background:\n (variant === \"secondary\" \|\| variant === \"tertiary\") &&\n !transparentBackground &&\n !disabled,\n \"dropdown-no-icon\":\n dropdown &&\n !isSlotUsed(this.el, \"icon\") &&\n !isSlotUsed(this.el, \"left-icon\"),\n monochrome,\n \"top-icon\": isSlotUsed(this.el, \"top-icon\"),\n \"with-badge\": isSlotUsed(this.el, \"badge\"),\n }}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n aria-owns={ariaOwnsId}\n aria-controls={ariaControlsId}\n aria-expanded={dropdown && `${dropdownExpanded}`}\n >\n {hasTooltip && (\n <ic-tooltip\n id={describedby}\n label={title \|\| ariaLabel}\n target={buttonId}\n placement={tooltipPlacement}\n fixedPositioning={tooltipFixedPositioning}\n silent={isIconVariant() && !!ariaLabel}\n >\n <ButtonContent />\n </ic-tooltip>\n )}\n {isSlotUsed(this.el, \"badge\") && <slot name=\"badge\"></slot>}\n {!hasTooltip && <ButtonContent />}\n </Host>\n );\n }\n}\n"]}

package/dist/collection/components/ic-button/ic-button.stories.js CHANGED Viewed

@@ -737,6 +737,168 @@ export const IconVariants = {
       </div>
       <div>
         <ic-typography>Loading</ic-typography>
+        <div style="display:flex; gap: 0.5rem; padding-bottom: 1rem">
+          <ic-button
+            variant="icon-primary"
+            theme="light"
+            aria-label="refresh"
+            id="testbutton"
+            loading
+            size="small"
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              height="24px"
+              viewBox="0 0 24 24"
+              width="24px"
+              fill="#000000"
+            >
+              <path d="M0 0h24v24H0V0z" fill="none" />
+              <path
+                d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
+              />
+            </svg>
+          </ic-button>
+          <ic-button
+            variant="icon-secondary"
+            aria-label="refresh"
+            id="testbutton"
+            loading
+            size="small"
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              height="24px"
+              viewBox="0 0 24 24"
+              width="24px"
+              fill="#000000"
+            >
+              <path d="M0 0h24v24H0V0z" fill="none" />
+              <path
+                d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
+              />
+            </svg>
+          </ic-button>
+          <ic-button
+            variant="icon-tertiary"
+            aria-label="refresh"
+            id="testbutton"
+            loading
+            size="small"
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              height="24px"
+              viewBox="0 0 24 24"
+              width="24px"
+              fill="#000000"
+            >
+              <path d="M0 0h24v24H0V0z" fill="none" />
+              <path
+                d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
+              />
+            </svg>
+          </ic-button>
+          <ic-button
+            variant="icon-destructive"
+            aria-label="refresh"
+            id="testbutton"
+            loading
+            size="small"
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              height="24px"
+              viewBox="0 0 24 24"
+              width="24px"
+              fill="#000000"
+            >
+              <path d="M0 0h24v24H0V0z" fill="none" />
+              <path
+                d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
+              />
+            </svg>
+          </ic-button>
+        </div>
+        <div style="display:flex; gap: 0.5rem; padding-bottom: 1rem">
+          <ic-button
+            variant="icon-primary"
+            theme="light"
+            aria-label="refresh"
+            id="testbutton"
+            loading
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              height="24px"
+              viewBox="0 0 24 24"
+              width="24px"
+              fill="#000000"
+            >
+              <path d="M0 0h24v24H0V0z" fill="none" />
+              <path
+                d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
+              />
+            </svg>
+          </ic-button>
+          <ic-button
+            variant="icon-secondary"
+            aria-label="refresh"
+            id="testbutton"
+            loading
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              height="24px"
+              viewBox="0 0 24 24"
+              width="24px"
+              fill="#000000"
+            >
+              <path d="M0 0h24v24H0V0z" fill="none" />
+              <path
+                d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
+              />
+            </svg>
+          </ic-button>
+          <ic-button
+            variant="icon-tertiary"
+            aria-label="refresh"
+            id="testbutton"
+            loading
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              height="24px"
+              viewBox="0 0 24 24"
+              width="24px"
+              fill="#000000"
+            >
+              <path d="M0 0h24v24H0V0z" fill="none" />
+              <path
+                d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
+              />
+            </svg>
+          </ic-button>
+          <ic-button
+            variant="icon-destructive"
+            aria-label="refresh"
+            id="testbutton"
+            loading
+          >
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              height="24px"
+              viewBox="0 0 24 24"
+              width="24px"
+              fill="#000000"
+            >
+              <path d="M0 0h24v24H0V0z" fill="none" />
+              <path
+                d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
+              />
+            </svg>
+          </ic-button>
+        </div>
         <div style="display:flex; gap: 0.5rem">
           <ic-button
             variant="icon-primary"
@@ -744,6 +906,7 @@ export const IconVariants = {
             aria-label="refresh"
             id="testbutton"
             loading
+            size="large"
           >
             <svg
               xmlns="http://www.w3.org/2000/svg"
@@ -763,6 +926,7 @@ export const IconVariants = {
             aria-label="refresh"
             id="testbutton"
             loading
+            size="large"
           >
             <svg
               xmlns="http://www.w3.org/2000/svg"
@@ -782,6 +946,7 @@ export const IconVariants = {
             aria-label="refresh"
             id="testbutton"
             loading
+            size="large"
           >
             <svg
               xmlns="http://www.w3.org/2000/svg"
@@ -801,6 +966,7 @@ export const IconVariants = {
             aria-label="refresh"
             id="testbutton"
             loading
+            size="large"
           >
             <svg
               xmlns="http://www.w3.org/2000/svg"
@@ -2612,6 +2778,91 @@ export const PlaygroundWithIcon = {
   name: "Playground with icon",
 };
+export const PlaygroundIconOnly = {
+  render: (args) =>
+    html`<ic-button
+      disable-tooltip=${args.disableTooltip}
+      disabled=${args.disabled}
+      full-width=${args.fullWidth}
+      href=${args.href}
+      loading=${args.loading}
+      monochrome=${args.monochrome}
+      size=${args.size}
+      theme=${args.theme}
+      tooltip-placement=${args.tooltipPlacement}
+      transparent-background=${args.transparentBackground}
+      variant=${args.variant}
+      aria-label="refresh"
+    >
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        height="24px"
+        viewBox="0 0 24 24"
+        width="24px"
+        fill="#000000"
+      >
+        <path d="M0 0h24v24H0V0z" fill="none" />
+        <path
+          d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z"
+        /></svg
+    ></ic-button>`,
+  args: {
+    disableTooltip: false,
+    disabled: false,
+    fullWidth: false,
+    href: "",
+    loading: false,
+    monochrome: false,
+    size: "medium",
+    theme: "inherit",
+    tooltipPlacement: "bottom",
+    transparentBackground: false,
+    variant: "icon-primary",
+  },
+  argTypes: {
+    variant: {
+      options: [
+        "icon-primary",
+        "icon-secondary",
+        "icon-tertiary",
+        "icon-destructive",
+      ],
+      control: {
+        type: "select",
+      },
+    },
+    size: {
+      options: ["medium", "large", "small"],
+      control: {
+        type: inlineRadioSelector,
+      },
+    },
+    theme: {
+      options: ["inherit", "dark", "light"],
+      control: {
+        type: inlineRadioSelector,
+      },
+    },
+    tooltipPlacement: {
+      options: ["top", "right", "bottom", "left"],
+      control: {
+        type: inlineRadioSelector,
+      },
+    },
+  },
+  name: "Playground - icon only",
+};
 export const Loading = {
   render: () => html`
     <div style="padding: 6px">

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

@@ -43,8 +43,22 @@ export class CheckboxGroup {
          * The text to display as the validation message.
          */
         this.validationText = "";
+        this.setCheckboxProps = () => {
+            this.checkboxes = Array.from(this.el.querySelectorAll(CHECKBOX_SELECTOR));
+            this.checkboxes.forEach((checkbox) => {
+                if (!checkbox.disabled) {
+                    checkbox.disabled = this.disabled;
+                }
+                if (!checkbox.size) {
+                    checkbox.size = this.size;
+                }
+            });
+        };
     }
     watchDisabledHandler() {
+        this.checkboxes.forEach((checkbox) => {
+            checkbox.disabled = this.disabled;
+        });
         removeDisabledFalse(this.disabled, this.el);
     }
     labelNameHandler(newValue, oldValue, propName) {
@@ -57,6 +71,11 @@ export class CheckboxGroup {
             }
         });
     }
+    watchSizeHandler() {
+        this.checkboxes.forEach((checkbox) => {
+            checkbox.size = this.size;
+        });
+    }
     watchThemeHandler(newValue) {
         Array.from(this.el.querySelectorAll(CHECKBOX_SELECTOR)).forEach((checkbox) => {
             checkbox.theme = newValue;
@@ -70,6 +89,7 @@ export class CheckboxGroup {
         }
     }
     componentWillLoad() {
+        this.setCheckboxProps();
         removeDisabledFalse(this.disabled, this.el);
         this.watchThemeHandler(this.theme);
     }
@@ -98,11 +118,11 @@ export class CheckboxGroup {
         const describedBy = getInputDescribedByText(this.el, name, helperText !== "", validationStatus !== "");
         const renderSRText = validationStatus === "error" || required || hideLabel;
         const showValidation = hasValidationStatus(validationStatus, disabled);
-        return (h(Host, { key: 'ee4fc914d346b2f35dd8d44ff73a44b479caee95', class: {
+        return (h(Host, { key: '4bf0ebdc41ee60a21034e57ffa313abf87290794', class: {
                 "ic-checkbox-group-disabled": !!disabled,
                 [`ic-checkbox-group-${size}`]: true,
                 [`ic-theme-${theme}`]: theme !== "inherit",
-            } }, renderSRText && (h("span", { key: '3718d5e6fce1597c836d01050ed17bcd01c97e6e', id: "screenReaderOnlyText", class: "screen-reader-only-text", "aria-hidden": "true" }, label, " ", validationStatus === "error" ? "invalid data " : null, " ", required ? "required" : null)), h("fieldset", { key: '318e6c61787f136916d39acdd2823fa644c8d865', id: name, "aria-labelledby": `${renderSRText ? "screenReaderOnlyText" : ""} ${describedBy}`.trim(), disabled: disabled }, !hideLabel && (h("legend", { key: '6348eb25d5a2de666033441d694b407f72ae834b' }, h("ic-input-label", { key: '96ef66ab6b4e3a02a2385eb9b8f5936c1fc57ad0', class: { [`${validationStatus}`]: true }, label: label, helperText: helperText, required: required, disabled: disabled, useLabelTag: false }, h("slot", { key: 'f9f0532834d50a57dbc2f075a9f94788071cceb6', name: "helper-text", slot: "helper-text" })))), h("div", { key: '9b72caba2adb5951814689ef5c8b1fa5d7ea11ed', class: "checkboxes-container" }, h("slot", { key: '5cf045069c87416b7889e7b29b44e6f137ca0b4f' }))), h("ic-input-validation", { key: '4b9680fcb5468fbf6e9c2e1eb6d45f929b2b09dc', class: {
+            } }, renderSRText && (h("span", { key: '69b9b6d5d0698d168e6df0c01b47d333b5afddba', id: "screenReaderOnlyText", class: "screen-reader-only-text", "aria-hidden": "true" }, label, " ", validationStatus === "error" ? "invalid data " : null, " ", required ? "required" : null)), h("fieldset", { key: 'ad8d27f986ca3337c4507829c70b1bfb0aa37ed5', id: name, "aria-labelledby": `${renderSRText ? "screenReaderOnlyText" : ""} ${describedBy}`.trim(), disabled: disabled }, !hideLabel && (h("legend", { key: '84c10349be7a6d6acb70a5c9e70d888b86dbe258' }, h("ic-input-label", { key: '00d928c2b7b8ce34262c4fe82d2d87a869bfaf9c', class: { [`${validationStatus}`]: true }, label: label, helperText: helperText, required: required, disabled: disabled, useLabelTag: false }, h("slot", { key: '42e5a3983f00c06616384cd7ba1a0793188aad7d', name: "helper-text", slot: "helper-text" })))), h("div", { key: '726918f0786e8418fcdd616841128a1cb7365bec', class: "checkboxes-container" }, h("slot", { key: 'c4323eeff5908bf1a6a9e8a9fcfe2b5678489d8e' }))), h("ic-input-validation", { key: '0178a6710479690c9ee615f9d7e25d04d1108fdd', class: {
                 "show-validation": showValidation,
             }, for: name, ariaLiveMode: validationAriaLive, status: showValidation ? validationStatus : "", message: showValidation ? validationText : "" })));
     }
@@ -399,6 +419,9 @@ export class CheckboxGroup {
             }, {
                 "propName": "name",
                 "methodName": "labelNameHandler"
+            }, {
+                "propName": "size",
+                "methodName": "watchSizeHandler"
             }, {
                 "propName": "theme",
                 "methodName": "watchThemeHandler"

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":"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","sourcesContent":["import {\n Component,\n Host,\n h,\n Prop,\n Listen,\n Element,\n Event,\n EventEmitter,\n Watch,\n} from \"@stencil/core\";\nimport {\n getInputDescribedByText,\n hasValidationStatus,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport {\n IcAriaLive,\n IcInformationStatusOrEmpty,\n IcSizes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-checkbox-group.types\";\n\nconst CHECKBOX_SELECTOR = \"ic-checkbox\";\n\n/*\n @slot helper-text - Content is set as the helper text for the checkbox group.\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 @Watch(\"disabled\")\n watchDisabledHandler(): void {\n removeDisabledFalse(this.disabled, this.el);\n }\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 @Watch(\"label\")\n @Watch(\"name\")\n labelNameHandler(\n newValue: string,\n oldValue: string,\n propName: \"label\" \| \"name\"\n ): void {\n Array.from(this.el.querySelectorAll(CHECKBOX_SELECTOR)).forEach(\n (checkbox) => {\n if (propName === \"label\") checkbox.groupLabel = newValue;\n else if (checkbox.name === oldValue) {\n // If the checkbox name has been set by the parent, then override it\n checkbox.name = newValue;\n }\n }\n );\n }\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 = \"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(newValue: IcThemeMode): void {\n Array.from(this.el.querySelectorAll(CHECKBOX_SELECTOR)).forEach(\n (checkbox) => {\n checkbox.theme = newValue;\n }\n );\n }\n\n /\n The value of the `aria-live` attribute on the validation message.\n /\n @Prop() validationAriaLive: IcAriaLive = \"polite\";\n\n /\n The validation status - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n /\n The text to display as the validation message.\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 this.watchThemeHandler(this.theme);\n }\n\n componentDidLoad(): void {\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({ target }: CustomEvent): void {\n const checkedOptions = Array.from(\n this.el.querySelectorAll(CHECKBOX_SELECTOR)\n ).filter(({ checked, disabled }) => checked && !disabled);\n this.icChange.emit({\n value: checkedOptions.map(({ value }) => value),\n checkedOptions: checkedOptions.map((opt) => ({\n checkbox: opt,\n textFieldValue: opt.querySelector(\"ic-text-field\")?.value,\n })),\n selectedOption: target as HTMLIcCheckboxElement,\n });\n }\n\n render() {\n const {\n disabled,\n helperText,\n hideLabel,\n label,\n name,\n required,\n size,\n theme,\n validationAriaLive,\n validationStatus,\n validationText,\n } = this;\n\n const describedBy = getInputDescribedByText(\n this.el,\n name,\n helperText !== \"\",\n validationStatus !== \"\"\n );\n\n const renderSRText = validationStatus === \"error\" \|\| required \|\| hideLabel;\n\n const showValidation = hasValidationStatus(validationStatus, disabled);\n\n return (\n <Host\n class={{\n \"ic-checkbox-group-disabled\": !!disabled,\n [`ic-checkbox-group-${size}`]: true,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n {renderSRText && (\n <span\n id=\"screenReaderOnlyText\"\n class=\"screen-reader-only-text\"\n aria-hidden=\"true\"\n >\n {label} {validationStatus === \"error\" ? \"invalid data \" : null}{\" \"}\n {required ? \"required\" : null}\n </span>\n )}\n <fieldset\n id={name}\n aria-labelledby={`${\n renderSRText ? \"screenReaderOnlyText\" : \"\"\n } ${describedBy}`.trim()}\n disabled={disabled}\n >\n {!hideLabel && (\n <legend>\n <ic-input-label\n class={{ [`${validationStatus}`]: true }}\n label={label}\n helperText={helperText}\n required={required}\n disabled={disabled}\n useLabelTag={false}\n >\n <slot name=\"helper-text\" slot=\"helper-text\"></slot>\n </ic-input-label>\n </legend>\n )}\n <div class=\"checkboxes-container\">\n <slot></slot>\n </div>\n </fieldset>\n <ic-input-validation\n class={{\n \"show-validation\": showValidation,\n }}\n for={name}\n ariaLiveMode={validationAriaLive}\n status={showValidation ? validationStatus : \"\"}\n message={showValidation ? validationText : \"\"}\n ></ic-input-validation>\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 Watch,\n} from \"@stencil/core\";\nimport {\n getInputDescribedByText,\n hasValidationStatus,\n onComponentRequiredPropUndefined,\n removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport {\n IcAriaLive,\n IcInformationStatusOrEmpty,\n IcSizes,\n IcThemeMode,\n} from \"../../utils/types\";\nimport { IcChangeEventDetail } from \"./ic-checkbox-group.types\";\n\nconst CHECKBOX_SELECTOR = \"ic-checkbox\";\n\n/*\n @slot helper-text - Content is set as the helper text for the checkbox group.\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 private checkboxes: HTMLIcCheckboxElement[];\n\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 @Watch(\"disabled\")\n watchDisabledHandler(): void {\n this.checkboxes.forEach((checkbox) => {\n checkbox.disabled = this.disabled;\n });\n removeDisabledFalse(this.disabled, this.el);\n }\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 @Watch(\"label\")\n @Watch(\"name\")\n labelNameHandler(\n newValue: string,\n oldValue: string,\n propName: \"label\" \| \"name\"\n ): void {\n Array.from(this.el.querySelectorAll(CHECKBOX_SELECTOR)).forEach(\n (checkbox) => {\n if (propName === \"label\") checkbox.groupLabel = newValue;\n else if (checkbox.name === oldValue) {\n // If the checkbox name has been set by the parent, then override it\n checkbox.name = newValue;\n }\n }\n );\n }\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 = \"medium\";\n @Watch(\"size\")\n watchSizeHandler(): void {\n this.checkboxes.forEach((checkbox) => {\n checkbox.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(newValue: IcThemeMode): void {\n Array.from(this.el.querySelectorAll(CHECKBOX_SELECTOR)).forEach(\n (checkbox) => {\n checkbox.theme = newValue;\n }\n );\n }\n\n /\n The value of the `aria-live` attribute on the validation message.\n /\n @Prop() validationAriaLive: IcAriaLive = \"polite\";\n\n /\n The validation status - e.g. 'error' \| 'warning' \| 'success'.\n /\n @Prop() validationStatus: IcInformationStatusOrEmpty = \"\";\n\n /\n The text to display as the validation message.\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 this.setCheckboxProps();\n removeDisabledFalse(this.disabled, this.el);\n this.watchThemeHandler(this.theme);\n }\n\n componentDidLoad(): void {\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({ target }: CustomEvent): void {\n const checkedOptions = Array.from(\n this.el.querySelectorAll(CHECKBOX_SELECTOR)\n ).filter(({ checked, disabled }) => checked && !disabled);\n this.icChange.emit({\n value: checkedOptions.map(({ value }) => value),\n checkedOptions: checkedOptions.map((opt) => ({\n checkbox: opt,\n textFieldValue: opt.querySelector(\"ic-text-field\")?.value,\n })),\n selectedOption: target as HTMLIcCheckboxElement,\n });\n }\n\n private setCheckboxProps = () => {\n this.checkboxes = Array.from(this.el.querySelectorAll(CHECKBOX_SELECTOR));\n\n this.checkboxes.forEach((checkbox) => {\n if (!checkbox.disabled) {\n checkbox.disabled = this.disabled;\n }\n if (!checkbox.size) {\n checkbox.size = this.size;\n }\n });\n };\n\n render() {\n const {\n disabled,\n helperText,\n hideLabel,\n label,\n name,\n required,\n size,\n theme,\n validationAriaLive,\n validationStatus,\n validationText,\n } = this;\n\n const describedBy = getInputDescribedByText(\n this.el,\n name,\n helperText !== \"\",\n validationStatus !== \"\"\n );\n\n const renderSRText = validationStatus === \"error\" \|\| required \|\| hideLabel;\n\n const showValidation = hasValidationStatus(validationStatus, disabled);\n\n return (\n <Host\n class={{\n \"ic-checkbox-group-disabled\": !!disabled,\n [`ic-checkbox-group-${size}`]: true,\n [`ic-theme-${theme}`]: theme !== \"inherit\",\n }}\n >\n {renderSRText && (\n <span\n id=\"screenReaderOnlyText\"\n class=\"screen-reader-only-text\"\n aria-hidden=\"true\"\n >\n {label} {validationStatus === \"error\" ? \"invalid data \" : null}{\" \"}\n {required ? \"required\" : null}\n </span>\n )}\n <fieldset\n id={name}\n aria-labelledby={`${\n renderSRText ? \"screenReaderOnlyText\" : \"\"\n } ${describedBy}`.trim()}\n disabled={disabled}\n >\n {!hideLabel && (\n <legend>\n <ic-input-label\n class={{ [`${validationStatus}`]: true }}\n label={label}\n helperText={helperText}\n required={required}\n disabled={disabled}\n useLabelTag={false}\n >\n <slot name=\"helper-text\" slot=\"helper-text\"></slot>\n </ic-input-label>\n </legend>\n )}\n <div class=\"checkboxes-container\">\n <slot></slot>\n </div>\n </fieldset>\n <ic-input-validation\n class={{\n \"show-validation\": showValidation,\n }}\n for={name}\n ariaLiveMode={validationAriaLive}\n status={showValidation ? validationStatus : \"\"}\n message={showValidation ? validationText : \"\"}\n ></ic-input-validation>\n </Host>\n );\n }\n}\n"]}