cc-element-components/split/index.umd.js

该项目是基于`element-plus`二次封装组件，使用的技术栈为`vue3` + `typescript` + `element-plus`。在此项目当中，我们会基于`element-plus`的组件库已有组件封装如下组件: - 图标选择器 - 时间选择器 - 城市选择器 - 省市区选择器 - 通知菜单 - 趋势标记 - 评论 - 数据列表 - 数值统计 - 倒计时 - 分割面板 - 时间轴 - 弹框拓展 - 进度条拓展 - 导航菜单拓展 - 可配置项表格 - 可配置项表单 - 日历

var N=Object.defineProperty,B=Object.defineProperties;var b=Object.getOwnPropertyDescriptors;var h=Object.getOwnPropertySymbols;var C=Object.prototype.hasOwnProperty,R=Object.prototype.propertyIsEnumerable;var y=(e,t,i)=>t in e?N(e,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):e[t]=i,x=(e,t)=>{for(var i in t||(t={}))C.call(t,i)&&y(e,i,t[i]);if(h)for(var i of h(t))R.call(t,i)&&y(e,i,t[i]);return e},z=(e,t)=>B(e,b(t));(function(e,t){typeof exports=="object"&&typeof module!="undefined"?module.exports=t(require("vue")):typeof define=="function"&&define.amd?define(["vue"],t):(e=typeof globalThis!="undefined"?globalThis:e||self,e.index=t(e.Vue))})(this,function(e){"use strict";var t="",i=(l,a)=>{for(const[n,r]of a)l[n]=r;return l};const w={class:"cc-split-container-right"};var E=i(e.defineComponent({props:{direction:{default:"horizontal"},size:{default:0},min:{default:0},max:{default:1}},emits:["update:size","move-start","moving","move-end"],setup(l,{emit:a}){const n=l,r=e.ref(n.size),d=e.ref(null),p=e.ref(!1),f=e.computed(()=>n.direction==="horizontal"?{width:"6px",height:"100%"}:{width:"100%",height:"6px"}),o=e.computed(()=>n.direction==="horizontal"?{width:"4px",height:"1px",marginTop:"3px"}:{height:"6px",width:"1px",marginRight:"3px"}),S=e.computed(()=>`calc(${r.value*100}% - 3px)`),_=()=>{p.value=!0,document.addEventListener("mousemove",u),document.addEventListener("mouseup",g),a("move-start")},u=c=>{if(!!p.value){if(n.direction==="horizontal"){let m=d.value.getBoundingClientRect().width,s=d.value.getBoundingClientRect().left;r.value=(c.pageX-s)/m,r.value<=n.min&&(r.value=n.min),r.value>=n.max&&(r.value=n.max)}else{let m=d.value.getBoundingClientRect().height,s=d.value.getBoundingClientRect().top;r.value=(c.pageY-s)/m,r.value<=n.min&&(r.value=n.min),r.value>=n.max&&(r.value=n.max)}a("moving"),a("update:size",r.value)}},g=c=>{p.value=!1,document.removeEventListener("mousemove",u),document.removeEventListener("mouseup",g),a("move-end")};return(c,m)=>(e.openBlock(),e.createElementBlock("div",{class:"cc-split-container",ref:(s,V)=>{V.container=s,d.value=s},style:e.normalizeStyle({flexDirection:l.direction==="horizontal"?"row":"column"})},[e.createElementVNode("div",{class:"cc-split-container-left",style:e.normalizeStyle({flexBasis:e.unref(S)})},[e.renderSlot(c.$slots,"left",{},void 0,!0)],4),e.createElementVNode("div",{class:"cc-split-container-trigger",style:e.normalizeStyle(e.unref(f)),onMousedown:_},[e.createElementVNode("div",{class:"cc-split-container-trigger-wrapper",style:e.normalizeStyle(z(x({},e.unref(f)),{flexDirection:l.direction==="horizontal"?"column":"row"}))},[e.createElementVNode("div",{class:"cc-split-container-trigger-wrapper-bar",style:e.normalizeStyle(e.unref(o))},null,4),e.createElementVNode("div",{class:"cc-split-container-trigger-wrapper-bar",style:e.normalizeStyle(e.unref(o))},null,4),e.createElementVNode("div",{class:"cc-split-container-trigger-wrapper-bar",style:e.normalizeStyle(e.unref(o))},null,4),e.createElementVNode("div",{class:"cc-split-container-trigger-wrapper-bar",style:e.normalizeStyle(e.unref(o))},null,4),e.createElementVNode("div",{class:"cc-split-container-trigger-wrapper-bar",style:e.normalizeStyle(e.unref(o))},null,4),e.createElementVNode("div",{class:"cc-split-container-trigger-wrapper-bar",style:e.normalizeStyle(e.unref(o))},null,4),e.createElementVNode("div",{class:"cc-split-container-trigger-wrapper-bar",style:e.normalizeStyle(e.unref(o))},null,4),e.createElementVNode("div",{class:"cc-split-container-trigger-wrapper-bar",style:e.normalizeStyle(e.unref(o))},null,4)],4)],36),e.createElementVNode("div",w,[e.renderSlot(c.$slots,"right",{},void 0,!0)])],4))}}),[["__scopeId","data-v-2780c15c"]]),v={install(l){l.component("cc-split",E)}};return v});