@farris/ui-vue/designer/capsule/index.umd.cjs

Farris Vue, a Farris Design based Vue3 component library.

(function(a,d){typeof exports=="object"&&typeof module<"u"?d(exports,require("../../components/capsule/index.umd.js"),require("../../components/common/index.umd.js"),require("../../components/dynamic-resolver/index.umd.js"),require("vue"),require("../../components/designer-canvas/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","../../components/capsule/index.umd.js","../../components/common/index.umd.js","../../components/dynamic-resolver/index.umd.js","vue","../../components/designer-canvas/index.umd.js"],d):(a=typeof globalThis<"u"?globalThis:a||self,d(a.capsule={},a.FCapsule,a.common,a.dynamicResolver,a.Vue,a.designerCanvas))})(this,function(a,d,$,h,e,A){"use strict";const w={items:{Type:Array,default:[{name:"升序",value:"asc",icon:"f-icon f-icon-col-ascendingorder"},{name:"降序",value:"desc",icon:"f-icon f-icon-col-descendingorder"}]},modelValue:{type:String,default:""},type:{type:String,default:"primary"}},M={name:{type:String,default:""},value:{type:String,default:""},isActive:{type:Boolean,default:!1},icon:{type:String,default:""},index:{type:Number,default:0},show:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1}},R=e.defineComponent({name:"FCapsuleItem",props:M,emits:["mounted","active"],setup(n,c){const i=e.ref(),r=e.ref(n.isActive);e.watch(()=>n.isActive,l=>{r.value=l});const m=e.computed(()=>({"f-capsule-item":!0,"f-capsule-active-item":r.value,"f-capsule-disabled":n.disabled}));e.onMounted(()=>{c.emit("mounted",i,n.value)});function u(l){n.disabled||c.emit("active",l,{name:n.name,value:n.value})}return()=>e.createVNode("div",{ref:i,class:m.value,onClick:l=>u(l)},[n.icon&&e.createVNode("i",{class:n.icon},null),n.name])}}),p=e.defineComponent({name:"FCapsuleDesign",props:w,emits:["change","update:modelValue"],setup(n,c){const i=e.ref(n.items),r=e.ref(),m=2,u=e.ref(n.modelValue),l=e.ref("none"),b=e.ref(n.type),T=e.inject("design-item-context"),C=A.useDesignerComponent(r,T);e.onMounted(()=>{r.value.componentInstance=C}),c.expose(C.value);const P=e.computed(()=>{const t={"f-capsule-container":!0};return b.value&&(t[b.value]=!0),t}),k=e.computed(()=>({})),D=e.computed(()=>({"f-capsule":!0})),j=e.ref(m),I=e.ref(0),v=e.ref(0),F=e.computed(()=>({left:`${j.value}px`,width:`${I.value}px`,transition:l.value})),W=e.computed(()=>({width:`${v.value}px`})),f=new Map;function _(t){var s;if(f.has(t.value)){const o=(s=f.get(t.value))==null?void 0:s.value;if(o){const V=o.getBoundingClientRect(),G=r.value.getBoundingClientRect();j.value=V.left-G.left+m+r.value.scrollLeft,I.value=V.width-2*m}}}function x(t,s){const o=t.value;u.value=o,c.emit("update:modelValue",o),_(t),s&&c.emit("change",o)}function g(t){const s=i.value.findIndex(o=>o.value===t);s>-1&&x(i.value[s],!1)}e.watch(()=>n.modelValue,t=>{u.value=t,g(u.value)}),e.watch(()=>n.items,async t=>{i.value=t,await e.nextTick(),g(u.value),v.value=Array.from(f.values()).reduce((s,o)=>(s+=o.value.clientWidth,s),0)}),e.onMounted(async()=>{g(u.value),await e.nextTick(),l.value="0.1s ease-out all",v.value=Array.from(f.values()).reduce((t,s)=>(t+=s.value.clientWidth,t),0)});function E(t,s){x(s,!0)}function L(t,s){f.set(s,t)}function z(t,s){return e.createVNode(R,{name:t.name,value:t.value,isActive:t.value===u.value,index:s,onMounted:L,onActive:E},null)}return()=>e.createVNode("span",{ref:r,class:P.value,style:k.value},[e.createVNode("span",{class:"f-capsule-pane"},[i.value.map((t,s)=>z(t,s))]),e.createVNode("small",{class:D.value,style:F.value},null),e.createVNode("div",{class:"f-capsule-board",style:W.value},null)])}}),O={$schema:"https://json-schema.org/draft/2020-12/schema",$id:"https://farris-design.gitee.io/capsule.schema.json",title:"capsule",description:"A Farris Component",type:"object",properties:{id:{description:"The unique identifier for a capsule",type:"string"},type:{description:"The type string of capsule component",type:"string",default:"capsule"},appearance:{description:"",type:"object",properties:{class:{type:"string"},style:{type:"string"}},default:{}},binding:{description:"",type:"object",default:{}},disable:{type:"string",default:!1},editable:{description:"",type:"boolean",default:!0},placeholder:{description:"",type:"string",default:""},readonly:{description:"",type:"boolean",default:!1},require:{description:"",type:"boolean",default:!1},tabindex:{description:"",type:"number",default:-1},visible:{description:"",type:"boolean",default:!0}},required:["id","type"]},S=new Map([["appearance",h.resolveAppearance]]);function q(n,c,i){return c}const B={title:"capsule",description:"A Farris Component",type:"object",categories:{basic:{description:"Basic Infomation",title:"基本信息",properties:{id:{description:"组件标识",title:"标识",type:"string",readonly:!0},type:{description:"组件类型",title:"控件类型",type:"select",editor:{type:"waiting for modification",enum:[]}}}}}},y=h.createPropsResolver(d.capsuleProps,O,S,q,B);p.register=(n,c,i)=>{n.capsule=d,c.capsule=y},p.registerDesigner=(n,c,i)=>{n.capsule=p,c.capsule=y};const N=$.withInstall(p);a.CapsuleDesign=p,a.default=N,a.propsResolver=y,Object.defineProperties(a,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});