"Fossies" - the Fresh Open Source Software Archive

Member "jitsi-meet-7307/react/features/display-name/components/web/DisplayNameBadge.tsx" (30 May 2023, 854 Bytes) of package /linux/misc/jitsi-meet-7307.tar.gz:

As a special service "Fossies" has tried to format the requested source page into HTML format using (guessed) TSX (TypeScript with React) source code syntax highlighting (style: standard) with prefixed line numbers. Alternatively you can here view or download the uninterpreted source code file. 
    1 import React from 'react';
    2 import { makeStyles } from 'tss-react/mui';
    3 
    4 const useStyles = makeStyles()(theme => {
    5     const { text01 } = theme.palette;
    6 
    7     return {
    8         badge: {
    9             background: 'rgba(0, 0, 0, 0.6)',
   10             borderRadius: '3px',
   11             color: text01,
   12             maxWidth: '50%',
   13             overflow: 'hidden',
   14             padding: '2px 16px',
   15             textOverflow: 'ellipsis',
   16             whiteSpace: 'nowrap'
   17         }
   18     };
   19 });
   20 
   21 /**
   22  * Component that displays a name badge.
   23  *
   24  * @param {Props} props - The props of the component.
   25  * @returns {ReactElement}
   26  */
   27 const DisplayNameBadge: React.FC<{ name: string; }> = ({ name }) => {
   28     const { classes } = useStyles();
   29 
   30     return (
   31         <div className = { classes.badge }>
   32             { name }
   33         </div>
   34     );
   35 };
   36 
   37 export default DisplayNameBadge;