| 1 | {"version":3,"file":"NavigationBar.js","sources":["../src/components/NavigationBar/NavigationBar.js"],"sourcesContent":["import React from 'react'\nimport PropTypes from 'prop-types'\nimport styled from 'styled-components'\nimport { Transition, animated } from 'react-spring'\nimport { springs } from '../../style'\nimport LeftIcon from './LeftIcon'\n\nclass NavigationBar extends React.Component {\n static propTypes = {\n onBack: PropTypes.func,\n items: PropTypes.arrayOf(PropTypes.node),\n compact: PropTypes.bool,\n }\n static defaultProps = {\n onBack: () => {},\n items: [],\n compact: false,\n }\n state = {\n cachedItems: null,\n direction: -1,\n }\n static getDerivedStateFromProps(props, state) {\n const updatedState = { cachedItems: props.items }\n if (!state.cachedItems) {\n return updatedState\n }\n return {\n ...updatedState,\n direction: state.cachedItems.length > props.items.length ? 1 : -1,\n }\n }\n render() {\n const { onBack, items, compact } = this.props\n const displayedItems = items\n .map((node, index) => ({ node, index }))\n .slice(-1)\n return (\n <Container>\n <Transition\n items={displayedItems}\n keys={displayedItems.map(\n // Use a different key than 0 when there is only one item, so that\n // the “leave” transition of the first item can be executed when a\n // second item is added.\n item => (items.length === 1 ? -1 : item.index)\n )}\n config={springs.smooth}\n initial={null}\n from={{ opacity: 0, position: this.state.direction * -1 }}\n enter={{ opacity: 1, position: 0 }}\n leave={{ opacity: 0, position: this.state.direction }}\n native\n >\n {item => styles => (\n <Item\n label={item.node}\n onBack={onBack}\n displayBack={item.index > 0}\n compact={compact}\n {...styles}\n />\n )}\n </Transition>\n </Container>\n )\n }\n}\n\nconst Item = ({ opacity, position, displayBack, onBack, label, compact }) => (\n <animated.span\n style={{\n display: 'flex',\n alignItems: 'center',\n opacity,\n transform: position.interpolate(p => `translate(${p * 20}px, 0)`),\n }}\n >\n <Title>\n {displayBack && (\n <BackButton onClick={onBack} compact={compact}>\n <LeftIcon />\n </BackButton>\n )}\n <Label>{label}</Label>\n </Title>\n </animated.span>\n)\n\nItem.propTypes = {\n compact: PropTypes.bool,\n displayBack: PropTypes.bool,\n label: PropTypes.node,\n onBack: PropTypes.func,\n opacity: PropTypes.object,\n position: PropTypes.object,\n}\n\nconst Container = styled.span`\n display: flex;\n position: relative;\n height: 100%;\n`\n\nconst Title = styled.span`\n display: flex;\n align-items: center;\n position: absolute;\n left: 0;\n top: 0;\n bottom: 0;\n`\n\nconst Label = styled.span`\n display: flex;\n height: 100%;\n align-items: center;\n padding-left: 30px;\n white-space: nowrap;\n font-size: 22px;\n`\n\nconst BackButton = styled.span`\n display: flex;\n align-items: center;\n height: 63px;\n padding: ${p => (p.compact ? '0 16px' : '0 20px 0 30px')};\n cursor: pointer;\n svg {\n color: hsl(179, 76%, 48%);\n }\n :active svg {\n color: hsl(179, 76%, 63%);\n }\n & + ${Label} {\n padding-left: 0;\n }\n`\n\nexport default NavigationBar\n"],"names":["NavigationBar","cachedItems","direction","props","onBack","items","compact","displayedItems","map","node","index","slice","React","Transition","item","length","springs","smooth","opacity","position","state","styles","updatedState","Component","PropTypes","func","arrayOf","bool","Item","displayBack","label","animated","display","alignItems","transform","interpolate","p","LeftIcon","propTypes","object","Container","styled","span","Title","Label","BackButton"],"mappings":"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"} |