@alicloud/console-components-search 0.1.0

package/es/modeSingleSingle/index.js

@@ -0,0 +1,213 @@
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import _regeneratorRuntime from "@babel/runtime/regenerator";
+import React, { useState } from "react";
+import classNames from 'classnames'; // import styled from "styled-components";
+
+import { Button, Icon, Select } from '@alicloud/console-components';
+import { SearchWarp } from "../style";
+import { getSelectOptionAdatp } from '../utils';
+var AutoComplete = Select.AutoComplete;
+
+var ModeSingleSingle = function ModeSingleSingle(props) {
+  var options = props.options,
+      onSuggest = props.onSuggest,
+      onChange = props.onChange,
+      onSearch = props.onSearch;
+  var optionItem = options[0];
+
+  if (!optionItem.templateProps) {
+    optionItem.templateProps = {};
+  }
+
+  var _useState = useState([]),
+      _useState2 = _slicedToArray(_useState, 2),
+      inputDataSource = _useState2[0],
+      setInputDataSource = _useState2[1];
+
+  var _useState3 = useState(false),
+      _useState4 = _slicedToArray(_useState3, 2),
+      visible = _useState4[0],
+      setVisible = _useState4[1];
+
+  var _useState5 = useState({}),
+      _useState6 = _slicedToArray(_useState5, 2),
+      allFileds = _useState6[0],
+      setAllFileds = _useState6[1];
+
+  var _useState7 = useState(''),
+      _useState8 = _slicedToArray(_useState7, 2),
+      inputValue = _useState8[0],
+      setInputValue = _useState8[1];
+
+  var itemRender = function itemRender(item, searchKey) {
+    var label = item.label;
+
+    if (searchKey && searchKey.length) {
+      var key = searchKey.replace(/[-/\\^$*+?.()|[\]{}]/g, '\\$&');
+      var reg = new RegExp("(".concat(key, ")"), 'ig');
+      label = label.replace(reg, function (x) {
+        return "<span class=\"next-select-highlight\" style=\"background-color: #EFF3F8;font-weight: 500;\">".concat(x, "</span>");
+      });
+    }
+
+    return /*#__PURE__*/React.createElement("span", {
+      dangerouslySetInnerHTML: {
+        __html: label
+      }
+    });
+  };
+
+  function inputChange(_x, _x2, _x3) {
+    return _inputChange.apply(this, arguments);
+  }
+
+  function _inputChange() {
+    _inputChange = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(value, actionType, dataIndex) {
+      var changeFileds, _changeFileds, list, newDataSource;
+
+      return _regeneratorRuntime.wrap(function _callee$(_context) {
+        while (1) {
+          switch (_context.prev = _context.next) {
+            case 0:
+              if (!(actionType === 'itemClick' && onChange)) {
+                _context.next = 8;
+                break;
+              }
+
+              changeFileds = Object.create({});
+              changeFileds[dataIndex] = value;
+              onChange(changeFileds, changeFileds);
+              setAllFileds(changeFileds);
+              setVisible(false);
+              _context.next = 18;
+              break;
+
+            case 8:
+              setInputValue(value); // fuzzyDisable
+
+              if (!optionItem.templateProps || !optionItem.templateProps.fuzzyDisable) {
+                _changeFileds = Object.create({});
+                _changeFileds[dataIndex] = value;
+
+                if (onChange) {
+                  onChange(_changeFileds, _changeFileds);
+                }
+
+                setAllFileds(_changeFileds);
+              } //
+
+
+              if (value === '') {
+                setInputDataSource([]);
+              }
+
+              if (!onSuggest) {
+                _context.next = 18;
+                break;
+              }
+
+              _context.next = 14;
+              return onSuggest(value, dataIndex);
+
+            case 14:
+              list = _context.sent;
+              // console.log('res suggest', res);
+              newDataSource = [{
+                label: optionItem.label,
+                children: list
+              }];
+              setInputDataSource(newDataSource);
+              setVisible(true);
+
+            case 18:
+            case "end":
+              return _context.stop();
+          }
+        }
+      }, _callee);
+    }));
+    return _inputChange.apply(this, arguments);
+  }
+
+  function selectChange(_x4, _x5) {
+    return _selectChange.apply(this, arguments);
+  }
+
+  function _selectChange() {
+    _selectChange = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2(value, dataIndex) {
+      var changeFileds;
+      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
+        while (1) {
+          switch (_context2.prev = _context2.next) {
+            case 0:
+              if (onChange) {
+                changeFileds = Object.create({});
+                changeFileds[dataIndex] = value;
+                onChange(changeFileds, changeFileds);
+                setAllFileds(changeFileds);
+              }
+
+            case 1:
+            case "end":
+              return _context2.stop();
+          }
+        }
+      }, _callee2);
+    }));
+    return _selectChange.apply(this, arguments);
+  }
+
+  function onCommonSearch() {
+    if (onSearch) {
+      onSearch(allFileds);
+    }
+  }
+
+  return /*#__PURE__*/React.createElement(SearchWarp, null, optionItem.template === 'input' && /*#__PURE__*/React.createElement("div", {
+    className: classNames('left-wrap', 'next-input')
+  }, /*#__PURE__*/React.createElement(AutoComplete, {
+    className: classNames('main-input', 'single'),
+    placeholder: optionItem.templateProps.placeholder || "\u9ED8\u8BA4\u6309".concat(optionItem.label, "\u641C\u7D22"),
+    hasClear: true,
+    hasBorder: false,
+    dataSource: inputDataSource,
+    visible: visible,
+    value: inputValue,
+    onBlur: function onBlur() {
+      setVisible(false);
+    } // @ts-ignore
+    ,
+    itemRender: itemRender,
+    onChange: function onChange(value, actionType) {
+      inputChange(value, actionType, optionItem.dataIndex);
+    }
+  })), optionItem.template === 'select' && /*#__PURE__*/React.createElement("div", {
+    className: classNames('left-wrap', 'next-input')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classNames('condition')
+  }, /*#__PURE__*/React.createElement("span", {
+    className: classNames('condition-item')
+  }, optionItem.label)), /*#__PURE__*/React.createElement(Select, {
+    className: classNames('main-input', 'single'),
+    placeholder: optionItem.templateProps.placeholder || "\u8BF7\u9009\u62E9".concat(optionItem.label),
+    hasClear: true,
+    hasBorder: false,
+    dataSource: getSelectOptionAdatp(optionItem.label, optionItem.templateProps.dataSource),
+    onChange: function onChange(value) {
+      selectChange(value, optionItem.dataIndex);
+    },
+    popupStyle: {
+      minWidth: 'auto'
+    }
+  })), /*#__PURE__*/React.createElement("div", {
+    className: classNames('right-wrap')
+  }, /*#__PURE__*/React.createElement(Button, {
+    className: classNames('search-btn'),
+    onClick: onCommonSearch
+  }, /*#__PURE__*/React.createElement(Icon, {
+    type: "search"
+  }))));
+};
+
+export default ModeSingleSingle;

package/es/provider/LoggerProvider.js

@@ -0,0 +1,37 @@
+import { useEffect } from 'react';
+import { getEnv, getLogger, isValidKey } from '../utils';
+;
+var TOPIC = 'com-usage';
+var SAMPLING = getEnv() === 'local' ? 1 : 0.5; // 用来记录是否已经发送过日志，防止日志量太多，比如在列表中使用组件
+
+var LOGGER_RECORD = {};
+
+var LoggerProvider = function LoggerProvider(props) {
+  var regionId = props.regionId,
+      resourceType = props.resourceType,
+      componentName = props.componentName;
+  useEffect(function () {
+    var recordKey = "".concat(componentName, "-").concat(resourceType);
+    var propsArr = new Array();
+    ["regionId", "resourceType"].forEach(function (t) {
+      if (t && isValidKey(t, props)) {
+        propsArr.push("".concat(t, "=").concat(props[t]));
+      }
+    });
+    var info = {
+      env: getEnv(),
+      properties: propsArr.join('&'),
+      component: componentName
+    };
+
+    if (!LOGGER_RECORD[recordKey]) {
+      getLogger().log(TOPIC, info, {
+        sampling: SAMPLING
+      });
+      LOGGER_RECORD[recordKey] = true;
+    }
+  }, [regionId, resourceType, componentName]);
+  return null;
+};
+
+export default LoggerProvider;

package/es/search.js

@@ -0,0 +1,23 @@
+import React from "react";
+import ModeSingleSingle from "./modeSingleSingle";
+import ModeSingleMulti from "./modeSingleMulti";
+import classNames from 'classnames';
+import styled from "styled-components";
+import { baseClassName } from './constants';
+import LoggerProvider from './provider/LoggerProvider';
+var SearchWrap = styled.div.withConfig({
+  componentId: "sc-1szhzw4-0"
+})(["height:32px;width:400px;display:inline-block;vertical-align:top;"]);
+export var Search = function Search(props) {
+  var className = props.className,
+      mode = props.mode,
+      style = props.style;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(LoggerProvider, {
+    regionId: props.regionId,
+    resourceType: props.resourceType || '',
+    componentName: "RcSearch"
+  }), /*#__PURE__*/React.createElement(SearchWrap, {
+    className: classNames(baseClassName, className),
+    style: style
+  }, mode === 'single-single' && /*#__PURE__*/React.createElement(ModeSingleSingle, props), mode === 'single-multi' && /*#__PURE__*/React.createElement(ModeSingleMulti, props), mode === 'multi-multi' && /*#__PURE__*/React.createElement(ModeSingleMulti, props)));
+};

package/es/searchTagList/index.js

@@ -0,0 +1,58 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import React from "react";
+import classNames from 'classnames';
+import { Tag } from '@alicloud/console-components';
+import LoggerProvider from '../provider/LoggerProvider';
+import { TagListWrap } from '../style';
+import { baseTagListClassName } from '../constants';
+var TagGroup = Tag.Group,
+    ClosableTag = Tag.Closeable;
+
+var SearchTagList = function SearchTagList(props) {
+  var tagList = props.tagList,
+      className = props.className,
+      style = props.style,
+      onChange = props.onChange;
+
+  function onRemoveTag(item) {
+    var newTagList = _toConsumableArray(tagList);
+
+    if (onChange) {
+      var resFindIndex = newTagList.findIndex(function (x) {
+        return x.dataIndex === item.dataIndex;
+      });
+      newTagList.splice(resFindIndex, 1);
+      onChange(newTagList);
+    }
+  }
+
+  function onRemoveAllTag() {
+    if (onChange) {
+      onChange([]);
+    }
+  }
+
+  return /*#__PURE__*/React.createElement(TagListWrap, {
+    className: classNames(baseTagListClassName, className),
+    style: style
+  }, /*#__PURE__*/React.createElement(LoggerProvider, {
+    regionId: props.regionId,
+    resourceType: props.resourceType || '',
+    componentName: "RcSearch"
+  }), /*#__PURE__*/React.createElement(TagGroup, null, tagList && tagList.length > 0 && tagList.map(function (tagItem) {
+    return /*#__PURE__*/React.createElement(ClosableTag, {
+      key: tagItem.dataIndex + tagItem.value,
+      type: "normal",
+      size: "medium",
+      onClose: function onClose() {
+        onRemoveTag(tagItem);
+        return true;
+      }
+    }, tagItem.label, ":", tagItem.valueShow);
+  }), tagList && tagList.length > 0 && /*#__PURE__*/React.createElement("a", {
+    className: "remove-btn",
+    onClick: onRemoveAllTag
+  }, "\u6E05\u9664\u7B5B\u9009\u6761\u4EF6")));
+};
+
+export default SearchTagList;

package/es/style.js

@@ -0,0 +1,14 @@
+import styled from "styled-components";
+var SearchWarp = styled.div.withConfig({
+  componentId: "sc-1afc1cn-0"
+})(["height:100%;width:100%;display:flex;.left-wrap{flex:1;border-left:1px solid rgba(192,198,204,1);border-bottom:1px solid rgba(192,198,204,1);border-top:1px solid rgba(192,198,204,1);border-right:1px solid rgba(192,198,204,1);display:flex;border-bottom-left-radius:2px;border-top-left-radius:2px;&.focus{border:1px solid #0064c8;}.condition{height:26px;display:inline-block;margin-top:2px;}.condition-item{height:26px;display:inline-block;line-height:26px;background:#EFF3F8;border-radius:2px;background-color:#EFF3F8;padding:0 8px;margin:0 2px;font-size:12px;color:#333;position:relative;&-txt{padding-right:4px;}&:hover{background-color:#E0E4E8;}}.condition-select{width:100%;height:100%;opacity:0;position:absolute;top:0;left:0;min-width:auto;.next-select-inner{min-width:auto;}}.forms{flex:1;position:relative;.clear-level1{position:absolute;top:1px;right:1px;height:28px;width:30px;background-color:#fff;z-index:99;color:#333;text-align:center;line-height:28px;font-size:12px;cursor:pointer;padding:6px 0 0 6px;}}.main-input{height:auto;border:none;box-shadow:none;&.single{flex:1;}&.select{width:100%;}&.multi{width:100%;}.next-input,.xdemo-input{height:auto;box-shadow:none;}}.xdemo-input.xdemo-medium{height:auto;}}.right-wrap{width:32px;.search-btn{width:32px;border-bottom-left-radius:0;border-top-left-radius:0;border-left:none;}}"]);
+var MenuContentWrap = styled.ul.withConfig({
+  componentId: "sc-1afc1cn-1"
+})([".next-tag-small.next-tag-closable > .next-tag-close-btn{margin-left:8px;padding-right:4px;padding-top:1px;}.next-tag-small.next-tag-closable > .next-tag-body{max-width:calc(100% - 8px - 8px - var(--tag-size-m-padding-lr,8px));}.next-tag-small.next-tag-closable > .next-tag-close-btn .next-icon:before,.next-tag-small.next-tag-closable > .next-tag-close-btn .next-icon .next-icon-remote{font-size:13px;}&& [class*='-icon-close']:hover::before{color:#181818;}&& [class*='-icon-close']::before{color:#808080;content:var(--icon-content-delete-filling);}"]);
+var MultiBtnWarp = styled.div.withConfig({
+  componentId: "sc-1afc1cn-2"
+})(["padding:\"0 4px\";text-align:\"center\";.pri-btn{margin-right:8px;width:auto;min-width:auto;padding:3px 12px;}.cancel-btn{padding:3px 12px;width:auto;min-width:auto;}.next-btn.next-small:not(.isOnlyIcon):not(.next-btn-text){min-width:auto;}"]);
+var TagListWrap = styled.div.withConfig({
+  componentId: "sc-1afc1cn-3"
+})([".next-tag-medium.next-tag-closable > .next-tag-close-btn{margin-left:8px;padding-right:6px;}.next-tag-medium.next-tag-closable > .next-tag-body{max-width:calc(100% - 8px - 8px - var(--tag-size-m-padding-lr,8px));}.next-tag-medium.next-tag-closable > .next-tag-close-btn .next-icon:before,.next-tag-medium.next-tag-closable > .next-tag-close-btn .next-icon .next-icon-remote{font-size:16px;}&& [class*='-icon-close']:hover::before{color:#181818;}&& [class*='-icon-close']::before{color:#808080;content:var(--icon-content-delete-filling);}.remove-btn{margin-bottom:8px;line-height:24px;display:inline-block;vertical-align:middle;cursor:pointer;}"]);
+export { SearchWarp, MultiBtnWarp, TagListWrap, MenuContentWrap };

package/es/types/IRcSearchOptions.type.js

@@ -0,0 +1 @@
+export {};

package/es/types/IRcSearchProps.type.js

@@ -0,0 +1 @@
+export {};

package/es/types/IRcSearchTagItemProps.type.js

@@ -0,0 +1 @@
+export {};

package/es/types/IRcSearchTagListProps.type.js

@@ -0,0 +1 @@
+export {};

package/es/utils.js

@@ -0,0 +1,149 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import { uniqWith, isEqual } from 'lodash';
+import createLogger from '@alicloud/console-logger-sls';
+var historyTagKey = "xconsole-rcsearch-historytag-".concat(location.origin).concat(location.pathname); // 从localStorage中获取tagList
+
+var getHistoryTag = function getHistoryTag() {
+  var tagStr = localStorage.getItem(historyTagKey);
+
+  if (tagStr) {
+    return JSON.parse(tagStr);
+  } else {
+    return [];
+  }
+}; // 向localStorage中存入tagList
+
+
+var setHistoryTag = function setHistoryTag(newTagList) {
+  var tagsHistory = getHistoryTag();
+  var newHTags = tagsHistory.concat(newTagList);
+
+  if (newHTags.length > 5) {
+    newHTags.reverse();
+    newHTags = uniqWith(newHTags, isEqual);
+    newHTags.length = 5;
+    newHTags.reverse();
+  } else {
+    newHTags = uniqWith(newHTags, isEqual);
+  }
+
+  localStorage.setItem(historyTagKey, JSON.stringify(newHTags));
+  return newHTags;
+};
+
+var removeHistoryTagItem = function removeHistoryTagItem(tagItem) {
+  var tagsHistory = getHistoryTag();
+  var findTagIndex = -1;
+
+  if (tagsHistory && tagsHistory.length > 0) {
+    findTagIndex = tagsHistory.findIndex(function (x) {
+      if (tagItem.dataIndex === x.dataIndex && tagItem.valueShow === x.valueShow) {
+        return true;
+      } else {
+        return false;
+      }
+    });
+  }
+
+  if (findTagIndex >= 0) {
+    tagsHistory.splice(findTagIndex, 1);
+  }
+
+  localStorage.setItem(historyTagKey, JSON.stringify(tagsHistory));
+  return tagsHistory;
+}; // 将内部的表单对象， 转化成taglist array
+
+
+var getTagByFileds = function getTagByFileds(fileds, options) {
+  var rtTags = new Array();
+  Object.keys(fileds).forEach(function (key) {
+    var resItem = options.find(function (x) {
+      return x.dataIndex === key;
+    });
+
+    if (resItem && fileds[key]) {
+      var tagItem = {
+        label: resItem.label,
+        dataIndex: key,
+        value: fileds[key],
+        valueShow: ''
+      };
+
+      if (resItem.template === 'input') {
+        tagItem.valueShow = fileds[key];
+      } else if (resItem.template === 'select') {
+        tagItem.valueShow = resItem.templateProps.dataSource.find(function (y) {
+          return y.value === fileds[key];
+        }).label;
+      } else if (resItem.template === 'multiple') {
+        tagItem.valueShow = '';
+        var valueShowArr = new Array();
+        fileds[key].forEach(function (y) {
+          var findMul = resItem.templateProps.dataSource.find(function (z) {
+            return z.value === y;
+          });
+
+          if (findMul) {
+            valueShowArr.push(findMul.label);
+          }
+        });
+        tagItem.valueShow = valueShowArr.join('/');
+      }
+
+      rtTags.push(tagItem);
+    }
+  });
+  return rtTags;
+};
+
+var checkNoIndexListFormat = function checkNoIndexListFormat(list) {
+  var isOk = true;
+  list.forEach(function (groupItem) {
+    if (groupItem && groupItem.children && Array.isArray(groupItem.children) && groupItem.children.length > 0) {
+      groupItem.children.forEach(function (item) {
+        if (_typeof(item) !== 'object' || !item.dataIndex) {
+          console.warn('onSuggestNoDataIndex的返回list应参考实例，每个下拉选择项应有dataIndex字段');
+        }
+      });
+    }
+  });
+};
+
+var getSelectOptionAdatp = function getSelectOptionAdatp(title, list) {
+  return [{
+    label: title || '',
+    children: _toConsumableArray(list)
+  }];
+};
+
+var getEnv = function getEnv() {
+  var _window, _window$ALIYUN_CONSOL;
+
+  if (process.env.NODE_ENV === 'development') {
+    return 'local';
+  } // @ts-ignore
+
+
+  return ((_window = window) === null || _window === void 0 ? void 0 : (_window$ALIYUN_CONSOL = _window.ALIYUN_CONSOLE_CONFIG) === null || _window$ALIYUN_CONSOL === void 0 ? void 0 : _window$ALIYUN_CONSOL.fEnv) || 'prod';
+};
+
+var logger = null;
+
+var getLogger = function getLogger() {
+  if (!logger) {
+    logger = createLogger({
+      project: 'stonehenge-console',
+      endpoint: 'cn-hangzhou.log.aliyuncs.com',
+      logstore: "com-usage-origin"
+    });
+  }
+
+  return logger;
+};
+
+var isValidKey = function isValidKey(key, object) {
+  return key in object;
+};
+
+export { getHistoryTag, setHistoryTag, removeHistoryTagItem, getTagByFileds, checkNoIndexListFormat, getSelectOptionAdatp, getEnv, getLogger, isValidKey };

package/lib/constants.d.ts

@@ -0,0 +1,2 @@
+export declare const baseClassName = "rc-search";
+export declare const baseTagListClassName: string;

package/lib/constants.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.baseTagListClassName = exports.baseClassName = void 0;
+var baseClassName = 'rc-search';
+exports.baseClassName = baseClassName;
+var baseTagListClassName = "".concat(baseClassName, "-taglist"); // export const titleClassName = `${baseClassName}-title`
+// export const titleContainerClassName = `${titleClassName}-container`
+// export const titleExtraClassName = `${titleClassName}-extra`
+// export const titleChildrenClassName = `${titleClassName}-children`
+// export const contentClassName = `${baseClassName}-content`
+
+exports.baseTagListClassName = baseTagListClassName;

package/lib/index.d.ts

@@ -0,0 +1,7 @@
+import { Search } from "./search";
+import SearchTagList from "./searchTagList";
+import { IRcSearchProps } from "./types/IRcSearchProps.type";
+import { IRcSearchTagListProps } from "./types/IRcSearchTagListProps.type";
+import { IRcSearchTagItemProps } from './types/IRcSearchTagItemProps.type';
+import { IRcSearchOptionsProps } from './types/IRcSearchOptions.type';
+export { Search, SearchTagList, IRcSearchProps, IRcSearchTagListProps, IRcSearchOptionsProps, IRcSearchTagItemProps };

package/lib/index.js

@@ -0,0 +1,55 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "IRcSearchOptionsProps", {
+  enumerable: true,
+  get: function get() {
+    return _IRcSearchOptions.IRcSearchOptionsProps;
+  }
+});
+Object.defineProperty(exports, "IRcSearchProps", {
+  enumerable: true,
+  get: function get() {
+    return _IRcSearchProps.IRcSearchProps;
+  }
+});
+Object.defineProperty(exports, "IRcSearchTagItemProps", {
+  enumerable: true,
+  get: function get() {
+    return _IRcSearchTagItemProps.IRcSearchTagItemProps;
+  }
+});
+Object.defineProperty(exports, "IRcSearchTagListProps", {
+  enumerable: true,
+  get: function get() {
+    return _IRcSearchTagListProps.IRcSearchTagListProps;
+  }
+});
+Object.defineProperty(exports, "Search", {
+  enumerable: true,
+  get: function get() {
+    return _search.Search;
+  }
+});
+Object.defineProperty(exports, "SearchTagList", {
+  enumerable: true,
+  get: function get() {
+    return _searchTagList.default;
+  }
+});
+
+var _search = require("./search");
+
+var _searchTagList = _interopRequireDefault(require("./searchTagList"));
+
+var _IRcSearchProps = require("./types/IRcSearchProps.type");
+
+var _IRcSearchTagListProps = require("./types/IRcSearchTagListProps.type");
+
+var _IRcSearchTagItemProps = require("./types/IRcSearchTagItemProps.type");
+
+var _IRcSearchOptions = require("./types/IRcSearchOptions.type");

package/lib/modeSingleMulti/index.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { IRcSearchProps } from "../types/IRcSearchProps.type";
+declare const ModeSingleSingle: React.FC<IRcSearchProps>;
+export default ModeSingleSingle;