{"version":3,"file":"VerticalTab.cjs","sources":["../../../../src/components/Tabs/VerticalTab.tsx"],"sourcesContent":["import { css, cx } from '@emotion/css';\nimport { forwardRef } from 'react';\n\nimport { GrafanaTheme2 } from '@grafana/data';\nimport { selectors } from '@grafana/e2e-selectors';\n\nimport { useStyles2 } from '../../themes/ThemeContext';\nimport { Icon } from '../Icon/Icon';\n\nimport { Counter } from './Counter';\nimport { TabProps } from './Tab';\n\nexport const VerticalTab = forwardRef<HTMLAnchorElement, TabProps>(\n  ({ label, active, icon, counter, className, suffix: Suffix, onChangeTab, href, ...otherProps }, ref) => {\n    const tabsStyles = useStyles2(getTabStyles);\n    const content = () => (\n      <>\n        {icon && <Icon name={icon} />}\n        {label}\n        {typeof counter === 'number' && <Counter value={counter} />}\n        {Suffix && <Suffix className={tabsStyles.suffix} />}\n      </>\n    );\n\n    const linkClass = cx(tabsStyles.link, active && tabsStyles.activeStyle);\n\n    return (\n      <a\n        href={href}\n        className={linkClass}\n        {...otherProps}\n        onClick={onChangeTab}\n        aria-label={otherProps['aria-label'] || selectors.components.Tab.title(label)}\n        role=\"tab\"\n        aria-selected={active}\n        ref={ref}\n      >\n        {content()}\n      </a>\n    );\n  }\n);\n\nVerticalTab.displayName = 'Tab';\n\nconst getTabStyles = (theme: GrafanaTheme2) => {\n  return {\n    link: css({\n      padding: '6px 12px',\n      display: 'block',\n      height: '100%',\n      cursor: 'pointer',\n      position: 'relative',\n\n      color: theme.colors.text.primary,\n\n      svg: {\n        marginRight: theme.spacing(1),\n      },\n\n      '&:hover, &:focus': {\n        textDecoration: 'underline',\n      },\n    }),\n    activeStyle: css({\n      label: 'activeTabStyle',\n      color: theme.colors.text.maxContrast,\n      overflow: 'hidden',\n\n      '&::before': {\n        display: 'block',\n        content: '\" \"',\n        position: 'absolute',\n        left: 0,\n        width: '4px',\n        bottom: '2px',\n        top: '2px',\n        borderRadius: theme.shape.radius.default,\n        backgroundImage: 'linear-gradient(0deg, #f05a28 30%, #fbca0a 99%)',\n      },\n    }),\n    suffix: css({\n      marginLeft: theme.spacing(1),\n    }),\n  };\n};\n"],"names":["forwardRef","useStyles2","jsxs","Fragment","jsx","Icon","Counter","cx","selectors","css"],"mappings":";;;;;;;;;;;;;AAYO,MAAM,WAAA,GAAcA,gBAAA;AAAA,EACzB,CAAC,EAAE,KAAA,EAAO,MAAA,EAAQ,MAAM,OAAA,EAAS,SAAA,EAAW,MAAA,EAAQ,MAAA,EAAQ,WAAA,EAAa,IAAA,EAAM,GAAG,UAAA,IAAc,GAAA,KAAQ;AACtG,IAAA,MAAM,UAAA,GAAaC,wBAAW,YAAY,CAAA;AAC1C,IAAA,MAAM,OAAA,GAAU,sBACdC,eAAA,CAAAC,mBAAA,EAAA,EACG,QAAA,EAAA;AAAA,MAAA,IAAA,oBAAQC,cAAA,CAACC,SAAA,EAAA,EAAK,IAAA,EAAM,IAAA,EAAM,CAAA;AAAA,MAC1B,KAAA;AAAA,MACA,OAAO,OAAA,KAAY,QAAA,oBAAYD,cAAA,CAACE,eAAA,EAAA,EAAQ,OAAO,OAAA,EAAS,CAAA;AAAA,MACxD,MAAA,oBAAUF,cAAA,CAAC,MAAA,EAAA,EAAO,SAAA,EAAW,WAAW,MAAA,EAAQ;AAAA,KAAA,EACnD,CAAA;AAGF,IAAA,MAAM,YAAYG,MAAA,CAAG,UAAA,CAAW,IAAA,EAAM,MAAA,IAAU,WAAW,WAAW,CAAA;AAEtE,IAAA,uBACEH,cAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,IAAA;AAAA,QACA,SAAA,EAAW,SAAA;AAAA,QACV,GAAG,UAAA;AAAA,QACJ,OAAA,EAAS,WAAA;AAAA,QACT,YAAA,EAAY,WAAW,YAAY,CAAA,IAAKI,uBAAU,UAAA,CAAW,GAAA,CAAI,MAAM,KAAK,CAAA;AAAA,QAC5E,IAAA,EAAK,KAAA;AAAA,QACL,eAAA,EAAe,MAAA;AAAA,QACf,GAAA;AAAA,QAEC,QAAA,EAAA,OAAA;AAAQ;AAAA,KACX;AAAA,EAEJ;AACF;AAEA,WAAA,CAAY,WAAA,GAAc,KAAA;AAE1B,MAAM,YAAA,GAAe,CAAC,KAAA,KAAyB;AAC7C,EAAA,OAAO;AAAA,IACL,MAAMC,OAAA,CAAI;AAAA,MACR,OAAA,EAAS,UAAA;AAAA,MACT,OAAA,EAAS,OAAA;AAAA,MACT,MAAA,EAAQ,MAAA;AAAA,MACR,MAAA,EAAQ,SAAA;AAAA,MACR,QAAA,EAAU,UAAA;AAAA,MAEV,KAAA,EAAO,KAAA,CAAM,MAAA,CAAO,IAAA,CAAK,OAAA;AAAA,MAEzB,GAAA,EAAK;AAAA,QACH,WAAA,EAAa,KAAA,CAAM,OAAA,CAAQ,CAAC;AAAA,OAC9B;AAAA,MAEA,kBAAA,EAAoB;AAAA,QAClB,cAAA,EAAgB;AAAA;AAClB,KACD,CAAA;AAAA,IACD,aAAaA,OAAA,CAAI;AAAA,MACf,KAAA,EAAO,gBAAA;AAAA,MACP,KAAA,EAAO,KAAA,CAAM,MAAA,CAAO,IAAA,CAAK,WAAA;AAAA,MACzB,QAAA,EAAU,QAAA;AAAA,MAEV,WAAA,EAAa;AAAA,QACX,OAAA,EAAS,OAAA;AAAA,QACT,OAAA,EAAS,KAAA;AAAA,QACT,QAAA,EAAU,UAAA;AAAA,QACV,IAAA,EAAM,CAAA;AAAA,QACN,KAAA,EAAO,KAAA;AAAA,QACP,MAAA,EAAQ,KAAA;AAAA,QACR,GAAA,EAAK,KAAA;AAAA,QACL,YAAA,EAAc,KAAA,CAAM,KAAA,CAAM,MAAA,CAAO,OAAA;AAAA,QACjC,eAAA,EAAiB;AAAA;AACnB,KACD,CAAA;AAAA,IACD,QAAQA,OAAA,CAAI;AAAA,MACV,UAAA,EAAY,KAAA,CAAM,OAAA,CAAQ,CAAC;AAAA,KAC5B;AAAA,GACH;AACF,CAAA;;;;"}