TypingDropdownMultipleSelection index.tsx

0% Statements 0/8

100% Branches 0/0

0% Functions 0/3

0% Lines 0/8

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
  import Chip from "../Chip";
import { useTypingDropdownMultipleContext } from "./contexts/TypingDropdownMultipleContext";
import SearchDropdown from "./SearchDropdown";
import { TypingDropdownMultipleSelectionPropTypes } from "./types";
 
function TypingDropdownMultipleSelection(
  props: TypingDropdownMultipleSelectionPropTypes,
) {
  const { values, handleDelete } = useTypingDropdownMultipleContext();
 
  return (
    <div className="flex flex-col gap-2 w-full">
      <div
        className={`flex flex-wrap items-center gap-1 w-full p-1 rounded border border-lightgray bg-white text-sm focus:outline-none`}>
        {values?.map((item, index) => (
          <Chip
            key={item}
            item={item}
            handleClick={() => handleDelete(index)}
          />
        ))}
 
        <SearchDropdown
          label={props.label}
          placeholder={props.placeholder}
          disabled={props.disabled}
        />
      </div>
    </div>
  );
}
 
export default TypingDropdownMultipleSelection;