@hi-ui/tag-input 4.0.0-alpha.1 → 4.0.0-alpha.13

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.
@@ -33,6 +33,8 @@ var useTagInput = require('./use-tag-input.js');
33
33
 
34
34
  var useOutsideClick = require('@hi-ui/use-outside-click');
35
35
 
36
+ var useLatest = require('@hi-ui/use-latest');
37
+
36
38
  function _interopDefaultLegacy(e) {
37
39
  return e && _typeof(e) === 'object' && 'default' in e ? e : {
38
40
  'default': e
@@ -74,7 +76,8 @@ var TagInput = /*#__PURE__*/React.forwardRef(function (_a, ref) {
74
76
  onClick = _a.onClick,
75
77
  _onMouseOver = _a.onMouseOver,
76
78
  _onMouseLeave = _a.onMouseLeave,
77
- rest = tslib.__rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "wrap", "clearable", "disabled", "suffix", "displayRender", "onClick", "onMouseOver", "onMouseLeave"]);
79
+ onClear = _a.onClear,
80
+ rest = tslib.__rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "wrap", "clearable", "disabled", "suffix", "displayRender", "onClick", "onMouseOver", "onMouseLeave", "onClear"]);
78
81
 
79
82
  var _useUncontrolledState = useUncontrolledState.useUncontrolledState(defaultValue, valueProp, onChange),
80
83
  value = _useUncontrolledState[0],
@@ -85,11 +88,13 @@ var TagInput = /*#__PURE__*/React.forwardRef(function (_a, ref) {
85
88
  var _useTagInput = useTagInput.useTagInput(data, tagInputRef),
86
89
  tagMaxWidth = _useTagInput[0];
87
90
 
91
+ var onClearLatest = useLatest.useLatestCallback(onClear);
88
92
  var handleClear = React.useCallback(function (evt) {
89
93
  if (disabled) return;
90
94
  evt.stopPropagation();
91
95
  tryChangeValue(NOOP_ARRAY);
92
- }, [tryChangeValue, disabled]);
96
+ onClearLatest();
97
+ }, [tryChangeValue, disabled, onClearLatest]);
93
98
  var tagList = React.useMemo(function () {
94
99
  return value.map(function (id) {
95
100
  return data.find(function (item) {
@@ -1 +1 @@
1
- {"version":3,"file":"TagInput.js","sources":["../../src/TagInput.tsx"],"sourcesContent":[null],"names":["_role","_prefix","getPrefixCls","NOOP_ARRAY","TagInput","forwardRef","_a","ref","prefixCls","role","className","defaultValue","valueProp","value","onChange","placeholder","data","wrap","clearable","disabled","suffix","displayRender","onClick","onMouseOver","onMouseLeave","rest","useUncontrolledState","tryChangeValue","tagInputRef","useRef","useTagInput","tagMaxWidth","handleClear","useCallback","evt","stopPropagation","tagList","useMemo","map","id","find","item","title","useState","hover","setHover","trySetHover","hovered","tagCount","length","showClearableIcon","showTagCount","expanded","setExpanded","useOutsideClick","handleExpand","cls","cx","React","useMergeRefs","option","closeable","key","style","maxWidth","nextValue","filter","CloseOutlined","tabIndex","CloseCircleFilled","__DEV__","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"TagInput.js","sources":["../../src/TagInput.tsx"],"sourcesContent":[null],"names":["_role","_prefix","getPrefixCls","NOOP_ARRAY","TagInput","forwardRef","_a","ref","prefixCls","role","className","defaultValue","valueProp","value","onChange","placeholder","data","wrap","clearable","disabled","suffix","displayRender","onClick","onMouseOver","onMouseLeave","onClear","rest","useUncontrolledState","tryChangeValue","tagInputRef","useRef","useTagInput","tagMaxWidth","onClearLatest","useLatestCallback","handleClear","useCallback","evt","stopPropagation","tagList","useMemo","map","id","find","item","title","useState","hover","setHover","trySetHover","hovered","tagCount","length","showClearableIcon","showTagCount","expanded","setExpanded","useOutsideClick","handleExpand","cls","cx","React","useMergeRefs","option","closeable","key","style","maxWidth","nextValue","filter","CloseOutlined","tabIndex","CloseCircleFilled","__DEV__","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,IAAMA,KAAK,GAAG,WAAd;;AACA,IAAMC,OAAO,GAAGC,sBAAAA,CAAaF,KAAbE,CAAhB;;AACA,IAAMC,UAAU,GAAG,EAAnB;AAEA;;;;IAGaC,QAAQ,gBAAGC,gBAAAA,CACtB,UACEC,EADF,EAqBEC,GArBF;wBAEIC;MAAAA,sCAAYP;mBACZQ;MAAAA,4BAAOT;MACPU,eAAAA;2BACAC;MAAAA,4CAAeR;MACRS,eAAPC;MACAC,cAAAA;MACAC,iBAAAA;mBACAC;MAAAA,4BAAOb;mBACPc;MAAAA,4BAAO;wBACPC;MAAAA,sCAAY;uBACZC;MAAAA,oCAAW;MACXC,YAAAA;MACAC,mBAAAA;MACAC,aAAAA;MACAC,kBAAAA;MACAC,mBAAAA;MACAC,aAAAA;MACGC,wBAlBL,YAAA,QAAA,aAAA,gBAAA,SAAA,YAAA,eAAA,QAAA,QAAA,aAAA,YAAA,UAAA,iBAAA,WAAA,eAAA,gBAAA,WAAA;;8BAsBgCC,yCAAAA,CAAqBhB,YAArBgB,EAAmCf,SAAnCe,EAA8Cb,QAA9Ca;MAAzBd,KAAP;MAAce,cAAd;;MAEMC,WAAW,GAAGC,YAAAA,CAAuB,IAAvBA;;qBACEC,uBAAAA,CAAYf,IAAZe,EAAkBF,WAAlBE;MAAfC,WAAP;;MAEMC,aAAa,GAAGC,2BAAAA,CAAkBT,OAAlBS;MAEhBC,WAAW,GAAGC,iBAAAA,CAClB,UAACC,GAAD;QACMlB,UAAU;AACdkB,IAAAA,GAAG,CAACC,eAAJD;AACAT,IAAAA,cAAc,CAACzB,UAAD,CAAdyB;AACAK,IAAAA,aAAa;AALc,GAAXG,EAOlB,CAACR,cAAD,EAAiBT,QAAjB,EAA2Bc,aAA3B,CAPkBG;MAUdG,OAAO,GAAGC,aAAAA,CACd;WAAM3B,KAAK,CAAC4B,GAAN5B,CAAU,UAAC6B,EAAD;aAAQ1B,IAAI,CAAC2B,IAAL3B,CAAU,UAAC4B,IAAD;eAAUA,IAAI,CAACF,EAALE,KAAYF;AAAhC,OAAA1B,KAAuC;AAAE0B,QAAAA,EAAE,EAAFA,EAAF;AAAMG,QAAAA,KAAK,EAAEH;AAAb;AAAzD,KAAA7B;AADe,GAAP2B,EAEd,CAAC3B,KAAD,EAAQG,IAAR,CAFcwB;;kBAKUM,cAAAA,CAAS,KAATA;MAAnBC,KAAP;MAAcC,QAAd;;MACMC,WAAW,GAAGb,iBAAAA,CAClB,UAACc,OAAD;QACM/B,UAAU;AACd6B,IAAAA,QAAQ,CAACE,OAAD,CAARF;AAH2B,GAAXZ,EAKlB,CAACjB,QAAD,CALkBiB;MAQde,QAAQ,GAAGZ,OAAO,CAACa;;MAEnBC,iBAAiB,GAAGnC,SAAS,IAAIiC,QAAQ,GAAG,CAAxBjC,IAA6B,CAACC;MAClDmC,YAAY,GAAG,CAACrC,IAAD,IAASkC,QAAQ,GAAG;;mBAETL,cAAAA,CAAS,KAATA;MAAzBS,QAAP;MAAiBC,WAAjB;;AAEAC,EAAAA,+BAAAA,CAAgB5B,WAAhB4B,EAA6B;WAAMD,WAAW,CAAC,KAAD;AAA/B,GAAfC;MAEMC,YAAY,GAAGtB,iBAAAA,CAAY,UAACC,GAAD;AAC/BA,IAAAA,GAAG,CAACC,eAAJD;AACAmB,IAAAA,WAAW,CAAC,IAAD,CAAXA;AAF8B,GAAXpB,EAGlB,EAHkBA;MAKfuB,GAAG,GAAGC,YAAAA,CACVpD,SADUoD,EAEVlD,SAFUkD,EAGVL,QAAQ,GAAM/C,SAAN,eAAA,GAA8BS,IAAI,GAAMT,SAAN,WAAA,GAA6BA,SAA7B,aAHhCoD;sBAOVC,yBAAAA,cAAAA,MAAAA;AACEtD,IAAAA,GAAG,EAAEuD,yBAAAA,CAAavD,GAAbuD,EAAkBjC,WAAlBiC;AACLrD,IAAAA,IAAI,EAAEA;AACNC,IAAAA,SAAS,EAAEiD;AACXpC,IAAAA,WAAW,EAAE,oBAAA,CAACc,GAAD;AACXY,MAAAA,WAAW,CAAC,IAAD,CAAXA;AACA1B,MAAAA,YAAW,SAAXA,IAAAA,YAAW,WAAXA,SAAAA,GAAAA,YAAW,CAAGc,GAAH,CAAXd;;AAEFC,IAAAA,YAAY,EAAE,qBAAA,CAACa,GAAD;AACZY,MAAAA,WAAW,CAAC,KAAD,CAAXA;AACAzB,MAAAA,aAAY,SAAZA,IAAAA,aAAY,WAAZA,SAAAA,GAAAA,aAAY,CAAGa,GAAH,CAAZb;;KAEEE,KAZNmC,eAcEA,yBAAAA,cAAAA,MAAAA;AAAKnD,IAAAA,SAAS,EAAEkD,YAAAA,CAAMpD,SAAJ,gBAAFoD,EAA8BzC,QAAQ,IAAI,UAA1CyC;AAAuDtC,IAAAA,OAAO,EAAEA;GAAhFuC,EACGhD,KAAK,CAACuC,MAANvC,KAAiB,CAAjBA,gBACCgD,yBAAAA,cAAAA,OAAAA;AAAMnD,IAAAA,SAAS,EAAKF,SAAL;GAAfqD,eACEA,yBAAAA,cAAAA,OAAAA;AAAMnD,IAAAA,SAAS,EAAEkD,YAAAA,CAAMpD,SAAJ,WAAFoD,EAAyB3C,IAAI,IAAOT,SAAP,gBAA7BoD;GAAjBC,EACGtB,OAAO,CAACE,GAARF,CAAY,UAACwB,MAAD;QACLlB,KAAK,GAAGxB,aAAa,GAAGA,aAAa,CAAC0C,MAAD,CAAhB,GAA2B;QAChDC,SAAS,GAAG,CAACD,MAAM,CAAC5C;wBAExB0C,yBAAAA,cAAAA,OAAAA;AAAMnD,MAAAA,SAAS,EAAKF,SAAL;AAAuByD,MAAAA,GAAG,EAAEF,MAAM,CAACrB;KAAlDmB,eACEA,yBAAAA,cAAAA,OAAAA;AACEnD,MAAAA,SAAS,EAAKF,SAAL;AACT0D,MAAAA,KAAK,EAAE;AAAEC,QAAAA,QAAQ,EAAEnC;AAAZ;KAFT6B,EAIGhB,KAAK,KAAK,IAAVA,GAAiBkB,MAAM,CAAClB,KAAxBA,GAAgCA,KAJnCgB,CADFA,EAOGG,SAAS,gBACRH,yBAAAA,cAAAA,OAAAA;AACEnD,MAAAA,SAAS,EAAKF,SAAL;AACTc,MAAAA,OAAO,EAAE,gBAAA,CAACe,GAAD;YACHlB,UAAU;AAEdkB,QAAAA,GAAG,CAACC,eAAJD;YACM+B,SAAS,GAAG,SAAA,CAAIvD,KAAJ,EAAWwD,MAAX,CAAkB,UAAC3B,EAAD;iBAAQA,EAAE,KAAKqB,MAAM,CAACrB;AAAxC,SAAA;AAClBd,QAAAA,cAAc,CAACwC,SAAD,CAAdxC;;KAPJiC,eAUEA,yBAAAA,cAAAA,CAACS,mBAADT,MAAAA,CAVFA,CADQ,GAaN,IApBNA;AAJH,GAAAtB,CADHsB,CADFA,CADDhD,gBAkCCgD,yBAAAA,cAAAA,OAAAA;AAAMnD,IAAAA,SAAS,EAAKF,SAAL;GAAfqD,EAA+C9C,WAA/C8C,CAnCJA,EAqCG,CAAC,CAACzC,MAAF,IAAaiC,iBAAiB,IAAIN,KAAlC,IAA4CO,YAA5C,gBACCO,yBAAAA,cAAAA,OAAAA;AAAMnD,IAAAA,SAAS,EAAKF,SAAL;GAAfqD,EACGP,YAAY,gBACXO,yBAAAA,cAAAA,OAAAA;AAAMnD,IAAAA,SAAS,EAAEkD,YAAAA,CAAMpD,SAAJ,iBAAFoD;AAAgCtC,IAAAA,OAAO,EAAEoC;GAA1DG,QACMV,QAAQ,GAAG,EAAXA,GAAgB,KAAhBA,GAAwBA,SAD9BU,CADW,GAITR,iBAAiB,IAAIN,KAArBM,gBACFQ,yBAAAA,cAAAA,OAAAA;AACEnD,IAAAA,SAAS,EAAKF,SAAL;AACTC,IAAAA,IAAI,EAAC;AACL8D,IAAAA,QAAQ,EAAE,CAAC;AACXjD,IAAAA,OAAO,EAAEa;GAJX0B,eAMEA,yBAAAA,cAAAA,CAACW,uBAADX,MAAAA,CANFA,CADER,GASA,IAdNQ,EAeGzC,MAfHyC,CADD,GAkBG,IAvDNA,CAdFA,EAwEGhD,KAAK,CAACuC,MAANvC,KAAiB,CAAjBA,IAAsB0C,QAAtB1C,gBACCgD,yBAAAA,cAAAA,MAAAA;AAAKnD,IAAAA,SAAS,EAAKF,SAAL;GAAdqD,eACEA,yBAAAA,cAAAA,OAAAA;AAAMnD,IAAAA,SAAS,EAAEkD,YAAAA,CAAMpD,SAAJ,YAAFoD;GAAjBC,eACEA,yBAAAA,cAAAA,OAAAA;AAAMnD,IAAAA,SAAS,EAAEkD,YAAAA,CAAMpD,SAAJ,WAAFoD,EAA4BpD,SAA1B,gBAAFoD;GAAjBC,EACGtB,OAAO,CAACE,GAARF,CAAY,UAACwB,MAAD;QACLlB,KAAK,GAAGxB,aAAa,GAAGA,aAAa,CAAC0C,MAAD,CAAhB,GAA2B;QAChDC,SAAS,GAAG,CAACD,MAAM,CAAC5C;wBAGxB0C,yBAAAA,cAAAA,OAAAA;AAAMnD,MAAAA,SAAS,EAAKF,SAAL;AAAuByD,MAAAA,GAAG,EAAEF,MAAM,CAACrB;KAAlDmB,eACEA,yBAAAA,cAAAA,OAAAA;AACEnD,MAAAA,SAAS,EAAKF,SAAL;AACT0D,MAAAA,KAAK,EAAE;AAAEC,QAAAA,QAAQ,EAAEnC;AAAZ;KAFT6B,EAIGhB,KAAK,KAAK,IAAVA,GAAiBkB,MAAM,CAAClB,KAAxBA,GAAgCA,KAJnCgB,CADFA,EAOGG,SAAS,gBACRH,yBAAAA,cAAAA,OAAAA;AACEnD,MAAAA,SAAS,EAAKF,SAAL;AACTc,MAAAA,OAAO,EAAE,gBAAA,CAACe,GAAD;YACHlB,UAAU;AAEdkB,QAAAA,GAAG,CAACC,eAAJD;YACM+B,SAAS,GAAG,SAAA,CAAIvD,KAAJ,EAAWwD,MAAX,CAAkB,UAAC3B,EAAD;iBAAQA,EAAE,KAAKqB,MAAM,CAACrB;AAAxC,SAAA;AAClBd,QAAAA,cAAc,CAACwC,SAAD,CAAdxC;;KAPJiC,eAUEA,yBAAAA,cAAAA,CAACS,mBAADT,MAAAA,CAVFA,CADQ,GAaN,IApBNA;AALH,GAAAtB,CADHsB,CADFA,CADFA,EAkCGR,iBAAiB,gBAChBQ,yBAAAA,cAAAA,OAAAA;AAAMnD,IAAAA,SAAS,EAAKF,SAAL;GAAfqD,eACEA,yBAAAA,cAAAA,OAAAA;AACEnD,IAAAA,SAAS,EAAKF,SAAL;AACTC,IAAAA,IAAI,EAAC;AACL8D,IAAAA,QAAQ,EAAE,CAAC;AACXjD,IAAAA,OAAO,EAAEa;GAJX0B,eAMEA,yBAAAA,cAAAA,CAACW,uBAADX,MAAAA,CANFA,CADFA,CADgB,GAWd,IA7CNA,CADDhD,GAgDG,IAxHNgD;AA5E4B,CAAVxD;;AA0PxB,IAAIoE,WAAJ,EAAa;AACXrE,EAAAA,QAAQ,CAACsE,WAATtE,GAAuB,UAAvBA;;;"}
@@ -0,0 +1,317 @@
1
+ /** @LICENSE
2
+ * @hi-ui/tag-input
3
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/tag-input#readme
4
+ *
5
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
6
+ *
7
+ * This source code is licensed under the MIT license found in the
8
+ * LICENSE file in the root directory of this source tree.
9
+ */
10
+ 'use strict';
11
+
12
+ var _typeof = require("@babel/runtime/helpers/typeof");
13
+
14
+ Object.defineProperty(exports, '__esModule', {
15
+ value: true
16
+ });
17
+
18
+ var tslib = require('tslib');
19
+
20
+ var React = require('react');
21
+
22
+ var classname = require('@hi-ui/classname');
23
+
24
+ var env = require('@hi-ui/env');
25
+
26
+ var useUncontrolledState = require('@hi-ui/use-uncontrolled-state');
27
+
28
+ var icons = require('@hi-ui/icons');
29
+
30
+ var useLatest = require('@hi-ui/use-latest');
31
+
32
+ var typeAssertion = require('@hi-ui/type-assertion');
33
+
34
+ var ResizeDetector = require('react-resize-detector');
35
+
36
+ function _interopDefaultLegacy(e) {
37
+ return e && _typeof(e) === 'object' && 'default' in e ? e : {
38
+ 'default': e
39
+ };
40
+ }
41
+
42
+ var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
43
+
44
+ var ResizeDetector__default = /*#__PURE__*/_interopDefaultLegacy(ResizeDetector);
45
+
46
+ var _role = 'tag-input-mock';
47
+
48
+ var _prefix = classname.getPrefixCls(_role);
49
+
50
+ var NOOP_ARRAY = [];
51
+ /**
52
+ * TODO: What is TagInputMock
53
+ */
54
+
55
+ var TagInputMock = /*#__PURE__*/React.forwardRef(function (_a, ref) {
56
+ var _a$prefixCls = _a.prefixCls,
57
+ prefixCls = _a$prefixCls === void 0 ? _prefix : _a$prefixCls,
58
+ _a$role = _a.role,
59
+ role = _a$role === void 0 ? _role : _a$role,
60
+ className = _a.className,
61
+ _a$defaultValue = _a.defaultValue,
62
+ defaultValue = _a$defaultValue === void 0 ? NOOP_ARRAY : _a$defaultValue,
63
+ valueProp = _a.value,
64
+ onChange = _a.onChange,
65
+ placeholder = _a.placeholder,
66
+ _a$data = _a.data,
67
+ data = _a$data === void 0 ? NOOP_ARRAY : _a$data,
68
+ _a$disabled = _a.disabled,
69
+ disabled = _a$disabled === void 0 ? false : _a$disabled,
70
+ _a$clearable = _a.clearable,
71
+ clearable = _a$clearable === void 0 ? false : _a$clearable,
72
+ _a$focused = _a.focused,
73
+ focused = _a$focused === void 0 ? false : _a$focused,
74
+ _a$invalid = _a.invalid,
75
+ invalid = _a$invalid === void 0 ? false : _a$invalid,
76
+ _a$readOnly = _a.readOnly,
77
+ readOnly = _a$readOnly === void 0 ? false : _a$readOnly,
78
+ _a$size = _a.size,
79
+ size = _a$size === void 0 ? 'md' : _a$size,
80
+ _a$appearance = _a.appearance,
81
+ appearance = _a$appearance === void 0 ? 'outline' : _a$appearance,
82
+ _a$wrap = _a.wrap,
83
+ wrap = _a$wrap === void 0 ? false : _a$wrap,
84
+ suffix = _a.suffix,
85
+ _a$tagWidth = _a.tagWidth,
86
+ tagWidth = _a$tagWidth === void 0 ? 20 : _a$tagWidth,
87
+ displayRender = _a.displayRender,
88
+ _onMouseOver = _a.onMouseOver,
89
+ _onMouseLeave = _a.onMouseLeave,
90
+ onClear = _a.onClear,
91
+ onExpand = _a.onExpand,
92
+ rest = tslib.__rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "disabled", "clearable", "focused", "invalid", "readOnly", "size", "appearance", "wrap", "suffix", "tagWidth", "displayRender", "onMouseOver", "onMouseLeave", "onClear", "onExpand"]);
93
+
94
+ var _useUncontrolledState = useUncontrolledState.useUncontrolledState(defaultValue, valueProp, onChange),
95
+ value = _useUncontrolledState[0],
96
+ tryChangeValue = _useUncontrolledState[1];
97
+
98
+ var tagList = React.useMemo(function () {
99
+ return value.map(function (id) {
100
+ return data.find(function (item) {
101
+ return item.id === id;
102
+ }) || {
103
+ id: id,
104
+ title: id
105
+ };
106
+ });
107
+ }, [value, data]);
108
+ var tagCount = tagList.length;
109
+
110
+ var _useState = React.useState(),
111
+ _useState$ = _useState[0],
112
+ containerWidth = _useState$ === void 0 ? 0 : _useState$,
113
+ setContainerWidth = _useState[1];
114
+
115
+ var mergedTagList = React.useMemo(function () {
116
+ if (wrap) {
117
+ return tagList;
118
+ }
119
+
120
+ return tagList.slice(0, Math.min(tagList.length, containerWidth / tagWidth));
121
+ }, [tagList, tagWidth, containerWidth, wrap]);
122
+ var showTags = mergedTagList.length > 0;
123
+ var showTagCount = !wrap && showTags;
124
+
125
+ var _useState2 = React.useState({}),
126
+ tagsWidth = _useState2[0],
127
+ setTagsWidth = _useState2[1];
128
+
129
+ var getTagWidth = React.useCallback(function (index) {
130
+ return typeof mergedTagList[index] !== 'undefined' && tagsWidth[mergedTagList[index].id] || 0;
131
+ }, [tagsWidth, mergedTagList]);
132
+
133
+ var _useState3 = React.useState(0),
134
+ suffixWidth = _useState3[0],
135
+ setSuffixWidth = _useState3[1]; // TODO: 设置第一个 tagWidth 超出省略,预防无展示
136
+ // const [tagMaxWidth, setTagMaxWidth] = useState(0)
137
+
138
+
139
+ var _useState4 = React.useState(0),
140
+ tagMaxCount = _useState4[0],
141
+ setTagMaxCount = _useState4[1];
142
+
143
+ React.useLayoutEffect(function () {
144
+ var tagMaxCount = 0;
145
+
146
+ if (typeAssertion.isArrayNonEmpty(mergedTagList)) {
147
+ var len = mergedTagList.length;
148
+ var lastIndex = len - 1;
149
+ var totalWidth = suffixWidth;
150
+
151
+ for (var i = 0; i < len; ++i) {
152
+ var currentTagWidth = getTagWidth(i);
153
+
154
+ if (currentTagWidth === undefined) {
155
+ break;
156
+ }
157
+
158
+ totalWidth += currentTagWidth;
159
+
160
+ if (lastIndex === 0 && totalWidth <= containerWidth || i === lastIndex - 1 && totalWidth + getTagWidth(lastIndex) <= containerWidth) {
161
+ tagMaxCount = lastIndex;
162
+ break;
163
+ } else if (totalWidth > containerWidth) {
164
+ tagMaxCount = i - 1;
165
+ break;
166
+ }
167
+ }
168
+ } else {
169
+ tagMaxCount = 0;
170
+ }
171
+
172
+ setTagMaxCount(tagMaxCount);
173
+ }, [tagsWidth, suffixWidth, getTagWidth, containerWidth, mergedTagList, suffix]);
174
+ var onClearLatest = useLatest.useLatestCallback(onClear);
175
+ var handleClear = React.useCallback(function (evt) {
176
+ if (disabled) return;
177
+ evt.stopPropagation();
178
+ tryChangeValue(NOOP_ARRAY);
179
+ onClearLatest();
180
+ }, [tryChangeValue, disabled, onClearLatest]);
181
+
182
+ var _useState5 = React.useState(false),
183
+ hover = _useState5[0],
184
+ setHover = _useState5[1];
185
+
186
+ var trySetHover = React.useCallback(function (hovered) {
187
+ if (disabled) return;
188
+ setHover(hovered);
189
+ }, [disabled]);
190
+ var handleExpand = React.useCallback(function (evt) {
191
+ evt.stopPropagation();
192
+ onExpand === null || onExpand === void 0 ? void 0 : onExpand();
193
+ }, [onExpand]); // 在开启 clearable 下展示 清除内容按钮,可点击进行内容清楚
194
+
195
+ var showClearableIcon = clearable && showTags && !disabled;
196
+ var cls = classname.cx(prefixCls, className, prefixCls + "--appearance-" + appearance, prefixCls + "--size-" + size, focused && "focused", readOnly && 'readonly', invalid && 'invalid', disabled && prefixCls + "--disabled", wrap && prefixCls + "--wrap");
197
+ return /*#__PURE__*/React__default['default'].createElement(ResizeDetector__default['default'], {
198
+ skipOnMount: false,
199
+ onResize: function onResize(w) {
200
+ if (w) {
201
+ setContainerWidth(w);
202
+ }
203
+ }
204
+ }, /*#__PURE__*/React__default['default'].createElement("div", Object.assign({
205
+ ref: ref,
206
+ role: role,
207
+ className: cls,
208
+ onMouseOver: function onMouseOver(evt) {
209
+ trySetHover(true);
210
+ _onMouseOver === null || _onMouseOver === void 0 ? void 0 : _onMouseOver(evt);
211
+ },
212
+ onMouseLeave: function onMouseLeave(evt) {
213
+ trySetHover(false);
214
+ _onMouseLeave === null || _onMouseLeave === void 0 ? void 0 : _onMouseLeave(evt);
215
+ }
216
+ }, rest), showTags ? /*#__PURE__*/React__default['default'].createElement("span", {
217
+ className: prefixCls + "__tags"
218
+ }, mergedTagList.map(function (option, index) {
219
+ return /*#__PURE__*/React__default['default'].createElement(MockTag, {
220
+ hidden: wrap ? false : index > tagMaxCount,
221
+ key: option.id,
222
+ prefixCls: prefixCls,
223
+ disabled: disabled,
224
+ option: option,
225
+ value: value,
226
+ displayRender: displayRender,
227
+ tryChangeValue: tryChangeValue,
228
+ onTagResize: function onTagResize(id, w) {
229
+ return setTagsWidth(function (prev) {
230
+ var _Object$assign;
231
+
232
+ return Object.assign(Object.assign({}, prev), (_Object$assign = {}, _Object$assign[id] = w, _Object$assign));
233
+ });
234
+ }
235
+ });
236
+ })) : /*#__PURE__*/React__default['default'].createElement("span", {
237
+ className: prefixCls + "__placeholder"
238
+ }, placeholder), /*#__PURE__*/React__default['default'].createElement(ResizeDetector__default['default'], {
239
+ skipOnMount: false,
240
+ onResize: function onResize(w) {
241
+ if (w) {
242
+ setSuffixWidth(w);
243
+ }
244
+ }
245
+ }, !!suffix || showClearableIcon && hover || showTagCount ? /*#__PURE__*/React__default['default'].createElement("span", {
246
+ className: prefixCls + "__suffix"
247
+ }, showTagCount ? /*#__PURE__*/React__default['default'].createElement("span", {
248
+ className: classname.cx(prefixCls + "__tag--total"),
249
+ onClick: handleExpand
250
+ }, "" + (tagCount > 99 ? '99+' : tagCount)) : null, showClearableIcon && hover ? /*#__PURE__*/React__default['default'].createElement("span", {
251
+ className: prefixCls + "__clear",
252
+ role: "button",
253
+ tabIndex: -1,
254
+ onClick: handleClear
255
+ }, /*#__PURE__*/React__default['default'].createElement(icons.CloseCircleFilled, null)) : suffix) : null)));
256
+ });
257
+
258
+ if (env.__DEV__) {
259
+ TagInputMock.displayName = 'TagInputMock';
260
+ }
261
+
262
+ var hiddenStyle = {
263
+ position: 'absolute',
264
+ opacity: 0,
265
+ width: 0,
266
+ height: 0,
267
+ overflow: 'hidden',
268
+ display: 'none'
269
+ };
270
+
271
+ function MockTag(_ref) {
272
+ var prefixCls = _ref.prefixCls,
273
+ option = _ref.option,
274
+ disabled = _ref.disabled,
275
+ value = _ref.value,
276
+ onTagResize = _ref.onTagResize,
277
+ tryChangeValue = _ref.tryChangeValue,
278
+ displayRender = _ref.displayRender,
279
+ _ref$hidden = _ref.hidden,
280
+ hidden = _ref$hidden === void 0 ? false : _ref$hidden;
281
+ var title = typeAssertion.isFunction(displayRender) ? displayRender(option) : true;
282
+ var closeable = !option.disabled;
283
+ return /*#__PURE__*/React__default['default'].createElement(ResizeDetector__default['default'], {
284
+ skipOnMount: false,
285
+ onResize: function onResize(width) {
286
+ // 隐藏后就不允许设置 tagSize,避免无限循环触发“宽度计算响应式策略”
287
+ if (hidden) return;
288
+
289
+ if (width !== undefined) {
290
+ onTagResize(option.id, width);
291
+ }
292
+ }
293
+ }, /*#__PURE__*/React__default['default'].createElement("div", {
294
+ style: {
295
+ display: 'inline-block'
296
+ }
297
+ }, /*#__PURE__*/React__default['default'].createElement("span", {
298
+ className: prefixCls + "__tag",
299
+ style: hidden ? hiddenStyle : undefined,
300
+ key: option.id
301
+ }, /*#__PURE__*/React__default['default'].createElement("span", {
302
+ className: prefixCls + "__tag-content"
303
+ }, title === true ? option.title : title), closeable ? /*#__PURE__*/React__default['default'].createElement("span", {
304
+ className: prefixCls + "__tag-closed",
305
+ onClick: function onClick(evt) {
306
+ if (disabled) return;
307
+ evt.stopPropagation();
308
+ var nextValue = value.filter(function (id) {
309
+ return id !== option.id;
310
+ });
311
+ tryChangeValue(nextValue);
312
+ }
313
+ }, /*#__PURE__*/React__default['default'].createElement(icons.CloseOutlined, null)) : null)));
314
+ }
315
+
316
+ exports.TagInputMock = TagInputMock;
317
+ //# sourceMappingURL=TagInputMock.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TagInputMock.js","sources":["../../src/TagInputMock.tsx"],"sourcesContent":[null],"names":["_role","_prefix","getPrefixCls","NOOP_ARRAY","TagInputMock","forwardRef","_a","ref","prefixCls","role","className","defaultValue","valueProp","value","onChange","placeholder","data","disabled","clearable","focused","invalid","readOnly","size","appearance","wrap","suffix","tagWidth","displayRender","onMouseOver","onMouseLeave","onClear","onExpand","rest","useUncontrolledState","tryChangeValue","tagList","useMemo","map","id","find","item","title","tagCount","length","useState","containerWidth","setContainerWidth","mergedTagList","slice","Math","min","showTags","showTagCount","tagsWidth","setTagsWidth","getTagWidth","useCallback","index","suffixWidth","setSuffixWidth","tagMaxCount","setTagMaxCount","useLayoutEffect","isArrayNonEmpty","len","lastIndex","totalWidth","i","currentTagWidth","undefined","onClearLatest","useLatestCallback","handleClear","evt","stopPropagation","hover","setHover","trySetHover","hovered","handleExpand","showClearableIcon","cls","cx","React","ResizeDetector","skipOnMount","onResize","w","option","MockTag","hidden","key","onTagResize","prev","onClick","tabIndex","CloseCircleFilled","__DEV__","displayName","hiddenStyle","position","opacity","width","height","overflow","display","isFunction","closeable","style","nextValue","filter","CloseOutlined"],"mappings":"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"}
package/lib/cjs/index.js CHANGED
@@ -17,6 +17,9 @@ require('./styles/index.scss.js');
17
17
 
18
18
  var TagInput = require('./TagInput.js');
19
19
 
20
+ var TagInputMock = require('./TagInputMock.js');
21
+
20
22
  exports.TagInput = TagInput.TagInput;
21
23
  exports["default"] = TagInput.TagInput;
24
+ exports.TagInputMock = TagInputMock.TagInputMock;
22
25
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
@@ -12,7 +12,7 @@
12
12
  Object.defineProperty(exports, '__esModule', {
13
13
  value: true
14
14
  });
15
- var css_248z = ".hi-v4-tag-input {\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1; }\n .hi-v4-tag-input__container {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: var(--color-black);\n border: 1px solid transparent;\n background-color: var(--color-white);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 4px 10px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n min-height: 32px;\n overflow: hidden;\n border-color: var(--color-gray-30);\n border-radius: 4px; }\n .hi-v4-tag-input__container:not(.disabled):hover {\n border-color: var(--color-primary); }\n .hi-v4-tag-input__container:not(.disabled).focused {\n border-color: var(--color-primary); }\n .hi-v4-tag-input__container.disabled {\n cursor: not-allowed;\n color: var(--color-gray-50);\n background-color: var(--color-gray-10); }\n .hi-v4-tag-input__placeholder {\n color: var(--color-gray-50); }\n .hi-v4-tag-input__suffix {\n font-size: 16px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n .hi-v4-tag-input__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 14px;\n color: var(--color-gray-50);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition: all 0.3s;\n transition: all 0.3s; }\n .hi-v4-tag-input__clear:hover {\n color: var(--color-black); }\n .hi-v4-tag-input__value {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 22px;\n line-height: 22px; }\n .hi-v4-tag-input__tags {\n -webkit-box-flex: 0;\n -ms-flex: 0 1 auto;\n flex: 0 1 auto;\n display: inline-block;\n width: -webkit-fit-content;\n width: -moz-fit-content;\n width: fit-content;\n white-space: nowrap;\n height: 100%;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin-top: -4px; }\n .hi-v4-tag-input__tag, .hi-v4-tag-input__tag--left {\n display: inline-block;\n margin-right: 4px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n color: #333;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background: #f2f2f2;\n border-radius: 4px; }\n .hi-v4-tag-input__tag--total {\n display: inline-block;\n margin-right: 6px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: var(--color-primary-20);\n color: var(--color-primary);\n border-radius: 4px;\n line-height: 22px;\n cursor: pointer; }\n .hi-v4-tag-input__tag {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n .hi-v4-tag-input__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n .hi-v4-tag-input__tag-closed {\n margin-left: 8px;\n font-size: 12px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #8e8e8e;\n cursor: pointer; }\n .disabled .hi-v4-tag-input__tag-closed {\n cursor: not-allowed; }\n .hi-v4-tag-input__tag--left {\n margin: 0;\n max-width: 54px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle; }\n .hi-v4-tag-input--nowrap .hi-v4-tag-input__value {\n width: calc(100% - 64px);\n overflow-x: hidden; }\n .hi-v4-tag-input--wrap .hi-v4-tag-input__value {\n height: auto; }\n .hi-v4-tag-input--wrap .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n .hi-v4-tag-input--wrap .hi-v4-tag-input__tag {\n margin-top: 4px; }\n .hi-v4-tag-input--expanded {\n position: relative; }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand {\n position: absolute;\n top: 0;\n left: 0;\n height: auto;\n z-index: 1;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: var(--color-black);\n border: 1px solid transparent;\n background-color: var(--color-white);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 3px 0;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n min-height: 32px;\n overflow: hidden;\n border-radius: 4px;\n border-color: var(--color-primary); }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__value {\n height: -webkit-fit-content;\n height: -moz-fit-content;\n height: fit-content;\n max-height: 74px;\n -webkit-box-align: stretch;\n -ms-flex-align: stretch;\n align-items: stretch;\n overflow: scroll;\n padding-left: 10px; }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tag {\n margin-top: 4px; }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__suffix {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n padding: 4px 10px 4px 0;\n position: sticky;\n top: 0; }\n";
15
+ var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input {\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1; }\n.hi-v4-tag-input__container {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 4px 10px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n min-height: 32px;\n overflow: hidden;\n border-color: #dfe2e8;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8);\n border-radius: 4px; }\n.hi-v4-tag-input__container:not(.disabled):hover {\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input__container:not(.disabled).focused {\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input__container.disabled {\n cursor: not-allowed;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input__container.disabled .hi-v4-tag-input__tag {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input__placeholder {\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input__suffix {\n font-size: 16px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n min-width: 32px; }\n.hi-v4-tag-input__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 14px;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition: all 0.3s;\n transition: all 0.3s; }\n.hi-v4-tag-input__clear:hover {\n color: #000;\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input__value {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 22px;\n line-height: 22px; }\n.hi-v4-tag-input__tags {\n -webkit-box-flex: 0;\n -ms-flex: 0 1 auto;\n flex: 0 1 auto;\n display: inline-block;\n width: -webkit-fit-content;\n width: -moz-fit-content;\n width: fit-content;\n white-space: nowrap;\n height: 100%;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin-top: -4px;\n position: relative; }\n.hi-v4-tag-input__tag, .hi-v4-tag-input__tag--left {\n display: inline-block;\n margin-right: 4px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n color: #333;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px; }\n.hi-v4-tag-input__tag--total {\n display: inline-block;\n margin-right: 6px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #bde2ff;\n background-color: var(--hi-v4-color-brandblue-100, #bde2ff);\n color: #237ffa;\n color: var(--hi-v4-color-brandblue-500, #237ffa);\n border-radius: 4px;\n line-height: 22px;\n cursor: pointer; }\n.hi-v4-tag-input__tag {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-tag-input__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input__tag-closed {\n margin-left: 8px;\n margin-left: var(--hi-v4-spacing-4, 8px);\n font-size: 12px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #8e8e8e;\n cursor: pointer; }\n.disabled .hi-v4-tag-input__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input__tag--left {\n margin: 0;\n max-width: 54px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle; }\n.hi-v4-tag-input--nowrap .hi-v4-tag-input__value {\n width: calc(100% - 64px);\n overflow-x: hidden; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__value {\n height: auto; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded {\n position: relative; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand {\n position: absolute;\n top: 0;\n left: 0;\n height: auto;\n z-index: 1;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: use-color-statc(\"white\");\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 3px 0;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n min-height: 32px;\n overflow: hidden;\n border-radius: 4px;\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__value {\n height: -webkit-fit-content;\n height: -moz-fit-content;\n height: fit-content;\n max-height: 74px;\n -webkit-box-align: stretch;\n -ms-flex-align: stretch;\n align-items: stretch;\n overflow: scroll;\n padding-left: 10px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__suffix {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n padding: 4px 10px 4px 0;\n position: sticky;\n top: 0; }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input-mock {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n -webkit-box-shadow: none;\n box-shadow: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n cursor: text;\n background-color: transparent;\n -webkit-tap-highlight-color: transparent;\n position: relative;\n overflow: hidden;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: 200ms;\n transition-duration: 200ms;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n width: 100%;\n height: auto;\n z-index: auto;\n font-size: inherit;\n line-height: inherit;\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733);\n border: 1px solid transparent;\n border: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-static-transparent, transparent);\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled):hover {\n z-index: calc(1 + 1);\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled).focused {\n z-index: calc(1 + 1);\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__value {\n height: auto; }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__tags {\n white-space: normal; }\n.hi-v4-tag-input-mock__suffix {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n font-size: 1rem;\n font-size: var(--hi-v4-text-size-lg, 1rem);\n padding-left: 8px;\n padding-left: var(--hi-v4-spacing-4, 8px);\n text-align: center; }\n.hi-v4-tag-input-mock__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n text-align: center;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: 200ms;\n transition-duration: 200ms;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1)); }\n.hi-v4-tag-input-mock__clear:hover {\n color: #000;\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input-mock__tags {\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden; }\n.hi-v4-tag-input-mock__tag--total {\n display: inline-block;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n vertical-align: middle;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n cursor: pointer;\n margin-right: 6px;\n margin-right: var(--hi-v4-spacing-3, 6px);\n padding: 0 8px;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n background-color: #e2f3fe;\n background-color: var(--hi-v4-color-brandblue-50, #e2f3fe);\n color: #237ffa;\n color: var(--hi-v4-color-brandblue-500, #237ffa);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n line-height: 1.25rem;\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem); }\n.hi-v4-tag-input-mock__suffix, .hi-v4-tag-input-mock__placeholder {\n color: #c9ced6;\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock__tag, .hi-v4-tag-input-mock__placeholder {\n margin-top: 2px;\n margin-top: var(--hi-v4-spacing-1, 2px);\n margin-bottom: 2px;\n margin-bottom: var(--hi-v4-spacing-1, 2px); }\n.hi-v4-tag-input-mock__tag {\n max-width: 100%;\n margin-right: 4px;\n margin-right: var(--hi-v4-spacing-2, 4px);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n vertical-align: middle;\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733);\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n position: relative;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 0;\n -ms-flex: none;\n flex: none;\n line-height: inherit; }\n.hi-v4-tag-input-mock__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input-mock__tag-closed {\n margin-left: 4px;\n margin-left: var(--hi-v4-spacing-2, 4px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n cursor: pointer; }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock--size-sm {\n height: 24px;\n height: var(--hi-v4-height-xs, 24px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n line-height: 1.25rem;\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 0 calc(12px - 1px);\n padding: 0 calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__tag,\n .hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__placeholder {\n margin-top: 1px;\n margin-bottom: 1px; }\n.hi-v4-tag-input-mock--size-md {\n height: 32px;\n height: var(--hi-v4-height-normal, 32px);\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: 1.375rem;\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 2px calc(12px - 1px);\n padding: 2px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-lg {\n height: 40px;\n height: var(--hi-v4-height-xl, 40px);\n font-size: 1rem;\n font-size: var(--hi-v4-text-size-lg, 1rem);\n line-height: 1.5rem;\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 5px calc(12px - 1px);\n padding: 5px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--appearance-outline {\n border-color: #dfe2e8;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled):hover {\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9);\n box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9); }\n.hi-v4-tag-input-mock--appearance-unset {\n width: auto;\n -webkit-box-pack: start;\n -ms-flex-pack: start;\n justify-content: flex-start;\n border-color: transparent; }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9);\n box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9); }\n.hi-v4-tag-input-mock--appearance-filled {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa);\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9);\n box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-outline.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-unset.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n color: #c9ced6;\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock--appearance-outline.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n";
16
16
 
17
17
  var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
18
18
 
@@ -16,6 +16,7 @@ import { CloseOutlined, CloseCircleFilled } from '@hi-ui/icons';
16
16
  import { useMergeRefs } from '@hi-ui/use-merge-refs';
17
17
  import { useTagInput } from './use-tag-input.js';
18
18
  import { useOutsideClick } from '@hi-ui/use-outside-click';
19
+ import { useLatestCallback } from '@hi-ui/use-latest';
19
20
  var _role = 'tag-input';
20
21
 
21
22
  var _prefix = getPrefixCls(_role);
@@ -49,7 +50,8 @@ var TagInput = /*#__PURE__*/forwardRef(function (_a, ref) {
49
50
  onClick = _a.onClick,
50
51
  _onMouseOver = _a.onMouseOver,
51
52
  _onMouseLeave = _a.onMouseLeave,
52
- rest = __rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "wrap", "clearable", "disabled", "suffix", "displayRender", "onClick", "onMouseOver", "onMouseLeave"]);
53
+ onClear = _a.onClear,
54
+ rest = __rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "wrap", "clearable", "disabled", "suffix", "displayRender", "onClick", "onMouseOver", "onMouseLeave", "onClear"]);
53
55
 
54
56
  var _useUncontrolledState = useUncontrolledState(defaultValue, valueProp, onChange),
55
57
  value = _useUncontrolledState[0],
@@ -60,11 +62,13 @@ var TagInput = /*#__PURE__*/forwardRef(function (_a, ref) {
60
62
  var _useTagInput = useTagInput(data, tagInputRef),
61
63
  tagMaxWidth = _useTagInput[0];
62
64
 
65
+ var onClearLatest = useLatestCallback(onClear);
63
66
  var handleClear = useCallback(function (evt) {
64
67
  if (disabled) return;
65
68
  evt.stopPropagation();
66
69
  tryChangeValue(NOOP_ARRAY);
67
- }, [tryChangeValue, disabled]);
70
+ onClearLatest();
71
+ }, [tryChangeValue, disabled, onClearLatest]);
68
72
  var tagList = useMemo(function () {
69
73
  return value.map(function (id) {
70
74
  return data.find(function (item) {
@@ -1 +1 @@
1
- {"version":3,"file":"TagInput.js","sources":["../../src/TagInput.tsx"],"sourcesContent":[null],"names":["_role","_prefix","getPrefixCls","NOOP_ARRAY","TagInput","forwardRef","_a","ref","prefixCls","role","className","defaultValue","valueProp","value","onChange","placeholder","data","wrap","clearable","disabled","suffix","displayRender","onClick","onMouseOver","onMouseLeave","rest","useUncontrolledState","tryChangeValue","tagInputRef","useRef","useTagInput","tagMaxWidth","handleClear","useCallback","evt","stopPropagation","tagList","useMemo","map","id","find","item","title","useState","hover","setHover","trySetHover","hovered","tagCount","length","showClearableIcon","showTagCount","expanded","setExpanded","useOutsideClick","handleExpand","cls","cx","React","useMergeRefs","option","closeable","key","style","maxWidth","nextValue","filter","CloseOutlined","tabIndex","CloseCircleFilled","__DEV__","displayName"],"mappings":"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"}
1
+ {"version":3,"file":"TagInput.js","sources":["../../src/TagInput.tsx"],"sourcesContent":[null],"names":["_role","_prefix","getPrefixCls","NOOP_ARRAY","TagInput","forwardRef","_a","ref","prefixCls","role","className","defaultValue","valueProp","value","onChange","placeholder","data","wrap","clearable","disabled","suffix","displayRender","onClick","onMouseOver","onMouseLeave","onClear","rest","useUncontrolledState","tryChangeValue","tagInputRef","useRef","useTagInput","tagMaxWidth","onClearLatest","useLatestCallback","handleClear","useCallback","evt","stopPropagation","tagList","useMemo","map","id","find","item","title","useState","hover","setHover","trySetHover","hovered","tagCount","length","showClearableIcon","showTagCount","expanded","setExpanded","useOutsideClick","handleExpand","cls","cx","React","useMergeRefs","option","closeable","key","style","maxWidth","nextValue","filter","CloseOutlined","tabIndex","CloseCircleFilled","__DEV__","displayName"],"mappings":"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"}
@@ -0,0 +1,290 @@
1
+ /** @LICENSE
2
+ * @hi-ui/tag-input
3
+ * https://github.com/XiaoMi/hiui/tree/master/packages/ui/tag-input#readme
4
+ *
5
+ * Copyright (c) HIUI <mi-hiui@xiaomi.com>.
6
+ *
7
+ * This source code is licensed under the MIT license found in the
8
+ * LICENSE file in the root directory of this source tree.
9
+ */
10
+ import { __rest } from 'tslib';
11
+ import React, { forwardRef, useMemo, useState, useCallback, useLayoutEffect } from 'react';
12
+ import { getPrefixCls, cx } from '@hi-ui/classname';
13
+ import { __DEV__ } from '@hi-ui/env';
14
+ import { useUncontrolledState } from '@hi-ui/use-uncontrolled-state';
15
+ import { CloseCircleFilled, CloseOutlined } from '@hi-ui/icons';
16
+ import { useLatestCallback } from '@hi-ui/use-latest';
17
+ import { isArrayNonEmpty, isFunction } from '@hi-ui/type-assertion';
18
+ import ResizeDetector from 'react-resize-detector';
19
+ var _role = 'tag-input-mock';
20
+
21
+ var _prefix = getPrefixCls(_role);
22
+
23
+ var NOOP_ARRAY = [];
24
+ /**
25
+ * TODO: What is TagInputMock
26
+ */
27
+
28
+ var TagInputMock = /*#__PURE__*/forwardRef(function (_a, ref) {
29
+ var _a$prefixCls = _a.prefixCls,
30
+ prefixCls = _a$prefixCls === void 0 ? _prefix : _a$prefixCls,
31
+ _a$role = _a.role,
32
+ role = _a$role === void 0 ? _role : _a$role,
33
+ className = _a.className,
34
+ _a$defaultValue = _a.defaultValue,
35
+ defaultValue = _a$defaultValue === void 0 ? NOOP_ARRAY : _a$defaultValue,
36
+ valueProp = _a.value,
37
+ onChange = _a.onChange,
38
+ placeholder = _a.placeholder,
39
+ _a$data = _a.data,
40
+ data = _a$data === void 0 ? NOOP_ARRAY : _a$data,
41
+ _a$disabled = _a.disabled,
42
+ disabled = _a$disabled === void 0 ? false : _a$disabled,
43
+ _a$clearable = _a.clearable,
44
+ clearable = _a$clearable === void 0 ? false : _a$clearable,
45
+ _a$focused = _a.focused,
46
+ focused = _a$focused === void 0 ? false : _a$focused,
47
+ _a$invalid = _a.invalid,
48
+ invalid = _a$invalid === void 0 ? false : _a$invalid,
49
+ _a$readOnly = _a.readOnly,
50
+ readOnly = _a$readOnly === void 0 ? false : _a$readOnly,
51
+ _a$size = _a.size,
52
+ size = _a$size === void 0 ? 'md' : _a$size,
53
+ _a$appearance = _a.appearance,
54
+ appearance = _a$appearance === void 0 ? 'outline' : _a$appearance,
55
+ _a$wrap = _a.wrap,
56
+ wrap = _a$wrap === void 0 ? false : _a$wrap,
57
+ suffix = _a.suffix,
58
+ _a$tagWidth = _a.tagWidth,
59
+ tagWidth = _a$tagWidth === void 0 ? 20 : _a$tagWidth,
60
+ displayRender = _a.displayRender,
61
+ _onMouseOver = _a.onMouseOver,
62
+ _onMouseLeave = _a.onMouseLeave,
63
+ onClear = _a.onClear,
64
+ onExpand = _a.onExpand,
65
+ rest = __rest(_a, ["prefixCls", "role", "className", "defaultValue", "value", "onChange", "placeholder", "data", "disabled", "clearable", "focused", "invalid", "readOnly", "size", "appearance", "wrap", "suffix", "tagWidth", "displayRender", "onMouseOver", "onMouseLeave", "onClear", "onExpand"]);
66
+
67
+ var _useUncontrolledState = useUncontrolledState(defaultValue, valueProp, onChange),
68
+ value = _useUncontrolledState[0],
69
+ tryChangeValue = _useUncontrolledState[1];
70
+
71
+ var tagList = useMemo(function () {
72
+ return value.map(function (id) {
73
+ return data.find(function (item) {
74
+ return item.id === id;
75
+ }) || {
76
+ id: id,
77
+ title: id
78
+ };
79
+ });
80
+ }, [value, data]);
81
+ var tagCount = tagList.length;
82
+
83
+ var _useState = useState(),
84
+ _useState$ = _useState[0],
85
+ containerWidth = _useState$ === void 0 ? 0 : _useState$,
86
+ setContainerWidth = _useState[1];
87
+
88
+ var mergedTagList = useMemo(function () {
89
+ if (wrap) {
90
+ return tagList;
91
+ }
92
+
93
+ return tagList.slice(0, Math.min(tagList.length, containerWidth / tagWidth));
94
+ }, [tagList, tagWidth, containerWidth, wrap]);
95
+ var showTags = mergedTagList.length > 0;
96
+ var showTagCount = !wrap && showTags;
97
+
98
+ var _useState2 = useState({}),
99
+ tagsWidth = _useState2[0],
100
+ setTagsWidth = _useState2[1];
101
+
102
+ var getTagWidth = useCallback(function (index) {
103
+ return typeof mergedTagList[index] !== 'undefined' && tagsWidth[mergedTagList[index].id] || 0;
104
+ }, [tagsWidth, mergedTagList]);
105
+
106
+ var _useState3 = useState(0),
107
+ suffixWidth = _useState3[0],
108
+ setSuffixWidth = _useState3[1]; // TODO: 设置第一个 tagWidth 超出省略,预防无展示
109
+ // const [tagMaxWidth, setTagMaxWidth] = useState(0)
110
+
111
+
112
+ var _useState4 = useState(0),
113
+ tagMaxCount = _useState4[0],
114
+ setTagMaxCount = _useState4[1];
115
+
116
+ useLayoutEffect(function () {
117
+ var tagMaxCount = 0;
118
+
119
+ if (isArrayNonEmpty(mergedTagList)) {
120
+ var len = mergedTagList.length;
121
+ var lastIndex = len - 1;
122
+ var totalWidth = suffixWidth;
123
+
124
+ for (var i = 0; i < len; ++i) {
125
+ var currentTagWidth = getTagWidth(i);
126
+
127
+ if (currentTagWidth === undefined) {
128
+ break;
129
+ }
130
+
131
+ totalWidth += currentTagWidth;
132
+
133
+ if (lastIndex === 0 && totalWidth <= containerWidth || i === lastIndex - 1 && totalWidth + getTagWidth(lastIndex) <= containerWidth) {
134
+ tagMaxCount = lastIndex;
135
+ break;
136
+ } else if (totalWidth > containerWidth) {
137
+ tagMaxCount = i - 1;
138
+ break;
139
+ }
140
+ }
141
+ } else {
142
+ tagMaxCount = 0;
143
+ }
144
+
145
+ setTagMaxCount(tagMaxCount);
146
+ }, [tagsWidth, suffixWidth, getTagWidth, containerWidth, mergedTagList, suffix]);
147
+ var onClearLatest = useLatestCallback(onClear);
148
+ var handleClear = useCallback(function (evt) {
149
+ if (disabled) return;
150
+ evt.stopPropagation();
151
+ tryChangeValue(NOOP_ARRAY);
152
+ onClearLatest();
153
+ }, [tryChangeValue, disabled, onClearLatest]);
154
+
155
+ var _useState5 = useState(false),
156
+ hover = _useState5[0],
157
+ setHover = _useState5[1];
158
+
159
+ var trySetHover = useCallback(function (hovered) {
160
+ if (disabled) return;
161
+ setHover(hovered);
162
+ }, [disabled]);
163
+ var handleExpand = useCallback(function (evt) {
164
+ evt.stopPropagation();
165
+ onExpand === null || onExpand === void 0 ? void 0 : onExpand();
166
+ }, [onExpand]); // 在开启 clearable 下展示 清除内容按钮,可点击进行内容清楚
167
+
168
+ var showClearableIcon = clearable && showTags && !disabled;
169
+ var cls = cx(prefixCls, className, prefixCls + "--appearance-" + appearance, prefixCls + "--size-" + size, focused && "focused", readOnly && 'readonly', invalid && 'invalid', disabled && prefixCls + "--disabled", wrap && prefixCls + "--wrap");
170
+ return /*#__PURE__*/React.createElement(ResizeDetector, {
171
+ skipOnMount: false,
172
+ onResize: function onResize(w) {
173
+ if (w) {
174
+ setContainerWidth(w);
175
+ }
176
+ }
177
+ }, /*#__PURE__*/React.createElement("div", Object.assign({
178
+ ref: ref,
179
+ role: role,
180
+ className: cls,
181
+ onMouseOver: function onMouseOver(evt) {
182
+ trySetHover(true);
183
+ _onMouseOver === null || _onMouseOver === void 0 ? void 0 : _onMouseOver(evt);
184
+ },
185
+ onMouseLeave: function onMouseLeave(evt) {
186
+ trySetHover(false);
187
+ _onMouseLeave === null || _onMouseLeave === void 0 ? void 0 : _onMouseLeave(evt);
188
+ }
189
+ }, rest), showTags ? /*#__PURE__*/React.createElement("span", {
190
+ className: prefixCls + "__tags"
191
+ }, mergedTagList.map(function (option, index) {
192
+ return /*#__PURE__*/React.createElement(MockTag, {
193
+ hidden: wrap ? false : index > tagMaxCount,
194
+ key: option.id,
195
+ prefixCls: prefixCls,
196
+ disabled: disabled,
197
+ option: option,
198
+ value: value,
199
+ displayRender: displayRender,
200
+ tryChangeValue: tryChangeValue,
201
+ onTagResize: function onTagResize(id, w) {
202
+ return setTagsWidth(function (prev) {
203
+ var _Object$assign;
204
+
205
+ return Object.assign(Object.assign({}, prev), (_Object$assign = {}, _Object$assign[id] = w, _Object$assign));
206
+ });
207
+ }
208
+ });
209
+ })) : /*#__PURE__*/React.createElement("span", {
210
+ className: prefixCls + "__placeholder"
211
+ }, placeholder), /*#__PURE__*/React.createElement(ResizeDetector, {
212
+ skipOnMount: false,
213
+ onResize: function onResize(w) {
214
+ if (w) {
215
+ setSuffixWidth(w);
216
+ }
217
+ }
218
+ }, !!suffix || showClearableIcon && hover || showTagCount ? /*#__PURE__*/React.createElement("span", {
219
+ className: prefixCls + "__suffix"
220
+ }, showTagCount ? /*#__PURE__*/React.createElement("span", {
221
+ className: cx(prefixCls + "__tag--total"),
222
+ onClick: handleExpand
223
+ }, "" + (tagCount > 99 ? '99+' : tagCount)) : null, showClearableIcon && hover ? /*#__PURE__*/React.createElement("span", {
224
+ className: prefixCls + "__clear",
225
+ role: "button",
226
+ tabIndex: -1,
227
+ onClick: handleClear
228
+ }, /*#__PURE__*/React.createElement(CloseCircleFilled, null)) : suffix) : null)));
229
+ });
230
+
231
+ if (__DEV__) {
232
+ TagInputMock.displayName = 'TagInputMock';
233
+ }
234
+
235
+ var hiddenStyle = {
236
+ position: 'absolute',
237
+ opacity: 0,
238
+ width: 0,
239
+ height: 0,
240
+ overflow: 'hidden',
241
+ display: 'none'
242
+ };
243
+
244
+ function MockTag(_ref) {
245
+ var prefixCls = _ref.prefixCls,
246
+ option = _ref.option,
247
+ disabled = _ref.disabled,
248
+ value = _ref.value,
249
+ onTagResize = _ref.onTagResize,
250
+ tryChangeValue = _ref.tryChangeValue,
251
+ displayRender = _ref.displayRender,
252
+ _ref$hidden = _ref.hidden,
253
+ hidden = _ref$hidden === void 0 ? false : _ref$hidden;
254
+ var title = isFunction(displayRender) ? displayRender(option) : true;
255
+ var closeable = !option.disabled;
256
+ return /*#__PURE__*/React.createElement(ResizeDetector, {
257
+ skipOnMount: false,
258
+ onResize: function onResize(width) {
259
+ // 隐藏后就不允许设置 tagSize,避免无限循环触发“宽度计算响应式策略”
260
+ if (hidden) return;
261
+
262
+ if (width !== undefined) {
263
+ onTagResize(option.id, width);
264
+ }
265
+ }
266
+ }, /*#__PURE__*/React.createElement("div", {
267
+ style: {
268
+ display: 'inline-block'
269
+ }
270
+ }, /*#__PURE__*/React.createElement("span", {
271
+ className: prefixCls + "__tag",
272
+ style: hidden ? hiddenStyle : undefined,
273
+ key: option.id
274
+ }, /*#__PURE__*/React.createElement("span", {
275
+ className: prefixCls + "__tag-content"
276
+ }, title === true ? option.title : title), closeable ? /*#__PURE__*/React.createElement("span", {
277
+ className: prefixCls + "__tag-closed",
278
+ onClick: function onClick(evt) {
279
+ if (disabled) return;
280
+ evt.stopPropagation();
281
+ var nextValue = value.filter(function (id) {
282
+ return id !== option.id;
283
+ });
284
+ tryChangeValue(nextValue);
285
+ }
286
+ }, /*#__PURE__*/React.createElement(CloseOutlined, null)) : null)));
287
+ }
288
+
289
+ export { TagInputMock };
290
+ //# sourceMappingURL=TagInputMock.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TagInputMock.js","sources":["../../src/TagInputMock.tsx"],"sourcesContent":[null],"names":["_role","_prefix","getPrefixCls","NOOP_ARRAY","TagInputMock","forwardRef","_a","ref","prefixCls","role","className","defaultValue","valueProp","value","onChange","placeholder","data","disabled","clearable","focused","invalid","readOnly","size","appearance","wrap","suffix","tagWidth","displayRender","onMouseOver","onMouseLeave","onClear","onExpand","rest","useUncontrolledState","tryChangeValue","tagList","useMemo","map","id","find","item","title","tagCount","length","useState","containerWidth","setContainerWidth","mergedTagList","slice","Math","min","showTags","showTagCount","tagsWidth","setTagsWidth","getTagWidth","useCallback","index","suffixWidth","setSuffixWidth","tagMaxCount","setTagMaxCount","useLayoutEffect","isArrayNonEmpty","len","lastIndex","totalWidth","i","currentTagWidth","undefined","onClearLatest","useLatestCallback","handleClear","evt","stopPropagation","hover","setHover","trySetHover","hovered","handleExpand","showClearableIcon","cls","cx","React","ResizeDetector","skipOnMount","onResize","w","option","MockTag","hidden","key","onTagResize","prev","onClick","tabIndex","CloseCircleFilled","__DEV__","displayName","hiddenStyle","position","opacity","width","height","overflow","display","isFunction","closeable","style","nextValue","filter","CloseOutlined"],"mappings":"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"}
package/lib/esm/index.js CHANGED
@@ -9,4 +9,5 @@
9
9
  */
10
10
  import './styles/index.scss.js';
11
11
  export { TagInput, TagInput as default } from './TagInput.js';
12
+ export { TagInputMock } from './TagInputMock.js';
12
13
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
@@ -7,7 +7,7 @@
7
7
  * This source code is licensed under the MIT license found in the
8
8
  * LICENSE file in the root directory of this source tree.
9
9
  */
10
- var css_248z = ".hi-v4-tag-input {\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1; }\n .hi-v4-tag-input__container {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: var(--color-black);\n border: 1px solid transparent;\n background-color: var(--color-white);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 4px 10px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n min-height: 32px;\n overflow: hidden;\n border-color: var(--color-gray-30);\n border-radius: 4px; }\n .hi-v4-tag-input__container:not(.disabled):hover {\n border-color: var(--color-primary); }\n .hi-v4-tag-input__container:not(.disabled).focused {\n border-color: var(--color-primary); }\n .hi-v4-tag-input__container.disabled {\n cursor: not-allowed;\n color: var(--color-gray-50);\n background-color: var(--color-gray-10); }\n .hi-v4-tag-input__placeholder {\n color: var(--color-gray-50); }\n .hi-v4-tag-input__suffix {\n font-size: 16px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n .hi-v4-tag-input__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 14px;\n color: var(--color-gray-50);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition: all 0.3s;\n transition: all 0.3s; }\n .hi-v4-tag-input__clear:hover {\n color: var(--color-black); }\n .hi-v4-tag-input__value {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 22px;\n line-height: 22px; }\n .hi-v4-tag-input__tags {\n -webkit-box-flex: 0;\n -ms-flex: 0 1 auto;\n flex: 0 1 auto;\n display: inline-block;\n width: -webkit-fit-content;\n width: -moz-fit-content;\n width: fit-content;\n white-space: nowrap;\n height: 100%;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin-top: -4px; }\n .hi-v4-tag-input__tag, .hi-v4-tag-input__tag--left {\n display: inline-block;\n margin-right: 4px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n color: #333;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background: #f2f2f2;\n border-radius: 4px; }\n .hi-v4-tag-input__tag--total {\n display: inline-block;\n margin-right: 6px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: var(--color-primary-20);\n color: var(--color-primary);\n border-radius: 4px;\n line-height: 22px;\n cursor: pointer; }\n .hi-v4-tag-input__tag {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n .hi-v4-tag-input__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n .hi-v4-tag-input__tag-closed {\n margin-left: 8px;\n font-size: 12px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #8e8e8e;\n cursor: pointer; }\n .disabled .hi-v4-tag-input__tag-closed {\n cursor: not-allowed; }\n .hi-v4-tag-input__tag--left {\n margin: 0;\n max-width: 54px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle; }\n .hi-v4-tag-input--nowrap .hi-v4-tag-input__value {\n width: calc(100% - 64px);\n overflow-x: hidden; }\n .hi-v4-tag-input--wrap .hi-v4-tag-input__value {\n height: auto; }\n .hi-v4-tag-input--wrap .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n .hi-v4-tag-input--wrap .hi-v4-tag-input__tag {\n margin-top: 4px; }\n .hi-v4-tag-input--expanded {\n position: relative; }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand {\n position: absolute;\n top: 0;\n left: 0;\n height: auto;\n z-index: 1;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: var(--color-black);\n border: 1px solid transparent;\n background-color: var(--color-white);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 3px 0;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n min-height: 32px;\n overflow: hidden;\n border-radius: 4px;\n border-color: var(--color-primary); }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__value {\n height: -webkit-fit-content;\n height: -moz-fit-content;\n height: fit-content;\n max-height: 74px;\n -webkit-box-align: stretch;\n -ms-flex-align: stretch;\n align-items: stretch;\n overflow: scroll;\n padding-left: 10px; }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tag {\n margin-top: 4px; }\n .hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__suffix {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n padding: 4px 10px 4px 0;\n position: sticky;\n top: 0; }\n";
10
+ var css_248z = "@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input {\n position: relative;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1; }\n.hi-v4-tag-input__container {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 4px 10px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n min-height: 32px;\n overflow: hidden;\n border-color: #dfe2e8;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8);\n border-radius: 4px; }\n.hi-v4-tag-input__container:not(.disabled):hover {\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input__container:not(.disabled).focused {\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input__container.disabled {\n cursor: not-allowed;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input__container.disabled .hi-v4-tag-input__tag {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input__placeholder {\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6); }\n.hi-v4-tag-input__suffix {\n font-size: 16px;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n min-width: 32px; }\n.hi-v4-tag-input__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 14px;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition: all 0.3s;\n transition: all 0.3s; }\n.hi-v4-tag-input__clear:hover {\n color: #000;\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input__value {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n height: 22px;\n line-height: 22px; }\n.hi-v4-tag-input__tags {\n -webkit-box-flex: 0;\n -ms-flex: 0 1 auto;\n flex: 0 1 auto;\n display: inline-block;\n width: -webkit-fit-content;\n width: -moz-fit-content;\n width: fit-content;\n white-space: nowrap;\n height: 100%;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin-top: -4px;\n position: relative; }\n.hi-v4-tag-input__tag, .hi-v4-tag-input__tag--left {\n display: inline-block;\n margin-right: 4px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n color: #333;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px; }\n.hi-v4-tag-input__tag--total {\n display: inline-block;\n margin-right: 6px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n vertical-align: middle;\n font-size: 12px;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #bde2ff;\n background-color: var(--hi-v4-color-brandblue-100, #bde2ff);\n color: #237ffa;\n color: var(--hi-v4-color-brandblue-500, #237ffa);\n border-radius: 4px;\n line-height: 22px;\n cursor: pointer; }\n.hi-v4-tag-input__tag {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center; }\n.hi-v4-tag-input__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input__tag-closed {\n margin-left: 8px;\n margin-left: var(--hi-v4-spacing-4, 8px);\n font-size: 12px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #8e8e8e;\n cursor: pointer; }\n.disabled .hi-v4-tag-input__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input__tag--left {\n margin: 0;\n max-width: 54px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n vertical-align: middle; }\n.hi-v4-tag-input--nowrap .hi-v4-tag-input__value {\n width: calc(100% - 64px);\n overflow-x: hidden; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__value {\n height: auto; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--wrap .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded {\n position: relative; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand {\n position: absolute;\n top: 0;\n left: 0;\n height: auto;\n z-index: 1;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n width: 100%;\n min-width: 160px;\n font-size: 14px;\n vertical-align: middle;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n border: 1px solid transparent;\n background-color: use-color-statc(\"white\");\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n padding: 3px 0;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n min-height: 32px;\n overflow: hidden;\n border-radius: 4px;\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__value {\n height: -webkit-fit-content;\n height: -moz-fit-content;\n height: fit-content;\n max-height: 74px;\n -webkit-box-align: stretch;\n -ms-flex-align: stretch;\n align-items: stretch;\n overflow: scroll;\n padding-left: 10px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tags {\n white-space: normal;\n margin-top: -4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__tag {\n margin-top: 4px; }\n.hi-v4-tag-input--expanded .hi-v4-tag-input__container__expand .hi-v4-tag-input__suffix {\n -webkit-box-align: start;\n -ms-flex-align: start;\n align-items: flex-start;\n padding: 4px 10px 4px 0;\n position: sticky;\n top: 0; }\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n@use 'sass:map';\n.hi-v4-tag-input-mock {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n border: none;\n outline: none;\n -webkit-box-shadow: none;\n box-shadow: none;\n -webkit-appearance: none;\n -moz-appearance: none;\n appearance: none;\n cursor: text;\n background-color: transparent;\n -webkit-tap-highlight-color: transparent;\n position: relative;\n overflow: hidden;\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-pack: justify;\n -ms-flex-pack: justify;\n justify-content: space-between;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 1;\n -ms-flex: 1 1;\n flex: 1 1;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: 200ms;\n transition-duration: 200ms;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n width: 100%;\n height: auto;\n z-index: auto;\n font-size: inherit;\n line-height: inherit;\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733);\n border: 1px solid transparent;\n border: var(--hi-v4-border-size-normal, 1px solid) var(--hi-v4-color-static-transparent, transparent);\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled):hover {\n z-index: calc(1 + 1);\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock:not(.hi-v4-tag-input-mock--disabled).focused {\n z-index: calc(1 + 1);\n z-index: calc(var(--hi-v4-zindex-absolute, 1) + 1); }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__value {\n height: auto; }\n.hi-v4-tag-input-mock--wrap .hi-v4-tag-input-mock__tags {\n white-space: normal; }\n.hi-v4-tag-input-mock__suffix {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-pack: end;\n -ms-flex-pack: end;\n justify-content: flex-end;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n color: #000;\n color: var(--hi-v4-color-static-black, #000);\n font-size: 1rem;\n font-size: var(--hi-v4-text-size-lg, 1rem);\n padding-left: 8px;\n padding-left: var(--hi-v4-spacing-4, 8px);\n text-align: center; }\n.hi-v4-tag-input-mock__clear {\n display: -webkit-inline-box;\n display: -ms-inline-flexbox;\n display: inline-flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n width: 16px;\n height: 16px;\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n text-align: center;\n -ms-flex-negative: 0;\n flex-shrink: 0;\n cursor: pointer;\n -webkit-transition-property: all;\n transition-property: all;\n -webkit-transition-duration: 200ms;\n transition-duration: 200ms;\n -webkit-transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n transition-duration: var(--hi-v4-motion-duration-normal, 200ms);\n -webkit-transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n transition-timing-function: cubic-bezier(0.37, 0.02, 0.34, 1);\n -webkit-transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1));\n transition-timing-function: var(--hi-v4-motion-bezier-normal, cubic-bezier(0.37, 0.02, 0.34, 1)); }\n.hi-v4-tag-input-mock__clear:hover {\n color: #000;\n color: var(--hi-v4-color-static-black, #000); }\n.hi-v4-tag-input-mock__tags {\n position: relative;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n white-space: nowrap;\n overflow: hidden; }\n.hi-v4-tag-input-mock__tag--total {\n display: inline-block;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n vertical-align: middle;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n cursor: pointer;\n margin-right: 6px;\n margin-right: var(--hi-v4-spacing-3, 6px);\n padding: 0 8px;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n background-color: #e2f3fe;\n background-color: var(--hi-v4-color-brandblue-50, #e2f3fe);\n color: #237ffa;\n color: var(--hi-v4-color-brandblue-500, #237ffa);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n line-height: 1.25rem;\n line-height: var(--hi-v4-text-lineheight-sm, 1.25rem); }\n.hi-v4-tag-input-mock__suffix, .hi-v4-tag-input-mock__placeholder {\n color: #c9ced6;\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock__tag, .hi-v4-tag-input-mock__placeholder {\n margin-top: 2px;\n margin-top: var(--hi-v4-spacing-1, 2px);\n margin-bottom: 2px;\n margin-bottom: var(--hi-v4-spacing-1, 2px); }\n.hi-v4-tag-input-mock__tag {\n max-width: 100%;\n margin-right: 4px;\n margin-right: var(--hi-v4-spacing-2, 4px);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n padding: 0 8px;\n padding: 0 var(--hi-v4-spacing-4, 8px);\n vertical-align: middle;\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n color: #1f2733;\n color: var(--hi-v4-color-gray-700, #1f2733);\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7);\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n position: relative;\n display: -webkit-box;\n display: -ms-flexbox;\n display: flex;\n -webkit-box-align: center;\n -ms-flex-align: center;\n align-items: center;\n -webkit-box-flex: 0;\n -ms-flex: none;\n flex: none;\n line-height: inherit; }\n.hi-v4-tag-input-mock__tag-content {\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n -webkit-box-sizing: border-box;\n box-sizing: border-box; }\n.hi-v4-tag-input-mock__tag-closed {\n margin-left: 4px;\n margin-left: var(--hi-v4-spacing-2, 4px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #929aa6;\n color: var(--hi-v4-color-gray-500, #929aa6);\n cursor: pointer; }\n.hi-v4-tag-input-mock--disabled .hi-v4-tag-input-mock__tag-closed {\n cursor: not-allowed; }\n.hi-v4-tag-input-mock--size-sm {\n height: 24px;\n height: var(--hi-v4-height-xs, 24px);\n font-size: 0.75rem;\n font-size: var(--hi-v4-text-size-sm, 0.75rem);\n line-height: 1.25rem;\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 0 calc(12px - 1px);\n padding: 0 calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__tag,\n .hi-v4-tag-input-mock--size-sm .hi-v4-tag-input-mock__placeholder {\n margin-top: 1px;\n margin-bottom: 1px; }\n.hi-v4-tag-input-mock--size-md {\n height: 32px;\n height: var(--hi-v4-height-normal, 32px);\n font-size: 0.875rem;\n font-size: var(--hi-v4-text-size-normal, 0.875rem);\n line-height: 1.375rem;\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 2px calc(12px - 1px);\n padding: 2px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--size-lg {\n height: 40px;\n height: var(--hi-v4-height-xl, 40px);\n font-size: 1rem;\n font-size: var(--hi-v4-text-size-lg, 1rem);\n line-height: 1.5rem;\n border-radius: 4px;\n border-radius: var(--hi-v4-border-radius-normal, 4px);\n padding: 5px calc(12px - 1px);\n padding: 5px calc(var(--hi-v4-spacing-6, 12px) - 1px); }\n.hi-v4-tag-input-mock--appearance-outline {\n border-color: #dfe2e8;\n border-color: var(--hi-v4-color-gray-300, #dfe2e8); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled):hover {\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-outline:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9);\n box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9); }\n.hi-v4-tag-input-mock--appearance-unset {\n width: auto;\n -webkit-box-pack: start;\n -ms-flex-pack: start;\n justify-content: flex-start;\n border-color: transparent; }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-unset:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9);\n box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9); }\n.hi-v4-tag-input-mock--appearance-filled {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff);\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled):hover .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused {\n -webkit-box-shadow: 0 0 0 2px #bde2ff;\n box-shadow: 0 0 0 2px #bde2ff;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n box-shadow: 0 0 0 2px var(--hi-v4-color-brandblue-100, #bde2ff);\n border-color: #237ffa;\n border-color: var(--hi-v4-color-brandblue-500, #237ffa);\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).focused .hi-v4-tag-input-mock__tag {\n background-color: #f2f4f7;\n background-color: var(--hi-v4-color-gray-100, #f2f4f7); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.hover {\n border-color: #ff5959;\n border-color: var(--hi-v4-color-red-500, #ff5959); }\n.hi-v4-tag-input-mock--appearance-filled:not(.hi-v4-tag-input-mock--disabled).invalid.focused {\n -webkit-box-shadow: 0 0 0 2px #ffd1c9;\n box-shadow: 0 0 0 2px #ffd1c9;\n -webkit-box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9);\n box-shadow: 0 0 0 2px var(--hi-v4-color-red-100, #ffd1c9); }\n.hi-v4-tag-input-mock--appearance-filled .hi-v4-tag-input-mock__tag {\n background-color: #fff;\n background-color: var(--hi-v4-color-static-white, #fff); }\n.hi-v4-tag-input-mock--appearance-outline.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-unset.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n color: #c9ced6;\n color: var(--hi-v4-color-gray-400, #c9ced6); }\n.hi-v4-tag-input-mock--appearance-outline.hi-v4-tag-input-mock--disabled, .hi-v4-tag-input-mock--appearance-filled.hi-v4-tag-input-mock--disabled {\n background-color: #ebedf0;\n background-color: var(--hi-v4-color-gray-200, #ebedf0); }\n";
11
11
 
12
12
  var __styleInject__ = require('style-inject/dist/style-inject.es.js')["default"];
13
13
 
@@ -4,8 +4,8 @@ import { HiBaseHTMLProps } from '@hi-ui/core';
4
4
  /**
5
5
  * TODO: What is TagInput
6
6
  */
7
- export declare const TagInput: React.ForwardRefExoticComponent<Pick<TagInputProps, string | number> & React.RefAttributes<HTMLDivElement | null>>;
8
- export interface TagInputProps extends HiBaseHTMLProps {
7
+ export declare const TagInput: React.ForwardRefExoticComponent<TagInputProps & React.RefAttributes<HTMLDivElement | null>>;
8
+ export interface TagInputProps extends Omit<HiBaseHTMLProps<'div'>, 'defaultValue' | 'onChange' | 'value'> {
9
9
  /**
10
10
  * 设置当前多选值
11
11
  */
@@ -46,4 +46,8 @@ export interface TagInputProps extends HiBaseHTMLProps {
46
46
  * tag 列表数据源
47
47
  */
48
48
  data?: TagInputOption[];
49
+ /**
50
+ * 点击清空 tags 回调
51
+ */
52
+ onClear?: () => void;
49
53
  }
@@ -0,0 +1,74 @@
1
+ import React from 'react';
2
+ import { TagInputOption } from './types';
3
+ import { HiBaseHTMLFieldProps } from '@hi-ui/core';
4
+ /**
5
+ * TODO: What is TagInputMock
6
+ */
7
+ export declare const TagInputMock: React.ForwardRefExoticComponent<TagInputMockProps & React.RefAttributes<HTMLDivElement | null>>;
8
+ export interface TagInputMockProps extends Omit<HiBaseHTMLFieldProps<'div'>, 'defaultValue' | 'onChange' | 'value'> {
9
+ /**
10
+ * 设置当前多选值
11
+ */
12
+ value?: React.ReactText[];
13
+ /**
14
+ * 设置当前多选值默认值
15
+ */
16
+ defaultValue?: React.ReactText[];
17
+ /**
18
+ * 多选值改变时的回调
19
+ */
20
+ onChange?: (values: React.ReactText[]) => void;
21
+ /**
22
+ * 是否可清空 boolean true | false true
23
+ */
24
+ clearable?: boolean;
25
+ /**
26
+ * 是否禁止使用 boolean true | false false
27
+ */
28
+ disabled?: boolean;
29
+ /**
30
+ * 自定义选择后触发器所展示的内容
31
+ */
32
+ displayRender?: (checkedOption: TagInputOption) => React.ReactNode;
33
+ /**
34
+ * 输入框占位符
35
+ */
36
+ placeholder?: string;
37
+ /**
38
+ * 输入框后置内容
39
+ */
40
+ suffix?: React.ReactNode;
41
+ /**
42
+ * tag 列表数据源
43
+ */
44
+ data?: TagInputOption[];
45
+ /**
46
+ * 点击清空 tags 回调
47
+ */
48
+ onClear?: () => void;
49
+ /**
50
+ * 设置 tag 的默认宽度
51
+ */
52
+ tagWidth?: number;
53
+ /**
54
+ * 是否聚焦
55
+ */
56
+ focused?: boolean;
57
+ /**
58
+ * 开启输入框只读
59
+ */
60
+ readOnly?: boolean;
61
+ /**
62
+ * 设置展现形式
63
+ */
64
+ appearance?: 'outline' | 'unset' | 'filled';
65
+ /**
66
+ * 设置输入框尺寸
67
+ */
68
+ size?: 'sm' | 'md' | 'lg';
69
+ /**
70
+ * 是否开启换行全展示
71
+ */
72
+ wrap?: boolean;
73
+ onExpand?: () => void;
74
+ }
@@ -1,3 +1,4 @@
1
1
  import './styles/index.scss';
2
2
  export * from './TagInput';
3
3
  export { TagInput as default } from './TagInput';
4
+ export * from './TagInputMock';
@@ -0,0 +1,3 @@
1
+ import React from 'react';
2
+ export declare const useTagInputMock: <T>(tags: T[], ref: React.MutableRefObject<HTMLDivElement | null>) => readonly [number | undefined];
3
+ export declare const useResizeWidth: <T extends Element>(ref: React.MutableRefObject<T | null>) => number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hi-ui/tag-input",
3
- "version": "4.0.0-alpha.1",
3
+ "version": "4.0.0-alpha.13",
4
4
  "description": "A sub-package for @hi-ui/hiui.",
5
5
  "keywords": [],
6
6
  "author": "HIUI <mi-hiui@xiaomi.com>",
@@ -43,23 +43,26 @@
43
43
  "url": "https://github.com/XiaoMi/hiui/issues"
44
44
  },
45
45
  "dependencies": {
46
- "@hi-ui/classname": "^4.0.0-alpha.0",
47
- "@hi-ui/core": "^4.0.0-alpha.2",
48
- "@hi-ui/core-css": "^4.0.0-alpha.0",
49
- "@hi-ui/env": "^4.0.0-alpha.0",
50
- "@hi-ui/icons": "^4.0.0-alpha.8",
51
- "@hi-ui/use-merge-refs": "^4.0.0-alpha.2",
52
- "@hi-ui/use-outside-click": "^4.0.0-alpha.4",
53
- "@hi-ui/use-uncontrolled-state": "^4.0.0-alpha.5"
46
+ "@hi-ui/classname": "^4.0.0-alpha.3",
47
+ "@hi-ui/core": "^4.0.0-alpha.12",
48
+ "@hi-ui/core-css": "^4.0.0-alpha.10",
49
+ "@hi-ui/env": "^4.0.0-alpha.5",
50
+ "@hi-ui/icons": "^4.0.0-alpha.18",
51
+ "@hi-ui/type-assertion": "^4.0.0-alpha.13",
52
+ "@hi-ui/use-latest": "^4.0.0-alpha.4",
53
+ "@hi-ui/use-merge-refs": "^4.0.0-alpha.4",
54
+ "@hi-ui/use-outside-click": "^4.0.0-alpha.7",
55
+ "@hi-ui/use-uncontrolled-state": "^4.0.0-alpha.12",
56
+ "react-resize-detector": "^6.7.6"
54
57
  },
55
58
  "peerDependencies": {
56
59
  "react": "^17.0.1",
57
60
  "react-dom": "^17.0.1"
58
61
  },
59
62
  "devDependencies": {
60
- "@hi-ui/hi-build": "^4.0.0-alpha.0",
63
+ "@hi-ui/hi-build": "^4.0.0-alpha.4",
61
64
  "react": "^17.0.1",
62
65
  "react-dom": "^17.0.1"
63
66
  },
64
- "gitHead": "0e89a6d183d2f2c5901a9c2bb7f88b30d5e2b193"
67
+ "gitHead": "4fe4855aa7b3180a4e30ffa0972ac39a04947b4b"
65
68
  }