@procore/core-react
Version:
React library of Procore Design Guidelines
42 lines • 2.32 kB
JavaScript
import { FixedSizeList as List } from 'react-window';
import styled from 'styled-components';
import { Button } from '../../Button/Button';
import { Thumbnail } from '../../Thumbnail/Thumbnail';
import { getTypographyIntent } from '../../Typography/Typography.styles';
import { colors } from '../../_styles/colors';
import { spacing } from '../../_styles/spacing';
export var StyledThumbnailListContainer = /*#__PURE__*/styled.div.withConfig({
displayName: "StyledThumbnailListContainer",
componentId: "core-12_44_0__sc-1fz4ynb-0"
})(["display:flex;flex-direction:column;align-items:stretch;outline:none;"]);
export var StyledThumbnailList = /*#__PURE__*/styled(List).withConfig({
displayName: "StyledThumbnailList",
componentId: "core-12_44_0__sc-1fz4ynb-1"
})(["outline:none;"]);
export var StyledThumbnail = /*#__PURE__*/styled(Thumbnail).withConfig({
displayName: "StyledThumbnail",
componentId: "core-12_44_0__sc-1fz4ynb-2"
})(["flex-grow:1;justify-content:flex-start;"]);
export var StyledProgress = /*#__PURE__*/styled.div.withConfig({
displayName: "StyledProgress",
componentId: "core-12_44_0__sc-1fz4ynb-3"
})(["width:146px;padding:0 ", "px 0 ", "px;margin-left:auto;"], spacing.lg, spacing.xl);
export var StyledThumbnailListItem = /*#__PURE__*/styled.div.withConfig({
displayName: "StyledThumbnailListItem",
componentId: "core-12_44_0__sc-1fz4ynb-4"
})(["display:flex;flex-grow:1;align-items:center;padding:", "px ", "px ", "px ", "px;", " ", " ", " ", ""], spacing.sm, spacing.lg, spacing.sm, spacing.sm, getTypographyIntent('body'), function (_ref) {
var error = _ref.error;
return !error && "\n &:hover {\n background-color: ".concat(colors.gray96, ";\n }\n ");
}, function (_ref2) {
var focused = _ref2.focused,
error = _ref2.error;
return focused && !error && "\n background-color: ".concat(colors.gray96, ";\n ");
}, function (_ref3) {
var error = _ref3.error;
return error && "\n background-color: ".concat(colors.red98, ";\n\n ").concat(StyledProgress, " {\n color: ").concat(colors.red50, ";\n }\n ");
});
export var StyledDeleteIcon = /*#__PURE__*/styled(Button).withConfig({
displayName: "StyledDeleteIcon",
componentId: "core-12_44_0__sc-1fz4ynb-5"
})([""]);
//# sourceMappingURL=ThumbnailList.styles.js.map