@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,E){"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,u)=>((!i||!o.find(D=>D===u))&&(d[u]=t[u].type==="object"&&t[u].properties?F(t[u]):E.cloneDeep(t[u].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 J(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]):E.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=J(o);const c=W[e];return i=c?c({getSchemaByType:_},i,t,l):i,i}return null}function Q(e,t){const l=F(t);return Object.keys(l).reduce((o,i)=>(Object.prototype.hasOwnProperty.call(e,i)&&(o[i]&&E.isPlainObject(o[i])&&E.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 U(e,t,l=new Map){const o=Q(e,t);return X(o,l)}function P(e={}){function t(a,p,s,m){if(typeof s=="number")return m[a].length===s;if(typeof s=="object"){const b=Object.keys(s)[0],g=s[b];if(b==="not")return Number(m[a].length)!==Number(g);if(b==="moreThan")return Number(m[a].length)>=Number(g);if(b==="lessThan")return Number(m[a].length)<=Number(g)}return!1}function l(a,p,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,p)=>(a.set(p,e[p]),a),o);function i(a,p){const s=a;return typeof p=="number"?[{target:s,operator:"length",param:null,value:Number(p)}]:typeof p=="boolean"?[{target:s,operator:"getProperty",param:a,value:!!p}]:typeof p=="object"?Object.keys(p).map(m=>{if(m==="length")return{target:s,operator:"length",param:null,value:p[m]};const b=m,g=p[m];return{target:s,operator:"getProperty",param:b,value:g}}):[]}function c(a){return Object.keys(a).reduce((s,m)=>{const b=i(m,a[m]);return s.push(...b),s},[])}function d(a,p){if(o.has(a.operator)){const s=o.get(a.operator);return s&&s(a.target,a.param,a.value,p)||!1}return!1}function u(a,p){return c(a).reduce((b,g)=>b&&d(g,p),!0)}function D(a,p){const s=Object.keys(a),m=s.includes("allOf"),b=s.includes("anyOf"),g=m||b,y=(g?a[g?m?"allOf":"anyOf":"allOf"]:[a]).map(B=>u(B,p));return m?!y.includes(!1):y.includes(!0)}return{parseValueSchema:D}}const C={},x={};P();function K(e,t,l=new Map,o=(d,u,D,a)=>u,i={},c=d=>d){return z[t.title]=t,W[t.title]=o,C[t.title]=i,x[t.title]=c,(d={},u=!0)=>{if(!u)return X(d,l);const D=U(d,t,l),a=Object.keys(e).reduce((p,s)=>(p[s]=e[s].default,p),{});return Object.assign(a,D)}}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(),u=10;n.onMounted(()=>{l=c.value});const D=(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"],B=Array.from(document.body.querySelectorAll(r.join(","))).filter(w=>w).map(w=>{const{display:j,zIndex:f}=window.getComputedStyle(w);return j==="none"?0:parseInt(f,10)}).filter(w=>w);let S=Math.max(...B);return S<1040&&(S=1040),S+y},a=(y,r)=>{const{height:B,left:S,top:w,width:j}=y.getBoundingClientRect(),{width:f,height:v,top:h}=r.getBoundingClientRect();if(y.className.indexOf("dropdown-submenu")>-1||y.closest(".dropdown-submenu")||y.classList.contains("dropright")){const $=window.innerWidth-S-y.offsetWidth,L=window.innerHeight-w,{position:O}=getComputedStyle(r);if(O==="fixed"){let T=S+y.offsetWidth;r.offsetWidth>$&&S>$&&(T=S-f),r.style.left=T+"px",r.style.right="auto",window.innerHeight-2*u<r.offsetHeight?(r.style.top=u+"px",r.style.bottom=u+"px",r.style.maxHeight=window.innerHeight-2*u+"px",r.style.overflowY="auto",r.className+=" dropdown-menu-maxheight"):L<r.offsetHeight?(r.style.top="auto",r.style.bottom=u+"px"):(r.style.top=w+"px",r.style.bottom="auto")}else{if(r.offsetWidth>$){const T=-f;r.style.left=T+"px"}window.innerHeight-2*u<r.offsetHeight?(r.style.top=-1*(w-u)+"px",r.style.bottom="auto",r.style.maxHeight=window.innerHeight-2*u+"px",r.style.overflowY="auto",r.className+=" dropdown-menu-maxheight"):L<r.offsetHeight&&(r.style.top=L-r.offsetHeight-u+"px",r.style.bottom="auto")}}else{const{marginTop:$,marginBottom:L}=getComputedStyle(r);let O=0;const T=Math.ceil(parseFloat($))+Math.ceil(parseFloat(L));let R=w+B,G=S;window.innerHeight-R-T<v&&(R=w-v,R<0&&(window.innerHeight-w-B>w?(R=w+B,O=window.innerHeight-R-T-u):(R=u,O=w-R-T))),window.innerWidth-S<f&&window.innerWidth-S<S+j&&(G=S-f+j),document.body.append(r),r.style.cssText=`position:fixed;bottom:unset;left:${G}px
             !important;top:${R}px !important;right: unset;${O?"max-height:"+O+"px;overflow-y:auto;":""}`,O&&(r.className+=" dropdown-menu-maxheight"),r.style.zIndex=D().toString()}},p=()=>{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(()=>{p()}),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:()=>{}}},Z=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),u=()=>{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:u,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:u,hoverDropdown:D,leftButtonClick:a,closeDropMenu:p,selectItem:s,resolveSize:m}=Y(e,t);function b(g){t.emit("select",g)}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:u,onMouseenter:D,onMouseleave:D},[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:g,value:V,disabled:H,active:y,divide:r})=>n.createVNode(Z,{value:V.toString(),label:g,disabled:H,active:y,divide:r,onSelect:B=>b(B)},null))])])]})])])}});function ie(e,t,l){var j;const o="",i="",c=n.ref();function d(){return(t==null?void 0:t.schema.componentType)!=="frame"}function u(){return!1}function D(){return(t==null?void 0:t.schema.componentType)!=="frame"}function a(){return(t==null?void 0:t.schema.componentType)==="frame"}function p(f){if(!f||!f.value)return null;if(f.value.schema&&f.value.schema.type==="component")return f.value;const v=n.ref(f==null?void 0:f.value.parent),h=p(v);return h||null}function s(f=t){var $;const{componentInstance:v,designerItemElementRef:h}=f;if(!v||!v.value)return null;const{getCustomButtons:N}=v.value;return v.value.canMove||N&&(($=N())!=null&&$.length)?h:s(f.parent)}function m(f){return!!l}function b(){return(t==null?void 0:t.schema.label)||(t==null?void 0:t.schema.title)||(t==null?void 0:t.schema.name)}function g(){}function V(f,v){var h;!f||!v||(h=t==null?void 0:t.setupContext)==null||h.emit("dragEnd")}function H(f,v){const{componentType:h}=f;let N=_(h,f,v);const $=h.toLowerCase().replace(/-/g,"_");return N&&!N.id&&N.type===h&&(N.id=`${$}_${Math.random().toString().slice(2,6)}`),N}function y(f){}function r(...f){}function B(){t!=null&&t.schema.contents&&t.schema.contents.map(f=>{let v=f.id;f.type==="component-ref"&&(v=f.component);const h=e.value.querySelectorAll(`#${v}-design-item`);h!=null&&h.length&&Array.from(h).map(N=>{var $;($=N==null?void 0:N.componentInstance)!=null&&$.value.onRemoveComponent&&N.componentInstance.value.onRemoveComponent()})})}function S(){}function w(f){}return c.value={canMove:d(),canSelectParent:u(),canDelete:D(),canNested:!a(),contents:t==null?void 0:t.schema.contents,elementRef:e,parent:(j=t==null?void 0:t.parent)==null?void 0:j.componentInstance,schema:t==null?void 0:t.schema,styles:o,designerClass:i,canAccepts:m,getBelongedComponentInstance:p,getDraggableDesignItemElement:s,getDraggingDisplayText:b,getPropConfig:r,getDragScopeElement:g,onAcceptMovedChildElement:V,onChildElementMovedOut:y,addNewChildComponentSchema:H,triggerBelongedComponentToMoveWhenMoved:n.ref(!1),triggerBelongedComponentToDeleteWhenDeleted:n.ref(!1),onRemoveComponent:B,getCustomButtons:S,onPropertyChanged:w},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:u,selectItem:D,resolveSize:a}=Y(e,t);function p(g){t.emit("select",g)}const s=n.ref(),m=n.inject("design-item-context"),b=ie(s,m);return n.onMounted(()=>{s.value.componentInstance=b}),t.expose(b.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:g,value:V,disabled:H,active:y,divide:r})=>n.createVNode(Z,{value:V.toString(),label:g,disabled:H,active:y,divide:r,onSelect:B=>p(B)},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"}})});