@ukic/canary-web-components 3.0.0-canary.4 → 3.0.0-canary.6

package/dist/esm/ic-tab.entry.js.map

@@ -1 +1 @@
-{"file":"ic-tab.entry.js","mappings":"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","names":[],"sources":["../web-components/dist/collection/components/ic-tab/ic-tab.css?tag=ic-tab&encapsulation=shadow","../web-components/dist/collection/components/ic-tab/ic-tab.js"],"sourcesContent":["/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n     ========================================================================== */\n\n/**\n   * Remove the margin in all browsers.\n   */\n\nbody {\n  margin: 0;\n}\n\n/**\n   * Render the `main` element consistently in IE.\n   */\n\nmain {\n  display: block;\n}\n\n/**\n   * Correct the font size and margin on `h1` elements within `section` and\n   * `article` contexts in Chrome, Firefox, and Safari.\n   */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n     ========================================================================== */\n\n/**\n   * 1. Add the correct box sizing in Firefox.\n   * 2. Show the overflow in Edge and IE.\n   */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n     ========================================================================== */\n\n/**\n   * Remove the gray background on active links in IE 10.\n   */\n\na {\n  background-color: transparent;\n}\n\n/**\n   * 1. Remove the bottom border in Chrome 57-\n   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n   */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted; /* 2 */\n}\n\n/**\n   * Add the correct font weight in Chrome, Edge, and Safari.\n   */\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n   * Add the correct font size in all browsers.\n   */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n   * Prevent `sub` and `sup` elements from affecting the line height in\n   * all browsers.\n   */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n     ========================================================================== */\n\n/**\n   * Remove the border on images inside links in IE 10.\n   */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n     ========================================================================== */\n\n/**\n   * 1. Change the font styles in all browsers.\n   * 2. Remove the margin in Firefox and Safari.\n   */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n   * Show the overflow in IE.\n   * 1. Show the overflow in Edge.\n   */\n\nbutton,\ninput {\n  /* 1 */\n  overflow: visible;\n}\n\n/**\n   * Remove the inheritance of text transform in Edge, Firefox, and IE.\n   * 1. Remove the inheritance of text transform in Firefox.\n   */\n\nbutton,\nselect {\n  /* 1 */\n  text-transform: none;\n}\n\n/**\n   * Correct the inability to style clickable types in iOS and Safari.\n   */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n   * Remove the inner border and padding in Firefox.\n   */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n   * Restore the focus styles unset by the previous rule.\n   */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n  outline: 1px dotted ButtonText;\n}\n\n/**\n   * Correct the padding in Firefox.\n   */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n   * 1. Correct the text wrapping in Edge and IE.\n   * 2. Correct the color inheritance from `fieldset` elements in IE.\n   * 3. Remove the padding so developers are not caught out when they zero out\n   *    `fieldset` elements in all browsers.\n   */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n   * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n   */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n   * Remove the default vertical scrollbar in IE 10+.\n   */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n   * 1. Add the correct box sizing in IE 10.\n   * 2. Remove the padding in IE 10.\n   */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n   * Correct the cursor style of increment and decrement buttons in Chrome.\n   */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n   * 1. Correct the odd appearance in Chrome and Safari.\n   * 2. Correct the outline style in Safari.\n   */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n   * Remove the inner padding in Chrome and Safari on macOS.\n   */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n   * 1. Correct the inability to style clickable types in iOS and Safari.\n   * 2. Change font properties to `inherit` in Safari.\n   */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n     ========================================================================== */\n\n/*\n   * Add the correct display in Edge, IE 10+, and Firefox.\n   */\n\ndetails {\n  display: block;\n}\n\n/*\n   * Add the correct display in all browsers.\n   */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n     ========================================================================== */\n\n/**\n   * Add the correct display in IE 10+.\n   */\n\ntemplate {\n  display: none;\n}\n\n/**\n   * Add the correct display in IE 10.\n   */\n\n[hidden] {\n  display: none;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font-size: 100%;\n  font-style: inherit;\n  vertical-align: baseline;\n}\n\n\n:host {\n  --indicator-initial-color: rgba(23 89 188 / 0%);\n  --focus-indicator: var(--ic-border-focus);\n\n  display: flex;\n  align-items: center;\n  border-radius: 0;\n  color: var(--ic-tab-label);\n\n  --ic-typography-color: var(--ic-tab-label);\n\n  height: 2.5rem;\n  padding: 0 var(--ic-space-md);\n  cursor: pointer;\n  position: relative;\n  border-bottom: var(--ic-space-xxs) solid var(--indicator-initial-color);\n  gap: var(--ic-space-xs);\n  transition: all var(--ic-easing-transition-fast);\n}\n\n::slotted([slot=\"icon\"]) {\n  fill: var(--ic-tab-icon);\n}\n\n:host(:focus) {\n  box-shadow: var(--focus-indicator);\n  border-radius: var(--ic-border-radius);\n}\n\n:host(:focus-visible) {\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(:hover) {\n  background-color: var(--ic-tab-item-hover);\n}\n\n:host(:active) {\n  background-color: var(--ic-tab-item-pressed);\n}\n\n:host(.ic-tab-selected) {\n  border-bottom: var(--ic-space-xxs) solid var(--ic-tab-item);\n}\n\n:host(.ic-tab-disabled) {\n  pointer-events: none;\n  color: var(--ic-architectural-300);\n}\n\n:host(.ic-tab-disabled) ic-typography {\n  color: var(--ic-architectural-300);\n\n  --ic-typography-color: var(--ic-architectural-300);\n}\n\n:host(.ic-tab-monochrome) {\n  color: var(--ic-tab-label-monochrome);\n}\n\n:host(.ic-tab-monochrome) ::slotted([slot=\"icon\"]) {\n  fill: var(--ic-tab-icon-monochrome);\n}\n\n:host(.ic-tab-monochrome.ic-tab-selected) {\n  border-bottom: var(--ic-space-xxs) solid var(--ic-tab-item-monochrome);\n}\n\n:host(.ic-tab-monochrome:hover) {\n  background-color: var(--ic-tab-item-hover-monochrome);\n}\n\n:host(.ic-tab-monochrome:active) {\n  background-color: var(--ic-tab-item-pressed-monochrome);\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  :host(.ic-tab-selected.with-transition) {\n    transition: all var(--ic-easing-transition-slow),\n      border-color var(--ic-transition-duration-slow);\n  }\n}\n\n.ic-tab-label {\n  pointer-events: none;\n  text-wrap: nowrap;\n}\n\n::slotted(svg) {\n  fill: currentcolor;\n}\n\n@media (forced-colors: active) {\n  :host {\n    border-bottom: var(--ic-space-xxs) solid canvas;\n  }\n\n  :host(.ic-tab-disabled) {\n    color: GrayText;\n  }\n\n  :host(.ic-tab-disabled) ic-typography {\n    color: GrayText;\n\n    --ic-typography-color: GrayText;\n  }\n}\n\n/* Add back in after storybook has the `color-scheme: light dark` code */\n\n/* @media (prefers-color-scheme: dark) and (not (forced-colors: active)) {\n  :host(ic-tab) .ic-tab-label {\n    color: var(--ic-architectural-white);\n  }\n  :host(ic-tab.ic-tab-disabled) .ic-tab-label {\n    color: inherit;\n  }\n} */\n","import { Host, h, } from \"@stencil/core\";\nimport { isSlotUsed, removeDisabledFalse } from \"../../utils/helpers\";\n/**\n * @slot icon - Content will be rendered next to the tab label.\n * @slot badge - Badge component displayed inline with the tab.\n */\nexport class Tab {\n    constructor() {\n        this.focusFromClick = false;\n        this.isInitialRender = true;\n        this.handleClick = () => {\n            this.tabClick.emit({\n                tabId: this.tabId,\n                contextId: this.contextId,\n                position: this.tabPosition,\n            });\n            if (this.focusFromClick) {\n                this.tabFocus.emit({\n                    tabId: this.tabId,\n                    contextId: this.contextId,\n                    position: this.tabPosition,\n                });\n                this.focusFromClick = false;\n            }\n        };\n        this.handleFocus = () => {\n            if (!this.focusFromClick) {\n                this.focusTabId = this.tabId;\n                this.tabFocus.emit({\n                    tabId: this.tabId,\n                    contextId: this.contextId,\n                    position: this.tabPosition,\n                });\n            }\n        };\n        this.handleMouseDown = () => {\n            //set flag so that focus gets handled after click\n            //there is a timing issue where a long click only causes focus to happen & not the click\n            //the focus does need to be a separate event though to handle focus from keyboard\n            this.focusFromClick = true;\n        };\n        this.contextId = \"default\";\n        this.disabled = false;\n        this.monochrome = false;\n        this.selected = false;\n        this.tabId = undefined;\n        this.tabPosition = undefined;\n        this.theme = \"inherit\";\n    }\n    disabledWatchHandler() {\n        this.tabEnabled.emit();\n    }\n    connectedCallback() {\n        this.tabCreated.emit(this.el);\n    }\n    disconnectedCallback() {\n        var _a;\n        (_a = document\n            .querySelector(`ic-tab-context[context-id=${this.contextId}]`)) === null || _a === void 0 ? void 0 : _a.tabRemovedHandler(!!this.focusTabId);\n    }\n    componentWillLoad() {\n        removeDisabledFalse(this.disabled, this.el);\n    }\n    componentDidUpdate() {\n        this.isInitialRender = false;\n    }\n    /**\n     * Sets focus on the tab.\n     */\n    async setFocus() {\n        if (this.el) {\n            this.el.focus();\n        }\n    }\n    render() {\n        const { disabled, selected, theme, monochrome, handleClick, handleFocus, handleMouseDown, } = this;\n        return (h(Host, { class: {\n                [\"with-transition\"]: !this.isInitialRender,\n                [\"ic-tab-selected\"]: selected,\n                [\"ic-tab-disabled\"]: disabled,\n                [`ic-theme-${theme}`]: theme !== \"inherit\",\n                [\"ic-tab-monochrome\"]: monochrome,\n            }, role: \"tab\", \"aria-selected\": `${selected}`, onClick: handleClick, onFocus: handleFocus, onMouseDown: handleMouseDown, \"aria-disabled\": `${disabled}`, tabindex: selected ? 0 : -1 }, isSlotUsed(this.el, \"icon\") && h(\"slot\", { name: \"icon\" }), h(\"ic-typography\", { class: \"ic-tab-label\", variant: \"label\" }, h(\"span\", null, h(\"slot\", null))), isSlotUsed(this.el, \"badge\") && h(\"slot\", { name: \"badge\" })));\n    }\n    static get is() { return \"ic-tab\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"ic-tab.css\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"ic-tab.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"contextId\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"The unique context needed if using multiple tabs inside one another i.e. rendering another tabs inside a tab panel.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"context-id\",\n                \"reflect\": true,\n                \"defaultValue\": \"\\\"default\\\"\"\n            },\n            \"disabled\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the disabled state will be set.\"\n                },\n                \"attribute\": \"disabled\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"monochrome\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Determines whether black variant of the tabs should be displayed.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"monochrome\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"selected\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"If `true`, the tab will display with a selected indicator and tabIndex will be set.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"selected\",\n                \"reflect\": true,\n                \"defaultValue\": \"false\"\n            },\n            \"tabId\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"The shared ID between panel and tab.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"tab-id\",\n                \"reflect\": true\n            },\n            \"tabPosition\": {\n                \"type\": \"number\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"number\",\n                    \"resolved\": \"number\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"The position of the tab inside the tabs array in context.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"tab-position\",\n                \"reflect\": false\n            },\n            \"theme\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcThemeMode\",\n                    \"resolved\": \"\\\"dark\\\" | \\\"inherit\\\" | \\\"light\\\"\",\n                    \"references\": {\n                        \"IcThemeMode\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcThemeMode\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Determines whether the light or dark variant of the tabs should be displayed.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"theme\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"inherit\\\"\"\n            }\n        };\n    }\n    static get events() {\n        return [{\n                \"method\": \"tabClick\",\n                \"name\": \"tabClick\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab is selected.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"IcTabClickEventDetail\",\n                    \"resolved\": \"IcTabClickEventDetail\",\n                    \"references\": {\n                        \"IcTabClickEventDetail\": {\n                            \"location\": \"import\",\n                            \"path\": \"./ic-tab.types\",\n                            \"id\": \"src/components/ic-tab/ic-tab.types.ts::IcTabClickEventDetail\"\n                        }\n                    }\n                }\n            }, {\n                \"method\": \"tabCreated\",\n                \"name\": \"tabCreated\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab is dynamically created.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"HTMLIcTabElement\",\n                    \"resolved\": \"HTMLIcTabElement\",\n                    \"references\": {\n                        \"HTMLIcTabElement\": {\n                            \"location\": \"global\",\n                            \"id\": \"global::HTMLIcTabElement\"\n                        }\n                    }\n                }\n            }, {\n                \"method\": \"tabEnabled\",\n                \"name\": \"tabEnabled\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab's disabled prop changes\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"void\",\n                    \"resolved\": \"void\",\n                    \"references\": {}\n                }\n            }, {\n                \"method\": \"tabFocus\",\n                \"name\": \"tabFocus\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab is focussed.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"IcTabClickEventDetail\",\n                    \"resolved\": \"IcTabClickEventDetail\",\n                    \"references\": {\n                        \"IcTabClickEventDetail\": {\n                            \"location\": \"import\",\n                            \"path\": \"./ic-tab.types\",\n                            \"id\": \"src/components/ic-tab/ic-tab.types.ts::IcTabClickEventDetail\"\n                        }\n                    }\n                }\n            }, {\n                \"method\": \"tabRemoved\",\n                \"name\": \"tabRemoved\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab is unmounted.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"void\",\n                    \"resolved\": \"void\",\n                    \"references\": {}\n                }\n            }];\n    }\n    static get methods() {\n        return {\n            \"setFocus\": {\n                \"complexType\": {\n                    \"signature\": \"() => Promise<void>\",\n                    \"parameters\": [],\n                    \"references\": {\n                        \"Promise\": {\n                            \"location\": \"global\",\n                            \"id\": \"global::Promise\"\n                        }\n                    },\n                    \"return\": \"Promise<void>\"\n                },\n                \"docs\": {\n                    \"text\": \"Sets focus on the tab.\",\n                    \"tags\": []\n                }\n            }\n        };\n    }\n    static get elementRef() { return \"el\"; }\n    static get watchers() {\n        return [{\n                \"propName\": \"disabled\",\n                \"methodName\": \"disabledWatchHandler\"\n            }];\n    }\n}\n//# sourceMappingURL=ic-tab.js.map\n"],"version":3}
+{"file":"ic-tab.entry.js","mappings":"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","names":[],"sources":["../web-components/dist/collection/components/ic-tab/ic-tab.css?tag=ic-tab&encapsulation=shadow","../web-components/dist/collection/components/ic-tab/ic-tab.js"],"sourcesContent":["/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n     ========================================================================== */\n\n/**\n   * Remove the margin in all browsers.\n   */\n\nbody {\n  margin: 0;\n}\n\n/**\n   * Render the `main` element consistently in IE.\n   */\n\nmain {\n  display: block;\n}\n\n/**\n   * Correct the font size and margin on `h1` elements within `section` and\n   * `article` contexts in Chrome, Firefox, and Safari.\n   */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n     ========================================================================== */\n\n/**\n   * 1. Add the correct box sizing in Firefox.\n   * 2. Show the overflow in Edge and IE.\n   */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n     ========================================================================== */\n\n/**\n   * Remove the gray background on active links in IE 10.\n   */\n\na {\n  background-color: transparent;\n}\n\n/**\n   * 1. Remove the bottom border in Chrome 57-\n   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n   */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted; /* 2 */\n}\n\n/**\n   * Add the correct font weight in Chrome, Edge, and Safari.\n   */\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n   * Add the correct font size in all browsers.\n   */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n   * Prevent `sub` and `sup` elements from affecting the line height in\n   * all browsers.\n   */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n     ========================================================================== */\n\n/**\n   * Remove the border on images inside links in IE 10.\n   */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n     ========================================================================== */\n\n/**\n   * 1. Change the font styles in all browsers.\n   * 2. Remove the margin in Firefox and Safari.\n   */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n   * Show the overflow in IE.\n   * 1. Show the overflow in Edge.\n   */\n\nbutton,\ninput {\n  /* 1 */\n  overflow: visible;\n}\n\n/**\n   * Remove the inheritance of text transform in Edge, Firefox, and IE.\n   * 1. Remove the inheritance of text transform in Firefox.\n   */\n\nbutton,\nselect {\n  /* 1 */\n  text-transform: none;\n}\n\n/**\n   * Correct the inability to style clickable types in iOS and Safari.\n   */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n   * Remove the inner border and padding in Firefox.\n   */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n   * Restore the focus styles unset by the previous rule.\n   */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n  outline: 1px dotted ButtonText;\n}\n\n/**\n   * Correct the padding in Firefox.\n   */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n   * 1. Correct the text wrapping in Edge and IE.\n   * 2. Correct the color inheritance from `fieldset` elements in IE.\n   * 3. Remove the padding so developers are not caught out when they zero out\n   *    `fieldset` elements in all browsers.\n   */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n   * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n   */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n   * Remove the default vertical scrollbar in IE 10+.\n   */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n   * 1. Add the correct box sizing in IE 10.\n   * 2. Remove the padding in IE 10.\n   */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n   * Correct the cursor style of increment and decrement buttons in Chrome.\n   */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n   * 1. Correct the odd appearance in Chrome and Safari.\n   * 2. Correct the outline style in Safari.\n   */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n   * Remove the inner padding in Chrome and Safari on macOS.\n   */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n   * 1. Correct the inability to style clickable types in iOS and Safari.\n   * 2. Change font properties to `inherit` in Safari.\n   */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n     ========================================================================== */\n\n/*\n   * Add the correct display in Edge, IE 10+, and Firefox.\n   */\n\ndetails {\n  display: block;\n}\n\n/*\n   * Add the correct display in all browsers.\n   */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n     ========================================================================== */\n\n/**\n   * Add the correct display in IE 10+.\n   */\n\ntemplate {\n  display: none;\n}\n\n/**\n   * Add the correct display in IE 10.\n   */\n\n[hidden] {\n  display: none;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font-size: 100%;\n  font-style: inherit;\n  vertical-align: baseline;\n}\n\n\n:host {\n  --indicator-initial-color: rgba(23 89 188 / 0%);\n  --focus-indicator: var(--ic-border-focus);\n\n  display: flex;\n  align-items: center;\n  border-radius: 0;\n  color: var(--ic-tab-label);\n\n  --ic-typography-color: var(--ic-tab-label);\n\n  height: 2.5rem;\n  padding: 0 var(--ic-space-md);\n  cursor: pointer;\n  position: relative;\n  border-bottom: var(--ic-space-xxs) solid var(--indicator-initial-color);\n  gap: var(--ic-space-xs);\n  transition: all var(--ic-easing-transition-fast);\n}\n\n::slotted([slot=\"icon\"]) {\n  fill: var(--ic-tab-icon);\n}\n\n:host(:focus) {\n  box-shadow: var(--focus-indicator);\n  border-radius: var(--ic-border-radius);\n}\n\n:host(:focus-visible) {\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(:hover) {\n  background-color: var(--ic-tab-item-hover);\n}\n\n:host(:active) {\n  background-color: var(--ic-tab-item-pressed);\n}\n\n:host(.ic-tab-selected) {\n  border-bottom: var(--ic-space-xxs) solid var(--ic-tab-item);\n}\n\n:host(.ic-tab-disabled) {\n  pointer-events: none;\n  color: var(--ic-architectural-300);\n}\n\n:host(.ic-tab-disabled) ic-typography {\n  color: var(--ic-architectural-300);\n\n  --ic-typography-color: var(--ic-architectural-300);\n}\n\n:host(.ic-tab-monochrome) {\n  color: var(--ic-tab-label-monochrome);\n}\n\n:host(.ic-tab-monochrome) ::slotted([slot=\"icon\"]) {\n  fill: var(--ic-tab-icon-monochrome);\n}\n\n:host(.ic-tab-monochrome.ic-tab-selected) {\n  border-bottom: var(--ic-space-xxs) solid var(--ic-tab-item-monochrome);\n}\n\n:host(.ic-tab-monochrome:hover) {\n  background-color: var(--ic-tab-item-hover-monochrome);\n}\n\n:host(.ic-tab-monochrome:active) {\n  background-color: var(--ic-tab-item-pressed-monochrome);\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  :host(.ic-tab-selected.with-transition) {\n    transition: all var(--ic-easing-transition-slow),\n      border-color var(--ic-transition-duration-slow);\n  }\n}\n\n.ic-tab-label {\n  pointer-events: none;\n  text-wrap: nowrap;\n}\n\n::slotted(svg) {\n  fill: currentcolor;\n}\n\n@media (forced-colors: active) {\n  :host {\n    border-bottom: var(--ic-space-xxs) solid canvas;\n  }\n\n  :host(.ic-tab-disabled) {\n    color: GrayText;\n  }\n\n  :host(.ic-tab-disabled) ic-typography {\n    color: GrayText;\n\n    --ic-typography-color: GrayText;\n  }\n}\n\n/* Add back in after storybook has the `color-scheme: light dark` code */\n\n/* @media (prefers-color-scheme: dark) and (not (forced-colors: active)) {\n  :host(ic-tab) .ic-tab-label {\n    color: var(--ic-architectural-white);\n  }\n  :host(ic-tab.ic-tab-disabled) .ic-tab-label {\n    color: inherit;\n  }\n} */\n","import { Host, h, } from \"@stencil/core\";\nimport { isSlotUsed, removeDisabledFalse } from \"../../utils/helpers\";\n/**\n * @slot icon - Content will be rendered next to the tab label.\n * @slot badge - Badge component displayed inline with the tab.\n */\nexport class Tab {\n    constructor() {\n        this.focusFromClick = false;\n        this.isInitialRender = true;\n        this.handleClick = () => {\n            this.tabClick.emit({\n                tabId: this.tabId,\n                contextId: this.contextId,\n                position: this.tabPosition,\n            });\n            if (this.focusFromClick) {\n                this.tabFocus.emit({\n                    tabId: this.tabId,\n                    contextId: this.contextId,\n                    position: this.tabPosition,\n                });\n                this.focusFromClick = false;\n            }\n        };\n        this.handleFocus = () => {\n            if (!this.focusFromClick) {\n                this.focusTabId = this.tabId;\n                this.tabFocus.emit({\n                    tabId: this.tabId,\n                    contextId: this.contextId,\n                    position: this.tabPosition,\n                });\n            }\n        };\n        this.handleMouseDown = () => {\n            //set flag so that focus gets handled after click\n            //there is a timing issue where a long click only causes focus to happen & not the click\n            //the focus does need to be a separate event though to handle focus from keyboard\n            this.focusFromClick = true;\n        };\n        this.contextId = \"default\";\n        this.disabled = false;\n        this.monochrome = false;\n        this.selected = false;\n        this.tabId = undefined;\n        this.tabPosition = undefined;\n        this.theme = \"inherit\";\n    }\n    watchDisabledHandler() {\n        removeDisabledFalse(this.disabled, this.el);\n    }\n    disabledWatchHandler() {\n        this.tabEnabled.emit();\n    }\n    connectedCallback() {\n        this.tabCreated.emit(this.el);\n    }\n    disconnectedCallback() {\n        var _a;\n        (_a = document\n            .querySelector(`ic-tab-context[context-id=${this.contextId}]`)) === null || _a === void 0 ? void 0 : _a.tabRemovedHandler(!!this.focusTabId);\n    }\n    componentWillLoad() {\n        removeDisabledFalse(this.disabled, this.el);\n    }\n    componentDidUpdate() {\n        this.isInitialRender = false;\n    }\n    /**\n     * Sets focus on the tab.\n     */\n    async setFocus() {\n        if (this.el) {\n            this.el.focus();\n        }\n    }\n    render() {\n        const { disabled, selected, theme, monochrome, handleClick, handleFocus, handleMouseDown, } = this;\n        return (h(Host, { class: {\n                [\"with-transition\"]: !this.isInitialRender,\n                [\"ic-tab-selected\"]: selected,\n                [\"ic-tab-disabled\"]: disabled,\n                [`ic-theme-${theme}`]: theme !== \"inherit\",\n                [\"ic-tab-monochrome\"]: monochrome,\n            }, role: \"tab\", \"aria-selected\": `${selected}`, onClick: handleClick, onFocus: handleFocus, onMouseDown: handleMouseDown, \"aria-disabled\": `${disabled}`, tabindex: selected ? 0 : -1 }, isSlotUsed(this.el, \"icon\") && h(\"slot\", { name: \"icon\" }), h(\"ic-typography\", { class: \"ic-tab-label\", variant: \"label\" }, h(\"span\", null, h(\"slot\", null))), isSlotUsed(this.el, \"badge\") && h(\"slot\", { name: \"badge\" })));\n    }\n    static get is() { return \"ic-tab\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"ic-tab.css\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"ic-tab.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"contextId\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"The unique context needed if using multiple tabs inside one another i.e. rendering another tabs inside a tab panel.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"context-id\",\n                \"reflect\": true,\n                \"defaultValue\": \"\\\"default\\\"\"\n            },\n            \"disabled\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the disabled state will be set.\"\n                },\n                \"attribute\": \"disabled\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"monochrome\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Determines whether black variant of the tabs should be displayed.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"monochrome\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"selected\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"If `true`, the tab will display with a selected indicator and tabIndex will be set.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"selected\",\n                \"reflect\": true,\n                \"defaultValue\": \"false\"\n            },\n            \"tabId\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"The shared ID between panel and tab.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"tab-id\",\n                \"reflect\": true\n            },\n            \"tabPosition\": {\n                \"type\": \"number\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"number\",\n                    \"resolved\": \"number\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"The position of the tab inside the tabs array in context.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"tab-position\",\n                \"reflect\": false\n            },\n            \"theme\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcThemeMode\",\n                    \"resolved\": \"\\\"dark\\\" | \\\"inherit\\\" | \\\"light\\\"\",\n                    \"references\": {\n                        \"IcThemeMode\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcThemeMode\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Determines whether the light or dark variant of the tabs should be displayed.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"theme\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"inherit\\\"\"\n            }\n        };\n    }\n    static get events() {\n        return [{\n                \"method\": \"tabClick\",\n                \"name\": \"tabClick\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab is selected.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"IcTabClickEventDetail\",\n                    \"resolved\": \"IcTabClickEventDetail\",\n                    \"references\": {\n                        \"IcTabClickEventDetail\": {\n                            \"location\": \"import\",\n                            \"path\": \"./ic-tab.types\",\n                            \"id\": \"src/components/ic-tab/ic-tab.types.ts::IcTabClickEventDetail\"\n                        }\n                    }\n                }\n            }, {\n                \"method\": \"tabCreated\",\n                \"name\": \"tabCreated\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab is dynamically created.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"HTMLIcTabElement\",\n                    \"resolved\": \"HTMLIcTabElement\",\n                    \"references\": {\n                        \"HTMLIcTabElement\": {\n                            \"location\": \"global\",\n                            \"id\": \"global::HTMLIcTabElement\"\n                        }\n                    }\n                }\n            }, {\n                \"method\": \"tabEnabled\",\n                \"name\": \"tabEnabled\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab's disabled prop changes\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"void\",\n                    \"resolved\": \"void\",\n                    \"references\": {}\n                }\n            }, {\n                \"method\": \"tabFocus\",\n                \"name\": \"tabFocus\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab is focussed.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"IcTabClickEventDetail\",\n                    \"resolved\": \"IcTabClickEventDetail\",\n                    \"references\": {\n                        \"IcTabClickEventDetail\": {\n                            \"location\": \"import\",\n                            \"path\": \"./ic-tab.types\",\n                            \"id\": \"src/components/ic-tab/ic-tab.types.ts::IcTabClickEventDetail\"\n                        }\n                    }\n                }\n            }, {\n                \"method\": \"tabRemoved\",\n                \"name\": \"tabRemoved\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when a tab is unmounted.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"void\",\n                    \"resolved\": \"void\",\n                    \"references\": {}\n                }\n            }];\n    }\n    static get methods() {\n        return {\n            \"setFocus\": {\n                \"complexType\": {\n                    \"signature\": \"() => Promise<void>\",\n                    \"parameters\": [],\n                    \"references\": {\n                        \"Promise\": {\n                            \"location\": \"global\",\n                            \"id\": \"global::Promise\"\n                        }\n                    },\n                    \"return\": \"Promise<void>\"\n                },\n                \"docs\": {\n                    \"text\": \"Sets focus on the tab.\",\n                    \"tags\": []\n                }\n            }\n        };\n    }\n    static get elementRef() { return \"el\"; }\n    static get watchers() {\n        return [{\n                \"propName\": \"disabled\",\n                \"methodName\": \"watchDisabledHandler\"\n            }, {\n                \"propName\": \"disabled\",\n                \"methodName\": \"disabledWatchHandler\"\n            }];\n    }\n}\n//# sourceMappingURL=ic-tab.js.map\n"],"version":3}

package/dist/esm/ic-theme.entry.js

@@ -1,10 +1,10 @@
 import { r as registerInstance, c as createEvent, h, H as Host } from './index-93509377.js';
-import { G as getThemeColorBrightness, H as BLACK_MIN_COLOR_BRIGHTNESS, W as WHITE_MAX_COLOR_BRIGHTNESS, b as convertToRGBA, g as getThemeForegroundColor } from './helpers-c326255f.js';
+import { G as getBrandColorBrightness, H as BLACK_MIN_COLOR_BRIGHTNESS, W as WHITE_MAX_COLOR_BRIGHTNESS, b as convertToRGBA, g as getBrandForegroundAppearance } from './helpers-fcc7a364.js';
 
 const Theme = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.themeChange = createEvent(this, "themeChange", 7);
+        this.brandChange = createEvent(this, "brandChange", 7);
         this.darkModeChangeHandler = () => {
             if (this.theme === "system") {
                 this.themeClass =
@@ -17,41 +17,41 @@ const Theme = class {
                 this.themeClass = `ic-theme-${this.theme}`;
             }
         };
-        this.checkThemeColorContrast = () => {
-            if (getThemeColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&
-                getThemeColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS) {
-                console.warn(`The theme colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`);
+        this.checkBrandColorContrast = () => {
+            if (getBrandColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&
+                getBrandColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS) {
+                console.warn(`The brand colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`);
             }
         };
-        this.setThemeColor = () => {
-            const colorRGBA = convertToRGBA(this.color);
+        this.setBrandColor = () => {
+            const colorRGBA = convertToRGBA(this.brandColor);
             if (colorRGBA) {
                 const { r, g, b, a } = colorRGBA;
                 const { style } = document.documentElement;
-                style.setProperty("--ic-theme-primary-r", `${r}`);
-                style.setProperty("--ic-theme-primary-g", `${g}`);
-                style.setProperty("--ic-theme-primary-b", `${b}`);
-                style.setProperty("--ic-theme-primary-a", `${a}`);
-                this.checkThemeColorContrast();
-                this.themeChange.emit({
-                    mode: getThemeForegroundColor(),
+                style.setProperty("--ic-brand-color-primary-r", `${r}`);
+                style.setProperty("--ic-brand-color-primary-g", `${g}`);
+                style.setProperty("--ic-brand-color-primary-b", `${b}`);
+                style.setProperty("--ic-brand-color-primary-a", `${a}`);
+                this.checkBrandColorContrast();
+                this.brandChange.emit({
+                    mode: getBrandForegroundAppearance(),
                     color: colorRGBA,
                 });
             }
         };
         this.themeClass = "";
-        this.color = null;
+        this.brandColor = null;
         this.theme = "light";
     }
-    watchColorPropHandler() {
-        this.setThemeColor();
+    watchBrandColorPropHandler() {
+        this.setBrandColor();
     }
     watchThemePropHandler() {
         this.darkModeChangeHandler();
     }
     componentWillLoad() {
         this.darkModeChangeHandler();
-        this.setThemeColor();
+        this.setBrandColor();
         window.matchMedia &&
             window
                 .matchMedia("(prefers-color-scheme: dark)")
@@ -62,7 +62,7 @@ const Theme = class {
         return (h(Host, { class: themeClass }, h("slot", null)));
     }
     static get watchers() { return {
-        "color": ["watchColorPropHandler"],
+        "brandColor": ["watchBrandColorPropHandler"],
         "theme": ["watchThemePropHandler"]
     }; }
 };

package/dist/esm/ic-theme.entry.js.map

@@ -1 +1 @@
-{"file":"ic-theme.entry.js","mappings":";;;MAIa,KAAK;IACd;;;QACI,IAAI,CAAC,qBAAqB,GAAG;YACzB,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;gBACzB,IAAI,CAAC,UAAU;oBACX,MAAM,CAAC,UAAU;wBACb,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,OAAO;0BACvD,eAAe;0BACf,gBAAgB,CAAC;aAC9B;iBACI;gBACD,IAAI,CAAC,UAAU,GAAG,YAAY,IAAI,CAAC,KAAK,EAAE,CAAC;aAC9C;SACJ,CAAC;QACF,IAAI,CAAC,uBAAuB,GAAG;YAC3B,IAAI,uBAAuB,EAAE,GAAG,0BAA0B;gBACtD,uBAAuB,EAAE,GAAG,0BAA0B,EAAE;gBACxD,OAAO,CAAC,IAAI,CAAC,2TAA2T,CAAC,CAAC;aAC7U;SACJ,CAAC;QACF,IAAI,CAAC,aAAa,GAAG;YACjB,MAAM,SAAS,GAAG,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;YAC5C,IAAI,SAAS,EAAE;gBACX,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,CAAC;gBACjC,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,eAAe,CAAC;gBAC3C,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBAClD,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBAClD,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBAClD,KAAK,CAAC,WAAW,CAAC,sBAAsB,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBAClD,IAAI,CAAC,uBAAuB,EAAE,CAAC;gBAC/B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;oBAClB,IAAI,EAAE,uBAAuB,EAAE;oBAC/B,KAAK,EAAE,SAAS;iBACnB,CAAC,CAAC;aACN;SACJ,CAAC;QACF,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;QACrB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;QAClB,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC;KACxB;IACD,qBAAqB;QACjB,IAAI,CAAC,aAAa,EAAE,CAAC;KACxB;IACD,qBAAqB;QACjB,IAAI,CAAC,qBAAqB,EAAE,CAAC;KAChC;IACD,iBAAiB;QACb,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC7B,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,MAAM,CAAC,UAAU;YACb,MAAM;iBACD,UAAU,CAAC,8BAA8B,CAAC;iBAC1C,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;KACnE;IACD,MAAM;QACF,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QAC5B,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,EAAE;KAC5D;;;;;;;;;","names":[],"sources":["../web-components/dist/collection/components/ic-theme/ic-theme.js"],"sourcesContent":["import { Host, h, } from \"@stencil/core\";\nimport { convertToRGBA, getThemeForegroundColor } from \"../../utils/helpers\";\nimport { getThemeColorBrightness } from \"../../utils/helpers\";\nimport { BLACK_MIN_COLOR_BRIGHTNESS, WHITE_MAX_COLOR_BRIGHTNESS, } from \"../../utils/constants\";\nexport class Theme {\n    constructor() {\n        this.darkModeChangeHandler = () => {\n            if (this.theme === \"system\") {\n                this.themeClass =\n                    window.matchMedia &&\n                        window.matchMedia(\"(prefers-color-scheme: dark)\").matches\n                        ? \"ic-theme-dark\"\n                        : \"ic-theme-light\";\n            }\n            else {\n                this.themeClass = `ic-theme-${this.theme}`;\n            }\n        };\n        this.checkThemeColorContrast = () => {\n            if (getThemeColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&\n                getThemeColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS) {\n                console.warn(`The theme colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`);\n            }\n        };\n        this.setThemeColor = () => {\n            const colorRGBA = convertToRGBA(this.color);\n            if (colorRGBA) {\n                const { r, g, b, a } = colorRGBA;\n                const { style } = document.documentElement;\n                style.setProperty(\"--ic-theme-primary-r\", `${r}`);\n                style.setProperty(\"--ic-theme-primary-g\", `${g}`);\n                style.setProperty(\"--ic-theme-primary-b\", `${b}`);\n                style.setProperty(\"--ic-theme-primary-a\", `${a}`);\n                this.checkThemeColorContrast();\n                this.themeChange.emit({\n                    mode: getThemeForegroundColor(),\n                    color: colorRGBA,\n                });\n            }\n        };\n        this.themeClass = \"\";\n        this.color = null;\n        this.theme = \"light\";\n    }\n    watchColorPropHandler() {\n        this.setThemeColor();\n    }\n    watchThemePropHandler() {\n        this.darkModeChangeHandler();\n    }\n    componentWillLoad() {\n        this.darkModeChangeHandler();\n        this.setThemeColor();\n        window.matchMedia &&\n            window\n                .matchMedia(\"(prefers-color-scheme: dark)\")\n                .addEventListener(\"change\", this.darkModeChangeHandler);\n    }\n    render() {\n        const { themeClass } = this;\n        return (h(Host, { class: themeClass }, h(\"slot\", null)));\n    }\n    static get is() { return \"ic-theme\"; }\n    static get properties() {\n        return {\n            \"color\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcColor\",\n                    \"resolved\": \"`#${string}` | `rgb(${string})` | `rgba(${string})`\",\n                    \"references\": {\n                        \"IcColor\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcColor\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The theme colour. Can be a hex value e.g. \\\"#ff0000\\\", RGB e.g. \\\"rgb(255, 0, 0)\\\", or RGBA e.g. \\\"rgba(255, 0, 0, 1)\\\".\"\n                },\n                \"attribute\": \"color\",\n                \"reflect\": false,\n                \"defaultValue\": \"null\"\n            },\n            \"theme\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"\\\"dark\\\" | \\\"light\\\" | \\\"system\\\"\",\n                    \"resolved\": \"\\\"dark\\\" | \\\"light\\\" | \\\"system\\\"\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The theme mode. Can be \\\"dark\\\", \\\"light\\\", or \\\"system\\\". \\\"system\\\" will use the device or browser settings.\"\n                },\n                \"attribute\": \"theme\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"light\\\"\"\n            }\n        };\n    }\n    static get states() {\n        return {\n            \"themeClass\": {}\n        };\n    }\n    static get events() {\n        return [{\n                \"method\": \"themeChange\",\n                \"name\": \"themeChange\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when the theme is changed.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"IcTheme\",\n                    \"resolved\": \"{ mode: IcThemeForeground; color: IcColorRGB; }\",\n                    \"references\": {\n                        \"IcTheme\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcTheme\"\n                        }\n                    }\n                }\n            }];\n    }\n    static get watchers() {\n        return [{\n                \"propName\": \"color\",\n                \"methodName\": \"watchColorPropHandler\"\n            }, {\n                \"propName\": \"theme\",\n                \"methodName\": \"watchThemePropHandler\"\n            }];\n    }\n}\n//# sourceMappingURL=ic-theme.js.map\n"],"version":3}
+{"file":"ic-theme.entry.js","mappings":";;;MAIa,KAAK;IACd;;;QACI,IAAI,CAAC,qBAAqB,GAAG;YACzB,IAAI,IAAI,CAAC,KAAK,KAAK,QAAQ,EAAE;gBACzB,IAAI,CAAC,UAAU;oBACX,MAAM,CAAC,UAAU;wBACb,MAAM,CAAC,UAAU,CAAC,8BAA8B,CAAC,CAAC,OAAO;0BACvD,eAAe;0BACf,gBAAgB,CAAC;aAC9B;iBACI;gBACD,IAAI,CAAC,UAAU,GAAG,YAAY,IAAI,CAAC,KAAK,EAAE,CAAC;aAC9C;SACJ,CAAC;QACF,IAAI,CAAC,uBAAuB,GAAG;YAC3B,IAAI,uBAAuB,EAAE,GAAG,0BAA0B;gBACtD,uBAAuB,EAAE,GAAG,0BAA0B,EAAE;gBACxD,OAAO,CAAC,IAAI,CAAC,2TAA2T,CAAC,CAAC;aAC7U;SACJ,CAAC;QACF,IAAI,CAAC,aAAa,GAAG;YACjB,MAAM,SAAS,GAAG,aAAa,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;YACjD,IAAI,SAAS,EAAE;gBACX,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,CAAC;gBACjC,MAAM,EAAE,KAAK,EAAE,GAAG,QAAQ,CAAC,eAAe,CAAC;gBAC3C,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBACxD,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBACxD,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBACxD,KAAK,CAAC,WAAW,CAAC,4BAA4B,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC;gBACxD,IAAI,CAAC,uBAAuB,EAAE,CAAC;gBAC/B,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC;oBAClB,IAAI,EAAE,4BAA4B,EAAE;oBACpC,KAAK,EAAE,SAAS;iBACnB,CAAC,CAAC;aACN;SACJ,CAAC;QACF,IAAI,CAAC,UAAU,GAAG,EAAE,CAAC;QACrB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,IAAI,CAAC,KAAK,GAAG,OAAO,CAAC;KACxB;IACD,0BAA0B;QACtB,IAAI,CAAC,aAAa,EAAE,CAAC;KACxB;IACD,qBAAqB;QACjB,IAAI,CAAC,qBAAqB,EAAE,CAAC;KAChC;IACD,iBAAiB;QACb,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC7B,IAAI,CAAC,aAAa,EAAE,CAAC;QACrB,MAAM,CAAC,UAAU;YACb,MAAM;iBACD,UAAU,CAAC,8BAA8B,CAAC;iBAC1C,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,qBAAqB,CAAC,CAAC;KACnE;IACD,MAAM;QACF,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC;QAC5B,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,EAAE;KAC5D;;;;;;;;;","names":[],"sources":["../web-components/dist/collection/components/ic-theme/ic-theme.js"],"sourcesContent":["import { Host, h, } from \"@stencil/core\";\nimport { convertToRGBA, getBrandForegroundAppearance, } from \"../../utils/helpers\";\nimport { getBrandColorBrightness } from \"../../utils/helpers\";\nimport { BLACK_MIN_COLOR_BRIGHTNESS, WHITE_MAX_COLOR_BRIGHTNESS, } from \"../../utils/constants\";\nexport class Theme {\n    constructor() {\n        this.darkModeChangeHandler = () => {\n            if (this.theme === \"system\") {\n                this.themeClass =\n                    window.matchMedia &&\n                        window.matchMedia(\"(prefers-color-scheme: dark)\").matches\n                        ? \"ic-theme-dark\"\n                        : \"ic-theme-light\";\n            }\n            else {\n                this.themeClass = `ic-theme-${this.theme}`;\n            }\n        };\n        this.checkBrandColorContrast = () => {\n            if (getBrandColorBrightness() < BLACK_MIN_COLOR_BRIGHTNESS &&\n                getBrandColorBrightness() > WHITE_MAX_COLOR_BRIGHTNESS) {\n                console.warn(`The brand colour does not provide enough contrast with either of the ICDS black or white foreground colours. Consider choosing a colour with a different brightness to achieve sufficient colour contrast for good visibility. See https://www.w3.org/TR/AERT/#color-contrast for more information about colour contrast.`);\n            }\n        };\n        this.setBrandColor = () => {\n            const colorRGBA = convertToRGBA(this.brandColor);\n            if (colorRGBA) {\n                const { r, g, b, a } = colorRGBA;\n                const { style } = document.documentElement;\n                style.setProperty(\"--ic-brand-color-primary-r\", `${r}`);\n                style.setProperty(\"--ic-brand-color-primary-g\", `${g}`);\n                style.setProperty(\"--ic-brand-color-primary-b\", `${b}`);\n                style.setProperty(\"--ic-brand-color-primary-a\", `${a}`);\n                this.checkBrandColorContrast();\n                this.brandChange.emit({\n                    mode: getBrandForegroundAppearance(),\n                    color: colorRGBA,\n                });\n            }\n        };\n        this.themeClass = \"\";\n        this.brandColor = null;\n        this.theme = \"light\";\n    }\n    watchBrandColorPropHandler() {\n        this.setBrandColor();\n    }\n    watchThemePropHandler() {\n        this.darkModeChangeHandler();\n    }\n    componentWillLoad() {\n        this.darkModeChangeHandler();\n        this.setBrandColor();\n        window.matchMedia &&\n            window\n                .matchMedia(\"(prefers-color-scheme: dark)\")\n                .addEventListener(\"change\", this.darkModeChangeHandler);\n    }\n    render() {\n        const { themeClass } = this;\n        return (h(Host, { class: themeClass }, h(\"slot\", null)));\n    }\n    static get is() { return \"ic-theme\"; }\n    static get properties() {\n        return {\n            \"brandColor\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcColor\",\n                    \"resolved\": \"`#${string}` | `rgb(${string})` | `rgba(${string})`\",\n                    \"references\": {\n                        \"IcColor\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcColor\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The brand colour. Can be a hex value e.g. \\\"#ff0000\\\", RGB e.g. \\\"rgb(255, 0, 0)\\\", or RGBA e.g. \\\"rgba(255, 0, 0, 1)\\\".\"\n                },\n                \"attribute\": \"brand-color\",\n                \"reflect\": false,\n                \"defaultValue\": \"null\"\n            },\n            \"theme\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"\\\"dark\\\" | \\\"light\\\" | \\\"system\\\"\",\n                    \"resolved\": \"\\\"dark\\\" | \\\"light\\\" | \\\"system\\\"\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The theme mode. Can be \\\"dark\\\", \\\"light\\\", or \\\"system\\\". \\\"system\\\" will use the device or browser settings.\"\n                },\n                \"attribute\": \"theme\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"light\\\"\"\n            }\n        };\n    }\n    static get states() {\n        return {\n            \"themeClass\": {}\n        };\n    }\n    static get events() {\n        return [{\n                \"method\": \"brandChange\",\n                \"name\": \"brandChange\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [{\n                            \"name\": \"internal\",\n                            \"text\": \"Emitted when the brand color is changed.\"\n                        }],\n                    \"text\": \"\"\n                },\n                \"complexType\": {\n                    \"original\": \"IcBrand\",\n                    \"resolved\": \"{ mode: IcBrandForeground; color: IcColorRGB; }\",\n                    \"references\": {\n                        \"IcBrand\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcBrand\"\n                        }\n                    }\n                }\n            }];\n    }\n    static get watchers() {\n        return [{\n                \"propName\": \"brandColor\",\n                \"methodName\": \"watchBrandColorPropHandler\"\n            }, {\n                \"propName\": \"theme\",\n                \"methodName\": \"watchThemePropHandler\"\n            }];\n    }\n}\n//# sourceMappingURL=ic-theme.js.map\n"],"version":3}

package/dist/esm/ic-toast.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-93509377.js';
 import { c as closeIcon } from './close-icon-c9e09475.js';
-import { i as isSlotUsed, V as VARIANT_ICONS, a as onComponentRequiredPropUndefined, J as getSlot, d as isPropDefined } from './helpers-c326255f.js';
+import { i as isSlotUsed, V as VARIANT_ICONS, a as onComponentRequiredPropUndefined, J as getSlot, d as isPropDefined } from './helpers-fcc7a364.js';
 
 const icToastCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}@media (prefers-reduced-motion: no-preference){:host{animation:fadein var(--ic-transition-duration-slow) ease-in-out}:host(.hidden){animation:fadeout var(--ic-transition-duration-slow) ease-in-out}}:host{--bottom-position:var(--ic-space-xl);position:fixed;bottom:var(--bottom-position);left:50%;transform:translate(-50%);z-index:var(--ic-z-index-toast)}:host(.ic-toast-hidden){display:none}:host(:focus){outline:none}.container{max-width:32.5rem;min-width:18rem;box-shadow:var(--ic-elevation-overlay);min-height:3.5rem;background-color:var(--ic-toast-background);display:flex;align-items:center;position:relative;border-radius:var(--ic-border-radius)}.toast-icon-container{height:100%;display:flex;align-items:center}.divider{height:100%;width:var(--ic-space-xs);position:absolute;border-radius:var(--ic-space-xxxs) 0 0 var(--ic-space-xxxs)}.divider-neutral{background-color:var(--ic-toast-status-neutral)}.divider-info{background-color:var(--ic-toast-status-info)}.divider-warning{background-color:var(--ic-toast-status-warning)}.divider-error{background-color:var(--ic-toast-status-error)}.divider-success{background-color:var(--ic-toast-status-success)}.toast-icon,::slotted(svg){height:var(--ic-space-lg);width:var(--ic-space-lg);margin-left:var(--ic-space-md)}:host([variant=\"neutral\"]) .toast-icon svg,::slotted(svg){fill:var(--ic-toast-icon-neutral)}:host([variant=\"info\"]) .toast-icon svg{fill:var(--ic-toast-icon-info)}:host([variant=\"warning\"]) .toast-icon svg{fill:var(--ic-toast-icon-warning)}:host([variant=\"error\"]) .toast-icon svg{fill:var(--ic-toast-icon-error)}:host([variant=\"success\"]) .toast-icon svg{fill:var(--ic-toast-icon-success)}.toast-content{margin-left:var(--ic-space-xs);width:100%}.no-icon{margin-left:var(--ic-space-md)}.toast-text{padding:var(--ic-space-xs) var(--ic-space-xs) var(--ic-space-xs) 0}.toast-heading{--ic-typography-color:var(--ic-toast-title)}.toast-message{--ic-typography-color:var(--ic-toast-description)}.toast-action-container{padding-bottom:var(--ic-space-md)}#dismiss-button{padding:var(--ic-space-xs)}#dismiss-button>svg{color:var(--ic-toast-dismiss-button)}ic-loading-indicator{--outer-color:transparent;--inner-color:var(--ic-action-light)}.toast-dismiss-timer{padding:var(--ic-space-sm)}@media (max-width: 576px){:host{--bottom-position:var(--ic-space-lg);width:calc(100% - 2 * var(--ic-space-md))}}@media (min-width: 993px){:host{--bottom-position:calc(var(--ic-space-xl) + var(--ic-space-xs))}}@media (forced-colors: active){.container{border:var(--ic-border-hc)}}@keyframes fadein{from{bottom:0;opacity:0}to{bottom:var(--bottom-position);opacity:1}}@keyframes fadeout{from{bottom:var(--bottom-position);opacity:1}to{bottom:0;opacity:0}}";
 

package/dist/esm/ic-toggle-button-group.entry.js

@@ -1,6 +1,7 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-93509377.js';
+import { r as removeDisabledFalse } from './helpers-fcc7a364.js';
 
-const icToggleButtonGroupCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:root{display:block}:host{display:flex;flex-direction:row;width:-moz-fit-content;width:fit-content;min-width:-moz-min-content;min-width:min-content;border:var(--ic-border-width) solid var(--ic-action-default);border-radius:var(--ic-border-radius)}:host(.ic-toggle-button-group-full-width){width:100%;max-width:100%}:host(.ic-toggle-button-group-loading){min-width:-moz-max-content;min-width:max-content}:host(:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-transition-duration-fast);outline:none}::slotted(ic-toggle-button){flex-grow:1;width:-moz-min-content;width:min-content;--toggle-button-border:none}::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-width) solid var(--ic-action-default)}:host(.ic-toggle-button-group-disabled){border:var(--ic-border-disabled);pointer-events:none}:host(.ic-toggle-button-group-disabled) ::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-disabled)}:host(.ic-toggle-button-group-dark){border:var(--ic-border-width) solid var(--ic-action-dark)}:host(.ic-toggle-button-group-dark) ::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-width) solid var(--ic-action-dark)}:host(.ic-toggle-button-group-light) ::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-width) solid var(--ic-action-light)}:host(.ic-toggle-button-group-light){border:var(--ic-border-width) solid var(--ic-action-light)}";
+const icToggleButtonGroupCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:root{display:block}:host{display:flex;flex-direction:row;width:-moz-fit-content;width:fit-content;min-width:-moz-min-content;min-width:min-content;border:var(--ic-border-width) solid var(--ic-toggle-button-unselected-border);border-radius:var(--ic-border-radius)}:host(.ic-toggle-button-group-full-width){width:100%;max-width:100%}:host(.ic-toggle-button-group-loading){min-width:-moz-max-content;min-width:max-content}:host(:focus){box-shadow:var(--ic-border-focus);border-radius:var(--ic-border-radius);transition:var(--ic-transition-duration-fast);outline:none}::slotted(ic-toggle-button){flex-grow:1;width:-moz-min-content;width:min-content;--toggle-button-border:none !important;--toggle-button-border-hover:none !important;--toggle-button-border-active:none !important}::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border)}:host(.ic-toggle-button-group-disabled){border:var(--ic-space-1px) dashed\n    var(--ic-toggle-button-unselected-border-disabled);pointer-events:none}:host(.ic-toggle-button-group-disabled) ::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-space-1px) dashed\n    var(--ic-toggle-button-unselected-border-disabled)}:host(.ic-toggle-button-group-monochrome){border:var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-monochrome)}:host(.ic-toggle-button-group-monochrome) ::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-monochrome)}:host(.ic-toggle-button-group-disabled.ic-toggle-button-group-monochrome){border:var(--ic-border-width) dashed\n    var(--ic-toggle-button-unselected-border-disabled-monochrome)}:host(.ic-toggle-button-group-disabled.ic-toggle-button-group-monochrome) ::slotted(ic-toggle-button:not(:last-of-type)){border-right:var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-disabled-monochrome)}";
 
 const TOGGLE_GROUP = "IC-TOGGLE-BUTTON-GROUP";
 const ToggleButtonGroup = class {
@@ -85,16 +86,33 @@ const ToggleButtonGroup = class {
             shift: false,
         };
         this.accessibleLabel = "Toggle button group";
-        this.appearance = "default";
         this.disabled = false;
         this.fullWidth = false;
         this.iconPlacement = undefined;
         this.loading = false;
+        this.monochrome = false;
         this.selectMethod = "manual";
         this.selectType = "single";
         this.size = "medium";
+        this.theme = "inherit";
         this.variant = "default";
     }
+    watchDisabledHandler() {
+        this.getAllToggleButtons().forEach((el) => {
+            el.disabled = this.disabled;
+        });
+        removeDisabledFalse(this.disabled, this.el);
+    }
+    watchMonochromeHandler() {
+        this.getAllToggleButtons().forEach((el) => {
+            el.monochrome = this.monochrome;
+        });
+    }
+    watchThemeHandler() {
+        this.getAllToggleButtons().forEach((el) => {
+            el.theme = this.theme;
+        });
+    }
     selectHandler(ev, tabTarget) {
         const allToggles = this.getAllToggleButtons();
         let clickedToggle = ev.target;
@@ -128,6 +146,7 @@ const ToggleButtonGroup = class {
     componentWillLoad() {
         this.selectType === "multi" && (this.selectMethod = "manual");
         document.addEventListener("keydown", this.keyListener);
+        removeDisabledFalse(this.disabled, this.el);
     }
     componentDidLoad() {
         this.getAllToggleButtons().forEach((el, i) => {
@@ -136,7 +155,8 @@ const ToggleButtonGroup = class {
             el.loading = this.loading;
             el.iconPlacement = this.iconPlacement;
             el.disabled ? null : (el.disabled = this.disabled);
-            el.appearance = this.appearance;
+            el.theme = this.theme;
+            el.monochrome = this.monochrome;
             el.variant = this.variant;
             el.fullWidth = this.fullWidth;
             el.id = i.toString();
@@ -165,13 +185,20 @@ const ToggleButtonGroup = class {
     }
     render() {
         return (h(Host, { role: "group", "aria-label": this.accessibleLabel, "aria-disabled": this.disabled ? "true" : "false", tabindex: 0, class: {
+                [`ic-theme-${this.theme}`]: this.theme !== "inherit",
                 ["ic-toggle-button-group-full-width"]: this.fullWidth,
                 ["ic-toggle-button-group-loading"]: this.loading,
                 ["ic-toggle-button-group-disabled"]: this.disabled,
-                [`ic-toggle-button-group-${this.appearance}`]: true,
+                [`ic-toggle-button-group-monochrome`]: this.monochrome,
+                [`ic-theme-${this.theme}`]: this.theme !== "inherit",
             }, onFocus: this.handleHostFocus }, h("slot", null)));
     }
     get el() { return getElement(this); }
+    static get watchers() { return {
+        "disabled": ["watchDisabledHandler"],
+        "monochrome": ["watchMonochromeHandler"],
+        "theme": ["watchThemeHandler"]
+    }; }
 };
 ToggleButtonGroup.style = icToggleButtonGroupCss;
 

package/dist/esm/ic-toggle-button-group.entry.js.map

@@ -1 +1 @@
-{"file":"ic-toggle-button-group.entry.js","mappings":"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","names":[],"sources":["../web-components/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.css?tag=ic-toggle-button-group&encapsulation=shadow","../web-components/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.js"],"sourcesContent":["/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n     ========================================================================== */\n\n/**\n   * Remove the margin in all browsers.\n   */\n\nbody {\n  margin: 0;\n}\n\n/**\n   * Render the `main` element consistently in IE.\n   */\n\nmain {\n  display: block;\n}\n\n/**\n   * Correct the font size and margin on `h1` elements within `section` and\n   * `article` contexts in Chrome, Firefox, and Safari.\n   */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n     ========================================================================== */\n\n/**\n   * 1. Add the correct box sizing in Firefox.\n   * 2. Show the overflow in Edge and IE.\n   */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n     ========================================================================== */\n\n/**\n   * Remove the gray background on active links in IE 10.\n   */\n\na {\n  background-color: transparent;\n}\n\n/**\n   * 1. Remove the bottom border in Chrome 57-\n   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n   */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted; /* 2 */\n}\n\n/**\n   * Add the correct font weight in Chrome, Edge, and Safari.\n   */\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n   * Add the correct font size in all browsers.\n   */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n   * Prevent `sub` and `sup` elements from affecting the line height in\n   * all browsers.\n   */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n     ========================================================================== */\n\n/**\n   * Remove the border on images inside links in IE 10.\n   */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n     ========================================================================== */\n\n/**\n   * 1. Change the font styles in all browsers.\n   * 2. Remove the margin in Firefox and Safari.\n   */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n   * Show the overflow in IE.\n   * 1. Show the overflow in Edge.\n   */\n\nbutton,\ninput {\n  /* 1 */\n  overflow: visible;\n}\n\n/**\n   * Remove the inheritance of text transform in Edge, Firefox, and IE.\n   * 1. Remove the inheritance of text transform in Firefox.\n   */\n\nbutton,\nselect {\n  /* 1 */\n  text-transform: none;\n}\n\n/**\n   * Correct the inability to style clickable types in iOS and Safari.\n   */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n   * Remove the inner border and padding in Firefox.\n   */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n   * Restore the focus styles unset by the previous rule.\n   */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n  outline: 1px dotted ButtonText;\n}\n\n/**\n   * Correct the padding in Firefox.\n   */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n   * 1. Correct the text wrapping in Edge and IE.\n   * 2. Correct the color inheritance from `fieldset` elements in IE.\n   * 3. Remove the padding so developers are not caught out when they zero out\n   *    `fieldset` elements in all browsers.\n   */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n   * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n   */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n   * Remove the default vertical scrollbar in IE 10+.\n   */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n   * 1. Add the correct box sizing in IE 10.\n   * 2. Remove the padding in IE 10.\n   */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n   * Correct the cursor style of increment and decrement buttons in Chrome.\n   */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n   * 1. Correct the odd appearance in Chrome and Safari.\n   * 2. Correct the outline style in Safari.\n   */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n   * Remove the inner padding in Chrome and Safari on macOS.\n   */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n   * 1. Correct the inability to style clickable types in iOS and Safari.\n   * 2. Change font properties to `inherit` in Safari.\n   */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n     ========================================================================== */\n\n/*\n   * Add the correct display in Edge, IE 10+, and Firefox.\n   */\n\ndetails {\n  display: block;\n}\n\n/*\n   * Add the correct display in all browsers.\n   */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n     ========================================================================== */\n\n/**\n   * Add the correct display in IE 10+.\n   */\n\ntemplate {\n  display: none;\n}\n\n/**\n   * Add the correct display in IE 10.\n   */\n\n[hidden] {\n  display: none;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font-size: 100%;\n  font-style: inherit;\n  vertical-align: baseline;\n}\n\n\n/* PARENT HOST */\n\n:root {\n  display: block;\n}\n\n:host {\n  display: flex;\n  flex-direction: row;\n  width: -moz-fit-content;\n  width: fit-content;\n  min-width: -moz-min-content;\n  min-width: min-content;\n  border: var(--ic-border-width) solid var(--ic-action-default);\n  border-radius: var(--ic-border-radius);\n}\n\n:host(.ic-toggle-button-group-full-width) {\n  width: 100%;\n  max-width: 100%;\n}\n\n:host(.ic-toggle-button-group-loading) {\n  min-width: -moz-max-content;\n  min-width: max-content;\n}\n\n:host(:focus) {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-transition-duration-fast);\n  outline: none;\n}\n\n/* CHILDREN SLOTTED */\n\n::slotted(ic-toggle-button) {\n  flex-grow: 1;\n  width: -moz-min-content;\n  width: min-content;\n\n  --toggle-button-border: none;\n}\n\n::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-width) solid var(--ic-action-default);\n}\n\n/* DISABLED */\n:host(.ic-toggle-button-group-disabled) {\n  border: var(--ic-border-disabled);\n  pointer-events: none;\n}\n\n:host(.ic-toggle-button-group-disabled)\n  ::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-disabled);\n}\n\n/* DARK */\n:host(.ic-toggle-button-group-dark) {\n  border: var(--ic-border-width) solid var(--ic-action-dark);\n}\n\n:host(.ic-toggle-button-group-dark)\n  ::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-width) solid var(--ic-action-dark);\n}\n\n/* LIGHT */\n:host(.ic-toggle-button-group-light)\n  ::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-width) solid var(--ic-action-light);\n}\n\n:host(.ic-toggle-button-group-light) {\n  border: var(--ic-border-width) solid var(--ic-action-light);\n}\n","import { Host, h, } from \"@stencil/core\";\nconst TOGGLE_GROUP = \"IC-TOGGLE-BUTTON-GROUP\";\nexport class ToggleButtonGroup {\n    constructor() {\n        this.keyListener = (ev) => {\n            this.lastKeyPressed = {\n                key: ev.key,\n                shift: ev.shiftKey,\n            };\n        };\n        this.setSlottedAria = (el) => {\n            const btn = el.shadowRoot\n                .querySelector(\"ic-button\")\n                .shadowRoot.querySelector(\"button\");\n            let aria = btn.getAttribute(\"aria-label\");\n            aria += \", \";\n            aria += this.accessibleLabel;\n            btn.setAttribute(\"aria-label\", aria);\n        };\n        this.handleHostFocus = (ev) => {\n            if (this.loading || this.disabled) {\n                return null;\n            }\n            const el = ev.target;\n            const relEl = ev.relatedTarget;\n            const toggleButtons = Array.from(el.querySelectorAll(\"ic-toggle-button\"));\n            if (((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                toggleButtons[0].focus();\n            }\n            else if (this.lastKeyPressed.shift === false ||\n                (this.lastKeyPressed.shift === true && relEl.tagName == TOGGLE_GROUP)) {\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        this.handleKeyDown = (event) => {\n            const toggleButtonOptions = this.getAllToggleButtons();\n            const focussedChild = toggleButtonOptions.indexOf(toggleButtonOptions.filter((el) => el === document.activeElement)[0]);\n            switch (event.key) {\n                case \"ArrowDown\":\n                case \"ArrowRight\":\n                    this.selectMethod === \"auto\"\n                        ? this.proxySelectHandler(toggleButtonOptions[this.getNextItemToSelect(focussedChild, true)])\n                        : toggleButtonOptions[this.getNextItemToSelect(focussedChild, true)].focus();\n                    break;\n                case \"ArrowUp\":\n                case \"ArrowLeft\":\n                    this.selectMethod === \"auto\"\n                        ? this.proxySelectHandler(toggleButtonOptions[this.getNextItemToSelect(focussedChild, false)])\n                        : toggleButtonOptions[this.getNextItemToSelect(focussedChild, false)].focus();\n                    break;\n                case \"Tab\":\n                    break;\n            }\n        };\n        this.getNextItemToSelect = (currentItem, movingDown) => {\n            const toggleButtonOptions = this.getAllToggleButtons();\n            const numToggles = toggleButtonOptions.length - 1;\n            if (currentItem < 1) {\n                currentItem = 0;\n            }\n            let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n            if (nextItem < 0) {\n                nextItem = numToggles;\n            }\n            else if (nextItem > numToggles) {\n                nextItem = 0;\n            }\n            if (toggleButtonOptions[nextItem].disabled) {\n                nextItem = this.getNextItemToSelect(nextItem, movingDown);\n            }\n            return nextItem;\n        };\n        this.lastKeyPressed = {\n            key: null,\n            shift: false,\n        };\n        this.accessibleLabel = \"Toggle button group\";\n        this.appearance = \"default\";\n        this.disabled = false;\n        this.fullWidth = false;\n        this.iconPlacement = undefined;\n        this.loading = false;\n        this.selectMethod = \"manual\";\n        this.selectType = \"single\";\n        this.size = \"medium\";\n        this.variant = \"default\";\n    }\n    selectHandler(ev, tabTarget) {\n        const allToggles = this.getAllToggleButtons();\n        let clickedToggle = ev.target;\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            this.icChange.emit({\n                checked: ev.detail.checked,\n                selectedOption: clickedToggle,\n            });\n        }\n        else {\n            const toggledOptions = this.getAllToggleButtons().filter((el) => el.checked && !el.disabled);\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    componentWillLoad() {\n        this.selectType === \"multi\" && (this.selectMethod = \"manual\");\n        this.selectMethod === \"auto\" && this.selectType === \"single\";\n        document.addEventListener(\"keydown\", this.keyListener);\n    }\n    componentDidLoad() {\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.appearance = this.appearance;\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    disconnectedCallback() {\n        document === null || document === void 0 ? void 0 : document.removeEventListener(\"keydown\", this.keyListener);\n    }\n    // trigger selectHandler when unable to add 'target'\n    proxySelectHandler(toggle) {\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    getAllToggleButtons() {\n        return Array.from(this.el.querySelectorAll(\"ic-toggle-button\"));\n    }\n    render() {\n        return (h(Host, { role: \"group\", \"aria-label\": this.accessibleLabel, \"aria-disabled\": this.disabled ? \"true\" : \"false\", tabindex: 0, class: {\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-${this.appearance}`]: true,\n            }, onFocus: this.handleHostFocus }, h(\"slot\", null)));\n    }\n    static get is() { return \"ic-toggle-button-group\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"ic-toggle-button-group.css\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"ic-toggle-button-group.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"accessibleLabel\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The accessible label of the toggle button group component to provide context for screen reader users.\"\n                },\n                \"attribute\": \"accessible-label\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"Toggle button group\\\"\"\n            },\n            \"appearance\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcThemeForeground\",\n                    \"resolved\": \"\\\"dark\\\" | \\\"default\\\" | \\\"light\\\"\",\n                    \"references\": {\n                        \"IcThemeForeground\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcThemeForeground\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The appearance of the toggle button group, e.g dark, or light.\"\n                },\n                \"attribute\": \"appearance\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"default\\\"\"\n            },\n            \"disabled\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the toggle button group will be set to the disabled state.\"\n                },\n                \"attribute\": \"disabled\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"fullWidth\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the toggle button group will fill the width of the container.\"\n                },\n                \"attribute\": \"full-width\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"iconPlacement\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"\\\"left\\\" | \\\"right\\\" | \\\"top\\\"\",\n                    \"resolved\": \"\\\"left\\\" | \\\"right\\\" | \\\"top\\\"\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The placement of the icons in relation to the toggle button labels.\"\n                },\n                \"attribute\": \"icon-placement\",\n                \"reflect\": false\n            },\n            \"loading\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the toggle button group will be in loading state.\"\n                },\n                \"attribute\": \"loading\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"selectMethod\": {\n                \"type\": \"string\",\n                \"mutable\": true,\n                \"complexType\": {\n                    \"original\": \"IcSelectMethodTypes\",\n                    \"resolved\": \"\\\"auto\\\" | \\\"manual\\\"\",\n                    \"references\": {\n                        \"IcSelectMethodTypes\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcSelectMethodTypes\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"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                \"attribute\": \"select-method\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"manual\\\"\"\n            },\n            \"selectType\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcSelectTypes\",\n                    \"resolved\": \"\\\"multi\\\" | \\\"single\\\"\",\n                    \"references\": {\n                        \"IcSelectTypes\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcSelectTypes\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Sets whether single or multiple options can be toggled. If `multi`, then the `selectMethod` is always `manual`.\"\n                },\n                \"attribute\": \"select-type\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"single\\\"\"\n            },\n            \"size\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcSizes\",\n                    \"resolved\": \"\\\"large\\\" | \\\"medium\\\" | \\\"small\\\"\",\n                    \"references\": {\n                        \"IcSizes\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcSizes\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The size of the toggle buttons to be displayed. This does not affect the font size of the accessible label.\"\n                },\n                \"attribute\": \"size\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"medium\\\"\"\n            },\n            \"variant\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"\\\"default\\\" | \\\"icon\\\"\",\n                    \"resolved\": \"\\\"default\\\" | \\\"icon\\\"\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The variant of the toggle button.\"\n                },\n                \"attribute\": \"variant\",\n                \"reflect\": true,\n                \"defaultValue\": \"\\\"default\\\"\"\n            }\n        };\n    }\n    static get states() {\n        return {\n            \"lastKeyPressed\": {}\n        };\n    }\n    static get events() {\n        return [{\n                \"method\": \"icChange\",\n                \"name\": \"icChange\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Emitted when a toggle button is selected.\"\n                },\n                \"complexType\": {\n                    \"original\": \"IcChangeEventDetail\",\n                    \"resolved\": \"IcChangeEventDetail\",\n                    \"references\": {\n                        \"IcChangeEventDetail\": {\n                            \"location\": \"import\",\n                            \"path\": \"./ic-toggle-button-group.types\",\n                            \"id\": \"src/components/ic-toggle-button-group/ic-toggle-button-group.types.ts::IcChangeEventDetail\"\n                        }\n                    }\n                }\n            }];\n    }\n    static get elementRef() { return \"el\"; }\n    static get listeners() {\n        return [{\n                \"name\": \"icToggleChecked\",\n                \"method\": \"selectHandler\",\n                \"target\": undefined,\n                \"capture\": false,\n                \"passive\": false\n            }];\n    }\n}\n//# sourceMappingURL=ic-toggle-button-group.js.map\n"],"version":3}
+{"file":"ic-toggle-button-group.entry.js","mappings":"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","names":[],"sources":["../web-components/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.css?tag=ic-toggle-button-group&encapsulation=shadow","../web-components/dist/collection/components/ic-toggle-button-group/ic-toggle-button-group.js"],"sourcesContent":["/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */\n\n/* Document\n   ========================================================================== */\n\n/**\n * 1. Correct the line height in all browsers.\n * 2. Prevent adjustments of font size after orientation changes in iOS.\n */\n\nhtml {\n  line-height: 1.15; /* 1 */\n  -webkit-text-size-adjust: 100%; /* 2 */\n}\n\n/* Sections\n     ========================================================================== */\n\n/**\n   * Remove the margin in all browsers.\n   */\n\nbody {\n  margin: 0;\n}\n\n/**\n   * Render the `main` element consistently in IE.\n   */\n\nmain {\n  display: block;\n}\n\n/**\n   * Correct the font size and margin on `h1` elements within `section` and\n   * `article` contexts in Chrome, Firefox, and Safari.\n   */\n\nh1 {\n  font-size: 2em;\n  margin: 0.67em 0;\n}\n\n/* Grouping content\n     ========================================================================== */\n\n/**\n   * 1. Add the correct box sizing in Firefox.\n   * 2. Show the overflow in Edge and IE.\n   */\n\nhr {\n  box-sizing: content-box; /* 1 */\n  height: 0; /* 1 */\n  overflow: visible; /* 2 */\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\npre {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/* Text-level semantics\n     ========================================================================== */\n\n/**\n   * Remove the gray background on active links in IE 10.\n   */\n\na {\n  background-color: transparent;\n}\n\n/**\n   * 1. Remove the bottom border in Chrome 57-\n   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.\n   */\n\nabbr[title] {\n  border-bottom: none; /* 1 */\n  text-decoration: underline; /* 2 */\n  -webkit-text-decoration: underline dotted;\n          text-decoration: underline dotted; /* 2 */\n}\n\n/**\n   * Add the correct font weight in Chrome, Edge, and Safari.\n   */\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\n/**\n   * 1. Correct the inheritance and scaling of font size in all browsers.\n   * 2. Correct the odd `em` font sizing in all browsers.\n   */\n\ncode,\nkbd,\nsamp {\n  font-family: monospace, monospace; /* 1 */\n  font-size: 1em; /* 2 */\n}\n\n/**\n   * Add the correct font size in all browsers.\n   */\n\nsmall {\n  font-size: 80%;\n}\n\n/**\n   * Prevent `sub` and `sup` elements from affecting the line height in\n   * all browsers.\n   */\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\n\nsub {\n  bottom: -0.25em;\n}\n\nsup {\n  top: -0.5em;\n}\n\n/* Embedded content\n     ========================================================================== */\n\n/**\n   * Remove the border on images inside links in IE 10.\n   */\n\nimg {\n  border-style: none;\n}\n\n/* Forms\n     ========================================================================== */\n\n/**\n   * 1. Change the font styles in all browsers.\n   * 2. Remove the margin in Firefox and Safari.\n   */\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit; /* 1 */\n  font-size: 100%; /* 1 */\n  line-height: 1.15; /* 1 */\n  margin: 0; /* 2 */\n}\n\n/**\n   * Show the overflow in IE.\n   * 1. Show the overflow in Edge.\n   */\n\nbutton,\ninput {\n  /* 1 */\n  overflow: visible;\n}\n\n/**\n   * Remove the inheritance of text transform in Edge, Firefox, and IE.\n   * 1. Remove the inheritance of text transform in Firefox.\n   */\n\nbutton,\nselect {\n  /* 1 */\n  text-transform: none;\n}\n\n/**\n   * Correct the inability to style clickable types in iOS and Safari.\n   */\n\nbutton,\n[type=\"button\"],\n[type=\"reset\"],\n[type=\"submit\"] {\n  -webkit-appearance: button;\n}\n\n/**\n   * Remove the inner border and padding in Firefox.\n   */\n\nbutton::-moz-focus-inner,\n[type=\"button\"]::-moz-focus-inner,\n[type=\"reset\"]::-moz-focus-inner,\n[type=\"submit\"]::-moz-focus-inner {\n  border-style: none;\n  padding: 0;\n}\n\n/**\n   * Restore the focus styles unset by the previous rule.\n   */\n\nbutton:-moz-focusring,\n[type=\"button\"]:-moz-focusring,\n[type=\"reset\"]:-moz-focusring,\n[type=\"submit\"]:-moz-focusring {\n  outline: 1px dotted ButtonText;\n}\n\n/**\n   * Correct the padding in Firefox.\n   */\n\nfieldset {\n  padding: 0.35em 0.75em 0.625em;\n}\n\n/**\n   * 1. Correct the text wrapping in Edge and IE.\n   * 2. Correct the color inheritance from `fieldset` elements in IE.\n   * 3. Remove the padding so developers are not caught out when they zero out\n   *    `fieldset` elements in all browsers.\n   */\n\nlegend {\n  box-sizing: border-box; /* 1 */\n  color: inherit; /* 2 */\n  display: table; /* 1 */\n  max-width: 100%; /* 1 */\n  padding: 0; /* 3 */\n  white-space: normal; /* 1 */\n}\n\n/**\n   * Add the correct vertical alignment in Chrome, Firefox, and Opera.\n   */\n\nprogress {\n  vertical-align: baseline;\n}\n\n/**\n   * Remove the default vertical scrollbar in IE 10+.\n   */\n\ntextarea {\n  overflow: auto;\n}\n\n/**\n   * 1. Add the correct box sizing in IE 10.\n   * 2. Remove the padding in IE 10.\n   */\n\n[type=\"checkbox\"],\n[type=\"radio\"] {\n  box-sizing: border-box; /* 1 */\n  padding: 0; /* 2 */\n}\n\n/**\n   * Correct the cursor style of increment and decrement buttons in Chrome.\n   */\n\n[type=\"number\"]::-webkit-inner-spin-button,\n[type=\"number\"]::-webkit-outer-spin-button {\n  height: auto;\n}\n\n/**\n   * 1. Correct the odd appearance in Chrome and Safari.\n   * 2. Correct the outline style in Safari.\n   */\n\n[type=\"search\"] {\n  -webkit-appearance: textfield; /* 1 */\n  outline-offset: -2px; /* 2 */\n}\n\n/**\n   * Remove the inner padding in Chrome and Safari on macOS.\n   */\n\n[type=\"search\"]::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n/**\n   * 1. Correct the inability to style clickable types in iOS and Safari.\n   * 2. Change font properties to `inherit` in Safari.\n   */\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button; /* 1 */\n  font: inherit; /* 2 */\n}\n\n/* Interactive\n     ========================================================================== */\n\n/*\n   * Add the correct display in Edge, IE 10+, and Firefox.\n   */\n\ndetails {\n  display: block;\n}\n\n/*\n   * Add the correct display in all browsers.\n   */\n\nsummary {\n  display: list-item;\n}\n\n/* Misc\n     ========================================================================== */\n\n/**\n   * Add the correct display in IE 10+.\n   */\n\ntemplate {\n  display: none;\n}\n\n/**\n   * Add the correct display in IE 10.\n   */\n\n[hidden] {\n  display: none;\n}\n\nhtml,\nbody,\ndiv,\nspan,\napplet,\nobject,\niframe,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\np,\nblockquote,\npre,\na,\nabbr,\nacronym,\naddress,\nbig,\ncite,\ncode,\ndel,\ndfn,\nem,\nimg,\nins,\nkbd,\nq,\ns,\nsamp,\nsmall,\nstrike,\nstrong,\nsub,\nsup,\ntt,\nvar,\nb,\nu,\ni,\ncenter,\ndl,\ndt,\ndd,\nol,\nul,\nli,\nfieldset,\nform,\nlabel,\nlegend,\ntable,\ncaption,\ntbody,\ntfoot,\nthead,\ntr,\nth,\ntd,\narticle,\naside,\ncanvas,\ndetails,\nembed,\nfigure,\nfigcaption,\nfooter,\nheader,\nhgroup,\nmenu,\nnav,\noutput,\nruby,\nsection,\nsummary,\ntime,\nmark,\naudio,\nvideo {\n  margin: 0;\n  padding: 0;\n  border: 0;\n  font-size: 100%;\n  font-style: inherit;\n  vertical-align: baseline;\n}\n\n\n/* PARENT HOST */\n\n:root {\n  display: block;\n}\n\n:host {\n  display: flex;\n  flex-direction: row;\n  width: -moz-fit-content;\n  width: fit-content;\n  min-width: -moz-min-content;\n  min-width: min-content;\n  border: var(--ic-border-width) solid var(--ic-toggle-button-unselected-border);\n  border-radius: var(--ic-border-radius);\n}\n\n:host(.ic-toggle-button-group-full-width) {\n  width: 100%;\n  max-width: 100%;\n}\n\n:host(.ic-toggle-button-group-loading) {\n  min-width: -moz-max-content;\n  min-width: max-content;\n}\n\n:host(:focus) {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n  transition: var(--ic-transition-duration-fast);\n  outline: none;\n}\n\n/* CHILDREN SLOTTED */\n\n::slotted(ic-toggle-button) {\n  flex-grow: 1;\n  width: -moz-min-content;\n  width: min-content;\n\n  --toggle-button-border: none !important;\n  --toggle-button-border-hover: none !important;\n  --toggle-button-border-active: none !important;\n}\n\n::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border);\n}\n\n/* DISABLED */\n:host(.ic-toggle-button-group-disabled) {\n  border: var(--ic-space-1px) dashed\n    var(--ic-toggle-button-unselected-border-disabled);\n  pointer-events: none;\n}\n\n:host(.ic-toggle-button-group-disabled)\n  ::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-space-1px) dashed\n    var(--ic-toggle-button-unselected-border-disabled);\n}\n\n:host(.ic-toggle-button-group-monochrome) {\n  border: var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-monochrome);\n}\n\n:host(.ic-toggle-button-group-monochrome)\n  ::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-monochrome);\n}\n\n:host(.ic-toggle-button-group-disabled.ic-toggle-button-group-monochrome) {\n  border: var(--ic-border-width) dashed\n    var(--ic-toggle-button-unselected-border-disabled-monochrome);\n}\n\n:host(.ic-toggle-button-group-disabled.ic-toggle-button-group-monochrome)\n  ::slotted(ic-toggle-button:not(:last-of-type)) {\n  border-right: var(--ic-border-width) solid\n    var(--ic-toggle-button-unselected-border-disabled-monochrome);\n}\n","import { Host, h, } from \"@stencil/core\";\nimport { removeDisabledFalse } from \"../../utils/helpers\";\nconst TOGGLE_GROUP = \"IC-TOGGLE-BUTTON-GROUP\";\nexport class ToggleButtonGroup {\n    constructor() {\n        this.keyListener = (ev) => {\n            this.lastKeyPressed = {\n                key: ev.key,\n                shift: ev.shiftKey,\n            };\n        };\n        this.setSlottedAria = (el) => {\n            const btn = el.shadowRoot\n                .querySelector(\"ic-button\")\n                .shadowRoot.querySelector(\"button\");\n            let aria = btn.getAttribute(\"aria-label\");\n            aria += \", \";\n            aria += this.accessibleLabel;\n            btn.setAttribute(\"aria-label\", aria);\n        };\n        this.handleHostFocus = (ev) => {\n            if (this.loading || this.disabled) {\n                return null;\n            }\n            const el = ev.target;\n            const relEl = ev.relatedTarget;\n            const toggleButtons = Array.from(el.querySelectorAll(\"ic-toggle-button\"));\n            if (((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                toggleButtons[0].focus();\n            }\n            else if (this.lastKeyPressed.shift === false ||\n                (this.lastKeyPressed.shift === true && relEl.tagName == TOGGLE_GROUP)) {\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        this.handleKeyDown = (event) => {\n            const toggleButtonOptions = this.getAllToggleButtons();\n            const focussedChild = toggleButtonOptions.indexOf(toggleButtonOptions.filter((el) => el === document.activeElement)[0]);\n            switch (event.key) {\n                case \"ArrowDown\":\n                case \"ArrowRight\":\n                    this.selectMethod === \"auto\"\n                        ? this.proxySelectHandler(toggleButtonOptions[this.getNextItemToSelect(focussedChild, true)])\n                        : toggleButtonOptions[this.getNextItemToSelect(focussedChild, true)].focus();\n                    break;\n                case \"ArrowUp\":\n                case \"ArrowLeft\":\n                    this.selectMethod === \"auto\"\n                        ? this.proxySelectHandler(toggleButtonOptions[this.getNextItemToSelect(focussedChild, false)])\n                        : toggleButtonOptions[this.getNextItemToSelect(focussedChild, false)].focus();\n                    break;\n                case \"Tab\":\n                    break;\n            }\n        };\n        this.getNextItemToSelect = (currentItem, movingDown) => {\n            const toggleButtonOptions = this.getAllToggleButtons();\n            const numToggles = toggleButtonOptions.length - 1;\n            if (currentItem < 1) {\n                currentItem = 0;\n            }\n            let nextItem = movingDown ? currentItem + 1 : currentItem - 1;\n            if (nextItem < 0) {\n                nextItem = numToggles;\n            }\n            else if (nextItem > numToggles) {\n                nextItem = 0;\n            }\n            if (toggleButtonOptions[nextItem].disabled) {\n                nextItem = this.getNextItemToSelect(nextItem, movingDown);\n            }\n            return nextItem;\n        };\n        this.lastKeyPressed = {\n            key: null,\n            shift: false,\n        };\n        this.accessibleLabel = \"Toggle button group\";\n        this.disabled = false;\n        this.fullWidth = false;\n        this.iconPlacement = undefined;\n        this.loading = false;\n        this.monochrome = false;\n        this.selectMethod = \"manual\";\n        this.selectType = \"single\";\n        this.size = \"medium\";\n        this.theme = \"inherit\";\n        this.variant = \"default\";\n    }\n    watchDisabledHandler() {\n        this.getAllToggleButtons().forEach((el) => {\n            el.disabled = this.disabled;\n        });\n        removeDisabledFalse(this.disabled, this.el);\n    }\n    watchMonochromeHandler() {\n        this.getAllToggleButtons().forEach((el) => {\n            el.monochrome = this.monochrome;\n        });\n    }\n    watchThemeHandler() {\n        this.getAllToggleButtons().forEach((el) => {\n            el.theme = this.theme;\n        });\n    }\n    selectHandler(ev, tabTarget) {\n        const allToggles = this.getAllToggleButtons();\n        let clickedToggle = ev.target;\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            this.icChange.emit({\n                checked: ev.detail.checked,\n                selectedOption: clickedToggle,\n            });\n        }\n        else {\n            const toggledOptions = this.getAllToggleButtons().filter((el) => el.checked && !el.disabled);\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    componentWillLoad() {\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    componentDidLoad() {\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    disconnectedCallback() {\n        document === null || document === void 0 ? void 0 : document.removeEventListener(\"keydown\", this.keyListener);\n    }\n    // trigger selectHandler when unable to add 'target'\n    proxySelectHandler(toggle) {\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    getAllToggleButtons() {\n        return Array.from(this.el.querySelectorAll(\"ic-toggle-button\"));\n    }\n    render() {\n        return (h(Host, { role: \"group\", \"aria-label\": this.accessibleLabel, \"aria-disabled\": this.disabled ? \"true\" : \"false\", tabindex: 0, 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            }, onFocus: this.handleHostFocus }, h(\"slot\", null)));\n    }\n    static get is() { return \"ic-toggle-button-group\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"ic-toggle-button-group.css\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"ic-toggle-button-group.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"accessibleLabel\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The accessible label of the toggle button group component to provide context for screen reader users.\"\n                },\n                \"attribute\": \"accessible-label\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"Toggle button group\\\"\"\n            },\n            \"disabled\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the toggle button group will be set to the disabled state.\"\n                },\n                \"attribute\": \"disabled\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"fullWidth\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the toggle button group will fill the width of the container.\"\n                },\n                \"attribute\": \"full-width\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"iconPlacement\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"\\\"left\\\" | \\\"right\\\" | \\\"top\\\"\",\n                    \"resolved\": \"\\\"left\\\" | \\\"right\\\" | \\\"top\\\"\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The placement of the icons in relation to the toggle button labels.\"\n                },\n                \"attribute\": \"icon-placement\",\n                \"reflect\": false\n            },\n            \"loading\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the toggle button group will be in loading state.\"\n                },\n                \"attribute\": \"loading\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"monochrome\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"If `true`, the toggle button group will display as black in the light theme, and white in dark theme.\"\n                },\n                \"attribute\": \"monochrome\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"selectMethod\": {\n                \"type\": \"string\",\n                \"mutable\": true,\n                \"complexType\": {\n                    \"original\": \"IcSelectMethodTypes\",\n                    \"resolved\": \"\\\"auto\\\" | \\\"manual\\\"\",\n                    \"references\": {\n                        \"IcSelectMethodTypes\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcSelectMethodTypes\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"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                \"attribute\": \"select-method\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"manual\\\"\"\n            },\n            \"selectType\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcSelectTypes\",\n                    \"resolved\": \"\\\"multi\\\" | \\\"single\\\"\",\n                    \"references\": {\n                        \"IcSelectTypes\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcSelectTypes\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Sets whether single or multiple options can be toggled. If `multi`, then the `selectMethod` is always `manual`.\"\n                },\n                \"attribute\": \"select-type\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"single\\\"\"\n            },\n            \"size\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcSizes\",\n                    \"resolved\": \"\\\"large\\\" | \\\"medium\\\" | \\\"small\\\"\",\n                    \"references\": {\n                        \"IcSizes\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcSizes\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The size of the toggle buttons to be displayed. This does not affect the font size of the accessible label.\"\n                },\n                \"attribute\": \"size\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"medium\\\"\"\n            },\n            \"theme\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"IcThemeMode\",\n                    \"resolved\": \"\\\"dark\\\" | \\\"inherit\\\" | \\\"light\\\"\",\n                    \"references\": {\n                        \"IcThemeMode\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../utils/types\",\n                            \"id\": \"src/utils/types.ts::IcThemeMode\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"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                \"attribute\": \"theme\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"inherit\\\"\"\n            },\n            \"variant\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"\\\"default\\\" | \\\"icon\\\"\",\n                    \"resolved\": \"\\\"default\\\" | \\\"icon\\\"\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The variant of the toggle button.\"\n                },\n                \"attribute\": \"variant\",\n                \"reflect\": true,\n                \"defaultValue\": \"\\\"default\\\"\"\n            }\n        };\n    }\n    static get states() {\n        return {\n            \"lastKeyPressed\": {}\n        };\n    }\n    static get events() {\n        return [{\n                \"method\": \"icChange\",\n                \"name\": \"icChange\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Emitted when a toggle button is selected.\"\n                },\n                \"complexType\": {\n                    \"original\": \"IcChangeEventDetail\",\n                    \"resolved\": \"IcChangeEventDetail\",\n                    \"references\": {\n                        \"IcChangeEventDetail\": {\n                            \"location\": \"import\",\n                            \"path\": \"./ic-toggle-button-group.types\",\n                            \"id\": \"src/components/ic-toggle-button-group/ic-toggle-button-group.types.ts::IcChangeEventDetail\"\n                        }\n                    }\n                }\n            }];\n    }\n    static get elementRef() { return \"el\"; }\n    static get watchers() {\n        return [{\n                \"propName\": \"disabled\",\n                \"methodName\": \"watchDisabledHandler\"\n            }, {\n                \"propName\": \"monochrome\",\n                \"methodName\": \"watchMonochromeHandler\"\n            }, {\n                \"propName\": \"theme\",\n                \"methodName\": \"watchThemeHandler\"\n            }];\n    }\n    static get listeners() {\n        return [{\n                \"name\": \"icToggleChecked\",\n                \"method\": \"selectHandler\",\n                \"target\": undefined,\n                \"capture\": false,\n                \"passive\": false\n            }];\n    }\n}\n//# sourceMappingURL=ic-toggle-button-group.js.map\n"],"version":3}