dumi-theme-lobehub 1.9.1 → 1.9.2

package/dist/slots/SearchBar/index.js

@@ -6,8 +6,8 @@ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" !=
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 import { SearchBar as Input } from '@lobehub/ui';
 import { useSiteSearch } from 'dumi';
-import SearchResult from 'dumi/theme-default/slots/SearchResult';
 import { memo, useState } from 'react';
+import SearchResult from "dumi/theme/slots/SearchResult";
 import { useStyles } from "./style";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";

package/dist/slots/SearchResult/index.d.ts

@@ -0,0 +1,9 @@
+import { type useSiteSearch } from 'dumi';
+import React from 'react';
+type ISearchResult = ReturnType<typeof useSiteSearch>['result'];
+declare const SearchResult: React.NamedExoticComponent<{
+    data: import("dumi/dist/client/theme-api/useSiteSearch").ISearchResult;
+    loading: boolean;
+    onItemSelect?: ((item: ISearchResult[0]['hints'][0]) => void) | undefined;
+}>;
+export default SearchResult;

package/dist/slots/SearchResult/index.js

@@ -0,0 +1,255 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+import { Icon } from '@lobehub/ui';
+import animateScrollTo from 'animated-scroll-to';
+import { Empty, Typography } from 'antd';
+import { useTheme } from 'antd-style';
+import { FormattedMessage, Link, history, useLocation } from 'dumi';
+import { FileBox, FileIcon, HeadingIcon, LetterText } from 'lucide-react';
+import React, { Fragment, memo, useCallback, useEffect, useState } from 'react';
+import { Center, Flexbox } from 'react-layout-kit';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var ICONS_MAPPING = {
+  content: LetterText,
+  demo: FileBox,
+  page: FileIcon,
+  title: HeadingIcon
+};
+var Highlight = /*#__PURE__*/memo(function (props) {
+  return /*#__PURE__*/_jsx(_Fragment, {
+    children: props.texts.map(function (text, idx) {
+      return /*#__PURE__*/_jsx(Fragment, {
+        children: text.highlighted ? /*#__PURE__*/_jsx("mark", {
+          children: text.text
+        }) : text.text
+      }, idx);
+    })
+  });
+});
+var useFlatSearchData = function useFlatSearchData(data) {
+  var update = useCallback(function () {
+    var activeIndex = 0;
+    var ret = [];
+    var _iterator = _createForOfIteratorHelper(data),
+      _step;
+    try {
+      for (_iterator.s(); !(_step = _iterator.n()).done;) {
+        var _item = _step.value;
+        if (_item.title) {
+          ret.push({
+            type: 'title',
+            value: {
+              title: _item.title
+            }
+          });
+        }
+        var _iterator2 = _createForOfIteratorHelper(_item.hints),
+          _step2;
+        try {
+          for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+            var hint = _step2.value;
+            ret.push({
+              activeIndex: activeIndex++,
+              type: 'hint',
+              value: hint
+            });
+          }
+        } catch (err) {
+          _iterator2.e(err);
+        } finally {
+          _iterator2.f();
+        }
+      }
+    } catch (err) {
+      _iterator.e(err);
+    } finally {
+      _iterator.f();
+    }
+    return [ret, activeIndex];
+  }, [data]);
+  var _useState = useState(update),
+    _useState2 = _slicedToArray(_useState, 2),
+    flatData = _useState2[0],
+    setFlatData = _useState2[1];
+  useEffect(function () {
+    setFlatData(update);
+  }, [data]);
+  return flatData;
+};
+var SearchResult = /*#__PURE__*/memo(function (props) {
+  var theme = useTheme();
+  var _useFlatSearchData = useFlatSearchData(props.data),
+    _useFlatSearchData2 = _slicedToArray(_useFlatSearchData, 2),
+    data = _useFlatSearchData2[0],
+    histsCount = _useFlatSearchData2[1];
+  var _useState3 = useState(-1),
+    _useState4 = _slicedToArray(_useState3, 2),
+    activeIndex = _useState4[0],
+    setActiveIndex = _useState4[1];
+  var _useLocation = useLocation(),
+    pathname = _useLocation.pathname;
+  var onItemSelect = function onItemSelect(item) {
+    var _props$onItemSelect;
+    (_props$onItemSelect = props.onItemSelect) === null || _props$onItemSelect === void 0 || _props$onItemSelect.call(props, item);
+    var url = new URL(item === null || item === void 0 ? void 0 : item.link, location.origin);
+    if ((url === null || url === void 0 ? void 0 : url.pathname) === pathname && !url.hash) {
+      setTimeout(function () {
+        animateScrollTo(0, {
+          maxDuration: 300
+        });
+      }, 1);
+    }
+  };
+  useEffect(function () {
+    var handler = function handler(ev) {
+      // TODO: scroll into view for invisible items
+      if (ev.key === 'ArrowDown') {
+        setActiveIndex((activeIndex + 1) % histsCount);
+      } else if (ev.key === 'ArrowUp') {
+        setActiveIndex((activeIndex + histsCount - 1) % histsCount);
+      } else if (ev.key === 'Enter' && activeIndex >= 0) {
+        var _item2 = data.find(function (item) {
+          return item.type === 'hint' && item.activeIndex === activeIndex;
+        }).value;
+        history.push(_item2.link);
+        onItemSelect === null || onItemSelect === void 0 || onItemSelect(_item2);
+        document.activeElement.blur();
+      }
+      if (['Escape', 'Enter'].includes(ev.key)) {
+        setActiveIndex(-1);
+      }
+    };
+    document.addEventListener('keydown', handler);
+    return function () {
+      return document.removeEventListener('keydown', handler);
+    };
+  });
+  var returnNode = null;
+  if (props.loading) {
+    returnNode = /*#__PURE__*/_jsx(Empty, {
+      description: /*#__PURE__*/_jsx(FormattedMessage, {
+        id: "search.loading"
+      }),
+      image: Empty.PRESENTED_IMAGE_SIMPLE
+    });
+  } else if (props.data.length > 0) {
+    returnNode = /*#__PURE__*/_jsx(Flexbox, {
+      gap: 8,
+      paddingBlock: 8,
+      paddingInline: 8,
+      children: data.map(function (item, i) {
+        return item.type === 'title' ? /*#__PURE__*/_jsx(Flexbox, {
+          paddingBlock: 8,
+          paddingInline: 12,
+          style: {
+            background: theme.colorFillTertiary,
+            borderRadius: theme.borderRadius
+          },
+          children: /*#__PURE__*/_jsx(Typography.Title, {
+            ellipsis: {
+              rows: 1
+            },
+            level: 4,
+            style: {
+              fontSize: 14,
+              lineHeight: 1.4,
+              margin: 0
+            },
+            children: item.value.title
+          })
+        }, String(i)) : /*#__PURE__*/_jsx(Flexbox, {
+          children: /*#__PURE__*/_jsx(Link, {
+            "data-active": activeIndex === item.activeIndex || undefined,
+            onClick: function onClick() {
+              return onItemSelect === null || onItemSelect === void 0 ? void 0 : onItemSelect(item.value);
+            },
+            style: {
+              color: 'inherit'
+            },
+            to: item.value.link,
+            children: /*#__PURE__*/_jsxs(Flexbox, {
+              align: 'center',
+              gap: 16,
+              horizontal: true,
+              style: {
+                overflow: 'hidden',
+                position: 'relative'
+              },
+              children: [/*#__PURE__*/_jsx(Center, {
+                flex: 'none',
+                height: 48,
+                style: {
+                  background: theme.colorFillTertiary,
+                  borderRadius: theme.borderRadius
+                },
+                width: 48,
+                children: /*#__PURE__*/_jsx(Icon, {
+                  color: theme.colorTextDescription,
+                  icon: ICONS_MAPPING === null || ICONS_MAPPING === void 0 ? void 0 : ICONS_MAPPING[item.value.type],
+                  size: {
+                    fontSize: 32
+                  }
+                })
+              }), /*#__PURE__*/_jsxs(Flexbox, {
+                children: [/*#__PURE__*/_jsx(Typography.Title, {
+                  ellipsis: {
+                    rows: 1
+                  },
+                  level: 4,
+                  style: {
+                    fontSize: 14,
+                    lineHeight: 1.4,
+                    margin: 0
+                  },
+                  children: /*#__PURE__*/_jsx(Highlight, {
+                    texts: item.value.highlightTitleTexts
+                  })
+                }), /*#__PURE__*/_jsx(Typography.Paragraph, {
+                  ellipsis: {
+                    rows: 2
+                  },
+                  style: {
+                    color: theme.colorTextSecondary,
+                    fontSize: 12,
+                    lineHeight: 1.4,
+                    margin: 0
+                  },
+                  children: /*#__PURE__*/_jsx(Highlight, {
+                    texts: item.value.highlightTexts
+                  })
+                })]
+              })]
+            })
+          })
+        }, String(i));
+      })
+    });
+  } else {
+    returnNode = /*#__PURE__*/_jsx(Empty, {
+      description: /*#__PURE__*/_jsx(FormattedMessage, {
+        id: "search.not.found"
+      }),
+      image: Empty.PRESENTED_IMAGE_SIMPLE
+    });
+  }
+  return /*#__PURE__*/_jsx(Flexbox, {
+    onMouseDownCapture: function onMouseDownCapture(ev) {
+      return ev.preventDefault();
+    },
+    onMouseEnter: function onMouseEnter() {
+      return setActiveIndex(-1);
+    },
+    onMouseUpCapture: function onMouseUpCapture() {
+      document.activeElement.blur();
+    },
+    children: returnNode
+  });
+});
+export default SearchResult;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dumi-theme-lobehub",
-  "version": "1.9.1",
+  "version": "1.9.2",
   "description": "dumi-theme-lobehub is a documentation site theme package designed for dumi2. It provides a more beautiful and user-friendly development and reading experience based on @lobehub/ui",
   "keywords": [
     "lobehub",
@@ -27,6 +27,7 @@
   "dependencies": {
     "@floating-ui/react": "^0.26.28",
     "ahooks": "^3.8.1",
+    "animated-scroll-to": "^2.3.0",
     "chalk": "^4.1.2",
     "fast-deep-equal": "^3.1.3",
     "history": "^5.3.0",