@todovue/tv-demo 1.2.5 → 1.2.7

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 Cristhian Daza
+Copyright (c) 2026 Cristhian Daza
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -14,7 +14,7 @@ A flexible, framework-agnostic Vue 3 component catalog for demos, documentation,
 ![Last Commit](https://img.shields.io/github/last-commit/TODOvue/tv-demo)
 ![Stars](https://img.shields.io/github/stars/TODOvue/tv-demo?style=social)
 
-> Demo: https://tv-demo.netlify.app/
+> Demo: https://ui.todovue.blog/demo/
 
 ---
 ## Table of Contents

package/dist/tv-demo.cjs.js

@@ -1 +1 @@
-"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;
+"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.es.js

@@ -229,8 +229,8 @@ const L = 72, te = 6, Se = (a, g) => a?.id ?? a?.title ?? `variant-${g}`, xe = (
     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" },
+    readmePath: { type: String, default: "./README.md" },
+    changelogPath: { type: String, default: "./CHANGELOG.md" },
     showDocumentation: { type: Boolean, default: !0 },
     showChangelog: { type: Boolean, default: !0 }
   },

package/package.json

@@ -4,8 +4,9 @@
   "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.2.5",
+  "version": "1.2.7",
   "type": "module",
+  "homepage": "https://ui.todovue.blog/demo",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/TODOvue/tv-demo.git"