@todovue/tv-demo 1.1.0 → 1.2.0

package/README.md

@@ -1,4 +1,4 @@
-<p align="center"><img width="150" src="https://firebasestorage.googleapis.com/v0/b/todovue-blog.appspot.com/o/logo.png?alt=media&token=d8eb592f-e4a9-4b02-8aff-62d337745f41" alt="TODOvue logo">
+<p align="center"><img width="150" src="https://res.cloudinary.com/dcdfhi8qz/image/upload/v1763663056/uqqtkgp1lg3xdplutpga.png" alt="TODOvue logo">
 </p>
 
 # TODOvue Demo Catalog (TvDemo)
@@ -139,19 +139,21 @@ import { TvDemo } from '@todovue/tv-demo'
 
 ---
 ## Props
-| Name           | Type    | Default       | Description                                                         | Required |
-|----------------|---------|---------------|---------------------------------------------------------------------|----------|
-| component      | Object  |               | Component to display                                                | `true`   |
-| variants       | Array   |               | Variations of the component                                         | `true`   |
-| hideBackground | Boolean | `false`       | Hide the background of the component demo                           | `false`  |
-| demoStyle      | Object  |               | Style of the component                                              | `false`  |
-| componentName  | String  | `null`        | Name of the component to display in the demo                        | `false`  |
-| npmInstall     | String  | `null`        | Command to install the component (without `npm install`)            | `false`  |
-| sourceLink     | String  | `null`        | Link to the source code of the component                            | `false`  |
-| urlClone       | String  | `null`        | Link to clone the repository of the component (without `git clone`) | `false`  |
-| isDevComponent | Boolean | `false`       | Indicates that the component is in development (to include `-D`)    | `false`  |
-| version        | String  | `1.0.0`       | Version of the component                                            | `false`  |
-| readmePath     | String  | `./README.md` | Path to the README file of the component                            | `false`  |
+| Name              | Type    | Default       | Description                                                         | Required |
+|-------------------|---------|---------------|---------------------------------------------------------------------|----------|
+| component         | Object  |               | Component to display                                                | `true`   |
+| variants          | Array   |               | Variations of the component                                         | `true`   |
+| hideBackground    | Boolean | `false`       | Hide the background of the component demo                           | `false`  |
+| demoStyle         | Object  |               | Style of the component                                              | `false`  |
+| componentName     | String  | `null`        | Name of the component to display in the demo                        | `false`  |
+| npmInstall        | String  | `null`        | Command to install the component (without `npm install`)            | `false`  |
+| sourceLink        | String  | `null`        | Link to the source code of the component                            | `false`  |
+| urlClone          | String  | `null`        | Link to clone the repository of the component (without `git clone`) | `false`  |
+| isDevComponent    | Boolean | `false`       | Indicates that the component is in development (to include `-D`)    | `false`  |
+| version           | String  | `1.0.0`       | Version of the component                                            | `false`  |
+| readmePath        | String  | `./README.md` | Path to the README file of the component                            | `false`  |
+| showDocumentation | Boolean | `true`        | Show or hide the documentation tab                                  | `false`  |
+| showChangelog     | Boolean | `true`        | Show or hide the changelog tab                                      | `false`  |
 
 ---
 ## Events

package/dist/ToUp-BAcInP4Z.js

@@ -0,0 +1,53 @@
+import { ref as T, watch as b, onMounted as g, onBeforeUnmount as h, createBlock as v, openBlock as i, Transition as k, withCtx as y, createElementBlock as E, createCommentVNode as L, normalizeClass as S, createElementVNode as B } from "vue";
+const C = ["aria-label"], x = {
+  __name: "ToUp",
+  props: {
+    showOffset: { type: Number, default: 280 },
+    scrollTarget: { type: [String, Object], default: null },
+    theme: { type: String, default: "dark" },
+    ariaLabel: { type: String, default: "Scroll back to top" }
+  },
+  emits: ["click"],
+  setup(r, { emit: u }) {
+    const o = r, d = u, l = T(!1);
+    let t = null;
+    const m = () => typeof o.scrollTarget == "string" ? document.querySelector(o.scrollTarget) || window : o.scrollTarget instanceof HTMLElement ? o.scrollTarget : window, f = (e) => !e || e === window ? !0 : e.scrollHeight > e.clientHeight, p = () => {
+      const e = m();
+      return f(e) ? e : window;
+    }, n = () => {
+      if (!t) {
+        l.value = !1;
+        return;
+      }
+      const e = t === window ? window.scrollY || document.documentElement.scrollTop : t.scrollTop;
+      l.value = e >= o.showOffset;
+    }, s = () => {
+      t && t.removeEventListener("scroll", n);
+    }, c = () => {
+      s(), t = p(), t.addEventListener("scroll", n, { passive: !0 }), n();
+    }, w = () => {
+      const e = { top: 0, behavior: "smooth" };
+      t && t !== window ? t.scrollTo(e) : window.scrollTo(e), d("click");
+    };
+    return b(() => o.scrollTarget, c), g(c), h(s), (e, a) => (i(), v(k, { name: "tv-to-up" }, {
+      default: y(() => [
+        l.value ? (i(), E("button", {
+          key: 0,
+          type: "button",
+          class: S(["tv-to-up", `${r.theme}-mode`]),
+          "aria-label": r.ariaLabel,
+          onClick: w
+        }, [...a[0] || (a[0] = [
+          B("span", {
+            class: "tv-to-up-icon",
+            "aria-hidden": "true"
+          }, "↑", -1)
+        ])], 10, C)) : L("", !0)
+      ]),
+      _: 1
+    }));
+  }
+};
+export {
+  x as default
+};

package/dist/ToUp-CJUZN3du.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("vue"),T=["aria-label"],b={__name:"ToUp",props:{showOffset:{type:Number,default:280},scrollTarget:{type:[String,Object],default:null},theme:{type:String,default:"dark"},ariaLabel:{type:String,default:"Scroll back to top"}},emits:["click"],setup(l,{emit:u}){const r=l,d=u,n=t.ref(!1);let o=null;const m=()=>typeof r.scrollTarget=="string"?document.querySelector(r.scrollTarget)||window:r.scrollTarget instanceof HTMLElement?r.scrollTarget:window,f=e=>!e||e===window?!0:e.scrollHeight>e.clientHeight,p=()=>{const e=m();return f(e)?e:window},s=()=>{if(!o){n.value=!1;return}const e=o===window?window.scrollY||document.documentElement.scrollTop:o.scrollTop;n.value=e>=r.showOffset},c=()=>{o&&o.removeEventListener("scroll",s)},a=()=>{c(),o=p(),o.addEventListener("scroll",s,{passive:!0}),s()},w=()=>{const e={top:0,behavior:"smooth"};o&&o!==window?o.scrollTo(e):window.scrollTo(e),d("click")};return t.watch(()=>r.scrollTarget,a),t.onMounted(a),t.onBeforeUnmount(c),(e,i)=>(t.openBlock(),t.createBlock(t.Transition,{name:"tv-to-up"},{default:t.withCtx(()=>[n.value?(t.openBlock(),t.createElementBlock("button",{key:0,type:"button",class:t.normalizeClass(["tv-to-up",`${l.theme}-mode`]),"aria-label":l.ariaLabel,onClick:w},[...i[0]||(i[0]=[t.createElementVNode("span",{class:"tv-to-up-icon","aria-hidden":"true"},"↑",-1)])],10,T)):t.createCommentVNode("",!0)]),_:1}))}};exports.default=b;

package/dist/tv-demo.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),Q=require("vue-highlight-code"),G=require("vue3-markdown-it"),b=72,R=6,Y=(n,u)=>n?.id??n?.title??`variant-${u}`,J=(n={})=>`${n.title??""} ${n.description??""}`.toLowerCase(),W=n=>{const u=e.ref("dark"),y=e.ref([]),g=e.ref(""),$=e.ref("demo"),k=e.ref(""),r=e.ref(null),c=e.ref(null),f=e.ref(360),N=e.ref(0);let v=null,h=!1;const p=e.computed(()=>(n.variants||[]).map((t,a)=>({variant:t,index:a,key:Y(t,a),searchableText:J(t)}))),z=e.computed(()=>p.value.length),s=e.computed(()=>{const t=k.value.trim().toLowerCase();return t?p.value.filter(a=>a.searchableText.includes(t)):p.value}),M=e.computed(()=>s.value.length),m=e.computed(()=>!!k.value.trim()&&s.value.length===0),i=()=>{f.value=c.value?.clientHeight||f.value},D=()=>{h&&(window.removeEventListener("resize",i),h=!1)};e.watch(()=>c.value,t=>{if(v&&(v.disconnect(),v=null),!t){D();return}e.nextTick(()=>{i(),typeof ResizeObserver<"u"?(v=new ResizeObserver(a=>{const d=a?.[0];d&&(f.value=d.contentRect.height)}),v.observe(t)):h||(window.addEventListener("resize",i),h=!0)})}),e.onMounted(()=>{const t=localStorage.getItem("theme");t&&(u.value=t),e.nextTick(i)}),e.onBeforeUnmount(()=>{v&&(v.disconnect(),v=null),D()});const T=async()=>{try{const t=await fetch(n.readmePath);if(!t.ok)throw new Error("README.md not found");g.value=await t.text()}catch{g.value="⚠️ Documentation not found."}},x=()=>{u.value=u.value==="dark"?"light":"dark",localStorage.setItem("theme",u.value)};e.watch(()=>p.value,t=>{if(!t.length){r.value=null;return}t.some(a=>a.key===r.value)||(r.value=t[0].key)},{immediate:!0}),e.watch(()=>s.value,t=>{if(!t.length){r.value=null;return}t.some(a=>a.key===r.value)||(r.value=t[0].key)});const C=t=>{c.value&&(c.value.scrollTop=t,N.value=t)};e.watch(k,()=>{C(0)});const V=e.computed(()=>s.value.findIndex(t=>t.key===r.value)),E=e.computed(()=>Math.max(1,Math.ceil(f.value/b))),B=e.computed(()=>Math.max(0,Math.floor(N.value/b)-R)),o=e.computed(()=>Math.min(s.value.length,B.value+E.value+R*2)),l=e.computed(()=>s.value.slice(B.value,o.value)),L=e.computed(()=>B.value*b),A=e.computed(()=>Math.max(0,(s.value.length-o.value)*b)),O=()=>{if(!c.value)return;const t=V.value;if(t<0)return;const a=B.value+2,d=o.value-3;if(t<a)C(Math.max(0,t*b));else if(t>d){const S=Math.max(0,t-E.value+1);C(S*b)}};e.watch(r,O);const H=e.computed(()=>m.value?{}:(s.value.find(a=>a.key===r.value)||p.value.find(a=>a.key===r.value)||s.value[0]||p.value[0])?.variant||{}),K=t=>{N.value=t.target.scrollTop},P=t=>{const a=s.value;if(!a.length)return;const d=V.value<0?0:V.value,S=Math.min(a.length-1,Math.max(0,d+t));r.value=a[S].key},_=t=>{switch(t.key){case"ArrowDown":t.preventDefault(),P(1);break;case"ArrowUp":t.preventDefault(),P(-1);break;case"Home":t.preventDefault(),s.value.length&&(r.value=s.value[0].key);break;case"End":t.preventDefault(),s.value.length&&(r.value=s.value[s.value.length-1].key);break}},F=t=>{r.value=t},j=e.computed(()=>{const t=u.value==="dark"?n.demoStyle?.dark:n.demoStyle?.light;return{body:{backgroundColor:t?.backgroundBody||"",color:t?.color||""},content:{backgroundColor:t?.backgroundContent||"",color:t?.color||""}}}),q=t=>{let a="";t==="npm"?a=`npm install ${n.isDevComponent?"-D ":""}${n.npmInstall}`:a=`git clone ${n.urlClone}`,navigator.clipboard.writeText(a).then(()=>{I(`Copied to clipboard: ${a}`,"success",3e3)}).catch(d=>{I(`Failed to copy: ${d}`,"error",3e3)})},I=(t,a="success",d=3e3)=>{const S=`toast-${Date.now()}-${Math.random().toString(36).substr(2,9)}`;y.value.push({id:S,message:t,type:a,duration:d})},U=t=>{const a=y.value.findIndex(d=>d.id===t);a>-1&&y.value.splice(a,1)};return e.watchEffect(T),{customStyle:j,toasts:y,readmeContent:g,selectedTab:$,searchQuery:k,selectedVariantKey:r,totalVariantsCount:z,filteredVariantsCount:M,variantsListRef:c,virtualizedVariants:l,virtualPaddingTop:L,virtualPaddingBottom:A,emptySearchState:m,theme:u,variant:H,addToast:I,removeToast:U,selectVariant:F,setClickItem:q,toggleTheme:x,handleVariantsScroll:K,handleVariantsKeydown:_}},X={class:"tv-demo-case"},Z={class:"tv-demo-header"},ee={class:"tv-demo-links"},te=["href"],oe={key:1},ne={key:3},ae={class:"tv-demo-theme"},le={class:"switch"},re=["checked"],se={class:"tv-demo-tabs"},ce={key:0,class:"tv-demo-layout"},ie={class:"tv-demo-sidebar-header"},de={class:"tv-demo-sidebar-meta"},me=["aria-activedescendant"],ue=["id","aria-selected","onClick"],ve={class:"tv-demo-variant-card-content"},fe={class:"tv-demo-variant-card-title"},pe={class:"tv-demo-variant-card-description"},ke={key:1,class:"tv-demo-empty-state"},he={class:"tv-demo-content","aria-live":"polite"},ye={class:"tv-demo-content-header"},ge={class:"tv-demo-description"},Ve={class:"tv-demo-component-content"},Ee={key:1,class:"tv-demo-empty-component"},be={key:1,class:"tv-demo-empty-code"},Ne={key:1,class:"tv-demo-content"},Ce={key:0,class:"markdown-body"},Be={key:1},Se={class:"tv-demo-footer-content"},we={class:"tv-demo-footer-main"},De={class:"tv-demo-footer-brand"},Te={class:"tv-demo-footer-brand-text"},xe={class:"tv-demo-footer-brand-version"},$e={class:"tv-demo-footer-bottom"},ze={class:"tv-demo-footer-copyright"},w={__name:"TvDemo",props:{demoStyle:{type:Object,default:()=>({body:{},content:{}})},hideBackground:Boolean,component:Object,variants:Array,componentName:{type:String,default:"Component Demo"},sourceLink:{type:String,default:null},urlClone:{type:String,default:null},npmInstall:{type:String,default:null},isDevComponent:{type:Boolean,default:!1},version:{type:String,default:"0.0.0"},readmePath:{type:String,default:"/README.md"}},setup(n){const u=e.defineAsyncComponent(()=>Promise.resolve().then(()=>require("./ToastContainer-Cx0oFM8l.cjs"))),y=n,{customStyle:g,toasts:$,readmeContent:k,selectedTab:r,searchQuery:c,selectedVariantKey:f,totalVariantsCount:N,filteredVariantsCount:v,variantsListRef:h,virtualizedVariants:p,virtualPaddingTop:z,virtualPaddingBottom:s,emptySearchState:M,theme:m,variant:i,removeToast:D,setClickItem:T,toggleTheme:x,selectVariant:C,handleVariantsScroll:V,handleVariantsKeydown:E}=W(y);return(B,o)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(m)}-mode tv-demo`),style:e.normalizeStyle(e.unref(g).body)},[e.createElementVNode("div",{class:e.normalizeClass(["tv-demo-body",{[`${e.unref(m)}-mode`]:!n.hideBackground}]),style:e.normalizeStyle(e.unref(g).content)},[e.createElementVNode("div",X,[e.createElementVNode("div",Z,[e.createElementVNode("div",null,[e.createElementVNode("div",ee,[n.sourceLink||n.npmInstall||n.urlClone?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[n.sourceLink?(e.openBlock(),e.createElementBlock("a",{key:0,href:n.sourceLink,target:"_blank",class:"tv-demo-links-item"}," 📂 Source ",8,te)):e.createCommentVNode("",!0),n.sourceLink&&(n.npmInstall||n.urlClone)?(e.openBlock(),e.createElementBlock("span",oe," | ")):e.createCommentVNode("",!0),n.npmInstall?(e.openBlock(),e.createElementBlock("div",{key:2,class:"tv-demo-links-item",onClick:o[0]||(o[0]=l=>e.unref(T)("npm"))}," 📦 NPM Command ")):e.createCommentVNode("",!0),n.npmInstall&&n.urlClone?(e.openBlock(),e.createElementBlock("span",ne," | ")):e.createCommentVNode("",!0),n.urlClone?(e.openBlock(),e.createElementBlock("div",{key:4,class:"tv-demo-links-item",onClick:o[1]||(o[1]=l=>e.unref(T)("clone"))}," 📝 Clone Component ")):e.createCommentVNode("",!0)],64)):e.createCommentVNode("",!0)])]),e.createElementVNode("div",null,[e.createElementVNode("div",ae,[o[13]||(o[13]=e.createElementVNode("span",{style:{"font-size":"0.9rem",opacity:"0.8"}},"Theme",-1)),e.createElementVNode("label",le,[e.createElementVNode("input",{type:"checkbox",checked:e.unref(m)==="dark",onChange:o[2]||(o[2]=(...l)=>e.unref(x)&&e.unref(x)(...l))},null,40,re),o[12]||(o[12]=e.createElementVNode("span",{class:"slider round"},null,-1))])])])]),e.createElementVNode("div",se,[e.createElementVNode("button",{class:e.normalizeClass({active:e.unref(r)==="demo"}),onClick:o[3]||(o[3]=l=>r.value="demo")},"📌 Demo",2),e.createElementVNode("button",{class:e.normalizeClass({active:e.unref(r)==="docs"}),onClick:o[4]||(o[4]=l=>r.value="docs")},"📖 Documentation",2)]),e.unref(r)==="demo"?(e.openBlock(),e.createElementBlock("div",ce,[e.createElementVNode("aside",{class:e.normalizeClass(["tv-demo-sidebar",`${e.unref(m)}-mode`])},[e.createElementVNode("div",ie,[e.createElementVNode("div",null,[e.createElementVNode("p",de,e.toDisplayString(e.unref(v))+" / "+e.toDisplayString(e.unref(N))+" variants",1),o[14]||(o[14]=e.createElementVNode("h3",null,"Variants",-1))]),e.createElementVNode("button",{class:"tv-demo-sidebar-collapse","aria-label":"Scroll to top",onClick:o[5]||(o[5]=l=>e.unref(h)?.scrollTo({top:0,behavior:"smooth"}))}," ⬆️ ")]),e.createElementVNode("label",{class:e.normalizeClass(["tv-demo-search",`${e.unref(m)}-mode`])},[o[15]||(o[15]=e.createElementVNode("span",{class:"tv-demo-search-icon"},"🔍",-1)),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":o[6]||(o[6]=l=>e.isRef(c)?c.value=l:null),type:"search",placeholder:"Search variants...",class:"tv-demo-search-input","aria-label":"Search variants",onKeydown:o[7]||(o[7]=e.withKeys(e.withModifiers(l=>e.unref(E)(l),["prevent"]),["down"]))},null,544),[[e.vModelText,e.unref(c)]]),e.unref(c)?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"tv-demo-search-clear","aria-label":"Clear search",onClick:o[8]||(o[8]=l=>c.value="")},"✕")):e.createCommentVNode("",!0)],2),e.createElementVNode("div",{class:e.normalizeClass(["tv-demo-variants",`${e.unref(m)}-mode`]),role:"listbox",tabindex:"0","aria-label":"Available variants","aria-activedescendant":e.unref(f)?`variant-${e.unref(f)}`:null,onKeydown:o[10]||(o[10]=(...l)=>e.unref(E)&&e.unref(E)(...l)),ref_key:"variantsListRef",ref:h,onScroll:o[11]||(o[11]=(...l)=>e.unref(V)&&e.unref(V)(...l))},[e.createElementVNode("div",{style:e.normalizeStyle({paddingTop:`${e.unref(z)}px`,paddingBottom:`${e.unref(s)}px`})},[e.unref(M)?(e.openBlock(),e.createElementBlock("div",ke,[e.createElementVNode("p",null,'No matches for "'+e.toDisplayString(e.unref(c))+'".',1),e.createElementVNode("button",{class:"tv-demo-reset",type:"button",onClick:o[9]||(o[9]=l=>c.value="")},"Clear filter")])):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(e.unref(p),l=>(e.openBlock(),e.createElementBlock("button",{key:l.key,id:`variant-${l.key}`,type:"button",class:e.normalizeClass(["tv-demo-variant-card",{active:l.key===e.unref(f)}]),role:"option","aria-selected":l.key===e.unref(f),onClick:L=>e.unref(C)(l.key)},[e.createElementVNode("span",ve,[e.createElementVNode("span",fe,e.toDisplayString(l.variant.title),1),e.createElementVNode("span",pe,e.toDisplayString(l.variant.description),1)]),o[16]||(o[16]=e.createElementVNode("span",{class:"tv-demo-variant-card-icon"},"→",-1))],10,ue))),128))],4)],42,me)],2),e.createElementVNode("section",he,[e.createElementVNode("div",ye,[e.createElementVNode("div",null,[o[17]||(o[17]=e.createElementVNode("p",{class:"tv-demo-content-label"},"Preview",-1)),e.createElementVNode("h3",null,e.toDisplayString(e.unref(i).title||"Select a variant"),1)])]),e.createElementVNode("p",ge,e.toDisplayString(e.unref(i).description||"Select a variant from the list to view its details."),1),e.createElementVNode("div",Ve,[e.unref(i)&&n.component?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.component),e.normalizeProps(e.mergeProps({key:0},e.unref(i).propsData)),null,16)):(e.openBlock(),e.createElementBlock("p",Ee,"No component to render."))]),o[18]||(o[18]=e.createElementVNode("h3",null,"Code:",-1)),e.unref(i)?.html?(e.openBlock(),e.createBlock(e.unref(Q.HighCode),{class:"tv-demo-code",codeValue:e.unref(i).html,theme:e.unref(m),lang:"html",codeLines:"",key:e.unref(i).title,height:"auto"},null,8,["codeValue","theme"])):(e.openBlock(),e.createElementBlock("p",be,"No snippet available."))])])):e.createCommentVNode("",!0),e.unref(r)==="docs"?(e.openBlock(),e.createElementBlock("div",Ne,[e.unref(k)?(e.openBlock(),e.createElementBlock("div",Ce,[e.createVNode(e.unref(G),{source:e.unref(k),html:""},null,8,["source"])])):(e.openBlock(),e.createElementBlock("div",Be,"No documentation available."))])):e.createCommentVNode("",!0)])],6)],6),e.createElementVNode("footer",{class:e.normalizeClass(["tv-demo-footer",`${e.unref(m)}-mode`])},[e.createElementVNode("div",Se,[e.createElementVNode("div",we,[e.createElementVNode("div",De,[o[19]||(o[19]=e.createElementVNode("span",{class:"tv-demo-footer-logo"},[e.createElementVNode("img",{src:"https://firebasestorage.googleapis.com/v0/b/todovue-blog.appspot.com/o/icono_git.png?alt=media&token=86270c30-8235-4424-b72b-7a585f228685",alt:""})],-1)),e.createElementVNode("span",Te,e.toDisplayString(n.componentName),1),e.createElementVNode("span",xe,"v"+e.toDisplayString(n.version),1)]),o[20]||(o[20]=e.createStaticVNode('<div class="tv-demo-footer-info"><p class="tv-demo-footer-text"> Designed &amp; Developed by <a href="https://cris-dev.com/" target="_blank" rel="noopener noreferrer" class="tv-demo-footer-link"> cris-dev.com </a></p><div class="tv-demo-footer-divider"></div><p class="tv-demo-footer-text"> Made with <span class="tv-demo-footer-heart">💙</span> using Vue.js </p></div>',1))]),e.createElementVNode("div",$e,[e.createElementVNode("p",ze," © "+e.toDisplayString(new Date().getFullYear())+" TODOvue. All rights reserved. ",1)])])],2),e.createVNode(e.unref(u),{toasts:e.unref($),onRemoveToast:e.unref(D)},null,8,["toasts","onRemoveToast"])],64))}};w.install=n=>{n.component("TvDemo",w)};const Me={install(n){n.component("TvDemo",w)}};exports.TvDemo=w;exports.TvDemoPlugin=Me;exports.default=w;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),J=require("vue-highlight-code"),O=require("vue3-markdown-it"),b=72,H=6,W=(n,u)=>n?.id??n?.title??`variant-${u}`,X=(n={})=>`${n.title??""} ${n.description??""}`.toLowerCase(),Z=n=>{const u=e.ref("dark"),y=e.ref([]),N=e.ref(""),g=e.ref(""),z=e.ref("demo"),p=e.ref(""),r=e.ref(null),c=e.ref(null),d=e.ref(360),k=e.ref(0);let v=null,V=!1;const h=e.computed(()=>(n.variants||[]).map((t,a)=>({variant:t,index:a,key:W(t,a),searchableText:X(t)}))),M=e.computed(()=>h.value.length),s=e.computed(()=>{const t=p.value.trim().toLowerCase();return t?h.value.filter(a=>a.searchableText.includes(t)):h.value}),I=e.computed(()=>s.value.length),T=e.computed(()=>!!p.value.trim()&&s.value.length===0),i=()=>{d.value=c.value?.clientHeight||d.value},f=()=>{V&&(window.removeEventListener("resize",i),V=!1)};e.watch(()=>c.value,t=>{if(v&&(v.disconnect(),v=null),!t){f();return}e.nextTick(()=>{i(),typeof ResizeObserver<"u"?(v=new ResizeObserver(a=>{const m=a?.[0];m&&(d.value=m.contentRect.height)}),v.observe(t)):V||(window.addEventListener("resize",i),V=!0)})}),e.onMounted(()=>{const t=localStorage.getItem("theme");t&&(u.value=t),e.nextTick(i)}),e.onBeforeUnmount(()=>{v&&(v.disconnect(),v=null),f()});const L=async()=>{try{const t=await fetch(n.readmePath);if(!t.ok)throw new Error("README.md not found");N.value=await t.text()}catch{N.value="Documentation not found."}},x=async()=>{try{const t=await fetch(n.changelogPath);if(!t.ok)throw new Error("CHANGELOG.md not found");g.value=await t.text()}catch{g.value="Changelog not found."}},$=()=>{u.value=u.value==="dark"?"light":"dark",localStorage.setItem("theme",u.value)};e.watch(()=>h.value,t=>{if(!t.length){r.value=null;return}t.some(a=>a.key===r.value)||(r.value=t[0].key)},{immediate:!0}),e.watch(()=>s.value,t=>{if(!t.length){r.value=null;return}t.some(a=>a.key===r.value)||(r.value=t[0].key)});const B=t=>{c.value&&(c.value.scrollTop=t,k.value=t)};e.watch(p,()=>{B(0)});const E=e.computed(()=>s.value.findIndex(t=>t.key===r.value)),C=e.computed(()=>Math.max(1,Math.ceil(d.value/b))),w=e.computed(()=>Math.max(0,Math.floor(k.value/b)-H)),o=e.computed(()=>Math.min(s.value.length,w.value+C.value+H*2)),l=e.computed(()=>s.value.slice(w.value,o.value)),R=e.computed(()=>w.value*b),K=e.computed(()=>Math.max(0,(s.value.length-o.value)*b)),F=()=>{if(!c.value)return;const t=E.value;if(t<0)return;const a=w.value+2,m=o.value-3;if(t<a)B(Math.max(0,t*b));else if(t>m){const S=Math.max(0,t-C.value+1);B(S*b)}};e.watch(r,F);const U=e.computed(()=>T.value?{}:(s.value.find(a=>a.key===r.value)||h.value.find(a=>a.key===r.value)||s.value[0]||h.value[0])?.variant||{}),q=t=>{k.value=t.target.scrollTop},A=t=>{const a=s.value;if(!a.length)return;const m=E.value<0?0:E.value,S=Math.min(a.length-1,Math.max(0,m+t));r.value=a[S].key},G=t=>{switch(t.key){case"ArrowDown":t.preventDefault(),A(1);break;case"ArrowUp":t.preventDefault(),A(-1);break;case"Home":t.preventDefault(),s.value.length&&(r.value=s.value[0].key);break;case"End":t.preventDefault(),s.value.length&&(r.value=s.value[s.value.length-1].key);break}},j=t=>{r.value=t},_=e.computed(()=>{const t=u.value==="dark"?n.demoStyle?.dark:n.demoStyle?.light;return{body:{backgroundColor:t?.backgroundBody||"",color:t?.color||""},content:{backgroundColor:t?.backgroundContent||"",color:t?.color||""}}}),Q=t=>{let a="";t==="npm"?a=`npm install ${n.isDevComponent?"-D ":""}${n.npmInstall}`:a=`git clone ${n.urlClone}`,navigator.clipboard.writeText(a).then(()=>{P(`Copied to clipboard: ${a}`,"success",3e3)}).catch(m=>{P(`Failed to copy: ${m}`,"error",3e3)})},P=(t,a="success",m=3e3)=>{const S=`toast-${Date.now()}-${Math.random().toString(36).substr(2,9)}`;y.value.push({id:S,message:t,type:a,duration:m})},Y=t=>{const a=y.value.findIndex(m=>m.id===t);a>-1&&y.value.splice(a,1)};return e.watchEffect(async()=>{await L(),await x()}),{customStyle:_,toasts:y,readmeContent:N,changelogContent:g,selectedTab:z,searchQuery:p,selectedVariantKey:r,totalVariantsCount:M,filteredVariantsCount:I,variantsListRef:c,virtualizedVariants:l,virtualPaddingTop:R,virtualPaddingBottom:K,emptySearchState:T,theme:u,variant:U,addToast:P,removeToast:Y,selectVariant:j,setClickItem:Q,toggleTheme:$,handleVariantsScroll:q,handleVariantsKeydown:G}},ee={class:"tv-demo-case"},te={class:"tv-demo-header"},oe={class:"tv-demo-links"},ne=["href"],ae={key:1},le={key:3},re={class:"tv-demo-theme"},se={class:"switch"},ce=["checked"],ie={class:"tv-demo-tabs"},de={key:0,class:"tv-demo-layout"},me={class:"tv-demo-sidebar-header"},ue={class:"tv-demo-sidebar-meta"},ve=["aria-activedescendant"],fe=["id","aria-selected","onClick"],he={class:"tv-demo-variant-card-content"},ke={class:"tv-demo-variant-card-title"},pe={class:"tv-demo-variant-card-description"},ye={key:1,class:"tv-demo-empty-state"},ge={class:"tv-demo-content","aria-live":"polite"},Ve={class:"tv-demo-content-header"},Ee={class:"tv-demo-description"},Ce={class:"tv-demo-component-content"},be={key:1,class:"tv-demo-empty-component"},Ne={key:1,class:"tv-demo-empty-code"},Be={key:1,class:"tv-demo-content"},we={key:0,class:"markdown-body"},Se={key:1},De={key:2,class:"tv-demo-content"},Te={key:0,class:"markdown-body"},xe={key:1},$e={class:"tv-demo-footer-content"},ze={class:"tv-demo-footer-main"},Me={class:"tv-demo-footer-brand"},Ie={class:"tv-demo-footer-brand-text"},Le={class:"tv-demo-footer-brand-version"},Pe={class:"tv-demo-footer-bottom"},Re={class:"tv-demo-footer-copyright"},D={__name:"TvDemo",props:{demoStyle:{type:Object,default:()=>({body:{},content:{}})},hideBackground:Boolean,component:Object,variants:Array,componentName:{type:String,default:"Component Demo"},sourceLink:{type:String,default:null},urlClone:{type:String,default:null},npmInstall:{type:String,default:null},isDevComponent:{type:Boolean,default:!1},version:{type:String,default:"0.0.0"},readmePath:{type:String,default:"/README.md"},changelogPath:{type:String,default:"/CHANGELOG.md"},showDocumentation:{type:Boolean,default:!0},showChangelog:{type:Boolean,default:!0}},setup(n){const u=e.defineAsyncComponent(()=>Promise.resolve().then(()=>require("./ToastContainer-Cx0oFM8l.cjs"))),y=e.defineAsyncComponent(()=>Promise.resolve().then(()=>require("./ToUp-CJUZN3du.cjs"))),N=n,{customStyle:g,toasts:z,readmeContent:p,changelogContent:r,selectedTab:c,searchQuery:d,selectedVariantKey:k,totalVariantsCount:v,filteredVariantsCount:V,variantsListRef:h,virtualizedVariants:M,virtualPaddingTop:s,virtualPaddingBottom:I,emptySearchState:T,theme:i,variant:f,removeToast:L,setClickItem:x,toggleTheme:$,selectVariant:B,handleVariantsScroll:E,handleVariantsKeydown:C}=Z(N);return(w,o)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("div",{class:e.normalizeClass(`${e.unref(i)}-mode tv-demo`),style:e.normalizeStyle(e.unref(g).body)},[e.createElementVNode("div",{class:e.normalizeClass(["tv-demo-body",{[`${e.unref(i)}-mode`]:!n.hideBackground}]),style:e.normalizeStyle(e.unref(g).content)},[e.createElementVNode("div",ee,[e.createElementVNode("div",te,[e.createElementVNode("div",null,[e.createElementVNode("div",oe,[n.sourceLink||n.npmInstall||n.urlClone?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[n.sourceLink?(e.openBlock(),e.createElementBlock("a",{key:0,href:n.sourceLink,target:"_blank",class:"tv-demo-links-item"}," View source code ",8,ne)):e.createCommentVNode("",!0),n.sourceLink&&(n.npmInstall||n.urlClone)?(e.openBlock(),e.createElementBlock("span",ae," | ")):e.createCommentVNode("",!0),n.npmInstall?(e.openBlock(),e.createElementBlock("div",{key:2,class:"tv-demo-links-item",onClick:o[0]||(o[0]=l=>e.unref(x)("npm"))}," Copy install command ")):e.createCommentVNode("",!0),n.npmInstall&&n.urlClone?(e.openBlock(),e.createElementBlock("span",le," | ")):e.createCommentVNode("",!0),n.urlClone?(e.openBlock(),e.createElementBlock("div",{key:4,class:"tv-demo-links-item",onClick:o[1]||(o[1]=l=>e.unref(x)("clone"))}," Copy repository clone URL ")):e.createCommentVNode("",!0)],64)):e.createCommentVNode("",!0)])]),e.createElementVNode("div",null,[e.createElementVNode("div",re,[o[14]||(o[14]=e.createElementVNode("span",{style:{"font-size":"0.9rem",opacity:"0.8"}},"Theme",-1)),e.createElementVNode("label",se,[e.createElementVNode("input",{type:"checkbox",checked:e.unref(i)==="dark",onChange:o[2]||(o[2]=(...l)=>e.unref($)&&e.unref($)(...l))},null,40,ce),o[13]||(o[13]=e.createElementVNode("span",{class:"slider round"},null,-1))])])])]),e.createElementVNode("div",ie,[e.createElementVNode("button",{class:e.normalizeClass({active:e.unref(c)==="demo"}),onClick:o[3]||(o[3]=l=>c.value="demo")},"Demo",2),n.showDocumentation?(e.openBlock(),e.createElementBlock("button",{key:0,class:e.normalizeClass({active:e.unref(c)==="docs"}),onClick:o[4]||(o[4]=l=>c.value="docs")},"Documentation",2)):e.createCommentVNode("",!0),n.showChangelog?(e.openBlock(),e.createElementBlock("button",{key:1,class:e.normalizeClass({active:e.unref(c)==="changelog"}),onClick:o[5]||(o[5]=l=>c.value="changelog")},"Changelog",2)):e.createCommentVNode("",!0)]),e.unref(c)==="demo"?(e.openBlock(),e.createElementBlock("div",de,[e.createElementVNode("aside",{class:e.normalizeClass(["tv-demo-sidebar",`${e.unref(i)}-mode`])},[e.createElementVNode("div",me,[e.createElementVNode("div",null,[e.createElementVNode("p",ue,e.toDisplayString(e.unref(V))+" / "+e.toDisplayString(e.unref(v))+" variants",1),o[15]||(o[15]=e.createElementVNode("h3",null,"Variants",-1))]),e.createElementVNode("button",{class:"tv-demo-sidebar-collapse","aria-label":"Scroll to top",onClick:o[6]||(o[6]=l=>e.unref(h)?.scrollTo({top:0,behavior:"smooth"}))}," ⬆️ ")]),e.createElementVNode("label",{class:e.normalizeClass(["tv-demo-search",`${e.unref(i)}-mode`])},[o[16]||(o[16]=e.createElementVNode("span",{class:"tv-demo-search-icon"},"🔍",-1)),e.withDirectives(e.createElementVNode("input",{"onUpdate:modelValue":o[7]||(o[7]=l=>e.isRef(d)?d.value=l:null),type:"search",placeholder:"Search variants...",class:"tv-demo-search-input","aria-label":"Search variants",onKeydown:o[8]||(o[8]=e.withKeys(e.withModifiers(l=>e.unref(C)(l),["prevent"]),["down"]))},null,544),[[e.vModelText,e.unref(d)]]),e.unref(d)?(e.openBlock(),e.createElementBlock("button",{key:0,type:"button",class:"tv-demo-search-clear","aria-label":"Clear search",onClick:o[9]||(o[9]=l=>d.value="")},"✕")):e.createCommentVNode("",!0)],2),e.createElementVNode("div",{class:e.normalizeClass(["tv-demo-variants",`${e.unref(i)}-mode`]),role:"listbox",tabindex:"0","aria-label":"Available variants","aria-activedescendant":e.unref(k)?`variant-${e.unref(k)}`:null,onKeydown:o[11]||(o[11]=(...l)=>e.unref(C)&&e.unref(C)(...l)),ref_key:"variantsListRef",ref:h,onScroll:o[12]||(o[12]=(...l)=>e.unref(E)&&e.unref(E)(...l))},[e.createElementVNode("div",{style:e.normalizeStyle({paddingTop:`${e.unref(s)}px`,paddingBottom:`${e.unref(I)}px`})},[e.unref(T)?(e.openBlock(),e.createElementBlock("div",ye,[e.createElementVNode("p",null,'No matches for "'+e.toDisplayString(e.unref(d))+'".',1),e.createElementVNode("button",{class:"tv-demo-reset",type:"button",onClick:o[10]||(o[10]=l=>d.value="")},"Clear filter")])):(e.openBlock(!0),e.createElementBlock(e.Fragment,{key:0},e.renderList(e.unref(M),l=>(e.openBlock(),e.createElementBlock("button",{key:l.key,id:`variant-${l.key}`,type:"button",class:e.normalizeClass(["tv-demo-variant-card",{active:l.key===e.unref(k)}]),role:"option","aria-selected":l.key===e.unref(k),onClick:R=>e.unref(B)(l.key)},[e.createElementVNode("span",he,[e.createElementVNode("span",ke,e.toDisplayString(l.variant.title),1),e.createElementVNode("span",pe,e.toDisplayString(l.variant.description),1)]),o[17]||(o[17]=e.createElementVNode("span",{class:"tv-demo-variant-card-icon"},"→",-1))],10,fe))),128))],4)],42,ve)],2),e.createElementVNode("section",ge,[e.createElementVNode("div",Ve,[e.createElementVNode("div",null,[o[18]||(o[18]=e.createElementVNode("p",{class:"tv-demo-content-label"},"Preview",-1)),e.createElementVNode("h3",null,e.toDisplayString(e.unref(f).title||"Select a variant"),1)])]),e.createElementVNode("p",Ee,e.toDisplayString(e.unref(f).description||"Select a variant from the list to view its details."),1),e.createElementVNode("div",Ce,[e.unref(f)&&n.component?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(n.component),e.normalizeProps(e.mergeProps({key:0},e.unref(f).propsData)),null,16)):(e.openBlock(),e.createElementBlock("p",be,"No component to render."))]),o[19]||(o[19]=e.createElementVNode("h3",null,"Code:",-1)),e.unref(f)?.html?(e.openBlock(),e.createBlock(e.unref(J.HighCode),{class:"tv-demo-code",codeValue:e.unref(f).html,theme:e.unref(i),lang:"html",codeLines:"",key:e.unref(f).title,height:"auto"},null,8,["codeValue","theme"])):(e.openBlock(),e.createElementBlock("p",Ne,"No snippet available."))])])):e.createCommentVNode("",!0),e.unref(c)==="docs"&&n.showDocumentation?(e.openBlock(),e.createElementBlock("div",Be,[e.unref(p)?(e.openBlock(),e.createElementBlock("div",we,[e.createVNode(e.unref(O),{source:e.unref(p),html:""},null,8,["source"])])):(e.openBlock(),e.createElementBlock("div",Se,"No documentation available."))])):e.createCommentVNode("",!0),e.unref(c)==="changelog"&&n.showChangelog?(e.openBlock(),e.createElementBlock("div",De,[e.unref(r)?(e.openBlock(),e.createElementBlock("div",Te,[e.createVNode(e.unref(O),{source:e.unref(r),html:""},null,8,["source"])])):(e.openBlock(),e.createElementBlock("div",xe,"No changelog available."))])):e.createCommentVNode("",!0)])],6)],6),e.createElementVNode("footer",{class:e.normalizeClass(["tv-demo-footer",`${e.unref(i)}-mode`])},[e.createElementVNode("div",$e,[e.createElementVNode("div",ze,[e.createElementVNode("div",Me,[o[20]||(o[20]=e.createElementVNode("span",{class:"tv-demo-footer-logo"},[e.createElementVNode("img",{src:"https://firebasestorage.googleapis.com/v0/b/todovue-blog.appspot.com/o/icono_git.png?alt=media&token=86270c30-8235-4424-b72b-7a585f228685",alt:""})],-1)),e.createElementVNode("span",Ie,e.toDisplayString(n.componentName),1),e.createElementVNode("span",Le,"v"+e.toDisplayString(n.version),1)]),o[21]||(o[21]=e.createStaticVNode('<div class="tv-demo-footer-info"><p class="tv-demo-footer-text"> Designed &amp; Developed by <a href="https://cris-dev.com/" target="_blank" rel="noopener noreferrer" class="tv-demo-footer-link"> cris-dev.com </a></p><div class="tv-demo-footer-divider"></div><p class="tv-demo-footer-text"> Made with <span class="tv-demo-footer-heart">💙</span> using Vue.js </p></div>',1))]),e.createElementVNode("div",Pe,[e.createElementVNode("p",Re," © "+e.toDisplayString(new Date().getFullYear())+" TODOvue. All rights reserved. ",1)])])],2),e.createVNode(e.unref(u),{toasts:e.unref(z),onRemoveToast:e.unref(L)},null,8,["toasts","onRemoveToast"]),e.createVNode(e.unref(y),{theme:e.unref(i),"scroll-target":".tv-demo-body","aria-label":"Back to top"},null,8,["theme"])],64))}};D.install=n=>{n.component("TvDemo",D)};const Ae={install(n){n.component("TvDemo",D)}};exports.TvDemo=D;exports.TvDemoPlugin=Ae;exports.default=D;

package/dist/tv-demo.css

@@ -1 +1 @@
-@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Kanit:wght@600&family=Lato:wght@300&display=swap";.markdown-body{--base-size-4: .25rem;--base-size-8: .5rem;--base-size-16: 1rem;--base-size-24: 1.5rem;--base-size-40: 2.5rem;--base-text-weight-normal: 400;--base-text-weight-medium: 500;--base-text-weight-semibold: 600;--fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;--fgColor-accent: Highlight}@media(prefers-color-scheme:dark){.markdown-body,[data-theme=dark]{color-scheme:dark;--focus-outlineColor: #1f6feb;--fgColor-default: #f0f6fc;--fgColor-muted: #9198a1;--fgColor-accent: #4493f8;--fgColor-success: #3fb950;--fgColor-attention: #d29922;--fgColor-danger: #f85149;--fgColor-done: #ab7df8;--bgColor-default: #0d1117;--bgColor-muted: #151b23;--bgColor-neutral-muted: #656c7633;--bgColor-attention-muted: #bb800926;--borderColor-default: #3d444d;--borderColor-muted: #3d444db3;--borderColor-neutral-muted: #3d444db3;--borderColor-accent-emphasis: #1f6feb;--borderColor-success-emphasis: #238636;--borderColor-attention-emphasis: #9e6a03;--borderColor-danger-emphasis: #da3633;--borderColor-done-emphasis: #8957e5;--color-prettylights-syntax-comment: #9198a1;--color-prettylights-syntax-constant: #79c0ff;--color-prettylights-syntax-constant-other-reference-link: #a5d6ff;--color-prettylights-syntax-entity: #d2a8ff;--color-prettylights-syntax-storage-modifier-import: #f0f6fc;--color-prettylights-syntax-entity-tag: #7ee787;--color-prettylights-syntax-keyword: #ff7b72;--color-prettylights-syntax-string: #a5d6ff;--color-prettylights-syntax-variable: #ffa657;--color-prettylights-syntax-brackethighlighter-unmatched: #f85149;--color-prettylights-syntax-brackethighlighter-angle: #9198a1;--color-prettylights-syntax-invalid-illegal-text: #f0f6fc;--color-prettylights-syntax-invalid-illegal-bg: #8e1519;--color-prettylights-syntax-carriage-return-text: #f0f6fc;--color-prettylights-syntax-carriage-return-bg: #b62324;--color-prettylights-syntax-string-regexp: #7ee787;--color-prettylights-syntax-markup-list: #f2cc60;--color-prettylights-syntax-markup-heading: #1f6feb;--color-prettylights-syntax-markup-italic: #f0f6fc;--color-prettylights-syntax-markup-bold: #f0f6fc;--color-prettylights-syntax-markup-deleted-text: #ffdcd7;--color-prettylights-syntax-markup-deleted-bg: #67060c;--color-prettylights-syntax-markup-inserted-text: #aff5b4;--color-prettylights-syntax-markup-inserted-bg: #033a16;--color-prettylights-syntax-markup-changed-text: #ffdfb6;--color-prettylights-syntax-markup-changed-bg: #5a1e02;--color-prettylights-syntax-markup-ignored-text: #f0f6fc;--color-prettylights-syntax-markup-ignored-bg: #1158c7;--color-prettylights-syntax-meta-diff-range: #d2a8ff;--color-prettylights-syntax-sublimelinter-gutter-mark: #3d444d}}@media(prefers-color-scheme:light){.markdown-body,[data-theme=light]{color-scheme:light;--focus-outlineColor: #0969da;--fgColor-default: #1f2328;--fgColor-muted: #59636e;--fgColor-accent: #0969da;--fgColor-success: #1a7f37;--fgColor-attention: #9a6700;--fgColor-danger: #d1242f;--fgColor-done: #8250df;--bgColor-default: #ffffff;--bgColor-muted: #f6f8fa;--bgColor-neutral-muted: #818b981f;--bgColor-attention-muted: #fff8c5;--borderColor-default: #d1d9e0;--borderColor-muted: #d1d9e0b3;--borderColor-neutral-muted: #d1d9e0b3;--borderColor-accent-emphasis: #0969da;--borderColor-success-emphasis: #1a7f37;--borderColor-attention-emphasis: #9a6700;--borderColor-danger-emphasis: #cf222e;--borderColor-done-emphasis: #8250df;--color-prettylights-syntax-comment: #59636e;--color-prettylights-syntax-constant: #0550ae;--color-prettylights-syntax-constant-other-reference-link: #0a3069;--color-prettylights-syntax-entity: #6639ba;--color-prettylights-syntax-storage-modifier-import: #1f2328;--color-prettylights-syntax-entity-tag: #0550ae;--color-prettylights-syntax-keyword: #cf222e;--color-prettylights-syntax-string: #0a3069;--color-prettylights-syntax-variable: #953800;--color-prettylights-syntax-brackethighlighter-unmatched: #82071e;--color-prettylights-syntax-brackethighlighter-angle: #59636e;--color-prettylights-syntax-invalid-illegal-text: #f6f8fa;--color-prettylights-syntax-invalid-illegal-bg: #82071e;--color-prettylights-syntax-carriage-return-text: #f6f8fa;--color-prettylights-syntax-carriage-return-bg: #cf222e;--color-prettylights-syntax-string-regexp: #116329;--color-prettylights-syntax-markup-list: #3b2300;--color-prettylights-syntax-markup-heading: #0550ae;--color-prettylights-syntax-markup-italic: #1f2328;--color-prettylights-syntax-markup-bold: #1f2328;--color-prettylights-syntax-markup-deleted-text: #82071e;--color-prettylights-syntax-markup-deleted-bg: #ffebe9;--color-prettylights-syntax-markup-inserted-text: #116329;--color-prettylights-syntax-markup-inserted-bg: #dafbe1;--color-prettylights-syntax-markup-changed-text: #953800;--color-prettylights-syntax-markup-changed-bg: #ffd8b5;--color-prettylights-syntax-markup-ignored-text: #d1d9e0;--color-prettylights-syntax-markup-ignored-bg: #0550ae;--color-prettylights-syntax-meta-diff-range: #8250df;--color-prettylights-syntax-sublimelinter-gutter-mark: #818b98}}.markdown-body{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;margin:0;color:var(--fgColor-default);background-color:var(--bgColor-default);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";font-size:16px;line-height:1.5;word-wrap:break-word}.markdown-body .octicon{display:inline-block;fill:currentColor;vertical-align:text-bottom}.markdown-body h1:hover .anchor .octicon-link:before,.markdown-body h2:hover .anchor .octicon-link:before,.markdown-body h3:hover .anchor .octicon-link:before,.markdown-body h4:hover .anchor .octicon-link:before,.markdown-body h5:hover .anchor .octicon-link:before,.markdown-body h6:hover .anchor .octicon-link:before{width:16px;height:16px;content:" ";display:inline-block;background-color:currentColor;-webkit-mask-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>");mask-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>")}.markdown-body details,.markdown-body figcaption,.markdown-body figure{display:block}.markdown-body summary{display:list-item}.markdown-body [hidden]{display:none!important}.markdown-body a{background-color:transparent;color:var(--fgColor-accent);text-decoration:none}.markdown-body abbr[title]{border-bottom:none;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.markdown-body b,.markdown-body strong{font-weight:var(--base-text-weight-semibold, 600)}.markdown-body dfn{font-style:italic}.markdown-body h1{margin:.67em 0;font-weight:var(--base-text-weight-semibold, 600);padding-bottom:.3em;font-size:2em;border-bottom:1px solid var(--borderColor-muted)}.markdown-body mark{background-color:var(--bgColor-attention-muted);color:var(--fgColor-default)}.markdown-body small{font-size:90%}.markdown-body sub,.markdown-body sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}.markdown-body sub{bottom:-.25em}.markdown-body sup{top:-.5em}.markdown-body img{border-style:none;max-width:100%;box-sizing:content-box}.markdown-body code,.markdown-body kbd,.markdown-body pre,.markdown-body samp{font-family:monospace;font-size:1em}.markdown-body figure{margin:1em var(--base-size-40)}.markdown-body hr{box-sizing:content-box;overflow:hidden;background:transparent;border-bottom:1px solid var(--borderColor-muted);height:.25em;padding:0;margin:var(--base-size-24) 0;background-color:var(--borderColor-default);border:0}.markdown-body input{font:inherit;margin:0;overflow:visible;font-family:inherit;font-size:inherit;line-height:inherit}.markdown-body [type=button],.markdown-body [type=reset],.markdown-body [type=submit]{-webkit-appearance:button;appearance:button}.markdown-body [type=checkbox],.markdown-body [type=radio]{box-sizing:border-box;padding:0}.markdown-body [type=number]::-webkit-inner-spin-button,.markdown-body [type=number]::-webkit-outer-spin-button{height:auto}.markdown-body [type=search]::-webkit-search-cancel-button,.markdown-body [type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}.markdown-body ::-webkit-input-placeholder{color:inherit;opacity:.54}.markdown-body ::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}.markdown-body a:hover{text-decoration:underline}.markdown-body ::placeholder{color:var(--fgColor-muted);opacity:1}.markdown-body hr:before{display:table;content:""}.markdown-body hr:after{display:table;clear:both;content:""}.markdown-body table{border-spacing:0;border-collapse:collapse;display:block;width:max-content;max-width:100%;overflow:auto;font-variant:tabular-nums}.markdown-body td,.markdown-body th{padding:0}.markdown-body details summary{cursor:pointer}.markdown-body a:focus,.markdown-body [role=button]:focus,.markdown-body input[type=radio]:focus,.markdown-body input[type=checkbox]:focus{outline:2px solid var(--focus-outlineColor);outline-offset:-2px;box-shadow:none}.markdown-body a:focus:not(:focus-visible),.markdown-body [role=button]:focus:not(:focus-visible),.markdown-body input[type=radio]:focus:not(:focus-visible),.markdown-body input[type=checkbox]:focus:not(:focus-visible){outline:solid 1px transparent}.markdown-body a:focus-visible,.markdown-body [role=button]:focus-visible,.markdown-body input[type=radio]:focus-visible,.markdown-body input[type=checkbox]:focus-visible{outline:2px solid var(--focus-outlineColor);outline-offset:-2px;box-shadow:none}.markdown-body a:not([class]):focus,.markdown-body a:not([class]):focus-visible,.markdown-body input[type=radio]:focus,.markdown-body input[type=radio]:focus-visible,.markdown-body input[type=checkbox]:focus,.markdown-body input[type=checkbox]:focus-visible{outline-offset:0}.markdown-body kbd{display:inline-block;padding:var(--base-size-4);font:11px var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);line-height:10px;color:var(--fgColor-default);vertical-align:middle;background-color:var(--bgColor-muted);border:solid 1px var(--borderColor-neutral-muted);border-bottom-color:var(--borderColor-neutral-muted);border-radius:6px;box-shadow:inset 0 -1px 0 var(--borderColor-neutral-muted)}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6{margin-top:var(--base-size-24);margin-bottom:var(--base-size-16);font-weight:var(--base-text-weight-semibold, 600);line-height:1.25}.markdown-body h2{font-weight:var(--base-text-weight-semibold, 600);padding-bottom:.3em;font-size:1.5em;border-bottom:1px solid var(--borderColor-muted)}.markdown-body h3{font-weight:var(--base-text-weight-semibold, 600);font-size:1.25em}.markdown-body h4{font-weight:var(--base-text-weight-semibold, 600);font-size:1em}.markdown-body h5{font-weight:var(--base-text-weight-semibold, 600);font-size:.875em}.markdown-body h6{font-weight:var(--base-text-weight-semibold, 600);font-size:.85em;color:var(--fgColor-muted)}.markdown-body p{margin-top:0;margin-bottom:10px}.markdown-body blockquote{margin:0;padding:0 1em;color:var(--fgColor-muted);border-left:.25em solid var(--borderColor-default)}.markdown-body ul,.markdown-body ol{margin-top:0;margin-bottom:0;padding-left:2em}.markdown-body ol ol,.markdown-body ul ol{list-style-type:lower-roman}.markdown-body ul ul ol,.markdown-body ul ol ol,.markdown-body ol ul ol,.markdown-body ol ol ol{list-style-type:lower-alpha}.markdown-body dd{margin-left:0}.markdown-body tt,.markdown-body code,.markdown-body samp{font-family:var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);font-size:12px}.markdown-body pre{margin-top:0;margin-bottom:0;font-family:var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);font-size:12px;word-wrap:normal}.markdown-body .octicon{display:inline-block;overflow:visible!important;vertical-align:text-bottom;fill:currentColor}.markdown-body input::-webkit-outer-spin-button,.markdown-body input::-webkit-inner-spin-button{margin:0;appearance:none}.markdown-body .mr-2{margin-right:var(--base-size-8, 8px)!important}.markdown-body:before{display:table;content:""}.markdown-body:after{display:table;clear:both;content:""}.markdown-body>*:first-child{margin-top:0!important}.markdown-body>*:last-child{margin-bottom:0!important}.markdown-body a:not([href]){color:inherit;text-decoration:none}.markdown-body .absent{color:var(--fgColor-danger)}.markdown-body .anchor{float:left;padding-right:var(--base-size-4);margin-left:-20px;line-height:1}.markdown-body .anchor:focus{outline:none}.markdown-body p,.markdown-body blockquote,.markdown-body ul,.markdown-body ol,.markdown-body dl,.markdown-body table,.markdown-body pre,.markdown-body details{margin-top:0;margin-bottom:var(--base-size-16)}.markdown-body blockquote>:first-child{margin-top:0}.markdown-body blockquote>:last-child{margin-bottom:0}.markdown-body h1 .octicon-link,.markdown-body h2 .octicon-link,.markdown-body h3 .octicon-link,.markdown-body h4 .octicon-link,.markdown-body h5 .octicon-link,.markdown-body h6 .octicon-link{color:var(--fgColor-default);vertical-align:middle;visibility:hidden}.markdown-body h1:hover .anchor,.markdown-body h2:hover .anchor,.markdown-body h3:hover .anchor,.markdown-body h4:hover .anchor,.markdown-body h5:hover .anchor,.markdown-body h6:hover .anchor{text-decoration:none}.markdown-body h1:hover .anchor .octicon-link,.markdown-body h2:hover .anchor .octicon-link,.markdown-body h3:hover .anchor .octicon-link,.markdown-body h4:hover .anchor .octicon-link,.markdown-body h5:hover .anchor .octicon-link,.markdown-body h6:hover .anchor .octicon-link{visibility:visible}.markdown-body h1 tt,.markdown-body h1 code,.markdown-body h2 tt,.markdown-body h2 code,.markdown-body h3 tt,.markdown-body h3 code,.markdown-body h4 tt,.markdown-body h4 code,.markdown-body h5 tt,.markdown-body h5 code,.markdown-body h6 tt,.markdown-body h6 code{padding:0 .2em;font-size:inherit}.markdown-body summary h1,.markdown-body summary h2,.markdown-body summary h3,.markdown-body summary h4,.markdown-body summary h5,.markdown-body summary h6{display:inline-block}.markdown-body summary h1 .anchor,.markdown-body summary h2 .anchor,.markdown-body summary h3 .anchor,.markdown-body summary h4 .anchor,.markdown-body summary h5 .anchor,.markdown-body summary h6 .anchor{margin-left:-40px}.markdown-body summary h1,.markdown-body summary h2{padding-bottom:0;border-bottom:0}.markdown-body ul.no-list,.markdown-body ol.no-list{padding:0;list-style-type:none}.markdown-body ol[type="a s"]{list-style-type:lower-alpha}.markdown-body ol[type="A s"]{list-style-type:upper-alpha}.markdown-body ol[type="i s"]{list-style-type:lower-roman}.markdown-body ol[type="I s"]{list-style-type:upper-roman}.markdown-body ol[type="1"]{list-style-type:decimal}.markdown-body div>ol:not([type]){list-style-type:decimal}.markdown-body ul ul,.markdown-body ul ol,.markdown-body ol ol,.markdown-body ol ul{margin-top:0;margin-bottom:0}.markdown-body li>p{margin-top:var(--base-size-16)}.markdown-body li+li{margin-top:.25em}.markdown-body dl{padding:0}.markdown-body dl dt{padding:0;margin-top:var(--base-size-16);font-size:1em;font-style:italic;font-weight:var(--base-text-weight-semibold, 600)}.markdown-body dl dd{padding:0 var(--base-size-16);margin-bottom:var(--base-size-16)}.markdown-body table th{font-weight:var(--base-text-weight-semibold, 600)}.markdown-body table th,.markdown-body table td{padding:6px 13px;border:1px solid var(--borderColor-default)}.markdown-body table td>:last-child{margin-bottom:0}.markdown-body table tr{background-color:var(--bgColor-default);border-top:1px solid var(--borderColor-muted)}.markdown-body table tr:nth-child(2n){background-color:var(--bgColor-muted)}.markdown-body table img{background-color:transparent}.markdown-body img[align=right]{padding-left:20px}.markdown-body img[align=left]{padding-right:20px}.markdown-body .emoji{max-width:none;vertical-align:text-top;background-color:transparent}.markdown-body span.frame{display:block;overflow:hidden}.markdown-body span.frame>span{display:block;float:left;width:auto;padding:7px;margin:13px 0 0;overflow:hidden;border:1px solid var(--borderColor-default)}.markdown-body span.frame span img{display:block;float:left}.markdown-body span.frame span span{display:block;padding:5px 0 0;clear:both;color:var(--fgColor-default)}.markdown-body span.align-center{display:block;overflow:hidden;clear:both}.markdown-body span.align-center>span{display:block;margin:13px auto 0;overflow:hidden;text-align:center}.markdown-body span.align-center span img{margin:0 auto;text-align:center}.markdown-body span.align-right{display:block;overflow:hidden;clear:both}.markdown-body span.align-right>span{display:block;margin:13px 0 0;overflow:hidden;text-align:right}.markdown-body span.align-right span img{margin:0;text-align:right}.markdown-body span.float-left{display:block;float:left;margin-right:13px;overflow:hidden}.markdown-body span.float-left span{margin:13px 0 0}.markdown-body span.float-right{display:block;float:right;margin-left:13px;overflow:hidden}.markdown-body span.float-right>span{display:block;margin:13px auto 0;overflow:hidden;text-align:right}.markdown-body code,.markdown-body tt{padding:.2em .4em;margin:0;font-size:85%;white-space:break-spaces;background-color:var(--bgColor-neutral-muted);border-radius:6px}.markdown-body code br,.markdown-body tt br{display:none}.markdown-body del code{text-decoration:inherit}.markdown-body samp{font-size:85%}.markdown-body pre code{font-size:100%}.markdown-body pre>code{padding:0;margin:0;word-break:normal;white-space:pre;background:transparent;border:0}.markdown-body .highlight{margin-bottom:var(--base-size-16)}.markdown-body .highlight pre{margin-bottom:0;word-break:normal}.markdown-body .highlight pre,.markdown-body pre{padding:var(--base-size-16);overflow:auto;font-size:85%;line-height:1.45;color:var(--fgColor-default);background-color:var(--bgColor-muted);border-radius:6px}.markdown-body pre code,.markdown-body pre tt{display:inline;max-width:auto;padding:0;margin:0;overflow:visible;line-height:inherit;word-wrap:normal;background-color:transparent;border:0}.markdown-body .csv-data td,.markdown-body .csv-data th{padding:5px;overflow:hidden;font-size:12px;line-height:1;text-align:left;white-space:nowrap}.markdown-body .csv-data .blob-num{padding:10px var(--base-size-8) 9px;text-align:right;background:var(--bgColor-default);border:0}.markdown-body .csv-data tr{border-top:0}.markdown-body .csv-data th{font-weight:var(--base-text-weight-semibold, 600);background:var(--bgColor-muted);border-top:0}.markdown-body [data-footnote-ref]:before{content:"["}.markdown-body [data-footnote-ref]:after{content:"]"}.markdown-body .footnotes{font-size:12px;color:var(--fgColor-muted);border-top:1px solid var(--borderColor-default)}.markdown-body .footnotes ol{padding-left:var(--base-size-16)}.markdown-body .footnotes ol ul{display:inline-block;padding-left:var(--base-size-16);margin-top:var(--base-size-16)}.markdown-body .footnotes li{position:relative}.markdown-body .footnotes li:target:before{position:absolute;top:calc(var(--base-size-8)*-1);right:calc(var(--base-size-8)*-1);bottom:calc(var(--base-size-8)*-1);left:calc(var(--base-size-24)*-1);pointer-events:none;content:"";border:2px solid var(--borderColor-accent-emphasis);border-radius:6px}.markdown-body .footnotes li:target{color:var(--fgColor-default)}.markdown-body .footnotes .data-footnote-backref g-emoji{font-family:monospace}.markdown-body body:has(:modal){padding-right:var(--dialog-scrollgutter)!important}.markdown-body .pl-c{color:var(--color-prettylights-syntax-comment)}.markdown-body .pl-c1,.markdown-body .pl-s .pl-v{color:var(--color-prettylights-syntax-constant)}.markdown-body .pl-e,.markdown-body .pl-en{color:var(--color-prettylights-syntax-entity)}.markdown-body .pl-smi,.markdown-body .pl-s .pl-s1{color:var(--color-prettylights-syntax-storage-modifier-import)}.markdown-body .pl-ent{color:var(--color-prettylights-syntax-entity-tag)}.markdown-body .pl-k{color:var(--color-prettylights-syntax-keyword)}.markdown-body .pl-s,.markdown-body .pl-pds,.markdown-body .pl-s .pl-pse .pl-s1,.markdown-body .pl-sr,.markdown-body .pl-sr .pl-cce,.markdown-body .pl-sr .pl-sre,.markdown-body .pl-sr .pl-sra{color:var(--color-prettylights-syntax-string)}.markdown-body .pl-v,.markdown-body .pl-smw{color:var(--color-prettylights-syntax-variable)}.markdown-body .pl-bu{color:var(--color-prettylights-syntax-brackethighlighter-unmatched)}.markdown-body .pl-ii{color:var(--color-prettylights-syntax-invalid-illegal-text);background-color:var(--color-prettylights-syntax-invalid-illegal-bg)}.markdown-body .pl-c2{color:var(--color-prettylights-syntax-carriage-return-text);background-color:var(--color-prettylights-syntax-carriage-return-bg)}.markdown-body .pl-sr .pl-cce{font-weight:700;color:var(--color-prettylights-syntax-string-regexp)}.markdown-body .pl-ml{color:var(--color-prettylights-syntax-markup-list)}.markdown-body .pl-mh,.markdown-body .pl-mh .pl-en,.markdown-body .pl-ms{font-weight:700;color:var(--color-prettylights-syntax-markup-heading)}.markdown-body .pl-mi{font-style:italic;color:var(--color-prettylights-syntax-markup-italic)}.markdown-body .pl-mb{font-weight:700;color:var(--color-prettylights-syntax-markup-bold)}.markdown-body .pl-md{color:var(--color-prettylights-syntax-markup-deleted-text);background-color:var(--color-prettylights-syntax-markup-deleted-bg)}.markdown-body .pl-mi1{color:var(--color-prettylights-syntax-markup-inserted-text);background-color:var(--color-prettylights-syntax-markup-inserted-bg)}.markdown-body .pl-mc{color:var(--color-prettylights-syntax-markup-changed-text);background-color:var(--color-prettylights-syntax-markup-changed-bg)}.markdown-body .pl-mi2{color:var(--color-prettylights-syntax-markup-ignored-text);background-color:var(--color-prettylights-syntax-markup-ignored-bg)}.markdown-body .pl-mdr{font-weight:700;color:var(--color-prettylights-syntax-meta-diff-range)}.markdown-body .pl-ba{color:var(--color-prettylights-syntax-brackethighlighter-angle)}.markdown-body .pl-sg{color:var(--color-prettylights-syntax-sublimelinter-gutter-mark)}.markdown-body .pl-corl{text-decoration:underline;color:var(--color-prettylights-syntax-constant-other-reference-link)}.markdown-body [role=button]:focus:not(:focus-visible),.markdown-body [role=tabpanel][tabindex="0"]:focus:not(:focus-visible),.markdown-body button:focus:not(:focus-visible),.markdown-body summary:focus:not(:focus-visible),.markdown-body a:focus:not(:focus-visible){outline:none;box-shadow:none}.markdown-body [tabindex="0"]:focus:not(:focus-visible),.markdown-body details-dialog:focus:not(:focus-visible){outline:none}.markdown-body g-emoji{display:inline-block;min-width:1ch;font-family:"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol;font-size:1em;font-style:normal!important;font-weight:var(--base-text-weight-normal, 400);line-height:1;vertical-align:-.075em}.markdown-body g-emoji img{width:1em;height:1em}.markdown-body .task-list-item{list-style-type:none}.markdown-body .task-list-item label{font-weight:var(--base-text-weight-normal, 400)}.markdown-body .task-list-item.enabled label{cursor:pointer}.markdown-body .task-list-item+.task-list-item{margin-top:var(--base-size-4)}.markdown-body .task-list-item .handle{display:none}.markdown-body .task-list-item-checkbox{margin:0 .2em .25em -1.4em;vertical-align:middle}.markdown-body ul:dir(rtl) .task-list-item-checkbox{margin:0 -1.6em .25em .2em}.markdown-body ol:dir(rtl) .task-list-item-checkbox{margin:0 -1.6em .25em .2em}.markdown-body .contains-task-list:hover .task-list-item-convert-container,.markdown-body .contains-task-list:focus-within .task-list-item-convert-container{display:block;width:auto;height:24px;overflow:visible;clip:auto}.markdown-body ::-webkit-calendar-picker-indicator{filter:invert(50%)}.markdown-body .markdown-alert{padding:var(--base-size-8) var(--base-size-16);margin-bottom:var(--base-size-16);color:inherit;border-left:.25em solid var(--borderColor-default)}.markdown-body .markdown-alert>:first-child{margin-top:0}.markdown-body .markdown-alert>:last-child{margin-bottom:0}.markdown-body .markdown-alert .markdown-alert-title{display:flex;font-weight:var(--base-text-weight-medium, 500);align-items:center;line-height:1}.markdown-body .markdown-alert.markdown-alert-note{border-left-color:var(--borderColor-accent-emphasis)}.markdown-body .markdown-alert.markdown-alert-note .markdown-alert-title{color:var(--fgColor-accent)}.markdown-body .markdown-alert.markdown-alert-important{border-left-color:var(--borderColor-done-emphasis)}.markdown-body .markdown-alert.markdown-alert-important .markdown-alert-title{color:var(--fgColor-done)}.markdown-body .markdown-alert.markdown-alert-warning{border-left-color:var(--borderColor-attention-emphasis)}.markdown-body .markdown-alert.markdown-alert-warning .markdown-alert-title{color:var(--fgColor-attention)}.markdown-body .markdown-alert.markdown-alert-tip{border-left-color:var(--borderColor-success-emphasis)}.markdown-body .markdown-alert.markdown-alert-tip .markdown-alert-title{color:var(--fgColor-success)}.markdown-body .markdown-alert.markdown-alert-caution{border-left-color:var(--borderColor-danger-emphasis)}.markdown-body .markdown-alert.markdown-alert-caution .markdown-alert-title{color:var(--fgColor-danger)}.markdown-body>*:first-child>.heading-element:first-child{margin-top:0!important}.markdown-body .highlight pre:has(+.zeroclipboard-container){min-height:52px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Lato,sans-serif;font-size:1rem}h1,h2,h3,h4,h5,h6{font-family:Kanit,sans-serif;font-size:2rem}.dark-mode,.dark-mode body{background-color:#7a7d7d;color:#f4faff}.dark-mode .tv-search-results::-webkit-scrollbar-thumb{background-color:#0e131f}.dark-mode .tv-search-results::-webkit-scrollbar-thumb:hover{background-color:#000}.light-mode,.light-mode body{background-color:#e0e1e1;color:#000b14}.light-mode .tv-search-results::-webkit-scrollbar-thumb{background-color:#b9c4df}.light-mode .tv-search-results::-webkit-scrollbar-thumb:hover{background-color:#96a7cf}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background-color:#f1f9f9}::-webkit-scrollbar-thumb{background-color:#b9c4df}::-webkit-scrollbar-thumb:hover{background-color:#96a7cf}@keyframes slideInRight{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fadeOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(400px)}}.markdown-body{padding:40px 30px!important;border-radius:16px;color:#fff;font-size:16px;line-height:1.8;font-family:Lato,sans-serif}.markdown-body h1,.markdown-body h2,.markdown-body h3{background:linear-gradient(135deg,#3b82f6,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-family:Kanit,sans-serif;margin-top:2em;margin-bottom:1em;font-weight:700}.markdown-body h1{font-size:2.5rem;border-bottom:3px solid transparent;border-image:linear-gradient(90deg,#3b82f6,#8b5cf6) 1;padding-bottom:.5em}.markdown-body h2{font-size:2rem}.markdown-body h3{font-size:1.6rem}.markdown-body pre{background:linear-gradient(135deg,#1e293b,#0f172a);padding:20px;border-radius:12px;overflow-x:auto;box-shadow:0 8px 24px #0000004d,inset 0 1px #ffffff0d;border:2px solid rgba(59,130,246,.2)}.markdown-body code{background:linear-gradient(135deg,#3b82f626,#8b5cf626);padding:4px 8px;border-radius:6px;font-size:.9em;border:1px solid rgba(59,130,246,.3)}.markdown-body p{margin-bottom:1.2em}.tv-demo-tabs{display:flex;margin-bottom:10px;gap:8px}.tv-demo-tabs button{border:none;padding:12px 20px;cursor:pointer;font-size:1rem;border-radius:8px 8px 0 0;transition:all .3s cubic-bezier(.4,0,.2,1);font-weight:500;letter-spacing:.3px;position:relative}.tv-demo-tabs button:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#3b82f6,#60a5fa);opacity:0;transition:opacity .3s ease}.tv-demo-tabs button.active:after{opacity:1}.tv-demo-tabs button:active{transform:translateY(1px)}.tv-demo *{box-sizing:border-box;margin:0;padding:0}.tv-demo-content{padding:20px;border:1px solid #4a4a4a;border-radius:0 5px 5px;min-width:0;max-width:100%;overflow:hidden}.tv-demo-content .tv-demo-description{font-size:1.1rem}.tv-demo-content .tv-demo-component-content{display:flex;margin:0 auto;padding:20px;justify-content:center;width:100%;max-width:100%;overflow:hidden}.tv-demo-content>*{max-width:100%}a,.tv-demo-links-item{text-decoration:none;font-weight:600;display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:1rem;padding:10px 20px;border-radius:8px;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;letter-spacing:.3px}a:before,.tv-demo-links-item:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.1),transparent);transition:left .5s ease}a:hover:before,.tv-demo-links-item:hover:before{left:100%}a:active,.tv-demo-links-item:active{transform:translateY(1px)}.dark-mode .tv-demo-select{background-color:#b9c4df;color:#0e131f;border:1px solid #B9C4DF}.dark-mode .tv-demo-option{background:#b9c4df}.dark-mode .no-background{background-color:#0e131f;color:#b9c4df;box-shadow:0 0 10px #0e131f}.dark-mode .tv-demo-tabs button{background-color:#b9c4df;color:#000b14}.dark-mode .tv-demo-tabs button.active{background:#8598c7;font-weight:700}.dark-mode .tv-demo-tabs button:hover{background:#96a7cf}.dark-mode .tv-demo-links-item,.dark-mode a.tv-demo-links-item{color:#60a5fa;border-color:#3b82f680}.dark-mode .tv-demo-links-item:hover,.dark-mode a.tv-demo-links-item:hover{background:#3b82f640;border-color:#3b82f680;box-shadow:0 4px 16px #3b82f633;transform:translateY(-2px)}.light-mode .tv-demo-select{background-color:#0e131f;color:#b9c4df;border:1px solid #0E131F}.light-mode .tv-demo-option{background:#0e131f}.light-mode .no-background{background-color:#b9c4df;color:#0e131f;box-shadow:0 0 10px #b9c4df}.light-mode .tv-demo-tabs button{background-color:#0e131f;color:#f4faff}.light-mode .tv-demo-tabs button.active{background:#000;font-weight:700}.light-mode .tv-demo-tabs button:hover{background:#000}.light-mode .tv-demo-links-item,.light-mode a.tv-demo-links-item{color:#1e40af;border-color:#1e40af66}.light-mode .tv-demo-links-item:hover,.light-mode a.tv-demo-links-item:hover{background:#1e40af2e;border-color:#1e40af66;box-shadow:0 4px 16px #1e40af26;transform:translateY(-2px)}.tv-demo-body{margin:0 auto;min-height:100vh;width:80%}.tv-demo-body.dark-mode{background-color:#0e131f}.tv-demo-body.dark-mode .tv-demo-select{background-color:#b9c4df;color:#0e131f;border:1px solid #B9C4DF}.tv-demo-body.dark-mode .tv-demo-option{background:#b9c4df}.tv-demo-body.dark-mode .tv-demo-links-item{color:#b9c4df}.tv-demo-body.light-mode{background-color:#b9c4df}.tv-demo-body.light-mode .tv-demo-select{background-color:#0e131f;color:#b9c4df;border:1px solid #0E131F}.tv-demo-body.light-mode .tv-demo-option{background:#0e131f}.tv-demo-body.light-mode .tv-demo-links-item{color:#0e131f}.tv-demo-body .tv-demo-theme{display:flex;align-items:center;gap:10px;min-height:100%;padding:0 20px;width:100%}.tv-demo-body .tv-demo-links{display:flex;gap:12px;align-content:center;align-items:center;flex-wrap:wrap}.tv-demo-body .tv-demo-links a{color:inherit}.tv-demo-body .tv-demo-links>span{opacity:.3;font-weight:300}.tv-demo-body .tv-demo-header{padding:25px 0;display:flex;justify-content:space-between}.tv-demo-body .tv-demo-case{padding:0 40px 40px;position:relative}.tv-demo-body .tv-demo-case-demo .demo{margin-bottom:20px}.tv-demo-body .tv-demo-case-demo h3{font-size:1.4rem;padding-top:20px;font-family:Kanit,sans-serif;font-weight:600}.tv-demo-body .tv-demo-case-demo h1{font-size:2.5rem;font-weight:700;font-family:Kanit,sans-serif;background:linear-gradient(135deg,#3b82f6,#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tv-demo-body .tv-demo-case-demo h1 span{font-size:1rem;font-weight:300}.tv-demo-body .tv-demo-select{border-radius:8px;cursor:pointer;font-size:16px;height:44px;margin-bottom:20px;margin-top:10px;padding:0 16px;width:100%;border:2px solid transparent;transition:all .3s ease;font-weight:500;outline:none;box-shadow:0 2px 8px #0000001a}.tv-demo-body .tv-demo-select:hover{border-color:#3b82f64d;box-shadow:0 4px 12px #00000026}.tv-demo-body .tv-demo-select:focus{border-color:#3b82f680;box-shadow:0 0 0 3px #3b82f61a,0 4px 12px #00000026}.tv-demo-body .tv-demo-select-theme{width:150px}.tv-demo-body .tv-demo-option{font-size:16px}.tv-demo-body .tv-demo-component{align-items:center;display:flex;height:100%;justify-content:center;margin-top:5px;width:100%}.tv-demo-body .tv-demo-no-component{color:inherit;font-size:1.5rem;font-weight:500;text-align:center}.tv-demo-body .tv-demo-code{margin-top:5px;width:100%!important;height:auto!important;padding:20px 0}.tv-demo-footer{position:relative;padding:0;font-family:Lato,sans-serif;transition:all .3s ease;overflow:hidden}.tv-demo-footer:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(59,130,246,.5) 50%,transparent 100%)}.tv-demo-footer.dark-mode{background:linear-gradient(135deg,#111726,#0e131f,#13192a);color:#f4faff}.tv-demo-footer.dark-mode .tv-demo-footer-text,.tv-demo-footer.dark-mode .tv-demo-footer-copyright{color:#8eccff}.tv-demo-footer.dark-mode .tv-demo-footer-link{color:#3b82f6}.tv-demo-footer.dark-mode .tv-demo-footer-link:hover{color:#60a5fa;text-shadow:0 0 8px rgba(59,130,246,.3)}.tv-demo-footer.dark-mode .tv-demo-footer-brand-text{color:#f4faff;text-shadow:0 0 20px rgba(59,130,246,.3)}.tv-demo-footer.dark-mode .tv-demo-footer-divider{background:#ffffff1a}.tv-demo-footer.light-mode{background:linear-gradient(135deg,#cbd3e7,#b9c4df,#c4cde4);color:#000b14}.tv-demo-footer.light-mode .tv-demo-footer-text,.tv-demo-footer.light-mode .tv-demo-footer-copyright{color:#002747}.tv-demo-footer.light-mode .tv-demo-footer-link{color:#1e40af}.tv-demo-footer.light-mode .tv-demo-footer-link:hover{color:#3b82f6;text-shadow:0 0 8px rgba(30,64,175,.2)}.tv-demo-footer.light-mode .tv-demo-footer-brand-text{color:#000b14;text-shadow:0 0 20px rgba(30,64,175,.2)}.tv-demo-footer.light-mode .tv-demo-footer-divider{background:#0000001a}.tv-demo-footer-content{margin:0 auto;padding:40px 20px 20px}.tv-demo-footer-main{display:flex;flex-direction:column;align-items:center;gap:30px;margin-bottom:30px}.tv-demo-footer-brand{display:flex;align-items:center;gap:12px;font-family:Kanit,sans-serif;font-size:1.8rem;font-weight:700}.tv-demo-footer-logo{max-width:25px;animation:float 3s ease-in-out infinite;filter:drop-shadow(0 4px 8px rgba(59,130,246,.3))}.tv-demo-footer-logo img{width:100%}.tv-demo-footer-brand-text{letter-spacing:.5px;background:linear-gradient(135deg,#3b82f6,#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tv-demo-footer-brand-version{letter-spacing:.3px;font-size:1rem;-webkit-background-clip:text;background-clip:text}.tv-demo-footer-info{display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap}.tv-demo-footer-text{font-size:1rem;display:flex;align-items:center;gap:8px;margin:0;opacity:.85;transition:all .3s ease;font-weight:400}.tv-demo-footer-text:hover{opacity:1;transform:translateY(-2px)}.tv-demo-footer-divider{width:1px;height:20px;opacity:.3}.tv-demo-footer-link{text-decoration:none!important;font-weight:600!important;position:relative;transition:all .3s ease;padding:0 0 2px!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;transform:none!important;letter-spacing:normal!important;display:inline!important;gap:0!important;overflow:visible!important}.tv-demo-footer-link:before{display:none!important}.tv-demo-footer-link:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background:currentColor;transition:width .3s ease}.tv-demo-footer-link:hover{transform:none!important;box-shadow:none!important;background:transparent!important}.tv-demo-footer-link:hover:after{width:100%}.tv-demo-footer-heart{font-size:1.2rem;display:inline-block;animation:pulse 2s infinite ease-in-out;filter:drop-shadow(0 0 4px rgba(59,130,246,.4))}.tv-demo-footer-bottom{padding-top:20px;border-top:1px solid rgba(255,255,255,.05);text-align:center}.tv-demo-footer-copyright{font-size:.85rem;margin:0;opacity:.6;font-weight:300;letter-spacing:.3px}@keyframes float{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-5px) rotate(-2deg)}50%{transform:translateY(-10px) rotate(0)}75%{transform:translateY(-5px) rotate(2deg)}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.15);opacity:.8}}.switch{position:relative;display:inline-block;width:60px;height:32px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background:linear-gradient(135deg,#cbd5e1,#94a3b8);transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:inset 0 2px 4px #0000001a,0 2px 8px #00000026}.slider:before{position:absolute;content:"";height:24px;width:24px;left:4px;bottom:4px;background:linear-gradient(135deg,#fff,#f8fafc);transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 8px #0003,0 1px 3px #0000001a}input:checked+.slider{background:linear-gradient(135deg,#3b82f6,#2563eb);box-shadow:inset 0 2px 4px #0000001a,0 2px 12px #3b82f666}input:focus+.slider{box-shadow:inset 0 2px 4px #0000001a,0 0 0 3px #3b82f633,0 2px 8px #00000026}input:checked+.slider:before{transform:translate(28px);box-shadow:0 2px 8px #00000040,0 1px 3px #00000026}.slider:hover{box-shadow:inset 0 2px 4px #0000001a,0 4px 12px #0003}input:checked+.slider:hover{box-shadow:inset 0 2px 4px #0000001a,0 4px 16px #3b82f680}.slider.round{border-radius:32px}.slider.round:before{border-radius:50%}.tv-demo-layout{display:grid;grid-template-columns:320px 1fr;gap:20px;margin-top:20px;width:100%;max-width:100%}.tv-demo-sidebar{display:flex;flex-direction:column;border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.08);background:#00000040;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);height:100%}.tv-demo-sidebar.light-mode{border-color:#00000014;background:#fff9}.tv-demo-sidebar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.tv-demo-sidebar-header h3{margin:0;font-size:1.3rem}.tv-demo-sidebar-meta{font-size:.85rem;opacity:.7;margin-bottom:4px}.tv-demo-sidebar-collapse{background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:8px;cursor:pointer;font-size:.9rem;padding:6px 8px}.tv-demo-sidebar-collapse:hover{border-color:#fff9}.light-mode .tv-demo-sidebar-collapse{border-color:#00000026}.light-mode .tv-demo-sidebar-collapse:hover{border-color:#00000073}.tv-demo-search{display:flex;align-items:center;gap:8px;border-radius:999px;padding:6px 12px;border:1px solid rgba(255,255,255,.2);margin-bottom:16px;background:#ffffff0d}.tv-demo-search.light-mode{border-color:#0000001a;background:#00000008}.tv-demo-search-icon{font-size:.85rem}.tv-demo-search-input{background:transparent;border:none;flex:1;font-size:.9rem;outline:none;color:inherit}.tv-demo-search-clear{background:transparent;border:none;cursor:pointer;font-size:.85rem;opacity:.7}.tv-demo-variants{position:relative;flex:1;overflow:auto;border-radius:12px;padding:4px;border:1px solid rgba(255,255,255,.08);background:#ffffff05}.tv-demo-variants.light-mode{border-color:#00000014;background:#00000003}.tv-demo-variant-card{width:100%;display:flex;justify-content:space-between;gap:12px;border:none;background:#0000004d;color:inherit;padding:14px;border-radius:12px;text-align:left;cursor:pointer;margin-bottom:8px;transition:transform .2s ease,box-shadow .2s ease}.tv-demo-variant-card:hover{transform:translate(4px);box-shadow:0 10px 20px #0000004d}.tv-demo-variant-card.active{outline:2px solid rgba(59,130,246,.7);background:#3b82f626}.light-mode .tv-demo-variant-card{background:#fffc}.light-mode .tv-demo-variant-card.active{background:#3b82f61f}.tv-demo-variant-card-content{flex:1}.tv-demo-variant-card-title{display:block;font-weight:600;margin-bottom:4px}.tv-demo-variant-card-description{font-size:.85rem;opacity:.75}.tv-demo-variant-card-icon{opacity:.7}.tv-demo-empty-state{text-align:center;padding:20px;opacity:.8}.tv-demo-reset{margin-top:12px;padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:transparent;color:inherit;cursor:pointer}.tv-demo-empty-component,.tv-demo-empty-code{text-align:center;padding:20px;opacity:.8}@media(max-width:1024px){.tv-demo-layout{grid-template-columns:1fr}.tv-demo-sidebar{max-height:none}}@media(max-width:768px){.tv-demo-layout{grid-template-columns:1fr}}@media(max-width:768px){.tv-demo-case{padding:10px!important}.tv-demo-body{width:90%}.tv-demo-header{flex-direction:column;align-items:flex-start;gap:10px;padding:0}.tv-demo-header .tv-demo-theme{width:100%;padding-left:0;padding-right:0}.tv-demo-header .tv-demo-select-theme{width:100%}.tv-demo-footer-content{padding:30px 15px 15px}.tv-demo-footer-brand{font-size:1.5rem;gap:10px}.tv-demo-footer-logo{font-size:2rem}.tv-demo-footer-info{gap:15px;flex-direction:column;text-align:center}.tv-demo-footer-text{font-size:.9rem}.tv-demo-footer-divider{display:none}}@media(max-width:640px){.tv-demo-case{padding:15px!important}.tv-demo-body{width:100%;border-radius:0}.tv-demo-content{padding:15px;border-radius:0 8px 8px}.tv-demo-content .tv-demo-component-content{padding:15px;margin:15px auto}.tv-demo-tabs{gap:4px}.tv-demo-tabs button{padding:8px 12px;font-size:.85rem}.tv-demo-footer-brand{font-size:1.3rem}.tv-demo-footer-logo{max-width:18px}.tv-demo-footer-text{font-size:.85rem;gap:6px}.tv-demo-footer-copyright{font-size:.75rem}.tv-demo-footer-brand-version{font-size:.85rem}a,.tv-demo-links-item{padding:5px 10px;font-size:.85rem;gap:4px}.markdown-body{padding:20px 15px;font-size:14px}.markdown-body h1{font-size:1.8rem}.markdown-body h2{font-size:1.5rem}.markdown-body h3{font-size:1.2rem}}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{background:#272822;color:#ddd}.hljs-tag,.hljs-keyword,.hljs-selector-tag,.hljs-literal,.hljs-strong,.hljs-number,.hljs-name{color:#f92672}.hljs-code{color:#66d9ef}.hljs-attribute,.hljs-attr,.hljs-symbol,.hljs-regexp,.hljs-link{color:#bf79db}.hljs-string,.hljs-bullet,.hljs-subst,.hljs-title,.hljs-section,.hljs-emphasis,.hljs-type,.hljs-built_in,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-addition,.hljs-variable,.hljs-template-tag,.hljs-template-variable{color:#a6e22e}.hljs-title.class_,.hljs-class .hljs-title{color:#fff}.hljs-comment,.hljs-quote,.hljs-deletion,.hljs-meta{color:#75715e}.hljs-keyword,.hljs-selector-tag,.hljs-literal,.hljs-doctag,.hljs-title,.hljs-section,.hljs-type,.hljs-selector-id{font-weight:700}.cb[data-v-3c0bc7c1]{position:absolute;cursor:pointer;transition:.3s opacity linear;opacity:.5;height:30px;width:80px;right:0}.cb:hover .cb_tooltip[data-v-3c0bc7c1]{display:block}.cb[data-v-3c0bc7c1]:hover{opacity:1}.cb_tooltip[data-v-3c0bc7c1]{font-family:sans-serif;display:none;position:absolute;left:-96px;font-size:12px;color:#fff;width:80px;height:30px;line-height:30px;background:#000c;box-sizing:border-box;text-align:center;border-radius:4px}.cb_copy[data-v-3c0bc7c1]{position:absolute;font-family:sans-serif;display:block;font-size:12px;color:#fff;width:80px;height:30px;line-height:30px;background:#000c;box-sizing:border-box;text-align:center;border-radius:4px}.cb textarea[data-v-3c0bc7c1]{-webkit-user-select:none;user-select:none;position:absolute;padding:0;width:0;height:0;background:transparent;resize:none;opacity:0;border-color:#0000}.TL[data-v-b98f7724]{display:flex;align-items:center;justify-content:center;width:40px;height:30px;position:relative}.TL_word[data-v-b98f7724]{width:20px;height:20px;text-align:center;color:#aaa;font-size:16px}.code[data-v-f4a493be]{display:flex;flex-direction:column;font-size:0;position:relative;text-align:left;overflow:hidden}.code_header[data-v-f4a493be]{min-height:14px;position:relative}.code_area[data-v-f4a493be]{position:relative;overflow:hidden;padding-left:20px;margin:auto 0;display:flex}.code_area textarea[data-v-f4a493be]{overflow-y:hidden;box-sizing:border-box;caret-color:#7f7f7f;-webkit-text-fill-color:transparent;white-space:pre;word-wrap:normal;border:0;position:absolute;z-index:1000;top:0;left:0;width:100%;height:100%;background:none;border:none;outline:none;resize:none;padding:0 20px 20px;line-height:1.3;overflow:overlay;font-family:Consolas,Monaco,monospace}.code_area textarea[data-v-f4a493be]::-webkit-scrollbar-track{background-color:#eee}.code_area textarea[data-v-f4a493be]::-webkit-scrollbar-thumb{background:#afabab}.code_area textarea[data-v-f4a493be]::-webkit-scrollbar{width:8px;height:8px}.code_area textarea[data-v-f4a493be]::-webkit-scrollbar-corner{background-color:#eee}.code_area_link[data-v-f4a493be]{position:absolute}.code_area.change_hight[data-v-f4a493be]{height:calc(100% - 30px)}.code_area.srollbar_style[data-v-f4a493be]::-webkit-scrollbar-track{background-color:#eee}.code_area.srollbar_style[data-v-f4a493be]::-webkit-scrollbar-thumb{background:#afabab}.code_area.srollbar_style[data-v-f4a493be]::-webkit-scrollbar{width:8px;height:8px}.code_area.srollbar_style[data-v-f4a493be]::-webkit-scrollbar-corner{background-color:#eee}.code_area pre[data-v-f4a493be]{position:relative;margin:0;height:100%;overflow:hidden}.code_header[data-v-f4a493be]{position:relative;display:flex;justify-content:flex-start;width:100%}.code pre code[data-v-f4a493be]{font-family:Consolas,Monaco,monospace;line-height:1.3;position:relative;overflow-x:visible;border-radius:0;box-sizing:border-box;display:block;border:none;margin:0}.wrapper-content[data-v-f4a493be]::-webkit-scrollbar-track{background-color:#eee;border-radius:5px}.wrapper-content[data-v-f4a493be]::-webkit-scrollbar-thumb{background:#afabab;border-radius:5px}.wrapper-content[data-v-f4a493be]::-webkit-scrollbar{width:6px}.code_area_lines[data-v-f4a493be]{display:flex;flex-direction:column;width:10px;align-items:center;position:absolute;transform:translate(-18px)}.code_area_lines_item[data-v-f4a493be]{height:24px;width:10px;font-size:12px;color:#adb5bd;text-align:center;display:flex;justify-content:center;align-items:center;opacity:.6}.code_area_lines_item.dark[data-v-f4a493be]{color:#adb5bd}.code_area_lines_item.light[data-v-f4a493be]{color:#212529}.atom_one_dark.hljs,.atom_one_dark .hljs{color:#abb2bf;background:#282c34}.atom_one_dark .hljs-comment,.atom_one_dark .hljs-quote{color:#5c6370;font-style:italic}.atom_one_dark .hljs-doctag,.atom_one_dark .hljs-keyword,.atom_one_dark .hljs-formula{color:#c678dd}.atom_one_dark .hljs-section,.atom_one_dark .hljs-name,.atom_one_dark .hljs-selector-tag,.atom_one_dark .hljs-deletion,.atom_one_dark .hljs-subst{color:#e06c75}.atom_one_dark .hljs-literal{color:#56b6c2}.atom_one_dark .hljs-string,.atom_one_dark .hljs-regexp,.atom_one_dark .hljs-addition,.atom_one_dark .hljs-attribute,.atom_one_dark .hljs-meta .hljs-string{color:#98c379}.atom_one_dark .hljs-attr,.atom_one_dark .hljs-variable,.atom_one_dark .hljs-template-variable,.atom_one_dark .hljs-type,.atom_one_dark .hljs-selector-class,.atom_one_dark .hljs-selector-attr,.atom_one_dark .hljs-selector-pseudo,.atom_one_dark .hljs-number{color:#d19a66}.atom_one_dark .hljs-symbol,.atom_one_dark .hljs-bullet,.atom_one_dark .hljs-link,.atom_one_dark .hljs-meta,.atom_one_dark .hljs-selector-id,.atom_one_dark .hljs-title{color:#61aeee}.atom_one_dark .hljs-built_in,.atom_one_dark .hljs-title .class_,.atom_one_dark .hljs-class .hljs-title{color:#e6c07b}.atom_one_dark .hljs-emphasis{font-style:italic}.atom_one_dark .hljs-strong{font-weight:700}.atom_one_dark .hljs-link{text-decoration:underline}.atom_one_light.hljs,.atom_one_light .hljs{color:#383a42;background:#edf2f4}.atom_one_light .hljs-comment,.atom_one_light .hljs-quote{color:#a0a1a7;font-style:italic}.atom_one_light .hljs-doctag,.atom_one_light .hljs-keyword,.atom_one_light .hljs-formula{color:#a626a4}.atom_one_light .hljs-section,.atom_one_light .hljs-name,.atom_one_light .hljs-selector-tag,.atom_one_light .hljs-deletion,.atom_one_light .hljs-subst{color:#e45649}.atom_one_light .hljs-literal{color:#0184bb}.atom_one_light .hljs-string,.atom_one_light .hljs-regexp,.atom_one_light .hljs-addition,.atom_one_light .hljs-attribute,.atom_one_light .hljs-meta .hljs-string{color:#50a14f}.atom_one_light .hljs-attr,.atom_one_light .hljs-variable,.atom_one_light .hljs-template-variable,.atom_one_light .hljs-type,.atom_one_light .hljs-selector-class,.atom_one_light .hljs-selector-attr,.atom_one_light .hljs-selector-pseudo,.atom_one_light .hljs-number{color:#986801}.atom_one_light .hljs-symbol,.atom_one_light .hljs-bullet,.atom_one_light .hljs-link,.atom_one_light .hljs-meta,.atom_one_light .hljs-selector-id,.atom_one_light .hljs-title{color:#4078f2}.atom_one_light .hljs-built_in,.atom_one_light .hljs-title .class_,.atom_one_light .hljs-class .hljs-title{color:#c18401}.atom_one_light .hljs-emphasis{font-style:italic}.atom_one_light .hljs-strong{font-weight:700}.atom_one_light .hljs-link{text-decoration:underline}@keyframes slideInRight-84ed156b{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOutRight-84ed156b{0%{transform:translate(0);opacity:1}to{transform:translate(400px);opacity:0}}.toast-notification[data-v-84ed156b]{display:flex;align-items:center;gap:12px;min-width:320px;max-width:450px;padding:14px 16px;margin-bottom:12px;border-radius:12px;box-shadow:0 10px 30px #0003,0 0 0 1px #ffffff1a;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(135deg,#1e1e1ef2,#141414f2);border:1px solid rgba(255,255,255,.08);opacity:0;transform:translate(400px);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.toast-notification[data-v-84ed156b]:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:currentColor}.toast-notification.visible[data-v-84ed156b]{animation:slideInRight-84ed156b .3s ease-out forwards}.toast-notification.leaving[data-v-84ed156b]{animation:slideOutRight-84ed156b .3s ease-in forwards}.toast-notification.success[data-v-84ed156b]:before{background:#22c55e}.toast-notification.error[data-v-84ed156b]:before{background:#ef4444}.toast-notification.warning[data-v-84ed156b]:before{background:#f59e0b}.toast-notification.info[data-v-84ed156b]:before{background:#3b82f6}.toast-icon[data-v-84ed156b]{display:flex;align-items:center;justify-content:center;min-width:28px;width:28px;height:28px;border-radius:50%;font-weight:700;font-size:14px;flex-shrink:0}.toast-content[data-v-84ed156b]{flex:1;min-width:0}.toast-message[data-v-84ed156b]{margin:0;font-size:14px;font-weight:500;color:#fff;line-height:1.4;word-wrap:break-word;overflow-wrap:break-word}.toast-close[data-v-84ed156b]{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;background:#ffffff1a;color:#fff9;border-radius:6px;cursor:pointer;font-size:12px;font-weight:700;transition:all .2s ease;flex-shrink:0}.toast-close[data-v-84ed156b]:hover{background:#ffffff26;color:#ffffffe6;transform:scale(1.1)}.toast-close[data-v-84ed156b]:active{transform:scale(.95)}.light-mode .toast-notification[data-v-84ed156b]{background:linear-gradient(135deg,#fffffffa,#f5f5f5fa);border:1px solid rgba(0,0,0,.08);box-shadow:0 10px 30px #00000026,0 0 0 1px #0000000d}.light-mode .toast-notification .toast-message[data-v-84ed156b]{color:#1f2937}.light-mode .toast-notification .toast-close[data-v-84ed156b]{background:#0000000d;color:#00000080}.light-mode .toast-notification .toast-close[data-v-84ed156b]:hover{background:#0000001a;color:#000c}.toast-container[data-v-25add11c]{position:fixed;top:20px;right:20px;z-index:9999;display:flex;flex-direction:column;pointer-events:none}.toast-container[data-v-25add11c]>*{pointer-events:auto}@media(max-width:640px){.toast-container[data-v-25add11c]{top:10px;right:10px;left:10px;align-items:center}}
+@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=Kanit:wght@600&family=Lato:wght@300&display=swap";.markdown-body{--base-size-4: .25rem;--base-size-8: .5rem;--base-size-16: 1rem;--base-size-24: 1.5rem;--base-size-40: 2.5rem;--base-text-weight-normal: 400;--base-text-weight-medium: 500;--base-text-weight-semibold: 600;--fontStack-monospace: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;--fgColor-accent: Highlight}@media(prefers-color-scheme:dark){.markdown-body,[data-theme=dark]{color-scheme:dark;--focus-outlineColor: #1f6feb;--fgColor-default: #f0f6fc;--fgColor-muted: #9198a1;--fgColor-accent: #4493f8;--fgColor-success: #3fb950;--fgColor-attention: #d29922;--fgColor-danger: #f85149;--fgColor-done: #ab7df8;--bgColor-default: #0d1117;--bgColor-muted: #151b23;--bgColor-neutral-muted: #656c7633;--bgColor-attention-muted: #bb800926;--borderColor-default: #3d444d;--borderColor-muted: #3d444db3;--borderColor-neutral-muted: #3d444db3;--borderColor-accent-emphasis: #1f6feb;--borderColor-success-emphasis: #238636;--borderColor-attention-emphasis: #9e6a03;--borderColor-danger-emphasis: #da3633;--borderColor-done-emphasis: #8957e5;--color-prettylights-syntax-comment: #9198a1;--color-prettylights-syntax-constant: #79c0ff;--color-prettylights-syntax-constant-other-reference-link: #a5d6ff;--color-prettylights-syntax-entity: #d2a8ff;--color-prettylights-syntax-storage-modifier-import: #f0f6fc;--color-prettylights-syntax-entity-tag: #7ee787;--color-prettylights-syntax-keyword: #ff7b72;--color-prettylights-syntax-string: #a5d6ff;--color-prettylights-syntax-variable: #ffa657;--color-prettylights-syntax-brackethighlighter-unmatched: #f85149;--color-prettylights-syntax-brackethighlighter-angle: #9198a1;--color-prettylights-syntax-invalid-illegal-text: #f0f6fc;--color-prettylights-syntax-invalid-illegal-bg: #8e1519;--color-prettylights-syntax-carriage-return-text: #f0f6fc;--color-prettylights-syntax-carriage-return-bg: #b62324;--color-prettylights-syntax-string-regexp: #7ee787;--color-prettylights-syntax-markup-list: #f2cc60;--color-prettylights-syntax-markup-heading: #1f6feb;--color-prettylights-syntax-markup-italic: #f0f6fc;--color-prettylights-syntax-markup-bold: #f0f6fc;--color-prettylights-syntax-markup-deleted-text: #ffdcd7;--color-prettylights-syntax-markup-deleted-bg: #67060c;--color-prettylights-syntax-markup-inserted-text: #aff5b4;--color-prettylights-syntax-markup-inserted-bg: #033a16;--color-prettylights-syntax-markup-changed-text: #ffdfb6;--color-prettylights-syntax-markup-changed-bg: #5a1e02;--color-prettylights-syntax-markup-ignored-text: #f0f6fc;--color-prettylights-syntax-markup-ignored-bg: #1158c7;--color-prettylights-syntax-meta-diff-range: #d2a8ff;--color-prettylights-syntax-sublimelinter-gutter-mark: #3d444d}}@media(prefers-color-scheme:light){.markdown-body,[data-theme=light]{color-scheme:light;--focus-outlineColor: #0969da;--fgColor-default: #1f2328;--fgColor-muted: #59636e;--fgColor-accent: #0969da;--fgColor-success: #1a7f37;--fgColor-attention: #9a6700;--fgColor-danger: #d1242f;--fgColor-done: #8250df;--bgColor-default: #ffffff;--bgColor-muted: #f6f8fa;--bgColor-neutral-muted: #818b981f;--bgColor-attention-muted: #fff8c5;--borderColor-default: #d1d9e0;--borderColor-muted: #d1d9e0b3;--borderColor-neutral-muted: #d1d9e0b3;--borderColor-accent-emphasis: #0969da;--borderColor-success-emphasis: #1a7f37;--borderColor-attention-emphasis: #9a6700;--borderColor-danger-emphasis: #cf222e;--borderColor-done-emphasis: #8250df;--color-prettylights-syntax-comment: #59636e;--color-prettylights-syntax-constant: #0550ae;--color-prettylights-syntax-constant-other-reference-link: #0a3069;--color-prettylights-syntax-entity: #6639ba;--color-prettylights-syntax-storage-modifier-import: #1f2328;--color-prettylights-syntax-entity-tag: #0550ae;--color-prettylights-syntax-keyword: #cf222e;--color-prettylights-syntax-string: #0a3069;--color-prettylights-syntax-variable: #953800;--color-prettylights-syntax-brackethighlighter-unmatched: #82071e;--color-prettylights-syntax-brackethighlighter-angle: #59636e;--color-prettylights-syntax-invalid-illegal-text: #f6f8fa;--color-prettylights-syntax-invalid-illegal-bg: #82071e;--color-prettylights-syntax-carriage-return-text: #f6f8fa;--color-prettylights-syntax-carriage-return-bg: #cf222e;--color-prettylights-syntax-string-regexp: #116329;--color-prettylights-syntax-markup-list: #3b2300;--color-prettylights-syntax-markup-heading: #0550ae;--color-prettylights-syntax-markup-italic: #1f2328;--color-prettylights-syntax-markup-bold: #1f2328;--color-prettylights-syntax-markup-deleted-text: #82071e;--color-prettylights-syntax-markup-deleted-bg: #ffebe9;--color-prettylights-syntax-markup-inserted-text: #116329;--color-prettylights-syntax-markup-inserted-bg: #dafbe1;--color-prettylights-syntax-markup-changed-text: #953800;--color-prettylights-syntax-markup-changed-bg: #ffd8b5;--color-prettylights-syntax-markup-ignored-text: #d1d9e0;--color-prettylights-syntax-markup-ignored-bg: #0550ae;--color-prettylights-syntax-meta-diff-range: #8250df;--color-prettylights-syntax-sublimelinter-gutter-mark: #818b98}}.markdown-body{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;margin:0;color:var(--fgColor-default);background-color:var(--bgColor-default);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Noto Sans,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji";font-size:16px;line-height:1.5;word-wrap:break-word}.markdown-body .octicon{display:inline-block;fill:currentColor;vertical-align:text-bottom}.markdown-body h1:hover .anchor .octicon-link:before,.markdown-body h2:hover .anchor .octicon-link:before,.markdown-body h3:hover .anchor .octicon-link:before,.markdown-body h4:hover .anchor .octicon-link:before,.markdown-body h5:hover .anchor .octicon-link:before,.markdown-body h6:hover .anchor .octicon-link:before{width:16px;height:16px;content:" ";display:inline-block;background-color:currentColor;-webkit-mask-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>");mask-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' version='1.1' aria-hidden='true'><path fill-rule='evenodd' d='M7.775 3.275a.75.75 0 001.06 1.06l1.25-1.25a2 2 0 112.83 2.83l-2.5 2.5a2 2 0 01-2.83 0 .75.75 0 00-1.06 1.06 3.5 3.5 0 004.95 0l2.5-2.5a3.5 3.5 0 00-4.95-4.95l-1.25 1.25zm-4.69 9.64a2 2 0 010-2.83l2.5-2.5a2 2 0 012.83 0 .75.75 0 001.06-1.06 3.5 3.5 0 00-4.95 0l-2.5 2.5a3.5 3.5 0 004.95 4.95l1.25-1.25a.75.75 0 00-1.06-1.06l-1.25 1.25a2 2 0 01-2.83 0z'></path></svg>")}.markdown-body details,.markdown-body figcaption,.markdown-body figure{display:block}.markdown-body summary{display:list-item}.markdown-body [hidden]{display:none!important}.markdown-body a{background-color:transparent;color:var(--fgColor-accent);text-decoration:none}.markdown-body abbr[title]{border-bottom:none;-webkit-text-decoration:underline dotted;text-decoration:underline dotted}.markdown-body b,.markdown-body strong{font-weight:var(--base-text-weight-semibold, 600)}.markdown-body dfn{font-style:italic}.markdown-body h1{margin:.67em 0;font-weight:var(--base-text-weight-semibold, 600);padding-bottom:.3em;font-size:2em;border-bottom:1px solid var(--borderColor-muted)}.markdown-body mark{background-color:var(--bgColor-attention-muted);color:var(--fgColor-default)}.markdown-body small{font-size:90%}.markdown-body sub,.markdown-body sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}.markdown-body sub{bottom:-.25em}.markdown-body sup{top:-.5em}.markdown-body img{border-style:none;max-width:100%;box-sizing:content-box}.markdown-body code,.markdown-body kbd,.markdown-body pre,.markdown-body samp{font-family:monospace;font-size:1em}.markdown-body figure{margin:1em var(--base-size-40)}.markdown-body hr{box-sizing:content-box;overflow:hidden;background:transparent;border-bottom:1px solid var(--borderColor-muted);height:.25em;padding:0;margin:var(--base-size-24) 0;background-color:var(--borderColor-default);border:0}.markdown-body input{font:inherit;margin:0;overflow:visible;font-family:inherit;font-size:inherit;line-height:inherit}.markdown-body [type=button],.markdown-body [type=reset],.markdown-body [type=submit]{-webkit-appearance:button;appearance:button}.markdown-body [type=checkbox],.markdown-body [type=radio]{box-sizing:border-box;padding:0}.markdown-body [type=number]::-webkit-inner-spin-button,.markdown-body [type=number]::-webkit-outer-spin-button{height:auto}.markdown-body [type=search]::-webkit-search-cancel-button,.markdown-body [type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}.markdown-body ::-webkit-input-placeholder{color:inherit;opacity:.54}.markdown-body ::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}.markdown-body a:hover{text-decoration:underline}.markdown-body ::placeholder{color:var(--fgColor-muted);opacity:1}.markdown-body hr:before{display:table;content:""}.markdown-body hr:after{display:table;clear:both;content:""}.markdown-body table{border-spacing:0;border-collapse:collapse;display:block;width:max-content;max-width:100%;overflow:auto;font-variant:tabular-nums}.markdown-body td,.markdown-body th{padding:0}.markdown-body details summary{cursor:pointer}.markdown-body a:focus,.markdown-body [role=button]:focus,.markdown-body input[type=radio]:focus,.markdown-body input[type=checkbox]:focus{outline:2px solid var(--focus-outlineColor);outline-offset:-2px;box-shadow:none}.markdown-body a:focus:not(:focus-visible),.markdown-body [role=button]:focus:not(:focus-visible),.markdown-body input[type=radio]:focus:not(:focus-visible),.markdown-body input[type=checkbox]:focus:not(:focus-visible){outline:solid 1px transparent}.markdown-body a:focus-visible,.markdown-body [role=button]:focus-visible,.markdown-body input[type=radio]:focus-visible,.markdown-body input[type=checkbox]:focus-visible{outline:2px solid var(--focus-outlineColor);outline-offset:-2px;box-shadow:none}.markdown-body a:not([class]):focus,.markdown-body a:not([class]):focus-visible,.markdown-body input[type=radio]:focus,.markdown-body input[type=radio]:focus-visible,.markdown-body input[type=checkbox]:focus,.markdown-body input[type=checkbox]:focus-visible{outline-offset:0}.markdown-body kbd{display:inline-block;padding:var(--base-size-4);font:11px var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);line-height:10px;color:var(--fgColor-default);vertical-align:middle;background-color:var(--bgColor-muted);border:solid 1px var(--borderColor-neutral-muted);border-bottom-color:var(--borderColor-neutral-muted);border-radius:6px;box-shadow:inset 0 -1px 0 var(--borderColor-neutral-muted)}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4,.markdown-body h5,.markdown-body h6{margin-top:var(--base-size-24);margin-bottom:var(--base-size-16);font-weight:var(--base-text-weight-semibold, 600);line-height:1.25}.markdown-body h2{font-weight:var(--base-text-weight-semibold, 600);padding-bottom:.3em;font-size:1.5em;border-bottom:1px solid var(--borderColor-muted)}.markdown-body h3{font-weight:var(--base-text-weight-semibold, 600);font-size:1.25em}.markdown-body h4{font-weight:var(--base-text-weight-semibold, 600);font-size:1em}.markdown-body h5{font-weight:var(--base-text-weight-semibold, 600);font-size:.875em}.markdown-body h6{font-weight:var(--base-text-weight-semibold, 600);font-size:.85em;color:var(--fgColor-muted)}.markdown-body p{margin-top:0;margin-bottom:10px}.markdown-body blockquote{margin:0;padding:0 1em;color:var(--fgColor-muted);border-left:.25em solid var(--borderColor-default)}.markdown-body ul,.markdown-body ol{margin-top:0;margin-bottom:0;padding-left:2em}.markdown-body ol ol,.markdown-body ul ol{list-style-type:lower-roman}.markdown-body ul ul ol,.markdown-body ul ol ol,.markdown-body ol ul ol,.markdown-body ol ol ol{list-style-type:lower-alpha}.markdown-body dd{margin-left:0}.markdown-body tt,.markdown-body code,.markdown-body samp{font-family:var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);font-size:12px}.markdown-body pre{margin-top:0;margin-bottom:0;font-family:var(--fontStack-monospace, ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace);font-size:12px;word-wrap:normal}.markdown-body .octicon{display:inline-block;overflow:visible!important;vertical-align:text-bottom;fill:currentColor}.markdown-body input::-webkit-outer-spin-button,.markdown-body input::-webkit-inner-spin-button{margin:0;appearance:none}.markdown-body .mr-2{margin-right:var(--base-size-8, 8px)!important}.markdown-body:before{display:table;content:""}.markdown-body:after{display:table;clear:both;content:""}.markdown-body>*:first-child{margin-top:0!important}.markdown-body>*:last-child{margin-bottom:0!important}.markdown-body a:not([href]){color:inherit;text-decoration:none}.markdown-body .absent{color:var(--fgColor-danger)}.markdown-body .anchor{float:left;padding-right:var(--base-size-4);margin-left:-20px;line-height:1}.markdown-body .anchor:focus{outline:none}.markdown-body p,.markdown-body blockquote,.markdown-body ul,.markdown-body ol,.markdown-body dl,.markdown-body table,.markdown-body pre,.markdown-body details{margin-top:0;margin-bottom:var(--base-size-16)}.markdown-body blockquote>:first-child{margin-top:0}.markdown-body blockquote>:last-child{margin-bottom:0}.markdown-body h1 .octicon-link,.markdown-body h2 .octicon-link,.markdown-body h3 .octicon-link,.markdown-body h4 .octicon-link,.markdown-body h5 .octicon-link,.markdown-body h6 .octicon-link{color:var(--fgColor-default);vertical-align:middle;visibility:hidden}.markdown-body h1:hover .anchor,.markdown-body h2:hover .anchor,.markdown-body h3:hover .anchor,.markdown-body h4:hover .anchor,.markdown-body h5:hover .anchor,.markdown-body h6:hover .anchor{text-decoration:none}.markdown-body h1:hover .anchor .octicon-link,.markdown-body h2:hover .anchor .octicon-link,.markdown-body h3:hover .anchor .octicon-link,.markdown-body h4:hover .anchor .octicon-link,.markdown-body h5:hover .anchor .octicon-link,.markdown-body h6:hover .anchor .octicon-link{visibility:visible}.markdown-body h1 tt,.markdown-body h1 code,.markdown-body h2 tt,.markdown-body h2 code,.markdown-body h3 tt,.markdown-body h3 code,.markdown-body h4 tt,.markdown-body h4 code,.markdown-body h5 tt,.markdown-body h5 code,.markdown-body h6 tt,.markdown-body h6 code{padding:0 .2em;font-size:inherit}.markdown-body summary h1,.markdown-body summary h2,.markdown-body summary h3,.markdown-body summary h4,.markdown-body summary h5,.markdown-body summary h6{display:inline-block}.markdown-body summary h1 .anchor,.markdown-body summary h2 .anchor,.markdown-body summary h3 .anchor,.markdown-body summary h4 .anchor,.markdown-body summary h5 .anchor,.markdown-body summary h6 .anchor{margin-left:-40px}.markdown-body summary h1,.markdown-body summary h2{padding-bottom:0;border-bottom:0}.markdown-body ul.no-list,.markdown-body ol.no-list{padding:0;list-style-type:none}.markdown-body ol[type="a s"]{list-style-type:lower-alpha}.markdown-body ol[type="A s"]{list-style-type:upper-alpha}.markdown-body ol[type="i s"]{list-style-type:lower-roman}.markdown-body ol[type="I s"]{list-style-type:upper-roman}.markdown-body ol[type="1"]{list-style-type:decimal}.markdown-body div>ol:not([type]){list-style-type:decimal}.markdown-body ul ul,.markdown-body ul ol,.markdown-body ol ol,.markdown-body ol ul{margin-top:0;margin-bottom:0}.markdown-body li>p{margin-top:var(--base-size-16)}.markdown-body li+li{margin-top:.25em}.markdown-body dl{padding:0}.markdown-body dl dt{padding:0;margin-top:var(--base-size-16);font-size:1em;font-style:italic;font-weight:var(--base-text-weight-semibold, 600)}.markdown-body dl dd{padding:0 var(--base-size-16);margin-bottom:var(--base-size-16)}.markdown-body table th{font-weight:var(--base-text-weight-semibold, 600)}.markdown-body table th,.markdown-body table td{padding:6px 13px;border:1px solid var(--borderColor-default)}.markdown-body table td>:last-child{margin-bottom:0}.markdown-body table tr{background-color:var(--bgColor-default);border-top:1px solid var(--borderColor-muted)}.markdown-body table tr:nth-child(2n){background-color:var(--bgColor-muted)}.markdown-body table img{background-color:transparent}.markdown-body img[align=right]{padding-left:20px}.markdown-body img[align=left]{padding-right:20px}.markdown-body .emoji{max-width:none;vertical-align:text-top;background-color:transparent}.markdown-body span.frame{display:block;overflow:hidden}.markdown-body span.frame>span{display:block;float:left;width:auto;padding:7px;margin:13px 0 0;overflow:hidden;border:1px solid var(--borderColor-default)}.markdown-body span.frame span img{display:block;float:left}.markdown-body span.frame span span{display:block;padding:5px 0 0;clear:both;color:var(--fgColor-default)}.markdown-body span.align-center{display:block;overflow:hidden;clear:both}.markdown-body span.align-center>span{display:block;margin:13px auto 0;overflow:hidden;text-align:center}.markdown-body span.align-center span img{margin:0 auto;text-align:center}.markdown-body span.align-right{display:block;overflow:hidden;clear:both}.markdown-body span.align-right>span{display:block;margin:13px 0 0;overflow:hidden;text-align:right}.markdown-body span.align-right span img{margin:0;text-align:right}.markdown-body span.float-left{display:block;float:left;margin-right:13px;overflow:hidden}.markdown-body span.float-left span{margin:13px 0 0}.markdown-body span.float-right{display:block;float:right;margin-left:13px;overflow:hidden}.markdown-body span.float-right>span{display:block;margin:13px auto 0;overflow:hidden;text-align:right}.markdown-body code,.markdown-body tt{padding:.2em .4em;margin:0;font-size:85%;white-space:break-spaces;background-color:var(--bgColor-neutral-muted);border-radius:6px}.markdown-body code br,.markdown-body tt br{display:none}.markdown-body del code{text-decoration:inherit}.markdown-body samp{font-size:85%}.markdown-body pre code{font-size:100%}.markdown-body pre>code{padding:0;margin:0;word-break:normal;white-space:pre;background:transparent;border:0}.markdown-body .highlight{margin-bottom:var(--base-size-16)}.markdown-body .highlight pre{margin-bottom:0;word-break:normal}.markdown-body .highlight pre,.markdown-body pre{padding:var(--base-size-16);overflow:auto;font-size:85%;line-height:1.45;color:var(--fgColor-default);background-color:var(--bgColor-muted);border-radius:6px}.markdown-body pre code,.markdown-body pre tt{display:inline;max-width:auto;padding:0;margin:0;overflow:visible;line-height:inherit;word-wrap:normal;background-color:transparent;border:0}.markdown-body .csv-data td,.markdown-body .csv-data th{padding:5px;overflow:hidden;font-size:12px;line-height:1;text-align:left;white-space:nowrap}.markdown-body .csv-data .blob-num{padding:10px var(--base-size-8) 9px;text-align:right;background:var(--bgColor-default);border:0}.markdown-body .csv-data tr{border-top:0}.markdown-body .csv-data th{font-weight:var(--base-text-weight-semibold, 600);background:var(--bgColor-muted);border-top:0}.markdown-body [data-footnote-ref]:before{content:"["}.markdown-body [data-footnote-ref]:after{content:"]"}.markdown-body .footnotes{font-size:12px;color:var(--fgColor-muted);border-top:1px solid var(--borderColor-default)}.markdown-body .footnotes ol{padding-left:var(--base-size-16)}.markdown-body .footnotes ol ul{display:inline-block;padding-left:var(--base-size-16);margin-top:var(--base-size-16)}.markdown-body .footnotes li{position:relative}.markdown-body .footnotes li:target:before{position:absolute;top:calc(var(--base-size-8)*-1);right:calc(var(--base-size-8)*-1);bottom:calc(var(--base-size-8)*-1);left:calc(var(--base-size-24)*-1);pointer-events:none;content:"";border:2px solid var(--borderColor-accent-emphasis);border-radius:6px}.markdown-body .footnotes li:target{color:var(--fgColor-default)}.markdown-body .footnotes .data-footnote-backref g-emoji{font-family:monospace}.markdown-body body:has(:modal){padding-right:var(--dialog-scrollgutter)!important}.markdown-body .pl-c{color:var(--color-prettylights-syntax-comment)}.markdown-body .pl-c1,.markdown-body .pl-s .pl-v{color:var(--color-prettylights-syntax-constant)}.markdown-body .pl-e,.markdown-body .pl-en{color:var(--color-prettylights-syntax-entity)}.markdown-body .pl-smi,.markdown-body .pl-s .pl-s1{color:var(--color-prettylights-syntax-storage-modifier-import)}.markdown-body .pl-ent{color:var(--color-prettylights-syntax-entity-tag)}.markdown-body .pl-k{color:var(--color-prettylights-syntax-keyword)}.markdown-body .pl-s,.markdown-body .pl-pds,.markdown-body .pl-s .pl-pse .pl-s1,.markdown-body .pl-sr,.markdown-body .pl-sr .pl-cce,.markdown-body .pl-sr .pl-sre,.markdown-body .pl-sr .pl-sra{color:var(--color-prettylights-syntax-string)}.markdown-body .pl-v,.markdown-body .pl-smw{color:var(--color-prettylights-syntax-variable)}.markdown-body .pl-bu{color:var(--color-prettylights-syntax-brackethighlighter-unmatched)}.markdown-body .pl-ii{color:var(--color-prettylights-syntax-invalid-illegal-text);background-color:var(--color-prettylights-syntax-invalid-illegal-bg)}.markdown-body .pl-c2{color:var(--color-prettylights-syntax-carriage-return-text);background-color:var(--color-prettylights-syntax-carriage-return-bg)}.markdown-body .pl-sr .pl-cce{font-weight:700;color:var(--color-prettylights-syntax-string-regexp)}.markdown-body .pl-ml{color:var(--color-prettylights-syntax-markup-list)}.markdown-body .pl-mh,.markdown-body .pl-mh .pl-en,.markdown-body .pl-ms{font-weight:700;color:var(--color-prettylights-syntax-markup-heading)}.markdown-body .pl-mi{font-style:italic;color:var(--color-prettylights-syntax-markup-italic)}.markdown-body .pl-mb{font-weight:700;color:var(--color-prettylights-syntax-markup-bold)}.markdown-body .pl-md{color:var(--color-prettylights-syntax-markup-deleted-text);background-color:var(--color-prettylights-syntax-markup-deleted-bg)}.markdown-body .pl-mi1{color:var(--color-prettylights-syntax-markup-inserted-text);background-color:var(--color-prettylights-syntax-markup-inserted-bg)}.markdown-body .pl-mc{color:var(--color-prettylights-syntax-markup-changed-text);background-color:var(--color-prettylights-syntax-markup-changed-bg)}.markdown-body .pl-mi2{color:var(--color-prettylights-syntax-markup-ignored-text);background-color:var(--color-prettylights-syntax-markup-ignored-bg)}.markdown-body .pl-mdr{font-weight:700;color:var(--color-prettylights-syntax-meta-diff-range)}.markdown-body .pl-ba{color:var(--color-prettylights-syntax-brackethighlighter-angle)}.markdown-body .pl-sg{color:var(--color-prettylights-syntax-sublimelinter-gutter-mark)}.markdown-body .pl-corl{text-decoration:underline;color:var(--color-prettylights-syntax-constant-other-reference-link)}.markdown-body [role=button]:focus:not(:focus-visible),.markdown-body [role=tabpanel][tabindex="0"]:focus:not(:focus-visible),.markdown-body button:focus:not(:focus-visible),.markdown-body summary:focus:not(:focus-visible),.markdown-body a:focus:not(:focus-visible){outline:none;box-shadow:none}.markdown-body [tabindex="0"]:focus:not(:focus-visible),.markdown-body details-dialog:focus:not(:focus-visible){outline:none}.markdown-body g-emoji{display:inline-block;min-width:1ch;font-family:"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol;font-size:1em;font-style:normal!important;font-weight:var(--base-text-weight-normal, 400);line-height:1;vertical-align:-.075em}.markdown-body g-emoji img{width:1em;height:1em}.markdown-body .task-list-item{list-style-type:none}.markdown-body .task-list-item label{font-weight:var(--base-text-weight-normal, 400)}.markdown-body .task-list-item.enabled label{cursor:pointer}.markdown-body .task-list-item+.task-list-item{margin-top:var(--base-size-4)}.markdown-body .task-list-item .handle{display:none}.markdown-body .task-list-item-checkbox{margin:0 .2em .25em -1.4em;vertical-align:middle}.markdown-body ul:dir(rtl) .task-list-item-checkbox{margin:0 -1.6em .25em .2em}.markdown-body ol:dir(rtl) .task-list-item-checkbox{margin:0 -1.6em .25em .2em}.markdown-body .contains-task-list:hover .task-list-item-convert-container,.markdown-body .contains-task-list:focus-within .task-list-item-convert-container{display:block;width:auto;height:24px;overflow:visible;clip:auto}.markdown-body ::-webkit-calendar-picker-indicator{filter:invert(50%)}.markdown-body .markdown-alert{padding:var(--base-size-8) var(--base-size-16);margin-bottom:var(--base-size-16);color:inherit;border-left:.25em solid var(--borderColor-default)}.markdown-body .markdown-alert>:first-child{margin-top:0}.markdown-body .markdown-alert>:last-child{margin-bottom:0}.markdown-body .markdown-alert .markdown-alert-title{display:flex;font-weight:var(--base-text-weight-medium, 500);align-items:center;line-height:1}.markdown-body .markdown-alert.markdown-alert-note{border-left-color:var(--borderColor-accent-emphasis)}.markdown-body .markdown-alert.markdown-alert-note .markdown-alert-title{color:var(--fgColor-accent)}.markdown-body .markdown-alert.markdown-alert-important{border-left-color:var(--borderColor-done-emphasis)}.markdown-body .markdown-alert.markdown-alert-important .markdown-alert-title{color:var(--fgColor-done)}.markdown-body .markdown-alert.markdown-alert-warning{border-left-color:var(--borderColor-attention-emphasis)}.markdown-body .markdown-alert.markdown-alert-warning .markdown-alert-title{color:var(--fgColor-attention)}.markdown-body .markdown-alert.markdown-alert-tip{border-left-color:var(--borderColor-success-emphasis)}.markdown-body .markdown-alert.markdown-alert-tip .markdown-alert-title{color:var(--fgColor-success)}.markdown-body .markdown-alert.markdown-alert-caution{border-left-color:var(--borderColor-danger-emphasis)}.markdown-body .markdown-alert.markdown-alert-caution .markdown-alert-title{color:var(--fgColor-danger)}.markdown-body>*:first-child>.heading-element:first-child{margin-top:0!important}.markdown-body .highlight pre:has(+.zeroclipboard-container){min-height:52px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Lato,sans-serif;font-size:1rem}h1,h2,h3,h4,h5,h6{font-family:Kanit,sans-serif;font-size:2rem}.dark-mode,.dark-mode body{background-color:#7a7d7d;color:#f4faff}.dark-mode .tv-search-results::-webkit-scrollbar-thumb{background-color:#0e131f}.dark-mode .tv-search-results::-webkit-scrollbar-thumb:hover{background-color:#000}.light-mode,.light-mode body{background-color:#e0e1e1;color:#000b14}.light-mode .tv-search-results::-webkit-scrollbar-thumb{background-color:#b9c4df}.light-mode .tv-search-results::-webkit-scrollbar-thumb:hover{background-color:#96a7cf}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background-color:#f1f9f9}::-webkit-scrollbar-thumb{background-color:#b9c4df}::-webkit-scrollbar-thumb:hover{background-color:#96a7cf}@keyframes slideInRight{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fadeOut{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(400px)}}.markdown-body{padding:40px 30px!important;border-radius:16px;color:#fff;font-size:16px;line-height:1.8;font-family:Lato,sans-serif}.markdown-body a{color:#3b82f6;text-decoration:none;font-weight:600;transition:color .2s ease}.markdown-body a:hover{color:#60a5fa;text-decoration:underline}.markdown-body h1,.markdown-body h2,.markdown-body h3{background:linear-gradient(135deg,#3b82f6,#8b5cf6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-family:Kanit,sans-serif;margin-top:2em;margin-bottom:1em;font-weight:700}.markdown-body h1{font-size:2.5rem;border-bottom:3px solid transparent;border-image:linear-gradient(90deg,#3b82f6,#8b5cf6) 1;padding-bottom:.5em}.markdown-body h2{font-size:2rem}.markdown-body h3{font-size:1.6rem}.markdown-body pre{background:linear-gradient(135deg,#1e293b,#0f172a);padding:20px;border-radius:12px;overflow-x:auto;box-shadow:0 8px 24px #0000004d,inset 0 1px #ffffff0d;border:2px solid rgba(59,130,246,.2)}.markdown-body code{background:linear-gradient(135deg,#3b82f626,#8b5cf626);padding:4px 8px;border-radius:6px;font-size:.9em;border:1px solid rgba(59,130,246,.3)}.markdown-body p{margin-bottom:1.2em}.tv-demo-tabs{display:flex;margin-bottom:10px;gap:8px}.tv-demo-tabs button{border:none;padding:12px 20px;cursor:pointer;font-size:1rem;border-radius:8px 8px 0 0;transition:all .3s cubic-bezier(.4,0,.2,1);font-weight:500;letter-spacing:.3px;position:relative}.tv-demo-tabs button:after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#3b82f6,#60a5fa);opacity:0;transition:opacity .3s ease}.tv-demo-tabs button.active:after{opacity:1}.tv-demo-tabs button:active{transform:translateY(1px)}.tv-demo *{box-sizing:border-box;margin:0;padding:0}.tv-demo-content{padding:20px;border:1px solid #4a4a4a;border-radius:0 5px 5px;min-width:0;max-width:100%;overflow:hidden}.tv-demo-content .tv-demo-description{font-size:1.1rem}.tv-demo-content .tv-demo-component-content{display:flex;margin:0 auto;padding:20px;justify-content:center;width:100%;max-width:100%;overflow:hidden}.tv-demo-content>*{max-width:100%}.tv-demo-links-item{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font-size:.95rem;color:inherit;font-weight:600;background:none;border:none;text-decoration:none;position:relative;padding:2px 0;letter-spacing:.02em;transition:color .25s ease,transform .25s ease;isolation:isolate}.tv-demo-links-item:after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:2px;background:currentColor;opacity:.25;transform-origin:left;transform:scaleX(.3);transition:opacity .25s ease,transform .25s ease}.tv-demo-links-item:hover,.tv-demo-links-item:focus-visible{transform:translateY(-1px)}.tv-demo-links-item:hover:after,.tv-demo-links-item:focus-visible:after{opacity:.85;transform:scaleX(1)}.tv-demo-links-item:focus-visible{outline:none;box-shadow:0 0 0 2px currentColor;border-radius:4px}.dark-mode .tv-demo-select{background-color:#b9c4df;color:#0e131f;border:1px solid #B9C4DF}.dark-mode .tv-demo-option{background:#b9c4df}.dark-mode .no-background{background-color:#0e131f;color:#b9c4df;box-shadow:0 0 10px #0e131f}.dark-mode .tv-demo-tabs button{background-color:#b9c4df;color:#000b14}.dark-mode .tv-demo-tabs button.active{background:#8598c7;font-weight:700}.dark-mode .tv-demo-tabs button:hover{background:#96a7cf}.dark-mode .tv-demo-links-item,.dark-mode a.tv-demo-links-item{color:#60a5fa;text-decoration-color:#60a5fa99;text-shadow:0 0 12px rgba(96,165,250,.35)}.dark-mode .tv-demo-links-item:hover,.dark-mode a.tv-demo-links-item:hover{color:#93c5fd;text-decoration-color:#93c5fde6}.light-mode .tv-demo-select{background-color:#0e131f;color:#b9c4df;border:1px solid #0E131F}.light-mode .tv-demo-option{background:#0e131f}.light-mode .no-background{background-color:#b9c4df;color:#0e131f;box-shadow:0 0 10px #b9c4df}.light-mode .tv-demo-tabs button{background-color:#0e131f;color:#f4faff}.light-mode .tv-demo-tabs button.active{background:#000;font-weight:700}.light-mode .tv-demo-tabs button:hover{background:#000}.light-mode .tv-demo-links-item,.light-mode a.tv-demo-links-item{color:#1e40af;text-decoration-color:#1e40af99;text-shadow:0 0 12px rgba(30,64,175,.25)}.light-mode .tv-demo-links-item:hover,.light-mode a.tv-demo-links-item:hover{color:#1d4ed8;text-decoration-color:#1d4ed8e6}.tv-demo-body{margin:0 auto;min-height:100vh;width:80%}.tv-demo-body.dark-mode{background-color:#0e131f}.tv-demo-body.dark-mode .tv-demo-select{background-color:#b9c4df;color:#0e131f;border:1px solid #B9C4DF}.tv-demo-body.dark-mode .tv-demo-option{background:#b9c4df}.tv-demo-body.dark-mode .tv-demo-links-item{color:#b9c4df;text-decoration-color:#b9c4df99}.tv-demo-body.light-mode{background-color:#b9c4df}.tv-demo-body.light-mode .tv-demo-select{background-color:#0e131f;color:#b9c4df;border:1px solid #0E131F}.tv-demo-body.light-mode .tv-demo-option{background:#0e131f}.tv-demo-body.light-mode .tv-demo-links-item{color:#0e131f;text-decoration-color:#0e131f99}.tv-demo-body .tv-demo-theme{display:flex;align-items:center;gap:10px;min-height:100%;padding:0 20px;width:100%}.tv-demo-body .tv-demo-links{display:flex;gap:12px;align-content:center;align-items:center;flex-wrap:wrap}.tv-demo-body .tv-demo-links a{color:inherit}.tv-demo-body .tv-demo-links>span{opacity:.3;font-weight:300}.tv-demo-body .tv-demo-header{padding:25px 0;display:flex;justify-content:space-between}.tv-demo-body .tv-demo-case{padding:0 40px 40px;position:relative}.tv-demo-body .tv-demo-case-demo .demo{margin-bottom:20px}.tv-demo-body .tv-demo-case-demo h3{font-size:1.4rem;padding-top:20px;font-family:Kanit,sans-serif;font-weight:600}.tv-demo-body .tv-demo-case-demo h1{font-size:2.5rem;font-weight:700;font-family:Kanit,sans-serif;background:linear-gradient(135deg,#3b82f6,#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tv-demo-body .tv-demo-case-demo h1 span{font-size:1rem;font-weight:300}.tv-demo-body .tv-demo-select{border-radius:8px;cursor:pointer;font-size:16px;height:44px;margin-bottom:20px;margin-top:10px;padding:0 16px;width:100%;border:2px solid transparent;transition:all .3s ease;font-weight:500;outline:none;box-shadow:0 2px 8px #0000001a}.tv-demo-body .tv-demo-select:hover{border-color:#3b82f64d;box-shadow:0 4px 12px #00000026}.tv-demo-body .tv-demo-select:focus{border-color:#3b82f680;box-shadow:0 0 0 3px #3b82f61a,0 4px 12px #00000026}.tv-demo-body .tv-demo-select-theme{width:150px}.tv-demo-body .tv-demo-option{font-size:16px}.tv-demo-body .tv-demo-component{align-items:center;display:flex;height:100%;justify-content:center;margin-top:5px;width:100%}.tv-demo-body .tv-demo-no-component{color:inherit;font-size:1.5rem;font-weight:500;text-align:center}.tv-demo-body .tv-demo-code{margin-top:5px;width:100%!important;height:auto!important;padding:20px 0}.tv-demo-footer{position:relative;padding:0;font-family:Lato,sans-serif;transition:all .3s ease;overflow:hidden}.tv-demo-footer:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(59,130,246,.5) 50%,transparent 100%)}.tv-demo-footer.dark-mode{background:linear-gradient(135deg,#111726,#0e131f,#13192a);color:#f4faff}.tv-demo-footer.dark-mode .tv-demo-footer-text,.tv-demo-footer.dark-mode .tv-demo-footer-copyright{color:#8eccff}.tv-demo-footer.dark-mode .tv-demo-footer-link{color:#3b82f6}.tv-demo-footer.dark-mode .tv-demo-footer-link:hover{color:#60a5fa;text-shadow:0 0 8px rgba(59,130,246,.3)}.tv-demo-footer.dark-mode .tv-demo-footer-brand-text{color:#f4faff;text-shadow:0 0 20px rgba(59,130,246,.3)}.tv-demo-footer.dark-mode .tv-demo-footer-divider{background:#ffffff1a}.tv-demo-footer.light-mode{background:linear-gradient(135deg,#cbd3e7,#b9c4df,#c4cde4);color:#000b14}.tv-demo-footer.light-mode .tv-demo-footer-text,.tv-demo-footer.light-mode .tv-demo-footer-copyright{color:#002747}.tv-demo-footer.light-mode .tv-demo-footer-link{color:#1e40af}.tv-demo-footer.light-mode .tv-demo-footer-link:hover{color:#3b82f6;text-shadow:0 0 8px rgba(30,64,175,.2)}.tv-demo-footer.light-mode .tv-demo-footer-brand-text{color:#000b14;text-shadow:0 0 20px rgba(30,64,175,.2)}.tv-demo-footer.light-mode .tv-demo-footer-divider{background:#0000001a}.tv-demo-footer-content{margin:0 auto;padding:40px 20px 20px}.tv-demo-footer-main{display:flex;flex-direction:column;align-items:center;gap:30px;margin-bottom:30px}.tv-demo-footer-brand{display:flex;align-items:center;gap:12px;font-family:Kanit,sans-serif;font-size:1.8rem;font-weight:700}.tv-demo-footer-logo{max-width:25px;animation:float 3s ease-in-out infinite;filter:drop-shadow(0 4px 8px rgba(59,130,246,.3))}.tv-demo-footer-logo img{width:100%}.tv-demo-footer-brand-text{letter-spacing:.5px;background:linear-gradient(135deg,#3b82f6,#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.tv-demo-footer-brand-version{letter-spacing:.3px;font-size:1rem;-webkit-background-clip:text;background-clip:text}.tv-demo-footer-info{display:flex;justify-content:center;align-items:center;gap:20px;flex-wrap:wrap}.tv-demo-footer-text{font-size:1rem;display:flex;align-items:center;gap:8px;margin:0;opacity:.85;transition:all .3s ease;font-weight:400}.tv-demo-footer-text:hover{opacity:1;transform:translateY(-2px)}.tv-demo-footer-divider{width:1px;height:20px;opacity:.3}.tv-demo-footer-link{text-decoration:none!important;font-weight:600!important;position:relative;transition:all .3s ease;padding:0 0 2px!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;transform:none!important;letter-spacing:normal!important;display:inline!important;gap:0!important;overflow:visible!important}.tv-demo-footer-link:before{display:none!important}.tv-demo-footer-link:after{content:"";position:absolute;bottom:0;left:0;width:0;height:2px;background:currentColor;transition:width .3s ease}.tv-demo-footer-link:hover{transform:none!important;box-shadow:none!important;background:transparent!important}.tv-demo-footer-link:hover:after{width:100%}.tv-demo-footer-heart{font-size:1.2rem;display:inline-block;animation:pulse 2s infinite ease-in-out;filter:drop-shadow(0 0 4px rgba(59,130,246,.4))}.tv-demo-footer-bottom{padding-top:20px;border-top:1px solid rgba(255,255,255,.05);text-align:center}.tv-demo-footer-copyright{font-size:.85rem;margin:0;opacity:.6;font-weight:300;letter-spacing:.3px}@keyframes float{0%,to{transform:translateY(0) rotate(0)}25%{transform:translateY(-5px) rotate(-2deg)}50%{transform:translateY(-10px) rotate(0)}75%{transform:translateY(-5px) rotate(2deg)}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.15);opacity:.8}}.switch{position:relative;display:inline-block;width:60px;height:32px}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;inset:0;background:linear-gradient(135deg,#cbd5e1,#94a3b8);transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:inset 0 2px 4px #0000001a,0 2px 8px #00000026}.slider:before{position:absolute;content:"";height:24px;width:24px;left:4px;bottom:4px;background:linear-gradient(135deg,#fff,#f8fafc);transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 2px 8px #0003,0 1px 3px #0000001a}input:checked+.slider{background:linear-gradient(135deg,#3b82f6,#2563eb);box-shadow:inset 0 2px 4px #0000001a,0 2px 12px #3b82f666}input:focus+.slider{box-shadow:inset 0 2px 4px #0000001a,0 0 0 3px #3b82f633,0 2px 8px #00000026}input:checked+.slider:before{transform:translate(28px);box-shadow:0 2px 8px #00000040,0 1px 3px #00000026}.slider:hover{box-shadow:inset 0 2px 4px #0000001a,0 4px 12px #0003}input:checked+.slider:hover{box-shadow:inset 0 2px 4px #0000001a,0 4px 16px #3b82f680}.slider.round{border-radius:32px}.slider.round:before{border-radius:50%}.tv-demo-layout{display:grid;grid-template-columns:320px 1fr;gap:20px;margin-top:20px;width:100%;max-width:100%}.tv-demo-sidebar{display:flex;flex-direction:column;border-radius:16px;padding:20px;border:1px solid rgba(255,255,255,.08);background:#00000040;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);height:100%}.tv-demo-sidebar.light-mode{border-color:#00000014;background:#fff9}.tv-demo-sidebar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.tv-demo-sidebar-header h3{margin:0;font-size:1.3rem}.tv-demo-sidebar-meta{font-size:.85rem;opacity:.7;margin-bottom:4px}.tv-demo-sidebar-collapse{background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:8px;cursor:pointer;font-size:.9rem;padding:6px 8px}.tv-demo-sidebar-collapse:hover{border-color:#fff9}.light-mode .tv-demo-sidebar-collapse{border-color:#00000026}.light-mode .tv-demo-sidebar-collapse:hover{border-color:#00000073}.tv-demo-search{display:flex;align-items:center;gap:8px;border-radius:999px;padding:6px 12px;border:1px solid rgba(255,255,255,.2);margin-bottom:16px;background:#ffffff0d}.tv-demo-search.light-mode{border-color:#0000001a;background:#00000008}.tv-demo-search-icon{font-size:.85rem}.tv-demo-search-input{background:transparent;border:none;flex:1;font-size:.9rem;outline:none;color:inherit}.tv-demo-search-clear{background:transparent;border:none;cursor:pointer;font-size:.85rem;opacity:.7}.tv-demo-variants{position:relative;flex:1;overflow:auto;border-radius:12px;padding:4px;border:1px solid rgba(255,255,255,.08);background:#ffffff05;max-height:550px}.tv-demo-variants.light-mode{border-color:#00000014;background:#00000003}.tv-demo-variant-card{width:100%;display:flex;justify-content:space-between;gap:12px;border:none;background:#0000004d;color:inherit;padding:14px;border-radius:12px;text-align:left;cursor:pointer;margin-bottom:8px;transition:transform .2s ease,box-shadow .2s ease}.tv-demo-variant-card:hover{transform:translate(4px);box-shadow:0 10px 20px #0000004d}.tv-demo-variant-card.active{outline:2px solid rgba(59,130,246,.7);background:#3b82f626}.light-mode .tv-demo-variant-card{background:#fffc}.light-mode .tv-demo-variant-card.active{background:#3b82f61f}.tv-demo-variant-card-content{flex:1}.tv-demo-variant-card-title{display:block;font-weight:600;margin-bottom:4px}.tv-demo-variant-card-description{font-size:.85rem;opacity:.75}.tv-demo-variant-card-icon{opacity:.7}.tv-demo-empty-state{text-align:center;padding:20px;opacity:.8}.tv-demo-reset{margin-top:12px;padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:transparent;color:inherit;cursor:pointer}.tv-demo-empty-component,.tv-demo-empty-code{text-align:center;padding:20px;opacity:.8}.tv-to-up{position:fixed;right:clamp(16px,4vw,40px);bottom:clamp(16px,4vw,40px);display:inline-flex;align-items:center;gap:10px;padding:12px 18px;border-radius:999px;border:none;cursor:pointer;font-family:Lato,sans-serif;font-weight:600;font-size:.95rem;letter-spacing:.04em;box-shadow:0 12px 30px #00000040;transition:transform .25s ease,box-shadow .25s ease,opacity .2s ease;z-index:40}.tv-to-up:hover{transform:translateY(-3px);box-shadow:0 18px 35px #0000004d}.tv-to-up:focus-visible{outline:2px solid rgba(59,130,246,.6);outline-offset:4px}.tv-to-up.dark-mode{color:#f4faff;background:linear-gradient(135deg,#1b243b,#3b82f6)}.tv-to-up.light-mode{color:#f1f9f9;background:linear-gradient(135deg,#9dacd2,#2563eb)}.tv-to-up-icon{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#ffffff26;border:1px solid rgba(255,255,255,.3);font-size:1.1rem}.tv-to-up-label{text-transform:uppercase;font-size:.85rem}.tv-to-up-enter-active,.tv-to-up-leave-active{transition:opacity .2s ease,transform .2s ease}.tv-to-up-enter-from,.tv-to-up-leave-to{opacity:0;transform:translateY(12px)}@media(max-width:1024px){.tv-demo-layout{grid-template-columns:1fr}.tv-demo-sidebar{max-height:none}}@media(max-width:768px){.tv-demo-layout{grid-template-columns:1fr}}@media(max-width:768px){.tv-demo-case{padding:10px!important}.tv-demo-body{width:90%}.tv-demo-header{flex-direction:column;align-items:flex-start;gap:10px;padding:0}.tv-demo-header .tv-demo-theme{width:100%;padding-left:0;padding-right:0}.tv-demo-header .tv-demo-select-theme{width:100%}.tv-demo-footer-content{padding:30px 15px 15px}.tv-demo-footer-brand{font-size:1.5rem;gap:10px}.tv-demo-footer-logo{font-size:2rem}.tv-demo-footer-info{gap:15px;flex-direction:column;text-align:center}.tv-demo-footer-text{font-size:.9rem}.tv-demo-footer-divider{display:none}}@media(max-width:640px){.tv-demo-case{padding:15px!important}.tv-demo-body{width:100%;border-radius:0}.tv-demo-content{padding:15px;border-radius:0 8px 8px}.tv-demo-content .tv-demo-component-content{padding:15px;margin:15px auto}.tv-demo-tabs{gap:4px}.tv-demo-tabs button{padding:8px 12px;font-size:.85rem}.tv-demo-footer-brand{font-size:1.3rem}.tv-demo-footer-logo{max-width:18px}.tv-demo-footer-text{font-size:.85rem;gap:6px}.tv-demo-footer-copyright{font-size:.75rem}.tv-demo-footer-brand-version{font-size:.85rem}.tv-demo-links-item{padding:0;font-size:.85rem;gap:4px}.markdown-body{padding:20px 15px;font-size:14px}.markdown-body h1{font-size:1.8rem}.markdown-body h2{font-size:1.5rem}.markdown-body h3{font-size:1.2rem}}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}.hljs{background:#272822;color:#ddd}.hljs-tag,.hljs-keyword,.hljs-selector-tag,.hljs-literal,.hljs-strong,.hljs-number,.hljs-name{color:#f92672}.hljs-code{color:#66d9ef}.hljs-attribute,.hljs-attr,.hljs-symbol,.hljs-regexp,.hljs-link{color:#bf79db}.hljs-string,.hljs-bullet,.hljs-subst,.hljs-title,.hljs-section,.hljs-emphasis,.hljs-type,.hljs-built_in,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-addition,.hljs-variable,.hljs-template-tag,.hljs-template-variable{color:#a6e22e}.hljs-title.class_,.hljs-class .hljs-title{color:#fff}.hljs-comment,.hljs-quote,.hljs-deletion,.hljs-meta{color:#75715e}.hljs-keyword,.hljs-selector-tag,.hljs-literal,.hljs-doctag,.hljs-title,.hljs-section,.hljs-type,.hljs-selector-id{font-weight:700}.cb[data-v-3c0bc7c1]{position:absolute;cursor:pointer;transition:.3s opacity linear;opacity:.5;height:30px;width:80px;right:0}.cb:hover .cb_tooltip[data-v-3c0bc7c1]{display:block}.cb[data-v-3c0bc7c1]:hover{opacity:1}.cb_tooltip[data-v-3c0bc7c1]{font-family:sans-serif;display:none;position:absolute;left:-96px;font-size:12px;color:#fff;width:80px;height:30px;line-height:30px;background:#000c;box-sizing:border-box;text-align:center;border-radius:4px}.cb_copy[data-v-3c0bc7c1]{position:absolute;font-family:sans-serif;display:block;font-size:12px;color:#fff;width:80px;height:30px;line-height:30px;background:#000c;box-sizing:border-box;text-align:center;border-radius:4px}.cb textarea[data-v-3c0bc7c1]{-webkit-user-select:none;user-select:none;position:absolute;padding:0;width:0;height:0;background:transparent;resize:none;opacity:0;border-color:#0000}.TL[data-v-b98f7724]{display:flex;align-items:center;justify-content:center;width:40px;height:30px;position:relative}.TL_word[data-v-b98f7724]{width:20px;height:20px;text-align:center;color:#aaa;font-size:16px}.code[data-v-f4a493be]{display:flex;flex-direction:column;font-size:0;position:relative;text-align:left;overflow:hidden}.code_header[data-v-f4a493be]{min-height:14px;position:relative}.code_area[data-v-f4a493be]{position:relative;overflow:hidden;padding-left:20px;margin:auto 0;display:flex}.code_area textarea[data-v-f4a493be]{overflow-y:hidden;box-sizing:border-box;caret-color:#7f7f7f;-webkit-text-fill-color:transparent;white-space:pre;word-wrap:normal;border:0;position:absolute;z-index:1000;top:0;left:0;width:100%;height:100%;background:none;border:none;outline:none;resize:none;padding:0 20px 20px;line-height:1.3;overflow:overlay;font-family:Consolas,Monaco,monospace}.code_area textarea[data-v-f4a493be]::-webkit-scrollbar-track{background-color:#eee}.code_area textarea[data-v-f4a493be]::-webkit-scrollbar-thumb{background:#afabab}.code_area textarea[data-v-f4a493be]::-webkit-scrollbar{width:8px;height:8px}.code_area textarea[data-v-f4a493be]::-webkit-scrollbar-corner{background-color:#eee}.code_area_link[data-v-f4a493be]{position:absolute}.code_area.change_hight[data-v-f4a493be]{height:calc(100% - 30px)}.code_area.srollbar_style[data-v-f4a493be]::-webkit-scrollbar-track{background-color:#eee}.code_area.srollbar_style[data-v-f4a493be]::-webkit-scrollbar-thumb{background:#afabab}.code_area.srollbar_style[data-v-f4a493be]::-webkit-scrollbar{width:8px;height:8px}.code_area.srollbar_style[data-v-f4a493be]::-webkit-scrollbar-corner{background-color:#eee}.code_area pre[data-v-f4a493be]{position:relative;margin:0;height:100%;overflow:hidden}.code_header[data-v-f4a493be]{position:relative;display:flex;justify-content:flex-start;width:100%}.code pre code[data-v-f4a493be]{font-family:Consolas,Monaco,monospace;line-height:1.3;position:relative;overflow-x:visible;border-radius:0;box-sizing:border-box;display:block;border:none;margin:0}.wrapper-content[data-v-f4a493be]::-webkit-scrollbar-track{background-color:#eee;border-radius:5px}.wrapper-content[data-v-f4a493be]::-webkit-scrollbar-thumb{background:#afabab;border-radius:5px}.wrapper-content[data-v-f4a493be]::-webkit-scrollbar{width:6px}.code_area_lines[data-v-f4a493be]{display:flex;flex-direction:column;width:10px;align-items:center;position:absolute;transform:translate(-18px)}.code_area_lines_item[data-v-f4a493be]{height:24px;width:10px;font-size:12px;color:#adb5bd;text-align:center;display:flex;justify-content:center;align-items:center;opacity:.6}.code_area_lines_item.dark[data-v-f4a493be]{color:#adb5bd}.code_area_lines_item.light[data-v-f4a493be]{color:#212529}.atom_one_dark.hljs,.atom_one_dark .hljs{color:#abb2bf;background:#282c34}.atom_one_dark .hljs-comment,.atom_one_dark .hljs-quote{color:#5c6370;font-style:italic}.atom_one_dark .hljs-doctag,.atom_one_dark .hljs-keyword,.atom_one_dark .hljs-formula{color:#c678dd}.atom_one_dark .hljs-section,.atom_one_dark .hljs-name,.atom_one_dark .hljs-selector-tag,.atom_one_dark .hljs-deletion,.atom_one_dark .hljs-subst{color:#e06c75}.atom_one_dark .hljs-literal{color:#56b6c2}.atom_one_dark .hljs-string,.atom_one_dark .hljs-regexp,.atom_one_dark .hljs-addition,.atom_one_dark .hljs-attribute,.atom_one_dark .hljs-meta .hljs-string{color:#98c379}.atom_one_dark .hljs-attr,.atom_one_dark .hljs-variable,.atom_one_dark .hljs-template-variable,.atom_one_dark .hljs-type,.atom_one_dark .hljs-selector-class,.atom_one_dark .hljs-selector-attr,.atom_one_dark .hljs-selector-pseudo,.atom_one_dark .hljs-number{color:#d19a66}.atom_one_dark .hljs-symbol,.atom_one_dark .hljs-bullet,.atom_one_dark .hljs-link,.atom_one_dark .hljs-meta,.atom_one_dark .hljs-selector-id,.atom_one_dark .hljs-title{color:#61aeee}.atom_one_dark .hljs-built_in,.atom_one_dark .hljs-title .class_,.atom_one_dark .hljs-class .hljs-title{color:#e6c07b}.atom_one_dark .hljs-emphasis{font-style:italic}.atom_one_dark .hljs-strong{font-weight:700}.atom_one_dark .hljs-link{text-decoration:underline}.atom_one_light.hljs,.atom_one_light .hljs{color:#383a42;background:#edf2f4}.atom_one_light .hljs-comment,.atom_one_light .hljs-quote{color:#a0a1a7;font-style:italic}.atom_one_light .hljs-doctag,.atom_one_light .hljs-keyword,.atom_one_light .hljs-formula{color:#a626a4}.atom_one_light .hljs-section,.atom_one_light .hljs-name,.atom_one_light .hljs-selector-tag,.atom_one_light .hljs-deletion,.atom_one_light .hljs-subst{color:#e45649}.atom_one_light .hljs-literal{color:#0184bb}.atom_one_light .hljs-string,.atom_one_light .hljs-regexp,.atom_one_light .hljs-addition,.atom_one_light .hljs-attribute,.atom_one_light .hljs-meta .hljs-string{color:#50a14f}.atom_one_light .hljs-attr,.atom_one_light .hljs-variable,.atom_one_light .hljs-template-variable,.atom_one_light .hljs-type,.atom_one_light .hljs-selector-class,.atom_one_light .hljs-selector-attr,.atom_one_light .hljs-selector-pseudo,.atom_one_light .hljs-number{color:#986801}.atom_one_light .hljs-symbol,.atom_one_light .hljs-bullet,.atom_one_light .hljs-link,.atom_one_light .hljs-meta,.atom_one_light .hljs-selector-id,.atom_one_light .hljs-title{color:#4078f2}.atom_one_light .hljs-built_in,.atom_one_light .hljs-title .class_,.atom_one_light .hljs-class .hljs-title{color:#c18401}.atom_one_light .hljs-emphasis{font-style:italic}.atom_one_light .hljs-strong{font-weight:700}.atom_one_light .hljs-link{text-decoration:underline}@keyframes slideInRight-84ed156b{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideOutRight-84ed156b{0%{transform:translate(0);opacity:1}to{transform:translate(400px);opacity:0}}.toast-notification[data-v-84ed156b]{display:flex;align-items:center;gap:12px;min-width:320px;max-width:450px;padding:14px 16px;margin-bottom:12px;border-radius:12px;box-shadow:0 10px 30px #0003,0 0 0 1px #ffffff1a;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(135deg,#1e1e1ef2,#141414f2);border:1px solid rgba(255,255,255,.08);opacity:0;transform:translate(400px);transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.toast-notification[data-v-84ed156b]:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:currentColor}.toast-notification.visible[data-v-84ed156b]{animation:slideInRight-84ed156b .3s ease-out forwards}.toast-notification.leaving[data-v-84ed156b]{animation:slideOutRight-84ed156b .3s ease-in forwards}.toast-notification.success[data-v-84ed156b]:before{background:#22c55e}.toast-notification.error[data-v-84ed156b]:before{background:#ef4444}.toast-notification.warning[data-v-84ed156b]:before{background:#f59e0b}.toast-notification.info[data-v-84ed156b]:before{background:#3b82f6}.toast-icon[data-v-84ed156b]{display:flex;align-items:center;justify-content:center;min-width:28px;width:28px;height:28px;border-radius:50%;font-weight:700;font-size:14px;flex-shrink:0}.toast-content[data-v-84ed156b]{flex:1;min-width:0}.toast-message[data-v-84ed156b]{margin:0;font-size:14px;font-weight:500;color:#fff;line-height:1.4;word-wrap:break-word;overflow-wrap:break-word}.toast-close[data-v-84ed156b]{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;background:#ffffff1a;color:#fff9;border-radius:6px;cursor:pointer;font-size:12px;font-weight:700;transition:all .2s ease;flex-shrink:0}.toast-close[data-v-84ed156b]:hover{background:#ffffff26;color:#ffffffe6;transform:scale(1.1)}.toast-close[data-v-84ed156b]:active{transform:scale(.95)}.light-mode .toast-notification[data-v-84ed156b]{background:linear-gradient(135deg,#fffffffa,#f5f5f5fa);border:1px solid rgba(0,0,0,.08);box-shadow:0 10px 30px #00000026,0 0 0 1px #0000000d}.light-mode .toast-notification .toast-message[data-v-84ed156b]{color:#1f2937}.light-mode .toast-notification .toast-close[data-v-84ed156b]{background:#0000000d;color:#00000080}.light-mode .toast-notification .toast-close[data-v-84ed156b]:hover{background:#0000001a;color:#000c}.toast-container[data-v-25add11c]{position:fixed;top:20px;right:20px;z-index:9999;display:flex;flex-direction:column;pointer-events:none}.toast-container[data-v-25add11c]>*{pointer-events:auto}@media(max-width:640px){.toast-container[data-v-25add11c]{top:10px;right:10px;left:10px;align-items:center}}

package/dist/tv-demo.es.js

@@ -1,135 +1,143 @@
-import { ref as g, computed as u, watch as z, nextTick as Y, onMounted as le, onBeforeUnmount as ie, watchEffect as re, defineAsyncComponent as de, createElementBlock as c, openBlock as r, Fragment as F, createElementVNode as o, createVNode as q, normalizeStyle as U, normalizeClass as C, unref as t, createCommentVNode as w, toDisplayString as k, withDirectives as ce, withKeys as ve, withModifiers as ue, isRef as me, vModelText as he, renderList as fe, createBlock as J, resolveDynamicComponent as pe, normalizeProps as ye, mergeProps as ke, createStaticVNode as be } from "vue";
-import { HighCode as ge } from "vue-highlight-code";
-import Ce from "vue3-markdown-it";
-const M = 72, W = 6, we = (a, p) => a?.id ?? a?.title ?? `variant-${p}`, Se = (a = {}) => `${a.title ?? ""} ${a.description ?? ""}`.toLowerCase(), Te = (a) => {
-  const p = g("dark"), V = g([]), D = g(""), O = g("demo"), T = g(""), i = g(null), v = g(null), b = g(360), E = g(0);
-  let y = null, x = !1;
-  const S = u(
-    () => (a.variants || []).map((e, s) => ({
+import { ref as b, computed as m, watch as A, nextTick as W, onMounted as ce, onBeforeUnmount as ve, watchEffect as ue, defineAsyncComponent as X, createElementBlock as r, openBlock as i, Fragment as Q, createElementVNode as o, createVNode as H, normalizeStyle as _, normalizeClass as C, unref as t, createCommentVNode as y, toDisplayString as w, withDirectives as me, withKeys as he, withModifiers as fe, isRef as ye, vModelText as ge, renderList as ke, createBlock as Z, resolveDynamicComponent as pe, normalizeProps as be, mergeProps as Ce, createStaticVNode as we } from "vue";
+import { HighCode as Te } from "vue-highlight-code";
+import ee from "vue3-markdown-it";
+const L = 72, te = 6, Se = (a, g) => a?.id ?? a?.title ?? `variant-${g}`, xe = (a = {}) => `${a.title ?? ""} ${a.description ?? ""}`.toLowerCase(), De = (a) => {
+  const g = b("dark"), D = b([]), M = b(""), V = b(""), K = b("demo"), x = b(""), d = b(null), v = b(null), h = b(360), S = b(0);
+  let k = null, $ = !1;
+  const T = m(
+    () => (a.variants || []).map((e, l) => ({
       variant: e,
-      index: s,
-      key: we(e, s),
-      searchableText: Se(e)
+      index: l,
+      key: Se(e, l),
+      searchableText: xe(e)
     }))
-  ), K = u(() => S.value.length), d = u(() => {
-    const e = T.value.trim().toLowerCase();
-    return e ? S.value.filter((s) => s.searchableText.includes(e)) : S.value;
-  }), H = u(() => d.value.length), f = u(
-    () => !!T.value.trim() && d.value.length === 0
-  ), m = () => {
-    b.value = v.value?.clientHeight || b.value;
-  }, N = () => {
-    x && (window.removeEventListener("resize", m), x = !1);
+  ), U = m(() => T.value.length), c = m(() => {
+    const e = x.value.trim().toLowerCase();
+    return e ? T.value.filter((l) => l.searchableText.includes(e)) : T.value;
+  }), G = m(() => c.value.length), z = m(
+    () => !!x.value.trim() && c.value.length === 0
+  ), u = () => {
+    h.value = v.value?.clientHeight || h.value;
+  }, p = () => {
+    $ && (window.removeEventListener("resize", u), $ = !1);
   };
-  z(
+  A(
     () => v.value,
     (e) => {
-      if (y && (y.disconnect(), y = null), !e) {
-        N();
+      if (k && (k.disconnect(), k = null), !e) {
+        p();
         return;
       }
-      Y(() => {
-        m(), typeof ResizeObserver < "u" ? (y = new ResizeObserver((s) => {
-          const h = s?.[0];
-          h && (b.value = h.contentRect.height);
-        }), y.observe(e)) : x || (window.addEventListener("resize", m), x = !0);
+      W(() => {
+        u(), typeof ResizeObserver < "u" ? (k = new ResizeObserver((l) => {
+          const f = l?.[0];
+          f && (h.value = f.contentRect.height);
+        }), k.observe(e)) : $ || (window.addEventListener("resize", u), $ = !0);
       });
     }
-  ), le(() => {
+  ), ce(() => {
     const e = localStorage.getItem("theme");
-    e && (p.value = e), Y(m);
-  }), ie(() => {
-    y && (y.disconnect(), y = null), N();
+    e && (g.value = e), W(u);
+  }), ve(() => {
+    k && (k.disconnect(), k = null), p();
   });
-  const A = async () => {
+  const F = async () => {
     try {
       const e = await fetch(a.readmePath);
       if (!e.ok) throw new Error("README.md not found");
-      D.value = await e.text();
+      M.value = await e.text();
     } catch {
-      D.value = "⚠️ Documentation not found.";
+      M.value = "Documentation not found.";
     }
-  }, P = () => {
-    p.value = p.value === "dark" ? "light" : "dark", localStorage.setItem("theme", p.value);
+  }, P = async () => {
+    try {
+      const e = await fetch(a.changelogPath);
+      if (!e.ok) throw new Error("CHANGELOG.md not found");
+      V.value = await e.text();
+    } catch {
+      V.value = "Changelog not found.";
+    }
+  }, O = () => {
+    g.value = g.value === "dark" ? "light" : "dark", localStorage.setItem("theme", g.value);
   };
-  z(
-    () => S.value,
+  A(
+    () => T.value,
     (e) => {
       if (!e.length) {
-        i.value = null;
+        d.value = null;
         return;
       }
-      e.some((s) => s.key === i.value) || (i.value = e[0].key);
+      e.some((l) => l.key === d.value) || (d.value = e[0].key);
     },
     { immediate: !0 }
-  ), z(
-    () => d.value,
+  ), A(
+    () => c.value,
     (e) => {
       if (!e.length) {
-        i.value = null;
+        d.value = null;
         return;
       }
-      e.some((s) => s.key === i.value) || (i.value = e[0].key);
+      e.some((l) => l.key === d.value) || (d.value = e[0].key);
     }
   );
-  const L = (e) => {
-    v.value && (v.value.scrollTop = e, E.value = e);
+  const B = (e) => {
+    v.value && (v.value.scrollTop = e, S.value = e);
   };
-  z(T, () => {
-    L(0);
+  A(x, () => {
+    B(0);
   });
-  const $ = u(
-    () => d.value.findIndex((e) => e.key === i.value)
-  ), I = u(() => Math.max(1, Math.ceil(b.value / M))), R = u(
-    () => Math.max(0, Math.floor(E.value / M) - W)
-  ), n = u(
+  const E = m(
+    () => c.value.findIndex((e) => e.key === d.value)
+  ), I = m(() => Math.max(1, Math.ceil(h.value / L))), R = m(
+    () => Math.max(0, Math.floor(S.value / L) - te)
+  ), n = m(
     () => Math.min(
-      d.value.length,
-      R.value + I.value + W * 2
+      c.value.length,
+      R.value + I.value + te * 2
     )
-  ), l = u(
-    () => d.value.slice(R.value, n.value)
-  ), Q = u(() => R.value * M), X = u(
-    () => Math.max(0, (d.value.length - n.value) * M)
+  ), s = m(
+    () => c.value.slice(R.value, n.value)
+  ), q = m(() => R.value * L), oe = m(
+    () => Math.max(0, (c.value.length - n.value) * L)
   );
-  z(i, () => {
+  A(d, () => {
     if (!v.value) return;
-    const e = $.value;
+    const e = E.value;
     if (e < 0) return;
-    const s = R.value + 2, h = n.value - 3;
-    if (e < s)
-      L(Math.max(0, e * M));
-    else if (e > h) {
-      const B = Math.max(0, e - I.value + 1);
-      L(B * M);
+    const l = R.value + 2, f = n.value - 3;
+    if (e < l)
+      B(Math.max(0, e * L));
+    else if (e > f) {
+      const N = Math.max(0, e - I.value + 1);
+      B(N * L);
     }
   });
-  const Z = u(() => f.value ? {} : (d.value.find((s) => s.key === i.value) || S.value.find((s) => s.key === i.value) || d.value[0] || S.value[0])?.variant || {}), ee = (e) => {
-    E.value = e.target.scrollTop;
-  }, G = (e) => {
-    const s = d.value;
-    if (!s.length) return;
-    const h = $.value < 0 ? 0 : $.value, B = Math.min(s.length - 1, Math.max(0, h + e));
-    i.value = s[B].key;
-  }, te = (e) => {
+  const ne = m(() => z.value ? {} : (c.value.find((l) => l.key === d.value) || T.value.find((l) => l.key === d.value) || c.value[0] || T.value[0])?.variant || {}), ae = (e) => {
+    S.value = e.target.scrollTop;
+  }, J = (e) => {
+    const l = c.value;
+    if (!l.length) return;
+    const f = E.value < 0 ? 0 : E.value, N = Math.min(l.length - 1, Math.max(0, f + e));
+    d.value = l[N].key;
+  }, le = (e) => {
     switch (e.key) {
       case "ArrowDown":
-        e.preventDefault(), G(1);
+        e.preventDefault(), J(1);
         break;
       case "ArrowUp":
-        e.preventDefault(), G(-1);
+        e.preventDefault(), J(-1);
         break;
       case "Home":
-        e.preventDefault(), d.value.length && (i.value = d.value[0].key);
+        e.preventDefault(), c.value.length && (d.value = c.value[0].key);
         break;
       case "End":
-        e.preventDefault(), d.value.length && (i.value = d.value[d.value.length - 1].key);
+        e.preventDefault(), c.value.length && (d.value = c.value[c.value.length - 1].key);
         break;
     }
-  }, oe = (e) => {
-    i.value = e;
-  }, ne = u(() => {
-    const e = p.value === "dark" ? a.demoStyle?.dark : a.demoStyle?.light;
+  }, se = (e) => {
+    d.value = e;
+  }, ie = m(() => {
+    const e = g.value === "dark" ? a.demoStyle?.dark : a.demoStyle?.light;
     return {
       body: {
         backgroundColor: e?.backgroundBody || "",
@@ -140,66 +148,75 @@ const M = 72, W = 6, we = (a, p) => a?.id ?? a?.title ?? `variant-${p}`, Se = (a
         color: e?.color || ""
       }
     };
-  }), ae = (e) => {
-    let s = "";
-    e === "npm" ? s = `npm install ${a.isDevComponent ? "-D " : ""}${a.npmInstall}` : s = `git clone ${a.urlClone}`, navigator.clipboard.writeText(s).then(() => {
-      _(`Copied to clipboard: ${s}`, "success", 3e3);
-    }).catch((h) => {
-      _(`Failed to copy: ${h}`, "error", 3e3);
+  }), re = (e) => {
+    let l = "";
+    e === "npm" ? l = `npm install ${a.isDevComponent ? "-D " : ""}${a.npmInstall}` : l = `git clone ${a.urlClone}`, navigator.clipboard.writeText(l).then(() => {
+      j(`Copied to clipboard: ${l}`, "success", 3e3);
+    }).catch((f) => {
+      j(`Failed to copy: ${f}`, "error", 3e3);
     });
-  }, _ = (e, s = "success", h = 3e3) => {
-    const B = `toast-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-    V.value.push({ id: B, message: e, type: s, duration: h });
-  }, se = (e) => {
-    const s = V.value.findIndex((h) => h.id === e);
-    s > -1 && V.value.splice(s, 1);
+  }, j = (e, l = "success", f = 3e3) => {
+    const N = `toast-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
+    D.value.push({ id: N, message: e, type: l, duration: f });
+  }, de = (e) => {
+    const l = D.value.findIndex((f) => f.id === e);
+    l > -1 && D.value.splice(l, 1);
   };
-  return re(A), {
-    customStyle: ne,
-    toasts: V,
-    readmeContent: D,
-    selectedTab: O,
-    searchQuery: T,
-    selectedVariantKey: i,
-    totalVariantsCount: K,
-    filteredVariantsCount: H,
+  return ue(async () => {
+    await F(), await P();
+  }), {
+    customStyle: ie,
+    toasts: D,
+    readmeContent: M,
+    changelogContent: V,
+    selectedTab: K,
+    searchQuery: x,
+    selectedVariantKey: d,
+    totalVariantsCount: U,
+    filteredVariantsCount: G,
     variantsListRef: v,
-    virtualizedVariants: l,
-    virtualPaddingTop: Q,
-    virtualPaddingBottom: X,
-    emptySearchState: f,
-    theme: p,
-    variant: Z,
-    addToast: _,
-    removeToast: se,
-    selectVariant: oe,
-    setClickItem: ae,
-    toggleTheme: P,
-    handleVariantsScroll: ee,
-    handleVariantsKeydown: te
+    virtualizedVariants: s,
+    virtualPaddingTop: q,
+    virtualPaddingBottom: oe,
+    emptySearchState: z,
+    theme: g,
+    variant: ne,
+    addToast: j,
+    removeToast: de,
+    selectVariant: se,
+    setClickItem: re,
+    toggleTheme: O,
+    handleVariantsScroll: ae,
+    handleVariantsKeydown: le
   };
-}, xe = { class: "tv-demo-case" }, Ve = { class: "tv-demo-header" }, De = { class: "tv-demo-links" }, $e = ["href"], Ie = { key: 1 }, Me = { key: 3 }, Ee = { class: "tv-demo-theme" }, Le = { class: "switch" }, Re = ["checked"], Be = { class: "tv-demo-tabs" }, ze = {
+}, Ve = { class: "tv-demo-case" }, $e = { class: "tv-demo-header" }, Ee = { class: "tv-demo-links" }, Ie = ["href"], Le = { key: 1 }, Me = { key: 3 }, Be = { class: "tv-demo-theme" }, Re = { class: "switch" }, Ne = ["checked"], Ae = { class: "tv-demo-tabs" }, ze = {
   key: 0,
   class: "tv-demo-layout"
-}, Ne = { class: "tv-demo-sidebar-header" }, Ae = { class: "tv-demo-sidebar-meta" }, Pe = ["aria-activedescendant"], Oe = ["id", "aria-selected", "onClick"], Ke = { class: "tv-demo-variant-card-content" }, He = { class: "tv-demo-variant-card-title" }, _e = { class: "tv-demo-variant-card-description" }, Fe = {
+}, Pe = { class: "tv-demo-sidebar-header" }, Oe = { class: "tv-demo-sidebar-meta" }, He = ["aria-activedescendant"], Ke = ["id", "aria-selected", "onClick"], Ue = { class: "tv-demo-variant-card-content" }, Ge = { class: "tv-demo-variant-card-title" }, Fe = { class: "tv-demo-variant-card-description" }, je = {
   key: 1,
   class: "tv-demo-empty-state"
-}, Ue = {
+}, Qe = {
   class: "tv-demo-content",
   "aria-live": "polite"
-}, je = { class: "tv-demo-content-header" }, Qe = { class: "tv-demo-description" }, Ge = { class: "tv-demo-component-content" }, Ye = {
+}, _e = { class: "tv-demo-content-header" }, Ye = { class: "tv-demo-description" }, qe = { class: "tv-demo-component-content" }, Je = {
   key: 1,
   class: "tv-demo-empty-component"
-}, qe = {
+}, We = {
   key: 1,
   class: "tv-demo-empty-code"
-}, Je = {
+}, Xe = {
   key: 1,
   class: "tv-demo-content"
-}, We = {
+}, Ze = {
   key: 0,
   class: "markdown-body"
-}, Xe = { key: 1 }, Ze = { class: "tv-demo-footer-content" }, et = { class: "tv-demo-footer-main" }, tt = { class: "tv-demo-footer-brand" }, ot = { class: "tv-demo-footer-brand-text" }, nt = { class: "tv-demo-footer-brand-version" }, at = { class: "tv-demo-footer-bottom" }, st = { class: "tv-demo-footer-copyright" }, j = {
+}, et = { key: 1 }, tt = {
+  key: 2,
+  class: "tv-demo-content"
+}, ot = {
+  key: 0,
+  class: "markdown-body"
+}, nt = { key: 1 }, at = { class: "tv-demo-footer-content" }, lt = { class: "tv-demo-footer-main" }, st = { class: "tv-demo-footer-brand" }, it = { class: "tv-demo-footer-brand-text" }, rt = { class: "tv-demo-footer-brand-version" }, dt = { class: "tv-demo-footer-bottom" }, ct = { class: "tv-demo-footer-copyright" }, Y = {
   __name: "TvDemo",
   props: {
     demoStyle: { type: Object, default: () => ({ body: {}, content: {} }) },
@@ -212,246 +229,272 @@ const M = 72, W = 6, we = (a, p) => a?.id ?? a?.title ?? `variant-${p}`, Se = (a
     npmInstall: { type: String, default: null },
     isDevComponent: { type: Boolean, default: !1 },
     version: { type: String, default: "0.0.0" },
-    readmePath: { type: String, default: "/README.md" }
+    readmePath: { type: String, default: "/README.md" },
+    changelogPath: { type: String, default: "/CHANGELOG.md" },
+    showDocumentation: { type: Boolean, default: !0 },
+    showChangelog: { type: Boolean, default: !0 }
   },
   setup(a) {
-    const p = de(
+    const g = X(
       /* webpackChunkName: "toastContainer" */
       () => import("./ToastContainer-NkcFPXPf.js")
-    ), V = a, {
-      customStyle: D,
-      toasts: O,
-      readmeContent: T,
-      selectedTab: i,
-      searchQuery: v,
-      selectedVariantKey: b,
-      totalVariantsCount: E,
-      filteredVariantsCount: y,
-      variantsListRef: x,
-      virtualizedVariants: S,
-      virtualPaddingTop: K,
-      virtualPaddingBottom: d,
-      emptySearchState: H,
-      theme: f,
-      variant: m,
-      removeToast: N,
-      setClickItem: A,
-      toggleTheme: P,
-      selectVariant: L,
-      handleVariantsScroll: $,
+    ), D = X(
+      /* webpackChunkName: "toUp" */
+      () => import("./ToUp-BAcInP4Z.js")
+    ), M = a, {
+      customStyle: V,
+      toasts: K,
+      readmeContent: x,
+      changelogContent: d,
+      selectedTab: v,
+      searchQuery: h,
+      selectedVariantKey: S,
+      totalVariantsCount: k,
+      filteredVariantsCount: $,
+      variantsListRef: T,
+      virtualizedVariants: U,
+      virtualPaddingTop: c,
+      virtualPaddingBottom: G,
+      emptySearchState: z,
+      theme: u,
+      variant: p,
+      removeToast: F,
+      setClickItem: P,
+      toggleTheme: O,
+      selectVariant: B,
+      handleVariantsScroll: E,
       handleVariantsKeydown: I
-    } = Te(V);
-    return (R, n) => (r(), c(F, null, [
+    } = De(M);
+    return (R, n) => (i(), r(Q, null, [
       o("div", {
-        class: C(`${t(f)}-mode tv-demo`),
-        style: U(t(D).body)
+        class: C(`${t(u)}-mode tv-demo`),
+        style: _(t(V).body)
       }, [
         o("div", {
-          class: C(["tv-demo-body", { [`${t(f)}-mode`]: !a.hideBackground }]),
-          style: U(t(D).content)
+          class: C(["tv-demo-body", { [`${t(u)}-mode`]: !a.hideBackground }]),
+          style: _(t(V).content)
         }, [
-          o("div", xe, [
-            o("div", Ve, [
+          o("div", Ve, [
+            o("div", $e, [
               o("div", null, [
-                o("div", De, [
-                  a.sourceLink || a.npmInstall || a.urlClone ? (r(), c(F, { key: 0 }, [
-                    a.sourceLink ? (r(), c("a", {
+                o("div", Ee, [
+                  a.sourceLink || a.npmInstall || a.urlClone ? (i(), r(Q, { key: 0 }, [
+                    a.sourceLink ? (i(), r("a", {
                       key: 0,
                       href: a.sourceLink,
                       target: "_blank",
                       class: "tv-demo-links-item"
-                    }, " 📂 Source ", 8, $e)) : w("", !0),
-                    a.sourceLink && (a.npmInstall || a.urlClone) ? (r(), c("span", Ie, " | ")) : w("", !0),
-                    a.npmInstall ? (r(), c("div", {
+                    }, " View source code ", 8, Ie)) : y("", !0),
+                    a.sourceLink && (a.npmInstall || a.urlClone) ? (i(), r("span", Le, " | ")) : y("", !0),
+                    a.npmInstall ? (i(), r("div", {
                       key: 2,
                       class: "tv-demo-links-item",
-                      onClick: n[0] || (n[0] = (l) => t(A)("npm"))
-                    }, " 📦 NPM Command ")) : w("", !0),
-                    a.npmInstall && a.urlClone ? (r(), c("span", Me, " | ")) : w("", !0),
-                    a.urlClone ? (r(), c("div", {
+                      onClick: n[0] || (n[0] = (s) => t(P)("npm"))
+                    }, " Copy install command ")) : y("", !0),
+                    a.npmInstall && a.urlClone ? (i(), r("span", Me, " | ")) : y("", !0),
+                    a.urlClone ? (i(), r("div", {
                       key: 4,
                       class: "tv-demo-links-item",
-                      onClick: n[1] || (n[1] = (l) => t(A)("clone"))
-                    }, " 📝 Clone Component ")) : w("", !0)
-                  ], 64)) : w("", !0)
+                      onClick: n[1] || (n[1] = (s) => t(P)("clone"))
+                    }, " Copy repository clone URL ")) : y("", !0)
+                  ], 64)) : y("", !0)
                 ])
               ]),
               o("div", null, [
-                o("div", Ee, [
-                  n[13] || (n[13] = o("span", { style: { "font-size": "0.9rem", opacity: "0.8" } }, "Theme", -1)),
-                  o("label", Le, [
+                o("div", Be, [
+                  n[14] || (n[14] = o("span", { style: { "font-size": "0.9rem", opacity: "0.8" } }, "Theme", -1)),
+                  o("label", Re, [
                     o("input", {
                       type: "checkbox",
-                      checked: t(f) === "dark",
-                      onChange: n[2] || (n[2] = (...l) => t(P) && t(P)(...l))
-                    }, null, 40, Re),
-                    n[12] || (n[12] = o("span", { class: "slider round" }, null, -1))
+                      checked: t(u) === "dark",
+                      onChange: n[2] || (n[2] = (...s) => t(O) && t(O)(...s))
+                    }, null, 40, Ne),
+                    n[13] || (n[13] = o("span", { class: "slider round" }, null, -1))
                   ])
                 ])
               ])
             ]),
-            o("div", Be, [
+            o("div", Ae, [
               o("button", {
-                class: C({ active: t(i) === "demo" }),
-                onClick: n[3] || (n[3] = (l) => i.value = "demo")
-              }, "📌 Demo", 2),
-              o("button", {
-                class: C({ active: t(i) === "docs" }),
-                onClick: n[4] || (n[4] = (l) => i.value = "docs")
-              }, "📖 Documentation", 2)
+                class: C({ active: t(v) === "demo" }),
+                onClick: n[3] || (n[3] = (s) => v.value = "demo")
+              }, "Demo", 2),
+              a.showDocumentation ? (i(), r("button", {
+                key: 0,
+                class: C({ active: t(v) === "docs" }),
+                onClick: n[4] || (n[4] = (s) => v.value = "docs")
+              }, "Documentation", 2)) : y("", !0),
+              a.showChangelog ? (i(), r("button", {
+                key: 1,
+                class: C({ active: t(v) === "changelog" }),
+                onClick: n[5] || (n[5] = (s) => v.value = "changelog")
+              }, "Changelog", 2)) : y("", !0)
             ]),
-            t(i) === "demo" ? (r(), c("div", ze, [
+            t(v) === "demo" ? (i(), r("div", ze, [
               o("aside", {
-                class: C(["tv-demo-sidebar", `${t(f)}-mode`])
+                class: C(["tv-demo-sidebar", `${t(u)}-mode`])
               }, [
-                o("div", Ne, [
+                o("div", Pe, [
                   o("div", null, [
-                    o("p", Ae, k(t(y)) + " / " + k(t(E)) + " variants", 1),
-                    n[14] || (n[14] = o("h3", null, "Variants", -1))
+                    o("p", Oe, w(t($)) + " / " + w(t(k)) + " variants", 1),
+                    n[15] || (n[15] = o("h3", null, "Variants", -1))
                   ]),
                   o("button", {
                     class: "tv-demo-sidebar-collapse",
                     "aria-label": "Scroll to top",
-                    onClick: n[5] || (n[5] = (l) => t(x)?.scrollTo({ top: 0, behavior: "smooth" }))
+                    onClick: n[6] || (n[6] = (s) => t(T)?.scrollTo({ top: 0, behavior: "smooth" }))
                   }, " ⬆️ ")
                 ]),
                 o("label", {
-                  class: C(["tv-demo-search", `${t(f)}-mode`])
+                  class: C(["tv-demo-search", `${t(u)}-mode`])
                 }, [
-                  n[15] || (n[15] = o("span", { class: "tv-demo-search-icon" }, "🔍", -1)),
-                  ce(o("input", {
-                    "onUpdate:modelValue": n[6] || (n[6] = (l) => me(v) ? v.value = l : null),
+                  n[16] || (n[16] = o("span", { class: "tv-demo-search-icon" }, "🔍", -1)),
+                  me(o("input", {
+                    "onUpdate:modelValue": n[7] || (n[7] = (s) => ye(h) ? h.value = s : null),
                     type: "search",
                     placeholder: "Search variants...",
                     class: "tv-demo-search-input",
                     "aria-label": "Search variants",
-                    onKeydown: n[7] || (n[7] = ve(ue((l) => t(I)(l), ["prevent"]), ["down"]))
+                    onKeydown: n[8] || (n[8] = he(fe((s) => t(I)(s), ["prevent"]), ["down"]))
                   }, null, 544), [
-                    [he, t(v)]
+                    [ge, t(h)]
                   ]),
-                  t(v) ? (r(), c("button", {
+                  t(h) ? (i(), r("button", {
                     key: 0,
                     type: "button",
                     class: "tv-demo-search-clear",
                     "aria-label": "Clear search",
-                    onClick: n[8] || (n[8] = (l) => v.value = "")
-                  }, "✕")) : w("", !0)
+                    onClick: n[9] || (n[9] = (s) => h.value = "")
+                  }, "✕")) : y("", !0)
                 ], 2),
                 o("div", {
                   class: C([
                     "tv-demo-variants",
-                    `${t(f)}-mode`
+                    `${t(u)}-mode`
                   ]),
                   role: "listbox",
                   tabindex: "0",
                   "aria-label": "Available variants",
-                  "aria-activedescendant": t(b) ? `variant-${t(b)}` : null,
-                  onKeydown: n[10] || (n[10] = (...l) => t(I) && t(I)(...l)),
+                  "aria-activedescendant": t(S) ? `variant-${t(S)}` : null,
+                  onKeydown: n[11] || (n[11] = (...s) => t(I) && t(I)(...s)),
                   ref_key: "variantsListRef",
-                  ref: x,
-                  onScroll: n[11] || (n[11] = (...l) => t($) && t($)(...l))
+                  ref: T,
+                  onScroll: n[12] || (n[12] = (...s) => t(E) && t(E)(...s))
                 }, [
                   o("div", {
-                    style: U({ paddingTop: `${t(K)}px`, paddingBottom: `${t(d)}px` })
+                    style: _({ paddingTop: `${t(c)}px`, paddingBottom: `${t(G)}px` })
                   }, [
-                    t(H) ? (r(), c("div", Fe, [
-                      o("p", null, 'No matches for "' + k(t(v)) + '".', 1),
+                    t(z) ? (i(), r("div", je, [
+                      o("p", null, 'No matches for "' + w(t(h)) + '".', 1),
                       o("button", {
                         class: "tv-demo-reset",
                         type: "button",
-                        onClick: n[9] || (n[9] = (l) => v.value = "")
+                        onClick: n[10] || (n[10] = (s) => h.value = "")
                       }, "Clear filter")
-                    ])) : (r(!0), c(F, { key: 0 }, fe(t(S), (l) => (r(), c("button", {
-                      key: l.key,
-                      id: `variant-${l.key}`,
+                    ])) : (i(!0), r(Q, { key: 0 }, ke(t(U), (s) => (i(), r("button", {
+                      key: s.key,
+                      id: `variant-${s.key}`,
                       type: "button",
-                      class: C(["tv-demo-variant-card", { active: l.key === t(b) }]),
+                      class: C(["tv-demo-variant-card", { active: s.key === t(S) }]),
                       role: "option",
-                      "aria-selected": l.key === t(b),
-                      onClick: (Q) => t(L)(l.key)
+                      "aria-selected": s.key === t(S),
+                      onClick: (q) => t(B)(s.key)
                     }, [
-                      o("span", Ke, [
-                        o("span", He, k(l.variant.title), 1),
-                        o("span", _e, k(l.variant.description), 1)
+                      o("span", Ue, [
+                        o("span", Ge, w(s.variant.title), 1),
+                        o("span", Fe, w(s.variant.description), 1)
                       ]),
-                      n[16] || (n[16] = o("span", { class: "tv-demo-variant-card-icon" }, "→", -1))
-                    ], 10, Oe))), 128))
+                      n[17] || (n[17] = o("span", { class: "tv-demo-variant-card-icon" }, "→", -1))
+                    ], 10, Ke))), 128))
                   ], 4)
-                ], 42, Pe)
+                ], 42, He)
               ], 2),
-              o("section", Ue, [
-                o("div", je, [
+              o("section", Qe, [
+                o("div", _e, [
                   o("div", null, [
-                    n[17] || (n[17] = o("p", { class: "tv-demo-content-label" }, "Preview", -1)),
-                    o("h3", null, k(t(m).title || "Select a variant"), 1)
+                    n[18] || (n[18] = o("p", { class: "tv-demo-content-label" }, "Preview", -1)),
+                    o("h3", null, w(t(p).title || "Select a variant"), 1)
                   ])
                 ]),
-                o("p", Qe, k(t(m).description || "Select a variant from the list to view its details."), 1),
-                o("div", Ge, [
-                  t(m) && a.component ? (r(), J(pe(a.component), ye(ke({ key: 0 }, t(m).propsData)), null, 16)) : (r(), c("p", Ye, "No component to render."))
+                o("p", Ye, w(t(p).description || "Select a variant from the list to view its details."), 1),
+                o("div", qe, [
+                  t(p) && a.component ? (i(), Z(pe(a.component), be(Ce({ key: 0 }, t(p).propsData)), null, 16)) : (i(), r("p", Je, "No component to render."))
                 ]),
-                n[18] || (n[18] = o("h3", null, "Code:", -1)),
-                t(m)?.html ? (r(), J(t(ge), {
+                n[19] || (n[19] = o("h3", null, "Code:", -1)),
+                t(p)?.html ? (i(), Z(t(Te), {
                   class: "tv-demo-code",
-                  codeValue: t(m).html,
-                  theme: t(f),
+                  codeValue: t(p).html,
+                  theme: t(u),
                   lang: "html",
                   codeLines: "",
-                  key: t(m).title,
+                  key: t(p).title,
                   height: "auto"
-                }, null, 8, ["codeValue", "theme"])) : (r(), c("p", qe, "No snippet available."))
+                }, null, 8, ["codeValue", "theme"])) : (i(), r("p", We, "No snippet available."))
               ])
-            ])) : w("", !0),
-            t(i) === "docs" ? (r(), c("div", Je, [
-              t(T) ? (r(), c("div", We, [
-                q(t(Ce), {
-                  source: t(T),
+            ])) : y("", !0),
+            t(v) === "docs" && a.showDocumentation ? (i(), r("div", Xe, [
+              t(x) ? (i(), r("div", Ze, [
+                H(t(ee), {
+                  source: t(x),
+                  html: ""
+                }, null, 8, ["source"])
+              ])) : (i(), r("div", et, "No documentation available."))
+            ])) : y("", !0),
+            t(v) === "changelog" && a.showChangelog ? (i(), r("div", tt, [
+              t(d) ? (i(), r("div", ot, [
+                H(t(ee), {
+                  source: t(d),
                   html: ""
                 }, null, 8, ["source"])
-              ])) : (r(), c("div", Xe, "No documentation available."))
-            ])) : w("", !0)
+              ])) : (i(), r("div", nt, "No changelog available."))
+            ])) : y("", !0)
           ])
         ], 6)
       ], 6),
       o("footer", {
-        class: C(["tv-demo-footer", `${t(f)}-mode`])
+        class: C(["tv-demo-footer", `${t(u)}-mode`])
       }, [
-        o("div", Ze, [
-          o("div", et, [
-            o("div", tt, [
-              n[19] || (n[19] = o("span", { class: "tv-demo-footer-logo" }, [
+        o("div", at, [
+          o("div", lt, [
+            o("div", st, [
+              n[20] || (n[20] = o("span", { class: "tv-demo-footer-logo" }, [
                 o("img", {
                   src: "https://firebasestorage.googleapis.com/v0/b/todovue-blog.appspot.com/o/icono_git.png?alt=media&token=86270c30-8235-4424-b72b-7a585f228685",
                   alt: ""
                 })
               ], -1)),
-              o("span", ot, k(a.componentName), 1),
-              o("span", nt, "v" + k(a.version), 1)
+              o("span", it, w(a.componentName), 1),
+              o("span", rt, "v" + w(a.version), 1)
             ]),
-            n[20] || (n[20] = be('<div class="tv-demo-footer-info"><p class="tv-demo-footer-text"> Designed &amp; Developed by <a href="https://cris-dev.com/" target="_blank" rel="noopener noreferrer" class="tv-demo-footer-link"> cris-dev.com </a></p><div class="tv-demo-footer-divider"></div><p class="tv-demo-footer-text"> Made with <span class="tv-demo-footer-heart">💙</span> using Vue.js </p></div>', 1))
+            n[21] || (n[21] = we('<div class="tv-demo-footer-info"><p class="tv-demo-footer-text"> Designed &amp; Developed by <a href="https://cris-dev.com/" target="_blank" rel="noopener noreferrer" class="tv-demo-footer-link"> cris-dev.com </a></p><div class="tv-demo-footer-divider"></div><p class="tv-demo-footer-text"> Made with <span class="tv-demo-footer-heart">💙</span> using Vue.js </p></div>', 1))
           ]),
-          o("div", at, [
-            o("p", st, " © " + k((/* @__PURE__ */ new Date()).getFullYear()) + " TODOvue. All rights reserved. ", 1)
+          o("div", dt, [
+            o("p", ct, " © " + w((/* @__PURE__ */ new Date()).getFullYear()) + " TODOvue. All rights reserved. ", 1)
           ])
         ])
       ], 2),
-      q(t(p), {
-        toasts: t(O),
-        onRemoveToast: t(N)
-      }, null, 8, ["toasts", "onRemoveToast"])
+      H(t(g), {
+        toasts: t(K),
+        onRemoveToast: t(F)
+      }, null, 8, ["toasts", "onRemoveToast"]),
+      H(t(D), {
+        theme: t(u),
+        "scroll-target": ".tv-demo-body",
+        "aria-label": "Back to top"
+      }, null, 8, ["theme"])
     ], 64));
   }
 };
-j.install = (a) => {
-  a.component("TvDemo", j);
+Y.install = (a) => {
+  a.component("TvDemo", Y);
 };
-const ct = {
+const ft = {
   install(a) {
-    a.component("TvDemo", j);
+    a.component("TvDemo", Y);
   }
 };
 export {
-  j as TvDemo,
-  ct as TvDemoPlugin,
-  j as default
+  Y as TvDemo,
+  ft as TvDemoPlugin,
+  Y as default
 };

package/package.json

@@ -4,7 +4,7 @@
   "author": "Cristhian Daza",
   "description": "This is a default demo display for TODOvue components. Use this area to showcase the component's usage, props, variants, and live behavior in isolation.",
   "license": "MIT",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "type": "module",
   "repository": {
     "type": "git",
@@ -46,7 +46,7 @@
   "scripts": {
     "dev": "vite",
     "build": "vite build",
-    "build:demo": "cp README.md public/ && VITE_BUILD_TARGET=demo vite build",
+    "build:demo": "cp README.md public/ && cp CHANGELOG.md public/ && VITE_BUILD_TARGET=demo vite build",
     "verify:dist": "node scripts/verify-dist.mjs"
   },
   "sideEffects": [