@umijs/plugin-docs 4.0.4 → 4.0.7

package/client/theme-doc/Search.tsx

@@ -112,7 +112,7 @@ export default () => {
             <components.Link
               to={(isFromPath ? currentLanguage?.locale : '') + r.href}
               key={i}
-              onClick={() => (document.activeElement as HTMLElement)?.blur()}
+              onClick={() => scrollToAnchor(r.href)}
               className="group outline-none search-result"
               onFocus={() => setIsFocused(true)}
               onBlur={() => setIsFocused(false)}
@@ -206,3 +206,18 @@ function handleKeyUp(e: KeyboardEvent) {
     document.activeElement?.previousSibling as HTMLDivElement | undefined
   )?.focus();
 }
+
+function scrollToAnchor(to: string) {
+  const hash = to.match(/(#[^&?]*)/)?.[1] || '';
+
+  (document.activeElement as HTMLElement)?.blur();
+
+  window.requestAnimationFrame(() => {
+    const elm = document.getElementById(hash.substring(1));
+    if (elm) {
+      elm.scrollIntoView();
+    } else {
+      window.scrollTo(0, 0);
+    }
+  });
+}

package/client/theme-doc/components/Tabbed.tsx

@@ -0,0 +1,78 @@
+import React, { FC, PropsWithChildren, ReactNode, useState } from 'react';
+
+type Pane = {
+  title: ReactNode;
+  content: ReactNode;
+};
+
+type TabbedProps = {
+  panes?: Pane[];
+};
+
+export default function Tabbed(props: PropsWithChildren<TabbedProps>) {
+  const { children } = props;
+
+  const [activeTab, setActiveTab] = useState(0);
+
+  let tabs: ReactNode[] = [];
+  let content: ReactNode = null;
+
+  if (props.panes && props.panes.length > 0) {
+    tabs = props.panes.map((pane) => {
+      return pane.title;
+    });
+
+    content = props.panes[activeTab].content;
+  } else {
+    // Guess pane from children, make mdx more idiomatic
+    const childrenArray = React.Children.toArray(children) || [];
+
+    tabs = childrenArray.filter((_, index) => index % 2 === 0);
+    const contents = childrenArray.filter((_, index) => index % 2 === 1);
+
+    content = contents[activeTab];
+  }
+
+  return (
+    <div className="tabbed-code">
+      <Wrapper>
+        <Tabs tabs={tabs} setActiveTab={setActiveTab} activeTab={activeTab} />
+      </Wrapper>
+      {content || null}
+    </div>
+  );
+}
+const Wrapper: FC<PropsWithChildren> = ({ children }) => {
+  return <div className={`w-full pt-5 pt-0 `}>{children}</div>;
+};
+
+const Tabs: FC<
+  PropsWithChildren<{
+    tabs: ReactNode[];
+    setActiveTab: Function;
+    activeTab: number;
+  }>
+> = ({ tabs, activeTab, setActiveTab }) => {
+  return (
+    <ul className="cursor-pointer m-0 mt-4 px-0 list-none inline-flex flex-wrap rounded-t-lg text-sm font-small text-center text-gray-500 dark:text-gray-400">
+      {tabs.map((tab, index) => {
+        return (
+          <li key={index} className="mr-0 mt-0">
+            <button
+              onClick={() => setActiveTab(index)}
+              className={`tabbed-tab-button
+                hover:text-gray-700 hover:border-gray-300 dark:hover:text-gray-300 
+                ${
+                  activeTab === index
+                    ? 'bg-zinc-900 text-white hover:text-neutral-300 dark:text-white'
+                    : 'text-neutral-500 hover:text-gray-700 hover:border-gray-300 dark:hover:text-gray-300 '
+                }`}
+            >
+              {tab}
+            </button>
+          </li>
+        );
+      })}
+    </ul>
+  );
+};

package/client/theme-doc/index.ts

@@ -5,4 +5,5 @@ export { default as FeatureItem } from './components/FeatureItem';
 export { default as Features } from './components/Features';
 export { default as Hero } from './components/Hero';
 export { default as Message } from './components/Message';
+export { default as Tabbed } from './components/Tabbed';
 export { default as $Layout } from './Layout';

package/client/theme-doc/tailwind.css

@@ -3,28 +3,28 @@
 @tailwind utilities;
 
 article h1 {
-  @apply text-4xl font-bold tracking-tight mt-2 my-4 dark:text-white;
+  @apply text-4xl font-bold tracking-tight mt-2 my-4 dark:text-white title-link;
 }
 
 article h2 {
-  @apply text-3xl font-semibold tracking-tight mt-10 dark:text-white;
+  @apply text-3xl font-semibold tracking-tight mt-10 dark:text-white title-link;
   @apply pb-1 border-b;
 }
 
 article h3 {
-  @apply text-2xl font-semibold tracking-tight mt-8 dark:text-white;
+  @apply text-2xl font-semibold tracking-tight mt-8 dark:text-white title-link;
 }
 
 article h4 {
-  @apply text-xl font-semibold tracking-tight mt-8 dark:text-white;
+  @apply text-xl font-semibold tracking-tight mt-8 dark:text-white title-link;
 }
 
 article h5 {
-  @apply text-lg font-semibold tracking-tight mt-8 dark:text-white;
+  @apply text-lg font-semibold tracking-tight mt-8 dark:text-white title-link;
 }
 
 article h6 {
-  @apply text-base font-semibold tracking-tight mt-8 dark:text-white;
+  @apply text-base font-semibold tracking-tight mt-8 dark:text-white title-link;
 }
 
 article p {
@@ -77,6 +77,23 @@ article div[data-rehype-pretty-code-fragment] {
   @apply my-4;
 }
 
+article .tabbed-code div[data-rehype-pretty-code-fragment] {
+  @apply my-0;
+}
+
+article .tabbed-code pre {
+  @apply rounded-none rounded-b-md rounded-tr-md;
+}
+
+article .tabbed-code .tabbed-tab-button {
+  @apply inline-flex items-center rounded-t-lg px-4;
+}
+
+article .tabbed-code .tabbed-tab-button * {
+  @apply mt-0;
+  color: inherit;
+}
+
 /* 代码块的标题部分 */
 article
   div[data-rehype-pretty-code-fragment]
@@ -223,6 +240,33 @@ h6 {
 }
 
 @layer components {
+  .title-link a {
+    float: left;
+    margin-top: 0.1em;
+    margin-left: -24px;
+    width: 20px;
+    padding-right: 4px;
+    line-height: 1;
+    box-sizing: border-box;
+    background: none;
+    opacity: 0;
+  }
+
+  .title-link:hover a {
+    opacity: 1;
+  }
+
+  .title-link span {
+    display: none;
+  }
+
+  .title-link a::after {
+    content: '#';
+    display: inline-block;
+    vertical-align: middle;
+    font-size: 20px;
+  }
+
   .features-dark {
     @apply bg-gray-900;
     background-image: radial-gradient(#2a2a2a 20%, transparent 20%);

package/client/theme-doc/tailwind.out.css

@@ -787,6 +787,10 @@ video {
   margin: 2rem;
 }
 
+.m-0 {
+  margin: 0px;
+}
+
 .my-6 {
   margin-top: 1.5rem;
   margin-bottom: 1.5rem;
@@ -873,6 +877,10 @@ video {
   margin-bottom: 0.75rem;
 }
 
+.mr-0 {
+  margin-right: 0px;
+}
+
 .block {
   display: block;
 }
@@ -881,6 +889,14 @@ video {
   display: flex;
 }
 
+.inline-flex {
+  display: inline-flex;
+}
+
+.contents {
+  display: contents;
+}
+
 .hidden {
   display: none;
 }
@@ -1088,6 +1104,10 @@ video {
   cursor: default;
 }
 
+.list-none {
+  list-style-type: none;
+}
+
 .flex-row {
   flex-direction: row;
 }
@@ -1156,6 +1176,11 @@ video {
   border-radius: 0.75rem;
 }
 
+.rounded-t-lg {
+  border-top-left-radius: 0.5rem;
+  border-top-right-radius: 0.5rem;
+}
+
 .border {
   border-width: 1px;
 }
@@ -1236,6 +1261,11 @@ video {
   background-color: rgb(37 99 235 / var(--tw-bg-opacity));
 }
 
+.bg-zinc-900 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(24 24 27 / var(--tw-bg-opacity));
+}
+
 .object-cover {
   -o-object-fit: cover;
      object-fit: cover;
@@ -1309,6 +1339,11 @@ video {
   padding-bottom: 1.25rem;
 }
 
+.px-0 {
+  padding-left: 0px;
+  padding-right: 0px;
+}
+
 .pt-4 {
   padding-top: 1rem;
 }
@@ -1341,6 +1376,14 @@ video {
   padding-bottom: 3rem;
 }
 
+.pt-5 {
+  padding-top: 1.25rem;
+}
+
+.pt-0 {
+  padding-top: 0px;
+}
+
 .text-center {
   text-align: center;
 }
@@ -1438,6 +1481,11 @@ video {
   color: rgb(147 197 253 / var(--tw-text-opacity));
 }
 
+.text-neutral-500 {
+  --tw-text-opacity: 1;
+  color: rgb(115 115 115 / var(--tw-text-opacity));
+}
+
 .opacity-0 {
   opacity: 0;
 }
@@ -1543,6 +1591,33 @@ video {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
 
+article h1 a {
+  float: left;
+  margin-top: 0.1em;
+  margin-left: -24px;
+  width: 20px;
+  padding-right: 4px;
+  line-height: 1;
+  box-sizing: border-box;
+  background: none;
+  opacity: 0;
+}
+
+article h1:hover a {
+  opacity: 1;
+}
+
+article h1 span {
+  display: none;
+}
+
+article h1 a::after {
+  content: '#';
+  display: inline-block;
+  vertical-align: middle;
+  font-size: 20px;
+}
+
 article h1 {
   margin-bottom: 1rem;
   margin-top: 0.5rem;
@@ -1557,6 +1632,33 @@ article h1 {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
+article h2 a {
+  float: left;
+  margin-top: 0.1em;
+  margin-left: -24px;
+  width: 20px;
+  padding-right: 4px;
+  line-height: 1;
+  box-sizing: border-box;
+  background: none;
+  opacity: 0;
+}
+
+article h2:hover a {
+  opacity: 1;
+}
+
+article h2 span {
+  display: none;
+}
+
+article h2 a::after {
+  content: '#';
+  display: inline-block;
+  vertical-align: middle;
+  font-size: 20px;
+}
+
 article h2 {
   margin-top: 2.5rem;
   font-size: 1.875rem;
@@ -1575,6 +1677,33 @@ article h2 {
   padding-bottom: 0.25rem;
 }
 
+article h3 a {
+  float: left;
+  margin-top: 0.1em;
+  margin-left: -24px;
+  width: 20px;
+  padding-right: 4px;
+  line-height: 1;
+  box-sizing: border-box;
+  background: none;
+  opacity: 0;
+}
+
+article h3:hover a {
+  opacity: 1;
+}
+
+article h3 span {
+  display: none;
+}
+
+article h3 a::after {
+  content: '#';
+  display: inline-block;
+  vertical-align: middle;
+  font-size: 20px;
+}
+
 article h3 {
   margin-top: 2rem;
   font-size: 1.5rem;
@@ -1588,6 +1717,33 @@ article h3 {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
+article h4 a {
+  float: left;
+  margin-top: 0.1em;
+  margin-left: -24px;
+  width: 20px;
+  padding-right: 4px;
+  line-height: 1;
+  box-sizing: border-box;
+  background: none;
+  opacity: 0;
+}
+
+article h4:hover a {
+  opacity: 1;
+}
+
+article h4 span {
+  display: none;
+}
+
+article h4 a::after {
+  content: '#';
+  display: inline-block;
+  vertical-align: middle;
+  font-size: 20px;
+}
+
 article h4 {
   margin-top: 2rem;
   font-size: 1.25rem;
@@ -1601,6 +1757,33 @@ article h4 {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
+article h5 a {
+  float: left;
+  margin-top: 0.1em;
+  margin-left: -24px;
+  width: 20px;
+  padding-right: 4px;
+  line-height: 1;
+  box-sizing: border-box;
+  background: none;
+  opacity: 0;
+}
+
+article h5:hover a {
+  opacity: 1;
+}
+
+article h5 span {
+  display: none;
+}
+
+article h5 a::after {
+  content: '#';
+  display: inline-block;
+  vertical-align: middle;
+  font-size: 20px;
+}
+
 article h5 {
   margin-top: 2rem;
   font-size: 1.125rem;
@@ -1614,6 +1797,33 @@ article h5 {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
+article h6 a {
+  float: left;
+  margin-top: 0.1em;
+  margin-left: -24px;
+  width: 20px;
+  padding-right: 4px;
+  line-height: 1;
+  box-sizing: border-box;
+  background: none;
+  opacity: 0;
+}
+
+article h6:hover a {
+  opacity: 1;
+}
+
+article h6 span {
+  display: none;
+}
+
+article h6 a::after {
+  content: '#';
+  display: inline-block;
+  vertical-align: middle;
+  font-size: 20px;
+}
+
 article h6 {
   margin-top: 2rem;
   font-size: 1rem;
@@ -1793,6 +2003,32 @@ article div[data-rehype-pretty-code-fragment] {
   margin-bottom: 1rem;
 }
 
+article .tabbed-code div[data-rehype-pretty-code-fragment] {
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+article .tabbed-code pre {
+  border-radius: 0px;
+  border-bottom-right-radius: 0.375rem;
+  border-bottom-left-radius: 0.375rem;
+  border-top-right-radius: 0.375rem;
+}
+
+article .tabbed-code .tabbed-tab-button {
+  display: inline-flex;
+  align-items: center;
+  border-top-left-radius: 0.5rem;
+  border-top-right-radius: 0.5rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+}
+
+article .tabbed-code .tabbed-tab-button * {
+  margin-top: 0px;
+  color: inherit;
+}
+
 /* 代码块的标题部分 */
 
 article
@@ -2203,6 +2439,11 @@ h6 {
   border-color: rgb(243 244 246 / var(--tw-border-opacity));
 }
 
+.hover\:border-gray-300:hover {
+  --tw-border-opacity: 1;
+  border-color: rgb(209 213 219 / var(--tw-border-opacity));
+}
+
 .hover\:bg-gray-50:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(249 250 251 / var(--tw-bg-opacity));
@@ -2218,6 +2459,16 @@ h6 {
   color: rgb(59 130 246 / var(--tw-text-opacity));
 }
 
+.hover\:text-gray-700:hover {
+  --tw-text-opacity: 1;
+  color: rgb(55 65 81 / var(--tw-text-opacity));
+}
+
+.hover\:text-neutral-300:hover {
+  --tw-text-opacity: 1;
+  color: rgb(212 212 212 / var(--tw-text-opacity));
+}
+
 .hover\:shadow-2xl:hover {
   --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
   --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
@@ -2375,6 +2626,11 @@ h6 {
   color: rgb(59 130 246 / var(--tw-text-opacity));
 }
 
+.dark .dark\:hover\:text-gray-300:hover {
+  --tw-text-opacity: 1;
+  color: rgb(209 213 219 / var(--tw-text-opacity));
+}
+
 @media (min-width: 768px) {
   .md\:h-6 {
     height: 1.5rem;

package/compiled/rehype-autolink-headings/LICENSE

@@ -0,0 +1,22 @@
+(The MIT License)
+
+Copyright (c) 2016 Titus Wormer <tituswormer@gmail.com>
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+'Software'), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
+CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
+SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/compiled/rehype-autolink-headings/index.js

@@ -0,0 +1 @@
+(function(){"use strict";var e={980:function(e){var t=Object.prototype.hasOwnProperty;var n=Object.prototype.toString;var r=Object.defineProperty;var o=Object.getOwnPropertyDescriptor;var i=function isArray(e){if(typeof Array.isArray==="function"){return Array.isArray(e)}return n.call(e)==="[object Array]"};var u=function isPlainObject(e){if(!e||n.call(e)!=="[object Object]"){return false}var r=t.call(e,"constructor");var o=e.constructor&&e.constructor.prototype&&t.call(e.constructor.prototype,"isPrototypeOf");if(e.constructor&&!r&&!o){return false}var i;for(i in e){}return typeof i==="undefined"||t.call(e,i)};var a=function setProperty(e,t){if(r&&t.name==="__proto__"){r(e,t.name,{enumerable:true,configurable:true,value:t.newValue,writable:true})}else{e[t.name]=t.newValue}};var c=function getProperty(e,n){if(n==="__proto__"){if(!t.call(e,n)){return void 0}else if(o){return o(e,n).value}}return e[n]};e.exports=function extend(){var e,t,n,r,o,f;var l=arguments[0];var s=1;var p=arguments.length;var y=false;if(typeof l==="boolean"){y=l;l=arguments[1]||{};s=2}if(l==null||typeof l!=="object"&&typeof l!=="function"){l={}}for(;s<p;++s){e=arguments[s];if(e!=null){for(t in e){n=c(l,t);r=c(e,t);if(l!==r){if(y&&r&&(u(r)||(o=i(r)))){if(o){o=false;f=n&&i(n)?n:[]}else{f=n&&u(n)?n:{}}a(l,{name:t,newValue:extend(y,f,r)})}else if(typeof r!=="undefined"){a(l,{name:t,newValue:r})}}}}}return l}}};var t={};function __nccwpck_require__(n){var r=t[n];if(r!==undefined){return r.exports}var o=t[n]={exports:{}};var i=true;try{e[n](o,o.exports,__nccwpck_require__);i=false}finally{if(i)delete t[n]}return o.exports}!function(){__nccwpck_require__.d=function(e,t){for(var n in t){if(__nccwpck_require__.o(t,n)&&!__nccwpck_require__.o(e,n)){Object.defineProperty(e,n,{enumerable:true,get:t[n]})}}}}();!function(){__nccwpck_require__.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)}}();!function(){__nccwpck_require__.r=function(e){if(typeof Symbol!=="undefined"&&Symbol.toStringTag){Object.defineProperty(e,Symbol.toStringTag,{value:"Module"})}Object.defineProperty(e,"__esModule",{value:true})}}();if(typeof __nccwpck_require__!=="undefined")__nccwpck_require__.ab=__dirname+"/";var n={};!function(){__nccwpck_require__.r(n);__nccwpck_require__.d(n,{default:function(){return rehypeAutolinkHeadings}});var e=__nccwpck_require__(980);var t={}.hasOwnProperty;function hasProperty(e,n){var r=n&&e&&typeof e==="object"&&e.type==="element"&&e.properties&&t.call(e.properties,n)&&e.properties[n];return r!==null&&r!==undefined&&r!==false}function headingRank(e){var t=e&&e.type==="element"&&e.tagName.toLowerCase()||"";var n=t.length===2&&t.charCodeAt(0)===104?t.charCodeAt(1):0;return n>48&&n<55?n-48:null}const isElement=function(e,t,n,r,o){const i=convertElement(t);if(n!==undefined&&n!==null&&(typeof n!=="number"||n<0||n===Number.POSITIVE_INFINITY)){throw new Error("Expected positive finite index for child node")}if(r!==undefined&&r!==null&&(!r.type||!r.children)){throw new Error("Expected parent node")}if(!e||!e.type||typeof e.type!=="string"){return false}if((r===undefined||r===null)!==(n===undefined||n===null)){throw new Error("Expected both parent and index")}return i.call(o,e,n,r)};const convertElement=function(e){if(e===undefined||e===null){return hast_util_is_element_element}if(typeof e==="string"){return tagNameFactory(e)}if(typeof e==="object"){return anyFactory(e)}if(typeof e==="function"){return castFactory(e)}throw new Error("Expected function, string, or array as test")};function anyFactory(e){const t=[];let n=-1;while(++n<e.length){t[n]=convertElement(e[n])}return castFactory(any);function any(...e){let n=-1;while(++n<t.length){if(t[n].call(this,...e)){return true}}return false}}function tagNameFactory(e){return tagName;function tagName(t){return hast_util_is_element_element(t)&&t.tagName===e}}function castFactory(e){return assertion;function assertion(t,...n){return hast_util_is_element_element(t)&&Boolean(e.call(this,t,...n))}}function hast_util_is_element_element(e){return Boolean(e&&typeof e==="object"&&e.type==="element"&&typeof e.tagName==="string")}const r=function is(e,t,n,r,o){const i=convert(t);if(n!==undefined&&n!==null&&(typeof n!=="number"||n<0||n===Number.POSITIVE_INFINITY)){throw new Error("Expected positive finite index")}if(r!==undefined&&r!==null&&(!is(r)||!r.children)){throw new Error("Expected parent node")}if((r===undefined||r===null)!==(n===undefined||n===null)){throw new Error("Expected both parent and index")}return e&&e.type&&typeof e.type==="string"?Boolean(i.call(o,e,n,r)):false};const convert=function(e){if(e===undefined||e===null){return ok}if(typeof e==="string"){return typeFactory(e)}if(typeof e==="object"){return Array.isArray(e)?unist_util_is_anyFactory(e):propsFactory(e)}if(typeof e==="function"){return unist_util_is_castFactory(e)}throw new Error("Expected function, string, or object as test")};function unist_util_is_anyFactory(e){const t=[];let n=-1;while(++n<e.length){t[n]=convert(e[n])}return unist_util_is_castFactory(any);function any(...e){let n=-1;while(++n<t.length){if(t[n].call(this,...e))return true}return false}}function propsFactory(e){return unist_util_is_castFactory(all);function all(t){let n;for(n in e){if(t[n]!==e[n])return false}return true}}function typeFactory(e){return unist_util_is_castFactory(type);function type(t){return t&&t.type===e}}function unist_util_is_castFactory(e){return assertion;function assertion(...t){return Boolean(e.call(this,...t))}}function ok(){return true}function color(e){return""+e+""}const o=true;const i="skip";const u=false;const visitParents=function(e,t,n,r){if(typeof t==="function"&&typeof n!=="function"){r=n;n=t;t=null}const o=convert(t);const a=r?-1:1;factory(e,null,[])();function factory(e,c,f){const l=typeof e==="object"&&e!==null?e:{};let s;if(typeof l.type==="string"){s=typeof l.tagName==="string"?l.tagName:typeof l.name==="string"?l.name:undefined;Object.defineProperty(visit,"name",{value:"node ("+color(l.type+(s?"<"+s+">":""))+")"})}return visit;function visit(){let l=[];let s;let p;let y;if(!t||o(e,c,f[f.length-1]||null)){l=toResult(n(e,f));if(l[0]===u){return l}}if(e.children&&l[0]!==i){p=(r?e.children.length:-1)+a;y=f.concat(e);while(p>-1&&p<e.children.length){s=factory(e.children[p],p,y)();if(s[0]===u){return s}p=typeof s[1]==="number"?s[1]:p+a}}return l}}};function toResult(e){if(Array.isArray(e)){return e}if(typeof e==="number"){return[o,e]}return[e]}const visit=function(e,t,n,r){if(typeof t==="function"&&typeof n!=="function"){r=n;n=t;t=null}visitParents(e,t,overload,r);function overload(e,t){const r=t[t.length-1];return n(e,r?r.children.indexOf(e):null,r)}};const a={type:"element",tagName:"span",properties:{className:["icon","icon-link"]},children:[]};function rehypeAutolinkHeadings(t={}){let n=t.properties;const r=t.behaviour||t.behavior||"prepend";const o=t.content||a;const u=t.group;const c=convertElement(t.test);let f;if(r==="wrap"){f=wrap}else if(r==="before"||r==="after"){f=around}else{if(!n){n={ariaHidden:"true",tabIndex:-1}}f=inject}return e=>{visit(e,"element",((e,t,n)=>{if(headingRank(e)&&hasProperty(e,"id")&&c(e,t,n)){return f(e,t,n)}}))};function inject(t){t.children[r==="prepend"?"unshift":"push"](create(t,e(true,{},n),toChildren(o,t)));return[i]}function around(t,a,c){if(typeof a!=="number"||!c)return;const f=create(t,e(true,{},n),toChildren(o,t));let l=r==="before"?[f,t]:[t,f];if(u){const e=toNode(u,t);if(e&&!Array.isArray(e)&&e.type==="element"){e.children=l;l=[e]}}c.children.splice(a,1,...l);return[i,a+l.length]}function wrap(t){t.children=[create(t,e(true,{},n),t.children)];return[i]}function toChildren(e,t){const n=toNode(e,t);return Array.isArray(n)?n:[n]}function toNode(t,n){if(typeof t==="function")return t(n);return e(true,Array.isArray(t)?[]:{},t)}function create(e,t,n){return{type:"element",tagName:"a",properties:Object.assign({},t,{href:"#"+(e.properties||{}).id}),children:n}}}}();module.exports=n})();

package/compiled/rehype-autolink-headings/package.json

@@ -0,0 +1 @@
+{"name":"rehype-autolink-headings","author":"Titus Wormer <tituswormer@gmail.com> (https://wooorm.com)","license":"MIT","types":"index.d.ts"}

package/dist/compiler.js

@@ -12,6 +12,8 @@ const mdx_1 = require("../compiled/@mdx-js/mdx");
 const rehype_slug_1 = __importDefault(require("../compiled/rehype-slug"));
 // @ts-ignore
 const remark_gfm_1 = __importDefault(require("../compiled/remark-gfm"));
+// @ts-ignore
+const rehype_autolink_headings_1 = __importDefault(require("../compiled/rehype-autolink-headings"));
 // https://rehype-pretty-code.netlify.app
 const rehypePrettyCodeOptions = {
     theme: 'dark-plus',
@@ -37,7 +39,11 @@ async function compile(opts) {
     const compiler = (0, mdx_1.createProcessor)({
         jsx: true,
         remarkPlugins: [remark_gfm_1.default],
-        rehypePlugins: [rehype_slug_1.default, [rehype_pretty_code_1.default, rehypePrettyCodeOptions]],
+        rehypePlugins: [
+            rehype_slug_1.default,
+            [rehype_pretty_code_1.default, rehypePrettyCodeOptions],
+            rehype_autolink_headings_1.default,
+        ],
     });
     try {
         let result = String(await compiler.process(opts.content));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umijs/plugin-docs",
-  "version": "4.0.4",
+  "version": "4.0.7",
   "description": "@umijs/plugin-docs",
   "homepage": "https://github.com/umijs/umi/tree/master/packages/plugin-docs#readme",
   "bugs": "https://github.com/umijs/umi/issues",
@@ -22,7 +22,7 @@
     "build:deps": "umi-scripts bundleDeps",
     "build:extra": "pnpm build:css",
     "dev": "pnpm build --watch",
-    "dev:css": "pnpm build:css -- --watch",
+    "dev:css": "pnpm build:css --watch",
     "test": "umi-scripts jest-turbo"
   },
   "dependencies": {
@@ -36,10 +36,11 @@
     "@types/keymaster": "^1.6.30",
     "@types/react-helmet": "^6.1.5",
     "classnames": "^2.3.1",
+    "rehype-autolink-headings": "^6.1.1",
     "rehype-slug": "5.0.1",
     "remark-gfm": "^3.0.1",
     "tailwindcss": "^3.0.24",
-    "umi": "4.0.4"
+    "umi": "4.0.7"
   },
   "publishConfig": {
     "access": "public"
@@ -51,13 +52,15 @@
     "deps": [
       "@mdx-js/mdx",
       "rehype-slug",
-      "remark-gfm"
+      "remark-gfm",
+      "rehype-autolink-headings"
     ],
     "externals": {},
     "excludeDtsDeps": [
       "@mdx-js/mdx",
       "rehype-slug",
-      "remark-gfm"
+      "remark-gfm",
+      "rehype-autolink-headings"
     ]
   }
 }