@genexus/genexus-ide-ui 0.0.98 → 0.0.100

package/dist/components/tabs.js.map

@@ -1 +1 @@
-{"file":"tabs.js","mappings":"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","names":[],"sources":["node_modules/@genexus/gemini/dist/collection/components/tabs/tabs.css?tag=gxg-tabs&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/tabs/tabs.js"],"sourcesContent":[":root {\n  --ui-animaton-speed: 0.2s;\n}\n\n/*ALIGNMENT*/\n/*Ellipsis*/\n/*****************************************************\nTYPOGRAPHY\n*****************************************************/\n/*Title 01 (Positive)*/\n.gxg-title-01 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n/*Title 01 (Negative)*/\n.gxg-title-01--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 02 (Positive)*/\n.gxg-title-02 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-02--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--color-on-primary);\n}\n\n/*Title 03*/\n.gxg-title-03 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-03--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 04*/\n.gxg-title-04 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-04--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 05*/\n.gxg-title-05 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-05--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Text*/\n.gxg-text {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-text--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n.gxg-text--gray {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--dimmed);\n}\n\n/*Quote*/\n.gxg-quote {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  font-style: italic;\n}\n\n.gxg-quote--negative {\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Link*/\n.gxg-link {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n}\n.gxg-link:hover {\n  color: var(--ds-base-font-color--link-hover);\n}\n.gxg-link:active {\n  color: var(--ds-base-font-color--link-active);\n}\n\n.gxg-link-gray {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n}\n.gxg-link-gray:hover {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n  filter: brightness(1.4);\n}\n\n/*Alerts*/\n.gxg-alert-error {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--error);\n  display: inline-block;\n}\n\n.gxg-alert-warning {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--warning);\n  display: inline-block;\n}\n\n.gxg-alert-success {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--success);\n  display: inline-block;\n}\n\n/*Tab*/\n.gxg-tab--disabled {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n.gxg-tab--disabled[disabled] {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n\n/*Label*/\n.gxg-label {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--gxg-label-font-weight);\n  font-size: var(--gxg-label-font-size);\n  color: var(--gxg-label-color);\n  text-align: center;\n  line-height: 1.455em;\n  display: flex;\n  align-items: center;\n}\n.gxg-label:hover {\n  color: var(--color-primary-hover);\n}\n.gxg-label:focus {\n  color: var(--color-primary-active);\n}\n.gxg-label:active {\n  color: var(--color-primary-active);\n}\n.gxg-label[disabled] {\n  color: var(--color-primary-disabled);\n}\n\n.gxg-label--negative {\n  color: var(--color-on-primary);\n}\n.gxg-label--negative[disabled] {\n  color: var(--color-on-disabled);\n}\n\n/*****************************************************\nGXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES\n*****************************************************/\n/*****************************************************\nFORM ELEMENTS\n*****************************************************/\n.gxg-scrollbar {\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gxg-scrollbar::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gxg-scrollbar::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gxg-scrollbar::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n:host {\n  display: block;\n  height: auto;\n  background: var(--color-background);\n  border-radius: var(--border-width-md);\n  box-shadow: var(--box-shadow-01);\n  position: relative;\n  font-family: var(--ds-base-font-family-primary);\n}\n\n.main-container {\n  height: 100%;\n  max-height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  border-width: var(--gxg-tabs-border-width);\n  border-style: solid;\n  border-color: var(--gxg-tabs-border-color);\n  border-radius: var(--gxg-tabs-border-radius);\n  overflow: hidden;\n}\n.main-container--no-border {\n  border: none;\n}\n\n.tabs-container {\n  height: 100%;\n  overflow-y: auto;\n}\n\n:host([position=left]) .tab-bar-container {\n  transform: rotate(-90deg) translate(-100%, 0);\n  transform-origin: left top;\n  position: absolute;\n  z-index: 10;\n}\n:host([position=left]) .tabs-container {\n  height: 100%;\n  width: calc(100% - 32px);\n  margin-left: 32px;\n}\n\n:host([position=right]) .tab-bar-container {\n  transform: rotate(-90deg) translate(-100%, 0);\n  transform-origin: left top;\n  position: absolute;\n  z-index: 10;\n  left: calc(100% - 32px);\n}\n:host([position=right]) .tabs-container {\n  height: 100%;\n  width: calc(100% - 32px);\n}","import { Host, h } from \"@stencil/core\";\nexport class GxgTabs {\n    constructor() {\n        this.position = \"top\";\n        this.height = \"100%\";\n        this.maxHeight = \"100%\";\n        this.minWidth = \"200px\";\n        this.tabBarBorder = false;\n        this.noBorder = false;\n        this.buttonsBorderAbove = false;\n        this.noBackground = false;\n        this.noPadding = false;\n        this.activeTab = \"\";\n    }\n    el;\n    tabActivatedHandler(event) {\n        event.stopPropagation();\n        this.updateActiveChildren(event.target.tab, \"gxg-tab-button\");\n        this.updateActiveChildren(event.target.tab, \"gxg-tab\");\n    }\n    componentWillLoad() {\n        this.configureTabs();\n    }\n    updateActiveChildren(activeTab, tagName) {\n        let children;\n        if (tagName === \"gxg-tab\") {\n            children = this.el.querySelectorAll(\":scope > gxg-tab\");\n        }\n        else if (tagName === \"gxg-tab-button\") {\n            const tabBar = this.el.querySelector(\":scope > gxg-tab-bar\");\n            children = tabBar.querySelectorAll(\":scope > gxg-tab-button\");\n        }\n        for (const child of children) {\n            child.isSelected = activeTab === child.tab;\n        }\n    }\n    configureTabs() {\n        const tabs = this.el.querySelectorAll(\"gxg-tab\");\n        if (this.noPadding) {\n            tabs.forEach(tab => {\n                tab.noPadding = true;\n            });\n        }\n        if (this.buttonsBorderAbove) {\n            const tabButtons = this.el.querySelectorAll(\"gxg-tab-button\");\n            tabButtons.forEach(tabButton => (tabButton.borderAbove = true));\n        }\n    }\n    async setActiveTab(tab) {\n        if (tab) {\n            const tabEl = this.getTab(tab);\n            if (!tabEl?.disabled) {\n                this.updateActiveChildren(tab, \"gxg-tab-button\");\n                this.updateActiveChildren(tab, \"gxg-tab\");\n            }\n        }\n    }\n    /**\n     * Sets the first tab that is not disabled and hidden as the active tab\n     */\n    async setFirstActiveTab() {\n        const allTabs = Array.from(this.el.querySelectorAll(\"gxg-tab-button\"));\n        const firstEnabledTab = allTabs.find(tab => !tab.hidden && !tab.disabled);\n        if (firstEnabledTab && firstEnabledTab.tab) {\n            this.updateActiveChildren(firstEnabledTab.tab, \"gxg-tab-button\");\n            this.updateActiveChildren(firstEnabledTab.tab, \"gxg-tab\");\n        }\n    }\n    getTab = (tab) => {\n        return this.el.querySelector(`gxg-tab-button[key=${tab}]`);\n    };\n    render() {\n        return (h(Host, { style: {\n                height: this.height,\n                maxHeight: this.maxHeight,\n                minWidth: this.minWidth\n            } }, h(\"div\", { class: {\n                \"main-container\": true,\n                \"main-container--no-border\": this.noBorder\n            } }, this.position === \"bottom\"\n            ? [\n                h(\"div\", { class: \"tabs-container\" }, h(\"slot\", null)),\n                h(\"div\", { class: \"tab-bar-container\" }, h(\"slot\", { name: \"tab-bar-container\" }))\n            ]\n            : [\n                h(\"div\", { class: \"tab-bar-container\" }, h(\"slot\", { name: \"tab-bar-container\" })),\n                h(\"div\", { class: \"tabs-container\" }, h(\"slot\", null))\n            ])));\n    }\n    static get is() { return \"gxg-tabs\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"tabs.scss\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"tabs.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"position\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"TabsPosition\",\n                    \"resolved\": \"\\\"bottom\\\" | \\\"left\\\" | \\\"right\\\" | \\\"top\\\"\",\n                    \"references\": {\n                        \"TabsPosition\": {\n                            \"location\": \"local\",\n                            \"path\": \"/home/circleci/repo/src/components/tabs/tabs.tsx\",\n                            \"id\": \"src/components/tabs/tabs.tsx::TabsPosition\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"position\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"top\\\"\"\n            },\n            \"height\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"height\",\n                \"reflect\": true,\n                \"defaultValue\": \"\\\"100%\\\"\"\n            },\n            \"maxHeight\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"max-height\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"100%\\\"\"\n            },\n            \"minWidth\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"min-width\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"200px\\\"\"\n            },\n            \"tabBarBorder\": {\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\": \"\"\n                },\n                \"attribute\": \"tab-bar-border\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"noBorder\": {\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\": \"\"\n                },\n                \"attribute\": \"no-border\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"buttonsBorderAbove\": {\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\": \"\"\n                },\n                \"attribute\": \"buttons-border-above\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"noBackground\": {\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\": \"The presence of this attribute removes the background color (only for mercury)\"\n                },\n                \"attribute\": \"no-background\",\n                \"reflect\": true,\n                \"defaultValue\": \"false\"\n            },\n            \"noPadding\": {\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\": \"The presence of this attribute removes each tab .container padding\"\n                },\n                \"attribute\": \"no-padding\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            }\n        };\n    }\n    static get states() {\n        return {\n            \"activeTab\": {}\n        };\n    }\n    static get methods() {\n        return {\n            \"setActiveTab\": {\n                \"complexType\": {\n                    \"signature\": \"(tab: string) => Promise<void>\",\n                    \"parameters\": [{\n                            \"name\": \"tab\",\n                            \"type\": \"string\",\n                            \"docs\": \"\"\n                        }],\n                    \"references\": {\n                        \"Promise\": {\n                            \"location\": \"global\",\n                            \"id\": \"global::Promise\"\n                        }\n                    },\n                    \"return\": \"Promise<void>\"\n                },\n                \"docs\": {\n                    \"text\": \"\",\n                    \"tags\": []\n                }\n            },\n            \"setFirstActiveTab\": {\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 the first tab that is not disabled and hidden as the active tab\",\n                    \"tags\": []\n                }\n            }\n        };\n    }\n    static get elementRef() { return \"el\"; }\n    static get listeners() {\n        return [{\n                \"name\": \"tabActivated\",\n                \"method\": \"tabActivatedHandler\",\n                \"target\": undefined,\n                \"capture\": false,\n                \"passive\": false\n            }];\n    }\n}\n//# sourceMappingURL=tabs.js.map\n"],"version":3}
+{"file":"tabs.js","mappings":"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","names":[],"sources":["node_modules/@genexus/gemini/dist/collection/components/tabs/tabs.css?tag=gxg-tabs&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/tabs/tabs.js"],"sourcesContent":[":root {\n  --ui-animaton-speed: 0.2s;\n}\n\n/*ALIGNMENT*/\n/*Ellipsis*/\n/*****************************************************\nTYPOGRAPHY\n*****************************************************/\n/*Title 01 (Positive)*/\n.gxg-title-01 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n/*Title 01 (Negative)*/\n.gxg-title-01--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-01-font-weight);\n  font-size: var(--ds-title-01-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 02 (Positive)*/\n.gxg-title-02 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-02--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-02-font-weight);\n  font-size: var(--ds-title-02-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--color-on-primary);\n}\n\n/*Title 03*/\n.gxg-title-03 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-03--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-03-font-weight);\n  font-size: var(--ds-title-03-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  text-transform: uppercase;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 04*/\n.gxg-title-04 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-04--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-04-font-weight);\n  font-size: var(--ds-title-04-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--comfortable);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Title 05*/\n.gxg-title-05 {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-title-05--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--ds-title-05-font-weight);\n  font-size: var(--ds-title-05-font-size);\n  letter-spacing: var(--ds-base-font-letter-spacing--regular);\n  color: var(--ds-base-font-color);\n  text-align: start;\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Text*/\n.gxg-text {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n}\n\n.gxg-text--negative {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--negative);\n}\n\n.gxg-text--gray {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--dimmed);\n}\n\n/*Quote*/\n.gxg-quote {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  font-style: italic;\n}\n\n.gxg-quote--negative {\n  color: var(--ds-base-font-color--negative);\n}\n\n/*Link*/\n.gxg-link {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n}\n.gxg-link:hover {\n  color: var(--ds-base-font-color--link-hover);\n}\n.gxg-link:active {\n  color: var(--ds-base-font-color--link-active);\n}\n\n.gxg-link-gray {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n}\n.gxg-link-gray:hover {\n  line-height: unset;\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--link);\n  text-decoration: underline;\n  cursor: pointer;\n  display: inline-block;\n  color: var(--ds-base-font-color--dimmed);\n  filter: brightness(1.4);\n}\n\n/*Alerts*/\n.gxg-alert-error {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--error);\n  display: inline-block;\n}\n\n.gxg-alert-warning {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--warning);\n  display: inline-block;\n}\n\n.gxg-alert-success {\n  font-family: var(--ds-base-font-family-primary);\n  font-size: var(--ds-base-font-size);\n  color: var(--ds-base-font-size-color);\n  font-weight: var(--ds-base-font-size-weight);\n  line-height: var(--ds-base-font-line-height--comfortable);\n  color: var(--ds-base-font-color--success);\n  display: inline-block;\n}\n\n/*Tab*/\n.gxg-tab--disabled {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n.gxg-tab--disabled[disabled] {\n  color: var(--color-primary-disabled);\n  pointer-events: none;\n}\n\n/*Label*/\n.gxg-label {\n  font-family: var(--ds-base-font-family-primary);\n  font-weight: var(--gxg-label-font-weight);\n  font-size: var(--gxg-label-font-size);\n  color: var(--gxg-label-color);\n  text-align: center;\n  line-height: 1.455em;\n  display: flex;\n  align-items: center;\n}\n.gxg-label:hover {\n  color: var(--color-primary-hover);\n}\n.gxg-label:focus {\n  color: var(--color-primary-active);\n}\n.gxg-label:active {\n  color: var(--color-primary-active);\n}\n.gxg-label[disabled] {\n  color: var(--color-primary-disabled);\n}\n\n.gxg-label--negative {\n  color: var(--color-on-primary);\n}\n.gxg-label--negative[disabled] {\n  color: var(--color-on-disabled);\n}\n\n/*****************************************************\nGXG-BUTTON and GXG-BUTTON-GROUP COMMON STYLES\n*****************************************************/\n/*****************************************************\nFORM ELEMENTS\n*****************************************************/\n.gxg-scrollbar {\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n.gxg-scrollbar::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n.gxg-scrollbar::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n.gxg-scrollbar::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n.gxg-scrollbar::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n\n:host {\n  display: block;\n  height: auto;\n  background: var(--color-background);\n  border-radius: var(--border-width-md);\n  box-shadow: var(--box-shadow-01);\n  position: relative;\n  font-family: var(--ds-base-font-family-primary);\n}\n\n.main-container {\n  height: 100%;\n  max-height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  border-width: var(--gxg-tabs-border-width);\n  border-style: solid;\n  border-color: var(--gxg-tabs-border-color);\n  border-radius: var(--gxg-tabs-border-radius);\n  overflow: hidden;\n}\n.main-container--no-border {\n  border: none;\n}\n\n.tabs-container {\n  height: 100%;\n  overflow-y: auto;\n}\n\n:host([position=left-rotated]) .main-container,\n:host([position=right-rotated]) .main-container {\n  flex-direction: row;\n}\n:host([position=left-rotated]) .tab-bar-container,\n:host([position=right-rotated]) .tab-bar-container {\n  height: 100%;\n  overflow: auto;\n  width: 40px;\n  position: relative;\n  /* Track */\n  /* Handle */\n  /* Handle on hover */\n}\n:host([position=left-rotated]) .tab-bar-container::-webkit-scrollbar,\n:host([position=right-rotated]) .tab-bar-container::-webkit-scrollbar {\n  width: var(--gxg-scrollbar-width);\n  height: var(--gxg-scrollbar-width);\n}\n:host([position=left-rotated]) .tab-bar-container::-webkit-scrollbar-track,\n:host([position=right-rotated]) .tab-bar-container::-webkit-scrollbar-track {\n  background-color: var(--gxg-scrollbar-track-background);\n  border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n:host([position=left-rotated]) .tab-bar-container::-webkit-scrollbar-thumb,\n:host([position=right-rotated]) .tab-bar-container::-webkit-scrollbar-thumb {\n  background-color: var(--gxg-scrollbar-track-thumb-background);\n  border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n:host([position=left-rotated]) .tab-bar-container::-webkit-scrollbar-thumb:hover,\n:host([position=right-rotated]) .tab-bar-container::-webkit-scrollbar-thumb:hover {\n  background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n:host([position=left-rotated]) .tab-bar-container::-webkit-scrollbar-corner,\n:host([position=right-rotated]) .tab-bar-container::-webkit-scrollbar-corner {\n  background: rgba(0, 0, 0, 0);\n}\n:host([position=left-rotated]) ::slotted(gxg-tab-bar),\n:host([position=right-rotated]) ::slotted(gxg-tab-bar) {\n  transform: rotate(-90deg) translate(-100%, 0);\n  transform-origin: left top;\n  position: absolute;\n  z-index: 10;\n}\n:host([position=left-rotated]) ::slotted(gxg-tab),\n:host([position=right-rotated]) ::slotted(gxg-tab) {\n  border-left-width: var(--gxg-tabs-border-width);\n  border-left-style: solid;\n  border-left-color: var(--gxg-tabs-border-color);\n}\n:host([position=left-rotated]) .tabs-container,\n:host([position=right-rotated]) .tabs-container {\n  width: calc(100% - 32px);\n}\n:host([position=left-rotated]) .main-container {\n  flex-direction: row;\n}\n\n:host([position=right-rotated]) .main-container {\n  flex-direction: row-reverse;\n}\n\n:host([position=left-stacked]) .main-container,\n:host([position=right-stacked]) .main-container {\n  flex-direction: row;\n}\n\n:host([position=left-stacked]) .main-container {\n  flex-direction: row;\n}\n\n:host([position=right-stacked]) .main-container {\n  flex-direction: row-reverse;\n}","import { Host, h } from \"@stencil/core\";\nexport class GxgTabs {\n    constructor() {\n        this.position = \"top\";\n        this.height = \"100%\";\n        this.maxHeight = \"100%\";\n        this.minWidth = \"200px\";\n        this.tabBarBorder = false;\n        this.noBorder = false;\n        this.buttonsBorderAbove = false;\n        this.noBackground = false;\n        this.noPadding = false;\n        this.reduced = false;\n        this.activeTab = undefined;\n    }\n    el;\n    watchActiveTabHandler(activeTab) {\n        if (activeTab?.length > 0) {\n            this.activateTab();\n        }\n    }\n    tabActivatedHandler(event) {\n        event.stopPropagation();\n        this.updateActiveChildren(event.target.tab, \"gxg-tab-button\");\n        this.updateActiveChildren(event.target.tab, \"gxg-tab\");\n    }\n    componentWillLoad() {\n        this.configureTabs();\n        this.evaluateReduced();\n        if (this.activeTab) {\n            this.activateTab();\n        }\n        this.evaluateStacked();\n    }\n    evaluateStacked = () => {\n        if (this.position === \"left-stacked\" || this.position === \"right-stacked\") {\n            //stacked tabBar\n            const tabBar = this.el.querySelector(\"gxg-tab-bar\");\n            if (tabBar) {\n                tabBar.stacked = this.position;\n            }\n            const tabButtons = this.el.querySelectorAll(\"gxg-tab-button\");\n            if (tabButtons) {\n                tabButtons.forEach(tabButton => {\n                    tabButton.stackedStyle = true;\n                });\n            }\n            //stacked buttons\n        }\n    };\n    evaluateReduced = () => {\n        if (this.reduced) {\n            //tab buttons\n            const gxgTabButtons = Array.from(this.el.querySelectorAll(\"gxg-tab-button\"));\n            gxgTabButtons.forEach(tabButton => {\n                tabButton.reduced = true;\n            });\n            //tabs\n            const gxgTabs = Array.from(this.el.querySelectorAll(\"gxg-tab\"));\n            gxgTabs.forEach(tab => {\n                tab.reduced = true;\n            });\n        }\n    };\n    updateActiveChildren(activeTab, tagName) {\n        let children;\n        if (tagName === \"gxg-tab\") {\n            children = this.el.querySelectorAll(\":scope > gxg-tab\");\n        }\n        else if (tagName === \"gxg-tab-button\") {\n            const tabBar = this.el.querySelector(\":scope > gxg-tab-bar\");\n            children = tabBar.querySelectorAll(\":scope > gxg-tab-button\");\n        }\n        for (const child of children) {\n            child.isSelected = activeTab === child.tab;\n        }\n    }\n    configureTabs() {\n        const tabs = this.el.querySelectorAll(\"gxg-tab\");\n        if (this.noPadding) {\n            tabs.forEach(tab => {\n                tab.noPadding = true;\n            });\n        }\n        if (this.buttonsBorderAbove) {\n            const tabButtons = this.el.querySelectorAll(\"gxg-tab-button\");\n            tabButtons.forEach(tabButton => (tabButton.borderAbove = true));\n        }\n    }\n    async setActiveTab(tab) {\n        if (tab) {\n            const tabEl = this.getTab(tab);\n            if (!tabEl?.disabled) {\n                this.updateActiveChildren(tab, \"gxg-tab-button\");\n                this.updateActiveChildren(tab, \"gxg-tab\");\n            }\n        }\n    }\n    /**\n     * Sets the first tab that is not disabled and hidden as the active tab\n     */\n    async setFirstActiveTab() {\n        const allTabs = Array.from(this.el.querySelectorAll(\"gxg-tab-button\"));\n        const firstEnabledTab = allTabs.find(tab => !tab.hidden && !tab.disabled);\n        if (firstEnabledTab && firstEnabledTab.tab) {\n            this.updateActiveChildren(firstEnabledTab.tab, \"gxg-tab-button\");\n            this.updateActiveChildren(firstEnabledTab.tab, \"gxg-tab\");\n        }\n    }\n    getTab = (tab) => {\n        return this.el.querySelector(`gxg-tab-button[key=${tab}]`);\n    };\n    activateTab = () => {\n        //buttons\n        const tabButtons = Array.from(this.el.querySelectorAll(\"gxg-tab-button\"));\n        tabButtons.forEach(tabButton => {\n            if (tabButton.tab !== this.activeTab) {\n                tabButton.isSelected = false;\n            }\n            else {\n                tabButton.isSelected = true;\n            }\n        });\n        //tabs\n        const tabs = Array.from(this.el.querySelectorAll(\"gxg-tab\"));\n        tabs.forEach(tab => {\n            if (tab.tab !== this.activeTab) {\n                tab.isSelected = false;\n            }\n            else {\n                tab.isSelected = true;\n            }\n        });\n    };\n    render() {\n        return (h(Host, { style: {\n                height: this.height,\n                maxHeight: this.maxHeight,\n                minWidth: this.minWidth\n            } }, h(\"div\", { class: {\n                \"main-container\": true,\n                \"main-container--no-border\": this.noBorder\n            } }, this.position === \"bottom\"\n            ? [\n                h(\"div\", { class: \"tabs-container\" }, h(\"slot\", null)),\n                h(\"div\", { class: \"tab-bar-container\" }, h(\"slot\", { name: \"tab-bar-container\" }))\n            ]\n            : [\n                h(\"div\", { class: \"tab-bar-container\" }, h(\"slot\", { name: \"tab-bar-container\" })),\n                h(\"div\", { class: \"tabs-container\" }, h(\"slot\", null))\n            ])));\n    }\n    static get is() { return \"gxg-tabs\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"tabs.scss\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"tabs.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"position\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"TabsPosition\",\n                    \"resolved\": \"\\\"bottom\\\" | \\\"left-rotated\\\" | \\\"left-stacked\\\" | \\\"right-rotated\\\" | \\\"right-stacked\\\" | \\\"top\\\"\",\n                    \"references\": {\n                        \"TabsPosition\": {\n                            \"location\": \"local\",\n                            \"path\": \"/home/circleci/repo/src/components/tabs/tabs.tsx\",\n                            \"id\": \"src/components/tabs/tabs.tsx::TabsPosition\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"position\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"top\\\"\"\n            },\n            \"height\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"height\",\n                \"reflect\": true,\n                \"defaultValue\": \"\\\"100%\\\"\"\n            },\n            \"maxHeight\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"max-height\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"100%\\\"\"\n            },\n            \"minWidth\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"\"\n                },\n                \"attribute\": \"min-width\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"200px\\\"\"\n            },\n            \"tabBarBorder\": {\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\": \"\"\n                },\n                \"attribute\": \"tab-bar-border\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"noBorder\": {\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\": \"\"\n                },\n                \"attribute\": \"no-border\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"buttonsBorderAbove\": {\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\": \"\"\n                },\n                \"attribute\": \"buttons-border-above\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"noBackground\": {\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\": \"The presence of this attribute removes the background color (only for mercury)\"\n                },\n                \"attribute\": \"no-background\",\n                \"reflect\": true,\n                \"defaultValue\": \"false\"\n            },\n            \"noPadding\": {\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\": \"The presence of this attribute removes each tab .container padding\"\n                },\n                \"attribute\": \"no-padding\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"reduced\": {\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\": \"The presence of this attribute will make buttons and tabs reduced, meaning that the font size and padding, will be smaller. Also, the icons in the buttons will not be displayed.\"\n                },\n                \"attribute\": \"reduced\",\n                \"reflect\": true,\n                \"defaultValue\": \"false\"\n            },\n            \"activeTab\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The actual active tab, and tab-button\"\n                },\n                \"attribute\": \"active-tab\",\n                \"reflect\": false\n            }\n        };\n    }\n    static get methods() {\n        return {\n            \"setActiveTab\": {\n                \"complexType\": {\n                    \"signature\": \"(tab: string) => Promise<void>\",\n                    \"parameters\": [{\n                            \"name\": \"tab\",\n                            \"type\": \"string\",\n                            \"docs\": \"\"\n                        }],\n                    \"references\": {\n                        \"Promise\": {\n                            \"location\": \"global\",\n                            \"id\": \"global::Promise\"\n                        }\n                    },\n                    \"return\": \"Promise<void>\"\n                },\n                \"docs\": {\n                    \"text\": \"\",\n                    \"tags\": []\n                }\n            },\n            \"setFirstActiveTab\": {\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 the first tab that is not disabled and hidden as the active tab\",\n                    \"tags\": []\n                }\n            }\n        };\n    }\n    static get elementRef() { return \"el\"; }\n    static get watchers() {\n        return [{\n                \"propName\": \"activeTab\",\n                \"methodName\": \"watchActiveTabHandler\"\n            }];\n    }\n    static get listeners() {\n        return [{\n                \"name\": \"tabActivated\",\n                \"method\": \"tabActivatedHandler\",\n                \"target\": undefined,\n                \"capture\": false,\n                \"passive\": false\n            }];\n    }\n}\n//# sourceMappingURL=tabs.js.map\n"],"version":3}

package/dist/esm/ch-icon_5.entry.js

@@ -475,10 +475,11 @@ const COLOR_MAPPINGS = {
     "primary-hover": "color-primary-hover",
     success: "ds-success-color--dark",
     warning: "ds-warning-color--dark",
-    mercury: "gray-03",
+    mercury: "mer-icon__primary",
     "mercury-primary": "mer-icon__primary",
     "mercury-on-primary": "mer-text__on-primary",
-    "mercury-text-on-message": "mer-text__on-message"
+    "mercury-text-on-message": "mer-text__on-message",
+    "mercury-neutral": "mer-icon__neutral"
 };
 const GxgIcon = class {
     constructor(hostRef) {