@blocklet/list 0.12.97 → 0.12.99

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@blocklet/list",
-  "version": "0.12.97",
+  "version": "0.12.99",
   "description": "Common ux components of blocklet",
   "publishConfig": {
     "access": "public"
   },
-  "author": "machao <machao@arcblock.io>",
+  "author": "blocklet <blocklet@arcblock.io>",
   "homepage": "https://github.com/blocklet/blocklet-store#readme",
   "license": "ISC",
   "main": "./lib/index.js",
@@ -29,12 +29,8 @@
   "scripts": {
     "lint": "eslint src stories --ext=js,jsx,ts,tsx,mjs",
     "lint:fix": "npm run lint -- --fix",
-    "build:cjs": "babel src --out-dir lib --copy-files",
-    "watch:cjs": "babel src --out-dir lib -w --copy-files",
-    "build:esm": "vite build --emptyOutDir",
-    "watch:esm": "vite build --watch",
-    "build": "npm run build:esm && npm run build:cjs",
-    "watch": "npm run watch:esm & npm run watch:cjs",
+    "build": "vite build --emptyOutDir",
+    "watch": "vite build --watch",
     "precommit": "CI=1 yarn test",
     "prepush": "CI=1 yarn test",
     "prepublish": "npm run build"
@@ -56,8 +52,8 @@
   "dependencies": {
     "@algolia/autocomplete-js": "^1.17.0",
     "@algolia/autocomplete-theme-classic": "^1.17.0",
-    "@arcblock/ux": "^2.9.81",
-    "@blocklet/util": "0.12.97",
+    "@arcblock/ux": "^2.9.85",
+    "@blocklet/util": "0.12.99",
     "@emotion/react": "^11.10.0",
     "@emotion/styled": "^11.10.0",
     "@mui/icons-material": "^5.15.12",
@@ -71,7 +67,7 @@
     "react-error-boundary": "^3.1.4",
     "react-hotkeys-hook": "^3.4.7",
     "react-infinite-scroll-hook": "^4.0.3",
-    "url-join": "^4.0.1"
+    "ufo": "^1.5.3"
   },
   "devDependencies": {
     "@arcblock/eslint-config": "0.3.0",
@@ -88,5 +84,5 @@
     "prettier": "^2.7.1",
     "vite": "^5.2.6"
   },
-  "gitHead": "4e1d85a409e1acc1d4e0f6cef5d6ba0d79983430"
+  "gitHead": "08bdcf8c6365fe816819794d6434abd4353e2b38"
 }

package/lib/assets/locale.js

@@ -1,92 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _flat = _interopRequireDefault(require("flat"));
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const en = {
-  common: {
-    searchStore: 'Search the store',
-    showResources: 'Show resources',
-    price: 'Price',
-    category: 'Category',
-    resourceType: 'Resource Type',
-    clear: 'Clear',
-    cancel: 'Cancel',
-    search: 'Search'
-  },
-  sort: {
-    sort: 'Sort',
-    nameDescend: 'Name Descending',
-    nameAscend: 'Name Ascending',
-    popularity: 'Most Popular',
-    lastPublished: 'Latest Published'
-  },
-  category: {
-    all: 'All',
-    placeholder: 'Category name',
-    helperText: 'Please select a category'
-  },
-  blocklet: {
-    noResults: 'No Blocklets',
-    payment: 'Paid Blocklets',
-    free: 'Free Blocklets',
-    emptyTip: 'Tips:',
-    filterTip: 'Appropriately reduce the filter conditions',
-    keywordTip: 'Try other keywords',
-    owner: 'Blocklets from {name}',
-    noBlockletPart1: 'No Blocklets associated with"',
-    noBlockletPart2: '"were found',
-    noCategoryResults1: 'No "',
-    noCategoryResults2: '" Blocklets'
-  },
-  autocomplete: {
-    expandResult: 'Show {number} search results for "{name}" '
-  }
-};
-const zh = {
-  common: {
-    searchStore: '搜索商店内应用',
-    showResources: '显示资源型应用',
-    price: '价格',
-    category: '类别',
-    resourceType: '资源类型',
-    clear: '清除',
-    cancel: '取消',
-    search: '搜索'
-  },
-  sort: {
-    sort: '排序',
-    nameDescend: '名称降序',
-    nameAscend: '名称升序',
-    popularity: '最热门',
-    lastPublished: '最新发布'
-  },
-  category: {
-    all: '全部',
-    placeholder: '分类名称',
-    helperText: '请选择分类'
-  },
-  blocklet: {
-    noResults: '暂无应用',
-    free: '免费应用',
-    payment: '付费应用',
-    emptyTip: '建议:',
-    filterTip: '适当减少筛选条件',
-    keywordTip: '尝试其他关键字',
-    owner: '来自 {name} 的 Blocklets',
-    noBlockletPart1: '没有找到与"',
-    noBlockletPart2: '"相关的 Blocklets',
-    noCategoryResults1: '无 "',
-    noCategoryResults2: '" 类别的 Blocklets'
-  },
-  autocomplete: {
-    expandResult: '显示 {number} 条 “{name}” 的搜索结果 '
-  }
-};
-var _default = exports.default = {
-  en: (0, _flat.default)(en),
-  zh: (0, _flat.default)(zh)
-};

package/lib/base.js

@@ -1,159 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _Theme = require("@arcblock/ux/lib/Theme");
-var _Sort = _interopRequireDefault(require("@mui/icons-material/Sort"));
-var _material = require("@mui/material");
-var _Face = _interopRequireDefault(require("@mui/icons-material/Face"));
-var _reactErrorBoundary = require("react-error-boundary");
-var _ErrorBoundary = require("@arcblock/ux/lib/ErrorBoundary");
-var _react = require("react");
-var _filter = require("./contexts/filter");
-var _customSelect = _interopRequireDefault(require("./components/custom-select"));
-var _filter2 = require("./components/filter");
-var _utils = require("./libs/utils");
-var _list = _interopRequireDefault(require("./components/list"));
-var _aside = _interopRequireDefault(require("./components/aside"));
-var _baseSearch = _interopRequireDefault(require("./components/base-search"));
-var _autocomplete = _interopRequireDefault(require("./components/autocomplete"));
-var _showResourcesSwitch = _interopRequireDefault(require("./components/show-resources-switch"));
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject, _templateObject2;
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-function ListBase() {
-  var _sortOptions$find, _priceOptions$find, _filters$keyword;
-  const {
-    handleDeveloper,
-    blockletList,
-    filters,
-    developerName,
-    handleSort,
-    handleCategory,
-    handlePrice,
-    handleSearchSelect,
-    t,
-    getCategoryLocale,
-    priceOptions,
-    wrapChildren,
-    showResourcesSwitch,
-    baseSearch
-  } = (0, _filter.useFilterContext)();
-  const sortOptions = (0, _utils.getSortOptions)(t);
-  const sortLocale = ((_sortOptions$find = sortOptions.find(f => f.value === filters.sortBy)) === null || _sortOptions$find === void 0 ? void 0 : _sortOptions$find.name) || t('sort.sort');
-  const categoryLocale = getCategoryLocale(filters.category);
-  const {
-    resourceType
-  } = filters || {};
-  const priceLocale = (_priceOptions$find = priceOptions.find(price => price.value === filters.price)) === null || _priceOptions$find === void 0 ? void 0 : _priceOptions$find.name;
-  const [searchFocused, setSearchFocused] = (0, _react.useState)(false);
-  const isMobile = (0, _material.useMediaQuery)(theme => theme.breakpoints.down('md'));
-  const showFullSearch = !baseSearch || searchFocused || isMobile || (filters === null || filters === void 0 || (_filters$keyword = filters.keyword) === null || _filters$keyword === void 0 ? void 0 : _filters$keyword.length);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-    display: "flex",
-    alignItems: "flex-start",
-    height: "100%",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Hidden, {
-      mdDown: true,
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_aside.default, {})
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledMin, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(FilterContainer, {
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-          className: "filter-bar",
-          display: "flex",
-          alignItems: "center",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("form", {
-            className: "search-form",
-            style: showFullSearch ? {
-              flex: 1,
-              width: '100%'
-            } : {},
-            onSubmit: e => {
-              e.preventDefault();
-              e.stopPropagation();
-            },
-            onFocus: () => {
-              setSearchFocused(true);
-            },
-            onBlur: () => {
-              setSearchFocused(false);
-            },
-            children: baseSearch ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_baseSearch.default, {
-              className: "bl-search-container",
-              placeholder: t('common.searchStore')
-            }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_autocomplete.default, {
-              onSelect: handleSearchSelect,
-              wrapChildren: wrapChildren
-            })
-          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-            mt: 0,
-            ml: "16px",
-            className: "filter-container",
-            display: "flex",
-            alignItems: "center",
-            children: [!isMobile && showResourcesSwitch && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Box, {
-              ml: 1,
-              mr: 1,
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_showResourcesSwitch.default, {
-                t: t
-              })
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.Hidden, {
-              mdUp: true,
-              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_filter2.FilterIcon, {})
-            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_customSelect.default, {
-              value: filters.sortBy,
-              options: sortOptions,
-              title: sortLocale,
-              icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Sort.default, {}),
-              onChange: v => {
-                handleSort(v);
-              }
-            })]
-          })]
-        }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_material.Box, {
-          display: "flex",
-          flexWrap: "wrap",
-          alignItems: "center",
-          mb: "16px",
-          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_filter2.CustomChip, {
-            label: developerName,
-            icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_Face.default, {}),
-            onDelete: () => {
-              handleDeveloper(null);
-            }
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_filter2.CustomChip, {
-            label: categoryLocale,
-            onDelete: () => {
-              handleCategory(null);
-            }
-          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_filter2.CustomChip, {
-            label: priceLocale,
-            onDelete: () => {
-              handlePrice(null);
-            }
-          }), resourceType && /*#__PURE__*/(0, _jsxRuntime.jsx)(_filter2.CustomChip, {
-            label: "".concat(t('common.resourceType'), ": ").concat(resourceType)
-          })]
-        })]
-      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactErrorBoundary.ErrorBoundary, {
-        FallbackComponent: _ErrorBoundary.ErrorFallback,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          style: {
-            position: 'relative',
-            flex: 1,
-            overflow: 'auto'
-          },
-          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_list.default, {
-            blocklets: blockletList
-          })
-        })
-      })]
-    })]
-  });
-}
-const StyledMin = (0, _Theme.styled)('main')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  width: 100%;\n  height: 100%;\n  .filter-bar {\n    justify-content: space-between;\n    margin-bottom: ", ";\n  }\n  .sort-button {\n    white-space: nowrap;\n  }\n  .bl-search-container {\n    margin-left: 0px;\n  }\n  .filter-container {\n    display: flex;\n    justify-content: flex-end;\n  }\n  @media (max-width: ", "px) {\n    .search-form {\n      flex: 1;\n    }\n    .bl-search-container {\n      width: 100%;\n      margin-bottom: ", ";\n    }\n    .filter-container {\n      margin-left: 0;\n      display: flex;\n      justify-content: flex-start;\n    }\n    .filter-bar {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n    }\n  }\n  @media (max-width: ", "px) {\n    .sort-button {\n      font-size: 12px;\n    }\n  }\n"])), props => props.theme.spacing(2), props => props.theme.breakpoints.values.md, props => props.theme.spacing(2), props => props.theme.breakpoints.values.md);
-const FilterContainer = (0, _Theme.styled)('div')(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: sticky;\n  top: 0;\n  z-index: 9;\n  background-color: white;\n"])));
-var _default = exports.default = ListBase;

package/lib/components/aside.js

@@ -1,47 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _Theme = require("@arcblock/ux/lib/Theme");
-var _filter = require("../contexts/filter");
-var _filter2 = require("./filter");
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject; // import styled from '@emotion/styled';
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-function Aside() {
-  const {
-    selectedCategory,
-    handleCategory,
-    t,
-    handlePrice,
-    filters,
-    categoryOptions,
-    priceOptions
-  } = (0, _filter.useFilterContext)();
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(StyledAside, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_filter2.FilterGroup, {
-        title: t('common.price'),
-        options: priceOptions,
-        value: filters.price,
-        onChange: handlePrice
-      })
-    }), categoryOptions.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      style: {
-        marginTop: '16px'
-      },
-      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_filter2.FilterGroup, {
-        title: t('common.category'),
-        options: categoryOptions,
-        value: selectedCategory,
-        onChange: handleCategory
-      })
-    })]
-  });
-}
-const StyledAside = (0, _Theme.styled)('aside')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 220px;\n  margin-right: ", ";\n  height: 100%;\n  position: sticky;\n  top: 0;\n  overflow-y: auto;\n  z-index: auto;\n"])), props => props.theme.spacing(2));
-Aside.propTypes = {};
-Aside.defaultProps = {};
-var _default = exports.default = Aside;

package/lib/components/autocomplete/index.js

@@ -1,245 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = Autocomplete;
-var _react = require("react");
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _client = require("react-dom/client");
-var _autocompleteJs = require("@algolia/autocomplete-js");
-var _reactHotkeysHook = require("react-hotkeys-hook");
-var _react2 = require("@emotion/react");
-var _urlJoin = _interopRequireDefault(require("url-join"));
-var _constant = _interopRequireDefault(require("../../libs/constant"));
-var _utils = require("../../libs/utils");
-var _filter = require("../../contexts/filter");
-var _jsxRuntime = require("react/jsx-runtime");
-var _templateObject;
-const _excluded = ["query", "state"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }
-function Autocomplete(_ref) {
-  let {
-    onSelect,
-    wrapChildren
-  } = _ref;
-  const containerRef = (0, _react.useRef)(null);
-  const panelRootRef = (0, _react.useRef)(null);
-  const rootRef = (0, _react.useRef)(null);
-  const {
-    storeApi,
-    blockletRender,
-    filters,
-    endpoint,
-    handleKeyword,
-    t
-  } = (0, _filter.useFilterContext)();
-  const getBlocklets = async params => {
-    const {
-      data
-    } = await storeApi.get(_constant.default.blockletsPath, {
-      params
-    });
-    const blocklets = data.dataList || [];
-    // 头部插入的一条 item  用于展示 `点击展开 xx条 结果`,如果没有blocklet 返回，不展示
-    if (blocklets.length > 0) {
-      blocklets.unshift({
-        type: 'more-result',
-        total: data.total || 0
-      });
-    }
-    return blocklets;
-  };
-  const onSubmit = autocompleteState => {
-    handleKeyword(autocompleteState.state.query);
-    autocompleteState.setIsOpen(false);
-  };
-  const setFocus = () => {
-    if (containerRef.current) {
-      // see: https://discourse.algolia.com/t/autocomplete-focus-input-field/4019/5
-      setTimeout(() => {
-        const input = containerRef.current.querySelector('input.bl-autocomplete-input');
-        if (input) {
-          input.focus();
-        }
-      });
-    }
-  };
-  const onReset = autocompleteState => {
-    autocompleteState.setIsOpen(false);
-    setFocus();
-  };
-  const onStateChange = _ref2 => {
-    let {
-      prevState,
-      state
-    } = _ref2;
-    // 当搜索框中的值清空时, 更新页面中的搜索结果
-    if (prevState.query !== state.query) {
-      if (!state.query) {
-        handleKeyword();
-      }
-    }
-  };
-  (0, _reactHotkeysHook.useHotkeys)('ctrl + k, command + k', e => {
-    e.stopPropagation();
-    e.preventDefault();
-    setFocus();
-    return false;
-  }, {
-    enableOnTags: ['INPUT']
-  });
-  (0, _react.useEffect)(() => {
-    setFocus();
-  }, [endpoint]);
-  (0, _react.useEffect)(() => {
-    if (!containerRef.current) {
-      return undefined;
-    }
-    const search = (0, _autocompleteJs.autocomplete)({
-      container: containerRef.current,
-      renderer: {
-        createElement: _react.createElement,
-        Fragment: _react.Fragment,
-        render: () => {}
-      },
-      render(_ref3, root) {
-        let {
-          children
-        } = _ref3;
-        if (!panelRootRef.current || rootRef.current !== root) {
-          var _panelRootRef$current;
-          rootRef.current = root;
-          (_panelRootRef$current = panelRootRef.current) === null || _panelRootRef$current === void 0 || _panelRootRef$current.unmount();
-          panelRootRef.current = (0, _client.createRoot)(root);
-        }
-        panelRootRef.current.render(wrapChildren(children));
-      },
-      autoFocus: true,
-      openOnFocus: false,
-      classNames: {
-        panel: 'bl-autocomplete-panel',
-        label: 'bl-autocomplete-label',
-        form: 'bl-autocomplete-form',
-        input: 'bl-autocomplete-input',
-        clearButton: 'bl-autocomplete-clear',
-        detachedCancelButton: 'bl-autocomplete-detached-cancel',
-        detachedContainer: 'bl-autocomplete-detached-container'
-      },
-      translations: {
-        clearButtonTitle: t('common.clear'),
-        detachedCancelButtonText: t('common.cancel'),
-        submitButtonTitle: t('common.search'),
-        detachedSearchButtonTitle: t('common.search')
-      },
-      placeholder: t('common.searchStore'),
-      initialState: {
-        query: filters.keyword
-      },
-      onStateChange(autocompleteState) {
-        onStateChange(autocompleteState);
-      },
-      onSubmit,
-      onReset(autocompleteState) {
-        onReset(autocompleteState);
-      },
-      getSources(_ref4) {
-        let {
-            query,
-            state
-          } = _ref4,
-          setters = _objectWithoutProperties(_ref4, _excluded);
-        const params = _objectSpread(_objectSpread({}, filters), {}, {
-          sortBy: _constant.default[filters.sortBy],
-          page: 1,
-          pageSize: 10,
-          keyword: query
-        });
-        return (0, _utils.debounced)([{
-          sourceId: 'blocklets',
-          getItems() {
-            return getBlocklets(params);
-          },
-          // 选中后填充 搜索框中值
-          getItemInputValue(_ref5) {
-            let {
-              item
-            } = _ref5;
-            if (item.type === 'more-result') {
-              return query;
-            }
-            return item.title;
-          },
-          // 选中或者点击自动完成列表中的 item 时触发
-          onSelect(_ref6) {
-            let {
-              event,
-              item
-            } = _ref6;
-            if (item.type === 'more-result') {
-              setters.setIsOpen(false);
-              return handleKeyword(query);
-            }
-            if (event.type === 'keydown') {
-              return handleKeyword(item.title);
-            }
-            return onSelect({
-              blocklet: item,
-              detailUrl: (0, _urlJoin.default)(endpoint, "/blocklets/".concat(item.did)),
-              storeUrl: endpoint
-            });
-          },
-          templates: {
-            item(_ref7) {
-              let {
-                item
-              } = _ref7;
-              if (item.type === 'more-result') {
-                return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-                  children: t('autocomplete.expandResult', {
-                    name: query,
-                    number: item.total.toLocaleString()
-                  })
-                });
-              }
-              return blockletRender({
-                blocklet: item,
-                autocompleteSetters: setters
-              });
-            },
-            noResults() {
-              return t('blocklet.noResults');
-            }
-          }
-        }]);
-      }
-    });
-    return () => {
-      search.destroy();
-    };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [filters, blockletRender]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_react2.Global, {
-      styles: (0, _react2.css)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n          .bl-autocomplete-detached-container {\n            .bl-autocomplete-detached-cancel {\n              white-space: nowrap;\n            }\n          }\n        "])))
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: "bl-search-container",
-      ref: containerRef
-    })]
-  });
-}
-Autocomplete.propTypes = {
-  onSelect: _propTypes.default.func.isRequired,
-  wrapChildren: _propTypes.default.func
-};
-Autocomplete.defaultProps = {
-  wrapChildren: children => children
-};