@cypress-design/vue-docmenu 0.1.0 → 0.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.umd.js CHANGED
@@ -1,4 +1,4 @@
1
- (function(e,s){typeof exports=="object"&&typeof module<"u"?module.exports=s(require("vue"),require("@cypress-design/icon-registry")):typeof define=="function"&&define.amd?define(["vue","@cypress-design/icon-registry"],s):(e=typeof globalThis<"u"?globalThis:e||self,e.DocMenu=s(e.Vue,e.CyIconRegistry))})(this,function(e,s){"use strict";function b(t){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const l in t)if(l!=="default"){const n=Object.getOwnPropertyDescriptor(t,l);Object.defineProperty(o,l,n.get?n:{enumerable:!0,get:()=>t[l]})}}return o.default=t,Object.freeze(o)}const y=b(s),B=({body:t,compiledClasses:o,size:l,class:n,interactiveColorsOnGroup:p,...d})=>{const h=Object.keys(d).reduce((i,r)=>(!s.ICON_COLOR_PROP_NAMES.includes(r)&&r!=="name"&&(i[r]=d[r]),i),{}),m={width:l,height:l,viewBox:`0 0 ${l} ${l}`,fill:"none",innerHTML:t,...h};return o.length&&(m.class=o.join(" ")),m},C=t=>{const{sizeWithDefault:o,compiledClasses:l}=y.getComponentAttributes({...t,availableSizes:["8","16"]}),n={8:'<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 2.5 3 3 3-3" class="icon-dark"/>',16:'<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m4 6 4 4 4-4" class="icon-dark"/>'}[o];if(!n)throw Error(`Icon "chevron-down-small" is not available in size ${o}`);return e.h("svg",B({...t,size:o,body:n,compiledClasses:l}))},f={button:"flex leading-[24px] py-[10px] items-center relative w-full",topButton:"leading-[24px] text-[16px] pl-[24px] font-medium",leafButton:"leading-[20px] text-[14px] pl-[40px]"},z=["href"],k=e.defineComponent({__name:"_DocLink",props:{item:null,depth:{default:-1},collapsible:{type:Boolean}},setup(t){return(o,l)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(["list-none p-0",{"pl-[16px]":t.depth>=0}])},[e.createElementVNode("a",{class:e.normalizeClass(["group relative block w-full pl-[24px]",{"text-indigo-500 dark:text-indigo-200":t.item.active,"py-[8px] text-[16px] leading-[24px]":t.depth<0,"leading-[20px] text-[14px] py-[12px]":t.depth>=0}]),href:t.item.href},[t.depth>=0?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["absolute h-[80%] top-[10%] w-[4px] z-10 rounded-full hidden",{"group-hover:block bg-gray-300":!t.item.active&&t.collapsible}]),style:e.normalizeStyle({left:`-${18.5+t.depth*7.5}px`})},null,6)):e.createCommentVNode("",!0),e.createTextVNode(" "+e.toDisplayString(t.item.text),1)],10,z)],2))}}),w={key:0,class:"relative list-none p-0"},g=e.defineComponent({__name:"_DocGroup",props:{group:null,collapsible:{type:Boolean},depth:{default:0}},setup(t,{expose:o}){const l=t,n=e.ref(l.depth===0),p=e.ref([]),d=e.computed(()=>p.value&&n.value?p.value.reduce((i,{height:r})=>i+r,l.group.items.length):0);o({height:d});const h=e.computed(()=>{var x;const i=l.group.items.findIndex(a=>"href"in a&&a.active);let r=l.group.items.filter((a,u)=>!("href"in a)&&u<i).length;const c=(x=p.value)==null?void 0:x.reduce((a,u)=>r<-1?a:(r--,a+u.height),0);return(i+c)*44}),m=e.computed(()=>l.collapsible?"button":l.group.href?"a":"div");return(i,r)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(m)),{class:e.normalizeClass([e.unref(f).button,{[e.unref(f).topButton]:t.depth===0,[e.unref(f).leafButton]:t.depth}]),href:l.group.href,onClick:r[0]||(r[0]=()=>{t.collapsible&&(n.value=!n.value)})},{default:e.withCtx(()=>[l.collapsible?(e.openBlock(),e.createBlock(e.unref(C),{key:0,"stroke-color":"gray-400",size:t.depth?"8":"16",class:e.normalizeClass(["absolute left-0 transform transition-transform",{"rotate-0":n.value,"-rotate-90":!n.value,"ml-[16px]":t.depth}])},null,8,["size","class"])):e.createCommentVNode("",!0),e.createTextVNode(" "+e.toDisplayString(t.group.text),1)]),_:1},8,["class","href"])),l.collapsible&&t.depth>=0&&n.value&&t.group.items.some(c=>"href"in c&&c.active)?(e.openBlock(),e.createElementBlock("div",{key:0,class:"absolute h-[36px] w-[4px] z-10 rounded-full bg-indigo-500 transition-all duration-300 ml-[6px] mt-[48px]",style:e.normalizeStyle({top:`${e.unref(h)}px`,left:`-${t.depth===0?0:t.depth*7.5+1}px`})},null,4)):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("ul",{class:e.normalizeClass(["list-none p-0 ml-[7.5px]",{"border-l border-gray-100":t.depth===0&&l.collapsible}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.group.items,c=>(e.openBlock(),e.createElementBlock(e.Fragment,null,["items"in c?(e.openBlock(),e.createElementBlock("li",w,[e.createVNode(g,{ref_for:!0,ref_key:"$groups",ref:p,group:c,depth:t.depth+1,collapsible:l.collapsible},null,8,["group","depth","collapsible"])])):(e.openBlock(),e.createBlock(k,{key:1,item:c,depth:t.depth,collapsible:t.collapsible},null,8,["item","depth","collapsible"]))],64))),256))],2),[[e.vShow,n.value]])],64))}}),E={class:"overflow-y-hidden list-none p-0"},N={key:0,class:"relative list-none p-0"};return e.defineComponent({__name:"DocMenu",props:{items:null,collapsible:{type:Boolean,default:!0}},setup(t){return(o,l)=>(e.openBlock(),e.createElementBlock("ul",E,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.items,n=>(e.openBlock(),e.createElementBlock(e.Fragment,null,["items"in n?(e.openBlock(),e.createElementBlock("li",N,[e.createVNode(g,{group:n,depth:0,collapsible:t.collapsible},null,8,["group","collapsible"])])):(e.openBlock(),e.createBlock(k,{key:1,item:n,collapsible:t.collapsible},null,8,["item","collapsible"]))],64))),256))]))}})});
1
+ (function(e,s){typeof exports=="object"&&typeof module<"u"?module.exports=s(require("vue"),require("@cypress-design/icon-registry")):typeof define=="function"&&define.amd?define(["vue","@cypress-design/icon-registry"],s):(e=typeof globalThis<"u"?globalThis:e||self,e.DocMenu=s(e.Vue,e.CyIconRegistry))})(this,function(e,s){"use strict";function b(t){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const l in t)if(l!=="default"){const n=Object.getOwnPropertyDescriptor(t,l);Object.defineProperty(o,l,n.get?n:{enumerable:!0,get:()=>t[l]})}}return o.default=t,Object.freeze(o)}const y=b(s),B=({body:t,compiledClasses:o,size:l,class:n,interactiveColorsOnGroup:d,...p})=>{const h=Object.keys(p).reduce((c,r)=>(!s.ICON_COLOR_PROP_NAMES.includes(r)&&r!=="name"&&(c[r]=p[r]),c),{}),m={width:l,height:l,viewBox:`0 0 ${l} ${l}`,fill:"none",innerHTML:t,...h};return o.length&&(m.class=o.join(" ")),m},C=t=>{const{sizeWithDefault:o,compiledClasses:l}=y.getComponentAttributes({...t,availableSizes:["8","16"]}),n={8:'<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m1 2.5 3 3 3-3" class="icon-dark"/>',16:'<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m4 6 4 4 4-4" class="icon-dark"/>'}[o];if(!n)throw Error(`Icon "chevron-down-small" is not available in size ${o}`);return e.h("svg",B({...t,size:o,body:n,compiledClasses:l}))},f={button:"flex leading-[24px] py-[10px] items-center relative w-full",topButton:"leading-[24px] text-[16px] pl-[24px] font-medium",leafButton:"leading-[20px] text-[14px] pl-[40px]"},z=["href"],g=e.defineComponent({__name:"_DocLink",props:{item:null,depth:{default:-1},collapsible:{type:Boolean}},setup(t){return(o,l)=>(e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(["list-none p-0",{"pl-[16px]":t.depth>=0}])},[e.createElementVNode("a",{class:e.normalizeClass(["group relative block w-full pl-[24px]",{"text-indigo-500 dark:text-indigo-200":t.item.active,"py-[8px] text-[16px] leading-[24px]":t.depth<0,"leading-[20px] text-[14px] py-[12px]":t.depth>=0}]),href:t.item.href},[t.depth>=0?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["absolute h-[80%] top-[10%] w-[4px] z-10 rounded-full hidden",{"group-hover:block bg-gray-300":!t.item.active&&t.collapsible}]),style:e.normalizeStyle({left:`-${18.5+t.depth*7.5}px`})},null,6)):e.createCommentVNode("",!0),e.createTextVNode(" "+e.toDisplayString(t.item.text),1)],10,z)],2))}}),w={key:0,class:"relative list-none p-0"},k=e.defineComponent({__name:"_DocGroup",props:{group:null,collapsible:{type:Boolean},depth:{default:0}},setup(t,{expose:o}){const l=t,n=e.ref(l.depth===0),d=e.ref([]),p=e.computed(()=>d.value&&n.value?d.value.reduce((c,{height:r})=>c+r,l.group.items.length):0);o({height:p});const h=e.computed(()=>{var x;const c=l.group.items.findIndex(a=>"href"in a&&a.active);let r=l.group.items.filter((a,u)=>!("href"in a)&&u<c).length;const i=(x=d.value)==null?void 0:x.reduce((a,u)=>r<-1?a:(r--,a+u.height),0);return(c+i)*44}),m=e.computed(()=>l.collapsible?"button":l.group.href?"a":"div");return(c,r)=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(m)),{class:e.normalizeClass([e.unref(f).button,{[e.unref(f).topButton]:t.depth===0,[e.unref(f).leafButton]:t.depth,"text-indigo-500 dark:text-indigo-200":l.group.active}]),href:l.group.href,onClick:r[0]||(r[0]=()=>{t.collapsible&&(n.value=!n.value)})},{default:e.withCtx(()=>[l.collapsible?(e.openBlock(),e.createBlock(e.unref(C),{key:0,"stroke-color":"gray-400",size:t.depth?"8":"16",class:e.normalizeClass(["absolute left-0 transform transition-transform",{"rotate-0":n.value,"-rotate-90":!n.value,"ml-[16px]":t.depth}])},null,8,["size","class"])):e.createCommentVNode("",!0),e.createTextVNode(" "+e.toDisplayString(t.group.text),1)]),_:1},8,["class","href"])),l.collapsible&&t.depth>=0&&n.value&&t.group.items.some(i=>"href"in i&&i.active)?(e.openBlock(),e.createElementBlock("div",{key:0,class:"absolute h-[36px] w-[4px] z-10 rounded-full bg-indigo-500 transition-all duration-300 ml-[6px] mt-[48px]",style:e.normalizeStyle({top:`${e.unref(h)}px`,left:`-${t.depth===0?0:t.depth*7.5+1}px`})},null,4)):e.createCommentVNode("",!0),e.withDirectives(e.createElementVNode("ul",{class:e.normalizeClass(["list-none p-0 ml-[7.5px]",{"border-l border-gray-100":t.depth===0&&l.collapsible}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.group.items,i=>(e.openBlock(),e.createElementBlock(e.Fragment,null,[i&&"items"in i?(e.openBlock(),e.createElementBlock("li",w,[e.createVNode(k,{ref_for:!0,ref_key:"$groups",ref:d,group:i,depth:t.depth+1,collapsible:l.collapsible},null,8,["group","depth","collapsible"])])):(e.openBlock(),e.createBlock(g,{key:1,item:i,depth:t.depth,collapsible:t.collapsible},null,8,["item","depth","collapsible"]))],64))),256))],2),[[e.vShow,n.value]])],64))}}),E={class:"overflow-y-hidden list-none p-0"},N={key:0,class:"relative list-none p-0"};return e.defineComponent({__name:"DocMenu",props:{items:null,collapsible:{type:Boolean,default:!0}},setup(t){return(o,l)=>(e.openBlock(),e.createElementBlock("ul",E,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.items,n=>(e.openBlock(),e.createElementBlock(e.Fragment,null,["items"in n?(e.openBlock(),e.createElementBlock("li",N,[e.createVNode(k,{group:n,depth:0,collapsible:t.collapsible},null,8,["group","collapsible"])])):(e.openBlock(),e.createBlock(g,{key:1,item:n,collapsible:t.collapsible},null,8,["item","collapsible"]))],64))),256))]))}})});
2
2
  //# sourceMappingURL=index.umd.js.map
3
3
 
4
- /* <windicss-keep class="overflow-y-hidden list-none p-0 relative absolute left-0 transform transition-transform rotate-0 -rotate-90 ml-[16px] h-[36px] w-[4px] z-10 rounded-full bg-indigo-500 transition-all duration-300 ml-[6px] mt-[48px] ml-[7.5px] border-l border-gray-100 icon-dark-gray-400 pl-[16px] block w-full pl-[24px] text-indigo-500 dark:text-indigo-200 py-[8px] text-[16px] leading-[24px] leading-[20px] text-[14px] py-[12px] h-[80%] top-[10%] hidden group-hover:block bg-gray-300 flex py-[10px] items-center font-medium pl-[40px]"> */
4
+ /* <wind-keep class="overflow-y-hidden list-none p-0 relative text-indigo-500 dark:text-indigo-200 absolute left-0 transform transition-transform rotate-0 -rotate-90 ml-[16px] h-[36px] w-[4px] z-10 rounded-full bg-indigo-500 transition-all duration-300 ml-[6px] mt-[48px] ml-[7.5px] border-l border-gray-100 icon-dark-gray-400 pl-[16px] block w-full pl-[24px] py-[8px] text-[16px] leading-[24px] leading-[20px] text-[14px] py-[12px] h-[80%] top-[10%] hidden group-hover:block bg-gray-300 flex py-[10px] items-center font-medium pl-[40px]"> */