@dcrackel/meyersquaredui 1.0.38 → 1.0.40

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.
Files changed (20) hide show
  1. package/dist/meyersquaredui.es.js +1321 -178
  2. package/dist/meyersquaredui.umd.js +1 -1
  3. package/dist/style.css +1 -1
  4. package/package.json +1 -1
  5. package/src/index.js +8 -0
  6. package/src/stories/Atoms/BaseButton/BaseButton.vue +3 -3
  7. package/src/stories/Atoms/BaseText/BaseText.vue +1 -1
  8. package/src/stories/Organisms/Cards/ArticleCard/ArticleCard.stories.js +14 -4
  9. package/src/stories/Organisms/Cards/ArticleCard/ArticleCard.vue +10 -1
  10. package/src/stories/Organisms/Cards/FencerCard/FencerCard.stories.js +10 -15
  11. package/src/stories/Organisms/Cards/FencerCard/FencerCard.vue +12 -4
  12. package/src/stories/Organisms/Cards/Skeletons/ArticleCardSkeleton.vue +20 -0
  13. package/src/stories/Organisms/Cards/Skeletons/FencingCardSkeleton.vue +28 -0
  14. package/src/stories/Organisms/Cards/Skeletons/TournamentCardSkeleton.vue +45 -0
  15. package/src/stories/Organisms/Cards/TournamentCard/TournamentCard.stories.js +9 -7
  16. package/src/stories/Organisms/Cards/TournamentCard/TournamentCard.vue +10 -1
  17. package/src/stories/Organisms/GridLayout/GridLayout.stories.js +34 -98
  18. package/src/stories/Organisms/GridLayout/GridLayout.vue +6 -1
  19. package/src/stories/Templates/HomePage/{TestPage.stories.js → HomePage.stories.js} +17 -2
  20. package/src/stories/Templates/HomePage/{TestPage.vue → HomePage.vue} +17 -2
package/dist/meyersquaredui.umd.js CHANGED
@@ -1 +1 @@
1
- (function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s.MeyerSquaredUI={},s.Vue))})(this,function(s,e){"use strict";const d=(t,o)=>{const r=t.__vccOpts||t;for(const[i,l]of o)r[i]=l;return r},y={name:"BaseText",props:{tag:{type:String,default:"p",validator:t=>["h1","h2","h3","h4","h5","h6","p","span","div"].includes(t)},size:{type:String,default:"md"},color:{type:String,default:"primary"},hoverColor:{type:String,default:""},weight:{type:String,default:"normal",validator:t=>["thin","light","normal","semibold","bold"].includes(t)}},computed:{textClasses(){const t={xs:"text-xs",sm:"text-sm",md:"lg:text-base",lg:"text-lg",xl:"text-xl","2xl":"text-2xl","3xl":"text-3xl","4xl":"text-4xl","5xl":"text-5xl"},o={thin:"font-thin font-[100]",light:"font-light font-[300]",normal:"font-normal font-[400]",semibold:"font-semibold font-[600]",bold:"font-bold font-[700]"},r=this.hoverColor?`hover:text-${this.hoverColor}`:"";return`${this.size.split(" ").map(l=>{const[n,a]=l.includes(":")?l.split(":"):[null,l];return n?`${n}:${t[a]}`:t[a]}).filter(Boolean).join(" ")} ${o[this.weight]} text-${this.color} ${r} font-raleway`}}};function h(t,o,r,i,l,n){return e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.tag),{class:e.normalizeClass(n.textClasses)},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},8,["class"])}const m=d(y,[["render",h]]),u={name:"Icon",props:{icon:{type:String,required:!0},color:{type:String,default:"primary",validator:t=>["primary","secondary","accent"].includes(t)},size:{type:String,default:"md",validator:t=>["xs","sm","md","lg","xl","2xl","3xl"].includes(t)},type:{type:String,default:"fa-solid",validator:t=>["fa-thin","fa-sharp"].includes(t)}},computed:{colorClasses(){return{primary:"text-primary",secondary:"text-secondary",accent:"text-accent"}[this.color]||"text-primary"},sizeClasses(){return{xs:"text-xs",sm:"text-sm",md:"text-base",lg:"text-lg",xl:"text-xl","2xl":"text-2xl","3xl":"text-3xl"}[this.size]||"text-base"}}};function C(t,o,r,i,l,n){return e.openBlock(),e.createElementBlock("i",{class:e.normalizeClass([r.type,r.icon,n.colorClasses,n.sizeClasses]),onClick:o[0]||(o[0]=a=>t.$emit("click"))},null,2)}const p=d(u,[["render",C]]),w={name:"BaseButton",components:{BaseText:m,Icon:p},props:{label:{type:String,required:!0},altText:{type:String,default:null},size:{type:String,default:"md"},weight:{type:String,default:"normal"},color:{type:String,default:"primary",validator:t=>["primary","secondary","accent"].includes(t)},hoverColor:{type:String,default:"",validator:t=>["primary","secondary","accent"].includes(t)},backgroundColor:{type:String,default:"primary",validator:t=>["primary","secondary","accent"].includes(t)},border:{type:String,default:"none",validator:t=>["none","primary","secondary","accent","gradient1","gradient2"].includes(t)},padding:{type:String,default:"px-4 py-2"},iconName:{type:String,default:""},iconColor:{type:String,default:"primary",validator:t=>["primary","secondary","accent"].includes(t)},iconSize:{control:{type:"select",options:["xs","sm","md","lg","xl","2xl","3xl"]},description:"Icon size"},iconType:{type:String,default:"fa-solid",validator:t=>["fa-thin","fa-sharp"].includes(t)},align:{type:String,default:"center",validator:t=>["left","center","right","between"].includes(t)}},computed:{paddingClass(){return this.padding},textColorClass(){return{primary:"text-primary",secondary:"text-secondary",accent:"text-accent"}[this.color]||"text-primary"},backgroundClass(){return{primary:"bg-primary hover:bg-accent",secondary:"bg-secondary hover:bg-primary",accent:"bg-accent hover:bg-accent"}[this.backgroundColor]||"bg-primary"},borderClass(){return{none:"",primary:"border border-primary",secondary:"border border-secondary",accent:"border border-accent",gradient1:"border-gradient-rounded-1",gradient2:"border-gradient-rounded-2"}[this.border]||""},alignmentClass(){return{left:"justify-start",center:"justify-center",right:"justify-end",between:"justify-between"}[this.align]||"justify-center"}}},V=["title","aria-label"];function S(t,o,r,i,l,n){const a=e.resolveComponent("BaseText"),c=e.resolveComponent("Icon");return e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["rounded-md transition duration-300 ease-in-out",n.paddingClass,n.textColorClass,n.backgroundClass,n.borderClass]),title:r.altText||r.label,"aria-label":r.altText||r.label,onClick:o[0]||(o[0]=b=>t.$emit("click"))},[e.createElementVNode("div",{class:e.normalizeClass(["flex items-center",n.alignmentClass,"space-x-2"])},[e.createVNode(a,{color:r.color,hoverColor:r.hoverColor,size:r.size,weight:r.weight},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.label),1)]),_:1},8,["color","hoverColor","size","weight"]),e.createVNode(c,{icon:r.iconName,color:r.iconColor,size:r.iconSize,type:r.iconType},null,8,["icon","color","size","type"])],2)],10,V)}const g=d(w,[["render",S],["__scopeId","data-v-e983c5cf"]]),N={name:"InputField",props:{type:{type:String,default:"text"},placeholder:{type:String,default:"Search"},modelValue:{type:String,default:""}}},k=["type","placeholder"];function B(t,o,r,i,l,n){return e.openBlock(),e.createElementBlock("input",e.mergeProps({type:r.type,placeholder:r.placeholder},t.$attrs,{class:"bg-black text-secondary border-b-2 border-secondary focus:outline-none focus:border-accent w-full placeholder-secondary px-2 hover:border-accent duration-300 ease-in-out",onInput:o[0]||(o[0]=a=>t.$emit("update:modelValue",a.target.value))}),null,16,k)}const f=d(N,[["render",B]]),z={name:"SearchBox",components:{InputField:f,Icon:p},data(){return{searchQuery:""}},methods:{onSearch(){console.log("Search Query:",this.searchQuery)}}},A={class:"relative flex items-center w-full max-w-md"};function E(t,o,r,i,l,n){const a=e.resolveComponent("InputField"),c=e.resolveComponent("Icon");return e.openBlock(),e.createElementBlock("div",A,[e.createVNode(a,{modelValue:l.searchQuery,"onUpdate:modelValue":o[0]||(o[0]=b=>l.searchQuery=b),placeholder:"Search"},null,8,["modelValue"]),e.createVNode(c,{icon:"fa-search",color:"secondary",size:"sm",class:"absolute right-2",onClick:n.onSearch},null,8,["onClick"])])}const x=d(z,[["render",E]]),j="data:image/png;base64,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",_={name:"Header",components:{SearchBox:x,BaseText:m,BaseButton:g,Icon:p},data(){return{logo:j}}},T={class:"border-b border-lineGrey w-full bg-primary m-0"},G={class:"w-full hidden md:flex"},I={class:"w-[150px] h-[150px] bg-primary flex-shrink-0 flex items-center justify-center"},M=["src"],X={class:"flex w-full items-center border-r border-l border-lineGrey"},Z={class:"hidden lg:flex w-1/3 pl-20"},q={class:"ml-8 w-2/3 flex justify-around"},W={class:"w-[150px] h-[150px] bg-primary flex-shrink-0 flex items-center justify-center"},Y={class:"w-full flex md:hidden"},F={class:"m-2 flex justify-between w-full"},J=["src"];function L(t,o,r,i,l,n){const a=e.resolveComponent("SearchBox"),c=e.resolveComponent("BaseText"),b=e.resolveComponent("BaseButton"),ee=e.resolveComponent("Icon");return e.openBlock(),e.createElementBlock("header",T,[e.createElementVNode("section",G,[e.createElementVNode("div",I,[e.createElementVNode("img",{src:l.logo,alt:"Logo",class:"h-14 w-18 bg-accent"},null,8,M)]),e.createElementVNode("section",X,[e.createElementVNode("div",Z,[e.createVNode(a,{class:"w-24 md:w-32 lg:w-52 xl:w-64 bg-primary"})]),e.createElementVNode("nav",q,[e.createVNode(c,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"border-b-2 border-primary hover:border-accent pb-2 duration-300 ease-in-out"},{default:e.withCtx(()=>o[0]||(o[0]=[e.createTextVNode("Tournaments")])),_:1}),e.createVNode(c,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"border-b-2 border-primary hover:border-accent pb-2 duration-300 ease-in-out"},{default:e.withCtx(()=>o[1]||(o[1]=[e.createTextVNode("Clubs")])),_:1}),e.createVNode(c,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"border-b-2 border-primary hover:border-accent pb-2 duration-300 ease-in-out"},{default:e.withCtx(()=>o[2]||(o[2]=[e.createTextVNode("Leaderboard")])),_:1}),e.createVNode(c,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"border-b-2 border-primary hover:border-accent pb-2 duration-300 ease-in-out"},{default:e.withCtx(()=>o[3]||(o[3]=[e.createTextVNode("Contact")])),_:1})])]),e.createElementVNode("div",W,[e.createVNode(b,{backgroundColor:"primary",border:"secondary",color:"secondary",label:"Login",size:"xs"})])]),e.createElementVNode("section",Y,[e.createElementVNode("div",F,[e.createElementVNode("img",{src:l.logo,alt:"Logo",class:"h-6 w-9"},null,8,J),e.createVNode(ee,{icon:"fa-bars",color:"secondary",size:"xl",class:"",onClick:t.onSearch},null,8,["onClick"])])])])}const D=d(_,[["render",L]]),O={name:"HeroBanner",components:{BaseText:m,BaseButton:g},props:{imageSrc:{type:String,required:!0},title:{type:String,required:!0},description:{type:String,required:!0},buttonLabel:{type:String,required:!0}},data(){return{isMobile:!1}},computed:{backgroundStyle(){return{backgroundImage:`url(${this.imageSrc})`,backgroundSize:"cover",backgroundPosition:"center",backgroundRepeat:"no-repeat"}}},mounted(){this.checkScreenSize(),window.addEventListener("resize",this.checkScreenSize)},beforeDestroy(){window.removeEventListener("resize",this.checkScreenSize)},methods:{checkScreenSize(){this.isMobile=window.innerWidth<768},onClick(){this.$emit("button-click")}}},H={class:"relative w-full md:border-b md:border-l md:border-r border-lineGrey"},K=["src"],U={class:"hidden md:flex absolute inset-0 items-center justify-start px-8"},R={class:"text-left text-white max-w-lg"},Q={key:1,class:"flex justify-center text-left w-full px-6 py-8"},P={class:"w-full"};function v(t,o,r,i,l,n){const a=e.resolveComponent("BaseText"),c=e.resolveComponent("BaseButton");return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("section",{class:"relative w-full h-3/4 flex justify-center bg-primary m-0",style:e.normalizeStyle(n.backgroundStyle)},[o[0]||(o[0]=e.createElementVNode("div",{class:"hidden md:block w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"},null,-1)),e.createElementVNode("div",H,[l.isMobile?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("img",{key:0,src:r.imageSrc,alt:"Hero Image",class:"w-full h-full object-cover"},null,8,K)),e.createElementVNode("section",U,[e.createElementVNode("div",R,[e.createVNode(a,{color:"secondary",tag:"h1",size:"4xl",weight:"bold",class:"mb-4"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.title),1)]),_:1}),e.createVNode(a,{color:"secondary",tag:"p",size:"lg",weight:"normal",class:"mb-6"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.description),1)]),_:1}),e.createVNode(c,{label:r.buttonLabel,color:"secondary",border:"gradient1",onClick:n.onClick},null,8,["label","onClick"])])]),l.isMobile?(e.openBlock(),e.createElementBlock("div",Q,[e.createElementVNode("div",P,[e.createVNode(a,{color:"secondary",tag:"h1",size:"xl",weight:"bold",class:"mb-2 w-48"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.title),1)]),_:1}),e.createVNode(a,{color:"secondary",tag:"p",size:"xs",weight:"normal",class:"mb-6 w-48"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.description),1)]),_:1}),e.createVNode(c,{label:r.buttonLabel,size:"xs",color:"secondary",border:"gradient1",class:"w-1/2 m-auto",onClick:n.onClick},null,8,["label","onClick"])])])):e.createCommentVNode("",!0)]),o[1]||(o[1]=e.createElementVNode("div",{class:"hidden md:block w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"},null,-1))],4),o[2]||(o[2]=e.createElementVNode("section",{class:"hidden md:flex border-t border-lineGrey w-full bg-primary"},[e.createElementVNode("div",{class:"w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"}),e.createElementVNode("div",{class:"relative w-full border-b border-l border-r border-lineGrey h-36"}),e.createElementVNode("div",{class:"w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"})],-1))],64)}const $=d(O,[["render",v]]);s.BaseIcon=g,s.BaseText=m,s.Header=D,s.HeroBanner=$,s.Icon=p,s.InputField=f,s.Searchbox=x,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});
1
+ (function(c,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(c=typeof globalThis<"u"?globalThis:c||self,e(c.MeyerSquaredUI={},c.Vue))})(this,function(c,e){"use strict";const m=(o,t)=>{const r=o.__vccOpts||o;for(const[d,l]of t)r[d]=l;return r},I={name:"BaseText",props:{tag:{type:String,default:"p",validator:o=>["h1","h2","h3","h4","h5","h6","p","span","div"].includes(o)},size:{type:String,default:"md"},color:{type:String,default:"primary"},hoverColor:{type:String,default:""},weight:{type:String,default:"normal",validator:o=>["thin","light","normal","semibold","bold"].includes(o)}},computed:{textClasses(){const o={xs:"text-xs",sm:"text-sm",md:"lg:text-base",lg:"text-lg",xl:"text-xl","2xl":"text-2xl","3xl":"text-3xl","4xl":"text-4xl","5xl":"text-5xl"},t={thin:"font-thin font-[100]",light:"font-light font-[300]",normal:"font-normal font-[400]",semibold:"font-semibold font-[600]",bold:"font-bold font-[700]"},r=this.hoverColor?` hover:text-${this.hoverColor}`:"";return`${this.size.split(" ").map(l=>{const[a,n]=l.includes(":")?l.split(":"):[null,l];return a?`${a}:${o[n]}`:o[n]}).filter(Boolean).join(" ")} ${t[this.weight]} text-${this.color} ${r} font-raleway`}}};function T(o,t,r,d,l,a){return e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.tag),{class:e.normalizeClass(a.textClasses)},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"default")]),_:3},8,["class"])}const g=m(I,[["render",T]]),z={name:"Icon",props:{icon:{type:String,required:!0},color:{type:String,default:"primary",validator:o=>["primary","secondary","accent"].includes(o)},size:{type:String,default:"md",validator:o=>["xs","sm","md","lg","xl","2xl","3xl"].includes(o)},type:{type:String,default:"fa-solid",validator:o=>["fa-thin","fa-sharp"].includes(o)}},computed:{colorClasses(){return{primary:"text-primary",secondary:"text-secondary",accent:"text-accent"}[this.color]||"text-primary"},sizeClasses(){return{xs:"text-xs",sm:"text-sm",md:"text-base",lg:"text-lg",xl:"text-xl","2xl":"text-2xl","3xl":"text-3xl"}[this.size]||"text-base"}}};function F(o,t,r,d,l,a){return e.openBlock(),e.createElementBlock("i",{class:e.normalizeClass([r.type,r.icon,a.colorClasses,a.sizeClasses]),onClick:t[0]||(t[0]=n=>o.$emit("click"))},null,2)}const f=m(z,[["render",F]]),Q={name:"BaseButton",components:{BaseText:g,Icon:f},props:{label:{type:String,required:!0},altText:{type:String,default:null},size:{type:String,default:"md"},weight:{type:String,default:"normal"},color:{type:String,default:"primary",validator:o=>["primary","secondary","accent"].includes(o)},hoverColor:{type:String,default:"",validator:o=>["primary","secondary","accent"].includes(o)},backgroundColor:{type:String,default:"primary",validator:o=>["primary","secondary","accent"].includes(o)},border:{type:String,default:"none",validator:o=>["none","primary","secondary","accent","gradient1","gradient2"].includes(o)},padding:{type:String,default:"px-4 py-2"},iconName:{type:String,default:""},iconColor:{type:String,default:"primary",validator:o=>["primary","secondary","accent"].includes(o)},iconSize:{control:{type:"select",options:["xs","sm","md","lg","xl","2xl","3xl"]},description:"Icon size"},iconType:{type:String,default:"fa-solid",validator:o=>["fa-thin","fa-sharp"].includes(o)},align:{type:String,default:"center",validator:o=>["left","center","right","between"].includes(o)}},computed:{paddingClass(){return this.padding},textColorClass(){return{primary:"text-accent",secondary:"text-accent",accent:"text-accent"}[this.color]||"text-primary"},backgroundClass(){return{primary:"bg-primary hover:bg-accent",secondary:"bg-secondary hover:bg-primary",accent:"bg-accent hover:bg-accent"}[this.backgroundColor]||"bg-primary"},borderClass(){return{none:"",primary:"border border-primary",secondary:"border border-secondary",accent:"border border-accent",gradient1:"border-gradient-rounded-1",gradient2:"border-gradient-rounded-2"}[this.border]||""},alignmentClass(){return{left:"justify-start",center:"justify-center",right:"justify-end",between:"justify-between"}[this.align]||"justify-center"}}},D=["title","aria-label"];function L(o,t,r,d,l,a){const n=e.resolveComponent("BaseText"),s=e.resolveComponent("Icon");return e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["rounded-md transition duration-300 ease-in-out",a.paddingClass,a.textColorClass,a.backgroundClass,a.borderClass]),title:r.altText||r.label,"aria-label":r.altText||r.label,onClick:t[0]||(t[0]=i=>o.$emit("click"))},[e.createElementVNode("div",{class:e.normalizeClass(["flex items-center",a.alignmentClass,"space-x-2"])},[e.createVNode(n,{color:r.color,hoverColor:r.hoverColor,size:r.size,weight:r.weight},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.label),1)]),_:1},8,["color","hoverColor","size","weight"]),e.createVNode(s,{icon:r.iconName,color:r.iconColor,size:r.iconSize,type:r.iconType},null,8,["icon","color","size","type"])],2)],10,D)}const b=m(Q,[["render",L],["__scopeId","data-v-fa49375b"]]),K={name:"InputField",props:{type:{type:String,default:"text"},placeholder:{type:String,default:"Search"},modelValue:{type:String,default:""}}},G=["type","placeholder"];function j(o,t,r,d,l,a){return e.openBlock(),e.createElementBlock("input",e.mergeProps({type:r.type,placeholder:r.placeholder},o.$attrs,{class:"bg-black text-secondary border-b-2 border-secondary focus:outline-none focus:border-accent w-full placeholder-secondary px-2 hover:border-accent duration-300 ease-in-out",onInput:t[0]||(t[0]=n=>o.$emit("update:modelValue",n.target.value))}),null,16,G)}const p=m(K,[["render",j]]),Y={name:"SearchBox",components:{InputField:p,Icon:f},data(){return{searchQuery:""}},methods:{onSearch(){console.log("Search Query:",this.searchQuery)}}},_={class:"relative flex items-center w-full max-w-md"};function M(o,t,r,d,l,a){const n=e.resolveComponent("InputField"),s=e.resolveComponent("Icon");return e.openBlock(),e.createElementBlock("div",_,[e.createVNode(n,{modelValue:l.searchQuery,"onUpdate:modelValue":t[0]||(t[0]=i=>l.searchQuery=i),placeholder:"Search"},null,8,["modelValue"]),e.createVNode(s,{icon:"fa-search",color:"secondary",size:"sm",class:"absolute right-2",onClick:a.onSearch},null,8,["onClick"])])}const C=m(Y,[["render",M]]),V="data:image/png;base64,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",U={name:"Header",components:{SearchBox:C,BaseText:g,BaseButton:b,Icon:f},data(){return{logo:V}}},W={class:"border-b border-lineGrey w-full bg-primary m-0"},H={class:"w-full hidden md:flex"},R={class:"w-[150px] h-[150px] bg-primary flex-shrink-0 flex items-center justify-center"},Z=["src"],J={class:"flex w-full items-center border-r border-l border-lineGrey"},O={class:"hidden lg:flex w-1/3 pl-20"},X={class:"ml-8 w-2/3 flex justify-around"},q={class:"w-[150px] h-[150px] bg-primary flex-shrink-0 flex items-center justify-center"},P={class:"w-full flex md:hidden"},v={class:"m-2 flex justify-between w-full"},$=["src"];function ee(o,t,r,d,l,a){const n=e.resolveComponent("SearchBox"),s=e.resolveComponent("BaseText"),i=e.resolveComponent("BaseButton"),h=e.resolveComponent("Icon");return e.openBlock(),e.createElementBlock("header",W,[e.createElementVNode("section",H,[e.createElementVNode("div",R,[e.createElementVNode("img",{src:l.logo,alt:"Logo",class:"h-14 w-18 bg-accent"},null,8,Z)]),e.createElementVNode("section",J,[e.createElementVNode("div",O,[e.createVNode(n,{class:"w-24 md:w-32 lg:w-52 xl:w-64 bg-primary"})]),e.createElementVNode("nav",X,[e.createVNode(s,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"border-b-2 border-primary hover:border-accent pb-2 duration-300 ease-in-out"},{default:e.withCtx(()=>t[0]||(t[0]=[e.createTextVNode("Tournaments")])),_:1}),e.createVNode(s,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"border-b-2 border-primary hover:border-accent pb-2 duration-300 ease-in-out"},{default:e.withCtx(()=>t[1]||(t[1]=[e.createTextVNode("Clubs")])),_:1}),e.createVNode(s,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"border-b-2 border-primary hover:border-accent pb-2 duration-300 ease-in-out"},{default:e.withCtx(()=>t[2]||(t[2]=[e.createTextVNode("Leaderboard")])),_:1}),e.createVNode(s,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"border-b-2 border-primary hover:border-accent pb-2 duration-300 ease-in-out"},{default:e.withCtx(()=>t[3]||(t[3]=[e.createTextVNode("Contact")])),_:1})])]),e.createElementVNode("div",q,[e.createVNode(i,{backgroundColor:"primary",border:"secondary",color:"secondary",label:"Login",size:"xs"})])]),e.createElementVNode("section",P,[e.createElementVNode("div",v,[e.createElementVNode("img",{src:l.logo,alt:"Logo",class:"h-6 w-9"},null,8,$),e.createVNode(h,{icon:"fa-bars",color:"secondary",size:"xl",class:"",onClick:o.onSearch},null,8,["onClick"])])])])}const N=m(U,[["render",ee]]),te={name:"HeroBanner",components:{BaseText:g,BaseButton:b},props:{imageSrc:{type:String,required:!0},title:{type:String,required:!0},description:{type:String,required:!0},buttonLabel:{type:String,required:!0}},data(){return{isMobile:!1}},computed:{backgroundStyle(){return{backgroundImage:`url(${this.imageSrc})`,backgroundSize:"cover",backgroundPosition:"center",backgroundRepeat:"no-repeat"}}},mounted(){this.checkScreenSize(),window.addEventListener("resize",this.checkScreenSize)},beforeDestroy(){window.removeEventListener("resize",this.checkScreenSize)},methods:{checkScreenSize(){this.isMobile=window.innerWidth<768},onClick(){this.$emit("button-click")}}},re={class:"relative w-full md:border-b md:border-l md:border-r border-lineGrey"},oe=["src"],ae={class:"hidden md:flex absolute inset-0 items-center justify-start px-8"},ne={class:"text-left text-white max-w-lg"},se={key:1,class:"flex justify-center text-left w-full px-6 py-8"},le={class:"w-full"};function ie(o,t,r,d,l,a){const n=e.resolveComponent("BaseText"),s=e.resolveComponent("BaseButton");return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("section",{class:"relative w-full h-3/4 flex justify-center bg-primary m-0",style:e.normalizeStyle(a.backgroundStyle)},[t[0]||(t[0]=e.createElementVNode("div",{class:"hidden md:block w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"},null,-1)),e.createElementVNode("div",re,[l.isMobile?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("img",{key:0,src:r.imageSrc,alt:"Hero Image",class:"w-full h-full object-cover"},null,8,oe)),e.createElementVNode("section",ae,[e.createElementVNode("div",ne,[e.createVNode(n,{color:"secondary",tag:"h1",size:"4xl",weight:"bold",class:"mb-4"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.title),1)]),_:1}),e.createVNode(n,{color:"secondary",tag:"p",size:"lg",weight:"normal",class:"mb-6"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.description),1)]),_:1}),e.createVNode(s,{label:r.buttonLabel,color:"secondary",border:"gradient1",onClick:a.onClick},null,8,["label","onClick"])])]),l.isMobile?(e.openBlock(),e.createElementBlock("div",se,[e.createElementVNode("div",le,[e.createVNode(n,{color:"secondary",tag:"h1",size:"xl",weight:"bold",class:"mb-2 w-48"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.title),1)]),_:1}),e.createVNode(n,{color:"secondary",tag:"p",size:"xs",weight:"normal",class:"mb-6 w-48"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.description),1)]),_:1}),e.createVNode(s,{label:r.buttonLabel,size:"xs",color:"secondary",border:"gradient1",class:"w-1/2 m-auto",onClick:a.onClick},null,8,["label","onClick"])])])):e.createCommentVNode("",!0)]),t[1]||(t[1]=e.createElementVNode("div",{class:"hidden md:block w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"},null,-1))],4),t[2]||(t[2]=e.createElementVNode("section",{class:"hidden md:flex border-t border-lineGrey w-full bg-primary"},[e.createElementVNode("div",{class:"w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"}),e.createElementVNode("div",{class:"relative w-full border-b border-l border-r border-lineGrey h-36"}),e.createElementVNode("div",{class:"w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"})],-1))],64)}const u=m(te,[["render",ie]]),ce={name:"TournamentCardSkeleton"},de={class:"md:w-full mb-8 animate-pulse"};function me(o,t,r,d,l,a){return e.openBlock(),e.createElementBlock("div",de,t[0]||(t[0]=[e.createStaticVNode('<section class="hidden md:block"><div class="w-full h-52 bg-gray-300 mb-2 rounded-md"></div><div class="w-3/4 h-6 bg-gray-300 mb-1 rounded"></div><div class="w-2/3 h-4 bg-gray-300 mb-2 rounded"></div><div class="flex items-center mb-1"><div class="w-6 h-6 bg-gray-300 rounded-full mr-3"></div><div class="w-2/3 h-4 bg-gray-300 rounded"></div></div><div class="flex items-center"><div class="w-6 h-6 bg-gray-300 rounded-full mr-3"></div><div class="w-2/3 h-4 bg-gray-300 rounded"></div></div></section><section class="md:hidden flex-col items-start gap-2 border-b border-borderGray"><div class="flex flex-row"><div class="w-28 h-16 bg-gray-300 rounded-md"></div><div class="flex flex-col h-16 justify-center pl-2"><div class="w-3/4 h-6 bg-gray-300 rounded mb-1"></div><div class="w-1/2 h-4 bg-gray-300 rounded"></div></div></div><div class="flex justify-between pt-4 pb-2"><div class="flex justify-start w-5/12"><div class="w-2 h-2 bg-gray-300 rounded-full mr-1"></div><div class="w-2/3 h-4 bg-gray-300 rounded"></div></div><div class="flex justify-start mb-1 w-7/12"><div class="w-2 h-2 bg-gray-300 rounded-full mr-1"></div><div class="w-2/3 h-4 bg-gray-300 rounded"></div></div></div></section>',2)]))}const ge={name:"TournamentCard",components:{TournamentCardSkeleton:m(ce,[["render",me]]),BaseText:g,Icon:f},props:{data:{type:Object,required:!0},isLoading:{type:Boolean,default:!1}},data(){return{isImageError:!1}},mounted(){console.log(this.data)},computed:{image(){return!this.isImageError&&this.data.Images&&this.data.Images.length>0?this.data.Images[0].URL:"https://via.placeholder.com/300x200"},fallbackStyle(){return this.isImageError?{backgroundColor:"#f5f5f5",display:"flex",alignItems:"center",justifyContent:"center"}:{}},title(){return this.data&&this.data.Name||""},location(){return this.data&&this.data.Address?`${this.data.Address.Name} • ${this.data.Address.City}, ${this.data.Address.State}`:"Location Unavailable"},startDate(){return this.data&&this.formatDate(this.data.StartDate)},endDate(){return this.data&&this.formatDate(this.data.EndDate)},numberOfFencers(){return this.data&&this.data.NumberOfFencers?this.data.NumberOfFencers:0}},methods:{formatDate(o){return new Date(o).toLocaleDateString("en-US",{year:"numeric",month:"short",day:"numeric"})},imageError(){this.isImageError=!0}}},he={key:0,class:"max-w-80 md:w-full mb-8"},be={key:1,class:"max-w-80 md:w-full mb-8"},fe={class:"hidden md:block"},pe=["src"],xe={class:"flex items-center mb-1"},ye={class:"flex w-6 justify-center"},we={class:"flex items-center"},Ce={class:"flex w-6 justify-center"},Ve={class:"md:hidden flex-col items-start gap-2 border-b border-borderGray"},Ne={class:"flex flex-row"},ue=["src"],Be={class:"flex flex-col h-16 justify-center pl-2"},Ee={class:"flex justify-between pt-4 pb-2"},Ae={class:"flex justify-start w-5/12"},Se={class:"flex justify-start mb-1 w-7/12"};function ke(o,t,r,d,l,a){const n=e.resolveComponent("TournamentCardSkeleton"),s=e.resolveComponent("BaseText"),i=e.resolveComponent("Icon");return e.openBlock(),e.createElementBlock(e.Fragment,null,[r.isLoading?(e.openBlock(),e.createElementBlock("div",he,[e.createVNode(n)])):e.createCommentVNode("",!0),r.isLoading?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",be,[e.createElementVNode("section",fe,[e.createElementVNode("img",{src:a.image,alt:"Tournament Image",class:"w-full h-52 object-cover mb-2 rounded-md",onError:t[0]||(t[0]=(...h)=>a.imageError&&a.imageError(...h)),style:e.normalizeStyle(a.fallbackStyle)},null,44,pe),e.createVNode(s,{tag:"h3",size:"xl",weight:"semibold",class:"mb-1"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.title),1)]),_:1}),e.createVNode(s,{tag:"p",size:"sm",weight:"semibold",class:"mb-2"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.location),1)]),_:1}),e.createElementVNode("div",xe,[e.createElementVNode("span",ye,[e.createVNode(i,{icon:"fa-calendar",color:"accent",size:"sm",class:"mr-3 w-4"})]),e.createVNode(s,{tag:"p",size:"sm",class:""},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.startDate)+" to "+e.toDisplayString(a.endDate),1)]),_:1})]),e.createElementVNode("div",we,[e.createElementVNode("span",Ce,[e.createVNode(i,{icon:"fa-user-friends",color:"accent",size:"sm",class:"mr-3"})]),e.createVNode(s,{tag:"p",size:"sm",class:""},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.numberOfFencers)+" Registered Fencers",1)]),_:1})])]),e.createElementVNode("section",Ve,[e.createElementVNode("div",Ne,[e.createElementVNode("img",{src:a.image,alt:"Tournament Image",class:"w-28 h-16 object-cover rounded-md",onError:t[1]||(t[1]=(...h)=>a.imageError&&a.imageError(...h)),style:e.normalizeStyle(a.fallbackStyle)},null,44,ue),e.createElementVNode("div",Be,[e.createVNode(s,{tag:"h3",size:"lg",weight:"semibold",class:"mb-1"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.title),1)]),_:1}),e.createVNode(s,{tag:"p",size:"xs",weight:"semibold",class:"mb-1"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.location),1)]),_:1})])]),e.createElementVNode("div",Ee,[e.createElementVNode("div",Ae,[e.createVNode(i,{icon:"fa-user-friends",color:"accent",size:"xs",class:"mr-1"}),e.createVNode(s,{tag:"p",size:"xs",class:""},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.numberOfFencers)+" Registered",1)]),_:1})]),e.createElementVNode("div",Se,[e.createVNode(i,{icon:"fa-calendar",color:"accent",size:"xs",class:"mr-1 w-4"}),e.createVNode(s,{tag:"p",size:"xs",class:""},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.startDate)+" to "+e.toDisplayString(a.endDate),1)]),_:1})])])])]))],64)}const x=m(ge,[["render",ke]]),B="data:image/png;base64,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",Ie={name:"FencerCardSkeleton"},Te={class:"max-w-48 mr-4 md:mr-2 items-center animate-pulse"};function ze(o,t,r,d,l,a){return e.openBlock(),e.createElementBlock("section",Te,t[0]||(t[0]=[e.createStaticVNode('<div class="flex flex-col m-auto justify-center mb-4 items-center w-[130px]"><div class="w-[120px] h-[120px] md:w-32 md:h-32 rounded-full bg-gray-300"></div></div><div class="flex flex-col md:flex-row justify-center md:justify-around -mt-2 border-b border-borderGray z-10 pb-2 mb-2"><div class="flex items-center justify-around w-full"><div class="w-8 h-4 bg-gray-300 rounded mr-1"></div><div class="w-8 h-4 bg-gray-300 rounded"></div></div></div><div class="text-center"><div class="w-32 h-6 bg-gray-300 rounded mb-2 mx-auto"></div><div class="w-40 h-4 bg-gray-200 rounded mb-2 mx-auto"></div></div>',3)]))}const Fe={name:"FencerCard",components:{FencerCardSkeleton:m(Ie,[["render",ze]]),BaseText:g,defaultPortrait:B},props:{data:{type:Object,required:!0},index:{type:Number,required:!0},isLoading:{type:Boolean,default:!1}},data(){return{}},computed:{portrait(){return this.data.ProfileImage&&this.data.ProfileImage.URL?this.data.ProfileImage.URL:B},displayName(){return this.data.DisplayName},clubName(){return this.data.Club.Name},m2Rating(){const o=this.data.M2Ratings.find(t=>t.WeaponId===1);return o?o.FormattedRating:"U"},hrRating(){return this.data.HEMARatings&&this.data.HEMARatings[0]?this.data.HEMARatings[0].Rating:0}}},Qe={key:0,class:"max-w-72 p-4 bg-secondary rounded-lg flex flex-col items-start"},De={key:1,class:"max-w-72 mr-4 md:mr-2 items-center"},Le={class:"flex flex-col m-auto justify-center mb-4 items-center w-[130px]"},Ke=["src"],Ge={class:"flex flex-col md:flex-row justify-center md:justify-around -mt-2 border-b border-borderGray z-10 pb-2 mb-2"},je={class:"flex items-center justify-center"},Ye={class:"hidden md:flex items-center justify-center"};function _e(o,t,r,d,l,a){const n=e.resolveComponent("FencerCardSkeleton"),s=e.resolveComponent("BaseText");return e.openBlock(),e.createElementBlock(e.Fragment,null,[r.isLoading?(e.openBlock(),e.createElementBlock("div",Qe,[e.createVNode(n)])):e.createCommentVNode("",!0),r.isLoading?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("section",De,[e.createElementVNode("div",Le,[e.createElementVNode("img",{src:a.portrait,alt:"Fencer Portrait",class:"w-[120px] h-[120px] md:w-32 md:h-32 rounded-full object-cover z-1 flex-shrink-0"},null,8,Ke)]),e.createElementVNode("div",Ge,[e.createElementVNode("div",je,[e.createVNode(s,{tag:"p",size:"xs md:sm",weight:"semibold",class:"primary mr-1 block z-50"},{default:e.withCtx(()=>t[0]||(t[0]=[e.createTextVNode("M2: ")])),_:1}),e.createVNode(s,{tag:"p",size:"sm md:md",weight:"bold",class:"text-accent"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.m2Rating),1)]),_:1})]),e.createElementVNode("div",Ye,[e.createVNode(s,{tag:"p",size:"md",weight:"bold",class:"text-accent"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.hrRating),1)]),_:1}),e.createVNode(s,{tag:"p",size:"sm",weight:"semibold",class:"primary mr-1"},{default:e.withCtx(()=>t[1]||(t[1]=[e.createTextVNode(":HR")])),_:1})])]),e.createVNode(s,{tag:"h3",size:"sm md:xl",weight:"semibold",class:"text-center"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.displayName),1)]),_:1}),e.createVNode(s,{tag:"p",size:"xs md:sm",weight:"normal",class:"text-center h-10"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.clubName),1)]),_:1})]))],64)}const y=m(Fe,[["render",_e]]),Me={name:"ArticleCardSkeleton"},Ue={class:"w-full bg-secondary rounded-lg flex flex-col items-start animate-pulse"};function We(o,t,r,d,l,a){return e.openBlock(),e.createElementBlock("div",Ue,t[0]||(t[0]=[e.createStaticVNode('<div class="w-full h-40 bg-gray-200 rounded-t-md mb-4"></div><div class="w-3/4 h-6 bg-gray-200 rounded mb-2"></div><div class="w-full h-4 bg-gray-200 rounded mb-2"></div><div class="w-full h-4 bg-gray-200 rounded mb-2"></div><div class="w-1/2 h-4 bg-gray-200 rounded mb-4"></div><div class="w-full flex justify-end"><div class="w-1/4 h-4 bg-gray-200 rounded"></div></div>',6)]))}const He={name:"ArticleCard",components:{ArticleCardSkeleton:m(Me,[["render",We]]),BaseText:g},props:{data:{type:Object,required:!0},isLoading:{type:Boolean,default:!1}},computed:{image(){return this.data.image},articleTitle(){return this.data.articleTitle},truncatedDescription(){return this.data.description.length>120?this.data.description.substring(0,120)+" ...":this.data.description}},methods:{onReadMore(){this.$emit("read-more")}}},Re={key:0,class:"w-72 p-4 bg-secondary rounded-lg flex flex-col items-start"},Ze={key:1,class:"w-72 p-4 bg-secondary rounded-lg flex flex-col items-start"},Je=["src"];function Oe(o,t,r,d,l,a){const n=e.resolveComponent("ArticleCardSkeleton"),s=e.resolveComponent("BaseText");return e.openBlock(),e.createElementBlock(e.Fragment,null,[r.isLoading?(e.openBlock(),e.createElementBlock("div",Re,[e.createVNode(n)])):e.createCommentVNode("",!0),r.isLoading?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",Ze,[e.createElementVNode("img",{src:a.image,alt:"Article Image",class:"w-full h-40 object-cover rounded-t-md mb-4"},null,8,Je),e.createVNode(s,{tag:"h3",size:"xl",weight:"semibold",class:"mb-2"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.articleTitle),1)]),_:1}),e.createVNode(s,{tag:"p",size:"sm",weight:"normal",class:"mb-4 h-20"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(a.truncatedDescription),1)]),_:1}),e.createElementVNode("a",{href:"#",onClick:t[0]||(t[0]=e.withModifiers((...i)=>a.onReadMore&&a.onReadMore(...i),["prevent"])),class:"w-full flex justify-end pr-2"},[e.createVNode(s,{tag:"p",size:"sm",weight:"simibold",class:"mb-4 border-b border-secondary hover:border-accent"},{default:e.withCtx(()=>t[1]||(t[1]=[e.createTextVNode("Read More →")])),_:1})])]))],64)}const w=m(He,[["render",Oe]]),Xe={name:"GridLayout",components:{BaseButton:b,BaseText:g},props:{title:{type:String,default:"Section Title"},moreButtonLabel:{type:String,default:"See More"},cardComponent:{type:[Object,String],required:!0},items:{type:Array,required:!0,default:()=>[]},maxColumns:{type:Number,default:3},mobileHorizontal:{type:Boolean,default:!1},isLoading:{type:Boolean,default:!1}},computed:{gridClasses(){let o="md:grid md:gap-x-6 md:gap-y-4";this.mobileHorizontal&&(o=`${o} flex overflow-x-auto`);let t;switch(this.maxColumns){case 1:t="grid-cols-1";break;case 2:t="grid-cols-1 md:grid-cols-2";break;case 3:t="grid-cols-1 md:grid-cols-2 lg:grid-cols-3";break;case 4:t="grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4";break;case 5:t="grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4 2xl:grid-cols-5";break;default:t="grid-cols-1 md:grid-cols-2 lg:grid-cols-3"}return`${o} ${t}`}}},qe={class:"max-w-[1200px] mx-auto"},Pe={class:"w-full flex justify-center py-4 md:pb-10 md:pt-14"},ve={class:"w-full flex justify-center pb-10 pt-10 md:pt-14"};function $e(o,t,r,d,l,a){const n=e.resolveComponent("BaseText"),s=e.resolveComponent("BaseButton");return e.openBlock(),e.createElementBlock(e.Fragment,null,[e.createElementVNode("section",qe,[e.createElementVNode("div",Pe,[e.createVNode(n,{color:"primary",size:"2xl",tag:"h3",weight:"bold"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.title),1)]),_:1})]),e.createElementVNode("div",{class:e.normalizeClass(a.gridClasses)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(r.items,(i,h)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(r.cardComponent),{key:h,data:i,index:h,isLoading:r.isLoading},null,8,["data","index","isLoading"]))),128))],2)]),e.createElementVNode("div",ve,[e.createVNode(s,{backgroundColor:"secondary",border:"primary",size:"xs",color:"primary",hoverColor:"secondary",label:r.moreButtonLabel},null,8,["label"])])],64)}const E=m(Xe,[["render",$e]]),et={name:"SingleButtonBanner",components:{BaseText:g,BaseButton:b},props:{imageUrl:{type:String,default:"https://via.placeholder.com/1200x400"},description:{type:String,default:"Look for a Club? We can help."},buttonLabel:{type:String,default:"Learn More"}},methods:{onClick(){this.$emit("button-click")}}},tt={class:"flex flex-col justify-center items-center md:items-start h-full w-full text-center md:text-left px-6 md:px-20"};function rt(o,t,r,d,l,a){const n=e.resolveComponent("BaseText"),s=e.resolveComponent("BaseButton");return e.openBlock(),e.createElementBlock("section",{class:"relative bg-cover bg-center h-80 max-w-[1200px] mx-auto rounded-lg overflow-hidden mb-10",style:e.normalizeStyle({backgroundImage:"url("+r.imageUrl+")"})},[e.createElementVNode("div",tt,[e.createVNode(n,{color:"secondary",tag:"h3",size:"5xl",weight:"normal",class:"mb-8",innerHTML:r.description},null,8,["innerHTML"]),e.createVNode(s,{label:r.buttonLabel,size:"xs",color:"secondary",border:"gradient1",onClick:a.onClick,class:"w-40"},null,8,["label","onClick"])])],4)}const A=m(et,[["render",rt]]),ot={name:"DoubleButtonBanner",components:{BaseText:g,BaseButton:b},props:{imageSrc:{type:String,required:!0},title:{type:String,required:!0},buttonLabelOne:{type:String,required:!0},buttonLabelTwo:{type:String,required:!0}},methods:{onClickOne(){this.$emit("button-click-one")},onClickTwo(){this.$emit("button-click-one")}}},at={class:"max-w-[1200px] mx-auto"},nt={class:"relative w-full h-3/4 flex justify-center bg-primary m-0"},st={class:"relative w-full border-b border-l border-r border-lineGrey"},lt={class:"hidden md:flex h-80 justify-between items-center p-14"},it={class:"text-left text-white max-w-lg w-96"},ct={class:"flex flex-col w-1/3 align-right"},dt={class:"flex justify-center md:hidden text-left bg-primary w-full"},mt={class:"w-full px-6 py-8 text-center"};function gt(o,t,r,d,l,a){const n=e.resolveComponent("BaseText"),s=e.resolveComponent("BaseButton");return e.openBlock(),e.createElementBlock("section",at,[t[2]||(t[2]=e.createElementVNode("section",{class:"hidden md:flex border-t border-lineGrey w-full bg-primary"},[e.createElementVNode("div",{class:"w-[150px] h-[150px] bg-primary border-b border-lineGrey flex-shrink-0"}),e.createElementVNode("div",{class:"flex-grow h-[150px] border-b border-l border-r border-lineGrey"}),e.createElementVNode("div",{class:"w-[150px] h-[150px] bg-primary border-b border-lineGrey flex-shrink-0"})],-1)),e.createElementVNode("section",nt,[t[0]||(t[0]=e.createElementVNode("div",{class:"w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"},null,-1)),e.createElementVNode("div",st,[e.createElementVNode("section",lt,[e.createElementVNode("div",it,[e.createVNode(n,{color:"secondary",tag:"h1",size:"5xl",weight:"semibold",class:"mb-4"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.title),1)]),_:1})]),e.createElementVNode("div",ct,[e.createVNode(s,{label:r.buttonLabelOne,size:"xs",color:"secondary",border:"gradient1",weight:"normal",align:"between",class:"mb-4 w-52 h-16 pl-8",iconName:"fa-arrow-right-long",iconColor:"secondary",iconSize:"lg",iconType:"fa-thin",onClick:a.onClickOne},null,8,["label","onClick"]),e.createVNode(s,{label:r.buttonLabelTwo,size:"xs",color:"secondary",border:"gradient2",weight:"normal",class:"w-52 h-16 pl-8",iconName:"fa-arrow-right-long",iconColor:"secondary",iconSize:"lg",iconType:"fa-thin",align:"between",onClick:a.onClickOne},null,8,["label","onClick"])])])]),t[1]||(t[1]=e.createElementVNode("div",{class:"w-[150px] bg-primary border-b border-lineGrey flex-shrink-0"},null,-1))]),t[3]||(t[3]=e.createElementVNode("section",{class:"hidden md:flex border-t border-lineGrey w-full bg-primary"},[e.createElementVNode("div",{class:"w-[150px] h-[150px] bg-primary border-b border-lineGrey flex-shrink-0"}),e.createElementVNode("div",{class:"flex-grow h-[150px] border-b border-l border-r border-lineGrey"}),e.createElementVNode("div",{class:"w-[150px] h-[150px] bg-primary border-b border-lineGrey flex-shrink-0"})],-1)),e.createElementVNode("section",dt,[e.createElementVNode("div",mt,[e.createVNode(n,{color:"secondary",tag:"h1",size:"2xl",weight:"bold",class:"mb-2"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(r.title),1)]),_:1}),e.createVNode(n,{color:"secondary",tag:"p",size:"sm",weight:"normal",class:"mb-6"},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(o.description),1)]),_:1}),e.createVNode(s,{label:o.buttonLabel,size:"xs",color:"secondary",border:"gradient1",class:"w-1/2 m-auto",onClick:o.onClick},null,8,["label","onClick"])])])])}const S=m(ot,[["render",gt]]),ht={name:"Footer",components:{Icon:f,InputField:p,BaseButton:b,BaseText:g},data(){return{logo:V}}},bt={class:"flex flex-col bg-primary"},ft={class:"w-full hidden md:flex"},pt={class:"w-1/3"},xt={class:"items-center w-full flex justify-center"},yt=["src"],wt={class:"w-1/3 flex flex-col"},Ct={class:"w-full flex justify-around"},Vt={class:"flex w-1/3"},Nt={class:"flex w-1/3"},ut={class:"flex items-center w-1/3"},Bt={class:"w-full flex justify-around"},Et={class:"flex items-center w-1/3"},At={class:"flex items-center w-1/3"},St={class:"flex items-center w-1/3"},kt={class:"w-full flex justify-around"},It={class:"flex items-center w-1/3"},Tt={class:"flex items-center w-1/3"},zt={class:"flex w-1/3"},Ft={class:"w-1/3 flex flex-col"},Qt={class:"w-full flex justify-end"},Dt={class:"w-30 mr-16"},Lt={class:"w-full flex justify-end mt-12"},Kt={class:"w-48 mr-16"},Gt={class:"h-32 border border-t mt-10 pb-10 border-lineGrey flex flex-col justify-center items-center"};function jt(o,t,r,d,l,a){const n=e.resolveComponent("BaseText"),s=e.resolveComponent("InputField"),i=e.resolveComponent("Icon");return e.openBlock(),e.createElementBlock("section",bt,[t[12]||(t[12]=e.createElementVNode("div",{class:"h-20"},null,-1)),e.createElementVNode("section",ft,[e.createElementVNode("div",pt,[e.createElementVNode("div",xt,[e.createElementVNode("img",{src:l.logo,alt:"Logo",class:"w-[71px] h-[56px]"},null,8,yt)])]),e.createElementVNode("div",wt,[e.createElementVNode("div",Ct,[e.createElementVNode("div",Vt,[e.createVNode(n,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"pb-2"},{default:e.withCtx(()=>t[0]||(t[0]=[e.createTextVNode("Tournaments")])),_:1})]),e.createElementVNode("div",Nt,[e.createVNode(n,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"pb-2"},{default:e.withCtx(()=>t[1]||(t[1]=[e.createTextVNode("Clubs")])),_:1})]),e.createElementVNode("div",ut,[e.createVNode(n,{color:"secondary",size:"md",tag:"p",weight:"normal",class:"pb-2"},{default:e.withCtx(()=>t[2]||(t[2]=[e.createTextVNode("Leaderboard")])),_:1})])]),e.createElementVNode("div",Bt,[e.createElementVNode("div",Et,[e.createVNode(n,{color:"secondary",size:"sm",tag:"p",weight:"thin",class:"pb-2"},{default:e.withCtx(()=>t[3]||(t[3]=[e.createTextVNode("Upcoming")])),_:1})]),e.createElementVNode("div",At,[e.createVNode(n,{color:"secondary",size:"sm",tag:"p",weight:"thin",class:"pb-2"},{default:e.withCtx(()=>t[4]||(t[4]=[e.createTextVNode("Club List")])),_:1})]),e.createElementVNode("div",St,[e.createVNode(n,{color:"secondary",size:"sm",tag:"p",weight:"thin",class:"pb-2"},{default:e.withCtx(()=>t[5]||(t[5]=[e.createTextVNode("Top Fencers")])),_:1})])]),e.createElementVNode("div",kt,[e.createElementVNode("div",It,[e.createVNode(n,{color:"secondary",size:"sm",tag:"p",weight:"thin",class:"pb-2"},{default:e.withCtx(()=>t[6]||(t[6]=[e.createTextVNode("Past")])),_:1})]),e.createElementVNode("div",Tt,[e.createVNode(n,{color:"secondary",size:"sm",tag:"p",weight:"thin",class:"pb-2"},{default:e.withCtx(()=>t[7]||(t[7]=[e.createTextVNode("Local Clubs")])),_:1})]),e.createElementVNode("div",zt,[e.createVNode(n,{color:"secondary",size:"sm",tag:"p",weight:"thin",class:"pb-2"},{default:e.withCtx(()=>t[8]||(t[8]=[e.createTextVNode("By Weapon")])),_:1})])])]),e.createElementVNode("div",Ft,[e.createElementVNode("div",Qt,[e.createElementVNode("div",Dt,[e.createVNode(n,{color:"secondary",size:"md",tag:"p",weight:"thin",class:"pb-4"},{default:e.withCtx(()=>t[9]||(t[9]=[e.createTextVNode("Subscribe")])),_:1}),e.createVNode(s,{placeholder:"Email",type:"email",class:"w-52"})])]),e.createElementVNode("div",Lt,[e.createElementVNode("div",Kt,[e.createVNode(n,{color:"secondary",size:"md",tag:"p",weight:"thin",class:"pb-2"},{default:e.withCtx(()=>t[10]||(t[10]=[e.createTextVNode("Follow Us")])),_:1}),e.createElementVNode("div",null,[e.createVNode(i,{type:"fa-brands",icon:"fa-facebook",color:"secondary",size:"lg",class:"mr-4"}),e.createVNode(i,{type:"fa-brands",icon:"fa-discord",color:"secondary",size:"lg",class:"mr-4"}),e.createVNode(i,{type:"fa-brands",icon:"fa-instagram",color:"secondary",size:"lg",class:"mr-4"}),e.createVNode(i,{type:"fa-brands",icon:"fa-youtube",color:"secondary",size:"lg",class:"mr-4"})])])])])]),e.createElementVNode("div",Gt,[e.createVNode(n,{color:"secondary",size:"sm",tag:"p",weight:"normal",class:"text-center pt-4"},{default:e.withCtx(()=>t[11]||(t[11]=[e.createTextVNode("© Copyright Meyer Squared 2024. All rights reserved.")])),_:1})])])}const k=m(ht,[["render",jt]]),Yt={name:"HomePage",components:{Footer:k,DoubleButtonBanner:S,SingleButtonBanner:A,GridLayout:E,TournamentCard:x,ArticleCard:w,FencerCard:y,Header:N,HeroBanner:u},props:{title:{type:String,default:"Hero Banner Title"},description:{type:String,default:"This is the description that goes under the hero banner."},buttonLabel:{type:String,default:"Click Here"},imageSrc:{type:String,default:"https://meyersquared.com/images/Banner2.png"},tournaments:{type:Array,default:()=>[]},tournamentsIsLoading:{type:Boolean,default:!1},articles:{type:Array,default:()=>[]},articlesIsLoading:{type:Boolean,default:!1},topFencers:{type:Array,default:()=>[]},topFencersIsLoading:{type:Boolean,default:!1}},computed:{ArticleCard(){return w},FencerCard(){return y},limitedTournaments(){return this.tournaments.slice(0,6)}},data(){return{TournamentCard:x}}},_t={class:"m-0 w-full bg-secondary"};function Mt(o,t,r,d,l,a){const n=e.resolveComponent("Header"),s=e.resolveComponent("HeroBanner"),i=e.resolveComponent("GridLayout"),h=e.resolveComponent("SingleButtonBanner"),Wt=e.resolveComponent("DoubleButtonBanner"),Ht=e.resolveComponent("Footer");return e.openBlock(),e.createElementBlock("div",_t,[e.createVNode(n),e.createVNode(s,{title:r.title,buttonLabel:r.buttonLabel,description:r.description,imageSrc:r.imageSrc},null,8,["title","buttonLabel","description","imageSrc"]),e.createVNode(i,{cardComponent:l.TournamentCard,items:a.limitedTournaments,maxColumns:3,isLoading:r.articlesIsLoading,moreButtonLabel:"See All Tournaments",title:"Upcoming"},null,8,["cardComponent","items","isLoading"]),e.createVNode(h,{buttonLabel:"Learn More",description:"Look for a Club? <br> We can help.",imageUrl:"https://via.placeholder.com/1200x400"}),e.createVNode(i,{cardComponent:a.FencerCard,items:r.topFencers,maxColumns:5,mobileHorizontal:!0,isLoading:r.topFencersIsLoading,moreButtonLabel:"Leaderboards",title:"Top Fencers"},null,8,["cardComponent","items","isLoading"]),e.createVNode(Wt,{title:"How Does Meyer Squared work?","button-label-two":"Run a tournament","button-label-one":"Submit Results","image-src":""}),e.createVNode(i,{cardComponent:a.ArticleCard,items:r.articles,maxColumns:3,mobileHorizontal:!0,isLoading:r.articlesIsLoading,moreButtonLabel:"See More",title:"Interesting Articles"},null,8,["cardComponent","items","isLoading"]),e.createVNode(Ht)])}const Ut=m(Yt,[["render",Mt]]);c.ArticleCard=w,c.BaseIcon=b,c.BaseText=g,c.DoubleButtonBanner=S,c.FencerCard=y,c.Footer=k,c.GridLayout=E,c.Header=N,c.HeroBanner=u,c.HomePage=Ut,c.Icon=f,c.InputField=p,c.Searchbox=C,c.SingleButtonBanner=A,c.TournamentCard=x,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})});
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- .border-gradient-rounded-1[data-v-e983c5cf]{border:1px solid transparent;background:linear-gradient(to right,#000,#000),linear-gradient(to right,#ff7a00,#a3412a);background-clip:padding-box,border-box;background-origin:padding-box,border-box;transition:background-size .5s ease-in-out,color .5s ease-in-out}.border-gradient-rounded-1[data-v-e983c5cf]:hover{background:linear-gradient(to right,#ff7a00,#ffa238);color:#fff}.border-gradient-rounded-2[data-v-e983c5cf]{border:1px solid transparent;background:linear-gradient(to right,#000,#000),linear-gradient(to right,#009dff,#25e07c);background-clip:padding-box,border-box;background-origin:padding-box,border-box}.border-gradient-rounded-2[data-v-e983c5cf]:hover{background:linear-gradient(to right,#009dff,#25e07c);color:#fff}
1
+ .border-gradient-rounded-1[data-v-fa49375b]{border:1px solid transparent;background:linear-gradient(to right,#000,#000),linear-gradient(to right,#ff7a00,#a3412a);background-clip:padding-box,border-box;background-origin:padding-box,border-box;transition:background-size .5s ease-in-out,color .5s ease-in-out}.border-gradient-rounded-1[data-v-fa49375b]:hover{background:linear-gradient(to right,#ff7a00,#ffa238);color:#fff}.border-gradient-rounded-2[data-v-fa49375b]{border:1px solid transparent;background:linear-gradient(to right,#000,#000),linear-gradient(to right,#009dff,#25e07c);background-clip:padding-box,border-box;background-origin:padding-box,border-box}.border-gradient-rounded-2[data-v-fa49375b]:hover{background:linear-gradient(to right,#009dff,#25e07c);color:#fff}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@dcrackel/meyersquaredui",
3
3
  "private": false,
4
- "version": "1.0.38",
4
+ "version": "1.0.40",
5
5
  "type": "module",
6
6
  "main": "dist/meyersquaredui.cjs.js",
7
7
  "module": "dist/meyersquaredui.esm.js",
package/src/index.js CHANGED
@@ -7,4 +7,12 @@ export { default as Searchbox } from './stories/Molecules/Searchbox/Searchbox.vu
7
7
 
8
8
  export { default as Header } from './stories/Organisms/Headers/Header.vue'
9
9
  export { default as HeroBanner } from './stories/Organisms/HeroBanners/HomePage/HeroBanner.vue'
10
+ export { default as TournamentCard } from './stories/Organisms/Cards/TournamentCard/TournamentCard.vue'
11
+ export { default as FencerCard } from './stories/Organisms/Cards/FencerCard/FencerCard.vue'
12
+ export { default as ArticleCard } from './stories/Organisms/Cards/ArticleCard/ArticleCard.vue'
13
+ export { default as GridLayout } from './stories/Organisms/GridLayout/GridLayout.vue'
14
+ export { default as SingleButtonBanner } from './stories/Organisms/SectionBanners/SingleButtonBanner/SingleButtonBanner.vue'
15
+ export { default as DoubleButtonBanner } from './stories/Organisms/SectionBanners/DoubleButtonBanner/DoubleButtonBanner.vue'
16
+ export { default as Footer } from './stories/Organisms/Footer/Footer.vue'
10
17
 
18
+ export { default as HomePage } from './stories/Templates/HomePage/HomePage.vue'
package/src/stories/Atoms/BaseButton/BaseButton.vue CHANGED
@@ -5,7 +5,7 @@
5
5
  paddingClass,
6
6
  textColorClass,
7
7
  backgroundClass,
8
- borderClass,
8
+ borderClass
9
9
  ]"
10
10
  :title="altText || label"
11
11
  :aria-label="altText || label"
@@ -100,8 +100,8 @@ export default {
100
100
  },
101
101
  textColorClass() {
102
102
  const textColor = {
103
- primary: 'text-primary',
104
- secondary: 'text-secondary',
103
+ primary: 'text-accent',
104
+ secondary: 'text-accent',
105
105
  accent: 'text-accent',
106
106
  };
107
107
  return textColor[this.color] || 'text-primary';
package/src/stories/Atoms/BaseText/BaseText.vue CHANGED
@@ -54,7 +54,7 @@ export default {
54
54
  bold: 'font-bold font-[700]',
55
55
  };
56
56
 
57
- const hoverClass = this.hoverColor ? `hover:text-${this.hoverColor}` : '';
57
+ const hoverClass = this.hoverColor ? ` hover:text-${this.hoverColor}` : '';
58
58
 
59
59
  // Parse the size prop to allow responsive classes
60
60
  const sizeClassList = this.size
package/src/stories/Organisms/Cards/ArticleCard/ArticleCard.stories.js CHANGED
@@ -4,8 +4,13 @@ import mockArticles from "../../../../mocks/getArticles.js";
4
4
  export default {
5
5
  title: 'Organisms/Cards/ArticleCard',
6
6
  component: ArticleCard,
7
+ args: {
8
+ article: mockArticles[0],
9
+ isLoading: false
10
+ },
7
11
  argTypes: {
8
- onReadMore: { action: 'read-more' }
12
+ onReadMore: { action: 'read-more' },
13
+ isLoading: { control: 'boolean' }
9
14
  }
10
15
  };
11
16
 
@@ -19,7 +24,12 @@ const Template = (args) => ({
19
24
 
20
25
  export const Default = Template.bind({});
21
26
  Default.args = {
22
- image: 'https://via.placeholder.com/300x200',
23
- articleTitle: 'Exciting News in HEMA',
24
- description: 'Learn about the latest developments and events happening in the HEMA community. Stay informed and get the latest updates.',
27
+ data: mockArticles[0],
28
+ isLoading: false
29
+ };
30
+
31
+ export const Loading = Template.bind({});
32
+ Loading.args = {
33
+ data: mockArticles[0],
34
+ isLoading: true
25
35
  };
package/src/stories/Organisms/Cards/ArticleCard/ArticleCard.vue CHANGED
@@ -1,5 +1,8 @@
1
1
  <template>
2
- <div class="w-72 p-4 bg-secondary rounded-lg flex flex-col items-start">
2
+ <div v-if="isLoading" class="w-72 p-4 bg-secondary rounded-lg flex flex-col items-start">
3
+ <ArticleCardSkeleton />
4
+ </div>
5
+ <div v-if="!isLoading" class="w-72 p-4 bg-secondary rounded-lg flex flex-col items-start">
3
6
  <img :src="image" alt="Article Image" class="w-full h-40 object-cover rounded-t-md mb-4" />
4
7
 
5
8
  <BaseText tag="h3" size="xl" weight="semibold" class="mb-2">{{ articleTitle }}</BaseText>
@@ -13,10 +16,12 @@
13
16
 
14
17
  <script>
15
18
  import BaseText from "../../../Atoms/BaseText/BaseText.vue";
19
+ import ArticleCardSkeleton from "../Skeletons/ArticleCardSkeleton.vue";
16
20
 
17
21
  export default {
18
22
  name: 'ArticleCard',
19
23
  components: {
24
+ ArticleCardSkeleton,
20
25
  BaseText
21
26
  },
22
27
  props: {
@@ -24,6 +29,10 @@ export default {
24
29
  type: Object,
25
30
  required: true,
26
31
  },
32
+ isLoading: {
33
+ type: Boolean,
34
+ default: false,
35
+ }
27
36
  },
28
37
  computed: {
29
38
  image() {
package/src/stories/Organisms/Cards/FencerCard/FencerCard.stories.js CHANGED
@@ -1,4 +1,5 @@
1
1
  import FencerCard from './FencerCard.vue';
2
+ import mockTopFencers from "../../../../mocks/getTopFencers.js";
2
3
 
3
4
  export default {
4
5
  title: 'Organisms/Cards/FencerCard',
@@ -22,27 +23,21 @@ const Template = (args) => ({
22
23
 
23
24
  export const Default = Template.bind({});
24
25
  Default.args = {
25
- portrait: 'https://randomuser.me/api/portraits/women/26.jpg',
26
- displayName: 'John Doe',
27
- clubName: 'Awesome Fencing Club',
28
- m2Rating: 'A24',
29
- hrRating: 1567,
26
+ data: mockTopFencers[0]
30
27
  };
31
28
 
32
29
  export const HighRating = Template.bind({});
33
30
  HighRating.args = {
34
- portrait: '',
35
- displayName: 'Jane Smith',
36
- clubName: 'Elite Fencing Academy',
37
- m2Rating: 1500,
38
- hrRating: 1300,
31
+ data: mockTopFencers[0],
39
32
  };
40
33
 
41
34
  export const NoRating = Template.bind({});
42
35
  NoRating.args = {
43
- portrait: '',
44
- displayName: 'Unknown Fencer',
45
- clubName: 'No Club',
46
- m2Rating: null,
47
- hrRating: null,
36
+ data: mockTopFencers[0],
37
+ };
38
+
39
+ export const Loading = Template.bind({});
40
+ Loading.args = {
41
+ data: mockTopFencers[0],
42
+ isLoading: true
48
43
  };
package/src/stories/Organisms/Cards/FencerCard/FencerCard.vue CHANGED
@@ -1,7 +1,10 @@
1
1
  <template>
2
- <section class="mr-4 md:mr-2 items-center">
3
- <div class="flex flex-col m-auto justify-center mb-4 items-center w-[160px]">
4
- <img :src="portrait" alt="Fencer Portrait" class="w-[120px] h-[120px] md:w-40 md:h-40 rounded-full object-cover z-1 flex-shrink-0" />
2
+ <div v-if="isLoading" class="max-w-72 p-4 bg-secondary rounded-lg flex flex-col items-start">
3
+ <FencerCardSkeleton />
4
+ </div>
5
+ <section v-if="!isLoading" class="max-w-72 mr-4 md:mr-2 items-center">
6
+ <div class="flex flex-col m-auto justify-center mb-4 items-center w-[130px]">
7
+ <img :src="portrait" alt="Fencer Portrait" class="w-[120px] h-[120px] md:w-32 md:h-32 rounded-full object-cover z-1 flex-shrink-0" />
5
8
  </div>
6
9
  <!-- Ratings -->
7
10
  <div class="flex flex-col md:flex-row justify-center md:justify-around -mt-2 border-b border-borderGray z-10 pb-2 mb-2">
@@ -22,11 +25,12 @@
22
25
  <script>
23
26
  import BaseText from "../../../Atoms/BaseText/BaseText.vue";
24
27
  import defaultPortrait from '../../../../assets/images/portrait1.png'
28
+ import FencerCardSkeleton from "../Skeletons/FencingCardSkeleton.vue";
25
29
 
26
- // :style="{ flexShrink: '0', minWidth: '160px', minHeight: '160px' }"
27
30
  export default {
28
31
  name: 'FencerCard',
29
32
  components: {
33
+ FencerCardSkeleton,
30
34
  BaseText,
31
35
  defaultPortrait
32
36
  },
@@ -39,6 +43,10 @@ export default {
39
43
  type: Number,
40
44
  required: true,
41
45
  },
46
+ isLoading: {
47
+ type: Boolean,
48
+ default: false,
49
+ }
42
50
  },
43
51
  data() {
44
52
  return {
package/src/stories/Organisms/Cards/Skeletons/ArticleCardSkeleton.vue ADDED
@@ -0,0 +1,20 @@
1
+ <template>
2
+ <div class="w-full bg-secondary rounded-lg flex flex-col items-start animate-pulse">
3
+ <div class="w-full h-40 bg-gray-200 rounded-t-md mb-4"></div>
4
+
5
+ <div class="w-3/4 h-6 bg-gray-200 rounded mb-2"></div>
6
+ <div class="w-full h-4 bg-gray-200 rounded mb-2"></div>
7
+ <div class="w-full h-4 bg-gray-200 rounded mb-2"></div>
8
+ <div class="w-1/2 h-4 bg-gray-200 rounded mb-4"></div>
9
+
10
+ <div class="w-full flex justify-end">
11
+ <div class="w-1/4 h-4 bg-gray-200 rounded"></div>
12
+ </div>
13
+ </div>
14
+ </template>
15
+
16
+ <script>
17
+ export default {
18
+ name: 'ArticleCardSkeleton'
19
+ };
20
+ </script>
package/src/stories/Organisms/Cards/Skeletons/FencingCardSkeleton.vue ADDED
@@ -0,0 +1,28 @@
1
+ <template>
2
+ <section class="max-w-48 mr-4 md:mr-2 items-center animate-pulse">
3
+ <!-- Profile Image Skeleton -->
4
+ <div class="flex flex-col m-auto justify-center mb-4 items-center w-[130px]">
5
+ <div class="w-[120px] h-[120px] md:w-32 md:h-32 rounded-full bg-gray-300"></div>
6
+ </div>
7
+
8
+ <!-- Ratings Skeleton -->
9
+ <div class="flex flex-col md:flex-row justify-center md:justify-around -mt-2 border-b border-borderGray z-10 pb-2 mb-2">
10
+ <div class="flex items-center justify-around w-full">
11
+ <div class="w-8 h-4 bg-gray-300 rounded mr-1"></div>
12
+ <div class="w-8 h-4 bg-gray-300 rounded"></div>
13
+ </div>
14
+ </div>
15
+
16
+ <!-- Name and Club Skeleton -->
17
+ <div class="text-center">
18
+ <div class="w-32 h-6 bg-gray-300 rounded mb-2 mx-auto"></div>
19
+ <div class="w-40 h-4 bg-gray-200 rounded mb-2 mx-auto"></div>
20
+ </div>
21
+ </section>
22
+ </template>
23
+
24
+ <script>
25
+ export default {
26
+ name: 'FencerCardSkeleton'
27
+ };
28
+ </script>
package/src/stories/Organisms/Cards/Skeletons/TournamentCardSkeleton.vue ADDED
@@ -0,0 +1,45 @@
1
+ <template>
2
+ <div class="md:w-full mb-8 animate-pulse">
3
+ <!-- Desktop Version Skeleton -->
4
+ <section class="hidden md:block">
5
+ <div class="w-full h-52 bg-gray-300 mb-2 rounded-md"></div>
6
+ <div class="w-3/4 h-6 bg-gray-300 mb-1 rounded"></div>
7
+ <div class="w-2/3 h-4 bg-gray-300 mb-2 rounded"></div>
8
+ <div class="flex items-center mb-1">
9
+ <div class="w-6 h-6 bg-gray-300 rounded-full mr-3"></div>
10
+ <div class="w-2/3 h-4 bg-gray-300 rounded"></div>
11
+ </div>
12
+ <div class="flex items-center">
13
+ <div class="w-6 h-6 bg-gray-300 rounded-full mr-3"></div>
14
+ <div class="w-2/3 h-4 bg-gray-300 rounded"></div>
15
+ </div>
16
+ </section>
17
+
18
+ <!-- Mobile Version Skeleton -->
19
+ <section class="md:hidden flex-col items-start gap-2 border-b border-borderGray">
20
+ <div class="flex flex-row">
21
+ <div class="w-28 h-16 bg-gray-300 rounded-md"></div>
22
+ <div class="flex flex-col h-16 justify-center pl-2">
23
+ <div class="w-3/4 h-6 bg-gray-300 rounded mb-1"></div>
24
+ <div class="w-1/2 h-4 bg-gray-300 rounded"></div>
25
+ </div>
26
+ </div>
27
+ <div class="flex justify-between pt-4 pb-2">
28
+ <div class="flex justify-start w-5/12">
29
+ <div class="w-2 h-2 bg-gray-300 rounded-full mr-1"></div>
30
+ <div class="w-2/3 h-4 bg-gray-300 rounded"></div>
31
+ </div>
32
+ <div class="flex justify-start mb-1 w-7/12">
33
+ <div class="w-2 h-2 bg-gray-300 rounded-full mr-1"></div>
34
+ <div class="w-2/3 h-4 bg-gray-300 rounded"></div>
35
+ </div>
36
+ </div>
37
+ </section>
38
+ </div>
39
+ </template>
40
+
41
+ <script>
42
+ export default {
43
+ name: 'TournamentCardSkeleton',
44
+ };
45
+ </script>
package/src/stories/Organisms/Cards/TournamentCard/TournamentCard.stories.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import TournamentCard from './TournamentCard.vue';
2
-
2
+ import mockTournaments from "../../../../mocks/getTournamentsMock.js";
3
3
  export default {
4
4
  title: 'Organisms/Cards/TournamentCard',
5
5
  component: TournamentCard,
@@ -15,10 +15,12 @@ const Template = (args) => ({
15
15
 
16
16
  export const Default = Template.bind({});
17
17
  Default.args = {
18
- image: 'https://assets.simpleviewinc.com/simpleview/image/upload/c_fill,f_avif,h_800,q_65,w_1920/v1/clients/wausauwi/download_5__d27db8e0-a64a-4db5-8126-17033dab6712.jpg',
19
- title: 'National Fencing Tournament',
20
- location: 'New York City, NY',
21
- startDate: 'Jan 1, 2024',
22
- endDate: 'Jan 3, 2024',
23
- numberOfFencers: 120,
18
+ data: mockTournaments[0],
19
+ isLoading: false
20
+ };
21
+
22
+ export const Loading = Template.bind({});
23
+ Loading.args = {
24
+ data: mockTournaments[0],
25
+ isLoading: true
24
26
  };
package/src/stories/Organisms/Cards/TournamentCard/TournamentCard.vue CHANGED
@@ -1,5 +1,8 @@
1
1
  <template>
2
- <div class="md:w-full mb-8">
2
+ <div v-if="isLoading" class="max-w-80 md:w-full mb-8">
3
+ <TournamentCardSkeleton />
4
+ </div>
5
+ <div v-if="!isLoading" class="max-w-80 md:w-full mb-8">
3
6
  <!-- Desktop Version -->
4
7
  <section class="hidden md:block">
5
8
  <img
@@ -57,10 +60,12 @@
57
60
  <script>
58
61
  import BaseText from "../../../Atoms/BaseText/BaseText.vue";
59
62
  import Icon from "../../../Atoms/Icon/Icon.vue";
63
+ import TournamentCardSkeleton from "../Skeletons/TournamentCardSkeleton.vue";
60
64
 
61
65
  export default {
62
66
  name: 'TournamentCard',
63
67
  components: {
68
+ TournamentCardSkeleton,
64
69
  BaseText,
65
70
  Icon
66
71
  },
@@ -68,6 +73,10 @@ export default {
68
73
  data: {
69
74
  type: Object,
70
75
  required: true,
76
+ },
77
+ isLoading: {
78
+ type: Boolean,
79
+ default: false,
71
80
  }
72
81
  },
73
82
  data() {