| 1 | {"version":3,"file":"ListView.js","sources":["../src/components/DataView/ListView.js"],"sourcesContent":["import React, { useCallback, useState } from 'react'\nimport PropTypes from 'prop-types'\nimport { Transition, animated } from 'react-spring'\nimport { GU, springs, textStyle } from '../../style'\nimport { useTheme } from '../../theme'\nimport Checkbox from '../Input/Checkbox'\nimport { ToggleButton } from './ToggleButton'\nimport { OpenedSurfaceBorder } from './OpenedSurfaceBorder'\n\nfunction ListView({\n allSelected,\n entries,\n fields,\n hasAnyExpansion,\n onSelect,\n onSelectAll,\n renderSelectionCount,\n selectable,\n rowHeight,\n}) {\n const theme = useTheme()\n\n const [opened, setOpened] = useState(-1)\n\n const toggleEntry = useCallback(index => {\n setOpened(opened => (opened === index ? -1 : index))\n }, [])\n\n const sideSpace = selectable || hasAnyExpansion\n\n return (\n <React.Fragment>\n {entries.map((entry, index) => {\n const hasExpansion = entry.expansion.content.length > 0\n return (\n <div\n key={index}\n css={`\n position: relative;\n padding: 0;\n padding-right: ${3 * GU}px;\n padding-left: ${(sideSpace ? 6.5 : 3) * GU}px;\n border-bottom: ${Number(index !== entries.length - 1)}px solid\n ${theme.border};\n transition: background 150ms ease-in-out;\n background: ${entry.selected ? theme.surfaceSelected : 'none'};\n `}\n >\n <OpenedSurfaceBorder opened={entry.index === opened} />\n {sideSpace && (\n <div\n css={`\n position: absolute;\n top: ${1.5 * GU}px;\n left: 0;\n display: flex;\n justify-content: center;\n width: ${6.5 * GU}px;\n `}\n >\n {selectable && (\n <Select\n index={entry.index}\n selected={entry.selected}\n onSelect={onSelect}\n />\n )}\n {!selectable && hasExpansion && (\n <ToggleButton\n opened={entry.index === opened}\n onClick={() => toggleEntry(entry.index)}\n />\n )}\n </div>\n )}\n {entry.actions && (\n <div\n css={`\n position: absolute;\n top: ${2 * GU}px;\n right: ${3 * GU}px;\n `}\n >\n {entry.actions}\n </div>\n )}\n <div>\n {entry.entryNodes\n .map((content, index) => [\n // field content\n content,\n // field label\n fields[index].label,\n // priority number\n (fields[index].priority && fields[index].priority) || 0,\n ])\n // sort by priority\n .sort((a, b) => b[2] - a[2])\n .map(([content, label], index, entryNodes) => (\n <div\n key={index}\n css={`\n display: flex;\n flex-direction: column;\n padding-bottom: ${index === entryNodes.length - 1\n ? 2 * GU\n : 0}px;\n `}\n >\n <div\n css={`\n display: flex;\n align-items: center;\n margin: ${2 * GU}px 0 ${1 * GU}px;\n color: ${theme.surfaceContentSecondary};\n ${textStyle('label2')};\n `}\n >\n {label}\n </div>\n\n <div>{content}</div>\n </div>\n ))}\n </div>\n {hasExpansion && (\n <EntryExpansion\n expansion={entry.expansion}\n opened={opened === entry.index}\n rowHeight={rowHeight}\n />\n )}\n </div>\n )\n })}\n </React.Fragment>\n )\n}\n\nListView.propTypes = {\n allSelected: PropTypes.oneOf([-1, 0, 1]).isRequired,\n entries: PropTypes.array.isRequired,\n fields: PropTypes.array.isRequired,\n hasAnyExpansion: PropTypes.bool.isRequired,\n onSelect: PropTypes.func.isRequired,\n onSelectAll: PropTypes.func.isRequired,\n renderSelectionCount: PropTypes.func.isRequired,\n rowHeight: PropTypes.number.isRequired,\n selectable: PropTypes.bool.isRequired,\n}\n\n// Disable prop types check for internal components\n/* eslint-disable react/prop-types */\n\nfunction EntryExpansion({ expansion, opened, rowHeight }) {\n const theme = useTheme()\n\n // Handles the height of the expansion in free layout mode\n const [freeLayoutContentHeight, setFreeLayoutContentHeight] = useState(0)\n\n const handleFreeLayoutContentRef = useCallback(element => {\n if (element) {\n setFreeLayoutContentHeight(element.getBoundingClientRect().height)\n }\n }, [])\n\n const height = expansion.freeLayout\n ? freeLayoutContentHeight\n : rowHeight * expansion.content.length\n\n return (\n <Transition\n native\n items={opened}\n from={{ height: 0 }}\n enter={{ height }}\n update={{ height }}\n leave={{ height: 0 }}\n config={{ ...springs.smooth, precision: 0.1 }}\n >\n {show =>\n show &&\n (({ height }) => (\n <animated.div\n css={`\n overflow: hidden;\n background: ${theme.surfaceUnder};\n margin-left: ${-6.5 * GU}px;\n margin-right: ${-3 * GU}px;\n padding-left: ${6.5 * GU}px;\n box-shadow: inset 0 6px 4px -4px rgba(0, 0, 0, 0.16);\n `}\n style={{\n height: height.interpolate(v => `${v}px`),\n }}\n >\n {expansion.content.map((child, i) => (\n <div\n key={i}\n ref={expansion.freeLayout ? handleFreeLayoutContentRef : null}\n css={`\n display: flex;\n align-items: center;\n height: ${expansion.freeLayout ? 'auto' : `${rowHeight}px`};\n padding-right: ${3 * GU}px;\n `}\n >\n {child}\n </div>\n ))}\n </animated.div>\n ))\n }\n </Transition>\n )\n}\n\nfunction Select({ index, selected, onSelect }) {\n const change = useCallback(\n check => {\n onSelect(index, check)\n },\n [index, onSelect]\n )\n\n return <Checkbox onChange={change} checked={selected} />\n}\n\n/* eslint-enable react/prop-types */\n\nexport { ListView }\n"],"names":["ListView","allSelected","entries","fields","hasAnyExpansion","onSelect","onSelectAll","renderSelectionCount","selectable","rowHeight","theme","useTheme","useState","opened","setOpened","toggleEntry","useCallback","index","sideSpace","React","map","entry","hasExpansion","expansion","content","length","GU","Number","border","selected","surfaceSelected","OpenedSurfaceBorder","ToggleButton","actions","entryNodes","label","priority","sort","a","b","surfaceContentSecondary","textStyle","propTypes","PropTypes","oneOf","isRequired","array","bool","func","number","EntryExpansion","freeLayoutContentHeight","setFreeLayoutContentHeight","handleFreeLayoutContentRef","element","getBoundingClientRect","height","freeLayout","Transition","springs","smooth","precision","show","interpolate","v","surfaceUnder","child","i","Select","change","check","Checkbox"],"mappings":"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"} |