@hi-ui/tag-input 5.0.0-canary.1 → 5.0.0-canary.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.
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,17 @@
|
|
|
1
1
|
# @hi-ui/tag-input
|
|
2
2
|
|
|
3
|
+
## 5.0.0-canary.3
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- b98def710: chore: 优化 Input 和 TagInput label 显示逻辑 (5.0)
|
|
8
|
+
|
|
9
|
+
## 5.0.0-canary.2
|
|
10
|
+
|
|
11
|
+
### Minor Changes
|
|
12
|
+
|
|
13
|
+
- 6c4bf35af: feat: 下拉选择类组件 appearance 参数增加 contained 类型 (5.0)
|
|
14
|
+
|
|
3
15
|
## 5.0.0-canary.1
|
|
4
16
|
|
|
5
17
|
### Patch Changes
|
package/lib/cjs/TagInputMock.js
CHANGED
|
@@ -59,6 +59,7 @@ var TagInputMock = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
|
59
59
|
size = _a$size === void 0 ? 'md' : _a$size,
|
|
60
60
|
_a$appearance = _a.appearance,
|
|
61
61
|
appearance = _a$appearance === void 0 ? 'line' : _a$appearance,
|
|
62
|
+
label = _a.label,
|
|
62
63
|
_a$wrap = _a.wrap,
|
|
63
64
|
wrap = _a$wrap === void 0 ? false : _a$wrap,
|
|
64
65
|
_a$expandable = _a.expandable,
|
|
@@ -74,7 +75,7 @@ var TagInputMock = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
|
74
75
|
_onMouseLeave = _a.onMouseLeave,
|
|
75
76
|
onClear = _a.onClear,
|
|
76
77
|
onExpand = _a.onExpand,
|
|
77
|
-
rest = tslib.__rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "disabled", "clearable", "focused", "invalid", "readOnly", "size", "appearance", "wrap", "expandable", "activeExpandable", "prefix", "suffix", "tagWidth", "displayRender", "onMouseOver", "onMouseLeave", "onClear", "onExpand"]);
|
|
78
|
+
rest = tslib.__rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "disabled", "clearable", "focused", "invalid", "readOnly", "size", "appearance", "label", "wrap", "expandable", "activeExpandable", "prefix", "suffix", "tagWidth", "displayRender", "onMouseOver", "onMouseLeave", "onClear", "onExpand"]);
|
|
78
79
|
var _useUncontrolledState = useUncontrolledState.useUncontrolledState(defaultValue, valueProp, onChange),
|
|
79
80
|
value = _useUncontrolledState[0],
|
|
80
81
|
tryChangeValue = _useUncontrolledState[1];
|
|
@@ -172,7 +173,7 @@ var TagInputMock = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
|
172
173
|
// 在开启 clearable 下展示 清除内容按钮，可点击进行内容清楚
|
|
173
174
|
var showClearableIcon = clearable && showTags && !disabled;
|
|
174
175
|
var maxTagWidth = containerWidth - suffixWidth;
|
|
175
|
-
var cls = classname.cx(prefixCls, className, prefixCls + "--appearance-" + appearance, prefixCls + "--size-" + size, focused && "focused", readOnly && 'readonly', invalid && 'invalid', disabled && prefixCls + "--disabled", wrap && prefixCls + "--wrap", expandable && prefixCls + "--expandable");
|
|
176
|
+
var cls = classname.cx(prefixCls, className, prefixCls + "--appearance-" + appearance, prefixCls + "--size-" + size, focused && "focused", readOnly && 'readonly', invalid && 'invalid', disabled && prefixCls + "--disabled", wrap && prefixCls + "--wrap", expandable && prefixCls + "--expandable", showTagCount && prefixCls + "--has-value");
|
|
176
177
|
return /*#__PURE__*/React__default["default"].createElement(ResizeDetector__default["default"], {
|
|
177
178
|
skipOnMount: false,
|
|
178
179
|
onResize: function onResize(w) {
|
|
@@ -194,7 +195,9 @@ var TagInputMock = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
|
194
195
|
}
|
|
195
196
|
}, rest), prefix ? /*#__PURE__*/React__default["default"].createElement("span", {
|
|
196
197
|
className: prefixCls + "__prefix"
|
|
197
|
-
}, prefix) : null,
|
|
198
|
+
}, prefix) : null, appearance === 'contained' && label ? ( /*#__PURE__*/React__default["default"].createElement("span", {
|
|
199
|
+
className: prefixCls + "__label"
|
|
200
|
+
}, label, (value === null || value === void 0 ? void 0 : value.length) > 0 && '：')) : null, appearance !== 'contained' ? showTags ? ( /*#__PURE__*/React__default["default"].createElement("span", {
|
|
198
201
|
className: prefixCls + "__tags"
|
|
199
202
|
}, mergedTagList.map(function (option, index) {
|
|
200
203
|
return /*#__PURE__*/React__default["default"].createElement(MockTag, {
|
|
@@ -216,7 +219,13 @@ var TagInputMock = /*#__PURE__*/React.forwardRef(function (_a, ref) {
|
|
|
216
219
|
});
|
|
217
220
|
}))) : ( /*#__PURE__*/React__default["default"].createElement("span", {
|
|
218
221
|
className: prefixCls + "__placeholder"
|
|
219
|
-
}, placeholder))
|
|
222
|
+
}, placeholder)) : ( /*#__PURE__*/React__default["default"].createElement("span", {
|
|
223
|
+
className: prefixCls + "__value"
|
|
224
|
+
}, data.filter(function (item) {
|
|
225
|
+
return value.includes(item.id);
|
|
226
|
+
}).map(function (item) {
|
|
227
|
+
return item.title;
|
|
228
|
+
}).join('、'))), suffix[1] ? /*#__PURE__*/React__default["default"].createElement("span", {
|
|
220
229
|
className: prefixCls + "__secondary-suffix"
|
|
221
230
|
}, suffix[1]) : null, /*#__PURE__*/React__default["default"].createElement(ResizeDetector__default["default"], {
|
|
222
231
|
skipOnMount: false,
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
Object.defineProperty(exports, '__esModule', {
|
|
13
13
|
value: true
|
|
14
14
|
});
|
|
15
|
-
var css_248z = ".hi-v5-tag-input {position: relative;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v5-tag-input__container {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;min-width: 160px;font-size: 14px;vertical-align: middle;color: var(--hi-v5-color-static-black, #000);border: 1px solid transparent;background-color: var(--hi-v5-color-static-white, #fff);-webkit-transition: all 0.3s;transition: all 0.3s;padding: 4px 10px;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;min-height: 32px;overflow: hidden;border-color: var(--hi-v5-color-gray-300, #dce0e5);border-radius: 4px;}.hi-v5-tag-input__container:not(.disabled):hover {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input__container:not(.disabled).focused {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input__container.disabled {cursor: not-allowed;color: var(--hi-v5-color-gray-500, #737680);background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input__container.disabled .hi-v5-tag-input__tag {background-color: var(--hi-v5-color-gray-200, #e6eaf0);}.hi-v5-tag-input__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input__suffix {font-size: 16px;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;min-width: 32px;}.hi-v5-tag-input__clear {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 16px;height: 16px;font-size: 14px;color: var(--hi-v5-color-gray-500, #737680);-ms-flex-negative: 0;flex-shrink: 0;cursor: pointer;-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-tag-input__clear:hover {color: var(--hi-v5-color-static-black, #000);}.hi-v5-tag-input__value {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 22px;line-height: 22px;}.hi-v5-tag-input__tags {-webkit-box-flex: 0;-ms-flex: 0 1 auto;flex: 0 1 auto;display: inline-block;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;white-space: nowrap;height: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;margin-top: -4px;position: relative;}.hi-v5-tag-input__tag, .hi-v5-tag-input__tag--left {display: inline-block;margin-right: 4px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 8px;vertical-align: middle;font-size: 12px;color: #333;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-gray-100, #ebeff5);border-radius: 4px;}.hi-v5-tag-input__tag--total {display: inline-block;margin-right: 6px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 8px;vertical-align: middle;font-size: 12px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-radius: 4px;line-height: 22px;cursor: inherit;}.hi-v5-tag-input__tag {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.hi-v5-tag-input__tag-content {display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-tag-input__tag-closed {margin-left: var(--hi-v5-spacing-4, 8px);font-size: 12px;-webkit-box-sizing: border-box;box-sizing: border-box;color: rgb(142, 142, 142);cursor: pointer;}.disabled .hi-v5-tag-input__tag-closed {cursor: not-allowed;}.hi-v5-tag-input__tag--left {margin: 0;max-width: 54px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: middle;}.hi-v5-tag-input--nowrap .hi-v5-tag-input__value {width: calc(100% - 64px);overflow-x: hidden;}.hi-v5-tag-input--wrap .hi-v5-tag-input__value {height: auto;}.hi-v5-tag-input--wrap .hi-v5-tag-input__tags {white-space: normal;margin-top: -4px;}.hi-v5-tag-input--wrap .hi-v5-tag-input__tag {margin-top: 4px;}.hi-v5-tag-input--expanded {position: relative;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand {position: absolute;top: 0;left: 0;height: auto;z-index: 1;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;min-width: 160px;font-size: 14px;vertical-align: middle;color: var(--hi-v5-color-static-black, #000);border: 1px solid transparent;background-color: use-color-statc(\"white\");-webkit-transition: all 0.3s;transition: all 0.3s;padding: 3px 0;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;min-height: 32px;overflow: hidden;border-radius: 4px;border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__value {height: -webkit-fit-content;height: -moz-fit-content;height: fit-content;max-height: 74px;-webkit-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;overflow: scroll;padding-left: 10px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__tags {white-space: normal;margin-top: -4px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__tag {margin-top: 4px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__suffix {-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;padding: 4px 10px 4px 0;position: sticky;top: 0;}.hi-v5-tag-input-mock {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;border: none;outline: none;-webkit-box-shadow: none;box-shadow: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;cursor: text;background-color: transparent;-webkit-tap-highlight-color: transparent;position: relative;overflow: hidden;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));width: 100%;height: auto;z-index: auto;font-size: inherit;line-height: inherit;color: var(--hi-v5-color-gray-700, #1a1d26);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-static-transparent, transparent);background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock:not(.hi-v5-tag-input-mock--disabled):hover {z-index: calc(var(--hi-v5-zindex-absolute, 1) + 1);}.hi-v5-tag-input-mock:not(.hi-v5-tag-input-mock--disabled).focused {z-index: calc(var(--hi-v5-zindex-absolute, 1) + 1);}.hi-v5-tag-input-mock.hi-v5-tag-input-mock--disabled {cursor: not-allowed;}.hi-v5-tag-input-mock--wrap {height: auto;}.hi-v5-tag-input-mock--wrap .hi-v5-tag-input-mock__value {height: auto;}.hi-v5-tag-input-mock--wrap .hi-v5-tag-input-mock__tags {white-space: normal;}.hi-v5-tag-input-mock__prefix, .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock__secondary-suffix {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;-ms-flex-negative: 0;flex-shrink: 0;color: var(--hi-v5-color-static-black, #000);font-size: var(--hi-v5-text-size-lg, 1rem);padding: 0;text-align: center;}.hi-v5-tag-input-mock__clear {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 16px;height: 16px;font-size: var(--hi-v5-text-size-md, 0.875rem);color: var(--hi-v5-color-gray-500, #737680);text-align: center;-ms-flex-negative: 0;flex-shrink: 0;cursor: pointer;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));}.hi-v5-tag-input-mock__clear:hover {color: var(--hi-v5-color-static-black, #000);}.hi-v5-tag-input-mock__tags {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;white-space: nowrap;overflow: hidden;height: 100%;}.hi-v5-tag-input-mock__tag--total {display: inline-block;-webkit-box-sizing: border-box;box-sizing: border-box;vertical-align: middle;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: inherit;margin-left: var(--hi-v5-spacing-4, 8px);margin-right: var(--hi-v5-spacing-3, 6px);padding: 0 var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-sm, 0.75rem);border-radius: var(--hi-v5-border-radius-lg, 6px);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-700, #1a1d26);-webkit-transition-property: background-color, color;transition-property: background-color, color;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));}.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total.hi-v5-tag-input-mock__tag--active {background-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock__prefix {margin-right: var(--hi-v5-spacing-4, 8px);}.hi-v5-tag-input-mock__tags, .hi-v5-tag-input-mock__placeholder {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input-mock--appearance-unset .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock--appearance-unset .hi-v5-tag-input-mock__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input-mock__tag, .hi-v5-tag-input-mock__placeholder {margin-top: var(--hi-v5-spacing-1, 2px);margin-bottom: var(--hi-v5-spacing-1, 2px);}.hi-v5-tag-input-mock__tag {max-width: 100%;margin-right: var(--hi-v5-spacing-2, 4px);-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 var(--hi-v5-spacing-4, 8px);vertical-align: middle;font-size: var(--hi-v5-text-size-sm, 0.75rem);color: var(--hi-v5-color-gray-700, #1a1d26);-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-gray-100, #ebeff5);border-radius: var(--hi-v5-border-radius-lg, 6px);position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-flex: 0;-ms-flex: none;flex: none;line-height: inherit;}.hi-v5-tag-input-mock__tag-content {display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-tag-input-mock__tag-closed {margin-left: var(--hi-v5-spacing-2, 4px);font-size: var(--hi-v5-text-size-sm, 0.75rem);-webkit-box-sizing: border-box;box-sizing: border-box;color: var(--hi-v5-color-gray-500, #737680);cursor: pointer;}.hi-v5-tag-input-mock__tag-closed:hover {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag-closed {cursor: not-allowed;color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag-closed:hover {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--size-xs {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 0 calc(var(--hi-v5-spacing-4, 8px) - 1px);}.hi-v5-tag-input-mock--size-xs:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-6, 24px);}.hi-v5-tag-input-mock--size-xs .hi-v5-tag-input-mock__tag,.hi-v5-tag-input-mock--size-xs .hi-v5-tag-input-mock__placeholder {margin-top: 1px;margin-bottom: 1px;}.hi-v5-tag-input-mock--size-sm {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 0 calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-sm:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-7, 28px);}.hi-v5-tag-input-mock--size-sm .hi-v5-tag-input-mock__tag,.hi-v5-tag-input-mock--size-sm .hi-v5-tag-input-mock__placeholder {margin-top: 1px;margin-bottom: 1px;}.hi-v5-tag-input-mock--size-md {font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 2px calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-md:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-8, 32px);}.hi-v5-tag-input-mock--size-lg {font-size: var(--hi-v5-text-size-lg, 1rem);line-height: var(--hi-v5-text-lineheight-lg, 1.5rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 5px calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-lg:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-10, 40px);}.hi-v5-tag-input-mock--appearance-line {border-color: var(--hi-v5-color-gray-300, #dce0e5);}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled):hover {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-unset {width: auto;max-width: 100%;-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;border-color: transparent;}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-filled {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-filled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-static-white, #fff);border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled {background-color: var(--hi-v5-color-gray-300, #dce0e5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}";
|
|
15
|
+
var css_248z = ".hi-v5-tag-input {position: relative;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v5-tag-input__container {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;min-width: 160px;font-size: 14px;vertical-align: middle;color: var(--hi-v5-color-static-black, #000);border: 1px solid transparent;background-color: var(--hi-v5-color-static-white, #fff);-webkit-transition: all 0.3s;transition: all 0.3s;padding: 4px 10px;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;min-height: 32px;overflow: hidden;border-color: var(--hi-v5-color-gray-300, #dce0e5);border-radius: 4px;}.hi-v5-tag-input__container:not(.disabled):hover {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input__container:not(.disabled).focused {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input__container.disabled {cursor: not-allowed;color: var(--hi-v5-color-gray-500, #737680);background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input__container.disabled .hi-v5-tag-input__tag {background-color: var(--hi-v5-color-gray-200, #e6eaf0);}.hi-v5-tag-input__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input__suffix {font-size: 16px;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;min-width: 32px;}.hi-v5-tag-input__clear {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 16px;height: 16px;font-size: 14px;color: var(--hi-v5-color-gray-500, #737680);-ms-flex-negative: 0;flex-shrink: 0;cursor: pointer;-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-tag-input__clear:hover {color: var(--hi-v5-color-static-black, #000);}.hi-v5-tag-input__value {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 22px;line-height: 22px;}.hi-v5-tag-input__tags {-webkit-box-flex: 0;-ms-flex: 0 1 auto;flex: 0 1 auto;display: inline-block;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;white-space: nowrap;height: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;margin-top: -4px;position: relative;}.hi-v5-tag-input__tag, .hi-v5-tag-input__tag--left {display: inline-block;margin-right: 4px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 8px;vertical-align: middle;font-size: 12px;color: #333;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-gray-100, #ebeff5);border-radius: 4px;}.hi-v5-tag-input__tag--total {display: inline-block;margin-right: 6px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 8px;vertical-align: middle;font-size: 12px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-radius: 4px;line-height: 22px;cursor: inherit;}.hi-v5-tag-input__tag {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.hi-v5-tag-input__tag-content {display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-tag-input__tag-closed {margin-left: var(--hi-v5-spacing-4, 8px);font-size: 12px;-webkit-box-sizing: border-box;box-sizing: border-box;color: rgb(142, 142, 142);cursor: pointer;}.disabled .hi-v5-tag-input__tag-closed {cursor: not-allowed;}.hi-v5-tag-input__tag--left {margin: 0;max-width: 54px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: middle;}.hi-v5-tag-input--nowrap .hi-v5-tag-input__value {width: calc(100% - 64px);overflow-x: hidden;}.hi-v5-tag-input--wrap .hi-v5-tag-input__value {height: auto;}.hi-v5-tag-input--wrap .hi-v5-tag-input__tags {white-space: normal;margin-top: -4px;}.hi-v5-tag-input--wrap .hi-v5-tag-input__tag {margin-top: 4px;}.hi-v5-tag-input--expanded {position: relative;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand {position: absolute;top: 0;left: 0;height: auto;z-index: 1;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;min-width: 160px;font-size: 14px;vertical-align: middle;color: var(--hi-v5-color-static-black, #000);border: 1px solid transparent;background-color: use-color-statc(\"white\");-webkit-transition: all 0.3s;transition: all 0.3s;padding: 3px 0;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;min-height: 32px;overflow: hidden;border-radius: 4px;border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__value {height: -webkit-fit-content;height: -moz-fit-content;height: fit-content;max-height: 74px;-webkit-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;overflow: scroll;padding-left: 10px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__tags {white-space: normal;margin-top: -4px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__tag {margin-top: 4px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__suffix {-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;padding: 4px 10px 4px 0;position: sticky;top: 0;}.hi-v5-tag-input-mock {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;border: none;outline: none;-webkit-box-shadow: none;box-shadow: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;cursor: text;background-color: transparent;-webkit-tap-highlight-color: transparent;position: relative;overflow: hidden;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));width: 100%;height: auto;z-index: auto;font-size: inherit;line-height: inherit;color: var(--hi-v5-color-gray-700, #1a1d26);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-static-transparent, transparent);background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock:not(.hi-v5-tag-input-mock--disabled):hover {z-index: calc(var(--hi-v5-zindex-absolute, 1) + 1);}.hi-v5-tag-input-mock:not(.hi-v5-tag-input-mock--disabled).focused {z-index: calc(var(--hi-v5-zindex-absolute, 1) + 1);}.hi-v5-tag-input-mock.hi-v5-tag-input-mock--disabled {cursor: not-allowed;}.hi-v5-tag-input-mock--wrap {height: auto;}.hi-v5-tag-input-mock--wrap .hi-v5-tag-input-mock__value {height: auto;}.hi-v5-tag-input-mock--wrap .hi-v5-tag-input-mock__tags {white-space: normal;}.hi-v5-tag-input-mock__prefix, .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock__secondary-suffix {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;-ms-flex-negative: 0;flex-shrink: 0;color: var(--hi-v5-color-static-black, #000);font-size: var(--hi-v5-text-size-lg, 1rem);padding: 0;text-align: center;}.hi-v5-tag-input-mock__clear {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 16px;height: 16px;font-size: var(--hi-v5-text-size-md, 0.875rem);color: var(--hi-v5-color-gray-500, #737680);text-align: center;-ms-flex-negative: 0;flex-shrink: 0;cursor: pointer;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));}.hi-v5-tag-input-mock__clear:hover {color: var(--hi-v5-color-static-black, #000);}.hi-v5-tag-input-mock__tags {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;white-space: nowrap;overflow: hidden;height: 100%;}.hi-v5-tag-input-mock__tag--total {display: inline-block;-webkit-box-sizing: border-box;box-sizing: border-box;vertical-align: middle;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: inherit;margin-left: var(--hi-v5-spacing-4, 8px);margin-right: var(--hi-v5-spacing-3, 6px);padding: 0 var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-sm, 0.75rem);border-radius: var(--hi-v5-border-radius-lg, 6px);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-700, #1a1d26);-webkit-transition-property: background-color, color;transition-property: background-color, color;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));}.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total.hi-v5-tag-input-mock__tag--active {background-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock__prefix {margin-right: var(--hi-v5-spacing-4, 8px);}.hi-v5-tag-input-mock__tags, .hi-v5-tag-input-mock__placeholder {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input-mock--appearance-unset .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock--appearance-unset .hi-v5-tag-input-mock__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input-mock__tag, .hi-v5-tag-input-mock__placeholder {margin-top: var(--hi-v5-spacing-1, 2px);margin-bottom: var(--hi-v5-spacing-1, 2px);}.hi-v5-tag-input-mock__tag {max-width: 100%;margin-right: var(--hi-v5-spacing-2, 4px);-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 var(--hi-v5-spacing-4, 8px);vertical-align: middle;font-size: var(--hi-v5-text-size-sm, 0.75rem);color: var(--hi-v5-color-gray-700, #1a1d26);-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-gray-100, #ebeff5);border-radius: var(--hi-v5-border-radius-lg, 6px);position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-flex: 0;-ms-flex: none;flex: none;line-height: inherit;}.hi-v5-tag-input-mock__tag-content {display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-tag-input-mock__tag-closed {margin-left: var(--hi-v5-spacing-2, 4px);font-size: var(--hi-v5-text-size-sm, 0.75rem);-webkit-box-sizing: border-box;box-sizing: border-box;color: var(--hi-v5-color-gray-500, #737680);cursor: pointer;}.hi-v5-tag-input-mock__tag-closed:hover {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag-closed {cursor: not-allowed;color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag-closed:hover {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--size-xs {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 0 calc(var(--hi-v5-spacing-4, 8px) - 1px);}.hi-v5-tag-input-mock--size-xs:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-6, 24px);}.hi-v5-tag-input-mock--size-xs .hi-v5-tag-input-mock__tag,.hi-v5-tag-input-mock--size-xs .hi-v5-tag-input-mock__placeholder {margin-top: 1px;margin-bottom: 1px;}.hi-v5-tag-input-mock--size-sm {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 0 calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-sm:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-7, 28px);}.hi-v5-tag-input-mock--size-sm .hi-v5-tag-input-mock__tag,.hi-v5-tag-input-mock--size-sm .hi-v5-tag-input-mock__placeholder {margin-top: 1px;margin-bottom: 1px;}.hi-v5-tag-input-mock--size-md {font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 2px calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-md:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-8, 32px);}.hi-v5-tag-input-mock--size-lg {font-size: var(--hi-v5-text-size-lg, 1rem);line-height: var(--hi-v5-text-lineheight-lg, 1.5rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 5px calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-lg:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-10, 40px);}.hi-v5-tag-input-mock--appearance-line {border-color: var(--hi-v5-color-gray-300, #dce0e5);}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled):hover {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-unset {width: auto;max-width: 100%;-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;border-color: transparent;}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-filled {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-filled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-static-white, #fff);border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-contained {background-color: var(--hi-v5-color-gray-50, #f5f8fc);border: none;}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock {width: auto;}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-gray-600, #565a66);}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__value {overflow: hidden;white-space: nowrap;}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__label {-ms-flex-negative: 0;flex-shrink: 0;}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__value {text-overflow: ellipsis;}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__suffix {padding-left: var(--hi-v5-spacing-4, 8px);}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value, .hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__value,.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__value,.hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-primary-600, var(--hi-v5-color-brandblue-600, #1843d2));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__clear, .hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__clear {color: var(--hi-v5-color-primary-600, var(--hi-v5-color-brandblue-600, #1843d2));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__clear:hover, .hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__clear:hover {color: var(--hi-v5-color-primary-800, var(--hi-v5-color-brandblue-800, #051879));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-200, var(--hi-v5-color-brandblue-200, #cfddfc));color: var(--hi-v5-color-primary-600, var(--hi-v5-color-brandblue-600, #1843d2));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__tag--total.hi-v5-tag-input-mock__tag--active {background-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__value,.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled {background-color: var(--hi-v5-color-gray-50, #f5f8fc);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__placeholder,.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__placeholder,.hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__placeholder,.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-gray-400, #c0c3cc);}";
|
|
16
16
|
var __styleInject__ = require('@hi-ui/style-inject')["default"];
|
|
17
17
|
__styleInject__(css_248z);
|
|
18
18
|
exports["default"] = css_248z;
|
package/lib/esm/TagInputMock.js
CHANGED
|
@@ -46,6 +46,7 @@ var TagInputMock = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
46
46
|
size = _a$size === void 0 ? 'md' : _a$size,
|
|
47
47
|
_a$appearance = _a.appearance,
|
|
48
48
|
appearance = _a$appearance === void 0 ? 'line' : _a$appearance,
|
|
49
|
+
label = _a.label,
|
|
49
50
|
_a$wrap = _a.wrap,
|
|
50
51
|
wrap = _a$wrap === void 0 ? false : _a$wrap,
|
|
51
52
|
_a$expandable = _a.expandable,
|
|
@@ -61,7 +62,7 @@ var TagInputMock = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
61
62
|
_onMouseLeave = _a.onMouseLeave,
|
|
62
63
|
onClear = _a.onClear,
|
|
63
64
|
onExpand = _a.onExpand,
|
|
64
|
-
rest = __rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "disabled", "clearable", "focused", "invalid", "readOnly", "size", "appearance", "wrap", "expandable", "activeExpandable", "prefix", "suffix", "tagWidth", "displayRender", "onMouseOver", "onMouseLeave", "onClear", "onExpand"]);
|
|
65
|
+
rest = __rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "disabled", "clearable", "focused", "invalid", "readOnly", "size", "appearance", "label", "wrap", "expandable", "activeExpandable", "prefix", "suffix", "tagWidth", "displayRender", "onMouseOver", "onMouseLeave", "onClear", "onExpand"]);
|
|
65
66
|
var _useUncontrolledState = useUncontrolledState(defaultValue, valueProp, onChange),
|
|
66
67
|
value = _useUncontrolledState[0],
|
|
67
68
|
tryChangeValue = _useUncontrolledState[1];
|
|
@@ -159,7 +160,7 @@ var TagInputMock = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
159
160
|
// 在开启 clearable 下展示 清除内容按钮，可点击进行内容清楚
|
|
160
161
|
var showClearableIcon = clearable && showTags && !disabled;
|
|
161
162
|
var maxTagWidth = containerWidth - suffixWidth;
|
|
162
|
-
var cls = cx(prefixCls, className, prefixCls + "--appearance-" + appearance, prefixCls + "--size-" + size, focused && "focused", readOnly && 'readonly', invalid && 'invalid', disabled && prefixCls + "--disabled", wrap && prefixCls + "--wrap", expandable && prefixCls + "--expandable");
|
|
163
|
+
var cls = cx(prefixCls, className, prefixCls + "--appearance-" + appearance, prefixCls + "--size-" + size, focused && "focused", readOnly && 'readonly', invalid && 'invalid', disabled && prefixCls + "--disabled", wrap && prefixCls + "--wrap", expandable && prefixCls + "--expandable", showTagCount && prefixCls + "--has-value");
|
|
163
164
|
return /*#__PURE__*/React.createElement(ResizeDetector, {
|
|
164
165
|
skipOnMount: false,
|
|
165
166
|
onResize: function onResize(w) {
|
|
@@ -181,7 +182,9 @@ var TagInputMock = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
181
182
|
}
|
|
182
183
|
}, rest), prefix ? /*#__PURE__*/React.createElement("span", {
|
|
183
184
|
className: prefixCls + "__prefix"
|
|
184
|
-
}, prefix) : null,
|
|
185
|
+
}, prefix) : null, appearance === 'contained' && label ? ( /*#__PURE__*/React.createElement("span", {
|
|
186
|
+
className: prefixCls + "__label"
|
|
187
|
+
}, label, (value === null || value === void 0 ? void 0 : value.length) > 0 && '：')) : null, appearance !== 'contained' ? showTags ? ( /*#__PURE__*/React.createElement("span", {
|
|
185
188
|
className: prefixCls + "__tags"
|
|
186
189
|
}, mergedTagList.map(function (option, index) {
|
|
187
190
|
return /*#__PURE__*/React.createElement(MockTag, {
|
|
@@ -203,7 +206,13 @@ var TagInputMock = /*#__PURE__*/forwardRef(function (_a, ref) {
|
|
|
203
206
|
});
|
|
204
207
|
}))) : ( /*#__PURE__*/React.createElement("span", {
|
|
205
208
|
className: prefixCls + "__placeholder"
|
|
206
|
-
}, placeholder))
|
|
209
|
+
}, placeholder)) : ( /*#__PURE__*/React.createElement("span", {
|
|
210
|
+
className: prefixCls + "__value"
|
|
211
|
+
}, data.filter(function (item) {
|
|
212
|
+
return value.includes(item.id);
|
|
213
|
+
}).map(function (item) {
|
|
214
|
+
return item.title;
|
|
215
|
+
}).join('、'))), suffix[1] ? /*#__PURE__*/React.createElement("span", {
|
|
207
216
|
className: prefixCls + "__secondary-suffix"
|
|
208
217
|
}, suffix[1]) : null, /*#__PURE__*/React.createElement(ResizeDetector, {
|
|
209
218
|
skipOnMount: false,
|
|
@@ -8,6 +8,6 @@
|
|
|
8
8
|
* LICENSE file in the root directory of this source tree.
|
|
9
9
|
*/
|
|
10
10
|
import __styleInject__ from '@hi-ui/style-inject';
|
|
11
|
-
var css_248z = ".hi-v5-tag-input {position: relative;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v5-tag-input__container {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;min-width: 160px;font-size: 14px;vertical-align: middle;color: var(--hi-v5-color-static-black, #000);border: 1px solid transparent;background-color: var(--hi-v5-color-static-white, #fff);-webkit-transition: all 0.3s;transition: all 0.3s;padding: 4px 10px;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;min-height: 32px;overflow: hidden;border-color: var(--hi-v5-color-gray-300, #dce0e5);border-radius: 4px;}.hi-v5-tag-input__container:not(.disabled):hover {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input__container:not(.disabled).focused {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input__container.disabled {cursor: not-allowed;color: var(--hi-v5-color-gray-500, #737680);background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input__container.disabled .hi-v5-tag-input__tag {background-color: var(--hi-v5-color-gray-200, #e6eaf0);}.hi-v5-tag-input__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input__suffix {font-size: 16px;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;min-width: 32px;}.hi-v5-tag-input__clear {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 16px;height: 16px;font-size: 14px;color: var(--hi-v5-color-gray-500, #737680);-ms-flex-negative: 0;flex-shrink: 0;cursor: pointer;-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-tag-input__clear:hover {color: var(--hi-v5-color-static-black, #000);}.hi-v5-tag-input__value {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 22px;line-height: 22px;}.hi-v5-tag-input__tags {-webkit-box-flex: 0;-ms-flex: 0 1 auto;flex: 0 1 auto;display: inline-block;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;white-space: nowrap;height: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;margin-top: -4px;position: relative;}.hi-v5-tag-input__tag, .hi-v5-tag-input__tag--left {display: inline-block;margin-right: 4px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 8px;vertical-align: middle;font-size: 12px;color: #333;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-gray-100, #ebeff5);border-radius: 4px;}.hi-v5-tag-input__tag--total {display: inline-block;margin-right: 6px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 8px;vertical-align: middle;font-size: 12px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-radius: 4px;line-height: 22px;cursor: inherit;}.hi-v5-tag-input__tag {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.hi-v5-tag-input__tag-content {display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-tag-input__tag-closed {margin-left: var(--hi-v5-spacing-4, 8px);font-size: 12px;-webkit-box-sizing: border-box;box-sizing: border-box;color: rgb(142, 142, 142);cursor: pointer;}.disabled .hi-v5-tag-input__tag-closed {cursor: not-allowed;}.hi-v5-tag-input__tag--left {margin: 0;max-width: 54px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: middle;}.hi-v5-tag-input--nowrap .hi-v5-tag-input__value {width: calc(100% - 64px);overflow-x: hidden;}.hi-v5-tag-input--wrap .hi-v5-tag-input__value {height: auto;}.hi-v5-tag-input--wrap .hi-v5-tag-input__tags {white-space: normal;margin-top: -4px;}.hi-v5-tag-input--wrap .hi-v5-tag-input__tag {margin-top: 4px;}.hi-v5-tag-input--expanded {position: relative;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand {position: absolute;top: 0;left: 0;height: auto;z-index: 1;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;min-width: 160px;font-size: 14px;vertical-align: middle;color: var(--hi-v5-color-static-black, #000);border: 1px solid transparent;background-color: use-color-statc(\"white\");-webkit-transition: all 0.3s;transition: all 0.3s;padding: 3px 0;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;min-height: 32px;overflow: hidden;border-radius: 4px;border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__value {height: -webkit-fit-content;height: -moz-fit-content;height: fit-content;max-height: 74px;-webkit-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;overflow: scroll;padding-left: 10px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__tags {white-space: normal;margin-top: -4px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__tag {margin-top: 4px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__suffix {-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;padding: 4px 10px 4px 0;position: sticky;top: 0;}.hi-v5-tag-input-mock {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;border: none;outline: none;-webkit-box-shadow: none;box-shadow: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;cursor: text;background-color: transparent;-webkit-tap-highlight-color: transparent;position: relative;overflow: hidden;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));width: 100%;height: auto;z-index: auto;font-size: inherit;line-height: inherit;color: var(--hi-v5-color-gray-700, #1a1d26);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-static-transparent, transparent);background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock:not(.hi-v5-tag-input-mock--disabled):hover {z-index: calc(var(--hi-v5-zindex-absolute, 1) + 1);}.hi-v5-tag-input-mock:not(.hi-v5-tag-input-mock--disabled).focused {z-index: calc(var(--hi-v5-zindex-absolute, 1) + 1);}.hi-v5-tag-input-mock.hi-v5-tag-input-mock--disabled {cursor: not-allowed;}.hi-v5-tag-input-mock--wrap {height: auto;}.hi-v5-tag-input-mock--wrap .hi-v5-tag-input-mock__value {height: auto;}.hi-v5-tag-input-mock--wrap .hi-v5-tag-input-mock__tags {white-space: normal;}.hi-v5-tag-input-mock__prefix, .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock__secondary-suffix {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;-ms-flex-negative: 0;flex-shrink: 0;color: var(--hi-v5-color-static-black, #000);font-size: var(--hi-v5-text-size-lg, 1rem);padding: 0;text-align: center;}.hi-v5-tag-input-mock__clear {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 16px;height: 16px;font-size: var(--hi-v5-text-size-md, 0.875rem);color: var(--hi-v5-color-gray-500, #737680);text-align: center;-ms-flex-negative: 0;flex-shrink: 0;cursor: pointer;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));}.hi-v5-tag-input-mock__clear:hover {color: var(--hi-v5-color-static-black, #000);}.hi-v5-tag-input-mock__tags {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;white-space: nowrap;overflow: hidden;height: 100%;}.hi-v5-tag-input-mock__tag--total {display: inline-block;-webkit-box-sizing: border-box;box-sizing: border-box;vertical-align: middle;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: inherit;margin-left: var(--hi-v5-spacing-4, 8px);margin-right: var(--hi-v5-spacing-3, 6px);padding: 0 var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-sm, 0.75rem);border-radius: var(--hi-v5-border-radius-lg, 6px);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-700, #1a1d26);-webkit-transition-property: background-color, color;transition-property: background-color, color;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));}.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total.hi-v5-tag-input-mock__tag--active {background-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock__prefix {margin-right: var(--hi-v5-spacing-4, 8px);}.hi-v5-tag-input-mock__tags, .hi-v5-tag-input-mock__placeholder {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input-mock--appearance-unset .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock--appearance-unset .hi-v5-tag-input-mock__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input-mock__tag, .hi-v5-tag-input-mock__placeholder {margin-top: var(--hi-v5-spacing-1, 2px);margin-bottom: var(--hi-v5-spacing-1, 2px);}.hi-v5-tag-input-mock__tag {max-width: 100%;margin-right: var(--hi-v5-spacing-2, 4px);-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 var(--hi-v5-spacing-4, 8px);vertical-align: middle;font-size: var(--hi-v5-text-size-sm, 0.75rem);color: var(--hi-v5-color-gray-700, #1a1d26);-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-gray-100, #ebeff5);border-radius: var(--hi-v5-border-radius-lg, 6px);position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-flex: 0;-ms-flex: none;flex: none;line-height: inherit;}.hi-v5-tag-input-mock__tag-content {display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-tag-input-mock__tag-closed {margin-left: var(--hi-v5-spacing-2, 4px);font-size: var(--hi-v5-text-size-sm, 0.75rem);-webkit-box-sizing: border-box;box-sizing: border-box;color: var(--hi-v5-color-gray-500, #737680);cursor: pointer;}.hi-v5-tag-input-mock__tag-closed:hover {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag-closed {cursor: not-allowed;color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag-closed:hover {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--size-xs {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 0 calc(var(--hi-v5-spacing-4, 8px) - 1px);}.hi-v5-tag-input-mock--size-xs:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-6, 24px);}.hi-v5-tag-input-mock--size-xs .hi-v5-tag-input-mock__tag,.hi-v5-tag-input-mock--size-xs .hi-v5-tag-input-mock__placeholder {margin-top: 1px;margin-bottom: 1px;}.hi-v5-tag-input-mock--size-sm {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 0 calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-sm:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-7, 28px);}.hi-v5-tag-input-mock--size-sm .hi-v5-tag-input-mock__tag,.hi-v5-tag-input-mock--size-sm .hi-v5-tag-input-mock__placeholder {margin-top: 1px;margin-bottom: 1px;}.hi-v5-tag-input-mock--size-md {font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 2px calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-md:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-8, 32px);}.hi-v5-tag-input-mock--size-lg {font-size: var(--hi-v5-text-size-lg, 1rem);line-height: var(--hi-v5-text-lineheight-lg, 1.5rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 5px calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-lg:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-10, 40px);}.hi-v5-tag-input-mock--appearance-line {border-color: var(--hi-v5-color-gray-300, #dce0e5);}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled):hover {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-unset {width: auto;max-width: 100%;-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;border-color: transparent;}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-filled {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-filled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-static-white, #fff);border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled {background-color: var(--hi-v5-color-gray-300, #dce0e5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}";
|
|
11
|
+
var css_248z = ".hi-v5-tag-input {position: relative;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v5-tag-input__container {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;min-width: 160px;font-size: 14px;vertical-align: middle;color: var(--hi-v5-color-static-black, #000);border: 1px solid transparent;background-color: var(--hi-v5-color-static-white, #fff);-webkit-transition: all 0.3s;transition: all 0.3s;padding: 4px 10px;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: center;-ms-flex-align: center;align-items: center;min-height: 32px;overflow: hidden;border-color: var(--hi-v5-color-gray-300, #dce0e5);border-radius: 4px;}.hi-v5-tag-input__container:not(.disabled):hover {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input__container:not(.disabled).focused {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input__container.disabled {cursor: not-allowed;color: var(--hi-v5-color-gray-500, #737680);background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input__container.disabled .hi-v5-tag-input__tag {background-color: var(--hi-v5-color-gray-200, #e6eaf0);}.hi-v5-tag-input__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input__suffix {font-size: 16px;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;min-width: 32px;}.hi-v5-tag-input__clear {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 16px;height: 16px;font-size: 14px;color: var(--hi-v5-color-gray-500, #737680);-ms-flex-negative: 0;flex-shrink: 0;cursor: pointer;-webkit-transition: all 0.3s;transition: all 0.3s;}.hi-v5-tag-input__clear:hover {color: var(--hi-v5-color-static-black, #000);}.hi-v5-tag-input__value {-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;height: 22px;line-height: 22px;}.hi-v5-tag-input__tags {-webkit-box-flex: 0;-ms-flex: 0 1 auto;flex: 0 1 auto;display: inline-block;width: -webkit-fit-content;width: -moz-fit-content;width: fit-content;white-space: nowrap;height: 100%;-webkit-box-sizing: border-box;box-sizing: border-box;margin-top: -4px;position: relative;}.hi-v5-tag-input__tag, .hi-v5-tag-input__tag--left {display: inline-block;margin-right: 4px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 8px;vertical-align: middle;font-size: 12px;color: #333;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-gray-100, #ebeff5);border-radius: 4px;}.hi-v5-tag-input__tag--total {display: inline-block;margin-right: 6px;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 8px;vertical-align: middle;font-size: 12px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-primary-100, var(--hi-v5-color-brandblue-100, #e5ecff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));border-radius: 4px;line-height: 22px;cursor: inherit;}.hi-v5-tag-input__tag {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;}.hi-v5-tag-input__tag-content {display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-tag-input__tag-closed {margin-left: var(--hi-v5-spacing-4, 8px);font-size: 12px;-webkit-box-sizing: border-box;box-sizing: border-box;color: rgb(142, 142, 142);cursor: pointer;}.disabled .hi-v5-tag-input__tag-closed {cursor: not-allowed;}.hi-v5-tag-input__tag--left {margin: 0;max-width: 54px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;vertical-align: middle;}.hi-v5-tag-input--nowrap .hi-v5-tag-input__value {width: calc(100% - 64px);overflow-x: hidden;}.hi-v5-tag-input--wrap .hi-v5-tag-input__value {height: auto;}.hi-v5-tag-input--wrap .hi-v5-tag-input__tags {white-space: normal;margin-top: -4px;}.hi-v5-tag-input--wrap .hi-v5-tag-input__tag {margin-top: 4px;}.hi-v5-tag-input--expanded {position: relative;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand {position: absolute;top: 0;left: 0;height: auto;z-index: 1;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;-webkit-box-sizing: border-box;box-sizing: border-box;width: 100%;min-width: 160px;font-size: 14px;vertical-align: middle;color: var(--hi-v5-color-static-black, #000);border: 1px solid transparent;background-color: use-color-statc(\"white\");-webkit-transition: all 0.3s;transition: all 0.3s;padding: 3px 0;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;min-height: 32px;overflow: hidden;border-radius: 4px;border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__value {height: -webkit-fit-content;height: -moz-fit-content;height: fit-content;max-height: 74px;-webkit-box-align: stretch;-ms-flex-align: stretch;align-items: stretch;overflow: scroll;padding-left: 10px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__tags {white-space: normal;margin-top: -4px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__tag {margin-top: 4px;}.hi-v5-tag-input--expanded .hi-v5-tag-input__container__expand .hi-v5-tag-input__suffix {-webkit-box-align: start;-ms-flex-align: start;align-items: flex-start;padding: 4px 10px 4px 0;position: sticky;top: 0;}.hi-v5-tag-input-mock {-webkit-box-sizing: border-box;box-sizing: border-box;margin: 0;padding: 0;border: none;outline: none;-webkit-box-shadow: none;box-shadow: none;-webkit-appearance: none;-moz-appearance: none;appearance: none;cursor: text;background-color: transparent;-webkit-tap-highlight-color: transparent;position: relative;overflow: hidden;display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));width: 100%;height: auto;z-index: auto;font-size: inherit;line-height: inherit;color: var(--hi-v5-color-gray-700, #1a1d26);border: var(--hi-v5-border-size-normal, 1px solid) var(--hi-v5-color-static-transparent, transparent);background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock:not(.hi-v5-tag-input-mock--disabled):hover {z-index: calc(var(--hi-v5-zindex-absolute, 1) + 1);}.hi-v5-tag-input-mock:not(.hi-v5-tag-input-mock--disabled).focused {z-index: calc(var(--hi-v5-zindex-absolute, 1) + 1);}.hi-v5-tag-input-mock.hi-v5-tag-input-mock--disabled {cursor: not-allowed;}.hi-v5-tag-input-mock--wrap {height: auto;}.hi-v5-tag-input-mock--wrap .hi-v5-tag-input-mock__value {height: auto;}.hi-v5-tag-input-mock--wrap .hi-v5-tag-input-mock__tags {white-space: normal;}.hi-v5-tag-input-mock__prefix, .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock__secondary-suffix {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-sizing: border-box;box-sizing: border-box;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;-ms-flex-negative: 0;flex-shrink: 0;color: var(--hi-v5-color-static-black, #000);font-size: var(--hi-v5-text-size-lg, 1rem);padding: 0;text-align: center;}.hi-v5-tag-input-mock__clear {display: -webkit-inline-box;display: -ms-inline-flexbox;display: inline-flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;width: 16px;height: 16px;font-size: var(--hi-v5-text-size-md, 0.875rem);color: var(--hi-v5-color-gray-500, #737680);text-align: center;-ms-flex-negative: 0;flex-shrink: 0;cursor: pointer;-webkit-transition-property: all;transition-property: all;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));}.hi-v5-tag-input-mock__clear:hover {color: var(--hi-v5-color-static-black, #000);}.hi-v5-tag-input-mock__tags {position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;white-space: nowrap;overflow: hidden;height: 100%;}.hi-v5-tag-input-mock__tag--total {display: inline-block;-webkit-box-sizing: border-box;box-sizing: border-box;vertical-align: middle;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;cursor: inherit;margin-left: var(--hi-v5-spacing-4, 8px);margin-right: var(--hi-v5-spacing-3, 6px);padding: 0 var(--hi-v5-spacing-4, 8px);font-size: var(--hi-v5-text-size-sm, 0.75rem);border-radius: var(--hi-v5-border-radius-lg, 6px);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-700, #1a1d26);-webkit-transition-property: background-color, color;transition-property: background-color, color;-webkit-transition-duration: var(--hi-v5-motion-duration-normal, 200ms);transition-duration: var(--hi-v5-motion-duration-normal, 200ms);-webkit-transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));transition-timing-function: var(--hi-v5-motion-bezier-easing, cubic-bezier(0.37, 0.02, 0.34, 1));}.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total.hi-v5-tag-input-mock__tag--active {background-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock__prefix {margin-right: var(--hi-v5-spacing-4, 8px);}.hi-v5-tag-input-mock__tags, .hi-v5-tag-input-mock__placeholder {-webkit-box-flex: 1;-ms-flex: 1 1;flex: 1 1;}.hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input-mock--appearance-unset .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock--appearance-unset .hi-v5-tag-input-mock__placeholder {color: var(--hi-v5-color-gray-500, #737680);}.hi-v5-tag-input-mock__tag, .hi-v5-tag-input-mock__placeholder {margin-top: var(--hi-v5-spacing-1, 2px);margin-bottom: var(--hi-v5-spacing-1, 2px);}.hi-v5-tag-input-mock__tag {max-width: 100%;margin-right: var(--hi-v5-spacing-2, 4px);-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0 var(--hi-v5-spacing-4, 8px);vertical-align: middle;font-size: var(--hi-v5-text-size-sm, 0.75rem);color: var(--hi-v5-color-gray-700, #1a1d26);-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-color: var(--hi-v5-color-gray-100, #ebeff5);border-radius: var(--hi-v5-border-radius-lg, 6px);position: relative;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-flex: 0;-ms-flex: none;flex: none;line-height: inherit;}.hi-v5-tag-input-mock__tag-content {display: inline-block;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;-webkit-box-sizing: border-box;box-sizing: border-box;}.hi-v5-tag-input-mock__tag-closed {margin-left: var(--hi-v5-spacing-2, 4px);font-size: var(--hi-v5-text-size-sm, 0.75rem);-webkit-box-sizing: border-box;box-sizing: border-box;color: var(--hi-v5-color-gray-500, #737680);cursor: pointer;}.hi-v5-tag-input-mock__tag-closed:hover {color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag-closed {cursor: not-allowed;color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag-closed:hover {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--size-xs {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 0 calc(var(--hi-v5-spacing-4, 8px) - 1px);}.hi-v5-tag-input-mock--size-xs:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-6, 24px);}.hi-v5-tag-input-mock--size-xs .hi-v5-tag-input-mock__tag,.hi-v5-tag-input-mock--size-xs .hi-v5-tag-input-mock__placeholder {margin-top: 1px;margin-bottom: 1px;}.hi-v5-tag-input-mock--size-sm {font-size: var(--hi-v5-text-size-sm, 0.75rem);line-height: var(--hi-v5-text-lineheight-sm, 1.25rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 0 calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-sm:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-7, 28px);}.hi-v5-tag-input-mock--size-sm .hi-v5-tag-input-mock__tag,.hi-v5-tag-input-mock--size-sm .hi-v5-tag-input-mock__placeholder {margin-top: 1px;margin-bottom: 1px;}.hi-v5-tag-input-mock--size-md {font-size: var(--hi-v5-text-size-md, 0.875rem);line-height: var(--hi-v5-text-lineheight-md, 1.375rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 2px calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-md:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-8, 32px);}.hi-v5-tag-input-mock--size-lg {font-size: var(--hi-v5-text-size-lg, 1rem);line-height: var(--hi-v5-text-lineheight-lg, 1.5rem);border-radius: var(--hi-v5-border-radius-lg, 6px);padding: 5px calc(var(--hi-v5-spacing-6, 12px) - 1px);}.hi-v5-tag-input-mock--size-lg:not(.hi-v5-tag-input-mock--wrap) {height: var(--hi-v5-height-10, 40px);}.hi-v5-tag-input-mock--appearance-line {border-color: var(--hi-v5-color-gray-300, #dce0e5);}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled):hover {border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-line:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-unset {width: auto;max-width: 100%;-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;border-color: transparent;}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled):hover.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-unset:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-filled {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-filled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-static-white, #fff);border-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled):hover.hi-v5-tag-input-mock--expandable .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled).invalid {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-filled:not(.hi-v5-tag-input-mock--disabled).invalid.hover {border-color: var(--hi-v5-color-danger-500, var(--hi-v5-color-red-500, #fa4646));}.hi-v5-tag-input-mock--appearance-contained {background-color: var(--hi-v5-color-gray-50, #f5f8fc);border: none;}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock {width: auto;}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-gray-600, #565a66);}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__value {overflow: hidden;white-space: nowrap;}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__label {-ms-flex-negative: 0;flex-shrink: 0;}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__value {text-overflow: ellipsis;}.hi-v5-tag-input-mock--appearance-contained .hi-v5-tag-input-mock__suffix {padding-left: var(--hi-v5-spacing-4, 8px);}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value, .hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover {background-color: var(--hi-v5-color-primary-50, var(--hi-v5-color-brandblue-50, #edf2ff));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__value,.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__value,.hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-primary-600, var(--hi-v5-color-brandblue-600, #1843d2));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__clear, .hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__clear {color: var(--hi-v5-color-primary-600, var(--hi-v5-color-brandblue-600, #1843d2));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__clear:hover, .hi-v5-tag-input-mock--appearance-contained:not(.hi-v5-tag-input-mock--disabled):hover .hi-v5-tag-input-mock__clear:hover {color: var(--hi-v5-color-primary-800, var(--hi-v5-color-brandblue-800, #051879));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-primary-200, var(--hi-v5-color-brandblue-200, #cfddfc));color: var(--hi-v5-color-primary-600, var(--hi-v5-color-brandblue-600, #1843d2));}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--has-value .hi-v5-tag-input-mock__tag--total.hi-v5-tag-input-mock__tag--active {background-color: var(--hi-v5-color-primary-500, var(--hi-v5-color-brandblue-500, #2660ff));color: var(--hi-v5-color-static-white, #fff);}.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__label,.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__value,.hi-v5-tag-input-mock--appearance-contained.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled {background-color: var(--hi-v5-color-gray-50, #f5f8fc);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__placeholder,.hi-v5-tag-input-mock--appearance-line.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__suffix, .hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__placeholder,.hi-v5-tag-input-mock--appearance-filled.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled {color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__tag--total {background-color: var(--hi-v5-color-gray-100, #ebeff5);color: var(--hi-v5-color-gray-400, #c0c3cc);}.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__placeholder,.hi-v5-tag-input-mock--appearance-unset.hi-v5-tag-input-mock--disabled .hi-v5-tag-input-mock__suffix {color: var(--hi-v5-color-gray-400, #c0c3cc);}";
|
|
12
12
|
__styleInject__(css_248z);
|
|
13
13
|
export { css_248z as default };
|
|
@@ -62,7 +62,11 @@ export interface TagInputMockProps extends Omit<HiBaseHTMLFieldProps<'div'>, 'de
|
|
|
62
62
|
/**
|
|
63
63
|
* 设置展现形式
|
|
64
64
|
*/
|
|
65
|
-
appearance?: HiBaseAppearanceEnum;
|
|
65
|
+
appearance?: HiBaseAppearanceEnum | 'contained';
|
|
66
|
+
/**
|
|
67
|
+
* 设置输入框 label 内容，仅在 appearance 为 contained 时生效
|
|
68
|
+
*/
|
|
69
|
+
label?: React.ReactNode;
|
|
66
70
|
/**
|
|
67
71
|
* 设置输入框尺寸
|
|
68
72
|
*/
|