Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3332 | Ir a la última revisión | | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
3330 stevensc 1
import React from 'react'
2
import { styled } from '@mui/material'
3
 
4
const EmojisList = styled('div')(({ theme }) => ({
5
  display: 'flex',
6
  gap: theme.spacing(0.5),
7
  justifyContent: 'center',
8
  padding: theme.spacing(0.5, 0)
9
}))
10
 
11
const EmojiItem = styled('button')`
12
  width: 32px;
13
  height: 32px;
14
  border-radius: 50%;
15
  transition: all 300ms;
16
  & > img {
17
    height: 100%;
18
    object-fit: cover;
19
    width: 100%;
20
  }
21
  &:hover {
22
    transform: translateY(-5px);
23
  }
24
`
25
 
26
export default function EmojiSelector({ options = [], onSelect = () => {} }) {
27
  return (
28
    <EmojisList>
29
      {options.map(({ link_save, id, image }, index) => (
30
        <EmojiItem onClick={() => onSelect(link_save)} key={id}>
31
          <img
32
            className='fadedown'
33
            src={image}
34
            style={{ animationDelay: `${index + 10}00ms` }}
35
          />
36
        </EmojiItem>
37
      ))}
38
    </EmojisList>
39
  )
40
}