@bitrise/bitkit 12.93.1-alpha.1 → 12.93.1-alpha.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/package.json +1 -1
  2. package/src/Components/Form/ChipInput/ChipInput.tsx +10 -4
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bitrise/bitkit",
3
3
  "description": "Bitrise React component library",
4
- "version": "12.93.1-alpha.1",
4
+ "version": "12.93.1-alpha.3",
5
5
  "repository": {
6
6
  "type": "git",
7
7
  "url": "git+ssh://git@github.com/bitrise-io/bitkit.git"
package/src/Components/Form/ChipInput/ChipInput.tsx CHANGED
@@ -42,6 +42,12 @@ const ChipInput = ({
42
42
  }: ChipInputProps) => {
43
43
  const theme = useStyleConfig('ChipInput');
44
44
  const keyupHandler: KeyboardEventHandler<HTMLInputElement> = (ev) => {
45
+ const target = ev.currentTarget;
46
+ if (ev.key === 'Backspace' && target.value.length === 0) {
47
+ onRemove(value[value.length - 1]);
48
+ }
49
+ };
50
+ const keydownHandler: KeyboardEventHandler<HTMLInputElement> = (ev) => {
45
51
  const target = ev.currentTarget;
46
52
  if (ev.key.match(separator)) {
47
53
  ev.preventDefault();
@@ -52,8 +58,6 @@ const ChipInput = ({
52
58
  }
53
59
  target.value = '';
54
60
  }
55
- } else if (ev.key === 'Backspace' && target.value.length === 0) {
56
- onRemove(value[value.length - 1]);
57
61
  }
58
62
  };
59
63
  const pasteEventHandler: ClipboardEventHandler<HTMLInputElement> = (ev) => {
@@ -105,6 +109,7 @@ const ChipInput = ({
105
109
  flexWrap="wrap"
106
110
  gap="4"
107
111
  paddingRight={isInvalid ? '42px' : undefined}
112
+ position="relative"
108
113
  >
109
114
  {value.map((item, idx) => (
110
115
  <Tag
@@ -130,10 +135,11 @@ const ChipInput = ({
130
135
  _focusVisible={{ boxShadow: 'none' }}
131
136
  flexGrow="1"
132
137
  id={id}
133
- onKeyDown={keyupHandler}
138
+ onKeyDown={keydownHandler}
139
+ onKeyUp={keyupHandler}
134
140
  onPaste={pasteEventHandler}
135
141
  />
136
- {isInvalid && <Icon color="icon.negative" name="ErrorCircleFilled" position="absolute" right="2rem" />}
142
+ {isInvalid && <Icon color="icon.negative" name="ErrorCircleFilled" position="absolute" right="16" />}
137
143
  </Box>
138
144
  {errorText && <FormErrorMessage as="p">{errorText}</FormErrorMessage>}
139
145
  {helperText && <FormHelperText as="p">{helperText}</FormHelperText>}