diff --git a/examples/tree-shaking-create-react-app/README.md b/examples/tree-shaking-create-react-app/README.md
index 4788aba38..1ca4b8d03 100644
--- a/examples/tree-shaking-create-react-app/README.md
+++ b/examples/tree-shaking-create-react-app/README.md
@@ -1,23 +1,3 @@
## Tree shaking for create react app
-This is example of `tree-shaking` for [create-react-app](https://github.com/facebook/create-react-app).
-By default, we do not `eject` configs from `create-react-app`, in this example,
-we use [react-app-rewired](https://github.com/timarney/react-app-rewired) to change the default configs.
-
-### About
-
-- Add `config-overrides.js` to your root folder.
-- Add deps: `yarn add babel-plugin-import customize-cra react-app-rewired -D`
-- Replace your default scripts(`react-scripts`) with `react-app-rewired`.
-
-### Previews
-
-**Before:**
-
-![before](public/esm-1.png)
-
-
-
-**After:**
-
-![after](public/esm-2.png)
+Full tree-shaking is automatically available without any configuration when using `react-scripts 5.0.0` or higher. (`webpack > 5.0`)
diff --git a/examples/tree-shaking-create-react-app/build/asset-manifest.json b/examples/tree-shaking-create-react-app/build/asset-manifest.json
new file mode 100644
index 000000000..c592b8357
--- /dev/null
+++ b/examples/tree-shaking-create-react-app/build/asset-manifest.json
@@ -0,0 +1,10 @@
+{
+ "files": {
+ "main.js": "/static/js/main.c0df7028.js",
+ "index.html": "/index.html",
+ "main.c0df7028.js.map": "/static/js/main.c0df7028.js.map"
+ },
+ "entrypoints": [
+ "static/js/main.c0df7028.js"
+ ]
+}
\ No newline at end of file
diff --git a/examples/tree-shaking-create-react-app/public/esm-1.png b/examples/tree-shaking-create-react-app/build/esm-1.png
similarity index 100%
rename from examples/tree-shaking-create-react-app/public/esm-1.png
rename to examples/tree-shaking-create-react-app/build/esm-1.png
diff --git a/examples/tree-shaking-create-react-app/public/esm-2.png b/examples/tree-shaking-create-react-app/build/esm-2.png
similarity index 100%
rename from examples/tree-shaking-create-react-app/public/esm-2.png
rename to examples/tree-shaking-create-react-app/build/esm-2.png
diff --git a/examples/tree-shaking-create-react-app/build/index.html b/examples/tree-shaking-create-react-app/build/index.html
new file mode 100644
index 000000000..bdb9ec052
--- /dev/null
+++ b/examples/tree-shaking-create-react-app/build/index.html
@@ -0,0 +1 @@
+
Tree Shaking
\ No newline at end of file
diff --git a/examples/tree-shaking-create-react-app/build/static/js/main.c0df7028.js b/examples/tree-shaking-create-react-app/build/static/js/main.c0df7028.js
new file mode 100644
index 000000000..0fb745088
--- /dev/null
+++ b/examples/tree-shaking-create-react-app/build/static/js/main.c0df7028.js
@@ -0,0 +1,3 @@
+/*! For license information please see main.c0df7028.js.LICENSE.txt */
+!function(){"use strict";var e={725:function(e){var t=Object.getOwnPropertySymbols,n=Object.prototype.hasOwnProperty,r=Object.prototype.propertyIsEnumerable;function a(e){if(null===e||void 0===e)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(e)}e.exports=function(){try{if(!Object.assign)return!1;var e=new String("abc");if(e[5]="de","5"===Object.getOwnPropertyNames(e)[0])return!1;for(var t={},n=0;n<10;n++)t["_"+String.fromCharCode(n)]=n;if("0123456789"!==Object.getOwnPropertyNames(t).map((function(e){return t[e]})).join(""))return!1;var r={};return"abcdefghijklmnopqrst".split("").forEach((function(e){r[e]=e})),"abcdefghijklmnopqrst"===Object.keys(Object.assign({},r)).join("")}catch(a){return!1}}()?Object.assign:function(e,o){for(var l,i,u=a(e),c=1;ct}return!1}(t,n,a,r)&&(n=null),r||null===a?function(e){return!!p.call(h,e)||!p.call(m,e)&&(d.test(e)?h[e]=!0:(m[e]=!0,!1))}(t)&&(null===n?e.removeAttribute(t):e.setAttribute(t,""+n)):a.mustUseProperty?e[a.propertyName]=null===n?3!==a.type&&"":n:(t=a.attributeName,r=a.attributeNamespace,null===n?e.removeAttribute(t):(n=3===(a=a.type)||4===a&&!0===n?"":""+n,r?e.setAttributeNS(r,t,n):e.setAttribute(t,n))))}"accent-height alignment-baseline arabic-form baseline-shift cap-height clip-path clip-rule color-interpolation color-interpolation-filters color-profile color-rendering dominant-baseline enable-background fill-opacity fill-rule flood-color flood-opacity font-family font-size font-size-adjust font-stretch font-style font-variant font-weight glyph-name glyph-orientation-horizontal glyph-orientation-vertical horiz-adv-x horiz-origin-x image-rendering letter-spacing lighting-color marker-end marker-mid marker-start overline-position overline-thickness paint-order panose-1 pointer-events rendering-intent shape-rendering stop-color stop-opacity strikethrough-position strikethrough-thickness stroke-dasharray stroke-dashoffset stroke-linecap stroke-linejoin stroke-miterlimit stroke-opacity stroke-width text-anchor text-decoration text-rendering underline-position underline-thickness unicode-bidi unicode-range units-per-em v-alphabetic v-hanging v-ideographic v-mathematical vector-effect vert-adv-y vert-origin-x vert-origin-y word-spacing writing-mode xmlns:xlink x-height".split(" ").forEach((function(e){var t=e.replace(v,b);y[t]=new g(t,1,!1,e,null,!1,!1)})),"xlink:actuate xlink:arcrole xlink:role xlink:show xlink:title xlink:type".split(" ").forEach((function(e){var t=e.replace(v,b);y[t]=new g(t,1,!1,e,"http://www.w3.org/1999/xlink",!1,!1)})),["xml:base","xml:lang","xml:space"].forEach((function(e){var t=e.replace(v,b);y[t]=new g(t,1,!1,e,"http://www.w3.org/XML/1998/namespace",!1,!1)})),["tabIndex","crossOrigin"].forEach((function(e){y[e]=new g(e,1,!1,e.toLowerCase(),null,!1,!1)})),y.xlinkHref=new g("xlinkHref",1,!1,"xlink:href","http://www.w3.org/1999/xlink",!0,!1),["src","href","action","formAction"].forEach((function(e){y[e]=new g(e,1,!1,e.toLowerCase(),null,!0,!0)}));var k=r.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED,x=60103,S=60106,_=60107,E=60108,C=60114,N=60109,T=60110,z=60112,P=60113,L=60120,R=60115,O=60116,j=60121,M=60128,I=60129,F=60130,D=60131;if("function"===typeof Symbol&&Symbol.for){var A=Symbol.for;x=A("react.element"),S=A("react.portal"),_=A("react.fragment"),E=A("react.strict_mode"),C=A("react.profiler"),N=A("react.provider"),T=A("react.context"),z=A("react.forward_ref"),P=A("react.suspense"),L=A("react.suspense_list"),R=A("react.memo"),O=A("react.lazy"),j=A("react.block"),A("react.scope"),M=A("react.opaque.id"),I=A("react.debug_trace_mode"),F=A("react.offscreen"),D=A("react.legacy_hidden")}var U,B="function"===typeof Symbol&&Symbol.iterator;function H(e){return null===e||"object"!==typeof e?null:"function"===typeof(e=B&&e[B]||e["@@iterator"])?e:null}function V(e){if(void 0===U)try{throw Error()}catch(n){var t=n.stack.trim().match(/\n( *(at )?)/);U=t&&t[1]||""}return"\n"+U+e}var W=!1;function $(e,t){if(!e||W)return"";W=!0;var n=Error.prepareStackTrace;Error.prepareStackTrace=void 0;try{if(t)if(t=function(){throw Error()},Object.defineProperty(t.prototype,"props",{set:function(){throw Error()}}),"object"===typeof Reflect&&Reflect.construct){try{Reflect.construct(t,[])}catch(u){var r=u}Reflect.construct(e,[],t)}else{try{t.call()}catch(u){r=u}e.call(t.prototype)}else{try{throw Error()}catch(u){r=u}e()}}catch(u){if(u&&r&&"string"===typeof u.stack){for(var a=u.stack.split("\n"),o=r.stack.split("\n"),l=a.length-1,i=o.length-1;1<=l&&0<=i&&a[l]!==o[i];)i--;for(;1<=l&&0<=i;l--,i--)if(a[l]!==o[i]){if(1!==l||1!==i)do{if(l--,0>--i||a[l]!==o[i])return"\n"+a[l].replace(" at new "," at ")}while(1<=l&&0<=i);break}}}finally{W=!1,Error.prepareStackTrace=n}return(e=e?e.displayName||e.name:"")?V(e):""}function Q(e){switch(e.tag){case 5:return V(e.type);case 16:return V("Lazy");case 13:return V("Suspense");case 19:return V("SuspenseList");case 0:case 2:case 15:return e=$(e.type,!1);case 11:return e=$(e.type.render,!1);case 22:return e=$(e.type._render,!1);case 1:return e=$(e.type,!0);default:return""}}function q(e){if(null==e)return null;if("function"===typeof e)return e.displayName||e.name||null;if("string"===typeof e)return e;switch(e){case _:return"Fragment";case S:return"Portal";case C:return"Profiler";case E:return"StrictMode";case P:return"Suspense";case L:return"SuspenseList"}if("object"===typeof e)switch(e.$$typeof){case T:return(e.displayName||"Context")+".Consumer";case N:return(e._context.displayName||"Context")+".Provider";case z:var t=e.render;return t=t.displayName||t.name||"",e.displayName||(""!==t?"ForwardRef("+t+")":"ForwardRef");case R:return q(e.type);case j:return q(e._render);case O:t=e._payload,e=e._init;try{return q(e(t))}catch(n){}}return null}function K(e){switch(typeof e){case"boolean":case"number":case"object":case"string":case"undefined":return e;default:return""}}function G(e){var t=e.type;return(e=e.nodeName)&&"input"===e.toLowerCase()&&("checkbox"===t||"radio"===t)}function Y(e){e._valueTracker||(e._valueTracker=function(e){var t=G(e)?"checked":"value",n=Object.getOwnPropertyDescriptor(e.constructor.prototype,t),r=""+e[t];if(!e.hasOwnProperty(t)&&"undefined"!==typeof n&&"function"===typeof n.get&&"function"===typeof n.set){var a=n.get,o=n.set;return Object.defineProperty(e,t,{configurable:!0,get:function(){return a.call(this)},set:function(e){r=""+e,o.call(this,e)}}),Object.defineProperty(e,t,{enumerable:n.enumerable}),{getValue:function(){return r},setValue:function(e){r=""+e},stopTracking:function(){e._valueTracker=null,delete e[t]}}}}(e))}function X(e){if(!e)return!1;var t=e._valueTracker;if(!t)return!0;var n=t.getValue(),r="";return e&&(r=G(e)?e.checked?"true":"false":e.value),(e=r)!==n&&(t.setValue(e),!0)}function Z(e){if("undefined"===typeof(e=e||("undefined"!==typeof document?document:void 0)))return null;try{return e.activeElement||e.body}catch(t){return e.body}}function J(e,t){var n=t.checked;return a({},t,{defaultChecked:void 0,defaultValue:void 0,value:void 0,checked:null!=n?n:e._wrapperState.initialChecked})}function ee(e,t){var n=null==t.defaultValue?"":t.defaultValue,r=null!=t.checked?t.checked:t.defaultChecked;n=K(null!=t.value?t.value:n),e._wrapperState={initialChecked:r,initialValue:n,controlled:"checkbox"===t.type||"radio"===t.type?null!=t.checked:null!=t.value}}function te(e,t){null!=(t=t.checked)&&w(e,"checked",t,!1)}function ne(e,t){te(e,t);var n=K(t.value),r=t.type;if(null!=n)"number"===r?(0===n&&""===e.value||e.value!=n)&&(e.value=""+n):e.value!==""+n&&(e.value=""+n);else if("submit"===r||"reset"===r)return void e.removeAttribute("value");t.hasOwnProperty("value")?ae(e,t.type,n):t.hasOwnProperty("defaultValue")&&ae(e,t.type,K(t.defaultValue)),null==t.checked&&null!=t.defaultChecked&&(e.defaultChecked=!!t.defaultChecked)}function re(e,t,n){if(t.hasOwnProperty("value")||t.hasOwnProperty("defaultValue")){var r=t.type;if(!("submit"!==r&&"reset"!==r||void 0!==t.value&&null!==t.value))return;t=""+e._wrapperState.initialValue,n||t===e.value||(e.value=t),e.defaultValue=t}""!==(n=e.name)&&(e.name=""),e.defaultChecked=!!e._wrapperState.initialChecked,""!==n&&(e.name=n)}function ae(e,t,n){"number"===t&&Z(e.ownerDocument)===e||(null==n?e.defaultValue=""+e._wrapperState.initialValue:e.defaultValue!==""+n&&(e.defaultValue=""+n))}function oe(e,t){return e=a({children:void 0},t),(t=function(e){var t="";return r.Children.forEach(e,(function(e){null!=e&&(t+=e)})),t}(t.children))&&(e.children=t),e}function le(e,t,n,r){if(e=e.options,t){t={};for(var a=0;a=n.length))throw Error(l(93));n=n[0]}t=n}null==t&&(t=""),n=t}e._wrapperState={initialValue:K(n)}}function ce(e,t){var n=K(t.value),r=K(t.defaultValue);null!=n&&((n=""+n)!==e.value&&(e.value=n),null==t.defaultValue&&e.defaultValue!==n&&(e.defaultValue=n)),null!=r&&(e.defaultValue=""+r)}function se(e){var t=e.textContent;t===e._wrapperState.initialValue&&""!==t&&null!==t&&(e.value=t)}var fe="http://www.w3.org/1999/xhtml",de="http://www.w3.org/2000/svg";function pe(e){switch(e){case"svg":return"http://www.w3.org/2000/svg";case"math":return"http://www.w3.org/1998/Math/MathML";default:return"http://www.w3.org/1999/xhtml"}}function me(e,t){return null==e||"http://www.w3.org/1999/xhtml"===e?pe(t):"http://www.w3.org/2000/svg"===e&&"foreignObject"===t?"http://www.w3.org/1999/xhtml":e}var he,ge,ye=(ge=function(e,t){if(e.namespaceURI!==de||"innerHTML"in e)e.innerHTML=t;else{for((he=he||document.createElement("div")).innerHTML="",t=he.firstChild;e.firstChild;)e.removeChild(e.firstChild);for(;t.firstChild;)e.appendChild(t.firstChild)}},"undefined"!==typeof MSApp&&MSApp.execUnsafeLocalFunction?function(e,t,n,r){MSApp.execUnsafeLocalFunction((function(){return ge(e,t)}))}:ge);function ve(e,t){if(t){var n=e.firstChild;if(n&&n===e.lastChild&&3===n.nodeType)return void(n.nodeValue=t)}e.textContent=t}var be={animationIterationCount:!0,borderImageOutset:!0,borderImageSlice:!0,borderImageWidth:!0,boxFlex:!0,boxFlexGroup:!0,boxOrdinalGroup:!0,columnCount:!0,columns:!0,flex:!0,flexGrow:!0,flexPositive:!0,flexShrink:!0,flexNegative:!0,flexOrder:!0,gridArea:!0,gridRow:!0,gridRowEnd:!0,gridRowSpan:!0,gridRowStart:!0,gridColumn:!0,gridColumnEnd:!0,gridColumnSpan:!0,gridColumnStart:!0,fontWeight:!0,lineClamp:!0,lineHeight:!0,opacity:!0,order:!0,orphans:!0,tabSize:!0,widows:!0,zIndex:!0,zoom:!0,fillOpacity:!0,floodOpacity:!0,stopOpacity:!0,strokeDasharray:!0,strokeDashoffset:!0,strokeMiterlimit:!0,strokeOpacity:!0,strokeWidth:!0},we=["Webkit","ms","Moz","O"];function ke(e,t,n){return null==t||"boolean"===typeof t||""===t?"":n||"number"!==typeof t||0===t||be.hasOwnProperty(e)&&be[e]?(""+t).trim():t+"px"}function xe(e,t){for(var n in e=e.style,t)if(t.hasOwnProperty(n)){var r=0===n.indexOf("--"),a=ke(n,t[n],r);"float"===n&&(n="cssFloat"),r?e.setProperty(n,a):e[n]=a}}Object.keys(be).forEach((function(e){we.forEach((function(t){t=t+e.charAt(0).toUpperCase()+e.substring(1),be[t]=be[e]}))}));var Se=a({menuitem:!0},{area:!0,base:!0,br:!0,col:!0,embed:!0,hr:!0,img:!0,input:!0,keygen:!0,link:!0,meta:!0,param:!0,source:!0,track:!0,wbr:!0});function _e(e,t){if(t){if(Se[e]&&(null!=t.children||null!=t.dangerouslySetInnerHTML))throw Error(l(137,e));if(null!=t.dangerouslySetInnerHTML){if(null!=t.children)throw Error(l(60));if("object"!==typeof t.dangerouslySetInnerHTML||!("__html"in t.dangerouslySetInnerHTML))throw Error(l(61))}if(null!=t.style&&"object"!==typeof t.style)throw Error(l(62))}}function Ee(e,t){if(-1===e.indexOf("-"))return"string"===typeof t.is;switch(e){case"annotation-xml":case"color-profile":case"font-face":case"font-face-src":case"font-face-uri":case"font-face-format":case"font-face-name":case"missing-glyph":return!1;default:return!0}}function Ce(e){return(e=e.target||e.srcElement||window).correspondingUseElement&&(e=e.correspondingUseElement),3===e.nodeType?e.parentNode:e}var Ne=null,Te=null,ze=null;function Pe(e){if(e=ra(e)){if("function"!==typeof Ne)throw Error(l(280));var t=e.stateNode;t&&(t=oa(t),Ne(e.stateNode,e.type,t))}}function Le(e){Te?ze?ze.push(e):ze=[e]:Te=e}function Re(){if(Te){var e=Te,t=ze;if(ze=Te=null,Pe(e),t)for(e=0;e(r=31-Wt(r))?0:1<n;n++)t.push(e);return t}function Vt(e,t,n){e.pendingLanes|=t;var r=t-1;e.suspendedLanes&=r,e.pingedLanes&=r,(e=e.eventTimes)[t=31-Wt(t)]=n}var Wt=Math.clz32?Math.clz32:function(e){return 0===e?32:31-($t(e)/Qt|0)|0},$t=Math.log,Qt=Math.LN2;var qt=o.unstable_UserBlockingPriority,Kt=o.unstable_runWithPriority,Gt=!0;function Yt(e,t,n,r){Fe||Me();var a=Zt,o=Fe;Fe=!0;try{je(a,e,t,n,r)}finally{(Fe=o)||Ae()}}function Xt(e,t,n,r){Kt(qt,Zt.bind(null,e,t,n,r))}function Zt(e,t,n,r){var a;if(Gt)if((a=0===(4&t))&&0=Dn),Bn=String.fromCharCode(32),Hn=!1;function Vn(e,t){switch(e){case"keyup":return-1!==In.indexOf(t.keyCode);case"keydown":return 229!==t.keyCode;case"keypress":case"mousedown":case"focusout":return!0;default:return!1}}function Wn(e){return"object"===typeof(e=e.detail)&&"data"in e?e.data:null}var $n=!1;var Qn={color:!0,date:!0,datetime:!0,"datetime-local":!0,email:!0,month:!0,number:!0,password:!0,range:!0,search:!0,tel:!0,text:!0,time:!0,url:!0,week:!0};function qn(e){var t=e&&e.nodeName&&e.nodeName.toLowerCase();return"input"===t?!!Qn[e.type]:"textarea"===t}function Kn(e,t,n,r){Le(r),0<(t=Fr(t,"onChange")).length&&(n=new pn("onChange","change",null,n,r),e.push({event:n,listeners:t}))}var Gn=null,Yn=null;function Xn(e){zr(e,0)}function Zn(e){if(X(aa(e)))return e}function Jn(e,t){if("change"===e)return t}var er=!1;if(f){var tr;if(f){var nr="oninput"in document;if(!nr){var rr=document.createElement("div");rr.setAttribute("oninput","return;"),nr="function"===typeof rr.oninput}tr=nr}else tr=!1;er=tr&&(!document.documentMode||9=t)return{node:r,offset:t-e};e=n}e:{for(;r;){if(r.nextSibling){r=r.nextSibling;break e}r=r.parentNode}r=void 0}r=pr(r)}}function hr(e,t){return!(!e||!t)&&(e===t||(!e||3!==e.nodeType)&&(t&&3===t.nodeType?hr(e,t.parentNode):"contains"in e?e.contains(t):!!e.compareDocumentPosition&&!!(16&e.compareDocumentPosition(t))))}function gr(){for(var e=window,t=Z();t instanceof e.HTMLIFrameElement;){try{var n="string"===typeof t.contentWindow.location.href}catch(r){n=!1}if(!n)break;t=Z((e=t.contentWindow).document)}return t}function yr(e){var t=e&&e.nodeName&&e.nodeName.toLowerCase();return t&&("input"===t&&("text"===e.type||"search"===e.type||"tel"===e.type||"url"===e.type||"password"===e.type)||"textarea"===t||"true"===e.contentEditable)}var vr=f&&"documentMode"in document&&11>=document.documentMode,br=null,wr=null,kr=null,xr=!1;function Sr(e,t,n){var r=n.window===n?n.document:9===n.nodeType?n:n.ownerDocument;xr||null==br||br!==Z(r)||("selectionStart"in(r=br)&&yr(r)?r={start:r.selectionStart,end:r.selectionEnd}:r={anchorNode:(r=(r.ownerDocument&&r.ownerDocument.defaultView||window).getSelection()).anchorNode,anchorOffset:r.anchorOffset,focusNode:r.focusNode,focusOffset:r.focusOffset},kr&&dr(kr,r)||(kr=r,0<(r=Fr(wr,"onSelect")).length&&(t=new pn("onSelect","select",null,t,n),e.push({event:t,listeners:r}),t.target=br)))}Mt("cancel cancel click click close close contextmenu contextMenu copy copy cut cut auxclick auxClick dblclick doubleClick dragend dragEnd dragstart dragStart drop drop focusin focus focusout blur input input invalid invalid keydown keyDown keypress keyPress keyup keyUp mousedown mouseDown mouseup mouseUp paste paste pause pause play play pointercancel pointerCancel pointerdown pointerDown pointerup pointerUp ratechange rateChange reset reset seeked seeked submit submit touchcancel touchCancel touchend touchEnd touchstart touchStart volumechange volumeChange".split(" "),0),Mt("drag drag dragenter dragEnter dragexit dragExit dragleave dragLeave dragover dragOver mousemove mouseMove mouseout mouseOut mouseover mouseOver pointermove pointerMove pointerout pointerOut pointerover pointerOver scroll scroll toggle toggle touchmove touchMove wheel wheel".split(" "),1),Mt(jt,2);for(var _r="change selectionchange textInput compositionstart compositionend compositionupdate".split(" "),Er=0;Er<_r.length;Er++)Ot.set(_r[Er],0);s("onMouseEnter",["mouseout","mouseover"]),s("onMouseLeave",["mouseout","mouseover"]),s("onPointerEnter",["pointerout","pointerover"]),s("onPointerLeave",["pointerout","pointerover"]),c("onChange","change click focusin focusout input keydown keyup selectionchange".split(" ")),c("onSelect","focusout contextmenu dragend focusin keydown keyup mousedown mouseup selectionchange".split(" ")),c("onBeforeInput",["compositionend","keypress","textInput","paste"]),c("onCompositionEnd","compositionend focusout keydown keypress keyup mousedown".split(" ")),c("onCompositionStart","compositionstart focusout keydown keypress keyup mousedown".split(" ")),c("onCompositionUpdate","compositionupdate focusout keydown keypress keyup mousedown".split(" "));var Cr="abort canplay canplaythrough durationchange emptied encrypted ended error loadeddata loadedmetadata loadstart pause play playing progress ratechange seeked seeking stalled suspend timeupdate volumechange waiting".split(" "),Nr=new Set("cancel close invalid load scroll toggle".split(" ").concat(Cr));function Tr(e,t,n){var r=e.type||"unknown-event";e.currentTarget=n,function(e,t,n,r,a,o,i,u,c){if(Ge.apply(this,arguments),We){if(!We)throw Error(l(198));var s=$e;We=!1,$e=null,Qe||(Qe=!0,qe=s)}}(r,t,void 0,e),e.currentTarget=null}function zr(e,t){t=0!==(4&t);for(var n=0;nua||(e.current=ia[ua],ia[ua]=null,ua--)}function fa(e,t){ua++,ia[ua]=e.current,e.current=t}var da={},pa=ca(da),ma=ca(!1),ha=da;function ga(e,t){var n=e.type.contextTypes;if(!n)return da;var r=e.stateNode;if(r&&r.__reactInternalMemoizedUnmaskedChildContext===t)return r.__reactInternalMemoizedMaskedChildContext;var a,o={};for(a in n)o[a]=t[a];return r&&((e=e.stateNode).__reactInternalMemoizedUnmaskedChildContext=t,e.__reactInternalMemoizedMaskedChildContext=o),o}function ya(e){return null!==(e=e.childContextTypes)&&void 0!==e}function va(){sa(ma),sa(pa)}function ba(e,t,n){if(pa.current!==da)throw Error(l(168));fa(pa,t),fa(ma,n)}function wa(e,t,n){var r=e.stateNode;if(e=t.childContextTypes,"function"!==typeof r.getChildContext)return n;for(var o in r=r.getChildContext())if(!(o in e))throw Error(l(108,q(t)||"Unknown",o));return a({},n,r)}function ka(e){return e=(e=e.stateNode)&&e.__reactInternalMemoizedMergedChildContext||da,ha=pa.current,fa(pa,e),fa(ma,ma.current),!0}function xa(e,t,n){var r=e.stateNode;if(!r)throw Error(l(169));n?(e=wa(e,t,ha),r.__reactInternalMemoizedMergedChildContext=e,sa(ma),sa(pa),fa(pa,e)):sa(ma),fa(ma,n)}var Sa=null,_a=null,Ea=o.unstable_runWithPriority,Ca=o.unstable_scheduleCallback,Na=o.unstable_cancelCallback,Ta=o.unstable_shouldYield,za=o.unstable_requestPaint,Pa=o.unstable_now,La=o.unstable_getCurrentPriorityLevel,Ra=o.unstable_ImmediatePriority,Oa=o.unstable_UserBlockingPriority,ja=o.unstable_NormalPriority,Ma=o.unstable_LowPriority,Ia=o.unstable_IdlePriority,Fa={},Da=void 0!==za?za:function(){},Aa=null,Ua=null,Ba=!1,Ha=Pa(),Va=1e4>Ha?Pa:function(){return Pa()-Ha};function Wa(){switch(La()){case Ra:return 99;case Oa:return 98;case ja:return 97;case Ma:return 96;case Ia:return 95;default:throw Error(l(332))}}function $a(e){switch(e){case 99:return Ra;case 98:return Oa;case 97:return ja;case 96:return Ma;case 95:return Ia;default:throw Error(l(332))}}function Qa(e,t){return e=$a(e),Ea(e,t)}function qa(e,t,n){return e=$a(e),Ca(e,t,n)}function Ka(){if(null!==Ua){var e=Ua;Ua=null,Na(e)}Ga()}function Ga(){if(!Ba&&null!==Aa){Ba=!0;var e=0;try{var t=Aa;Qa(99,(function(){for(;eh?(g=f,f=null):g=f.sibling;var y=p(a,f,i[h],u);if(null===y){null===f&&(f=g);break}e&&f&&null===y.alternate&&t(a,f),l=o(y,l,h),null===s?c=y:s.sibling=y,s=y,f=g}if(h===i.length)return n(a,f),c;if(null===f){for(;hg?(y=h,h=null):y=h.sibling;var b=p(a,h,v.value,c);if(null===b){null===h&&(h=y);break}e&&h&&null===b.alternate&&t(a,h),i=o(b,i,g),null===f?s=b:f.sibling=b,f=b,h=y}if(v.done)return n(a,h),s;if(null===h){for(;!v.done;g++,v=u.next())null!==(v=d(a,v.value,c))&&(i=o(v,i,g),null===f?s=v:f.sibling=v,f=v);return s}for(h=r(a,h);!v.done;g++,v=u.next())null!==(v=m(h,a,g,v.value,c))&&(e&&null!==v.alternate&&h.delete(null===v.key?g:v.key),i=o(v,i,g),null===f?s=v:f.sibling=v,f=v);return e&&h.forEach((function(e){return t(a,e)})),s}return function(e,r,o,u){var c="object"===typeof o&&null!==o&&o.type===_&&null===o.key;c&&(o=o.props.children);var s="object"===typeof o&&null!==o;if(s)switch(o.$$typeof){case x:e:{for(s=o.key,c=r;null!==c;){if(c.key===s){if(7===c.tag){if(o.type===_){n(e,c.sibling),(r=a(c,o.props.children)).return=e,e=r;break e}}else if(c.elementType===o.type){n(e,c.sibling),(r=a(c,o.props)).ref=_o(e,c,o),r.return=e,e=r;break e}n(e,c);break}t(e,c),c=c.sibling}o.type===_?((r=Ku(o.props.children,e.mode,u,o.key)).return=e,e=r):((u=qu(o.type,o.key,o.props,null,e.mode,u)).ref=_o(e,r,o),u.return=e,e=u)}return i(e);case S:e:{for(c=o.key;null!==r;){if(r.key===c){if(4===r.tag&&r.stateNode.containerInfo===o.containerInfo&&r.stateNode.implementation===o.implementation){n(e,r.sibling),(r=a(r,o.children||[])).return=e,e=r;break e}n(e,r);break}t(e,r),r=r.sibling}(r=Xu(o,e.mode,u)).return=e,e=r}return i(e)}if("string"===typeof o||"number"===typeof o)return o=""+o,null!==r&&6===r.tag?(n(e,r.sibling),(r=a(r,o)).return=e,e=r):(n(e,r),(r=Yu(o,e.mode,u)).return=e,e=r),i(e);if(So(o))return h(e,r,o,u);if(H(o))return g(e,r,o,u);if(s&&Eo(e,o),"undefined"===typeof o&&!c)switch(e.tag){case 1:case 22:case 0:case 11:case 15:throw Error(l(152,q(e.type)||"Component"))}return n(e,r)}}var No=Co(!0),To=Co(!1),zo={},Po=ca(zo),Lo=ca(zo),Ro=ca(zo);function Oo(e){if(e===zo)throw Error(l(174));return e}function jo(e,t){switch(fa(Ro,t),fa(Lo,e),fa(Po,zo),e=t.nodeType){case 9:case 11:t=(t=t.documentElement)?t.namespaceURI:me(null,"");break;default:t=me(t=(e=8===e?t.parentNode:t).namespaceURI||null,e=e.tagName)}sa(Po),fa(Po,t)}function Mo(){sa(Po),sa(Lo),sa(Ro)}function Io(e){Oo(Ro.current);var t=Oo(Po.current),n=me(t,e.type);t!==n&&(fa(Lo,e),fa(Po,n))}function Fo(e){Lo.current===e&&(sa(Po),sa(Lo))}var Do=ca(0);function Ao(e){for(var t=e;null!==t;){if(13===t.tag){var n=t.memoizedState;if(null!==n&&(null===(n=n.dehydrated)||"$?"===n.data||"$!"===n.data))return t}else if(19===t.tag&&void 0!==t.memoizedProps.revealOrder){if(0!==(64&t.flags))return t}else if(null!==t.child){t.child.return=t,t=t.child;continue}if(t===e)break;for(;null===t.sibling;){if(null===t.return||t.return===e)return null;t=t.return}t.sibling.return=t.return,t=t.sibling}return null}var Uo=null,Bo=null,Ho=!1;function Vo(e,t){var n=Wu(5,null,null,0);n.elementType="DELETED",n.type="DELETED",n.stateNode=t,n.return=e,n.flags=8,null!==e.lastEffect?(e.lastEffect.nextEffect=n,e.lastEffect=n):e.firstEffect=e.lastEffect=n}function Wo(e,t){switch(e.tag){case 5:var n=e.type;return null!==(t=1!==t.nodeType||n.toLowerCase()!==t.nodeName.toLowerCase()?null:t)&&(e.stateNode=t,!0);case 6:return null!==(t=""===e.pendingProps||3!==t.nodeType?null:t)&&(e.stateNode=t,!0);default:return!1}}function $o(e){if(Ho){var t=Bo;if(t){var n=t;if(!Wo(e,t)){if(!(t=Kr(n.nextSibling))||!Wo(e,t))return e.flags=-1025&e.flags|2,Ho=!1,void(Uo=e);Vo(Uo,n)}Uo=e,Bo=Kr(t.firstChild)}else e.flags=-1025&e.flags|2,Ho=!1,Uo=e}}function Qo(e){for(e=e.return;null!==e&&5!==e.tag&&3!==e.tag&&13!==e.tag;)e=e.return;Uo=e}function qo(e){if(e!==Uo)return!1;if(!Ho)return Qo(e),Ho=!0,!1;var t=e.type;if(5!==e.tag||"head"!==t&&"body"!==t&&!Wr(t,e.memoizedProps))for(t=Bo;t;)Vo(e,t),t=Kr(t.nextSibling);if(Qo(e),13===e.tag){if(!(e=null!==(e=e.memoizedState)?e.dehydrated:null))throw Error(l(317));e:{for(e=e.nextSibling,t=0;e;){if(8===e.nodeType){var n=e.data;if("/$"===n){if(0===t){Bo=Kr(e.nextSibling);break e}t--}else"$"!==n&&"$!"!==n&&"$?"!==n||t++}e=e.nextSibling}Bo=null}}else Bo=Uo?Kr(e.stateNode.nextSibling):null;return!0}function Ko(){Bo=Uo=null,Ho=!1}var Go=[];function Yo(){for(var e=0;eo))throw Error(l(301));o+=1,nl=tl=null,t.updateQueue=null,Xo.current=Ml,e=n(r,a)}while(al)}if(Xo.current=Rl,t=null!==tl&&null!==tl.next,Jo=0,nl=tl=el=null,rl=!1,t)throw Error(l(300));return e}function ul(){var e={memoizedState:null,baseState:null,baseQueue:null,queue:null,next:null};return null===nl?el.memoizedState=nl=e:nl=nl.next=e,nl}function cl(){if(null===tl){var e=el.alternate;e=null!==e?e.memoizedState:null}else e=tl.next;var t=null===nl?el.memoizedState:nl.next;if(null!==t)nl=t,tl=e;else{if(null===e)throw Error(l(310));e={memoizedState:(tl=e).memoizedState,baseState:tl.baseState,baseQueue:tl.baseQueue,queue:tl.queue,next:null},null===nl?el.memoizedState=nl=e:nl=nl.next=e}return nl}function sl(e,t){return"function"===typeof t?t(e):t}function fl(e){var t=cl(),n=t.queue;if(null===n)throw Error(l(311));n.lastRenderedReducer=e;var r=tl,a=r.baseQueue,o=n.pending;if(null!==o){if(null!==a){var i=a.next;a.next=o.next,o.next=i}r.baseQueue=a=o,n.pending=null}if(null!==a){a=a.next,r=r.baseState;var u=i=o=null,c=a;do{var s=c.lane;if((Jo&s)===s)null!==u&&(u=u.next={lane:0,action:c.action,eagerReducer:c.eagerReducer,eagerState:c.eagerState,next:null}),r=c.eagerReducer===e?c.eagerState:e(r,c.action);else{var f={lane:s,action:c.action,eagerReducer:c.eagerReducer,eagerState:c.eagerState,next:null};null===u?(i=u=f,o=r):u=u.next=f,el.lanes|=s,Bi|=s}c=c.next}while(null!==c&&c!==a);null===u?o=r:u.next=i,sr(r,t.memoizedState)||(Fl=!0),t.memoizedState=r,t.baseState=o,t.baseQueue=u,n.lastRenderedState=r}return[t.memoizedState,n.dispatch]}function dl(e){var t=cl(),n=t.queue;if(null===n)throw Error(l(311));n.lastRenderedReducer=e;var r=n.dispatch,a=n.pending,o=t.memoizedState;if(null!==a){n.pending=null;var i=a=a.next;do{o=e(o,i.action),i=i.next}while(i!==a);sr(o,t.memoizedState)||(Fl=!0),t.memoizedState=o,null===t.baseQueue&&(t.baseState=o),n.lastRenderedState=o}return[o,r]}function pl(e,t,n){var r=t._getVersion;r=r(t._source);var a=t._workInProgressVersionPrimary;if(null!==a?e=a===r:(e=e.mutableReadLanes,(e=(Jo&e)===e)&&(t._workInProgressVersionPrimary=r,Go.push(t))),e)return n(t._source);throw Go.push(t),Error(l(350))}function ml(e,t,n,r){var a=Oi;if(null===a)throw Error(l(349));var o=t._getVersion,i=o(t._source),u=Xo.current,c=u.useState((function(){return pl(a,t,n)})),s=c[1],f=c[0];c=nl;var d=e.memoizedState,p=d.refs,m=p.getSnapshot,h=d.source;d=d.subscribe;var g=el;return e.memoizedState={refs:p,source:t,subscribe:r},u.useEffect((function(){p.getSnapshot=n,p.setSnapshot=s;var e=o(t._source);if(!sr(i,e)){e=n(t._source),sr(f,e)||(s(e),e=pu(g),a.mutableReadLanes|=e&a.pendingLanes),e=a.mutableReadLanes,a.entangledLanes|=e;for(var r=a.entanglements,l=e;0n?98:n,(function(){e(!0)})),Qa(97<\/script>",e=e.removeChild(e.firstChild)):"string"===typeof r.is?e=c.createElement(n,{is:r.is}):(e=c.createElement(n),"select"===n&&(c=e,r.multiple?c.multiple=!0:r.size&&(c.size=r.size))):e=c.createElementNS(e,n),e[Zr]=t,e[Jr]=r,Kl(e,t),t.stateNode=e,c=Ee(n,r),n){case"dialog":Pr("cancel",e),Pr("close",e),o=r;break;case"iframe":case"object":case"embed":Pr("load",e),o=r;break;case"video":case"audio":for(o=0;oQi&&(t.flags|=64,i=!0,li(r,!1),t.lanes=33554432)}else{if(!i)if(null!==(e=Ao(c))){if(t.flags|=64,i=!0,null!==(n=e.updateQueue)&&(t.updateQueue=n,t.flags|=4),li(r,!0),null===r.tail&&"hidden"===r.tailMode&&!c.alternate&&!Ho)return null!==(t=t.lastEffect=r.lastEffect)&&(t.nextEffect=null),null}else 2*Va()-r.renderingStartTime>Qi&&1073741824!==n&&(t.flags|=64,i=!0,li(r,!1),t.lanes=33554432);r.isBackwards?(c.sibling=t.child,t.child=c):(null!==(n=r.last)?n.sibling=c:t.child=c,r.last=c)}return null!==r.tail?(n=r.tail,r.rendering=n,r.tail=n.sibling,r.lastEffect=t.lastEffect,r.renderingStartTime=Va(),n.sibling=null,t=Do.current,fa(Do,i?1&t|2:1&t),n):null;case 23:case 24:return Su(),null!==e&&null!==e.memoizedState!==(null!==t.memoizedState)&&"unstable-defer-without-hiding"!==r.mode&&(t.flags|=4),null}throw Error(l(156,t.tag))}function ui(e){switch(e.tag){case 1:ya(e.type)&&va();var t=e.flags;return 4096&t?(e.flags=-4097&t|64,e):null;case 3:if(Mo(),sa(ma),sa(pa),Yo(),0!==(64&(t=e.flags)))throw Error(l(285));return e.flags=-4097&t|64,e;case 5:return Fo(e),null;case 13:return sa(Do),4096&(t=e.flags)?(e.flags=-4097&t|64,e):null;case 19:return sa(Do),null;case 4:return Mo(),null;case 10:return ro(e),null;case 23:case 24:return Su(),null;default:return null}}function ci(e,t){try{var n="",r=t;do{n+=Q(r),r=r.return}while(r);var a=n}catch(o){a="\nError generating stack: "+o.message+"\n"+o.stack}return{value:e,source:t,stack:a}}function si(e,t){try{console.error(t.value)}catch(n){setTimeout((function(){throw n}))}}Kl=function(e,t){for(var n=t.child;null!==n;){if(5===n.tag||6===n.tag)e.appendChild(n.stateNode);else if(4!==n.tag&&null!==n.child){n.child.return=n,n=n.child;continue}if(n===t)break;for(;null===n.sibling;){if(null===n.return||n.return===t)return;n=n.return}n.sibling.return=n.return,n=n.sibling}},Gl=function(e,t,n,r){var o=e.memoizedProps;if(o!==r){e=t.stateNode,Oo(Po.current);var l,i=null;switch(n){case"input":o=J(e,o),r=J(e,r),i=[];break;case"option":o=oe(e,o),r=oe(e,r),i=[];break;case"select":o=a({},o,{value:void 0}),r=a({},r,{value:void 0}),i=[];break;case"textarea":o=ie(e,o),r=ie(e,r),i=[];break;default:"function"!==typeof o.onClick&&"function"===typeof r.onClick&&(e.onclick=Ur)}for(f in _e(n,r),n=null,o)if(!r.hasOwnProperty(f)&&o.hasOwnProperty(f)&&null!=o[f])if("style"===f){var c=o[f];for(l in c)c.hasOwnProperty(l)&&(n||(n={}),n[l]="")}else"dangerouslySetInnerHTML"!==f&&"children"!==f&&"suppressContentEditableWarning"!==f&&"suppressHydrationWarning"!==f&&"autoFocus"!==f&&(u.hasOwnProperty(f)?i||(i=[]):(i=i||[]).push(f,null));for(f in r){var s=r[f];if(c=null!=o?o[f]:void 0,r.hasOwnProperty(f)&&s!==c&&(null!=s||null!=c))if("style"===f)if(c){for(l in c)!c.hasOwnProperty(l)||s&&s.hasOwnProperty(l)||(n||(n={}),n[l]="");for(l in s)s.hasOwnProperty(l)&&c[l]!==s[l]&&(n||(n={}),n[l]=s[l])}else n||(i||(i=[]),i.push(f,n)),n=s;else"dangerouslySetInnerHTML"===f?(s=s?s.__html:void 0,c=c?c.__html:void 0,null!=s&&c!==s&&(i=i||[]).push(f,s)):"children"===f?"string"!==typeof s&&"number"!==typeof s||(i=i||[]).push(f,""+s):"suppressContentEditableWarning"!==f&&"suppressHydrationWarning"!==f&&(u.hasOwnProperty(f)?(null!=s&&"onScroll"===f&&Pr("scroll",e),i||c===s||(i=[])):"object"===typeof s&&null!==s&&s.$$typeof===M?s.toString():(i=i||[]).push(f,s))}n&&(i=i||[]).push("style",n);var f=i;(t.updateQueue=f)&&(t.flags|=4)}},Yl=function(e,t,n,r){n!==r&&(t.flags|=4)};var fi="function"===typeof WeakMap?WeakMap:Map;function di(e,t,n){(n=so(-1,n)).tag=3,n.payload={element:null};var r=t.value;return n.callback=function(){Yi||(Yi=!0,Xi=r),si(0,t)},n}function pi(e,t,n){(n=so(-1,n)).tag=3;var r=e.type.getDerivedStateFromError;if("function"===typeof r){var a=t.value;n.payload=function(){return si(0,t),r(a)}}var o=e.stateNode;return null!==o&&"function"===typeof o.componentDidCatch&&(n.callback=function(){"function"!==typeof r&&(null===Zi?Zi=new Set([this]):Zi.add(this),si(0,t));var e=t.stack;this.componentDidCatch(t.value,{componentStack:null!==e?e:""})}),n}var mi="function"===typeof WeakSet?WeakSet:Set;function hi(e){var t=e.ref;if(null!==t)if("function"===typeof t)try{t(null)}catch(n){Uu(e,n)}else t.current=null}function gi(e,t){switch(t.tag){case 0:case 11:case 15:case 22:case 5:case 6:case 4:case 17:return;case 1:if(256&t.flags&&null!==e){var n=e.memoizedProps,r=e.memoizedState;t=(e=t.stateNode).getSnapshotBeforeUpdate(t.elementType===t.type?n:Xa(t.type,n),r),e.__reactInternalSnapshotBeforeUpdate=t}return;case 3:return void(256&t.flags&&qr(t.stateNode.containerInfo))}throw Error(l(163))}function yi(e,t,n){switch(n.tag){case 0:case 11:case 15:case 22:if(null!==(t=null!==(t=n.updateQueue)?t.lastEffect:null)){e=t=t.next;do{if(3===(3&e.tag)){var r=e.create;e.destroy=r()}e=e.next}while(e!==t)}if(null!==(t=null!==(t=n.updateQueue)?t.lastEffect:null)){e=t=t.next;do{var a=e;r=a.next,0!==(4&(a=a.tag))&&0!==(1&a)&&(Fu(n,e),Iu(n,e)),e=r}while(e!==t)}return;case 1:return e=n.stateNode,4&n.flags&&(null===t?e.componentDidMount():(r=n.elementType===n.type?t.memoizedProps:Xa(n.type,t.memoizedProps),e.componentDidUpdate(r,t.memoizedState,e.__reactInternalSnapshotBeforeUpdate))),void(null!==(t=n.updateQueue)&&ho(n,t,e));case 3:if(null!==(t=n.updateQueue)){if(e=null,null!==n.child)switch(n.child.tag){case 5:case 1:e=n.child.stateNode}ho(n,t,e)}return;case 5:return e=n.stateNode,void(null===t&&4&n.flags&&Vr(n.type,n.memoizedProps)&&e.focus());case 6:case 4:case 12:case 19:case 17:case 20:case 21:case 23:case 24:return;case 13:return void(null===n.memoizedState&&(n=n.alternate,null!==n&&(n=n.memoizedState,null!==n&&(n=n.dehydrated,null!==n&&xt(n)))))}throw Error(l(163))}function vi(e,t){for(var n=e;;){if(5===n.tag){var r=n.stateNode;if(t)"function"===typeof(r=r.style).setProperty?r.setProperty("display","none","important"):r.display="none";else{r=n.stateNode;var a=n.memoizedProps.style;a=void 0!==a&&null!==a&&a.hasOwnProperty("display")?a.display:null,r.style.display=ke("display",a)}}else if(6===n.tag)n.stateNode.nodeValue=t?"":n.memoizedProps;else if((23!==n.tag&&24!==n.tag||null===n.memoizedState||n===e)&&null!==n.child){n.child.return=n,n=n.child;continue}if(n===e)break;for(;null===n.sibling;){if(null===n.return||n.return===e)return;n=n.return}n.sibling.return=n.return,n=n.sibling}}function bi(e,t){if(_a&&"function"===typeof _a.onCommitFiberUnmount)try{_a.onCommitFiberUnmount(Sa,t)}catch(o){}switch(t.tag){case 0:case 11:case 14:case 15:case 22:if(null!==(e=t.updateQueue)&&null!==(e=e.lastEffect)){var n=e=e.next;do{var r=n,a=r.destroy;if(r=r.tag,void 0!==a)if(0!==(4&r))Fu(t,n);else{r=t;try{a()}catch(o){Uu(r,o)}}n=n.next}while(n!==e)}break;case 1:if(hi(t),"function"===typeof(e=t.stateNode).componentWillUnmount)try{e.props=t.memoizedProps,e.state=t.memoizedState,e.componentWillUnmount()}catch(o){Uu(t,o)}break;case 5:hi(t);break;case 4:Ei(e,t)}}function wi(e){e.alternate=null,e.child=null,e.dependencies=null,e.firstEffect=null,e.lastEffect=null,e.memoizedProps=null,e.memoizedState=null,e.pendingProps=null,e.return=null,e.updateQueue=null}function ki(e){return 5===e.tag||3===e.tag||4===e.tag}function xi(e){e:{for(var t=e.return;null!==t;){if(ki(t))break e;t=t.return}throw Error(l(160))}var n=t;switch(t=n.stateNode,n.tag){case 5:var r=!1;break;case 3:case 4:t=t.containerInfo,r=!0;break;default:throw Error(l(161))}16&n.flags&&(ve(t,""),n.flags&=-17);e:t:for(n=e;;){for(;null===n.sibling;){if(null===n.return||ki(n.return)){n=null;break e}n=n.return}for(n.sibling.return=n.return,n=n.sibling;5!==n.tag&&6!==n.tag&&18!==n.tag;){if(2&n.flags)continue t;if(null===n.child||4===n.tag)continue t;n.child.return=n,n=n.child}if(!(2&n.flags)){n=n.stateNode;break e}}r?Si(e,n,t):_i(e,n,t)}function Si(e,t,n){var r=e.tag,a=5===r||6===r;if(a)e=a?e.stateNode:e.stateNode.instance,t?8===n.nodeType?n.parentNode.insertBefore(e,t):n.insertBefore(e,t):(8===n.nodeType?(t=n.parentNode).insertBefore(e,n):(t=n).appendChild(e),null!==(n=n._reactRootContainer)&&void 0!==n||null!==t.onclick||(t.onclick=Ur));else if(4!==r&&null!==(e=e.child))for(Si(e,t,n),e=e.sibling;null!==e;)Si(e,t,n),e=e.sibling}function _i(e,t,n){var r=e.tag,a=5===r||6===r;if(a)e=a?e.stateNode:e.stateNode.instance,t?n.insertBefore(e,t):n.appendChild(e);else if(4!==r&&null!==(e=e.child))for(_i(e,t,n),e=e.sibling;null!==e;)_i(e,t,n),e=e.sibling}function Ei(e,t){for(var n,r,a=t,o=!1;;){if(!o){o=a.return;e:for(;;){if(null===o)throw Error(l(160));switch(n=o.stateNode,o.tag){case 5:r=!1;break e;case 3:case 4:n=n.containerInfo,r=!0;break e}o=o.return}o=!0}if(5===a.tag||6===a.tag){e:for(var i=e,u=a,c=u;;)if(bi(i,c),null!==c.child&&4!==c.tag)c.child.return=c,c=c.child;else{if(c===u)break e;for(;null===c.sibling;){if(null===c.return||c.return===u)break e;c=c.return}c.sibling.return=c.return,c=c.sibling}r?(i=n,u=a.stateNode,8===i.nodeType?i.parentNode.removeChild(u):i.removeChild(u)):n.removeChild(a.stateNode)}else if(4===a.tag){if(null!==a.child){n=a.stateNode.containerInfo,r=!0,a.child.return=a,a=a.child;continue}}else if(bi(e,a),null!==a.child){a.child.return=a,a=a.child;continue}if(a===t)break;for(;null===a.sibling;){if(null===a.return||a.return===t)return;4===(a=a.return).tag&&(o=!1)}a.sibling.return=a.return,a=a.sibling}}function Ci(e,t){switch(t.tag){case 0:case 11:case 14:case 15:case 22:var n=t.updateQueue;if(null!==(n=null!==n?n.lastEffect:null)){var r=n=n.next;do{3===(3&r.tag)&&(e=r.destroy,r.destroy=void 0,void 0!==e&&e()),r=r.next}while(r!==n)}return;case 1:case 12:case 17:return;case 5:if(null!=(n=t.stateNode)){r=t.memoizedProps;var a=null!==e?e.memoizedProps:r;e=t.type;var o=t.updateQueue;if(t.updateQueue=null,null!==o){for(n[Jr]=r,"input"===e&&"radio"===r.type&&null!=r.name&&te(n,r),Ee(e,a),t=Ee(e,r),a=0;aa&&(a=i),n&=~o}if(n=a,10<(n=(120>(n=Va()-n)?120:480>n?480:1080>n?1080:1920>n?1920:3e3>n?3e3:4320>n?4320:1960*zi(n/1960))-n)){e.timeoutHandle=$r(Ru.bind(null,e),n);break}Ru(e);break;default:throw Error(l(329))}}return gu(e,Va()),e.callbackNode===t?yu.bind(null,e):null}function vu(e,t){for(t&=~Vi,t&=~Hi,e.suspendedLanes|=t,e.pingedLanes&=~t,e=e.expirationTimes;0 component higher in the tree to provide a loading indicator or placeholder to display.")}5!==Di&&(Di=2),u=ci(u,i),d=l;do{switch(d.tag){case 3:o=u,d.flags|=4096,t&=-t,d.lanes|=t,po(d,di(0,o,t));break e;case 1:o=u;var k=d.type,x=d.stateNode;if(0===(64&d.flags)&&("function"===typeof k.getDerivedStateFromError||null!==x&&"function"===typeof x.componentDidCatch&&(null===Zi||!Zi.has(x)))){d.flags|=4096,t&=-t,d.lanes|=t,po(d,pi(d,o,t));break e}}d=d.return}while(null!==d)}Lu(n)}catch(S){t=S,ji===n&&null!==n&&(ji=n=n.return);continue}break}}function Cu(){var e=Pi.current;return Pi.current=Rl,null===e?Rl:e}function Nu(e,t){var n=Ri;Ri|=16;var r=Cu();for(Oi===e&&Mi===t||_u(e,t);;)try{Tu();break}catch(a){Eu(e,a)}if(no(),Ri=n,Pi.current=r,null!==ji)throw Error(l(261));return Oi=null,Mi=0,Di}function Tu(){for(;null!==ji;)Pu(ji)}function zu(){for(;null!==ji&&!Ta();)Pu(ji)}function Pu(e){var t=Ki(e.alternate,e,Ii);e.memoizedProps=e.pendingProps,null===t?Lu(e):ji=t,Li.current=null}function Lu(e){var t=e;do{var n=t.alternate;if(e=t.return,0===(2048&t.flags)){if(null!==(n=ii(n,t,Ii)))return void(ji=n);if(24!==(n=t).tag&&23!==n.tag||null===n.memoizedState||0!==(1073741824&Ii)||0===(4&n.mode)){for(var r=0,a=n.child;null!==a;)r|=a.lanes|a.childLanes,a=a.sibling;n.childLanes=r}null!==e&&0===(2048&e.flags)&&(null===e.firstEffect&&(e.firstEffect=t.firstEffect),null!==t.lastEffect&&(null!==e.lastEffect&&(e.lastEffect.nextEffect=t.firstEffect),e.lastEffect=t.lastEffect),1i&&(u=i,i=x,x=u),u=mr(b,x),o=mr(b,i),u&&o&&(1!==k.rangeCount||k.anchorNode!==u.node||k.anchorOffset!==u.offset||k.focusNode!==o.node||k.focusOffset!==o.offset)&&((w=w.createRange()).setStart(u.node,u.offset),k.removeAllRanges(),x>i?(k.addRange(w),k.extend(o.node,o.offset)):(w.setEnd(o.node,o.offset),k.addRange(w))))),w=[];for(k=b;k=k.parentNode;)1===k.nodeType&&w.push({element:k,left:k.scrollLeft,top:k.scrollTop});for("function"===typeof b.focus&&b.focus(),b=0;bVa()-$i?_u(e,0):Vi|=n),gu(e,t)}function Hu(e,t){var n=e.stateNode;null!==n&&n.delete(t),0===(t=0)&&(0===(2&(t=e.mode))?t=1:0===(4&t)?t=99===Wa()?1:2:(0===uu&&(uu=Ui),0===(t=Bt(62914560&~uu))&&(t=4194304))),n=du(),null!==(e=hu(e,t))&&(Vt(e,t,n),gu(e,n))}function Vu(e,t,n,r){this.tag=e,this.key=n,this.sibling=this.child=this.return=this.stateNode=this.type=this.elementType=null,this.index=0,this.ref=null,this.pendingProps=t,this.dependencies=this.memoizedState=this.updateQueue=this.memoizedProps=null,this.mode=r,this.flags=0,this.lastEffect=this.firstEffect=this.nextEffect=null,this.childLanes=this.lanes=0,this.alternate=null}function Wu(e,t,n,r){return new Vu(e,t,n,r)}function $u(e){return!(!(e=e.prototype)||!e.isReactComponent)}function Qu(e,t){var n=e.alternate;return null===n?((n=Wu(e.tag,t,e.key,e.mode)).elementType=e.elementType,n.type=e.type,n.stateNode=e.stateNode,n.alternate=e,e.alternate=n):(n.pendingProps=t,n.type=e.type,n.flags=0,n.nextEffect=null,n.firstEffect=null,n.lastEffect=null),n.childLanes=e.childLanes,n.lanes=e.lanes,n.child=e.child,n.memoizedProps=e.memoizedProps,n.memoizedState=e.memoizedState,n.updateQueue=e.updateQueue,t=e.dependencies,n.dependencies=null===t?null:{lanes:t.lanes,firstContext:t.firstContext},n.sibling=e.sibling,n.index=e.index,n.ref=e.ref,n}function qu(e,t,n,r,a,o){var i=2;if(r=e,"function"===typeof e)$u(e)&&(i=1);else if("string"===typeof e)i=5;else e:switch(e){case _:return Ku(n.children,a,o,t);case I:i=8,a|=16;break;case E:i=8,a|=1;break;case C:return(e=Wu(12,n,t,8|a)).elementType=C,e.type=C,e.lanes=o,e;case P:return(e=Wu(13,n,t,a)).type=P,e.elementType=P,e.lanes=o,e;case L:return(e=Wu(19,n,t,a)).elementType=L,e.lanes=o,e;case F:return Gu(n,a,o,t);case D:return(e=Wu(24,n,t,a)).elementType=D,e.lanes=o,e;default:if("object"===typeof e&&null!==e)switch(e.$$typeof){case N:i=10;break e;case T:i=9;break e;case z:i=11;break e;case R:i=14;break e;case O:i=16,r=null;break e;case j:i=22;break e}throw Error(l(130,null==e?e:typeof e,""))}return(t=Wu(i,n,t,a)).elementType=e,t.type=r,t.lanes=o,t}function Ku(e,t,n,r){return(e=Wu(7,e,r,t)).lanes=n,e}function Gu(e,t,n,r){return(e=Wu(23,e,r,t)).elementType=F,e.lanes=n,e}function Yu(e,t,n){return(e=Wu(6,e,null,t)).lanes=n,e}function Xu(e,t,n){return(t=Wu(4,null!==e.children?e.children:[],e.key,t)).lanes=n,t.stateNode={containerInfo:e.containerInfo,pendingChildren:null,implementation:e.implementation},t}function Zu(e,t,n){this.tag=t,this.containerInfo=e,this.finishedWork=this.pingCache=this.current=this.pendingChildren=null,this.timeoutHandle=-1,this.pendingContext=this.context=null,this.hydrate=n,this.callbackNode=null,this.callbackPriority=0,this.eventTimes=Ht(0),this.expirationTimes=Ht(-1),this.entangledLanes=this.finishedLanes=this.mutableReadLanes=this.expiredLanes=this.pingedLanes=this.suspendedLanes=this.pendingLanes=0,this.entanglements=Ht(0),this.mutableSourceEagerHydrationData=null}function Ju(e,t,n){var r=3=b},o=function(){},t.unstable_forceFrameRate=function(e){0>e||125>>1,a=e[r];if(!(void 0!==a&&0E(l,n))void 0!==u&&0>E(u,l)?(e[r]=u,e[i]=n,r=i):(e[r]=l,e[o]=n,r=o);else{if(!(void 0!==u&&0>E(u,n)))break e;e[r]=u,e[i]=n,r=i}}}return t}return null}function E(e,t){var n=e.sortIndex-t.sortIndex;return 0!==n?n:e.id-t.id}var C=[],N=[],T=1,z=null,P=3,L=!1,R=!1,O=!1;function j(e){for(var t=S(N);null!==t;){if(null===t.callback)_(N);else{if(!(t.startTime<=e))break;_(N),t.sortIndex=t.expirationTime,x(C,t)}t=S(N)}}function M(e){if(O=!1,j(e),!R)if(null!==S(C))R=!0,n(I);else{var t=S(N);null!==t&&r(M,t.startTime-e)}}function I(e,n){R=!1,O&&(O=!1,a()),L=!0;var o=P;try{for(j(n),z=S(C);null!==z&&(!(z.expirationTime>n)||e&&!t.unstable_shouldYield());){var l=z.callback;if("function"===typeof l){z.callback=null,P=z.priorityLevel;var i=l(z.expirationTime<=n);n=t.unstable_now(),"function"===typeof i?z.callback=i:z===S(C)&&_(C),j(n)}else _(C);z=S(C)}if(null!==z)var u=!0;else{var c=S(N);null!==c&&r(M,c.startTime-n),u=!1}return u}finally{z=null,P=o,L=!1}}var F=o;t.unstable_IdlePriority=5,t.unstable_ImmediatePriority=1,t.unstable_LowPriority=4,t.unstable_NormalPriority=3,t.unstable_Profiling=null,t.unstable_UserBlockingPriority=2,t.unstable_cancelCallback=function(e){e.callback=null},t.unstable_continueExecution=function(){R||L||(R=!0,n(I))},t.unstable_getCurrentPriorityLevel=function(){return P},t.unstable_getFirstCallbackNode=function(){return S(C)},t.unstable_next=function(e){switch(P){case 1:case 2:case 3:var t=3;break;default:t=P}var n=P;P=t;try{return e()}finally{P=n}},t.unstable_pauseExecution=function(){},t.unstable_requestPaint=F,t.unstable_runWithPriority=function(e,t){switch(e){case 1:case 2:case 3:case 4:case 5:break;default:e=3}var n=P;P=e;try{return t()}finally{P=n}},t.unstable_scheduleCallback=function(e,o,l){var i=t.unstable_now();switch("object"===typeof l&&null!==l?l="number"===typeof(l=l.delay)&&0i?(e.sortIndex=l,x(N,e),null===S(C)&&e===S(N)&&(O?a():O=!0,r(M,l-i))):(e.sortIndex=u,x(C,e),R||L||(R=!0,n(I))),e},t.unstable_wrapCallback=function(e){var t=P;return function(){var n=P;P=t;try{return e.apply(this,arguments)}finally{P=n}}}},296:function(e,t,n){e.exports=n(813)}},t={};function n(r){var a=t[r];if(void 0!==a)return a.exports;var o=t[r]={exports:{}};return e[r](o,o.exports,n),o.exports}!function(){var e=n(791),t=n(164);function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n0&&void 0!==arguments[0]?arguments[0]:[];return!!e.find((function(e){return v(e.type)}))},getPresets:y,getPresetStaticTheme:function(){return p},create:b,createFromDark:function(e){return b(m,e)},createFromLight:function(e){return b(p,e)}},k=w,x=k,S=x.getPresetStaticTheme(),_=e.createContext(S),E={themes:k.getPresets()},C=e.createContext(E),N=function(t){var n=t.children,r=t.themeType,o=t.themes,l=void 0===o?[]:o,i=a((0,e.useState)({themes:x.getPresets()}),2),c=i[0],s=i[1],f=(0,e.useMemo)((function(){var e=c.themes.find((function(e){return e.type===r}));return e||x.getPresetStaticTheme()}),[c,r]);return(0,e.useEffect)((function(){null!==l&&void 0!==l&&l.length&&s((function(e){var t=l.filter((function(e){return x.isAvailableThemeType(e.type)}));return u({},e,{themes:x.getPresets().concat(t)})}))}),[l]),e.createElement(C.Provider,{value:c},e.createElement(_.Provider,{value:f},n))},T=function(t){var n=a((0,e.useState)((function(){return"function"===typeof t?t():t})),2),r=n[0],o=n[1],l=(0,e.useRef)(t);(0,e.useEffect)((function(){l.current=r}),[r]);return[r,function(e){var t="function"===typeof e?e(l.current):e;l.current=t,o(t)},l]},z={},P={};var L=function(e){for(var t=5381,n=e.length;n;)t=33*t^e.charCodeAt(--n);return t>>>0},R={};!function(e){function t(e,t){for(var n=0;n"+a+""}),"")};var n,r=(n=e)&&n.__esModule?n:{default:n},a=z.default||z;a.flush=z.flush}(j);var M=j.default||j;M.flushToHTML=j.flushToHTML;var I=O,F=function(){return Math.random().toString(32).slice(2,10)},D=function(){return Boolean("undefined"!==typeof window&&window.document&&window.document.createElement)},A=function(){var t=a((0,e.useState)(!1),2),n=t[0],r=t[1];return(0,e.useEffect)((function(){r(D())}),[]),{isBrowser:n,isServer:!n}},U=function(e){var t=document.createElement("div");return t.setAttribute("id",e),t},B=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:F(),n=arguments.length>1?arguments[1]:void 0,r="geist-ui-".concat(t),o=A(),l=o.isBrowser,i=(0,e.useState)(l?U(r):null),u=a(i,2),c=u[0],s=u[1];return(0,e.useEffect)((function(){var e=(n?n():null)||document.body,t=e.querySelector("#".concat(r)),a=t||U(r);t||e.appendChild(a),s(a)}),[]),c},H=function(){return e.useContext(_)};function V(e,t){if(null==e)return{};var n,r,a=function(e,t){if(null==e)return{};var n,r,a={},o=Object.keys(e);for(r=0;r=0||(a[n]=e[n]);return a}(e,t);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);for(r=0;r=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(a[n]=e[n])}return a}var W=["children","className","visible","enterTime","leaveTime","clearTime","name"],$=function(t){var n=t.children,r=t.className,o=t.visible,l=t.enterTime,i=t.leaveTime,c=t.clearTime,s=t.name,f=V(t,W),d=a((0,e.useState)(""),2),p=d[0],m=d[1],h=a((0,e.useState)(o),2),g=h[0],y=h[1];return(0,e.useEffect)((function(){var e=o?"enter":"leave",t=o?l:i;o&&!g&&y(!0),m("".concat(s,"-").concat(e));var n=setTimeout((function(){m("".concat(s,"-").concat(e," ").concat(s,"-").concat(e,"-active")),clearTimeout(n)}),t),r=setTimeout((function(){o||(m(""),y(!1)),clearTimeout(r)}),t+c);return function(){clearTimeout(n),clearTimeout(r)}}),[o,g]),e.isValidElement(n)&&g?e.cloneElement(n,u({},f,{className:"".concat(n.props.className," ").concat(r," ").concat(p)})):null};$.defaultProps={visible:!1,enterTime:60,leaveTime:60,clearTime:60,className:"",name:"transition"},$.displayName="GeistCssTransition";var Q=$,q=["width","height","padding","margin","w","h","paddingLeft","paddingRight","paddingTop","paddingBottom","pl","pr","pt","pb","marginLeft","marginRight","marginTop","marginBottom","ml","mr","mt","mb","px","py","mx","my","font","unit","scale"],K=function(e){return"".concat(e)},G={getScaleProps:function(){},getAllScaleProps:function(){return{}},SCALES:{pl:K,pr:K,pb:K,pt:K,px:K,py:K,mb:K,ml:K,mr:K,mt:K,mx:K,my:K,width:K,height:K,font:K},unit:"16px"},Y=e.createContext(G),X=function(){return e.useContext(Y)};function Z(e,t){var n="undefined"!==typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(!n){if(Array.isArray(e)||(n=function(e,t){if(!e)return;if("string"===typeof e)return J(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(e);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return J(e,t)}(e))||t&&e&&"number"===typeof e.length){n&&(e=n);var r=0,a=function(){};return{s:a,n:function(){return r>=e.length?{done:!0}:{done:!1,value:e[r++]}},e:function(e){throw e},f:a}}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 o,l=!0,i=!1;return{s:function(){n=n.call(e)},n:function(){var e=n.next();return l=e.done,e},e:function(e){i=!0,o=e},f:function(){try{l||null==n.return||n.return()}finally{if(i)throw o}}}}function J(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n1?1+t:1-t}(Se)*t;if("undefined"===typeof e)return"undefined"!==typeof n?"".concat(n):"calc(".concat(r," * ").concat(ke,")");if(!function(e){return void 0!==e&&!Number.isNaN(+e)}(e))return"".concat(e);var a=r*Number(e);return"calc(".concat(a," * ").concat(ke,")")}},Ce={unit:ke,SCALES:{pt:Ee(null!==(a=null!==(o=null!==Q&&void 0!==Q?Q:q)&&void 0!==o?o:se)&&void 0!==a?a:be),pr:Ee(null!==(l=null!==(i=null!==W&&void 0!==W?W:$)&&void 0!==i?i:ce)&&void 0!==l?l:be),pb:Ee(null!==(c=null!==(s=null!==K&&void 0!==K?K:G)&&void 0!==s?s:se)&&void 0!==c?c:be),pl:Ee(null!==(f=null!==(d=null!==U&&void 0!==U?U:B)&&void 0!==d?d:ce)&&void 0!==f?f:be),px:Ee(null!==(p=null!==(m=null!==(h=null!==(g=null!==ce&&void 0!==ce?ce:U)&&void 0!==g?g:W)&&void 0!==h?h:B)&&void 0!==m?m:$)&&void 0!==p?p:be),py:Ee(null!==(y=null!==(v=null!==(b=null!==(w=null!==se&&void 0!==se?se:Q)&&void 0!==w?w:K)&&void 0!==b?b:q)&&void 0!==v?v:G)&&void 0!==y?y:be),mt:Ee(null!==(k=null!==(x=null!==X&&void 0!==X?X:Z)&&void 0!==x?x:de)&&void 0!==k?k:ve),mr:Ee(null!==(S=null!==(_=null!==J&&void 0!==J?J:ae)&&void 0!==_?_:fe)&&void 0!==S?S:ve),mb:Ee(null!==(E=null!==(C=null!==oe&&void 0!==oe?oe:le)&&void 0!==C?C:de)&&void 0!==E?E:ve),ml:Ee(null!==(N=null!==(T=null!==ie&&void 0!==ie?ie:ue)&&void 0!==T?T:fe)&&void 0!==N?N:ve),mx:Ee(null!==(z=null!==(P=null!==(L=null!==(R=null!==fe&&void 0!==fe?fe:ie)&&void 0!==R?R:J)&&void 0!==L?L:ue)&&void 0!==P?P:ae)&&void 0!==z?z:ve),my:Ee(null!==(O=null!==(j=null!==(M=null!==(I=null!==de&&void 0!==de?de:X)&&void 0!==I?I:oe)&&void 0!==M?M:Z)&&void 0!==j?j:le)&&void 0!==O?O:ve),width:Ee(null!==pe&&void 0!==pe?pe:ge),height:Ee(null!==me&&void 0!==me?me:ye),font:Ee(he)},getScaleProps:ee(D),getAllScaleProps:te(D)};return e.createElement(Y.Provider,{value:Ce},e.createElement(t,u({},_e,{ref:r}),F))}));return n.displayName="Scale".concat(t.displayName||"Wrapper"),n},oe=function(t){var n=t.x,r=t.y,a=t.color,o=t.onCompleted,l=(0,e.useRef)(null),i=Number.isNaN(+r)?0:r-10,u=Number.isNaN(+n)?0:n-10;return(0,e.useEffect)((function(){if(l.current)return l.current.addEventListener("animationend",o),function(){l.current&&l.current.removeEventListener("animationend",o)}})),e.createElement("div",{ref:l,className:"jsx-3424889537 drip"},e.createElement("svg",{width:"20",height:"20",viewBox:"0 0 20 20",style:{top:i,left:u},className:"jsx-3424889537"},e.createElement("g",{stroke:"none",strokeWidth:"1",fill:"none",fillRule:"evenodd",className:"jsx-3424889537"},e.createElement("g",{fill:a,className:"jsx-3424889537"},e.createElement("rect",{width:"100%",height:"100%",rx:"10",className:"jsx-3424889537"})))),e.createElement(I,{id:"3424889537"},".drip.jsx-3424889537{position:absolute;left:0;right:0;top:0;bottom:0;}svg.jsx-3424889537{position:absolute;-webkit-animation:350ms ease-in expand-jsx-3424889537;animation:350ms ease-in expand-jsx-3424889537;-webkit-animation-fill-mode:forwards;animation-fill-mode:forwards;width:1rem;height:1rem;}@-webkit-keyframes expand-jsx-3424889537{0%{opacity:0;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);}30%{opacity:1;}80%{opacity:0.5;}100%{-webkit-transform:scale(28);-ms-transform:scale(28);transform:scale(28);opacity:0;}}@keyframes expand-jsx-3424889537{0%{opacity:0;-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1);}30%{opacity:1;}80%{opacity:0.5;}100%{-webkit-transform:scale(28);-ms-transform:scale(28);transform:scale(28);opacity:0;}}"))};oe.defaultProps={x:0,y:0},oe.displayName="GeistButtonDrip";var le=oe,ie=function(e){for(var t=Object.keys(e),n=t.length,r="",a=0;a1?1:t<0?0:t;return"rgba(".concat(r,", ").concat(o,", ").concat(l,", ").concat(i,")")},Se=function(e,t){var n=t.type,r=t.disabled,a=t.ghost,o={default:{bg:e.background,border:e.border,color:e.accents_5},secondary:{bg:e.foreground,border:e.foreground,color:e.background},success:{bg:e.success,border:e.success,color:"#fff"},warning:{bg:e.warning,border:e.warning,color:"#fff"},error:{bg:e.error,border:e.error,color:"#fff"},abort:{bg:"transparent",border:"transparent",color:e.accents_5}};if(r)return{bg:e.accents_1,border:e.accents_2,color:"#ccc"};var l=null===n||void 0===n?void 0:n.replace("-light",""),i=o.default;return a?function(e,t){return{secondary:{bg:e.background,border:e.foreground,color:e.foreground},success:{bg:e.background,border:e.success,color:e.success},warning:{bg:e.background,border:e.warning,color:e.warning},error:{bg:e.background,border:e.error,color:e.error}}[t]||null}(e,l)||i:o[l]||i},_e=function(e,t){var n=t.type,r=t.disabled,a=t.loading,o=t.shadow,l=t.ghost,i=Se(e,t),c=xe(i.bg,.85),s={default:{bg:e.background,border:e.foreground},secondary:{bg:e.background,border:e.foreground},success:{bg:e.background,border:e.success},warning:{bg:e.background,border:e.warning},error:{bg:e.background,border:e.error},abort:{bg:"transparent",border:"transparent",color:e.accents_5},"secondary-light":u({},i,{bg:c}),"success-light":u({},i,{bg:c}),"warning-light":u({},i,{bg:c}),"error-light":u({},i,{bg:c})};if(r)return{bg:e.accents_1,border:e.accents_2,color:"#ccc"};if(a)return u({},i,{color:"transparent"});if(o)return i;var f=(l?function(e,t){return{secondary:{bg:e.foreground,border:e.background,color:e.background},success:{bg:e.success,border:e.background,color:"white"},warning:{bg:e.warning,border:e.background,color:"white"},error:{bg:e.error,border:e.background,color:"white"}}[t.replace("-light","")]||null}(e,n):s[n])||s.default;return u({},f,{color:f.color||f.border})},Ee=["children","disabled","type","loading","shadow","ghost","effect","onClick","auto","icon","htmlType","iconRight","className"],Ce=e.forwardRef((function(t,n){var r=H(),o=X().SCALES,l=(0,e.useRef)(null);(0,e.useImperativeHandle)(n,(function(){return l.current}));var i=a((0,e.useState)(!1),2),c=i[0],s=i[1],f=a((0,e.useState)(0),2),d=f[0],p=f[1],m=a((0,e.useState)(0),2),h=m[0],g=m[1],y=function(e,t){return t.isButtonGroup?u({},e,{auto:!0,shadow:!1,ghost:t.ghost||e.ghost,type:t.type||e.type,disabled:t.disabled||e.disabled}):e}(t,e.useContext(we)),v=y.children,b=y.disabled,w=(y.type,y.loading),k=y.shadow,x=y.ghost,S=y.effect,_=y.onClick,E=y.auto,C=y.icon,N=y.htmlType,T=y.iconRight,z=y.className,P=V(y,Ee),L=(0,e.useMemo)((function(){return Se(r.palette,y)}),[r.palette,y]),R=L.bg,O=L.border,j=L.color,M=(0,e.useMemo)((function(){return _e(r.palette,y)}),[r.palette,y]),F=(0,e.useMemo)((function(){return function(e,t){return e?{cursor:"not-allowed",events:"auto"}:t?{cursor:"default",events:"none"}:{cursor:"pointer",events:"auto"}}(b,w)}),[b,w]),D=F.cursor,A=F.events,U=(0,e.useMemo)((function(){return function(e,t){var n=t.type.endsWith("light"),r=_e(e,t);return xe(n?r.bg:e.accents_2,.65)}(r.palette,y)}),[r.palette,y]),B=(0,e.useMemo)((function(){return function(t,n,r){var a=r.icon,o=r.iconRight,l=a||o,i=Boolean(o),u=t?"calc(var(--geist-ui-button-height) / 2 + var(--geist-ui-button-icon-padding) * .5)":0,c=se("text",i?"right":"left");return l?0===e.Children.count(n)?e.createElement(ve,{isRight:i,isSingle:!0},l):e.createElement(e.Fragment,null,e.createElement(ve,{isRight:i},l),e.createElement("div",{className:I.dynamic([["3568181479",[u,u]]])+" "+(c||"")},n,e.createElement(I,{id:"3568181479",dynamic:[u,u]},".left.__jsx-style-dynamic-selector{padding-left:".concat(u,";}.right.__jsx-style-dynamic-selector{padding-right:").concat(u,";}")))):e.createElement("div",{className:"text"},n)}(E,v,{icon:C,iconRight:T})}),[E,v,C,T]),W=E?o.pl(1.15):o.pl(1.375),$=E?o.pr(1.15):o.pr(1.375);return e.createElement("button",u({ref:l,type:N,disabled:b,onClick:function(e){if(!b&&!w){if(!k&&!x&&S&&l.current){var t=l.current.getBoundingClientRect();s(!0),p(e.clientX-t.left),g(e.clientY-t.top)}_&&_(e)}}},P,{className:I.dynamic([["86551275",[o.height(2.5),r.layout.radius,o.font(.875),j,R,O,D,A,k?r.expressiveness.shadowSmall:"none",o.pl(.727),o.height(2.5),j,R,E?"min-content":o.width(10.5),E?"auto":"initial",o.height(2.5),o.pt(0),$,o.pb(0),W,o.mt(0),o.mr(0),o.mb(0),o.ml(0),M.color,M.color,M.bg,M.border,D,A,k?r.expressiveness.shadowMedium:"none",k?"-1px":"0px"]]])+" "+(P&&null!=P.className&&P.className||se("btn",z)||"")}),w&&e.createElement(he,{color:j}),B,c&&e.createElement(le,{x:d,y:h,color:U,onCompleted:function(){s(!1),p(0),g(0)}}),e.createElement(I,{id:"86551275",dynamic:[o.height(2.5),r.layout.radius,o.font(.875),j,R,O,D,A,k?r.expressiveness.shadowSmall:"none",o.pl(.727),o.height(2.5),j,R,E?"min-content":o.width(10.5),E?"auto":"initial",o.height(2.5),o.pt(0),$,o.pb(0),W,o.mt(0),o.mr(0),o.mb(0),o.ml(0),M.color,M.color,M.bg,M.border,D,A,k?r.expressiveness.shadowMedium:"none",k?"-1px":"0px"]},".btn.__jsx-style-dynamic-selector{box-sizing:border-box;display:inline-block;line-height:".concat(o.height(2.5),";border-radius:").concat(r.layout.radius,";font-weight:400;font-size:").concat(o.font(.875),";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:none;text-transform:capitalize;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center;white-space:nowrap;-webkit-transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;transition:background-color 200ms ease 0ms,box-shadow 200ms ease 0ms, border 200ms ease 0ms,color 200ms ease 0ms;position:relative;overflow:hidden;color:").concat(j,";background-color:").concat(R,";border:1px solid ").concat(O,";cursor:").concat(D,";pointer-events:").concat(A,";box-shadow:").concat(k?r.expressiveness.shadowSmall:"none",";--geist-ui-button-icon-padding:").concat(o.pl(.727),";--geist-ui-button-height:").concat(o.height(2.5),";--geist-ui-button-color:").concat(j,";--geist-ui-button-bg:").concat(R,";min-width:").concat(E?"min-content":o.width(10.5),";width:").concat(E?"auto":"initial",";height:").concat(o.height(2.5),";padding:").concat(o.pt(0)," ").concat($," ").concat(o.pb(0)," ").concat(W,";margin:").concat(o.mt(0)," ").concat(o.mr(0)," ").concat(o.mb(0)," ").concat(o.ml(0),";}.btn.__jsx-style-dynamic-selector:hover,.btn.__jsx-style-dynamic-selector:focus{color:").concat(M.color,";--geist-ui-button-color:").concat(M.color,";background-color:").concat(M.bg,";border-color:").concat(M.border,";cursor:").concat(D,";pointer-events:").concat(A,";box-shadow:").concat(k?r.expressiveness.shadowMedium:"none",";-webkit-transform:translate3d(0px,").concat(k?"-1px":"0px",",0px);-ms-transform:translate3d(0px,").concat(k?"-1px":"0px",",0px);transform:translate3d(0px,").concat(k?"-1px":"0px",",0px);}.btn.__jsx-style-dynamic-selector .text{position:relative;z-index:1;display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;line-height:inherit;top:-1px;}.btn.__jsx-style-dynamic-selector .text p,.btn.__jsx-style-dynamic-selector .text pre,.btn.__jsx-style-dynamic-selector .text div{margin:0;}")))}));Ce.defaultProps={type:"default",htmlType:"button",ghost:!1,loading:!1,shadow:!1,auto:!1,effect:!0,disabled:!1,className:""},Ce.displayName="GeistButton";var Ne=ae(Ce),Te=function(){for(var e=arguments.length,t=new Array(e),n=0;n 5.0`)
-## Getting Started
-
-First, run the development server:
-
-```bash
-npm run dev
-# or
-yarn dev
-```
-
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
-
-**Run the following command to see the size of the bundle:**
-
-```bash
-npm run analyze
-# or
-yarn analyze
-```
-
-## Preview
-
-If we don't do anything, the volume of `geist-ui` is about `58kb`, note that **the volume here includes lib `styled-jsx`**.
-It means that even if you use lib `styled-jsx` again, the volume will not increase.
-
-At present, it seems that this volume of component library is still acceptable:
-
-![output-before](public/output-before.png)
-
-
-
-**When we use `tree shaking`:**
-
-The volume of `geist-ui` is about `13kb`.(It consists of two parts)
-It should be noted that the specific package size depends on how many components you use.
-
-![output-after](public/output-after.png)
-
-## Other
-
-If you don't use `tree shaking` in your project, bundle `geist-ui` as a `chunk`
-every time, you may notice that the hash name of `chunk` is still changing,
-this may cause you to not make full use of the cache.
-
-- This issue from `next.js`, and they're improving that, you can track progress [here](https://github.com/vercel/next.js/issues/6303).
-- If you want to customize config of webpack, to ensure that the `chunk` from `geist-ui` is always the same,
- you can refer to [this document](https://webpack.js.org/guides/code-splitting/).
+In this example, run `yarn analyze` to see the results of the build.
diff --git a/examples/tree-shaking-nextjs/next.config.js b/examples/tree-shaking-nextjs/next.config.js
index 9916cd4db..9c2938291 100644
--- a/examples/tree-shaking-nextjs/next.config.js
+++ b/examples/tree-shaking-nextjs/next.config.js
@@ -1,6 +1,9 @@
-const withTM = require('next-transpile-modules')(['@geist-ui/core'])
const withBundleAnalyzer = require('@next/bundle-analyzer')({
enabled: process.env.ANALYZE === 'true',
})
-module.exports = withTM(withBundleAnalyzer({}))
+module.exports = withBundleAnalyzer({
+ eslint: {
+ ignoreDuringBuilds: true,
+ },
+})
diff --git a/examples/tree-shaking-nextjs/package.json b/examples/tree-shaking-nextjs/package.json
index cf42604d5..1ffbe8039 100644
--- a/examples/tree-shaking-nextjs/package.json
+++ b/examples/tree-shaking-nextjs/package.json
@@ -1,7 +1,6 @@
{
"name": "tree-shaking-nextjs",
"version": "0.1.0",
- "private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
@@ -9,14 +8,12 @@
"analyze": "ANALYZE=true yarn build"
},
"dependencies": {
- "@geist-ui/core": "latest",
- "next": "9.4.2",
- "react": "16.13.1",
- "react-dom": "16.13.1"
+ "@geist-ui/core": "^2.3.3",
+ "next": "^12.1.0",
+ "react": "^17.0.2",
+ "react-dom": "^17.0.2"
},
"devDependencies": {
- "@next/bundle-analyzer": "^9.4.4",
- "babel-plugin-import": "^1.13.0",
- "next-transpile-modules": "^3.3.0"
+ "@next/bundle-analyzer": "^9.4.4"
}
}
diff --git a/examples/tree-shaking-nextjs/public/output-after.png b/examples/tree-shaking-nextjs/public/output-after.png
deleted file mode 100644
index 944581e46..000000000
Binary files a/examples/tree-shaking-nextjs/public/output-after.png and /dev/null differ
diff --git a/examples/tree-shaking-nextjs/public/output-before.png b/examples/tree-shaking-nextjs/public/output-before.png
deleted file mode 100644
index 87688691a..000000000
Binary files a/examples/tree-shaking-nextjs/public/output-before.png and /dev/null differ
diff --git a/examples/tree-shaking-webpack/.babelrc b/examples/tree-shaking-webpack/.babelrc
index 06c656698..2b7bafa5f 100644
--- a/examples/tree-shaking-webpack/.babelrc
+++ b/examples/tree-shaking-webpack/.babelrc
@@ -1,4 +1,3 @@
{
- "presets": ["@babel/preset-env", "@babel/preset-react"],
- "plugins": [["import", { "libraryName": "@geist-ui/core", "libraryDirectory": "esm" }]]
+ "presets": ["@babel/preset-env", "@babel/preset-react"]
}
diff --git a/examples/tree-shaking-webpack/README.md b/examples/tree-shaking-webpack/README.md
index 9bbc09df2..90b53e422 100644
--- a/examples/tree-shaking-webpack/README.md
+++ b/examples/tree-shaking-webpack/README.md
@@ -2,16 +2,16 @@
### About
-If you use `webpack` and `babel` to build your React project, this example may be useful for you.
+Full tree-shaking is automatically available without any configuration when using `webpack 5.0` or higher.
### Previews
**Before:**
-![before](esm-1.png)
+![before](tree-shaking-before.png)
**After:**
-![after](esm-2.png)
+![after](tree-shaking-after.png)
diff --git a/examples/tree-shaking-webpack/esm-1.png b/examples/tree-shaking-webpack/esm-1.png
deleted file mode 100644
index 20c28107a..000000000
Binary files a/examples/tree-shaking-webpack/esm-1.png and /dev/null differ
diff --git a/examples/tree-shaking-webpack/esm-2.png b/examples/tree-shaking-webpack/esm-2.png
deleted file mode 100644
index b95183cb2..000000000
Binary files a/examples/tree-shaking-webpack/esm-2.png and /dev/null differ
diff --git a/examples/tree-shaking-webpack/package.json b/examples/tree-shaking-webpack/package.json
index 92b54b80d..3ad5e2119 100644
--- a/examples/tree-shaking-webpack/package.json
+++ b/examples/tree-shaking-webpack/package.json
@@ -5,24 +5,24 @@
"license": "MIT",
"scripts": {
"start": "webpack-dev-server --config ./webpack.config.js --mode development",
- "build": "webpack --config ./webpack.config.js",
- "analyze": "source-map-explorer 'dist/*.js'"
+ "build": "webpack --config ./webpack.config.js --mode production",
+ "analyze": "source-map-explorer 'dist/*.js' --gzip"
},
+ "sideEffects": false,
"devDependencies": {
- "@babel/core": "^7.9.6",
- "@babel/preset-env": "^7.9.6",
- "@babel/preset-react": "^7.9.4",
- "babel-loader": "^8.1.0",
- "babel-plugin-import": "^1.13.0",
- "html-webpack-plugin": "^4.3.0",
- "source-map-explorer": "^2.4.2",
- "webpack": "^4.43.0",
- "webpack-cli": "^3.3.11",
- "webpack-dev-server": "^3.11.0"
+ "@babel/core": "^7.17.5",
+ "@babel/preset-env": "^7.16.11",
+ "@babel/preset-react": "^7.16.7",
+ "babel-loader": "^8.2.3",
+ "html-webpack-plugin": "^5.5.0",
+ "source-map-explorer": "^2.5.2",
+ "webpack": "^5.69.1",
+ "webpack-cli": "^4.9.2",
+ "webpack-dev-server": "^4.7.4"
},
"dependencies": {
- "@geist-ui/core": "latest",
- "react": "^16.13.1",
- "react-dom": "^16.13.1"
+ "@geist-ui/core": "^2.3.3",
+ "react": "^17.0.2",
+ "react-dom": "^17.0.2"
}
}
diff --git a/examples/tree-shaking-webpack/tree-shaking-after.png b/examples/tree-shaking-webpack/tree-shaking-after.png
new file mode 100644
index 000000000..0bd147a87
Binary files /dev/null and b/examples/tree-shaking-webpack/tree-shaking-after.png differ
diff --git a/examples/tree-shaking-webpack/tree-shaking-before.png b/examples/tree-shaking-webpack/tree-shaking-before.png
new file mode 100644
index 000000000..8a62af51b
Binary files /dev/null and b/examples/tree-shaking-webpack/tree-shaking-before.png differ
diff --git a/examples/tree-shaking-webpack/webpack.config.js b/examples/tree-shaking-webpack/webpack.config.js
index 26a29f8ac..a9d8332db 100644
--- a/examples/tree-shaking-webpack/webpack.config.js
+++ b/examples/tree-shaking-webpack/webpack.config.js
@@ -29,11 +29,14 @@ module.exports = {
plugins: [
new HtmlWebpackPlugin({ template: path.join(__dirname, './src/index.html') }),
],
+
+ optimization: {
+ usedExports: true,
+ },
devServer: {
host: '127.0.0.1',
port: '3000',
- contentBase: './dist',
hot: true,
open: true,
},
diff --git a/lib/data/metadata-en-us.json b/lib/data/metadata-en-us.json
index d5ab8b5e8..71714437f 100644
--- a/lib/data/metadata-en-us.json
+++ b/lib/data/metadata-en-us.json
@@ -1 +1 @@
-[{"name":"guide","children":[{"name":"Getting Started","children":[{"name":"Introduction","url":"/en-us/guide/introduction","index":5,"group":"Getting Started"},{"name":"Installation","url":"/en-us/guide/installation","index":10,"group":"Getting Started"},{"name":"Server Render","url":"/en-us/guide/server-render","index":15,"group":"Getting Started"}]},{"name":"Customization","children":[{"name":"Colors","url":"/en-us/guide/colors","index":20,"group":"Customization"},{"name":"Themes","url":"/en-us/guide/themes","index":25,"group":"Customization"},{"name":"Scale","url":"/en-us/guide/scale","index":30,"group":"Customization"}]}]},{"name":"components","children":[{"name":"General","children":[{"name":"Text","url":"/en-us/components/text","index":10,"group":"General"},{"name":"Button","url":"/en-us/components/button","index":100,"group":"General"},{"name":"Code","url":"/en-us/components/code","index":100,"group":"General"},{"name":"Icons","url":"/en-us/components/icons","index":100,"group":"General"}]},{"name":"Layout","children":[{"name":"Grid","url":"/en-us/components/grid","index":100,"group":"Layout"},{"name":"Page","url":"/en-us/components/page","index":100,"group":"Layout"},{"name":"Spacer","url":"/en-us/components/spacer","index":100,"group":"Layout"}]},{"name":"Surfaces","children":[{"name":"Card","url":"/en-us/components/card","index":100,"group":"Surfaces"},{"name":"Collapse","url":"/en-us/components/collapse","index":100,"group":"Surfaces"},{"name":"Fieldset","url":"/en-us/components/fieldset","index":100,"group":"Surfaces"}]},{"name":"Data Entry","children":[{"name":"AutoComplete","url":"/en-us/components/auto-complete","index":100,"group":"Data Entry"},{"name":"Button Group","url":"/en-us/components/button-group","index":100,"group":"Data Entry"},{"name":"Checkbox","url":"/en-us/components/checkbox","index":100,"group":"Data Entry"},{"name":"Input","url":"/en-us/components/input","index":100,"group":"Data Entry"},{"name":"Radio","url":"/en-us/components/radio","index":100,"group":"Data Entry"},{"name":"Select","url":"/en-us/components/select","index":100,"group":"Data Entry"},{"name":"Slider","url":"/en-us/components/slider","index":100,"group":"Data Entry"},{"name":"Textarea","url":"/en-us/components/textarea","index":100,"group":"Data Entry"},{"name":"Toggle","url":"/en-us/components/toggle","index":100,"group":"Data Entry"}]},{"name":"Data Display","children":[{"name":"Avatar","url":"/en-us/components/avatar","index":100,"group":"Data Display"},{"name":"Badge","url":"/en-us/components/badge","index":100,"group":"Data Display"},{"name":"Capacity","url":"/en-us/components/capacity","index":100,"group":"Data Display"},{"name":"Description","url":"/en-us/components/description","index":100,"group":"Data Display"},{"name":"Display","url":"/en-us/components/display","index":100,"group":"Data Display"},{"name":"Dot","url":"/en-us/components/dot","index":100,"group":"Data Display"},{"name":"File Tree","url":"/en-us/components/file-tree","index":100,"group":"Data Display"},{"name":"Image","url":"/en-us/components/image","index":100,"group":"Data Display"},{"name":"Keyboard","url":"/en-us/components/keyboard","index":100,"group":"Data Display"},{"name":"Popover","url":"/en-us/components/popover","index":100,"group":"Data Display"},{"name":"Table","url":"/en-us/components/table","index":100,"group":"Data Display"},{"name":"Tag","url":"/en-us/components/tag","index":100,"group":"Data Display"},{"name":"Tooltip","url":"/en-us/components/tooltip","index":100,"group":"Data Display"},{"name":"User","url":"/en-us/components/user","index":100,"group":"Data Display"}]},{"name":"Feedback","children":[{"name":"Drawer","url":"/en-us/components/drawer","index":100,"group":"Feedback"},{"name":"Loading","url":"/en-us/components/loading","index":100,"group":"Feedback"},{"name":"Modal","url":"/en-us/components/modal","index":100,"group":"Feedback"},{"name":"Note","url":"/en-us/components/note","index":100,"group":"Feedback"},{"name":"Progress","url":"/en-us/components/progress","index":100,"group":"Feedback"},{"name":"Rating","url":"/en-us/components/rating","index":100,"group":"Feedback"},{"name":"Spinner","url":"/en-us/components/spinner","index":100,"group":"Feedback"},{"name":"Toast","url":"/en-us/components/toast","index":100,"group":"Feedback"}]},{"name":"Navigation","children":[{"name":"Breadcrumbs","url":"/en-us/components/breadcrumbs","index":100,"group":"Navigation"},{"name":"Link","url":"/en-us/components/link","index":100,"group":"Navigation"},{"name":"Pagination","url":"/en-us/components/pagination","index":100,"group":"Navigation"},{"name":"Tabs","url":"/en-us/components/tabs","index":100,"group":"Navigation"},{"name":"Button Dropdown","url":"/en-us/components/button-dropdown","index":101,"group":"Navigation"}]},{"name":"Others","children":[{"name":"Divider","url":"/en-us/components/divider","index":100,"group":"Others"},{"name":"Snippet","url":"/en-us/components/snippet","index":100,"group":"Others"}]}]},{"name":"hooks","children":[{"name":"Enhancement","children":[{"name":"useKeyboard","url":"/en-us/hooks/use-keyboard","index":5,"group":"Enhancement"},{"name":"useInput","url":"/en-us/hooks/use-input","index":10,"group":"Enhancement"},{"name":"useModal","url":"/en-us/hooks/use-modal","index":11,"group":"Enhancement"},{"name":"useTabs","url":"/en-us/hooks/use-tabs","index":11,"group":"Enhancement"},{"name":"useToast","url":"/en-us/hooks/use-toast","index":12,"group":"Enhancement"}]},{"name":"Utilities","children":[{"name":"useBodyScroll","url":"/en-us/hooks/use-body-scroll","index":100,"group":"Utilities"},{"name":"useClickAway","url":"/en-us/hooks/use-click-away","index":100,"group":"Utilities"},{"name":"useClipboard","url":"/en-us/hooks/use-clipboard","index":100,"group":"Utilities"},{"name":"useMediaQuery","url":"/en-us/hooks/use-media-query","index":100,"group":"Utilities"}]},{"name":"Development","children":[{"name":"useTheme","url":"/en-us/hooks/use-theme","index":100,"group":"Development"},{"name":"useCurrentState","url":"/en-us/hooks/use-current-state","index":101,"group":"Development"},{"name":"useScale","url":"/en-us/hooks/use-scale","index":103,"group":"Development"},{"name":"useClasses","url":"/en-us/hooks/use-classes","index":104,"group":"Development"}]}]}]
+[{"name":"guide","children":[{"name":"Getting Started","children":[{"name":"Introduction","url":"/en-us/guide/introduction","index":5,"group":"Getting Started"},{"name":"Installation","url":"/en-us/guide/installation","index":10,"group":"Getting Started"},{"name":"Bundle Size","url":"/en-us/guide/bundle-size","index":11,"group":"Getting Started"},{"name":"Server Render","url":"/en-us/guide/server-render","index":15,"group":"Getting Started"}]},{"name":"Customization","children":[{"name":"Colors","url":"/en-us/guide/colors","index":20,"group":"Customization"},{"name":"Themes","url":"/en-us/guide/themes","index":25,"group":"Customization"},{"name":"Scale","url":"/en-us/guide/scale","index":30,"group":"Customization"}]}]},{"name":"components","children":[{"name":"General","children":[{"name":"Text","url":"/en-us/components/text","index":10,"group":"General"},{"name":"Button","url":"/en-us/components/button","index":100,"group":"General"},{"name":"Code","url":"/en-us/components/code","index":100,"group":"General"},{"name":"Icons","url":"/en-us/components/icons","index":100,"group":"General"}]},{"name":"Layout","children":[{"name":"Grid","url":"/en-us/components/grid","index":100,"group":"Layout"},{"name":"Page","url":"/en-us/components/page","index":100,"group":"Layout"},{"name":"Spacer","url":"/en-us/components/spacer","index":100,"group":"Layout"}]},{"name":"Surfaces","children":[{"name":"Card","url":"/en-us/components/card","index":100,"group":"Surfaces"},{"name":"Collapse","url":"/en-us/components/collapse","index":100,"group":"Surfaces"},{"name":"Fieldset","url":"/en-us/components/fieldset","index":100,"group":"Surfaces"}]},{"name":"Data Entry","children":[{"name":"AutoComplete","url":"/en-us/components/auto-complete","index":100,"group":"Data Entry"},{"name":"Button Group","url":"/en-us/components/button-group","index":100,"group":"Data Entry"},{"name":"Checkbox","url":"/en-us/components/checkbox","index":100,"group":"Data Entry"},{"name":"Input","url":"/en-us/components/input","index":100,"group":"Data Entry"},{"name":"Radio","url":"/en-us/components/radio","index":100,"group":"Data Entry"},{"name":"Select","url":"/en-us/components/select","index":100,"group":"Data Entry"},{"name":"Slider","url":"/en-us/components/slider","index":100,"group":"Data Entry"},{"name":"Textarea","url":"/en-us/components/textarea","index":100,"group":"Data Entry"},{"name":"Toggle","url":"/en-us/components/toggle","index":100,"group":"Data Entry"}]},{"name":"Data Display","children":[{"name":"Avatar","url":"/en-us/components/avatar","index":100,"group":"Data Display"},{"name":"Badge","url":"/en-us/components/badge","index":100,"group":"Data Display"},{"name":"Capacity","url":"/en-us/components/capacity","index":100,"group":"Data Display"},{"name":"Description","url":"/en-us/components/description","index":100,"group":"Data Display"},{"name":"Display","url":"/en-us/components/display","index":100,"group":"Data Display"},{"name":"Dot","url":"/en-us/components/dot","index":100,"group":"Data Display"},{"name":"File Tree","url":"/en-us/components/file-tree","index":100,"group":"Data Display"},{"name":"Image","url":"/en-us/components/image","index":100,"group":"Data Display"},{"name":"Keyboard","url":"/en-us/components/keyboard","index":100,"group":"Data Display"},{"name":"Popover","url":"/en-us/components/popover","index":100,"group":"Data Display"},{"name":"Table","url":"/en-us/components/table","index":100,"group":"Data Display"},{"name":"Tag","url":"/en-us/components/tag","index":100,"group":"Data Display"},{"name":"Tooltip","url":"/en-us/components/tooltip","index":100,"group":"Data Display"},{"name":"User","url":"/en-us/components/user","index":100,"group":"Data Display"}]},{"name":"Feedback","children":[{"name":"Drawer","url":"/en-us/components/drawer","index":100,"group":"Feedback"},{"name":"Loading","url":"/en-us/components/loading","index":100,"group":"Feedback"},{"name":"Modal","url":"/en-us/components/modal","index":100,"group":"Feedback"},{"name":"Note","url":"/en-us/components/note","index":100,"group":"Feedback"},{"name":"Progress","url":"/en-us/components/progress","index":100,"group":"Feedback"},{"name":"Rating","url":"/en-us/components/rating","index":100,"group":"Feedback"},{"name":"Spinner","url":"/en-us/components/spinner","index":100,"group":"Feedback"},{"name":"Toast","url":"/en-us/components/toast","index":100,"group":"Feedback"}]},{"name":"Navigation","children":[{"name":"Breadcrumbs","url":"/en-us/components/breadcrumbs","index":100,"group":"Navigation"},{"name":"Link","url":"/en-us/components/link","index":100,"group":"Navigation"},{"name":"Pagination","url":"/en-us/components/pagination","index":100,"group":"Navigation"},{"name":"Tabs","url":"/en-us/components/tabs","index":100,"group":"Navigation"},{"name":"Button Dropdown","url":"/en-us/components/button-dropdown","index":101,"group":"Navigation"}]},{"name":"Others","children":[{"name":"Divider","url":"/en-us/components/divider","index":100,"group":"Others"},{"name":"Snippet","url":"/en-us/components/snippet","index":100,"group":"Others"}]}]},{"name":"hooks","children":[{"name":"Enhancement","children":[{"name":"useKeyboard","url":"/en-us/hooks/use-keyboard","index":5,"group":"Enhancement"},{"name":"useInput","url":"/en-us/hooks/use-input","index":10,"group":"Enhancement"},{"name":"useModal","url":"/en-us/hooks/use-modal","index":11,"group":"Enhancement"},{"name":"useTabs","url":"/en-us/hooks/use-tabs","index":11,"group":"Enhancement"},{"name":"useToast","url":"/en-us/hooks/use-toast","index":12,"group":"Enhancement"}]},{"name":"Utilities","children":[{"name":"useBodyScroll","url":"/en-us/hooks/use-body-scroll","index":100,"group":"Utilities"},{"name":"useClickAway","url":"/en-us/hooks/use-click-away","index":100,"group":"Utilities"},{"name":"useClipboard","url":"/en-us/hooks/use-clipboard","index":100,"group":"Utilities"},{"name":"useMediaQuery","url":"/en-us/hooks/use-media-query","index":100,"group":"Utilities"}]},{"name":"Development","children":[{"name":"useTheme","url":"/en-us/hooks/use-theme","index":100,"group":"Development"},{"name":"useCurrentState","url":"/en-us/hooks/use-current-state","index":101,"group":"Development"},{"name":"useScale","url":"/en-us/hooks/use-scale","index":103,"group":"Development"},{"name":"useClasses","url":"/en-us/hooks/use-classes","index":104,"group":"Development"}]}]}]
diff --git a/lib/data/metadata-zh-cn.json b/lib/data/metadata-zh-cn.json
index 3a8c5b29a..1d86ca5ae 100644
--- a/lib/data/metadata-zh-cn.json
+++ b/lib/data/metadata-zh-cn.json
@@ -1 +1 @@
-[{"name":"guide","children":[{"name":"快速上手","children":[{"name":"什么是 Geist UI","url":"/zh-cn/guide/introduction","index":5,"group":"快速上手"},{"name":"安装","url":"/zh-cn/guide/installation","index":10,"group":"快速上手"},{"name":"服务端渲染","url":"/zh-cn/guide/server-render","index":15,"group":"快速上手"}]},{"name":"定制化","children":[{"name":"色彩","url":"/zh-cn/guide/colors","index":5,"group":"定制化"},{"name":"主题","url":"/zh-cn/guide/themes","index":10,"group":"定制化"},{"name":"可伸缩性","url":"/zh-cn/guide/scale","index":20,"group":"定制化"}]}],"localeName":"上手指南"},{"name":"components","children":[{"name":"通用","children":[{"name":"文本 Text","url":"/zh-cn/components/text","index":10,"group":"通用"},{"name":"按钮 Button","url":"/zh-cn/components/button","index":100,"group":"通用"},{"name":"代码 Code","url":"/zh-cn/components/code","index":100,"group":"通用"},{"name":"图标 Icons","url":"/zh-cn/components/icons","index":100,"group":"通用"}]},{"name":"布局","children":[{"name":"栅格 Grid","url":"/zh-cn/components/grid","index":100,"group":"布局"},{"name":"页面 Page","url":"/zh-cn/components/page","index":100,"group":"布局"},{"name":"间距 Spacer","url":"/zh-cn/components/spacer","index":100,"group":"布局"}]},{"name":"表面","children":[{"name":"卡片 Card","url":"/zh-cn/components/card","index":100,"group":"表面"},{"name":"折叠框 Collapse","url":"/zh-cn/components/collapse","index":100,"group":"表面"},{"name":"控件组 Fieldset","url":"/zh-cn/components/fieldset","index":100,"group":"表面"}]},{"name":"数据录入","children":[{"name":"按钮组 Button Group","url":"/zh-cn/components/button-group","index":100,"group":"数据录入"},{"name":"复选框 Checkbox","url":"/zh-cn/components/checkbox","index":100,"group":"数据录入"},{"name":"输入框 Input","url":"/zh-cn/components/input","index":100,"group":"数据录入"},{"name":"单选框 Radio","url":"/zh-cn/components/radio","index":100,"group":"数据录入"},{"name":"选择器 Select","url":"/zh-cn/components/select","index":100,"group":"数据录入"},{"name":"滑动输入 Slider","url":"/zh-cn/components/slider","index":100,"group":"数据录入"},{"name":"文本输入框 Textarea","url":"/zh-cn/components/textarea","index":100,"group":"数据录入"},{"name":"开关 Toggle","url":"/zh-cn/components/toggle","index":100,"group":"数据录入"},{"name":"自动完成 Autocomplete","url":"/zh-cn/components/auto-complete","index":104,"group":"数据录入"}]},{"name":"数据展示","children":[{"name":"头像 Avatar","url":"/zh-cn/components/avatar","index":100,"group":"数据展示"},{"name":"徽章 Badge","url":"/zh-cn/components/badge","index":100,"group":"数据展示"},{"name":"容量 Capacity","url":"/zh-cn/components/capacity","index":100,"group":"数据展示"},{"name":"描述 Description","url":"/zh-cn/components/description","index":100,"group":"数据展示"},{"name":"陈列框 Display","url":"/zh-cn/components/display","index":100,"group":"数据展示"},{"name":"点 Dot","url":"/zh-cn/components/dot","index":100,"group":"数据展示"},{"name":"文件树 File Tree","url":"/zh-cn/components/file-tree","index":100,"group":"数据展示"},{"name":"图片 Image","url":"/zh-cn/components/image","index":100,"group":"数据展示"},{"name":"键盘 keyboard","url":"/zh-cn/components/keyboard","index":100,"group":"数据展示"},{"name":"气泡卡片 Popover","url":"/zh-cn/components/popover","index":100,"group":"数据展示"},{"name":"表格 Table","url":"/zh-cn/components/table","index":100,"group":"数据展示"},{"name":"标签 Tag","url":"/zh-cn/components/tag","index":100,"group":"数据展示"},{"name":"文字提示 Tooltip","url":"/zh-cn/components/tooltip","index":100,"group":"数据展示"},{"name":"用户 User","url":"/zh-cn/components/user","index":100,"group":"数据展示"}]},{"name":"反馈","children":[{"name":"抽屉 Drawer","url":"/zh-cn/components/drawer","index":100,"group":"反馈"},{"name":"加载中 Loading","url":"/zh-cn/components/loading","index":100,"group":"反馈"},{"name":"对话框 Modal","url":"/zh-cn/components/modal","index":100,"group":"反馈"},{"name":"提示 Note","url":"/zh-cn/components/note","index":100,"group":"反馈"},{"name":"进度条 Progress","url":"/zh-cn/components/progress","index":100,"group":"反馈"},{"name":"评分 Rating","url":"/zh-cn/components/rating","index":100,"group":"反馈"},{"name":"指示器 Spinner","url":"/zh-cn/components/spinner","index":100,"group":"反馈"},{"name":"通知 Toast","url":"/zh-cn/components/toast","index":100,"group":"反馈"}]},{"name":"导航","children":[{"name":"面包屑 Breadcrumbs","url":"/zh-cn/components/breadcrumbs","index":100,"group":"导航"},{"name":"链接 Link","url":"/zh-cn/components/link","index":100,"group":"导航"},{"name":"分页 Pagination","url":"/zh-cn/components/pagination","index":100,"group":"导航"},{"name":"选项卡 Tabs","url":"/zh-cn/components/tabs","index":100,"group":"导航"},{"name":"下拉按钮 Btn Dropdown","url":"/zh-cn/components/button-dropdown","index":105,"group":"导航"}]},{"name":"其他","children":[{"name":"分割线 Divider","url":"/zh-cn/components/divider","index":100,"group":"其他"},{"name":"片段 Snippet","url":"/zh-cn/components/snippet","index":100,"group":"其他"}]}],"localeName":"所有组件"},{"name":"hooks","children":[{"name":"组件增强","children":[{"name":"键盘事件 useKeyboard","url":"/zh-cn/hooks/use-keyboard","index":5,"group":"组件增强"},{"name":"输入框绑定 useInput","url":"/zh-cn/hooks/use-input","index":10,"group":"组件增强"},{"name":"对话框绑定 useModal","url":"/zh-cn/hooks/use-modal","index":11,"group":"组件增强"},{"name":"选项卡绑定 useTabs","url":"/zh-cn/hooks/use-tabs","index":11,"group":"组件增强"},{"name":"通知 useToast","url":"/zh-cn/hooks/use-toast","index":12,"group":"组件增强"}]},{"name":"实用工具","children":[{"name":"锁定滚动 useBodyScroll","url":"/zh-cn/hooks/use-body-scroll","index":100,"group":"实用工具"},{"name":"点击他处 useClickAway","url":"/zh-cn/hooks/use-click-away","index":100,"group":"实用工具"},{"name":"剪切板 useClipboard","url":"/zh-cn/hooks/use-clipboard","index":100,"group":"实用工具"},{"name":"媒体查询 useMediaQuery","url":"/zh-cn/hooks/use-media-query","index":100,"group":"实用工具"}]},{"name":"开发者","children":[{"name":"主题的状态 useTheme","url":"/zh-cn/hooks/use-theme","index":100,"group":"开发者"},{"name":"当前值 useCurrentState","url":"/zh-cn/hooks/use-current-state","index":101,"group":"开发者"},{"name":"自定义缩放 useScale","url":"/zh-cn/hooks/use-scale","index":103,"group":"开发者"},{"name":"类名合并 useClasses","url":"/zh-cn/hooks/use-classes","index":105,"group":"开发者"}]}]}]
+[{"name":"guide","children":[{"name":"快速上手","children":[{"name":"什么是 Geist UI","url":"/zh-cn/guide/introduction","index":5,"group":"快速上手"},{"name":"安装","url":"/zh-cn/guide/installation","index":10,"group":"快速上手"},{"name":"构建体积","url":"/zh-cn/guide/bundle-size","index":11,"group":"快速上手"},{"name":"服务端渲染","url":"/zh-cn/guide/server-render","index":15,"group":"快速上手"}]},{"name":"定制化","children":[{"name":"色彩","url":"/zh-cn/guide/colors","index":5,"group":"定制化"},{"name":"主题","url":"/zh-cn/guide/themes","index":10,"group":"定制化"},{"name":"可伸缩性","url":"/zh-cn/guide/scale","index":20,"group":"定制化"}]}],"localeName":"上手指南"},{"name":"components","children":[{"name":"通用","children":[{"name":"文本 Text","url":"/zh-cn/components/text","index":10,"group":"通用"},{"name":"按钮 Button","url":"/zh-cn/components/button","index":100,"group":"通用"},{"name":"代码 Code","url":"/zh-cn/components/code","index":100,"group":"通用"},{"name":"图标 Icons","url":"/zh-cn/components/icons","index":100,"group":"通用"}]},{"name":"布局","children":[{"name":"栅格 Grid","url":"/zh-cn/components/grid","index":100,"group":"布局"},{"name":"页面 Page","url":"/zh-cn/components/page","index":100,"group":"布局"},{"name":"间距 Spacer","url":"/zh-cn/components/spacer","index":100,"group":"布局"}]},{"name":"表面","children":[{"name":"卡片 Card","url":"/zh-cn/components/card","index":100,"group":"表面"},{"name":"折叠框 Collapse","url":"/zh-cn/components/collapse","index":100,"group":"表面"},{"name":"控件组 Fieldset","url":"/zh-cn/components/fieldset","index":100,"group":"表面"}]},{"name":"数据录入","children":[{"name":"按钮组 Button Group","url":"/zh-cn/components/button-group","index":100,"group":"数据录入"},{"name":"复选框 Checkbox","url":"/zh-cn/components/checkbox","index":100,"group":"数据录入"},{"name":"输入框 Input","url":"/zh-cn/components/input","index":100,"group":"数据录入"},{"name":"单选框 Radio","url":"/zh-cn/components/radio","index":100,"group":"数据录入"},{"name":"选择器 Select","url":"/zh-cn/components/select","index":100,"group":"数据录入"},{"name":"滑动输入 Slider","url":"/zh-cn/components/slider","index":100,"group":"数据录入"},{"name":"文本输入框 Textarea","url":"/zh-cn/components/textarea","index":100,"group":"数据录入"},{"name":"开关 Toggle","url":"/zh-cn/components/toggle","index":100,"group":"数据录入"},{"name":"自动完成 Autocomplete","url":"/zh-cn/components/auto-complete","index":104,"group":"数据录入"}]},{"name":"数据展示","children":[{"name":"头像 Avatar","url":"/zh-cn/components/avatar","index":100,"group":"数据展示"},{"name":"徽章 Badge","url":"/zh-cn/components/badge","index":100,"group":"数据展示"},{"name":"容量 Capacity","url":"/zh-cn/components/capacity","index":100,"group":"数据展示"},{"name":"描述 Description","url":"/zh-cn/components/description","index":100,"group":"数据展示"},{"name":"陈列框 Display","url":"/zh-cn/components/display","index":100,"group":"数据展示"},{"name":"点 Dot","url":"/zh-cn/components/dot","index":100,"group":"数据展示"},{"name":"文件树 File Tree","url":"/zh-cn/components/file-tree","index":100,"group":"数据展示"},{"name":"图片 Image","url":"/zh-cn/components/image","index":100,"group":"数据展示"},{"name":"键盘 keyboard","url":"/zh-cn/components/keyboard","index":100,"group":"数据展示"},{"name":"气泡卡片 Popover","url":"/zh-cn/components/popover","index":100,"group":"数据展示"},{"name":"表格 Table","url":"/zh-cn/components/table","index":100,"group":"数据展示"},{"name":"标签 Tag","url":"/zh-cn/components/tag","index":100,"group":"数据展示"},{"name":"文字提示 Tooltip","url":"/zh-cn/components/tooltip","index":100,"group":"数据展示"},{"name":"用户 User","url":"/zh-cn/components/user","index":100,"group":"数据展示"}]},{"name":"反馈","children":[{"name":"抽屉 Drawer","url":"/zh-cn/components/drawer","index":100,"group":"反馈"},{"name":"加载中 Loading","url":"/zh-cn/components/loading","index":100,"group":"反馈"},{"name":"对话框 Modal","url":"/zh-cn/components/modal","index":100,"group":"反馈"},{"name":"提示 Note","url":"/zh-cn/components/note","index":100,"group":"反馈"},{"name":"进度条 Progress","url":"/zh-cn/components/progress","index":100,"group":"反馈"},{"name":"评分 Rating","url":"/zh-cn/components/rating","index":100,"group":"反馈"},{"name":"指示器 Spinner","url":"/zh-cn/components/spinner","index":100,"group":"反馈"},{"name":"通知 Toast","url":"/zh-cn/components/toast","index":100,"group":"反馈"}]},{"name":"导航","children":[{"name":"面包屑 Breadcrumbs","url":"/zh-cn/components/breadcrumbs","index":100,"group":"导航"},{"name":"链接 Link","url":"/zh-cn/components/link","index":100,"group":"导航"},{"name":"分页 Pagination","url":"/zh-cn/components/pagination","index":100,"group":"导航"},{"name":"选项卡 Tabs","url":"/zh-cn/components/tabs","index":100,"group":"导航"},{"name":"下拉按钮 Btn Dropdown","url":"/zh-cn/components/button-dropdown","index":105,"group":"导航"}]},{"name":"其他","children":[{"name":"分割线 Divider","url":"/zh-cn/components/divider","index":100,"group":"其他"},{"name":"片段 Snippet","url":"/zh-cn/components/snippet","index":100,"group":"其他"}]}],"localeName":"所有组件"},{"name":"hooks","children":[{"name":"组件增强","children":[{"name":"键盘事件 useKeyboard","url":"/zh-cn/hooks/use-keyboard","index":5,"group":"组件增强"},{"name":"输入框绑定 useInput","url":"/zh-cn/hooks/use-input","index":10,"group":"组件增强"},{"name":"对话框绑定 useModal","url":"/zh-cn/hooks/use-modal","index":11,"group":"组件增强"},{"name":"选项卡绑定 useTabs","url":"/zh-cn/hooks/use-tabs","index":11,"group":"组件增强"},{"name":"通知 useToast","url":"/zh-cn/hooks/use-toast","index":12,"group":"组件增强"}]},{"name":"实用工具","children":[{"name":"锁定滚动 useBodyScroll","url":"/zh-cn/hooks/use-body-scroll","index":100,"group":"实用工具"},{"name":"点击他处 useClickAway","url":"/zh-cn/hooks/use-click-away","index":100,"group":"实用工具"},{"name":"剪切板 useClipboard","url":"/zh-cn/hooks/use-clipboard","index":100,"group":"实用工具"},{"name":"媒体查询 useMediaQuery","url":"/zh-cn/hooks/use-media-query","index":100,"group":"实用工具"}]},{"name":"开发者","children":[{"name":"主题的状态 useTheme","url":"/zh-cn/hooks/use-theme","index":100,"group":"开发者"},{"name":"当前值 useCurrentState","url":"/zh-cn/hooks/use-current-state","index":101,"group":"开发者"},{"name":"自定义缩放 useScale","url":"/zh-cn/hooks/use-scale","index":103,"group":"开发者"},{"name":"类名合并 useClasses","url":"/zh-cn/hooks/use-classes","index":105,"group":"开发者"}]}]}]
diff --git a/lib/data/seeds-en-us.json b/lib/data/seeds-en-us.json
index cf1b2703d..83904ba70 100644
--- a/lib/data/seeds-en-us.json
+++ b/lib/data/seeds-en-us.json
@@ -1 +1 @@
-[{"name":"AutoComplete","url":"/en-us/components/auto-complete","group":"Data Entry"},{"name":"Avatar","url":"/en-us/components/avatar","group":"Data Display"},{"name":"Badge","url":"/en-us/components/badge","group":"Data Display"},{"name":"Breadcrumbs","url":"/en-us/components/breadcrumbs","group":"Navigation"},{"name":"Button Dropdown","url":"/en-us/components/button-dropdown","group":"Navigation"},{"name":"Button Group","url":"/en-us/components/button-group","group":"Data Entry"},{"name":"Button","url":"/en-us/components/button","group":"General"},{"name":"Capacity","url":"/en-us/components/capacity","group":"Data Display"},{"name":"Card","url":"/en-us/components/card","group":"Surfaces"},{"name":"Checkbox","url":"/en-us/components/checkbox","group":"Data Entry"},{"name":"Code","url":"/en-us/components/code","group":"General"},{"name":"Collapse","url":"/en-us/components/collapse","group":"Surfaces"},{"name":"Description","url":"/en-us/components/description","group":"Data Display"},{"name":"Display","url":"/en-us/components/display","group":"Data Display"},{"name":"Divider","url":"/en-us/components/divider","group":"Others"},{"name":"Dot","url":"/en-us/components/dot","group":"Data Display"},{"name":"Drawer","url":"/en-us/components/drawer","group":"Feedback"},{"name":"Fieldset","url":"/en-us/components/fieldset","group":"Surfaces"},{"name":"File Tree","url":"/en-us/components/file-tree","group":"Data Display"},{"name":"Grid","url":"/en-us/components/grid","group":"Layout"},{"name":"Icons","url":"/en-us/components/icons","group":"General"},{"name":"Image","url":"/en-us/components/image","group":"Data Display"},{"name":"Input","url":"/en-us/components/input","group":"Data Entry"},{"name":"Keyboard","url":"/en-us/components/keyboard","group":"Data Display"},{"name":"Link","url":"/en-us/components/link","group":"Navigation"},{"name":"Loading","url":"/en-us/components/loading","group":"Feedback"},{"name":"Modal","url":"/en-us/components/modal","group":"Feedback"},{"name":"Note","url":"/en-us/components/note","group":"Feedback"},{"name":"Page","url":"/en-us/components/page","group":"Layout"},{"name":"Pagination","url":"/en-us/components/pagination","group":"Navigation"},{"name":"Popover","url":"/en-us/components/popover","group":"Data Display"},{"name":"Progress","url":"/en-us/components/progress","group":"Feedback"},{"name":"Radio","url":"/en-us/components/radio","group":"Data Entry"},{"name":"Rating","url":"/en-us/components/rating","group":"Feedback"},{"name":"Select","url":"/en-us/components/select","group":"Data Entry"},{"name":"Slider","url":"/en-us/components/slider","group":"Data Entry"},{"name":"Snippet","url":"/en-us/components/snippet","group":"Others"},{"name":"Spacer","url":"/en-us/components/spacer","group":"Layout"},{"name":"Spinner","url":"/en-us/components/spinner","group":"Feedback"},{"name":"Table","url":"/en-us/components/table","group":"Data Display"},{"name":"Tabs","url":"/en-us/components/tabs","group":"Navigation"},{"name":"Tag","url":"/en-us/components/tag","group":"Data Display"},{"name":"Text","url":"/en-us/components/text","group":"General"},{"name":"Textarea","url":"/en-us/components/textarea","group":"Data Entry"},{"name":"Toast","url":"/en-us/components/toast","group":"Feedback"},{"name":"Toggle","url":"/en-us/components/toggle","group":"Data Entry"},{"name":"Tooltip","url":"/en-us/components/tooltip","group":"Data Display"},{"name":"User","url":"/en-us/components/user","group":"Data Display"},{"name":"Colors","url":"/en-us/guide/colors","group":"Customization"},{"name":"Installation","url":"/en-us/guide/installation","group":"Getting Started"},{"name":"Introduction","url":"/en-us/guide/introduction","group":"Getting Started"},{"name":"Scale","url":"/en-us/guide/scale","group":"Customization"},{"name":"Server Render","url":"/en-us/guide/server-render","group":"Getting Started"},{"name":"Themes","url":"/en-us/guide/themes","group":"Customization"},{"name":"useBodyScroll","url":"/en-us/hooks/use-body-scroll","group":"Utilities"},{"name":"useClasses","url":"/en-us/hooks/use-classes","group":"Development"},{"name":"useClickAway","url":"/en-us/hooks/use-click-away","group":"Utilities"},{"name":"useClipboard","url":"/en-us/hooks/use-clipboard","group":"Utilities"},{"name":"useCurrentState","url":"/en-us/hooks/use-current-state","group":"Development"},{"name":"useInput","url":"/en-us/hooks/use-input","group":"Enhancement"},{"name":"useKeyboard","url":"/en-us/hooks/use-keyboard","group":"Enhancement"},{"name":"useMediaQuery","url":"/en-us/hooks/use-media-query","group":"Utilities"},{"name":"useModal","url":"/en-us/hooks/use-modal","group":"Enhancement"},{"name":"useScale","url":"/en-us/hooks/use-scale","group":"Development"},{"name":"useTabs","url":"/en-us/hooks/use-tabs","group":"Enhancement"},{"name":"useTheme","url":"/en-us/hooks/use-theme","group":"Development"},{"name":"useToast","url":"/en-us/hooks/use-toast","group":"Enhancement"},{"name":"Getting Started","url":"https://codesandbox.io/s/geist-ui-n21e9","group":"Codesandbox"},{"name":"With TypeScript","url":"https://codesandbox.io/s/geist-ui-typescript-65td1","group":"Codesandbox"},{"name":"Discussions","url":"https://github.com/geist-org/geist-ui/discussions","group":"External"},{"name":"Example projects","url":"https://github.com/geist-org/geist-ui/tree/master/examples","group":"External"},{"name":"Create issue","url":"https://github.com/geist-org/geist-ui/issues/new/choose","group":"External"},{"name":"Release Note","url":"https://github.com/geist-org/geist-ui/releases","group":"External"},{"name":"Join Slack","url":"https://github.com/geist-org/geist-ui/discussions/572","group":"External"},{"name":"License","url":"https://github.com/geist-org/geist-ui/blob/master/LICENSE","group":"External"},{"name":"Canary Documentation","url":"https://rc.geist-ui.dev/","group":"External"},{"name":"Canary Releases","url":"https://github.com/geist-org/geist-ui/releases?q=canary&expanded=true","group":"External"}]
+[{"name":"AutoComplete","url":"/en-us/components/auto-complete","group":"Data Entry"},{"name":"Avatar","url":"/en-us/components/avatar","group":"Data Display"},{"name":"Badge","url":"/en-us/components/badge","group":"Data Display"},{"name":"Breadcrumbs","url":"/en-us/components/breadcrumbs","group":"Navigation"},{"name":"Button Dropdown","url":"/en-us/components/button-dropdown","group":"Navigation"},{"name":"Button Group","url":"/en-us/components/button-group","group":"Data Entry"},{"name":"Button","url":"/en-us/components/button","group":"General"},{"name":"Capacity","url":"/en-us/components/capacity","group":"Data Display"},{"name":"Card","url":"/en-us/components/card","group":"Surfaces"},{"name":"Checkbox","url":"/en-us/components/checkbox","group":"Data Entry"},{"name":"Code","url":"/en-us/components/code","group":"General"},{"name":"Collapse","url":"/en-us/components/collapse","group":"Surfaces"},{"name":"Description","url":"/en-us/components/description","group":"Data Display"},{"name":"Display","url":"/en-us/components/display","group":"Data Display"},{"name":"Divider","url":"/en-us/components/divider","group":"Others"},{"name":"Dot","url":"/en-us/components/dot","group":"Data Display"},{"name":"Drawer","url":"/en-us/components/drawer","group":"Feedback"},{"name":"Fieldset","url":"/en-us/components/fieldset","group":"Surfaces"},{"name":"File Tree","url":"/en-us/components/file-tree","group":"Data Display"},{"name":"Grid","url":"/en-us/components/grid","group":"Layout"},{"name":"Icons","url":"/en-us/components/icons","group":"General"},{"name":"Image","url":"/en-us/components/image","group":"Data Display"},{"name":"Input","url":"/en-us/components/input","group":"Data Entry"},{"name":"Keyboard","url":"/en-us/components/keyboard","group":"Data Display"},{"name":"Link","url":"/en-us/components/link","group":"Navigation"},{"name":"Loading","url":"/en-us/components/loading","group":"Feedback"},{"name":"Modal","url":"/en-us/components/modal","group":"Feedback"},{"name":"Note","url":"/en-us/components/note","group":"Feedback"},{"name":"Page","url":"/en-us/components/page","group":"Layout"},{"name":"Pagination","url":"/en-us/components/pagination","group":"Navigation"},{"name":"Popover","url":"/en-us/components/popover","group":"Data Display"},{"name":"Progress","url":"/en-us/components/progress","group":"Feedback"},{"name":"Radio","url":"/en-us/components/radio","group":"Data Entry"},{"name":"Rating","url":"/en-us/components/rating","group":"Feedback"},{"name":"Select","url":"/en-us/components/select","group":"Data Entry"},{"name":"Slider","url":"/en-us/components/slider","group":"Data Entry"},{"name":"Snippet","url":"/en-us/components/snippet","group":"Others"},{"name":"Spacer","url":"/en-us/components/spacer","group":"Layout"},{"name":"Spinner","url":"/en-us/components/spinner","group":"Feedback"},{"name":"Table","url":"/en-us/components/table","group":"Data Display"},{"name":"Tabs","url":"/en-us/components/tabs","group":"Navigation"},{"name":"Tag","url":"/en-us/components/tag","group":"Data Display"},{"name":"Text","url":"/en-us/components/text","group":"General"},{"name":"Textarea","url":"/en-us/components/textarea","group":"Data Entry"},{"name":"Toast","url":"/en-us/components/toast","group":"Feedback"},{"name":"Toggle","url":"/en-us/components/toggle","group":"Data Entry"},{"name":"Tooltip","url":"/en-us/components/tooltip","group":"Data Display"},{"name":"User","url":"/en-us/components/user","group":"Data Display"},{"name":"Bundle Size","url":"/en-us/guide/bundle-size","group":"Getting Started"},{"name":"Colors","url":"/en-us/guide/colors","group":"Customization"},{"name":"Installation","url":"/en-us/guide/installation","group":"Getting Started"},{"name":"Introduction","url":"/en-us/guide/introduction","group":"Getting Started"},{"name":"Scale","url":"/en-us/guide/scale","group":"Customization"},{"name":"Server Render","url":"/en-us/guide/server-render","group":"Getting Started"},{"name":"Themes","url":"/en-us/guide/themes","group":"Customization"},{"name":"useBodyScroll","url":"/en-us/hooks/use-body-scroll","group":"Utilities"},{"name":"useClasses","url":"/en-us/hooks/use-classes","group":"Development"},{"name":"useClickAway","url":"/en-us/hooks/use-click-away","group":"Utilities"},{"name":"useClipboard","url":"/en-us/hooks/use-clipboard","group":"Utilities"},{"name":"useCurrentState","url":"/en-us/hooks/use-current-state","group":"Development"},{"name":"useInput","url":"/en-us/hooks/use-input","group":"Enhancement"},{"name":"useKeyboard","url":"/en-us/hooks/use-keyboard","group":"Enhancement"},{"name":"useMediaQuery","url":"/en-us/hooks/use-media-query","group":"Utilities"},{"name":"useModal","url":"/en-us/hooks/use-modal","group":"Enhancement"},{"name":"useScale","url":"/en-us/hooks/use-scale","group":"Development"},{"name":"useTabs","url":"/en-us/hooks/use-tabs","group":"Enhancement"},{"name":"useTheme","url":"/en-us/hooks/use-theme","group":"Development"},{"name":"useToast","url":"/en-us/hooks/use-toast","group":"Enhancement"},{"name":"Getting Started","url":"https://codesandbox.io/s/geist-ui-n21e9","group":"Codesandbox"},{"name":"With TypeScript","url":"https://codesandbox.io/s/geist-ui-typescript-65td1","group":"Codesandbox"},{"name":"Discussions","url":"https://github.com/geist-org/geist-ui/discussions","group":"External"},{"name":"Example projects","url":"https://github.com/geist-org/geist-ui/tree/master/examples","group":"External"},{"name":"Create issue","url":"https://github.com/geist-org/geist-ui/issues/new/choose","group":"External"},{"name":"Release Note","url":"https://github.com/geist-org/geist-ui/releases","group":"External"},{"name":"Join Slack","url":"https://github.com/geist-org/geist-ui/discussions/572","group":"External"},{"name":"License","url":"https://github.com/geist-org/geist-ui/blob/master/LICENSE","group":"External"},{"name":"Canary Documentation","url":"https://rc.geist-ui.dev/","group":"External"},{"name":"Canary Releases","url":"https://github.com/geist-org/geist-ui/releases?q=canary&expanded=true","group":"External"}]
diff --git a/lib/data/seeds-zh-cn.json b/lib/data/seeds-zh-cn.json
index 9d2a5fd43..99e87fe8f 100644
--- a/lib/data/seeds-zh-cn.json
+++ b/lib/data/seeds-zh-cn.json
@@ -1 +1 @@
-[{"name":"自动完成 Autocomplete","url":"/zh-cn/components/auto-complete","group":"数据录入"},{"name":"头像 Avatar","url":"/zh-cn/components/avatar","group":"数据展示"},{"name":"徽章 Badge","url":"/zh-cn/components/badge","group":"数据展示"},{"name":"面包屑 Breadcrumbs","url":"/zh-cn/components/breadcrumbs","group":"导航"},{"name":"下拉按钮 Btn Dropdown","url":"/zh-cn/components/button-dropdown","group":"导航"},{"name":"按钮组 Button Group","url":"/zh-cn/components/button-group","group":"数据录入"},{"name":"按钮 Button","url":"/zh-cn/components/button","group":"通用"},{"name":"容量 Capacity","url":"/zh-cn/components/capacity","group":"数据展示"},{"name":"卡片 Card","url":"/zh-cn/components/card","group":"表面"},{"name":"复选框 Checkbox","url":"/zh-cn/components/checkbox","group":"数据录入"},{"name":"代码 Code","url":"/zh-cn/components/code","group":"通用"},{"name":"折叠框 Collapse","url":"/zh-cn/components/collapse","group":"表面"},{"name":"描述 Description","url":"/zh-cn/components/description","group":"数据展示"},{"name":"陈列框 Display","url":"/zh-cn/components/display","group":"数据展示"},{"name":"分割线 Divider","url":"/zh-cn/components/divider","group":"其他"},{"name":"点 Dot","url":"/zh-cn/components/dot","group":"数据展示"},{"name":"抽屉 Drawer","url":"/zh-cn/components/drawer","group":"反馈"},{"name":"控件组 Fieldset","url":"/zh-cn/components/fieldset","group":"表面"},{"name":"文件树 File Tree","url":"/zh-cn/components/file-tree","group":"数据展示"},{"name":"栅格 Grid","url":"/zh-cn/components/grid","group":"布局"},{"name":"图标 Icons","url":"/zh-cn/components/icons","group":"通用"},{"name":"图片 Image","url":"/zh-cn/components/image","group":"数据展示"},{"name":"输入框 Input","url":"/zh-cn/components/input","group":"数据录入"},{"name":"键盘 keyboard","url":"/zh-cn/components/keyboard","group":"数据展示"},{"name":"链接 Link","url":"/zh-cn/components/link","group":"导航"},{"name":"加载中 Loading","url":"/zh-cn/components/loading","group":"反馈"},{"name":"对话框 Modal","url":"/zh-cn/components/modal","group":"反馈"},{"name":"提示 Note","url":"/zh-cn/components/note","group":"反馈"},{"name":"页面 Page","url":"/zh-cn/components/page","group":"布局"},{"name":"分页 Pagination","url":"/zh-cn/components/pagination","group":"导航"},{"name":"气泡卡片 Popover","url":"/zh-cn/components/popover","group":"数据展示"},{"name":"进度条 Progress","url":"/zh-cn/components/progress","group":"反馈"},{"name":"单选框 Radio","url":"/zh-cn/components/radio","group":"数据录入"},{"name":"评分 Rating","url":"/zh-cn/components/rating","group":"反馈"},{"name":"选择器 Select","url":"/zh-cn/components/select","group":"数据录入"},{"name":"滑动输入 Slider","url":"/zh-cn/components/slider","group":"数据录入"},{"name":"片段 Snippet","url":"/zh-cn/components/snippet","group":"其他"},{"name":"间距 Spacer","url":"/zh-cn/components/spacer","group":"布局"},{"name":"指示器 Spinner","url":"/zh-cn/components/spinner","group":"反馈"},{"name":"表格 Table","url":"/zh-cn/components/table","group":"数据展示"},{"name":"选项卡 Tabs","url":"/zh-cn/components/tabs","group":"导航"},{"name":"标签 Tag","url":"/zh-cn/components/tag","group":"数据展示"},{"name":"文本 Text","url":"/zh-cn/components/text","group":"通用"},{"name":"文本输入框 Textarea","url":"/zh-cn/components/textarea","group":"数据录入"},{"name":"通知 Toast","url":"/zh-cn/components/toast","group":"反馈"},{"name":"开关 Toggle","url":"/zh-cn/components/toggle","group":"数据录入"},{"name":"文字提示 Tooltip","url":"/zh-cn/components/tooltip","group":"数据展示"},{"name":"用户 User","url":"/zh-cn/components/user","group":"数据展示"},{"name":"色彩","url":"/zh-cn/guide/colors","group":"定制化"},{"name":"安装","url":"/zh-cn/guide/installation","group":"快速上手"},{"name":"什么是 Geist UI","url":"/zh-cn/guide/introduction","group":"快速上手"},{"name":"可伸缩性","url":"/zh-cn/guide/scale","group":"定制化"},{"name":"服务端渲染","url":"/zh-cn/guide/server-render","group":"快速上手"},{"name":"主题","url":"/zh-cn/guide/themes","group":"定制化"},{"name":"锁定滚动 useBodyScroll","url":"/zh-cn/hooks/use-body-scroll","group":"实用工具"},{"name":"类名合并 useClasses","url":"/zh-cn/hooks/use-classes","group":"开发者"},{"name":"点击他处 useClickAway","url":"/zh-cn/hooks/use-click-away","group":"实用工具"},{"name":"剪切板 useClipboard","url":"/zh-cn/hooks/use-clipboard","group":"实用工具"},{"name":"当前值 useCurrentState","url":"/zh-cn/hooks/use-current-state","group":"开发者"},{"name":"输入框绑定 useInput","url":"/zh-cn/hooks/use-input","group":"组件增强"},{"name":"键盘事件 useKeyboard","url":"/zh-cn/hooks/use-keyboard","group":"组件增强"},{"name":"媒体查询 useMediaQuery","url":"/zh-cn/hooks/use-media-query","group":"实用工具"},{"name":"对话框绑定 useModal","url":"/zh-cn/hooks/use-modal","group":"组件增强"},{"name":"自定义缩放 useScale","url":"/zh-cn/hooks/use-scale","group":"开发者"},{"name":"选项卡绑定 useTabs","url":"/zh-cn/hooks/use-tabs","group":"组件增强"},{"name":"主题的状态 useTheme","url":"/zh-cn/hooks/use-theme","group":"开发者"},{"name":"通知 useToast","url":"/zh-cn/hooks/use-toast","group":"组件增强"},{"name":"Getting Started","url":"https://codesandbox.io/s/geist-ui-n21e9","group":"Codesandbox"},{"name":"With TypeScript","url":"https://codesandbox.io/s/geist-ui-typescript-65td1","group":"Codesandbox"},{"name":"Discussions","url":"https://github.com/geist-org/geist-ui/discussions","group":"External"},{"name":"Example projects","url":"https://github.com/geist-org/geist-ui/tree/master/examples","group":"External"},{"name":"Create issue","url":"https://github.com/geist-org/geist-ui/issues/new/choose","group":"External"},{"name":"Release Note","url":"https://github.com/geist-org/geist-ui/releases","group":"External"},{"name":"Join Slack","url":"https://github.com/geist-org/geist-ui/discussions/572","group":"External"},{"name":"License","url":"https://github.com/geist-org/geist-ui/blob/master/LICENSE","group":"External"},{"name":"Canary Documentation","url":"https://rc.geist-ui.dev/","group":"External"},{"name":"Canary Releases","url":"https://github.com/geist-org/geist-ui/releases?q=canary&expanded=true","group":"External"}]
+[{"name":"自动完成 Autocomplete","url":"/zh-cn/components/auto-complete","group":"数据录入"},{"name":"头像 Avatar","url":"/zh-cn/components/avatar","group":"数据展示"},{"name":"徽章 Badge","url":"/zh-cn/components/badge","group":"数据展示"},{"name":"面包屑 Breadcrumbs","url":"/zh-cn/components/breadcrumbs","group":"导航"},{"name":"下拉按钮 Btn Dropdown","url":"/zh-cn/components/button-dropdown","group":"导航"},{"name":"按钮组 Button Group","url":"/zh-cn/components/button-group","group":"数据录入"},{"name":"按钮 Button","url":"/zh-cn/components/button","group":"通用"},{"name":"容量 Capacity","url":"/zh-cn/components/capacity","group":"数据展示"},{"name":"卡片 Card","url":"/zh-cn/components/card","group":"表面"},{"name":"复选框 Checkbox","url":"/zh-cn/components/checkbox","group":"数据录入"},{"name":"代码 Code","url":"/zh-cn/components/code","group":"通用"},{"name":"折叠框 Collapse","url":"/zh-cn/components/collapse","group":"表面"},{"name":"描述 Description","url":"/zh-cn/components/description","group":"数据展示"},{"name":"陈列框 Display","url":"/zh-cn/components/display","group":"数据展示"},{"name":"分割线 Divider","url":"/zh-cn/components/divider","group":"其他"},{"name":"点 Dot","url":"/zh-cn/components/dot","group":"数据展示"},{"name":"抽屉 Drawer","url":"/zh-cn/components/drawer","group":"反馈"},{"name":"控件组 Fieldset","url":"/zh-cn/components/fieldset","group":"表面"},{"name":"文件树 File Tree","url":"/zh-cn/components/file-tree","group":"数据展示"},{"name":"栅格 Grid","url":"/zh-cn/components/grid","group":"布局"},{"name":"图标 Icons","url":"/zh-cn/components/icons","group":"通用"},{"name":"图片 Image","url":"/zh-cn/components/image","group":"数据展示"},{"name":"输入框 Input","url":"/zh-cn/components/input","group":"数据录入"},{"name":"键盘 keyboard","url":"/zh-cn/components/keyboard","group":"数据展示"},{"name":"链接 Link","url":"/zh-cn/components/link","group":"导航"},{"name":"加载中 Loading","url":"/zh-cn/components/loading","group":"反馈"},{"name":"对话框 Modal","url":"/zh-cn/components/modal","group":"反馈"},{"name":"提示 Note","url":"/zh-cn/components/note","group":"反馈"},{"name":"页面 Page","url":"/zh-cn/components/page","group":"布局"},{"name":"分页 Pagination","url":"/zh-cn/components/pagination","group":"导航"},{"name":"气泡卡片 Popover","url":"/zh-cn/components/popover","group":"数据展示"},{"name":"进度条 Progress","url":"/zh-cn/components/progress","group":"反馈"},{"name":"单选框 Radio","url":"/zh-cn/components/radio","group":"数据录入"},{"name":"评分 Rating","url":"/zh-cn/components/rating","group":"反馈"},{"name":"选择器 Select","url":"/zh-cn/components/select","group":"数据录入"},{"name":"滑动输入 Slider","url":"/zh-cn/components/slider","group":"数据录入"},{"name":"片段 Snippet","url":"/zh-cn/components/snippet","group":"其他"},{"name":"间距 Spacer","url":"/zh-cn/components/spacer","group":"布局"},{"name":"指示器 Spinner","url":"/zh-cn/components/spinner","group":"反馈"},{"name":"表格 Table","url":"/zh-cn/components/table","group":"数据展示"},{"name":"选项卡 Tabs","url":"/zh-cn/components/tabs","group":"导航"},{"name":"标签 Tag","url":"/zh-cn/components/tag","group":"数据展示"},{"name":"文本 Text","url":"/zh-cn/components/text","group":"通用"},{"name":"文本输入框 Textarea","url":"/zh-cn/components/textarea","group":"数据录入"},{"name":"通知 Toast","url":"/zh-cn/components/toast","group":"反馈"},{"name":"开关 Toggle","url":"/zh-cn/components/toggle","group":"数据录入"},{"name":"文字提示 Tooltip","url":"/zh-cn/components/tooltip","group":"数据展示"},{"name":"用户 User","url":"/zh-cn/components/user","group":"数据展示"},{"name":"构建体积","url":"/zh-cn/guide/bundle-size","group":"快速上手"},{"name":"色彩","url":"/zh-cn/guide/colors","group":"定制化"},{"name":"安装","url":"/zh-cn/guide/installation","group":"快速上手"},{"name":"什么是 Geist UI","url":"/zh-cn/guide/introduction","group":"快速上手"},{"name":"可伸缩性","url":"/zh-cn/guide/scale","group":"定制化"},{"name":"服务端渲染","url":"/zh-cn/guide/server-render","group":"快速上手"},{"name":"主题","url":"/zh-cn/guide/themes","group":"定制化"},{"name":"锁定滚动 useBodyScroll","url":"/zh-cn/hooks/use-body-scroll","group":"实用工具"},{"name":"类名合并 useClasses","url":"/zh-cn/hooks/use-classes","group":"开发者"},{"name":"点击他处 useClickAway","url":"/zh-cn/hooks/use-click-away","group":"实用工具"},{"name":"剪切板 useClipboard","url":"/zh-cn/hooks/use-clipboard","group":"实用工具"},{"name":"当前值 useCurrentState","url":"/zh-cn/hooks/use-current-state","group":"开发者"},{"name":"输入框绑定 useInput","url":"/zh-cn/hooks/use-input","group":"组件增强"},{"name":"键盘事件 useKeyboard","url":"/zh-cn/hooks/use-keyboard","group":"组件增强"},{"name":"媒体查询 useMediaQuery","url":"/zh-cn/hooks/use-media-query","group":"实用工具"},{"name":"对话框绑定 useModal","url":"/zh-cn/hooks/use-modal","group":"组件增强"},{"name":"自定义缩放 useScale","url":"/zh-cn/hooks/use-scale","group":"开发者"},{"name":"选项卡绑定 useTabs","url":"/zh-cn/hooks/use-tabs","group":"组件增强"},{"name":"主题的状态 useTheme","url":"/zh-cn/hooks/use-theme","group":"开发者"},{"name":"通知 useToast","url":"/zh-cn/hooks/use-toast","group":"组件增强"},{"name":"Getting Started","url":"https://codesandbox.io/s/geist-ui-n21e9","group":"Codesandbox"},{"name":"With TypeScript","url":"https://codesandbox.io/s/geist-ui-typescript-65td1","group":"Codesandbox"},{"name":"Discussions","url":"https://github.com/geist-org/geist-ui/discussions","group":"External"},{"name":"Example projects","url":"https://github.com/geist-org/geist-ui/tree/master/examples","group":"External"},{"name":"Create issue","url":"https://github.com/geist-org/geist-ui/issues/new/choose","group":"External"},{"name":"Release Note","url":"https://github.com/geist-org/geist-ui/releases","group":"External"},{"name":"Join Slack","url":"https://github.com/geist-org/geist-ui/discussions/572","group":"External"},{"name":"License","url":"https://github.com/geist-org/geist-ui/blob/master/LICENSE","group":"External"},{"name":"Canary Documentation","url":"https://rc.geist-ui.dev/","group":"External"},{"name":"Canary Releases","url":"https://github.com/geist-org/geist-ui/releases?q=canary&expanded=true","group":"External"}]
diff --git a/pages/en-us/guide/bundle-size.mdx b/pages/en-us/guide/bundle-size.mdx
new file mode 100644
index 000000000..ab2c047fe
--- /dev/null
+++ b/pages/en-us/guide/bundle-size.mdx
@@ -0,0 +1,80 @@
+import Layout from 'lib/components/layout'
+
+export const meta = {
+ title: 'Bundle Size',
+ group: 'Getting Started',
+ index: 11,
+}
+
+## Bundle Size
+
+The size of Geist at the completion of full packing is about [111kb](https://bundle.js.org/?q=@geist-ui/react) (Gzipped),
+This is a good score when comparing the size of modern client applications and will not impact the performance of your application.
+As a matter of engineering practice, it is recommended that you always split Geist as a separate chunk within your application to get fixed caching.
+
+For higher first screen load speed, try using [Server Side Rendering](/en-us/guide/server-render) or perform volume optimization as described below.
+
+### Auto Tree-shaking
+
+For projects using `webpack 5.0` or higher, there is no need to add any configuration to get full tree-shaking.
+As long as you use the ES module to import Geist, you can automatically remove unnecessary components during bundle.
+
+Generally this means that the scaffolding you are using needs to be larger than the following versions
+
+- Webpack: `>= 5.0`
+- Next.js: `>= 11.0`
+- React scripts (CRA): `>= 5.0`
+
+#### Recommended Examples
+
+- [CRA with TreeShaking](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-create-react-app/README.md)
+- [Next.js with TreeShaking](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-nextjs/README.md)
+- [Webpack with TreeShaking](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-webpack/README.md)
+
+### Import single component manually
+
+For projects with package size requirements, you can choose to import single component manually.
+
+Manually import single components does not guarantee 100% that only a single component will be packaged,
+as some components will depend on each other, for example, if only a single `Snippet` component is used in a project, the bundle package
+will also contain the `Toast` component. However, this type of optimization can still reduce the size of your application significantly,
+provided you only use a small amount components.
+
+```jsx
+import Button from '@geist-ui/core/esm/button'
+
+const MyComponent = () =>
+```
+
+### With Babel
+
+If your project does not support ES Module at the moment, you can use the Babel plugin to reduce the build size.
+
+Geist follows the Tree Shaking naming scheme (from community convention), this will be helpful for some legacy projects.
+This allows you to import in the full amount of components, but automatically exclude the parts that are not really used when packaging.
+This feature is usually used in conjunction with the [babel-plugin-import](https://www.npmjs.com/package/babel-plugin-import) tool.
+
+A classic use case is to add the following config to the `.babelrc`:
+
+```json
+// NAME:.babelrc
+{
+ "plugins": [
+ [
+ "import",
+ {
+ "libraryName": "@geist-ui/core",
+ "libraryDirectory": "esm"
+ }
+ ]
+ ]
+}
+```
+
+#### Legacy Examples
+
+- [CRA with Babel](https://github.com/geist-org/geist-ui/blob/v2.3.3/examples/tree-shaking-create-react-app/README.md)
+- [Next.js with Babel](https://github.com/geist-org/geist-ui/blob/v2.3.3/examples/tree-shaking-nextjs/README.md)
+- [Webpack with Babel](https://github.com/geist-org/geist-ui/blob/v2.3.3/examples/tree-shaking-webpack/README.md)
+
+export default ({ children }) => {children}
diff --git a/pages/en-us/guide/installation.mdx b/pages/en-us/guide/installation.mdx
index db282bf80..11e800570 100644
--- a/pages/en-us/guide/installation.mdx
+++ b/pages/en-us/guide/installation.mdx
@@ -117,63 +117,4 @@ Some fonts in Web applications do not render best on the _Windows_ platform, or
inter-ui/inter.css
-### Bundle size
-
-The size of Geist UI at the completion of full packing is about [111kb](https://bundle.js.org/?q=@geist-ui/react) (gzipped),
-This is a good score when comparing the size of modern client applications and will not impact the performance of your application.
-As a matter of engineering practice, it is recommended that you always split Geist as a separate chunk within your application to get fixed caching.
-
-For higher first screen load speed, try using [Server Side Rendering](/zh-cn/guide/server-render) or perform volume optimization as described below.
-
-#### Import single component manually
-
-For projects with package size requirements, you can choose to import single component manually.
-
-Manually import single components does not guarantee 100% that only a single component will be packaged,
-as some components will depend on each other, for example, if only a single `Snippet` component is used in a project, the bundle package
-will also contain the `Toast` component. However, this type of optimization can still reduce the size of your application significantly,
-provided you only use a small amount components.
-
-```jsx
-import Button from '@geist-ui/core/esm/button'
-
-const MyComponent = () =>
-```
-
-#### Auto Tree Shaking
-
-Geist follows the Auto Tree Shaking naming scheme (from community convention),
-This allows you to import in the full amount of components, but automatically exclude the parts that are not really used when packaging.
-This feature is usually used in conjunction with the [babel-plugin-import](https://www.npmjs.com/package/babel-plugin-import) tool.
-This means that even if we use:
-
-```jsx
-import { Text } from '@geist-ui/core'
-```
-
-You can also get the same effect as described above for 'import single component'.
-
-A classic use case is to add the following config to the `.babelrc`:
-
-```json
-// NAME:.babelrc
-{
- "plugins": [
- [
- "import",
- {
- "libraryName": "@geist-ui/core",
- "libraryDirectory": "esm"
- }
- ]
- ]
-}
-```
-
-There are some differences in the way Tree Shaking is added to different scaffolds, you can refer to the following examples.
-
-- [CRA with TreeShaking](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-create-react-app/README.md)
-- [Next.js with TreeShaking](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-nextjs/README.md)
-- [Webpack with TreeShaking](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-webpack/README.md)
-
export default ({ children }) => {children}
diff --git a/pages/zh-cn/guide/bundle-size.mdx b/pages/zh-cn/guide/bundle-size.mdx
new file mode 100644
index 000000000..15ab9e372
--- /dev/null
+++ b/pages/zh-cn/guide/bundle-size.mdx
@@ -0,0 +1,76 @@
+import Layout from 'lib/components/layout'
+
+export const meta = {
+ title: '构建体积',
+ group: '快速上手',
+ index: 11,
+}
+
+## 构建体积
+
+一个包含 Geist 所有组件的包大约为 [111kb](https://bundle.js.org/?q=@geist-ui/react) (Gzipped),对于现代化客户端应用来说这仍旧是不错的大小,
+并不会影响您的应用性能。在工程的实践中,推荐你在应用内将 Geist 切割为独立的 chunk 以获得固定的缓存。
+
+对于更好的首屏加载速度,推荐尝试 [服务端渲染](/zh-cn/guide/server-render),或是按下所述对构建体积进行优化。
+
+### 自动地 Tree-shaking
+
+对于所有使用 `webpack 5.0` 或更高版本的项目,不需要添加任何额外配置即可获得完整的 tree-shaking。使用 ES 模块引入 Geist,
+在构建时会自动从最终的包中移除未使用的组件。
+
+通常这意味着你的脚手架需要高于以下版本:
+
+- Webpack: `>= 5.0`
+- Next.js: `>= 11.0`
+- React scripts (CRA): `>= 5.0`
+
+#### 推荐的示例
+
+- [CRA with TreeShaking](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-create-react-app/README.md)
+- [Next.js with TreeShaking](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-nextjs/README.md)
+- [Webpack with TreeShaking](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-webpack/README.md)
+
+### 手动引入单个组件
+
+对于非标准的构建工具 (或小型项目),你可以通过手动引入单个组件来获得更好的构建体积。
+
+手动引入单个组件并不意味着 100% 只构建使用过的组件,一些组件存在内部依赖,如当你进使用 `Snippet` 组件时,最终的包也会包含 `Toast` 组件。
+尽管如此,这类优化方式还是能够显著降低应用的构建体积。
+
+```jsx
+import Button from '@geist-ui/core/esm/button'
+
+const MyComponent = () =>
+```
+
+### 使用 Babel
+
+如果您的项目暂不支持 ES Module,可以使用 Babel 插件降低构建体积。
+
+Geist 遵循自动 Tree Shaking 的命名方案 (社区约定),这允许你全量引入组件库,但在打包时自动剔除没有真正使用的部分。
+此功能通常需要与 [babel-plugin-import](https://www.npmjs.com/package/babel-plugin-import) 工具搭配使用。
+
+一个典型的使用案例需要在 `.babelrc` 文件中添加如下配置:
+
+```json
+// NAME:.babelrc
+{
+ "plugins": [
+ [
+ "import",
+ {
+ "libraryName": "@geist-ui/core",
+ "libraryDirectory": "esm"
+ }
+ ]
+ ]
+}
+```
+
+#### 旧版本可用参考
+
+- [CRA with Babel](https://github.com/geist-org/geist-ui/blob/v2.3.3/examples/tree-shaking-create-react-app/README.md)
+- [Next.js with Babel](https://github.com/geist-org/geist-ui/blob/v2.3.3/examples/tree-shaking-nextjs/README.md)
+- [Webpack with Babel](https://github.com/geist-org/geist-ui/blob/v2.3.3/examples/tree-shaking-webpack/README.md)
+
+export default ({ children }) => {children}
diff --git a/pages/zh-cn/guide/installation.mdx b/pages/zh-cn/guide/installation.mdx
index cd4b05a70..73696dcd4 100644
--- a/pages/zh-cn/guide/installation.mdx
+++ b/pages/zh-cn/guide/installation.mdx
@@ -117,60 +117,4 @@ Web 应用中的一些字体在 _Windows_ 平台上无法得到最好的渲染
inter-ui/inter.css
-### 打包体积
-
-Geist UI 在全量打包后体积约为 [111kb](https://bundle.js.org/?q=@geist-ui/react) (gzipped),
-在现代化客户端应用体积上比较这是一个不错的成绩,不会对您的应用构成性能影响。在实践上,
-建议您始终在应用内将 Geist 作为单独的 chunk 进行分割,以便享受固定缓存。
-
-对于更高地首屏加载速度需求,可以尝试使用 [服务端渲染](/zh-cn/guide/server-render),或是按下文进行体积优化。
-
-#### 手动引入单个组件
-
-在对于包体积有要求的项目上,你可以选择手动地引入单个组件。
-
-手动的引入单个组件并不能 100% 保证只打包单个组件,因为部分组件会互相依赖。如在项目仅使用单个 `Snippet` 组件,
-也会包含 `Toast` 组件。但在你仅使用少量组件的前提下,这类优化方案还是可以大幅度缩减应用的体积。
-
-```jsx
-import Button from '@geist-ui/core/esm/button'
-
-const MyComponent = () =>
-```
-
-#### 自动 Tree Shaking
-
-Geist 遵循自动 Tree Shaking 的命名方案 (社区约定),这允许你全量引入组件库,但在打包时自动剔除没有真正使用的部分。
-此功能通常需要与 [babel-plugin-import](https://www.npmjs.com/package/babel-plugin-import) 工具搭配使用。
-这意味着即便我们在项目中直接使用:
-
-```jsx
-import { Text } from '@geist-ui/core'
-```
-
-也可以得到与上文引入单个组件所述一样的效果。
-
-一个经典的使用案例是在 `.babelrc` 文件中加入以下配置:
-
-```json
-// NAME:.babelrc
-{
- "plugins": [
- [
- "import",
- {
- "libraryName": "@geist-ui/core",
- "libraryDirectory": "esm"
- }
- ]
- ]
-}
-```
-
-在不同脚手架上添加 Tree Shaking 的方式有一些不同,你可以参考以下示例:
-
-- [CRA 项目示例](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-create-react-app/README.md) (create-react-app)
-- [Next.js 项目示例](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-nextjs/README.md)
-- [Webpack 项目示例](https://github.com/geist-org/geist-ui/blob/master/examples/tree-shaking-webpack/README.md)
-
export default ({ children }) => {children}