@pinnacle0/web-ui 0.2.52 → 0.2.53
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.
package/core/TagInput/index.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import type { ControlledFormValue, PickOptional } from "../../internal/type";
|
|
2
|
+
import type { ControlledFormValue, PickOptional, SafeReactChild } from "../../internal/type";
|
|
3
3
|
import "./index.less";
|
|
4
4
|
interface Props<T> extends ControlledFormValue<T[]> {
|
|
5
5
|
parser: (rawString: string) => T[];
|
|
@@ -7,6 +7,7 @@ interface Props<T> extends ControlledFormValue<T[]> {
|
|
|
7
7
|
className?: (item: T) => string;
|
|
8
8
|
style?: React.CSSProperties;
|
|
9
9
|
disabled?: boolean;
|
|
10
|
+
placeholder?: SafeReactChild;
|
|
10
11
|
}
|
|
11
12
|
interface State {
|
|
12
13
|
inputText: string;
|
package/core/TagInput/index.js
CHANGED
|
@@ -40,6 +40,7 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
|
|
|
40
40
|
};
|
|
41
41
|
import React from "react";
|
|
42
42
|
import "./index.less";
|
|
43
|
+
var separators = [",", " ", ";", "|", "*", "Tab", "Enter"];
|
|
43
44
|
var TagInput = /** @class */ (function (_super) {
|
|
44
45
|
__extends(TagInput, _super);
|
|
45
46
|
function TagInput(props) {
|
|
@@ -64,19 +65,15 @@ var TagInput = /** @class */ (function (_super) {
|
|
|
64
65
|
}
|
|
65
66
|
};
|
|
66
67
|
_this.onKeyDown = function (event) {
|
|
67
|
-
// Ref: https://
|
|
68
|
+
// Ref: https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key/Key_Values
|
|
68
69
|
var inputText = _this.state.inputText;
|
|
69
|
-
if (event.
|
|
70
|
-
// Backspace
|
|
70
|
+
if (event.key === "Backspace") {
|
|
71
71
|
if (!inputText.length) {
|
|
72
72
|
_this.removeTag(_this.props.value.length - 1);
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
|
-
else if (
|
|
76
|
-
|
|
77
|
-
// Enter:13
|
|
78
|
-
// Space, 32
|
|
79
|
-
// Comma: 188
|
|
75
|
+
else if (separators.includes(event.key)) {
|
|
76
|
+
event.preventDefault();
|
|
80
77
|
_this.addTagsByInput(inputText);
|
|
81
78
|
}
|
|
82
79
|
};
|
|
@@ -87,7 +84,7 @@ var TagInput = /** @class */ (function (_super) {
|
|
|
87
84
|
}
|
|
88
85
|
TagInput.prototype.render = function () {
|
|
89
86
|
var _this = this;
|
|
90
|
-
var _a = this.props, value = _a.value, renderTag = _a.renderTag, className = _a.className, style = _a.style, disabled = _a.disabled;
|
|
87
|
+
var _a = this.props, value = _a.value, renderTag = _a.renderTag, className = _a.className, style = _a.style, disabled = _a.disabled, placeholder = _a.placeholder;
|
|
91
88
|
var inputText = this.state.inputText;
|
|
92
89
|
return (React.createElement("div", { className: "g-tag-input " + (disabled ? "ant-input-disabled" : ""), style: style },
|
|
93
90
|
value.map(function (tag, index) {
|
|
@@ -95,6 +92,7 @@ var TagInput = /** @class */ (function (_super) {
|
|
|
95
92
|
renderTag(tag),
|
|
96
93
|
React.createElement("i", { onClick: function () { return _this.removeTag(index); } }, "\u00D7")));
|
|
97
94
|
}),
|
|
95
|
+
!value.length && !inputText && React.createElement("div", { className: "placeholder" }, placeholder),
|
|
98
96
|
React.createElement("textarea", { disabled: disabled, onBlur: this.onBlur, onChange: this.onChange, onKeyDown: this.onKeyDown, value: inputText, autoFocus: true })));
|
|
99
97
|
};
|
|
100
98
|
TagInput.displayName = "TagInput";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/TagInput/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/TagInput/index.tsx"],"names":[],"mappings":"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"}
|
package/core/TagInput/index.less
CHANGED
|
@@ -6,6 +6,17 @@
|
|
|
6
6
|
height: 100%;
|
|
7
7
|
border: 1px solid #ddd;
|
|
8
8
|
border-radius: 4px;
|
|
9
|
+
position: relative;
|
|
10
|
+
|
|
11
|
+
.placeholder {
|
|
12
|
+
position: absolute;
|
|
13
|
+
top: 0;
|
|
14
|
+
left: 0;
|
|
15
|
+
font-size: 16px;
|
|
16
|
+
padding: 2px 7px;
|
|
17
|
+
color: rgb(211, 211, 211);
|
|
18
|
+
z-index: 1;
|
|
19
|
+
}
|
|
9
20
|
|
|
10
21
|
.g-tag-input-label {
|
|
11
22
|
height: 28px;
|
|
@@ -29,6 +40,8 @@
|
|
|
29
40
|
background: transparent;
|
|
30
41
|
font-size: 16px;
|
|
31
42
|
border: 0;
|
|
43
|
+
position: relative;
|
|
44
|
+
z-index: 2;
|
|
32
45
|
|
|
33
46
|
&:focus,
|
|
34
47
|
&:active,
|