@blocklet/list 0.10.20 → 0.10.21

package/lib/assets/locale.js

@@ -39,7 +39,7 @@ const en = {
     noCategoryResults2: '" Blocklets'
   },
   autocomplete: {
-    expandResult: 'Show all search results for "{name}" '
+    expandResult: 'Show {number} search results for "{name}" '
   }
 };
 const zh = {
@@ -74,7 +74,7 @@ const zh = {
     noCategoryResults2: '" 类别的 Blocklets'
   },
   autocomplete: {
-    expandResult: '显示所有 “{name}” 的搜索结果 '
+    expandResult: '显示 {number} 条 “{name}” 的搜索结果 '
   }
 };
 var _default = {

package/lib/components/autocomplete/index.js

@@ -58,11 +58,12 @@ function Autocomplete(_ref) {
     } = await storeApi.get(_constant.default.blockletsPath, {
       params
     });
-    const blocklets = data.dataList || []; // 头部插入的一条 item  用于展示 `点击展开更多结果`,如果没有blocklet 返回，不展示
+    const blocklets = data.dataList || []; // 头部插入的一条 item  用于展示 `点击展开 xx条 结果`,如果没有blocklet 返回，不展示
 
     if (blocklets.length > 0) {
       blocklets.unshift({
-        type: 'more-result'
+        type: 'more-result',
+        total: data.total || 0
       });
     }
 
@@ -142,7 +143,7 @@ function Autocomplete(_ref) {
         panelRootRef.current.render(children);
       },
 
-      autoFocus: true,
+      autoFocus: false,
       classNames: {
         panel: 'bl-autocomplete-panel',
         label: 'bl-autocomplete-label',
@@ -173,7 +174,7 @@ function Autocomplete(_ref) {
         const params = _objectSpread(_objectSpread({}, filters), {}, {
           sortBy: _constant.default[filters.sortBy],
           page: 1,
-          pageSize: 5,
+          pageSize: 10,
           keyword: query
         });
 
@@ -204,7 +205,7 @@ function Autocomplete(_ref) {
             } = _ref6;
 
             if (item.type === 'more-result') {
-              return null;
+              return handleKeyword(query);
             }
 
             return onSelect({
@@ -224,7 +225,8 @@ function Autocomplete(_ref) {
               if (item.type === 'more-result') {
                 return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
                   children: t('autocomplete.expandResult', {
-                    name: query
+                    name: query,
+                    number: item.total.toLocaleString()
                   })
                 });
               }

package/lib/components/autocomplete/item.js

@@ -35,7 +35,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
 
 function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
 
-const Div = (0, _Theme.styled)('div')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  &.arcblock-blocklet {\n    padding: ", " ", " 0\n      ", ";\n  }\n  .arcblock-blocklet__content {\n    cursor: pointer;\n    display: flex;\n  }\n  .arcblock-blocklet__cover {\n    width: 64px;\n    height: 64px;\n    margin-right: ", ";\n    overflow: hidden;\n    border-radius: 12px;\n    transform: translateZ(0);\n  }\n\n  .arcblock-blocklet__info {\n    flex: 1;\n    overflow: hidden;\n    border-bottom: 1px solid ", ";\n    padding-bottom: ", ";\n  }\n  .arcblock-blocklet__text {\n    height: 57px;\n    overflow: hidden;\n  }\n  /* \u8BBE\u7F6E\u591A\u884C\u6587\u672C\u6EA2\u51FA\u663E\u793A\u7701\u7565\u53F7 \u517C\u5BB9fireFox\u3001safari */\n  .arcblock-blocklet__title {\n    margin: 0;\n    font-size: 16px;\n    font-weight: 500;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n  .arcblock-blocklet__describe {\n    margin-top: ", ";\n    color: ", ";\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 17px;\n    max-height: 34px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: -webkit-box;\n    -webkit-line-clamp: 2;\n    -webkit-box-orient: vertical;\n    word-break: break-word;\n  }\n  .ms-highlight {\n    background-color: yellow;\n  }\n"])), props => props.theme.spacing(2), props => props.theme.spacing(2), props => props.theme.spacing(2), props => props.theme.spacing(2), props => props.theme.palette.divider, props => props.theme.spacing(2), props => props.theme.spacing(0.5), props => props.theme.palette.grey[600]);
+const Div = (0, _Theme.styled)('div')(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  &.arcblock-blocklet {\n    padding: ", " ", " 0\n      ", ";\n  }\n  .arcblock-blocklet__content {\n    cursor: pointer;\n    display: flex;\n  }\n  .arcblock-blocklet__cover {\n    width: 64px;\n    height: 64px;\n    margin-right: ", ";\n    overflow: hidden;\n    border-radius: 12px;\n    transform: translateZ(0);\n  }\n\n  .arcblock-blocklet__info {\n    flex: 1;\n    overflow: hidden;\n    border-bottom: 1px solid ", ";\n    padding-bottom: ", ";\n  }\n  .arcblock-blocklet__text {\n    height: 57px;\n    overflow: hidden;\n  }\n  /* \u8BBE\u7F6E\u591A\u884C\u6587\u672C\u6EA2\u51FA\u663E\u793A\u7701\u7565\u53F7 \u517C\u5BB9fireFox\u3001safari */\n  .arcblock-blocklet__title {\n    margin: 0;\n    font-size: 16px;\n    font-weight: 500;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n  }\n  .arcblock-blocklet__describe {\n    margin-top: ", ";\n    color: ", ";\n    font-size: 14px;\n    font-weight: 500;\n    line-height: 17px;\n    max-height: 34px;\n    overflow: hidden;\n    text-overflow: ellipsis;\n    display: -webkit-box;\n    -webkit-line-clamp: 2;\n    -webkit-box-orient: vertical;\n    word-break: break-word;\n  }\n  .ms-highlight {\n    color: ", ";\n  }\n"])), props => props.theme.spacing(2), props => props.theme.spacing(2), props => props.theme.spacing(2), props => props.theme.spacing(2), props => props.theme.palette.divider, props => props.theme.spacing(2), props => props.theme.spacing(0.5), props => props.theme.palette.grey[600], props => props.theme.palette.primary.main);
 
 function Blocklet(_ref) {
   let {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/list",
-  "version": "0.10.20",
+  "version": "0.10.21",
   "description": "Common ux components of blocklet",
   "publishConfig": {
     "access": "public"
@@ -42,7 +42,7 @@
   "dependencies": {
     "@algolia/autocomplete-js": "^1.7.1",
     "@algolia/autocomplete-theme-classic": "^1.7.1",
-    "@arcblock/ux": "^2.4.40",
+    "@arcblock/ux": "^2.4.47",
     "@emotion/react": "^11.10.0",
     "@emotion/styled": "^11.10.0",
     "@mui/icons-material": "^5.8.4",
@@ -71,5 +71,5 @@
     "eslint": "^8.22.0",
     "prettier": "^2.7.1"
   },
-  "gitHead": "325fb367d112f88af0d4c78b9e26e089f9d363f1"
+  "gitHead": "45ee2abcf83965c9175e14e8eb701a4fdd6a5f57"
 }

package/src/assets/locale.js

@@ -32,7 +32,7 @@ const en = {
     noCategoryResults2: '" Blocklets',
   },
   autocomplete: {
-    expandResult: 'Show all search results for "{name}" ',
+    expandResult: 'Show {number} search results for "{name}" ',
   },
 };
 
@@ -68,7 +68,7 @@ const zh = {
     noCategoryResults2: '" 类别的 Blocklets',
   },
   autocomplete: {
-    expandResult: '显示所有 “{name}” 的搜索结果 ',
+    expandResult: '显示 {number} 条 “{name}” 的搜索结果 ',
   },
 };
 

package/src/components/autocomplete/index.js

@@ -23,9 +23,9 @@ export default function Autocomplete({ onSelect }) {
     async (params) => {
       const { data } = await storeApi.get(constant.blockletsPath, { params });
       const blocklets = data.dataList || [];
-      // 头部插入的一条 item  用于展示 `点击展开更多结果`,如果没有blocklet 返回，不展示
+      // 头部插入的一条 item  用于展示 `点击展开 xx条 结果`,如果没有blocklet 返回，不展示
       if (blocklets.length > 0) {
-        blocklets.unshift({ type: 'more-result' });
+        blocklets.unshift({ type: 'more-result', total: data.total || 0 });
       }
       return blocklets;
     },
@@ -101,7 +101,7 @@ export default function Autocomplete({ onSelect }) {
 
         panelRootRef.current.render(children);
       },
-      autoFocus: true,
+      autoFocus: false,
       classNames: {
         panel: 'bl-autocomplete-panel',
         label: 'bl-autocomplete-label',
@@ -125,7 +125,7 @@ export default function Autocomplete({ onSelect }) {
           ...filters,
           sortBy: constant[filters.sortBy],
           page: 1,
-          pageSize: 5,
+          pageSize: 10,
           keyword: query,
         };
         return debounced([
@@ -144,7 +144,7 @@ export default function Autocomplete({ onSelect }) {
             // 选中或者点击自动完成列表中的 item 时触发
             onSelect({ item }) {
               if (item.type === 'more-result') {
-                return null;
+                return handleKeyword(query);
               }
               return onSelect({
                 blocklet: item,
@@ -156,7 +156,9 @@ export default function Autocomplete({ onSelect }) {
               item({ item }) {
                 const logoUrl = item.logo ? joinUrl(endpoint, 'assets', item.did, item.logo) : null;
                 if (item.type === 'more-result') {
-                  return <div>{t('autocomplete.expandResult', { name: query })}</div>;
+                  return (
+                    <div>{t('autocomplete.expandResult', { name: query, number: item.total.toLocaleString() })}</div>
+                  );
                 }
                 return (
                   <MuiThemeProvider theme={muiTheme}>

package/src/components/autocomplete/item.js

@@ -56,7 +56,7 @@ const Div = styled('div')`
     word-break: break-word;
   }
   .ms-highlight {
-    background-color: yellow;
+    color: ${(props) => props.theme.palette.primary.main};
   }
 `;