@laerdal/life-react-components 6.0.0-dev.19.full → 6.0.0-dev.2.full

package/dist/Tabs/HorizontalTabs.js

@@ -38,25 +38,16 @@ const HorizontalTabContainer = styled.div`
 `;
 const TabSideFill = styled.div`
   position: absolute;
-  border-bottom: 1px solid ${props => COLORS.generateToken({
-  componentType: 'border',
-  defaultVariant: 'subtle'
-}, props.theme)};
+  border-bottom: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};
   bottom: 0;
   width: 100%;
 
   &.fill {
-    background: ${props => COLORS.generateToken({
-  componentType: 'bg-surface',
-  defaultVariant: 'default'
-}, props.theme)};
+    background: ${props => COLORS.getColor('white', props.theme)};
   }
 `;
 const TabButton = styled.button`
-  color: ${props => COLORS.generateToken({
-  componentType: 'text',
-  defaultVariant: 'subtle'
-}, props.theme)};
+  color: ${props => COLORS.getColor('neutral_600', props.theme)};
   border: none;
   background-color: transparent;
   position: relative;
@@ -76,21 +67,12 @@ const TabButton = styled.button`
   }
   
   &.selected {
-    background-color: ${props => COLORS.generateToken({
-  componentType: 'bg-surface',
-  defaultVariant: 'default'
-}, props.theme)};
-    color: ${props => COLORS.generateToken({
-  componentType: 'text',
-  defaultVariant: 'default'
-}, props.theme)};
+    background-color: ${props => COLORS.getColor('white', props.theme)};
+    color: ${props => COLORS.getColor('neutral_800', props.theme)};
   }
 
   &.selected.floating {
-    background-color: ${props => COLORS.generateToken({
-  componentType: 'bg-surface',
-  defaultVariant: 'selected'
-}, props.theme)};
+    background-color: ${props => COLORS.getColor('neutral_20', props.theme)};
   }
 
   &.default {
@@ -99,14 +81,8 @@ const TabButton = styled.button`
   }
   
   &.default.selected {
-    border-left: 1px solid ${props => COLORS.generateToken({
-  componentType: 'border',
-  defaultVariant: 'subtle'
-}, props.theme)};
-    border-right: 1px solid ${props => COLORS.generateToken({
-  componentType: 'border',
-  defaultVariant: 'subtle'
-}, props.theme)};
+    border-left: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};
+    border-right: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};
   }
 
   &.selected:after {
@@ -116,10 +92,7 @@ const TabButton = styled.button`
     left: -1px;
     right: -1px;
     height: 2px;
-    background-color: ${props => COLORS.generateToken({
-  componentType: 'border',
-  defaultVariant: 'selected'
-}, props.theme)};
+    background-color: ${props => COLORS.getColor('primary_500', props.theme)};
   }
 
   &.selected.floating:after {
@@ -129,54 +102,31 @@ const TabButton = styled.button`
     right: 1px;
     height: 2px;
     border-radius: 2px;
-    background-color: ${props => COLORS.generateToken({
-  componentType: 'border',
-  defaultVariant: 'selected'
-}, props.theme)};
+    background-color: ${props => COLORS.getColor('primary_500', props.theme)};
   }
 
+
   &:hover, &:hover.selected {
-    background: ${props => COLORS.generateToken({
-  componentType: 'bg-surface',
-  state: 'hover'
-}, props.theme)};
-    color: ${props => COLORS.generateToken({
-  componentType: 'text',
-  state: 'hover'
-}, props.theme)};
+    background: ${props => COLORS.getColor('primary_20', props.theme)};
+    color: ${props => COLORS.getColor('primary_700', props.theme)};
   }
 
   &:hover:after {
-    background-color: ${props => COLORS.generateToken({
-  componentType: 'border',
-  state: 'hover'
-}, props.theme)};
+    background-color: ${props => COLORS.getColor('primary_700', props.theme)};
   }
 
   &:active, &:active.selected {
-    background: ${props => COLORS.generateToken({
-  componentType: 'bg-surface',
-  state: 'active'
-}, props.theme)};
-    color: ${props => COLORS.generateToken({
-  componentType: 'text',
-  state: 'active'
-}, props.theme)};
+    background: ${props => COLORS.getColor('primary_100', props.theme)};
+    color: ${props => COLORS.getColor('primary_800', props.theme)};
     outline: none;
   }
 
   &:active:after {
-    background-color: ${props => COLORS.generateToken({
-  componentType: 'border',
-  state: 'active'
-}, props.theme)};
+    background-color: ${props => COLORS.getColor('primary_800', props.theme)};
   }
 
   &:disabled {
-    color: ${props => COLORS.generateToken({
-  componentType: 'text',
-  state: 'disabled'
-}, props.theme)};
+    color: ${props => COLORS.getColor('neutral_300', props.theme)};
     background: transparent;
     cursor: not-allowed;
   }

package/dist/Tabs/HorizontalTabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"HorizontalTabs.js","names":["React","Size","COLORS","ComponentTextStyle","focusStyles","styled","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentXSStyling","Z_INDEXES","defaultOnMouseDownHandler","jsx","_jsx","jsxs","_jsxs","HorizontalTabContainer","div","TabSideFill","props","generateToken","componentType","defaultVariant","theme","TabButton","button","active","state","XSmall","Regular","Small","Medium","Large","HorizontalTabs","_ref","size","tabs","sideFill","fullWidth","onTabChange","variant","rest","_objectWithoutProperties","_excluded","doTabChange","to","document","activeElement","HTMLElement","blur","focused","setFocused","useState","currentTab","setCurrentTab","useEffect","selectedTab","find","x","selected","disabled","tabListBlur","tabListFocus","e","changeTabInternal","tab","forEach","tabListKeyDown","key","preventDefault","i","j","length","nextIndex","_objectSpread","tabIndex","onBlur","onFocus","onKeyDown","role","children","className","map","index","value","_excluded2","onMouseDown","style","width","onClick","propTypes","_pt","arrayOf","shape","oneOfType","string","node","isRequired","bool","func","oneOf"],"sources":["../../src/Tabs/HorizontalTabs.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\nimport {Size} from '../types';\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport {COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\n\r\n/**\r\n * Import third-party libraries.\r\n */\r\nimport styled from 'styled-components';\r\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXSStyling} from '../styles';\r\nimport {Z_INDEXES} from '../styles';\r\nimport {defaultOnMouseDownHandler} from '../common';\r\nimport Colors from \"../styles/colors\";\r\n\r\n// Add custom styles\r\nconst HorizontalTabContainer = styled.div`\r\n  width: 100%;\r\n  display: flex;\r\n  position: relative;\r\n  flex-direction: row;\r\n\r\n  &:focus {\r\n    ${focusStyles};\r\n  }\r\n\r\n`;\r\n\r\nconst TabSideFill = styled.div`\r\n  position: absolute;\r\n  border-bottom: 1px solid ${props => COLORS.generateToken({ componentType:'border', defaultVariant:'subtle' }, props.theme)};\r\n  bottom: 0;\r\n  width: 100%;\r\n\r\n  &.fill {\r\n    background: ${props => COLORS.generateToken({ componentType: 'bg-surface', defaultVariant:'default' }, props.theme)};\r\n  }\r\n`;\r\n\r\nconst TabButton = styled.button`\r\n  color: ${props => COLORS.generateToken({componentType: 'text', defaultVariant: 'subtle'}, props.theme)};\r\n  border: none;\r\n  background-color: transparent;\r\n  position: relative;\r\n  cursor: pointer;\r\n  display: flex;\r\n  box-sizing: border-box;\r\n  justify-content: center;\r\n  align-items: center;\r\n  padding: 0;\r\n\r\n  &[aria-selected=\"true\"] {\r\n    z-index: ${Z_INDEXES.active};\r\n  }\r\n\r\n  &.floating {\r\n    border-radius: 2px;\r\n  }\r\n  \r\n  &.selected {\r\n    background-color: ${props => COLORS.generateToken({componentType: 'bg-surface', defaultVariant: 'default'}, props.theme)};\r\n    color: ${props => COLORS.generateToken({componentType: 'text', defaultVariant: 'default'}, props.theme)};\r\n  }\r\n\r\n  &.selected.floating {\r\n    background-color: ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant: 'selected'}, props.theme)};\r\n  }\r\n\r\n  &.default {\r\n    border-left: 1px solid transparent;\r\n    border-right: 1px solid transparent;\r\n  }\r\n  \r\n  &.default.selected {\r\n    border-left: 1px solid ${props => COLORS.generateToken({ componentType: 'border', defaultVariant: 'subtle' }, props.theme)};\r\n    border-right: 1px solid ${props => COLORS.generateToken({ componentType: 'border', defaultVariant: 'subtle' }, props.theme)};\r\n  }\r\n\r\n  &.selected:after {\r\n    content: \"\";\r\n    position: absolute;\r\n    top: 0;\r\n    left: -1px;\r\n    right: -1px;\r\n    height: 2px;\r\n    background-color: ${props => COLORS.generateToken({ componentType: 'border', defaultVariant: 'selected' }, props.theme)};\r\n  }\r\n\r\n  &.selected.floating:after {\r\n    top: unset;\r\n    bottom: 1px;\r\n    left: 1px;\r\n    right: 1px;\r\n    height: 2px;\r\n    border-radius: 2px;\r\n    background-color: ${props => COLORS.generateToken({ componentType: 'border', defaultVariant: 'selected' }, props.theme)};\r\n  }\r\n\r\n  &:hover, &:hover.selected {\r\n    background: ${props => COLORS.generateToken({ componentType: 'bg-surface', state: 'hover' }, props.theme)};\r\n    color: ${props => COLORS.generateToken({ componentType: 'text', state: 'hover' }, props.theme)};\r\n  }\r\n\r\n  &:hover:after {\r\n    background-color: ${props => COLORS.generateToken({ componentType:'border', state:'hover' }, props.theme)};\r\n  }\r\n\r\n  &:active, &:active.selected {\r\n    background: ${props => COLORS.generateToken({ componentType: 'bg-surface', state: 'active' }, props.theme)};\r\n    color: ${props => COLORS.generateToken({ componentType: 'text', state: 'active' }, props.theme)};\r\n    outline: none;\r\n  }\r\n\r\n  &:active:after {\r\n    background-color: ${props => COLORS.generateToken({ componentType: 'border', state: 'active' }, props.theme)};\r\n  }\r\n\r\n  &:disabled {\r\n    color: ${props => COLORS.generateToken({ componentType: 'text', state: 'disabled' }, props.theme)};\r\n    background: transparent;\r\n    cursor: not-allowed;\r\n  }\r\n\r\n  // Sizes\r\n  &.${Size.XSmall} {\r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\r\n    padding: 0px 16px;\r\n    height: 32px;\r\n    margin-top: 16px;\r\n  }\r\n\r\n  &.${Size.Small} {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n    padding: 0px 16px;\r\n    height: 40px;\r\n    margin-top: 8px;\r\n  }\r\n\r\n  &.${Size.Medium} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n    height: 48px;\r\n    min-width: 96px;\r\n    padding: 0 16px;\r\n  }\r\n\r\n  &.${Size.Large} {\r\n    ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n    height: 56px;\r\n    min-width: 144px;\r\n    padding: 0 16px;\r\n  }\r\n`;\r\n\r\n// Add component-specific types\r\nexport interface HorizontalTabProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  /** Required. Size of the Tabs */\r\n  size: Size.XSmall | Size.Small | Size.Medium | Size.Large;\r\n  /** Required: Array of Tabs to show */\r\n  tabs: HorizontalTab[];\r\n  /** Optional. For 'default' variant of tabs if this flag is set, then white background will be added to the tabs  */\r\n  sideFill?: boolean;\r\n  /** Optional. If set, then whole width of the parent container will be equally split between Tabs, otherwise each tab will take width \r\n   * required for its content.\r\n   */\r\n  fullWidth?: boolean;\r\n  /** Required. Handler to be called when user tries to change the tab */\r\n  onTabChange: (to: string) => void;\r\n  /** Optional. Display variant of the tabs. If not set, then 'default' is used */\r\n  variant?: 'default' | 'floating';\r\n}\r\n\r\nexport interface HorizontalTab extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'style'> {\r\n  /** Required. Value of the tab */\r\n  value: string | React.ReactNode;\r\n  /** Required. State of the tab, selected or not. Use it to set initial state of the tabs. */\r\n  selected: boolean;\r\n  /** Required. URL related with the Tab */\r\n  to: string;\r\n}\r\n\r\nconst HorizontalTabs = ({size, tabs, sideFill, fullWidth, onTabChange, variant, ...rest}: HorizontalTabProps) => {\r\n  /**\r\n   * Informs parent component of tab change and clears focus.\r\n   * @param to - A link to which user should be navigated.\r\n   */\r\n  const doTabChange = (to: string): void => {\r\n    // Let's inform parent component\r\n    onTabChange(to);\r\n\r\n    // Let's clear focus\r\n    if (document.activeElement instanceof HTMLElement) {\r\n      document.activeElement!.blur();\r\n    }\r\n  };\r\n\r\n  const [focused, setFocused] = React.useState<boolean>(false);\r\n  const [currentTab, setCurrentTab] = React.useState<string>();\r\n\r\n  React.useEffect(() => {\r\n    const selectedTab = tabs.find(x => x.selected && !x.disabled);\r\n    if (selectedTab)\r\n      setCurrentTab(selectedTab.to);\r\n  }, [tabs]);\r\n\r\n  const tabListBlur = () => setFocused(false);\r\n\r\n  const tabListFocus = (e: React.FocusEvent<HTMLDivElement, Element>) => setFocused(true);\r\n\r\n  const changeTabInternal = (tab: HorizontalTab) => {\r\n    tab.selected = true;\r\n    tabs.forEach(x => {\r\n      if (x.to != tab.to)\r\n        x.selected = false;\r\n    });\r\n    setCurrentTab(tab.to);\r\n    onTabChange(tab.to);\r\n  }\r\n\r\n  const tabListKeyDown = (e: React.KeyboardEvent) => {\r\n    if (focused && (e.key === 'ArrowLeft' || e.key === 'ArrowRight')) {\r\n      e.preventDefault();\r\n      if (e.key === 'ArrowRight') {\r\n        tabs.forEach((x, i) => {\r\n          if (x.to != currentTab)\r\n            return;\r\n\r\n          for (let j = 1; j < tabs.length - 1; j++) {\r\n            let nextIndex = j + i;\r\n            if (nextIndex > tabs.length - 1)\r\n              nextIndex = nextIndex - tabs.length;\r\n            if (tabs[nextIndex].disabled)\r\n              continue;\r\n            changeTabInternal(tabs[nextIndex]);\r\n            break;\r\n          }\r\n        });\r\n      }\r\n\r\n      if (e.key === 'ArrowLeft') {\r\n        tabs.forEach((x, i) => {\r\n          if (x.to != currentTab)\r\n            return;\r\n\r\n          for (let j = 1; j < tabs.length - 1; j++) {\r\n            let nextIndex = i - j;\r\n            if (nextIndex < 0)\r\n              nextIndex = nextIndex + tabs.length;\r\n            if (tabs[nextIndex].disabled)\r\n              continue;\r\n            changeTabInternal(tabs[nextIndex]);\r\n            break;\r\n          }\r\n        });\r\n      }\r\n    }\r\n  };\r\n\r\n  return (\r\n    <HorizontalTabContainer tabIndex={0} onBlur={tabListBlur} onFocus={tabListFocus} onKeyDown={tabListKeyDown}\r\n                            role=\"tablist\" data-testid={'horizontal-tabs-container'} {...rest}>\r\n      {\r\n        variant !== 'floating' && <TabSideFill tabIndex={-1} className={`${sideFill ? 'fill' : ''}`}/>\r\n      }\r\n      {tabs.map((tab: HorizontalTab, index: number) => {\r\n        const {value, selected, to, disabled, className, ...rest} = tab;\r\n        return (\r\n          <TabButton\r\n            role=\"tab\"\r\n            data-testid={`tab_${value}`}\r\n            key={`${tab}_${index}`}\r\n            aria-selected={selected}\r\n            aria-expanded={selected}\r\n            tabIndex={-1}\r\n            onMouseDown={defaultOnMouseDownHandler}\r\n            style={fullWidth ? {width: `${100 / tabs.length}%`} : {}}\r\n            disabled={disabled}\r\n            className={`${className || ''} ${size} ${variant || 'default'} ${tab.selected ? 'selected' : ''}`}\r\n            onClick={() => !disabled && changeTabInternal(tab)}\r\n            {...rest}>\r\n            {tab.value}\r\n          </TabButton>\r\n        );\r\n      })}\r\n    </HorizontalTabContainer>\r\n  );\r\n};\r\n\r\nexport default HorizontalTabs;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"HorizontalTabs.js","names":["React","Size","COLORS","ComponentTextStyle","focusStyles","styled","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentXSStyling","Z_INDEXES","defaultOnMouseDownHandler","jsx","_jsx","jsxs","_jsxs","HorizontalTabContainer","div","TabSideFill","props","getColor","theme","TabButton","button","active","XSmall","Regular","Small","Medium","Large","HorizontalTabs","_ref","size","tabs","sideFill","fullWidth","onTabChange","variant","rest","_objectWithoutProperties","_excluded","doTabChange","to","document","activeElement","HTMLElement","blur","focused","setFocused","useState","currentTab","setCurrentTab","useEffect","selectedTab","find","x","selected","disabled","tabListBlur","tabListFocus","e","changeTabInternal","tab","forEach","tabListKeyDown","key","preventDefault","i","j","length","nextIndex","_objectSpread","tabIndex","onBlur","onFocus","onKeyDown","role","children","className","map","index","value","_excluded2","onMouseDown","style","width","onClick","propTypes","_pt","arrayOf","shape","oneOfType","string","node","isRequired","bool","func","oneOf"],"sources":["../../src/Tabs/HorizontalTabs.tsx"],"sourcesContent":["/**\r\n * Import React libraries.\r\n */\r\nimport * as React from 'react';\r\nimport {Size} from '../types';\r\n\r\n/**\r\n * Import custom styles.\r\n */\r\nimport {COLORS, ComponentTextStyle, focusStyles} from '../styles';\r\n\r\n/**\r\n * Import third-party libraries.\r\n */\r\nimport styled from 'styled-components';\r\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXSStyling} from '../styles';\r\nimport {Z_INDEXES} from '../styles';\r\nimport {defaultOnMouseDownHandler} from '../common';\r\nimport Colors from \"../styles/colors\";\r\n\r\n// Add custom styles\r\nconst HorizontalTabContainer = styled.div`\r\n  width: 100%;\r\n  display: flex;\r\n  position: relative;\r\n  flex-direction: row;\r\n\r\n  &:focus {\r\n    ${focusStyles};\r\n  }\r\n\r\n`;\r\n\r\nconst TabSideFill = styled.div`\r\n  position: absolute;\r\n  border-bottom: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  bottom: 0;\r\n  width: 100%;\r\n\r\n  &.fill {\r\n    background: ${props => COLORS.getColor('white', props.theme)};\r\n  }\r\n`;\r\n\r\nconst TabButton = styled.button`\r\n  color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  border: none;\r\n  background-color: transparent;\r\n  position: relative;\r\n  cursor: pointer;\r\n  display: flex;\r\n  box-sizing: border-box;\r\n  justify-content: center;\r\n  align-items: center;\r\n  padding: 0;\r\n\r\n  &[aria-selected=\"true\"] {\r\n    z-index: ${Z_INDEXES.active};\r\n  }\r\n\r\n  &.floating {\r\n    border-radius: 2px;\r\n  }\r\n  \r\n  &.selected {\r\n    background-color: ${props => COLORS.getColor('white', props.theme)};\r\n    color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n  }\r\n\r\n  &.selected.floating {\r\n    background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n  }\r\n\r\n  &.default {\r\n    border-left: 1px solid transparent;\r\n    border-right: 1px solid transparent;\r\n  }\r\n  \r\n  &.default.selected {\r\n    border-left: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n    border-right: 1px solid ${props => COLORS.getColor('neutral_100', props.theme)};\r\n  }\r\n\r\n  &.selected:after {\r\n    content: \"\";\r\n    position: absolute;\r\n    top: 0;\r\n    left: -1px;\r\n    right: -1px;\r\n    height: 2px;\r\n    background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n  }\r\n\r\n  &.selected.floating:after {\r\n    top: unset;\r\n    bottom: 1px;\r\n    left: 1px;\r\n    right: 1px;\r\n    height: 2px;\r\n    border-radius: 2px;\r\n    background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n  }\r\n\r\n\r\n  &:hover, &:hover.selected {\r\n    background: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n  }\r\n\r\n  &:hover:after {\r\n    background-color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n  }\r\n\r\n  &:active, &:active.selected {\r\n    background: ${props => COLORS.getColor('primary_100', props.theme)};\r\n    color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    outline: none;\r\n  }\r\n\r\n  &:active:after {\r\n    background-color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n  }\r\n\r\n  &:disabled {\r\n    color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n    background: transparent;\r\n    cursor: not-allowed;\r\n  }\r\n\r\n  // Sizes\r\n  &.${Size.XSmall} {\r\n    ${ComponentXSStyling(ComponentTextStyle.Regular, null)}\r\n    padding: 0px 16px;\r\n    height: 32px;\r\n    margin-top: 16px;\r\n  }\r\n\r\n  &.${Size.Small} {\r\n    ${ComponentSStyling(ComponentTextStyle.Regular, null)}\r\n    padding: 0px 16px;\r\n    height: 40px;\r\n    margin-top: 8px;\r\n  }\r\n\r\n  &.${Size.Medium} {\r\n    ${ComponentMStyling(ComponentTextStyle.Regular, null)}\r\n    height: 48px;\r\n    min-width: 96px;\r\n    padding: 0 16px;\r\n  }\r\n\r\n  &.${Size.Large} {\r\n    ${ComponentLStyling(ComponentTextStyle.Regular, null)}\r\n    height: 56px;\r\n    min-width: 144px;\r\n    padding: 0 16px;\r\n  }\r\n`;\r\n\r\n// Add component-specific types\r\nexport interface HorizontalTabProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  /** Required. Size of the Tabs */\r\n  size: Size.XSmall | Size.Small | Size.Medium | Size.Large;\r\n  /** Required: Array of Tabs to show */\r\n  tabs: HorizontalTab[];\r\n  /** Optional. For 'default' variant of tabs if this flag is set, then white background will be added to the tabs  */\r\n  sideFill?: boolean;\r\n  /** Optional. If set, then whole width of the parent container will be equally split between Tabs, otherwise each tab will take width \r\n   * required for its content.\r\n   */\r\n  fullWidth?: boolean;\r\n  /** Required. Handler to be called when user tries to change the tab */\r\n  onTabChange: (to: string) => void;\r\n  /** Optional. Display variant of the tabs. If not set, then 'default' is used */\r\n  variant?: 'default' | 'floating';\r\n}\r\n\r\nexport interface HorizontalTab extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'value' | 'tabIndex' | 'onMouseDown' | 'onClick' | 'style'> {\r\n  /** Required. Value of the tab */\r\n  value: string | React.ReactNode;\r\n  /** Required. State of the tab, selected or not. Use it to set initial state of the tabs. */\r\n  selected: boolean;\r\n  /** Required. URL related with the Tab */\r\n  to: string;\r\n}\r\n\r\nconst HorizontalTabs = ({size, tabs, sideFill, fullWidth, onTabChange, variant, ...rest}: HorizontalTabProps) => {\r\n  /**\r\n   * Informs parent component of tab change and clears focus.\r\n   * @param to - A link to which user should be navigated.\r\n   */\r\n  const doTabChange = (to: string): void => {\r\n    // Let's inform parent component\r\n    onTabChange(to);\r\n\r\n    // Let's clear focus\r\n    if (document.activeElement instanceof HTMLElement) {\r\n      document.activeElement!.blur();\r\n    }\r\n  };\r\n\r\n  const [focused, setFocused] = React.useState<boolean>(false);\r\n  const [currentTab, setCurrentTab] = React.useState<string>();\r\n\r\n  React.useEffect(() => {\r\n    const selectedTab = tabs.find(x => x.selected && !x.disabled);\r\n    if (selectedTab)\r\n      setCurrentTab(selectedTab.to);\r\n  }, [tabs]);\r\n\r\n  const tabListBlur = () => setFocused(false);\r\n\r\n  const tabListFocus = (e: React.FocusEvent<HTMLDivElement, Element>) => setFocused(true);\r\n\r\n  const changeTabInternal = (tab: HorizontalTab) => {\r\n    tab.selected = true;\r\n    tabs.forEach(x => {\r\n      if (x.to != tab.to)\r\n        x.selected = false;\r\n    });\r\n    setCurrentTab(tab.to);\r\n    onTabChange(tab.to);\r\n  }\r\n\r\n  const tabListKeyDown = (e: React.KeyboardEvent) => {\r\n    if (focused && (e.key === 'ArrowLeft' || e.key === 'ArrowRight')) {\r\n      e.preventDefault();\r\n      if (e.key === 'ArrowRight') {\r\n        tabs.forEach((x, i) => {\r\n          if (x.to != currentTab)\r\n            return;\r\n\r\n          for (let j = 1; j < tabs.length - 1; j++) {\r\n            let nextIndex = j + i;\r\n            if (nextIndex > tabs.length - 1)\r\n              nextIndex = nextIndex - tabs.length;\r\n            if (tabs[nextIndex].disabled)\r\n              continue;\r\n            changeTabInternal(tabs[nextIndex]);\r\n            break;\r\n          }\r\n        });\r\n      }\r\n\r\n      if (e.key === 'ArrowLeft') {\r\n        tabs.forEach((x, i) => {\r\n          if (x.to != currentTab)\r\n            return;\r\n\r\n          for (let j = 1; j < tabs.length - 1; j++) {\r\n            let nextIndex = i - j;\r\n            if (nextIndex < 0)\r\n              nextIndex = nextIndex + tabs.length;\r\n            if (tabs[nextIndex].disabled)\r\n              continue;\r\n            changeTabInternal(tabs[nextIndex]);\r\n            break;\r\n          }\r\n        });\r\n      }\r\n    }\r\n  };\r\n\r\n  return (\r\n    <HorizontalTabContainer tabIndex={0} onBlur={tabListBlur} onFocus={tabListFocus} onKeyDown={tabListKeyDown}\r\n                            role=\"tablist\" data-testid={'horizontal-tabs-container'} {...rest}>\r\n      {\r\n        variant !== 'floating' && <TabSideFill tabIndex={-1} className={`${sideFill ? 'fill' : ''}`}/>\r\n      }\r\n      {tabs.map((tab: HorizontalTab, index: number) => {\r\n        const {value, selected, to, disabled, className, ...rest} = tab;\r\n        return (\r\n          <TabButton\r\n            role=\"tab\"\r\n            data-testid={`tab_${value}`}\r\n            key={`${tab}_${index}`}\r\n            aria-selected={selected}\r\n            aria-expanded={selected}\r\n            tabIndex={-1}\r\n            onMouseDown={defaultOnMouseDownHandler}\r\n            style={fullWidth ? {width: `${100 / tabs.length}%`} : {}}\r\n            disabled={disabled}\r\n            className={`${className || ''} ${size} ${variant || 'default'} ${tab.selected ? 'selected' : ''}`}\r\n            onClick={() => !disabled && changeTabInternal(tab)}\r\n            {...rest}>\r\n            {tab.value}\r\n          </TabButton>\r\n        );\r\n      })}\r\n    </HorizontalTabContainer>\r\n  );\r\n};\r\n\r\nexport default HorizontalTabs;\r\n"],"mappings":";;;;;;;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAAQC,IAAI,QAAO,UAAU;;AAE7B;AACA;AACA;AACA,SAAQC,MAAM,EAAEC,kBAAkB,EAAEC,WAAW,QAAO,WAAW;;AAEjE;AACA;AACA;AACA,OAAOC,MAAM,MAAM,mBAAmB;AACtC,SAAQC,iBAAiB,EAAEC,iBAAiB,EAAEC,iBAAiB,EAAEC,kBAAkB,QAAO,WAAW;AACrG,SAAQC,SAAS,QAAO,WAAW;AACnC,SAAQC,yBAAyB,QAAO,WAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAGpD;AACA,MAAMC,sBAAsB,GAAGX,MAAM,CAACY,GAAG;AACzC;AACA;AACA;AACA;AACA;AACA;AACA,MAAMb,WAAW;AACjB;AACA;AACA,CAAC;AAED,MAAMc,WAAW,GAAGb,MAAM,CAACY,GAAG;AAC9B;AACA,6BAA6BE,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AACjF;AACA;AACA;AACA;AACA,kBAAkBF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,OAAO,EAAED,KAAK,CAACE,KAAK,CAAC;AAChE;AACA,CAAC;AAED,MAAMC,SAAS,GAAGjB,MAAM,CAACkB,MAAM;AAC/B,WAAWJ,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAC/D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAeX,SAAS,CAACc,MAAM;AAC/B;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBL,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,OAAO,EAAED,KAAK,CAACE,KAAK,CAAC;AACtE,aAAaF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AACjE;AACA;AACA;AACA,wBAAwBF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,YAAY,EAAED,KAAK,CAACE,KAAK,CAAC;AAC3E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,6BAA6BF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AACjF,8BAA8BF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAClF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAC5E;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwBF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAC5E;AACA;AACA;AACA;AACA,kBAAkBF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,YAAY,EAAED,KAAK,CAACE,KAAK,CAAC;AACrE,aAAaF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AACjE;AACA;AACA;AACA,wBAAwBF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAC5E;AACA;AACA;AACA,kBAAkBF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AACtE,aAAaF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AACjE;AACA;AACA;AACA;AACA,wBAAwBF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AAC5E;AACA;AACA;AACA,aAAaF,KAAK,IAAIjB,MAAM,CAACkB,QAAQ,CAAC,aAAa,EAAED,KAAK,CAACE,KAAK,CAAC;AACjE;AACA;AACA;AACA;AACA;AACA,MAAMpB,IAAI,CAACwB,MAAM;AACjB,MAAMhB,kBAAkB,CAACN,kBAAkB,CAACuB,OAAO,EAAE,IAAI,CAAC;AAC1D;AACA;AACA;AACA;AACA;AACA,MAAMzB,IAAI,CAAC0B,KAAK;AAChB,MAAMnB,iBAAiB,CAACL,kBAAkB,CAACuB,OAAO,EAAE,IAAI,CAAC;AACzD;AACA;AACA;AACA;AACA;AACA,MAAMzB,IAAI,CAAC2B,MAAM;AACjB,MAAMrB,iBAAiB,CAACJ,kBAAkB,CAACuB,OAAO,EAAE,IAAI,CAAC;AACzD;AACA;AACA;AACA;AACA;AACA,MAAMzB,IAAI,CAAC4B,KAAK;AAChB,MAAMvB,iBAAiB,CAACH,kBAAkB,CAACuB,OAAO,EAAE,IAAI,CAAC;AACzD;AACA;AACA;AACA;AACA,CAAC;;AAED;;AA2BA,MAAMI,cAAc,GAAGC,IAAA,IAA0F;EAAA,IAAzF;MAACC,IAAI;MAAEC,IAAI;MAAEC,QAAQ;MAAEC,SAAS;MAAEC,WAAW;MAAEC;IAAoC,CAAC,GAAAN,IAAA;IAAzBO,IAAI,GAAAC,wBAAA,CAAAR,IAAA,EAAAS,SAAA;EACrF;AACF;AACA;AACA;EACE,MAAMC,WAAW,GAAIC,EAAU,IAAW;IACxC;IACAN,WAAW,CAACM,EAAE,CAAC;;IAEf;IACA,IAAIC,QAAQ,CAACC,aAAa,YAAYC,WAAW,EAAE;MACjDF,QAAQ,CAACC,aAAa,CAAEE,IAAI,CAAC,CAAC;IAChC;EACF,CAAC;EAED,MAAM,CAACC,OAAO,EAAEC,UAAU,CAAC,GAAGhD,KAAK,CAACiD,QAAQ,CAAU,KAAK,CAAC;EAC5D,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGnD,KAAK,CAACiD,QAAQ,CAAS,CAAC;EAE5DjD,KAAK,CAACoD,SAAS,CAAC,MAAM;IACpB,MAAMC,WAAW,GAAGpB,IAAI,CAACqB,IAAI,CAACC,CAAC,IAAIA,CAAC,CAACC,QAAQ,IAAI,CAACD,CAAC,CAACE,QAAQ,CAAC;IAC7D,IAAIJ,WAAW,EACbF,aAAa,CAACE,WAAW,CAACX,EAAE,CAAC;EACjC,CAAC,EAAE,CAACT,IAAI,CAAC,CAAC;EAEV,MAAMyB,WAAW,GAAGA,CAAA,KAAMV,UAAU,CAAC,KAAK,CAAC;EAE3C,MAAMW,YAAY,GAAIC,CAA4C,IAAKZ,UAAU,CAAC,IAAI,CAAC;EAEvF,MAAMa,iBAAiB,GAAIC,GAAkB,IAAK;IAChDA,GAAG,CAACN,QAAQ,GAAG,IAAI;IACnBvB,IAAI,CAAC8B,OAAO,CAACR,CAAC,IAAI;MAChB,IAAIA,CAAC,CAACb,EAAE,IAAIoB,GAAG,CAACpB,EAAE,EAChBa,CAAC,CAACC,QAAQ,GAAG,KAAK;IACtB,CAAC,CAAC;IACFL,aAAa,CAACW,GAAG,CAACpB,EAAE,CAAC;IACrBN,WAAW,CAAC0B,GAAG,CAACpB,EAAE,CAAC;EACrB,CAAC;EAED,MAAMsB,cAAc,GAAIJ,CAAsB,IAAK;IACjD,IAAIb,OAAO,KAAKa,CAAC,CAACK,GAAG,KAAK,WAAW,IAAIL,CAAC,CAACK,GAAG,KAAK,YAAY,CAAC,EAAE;MAChEL,CAAC,CAACM,cAAc,CAAC,CAAC;MAClB,IAAIN,CAAC,CAACK,GAAG,KAAK,YAAY,EAAE;QAC1BhC,IAAI,CAAC8B,OAAO,CAAC,CAACR,CAAC,EAAEY,CAAC,KAAK;UACrB,IAAIZ,CAAC,CAACb,EAAE,IAAIQ,UAAU,EACpB;UAEF,KAAK,IAAIkB,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGnC,IAAI,CAACoC,MAAM,GAAG,CAAC,EAAED,CAAC,EAAE,EAAE;YACxC,IAAIE,SAAS,GAAGF,CAAC,GAAGD,CAAC;YACrB,IAAIG,SAAS,GAAGrC,IAAI,CAACoC,MAAM,GAAG,CAAC,EAC7BC,SAAS,GAAGA,SAAS,GAAGrC,IAAI,CAACoC,MAAM;YACrC,IAAIpC,IAAI,CAACqC,SAAS,CAAC,CAACb,QAAQ,EAC1B;YACFI,iBAAiB,CAAC5B,IAAI,CAACqC,SAAS,CAAC,CAAC;YAClC;UACF;QACF,CAAC,CAAC;MACJ;MAEA,IAAIV,CAAC,CAACK,GAAG,KAAK,WAAW,EAAE;QACzBhC,IAAI,CAAC8B,OAAO,CAAC,CAACR,CAAC,EAAEY,CAAC,KAAK;UACrB,IAAIZ,CAAC,CAACb,EAAE,IAAIQ,UAAU,EACpB;UAEF,KAAK,IAAIkB,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGnC,IAAI,CAACoC,MAAM,GAAG,CAAC,EAAED,CAAC,EAAE,EAAE;YACxC,IAAIE,SAAS,GAAGH,CAAC,GAAGC,CAAC;YACrB,IAAIE,SAAS,GAAG,CAAC,EACfA,SAAS,GAAGA,SAAS,GAAGrC,IAAI,CAACoC,MAAM;YACrC,IAAIpC,IAAI,CAACqC,SAAS,CAAC,CAACb,QAAQ,EAC1B;YACFI,iBAAiB,CAAC5B,IAAI,CAACqC,SAAS,CAAC,CAAC;YAClC;UACF;QACF,CAAC,CAAC;MACJ;IACF;EACF,CAAC;EAED,oBACEvD,KAAA,CAACC,sBAAsB,EAAAuD,aAAA,CAAAA,aAAA;IAACC,QAAQ,EAAE,CAAE;IAACC,MAAM,EAAEf,WAAY;IAACgB,OAAO,EAAEf,YAAa;IAACgB,SAAS,EAAEX,cAAe;IACnFY,IAAI,EAAC,SAAS;IAAC,eAAa;EAA4B,GAAKtC,IAAI;IAAAuC,QAAA,GAErFxC,OAAO,KAAK,UAAU,iBAAIxB,IAAA,CAACK,WAAW;MAACsD,QAAQ,EAAE,CAAC,CAAE;MAACM,SAAS,EAAE,GAAG5C,QAAQ,GAAG,MAAM,GAAG,EAAE;IAAG,CAAC,CAAC,EAE/FD,IAAI,CAAC8C,GAAG,CAAC,CAACjB,GAAkB,EAAEkB,KAAa,KAAK;MAC/C,MAAM;UAACC,KAAK;UAAEzB,QAAQ;UAAEd,EAAE;UAAEe,QAAQ;UAAEqB;QAAkB,CAAC,GAAGhB,GAAG;QAAXxB,IAAI,GAAAC,wBAAA,CAAIuB,GAAG,EAAAoB,UAAA;MAC/D,oBACErE,IAAA,CAACS,SAAS,EAAAiD,aAAA,CAAAA,aAAA;QACRK,IAAI,EAAC,KAAK;QACV,eAAa,OAAOK,KAAK,EAAG;QAE5B,iBAAezB,QAAS;QACxB,iBAAeA,QAAS;QACxBgB,QAAQ,EAAE,CAAC,CAAE;QACbW,WAAW,EAAExE,yBAA0B;QACvCyE,KAAK,EAAEjD,SAAS,GAAG;UAACkD,KAAK,EAAE,GAAG,GAAG,GAAGpD,IAAI,CAACoC,MAAM;QAAG,CAAC,GAAG,CAAC,CAAE;QACzDZ,QAAQ,EAAEA,QAAS;QACnBqB,SAAS,EAAE,GAAGA,SAAS,IAAI,EAAE,IAAI9C,IAAI,IAAIK,OAAO,IAAI,SAAS,IAAIyB,GAAG,CAACN,QAAQ,GAAG,UAAU,GAAG,EAAE,EAAG;QAClG8B,OAAO,EAAEA,CAAA,KAAM,CAAC7B,QAAQ,IAAII,iBAAiB,CAACC,GAAG;MAAE,GAC/CxB,IAAI;QAAAuC,QAAA,EACPf,GAAG,CAACmB;MAAK,IAVL,GAAGnB,GAAG,IAAIkB,KAAK,EAWX,CAAC;IAEhB,CAAC,CAAC;EAAA,EACoB,CAAC;AAE7B,CAAC;AAAClD,cAAA,CAAAyD,SAAA;EA/HAtD,IAAI,EAAAuD,GAAA,CAAAC,OAAA,CAAAD,GAAA,CAAAE,KAAA;IAeJT,KAAK,EAAAO,GAAA,CAAAG,SAAA,EAAAH,GAAA,CAAAI,MAAA,EAAAJ,GAAA,CAAAK,IAAA,GAAAC,UAAA;IAELtC,QAAQ,EAAAgC,GAAA,CAAAO,IAAA,CAAAD,UAAA;IAERpD,EAAE,EAAA8C,GAAA,CAAAI,MAAA,CAAAE;EAAA,IAAAA,UAAA;EAjBF5D,QAAQ,EAAAsD,GAAA,CAAAO,IAAA;EAIR5D,SAAS,EAAAqD,GAAA,CAAAO,IAAA;EAET3D,WAAW,EAAAoD,GAAA,CAAAQ,IAAA,CAAAF,UAAA;EAEXzD,OAAO,EAAAmD,GAAA,CAAAS,KAAA,EAAG,SAAS,EAAG,UAAU;AAAA;AAuHlC,eAAenE,cAAc","ignoreList":[]}

package/dist/Tabs/TabLink.cjs

@@ -72,10 +72,7 @@ const Wrapper = _styledComponents.default.div`
 
     font-size: 16px;
     line-height: 120%;
-    color: ${props => _styles.COLORS.generateToken({
-  componentType: 'text',
-  defaultVariant: 'subtle'
-}, props.theme)};
+    color: ${props => _styles.COLORS.getColor('neutral_600', props.theme)};
 
     background-color: ${props => props.$disabled ? _styles.COLORS.getColor('neutral_100', props.theme) : 'transparent'};
     cursor: ${props => props.$disabled ? 'not-allowed' : 'pointer'};

package/dist/Tabs/TabLink.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TabLink.cjs","names":["_react","_interopRequireWildcard","require","React","_styledComponents","_interopRequireDefault","_NotificationDot","_types","_styles","_zIndexes","_common","_HyperLink","_NavigationProvider","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","OptionalLineWrapperWithIcon","styled","div","TopWrapper","TextContainer","StyledNotification","EndLineIcon","OptionalLineWrapper","Wrapper","props","COLORS","generateToken","componentType","defaultVariant","theme","$disabled","getColor","focusStyles","Z_INDEXES","active","hover","TabLink","forwardRef","_ref","ref","href","tabIndex","role","disabled","requiredLine","optionalLine","OptionalLineIcon","onLinkClick","forceDeactivate","testId","showNotificationDot","size","Size","Small","endLineIcon","onActiveStateChanged","variant","children","containerOnMouseEnter","containerOnMouseLeave","className","rest","_objectWithoutProperties2","activeState","setActiveState","useState","useActiveClassName","setUseActiveClassName","currentPath","isActiveRoute","useNavigation","useEffect","jsx","onMouseEnter","onMouseLeave","jsxs","Fragment","HyperLink","target","toString","onMouseDown","defaultOnMouseDownHandler","onClick","NotificationDot","_default","exports"],"sources":["../../src/Tabs/TabLink.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { NotificationDot } from '../NotificationDot';\r\nimport { Size } from '../types';\r\nimport { COLORS, focusStyles } from '../styles';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\nimport { defaultOnMouseDownHandler } from '../common';\r\nimport { useState } from 'react';\r\nimport { HyperLink } from '../HyperLink';\r\nimport { useNavigation } from '../Navigation/NavigationProvider';\r\n\r\nexport type TabLinkProps = {\r\n  disabled?: boolean;\r\n  forceDeactivate?: boolean;\r\n  requiredLine: string;\r\n  optionalLine?: string;\r\n  OptionalLineIcon?: React.ReactNode; //React.FunctionComponent<BaseProps>;\r\n  endLineIcon?: React.ReactNode;\r\n  onLinkClick?: (e: React.MouseEvent) => void;\r\n  testId?: string;\r\n  onActiveStateChanged?: (state: boolean) => void;\r\n  showNotificationDot?: boolean;\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  variant?: 'positive' | 'critical';\r\n  containerOnMouseEnter?: React.MouseEventHandler<HTMLDivElement>;\r\n  containerOnMouseLeave?: React.MouseEventHandler<HTMLDivElement>;\r\n} & React.AnchorHTMLAttributes<HTMLAnchorElement>;\r\n\r\nconst OptionalLineWrapperWithIcon = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  span {\r\n    margin: 0 0 0 4px !important;\r\n    font-size: 12px;\r\n    line-height: 16px;\r\n  }\r\n`;\r\n\r\nconst TopWrapper = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  span:not(:only-child) {\r\n    width: calc(100% - 32px);\r\n  }\r\n`;\r\n\r\nconst TextContainer = styled.div`\r\n  width: 100%;\r\n  margin: auto 0 auto 16px !important;\r\n`;\r\n\r\nconst StyledNotification = styled.div`\r\n  margin: 0 15px 0 0 !important;\r\n`;\r\n\r\nconst EndLineIcon = styled.div`\r\n  margin: 0 15px 0 0 !important;\r\n`;\r\n\r\nconst OptionalLineWrapper = styled.div`\r\n  font-size: 12px;\r\n`;\r\n//replaced styledTabLink because 'className' and 'styled' functions for some reason were not being executed\r\nconst Wrapper = styled.div<{ $disabled: boolean }>`\r\n  position: relative;\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n\r\n    a {\r\n      pointer-events: none;\r\n    }\r\n  }\r\n\r\n  a {\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n\r\n    font-size: 16px;\r\n    line-height: 120%;\r\n    color: ${props => COLORS.generateToken({componentType:'text',defaultVariant:'subtle'}, props.theme)};\r\n\r\n    background-color: ${(props) => (props.$disabled ? COLORS.getColor('neutral_100', props.theme) : 'transparent')};\r\n    cursor: ${(props) => (props.$disabled ? 'not-allowed' : 'pointer')};\r\n    border-left: 1px solid transparent;\r\n    text-decoration: none;\r\n    position: relative;\r\n    border-radius: 2px;\r\n\r\n    &:not(:last-child) {\r\n      margin-bottom: 4px;\r\n    }\r\n\r\n    &:focus {\r\n      ${focusStyles}\r\n    }\r\n\r\n    &.active {\r\n      z-index: ${Z_INDEXES.active};\r\n      background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n\r\n    &.active:hover, &.active.dropdown-hover {\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    }\r\n\r\n    &:hover, &.dropdown-hover {\r\n      z-index: ${Z_INDEXES.hover};\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n\r\n    &:active {\r\n      z-index: ${Z_INDEXES.active};\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n\r\n    &.active {\r\n      &::after {\r\n        position: absolute;\r\n        content: ' ';\r\n        width: 4px;\r\n        top: 6px;\r\n        bottom: 6px;\r\n        left: 3px;\r\n        background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n\r\n        border-radius: 4px;\r\n      }\r\n    }\r\n\r\n    &.active:hover, &.active.dropdown-hover {\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n      }\r\n    }\r\n\r\n    &.active:active {\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n      }\r\n    }\r\n\r\n    &.disabled {\r\n      background-color: ${props => COLORS.getColor('white', props.theme)};\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n\r\n      span {\r\n        color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n      }\r\n\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n      }\r\n    }\r\n  }\r\n`;\r\n\r\nconst TabLink = React.forwardRef<HTMLAnchorElement, TabLinkProps>(({\r\n  href,\r\n  tabIndex,\r\n  role,\r\n  disabled = false,\r\n  requiredLine,\r\n  optionalLine,\r\n  OptionalLineIcon,\r\n  onLinkClick,\r\n  forceDeactivate,\r\n  testId,\r\n  showNotificationDot = false,\r\n  size = Size.Small,\r\n  endLineIcon,\r\n  onActiveStateChanged,\r\n  variant = 'critical',\r\n  children,\r\n  containerOnMouseEnter,\r\n  containerOnMouseLeave,\r\n  className,\r\n  ...rest\r\n}: TabLinkProps, ref) => {\r\n  \r\n  const [activeState, setActiveState] = useState<boolean>(false);\r\n  const [useActiveClassName, setUseActiveClassName] = useState<string>('');\r\n  const {currentPath, isActiveRoute} = useNavigation();\r\n\r\n  React.useEffect(() => {\r\n    setActiveState(!!isActiveRoute && !!href && isActiveRoute(href, true));\r\n  }, [currentPath]);\r\n\r\n  React.useEffect(() => {\r\n    setUseActiveClassName(`${!forceDeactivate && activeState ? 'active' : ''} ${disabled ? 'disabled':''}`);\r\n  }, [activeState, disabled, forceDeactivate]);\r\n\r\n  React.useEffect(() => {\r\n    onActiveStateChanged && onActiveStateChanged(activeState);\r\n  }, [activeState]);\r\n\r\n  return (\r\n    <Wrapper $disabled={disabled} className={disabled ? 'disabled' : ''} onMouseEnter={containerOnMouseEnter} onMouseLeave={containerOnMouseLeave}>\r\n      <>\r\n        <HyperLink\r\n          variant='styleless'\r\n          target='_self'\r\n          href={forceDeactivate ? 'invalid' : href?.toString() ?? ''}\r\n          //disabled={disabled}\r\n          className={useActiveClassName}\r\n          onMouseDown={defaultOnMouseDownHandler}\r\n          tabIndex={disabled ? -1 : 0}\r\n          role=\"tab\"\r\n          aria-selected={activeState}\r\n          onClick={(e: React.MouseEvent) => !disabled && onLinkClick && onLinkClick(e)}\r\n          ref={ref}\r\n          data-testid={testId}\r\n          {...rest}>\r\n          <TextContainer>\r\n            <TopWrapper>\r\n              <span>{requiredLine}</span>\r\n            </TopWrapper>\r\n            {optionalLine && OptionalLineIcon ? (\r\n              <OptionalLineWrapperWithIcon>\r\n                {OptionalLineIcon}\r\n                {!!optionalLine && <span>{optionalLine}</span>}\r\n              </OptionalLineWrapperWithIcon>\r\n            ) : optionalLine ? (\r\n              <OptionalLineWrapper>\r\n                <span>{optionalLine}</span>\r\n              </OptionalLineWrapper>\r\n            ) : (\r\n              <></>\r\n            )}\r\n          </TextContainer>\r\n          <StyledNotification>{showNotificationDot && <NotificationDot testId=\"NotificationDot\" size={size} variant={variant} />}</StyledNotification>\r\n          {endLineIcon && <EndLineIcon>{endLineIcon}</EndLineIcon>}\r\n        </HyperLink>\r\n        {children}\r\n      </>\r\n    </Wrapper>\r\n  );\r\n});\r\n\r\nexport default TabLink;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"TabLink.cjs","names":["_react","_interopRequireWildcard","require","React","_styledComponents","_interopRequireDefault","_NotificationDot","_types","_styles","_zIndexes","_common","_HyperLink","_NavigationProvider","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","OptionalLineWrapperWithIcon","styled","div","TopWrapper","TextContainer","StyledNotification","EndLineIcon","OptionalLineWrapper","Wrapper","props","COLORS","getColor","theme","$disabled","focusStyles","Z_INDEXES","active","hover","TabLink","forwardRef","_ref","ref","href","tabIndex","role","disabled","requiredLine","optionalLine","OptionalLineIcon","onLinkClick","forceDeactivate","testId","showNotificationDot","size","Size","Small","endLineIcon","onActiveStateChanged","variant","children","containerOnMouseEnter","containerOnMouseLeave","className","rest","_objectWithoutProperties2","activeState","setActiveState","useState","useActiveClassName","setUseActiveClassName","currentPath","isActiveRoute","useNavigation","useEffect","jsx","onMouseEnter","onMouseLeave","jsxs","Fragment","HyperLink","target","toString","onMouseDown","defaultOnMouseDownHandler","onClick","NotificationDot","_default","exports"],"sources":["../../src/Tabs/TabLink.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { NotificationDot } from '../NotificationDot';\r\nimport { Size } from '../types';\r\nimport { COLORS, focusStyles } from '../styles';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\nimport { defaultOnMouseDownHandler } from '../common';\r\nimport { useState } from 'react';\r\nimport { HyperLink } from '../HyperLink';\r\nimport { useNavigation } from '../Navigation/NavigationProvider';\r\n\r\nexport type TabLinkProps = {\r\n  disabled?: boolean;\r\n  forceDeactivate?: boolean;\r\n  requiredLine: string;\r\n  optionalLine?: string;\r\n  OptionalLineIcon?: React.ReactNode; //React.FunctionComponent<BaseProps>;\r\n  endLineIcon?: React.ReactNode;\r\n  onLinkClick?: (e: React.MouseEvent) => void;\r\n  testId?: string;\r\n  onActiveStateChanged?: (state: boolean) => void;\r\n  showNotificationDot?: boolean;\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  variant?: 'positive' | 'critical';\r\n  containerOnMouseEnter?: React.MouseEventHandler<HTMLDivElement>;\r\n  containerOnMouseLeave?: React.MouseEventHandler<HTMLDivElement>;\r\n} & React.AnchorHTMLAttributes<HTMLAnchorElement>;\r\n\r\nconst OptionalLineWrapperWithIcon = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  span {\r\n    margin: 0 0 0 4px !important;\r\n    font-size: 12px;\r\n    line-height: 16px;\r\n  }\r\n`;\r\n\r\nconst TopWrapper = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  span:not(:only-child) {\r\n    width: calc(100% - 32px);\r\n  }\r\n`;\r\n\r\nconst TextContainer = styled.div`\r\n  width: 100%;\r\n  margin: auto 0 auto 16px !important;\r\n`;\r\n\r\nconst StyledNotification = styled.div`\r\n  margin: 0 15px 0 0 !important;\r\n`;\r\n\r\nconst EndLineIcon = styled.div`\r\n  margin: 0 15px 0 0 !important;\r\n`;\r\n\r\nconst OptionalLineWrapper = styled.div`\r\n  font-size: 12px;\r\n`;\r\n//replaced styledTabLink because 'className' and 'styled' functions for some reason were not being executed\r\nconst Wrapper = styled.div<{ $disabled: boolean }>`\r\n  position: relative;\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n\r\n    a {\r\n      pointer-events: none;\r\n    }\r\n  }\r\n\r\n  a {\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n\r\n    font-size: 16px;\r\n    line-height: 120%;\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n\r\n    background-color: ${(props) => (props.$disabled ? COLORS.getColor('neutral_100', props.theme) : 'transparent')};\r\n    cursor: ${(props) => (props.$disabled ? 'not-allowed' : 'pointer')};\r\n    border-left: 1px solid transparent;\r\n    text-decoration: none;\r\n    position: relative;\r\n    border-radius: 2px;\r\n\r\n    &:not(:last-child) {\r\n      margin-bottom: 4px;\r\n    }\r\n\r\n    &:focus {\r\n      ${focusStyles}\r\n    }\r\n\r\n    &.active {\r\n      z-index: ${Z_INDEXES.active};\r\n      background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n\r\n    &.active:hover, &.active.dropdown-hover {\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    }\r\n\r\n    &:hover, &.dropdown-hover {\r\n      z-index: ${Z_INDEXES.hover};\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n\r\n    &:active {\r\n      z-index: ${Z_INDEXES.active};\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n\r\n    &.active {\r\n      &::after {\r\n        position: absolute;\r\n        content: ' ';\r\n        width: 4px;\r\n        top: 6px;\r\n        bottom: 6px;\r\n        left: 3px;\r\n        background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n\r\n        border-radius: 4px;\r\n      }\r\n    }\r\n\r\n    &.active:hover, &.active.dropdown-hover {\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n      }\r\n    }\r\n\r\n    &.active:active {\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n      }\r\n    }\r\n\r\n    &.disabled {\r\n      background-color: ${props => COLORS.getColor('white', props.theme)};\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n\r\n      span {\r\n        color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n      }\r\n\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n      }\r\n    }\r\n  }\r\n`;\r\n\r\nconst TabLink = React.forwardRef<HTMLAnchorElement, TabLinkProps>(({\r\n  href,\r\n  tabIndex,\r\n  role,\r\n  disabled = false,\r\n  requiredLine,\r\n  optionalLine,\r\n  OptionalLineIcon,\r\n  onLinkClick,\r\n  forceDeactivate,\r\n  testId,\r\n  showNotificationDot = false,\r\n  size = Size.Small,\r\n  endLineIcon,\r\n  onActiveStateChanged,\r\n  variant = 'critical',\r\n  children,\r\n  containerOnMouseEnter,\r\n  containerOnMouseLeave,\r\n  className,\r\n  ...rest\r\n}: TabLinkProps, ref) => {\r\n  \r\n  const [activeState, setActiveState] = useState<boolean>(false);\r\n  const [useActiveClassName, setUseActiveClassName] = useState<string>('');\r\n  const {currentPath, isActiveRoute} = useNavigation();\r\n\r\n  React.useEffect(() => {\r\n    setActiveState(!!isActiveRoute && !!href && isActiveRoute(href, true));\r\n  }, [currentPath]);\r\n\r\n  React.useEffect(() => {\r\n    setUseActiveClassName(`${!forceDeactivate && activeState ? 'active' : ''} ${disabled ? 'disabled':''}`);\r\n  }, [activeState, disabled, forceDeactivate]);\r\n\r\n  React.useEffect(() => {\r\n    onActiveStateChanged && onActiveStateChanged(activeState);\r\n  }, [activeState]);\r\n\r\n  return (\r\n    <Wrapper $disabled={disabled} className={disabled ? 'disabled' : ''} onMouseEnter={containerOnMouseEnter} onMouseLeave={containerOnMouseLeave}>\r\n      <>\r\n        <HyperLink\r\n          variant='styleless'\r\n          target='_self'\r\n          href={forceDeactivate ? 'invalid' : href?.toString() ?? ''}\r\n          //disabled={disabled}\r\n          className={useActiveClassName}\r\n          onMouseDown={defaultOnMouseDownHandler}\r\n          tabIndex={disabled ? -1 : 0}\r\n          role=\"tab\"\r\n          aria-selected={activeState}\r\n          onClick={(e: React.MouseEvent) => !disabled && onLinkClick && onLinkClick(e)}\r\n          ref={ref}\r\n          data-testid={testId}\r\n          {...rest}>\r\n          <TextContainer>\r\n            <TopWrapper>\r\n              <span>{requiredLine}</span>\r\n            </TopWrapper>\r\n            {optionalLine && OptionalLineIcon ? (\r\n              <OptionalLineWrapperWithIcon>\r\n                {OptionalLineIcon}\r\n                {!!optionalLine && <span>{optionalLine}</span>}\r\n              </OptionalLineWrapperWithIcon>\r\n            ) : optionalLine ? (\r\n              <OptionalLineWrapper>\r\n                <span>{optionalLine}</span>\r\n              </OptionalLineWrapper>\r\n            ) : (\r\n              <></>\r\n            )}\r\n          </TextContainer>\r\n          <StyledNotification>{showNotificationDot && <NotificationDot testId=\"NotificationDot\" size={size} variant={variant} />}</StyledNotification>\r\n          {endLineIcon && <EndLineIcon>{endLineIcon}</EndLineIcon>}\r\n        </HyperLink>\r\n        {children}\r\n      </>\r\n    </Wrapper>\r\n  );\r\n});\r\n\r\nexport default TabLink;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Tabs/TabLink.js

@@ -63,10 +63,7 @@ const Wrapper = styled.div`
 
     font-size: 16px;
     line-height: 120%;
-    color: ${props => COLORS.generateToken({
-  componentType: 'text',
-  defaultVariant: 'subtle'
-}, props.theme)};
+    color: ${props => COLORS.getColor('neutral_600', props.theme)};
 
     background-color: ${props => props.$disabled ? COLORS.getColor('neutral_100', props.theme) : 'transparent'};
     cursor: ${props => props.$disabled ? 'not-allowed' : 'pointer'};

package/dist/Tabs/TabLink.js.map

@@ -1 +1 @@
-{"version":3,"file":"TabLink.js","names":["React","styled","NotificationDot","Size","COLORS","focusStyles","Z_INDEXES","defaultOnMouseDownHandler","useState","HyperLink","useNavigation","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","OptionalLineWrapperWithIcon","div","TopWrapper","TextContainer","StyledNotification","EndLineIcon","OptionalLineWrapper","Wrapper","props","generateToken","componentType","defaultVariant","theme","$disabled","getColor","active","hover","TabLink","forwardRef","_ref","ref","href","tabIndex","role","disabled","requiredLine","optionalLine","OptionalLineIcon","onLinkClick","forceDeactivate","testId","showNotificationDot","size","Small","endLineIcon","onActiveStateChanged","variant","children","containerOnMouseEnter","containerOnMouseLeave","className","rest","_objectWithoutProperties","_excluded","activeState","setActiveState","useActiveClassName","setUseActiveClassName","currentPath","isActiveRoute","useEffect","onMouseEnter","onMouseLeave","_objectSpread","target","toString","onMouseDown","onClick","e"],"sources":["../../src/Tabs/TabLink.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { NotificationDot } from '../NotificationDot';\r\nimport { Size } from '../types';\r\nimport { COLORS, focusStyles } from '../styles';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\nimport { defaultOnMouseDownHandler } from '../common';\r\nimport { useState } from 'react';\r\nimport { HyperLink } from '../HyperLink';\r\nimport { useNavigation } from '../Navigation/NavigationProvider';\r\n\r\nexport type TabLinkProps = {\r\n  disabled?: boolean;\r\n  forceDeactivate?: boolean;\r\n  requiredLine: string;\r\n  optionalLine?: string;\r\n  OptionalLineIcon?: React.ReactNode; //React.FunctionComponent<BaseProps>;\r\n  endLineIcon?: React.ReactNode;\r\n  onLinkClick?: (e: React.MouseEvent) => void;\r\n  testId?: string;\r\n  onActiveStateChanged?: (state: boolean) => void;\r\n  showNotificationDot?: boolean;\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  variant?: 'positive' | 'critical';\r\n  containerOnMouseEnter?: React.MouseEventHandler<HTMLDivElement>;\r\n  containerOnMouseLeave?: React.MouseEventHandler<HTMLDivElement>;\r\n} & React.AnchorHTMLAttributes<HTMLAnchorElement>;\r\n\r\nconst OptionalLineWrapperWithIcon = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  span {\r\n    margin: 0 0 0 4px !important;\r\n    font-size: 12px;\r\n    line-height: 16px;\r\n  }\r\n`;\r\n\r\nconst TopWrapper = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  span:not(:only-child) {\r\n    width: calc(100% - 32px);\r\n  }\r\n`;\r\n\r\nconst TextContainer = styled.div`\r\n  width: 100%;\r\n  margin: auto 0 auto 16px !important;\r\n`;\r\n\r\nconst StyledNotification = styled.div`\r\n  margin: 0 15px 0 0 !important;\r\n`;\r\n\r\nconst EndLineIcon = styled.div`\r\n  margin: 0 15px 0 0 !important;\r\n`;\r\n\r\nconst OptionalLineWrapper = styled.div`\r\n  font-size: 12px;\r\n`;\r\n//replaced styledTabLink because 'className' and 'styled' functions for some reason were not being executed\r\nconst Wrapper = styled.div<{ $disabled: boolean }>`\r\n  position: relative;\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n\r\n    a {\r\n      pointer-events: none;\r\n    }\r\n  }\r\n\r\n  a {\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n\r\n    font-size: 16px;\r\n    line-height: 120%;\r\n    color: ${props => COLORS.generateToken({componentType:'text',defaultVariant:'subtle'}, props.theme)};\r\n\r\n    background-color: ${(props) => (props.$disabled ? COLORS.getColor('neutral_100', props.theme) : 'transparent')};\r\n    cursor: ${(props) => (props.$disabled ? 'not-allowed' : 'pointer')};\r\n    border-left: 1px solid transparent;\r\n    text-decoration: none;\r\n    position: relative;\r\n    border-radius: 2px;\r\n\r\n    &:not(:last-child) {\r\n      margin-bottom: 4px;\r\n    }\r\n\r\n    &:focus {\r\n      ${focusStyles}\r\n    }\r\n\r\n    &.active {\r\n      z-index: ${Z_INDEXES.active};\r\n      background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n\r\n    &.active:hover, &.active.dropdown-hover {\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    }\r\n\r\n    &:hover, &.dropdown-hover {\r\n      z-index: ${Z_INDEXES.hover};\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n\r\n    &:active {\r\n      z-index: ${Z_INDEXES.active};\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n\r\n    &.active {\r\n      &::after {\r\n        position: absolute;\r\n        content: ' ';\r\n        width: 4px;\r\n        top: 6px;\r\n        bottom: 6px;\r\n        left: 3px;\r\n        background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n\r\n        border-radius: 4px;\r\n      }\r\n    }\r\n\r\n    &.active:hover, &.active.dropdown-hover {\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n      }\r\n    }\r\n\r\n    &.active:active {\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n      }\r\n    }\r\n\r\n    &.disabled {\r\n      background-color: ${props => COLORS.getColor('white', props.theme)};\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n\r\n      span {\r\n        color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n      }\r\n\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n      }\r\n    }\r\n  }\r\n`;\r\n\r\nconst TabLink = React.forwardRef<HTMLAnchorElement, TabLinkProps>(({\r\n  href,\r\n  tabIndex,\r\n  role,\r\n  disabled = false,\r\n  requiredLine,\r\n  optionalLine,\r\n  OptionalLineIcon,\r\n  onLinkClick,\r\n  forceDeactivate,\r\n  testId,\r\n  showNotificationDot = false,\r\n  size = Size.Small,\r\n  endLineIcon,\r\n  onActiveStateChanged,\r\n  variant = 'critical',\r\n  children,\r\n  containerOnMouseEnter,\r\n  containerOnMouseLeave,\r\n  className,\r\n  ...rest\r\n}: TabLinkProps, ref) => {\r\n  \r\n  const [activeState, setActiveState] = useState<boolean>(false);\r\n  const [useActiveClassName, setUseActiveClassName] = useState<string>('');\r\n  const {currentPath, isActiveRoute} = useNavigation();\r\n\r\n  React.useEffect(() => {\r\n    setActiveState(!!isActiveRoute && !!href && isActiveRoute(href, true));\r\n  }, [currentPath]);\r\n\r\n  React.useEffect(() => {\r\n    setUseActiveClassName(`${!forceDeactivate && activeState ? 'active' : ''} ${disabled ? 'disabled':''}`);\r\n  }, [activeState, disabled, forceDeactivate]);\r\n\r\n  React.useEffect(() => {\r\n    onActiveStateChanged && onActiveStateChanged(activeState);\r\n  }, [activeState]);\r\n\r\n  return (\r\n    <Wrapper $disabled={disabled} className={disabled ? 'disabled' : ''} onMouseEnter={containerOnMouseEnter} onMouseLeave={containerOnMouseLeave}>\r\n      <>\r\n        <HyperLink\r\n          variant='styleless'\r\n          target='_self'\r\n          href={forceDeactivate ? 'invalid' : href?.toString() ?? ''}\r\n          //disabled={disabled}\r\n          className={useActiveClassName}\r\n          onMouseDown={defaultOnMouseDownHandler}\r\n          tabIndex={disabled ? -1 : 0}\r\n          role=\"tab\"\r\n          aria-selected={activeState}\r\n          onClick={(e: React.MouseEvent) => !disabled && onLinkClick && onLinkClick(e)}\r\n          ref={ref}\r\n          data-testid={testId}\r\n          {...rest}>\r\n          <TextContainer>\r\n            <TopWrapper>\r\n              <span>{requiredLine}</span>\r\n            </TopWrapper>\r\n            {optionalLine && OptionalLineIcon ? (\r\n              <OptionalLineWrapperWithIcon>\r\n                {OptionalLineIcon}\r\n                {!!optionalLine && <span>{optionalLine}</span>}\r\n              </OptionalLineWrapperWithIcon>\r\n            ) : optionalLine ? (\r\n              <OptionalLineWrapper>\r\n                <span>{optionalLine}</span>\r\n              </OptionalLineWrapper>\r\n            ) : (\r\n              <></>\r\n            )}\r\n          </TextContainer>\r\n          <StyledNotification>{showNotificationDot && <NotificationDot testId=\"NotificationDot\" size={size} variant={variant} />}</StyledNotification>\r\n          {endLineIcon && <EndLineIcon>{endLineIcon}</EndLineIcon>}\r\n        </HyperLink>\r\n        {children}\r\n      </>\r\n    </Wrapper>\r\n  );\r\n});\r\n\r\nexport default TabLink;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"TabLink.js","names":["React","styled","NotificationDot","Size","COLORS","focusStyles","Z_INDEXES","defaultOnMouseDownHandler","useState","HyperLink","useNavigation","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","OptionalLineWrapperWithIcon","div","TopWrapper","TextContainer","StyledNotification","EndLineIcon","OptionalLineWrapper","Wrapper","props","getColor","theme","$disabled","active","hover","TabLink","forwardRef","_ref","ref","href","tabIndex","role","disabled","requiredLine","optionalLine","OptionalLineIcon","onLinkClick","forceDeactivate","testId","showNotificationDot","size","Small","endLineIcon","onActiveStateChanged","variant","children","containerOnMouseEnter","containerOnMouseLeave","className","rest","_objectWithoutProperties","_excluded","activeState","setActiveState","useActiveClassName","setUseActiveClassName","currentPath","isActiveRoute","useEffect","onMouseEnter","onMouseLeave","_objectSpread","target","toString","onMouseDown","onClick","e"],"sources":["../../src/Tabs/TabLink.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { NotificationDot } from '../NotificationDot';\r\nimport { Size } from '../types';\r\nimport { COLORS, focusStyles } from '../styles';\r\nimport { Z_INDEXES } from '../styles/z-indexes';\r\nimport { defaultOnMouseDownHandler } from '../common';\r\nimport { useState } from 'react';\r\nimport { HyperLink } from '../HyperLink';\r\nimport { useNavigation } from '../Navigation/NavigationProvider';\r\n\r\nexport type TabLinkProps = {\r\n  disabled?: boolean;\r\n  forceDeactivate?: boolean;\r\n  requiredLine: string;\r\n  optionalLine?: string;\r\n  OptionalLineIcon?: React.ReactNode; //React.FunctionComponent<BaseProps>;\r\n  endLineIcon?: React.ReactNode;\r\n  onLinkClick?: (e: React.MouseEvent) => void;\r\n  testId?: string;\r\n  onActiveStateChanged?: (state: boolean) => void;\r\n  showNotificationDot?: boolean;\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  variant?: 'positive' | 'critical';\r\n  containerOnMouseEnter?: React.MouseEventHandler<HTMLDivElement>;\r\n  containerOnMouseLeave?: React.MouseEventHandler<HTMLDivElement>;\r\n} & React.AnchorHTMLAttributes<HTMLAnchorElement>;\r\n\r\nconst OptionalLineWrapperWithIcon = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  span {\r\n    margin: 0 0 0 4px !important;\r\n    font-size: 12px;\r\n    line-height: 16px;\r\n  }\r\n`;\r\n\r\nconst TopWrapper = styled.div`\r\n  display: flex;\r\n  flex-direction: row;\r\n\r\n  span:not(:only-child) {\r\n    width: calc(100% - 32px);\r\n  }\r\n`;\r\n\r\nconst TextContainer = styled.div`\r\n  width: 100%;\r\n  margin: auto 0 auto 16px !important;\r\n`;\r\n\r\nconst StyledNotification = styled.div`\r\n  margin: 0 15px 0 0 !important;\r\n`;\r\n\r\nconst EndLineIcon = styled.div`\r\n  margin: 0 15px 0 0 !important;\r\n`;\r\n\r\nconst OptionalLineWrapper = styled.div`\r\n  font-size: 12px;\r\n`;\r\n//replaced styledTabLink because 'className' and 'styled' functions for some reason were not being executed\r\nconst Wrapper = styled.div<{ $disabled: boolean }>`\r\n  position: relative;\r\n  &.disabled {\r\n    cursor: not-allowed;\r\n\r\n    a {\r\n      pointer-events: none;\r\n    }\r\n  }\r\n\r\n  a {\r\n    display: flex;\r\n    flex-direction: row;\r\n    align-items: center;\r\n\r\n    font-size: 16px;\r\n    line-height: 120%;\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n\r\n    background-color: ${(props) => (props.$disabled ? COLORS.getColor('neutral_100', props.theme) : 'transparent')};\r\n    cursor: ${(props) => (props.$disabled ? 'not-allowed' : 'pointer')};\r\n    border-left: 1px solid transparent;\r\n    text-decoration: none;\r\n    position: relative;\r\n    border-radius: 2px;\r\n\r\n    &:not(:last-child) {\r\n      margin-bottom: 4px;\r\n    }\r\n\r\n    &:focus {\r\n      ${focusStyles}\r\n    }\r\n\r\n    &.active {\r\n      z-index: ${Z_INDEXES.active};\r\n      background-color: ${props => COLORS.getColor('neutral_20', props.theme)};\r\n    }\r\n\r\n    &.active:hover, &.active.dropdown-hover {\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n    }\r\n\r\n    &:hover, &.dropdown-hover {\r\n      z-index: ${Z_INDEXES.hover};\r\n      background-color: ${props => COLORS.getColor('primary_20', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n    }\r\n\r\n    &:active {\r\n      z-index: ${Z_INDEXES.active};\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n      color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n    }\r\n\r\n    &.active {\r\n      &::after {\r\n        position: absolute;\r\n        content: ' ';\r\n        width: 4px;\r\n        top: 6px;\r\n        bottom: 6px;\r\n        left: 3px;\r\n        background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n\r\n        border-radius: 4px;\r\n      }\r\n    }\r\n\r\n    &.active:hover, &.active.dropdown-hover {\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('primary_600', props.theme)};\r\n      }\r\n    }\r\n\r\n    &.active:active {\r\n      background-color: ${props => COLORS.getColor('primary_100', props.theme)};\r\n\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('primary_800', props.theme)};\r\n      }\r\n    }\r\n\r\n    &.disabled {\r\n      background-color: ${props => COLORS.getColor('white', props.theme)};\r\n      color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n\r\n      span {\r\n        color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n      }\r\n\r\n      &::after {\r\n        background-color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n      }\r\n    }\r\n  }\r\n`;\r\n\r\nconst TabLink = React.forwardRef<HTMLAnchorElement, TabLinkProps>(({\r\n  href,\r\n  tabIndex,\r\n  role,\r\n  disabled = false,\r\n  requiredLine,\r\n  optionalLine,\r\n  OptionalLineIcon,\r\n  onLinkClick,\r\n  forceDeactivate,\r\n  testId,\r\n  showNotificationDot = false,\r\n  size = Size.Small,\r\n  endLineIcon,\r\n  onActiveStateChanged,\r\n  variant = 'critical',\r\n  children,\r\n  containerOnMouseEnter,\r\n  containerOnMouseLeave,\r\n  className,\r\n  ...rest\r\n}: TabLinkProps, ref) => {\r\n  \r\n  const [activeState, setActiveState] = useState<boolean>(false);\r\n  const [useActiveClassName, setUseActiveClassName] = useState<string>('');\r\n  const {currentPath, isActiveRoute} = useNavigation();\r\n\r\n  React.useEffect(() => {\r\n    setActiveState(!!isActiveRoute && !!href && isActiveRoute(href, true));\r\n  }, [currentPath]);\r\n\r\n  React.useEffect(() => {\r\n    setUseActiveClassName(`${!forceDeactivate && activeState ? 'active' : ''} ${disabled ? 'disabled':''}`);\r\n  }, [activeState, disabled, forceDeactivate]);\r\n\r\n  React.useEffect(() => {\r\n    onActiveStateChanged && onActiveStateChanged(activeState);\r\n  }, [activeState]);\r\n\r\n  return (\r\n    <Wrapper $disabled={disabled} className={disabled ? 'disabled' : ''} onMouseEnter={containerOnMouseEnter} onMouseLeave={containerOnMouseLeave}>\r\n      <>\r\n        <HyperLink\r\n          variant='styleless'\r\n          target='_self'\r\n          href={forceDeactivate ? 'invalid' : href?.toString() ?? ''}\r\n          //disabled={disabled}\r\n          className={useActiveClassName}\r\n          onMouseDown={defaultOnMouseDownHandler}\r\n          tabIndex={disabled ? -1 : 0}\r\n          role=\"tab\"\r\n          aria-selected={activeState}\r\n          onClick={(e: React.MouseEvent) => !disabled && onLinkClick && onLinkClick(e)}\r\n          ref={ref}\r\n          data-testid={testId}\r\n          {...rest}>\r\n          <TextContainer>\r\n            <TopWrapper>\r\n              <span>{requiredLine}</span>\r\n            </TopWrapper>\r\n            {optionalLine && OptionalLineIcon ? (\r\n              <OptionalLineWrapperWithIcon>\r\n                {OptionalLineIcon}\r\n                {!!optionalLine && <span>{optionalLine}</span>}\r\n              </OptionalLineWrapperWithIcon>\r\n            ) : optionalLine ? (\r\n              <OptionalLineWrapper>\r\n                <span>{optionalLine}</span>\r\n              </OptionalLineWrapper>\r\n            ) : (\r\n              <></>\r\n            )}\r\n          </TextContainer>\r\n          <StyledNotification>{showNotificationDot && <NotificationDot testId=\"NotificationDot\" size={size} variant={variant} />}</StyledNotification>\r\n          {endLineIcon && <EndLineIcon>{endLineIcon}</EndLineIcon>}\r\n        </HyperLink>\r\n        {children}\r\n      </>\r\n    </Wrapper>\r\n  );\r\n});\r\n\r\nexport default TabLink;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Tabs/VerticalTabs.cjs

@@ -33,7 +33,6 @@ const VerticalTabs = _ref => {
       onLinkClick: e => {
         if (entry.onClick) {
           entry.onClick(e);
-          e.preventDefault && e.preventDefault();
         }
       }
     }, entry.to))

package/dist/Tabs/VerticalTabs.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalTabs.cjs","names":["React","_interopRequireWildcard","require","_Tabs","_interopRequireDefault","_TabLink","_types","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","VerticalTabs","_ref","size","entries","jsx","Size","Large","children","map","entry","href","to","requiredLine","optionalLine","endLineIcon","OptionalLineIcon","optionalLineIcon","disabled","showNotificationDot","variant","onLinkClick","onClick","preventDefault","propTypes","_propTypes","arrayOf","shape","string","isRequired","node","bool","func","oneOf","_default","exports"],"sources":["../../src/Tabs/VerticalTabs.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport Tabs from './Tabs';\r\nimport TabLink from './TabLink';\r\nimport { BaseProps } from '../icons';\r\nimport { Size } from '../types';\r\n\r\nexport interface VerticalTabEntry {\r\n  /**\r\n   * Required. The main text to be displayed on the tab.\r\n   */\r\n  requiredLine: string;\r\n\r\n  /**\r\n   * Optional. The secondary text to be displayed on the tab link under the required line.\r\n   */\r\n  optionalLine?: string;\r\n\r\n  /**\r\n   * Optional. The icon to be displayed next to the secondary text on the tab link under the required line.\r\n   */\r\n  optionalLineIcon?: React.ReactNode;\r\n\r\n  /**\r\n   * Optional. The icon to be displayed at the end of the tab.\r\n   */\r\n  endLineIcon?: React.ReactNode;\r\n\r\n  /**\r\n   * Required. The URL to which the tab links.\r\n   */\r\n  to: string;\r\n\r\n  /**\r\n   * Optional. A boolean indicating whether the tab is disabled.\r\n   * If true, the tab will be unclickable and will have a disabled appearance.\r\n   */\r\n  disabled?: boolean;\r\n\r\n  /**\r\n   * Optional. The handler function to be called when the tab is clicked.\r\n   */\r\n  onClick?: (e: React.MouseEvent) => void;\r\n\r\n  /**\r\n   * Optional. A boolean indicating whether a notification dot should be shown on the tab.\r\n   */\r\n  showNotificationDot?: boolean;\r\n\r\n  /**\r\n   * Optional. The variant of the notification dot. It can be 'critical' or 'positive'. Defaults to 'Critical'\r\n   */\r\n  variant?: 'critical' | 'positive';\r\n}\r\n\r\nexport interface VerticalTabsProps {\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  entries: VerticalTabEntry[];\r\n}\r\n\r\nconst VerticalTabs = ({ size, entries }: VerticalTabsProps) => {\r\n  return (\r\n    <Tabs size={size ?? Size.Large}>\r\n      {entries?.map((entry: VerticalTabEntry) => (\r\n        <TabLink\r\n          key={entry.to}\r\n          href={entry.to}\r\n          requiredLine={entry.requiredLine}\r\n          optionalLine={entry.optionalLine}\r\n          endLineIcon={entry.endLineIcon}\r\n          OptionalLineIcon={entry.optionalLineIcon}\r\n          disabled={entry.disabled}\r\n          showNotificationDot={entry.showNotificationDot}\r\n          size={size}\r\n          variant={entry.variant}\r\n          onLinkClick={(e) => {\r\n            if (entry.onClick) {\r\n              entry.onClick(e);\r\n              e.preventDefault && e.preventDefault();\r\n            }\r\n          }}/>\r\n      ))}\r\n    </Tabs>\r\n  );\r\n};\r\n\r\nexport default VerticalTabs;\r\n"],"mappings":";;;;;;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,QAAA,GAAAD,sBAAA,CAAAF,OAAA;AAEA,IAAAI,MAAA,GAAAJ,OAAA;AAAgC,IAAAK,WAAA,GAAAL,OAAA;AAAA,SAAAM,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAR,wBAAAQ,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAuDhC,MAAMW,YAAY,GAAGC,IAAA,IAA0C;EAAA,IAAzC;IAAEC,IAAI;IAAEC;EAA2B,CAAC,GAAAF,IAAA;EACxD,oBACE,IAAAtB,WAAA,CAAAyB,GAAA,EAAC7B,KAAA,CAAAW,OAAI;IAACgB,IAAI,EAAEA,IAAI,IAAIG,WAAI,CAACC,KAAM;IAAAC,QAAA,EAC5BJ,OAAO,EAAEK,GAAG,CAAEC,KAAuB,iBACpC,IAAA9B,WAAA,CAAAyB,GAAA,EAAC3B,QAAA,CAAAS,OAAO;MAENwB,IAAI,EAAED,KAAK,CAACE,EAAG;MACfC,YAAY,EAAEH,KAAK,CAACG,YAAa;MACjCC,YAAY,EAAEJ,KAAK,CAACI,YAAa;MACjCC,WAAW,EAAEL,KAAK,CAACK,WAAY;MAC/BC,gBAAgB,EAAEN,KAAK,CAACO,gBAAiB;MACzCC,QAAQ,EAAER,KAAK,CAACQ,QAAS;MACzBC,mBAAmB,EAAET,KAAK,CAACS,mBAAoB;MAC/ChB,IAAI,EAAEA,IAAK;MACXiB,OAAO,EAAEV,KAAK,CAACU,OAAQ;MACvBC,WAAW,EAAGvC,CAAC,IAAK;QAClB,IAAI4B,KAAK,CAACY,OAAO,EAAE;UACjBZ,KAAK,CAACY,OAAO,CAACxC,CAAC,CAAC;UAChBA,CAAC,CAACyC,cAAc,IAAIzC,CAAC,CAACyC,cAAc,CAAC,CAAC;QACxC;MACF;IAAE,GAfGb,KAAK,CAACE,EAeR,CACN;EAAC,CACE,CAAC;AAEX,CAAC;AAACX,YAAA,CAAAuB,SAAA;EA3BApB,OAAO,EAAAqB,UAAA,CAAAtC,OAAA,CAAAuC,OAAA,CAAAD,UAAA,CAAAtC,OAAA,CAAAwC,KAAA;IA9CPd,YAAY,EAAAY,UAAA,CAAAtC,OAAA,CAAAyC,MAAA,CAAAC,UAAA;IAKZf,YAAY,EAAAW,UAAA,CAAAtC,OAAA,CAAAyC,MAAA;IAKZX,gBAAgB,EAAAQ,UAAA,CAAAtC,OAAA,CAAA2C,IAAA;IAKhBf,WAAW,EAAAU,UAAA,CAAAtC,OAAA,CAAA2C,IAAA;IAKXlB,EAAE,EAAAa,UAAA,CAAAtC,OAAA,CAAAyC,MAAA,CAAAC,UAAA;IAMFX,QAAQ,EAAAO,UAAA,CAAAtC,OAAA,CAAA4C,IAAA;IAKRT,OAAO,EAAAG,UAAA,CAAAtC,OAAA,CAAA6C,IAAA;IAKPb,mBAAmB,EAAAM,UAAA,CAAAtC,OAAA,CAAA4C,IAAA;IAKnBX,OAAO,EAAAK,UAAA,CAAAtC,OAAA,CAAA8C,KAAA,EAAG,UAAU,EAAG,UAAU;EAAA,IAAAJ;AAAA;AAAA,IAAAK,QAAA,GAAAC,OAAA,CAAAhD,OAAA,GAkCpBc,YAAY","ignoreList":[]}
+{"version":3,"file":"VerticalTabs.cjs","names":["React","_interopRequireWildcard","require","_Tabs","_interopRequireDefault","_TabLink","_types","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","VerticalTabs","_ref","size","entries","jsx","Size","Large","children","map","entry","href","to","requiredLine","optionalLine","endLineIcon","OptionalLineIcon","optionalLineIcon","disabled","showNotificationDot","variant","onLinkClick","onClick","propTypes","_propTypes","arrayOf","shape","string","isRequired","node","bool","func","oneOf","_default","exports"],"sources":["../../src/Tabs/VerticalTabs.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport Tabs from './Tabs';\r\nimport TabLink from './TabLink';\r\nimport { BaseProps } from '../icons';\r\nimport { Size } from '../types';\r\n\r\nexport interface VerticalTabEntry {\r\n  /**\r\n   * Required. The main text to be displayed on the tab.\r\n   */\r\n  requiredLine: string;\r\n\r\n  /**\r\n   * Optional. The secondary text to be displayed on the tab link under the required line.\r\n   */\r\n  optionalLine?: string;\r\n\r\n  /**\r\n   * Optional. The icon to be displayed next to the secondary text on the tab link under the required line.\r\n   */\r\n  optionalLineIcon?: React.ReactNode;\r\n\r\n  /**\r\n   * Optional. The icon to be displayed at the end of the tab.\r\n   */\r\n  endLineIcon?: React.ReactNode;\r\n\r\n  /**\r\n   * Required. The URL to which the tab links.\r\n   */\r\n  to: string;\r\n\r\n  /**\r\n   * Optional. A boolean indicating whether the tab is disabled.\r\n   * If true, the tab will be unclickable and will have a disabled appearance.\r\n   */\r\n  disabled?: boolean;\r\n\r\n  /**\r\n   * Optional. The handler function to be called when the tab is clicked.\r\n   */\r\n  onClick?: (e: React.MouseEvent) => void;\r\n\r\n  /**\r\n   * Optional. A boolean indicating whether a notification dot should be shown on the tab.\r\n   */\r\n  showNotificationDot?: boolean;\r\n\r\n  /**\r\n   * Optional. The variant of the notification dot. It can be 'critical' or 'positive'. Defaults to 'Critical'\r\n   */\r\n  variant?: 'critical' | 'positive';\r\n}\r\n\r\nexport interface VerticalTabsProps {\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  entries: VerticalTabEntry[];\r\n}\r\n\r\nconst VerticalTabs = ({ size, entries }: VerticalTabsProps) => {\r\n  return (\r\n    <Tabs size={size ?? Size.Large}>\r\n      {entries?.map((entry: VerticalTabEntry) => (\r\n        <TabLink\r\n          key={entry.to}\r\n          href={entry.to}\r\n          requiredLine={entry.requiredLine}\r\n          optionalLine={entry.optionalLine}\r\n          endLineIcon={entry.endLineIcon}\r\n          OptionalLineIcon={entry.optionalLineIcon}\r\n          disabled={entry.disabled}\r\n          showNotificationDot={entry.showNotificationDot}\r\n          size={size}\r\n          variant={entry.variant}\r\n          onLinkClick={(e) => {\r\n            if (entry.onClick) {\r\n              entry.onClick(e);\r\n            }\r\n          }}/>\r\n      ))}\r\n    </Tabs>\r\n  );\r\n};\r\n\r\nexport default VerticalTabs;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Tabs/VerticalTabs.js

@@ -24,7 +24,6 @@ const VerticalTabs = _ref => {
       onLinkClick: e => {
         if (entry.onClick) {
           entry.onClick(e);
-          e.preventDefault && e.preventDefault();
         }
       }
     }, entry.to))

package/dist/Tabs/VerticalTabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"VerticalTabs.js","names":["React","Tabs","TabLink","Size","jsx","_jsx","VerticalTabs","_ref","size","entries","Large","children","map","entry","href","to","requiredLine","optionalLine","endLineIcon","OptionalLineIcon","optionalLineIcon","disabled","showNotificationDot","variant","onLinkClick","e","onClick","preventDefault","propTypes","_pt","arrayOf","shape","string","isRequired","node","bool","func","oneOf"],"sources":["../../src/Tabs/VerticalTabs.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport Tabs from './Tabs';\r\nimport TabLink from './TabLink';\r\nimport { BaseProps } from '../icons';\r\nimport { Size } from '../types';\r\n\r\nexport interface VerticalTabEntry {\r\n  /**\r\n   * Required. The main text to be displayed on the tab.\r\n   */\r\n  requiredLine: string;\r\n\r\n  /**\r\n   * Optional. The secondary text to be displayed on the tab link under the required line.\r\n   */\r\n  optionalLine?: string;\r\n\r\n  /**\r\n   * Optional. The icon to be displayed next to the secondary text on the tab link under the required line.\r\n   */\r\n  optionalLineIcon?: React.ReactNode;\r\n\r\n  /**\r\n   * Optional. The icon to be displayed at the end of the tab.\r\n   */\r\n  endLineIcon?: React.ReactNode;\r\n\r\n  /**\r\n   * Required. The URL to which the tab links.\r\n   */\r\n  to: string;\r\n\r\n  /**\r\n   * Optional. A boolean indicating whether the tab is disabled.\r\n   * If true, the tab will be unclickable and will have a disabled appearance.\r\n   */\r\n  disabled?: boolean;\r\n\r\n  /**\r\n   * Optional. The handler function to be called when the tab is clicked.\r\n   */\r\n  onClick?: (e: React.MouseEvent) => void;\r\n\r\n  /**\r\n   * Optional. A boolean indicating whether a notification dot should be shown on the tab.\r\n   */\r\n  showNotificationDot?: boolean;\r\n\r\n  /**\r\n   * Optional. The variant of the notification dot. It can be 'critical' or 'positive'. Defaults to 'Critical'\r\n   */\r\n  variant?: 'critical' | 'positive';\r\n}\r\n\r\nexport interface VerticalTabsProps {\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  entries: VerticalTabEntry[];\r\n}\r\n\r\nconst VerticalTabs = ({ size, entries }: VerticalTabsProps) => {\r\n  return (\r\n    <Tabs size={size ?? Size.Large}>\r\n      {entries?.map((entry: VerticalTabEntry) => (\r\n        <TabLink\r\n          key={entry.to}\r\n          href={entry.to}\r\n          requiredLine={entry.requiredLine}\r\n          optionalLine={entry.optionalLine}\r\n          endLineIcon={entry.endLineIcon}\r\n          OptionalLineIcon={entry.optionalLineIcon}\r\n          disabled={entry.disabled}\r\n          showNotificationDot={entry.showNotificationDot}\r\n          size={size}\r\n          variant={entry.variant}\r\n          onLinkClick={(e) => {\r\n            if (entry.onClick) {\r\n              entry.onClick(e);\r\n              e.preventDefault && e.preventDefault();\r\n            }\r\n          }}/>\r\n      ))}\r\n    </Tabs>\r\n  );\r\n};\r\n\r\nexport default VerticalTabs;\r\n"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,IAAI,MAAM,QAAQ;AACzB,OAAOC,OAAO,MAAM,WAAW;AAE/B,SAASC,IAAI,QAAQ,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAuDhC,MAAMC,YAAY,GAAGC,IAAA,IAA0C;EAAA,IAAzC;IAAEC,IAAI;IAAEC;EAA2B,CAAC,GAAAF,IAAA;EACxD,oBACEF,IAAA,CAACJ,IAAI;IAACO,IAAI,EAAEA,IAAI,IAAIL,IAAI,CAACO,KAAM;IAAAC,QAAA,EAC5BF,OAAO,EAAEG,GAAG,CAAEC,KAAuB,iBACpCR,IAAA,CAACH,OAAO;MAENY,IAAI,EAAED,KAAK,CAACE,EAAG;MACfC,YAAY,EAAEH,KAAK,CAACG,YAAa;MACjCC,YAAY,EAAEJ,KAAK,CAACI,YAAa;MACjCC,WAAW,EAAEL,KAAK,CAACK,WAAY;MAC/BC,gBAAgB,EAAEN,KAAK,CAACO,gBAAiB;MACzCC,QAAQ,EAAER,KAAK,CAACQ,QAAS;MACzBC,mBAAmB,EAAET,KAAK,CAACS,mBAAoB;MAC/Cd,IAAI,EAAEA,IAAK;MACXe,OAAO,EAAEV,KAAK,CAACU,OAAQ;MACvBC,WAAW,EAAGC,CAAC,IAAK;QAClB,IAAIZ,KAAK,CAACa,OAAO,EAAE;UACjBb,KAAK,CAACa,OAAO,CAACD,CAAC,CAAC;UAChBA,CAAC,CAACE,cAAc,IAAIF,CAAC,CAACE,cAAc,CAAC,CAAC;QACxC;MACF;IAAE,GAfGd,KAAK,CAACE,EAeR,CACN;EAAC,CACE,CAAC;AAEX,CAAC;AAACT,YAAA,CAAAsB,SAAA;EA3BAnB,OAAO,EAAAoB,GAAA,CAAAC,OAAA,CAAAD,GAAA,CAAAE,KAAA;IA9CPf,YAAY,EAAAa,GAAA,CAAAG,MAAA,CAAAC,UAAA;IAKZhB,YAAY,EAAAY,GAAA,CAAAG,MAAA;IAKZZ,gBAAgB,EAAAS,GAAA,CAAAK,IAAA;IAKhBhB,WAAW,EAAAW,GAAA,CAAAK,IAAA;IAKXnB,EAAE,EAAAc,GAAA,CAAAG,MAAA,CAAAC,UAAA;IAMFZ,QAAQ,EAAAQ,GAAA,CAAAM,IAAA;IAKRT,OAAO,EAAAG,GAAA,CAAAO,IAAA;IAKPd,mBAAmB,EAAAO,GAAA,CAAAM,IAAA;IAKnBZ,OAAO,EAAAM,GAAA,CAAAQ,KAAA,EAAG,UAAU,EAAG,UAAU;EAAA,IAAAJ;AAAA;AAkCnC,eAAe3B,YAAY","ignoreList":[]}
+{"version":3,"file":"VerticalTabs.js","names":["React","Tabs","TabLink","Size","jsx","_jsx","VerticalTabs","_ref","size","entries","Large","children","map","entry","href","to","requiredLine","optionalLine","endLineIcon","OptionalLineIcon","optionalLineIcon","disabled","showNotificationDot","variant","onLinkClick","e","onClick","propTypes","_pt","arrayOf","shape","string","isRequired","node","bool","func","oneOf"],"sources":["../../src/Tabs/VerticalTabs.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport Tabs from './Tabs';\r\nimport TabLink from './TabLink';\r\nimport { BaseProps } from '../icons';\r\nimport { Size } from '../types';\r\n\r\nexport interface VerticalTabEntry {\r\n  /**\r\n   * Required. The main text to be displayed on the tab.\r\n   */\r\n  requiredLine: string;\r\n\r\n  /**\r\n   * Optional. The secondary text to be displayed on the tab link under the required line.\r\n   */\r\n  optionalLine?: string;\r\n\r\n  /**\r\n   * Optional. The icon to be displayed next to the secondary text on the tab link under the required line.\r\n   */\r\n  optionalLineIcon?: React.ReactNode;\r\n\r\n  /**\r\n   * Optional. The icon to be displayed at the end of the tab.\r\n   */\r\n  endLineIcon?: React.ReactNode;\r\n\r\n  /**\r\n   * Required. The URL to which the tab links.\r\n   */\r\n  to: string;\r\n\r\n  /**\r\n   * Optional. A boolean indicating whether the tab is disabled.\r\n   * If true, the tab will be unclickable and will have a disabled appearance.\r\n   */\r\n  disabled?: boolean;\r\n\r\n  /**\r\n   * Optional. The handler function to be called when the tab is clicked.\r\n   */\r\n  onClick?: (e: React.MouseEvent) => void;\r\n\r\n  /**\r\n   * Optional. A boolean indicating whether a notification dot should be shown on the tab.\r\n   */\r\n  showNotificationDot?: boolean;\r\n\r\n  /**\r\n   * Optional. The variant of the notification dot. It can be 'critical' or 'positive'. Defaults to 'Critical'\r\n   */\r\n  variant?: 'critical' | 'positive';\r\n}\r\n\r\nexport interface VerticalTabsProps {\r\n  size?: Size.Small | Size.Medium | Size.Large;\r\n  entries: VerticalTabEntry[];\r\n}\r\n\r\nconst VerticalTabs = ({ size, entries }: VerticalTabsProps) => {\r\n  return (\r\n    <Tabs size={size ?? Size.Large}>\r\n      {entries?.map((entry: VerticalTabEntry) => (\r\n        <TabLink\r\n          key={entry.to}\r\n          href={entry.to}\r\n          requiredLine={entry.requiredLine}\r\n          optionalLine={entry.optionalLine}\r\n          endLineIcon={entry.endLineIcon}\r\n          OptionalLineIcon={entry.optionalLineIcon}\r\n          disabled={entry.disabled}\r\n          showNotificationDot={entry.showNotificationDot}\r\n          size={size}\r\n          variant={entry.variant}\r\n          onLinkClick={(e) => {\r\n            if (entry.onClick) {\r\n              entry.onClick(e);\r\n            }\r\n          }}/>\r\n      ))}\r\n    </Tabs>\r\n  );\r\n};\r\n\r\nexport default VerticalTabs;\r\n"],"mappings":";AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,OAAOC,IAAI,MAAM,QAAQ;AACzB,OAAOC,OAAO,MAAM,WAAW;AAE/B,SAASC,IAAI,QAAQ,UAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAuDhC,MAAMC,YAAY,GAAGC,IAAA,IAA0C;EAAA,IAAzC;IAAEC,IAAI;IAAEC;EAA2B,CAAC,GAAAF,IAAA;EACxD,oBACEF,IAAA,CAACJ,IAAI;IAACO,IAAI,EAAEA,IAAI,IAAIL,IAAI,CAACO,KAAM;IAAAC,QAAA,EAC5BF,OAAO,EAAEG,GAAG,CAAEC,KAAuB,iBACpCR,IAAA,CAACH,OAAO;MAENY,IAAI,EAAED,KAAK,CAACE,EAAG;MACfC,YAAY,EAAEH,KAAK,CAACG,YAAa;MACjCC,YAAY,EAAEJ,KAAK,CAACI,YAAa;MACjCC,WAAW,EAAEL,KAAK,CAACK,WAAY;MAC/BC,gBAAgB,EAAEN,KAAK,CAACO,gBAAiB;MACzCC,QAAQ,EAAER,KAAK,CAACQ,QAAS;MACzBC,mBAAmB,EAAET,KAAK,CAACS,mBAAoB;MAC/Cd,IAAI,EAAEA,IAAK;MACXe,OAAO,EAAEV,KAAK,CAACU,OAAQ;MACvBC,WAAW,EAAGC,CAAC,IAAK;QAClB,IAAIZ,KAAK,CAACa,OAAO,EAAE;UACjBb,KAAK,CAACa,OAAO,CAACD,CAAC,CAAC;QAClB;MACF;IAAE,GAdGZ,KAAK,CAACE,EAcR,CACN;EAAC,CACE,CAAC;AAEX,CAAC;AAACT,YAAA,CAAAqB,SAAA;EA1BAlB,OAAO,EAAAmB,GAAA,CAAAC,OAAA,CAAAD,GAAA,CAAAE,KAAA;IA9CPd,YAAY,EAAAY,GAAA,CAAAG,MAAA,CAAAC,UAAA;IAKZf,YAAY,EAAAW,GAAA,CAAAG,MAAA;IAKZX,gBAAgB,EAAAQ,GAAA,CAAAK,IAAA;IAKhBf,WAAW,EAAAU,GAAA,CAAAK,IAAA;IAKXlB,EAAE,EAAAa,GAAA,CAAAG,MAAA,CAAAC,UAAA;IAMFX,QAAQ,EAAAO,GAAA,CAAAM,IAAA;IAKRR,OAAO,EAAAE,GAAA,CAAAO,IAAA;IAKPb,mBAAmB,EAAAM,GAAA,CAAAM,IAAA;IAKnBX,OAAO,EAAAK,GAAA,CAAAQ,KAAA,EAAG,UAAU,EAAG,UAAU;EAAA,IAAAJ;AAAA;AAiCnC,eAAe1B,YAAY","ignoreList":[]}

package/dist/Tag/Tag.cjs

@@ -34,8 +34,8 @@ const Container = _styledComponents.default.div`
     color: ${props => _.COLORS.getColor('neutral_600', props.theme)};
   }
   &.positive {
-    background-color: ${props => _.COLORS.getColor('positive_100', props.theme)};
-    color: ${props => _.COLORS.getColor('positive_600', props.theme)};
+    background-color: ${props => _.COLORS.getColor('correct_100', props.theme)};
+    color: ${props => _.COLORS.getColor('correct_600', props.theme)};
   }
   &.warning {
     background-color: ${props => _.COLORS.getColor('warning_100', props.theme)};

package/dist/Tag/Tag.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","Container","styled","div","props","$isLabelPresent","COLORS","getColor","theme","IconContainer","TextContainer","ComponentXSStyling","ComponentTextStyle","Bold","Tag","_ref","label","icon","variant","className","rest","_objectWithoutProperties2","cls","jsxs","$variant","children","jsx","$icon","propTypes","_propTypes","string","node","oneOf","_default","exports"],"sources":["../../src/Tag/Tag.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { COLORS, ComponentTextStyle, ComponentXSStyling } from '..';\r\n\r\nconst Container = styled.div<{$variant: TagVariants, $isLabelPresent: boolean}>`\r\n  display: flex;\r\n  padding: 4px;\r\n  height: 24px;\r\n  width: calc(100%);\r\n  max-width: fit-content;\r\n  align-items: center;\r\n  justify-content: center;\r\n  min-width: ${props=>props.$isLabelPresent ? '64px' : ''};\r\n  border-radius: 2px;\r\n  box-sizing: border-box;\r\n\r\n  &.neutral {\r\n    background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  }\r\n  &.positive {\r\n    background-color: ${props => COLORS.getColor('positive_100', props.theme)};\r\n    color: ${props => COLORS.getColor('positive_600', props.theme)};\r\n  }\r\n  &.warning {\r\n    background-color: ${props => COLORS.getColor('warning_100', props.theme)};\r\n    color: ${props => COLORS.getColor('warning_600', props.theme)};\r\n  }\r\n  &.critical {\r\n    background-color: ${props => COLORS.getColor('critical_100', props.theme)};\r\n    color: ${props => COLORS.getColor('critical_600', props.theme)};\r\n  }\r\n  &.accent1 {\r\n    background-color: ${props => COLORS.getColor('accent1_100', props.theme)};\r\n    color: ${props => COLORS.getColor('accent1_600', props.theme)};\r\n  }\r\n  &.accent2 {\r\n    background-color: ${props => COLORS.getColor('accent2_100', props.theme)};\r\n    color: ${props => COLORS.getColor('accent2_600', props.theme)};\r\n  }\r\n\r\n`;\r\n\r\nconst IconContainer = styled.div<{$variant: TagVariants}>`\r\n  display: flex;\r\n  width: 16px;\r\n  height: 16px;\r\n  svg {\r\n    width: 16px;\r\n    height: 16px;\r\n  }\r\n`;\r\n\r\nconst TextContainer = styled.div<{$variant: TagVariants, $icon: React.ReactNode}>`\r\n  height: 16px;\r\n  padding: 0 4px;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n  overflow: hidden;  \r\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\r\n`;\r\n\r\n\r\nexport type TagVariants = 'neutral' | 'positive' | 'warning' | 'critical' | 'accent1' | 'accent2';\r\n\r\nexport type TagProps = React.HTMLAttributes<HTMLDivElement> & {\r\n  /** Optional. Label to be shown in the Tag. */\r\n  label?: string;\r\n  /** Optional. Icon to be shown in the tag. */\r\n  icon?: React.ReactNode;\r\n  /** Optional. Style Variant of the Tag. Defaults to 'neutral' */\r\n  variant?: TagVariants;\r\n}\r\n\r\nconst Tag: React.FunctionComponent<TagProps> = ({label, icon, variant='neutral', className, ...rest}) => {\r\n  const cls = `${className ?? ''} ${variant}`;\r\n  return (   \r\n    <Container $variant={variant} $isLabelPresent={!!label} className={cls} {...rest}>\r\n      {icon && <IconContainer $variant={variant} data-testid={'iconContainer'}>\r\n          {icon}\r\n        </IconContainer>\r\n      }\r\n      {label && <TextContainer $variant={variant} $icon={icon}>\r\n          {label}\r\n        </TextContainer>\r\n      }\r\n    </Container>\r\n  );\r\n};\r\n\r\nexport default Tag;\r\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Tag.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","Container","styled","div","props","$isLabelPresent","COLORS","getColor","theme","IconContainer","TextContainer","ComponentXSStyling","ComponentTextStyle","Bold","Tag","_ref","label","icon","variant","className","rest","_objectWithoutProperties2","cls","jsxs","$variant","children","jsx","$icon","propTypes","_propTypes","string","node","oneOf","_default","exports"],"sources":["../../src/Tag/Tag.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport { COLORS, ComponentTextStyle, ComponentXSStyling } from '..';\r\n\r\nconst Container = styled.div<{$variant: TagVariants, $isLabelPresent: boolean}>`\r\n  display: flex;\r\n  padding: 4px;\r\n  height: 24px;\r\n  width: calc(100%);\r\n  max-width: fit-content;\r\n  align-items: center;\r\n  justify-content: center;\r\n  min-width: ${props=>props.$isLabelPresent ? '64px' : ''};\r\n  border-radius: 2px;\r\n  box-sizing: border-box;\r\n\r\n  &.neutral {\r\n    background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n    color: ${props => COLORS.getColor('neutral_600', props.theme)};\r\n  }\r\n  &.positive {\r\n    background-color: ${props => COLORS.getColor('correct_100', props.theme)};\r\n    color: ${props => COLORS.getColor('correct_600', props.theme)};\r\n  }\r\n  &.warning {\r\n    background-color: ${props => COLORS.getColor('warning_100', props.theme)};\r\n    color: ${props => COLORS.getColor('warning_600', props.theme)};\r\n  }\r\n  &.critical {\r\n    background-color: ${props => COLORS.getColor('critical_100', props.theme)};\r\n    color: ${props => COLORS.getColor('critical_600', props.theme)};\r\n  }\r\n  &.accent1 {\r\n    background-color: ${props => COLORS.getColor('accent1_100', props.theme)};\r\n    color: ${props => COLORS.getColor('accent1_600', props.theme)};\r\n  }\r\n  &.accent2 {\r\n    background-color: ${props => COLORS.getColor('accent2_100', props.theme)};\r\n    color: ${props => COLORS.getColor('accent2_600', props.theme)};\r\n  }\r\n\r\n`;\r\n\r\nconst IconContainer = styled.div<{$variant: TagVariants}>`\r\n  display: flex;\r\n  width: 16px;\r\n  height: 16px;\r\n  svg {\r\n    width: 16px;\r\n    height: 16px;\r\n  }\r\n`;\r\n\r\nconst TextContainer = styled.div<{$variant: TagVariants, $icon: React.ReactNode}>`\r\n  height: 16px;\r\n  padding: 0 4px;\r\n  text-overflow: ellipsis;\r\n  white-space: nowrap;\r\n  overflow: hidden;  \r\n  ${ComponentXSStyling(ComponentTextStyle.Bold, null)}\r\n`;\r\n\r\n\r\nexport type TagVariants = 'neutral' | 'positive' | 'warning' | 'critical' | 'accent1' | 'accent2';\r\n\r\nexport type TagProps = React.HTMLAttributes<HTMLDivElement> & {\r\n  /** Optional. Label to be shown in the Tag. */\r\n  label?: string;\r\n  /** Optional. Icon to be shown in the tag. */\r\n  icon?: React.ReactNode;\r\n  /** Optional. Style Variant of the Tag. Defaults to 'neutral' */\r\n  variant?: TagVariants;\r\n}\r\n\r\nconst Tag: React.FunctionComponent<TagProps> = ({label, icon, variant='neutral', className, ...rest}) => {\r\n  const cls = `${className ?? ''} ${variant}`;\r\n  return (   \r\n    <Container $variant={variant} $isLabelPresent={!!label} className={cls} {...rest}>\r\n      {icon && <IconContainer $variant={variant} data-testid={'iconContainer'}>\r\n          {icon}\r\n        </IconContainer>\r\n      }\r\n      {label && <TextContainer $variant={variant} $icon={icon}>\r\n          {label}\r\n        </TextContainer>\r\n      }\r\n    </Container>\r\n  );\r\n};\r\n\r\nexport default Tag;\r\n"],"mappings":";;;;;;;;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,CAAA,GAAAH,OAAA;AAAoE,IAAAI,WAAA,GAAAJ,OAAA;AAAA,MAAAK,SAAA;AAAA,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAR,wBAAAQ,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAAA,SAAAW,QAAAnB,CAAA,EAAAE,CAAA,QAAAC,CAAA,GAAAQ,MAAA,CAAAS,IAAA,CAAApB,CAAA,OAAAW,MAAA,CAAAU,qBAAA,QAAAC,CAAA,GAAAX,MAAA,CAAAU,qBAAA,CAAArB,CAAA,GAAAE,CAAA,KAAAoB,CAAA,GAAAA,CAAA,CAAAC,MAAA,WAAArB,CAAA,WAAAS,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAE,CAAA,EAAAsB,UAAA,OAAArB,CAAA,CAAAsB,IAAA,CAAAC,KAAA,CAAAvB,CAAA,EAAAmB,CAAA,YAAAnB,CAAA;AAAA,SAAAwB,cAAA3B,CAAA,aAAAE,CAAA,MAAAA,CAAA,GAAA0B,SAAA,CAAAC,MAAA,EAAA3B,CAAA,UAAAC,CAAA,WAAAyB,SAAA,CAAA1B,CAAA,IAAA0B,SAAA,CAAA1B,CAAA,QAAAA,CAAA,OAAAiB,OAAA,CAAAR,MAAA,CAAAR,CAAA,OAAA2B,OAAA,WAAA5B,CAAA,QAAA6B,gBAAA,CAAA1B,OAAA,EAAAL,CAAA,EAAAE,CAAA,EAAAC,CAAA,CAAAD,CAAA,SAAAS,MAAA,CAAAqB,yBAAA,GAAArB,MAAA,CAAAsB,gBAAA,CAAAjC,CAAA,EAAAW,MAAA,CAAAqB,yBAAA,CAAA7B,CAAA,KAAAgB,OAAA,CAAAR,MAAA,CAAAR,CAAA,GAAA2B,OAAA,WAAA5B,CAAA,IAAAS,MAAA,CAAAC,cAAA,CAAAZ,CAAA,EAAAE,CAAA,EAAAS,MAAA,CAAAE,wBAAA,CAAAV,CAAA,EAAAD,CAAA,iBAAAF,CAAA;AAEpE,MAAMkC,SAAS,GAAGC,yBAAM,CAACC,GAAsD;AAC/E;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAeC,KAAK,IAAEA,KAAK,CAACC,eAAe,GAAG,MAAM,GAAG,EAAE;AACzD;AACA;AACA;AACA;AACA,wBAAwBD,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AAC5E,aAAaJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AACjE;AACA;AACA,wBAAwBJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AAC5E,aAAaJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AACjE;AACA;AACA,wBAAwBJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AAC5E,aAAaJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AACjE;AACA;AACA,wBAAwBJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,cAAc,EAAEH,KAAK,CAACI,KAAK,CAAC;AAC7E,aAAaJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,cAAc,EAAEH,KAAK,CAACI,KAAK,CAAC;AAClE;AACA;AACA,wBAAwBJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AAC5E,aAAaJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AACjE;AACA;AACA,wBAAwBJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AAC5E,aAAaJ,KAAK,IAAIE,QAAM,CAACC,QAAQ,CAAC,aAAa,EAAEH,KAAK,CAACI,KAAK,CAAC;AACjE;AACA;AACA,CAAC;AAED,MAAMC,aAAa,GAAGP,yBAAM,CAACC,GAA4B;AACzD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,MAAMO,aAAa,GAAGR,yBAAM,CAACC,GAAoD;AACjF;AACA;AACA;AACA;AACA;AACA,IAAI,IAAAQ,oBAAkB,EAACC,oBAAkB,CAACC,IAAI,EAAE,IAAI,CAAC;AACrD,CAAC;AAcD,MAAMC,GAAsC,GAAGC,IAAA,IAA0D;EAAA,IAAzD;MAACC,KAAK;MAAEC,IAAI;MAAEC,OAAO,GAAC,SAAS;MAAEC;IAAkB,CAAC,GAAAJ,IAAA;IAALK,IAAI,OAAAC,yBAAA,CAAAjD,OAAA,EAAA2C,IAAA,EAAAlD,SAAA;EACjG,MAAMyD,GAAG,GAAG,GAAGH,SAAS,IAAI,EAAE,IAAID,OAAO,EAAE;EAC3C,oBACE,IAAAtD,WAAA,CAAA2D,IAAA,EAACtB,SAAS,EAAAP,aAAA,CAAAA,aAAA;IAAC8B,QAAQ,EAAEN,OAAQ;IAACb,eAAe,EAAE,CAAC,CAACW,KAAM;IAACG,SAAS,EAAEG;EAAI,GAAKF,IAAI;IAAAK,QAAA,GAC7ER,IAAI,iBAAI,IAAArD,WAAA,CAAA8D,GAAA,EAACjB,aAAa;MAACe,QAAQ,EAAEN,OAAQ;MAAC,eAAa,eAAgB;MAAAO,QAAA,EACnER;IAAI,CACQ,CAAC,EAEjBD,KAAK,iBAAI,IAAApD,WAAA,CAAA8D,GAAA,EAAChB,aAAa;MAACc,QAAQ,EAAEN,OAAQ;MAACS,KAAK,EAAEV,IAAK;MAAAQ,QAAA,EACnDT;IAAK,CACO,CAAC;EAAA,EAET,CAAC;AAEhB,CAAC;AAACF,GAAA,CAAAc,SAAA;EArBAZ,KAAK,EAAAa,UAAA,CAAAzD,OAAA,CAAA0D,MAAA;EAELb,IAAI,EAAAY,UAAA,CAAAzD,OAAA,CAAA2D,IAAA;EAEJb,OAAO,EAAAW,UAAA,CAAAzD,OAAA,CAAA4D,KAAA,EARiB,SAAS,EAAG,UAAU,EAAG,SAAS,EAAG,UAAU,EAAG,SAAS,EAAG,SAAS;AAAA;AAAA,IAAAC,QAAA,GAAAC,OAAA,CAAA9D,OAAA,GA2BlF0C,GAAG","ignoreList":[]}

package/dist/Tag/Tag.js

@@ -25,8 +25,8 @@ const Container = styled.div`
     color: ${props => COLORS.getColor('neutral_600', props.theme)};
   }
   &.positive {
-    background-color: ${props => COLORS.getColor('positive_100', props.theme)};
-    color: ${props => COLORS.getColor('positive_600', props.theme)};
+    background-color: ${props => COLORS.getColor('correct_100', props.theme)};
+    color: ${props => COLORS.getColor('correct_600', props.theme)};
   }
   &.warning {
     background-color: ${props => COLORS.getColor('warning_100', props.theme)};