+
+interface DetailsAttributeComponentProps {
+ value: React.ReactNode;
+ onCopy?: (msg: string) => void;
+}
+
+export const DetailsAttributeComponent = withStyles(styles)(
+ (props: DetailsAttributeDataProps & WithStyles<CssRules> & DetailsAttributeComponentProps) =>
+ <Typography component="div" className={props.classes.attribute}>
+ <Typography component="div" className={classnames([props.classes.label, props.classLabel])}>{props.label}</Typography>
+ <Typography
+ onClick={props.onValueClick}
+ component="div"
+ className={classnames([props.classes.value, props.classValue, { [props.classes.lowercaseValue]: props.lowercaseValue }])}>
+ {props.value}
+ {props.children}
+ {(props.linkToUuid || props.copyValue) && props.onCopy && <Tooltip title="Copy to clipboard">
+ <span className={props.classes.copyIcon}>
+ <CopyToClipboard text={props.linkToUuid || props.copyValue || ""} onCopy={() => props.onCopy!("Copied")}>
+ <CopyIcon />
+ </CopyToClipboard>
+ </span>
+ </Tooltip>}
+ </Typography>
+ </Typography>);
+