Proyectos de Subversion LeadersLinked - Antes de SPA

import React from 'react'
import styled from 'styled-components'
import SearchIcon from '@mui/icons-material/Search'

const StyledSearchBar = styled.div`
  align-items: center;
  background-color: #eef3f0;
  border-radius: var(--border-radius);
  color: gray;
  cursor: pointer;
  display: flex;
  min-height: 1.5rem;
  padding: 0.5rem;
  width: -webkit-fill-available;
  transition: all 0.2s;

  input {
    border: none;
    outline: none;
    background: none;
    flex-grow: 1;
  }
`

const SearchInput = ({ onChange, value, placeholder = 'Search', ...rest }) => {
  return (
    <StyledSearchBar {...rest}>
      <SearchIcon />
      <input
        type="text"
        placeholder={placeholder}
        onChange={onChange}
        value={value}
      />
    </StyledSearchBar>
  )
}

export default SearchInput