@hi-ui/input 5.0.0-canary.7 → 5.0.0-canary.8

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 (5) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/lib/cjs/Input.js +19 -12
  3. package/lib/esm/Input.js +19 -12
  4. package/lib/types/Input.d.ts +20 -0
  5. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @hi-ui/input
2
2
 
3
+ ## 5.0.0-canary.8
4
+
5
+ ### Minor Changes
6
+
7
+ - ab2d5625d: feat(input&number-input): add styles and classNames api (5.0)
8
+
3
9
  ## 5.0.0-canary.7
4
10
 
5
11
  ### Patch Changes
package/lib/cjs/Input.js CHANGED
@@ -68,7 +68,9 @@ var Input = /*#__PURE__*/React.forwardRef(function (_a, ref) {
68
68
  type = _a.type,
69
69
  containerRef = _a.containerRef,
70
70
  waitCompositionEnd = _a.waitCompositionEnd,
71
- rest = tslib.__rest(_a, ["prefixCls", "role", "className", "style", "size", "appearance", "prepend", "append", "prefix", "suffix", "clearableTrigger", "clearable", "invalid", "name", "autoFocus", "disabled", "readOnly", "maxLength", "placeholder", "defaultValue", "value", "onChange", "onFocus", "onBlur", "onKeyDown", "trimValueOnBlur", "onClear", "type", "containerRef", "waitCompositionEnd"]);
71
+ styles = _a.styles,
72
+ classNames = _a.classNames,
73
+ rest = tslib.__rest(_a, ["prefixCls", "role", "className", "style", "size", "appearance", "prepend", "append", "prefix", "suffix", "clearableTrigger", "clearable", "invalid", "name", "autoFocus", "disabled", "readOnly", "maxLength", "placeholder", "defaultValue", "value", "onChange", "onFocus", "onBlur", "onKeyDown", "trimValueOnBlur", "onClear", "type", "containerRef", "waitCompositionEnd", "styles", "classNames"]);
72
74
  // @TODO: 临时方案，后面迁移至 InputGroup
73
75
  var _useMemo = React.useMemo(function () {
74
76
  var shouldUnset = [false, false];
@@ -134,9 +136,10 @@ var Input = /*#__PURE__*/React.forwardRef(function (_a, ref) {
134
136
  ref: containerRef
135
137
  }, /*#__PURE__*/React__default["default"].createElement("div", {
136
138
  className: outerCls
137
- }, prepend ? /*#__PURE__*/React__default["default"].createElement("div", {
138
- className: prefixCls + "__prepend"
139
- }, prepend) : null, /*#__PURE__*/React__default["default"].createElement("div", {
139
+ }, prepend ? ( /*#__PURE__*/React__default["default"].createElement("div", {
140
+ className: prefixCls + "__prepend " + (classNames === null || classNames === void 0 ? void 0 : classNames.prepend),
141
+ style: styles === null || styles === void 0 ? void 0 : styles.prepend
142
+ }, prepend)) : null, /*#__PURE__*/React__default["default"].createElement("div", {
140
143
  className: classname.cx(prefixCls + "__inner", prefix && prefixCls + "__inner--prefix", suffix && prefixCls + "__inner--suffix", focused && prefixCls + "__inner--focused", disabled && prefixCls + "__inner--disabled", readOnly && prefixCls + "__inner--readonly", invalid && prefixCls + "__inner--invalid"),
141
144
  onMouseOver: function onMouseOver(e) {
142
145
  setHover(true);
@@ -144,13 +147,16 @@ var Input = /*#__PURE__*/React.forwardRef(function (_a, ref) {
144
147
  onMouseLeave: function onMouseLeave(e) {
145
148
  setHover(false);
146
149
  }
147
- }, prefix ? /*#__PURE__*/React__default["default"].createElement("span", {
148
- className: prefixCls + "__prefix"
149
- }, prefix) : null, /*#__PURE__*/React__default["default"].createElement("input", Object.assign({
150
+ }, prefix ? ( /*#__PURE__*/React__default["default"].createElement("span", {
151
+ className: prefixCls + "__prefix " + (classNames === null || classNames === void 0 ? void 0 : classNames.prefix),
152
+ style: styles === null || styles === void 0 ? void 0 : styles.prefix
153
+ }, prefix)) : null, /*#__PURE__*/React__default["default"].createElement("input", Object.assign({
150
154
  ref: mergedRef,
151
- className: prefixCls + "__text"
155
+ className: prefixCls + "__text " + (classNames === null || classNames === void 0 ? void 0 : classNames.input),
156
+ style: styles === null || styles === void 0 ? void 0 : styles.input
152
157
  }, getInputProps(), rest)), suffix || showClearableIcon ? ( /*#__PURE__*/React__default["default"].createElement("span", {
153
- className: prefixCls + "__suffix"
158
+ className: prefixCls + "__suffix " + (classNames === null || classNames === void 0 ? void 0 : classNames.suffix),
159
+ style: styles === null || styles === void 0 ? void 0 : styles.suffix
154
160
  }, showClearableIcon ? ( /*#__PURE__*/React__default["default"].createElement("span", {
155
161
  ref: clearElementRef,
156
162
  className: classname.cx(prefixCls + "__clear", (clearableTrigger === 'always' || hover) && prefixCls + "__clear--active"),
@@ -161,9 +167,10 @@ var Input = /*#__PURE__*/React.forwardRef(function (_a, ref) {
161
167
  onClear === null || onClear === void 0 ? void 0 : onClear();
162
168
  focus();
163
169
  }
164
- }, /*#__PURE__*/React__default["default"].createElement(icons.CloseCircleFilled, null))) : null, suffix)) : null), append ? /*#__PURE__*/React__default["default"].createElement("div", {
165
- className: prefixCls + "__append"
166
- }, append) : null));
170
+ }, /*#__PURE__*/React__default["default"].createElement(icons.CloseCircleFilled, null))) : null, suffix)) : null), append ? ( /*#__PURE__*/React__default["default"].createElement("div", {
171
+ className: prefixCls + "__append " + (classNames === null || classNames === void 0 ? void 0 : classNames.append),
172
+ style: styles === null || styles === void 0 ? void 0 : styles.append
173
+ }, append)) : null));
167
174
  });
168
175
  if (env.__DEV__) {
169
176
  Input.displayName = 'Input';
package/lib/esm/Input.js CHANGED
@@ -56,7 +56,9 @@ var Input = /*#__PURE__*/forwardRef(function (_a, ref) {
56
56
  type = _a.type,
57
57
  containerRef = _a.containerRef,
58
58
  waitCompositionEnd = _a.waitCompositionEnd,
59
- rest = __rest(_a, ["prefixCls", "role", "className", "style", "size", "appearance", "prepend", "append", "prefix", "suffix", "clearableTrigger", "clearable", "invalid", "name", "autoFocus", "disabled", "readOnly", "maxLength", "placeholder", "defaultValue", "value", "onChange", "onFocus", "onBlur", "onKeyDown", "trimValueOnBlur", "onClear", "type", "containerRef", "waitCompositionEnd"]);
59
+ styles = _a.styles,
60
+ classNames = _a.classNames,
61
+ rest = __rest(_a, ["prefixCls", "role", "className", "style", "size", "appearance", "prepend", "append", "prefix", "suffix", "clearableTrigger", "clearable", "invalid", "name", "autoFocus", "disabled", "readOnly", "maxLength", "placeholder", "defaultValue", "value", "onChange", "onFocus", "onBlur", "onKeyDown", "trimValueOnBlur", "onClear", "type", "containerRef", "waitCompositionEnd", "styles", "classNames"]);
60
62
  // @TODO: 临时方案，后面迁移至 InputGroup
61
63
  var _useMemo = useMemo(function () {
62
64
  var shouldUnset = [false, false];
@@ -122,9 +124,10 @@ var Input = /*#__PURE__*/forwardRef(function (_a, ref) {
122
124
  ref: containerRef
123
125
  }, /*#__PURE__*/React.createElement("div", {
124
126
  className: outerCls
125
- }, prepend ? /*#__PURE__*/React.createElement("div", {
126
- className: prefixCls + "__prepend"
127
- }, prepend) : null, /*#__PURE__*/React.createElement("div", {
127
+ }, prepend ? ( /*#__PURE__*/React.createElement("div", {
128
+ className: prefixCls + "__prepend " + (classNames === null || classNames === void 0 ? void 0 : classNames.prepend),
129
+ style: styles === null || styles === void 0 ? void 0 : styles.prepend
130
+ }, prepend)) : null, /*#__PURE__*/React.createElement("div", {
128
131
  className: cx(prefixCls + "__inner", prefix && prefixCls + "__inner--prefix", suffix && prefixCls + "__inner--suffix", focused && prefixCls + "__inner--focused", disabled && prefixCls + "__inner--disabled", readOnly && prefixCls + "__inner--readonly", invalid && prefixCls + "__inner--invalid"),
129
132
  onMouseOver: function onMouseOver(e) {
130
133
  setHover(true);
@@ -132,13 +135,16 @@ var Input = /*#__PURE__*/forwardRef(function (_a, ref) {
132
135
  onMouseLeave: function onMouseLeave(e) {
133
136
  setHover(false);
134
137
  }
135
- }, prefix ? /*#__PURE__*/React.createElement("span", {
136
- className: prefixCls + "__prefix"
137
- }, prefix) : null, /*#__PURE__*/React.createElement("input", Object.assign({
138
+ }, prefix ? ( /*#__PURE__*/React.createElement("span", {
139
+ className: prefixCls + "__prefix " + (classNames === null || classNames === void 0 ? void 0 : classNames.prefix),
140
+ style: styles === null || styles === void 0 ? void 0 : styles.prefix
141
+ }, prefix)) : null, /*#__PURE__*/React.createElement("input", Object.assign({
138
142
  ref: mergedRef,
139
- className: prefixCls + "__text"
143
+ className: prefixCls + "__text " + (classNames === null || classNames === void 0 ? void 0 : classNames.input),
144
+ style: styles === null || styles === void 0 ? void 0 : styles.input
140
145
  }, getInputProps(), rest)), suffix || showClearableIcon ? ( /*#__PURE__*/React.createElement("span", {
141
- className: prefixCls + "__suffix"
146
+ className: prefixCls + "__suffix " + (classNames === null || classNames === void 0 ? void 0 : classNames.suffix),
147
+ style: styles === null || styles === void 0 ? void 0 : styles.suffix
142
148
  }, showClearableIcon ? ( /*#__PURE__*/React.createElement("span", {
143
149
  ref: clearElementRef,
144
150
  className: cx(prefixCls + "__clear", (clearableTrigger === 'always' || hover) && prefixCls + "__clear--active"),
@@ -149,9 +155,10 @@ var Input = /*#__PURE__*/forwardRef(function (_a, ref) {
149
155
  onClear === null || onClear === void 0 ? void 0 : onClear();
150
156
  focus();
151
157
  }
152
- }, /*#__PURE__*/React.createElement(CloseCircleFilled, null))) : null, suffix)) : null), append ? /*#__PURE__*/React.createElement("div", {
153
- className: prefixCls + "__append"
154
- }, append) : null));
158
+ }, /*#__PURE__*/React.createElement(CloseCircleFilled, null))) : null, suffix)) : null), append ? ( /*#__PURE__*/React.createElement("div", {
159
+ className: prefixCls + "__append " + (classNames === null || classNames === void 0 ? void 0 : classNames.append),
160
+ style: styles === null || styles === void 0 ? void 0 : styles.append
161
+ }, append)) : null));
155
162
  });
156
163
  if (__DEV__) {
157
164
  Input.displayName = 'Input';
package/lib/types/Input.d.ts CHANGED
@@ -93,6 +93,26 @@ export interface InputProps extends HiBaseHTMLFieldProps<'input'> {
93
93
  * 是否等待文本段落组成完成
94
94
  */
95
95
  waitCompositionEnd?: boolean;
96
+ /**
97
+ * 语义化样式设置
98
+ */
99
+ styles?: {
100
+ input?: React.CSSProperties;
101
+ prefix?: React.CSSProperties;
102
+ suffix?: React.CSSProperties;
103
+ prepend?: React.CSSProperties;
104
+ append?: React.CSSProperties;
105
+ };
106
+ /**
107
+ * 语义化样式类名设置
108
+ */
109
+ classNames?: {
110
+ input?: string;
111
+ prefix?: string;
112
+ suffix?: string;
113
+ prepend?: string;
114
+ append?: string;
115
+ };
96
116
  }
97
117
  /**
98
118
  * 模拟伪装目标事件 target
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hi-ui/input",
3
- "version": "5.0.0-canary.7",
3
+ "version": "5.0.0-canary.8",
4
4
  "description": "A sub-package for @hi-ui/hiui.",
5
5
  "keywords": [],
6
6
  "author": "HiUI <mi-hiui@xiaomi.com>",