@alicloud/console-components-search 0.1.1 → 0.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (64) hide show
  1. package/README.md +104 -138
  2. package/demos/demo1.demo.tsx +91 -94
  3. package/doc-dist/0.js +1917 -16
  4. package/doc-dist/1.js +16 -1917
  5. package/doc-dist/10.js +1 -1
  6. package/doc-dist/11.js +1 -1
  7. package/doc-dist/12.js +1 -1
  8. package/doc-dist/13.js +1 -1
  9. package/doc-dist/14.js +1 -1
  10. package/doc-dist/15.js +1 -1
  11. package/doc-dist/3.js +5 -5
  12. package/doc-dist/4.js +1 -1
  13. package/doc-dist/5.js +2 -2
  14. package/doc-dist/6.js +1 -1
  15. package/doc-dist/7.js +1 -1
  16. package/doc-dist/8.js +1 -1
  17. package/doc-dist/9.js +1 -1
  18. package/doc-dist/deps/main.css +1 -1
  19. package/doc-dist/deps/main.js +8 -8
  20. package/doc-dist/deps/main.os.css +1 -1
  21. package/doc-dist/index.js +3 -3
  22. package/doc-dist/log-deps-build.log +1 -1
  23. package/es/index.js +1 -1
  24. package/es/modeSingleSingle/InputPrefix.js +29 -0
  25. package/es/modeSingleSingle/index2.js +342 -0
  26. package/es/search.js +2 -3
  27. package/es/searchTagList/index.js +5 -10
  28. package/es/style.js +1 -1
  29. package/es/useCssVar.js +38 -0
  30. package/lib/index.d.ts +1 -1
  31. package/lib/index.js +1 -1
  32. package/lib/modeSingleSingle/InputPrefix.d.ts +2 -0
  33. package/lib/modeSingleSingle/InputPrefix.js +43 -0
  34. package/lib/modeSingleSingle/index2.d.ts +4 -0
  35. package/lib/modeSingleSingle/index2.js +372 -0
  36. package/lib/search.js +2 -4
  37. package/lib/searchTagList/index.d.ts +3 -1
  38. package/lib/searchTagList/index.js +5 -11
  39. package/lib/style.js +1 -1
  40. package/lib/types/IRcSearchOptions.type.d.ts +3 -2
  41. package/lib/types/IRcSearchProps.type.d.ts +24 -34
  42. package/lib/types/IRcSearchTagItemProps.type.d.ts +1 -1
  43. package/lib/types/IRcSearchTagListProps.type.d.ts +3 -3
  44. package/lib/useCssVar.d.ts +1 -0
  45. package/lib/useCssVar.js +52 -0
  46. package/package.json +3 -2
  47. package/demos/demo2.demo.tsx +0 -83
  48. package/demos/demo3.demo.tsx +0 -87
  49. package/demos/demo4.demo.tsx +0 -142
  50. package/dist/index.css +0 -1
  51. package/dist/index.js +0 -60
  52. package/doc-dist/16.js +0 -6
  53. package/doc-dist/17.js +0 -6
  54. package/doc-dist/18.js +0 -6
  55. package/doc-dist/19.js +0 -6
  56. package/doc-dist/20.js +0 -6
  57. package/docs/markdown-render.doc.md +0 -21
  58. package/docs/test.doc.md +0 -8
  59. package/es/modeSingleMulti/index.js +0 -825
  60. package/es/modeSingleSingle/index.js +0 -217
  61. package/lib/modeSingleMulti/index.d.ts +0 -2
  62. package/lib/modeSingleMulti/index.js +0 -850
  63. package/lib/modeSingleSingle/index.d.ts +0 -2
  64. package/lib/modeSingleSingle/index.js +0 -242
@@ -1,217 +0,0 @@
1
- import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
2
- import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
3
- import _regeneratorRuntime from "@babel/runtime/regenerator";
4
- import React, { useState } from "react";
5
- import classNames from 'classnames'; // import styled from "styled-components";
6
-
7
- import { Button, ConfigProvider, Icon, Select } from '@alicloud/console-components';
8
- import { SearchWarp } from "../style";
9
- import { getSelectOptionAdatp } from '../utils';
10
- var AutoComplete = Select.AutoComplete;
11
-
12
- var ModeSingleSingle = function ModeSingleSingle(props) {
13
- var options = props.options,
14
- onSuggest = props.onSuggest,
15
- onChange = props.onChange,
16
- onSearch = props.onSearch,
17
- _props$prefix = props.prefix,
18
- prefix = _props$prefix === void 0 ? "next-" : _props$prefix;
19
- var optionItem = options[0];
20
-
21
- if (!optionItem.templateProps) {
22
- optionItem.templateProps = {};
23
- }
24
-
25
- var _useState = useState([]),
26
- _useState2 = _slicedToArray(_useState, 2),
27
- inputDataSource = _useState2[0],
28
- setInputDataSource = _useState2[1];
29
-
30
- var _useState3 = useState(false),
31
- _useState4 = _slicedToArray(_useState3, 2),
32
- visible = _useState4[0],
33
- setVisible = _useState4[1];
34
-
35
- var _useState5 = useState({}),
36
- _useState6 = _slicedToArray(_useState5, 2),
37
- allFileds = _useState6[0],
38
- setAllFileds = _useState6[1];
39
-
40
- var _useState7 = useState(''),
41
- _useState8 = _slicedToArray(_useState7, 2),
42
- inputValue = _useState8[0],
43
- setInputValue = _useState8[1];
44
-
45
- var itemRender = function itemRender(item, searchKey) {
46
- var label = item.label;
47
-
48
- if (searchKey && searchKey.length) {
49
- var key = searchKey.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&');
50
- var reg = new RegExp("(".concat(key, ")"), 'ig');
51
- label = label.replace(reg, function (x) {
52
- return "<span class=\"".concat(prefix, "-select-highlight\" style=\"background-color: #EFF3F8;font-weight: 500;\">").concat(x, "</span>");
53
- });
54
- }
55
-
56
- return /*#__PURE__*/React.createElement("span", {
57
- dangerouslySetInnerHTML: {
58
- __html: label
59
- }
60
- });
61
- };
62
-
63
- function inputChange(_x, _x2, _x3) {
64
- return _inputChange.apply(this, arguments);
65
- }
66
-
67
- function _inputChange() {
68
- _inputChange = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(value, actionType, dataIndex) {
69
- var changeFileds, _changeFileds, list, newDataSource;
70
-
71
- return _regeneratorRuntime.wrap(function _callee$(_context) {
72
- while (1) {
73
- switch (_context.prev = _context.next) {
74
- case 0:
75
- if (!(actionType === 'itemClick' && onChange)) {
76
- _context.next = 8;
77
- break;
78
- }
79
-
80
- changeFileds = Object.create({});
81
- changeFileds[dataIndex] = value;
82
- onChange(changeFileds, changeFileds);
83
- setAllFileds(changeFileds);
84
- setVisible(false);
85
- _context.next = 18;
86
- break;
87
-
88
- case 8:
89
- setInputValue(value); // fuzzyDisable
90
-
91
- if (!optionItem.templateProps || !optionItem.templateProps.fuzzyDisable) {
92
- _changeFileds = Object.create({});
93
- _changeFileds[dataIndex] = value;
94
-
95
- if (onChange) {
96
- onChange(_changeFileds, _changeFileds);
97
- }
98
-
99
- setAllFileds(_changeFileds);
100
- } //
101
-
102
-
103
- if (value === '') {
104
- setInputDataSource([]);
105
- }
106
-
107
- if (!onSuggest) {
108
- _context.next = 18;
109
- break;
110
- }
111
-
112
- _context.next = 14;
113
- return onSuggest(value, dataIndex);
114
-
115
- case 14:
116
- list = _context.sent;
117
- // console.log('res suggest', res);
118
- newDataSource = [{
119
- label: optionItem.label,
120
- children: list
121
- }];
122
- setInputDataSource(newDataSource);
123
- setVisible(true);
124
-
125
- case 18:
126
- case "end":
127
- return _context.stop();
128
- }
129
- }
130
- }, _callee);
131
- }));
132
- return _inputChange.apply(this, arguments);
133
- }
134
-
135
- function selectChange(_x4, _x5) {
136
- return _selectChange.apply(this, arguments);
137
- }
138
-
139
- function _selectChange() {
140
- _selectChange = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(value, dataIndex) {
141
- var changeFileds;
142
- return _regeneratorRuntime.wrap(function _callee2$(_context2) {
143
- while (1) {
144
- switch (_context2.prev = _context2.next) {
145
- case 0:
146
- if (onChange) {
147
- changeFileds = Object.create({});
148
- changeFileds[dataIndex] = value;
149
- onChange(changeFileds, changeFileds);
150
- setAllFileds(changeFileds);
151
- }
152
-
153
- case 1:
154
- case "end":
155
- return _context2.stop();
156
- }
157
- }
158
- }, _callee2);
159
- }));
160
- return _selectChange.apply(this, arguments);
161
- }
162
-
163
- function onCommonSearch() {
164
- if (onSearch) {
165
- onSearch(allFileds);
166
- }
167
- }
168
-
169
- return /*#__PURE__*/React.createElement(SearchWarp, {
170
- prefix: prefix
171
- }, optionItem.template === 'input' && /*#__PURE__*/React.createElement("div", {
172
- className: classNames('left-wrap', "".concat(prefix, "input"))
173
- }, /*#__PURE__*/React.createElement(AutoComplete, {
174
- className: classNames('main-input', 'single'),
175
- placeholder: optionItem.templateProps.placeholder || "\u9ED8\u8BA4\u6309".concat(optionItem.label, "\u641C\u7D22"),
176
- hasClear: true,
177
- hasBorder: false,
178
- dataSource: inputDataSource,
179
- visible: visible,
180
- value: inputValue,
181
- onBlur: function onBlur() {
182
- setVisible(false);
183
- } // @ts-ignore
184
- ,
185
- itemRender: itemRender,
186
- onChange: function onChange(value, actionType) {
187
- inputChange(value, actionType, optionItem.dataIndex);
188
- }
189
- })), optionItem.template === 'select' && /*#__PURE__*/React.createElement("div", {
190
- className: classNames('left-wrap', "".concat(prefix, "input"))
191
- }, /*#__PURE__*/React.createElement("div", {
192
- className: classNames('condition')
193
- }, /*#__PURE__*/React.createElement("span", {
194
- className: classNames('condition-item')
195
- }, optionItem.label)), /*#__PURE__*/React.createElement(Select, {
196
- className: classNames('main-input', 'single'),
197
- placeholder: optionItem.templateProps.placeholder || "\u8BF7\u9009\u62E9".concat(optionItem.label),
198
- hasClear: true,
199
- hasBorder: false,
200
- dataSource: getSelectOptionAdatp(optionItem.label, optionItem.templateProps.dataSource),
201
- onChange: function onChange(value) {
202
- selectChange(value, optionItem.dataIndex);
203
- },
204
- popupStyle: {
205
- minWidth: 'auto'
206
- }
207
- })), /*#__PURE__*/React.createElement("div", {
208
- className: classNames('right-wrap')
209
- }, /*#__PURE__*/React.createElement(Button, {
210
- className: classNames('search-btn'),
211
- onClick: onCommonSearch
212
- }, /*#__PURE__*/React.createElement(Icon, {
213
- type: "search"
214
- }))));
215
- };
216
-
217
- export default ConfigProvider.config(ModeSingleSingle);
@@ -1,2 +0,0 @@
1
- declare const _default: any;
2
- export default _default;