| 1 | {"version":3,"file":"Tab.js","sources":["../src/components/Tabs/Tab.js"],"sourcesContent":["import React, { useCallback } from 'react'\nimport PropTypes from 'prop-types'\nimport { useInside } from 'use-inside'\nimport { GU, RADIUS, textStyle } from '../../style'\nimport { useTheme } from '../../theme'\nimport ButtonBase from '../ButtonBase/ButtonBase'\n\nfunction Tab({ index, item, selected, onChange }) {\n const theme = useTheme()\n const [insideSidePanel] = useInside('SidePanel')\n\n const handleClick = useCallback(() => {\n onChange(index)\n }, [index, onChange])\n\n return (\n <li css=\"list-style: none\">\n <ButtonBase\n focusRingRadius={RADIUS}\n onClick={handleClick}\n css={`\n ${textStyle('body2')};\n border-radius: 0;\n transition: background 50ms ease-in-out;\n &:active {\n background: ${theme.surfacePressed};\n }\n `}\n >\n <span\n css={`\n display: flex;\n position: relative;\n align-items: center;\n height: ${8 * GU - (insideSidePanel ? 1 : 2)}px;\n padding: 0 ${3 * GU}px;\n white-space: nowrap;\n color: ${selected\n ? theme.surfaceContent\n : theme.surfaceContentSecondary};\n `}\n >\n {item}\n <span\n css={`\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n background: ${theme.selected};\n height: 2px;\n opacity: ${Number(selected)};\n transition-property: transform, opacity;\n transition-duration: 150ms;\n transition-timing-function: ease-in-out;\n transform: scale3d(1, ${Number(selected)}, 1);\n transform-origin: 0 100%;\n `}\n />\n </span>\n </ButtonBase>\n </li>\n )\n}\n\nTab.propTypes = {\n index: PropTypes.number.isRequired,\n item: PropTypes.node.isRequired,\n onChange: PropTypes.func.isRequired,\n selected: PropTypes.bool.isRequired,\n}\n\nexport default Tab\n"],"names":["Tab","index","item","selected","onChange","theme","useTheme","useInside","insideSidePanel","handleClick","useCallback","React","RADIUS","textStyle","surfacePressed","GU","surfaceContent","surfaceContentSecondary","Number","propTypes","PropTypes","number","isRequired","node","func","bool"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,SAASA,GAAT,OAAkD;AAAA,MAAnCC,KAAmC,QAAnCA,KAAmC;AAAA,MAA5BC,IAA4B,QAA5BA,IAA4B;AAAA,MAAtBC,QAAsB,QAAtBA,QAAsB;AAAA,MAAZC,QAAY,QAAZA,QAAY;AAChD,MAAMC,KAAK,GAAGC,cAAQ,EAAtB;;AADgD,mBAEtBC,SAAS,CAAC,WAAD,CAFa;AAAA;AAAA,MAEzCC,eAFyC;;AAIhD,MAAMC,WAAW,GAAGC,iBAAW,CAAC,YAAM;AACpCN,IAAAA,QAAQ,CAACH,KAAD,CAAR;AACD,GAF8B,EAE5B,CAACA,KAAD,EAAQG,QAAR,CAF4B,CAA/B;AAIA,sBACEO,2DACEA;AACE,IAAA,eAAe,EAAEC,gBADnB;AAEE,IAAA,OAAO,EAAEH,WAFX;AAAA,UAIMI,oBAAS,CAAC,OAAD,CAJf;AAAA,WAQoBR,KAAK,CAACS;AAR1B,kBAYEH;AAAA,WAKc,IAAII,YAAJ,IAAUP,eAAe,GAAG,CAAH,GAAO,CAAhC,CALd;AAAA,WAMiB,IAAIO,YANrB;AAAA,WAQaZ,QAAQ,GACbE,KAAK,CAACW,cADO,GAEbX,KAAK,CAACY;AAVd,KAaGf,IAbH,eAcES;AAAA,WAMkBN,KAAK,CAACF,QANxB;AAAA,WAQee,MAAM,CAACf,QAAD,CARrB;AAAA,WAY4Be,MAAM,CAACf,QAAD;AAZlC,IAdF,CAZF,CADF,CADF;AAgDD;;AAEDH,GAAG,CAACmB,SAAJ,GAAgB;AACdlB,EAAAA,KAAK,EAAEmB,eAAS,CAACC,MAAV,CAAiBC,UADV;AAEdpB,EAAAA,IAAI,EAAEkB,eAAS,CAACG,IAAV,CAAeD,UAFP;AAGdlB,EAAAA,QAAQ,EAAEgB,eAAS,CAACI,IAAV,CAAeF,UAHX;AAIdnB,EAAAA,QAAQ,EAAEiB,eAAS,CAACK,IAAV,CAAeH;AAJX,CAAhB;;;;"} |