@zohodesk/dot
Version:
In this Library, we Provide Some Basic Components to Build Your Application
93 lines (92 loc) • 3.09 kB
JavaScript
import React from 'react';
import { defaultProps } from "./props/defaultProps";
import { propTypes } from "./props/propTypes";
import { Icon } from '@zohodesk/icons';
import { Container, Box } from '@zohodesk/components/lib/Layout';
import Link from "../Link/Link";
import style from "./Attachment.module.css";
export default class Attachment extends React.Component {
render() {
let {
onClick,
dataId,
size,
iconName,
fileName,
fileSize,
downloadLink,
palette,
tooltip,
fileInfo,
i18nKeys,
dataSelectorId,
isDisabled
} = this.props;
let {
downloadTitle = 'Download'
} = i18nKeys;
return /*#__PURE__*/React.createElement(Container, {
isInline: true,
className: `${style.attachment} ${isDisabled ? style.disableAttachment : ""} ${onClick ? style.attachmentHover : ''} ${style[`palette_${palette}`]} ${style[size]}`,
onClick: onClick,
dataId: dataId,
"data-title": tooltip,
alignBox: "row",
isCover: false,
dataSelectorId: dataSelectorId,
tabIndex: "0"
}, iconName ? /*#__PURE__*/React.createElement(Box, {
className: style.attachleft
}, /*#__PURE__*/React.createElement(Container, {
align: "both"
}, /*#__PURE__*/React.createElement(Icon, {
name: iconName,
iconClass: style.attachIcon
}))) : null, /*#__PURE__*/React.createElement(Box, {
flexible: true,
className: style.attachright
}, /*#__PURE__*/React.createElement(Container, {
align: "horizontal"
}, fileName ? /*#__PURE__*/React.createElement(Box, {
className: style.atatchName,
"data-title": fileName
}, fileName) : null, /*#__PURE__*/React.createElement(Box, {
className: style.footer
}, /*#__PURE__*/React.createElement(Container, {
alignBox: "row",
align: "baseline",
isCover: false
}, fileSize ? /*#__PURE__*/React.createElement(Box, {
className: style.attachSize,
adjust: true,
shrink: true,
"data-title": fileSize
}, fileSize) : null, fileInfo ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Box, {
className: style.dot
}), /*#__PURE__*/React.createElement(Box, {
className: style.attachSize,
adjust: true,
shrink: true,
"data-title": fileInfo
}, fileInfo)) : null)))), downloadLink && !isDisabled ? /*#__PURE__*/React.createElement(Link, {
target: "_self",
href: downloadLink,
className: style.attachDownload,
title: downloadTitle,
hasReload: true,
dataId: `${dataId}_download`
}, /*#__PURE__*/React.createElement(Icon, {
name: "ZD-downloadNew",
iconClass: style.downIcon
})) : null, isDisabled ? /*#__PURE__*/React.createElement("div", {
"data-title": tooltip,
className: style.disableLayer
}) : null);
}
}
Attachment.propTypes = propTypes;
Attachment.defaultProps = defaultProps; // if (__DOCS__) {
// Attachment.docs = {
// componentGroup: 'Attachment'
// };
// }