UNPKG

@sanity/form-builder

Version:
80 lines (79 loc) 2.78 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = TableList; var _react = _interopRequireDefault(require("react")); var _ui = require("@sanity/ui"); var _AssetRow = _interopRequireDefault(require("./AssetRow")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } var STYLES_FILENAME = { paddingLeft: '2.2rem' }; var STYLES_GRID = { gridTemplateColumns: '3fr 1fr 1fr 2fr 30px' }; function TableList(props) { var mediaIndex = (0, _ui.useMediaIndex)(); var isMobile = mediaIndex < 2; var assets = props.assets, onClick = props.onClick, onKeyPress = props.onKeyPress, onDeleteFinished = props.onDeleteFinished, selectedAssets = props.selectedAssets, isLoading = props.isLoading; return /*#__PURE__*/_react.default.createElement(_ui.Box, { padding: 4 }, /*#__PURE__*/_react.default.createElement(_ui.Card, { borderBottom: true, paddingBottom: 2, marginBottom: 1 }, isMobile ? /*#__PURE__*/_react.default.createElement(_ui.Grid, { style: STYLES_GRID }, /*#__PURE__*/_react.default.createElement(_ui.Box, { flex: 2, paddingLeft: 5 }, /*#__PURE__*/_react.default.createElement(_ui.Label, { muted: true, size: 1 }, "Filename"))) : /*#__PURE__*/_react.default.createElement(_ui.Grid, { gap: 1, style: STYLES_GRID }, /*#__PURE__*/_react.default.createElement(_ui.Box, { flex: 2, style: STYLES_FILENAME }, /*#__PURE__*/_react.default.createElement(_ui.Label, { muted: true, size: 1 }, "Filename")), /*#__PURE__*/_react.default.createElement(_ui.Box, { flex: 1 }, /*#__PURE__*/_react.default.createElement(_ui.Label, { muted: true, size: 1 }, "Size")), /*#__PURE__*/_react.default.createElement(_ui.Box, { flex: 1 }, /*#__PURE__*/_react.default.createElement(_ui.Label, { muted: true, size: 1 }, "Type")), /*#__PURE__*/_react.default.createElement(_ui.Box, { flex: 1 }, /*#__PURE__*/_react.default.createElement(_ui.Label, { muted: true, size: 1 }, "Date added")))), /*#__PURE__*/_react.default.createElement(_ui.Stack, null, isLoading && assets.length === 0 && /*#__PURE__*/_react.default.createElement(_ui.Box, { paddingTop: 4, paddingBottom: 2 }, /*#__PURE__*/_react.default.createElement(_ui.Flex, { justify: "center" }, /*#__PURE__*/_react.default.createElement(_ui.Spinner, { muted: true }))), assets.map(asset => /*#__PURE__*/_react.default.createElement(_AssetRow.default, { key: asset._id, asset: asset, isMobile: isMobile, isSelected: selectedAssets.some(selected => selected._id === asset._id), onClick: onClick, onKeyPress: onKeyPress, onDeleteFinished: onDeleteFinished })))); }