@blocklet/list 0.8.24 → 0.8.27

package/lib/components/list/empty.js

@@ -3,9 +3,9 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.NoResultsTips = exports.NoResults = exports.EmptyTitle = void 0;
-
-var _react = _interopRequireDefault(require("react"));
+exports.EmptyTitle = EmptyTitle;
+exports.NoResults = NoResults;
+exports.NoResultsTips = NoResultsTips;
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -15,23 +15,24 @@ var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
 
 var _filter = require("../../contexts/filter");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const NoResults = () => {
+function NoResults() {
   const {
     t
   } = (0, _filter.useFilterContext)();
-  return /*#__PURE__*/_react.default.createElement(_Typography.default, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Typography.default, {
     style: {
       textAlign: 'center'
     },
-    variant: "subtitle2"
-  }, t('blocklet.noResults'));
-};
+    variant: "subtitle2",
+    children: t('blocklet.noResults')
+  });
+}
 
-exports.NoResults = NoResults;
-
-const NoResultsTips = _ref => {
+function NoResultsTips(_ref) {
   let {
     filterTip,
     keywordTip
@@ -46,16 +47,21 @@ const NoResultsTips = _ref => {
     return ' , ';
   };
 
-  return /*#__PURE__*/_react.default.createElement(_Box.default, {
-    className: "tips"
-  }, /*#__PURE__*/_react.default.createElement("span", {
-    style: {
-      marginRight: '16px'
-    }
-  }, t('blocklet.emptyTip')), filterTip && /*#__PURE__*/_react.default.createElement("span", null, t('blocklet.filterTip')), filterTip && keywordTip && getSplit(), keywordTip && /*#__PURE__*/_react.default.createElement("span", null, t('blocklet.keywordTip')));
-};
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Box.default, {
+    className: "tips",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      style: {
+        marginRight: '16px'
+      },
+      children: t('blocklet.emptyTip')
+    }), filterTip && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      children: t('blocklet.filterTip')
+    }), filterTip && keywordTip && getSplit(), keywordTip && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      children: t('blocklet.keywordTip')
+    })]
+  });
+}
 
-exports.NoResultsTips = NoResultsTips;
 NoResultsTips.propTypes = {
   filterTip: _propTypes.default.bool,
   keywordTip: _propTypes.default.bool
@@ -65,20 +71,25 @@ NoResultsTips.defaultProps = {
   keywordTip: false
 };
 
-const EmptyTitle = _ref2 => {
+function EmptyTitle(_ref2) {
   let {
     primaryStart,
     primaryEnd,
     filter
   } = _ref2;
-  return /*#__PURE__*/_react.default.createElement(_Typography.default, {
-    variant: "subtitle2"
-  }, /*#__PURE__*/_react.default.createElement("span", null, primaryStart), /*#__PURE__*/_react.default.createElement("span", {
-    className: "primary"
-  }, " ", filter, " "), /*#__PURE__*/_react.default.createElement("span", null, primaryEnd, " "));
-};
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_Typography.default, {
+    variant: "subtitle2",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+      children: primaryStart
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+      className: "primary",
+      children: [" ", filter, " "]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
+      children: [primaryEnd, " "]
+    })]
+  });
+}
 
-exports.EmptyTitle = EmptyTitle;
 EmptyTitle.propTypes = {
   primaryStart: _propTypes.default.string.isRequired,
   primaryEnd: _propTypes.default.string.isRequired,

package/lib/components/list/list.js

@@ -5,8 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = BlockletList;
 
-var _react = _interopRequireDefault(require("react"));
-
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _styledComponents = _interopRequireDefault(require("styled-components"));
@@ -27,10 +25,18 @@ var _filter = require("../../contexts/filter");
 
 var _utils = require("../../libs/utils");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 const _excluded = ["blocklets"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 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 = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -54,70 +60,84 @@ function BlockletList(_ref) {
   const showFilterTip = !!selectedCategory || !!filters.price;
 
   if (errors.fetchBlockletsError) {
-    return /*#__PURE__*/_react.default.createElement(_Alert.default, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Alert.default, {
       type: "error",
-      variant: "icon"
-    }, /*#__PURE__*/_react.default.createElement("div", null, (0, _utils.formatError)(errors.fetchBlockletsError)));
+      variant: "icon",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        children: (0, _utils.formatError)(errors.fetchBlockletsError)
+      })
+    });
   }
 
   if (loadings.fetchBlockletsLoading) {
-    return /*#__PURE__*/_react.default.createElement(_Box.default, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Box.default, {
       display: "flex",
       alignItems: "center",
-      justifyContent: "center"
-    }, /*#__PURE__*/_react.default.createElement(_CircularProgress.default, null));
+      justifyContent: "center",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_CircularProgress.default, {})
+    });
   }
 
   if (filters.keyword && showFilterTip && blockletList.length === 0) {
-    return /*#__PURE__*/_react.default.createElement(CustomEmpty, null, /*#__PURE__*/_react.default.createElement(_empty.EmptyTitle, {
-      primaryStart: t('blocklet.noBlockletPart1'),
-      primaryEnd: t('blocklet.noBlockletPart2'),
-      filter: filters.keyword
-    }), /*#__PURE__*/_react.default.createElement(_empty.NoResultsTips, {
-      keywordTip: true,
-      filterTip: true
-    }));
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(CustomEmpty, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_empty.EmptyTitle, {
+        primaryStart: t('blocklet.noBlockletPart1'),
+        primaryEnd: t('blocklet.noBlockletPart2'),
+        filter: filters.keyword
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_empty.NoResultsTips, {
+        keywordTip: true,
+        filterTip: true
+      })]
+    });
   }
 
   if (filters.keyword && blockletList.length === 0) {
-    return /*#__PURE__*/_react.default.createElement(CustomEmpty, null, /*#__PURE__*/_react.default.createElement(_empty.EmptyTitle, {
-      primaryStart: t('blocklet.noBlockletPart1'),
-      primaryEnd: t('blocklet.noBlockletPart2'),
-      filter: filters.keyword
-    }), /*#__PURE__*/_react.default.createElement(_empty.NoResultsTips, {
-      keywordTip: true
-    }));
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(CustomEmpty, {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_empty.EmptyTitle, {
+        primaryStart: t('blocklet.noBlockletPart1'),
+        primaryEnd: t('blocklet.noBlockletPart2'),
+        filter: filters.keyword
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_empty.NoResultsTips, {
+        keywordTip: true
+      })]
+    });
   }
 
   if (showFilterTip && blockletList.length === 0) {
     const categoryLocale = getCategoryLocale(selectedCategory);
-    return /*#__PURE__*/_react.default.createElement(CustomEmpty, null, categoryLocale ? /*#__PURE__*/_react.default.createElement(_empty.EmptyTitle, {
-      primaryStart: t('blocklet.noCategoryResults1'),
-      primaryEnd: t('blocklet.noCategoryResults2'),
-      filter: categoryLocale
-    }) : /*#__PURE__*/_react.default.createElement(_empty.NoResults, null), /*#__PURE__*/_react.default.createElement(_empty.NoResultsTips, {
-      filterTip: true
-    }));
+    return /*#__PURE__*/(0, _jsxRuntime.jsxs)(CustomEmpty, {
+      children: [categoryLocale ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_empty.EmptyTitle, {
+        primaryStart: t('blocklet.noCategoryResults1'),
+        primaryEnd: t('blocklet.noCategoryResults2'),
+        filter: categoryLocale
+      }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_empty.NoResults, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_empty.NoResultsTips, {
+        filterTip: true
+      })]
+    });
   }
 
   if (blockletList.length === 0) {
-    return /*#__PURE__*/_react.default.createElement(CustomEmpty, null, /*#__PURE__*/_react.default.createElement(_empty.NoResults, null));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(CustomEmpty, {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_empty.NoResults, {})
+    });
   }
 
-  return /*#__PURE__*/_react.default.createElement(_Grid.default, Object.assign({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_Grid.default, _objectSpread(_objectSpread({
     container: true
-  }, rest), blocklets.map(blocklet => /*#__PURE__*/_react.default.createElement(StyledGrid, {
-    item: true,
-    lg: 4,
-    md: 6,
-    sm: 6,
-    xs: 12,
-    key: blocklet.did,
-    "data-blocklet-did": blocklet.did
-  }, blockletRender({
-    blocklet,
-    blocklets: blockletList
-  }))));
+  }, rest), {}, {
+    children: blocklets.map(blocklet => /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledGrid, {
+      item: true,
+      lg: 4,
+      md: 6,
+      sm: 6,
+      xs: 12,
+      "data-blocklet-did": blocklet.did,
+      children: blockletRender({
+        blocklet,
+        blocklets: blockletList
+      })
+    }, blocklet.did))
+  }));
 }
 
 BlockletList.propTypes = {

package/lib/components/search.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -21,19 +21,23 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 
 var _filter = require("../contexts/filter");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 const _excluded = ["placeholder"];
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 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 = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-const Search = _ref => {
+function Search(_ref) {
   let {
     placeholder
   } = _ref,
@@ -64,26 +68,28 @@ const Search = _ref => {
   (0, _react.useEffect)(() => {
     setSearchStr(filters.keyword || '');
   }, [filters.keyword]);
-  return /*#__PURE__*/_react.default.createElement(StyledSearch, Object.assign({
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledSearch, _objectSpread({
     inputProps: {
       'data-cy': 'search-blocklet'
     },
-    startAdornment: /*#__PURE__*/_react.default.createElement(_material.InputAdornment, {
-      position: "start"
-    }, /*#__PURE__*/_react.default.createElement(StyledSearchIcon, null)),
+    startAdornment: /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.InputAdornment, {
+      position: "start",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledSearchIcon, {})
+    }),
     onChange: handleChange,
     placeholder: placeholder,
     value: searchStr,
     title: placeholder,
     "data-cy": "search",
-    endAdornment: searchStr && /*#__PURE__*/_react.default.createElement(_material.InputAdornment, {
-      position: "end"
-    }, /*#__PURE__*/_react.default.createElement(StyledCloseIcon, {
-      "data-cy": "search-delete",
-      onClick: handleClose
-    }))
+    endAdornment: searchStr && /*#__PURE__*/(0, _jsxRuntime.jsx)(_material.InputAdornment, {
+      position: "end",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledCloseIcon, {
+        "data-cy": "search-delete",
+        onClick: handleClose
+      })
+    })
   }, rest));
-};
+}
 
 Search.propTypes = {
   placeholder: _propTypes.default.string

package/lib/contexts/filter.js

@@ -7,7 +7,7 @@ exports.FilterConsumer = void 0;
 exports.FilterProvider = FilterProvider;
 exports.useFilterContext = useFilterContext;
 
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
 
@@ -23,11 +23,9 @@ var _locale = _interopRequireDefault(require("../assets/locale"));
 
 var _propTypes2 = require("../libs/prop-types");
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+var _jsxRuntime = require("react/jsx-runtime");
 
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -248,9 +246,10 @@ function FilterProvider(_ref) {
     fetchBlocklets();
     fetchCategories();
   }, [endpoint]);
-  return /*#__PURE__*/_react.default.createElement(Provider, {
-    value: filterStore
-  }, children);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Provider, {
+    value: filterStore,
+    children: children
+  });
 }
 
 FilterProvider.propTypes = _objectSpread(_objectSpread({}, _propTypes2.propTypes), {}, {

package/lib/index.js

@@ -5,18 +5,26 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = BlockletList;
 
-var _react = _interopRequireDefault(require("react"));
-
 var _base = _interopRequireDefault(require("./base"));
 
 var _filter = require("./contexts/filter");
 
 var _propTypes = require("./libs/prop-types");
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
 function BlockletList(props) {
-  return /*#__PURE__*/_react.default.createElement(_filter.FilterProvider, props, /*#__PURE__*/_react.default.createElement(_base.default, null));
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_filter.FilterProvider, _objectSpread(_objectSpread({}, props), {}, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_base.default, {})
+  }));
 }
 
 BlockletList.propTypes = _propTypes.propTypes;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blocklet/list",
-  "version": "0.8.24",
+  "version": "0.8.27",
   "description": "Common ux components of blocklet",
   "publishConfig": {
     "access": "public"
@@ -21,7 +21,8 @@
     "url": "git@github.com:blocklet/blocklet-store.git"
   },
   "scripts": {
-    "lint": "eslint src",
+    "lint": "eslint src stories --ext=js,jsx,ts,tsx,mjs",
+    "lint:fix": "npm run lint -- --fix",
     "build": "rm -rf lib && babel src --out-dir lib --copy-files",
     "watch": "babel src --out-dir lib -w --copy-files",
     "precommit": "CI=1 yarn test",
@@ -37,7 +38,7 @@
     "react": ">=18.1.0"
   },
   "dependencies": {
-    "@arcblock/ux": "^2.1.7",
+    "@arcblock/ux": "^2.1.10",
     "@emotion/react": "^11.9.0",
     "@emotion/styled": "^11.8.1",
     "@mui/icons-material": "^5.6.2",
@@ -50,13 +51,16 @@
     "url-join": "^4.0.1"
   },
   "devDependencies": {
+    "@arcblock/eslint-config": "0.2.1",
     "@babel/cli": "^7.8.4",
     "@babel/core": "^7.8.4",
     "@babel/preset-env": "^7.8.4",
     "@babel/preset-react": "^7.8.3",
     "@emotion/babel-plugin": "^11.9.2",
     "babel-plugin-inline-react-svg": "^2.0.1",
-    "babel-plugin-styled-components": "^1.10.7"
+    "babel-plugin-styled-components": "^1.10.7",
+    "eslint": "^8.16.0",
+    "prettier": "^2.6.2"
   },
-  "gitHead": "0127bb9206c38b378711109469684738205e07a6"
+  "gitHead": "af6bdbc88dd0cd533d63dbe00dbc26e0d04d0ff6"
 }

package/src/base.js

@@ -1,4 +1,3 @@
-import React from 'react';
 import styled from 'styled-components';
 import SortIcon from '@mui/icons-material/Sort';
 import { Box, Hidden } from '@mui/material';
@@ -12,7 +11,7 @@ import BlockletList from './components/list';
 import Aside from './components/aside';
 import Search from './components/search';
 
-const ListBase = () => {
+function ListBase() {
   const {
     handleDeveloper,
     blockletList,
@@ -81,7 +80,7 @@ const ListBase = () => {
       </StyledMin>
     </Box>
   );
-};
+}
 
 const StyledMin = styled.main`
   flex: 1;

package/src/components/aside.js

@@ -1,10 +1,9 @@
-import React from 'react';
 import styled from 'styled-components';
 
 import { useFilterContext } from '../contexts/filter';
 import { FilterGroup } from './filter';
 
-const Aside = () => {
+function Aside() {
   const { selectedCategory, handleCategory, t, handlePrice, filters, categoryOptions, priceOptions } =
     useFilterContext();
 
@@ -23,7 +22,7 @@ const Aside = () => {
       </div>
     </StyledAside>
   );
-};
+}
 
 const StyledAside = styled.aside`
   width: 220px;

package/src/components/custom-select/button.js

@@ -1,4 +1,4 @@
-import React, { forwardRef } from 'react';
+import { forwardRef } from 'react';
 import PropTypes from 'prop-types';
 import { Button as MuiButton, CircularProgress } from '@mui/material';
 import styled from 'styled-components';

package/src/components/custom-select/custom-select.js

@@ -1,5 +1,5 @@
 /* eslint-disable no-unused-expressions */
-import React, { useEffect, useRef, useState } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import useTheme from '@mui/styles/useTheme';
 import styled from 'styled-components';
 import PropTypes from 'prop-types';
@@ -12,7 +12,7 @@ import isEqual from 'lodash/isEqual';
 
 import Button from './button';
 
-const CustomSelect = ({
+function CustomSelect({
   title,
   value,
   icon,
@@ -25,11 +25,12 @@ const CustomSelect = ({
   onInput,
   itemRender,
   ...buttonProps
-}) => {
+}) {
   const anchorRef = useRef(null);
   const theme = useTheme();
   const [open, setOpen] = useState(false);
-  const [currentValue, setCurrentValue] = value !== null ? useState(value) : useState(multiple ? [] : '');
+  // eslint-disable-next-line no-nested-ternary
+  const [currentValue, setCurrentValue] = useState(value !== null ? value : multiple ? [] : '');
   const isSm = useMediaQuery(theme.breakpoints.down('sm'));
 
   useEffect(() => {
@@ -126,7 +127,7 @@ const CustomSelect = ({
       </Popper>
     </>
   );
-};
+}
 
 CustomSelect.propTypes = {
   options: PropTypes.array.isRequired,

package/src/components/filter/custom-chip.js

@@ -1,4 +1,3 @@
-import React from 'react';
 import PropTypes from 'prop-types';
 import styled from 'styled-components';
 import { Chip } from '@mui/material';
@@ -12,14 +11,14 @@ const StyleDiv = styled.div`
     padding: 4px 0;
   }
 `;
-const FilterChip = ({ label, icon, onDelete, ...containerProps }) => {
+function FilterChip({ label, icon, onDelete, ...containerProps }) {
   if (!label) return null;
   return (
     <StyleDiv {...containerProps}>
       <Chip icon={icon} label={label} onDelete={onDelete} />
     </StyleDiv>
   );
-};
+}
 FilterChip.propTypes = {
   label: PropTypes.string,
   onDelete: PropTypes.func,

package/src/components/filter/group.js

@@ -1,4 +1,3 @@
-import React from 'react';
 import PropTypes from 'prop-types';
 import styled from 'styled-components';
 

package/src/components/filter/icon.js

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import { useState } from 'react';
 import styled from 'styled-components';
 import FilterAltOutlinedIcon from '@mui/icons-material/FilterAltOutlined';
 import Dialog from '@arcblock/ux/lib/Dialog';

package/src/components/list/empty.js

@@ -1,19 +1,18 @@
-import React from 'react';
 import PropTypes from 'prop-types';
 import Box from '@mui/material/Box';
 import Typography from '@mui/material/Typography';
 
 import { useFilterContext } from '../../contexts/filter';
 
-const NoResults = () => {
+function NoResults() {
   const { t } = useFilterContext();
   return (
     <Typography style={{ textAlign: 'center' }} variant="subtitle2">
       {t('blocklet.noResults')}
     </Typography>
   );
-};
-const NoResultsTips = ({ filterTip, keywordTip }) => {
+}
+function NoResultsTips({ filterTip, keywordTip }) {
   const { t, locale } = useFilterContext();
 
   const getSplit = () => {
@@ -28,7 +27,7 @@ const NoResultsTips = ({ filterTip, keywordTip }) => {
       {keywordTip && <span>{t('blocklet.keywordTip')}</span>}
     </Box>
   );
-};
+}
 NoResultsTips.propTypes = {
   filterTip: PropTypes.bool,
   keywordTip: PropTypes.bool,
@@ -38,7 +37,7 @@ NoResultsTips.defaultProps = {
   filterTip: false,
   keywordTip: false,
 };
-const EmptyTitle = ({ primaryStart, primaryEnd, filter }) => {
+function EmptyTitle({ primaryStart, primaryEnd, filter }) {
   return (
     <Typography variant="subtitle2">
       <span>{primaryStart}</span>
@@ -46,7 +45,7 @@ const EmptyTitle = ({ primaryStart, primaryEnd, filter }) => {
       <span>{primaryEnd} </span>
     </Typography>
   );
-};
+}
 EmptyTitle.propTypes = {
   primaryStart: PropTypes.string.isRequired,
   primaryEnd: PropTypes.string.isRequired,

package/src/components/list/list.js

@@ -1,4 +1,3 @@
-import React from 'react';
 import PropTypes from 'prop-types';
 import styled from 'styled-components';
 import Empty from '@arcblock/ux/lib/Empty';