繰り返し処理をしている中で、個別に処理が加えられるようにしたい

目的

Chip要素をクリックすると、そのChip要素のみのborderColorの色が赤になるようにしたい。
また、Chip要素にあるcloseボタンを押すとborderColorの色が黒になるようにしたい。

現状

React-Native-paper のChipコンポーネントを利用しています。
mapでループ処理を行い、「user」の中身を表示しています。

TypeScript
1{
2     val.user.map((val: any, key: number) => {
3               return(
4                  <Chip
5                      key={keyString}
6                      icon=''
7                      closeIcon='close'
8                      onPress={() => {
9　　　　　　　　　// borderColorに色をつける処理？
10                      }}
11                      onClose={() => {
12　　　　　　　　　// borderColorの色をもとに戻す処理？
13                      }}
14                     style={{
15                        backgroundColor: backgroundColor,
16                        marginRight: 3,
17                        borderColor: borderColor //Chip要素をクリックするとここの色を変えられるようにしたい！
18                      }}
19                   >
20                      <Text key={keyString}>
21                         {val2.userName}
22                      </Text>
23                   </Chip>
24                 )
25               })
26           }