vue-amazing-ui/lib/skeleton/Skeleton.vue2.cjs

An Amazing Vue3 UI Components Library, Using TypeScript.

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),m={key:2,class:"skeleton-image"},d={key:3,class:"skeleton-header"},f={key:0,class:"skeleton-content"},b=e.defineComponent({__name:"Skeleton",props:{animated:{type:Boolean,default:!0},button:{type:[Boolean,Object],default:!1},avatar:{type:[Boolean,Object],default:!1},input:{type:[Boolean,Object],default:!1},image:{type:Boolean,default:!1},title:{type:[Boolean,Object],default:!0},paragraph:{type:[Boolean,Object],default:!0},loading:{type:Boolean,default:!0}},setup(n){const a=n,s=e.computed(()=>{if(typeof a.button=="object")return a.button.size==="large"?40:a.button.size==="small"?24:32}),u=e.computed(()=>typeof a.avatar=="boolean"?8:typeof a.avatar.size=="number"?(a.avatar.size-16)/2:{small:4,middle:8,large:12}[a.avatar.size||"middle"]),p=e.computed(()=>typeof a.title=="boolean"?"38%":typeof a.title.width=="number"?`${a.title.width}px`:a.title.width||"38%"),o=e.computed(()=>typeof a.paragraph=="boolean"?a.avatar?2:3:a.avatar?a.paragraph.rows||2:a.paragraph.rows||3),i=e.computed(()=>{if(typeof a.paragraph=="object"){if(Array.isArray(a.paragraph.width))return a.paragraph.width.map(t=>typeof t=="number"?`${t}px`:t);if(typeof a.paragraph.width=="number")return Array(o.value).fill(`${a.paragraph.width}px`);if(typeof a.paragraph.width=="string")return Array(o.value).fill(a.paragraph.width)}return Array(o.value)});return(t,l)=>t.loading?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["skeleton-wrap",{"skeleton-avatar":t.avatar,"skeleton-animated":t.animated}]),style:e.normalizeStyle(`--button-size: ${s.value}px; --title-top: ${u.value}px;`)},[t.button?(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(["skeleton-button",{"button-round":typeof t.button!="boolean"&&t.button.shape==="round","button-circle":typeof t.button!="boolean"&&t.button.shape==="circle","button-sm":typeof t.button!="boolean"&&t.button.size==="small","button-lg":typeof t.button!="boolean"&&t.button.size==="large","button-block":typeof t.button!="boolean"&&t.button.shape!=="circle"&&t.button.block}])},null,2)):e.createCommentVNode("",!0),t.input?(e.openBlock(),e.createElementBlock("span",{key:1,class:e.normalizeClass(["skeleton-input",{"input-sm":typeof t.input!="boolean"&&t.input.size==="small","input-lg":typeof t.input!="boolean"&&t.input.size==="large"}])},null,2)):e.createCommentVNode("",!0),t.image?(e.openBlock(),e.createElementBlock("div",m,[...l[0]||(l[0]=[e.createElementVNode("svg",{class:"image-svg",viewBox:"0 0 1098 1024",xmlns:"http://www.w3.org/2000/svg"},[e.createElementVNode("path",{class:"svg-path",d:"M365.714286 329.142857q0 45.714286-32.036571 77.677714t-77.677714 32.036571-77.677714-32.036571-32.036571-77.677714 32.036571-77.677714 77.677714-32.036571 77.677714 32.036571 32.036571 77.677714zM950.857143 548.571429l0 256-804.571429 0 0-109.714286 182.857143-182.857143 91.428571 91.428571 292.571429-292.571429zM1005.714286 146.285714l-914.285714 0q-7.460571 0-12.873143 5.412571t-5.412571 12.873143l0 694.857143q0 7.460571 5.412571 12.873143t12.873143 5.412571l914.285714 0q7.460571 0 12.873143-5.412571t5.412571-12.873143l0-694.857143q0-7.460571-5.412571-12.873143t-12.873143-5.412571zM1097.142857 164.571429l0 694.857143q0 37.741714-26.843429 64.585143t-64.585143 26.843429l-914.285714 0q-37.741714 0-64.585143-26.843429t-26.843429-64.585143l0-694.857143q0-37.741714 26.843429-64.585143t64.585143-26.843429l914.285714 0q37.741714 0 64.585143 26.843429t26.843429 64.585143z"})],-1)])])):e.createCommentVNode("",!0),t.avatar?(e.openBlock(),e.createElementBlock("div",d,[e.createElementVNode("span",{class:e.normalizeClass(["skeleton-avatar",{"avatar-sm":typeof t.avatar!="boolean"&&t.avatar.size==="small","avatar-lg":typeof t.avatar!="boolean"&&t.avatar.size==="large","avatar-square":typeof t.avatar!="boolean"&&t.avatar.shape==="square"}])},null,2)])):e.createCommentVNode("",!0),!t.button&&!t.image&&!t.input?(e.openBlock(),e.createElementBlock(e.Fragment,{key:4},[t.title||t.paragraph?(e.openBlock(),e.createElementBlock("div",f,[t.title?(e.openBlock(),e.createElementBlock("h3",{key:0,class:"skeleton-title",style:e.normalizeStyle({width:p.value})},null,4)):e.createCommentVNode("",!0),t.paragraph?(e.openBlock(),e.createElementBlock("ul",{key:1,class:e.normalizeClass(["skeleton-paragraph",{mt24:t.title,mt28:t.title&&t.avatar}])},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.value,r=>(e.openBlock(),e.createElementBlock("li",{key:r,style:e.normalizeStyle(`width: ${i.value[r-1]};`)},null,4))),128))],2)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],64)):e.createCommentVNode("",!0)],6)):e.renderSlot(t.$slots,"default",{key:1},void 0,!0)}});exports.default=b;