npm - @genexus/genexus-ide-ui - Versions diffs - 0.0.99 → 0.0.101 - Mend

@genexus/genexus-ide-ui 0.0.99 → 0.0.101

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

Files changed (404) hide show

package/dist/components/tab-bar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"tab-bar.js","mappings":"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","names":[],"sources":["node_modules/@genexus/gemini/dist/collection/components/tab-bar/tab-bar.css?tag=gxg-tab-bar&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/tab-bar/tab-bar.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 --tabBarMenuHeight: 0;\n --tabBarMenuWidth: 0;\n display: inline-flex;\n text-align: right;\n position: relative;\n display: flex;\n justify-content: space-between;\n}\n:host .nav {\n display: flex;\n justify-content: space-between;\n width: 100%;\n background-color: var(--gxg-tab-bar-background-color);\n}\n:host .nav--border {\n border-bottom: var(--ds-border-common-styles);\n}\n:host .tab-bar {\n list-style-type: none;\n padding-inline-start: 0;\n display: flex !important;\n margin-bottom: 0;\n margin-top: 0;\n}\n:host .tab-bar__menu {\n display: flex;\n align-items: center;\n}\n:host .tab-bar__menu-button {\n padding-right: 4px;\n transform: scale(0.9);\n}\n:host .tab-bar-menu {\n border-radius: var(--border-width-md);\n box-shadow: var(--box-shadow-01);\n height: var(--tabBarMenuHeight);\n position: absolute;\n z-index: 10;\n background-color: var(--color-on-primary);\n right: 0;\n margin: 0;\n padding: 0;\n list-style: none;\n display: inline-flex;\n flex-direction: column;\n overflow: hidden;\n transition-property: height;\n transition-duration: var(--ui-animaton-speed);\n transition-timing-function: ease;\n}\n:host .tab-bar-menu.bottom {\n bottom: 0;\n}\n:host .tab-bar-menu.right {\n bottom: 0;\n rotate: 90deg;\n transform-origin: top right;\n transform: translateX(100%);\n height: auto !important;\n width: var(--tabBarMenuHeight);\n}\n:host .tab-bar-menu--collapsed {\n height: 0;\n}\n:host .tab-bar-menu--collapsed.right {\n width: 0;\n}\n\n/Scrollable/\n:host([scrollable]) .nav {\n width: 100%;\n overflow-y: auto;\n / Track /\n / Handle /\n / Handle on hover /\n}\n:host([scrollable]) .nav::-webkit-scrollbar {\n width: var(--gxg-scrollbar-width);\n height: var(--gxg-scrollbar-width);\n}\n:host([scrollable]) .nav::-webkit-scrollbar-track {\n background-color: var(--gxg-scrollbar-track-background);\n border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n:host([scrollable]) .nav::-webkit-scrollbar-thumb {\n background-color: var(--gxg-scrollbar-track-thumb-background);\n border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n:host([scrollable]) .nav::-webkit-scrollbar-thumb:hover {\n background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n:host([scrollable]) .nav::-webkit-scrollbar-corner {\n background: rgba(0, 0, 0, 0);\n}\n\n:host(.gxg-tab-bar--hidden) {\n display: none;\n}\n\n:host(.rtl) .tab-bar-menu {\n left: 0;\n right: auto;\n}","import { h, Host } from \"@stencil/core\";\nimport state from \"../store\";\nimport { exportParts } from \"../../common/export-parts\";\nexport class GxgTabBar {\n parts = {\n buttonMenu: \"button-menu\"\n };\n exportparts;\n constructor() {\n this.hidden = false;\n this.appendedButtons = 0;\n this.tabBarMenuHeight = \"auto\";\n this.tabBarMenuWidth = \"auto\";\n this.tabBarMenuCollapsed = true;\n this.tabBarMenuPosition = undefined;\n this.displayBorder = false;\n this.scrollable = false;\n this.rtl = false;\n this.detectClickOutsideTabBarMenu =\n this.detectClickOutsideTabBarMenu.bind(this);\n }\n el;\n tabBar;\n tabBarMenu;\n tabBarMenuToggleButton;\n lastAddedOrRemovedTabBarButtonWidth = 0;\n openMenu(event) {\n event.stopPropagation();\n this.tabBarMenuCollapsed = false;\n document.addEventListener(\"click\", this.detectClickOutsideTabBarMenu);\n }\n tabBarMenuCollapsedHandler(menuCollapsed) {\n this.evaluateMenuButtonsTabIndex(menuCollapsed);\n this.setFocus(menuCollapsed);\n }\n evaluateMenuButtonsTabIndex = (menuCollapsed) => {\n if (menuCollapsed) {\n this.disableTabIndex();\n }\n else {\n this.enableTabIndex();\n }\n };\n setFocus = (menuCollapsed) => {\n if (menuCollapsed) {\n this.tabBarMenuToggleButton.focus();\n }\n else {\n const menuButtons = this.el.querySelectorAll(\"[slot=tab-menu]\");\n if (menuButtons.length) {\n menuButtons[0].focus();\n }\n }\n };\n async appendTabButtons() {\n if (!this.scrollable) {\n const numberOfButtons = this.el.querySelectorAll(\"gxg-tab-button\").length;\n for (let i = 0; i <= numberOfButtons; i++) {\n this.appendTabItemsToMenu();\n }\n }\n }\n tabActivatedHandler() {\n this.tabBarMenuCollapsed = true;\n }\n PrevOrNextTabHandler(e) {\n const tabEnabledButtons = [];\n const allTabButtons = this.el.querySelectorAll(\"gxg-tab-button\");\n if (allTabButtons) {\n allTabButtons.forEach(tabButton => {\n if (!tabButton.disabled && !tabButton.hidden) {\n tabEnabledButtons.push(tabButton);\n }\n });\n }\n const arrowPressed = e.detail[\"arrowPressed\"];\n const targetButton = e.target;\n const clickedButtonIndex = tabEnabledButtons.findIndex(button => {\n return button === targetButton;\n });\n let destinationTab;\n if (arrowPressed === \"ArrowLeft\" && clickedButtonIndex !== -1) {\n destinationTab = tabEnabledButtons[clickedButtonIndex - 1];\n }\n else if (arrowPressed === \"ArrowRight\" && clickedButtonIndex !== -1) {\n destinationTab = tabEnabledButtons[clickedButtonIndex + 1];\n }\n if (destinationTab) {\n destinationTab.tabButtonClick();\n }\n }\n appendTabItemsToMenu() {\n //This function appends tab-buttons into a tab-menu, as long as the tab-buttons are too tight\n const gxgTabsPosition = this.el.parentElement\n .position;\n const buttonHeight = this.el.children.item(0).clientHeight;\n let sizeReference;\n if (gxgTabsPosition === \"top\" \|\| gxgTabsPosition === \"bottom\") {\n sizeReference = this.el.parentElement.offsetWidth;\n }\n else if (gxgTabsPosition === \"right\" \|\| gxgTabsPosition === \"left\") {\n sizeReference = this.el.parentElement.offsetHeight;\n }\n const tabBarWidth = this.tabBar.offsetWidth;\n if (tabBarWidth + 20 > sizeReference) {\n const tabButtons = this.el.querySelectorAll(\"gxg-tab-button[slot='tab-bar']\");\n //get the last item of the nodeList\n const lastTabButton = tabButtons[tabButtons.length - 1];\n if (lastTabButton) {\n this.lastAddedOrRemovedTabBarButtonWidth = lastTabButton.offsetWidth;\n //add \"menu-button\" class to button component, in order to stylize the buttons inside the menu differently\n lastTabButton.classList.add(\"menu-button\");\n lastTabButton.setAttribute(\"slot\", \"tab-menu\");\n this.appendedButtons++;\n }\n //}\n }\n else if (tabBarWidth + 20 + this.lastAddedOrRemovedTabBarButtonWidth <\n sizeReference) {\n const menuButtons = this.el.querySelectorAll(\"[slot=tab-menu]\");\n const menuFirstButton = menuButtons[0];\n if (menuFirstButton) {\n menuFirstButton.classList.remove(\"menu-button\");\n menuFirstButton.setAttribute(\"slot\", \"tab-bar\");\n this.lastAddedOrRemovedTabBarButtonWidth = menuFirstButton.offsetWidth;\n this.appendedButtons--;\n }\n }\n if (gxgTabsPosition === \"right\" \|\| gxgTabsPosition === \"left\") {\n this.tabBarMenuHeight = this.appendedButtons buttonHeight + \"px\";\n }\n this.evaluateMenuButtonsTabIndex(this.tabBarMenuCollapsed);\n }\n componentWillLoad() {\n this.attachExportParts();\n }\n attachExportParts = () => {\n const part = this.el.getAttribute(\"part\");\n const exportPartsResult = exportParts(part, this.parts);\n exportPartsResult.length && (this.exportparts = exportPartsResult);\n };\n componentDidLoad() {\n //Reading Direction\n const dirHtml = document\n .getElementsByTagName(\"html\")[0]\n .getAttribute(\"dir\");\n const dirBody = document\n .getElementsByTagName(\"body\")[0]\n .getAttribute(\"dir\");\n if (dirHtml === \"rtl\" \|\| dirBody === \"rtl\") {\n this.rtl = true;\n }\n if (!this.scrollable) {\n const myObserver = new ResizeObserver(entries => {\n entries.forEach(() => {\n //get any button space between text and button border\n this.appendTabItemsToMenu();\n });\n });\n myObserver.observe(this.el.parentElement);\n //Collapse buttons if they dont't fit in the available space already\n const numberOfButtons = this.el.querySelectorAll(\"gxg-tab-button\").length;\n for (let i = 0; i <= numberOfButtons; i++) {\n this.appendTabItemsToMenu();\n }\n }\n //Tabbar menu on bottom\n const gxgTabsPosition = this.el.parentElement.getAttribute(\"position\");\n if (gxgTabsPosition === \"bottom\") {\n this.tabBarMenuPosition = \"bottom\";\n }\n //Tabbar menu on right\n if (gxgTabsPosition === \"right\") {\n this.tabBarMenuPosition = \"right\";\n }\n this.setIndexToTabButtons();\n }\n setIndexToTabButtons() {\n const tabButtons = this.el.querySelectorAll(\"gxg-tab-button\");\n tabButtons.forEach((tabButton, index) => {\n tabButton.setAttribute(\"data-index\", index.toString());\n });\n }\n renderTabBarMenu() {\n if (this.appendedButtons > 0) {\n return (h(\"div\", { class: \"tab-bar__menu\" }, h(\"gxg-button\", { class: \"tab-bar__menu-button\", onClick: this.openMenu.bind(this), type: \"tertiary\", icon: \"gemini-tools/show-more-vertical\", ref: el => (this.tabBarMenuToggleButton = el), part: this.parts.buttonMenu })));\n }\n }\n detectClickOutsideTabBarMenu(event) {\n const x = event.x;\n const y = event.y;\n //card main container coordinates\n const tabBarMenuClientRect = this.tabBarMenu.getBoundingClientRect();\n if (x > tabBarMenuClientRect.left &&\n x < tabBarMenuClientRect.right &&\n y > tabBarMenuClientRect.top &&\n y < tabBarMenuClientRect.bottom) {\n //Click happened inside the menu\n }\n else {\n //Click happened outside the menu\n this.tabBarMenuCollapsed = true;\n }\n }\n disconnectedCallback() {\n document.removeEventListener(\"click\", this.detectClickOutsideTabBarMenu);\n }\n enableTabIndex = () => {\n const allButtons = this.el.querySelectorAll(\"gxg-tab-button\");\n allButtons.forEach(button => {\n button.removeAttribute(\"tabindex\");\n });\n };\n disableTabIndex = () => {\n const menuButtons = this.el.querySelectorAll(\"[slot=tab-menu]\");\n menuButtons.forEach(button => {\n button.setAttribute(\"tabindex\", \"-1\");\n });\n };\n render() {\n return (h(Host, { class: {\n rtl: this.rtl,\n \"gxg-tab-bar\": true,\n \"gxg-tab-bar--hidden\": this.hidden,\n mercury: state.mercury\n }, exportParts: this.exportparts ? this.exportparts : null }, h(\"nav\", { class: {\n nav: true,\n \"nav--border\": this.displayBorder\n } }, h(\"ul\", { class: \"tab-bar\", ref: el => (this.tabBar = el) }, h(\"slot\", { name: \"tab-bar\" })), this.renderTabBarMenu(), h(\"ul\", { class: {\n \"tab-bar-menu\": true,\n \"tab-bar-menu--collapsed\": this.tabBarMenuCollapsed,\n top: this.tabBarMenuPosition === \"top\",\n right: this.tabBarMenuPosition === \"right\",\n bottom: this.tabBarMenuPosition === \"bottom\",\n left: this.tabBarMenuPosition === \"left\"\n }, style: {\n \"--tabBarMenuHeight\": this.tabBarMenuHeight,\n \"--tabBarMenuWidth\": this.tabBarMenuWidth\n }, ref: el => (this.tabBarMenu = el) }, h(\"slot\", { name: \"tab-menu\" })))));\n }\n static get is() { return \"gxg-tab-bar\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"tab-bar.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"tab-bar.css\"]\n };\n }\n static get properties() {\n return {\n \"hidden\": {\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\": \"Hides the tab-bar\"\n },\n \"attribute\": \"hidden\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"displayBorder\": {\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 displays a border-bottom line on the tab bar\"\n },\n \"attribute\": \"display-border\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"scrollable\": {\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 with display a scrollbar if the buttons total width is greater than the tab-bar width.\"\n },\n \"attribute\": \"scrollable\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n }\n };\n }\n static get states() {\n return {\n \"appendedButtons\": {},\n \"tabBarMenuHeight\": {},\n \"tabBarMenuWidth\": {},\n \"tabBarMenuCollapsed\": {},\n \"tabBarMenuPosition\": {},\n \"rtl\": {}\n };\n }\n static get methods() {\n return {\n \"appendTabButtons\": {\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\": \"\",\n \"tags\": []\n }\n }\n };\n }\n static get elementRef() { return \"el\"; }\n static get watchers() {\n return [{\n \"propName\": \"tabBarMenuCollapsed\",\n \"methodName\": \"tabBarMenuCollapsedHandler\"\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 \"name\": \"PrevOrNextTab\",\n \"method\": \"PrevOrNextTabHandler\",\n \"target\": undefined,\n \"capture\": false,\n \"passive\": false\n }];\n }\n}\n//# sourceMappingURL=tab-bar.js.map\n"],"version":3}
1	+ {"file":"tab-bar.js","mappings":"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","names":[],"sources":["node_modules/@genexus/gemini/dist/collection/components/tab-bar/tab-bar.css?tag=gxg-tab-bar&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/tab-bar/tab-bar.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 --tabBarMenuHeight: 0;\n --tabBarMenuWidth: 0;\n display: inline-flex;\n text-align: right;\n position: relative;\n display: flex;\n justify-content: space-between;\n}\n:host .nav {\n display: flex;\n justify-content: space-between;\n width: 100%;\n background-color: var(--gxg-tab-bar-background-color);\n}\n:host .nav--border {\n border-bottom: var(--ds-border-common-styles);\n}\n:host .tab-bar {\n list-style-type: none;\n padding-inline-start: 0;\n display: flex !important;\n margin-bottom: 0;\n margin-top: 0;\n}\n:host .tab-bar__menu {\n display: flex;\n align-items: center;\n}\n:host .tab-bar__menu-button {\n padding-right: 4px;\n transform: scale(0.9);\n}\n:host .tab-bar-menu {\n border-radius: var(--border-width-md);\n box-shadow: var(--box-shadow-01);\n height: var(--tabBarMenuHeight);\n position: absolute;\n z-index: 10;\n background-color: var(--color-on-primary);\n right: 0;\n margin: 0;\n padding: 0;\n list-style: none;\n display: inline-flex;\n flex-direction: column;\n overflow: hidden;\n transition-property: height;\n transition-duration: var(--ui-animaton-speed);\n transition-timing-function: ease;\n}\n:host .tab-bar-menu.bottom {\n bottom: 0;\n}\n:host .tab-bar-menu.right {\n bottom: 0;\n rotate: 90deg;\n transform-origin: top right;\n transform: translateX(100%);\n height: auto !important;\n width: var(--tabBarMenuHeight);\n}\n:host .tab-bar-menu--collapsed {\n height: 0;\n}\n:host .tab-bar-menu--collapsed.right {\n width: 0;\n}\n\n/Stacked/\n:host(.gxg-tab-bar--left-stacked),\n:host(.gxg-tab-bar--right-stacked) {\n height: 100%;\n}\n:host(.gxg-tab-bar--left-stacked) .tab-bar,\n:host(.gxg-tab-bar--right-stacked) .tab-bar {\n flex-direction: column;\n}\n\n:host(.gxg-tab-bar--left-stacked) {\n border-inline-end: var(--ds-border-common-styles);\n}\n\n:host(.gxg-tab-bar--right-stacked) {\n border-inline-start: var(--ds-border-common-styles);\n}\n\n/Scrollable/\n:host([scrollable]) .nav {\n width: 100%;\n overflow-y: auto;\n / Track /\n / Handle /\n / Handle on hover /\n}\n:host([scrollable]) .nav::-webkit-scrollbar {\n width: var(--gxg-scrollbar-width);\n height: var(--gxg-scrollbar-width);\n}\n:host([scrollable]) .nav::-webkit-scrollbar-track {\n background-color: var(--gxg-scrollbar-track-background);\n border-radius: var(--gxg-scrollbar-track-border-radius);\n}\n:host([scrollable]) .nav::-webkit-scrollbar-thumb {\n background-color: var(--gxg-scrollbar-track-thumb-background);\n border-radius: var(--gxg-scrollbar-track-thumb-radius);\n}\n:host([scrollable]) .nav::-webkit-scrollbar-thumb:hover {\n background-color: var(--gxg-scrollbar-track-thumb-hover-background);\n}\n:host([scrollable]) .nav::-webkit-scrollbar-corner {\n background: rgba(0, 0, 0, 0);\n}\n\n:host(.gxg-tab-bar--hidden) {\n display: none;\n}\n\n:host(.rtl) .tab-bar-menu {\n left: 0;\n right: auto;\n}","import { h, Host } from \"@stencil/core\";\nimport state from \"../store\";\nimport { exportParts } from \"../../common/export-parts\";\nexport class GxgTabBar {\n parts = {\n buttonMenu: \"button-menu\"\n };\n exportparts;\n constructor() {\n this.hidden = false;\n this.appendedButtons = 0;\n this.tabBarMenuHeight = \"auto\";\n this.tabBarMenuWidth = \"auto\";\n this.tabBarMenuCollapsed = true;\n this.tabBarMenuPosition = undefined;\n this.displayBorder = false;\n this.scrollable = false;\n this.stacked = null;\n this.rtl = false;\n this.detectClickOutsideTabBarMenu =\n this.detectClickOutsideTabBarMenu.bind(this);\n }\n el;\n tabBar;\n tabBarMenu;\n tabBarMenuToggleButton;\n lastAddedOrRemovedTabBarButtonWidth = 0;\n openMenu(event) {\n event.stopPropagation();\n this.tabBarMenuCollapsed = false;\n document.addEventListener(\"click\", this.detectClickOutsideTabBarMenu);\n }\n tabBarMenuCollapsedHandler(menuCollapsed) {\n this.evaluateMenuButtonsTabIndex(menuCollapsed);\n this.setFocus(menuCollapsed);\n }\n evaluateMenuButtonsTabIndex = (menuCollapsed) => {\n if (menuCollapsed) {\n this.disableTabIndex();\n }\n else {\n this.enableTabIndex();\n }\n };\n setFocus = (menuCollapsed) => {\n if (menuCollapsed) {\n this.tabBarMenuToggleButton.focus();\n }\n else {\n const menuButtons = this.el.querySelectorAll(\"[slot=tab-menu]\");\n if (menuButtons.length) {\n menuButtons[0].focus();\n }\n }\n };\n async appendTabButtons() {\n if (!this.scrollable) {\n const numberOfButtons = this.el.querySelectorAll(\"gxg-tab-button\").length;\n for (let i = 0; i <= numberOfButtons; i++) {\n this.appendTabItemsToMenu();\n }\n }\n }\n tabActivatedHandler() {\n this.tabBarMenuCollapsed = true;\n }\n PrevOrNextTabHandler(e) {\n const tabEnabledButtons = [];\n const allTabButtons = this.el.querySelectorAll(\"gxg-tab-button\");\n if (allTabButtons) {\n allTabButtons.forEach(tabButton => {\n if (!tabButton.disabled && !tabButton.hidden) {\n tabEnabledButtons.push(tabButton);\n }\n });\n }\n const arrowPressed = e.detail[\"arrowPressed\"];\n const targetButton = e.target;\n const clickedButtonIndex = tabEnabledButtons.findIndex(button => {\n return button === targetButton;\n });\n let destinationTab;\n if (arrowPressed === \"ArrowLeft\" && clickedButtonIndex !== -1) {\n destinationTab = tabEnabledButtons[clickedButtonIndex - 1];\n }\n else if (arrowPressed === \"ArrowRight\" && clickedButtonIndex !== -1) {\n destinationTab = tabEnabledButtons[clickedButtonIndex + 1];\n }\n if (destinationTab) {\n destinationTab.tabButtonClick();\n }\n }\n appendTabItemsToMenu() {\n //This function appends tab-buttons into a tab-menu, as long as the tab-buttons are too tight\n const gxgTabsPosition = this.el.parentElement\n .position;\n const buttonHeight = this.el.children.item(0).clientHeight;\n let sizeReference;\n if (gxgTabsPosition === \"top\" \|\| gxgTabsPosition === \"bottom\") {\n sizeReference = this.el.parentElement.offsetWidth;\n }\n else if (gxgTabsPosition === \"right-rotated\" \|\|\n gxgTabsPosition === \"left-rotated\") {\n sizeReference = this.el.parentElement.offsetHeight;\n }\n const tabBarWidth = this.tabBar.offsetWidth;\n if (tabBarWidth + 20 > sizeReference) {\n const tabButtons = this.el.querySelectorAll(\"gxg-tab-button[slot='tab-bar']\");\n //get the last item of the nodeList\n const lastTabButton = tabButtons[tabButtons.length - 1];\n if (lastTabButton) {\n this.lastAddedOrRemovedTabBarButtonWidth = lastTabButton.offsetWidth;\n //add \"menu-button\" class to button component, in order to stylize the buttons inside the menu differently\n lastTabButton.classList.add(\"menu-button\");\n lastTabButton.setAttribute(\"slot\", \"tab-menu\");\n this.appendedButtons++;\n }\n //}\n }\n else if (tabBarWidth + 20 + this.lastAddedOrRemovedTabBarButtonWidth <\n sizeReference) {\n const menuButtons = this.el.querySelectorAll(\"[slot=tab-menu]\");\n const menuFirstButton = menuButtons[0];\n if (menuFirstButton) {\n menuFirstButton.classList.remove(\"menu-button\");\n menuFirstButton.setAttribute(\"slot\", \"tab-bar\");\n this.lastAddedOrRemovedTabBarButtonWidth = menuFirstButton.offsetWidth;\n this.appendedButtons--;\n }\n }\n if (gxgTabsPosition === \"right-rotated\" \|\|\n gxgTabsPosition === \"left-rotated\") {\n this.tabBarMenuHeight = this.appendedButtons buttonHeight + \"px\";\n }\n this.evaluateMenuButtonsTabIndex(this.tabBarMenuCollapsed);\n }\n componentWillLoad() {\n this.attachExportParts();\n }\n attachExportParts = () => {\n const part = this.el.getAttribute(\"part\");\n const exportPartsResult = exportParts(part, this.parts);\n exportPartsResult.length && (this.exportparts = exportPartsResult);\n };\n componentDidLoad() {\n //Reading Direction\n const dirHtml = document\n .getElementsByTagName(\"html\")[0]\n .getAttribute(\"dir\");\n const dirBody = document\n .getElementsByTagName(\"body\")[0]\n .getAttribute(\"dir\");\n if (dirHtml === \"rtl\" \|\| dirBody === \"rtl\") {\n this.rtl = true;\n }\n if (!this.scrollable) {\n const myObserver = new ResizeObserver(entries => {\n entries.forEach(() => {\n //get any button space between text and button border\n this.appendTabItemsToMenu();\n });\n });\n myObserver.observe(this.el.parentElement);\n //Collapse buttons if they dont't fit in the available space already\n const numberOfButtons = this.el.querySelectorAll(\"gxg-tab-button\").length;\n for (let i = 0; i <= numberOfButtons; i++) {\n this.appendTabItemsToMenu();\n }\n }\n //Tabbar menu on bottom\n const gxgTabsPosition = this.el.parentElement.getAttribute(\"position\");\n if (gxgTabsPosition === \"bottom\") {\n this.tabBarMenuPosition = \"bottom\";\n }\n //Tabbar menu on right\n if (gxgTabsPosition === \"right-rotated\") {\n this.tabBarMenuPosition = \"right-rotated\";\n }\n this.setIndexToTabButtons();\n }\n setIndexToTabButtons() {\n const tabButtons = this.el.querySelectorAll(\"gxg-tab-button\");\n tabButtons.forEach((tabButton, index) => {\n tabButton.setAttribute(\"data-index\", index.toString());\n });\n }\n renderTabBarMenu() {\n if (this.appendedButtons > 0) {\n return (h(\"div\", { class: \"tab-bar__menu\" }, h(\"gxg-button\", { class: \"tab-bar__menu-button\", onClick: this.openMenu.bind(this), type: \"tertiary\", icon: \"gemini-tools/show-more-vertical\", ref: el => (this.tabBarMenuToggleButton = el), part: this.parts.buttonMenu })));\n }\n }\n detectClickOutsideTabBarMenu(event) {\n const x = event.x;\n const y = event.y;\n //card main container coordinates\n const tabBarMenuClientRect = this.tabBarMenu.getBoundingClientRect();\n if (x > tabBarMenuClientRect.left &&\n x < tabBarMenuClientRect.right &&\n y > tabBarMenuClientRect.top &&\n y < tabBarMenuClientRect.bottom) {\n //Click happened inside the menu\n }\n else {\n //Click happened outside the menu\n this.tabBarMenuCollapsed = true;\n }\n }\n disconnectedCallback() {\n document.removeEventListener(\"click\", this.detectClickOutsideTabBarMenu);\n }\n enableTabIndex = () => {\n const allButtons = this.el.querySelectorAll(\"gxg-tab-button\");\n allButtons.forEach(button => {\n button.removeAttribute(\"tabindex\");\n });\n };\n disableTabIndex = () => {\n const menuButtons = this.el.querySelectorAll(\"[slot=tab-menu]\");\n menuButtons.forEach(button => {\n button.setAttribute(\"tabindex\", \"-1\");\n });\n };\n render() {\n return (h(Host, { class: {\n rtl: this.rtl,\n \"gxg-tab-bar\": true,\n \"gxg-tab-bar--hidden\": this.hidden,\n \"gxg-tab-bar--left-stacked\": this.stacked === \"left-stacked\",\n \"gxg-tab-bar--right-stacked\": this.stacked === \"right-stacked\",\n mercury: state.mercury\n }, exportParts: this.exportparts ? this.exportparts : null }, h(\"nav\", { class: {\n nav: true,\n \"nav--border\": this.displayBorder && this.stacked === null\n } }, h(\"ul\", { class: {\n \"tab-bar\": true\n }, ref: el => (this.tabBar = el) }, h(\"slot\", { name: \"tab-bar\" })), this.renderTabBarMenu(), h(\"ul\", { class: {\n \"tab-bar-menu\": true,\n \"tab-bar-menu--collapsed\": this.tabBarMenuCollapsed,\n top: this.tabBarMenuPosition === \"top\",\n right: this.tabBarMenuPosition === \"right-rotated\",\n bottom: this.tabBarMenuPosition === \"bottom\",\n left: this.tabBarMenuPosition === \"left-rotated\"\n }, style: {\n \"--tabBarMenuHeight\": this.tabBarMenuHeight,\n \"--tabBarMenuWidth\": this.tabBarMenuWidth\n }, ref: el => (this.tabBarMenu = el) }, h(\"slot\", { name: \"tab-menu\" })))));\n }\n static get is() { return \"gxg-tab-bar\"; }\n static get encapsulation() { return \"shadow\"; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"tab-bar.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"tab-bar.css\"]\n };\n }\n static get properties() {\n return {\n \"hidden\": {\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\": \"Hides the tab-bar\"\n },\n \"attribute\": \"hidden\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"displayBorder\": {\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 displays a border-bottom line on the tab bar\"\n },\n \"attribute\": \"display-border\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"scrollable\": {\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 with display a scrollbar if the buttons total width is greater than the tab-bar width.\"\n },\n \"attribute\": \"scrollable\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"stacked\": {\n \"type\": \"string\",\n \"mutable\": false,\n \"complexType\": {\n \"original\": \"TabsStackedPosition\",\n \"resolved\": \"\\\"left-stacked\\\" \| \\\"right-stacked\\\"\",\n \"references\": {\n \"TabsStackedPosition\": {\n \"location\": \"local\",\n \"path\": \"/home/circleci/repo/src/components/tab-bar/tab-bar.tsx\",\n \"id\": \"src/components/tab-bar/tab-bar.tsx::TabsStackedPosition\"\n }\n }\n },\n \"required\": false,\n \"optional\": false,\n \"docs\": {\n \"tags\": [],\n \"text\": \"If true the buttons will be stacked on each other, instead of inline. (used for \\\"position:left-stacked\\\", or \\\"position:right-stacked\\\" on gxg-tabs)\"\n },\n \"attribute\": \"stacked\",\n \"reflect\": false,\n \"defaultValue\": \"null\"\n }\n };\n }\n static get states() {\n return {\n \"appendedButtons\": {},\n \"tabBarMenuHeight\": {},\n \"tabBarMenuWidth\": {},\n \"tabBarMenuCollapsed\": {},\n \"tabBarMenuPosition\": {},\n \"rtl\": {}\n };\n }\n static get methods() {\n return {\n \"appendTabButtons\": {\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\": \"\",\n \"tags\": []\n }\n }\n };\n }\n static get elementRef() { return \"el\"; }\n static get watchers() {\n return [{\n \"propName\": \"tabBarMenuCollapsed\",\n \"methodName\": \"tabBarMenuCollapsedHandler\"\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 \"name\": \"PrevOrNextTab\",\n \"method\": \"PrevOrNextTabHandler\",\n \"target\": undefined,\n \"capture\": false,\n \"passive\": false\n }];\n }\n}\n//# sourceMappingURL=tab-bar.js.map\n"],"version":3}

package/dist/components/tab-button.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { e as exportParts } from './export-parts.js';
 import { d as defineCustomElement$2 } from './icon.js';
 import { d as defineCustomElement$1 } from './icon2.js';
-const tabButtonCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host{display:block;align-self:center !important;line-height:0}:host .tab-button{display:flex;align-items:center;justify-content:center;font-size:var(--gxg-tab-button-font-size);font-weight:var(--gxg-tab-button-font-weight);font-family:inherit;text-transform:var(--gxg-tab-button-font-text-transform);color:var(--gxg-tab-button-color);letter-spacing:var(--letter-spacing-regular);padding-top:0;padding-inline-end:var(--gxg-tab-button-horizontal-padding);padding-bottom:0;padding-inline-start:var(--gxg-tab-button-horizontal-padding);margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;border:0;width:100%;height:var(--gxg-tab-button-height);position:relative;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background-color:transparent}:host .tab-button:focus-visible{outline:var(--ds-focus-border-width) solid var(--ds-border-color-control--focused);outline-offset:-1px;outline-offset:-2px}:host .tab-button:after{content:\"\";width:100%;height:var(--gxg-tab-button-line-height);left:0;bottom:0;position:absolute;background-color:transparent}:host .tab-button:hover{cursor:pointer}:host .tab-button:hover:focus-visible{outline-color:var(--gxg-tab-button-line-background-color-hover)}:host .tab-button:hover:after{background-color:var(--gxg-tab-button-line-background-color-hover)}:host .tab-button:active:focus-visible{outline-color:var(--gxg-tab-button-line-background-color-active)}:host .tab-button:active:after{background-color:var(--gxg-tab-button-line-background-color-active)}:host .tab-button[disabled]{color:var(--ds-color-disabled);pointer-events:none}:host .tab-button[disabled]:after{background-color:var(--ds-background-color-disabled)}:host .tab-button[disabled] gxg-icon{--gxg-icon-color:var(--ds-icon-color-disabled)}:host .tab-button--selected{color:var(--gxg-tab-button-color--selected);font-weight:var(--gxg-tab-button-font-weight-selected)}:host .tab-button--selected:after{background-color:var(--gxg-tab-button-line-background-color)}:host .tab-button--text-icon gxg-icon{margin-right:var(--spacing-comp-02)}:host .tab-button--hidden{display:none}:host .tab-button--border-above:after{top:0;bottom:auto}:host .tab-button gxg-icon{--gxg-icon-color:var(--gxg-tab-button-icon-color)}:host .tab-button__text{display:inline-block}:host([slot=tab-menu]) .tab-button{padding-left:0;padding-right:0}:host(.menu-button){width:100%;box-sizing:border-box}:host(.menu-button) .tab-button{padding:0 var(--gxg-tab-menu-button-padding);min-height:calc(var(--gxg-tab-menu-button-min-height) * 0.85);justify-content:flex-start}:host(.menu-button) .tab-button:after{display:none}:host(.menu-button) .tab-button__text{font-size:var(--gxg-tab-menu-button-font-size)}:host(.menu-button) gxg-icon{transform:scale(0.85)}:host(.menu-button:hover){background:var(--ds-item-background-color--hover)}";
+const tabButtonCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host{display:block;align-self:center !important;line-height:0}:host .tab-button{display:flex;align-items:center;justify-content:center;font-size:var(--gxg-tab-button-font-size);font-weight:var(--gxg-tab-button-font-weight);font-family:inherit;text-transform:var(--gxg-tab-button-font-text-transform);color:var(--gxg-tab-button-color);letter-spacing:var(--letter-spacing-regular);padding-top:0;padding-inline-end:var(--gxg-tab-button-horizontal-padding);padding-bottom:0;padding-inline-start:var(--gxg-tab-button-horizontal-padding);margin-top:0;margin-right:0;margin-bottom:0;margin-left:0;border:0;width:100%;height:var(--gxg-tab-button-height);position:relative;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;background-color:transparent;}:host .tab-button:focus-visible{outline:var(--ds-focus-border-width) solid var(--ds-border-color-control--focused);outline-offset:-1px;outline-offset:-2px}:host .tab-button:after{content:\"\";width:100%;height:var(--gxg-tab-button-line-height);left:0;bottom:0;position:absolute;background-color:transparent}:host .tab-button:hover{cursor:pointer}:host .tab-button:hover:focus-visible{outline-color:var(--gxg-tab-button-line-background-color-hover)}:host .tab-button:hover:after{background-color:var(--gxg-tab-button-line-background-color-hover)}:host .tab-button:active:focus-visible{outline-color:var(--gxg-tab-button-line-background-color-active)}:host .tab-button:active:after{background-color:var(--gxg-tab-button-line-background-color-active)}:host .tab-button[disabled]{color:var(--ds-color-disabled);pointer-events:none}:host .tab-button[disabled]:after{background-color:var(--ds-background-color-disabled)}:host .tab-button[disabled] gxg-icon{--gxg-icon-color:var(--ds-icon-color-disabled)}:host .tab-button--selected{color:var(--gxg-tab-button-color--selected);font-weight:var(--gxg-tab-button-font-weight-selected)}:host .tab-button--selected:after{background-color:var(--gxg-tab-button-line-background-color)}:host .tab-button--text-icon gxg-icon{margin-right:var(--spacing-comp-02)}:host .tab-button--hidden{display:none}:host .tab-button--border-above:after{top:0;bottom:auto}:host .tab-button gxg-icon{--gxg-icon-color:var(--gxg-tab-button-icon-color)}:host .tab-button--reduced{padding-inline-end:var(--gxg-tab-button-horizontal-padding--reduced);padding-inline-start:var(--gxg-tab-button-horizontal-padding--reduced);font-size:var(--gxg-tab-button-font-size--reduced);height:var(--gxg-tab-button-height--reduced)}:host .tab-button--stacked-style{justify-content:flex-start}:host .tab-button--stacked-style.tab-button--text-icon{padding-inline-start:var(--gxg-tab-button-horizontal-padding--stacked)}:host .tab-button__text{display:inline-block}:host(.stacked){width:100%}:host([slot=tab-menu]) .tab-button{padding-left:0;padding-right:0}:host(.menu-button){width:100%;box-sizing:border-box}:host(.menu-button) .tab-button{padding:0 var(--gxg-tab-menu-button-padding);min-height:calc(var(--gxg-tab-menu-button-min-height) * 0.85);justify-content:flex-start}:host(.menu-button) .tab-button:after{display:none}:host(.menu-button) .tab-button__text{font-size:var(--gxg-tab-menu-button-font-size)}:host(.menu-button) gxg-icon{transform:scale(0.85)}:host(.menu-button:hover){background:var(--ds-item-background-color--hover)}";
 const GxgTabButton = /*@__PURE__*/ proxyCustomElement(class GxgTabButton extends HTMLElement {
     constructor() {
@@ -28,6 +28,8 @@ const GxgTabButton = /*@__PURE__*/ proxyCustomElement(class GxgTabButton extends
         this.disabled = false;
         this.icon = null;
         this.borderAbove = false;
+        this.stackedStyle = false;
+        this.reduced = false;
     }
     get el() { return this; }
     async tabButtonClick() {
@@ -90,15 +92,18 @@ const GxgTabButton = /*@__PURE__*/ proxyCustomElement(class GxgTabButton extends
     render() {
         return (h(Host, { class: {
                 large: state.large,
-                mercury: state.mercury
+                mercury: state.mercury,
+                stacked: this.stackedStyle
             }, exportParts: this.exportparts ? this.exportparts : null }, h("li", { class: "tab-item" }, h("button", { disabled: this.disabled, class: {
                 "tab-button": true,
                 "tab-button--hidden": this.hidden,
                 "tab-button--selected": this.isSelected === true,
                 "tab-button--text-icon": this.tabLabel !== null && this.icon !== null,
                 large: state.large,
-                "tab-button--border-above": this.borderAbove
-            }, onClick: this.buttonClickHandler.bind(this), onKeyDown: this.buttonKeyDownHandler.bind(this), ref: el => (this.tabButton = el), part: this.parts.button }, this.printIcon(), h("span", { class: "tab-button__text", part: "button-text" }, this.tabLabel)), h("slot", null))));
+                "tab-button--border-above": this.borderAbove,
+                "tab-button--reduced": this.reduced,
+                "tab-button--stacked-style": this.stackedStyle
+            }, onClick: this.buttonClickHandler.bind(this), onKeyDown: this.buttonKeyDownHandler.bind(this), ref: el => (this.tabButton = el), part: this.parts.button }, !this.reduced && this.printIcon(), h("span", { class: "tab-button__text", part: "button-text" }, this.tabLabel)), h("slot", null))));
     }
     static get delegatesFocus() { return true; }
     static get watchers() { return {
@@ -114,6 +119,8 @@ const GxgTabButton = /*@__PURE__*/ proxyCustomElement(class GxgTabButton extends
         "disabled": [4],
         "icon": [1],
         "borderAbove": [516, "border-above"],
+        "stackedStyle": [4, "stacked-style"],
+        "reduced": [4],
         "tabButtonClick": [64]
     }, undefined, {
         "isSelected": ["isSelectedHandler"],

package/dist/components/tab-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"tab-button.js","mappings":";;;;;;AAAA,MAAM,YAAY,GAAG,ipVAAipV;;MCGzpV,YAAY;IACrB;QASA,UAAK,GAAG;YACJ,MAAM,EAAE,QAAQ;SACnB,CAAC;QA0DF,sBAAiB,GAAG;YAChB,MAAM,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;YAC1C,MAAM,iBAAiB,GAAG,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;YACxD,iBAAiB,CAAC,MAAM,KAAK,IAAI,CAAC,WAAW,GAAG,iBAAiB,CAAC,CAAC;SACtE,CAAC;;;;;;QAxEE,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACpB,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrB,IAAI,CAAC,GAAG,GAAG,IAAI,CAAC;QAChB,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,QAAQ,GAAG,KAAK,CAAC;QACtB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,WAAW,GAAG,KAAK,CAAC;KAC5B;;IAUD,MAAM,cAAc;QAChB,IAAI,CAAC,kBAAkB,EAAE,CAAC;QAC1B,IAAI,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC;KAC1B;IACD,iBAAiB,CAAC,QAAQ;QACtB,IAAI,QAAQ,EAAE;YACV,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;SACvC;aACI;YACD,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;SAC1C;KACJ;IACD,aAAa,CAAC,MAAM;QAChB,IAAI,MAAM,EAAE;YACR,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,IAAI,CAAC,CAAC;SAC1C;aACI;YACD,IAAI,CAAC,EAAE,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;SACvC;KACJ;IACD,kBAAkB;QACd,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;QACvB,MAAM,KAAK,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,YAAY,CAAC,YAAY,CAAC,EAAE,EAAE,CAAC,CAAC;QAC/D,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC;YACnB,GAAG,EAAE,IAAI,CAAC,GAAG;YACb,KAAK,EAAE,KAAK;SACf,CAAC,CAAC;KACN;IACD,oBAAoB,CAAC,CAAC;QAClB,IAAI,CAAC,CAAC,GAAG,KAAK,YAAY,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,EAAE;YACjD,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC;gBACpB,SAAS,EAAE,IAAI,CAAC,GAAG;gBACnB,YAAY,EAAE,CAAC,CAAC,GAAG;aACtB,CAAC,CAAC;SACN;aACI,IAAI,CAAC,CAAC,GAAG,KAAK,SAAS,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,EAAE;YACnD,CAAC,CAAC,cAAc,EAAE,CAAC;SACtB;KACJ;IACD,SAAS;QACL,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI,EAAE;YACpB,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACf,QAAQ,CAAC,CAAC,UAAU,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE;aAC/F;YACD,OAAO,CAAC,CAAC,UAAU,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CAAC;SAC1E;KACJ;IACD,iBAAiB;QACb,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACzB,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;KACnC;IAMD,gBAAgB;;QAEZ,IAAI,IAAI,CAAC,UAAU,EAAE;YACjB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;SAC5B;KACJ;IACD,MAAM;QACF,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE;gBACjB,KAAK,EAAE,KAAK,CAAC,KAAK;gBAClB,OAAO,EAAE,KAAK,CAAC,OAAO;aACzB,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,UAAU,EAAE,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,EAAE,KAAK,EAAE;gBACvI,YAAY,EAAE,IAAI;gBAClB,oBAAoB,EAAE,IAAI,CAAC,MAAM;gBACjC,sBAAsB,EAAE,IAAI,CAAC,UAAU,KAAK,IAAI;gBAChD,uBAAuB,EAAE,IAAI,CAAC,QAAQ,KAAK,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI;gBACrE,KAAK,EAAE,KAAK,CAAC,KAAK;gBAClB,0BAA0B,EAAE,IAAI,CAAC,WAAW;aAC/C,EAAE,OAAO,EAAE,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,IAAI,CAAC,oBAAoB,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,SAAS,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,EAAE,IAAI,CAAC,SAAS,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,kBAAkB,EAAE,IAAI,EAAE,aAAa,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,EAAE;KACzR;IAGD,WAAW,cAAc,KAAK,OAAO,IAAI,CAAC,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["node_modules/@genexus/gemini/dist/collection/components/tab-button/tab-button.css?tag=gxg-tab-button&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/tab-button/tab-button.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 align-self: center !important;\n line-height: 0;\n}\n:host .tab-button {\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--gxg-tab-button-font-size);\n font-weight: var(--gxg-tab-button-font-weight);\n font-family: inherit;\n text-transform: var(--gxg-tab-button-font-text-transform);\n color: var(--gxg-tab-button-color);\n letter-spacing: var(--letter-spacing-regular);\n padding-top: 0;\n padding-inline-end: var(--gxg-tab-button-horizontal-padding);\n padding-bottom: 0;\n padding-inline-start: var(--gxg-tab-button-horizontal-padding);\n margin-top: 0;\n margin-right: 0;\n margin-bottom: 0;\n margin-left: 0;\n border: 0;\n width: 100%;\n height: var(--gxg-tab-button-height);\n position: relative;\n -webkit-box-shadow: none;\n -moz-box-shadow: none;\n box-shadow: none;\n background-color: transparent;\n}\n:host .tab-button:focus-visible {\n outline: var(--ds-focus-border-width) solid var(--ds-border-color-control--focused);\n outline-offset: -1px;\n outline-offset: -2px;\n}\n:host .tab-button:after {\n content: \"\";\n width: 100%;\n height: var(--gxg-tab-button-line-height);\n left: 0;\n bottom: 0;\n position: absolute;\n background-color: transparent;\n}\n:host .tab-button:hover {\n cursor: pointer;\n}\n:host .tab-button:hover:focus-visible {\n outline-color: var(--gxg-tab-button-line-background-color-hover);\n}\n:host .tab-button:hover:after {\n background-color: var(--gxg-tab-button-line-background-color-hover);\n}\n:host .tab-button:active:focus-visible {\n outline-color: var(--gxg-tab-button-line-background-color-active);\n}\n:host .tab-button:active:after {\n background-color: var(--gxg-tab-button-line-background-color-active);\n}\n:host .tab-button[disabled] {\n color: var(--ds-color-disabled);\n pointer-events: none;\n}\n:host .tab-button[disabled]:after {\n background-color: var(--ds-background-color-disabled);\n}\n:host .tab-button[disabled] gxg-icon {\n --gxg-icon-color: var(--ds-icon-color-disabled);\n}\n:host .tab-button--selected {\n color: var(--gxg-tab-button-color--selected);\n font-weight: var(--gxg-tab-button-font-weight-selected);\n}\n:host .tab-button--selected:after {\n background-color: var(--gxg-tab-button-line-background-color);\n}\n:host .tab-button--text-icon gxg-icon {\n margin-right: var(--spacing-comp-02);\n}\n:host .tab-button--hidden {\n display: none;\n}\n:host .tab-button--border-above:after {\n top: 0;\n bottom: auto;\n}\n:host .tab-button gxg-icon {\n --gxg-icon-color: var(--gxg-tab-button-icon-color);\n}\n:host .tab-button__text {\n display: inline-block;\n}\n\n:host([slot=tab-menu]) .tab-button {\n padding-left: 0;\n padding-right: 0;\n}\n\n:host(.menu-button) {\n width: 100%;\n box-sizing: border-box;\n}\n:host(.menu-button) .tab-button {\n padding: 0 var(--gxg-tab-menu-button-padding);\n min-height: calc(var(--gxg-tab-menu-button-min-height) 0.85);\n justify-content: flex-start;\n}\n:host(.menu-button) .tab-button:after {\n display: none;\n}\n:host(.menu-button) .tab-button__text {\n font-size: var(--gxg-tab-menu-button-font-size);\n}\n:host(.menu-button) gxg-icon {\n transform: scale(0.85);\n}\n\n:host(.menu-button:hover) {\n background: var(--ds-item-background-color--hover);\n}","import { h, Host } from \"@stencil/core\";\nimport state from \"../store\";\nimport { exportParts } from \"../../common/export-parts\";\nexport class GxgTabButton {\n constructor() {\n this.hidden = false;\n this.tabLabel = null;\n this.tab = null;\n this.isSelected = false;\n this.disabled = false;\n this.icon = null;\n this.borderAbove = false;\n }\n parts = {\n button: \"button\"\n };\n exportparts;\n el;\n tabButton;\n //Events\n tabActivated;\n PrevOrNextTab;\n async tabButtonClick() {\n this.buttonClickHandler();\n this.tabButton.focus();\n }\n isSelectedHandler(newValue) {\n if (newValue) {\n this.el.removeAttribute(\"tabindex\");\n }\n else {\n this.el.setAttribute(\"tabindex\", \"-1\");\n }\n }\n hiddenHandler(hidden) {\n if (hidden) {\n this.el.setAttribute(\"tabindex\", \"-1\");\n }\n else {\n this.el.removeAttribute(\"tabindex\");\n }\n }\n buttonClickHandler() {\n this.isSelected = true;\n const index = parseInt(this.el.getAttribute(\"data-index\"), 10);\n this.tabActivated.emit({\n tab: this.tab,\n index: index\n });\n }\n buttonKeyDownHandler(e) {\n if (e.key === \"ArrowRight\" \|\| e.key === \"ArrowLeft\") {\n this.PrevOrNextTab.emit({\n originTab: this.tab,\n arrowPressed: e.key\n });\n }\n else if (e.key === \"ArrowUp\" \|\| e.key === \"ArrowDown\") {\n e.preventDefault();\n }\n }\n printIcon() {\n if (this.icon !== null) {\n if (this.disabled) {\n return (h(\"gxg-icon\", { size: \"small\", color: \"disabled\", type: this.icon, part: \"icon\" }));\n }\n return h(\"gxg-icon\", { size: \"small\", type: this.icon, part: \"icon\" });\n }\n }\n componentWillLoad() {\n this.attachExportParts();\n this.hiddenHandler(this.hidden);\n }\n attachExportParts = () => {\n const part = this.el.getAttribute(\"part\");\n const exportPartsResult = exportParts(part, this.parts);\n exportPartsResult.length && (this.exportparts = exportPartsResult);\n };\n componentDidLoad() {\n //Set the active tab for this tab-button if this is selected by default\n if (this.isSelected) {\n this.tabActivated.emit();\n }\n }\n render() {\n return (h(Host, { class: {\n large: state.large,\n mercury: state.mercury\n }, exportParts: this.exportparts ? this.exportparts : null }, h(\"li\", { class: \"tab-item\" }, h(\"button\", { disabled: this.disabled, class: {\n \"tab-button\": true,\n \"tab-button--hidden\": this.hidden,\n \"tab-button--selected\": this.isSelected === true,\n \"tab-button--text-icon\": this.tabLabel !== null && this.icon !== null,\n large: state.large,\n \"tab-button--border-above\": this.borderAbove\n }, onClick: this.buttonClickHandler.bind(this), onKeyDown: this.buttonKeyDownHandler.bind(this), ref: el => (this.tabButton = el), part: this.parts.button }, this.printIcon(), h(\"span\", { class: \"tab-button__text\", part: \"button-text\" }, this.tabLabel)), h(\"slot\", null))));\n }\n static get is() { return \"gxg-tab-button\"; }\n static get encapsulation() { return \"shadow\"; }\n static get delegatesFocus() { return true; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"tab-button.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"tab-button.css\"]\n };\n }\n static get properties() {\n return {\n \"hidden\": {\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\": \"Hides the tab button\"\n },\n \"attribute\": \"hidden\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"tabLabel\": {\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 button label\"\n },\n \"attribute\": \"tab-label\",\n \"reflect\": false,\n \"defaultValue\": \"null\"\n },\n \"tab\": {\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 tab id. Must be unique, and match the \\\"tab\\\" value of the correlative \\\"gxg-tab\\\" element\"\n },\n \"attribute\": \"tab\",\n \"reflect\": true,\n \"defaultValue\": \"null\"\n },\n \"isSelected\": {\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\": \"Provide this attribute to make this button selected by default\"\n },\n \"attribute\": \"is-selected\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\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\": \"Provide this attribute to make this button disabled\"\n },\n \"attribute\": \"disabled\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"icon\": {\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\": \"(Optional) provide an icon to this button\"\n },\n \"attribute\": \"icon\",\n \"reflect\": false,\n \"defaultValue\": \"null\"\n },\n \"borderAbove\": {\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\": \"Displays the border above\"\n },\n \"attribute\": \"border-above\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n }\n };\n }\n static get events() {\n return [{\n \"method\": \"tabActivated\",\n \"name\": \"tabActivated\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"\"\n },\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n }\n }, {\n \"method\": \"PrevOrNextTab\",\n \"name\": \"PrevOrNextTab\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"\"\n },\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n }\n }];\n }\n static get methods() {\n return {\n \"tabButtonClick\": {\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\": \"\",\n \"tags\": []\n }\n }\n };\n }\n static get elementRef() { return \"el\"; }\n static get watchers() {\n return [{\n \"propName\": \"isSelected\",\n \"methodName\": \"isSelectedHandler\"\n }, {\n \"propName\": \"hidden\",\n \"methodName\": \"hiddenHandler\"\n }];\n }\n}\n//# sourceMappingURL=tab-button.js.map\n"],"version":3}
1	+ {"file":"tab-button.js","mappings":"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","names":[],"sources":["node_modules/@genexus/gemini/dist/collection/components/tab-button/tab-button.css?tag=gxg-tab-button&encapsulation=shadow","node_modules/@genexus/gemini/dist/collection/components/tab-button/tab-button.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 align-self: center !important;\n line-height: 0;\n}\n:host .tab-button {\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: var(--gxg-tab-button-font-size);\n font-weight: var(--gxg-tab-button-font-weight);\n font-family: inherit;\n text-transform: var(--gxg-tab-button-font-text-transform);\n color: var(--gxg-tab-button-color);\n letter-spacing: var(--letter-spacing-regular);\n padding-top: 0;\n padding-inline-end: var(--gxg-tab-button-horizontal-padding);\n padding-bottom: 0;\n padding-inline-start: var(--gxg-tab-button-horizontal-padding);\n margin-top: 0;\n margin-right: 0;\n margin-bottom: 0;\n margin-left: 0;\n border: 0;\n width: 100%;\n height: var(--gxg-tab-button-height);\n position: relative;\n -webkit-box-shadow: none;\n -moz-box-shadow: none;\n box-shadow: none;\n background-color: transparent;\n /stacked style/\n}\n:host .tab-button:focus-visible {\n outline: var(--ds-focus-border-width) solid var(--ds-border-color-control--focused);\n outline-offset: -1px;\n outline-offset: -2px;\n}\n:host .tab-button:after {\n content: \"\";\n width: 100%;\n height: var(--gxg-tab-button-line-height);\n left: 0;\n bottom: 0;\n position: absolute;\n background-color: transparent;\n}\n:host .tab-button:hover {\n cursor: pointer;\n}\n:host .tab-button:hover:focus-visible {\n outline-color: var(--gxg-tab-button-line-background-color-hover);\n}\n:host .tab-button:hover:after {\n background-color: var(--gxg-tab-button-line-background-color-hover);\n}\n:host .tab-button:active:focus-visible {\n outline-color: var(--gxg-tab-button-line-background-color-active);\n}\n:host .tab-button:active:after {\n background-color: var(--gxg-tab-button-line-background-color-active);\n}\n:host .tab-button[disabled] {\n color: var(--ds-color-disabled);\n pointer-events: none;\n}\n:host .tab-button[disabled]:after {\n background-color: var(--ds-background-color-disabled);\n}\n:host .tab-button[disabled] gxg-icon {\n --gxg-icon-color: var(--ds-icon-color-disabled);\n}\n:host .tab-button--selected {\n color: var(--gxg-tab-button-color--selected);\n font-weight: var(--gxg-tab-button-font-weight-selected);\n}\n:host .tab-button--selected:after {\n background-color: var(--gxg-tab-button-line-background-color);\n}\n:host .tab-button--text-icon gxg-icon {\n margin-right: var(--spacing-comp-02);\n}\n:host .tab-button--hidden {\n display: none;\n}\n:host .tab-button--border-above:after {\n top: 0;\n bottom: auto;\n}\n:host .tab-button gxg-icon {\n --gxg-icon-color: var(--gxg-tab-button-icon-color);\n}\n:host .tab-button--reduced {\n padding-inline-end: var(--gxg-tab-button-horizontal-padding--reduced);\n padding-inline-start: var(--gxg-tab-button-horizontal-padding--reduced);\n font-size: var(--gxg-tab-button-font-size--reduced);\n height: var(--gxg-tab-button-height--reduced);\n}\n:host .tab-button--stacked-style {\n justify-content: flex-start;\n}\n:host .tab-button--stacked-style.tab-button--text-icon {\n padding-inline-start: var(--gxg-tab-button-horizontal-padding--stacked);\n}\n:host .tab-button__text {\n display: inline-block;\n}\n\n:host(.stacked) {\n width: 100%;\n}\n\n:host([slot=tab-menu]) .tab-button {\n padding-left: 0;\n padding-right: 0;\n}\n\n:host(.menu-button) {\n width: 100%;\n box-sizing: border-box;\n}\n:host(.menu-button) .tab-button {\n padding: 0 var(--gxg-tab-menu-button-padding);\n min-height: calc(var(--gxg-tab-menu-button-min-height) 0.85);\n justify-content: flex-start;\n}\n:host(.menu-button) .tab-button:after {\n display: none;\n}\n:host(.menu-button) .tab-button__text {\n font-size: var(--gxg-tab-menu-button-font-size);\n}\n:host(.menu-button) gxg-icon {\n transform: scale(0.85);\n}\n\n:host(.menu-button:hover) {\n background: var(--ds-item-background-color--hover);\n}","import { h, Host } from \"@stencil/core\";\nimport state from \"../store\";\nimport { exportParts } from \"../../common/export-parts\";\nexport class GxgTabButton {\n constructor() {\n this.hidden = false;\n this.tabLabel = null;\n this.tab = null;\n this.isSelected = false;\n this.disabled = false;\n this.icon = null;\n this.borderAbove = false;\n this.stackedStyle = false;\n this.reduced = false;\n }\n parts = {\n button: \"button\"\n };\n exportparts;\n el;\n tabButton;\n //Events\n tabActivated;\n PrevOrNextTab;\n async tabButtonClick() {\n this.buttonClickHandler();\n this.tabButton.focus();\n }\n isSelectedHandler(newValue) {\n if (newValue) {\n this.el.removeAttribute(\"tabindex\");\n }\n else {\n this.el.setAttribute(\"tabindex\", \"-1\");\n }\n }\n hiddenHandler(hidden) {\n if (hidden) {\n this.el.setAttribute(\"tabindex\", \"-1\");\n }\n else {\n this.el.removeAttribute(\"tabindex\");\n }\n }\n buttonClickHandler() {\n this.isSelected = true;\n const index = parseInt(this.el.getAttribute(\"data-index\"), 10);\n this.tabActivated.emit({\n tab: this.tab,\n index: index\n });\n }\n buttonKeyDownHandler(e) {\n if (e.key === \"ArrowRight\" \|\| e.key === \"ArrowLeft\") {\n this.PrevOrNextTab.emit({\n originTab: this.tab,\n arrowPressed: e.key\n });\n }\n else if (e.key === \"ArrowUp\" \|\| e.key === \"ArrowDown\") {\n e.preventDefault();\n }\n }\n printIcon() {\n if (this.icon !== null) {\n if (this.disabled) {\n return (h(\"gxg-icon\", { size: \"small\", color: \"disabled\", type: this.icon, part: \"icon\" }));\n }\n return h(\"gxg-icon\", { size: \"small\", type: this.icon, part: \"icon\" });\n }\n }\n componentWillLoad() {\n this.attachExportParts();\n this.hiddenHandler(this.hidden);\n }\n attachExportParts = () => {\n const part = this.el.getAttribute(\"part\");\n const exportPartsResult = exportParts(part, this.parts);\n exportPartsResult.length && (this.exportparts = exportPartsResult);\n };\n componentDidLoad() {\n //Set the active tab for this tab-button if this is selected by default\n if (this.isSelected) {\n this.tabActivated.emit();\n }\n }\n render() {\n return (h(Host, { class: {\n large: state.large,\n mercury: state.mercury,\n stacked: this.stackedStyle\n }, exportParts: this.exportparts ? this.exportparts : null }, h(\"li\", { class: \"tab-item\" }, h(\"button\", { disabled: this.disabled, class: {\n \"tab-button\": true,\n \"tab-button--hidden\": this.hidden,\n \"tab-button--selected\": this.isSelected === true,\n \"tab-button--text-icon\": this.tabLabel !== null && this.icon !== null,\n large: state.large,\n \"tab-button--border-above\": this.borderAbove,\n \"tab-button--reduced\": this.reduced,\n \"tab-button--stacked-style\": this.stackedStyle\n }, onClick: this.buttonClickHandler.bind(this), onKeyDown: this.buttonKeyDownHandler.bind(this), ref: el => (this.tabButton = el), part: this.parts.button }, !this.reduced && this.printIcon(), h(\"span\", { class: \"tab-button__text\", part: \"button-text\" }, this.tabLabel)), h(\"slot\", null))));\n }\n static get is() { return \"gxg-tab-button\"; }\n static get encapsulation() { return \"shadow\"; }\n static get delegatesFocus() { return true; }\n static get originalStyleUrls() {\n return {\n \"$\": [\"tab-button.scss\"]\n };\n }\n static get styleUrls() {\n return {\n \"$\": [\"tab-button.css\"]\n };\n }\n static get properties() {\n return {\n \"hidden\": {\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\": \"Hides the tab button\"\n },\n \"attribute\": \"hidden\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"tabLabel\": {\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 button label\"\n },\n \"attribute\": \"tab-label\",\n \"reflect\": false,\n \"defaultValue\": \"null\"\n },\n \"tab\": {\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 tab id. Must be unique, and match the \\\"tab\\\" value of the correlative \\\"gxg-tab\\\" element\"\n },\n \"attribute\": \"tab\",\n \"reflect\": true,\n \"defaultValue\": \"null\"\n },\n \"isSelected\": {\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\": \"Provide this attribute to make this button selected by default\"\n },\n \"attribute\": \"is-selected\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\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\": \"Provide this attribute to make this button disabled\"\n },\n \"attribute\": \"disabled\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n },\n \"icon\": {\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\": \"(Optional) provide an icon to this button\"\n },\n \"attribute\": \"icon\",\n \"reflect\": false,\n \"defaultValue\": \"null\"\n },\n \"borderAbove\": {\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\": \"Displays the border above\"\n },\n \"attribute\": \"border-above\",\n \"reflect\": true,\n \"defaultValue\": \"false\"\n },\n \"stackedStyle\": {\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\": \"Stylize the button for the gxg-tab-bar \\\"stacked\\\" version.\"\n },\n \"attribute\": \"stacked-style\",\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 hide the icon, and reduce the font size a little bit.\"\n },\n \"attribute\": \"reduced\",\n \"reflect\": false,\n \"defaultValue\": \"false\"\n }\n };\n }\n static get events() {\n return [{\n \"method\": \"tabActivated\",\n \"name\": \"tabActivated\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"\"\n },\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n }\n }, {\n \"method\": \"PrevOrNextTab\",\n \"name\": \"PrevOrNextTab\",\n \"bubbles\": true,\n \"cancelable\": true,\n \"composed\": true,\n \"docs\": {\n \"tags\": [],\n \"text\": \"\"\n },\n \"complexType\": {\n \"original\": \"any\",\n \"resolved\": \"any\",\n \"references\": {}\n }\n }];\n }\n static get methods() {\n return {\n \"tabButtonClick\": {\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\": \"\",\n \"tags\": []\n }\n }\n };\n }\n static get elementRef() { return \"el\"; }\n static get watchers() {\n return [{\n \"propName\": \"isSelected\",\n \"methodName\": \"isSelectedHandler\"\n }, {\n \"propName\": \"hidden\",\n \"methodName\": \"hiddenHandler\"\n }];\n }\n}\n//# sourceMappingURL=tab-button.js.map\n"],"version":3}

package/dist/components/tab.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { s as state } from './store.js';
-const tabCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host{height:100%;overflow-y:auto;display:block}:host .container{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-size:var(--gxg-tab-font-size);color:var(--gxg-tab-color);height:100%;width:100%;box-sizing:border-box;padding-block-start:var(--gxg-tab-vertical-padding);padding-inline-end:var(--gxg-tab-horizontal-padding);padding-block-end:var(--gxg-tab-vertical-padding);padding-inline-start:var(--gxg-tab-horizontal-padding);overflow-y:auto;background-color:var(--gxg-tab-background-color)}:host .container::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}:host .container::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}:host .container::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}:host .container::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}:host .container::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host(.not-selected){display:none}:host(.no-padding) .container{padding:0}:host(.flex){display:flex}:host(.overflow-auto){overflow:auto}.container--flex{display:flex}.container--flex.flex-column{flex-direction:column}.container--flex.flex-row{flex-direction:row}";
+const tabCss = ":root{--ui-animaton-speed:0.2s}.gxg-title-01{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-01--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-01-font-weight);font-size:var(--ds-title-01-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-02{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-02--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-02-font-weight);font-size:var(--ds-title-02-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--color-on-primary)}.gxg-title-03{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-03--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-03-font-weight);font-size:var(--ds-title-03-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;text-transform:uppercase;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-04{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-04--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-04-font-weight);font-size:var(--ds-title-04-font-size);letter-spacing:var(--ds-base-font-letter-spacing--comfortable);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-title-05{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable)}.gxg-title-05--negative{font-family:var(--ds-base-font-family-primary);font-weight:var(--ds-title-05-font-weight);font-size:var(--ds-title-05-font-size);letter-spacing:var(--ds-base-font-letter-spacing--regular);color:var(--ds-base-font-color);text-align:start;line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable)}.gxg-text--negative{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--negative)}.gxg-text--gray{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--dimmed)}.gxg-quote{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-style:italic}.gxg-quote--negative{color:var(--ds-base-font-color--negative)}.gxg-link{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block}.gxg-link:hover{color:var(--ds-base-font-color--link-hover)}.gxg-link:active{color:var(--ds-base-font-color--link-active)}.gxg-link-gray{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed)}.gxg-link-gray:hover{line-height:unset;font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--link);text-decoration:underline;cursor:pointer;display:inline-block;color:var(--ds-base-font-color--dimmed);filter:brightness(1.4)}.gxg-alert-error{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--error);display:inline-block}.gxg-alert-warning{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--warning);display:inline-block}.gxg-alert-success{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);color:var(--ds-base-font-color--success);display:inline-block}.gxg-tab--disabled{color:var(--color-primary-disabled);pointer-events:none}.gxg-tab--disabled[disabled]{color:var(--color-primary-disabled);pointer-events:none}.gxg-label{font-family:var(--ds-base-font-family-primary);font-weight:var(--gxg-label-font-weight);font-size:var(--gxg-label-font-size);color:var(--gxg-label-color);text-align:center;line-height:1.455em;display:flex;align-items:center}.gxg-label:hover{color:var(--color-primary-hover)}.gxg-label:focus{color:var(--color-primary-active)}.gxg-label:active{color:var(--color-primary-active)}.gxg-label[disabled]{color:var(--color-primary-disabled)}.gxg-label--negative{color:var(--color-on-primary)}.gxg-label--negative[disabled]{color:var(--color-on-disabled)}.gxg-scrollbar{}.gxg-scrollbar::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}.gxg-scrollbar::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}.gxg-scrollbar::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}.gxg-scrollbar::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host{height:100%;overflow-y:auto;display:block}:host .container{font-family:var(--ds-base-font-family-primary);font-size:var(--ds-base-font-size);color:var(--ds-base-font-size-color);font-weight:var(--ds-base-font-size-weight);line-height:var(--ds-base-font-line-height--comfortable);font-size:var(--gxg-tab-font-size);color:var(--gxg-tab-color);height:100%;width:100%;box-sizing:border-box;padding-block-start:var(--gxg-tab-vertical-padding);padding-inline-end:var(--gxg-tab-horizontal-padding);padding-block-end:var(--gxg-tab-vertical-padding);padding-inline-start:var(--gxg-tab-horizontal-padding);overflow-y:auto;background-color:var(--gxg-tab-background-color)}:host .container::-webkit-scrollbar{width:var(--gxg-scrollbar-width);height:var(--gxg-scrollbar-width)}:host .container::-webkit-scrollbar-track{background-color:var(--gxg-scrollbar-track-background);border-radius:var(--gxg-scrollbar-track-border-radius)}:host .container::-webkit-scrollbar-thumb{background-color:var(--gxg-scrollbar-track-thumb-background);border-radius:var(--gxg-scrollbar-track-thumb-radius)}:host .container::-webkit-scrollbar-thumb:hover{background-color:var(--gxg-scrollbar-track-thumb-hover-background)}:host .container::-webkit-scrollbar-corner{background:rgba(0, 0, 0, 0)}:host .container--reduced{font-size:var(--gxg-tab-font-size--reduced);padding-block-start:var(--gxg-tab-vertical-padding--reduced);padding-inline-end:var(--gxg-tab-horizontal-padding--reduced);padding-block-end:var(--gxg-tab-vertical-padding--reduced);padding-inline-start:var(--gxg-tab-horizontal-padding--reduced)}:host(.not-selected){display:none}:host(.no-padding) .container{padding:0}:host(.flex){display:flex}:host(.overflow-auto){overflow:auto}.container--flex{display:flex}.container--flex.flex-column{flex-direction:column}.container--flex.flex-row{flex-direction:row}";
 const GxgTab = /*@__PURE__*/ proxyCustomElement(class GxgTab extends HTMLElement {
     constructor() {
@@ -15,6 +15,7 @@ const GxgTab = /*@__PURE__*/ proxyCustomElement(class GxgTab extends HTMLElement
         this.overflowAuto = false;
         this.flexDirection = "column";
         this.isSelected = false;
+        this.reduced = false;
     }
     get el() { return this; }
     render() {
@@ -25,12 +26,13 @@ const GxgTab = /*@__PURE__*/ proxyCustomElement(class GxgTab extends HTMLElement
                 "not-selected": !this.isSelected,
                 "no-padding": this.noPadding,
                 large: state.large,
-                mercury: state.mercury,
+                mercury: state.mercury
             } }, h("div", { class: {
                 container: true,
                 "container--flex": this.flexContainer,
                 "flex-column": this.flexDirection === "column",
                 "flex-row": this.flexDirection === "row",
+                "container--reduced": this.reduced
             }, part: "container" }, h("slot", null))));
     }
     static get style() { return tabCss; }
@@ -41,7 +43,8 @@ const GxgTab = /*@__PURE__*/ proxyCustomElement(class GxgTab extends HTMLElement
         "flex": [4],
         "overflowAuto": [4, "overflow-auto"],
         "flexDirection": [1, "flex-direction"],
-        "isSelected": [516, "is-selected"]
+        "isSelected": [516, "is-selected"],
+        "reduced": [4]
     }]);
 function defineCustomElement() {
     if (typeof customElements === "undefined") {