@manuscripts/style-guide 2.0.29-LEAN-4077.5 → 2.0.29-LEAN-4077.7

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 (3) hide show
  1. package/dist/cjs/components/MultiValueInput.js +18 -10
  2. package/dist/es/components/MultiValueInput.js +18 -10
  3. package/package.json +1 -1
package/dist/cjs/components/MultiValueInput.js CHANGED
@@ -105,16 +105,13 @@ const Input = styled_components_1.default.input `
105
105
  const MultiValueInput = ({ inputType, placeholder = '', initialValues = [], onChange, }) => {
106
106
  const [values, setValues] = (0, react_1.useState)(initialValues);
107
107
  const [currentValue, setCurrentValue] = (0, react_1.useState)('');
108
- const handleAddValue = (e) => {
109
- if (e.key === 'Enter' && currentValue.trim()) {
110
- e.preventDefault();
111
- if (!values.includes(currentValue.trim())) {
112
- const updatedValues = [...values, currentValue.trim()];
113
- setValues(updatedValues);
114
- onChange === null || onChange === void 0 ? void 0 : onChange(updatedValues);
115
- }
116
- setCurrentValue('');
108
+ const handleAddValue = (value) => {
109
+ if (value.trim() && !values.includes(value.trim())) {
110
+ const updatedValues = [...values, value.trim()];
111
+ setValues(updatedValues);
112
+ onChange === null || onChange === void 0 ? void 0 : onChange(updatedValues);
117
113
  }
114
+ setCurrentValue('');
118
115
  };
119
116
  const handleInputChange = (e) => {
120
117
  const value = e.target.value;
@@ -125,6 +122,17 @@ const MultiValueInput = ({ inputType, placeholder = '', initialValues = [], onCh
125
122
  setCurrentValue(value);
126
123
  }
127
124
  };
125
+ const handleBlur = () => {
126
+ if (currentValue) {
127
+ handleAddValue(currentValue);
128
+ }
129
+ };
130
+ const handleKeyDown = (e) => {
131
+ if (e.key === 'Enter') {
132
+ e.preventDefault();
133
+ handleAddValue(currentValue);
134
+ }
135
+ };
128
136
  const handleRemoveValue = (index) => {
129
137
  const updatedValues = values.filter((_, i) => i !== index);
130
138
  setValues(updatedValues);
@@ -139,6 +147,6 @@ const MultiValueInput = ({ inputType, placeholder = '', initialValues = [], onCh
139
147
  values.map((value, index) => (react_1.default.createElement(Chip, { key: index },
140
148
  value,
141
149
  react_1.default.createElement(RemoveButton, { onMouseUp: () => handleRemoveValue(index) }, "\u00D7")))),
142
- react_1.default.createElement(Input, { type: inputType, value: currentValue, onChange: handleInputChange, onKeyDown: handleAddValue, placeholder: xplaceholder })));
150
+ react_1.default.createElement(Input, { type: inputType, value: currentValue, onChange: handleInputChange, onKeyDown: handleKeyDown, onBlur: handleBlur, placeholder: xplaceholder })));
143
151
  };
144
152
  exports.MultiValueInput = MultiValueInput;
package/dist/es/components/MultiValueInput.js CHANGED
@@ -76,16 +76,13 @@ const Input = styled.input `
76
76
  export const MultiValueInput = ({ inputType, placeholder = '', initialValues = [], onChange, }) => {
77
77
  const [values, setValues] = useState(initialValues);
78
78
  const [currentValue, setCurrentValue] = useState('');
79
- const handleAddValue = (e) => {
80
- if (e.key === 'Enter' && currentValue.trim()) {
81
- e.preventDefault();
82
- if (!values.includes(currentValue.trim())) {
83
- const updatedValues = [...values, currentValue.trim()];
84
- setValues(updatedValues);
85
- onChange === null || onChange === void 0 ? void 0 : onChange(updatedValues);
86
- }
87
- setCurrentValue('');
79
+ const handleAddValue = (value) => {
80
+ if (value.trim() && !values.includes(value.trim())) {
81
+ const updatedValues = [...values, value.trim()];
82
+ setValues(updatedValues);
83
+ onChange === null || onChange === void 0 ? void 0 : onChange(updatedValues);
88
84
  }
85
+ setCurrentValue('');
89
86
  };
90
87
  const handleInputChange = (e) => {
91
88
  const value = e.target.value;
@@ -96,6 +93,17 @@ export const MultiValueInput = ({ inputType, placeholder = '', initialValues = [
96
93
  setCurrentValue(value);
97
94
  }
98
95
  };
96
+ const handleBlur = () => {
97
+ if (currentValue) {
98
+ handleAddValue(currentValue);
99
+ }
100
+ };
101
+ const handleKeyDown = (e) => {
102
+ if (e.key === 'Enter') {
103
+ e.preventDefault();
104
+ handleAddValue(currentValue);
105
+ }
106
+ };
99
107
  const handleRemoveValue = (index) => {
100
108
  const updatedValues = values.filter((_, i) => i !== index);
101
109
  setValues(updatedValues);
@@ -110,5 +118,5 @@ export const MultiValueInput = ({ inputType, placeholder = '', initialValues = [
110
118
  values.map((value, index) => (React.createElement(Chip, { key: index },
111
119
  value,
112
120
  React.createElement(RemoveButton, { onMouseUp: () => handleRemoveValue(index) }, "\u00D7")))),
113
- React.createElement(Input, { type: inputType, value: currentValue, onChange: handleInputChange, onKeyDown: handleAddValue, placeholder: xplaceholder })));
121
+ React.createElement(Input, { type: inputType, value: currentValue, onChange: handleInputChange, onKeyDown: handleKeyDown, onBlur: handleBlur, placeholder: xplaceholder })));
114
122
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@manuscripts/style-guide",
3
3
  "description": "Shared components for Manuscripts applications",
4
- "version": "2.0.29-LEAN-4077.5",
4
+ "version": "2.0.29-LEAN-4077.7",
5
5
  "repository": "github:Atypon-OpenSource/manuscripts-style-guide",
6
6
  "license": "Apache-2.0",
7
7
  "main": "dist/cjs",