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
35
36
37
38
| import type { CSSProperties } from "react";
| import { cn } from "../../utils/bem";
| import "./ToggleItems.scss";
|
| export const ToggleItems = ({
| className,
| style,
| big,
| items,
| active,
| onSelect,
| }: {
| className: string;
| style?: CSSProperties;
| big?: boolean;
| items: { [name: string]: string };
| active: string;
| onSelect: (name: string) => any;
| }) => {
| const rootClass = cn("toggle-items");
|
| return (
| <ul className={rootClass.mod({ big }).mix(className).toString()} style={style}>
| {Object.keys(items).map((item) => (
| <li
| key={item}
| className={rootClass
| .elem("item")
| .mod({ active: item === active })
| .toString()}
| onClick={() => onSelect(item)}
| >
| {items[item]}
| </li>
| ))}
| </ul>
| );
| };
|
|
