@farris/ui-vue/components/dropdown/index.umd.cjs

Farris Vue, a Farris Design based Vue3 component library.

(function(k,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue"),require("lodash-es")):typeof define=="function"&&define.amd?define(["exports","vue","lodash-es"],n):(k=typeof globalThis<"u"?globalThis:k||self,n(k.dropdown={},k.Vue,k.LodashES))})(this,function(k,n,L){"use strict";const z={},W={};function F(e){const{properties:t,title:l,ignore:o}=e,i=o&&Array.isArray(o),c=Object.keys(t).reduce((d,f)=>((!i||!o.find(B=>B===f))&&(d[f]=t[f].type==="object"&&t[f].properties?F(t[f]):L.cloneDeep(t[f].default)),d),{});if(l&&(!i||!o.find(d=>d==="id"))){const d=l.toLowerCase().replace(/-/g,"_");c.id=`${d}_${Math.random().toString().slice(2,6)}`}return c}function G(e){const{properties:t,title:l,required:o}=e;if(o&&Array.isArray(o)){const i=o.reduce((c,d)=>(c[d]=t[d].type==="object"&&t[d].properties?F(t[d]):L.cloneDeep(t[d].default),c),{});if(l&&o.find(c=>c==="id")){const c=l.toLowerCase().replace(/-/g,"_");i.id=`${c}_${Math.random().toString().slice(2,6)}`}return i}return{type:l}}function _(e,t={},l){const o=z[e];if(o){let i=G(o);const c=W[e];return i=c?c({getSchemaByType:_},i,t,l):i,i}return null}function J(e,t){const l=F(t);return Object.keys(l).reduce((o,i)=>(Object.prototype.hasOwnProperty.call(e,i)&&(o[i]&&L.isPlainObject(o[i])&&L.isPlainObject(e[i]||!e[i])?Object.assign(o[i],e[i]||{}):o[i]=e[i]),o),l),l}function X(e,t){return Object.keys(e).filter(o=>e[o]!=null).reduce((o,i)=>{if(t.has(i)){const c=t.get(i);if(typeof c=="string")o[c]=e[i];else{const d=c(i,e[i],e);Object.assign(o,d)}}else o[i]=e[i];return o},{})}function Q(e,t,l=new Map){const o=J(e,t);return X(o,l)}function P(e={}){function t(a,u,s,m){if(typeof s=="number")return m[a].length===s;if(typeof s=="object"){const h=Object.keys(s)[0],b=s[h];if(h==="not")return Number(m[a].length)!==Number(b);if(h==="moreThan")return Number(m[a].length)>=Number(b);if(h==="lessThan")return Number(m[a].length)<=Number(b)}return!1}function l(a,u,s,m){return m[a]&&m[a].propertyValue&&String(m[a].propertyValue.value)===String(s)}const o=new Map([["length",t],["getProperty",l]]);Object.keys(e).reduce((a,u)=>(a.set(u,e[u]),a),o);function i(a,u){const s=a;return typeof u=="number"?[{target:s,operator:"length",param:null,value:Number(u)}]:typeof u=="boolean"?[{target:s,operator:"getProperty",param:a,value:!!u}]:typeof u=="object"?Object.keys(u).map(m=>{if(m==="length")return{target:s,operator:"length",param:null,value:u[m]};const h=m,b=u[m];return{target:s,operator:"getProperty",param:h,value:b}}):[]}function c(a){return Object.keys(a).reduce((s,m)=>{const h=i(m,a[m]);return s.push(...h),s},[])}function d(a,u){if(o.has(a.operator)){const s=o.get(a.operator);return s&&s(a.target,a.param,a.value,u)||!1}return!1}function f(a,u){return c(a).reduce((h,b)=>h&&d(b,u),!0)}function B(a,u){const s=Object.keys(a),m=s.includes("allOf"),h=s.includes("anyOf"),b=m||h,y=(b?a[b?m?"allOf":"anyOf":"allOf"]:[a]).map($=>f($,u));return m?!y.includes(!1):y.includes(!0)}return{parseValueSchema:B}}const C={},x={};P();function K(e,t,l=new Map,o=(d,f,B,a)=>f,i={},c=d=>d){return z[t.title]=t,W[t.title]=o,C[t.title]=i,x[t.title]=c,(d={},f=!0)=>{if(!f)return X(d,l);const B=Q(d,t,l),a=Object.keys(e).reduce((u,s)=>(u[s]=e[s].default,u),{});return Object.assign(a,B)}}function I(e,t){return{customClass:t.class,customStyle:t.style}}function ee(e,t,l){return t}const te=new Map([["appearance",I]]),ne={$schema:"https://json-schema.org/draft/2020-12/schema",$id:"https://farris-design.gitee.io/dropdown.schema.json",title:"dropdown",description:"A Farris Component",type:"object",properties:{id:{description:"The unique identifier for dropdown",type:"string"},type:{description:"The type string of dropdown",type:"string",default:"dropdown"},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"]},oe={title:"dropdown",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:[]}}}},behavior:{description:"Basic Infomation",title:"行为",properties:{readonly:{description:"",title:"只读",type:"string"},required:{description:"",title:"必填",type:"boolean"},visible:{description:"",title:"可见",type:"boolean"},placeholder:{description:"",title:"提示文本",type:"string"},tabindex:{description:"",title:"tab索引",type:"number"}}}}},A={show:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},title:{type:String,default:"下拉示例"},size:{type:String,default:""},type:{type:String,default:"primary"},iconClass:{type:String,default:""},active:{type:Boolean,default:!1},splitButton:{type:Boolean,default:!1},position:{type:String,default:"bottom"},model:{type:Array,default:[{label:"项目一",value:"XM1"},{label:"项目二",value:"XM2"},{label:"项目三",value:"XM3"}]},onSelect:{type:Function,default:()=>{}}},q=K(A,ne,te,ee,oe);function Y(e,t){let l;const o=n.ref(e.show),i=n.ref(),c=n.ref(),d=n.ref(),f=10;n.onMounted(()=>{l=c.value});const B=(y=1)=>{const r=["body>.f-datagrid-settings-simple-host","body>div","body>farris-dialog>.farris-modal.show","body>.farris-modal.show","body>farris-filter-panel>.f-filter-panel-wrapper","body .f-sidebar-show>.f-sidebar-main","body>.popover.show","body>filter-row-panel>.f-datagrid-filter-panel","body>.f-section-maximize"],$=Array.from(document.body.querySelectorAll(r.join(","))).filter(S=>S).map(S=>{const{display:H,zIndex:T}=window.getComputedStyle(S);return H==="none"?0:parseInt(T,10)}).filter(S=>S);let N=Math.max(...$);return N<1040&&(N=1040),N+y},a=(y,r)=>{const{height:$,left:N,top:S,width:H}=y.getBoundingClientRect(),{width:T,height:p,top:v}=r.getBoundingClientRect();if(y.className.indexOf("dropdown-submenu")>-1||y.closest(".dropdown-submenu")||y.classList.contains("dropright")){const g=window.innerWidth-N-y.offsetWidth,D=window.innerHeight-S,{position:V}=getComputedStyle(r);if(V==="fixed"){let E=N+y.offsetWidth;r.offsetWidth>g&&N>g&&(E=N-T),r.style.left=E+"px",r.style.right="auto",window.innerHeight-2*f<r.offsetHeight?(r.style.top=f+"px",r.style.bottom=f+"px",r.style.maxHeight=window.innerHeight-2*f+"px",r.style.overflowY="auto",r.className+=" dropdown-menu-maxheight"):D<r.offsetHeight?(r.style.top="auto",r.style.bottom=f+"px"):(r.style.top=S+"px",r.style.bottom="auto")}else{if(r.offsetWidth>g){const E=-T;r.style.left=E+"px"}window.innerHeight-2*f<r.offsetHeight?(r.style.top=-1*(S-f)+"px",r.style.bottom="auto",r.style.maxHeight=window.innerHeight-2*f+"px",r.style.overflowY="auto",r.className+=" dropdown-menu-maxheight"):D<r.offsetHeight&&(r.style.top=D-r.offsetHeight-f+"px",r.style.bottom="auto")}}else{const{marginTop:g,marginBottom:D}=getComputedStyle(r);let V=0;const E=Math.ceil(parseFloat(g))+Math.ceil(parseFloat(D));let j=S+$,Z=N;window.innerHeight-j-E<p&&(j=S-p,j<0&&(window.innerHeight-S-$>S?(j=S+$,V=window.innerHeight-j-E-f):(j=f,V=S-j-E))),window.innerWidth-N<T&&window.innerWidth-N<N+H&&(Z=N-T+H),document.body.append(r),r.style.cssText=`position:fixed;bottom:unset;left:${Z}px
             !important;top:${j}px !important;right: unset;${V?"max-height:"+V+"px;overflow-y:auto;":""}`,V&&(r.className+=" dropdown-menu-maxheight"),r.style.zIndex=B().toString()}},u=()=>{a(i.value,c.value)},s=()=>{e.hover||(o.value=!1,document.removeEventListener("click",s),l.removeEventListener("click",s),document.removeEventListener("scroll",s),l.removeEventListener("scroll",s))};return{show:o,dropdownRef:i,dropdownMenuRef:c,clickEventRef:d,showDropMenu:y=>{e.hover||e.disabled||(y==null||y.stopPropagation(),o.value||setTimeout(()=>{u()}),o.value=!o.value,document.addEventListener("click",s),document.addEventListener("scroll",s),e.hideOnClick||(l.addEventListener("click",r=>{r.stopPropagation()}),l.addEventListener("scroll",r=>{r.stopPropagation()})))},hoverDropdown:y=>{e.hover&&(o.value||setTimeout(()=>{}),o.value=!o.value)},leftButtonClick:()=>{},closeDropMenu:s,selectItem:y=>{t.emit("select",y)},resolveSize:y=>{const r=/px|em|rem|pt|%/;return r.test(y)?`${parseInt(y,10)}${y.match(r)[0]}`:`${y}px`}}}const re={label:{type:String,default:"XM1"},value:{type:String||Number,default:"项目一"},disabled:{type:Boolean,default:!1},active:{type:Boolean,default:!1},divide:{type:Boolean,default:!1},onSelect:{type:Function,default:()=>{}}},U=n.defineComponent({name:"FDropdownItem",props:re,emits:["select"],setup(e,t){const l=n.ref(e.value),o=n.ref(e.label),i=n.ref(e.disabled),c=n.ref(e.active),d=n.ref(e.divide),f=()=>{i.value||t.emit("select",e)};return()=>n.createVNode("div",null,[n.withDirectives(n.createVNode("div",{class:"dropdown-divider"},null),[[n.vShow,d.value]]),n.createVNode("li",{class:`dropdown-item${c.value?" active":""} ${i.value?" disabled":""}`,onClick:f,title:l.value.toString()},[o.value])])}}),M=n.defineComponent({name:"FDropdown",props:A,emits:["select"],setup(e,t){const l=n.ref(e.model),{show:o,dropdownMenuRef:i,dropdownRef:c,clickEventRef:d,showDropMenu:f,hoverDropdown:B,leftButtonClick:a,closeDropMenu:u,selectItem:s,resolveSize:m}=Y(e,t);function h(b){t.emit("select",b)}return()=>n.createVNode("div",{ref:c},[n.createVNode("div",{class:["farris-dropdown","btn-group",{dropup:e.position==="top"},{dropdown:e.position==="bottom"},{dropleft:e.position==="left"},{dropright:e.position==="right"}]},[e.splitButton&&n.createVNode("span",{class:["btn",{"dropdown-item":e.nest},{"btn-lg":e.size==="large"},{"btn-sm":e.size==="small"},{"btn-primary":e.type==="primary"},{"btn-success":e.type==="success"},{"btn-warning":e.type==="warning"},{"btn-danger":e.type==="danger"},{"btn-info":e.type==="info"}],style:"width:100%",onClick:a},[e.title]),n.createVNode("span",{ref:d,class:["dropdown-toggle",{btn:!e.nest},{"dropdown-item":e.nest},{"dropdown-toggle-split":e.splitButton},{"btn-lg":e.size==="large"},{"btn-sm":e.size==="small"},{"btn-primary":e.type==="primary"},{"btn-success":e.type==="success"},{"btn-warning":e.type==="warning"},{"btn-danger":e.type==="danger"},{"btn-info":e.type==="info"},{"btn-secondary":e.type==="secondary"},{"btn-link":e.type==="link"},{disabled:e.disabled}],style:"width:100%",onClick:f,onMouseenter:B,onMouseleave:B},[n.withDirectives(n.createVNode("span",{class:"sr-only"},null),[[n.vShow,e.splitButton]]),e.splitButton?"":e.title,n.withDirectives(n.createVNode("span",{class:`f-icon ${e.iconClass.toString()}`},null),[[n.vShow,e.iconClass]])]),n.createVNode(n.Teleport,{to:"body"},{default:()=>[n.createVNode("div",{ref:i,class:`dropdown-menu${o.value?" show":""}`},[n.createVNode(n.Fragment,null,[l.value.map(({label:b,value:R,disabled:O,active:y,divide:r})=>n.createVNode(U,{value:R.toString(),label:b,disabled:O,active:y,divide:r,onSelect:$=>h($)},null))])])]})])])}});function ie(e,t,l){var T;const o="",i="",c=n.ref();function d(){return(t==null?void 0:t.schema.componentType)!=="frame"}function f(){return!1}function B(){return(t==null?void 0:t.schema.componentType)!=="frame"}function a(){return(t==null?void 0:t.schema.componentType)==="frame"}function u(p){if(!p||!p.value)return null;if(p.value.schema&&p.value.schema.type==="component")return p.value;const v=n.ref(p==null?void 0:p.value.parent),w=u(v);return w||null}function s(p=t){var D;const{componentInstance:v,designerItemElementRef:w}=p;if(!v||!v.value)return null;const{getCustomButtons:g}=v.value;return v.value.canMove||g&&((D=g())!=null&&D.length)?w:s(p.parent)}function m(p){return!!l}function h(){return(t==null?void 0:t.schema.label)||(t==null?void 0:t.schema.title)||(t==null?void 0:t.schema.name)}function b(){}function R(p,v){var w;!p||!v||(w=t==null?void 0:t.setupContext)==null||w.emit("dragEnd")}function O(p,v){const{componentType:w}=p;let g=_(w,p,v);const D=w.toLowerCase().replace(/-/g,"_");return g&&!g.id&&g.type===w&&(g.id=`${D}_${Math.random().toString().slice(2,6)}`),g}function y(p){}function r(...p){}function $(p){if(!p)return;const v=t==null?void 0:t.schema,{formSchemaUtils:w}=p;if(v&&w.getExpressions().length){const g=w.getExpressions().findIndex(D=>D.target===v.id);g>-1&&w.getExpressions().splice(g,1)}}function N(p){$(p),t!=null&&t.schema.contents&&t.schema.contents.map(v=>{let w=v.id;v.type==="component-ref"&&(w=v.component);const g=e.value.querySelectorAll(`#${w}-design-item`);g!=null&&g.length&&Array.from(g).map(D=>{var V;(V=D==null?void 0:D.componentInstance)!=null&&V.value.onRemoveComponent&&D.componentInstance.value.onRemoveComponent(p)})})}function S(){}function H(p){}return c.value={canMove:d(),canSelectParent:f(),canDelete:B(),canNested:!a(),contents:t==null?void 0:t.schema.contents,elementRef:e,parent:(T=t==null?void 0:t.parent)==null?void 0:T.componentInstance,schema:t==null?void 0:t.schema,styles:o,designerClass:i,canAccepts:m,getBelongedComponentInstance:u,getDraggableDesignItemElement:s,getDraggingDisplayText:h,getPropConfig:r,getDragScopeElement:b,onAcceptMovedChildElement:R,onChildElementMovedOut:y,addNewChildComponentSchema:O,triggerBelongedComponentToMoveWhenMoved:n.ref(!1),triggerBelongedComponentToDeleteWhenDeleted:n.ref(!1),onRemoveComponent:N,getCustomButtons:S,onPropertyChanged:H},c}const se=n.defineComponent({name:"FDropdownDesign",props:A,emits:["select"],setup(e,t){const l=n.ref(e.model),{show:o,showDropMenu:i,hoverDropdown:c,leftButtonClick:d,closeDropMenu:f,selectItem:B,resolveSize:a}=Y(e,t);function u(b){t.emit("select",b)}const s=n.ref(),m=n.inject("design-item-context"),h=ie(s,m);return n.onMounted(()=>{s.value.componentInstance=h}),t.expose(h.value),()=>n.createVNode("div",{ref:s},[n.createVNode("div",{class:["farris-dropdown","btn-group",{dropup:e.position==="top"},{dropdown:e.position==="bottom"},{dropleft:e.position==="left"},{dropright:e.position==="right"}],style:{width:e.width}},[e.splitButton&&n.createVNode("span",{class:["btn",{"dropdown-item":e.nest},{"btn-lg":e.size==="large"},{"btn-sm":e.size==="small"},{"btn-primary":e.type==="primary"},{"btn-success":e.type==="success"},{"btn-warning":e.type==="warning"},{"btn-danger":e.type==="danger"},{"btn-info":e.type==="info"}],style:"width:100%",onClick:d},[e.title]),n.createVNode("span",{class:["dropdown-toggle",{btn:!e.nest},{"dropdown-item":e.nest},{"dropdown-toggle-split":e.splitButton},{"btn-lg":e.size==="large"},{"btn-sm":e.size==="small"},{"btn-primary":e.type==="primary"},{"btn-success":e.type==="success"},{"btn-warning":e.type==="warning"},{"btn-danger":e.type==="danger"},{"btn-info":e.type==="info"},{"btn-secondary":e.type==="secondary"},{"btn-link":e.type==="link"},{disabled:e.disabled}],style:"width:100%",onClick:i,onMouseenter:c,onMouseleave:c},[n.withDirectives(n.createVNode("span",{class:"sr-only"},null),[[n.vShow,e.splitButton]]),e.splitButton?"":e.title,n.withDirectives(n.createVNode("span",{class:`f-icon ${e.iconClass.toString()}`},null),[[n.vShow,e.iconClass]])]),n.createVNode("div",{class:`dropdown-menu${o.value?" show":""}`},[n.createVNode(n.Fragment,null,[l.value.map(({label:b,value:R,disabled:O,active:y,divide:r})=>n.createVNode(U,{value:R.toString(),label:b,disabled:O,active:y,divide:r,onSelect:$=>u($)},null))])])])])}}),ae={install(e){e.component(M.name,M)},register(e,t,l,o){e.dropdown=M,t.dropdown=q},registerDesigner(e,t,l){e.dropdown=se,t.dropdown=q}};k.Dropdown=M,k.default=ae,k.dropdownProps=A,k.propsResolver=q,Object.defineProperties(k,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});