@farris/ui-vue 1.0.0-beta.5 → 1.0.0

package/list-view/index.umd.js

@@ -1 +1 @@
-(function(o,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(o=typeof globalThis<"u"?globalThis:o||self,e(o["list-view"]={},o.Vue))})(this,function(o,e){"use strict";const b={data:{type:Array,default:[]},multiSelect:{Type:Boolean,default:!1},cardView:{Type:Boolean,default:!1}},g={checked:{Type:Boolean,default:!1},id:{Type:String,default:""},disabled:{Type:Boolean,default:!1}},N=e.defineComponent({name:"FListViewCheckBox",props:g,emits:["change"],setup(a,s){const i=e.ref(a.checked),h=e.ref(a.disabled),k=e.ref(a.id);function w(n){n.stopPropagation(),i.value=!i.value,h.value||s.emit("change",{originalEvent:n,checked:!i.value})}return()=>e.createVNode("div",{class:"custom-control custom-checkbox  custom-control-inline listview-checkbox"},[e.withDirectives(e.createVNode("input",{title:k.value,type:"checkbox",class:"custom-control-input","onUpdate:modelValue":n=>i.value=n},null),[[e.vModelCheckbox,i.value]]),e.createVNode("label",{class:"custom-control-label",onClick:n=>w(n)},null)])}}),U="",V=e.defineComponent({name:"FListView",props:b,emits:["checkValuesChange","clickItem","selectChange"],setup(a,s){return()=>{const i=e.ref(a.multiSelect),h=e.ref(a.cardView),k=e.ref(""),w=e.ref(!0),n=e.ref({}),L=e.ref("\u6682\u65E0\u6570\u636E"),P=e.ref(!0),T=e.ref(!1),j=[],y=e.ref("id");let r=[];const m=e.ref(a.data),B=e.ref(a.data),D=e.computed(()=>({"f-list-view":!0,"f-list-view-multiple":i.value})),O=e.computed(()=>({"f-list-view-group":!0,"d-flex":h.value,"flex-wrap":h.value})),M=e.computed(()=>!!m.value&&m.value.length>0);function A(t){return!1}const F=t=>{const l={"f-list-view-group-item":!0,"f-un-click":!!t.unClick,"f-un-select":!!t.selectDisable,"f-listview-active":A()};return k.value.split(" ").reduce((d,C)=>(d[C]=!0,d),l),l},I=e.computed(()=>m.value.length===0),G=e.computed(()=>I.value&&!s.slots.empty),E=e.computed(()=>!!s.slots.footer||w.value);function f(t,l){return""}function _(t){s.emit("checkValuesChange",t)}function v(t,l,c,d=!1){const C=typeof event=="boolean";if(!(l.unClick||l.selectDisable)){if(s.emit("selectChange",{listdata:l,index:c}),i.value)if(l.checked){if(!P.value||C){const p=r.findIndex((u,K)=>f()===f());r.splice(p,1),l.checked=!1}}else r.find((u,K)=>f()===f())||(r.unshift(l),l.checked=!0);else r=[],r.push(l);if(d||(n.value=l),s.emit("clickItem",{data:r,index:c,checkChangeEvent:d}),i.value){let p=B.value.filter(u=>!!u.checked).map(u=>u[y.value]);T.value&&(p=j.map(u=>u[y.value])),_(p)}}}function q(t,l,c){const d=t.checked;v(d,l,c,!0)}return e.createVNode("div",{class:D.value},[s.slots.header&&e.createVNode("div",{class:"f-list-view-header"},[s.slots.header()]),e.createVNode("div",{class:"f-list-view-content"},[e.createVNode("ul",{class:O.value,style:"list-style: none;"},[M.value&&m.value.map((t,l)=>e.createVNode("li",{class:F(t),id:f(),onClick:c=>v(c,t,l)},[i.value&&e.createVNode("div",{class:"f-list-select",onClick:c=>c.stopPropagation()},[e.createVNode(N,{id:"list-"+f(),disabled:t.selectDisable||t.unClick,checked:t.checked,onChange:c=>q(c,t,l)},null)]),e.createVNode("div",{class:"f-list-content"},[s.slots.content&&s.slots.content({item:t,index:l,selectedItem:n})])])),G.value&&e.createVNode("div",{class:"f-list-view-emptydata"},[e.createVNode("p",{class:"f-empty-title"},[L.value])]),s.slots.empty&&s.slots.empty()])]),E.value&&e.createVNode("div",{class:"f-list-view-footer"},[s.slots.footer&&s.slots.footer()])])}}}),S={install(a){a.component(V.name,V)}};o.ListView=V,o.default=S,o.listViewProps=b,Object.defineProperties(o,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(D,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(D=typeof globalThis<"u"?globalThis:D||self,e(D["list-view"]={},D.Vue))})(this,function(D,e){"use strict";const j={data:{type:Array,default:[]},draggable:{type:Boolean,default:!1},multiSelect:{Type:Boolean,default:!1},multiSelectMode:{Type:String,default:"OnCheck"},idField:{Type:String,default:"id"},valueField:{Type:String,default:"id"},textField:{Type:String,default:"name"},view:{Type:String,default:"ContentView"},size:{Type:String,default:"default"},placeholder:{type:String,default:""},header:{Type:String,default:"ContentHeader"},headerClass:{Type:String,default:""},itemClass:{Type:String,default:""},selectionValues:{type:Array,default:[]},keepOrder:{type:Boolean,default:!1},disableField:{type:String,default:"disabled"}};function A(t,a,u,c,f){const l=e.ref(t.idField),n=e.ref(t.disableField),g=e.ref(t.draggable),S=e.ref(t.itemClass),d=e.ref(t.multiSelect),r=e.ref(t.multiSelectMode);e.ref(!0);const{isDragging:s}=u,{activeIndex:o,focusedItemId:v,hoverIndex:i}=c,{clearSelection:h,selectedItems:N,toggleSelectItem:y}=f;function w(b,_){const p={"f-list-view-group-item":!0,"f-list-view-draggable-item":g.value,"f-un-click":!!b.unClick,"f-un-select":!!b[n.value],"f-listview-active":b.__fv_index__===o.value,"f-listview-hover":!s.value&&_===i.value,moving:!!b.moving};return S.value.split(" ").reduce((H,k)=>(H[k]=!0,H),p),p}function m(b,_){return b[l.value]||""}const C=e.computed(()=>!d.value);function V(b,_){b.unClick||b[n.value]||(C.value&&(v.value=b[l.value]),y(b,_))}const I=e.computed(()=>d.value&&r.value==="OnCheckClearByClick"),O=e.computed(()=>!d.value||d.value&&(r.value==="OnCheckAndClick"||r.value==="OnClick"));function M(b,_,p){if(_.unClick||_[n.value]){b.preventDefault(),b.stopPropagation();return}v.value=_[l.value],o.value=p,I.value&&h(),O.value&&y(_,p),a.emit("clickItem",{data:N.value,index:p})}return{getKey:m,listViewItemClass:w,onCheckItem:V,onClickItem:M}}function E(t,a,u){const c=e.ref(t.idField),f=e.ref(t.multiSelect);e.ref(t.multiSelectMode);const{getSelectionItems:l}=u,n=e.ref(l(t.selectionValues));e.watch(()=>t.selectionValues,o=>{n.value=e.ref(l(o)).value});const g=e.computed(()=>!f.value);function S(o){return o[c.value]||""}function d(o){return n.value.findIndex(i=>S(i)===S(o))}function r(){n.value.forEach(o=>{o.checked=!1}),n.value=[]}function s(o,v){g.value&&r();const i=d(o);i>-1?(n.value.splice(i,1),o.checked=!1):(n.value.push(o),o.checked=!0),a.emit("selectionChange",n.value)}return{clearSelection:r,findIndexInSelectedItems:d,selectedItems:n,toggleSelectItem:s}}function $(t,a){function u(l){const n=[];let g=l.nextNode();for(;g;)n.push(g),g=l.nextNode();return n}function c(l,n){const g=document.createTreeWalker(l,NodeFilter.SHOW_TEXT);return u(g).map(s=>({textNode:s,text:(s.textContent||"").toLocaleLowerCase()})).map(({textNode:s,text:o})=>{const v=[];let i=0;for(;i<o.length;){const h=o.indexOf(n,i);if(h===-1)break;v.push(h),i=h+n.length}return v.map(h=>{const N=new Range;return N.setStart(s,h),N.setEnd(s,h+n.length),N})}).flat()}function f(l){if(!CSS.highlights||(CSS.highlights.clear(),!l||!a))return;const n=c(a.value,l.toLocaleLowerCase()),g=new Highlight(...n);CSS.highlights.set("search-result",g)}return{search:f}}const x={checked:{Type:Boolean,default:!1},id:{Type:String,default:""},disabled:{Type:Boolean,default:!1},modelValue:{Type:Boolean,default:!1}},R=e.defineComponent({name:"FListViewCheckBox",props:x,emits:["change","update:modelValue"],setup(t,a){const u=e.ref(t.checked),c=e.ref(t.disabled),f=e.ref(t.id);function l(n){n.stopPropagation(),n.preventDefault(),c.value||(u.value=!u.value,a.emit("change",{originalEvent:n,checked:u.value}))}return e.watch(()=>t.checked,n=>{u.value=n}),()=>e.createVNode("div",{class:"custom-control custom-checkbox  custom-control-inline listview-checkbox"},[e.withDirectives(e.createVNode("input",{id:f.value,title:f.value,type:"checkbox",class:"custom-control-input","onUpdate:modelValue":n=>u.value=n,onChange:n=>console.log(n)},null),[[e.vModelCheckbox,u.value]]),e.createVNode("label",{for:f.value,class:"custom-control-label",onClick:n=>l(n)},null)])}});function L(t,a,u,c,f,l,n,g){const S=e.ref(t.size),d=e.ref(t.textField),r=e.ref(t.multiSelect),s=e.ref(t.disableField),{onMouseenterItem:o,onMouseoverItem:v,onMouseoutItem:i}=f,{getKey:h,listViewItemClass:N,onCheckItem:y,onClickItem:w}=l,m=e.computed(()=>({margin:S.value==="small"?"0.25rem 0":"10px 0"}));function C(V,I,O){return V.checked=n.findIndexInSelectedItems(V)>-1,e.createVNode("li",{class:N(V,I),id:h(V,I),key:h(V,I),onClick:M=>w(M,V,I),onMouseenter:M=>o(M,V,I),onMouseover:M=>v(M,V,I),onMouseout:M=>i(M,V,I)},[r.value&&e.createVNode("div",{class:"f-list-select",onClick:M=>M.stopPropagation()},[e.createVNode(R,{id:"list-"+h(V,I),disabled:V[s.value]||V.unClick,checked:V.checked,onChange:M=>y(V,I)},null)]),e.createVNode("div",{class:"f-list-content"},[e.createVNode("div",{style:m.value},[V[d.value]])])])}return{renderItem:C}}function z(t,a,u,c,f,l,n,g){const S=e.ref(t.multiSelect),d=e.ref(t.disableField),{onMouseenterItem:r,onMouseoverItem:s,onMouseoutItem:o}=f,{getKey:v,listViewItemClass:i,onCheckItem:h,onClickItem:N}=l;function y(m,C,V){return a.slots.content?e.createVNode(e.Fragment,null,[a.slots.content&&a.slots.content({item:m,index:C,selectedItem:V})]):e.createVNode("div",{style:"margin: 10px 0;"},[m.name])}function w(m,C,V){return e.createVNode("li",{class:i(m,C),id:v(m,C),key:v(m,C),onClick:I=>N(I,m,C),onMouseenter:I=>r(I,m,C),onMouseover:I=>s(I,m,C),onMouseout:I=>o(I,m,C)},[S.value&&e.createVNode("div",{class:"f-list-select",onClick:I=>I.stopPropagation()},[e.createVNode(R,{id:"list-"+v(m,C),disabled:m[d.value]||m.unClick,checked:m.checked,onChange:I=>h(m,C)},null)]),e.createVNode("div",{class:"f-list-content"},[y(m,C,V)])])}return{renderItem:w}}function K(t,a,u,c,f,l,n,g){const S=e.ref(t.multiSelect),d=e.ref(t.disableField),{onMouseenterItem:r,onMouseoverItem:s,onMouseoutItem:o}=f,{getKey:v,listViewItemClass:i,onCheckItem:h,onClickItem:N}=l,{dragstart:y,dragenter:w,dragover:m,dragend:C}=c,{removeItem:V}=g,I=e.computed(()=>({margin:S.value?"10px 0":"10px 0px 10px 14px"}));function O(p){return e.createVNode("div",{style:I.value},[p.name])}function M(){return a.slots.itemContent?a.slots.itemContent:O}const b=M();function _(p,F,H){return e.createVNode("li",{class:i(p,F),id:v(p,F),key:v(p,F),onClick:k=>N(k,p,F),onMouseenter:k=>r(k,p,F),onMouseover:k=>s(k,p,F),onMouseout:k=>o(k,p,F),draggable:"true",onDragstart:k=>y(k,p,F),onDragenter:k=>w(k,F),onDragend:k=>C(k,p),onDragover:k=>m(k,F)},[S.value&&e.createVNode("div",{class:"f-list-select",onClick:k=>k.stopPropagation()},[e.createVNode(R,{id:"list-"+v(p,F),disabled:p[d.value]||p.unClick,checked:p.checked,onChange:k=>h(p,F)},null)]),e.createVNode("div",{class:"f-list-content"},[b(p)]),e.createVNode("div",{class:"f-list-remove",onClick:k=>V(F)},[e.createVNode("div",{class:"f-list-remove-icon"},[e.createVNode("i",{class:"f-icon f-icon-remove_face"},null)])]),e.createVNode("div",{class:"f-list-handle"},[e.createVNode("div",null,[e.createVNode("i",{class:"f-icon f-icon-drag-vertical"},null)])])])}return{renderItem:_}}function G(t,a,u){function c(){return a.slots.header&&e.createVNode("div",{class:"f-list-view-header"},[a.slots.header()])}return{renderHeader:c}}function B(t,a,u){const c=e.ref(t.headerClass),f=e.ref(t.placeholder),l=e.ref(""),n=e.computed(()=>!l.value),g=e.computed(()=>!!l.value);function S(o){l.value=""}e.watch(l,o=>{u.search(o)});const d=e.computed(()=>{const o={"form-group":!0,"farris-form-group":!0};return c.value&&c.value.split(" ").reduce((i,h)=>(i[h]=!0,i),o),o});function r(o){}function s(){return e.createVNode("div",{class:"f-list-view-header",onClick:e.withModifiers(r,["prevent","stop"])},[e.createVNode("div",{class:d.value},[e.createVNode("div",{class:"farris-input-wrap"},[e.createVNode("div",{class:"f-cmp-inputgroup"},[e.createVNode("div",{class:"input-group f-state-editable"},[e.withDirectives(e.createVNode("input",{class:"form-control f-utils-fill text-left","onUpdate:modelValue":o=>l.value=o,name:"input-group-value",type:"text",placeholder:f.value,autocomplete:"off"},null),[[e.vModelText,l.value]]),e.createVNode("div",{class:"input-group-append"},[g.value&&e.createVNode("span",{class:"input-group-text input-group-clear",onClick:o=>S()},[e.createVNode("i",{class:"f-icon f-icon-close-circle"},null)]),n.value&&e.createVNode("span",{class:"input-group-text"},[e.createVNode("span",{class:"f-icon f-icon-search"},null)])])])])])])])}return{renderHeader:s}}const Z="";function U(t,a){const u=e.ref(t.idField),c=e.ref(t.data),f=e.ref(t.data),l=e.ref(t.keepOrder);function n(){const d=c.value.map((r,s)=>typeof r!="object"?{__fv_index__:s,name:r}:(r.__fv_index__=s,r));return f.value=d,d}const g=e.ref(n());e.watch(()=>t.data,d=>{if(l.value){const r=d.reduce((i,h)=>(i.set(h.id,!0),i),new Map),s=c.value.reduce((i,h)=>(i.set(h.id,!0),i),new Map),o=g.value.filter(i=>r.has(i.id)),v=d.filter(i=>!s.has(i.id));c.value=[...o,...v]}else c.value=d;g.value=n()});function S(d){return d.map(s=>{const o=f.value.findIndex(v=>v[u.value]===s);return o>-1?f.value[o]:null}).filter(s=>s!=null)}return{dataView:g,getSelectionItems:S}}function W(t,a,u,c){const f=e.ref(t.idField),{dataView:l}=u,n=e.ref(-1),g=e.ref(!1),{activeIndex:S,focusedItemId:d,hoverIndex:r,resumeHover:s,suspendHover:o}=c;function v(y,w,m){y.stopPropagation(),o(),w&&setTimeout(()=>{n.value=m,g.value=!0,w.moving=!0})}function i(y,w){if(y.preventDefault(),n.value!==w){const m=l.value[n.value],C=l.value;C.splice(n.value,1),C.splice(w,0,m),n.value=w}}function h(y,w){y.preventDefault(),y.dataTransfer&&(y.dataTransfer.dropEffect="move")}function N(y,w){w&&(w.moving=!1),l.value.forEach((m,C)=>{m.__fv_index__=C}),g.value=!1,s(),r.value=w.__fv_index__,S.value=w.__fv_index__,d.value=w[f.value],a.emit("change",l.value)}return{dragstart:v,dragenter:i,dragover:h,dragend:N,isDragging:g}}function q(t,a,u){const{dataView:c}=u;function f(l){if(l>-1&&l<c.value.length){const n=c.value.splice(l,1);a.emit("removeItem",n[0])}}return{removeItem:f}}function X(){const t=e.ref(-1),a=e.ref(""),u=e.ref(-1),c=e.ref(!1);function f(d,r,s){u.value=s}function l(d,r,s){c.value||(u.value=s)}function n(d,r,s){u.value=-1}function g(){c.value=!0}function S(){c.value=!1}return{activeIndex:t,focusedItemId:a,hoverIndex:u,onMouseenterItem:f,onMouseoverItem:l,onMouseoutItem:n,resumeHover:S,suspendHover:g}}const P=e.defineComponent({name:"FListView",props:j,emits:["checkValuesChange","clickItem","selectionChange","removeItem","change"],setup(t,a){const u=e.ref(),c=e.ref(t.view),f=e.ref(t.header),l=e.ref(t.multiSelect),n=e.ref(t.view==="CardView"),g=e.ref(!0),S=e.ref({}),d=e.ref("暂无数据");e.ref(!0),e.ref(!1),e.ref("id");const r=U(t),{dataView:s}=r,o=e.computed(()=>{const T={"f-list-view":!0,"f-list-view-multiple":l.value};return t.size!=="default"&&(T[`${t.size}-item`]=!0),T}),v=e.computed(()=>({"f-list-view-group":!0,"d-flex":n.value,"flex-wrap":n.value})),i=e.computed(()=>!!s.value&&s.value.length>0),h=X(),N=E(t,a,r),y=W(t,a,r,h),w=q(t,a,r),m=A(t,a,y,h,N),C=$(t,u),V=e.computed(()=>s.value.length===0),I=e.computed(()=>V.value&&!a.slots.empty),O=e.computed(()=>!!a.slots.footer||g.value);function M(){return c.value==="SingleView"?L:c.value==="DraggableView"?K:c.value==="ContentView"&&a.slots.content?z:L}const b=M(),{renderItem:_}=b(t,a,r,y,h,m,N,w);function p(){return f.value==="SearchBar"?B:f.value==="ContentHeader"?G:B}const F=p(),{renderHeader:H}=F(t,a,C);function k(T){C.search(T)}a.expose({search:k});function Q(T){l.value&&(T.preventDefault(),T.stopPropagation())}return()=>e.createVNode("div",{class:o.value,onClick:Q},[H(),e.createVNode("div",{ref:u,class:"f-list-view-content"},[e.createVNode("ul",{class:v.value,style:"list-style: none;"},[i.value&&s.value.map((T,Y)=>_(T,Y,S)),I.value&&e.createVNode("div",{class:"f-list-view-emptydata"},[e.createVNode("p",{class:"f-empty-title"},[d.value])]),a.slots.empty&&a.slots.empty()])]),O.value&&e.createVNode("div",{class:"f-list-view-footer"},[a.slots.footer&&a.slots.footer()])])}}),J={install(t){t.component(P.name,P)}};D.ListView=P,D.default=J,D.listViewProps=j,Object.defineProperties(D,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/list-view/package.json

@@ -1,8 +1,8 @@
 {
     "name": "list-view",
-    "version": "1.0.0-beta.6",
+    "version": "1.0.2",
     "main": "index.umd.js",
-    "module": "index.es.js",
+    "module": "index.esm.js",
     "style": "style.css",
     "types": "../types/list-view/index.d.ts"
 }

package/list-view/style.css

@@ -1 +1 @@
-.f-listview-fill{flex-grow:1;flex-shrink:1;flex-basis:0;overflow:hidden}.f-listview-fill .f-list-view{height:100%}.f-listview-fill .f-list-view .f-list-view-header,.f-listview-fill .f-list-view .f-list-view-footer{flex-shrink:0}.f-listview-fill .f-list-view .f-list-view-content{overflow-y:auto;flex-grow:1;flex-shrink:1;flex-basis:0}.f-list-view{display:flex;flex-direction:column}.f-list-view .f-paging-wrapper{padding:14px 0}.f-list-view-group-item{display:flex;align-items:center}.f-list-view-group-item.f-none-border{border-bottom:0}.f-list-view-group-item .f-list-content{flex:1 1 auto;width:100%}.f-list-select{padding:0 14px}.f-list-view-emptydata .f-empty-title{font-size:14px;line-height:22px;color:#999;padding:20px 0;text-align:center}
+.f-listview-fill{flex-grow:1;flex-shrink:1;flex-basis:0;overflow:hidden}.f-listview-fill .f-list-view{height:100%}.f-listview-fill .f-list-view .f-list-view-header,.f-listview-fill .f-list-view .f-list-view-footer{flex-shrink:0}.f-listview-fill .f-list-view .f-list-view-content{overflow-y:auto;flex-grow:1;flex-shrink:1;flex-basis:0}.f-list-view{display:flex;flex-direction:column;overflow:hidden}.f-list-view .f-list-view-content{flex:1;overflow:auto}.f-list-view .f-list-view-group{padding:0}.f-list-view .f-paging-wrapper{padding:14px 0}.f-list-view-group-item{display:flex;align-items:center;float:none;text-align:initial}.f-list-view-group-item.f-none-border{border-bottom:0}.f-list-view-group-item.f-listview-hover,.f-list-view-group-item.f-listview-active{cursor:pointer;color:#424347;background:#edf5ff!important}.f-list-view-group-item.f-listview-active{border-color:#529dff}.f-list-view-group-item.f-un-select{color:#848c9a}.f-list-view-group-item .f-list-content{flex:1 1 auto;width:100%}.f-list-view-draggable-item{border:1px solid;border-color:#e2e3e5;background-color:#fafbfd;border-radius:10px;margin:4px 2px}.f-list-view-draggable-item.f-listview-hover{cursor:pointer;color:#424347;background:#edf5ff!important}.f-list-view-draggable-item.f-listview-hover .f-list-remove-icon{display:initial}.f-list-view-draggable-item.f-listview-active{border-color:#529dff}.f-list-view-draggable-item.moving{opacity:0}.f-list-select{padding:0 0 0 14px}.f-list-select .listview-checkbox{margin:.25rem 0}.f-list-pin{color:#2986ff;padding:0 14px 0 0}.f-list-remove{width:30px;color:#f4625f;padding:0 14px 0 0}.f-list-remove-icon{display:none}.f-list-handle{padding:0 14px 0 0}.f-list-view-emptydata .f-empty-title{font-size:14px;line-height:22px;color:#999;padding:20px 0;text-align:center}.f-list-view.small-item .f-list-select{padding:initial}::highlight(search-result){background-color:#f06;color:#fff}

package/loading/index.esm.js

@@ -0,0 +1,124 @@
+import { defineComponent as A, ref as y, onMounted as I, createVNode as l, createApp as T, onUnmounted as H } from "vue";
+const N = {
+  showMessage: { type: Boolean, default: !0 },
+  message: { type: String, default: "加载中，请稍后..." },
+  debug: { type: Boolean, default: !1 },
+  isActive: { type: Boolean, default: !1 }
+}, B = [
+  '<div class="f-loading-round"></div>',
+  `<div class="f-loading-dot-wrapper">
+      <div class="f-loading-dot">
+          <div class="dot dot1"></div>
+          <div class="dot dot2"></div>
+          <div class="dot dot3"></div>
+          <div class="dot dot4"></div>
+      </div>
+  </div>`,
+  '<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="lds-coffee"><defs><linearGradient id="gradient" x1="0%" x2="0%" y1="0%" y2="100%"><stop offset="10%" stop-color="black" stop-opacity="0"></stop><stop offset="100%" stop-color="white" stop-opacity="1"></stop></linearGradient><mask id="mask" maskUnits="userSpaceOnUse" x="0" y="0" width="100" height="100"><rect x="22" y="8" width="56" height="54" fill="url(#gradient)"></rect></mask><path id="steam" d="M0-4c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9l0,0c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9l0,0 c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9l0,0c-2.1,2.6-2.1,6.4,0,9l0,0 c2.1,2.6,2.1,6.4,0,9l0,0c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9l0,0 c-2.1,2.6-2.1,6.4,0,9h0c2.1,2.6,2.1,6.4,0,9h0c-2.1,2.6-2.1,6.4,0,9h0c2.1,2.6,2.1,6.4,0,9" stroke-width="6" stroke-linecap="round" fill="#f00" stroke="#58a8f6"></path></defs><g mask="url(#mask)"><use x="29" y="1.00876" href="#steam"><animate attributeName="y" calcMode="linear" values="4;-14" keyTimes="0;1" dur="0.5" begin="0s" repeatCount="indefinite"></animate></use><use x="47" y="-5.98248" href="#steam"><animate attributeName="y" calcMode="linear" values="0;-18" keyTimes="0;1" dur="0.25" begin="0s" repeatCount="indefinite"></animate></use><use x="64" y="-8.48686" href="#steam"><animate attributeName="y" calcMode="linear" values="-4;-22" keyTimes="0;1" dur="0.3333333333333333" begin="0s" repeatCount="indefinite"></animate></use></g><path d="M81.2,52.5l-5.2,0V49c0-1.6-1.3-3-3-3H20c-1.6,0-3,1.3-3,3v11.6C17,71.3,25.7,80,36.5,80h20.1 c7.1,0,13.3-3.8,16.7-9.5h8.3c5.2,0,9.3-4.4,9-9.6C90.2,56.1,86,52.5,81.2,52.5z M81.5,67.5h-6.8c0.8-2.2,1.3-4.5,1.3-7v-5h5.5 c3.3,0,6,2.7,6,6S84.8,67.5,81.5,67.5z" fill="#58a8f6"></path><path d="M78.8,88H19.2c-1.1,0-2-0.9-2-2s0.9-2,2-2h59.5c1.1,0,2,0.9,2,2S79.9,88,78.8,88z" fill="rgba(80.78431372549018%,94.50980392156862%,72.15686274509802%,0)"></path></svg>'
+];
+const f = /* @__PURE__ */ A({
+  name: "FLoading",
+  props: N,
+  emits: ["closed"],
+  setup(o, n) {
+    const v = B, m = y(!0), h = 30, k = 0, p = y(null), d = y(null);
+    I(() => {
+      var a, r, e, i;
+      if (m.value) {
+        const s = p.value;
+        (a = s == null ? void 0 : s.style) == null || a.setProperty("display", "block");
+        const t = d.value;
+        (r = t == null ? void 0 : t.style) == null || r.setProperty("left", "0"), S(), (e = t == null ? void 0 : t.style) == null || e.removeProperty("visibility"), (i = t == null ? void 0 : t.style) == null || i.removeProperty("left");
+      }
+    });
+    function M() {
+      p.value && p.value.remove(), d.value && d.value.remove(), m.value = !1, document.documentElement.removeAttribute("class"), n.emit("closed", m);
+    }
+    function S() {
+      var t, u, g, b, x, w;
+      const a = (t = d.value) == null ? void 0 : t.clientWidth, r = (u = d.value) == null ? void 0 : u.clientHeight, e = d.value, i = p.value;
+      if (a && r) {
+        (g = e == null ? void 0 : e.style) == null || g.setProperty("marginTop", -r / 2 + "px");
+        let z = -a / 2 + "px";
+        (b = e == null ? void 0 : e.style) == null || b.setProperty("marginLeft", z);
+      }
+      const s = P();
+      (x = i == null ? void 0 : i.style) == null || x.setProperty("zIndex", (s + 1).toString()), (w = e == null ? void 0 : e.style) == null || w.setProperty("zIndex", (s + 1).toString());
+    }
+    function P(a = 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"], e = Array.from(document.body.querySelectorAll(r.join(","))).filter((s) => s).map((s) => {
+        const {
+          display: t,
+          zIndex: u
+        } = window.getComputedStyle(s);
+        return t === "none" ? 0 : parseInt(u, 10);
+      }).filter((s) => s);
+      let i = Math.max(...e);
+      return i < 1040 && (i = 1040), i + a;
+    }
+    const L = (a) => {
+      o.debug && (a.stopPropagation(), M());
+    };
+    return () => l("div", null, [l("div", {
+      ref: p,
+      class: "farris-loading-backdrop loading-wait",
+      onClick: L
+    }, null), l("div", {
+      ref: d,
+      class: "farris-loading",
+      style: "visibility: hidden"
+    }, [l("div", {
+      class: "ng-busy-default-wrapper"
+    }, [l("div", {
+      class: "ng-busy-default-sign"
+    }, [l("div", {
+      style: [{
+        display: "inline-block"
+      }, {
+        margin: "4px"
+      }, {
+        width: h + "px"
+      }, {
+        height: h + "px"
+      }],
+      innerHTML: v[k]
+    }, null), o.showMessage && l("div", {
+      class: "ng-busy-default-text",
+      style: "margin-left:0;",
+      innerHTML: o.message
+    }, null)])])])]);
+  }
+});
+let c = null;
+function G(o) {
+  const n = document.createElement("div");
+  n.style.display = "contents", c = T({
+    setup() {
+      return H(() => {
+        document.body.removeChild(n);
+      }), () => l(f, {
+        message: o.message
+      }, null);
+    }
+  }), document.body.appendChild(n), c.mount(n);
+}
+class U {
+  static show(n) {
+    c || G({
+      message: n
+    });
+  }
+  static close() {
+    c && (c.unmount(), c = null);
+  }
+}
+const C = {
+  install(o) {
+    o.component(f.name, f), o.provide("LoadingService", U);
+  }
+};
+export {
+  f as Loading,
+  C as default,
+  N as loadingProps
+};

package/loading/index.umd.js

@@ -0,0 +1,8 @@
+(function(n,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis<"u"?globalThis:n||self,e(n.loading={},n.Vue))})(this,function(n,e){"use strict";const g={showMessage:{type:Boolean,default:!0},message:{type:String,default:"加载中，请稍后..."},debug:{type:Boolean,default:!1},isActive:{type:Boolean,default:!1}},M=['<div class="f-loading-round"></div>',`<div class="f-loading-dot-wrapper">
+      <div class="f-loading-dot">
+          <div class="dot dot1"></div>
+          <div class="dot dot2"></div>
+          <div class="dot dot3"></div>
+          <div class="dot dot4"></div>
+      </div>
+  </div>`,'<svg width="100%" height="100%" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid" class="lds-coffee"><defs><linearGradient id="gradient" x1="0%" x2="0%" y1="0%" y2="100%"><stop offset="10%" stop-color="black" stop-opacity="0"></stop><stop offset="100%" stop-color="white" stop-opacity="1"></stop></linearGradient><mask id="mask" maskUnits="userSpaceOnUse" x="0" y="0" width="100" height="100"><rect x="22" y="8" width="56" height="54" fill="url(#gradient)"></rect></mask><path id="steam" d="M0-4c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9l0,0c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9l0,0 c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9l0,0c-2.1,2.6-2.1,6.4,0,9l0,0 c2.1,2.6,2.1,6.4,0,9l0,0c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9c-2.1,2.6-2.1,6.4,0,9l0,0c2.1,2.6,2.1,6.4,0,9l0,0 c-2.1,2.6-2.1,6.4,0,9h0c2.1,2.6,2.1,6.4,0,9h0c-2.1,2.6-2.1,6.4,0,9h0c2.1,2.6,2.1,6.4,0,9" stroke-width="6" stroke-linecap="round" fill="#f00" stroke="#58a8f6"></path></defs><g mask="url(#mask)"><use x="29" y="1.00876" href="#steam"><animate attributeName="y" calcMode="linear" values="4;-14" keyTimes="0;1" dur="0.5" begin="0s" repeatCount="indefinite"></animate></use><use x="47" y="-5.98248" href="#steam"><animate attributeName="y" calcMode="linear" values="0;-18" keyTimes="0;1" dur="0.25" begin="0s" repeatCount="indefinite"></animate></use><use x="64" y="-8.48686" href="#steam"><animate attributeName="y" calcMode="linear" values="-4;-22" keyTimes="0;1" dur="0.3333333333333333" begin="0s" repeatCount="indefinite"></animate></use></g><path d="M81.2,52.5l-5.2,0V49c0-1.6-1.3-3-3-3H20c-1.6,0-3,1.3-3,3v11.6C17,71.3,25.7,80,36.5,80h20.1 c7.1,0,13.3-3.8,16.7-9.5h8.3c5.2,0,9.3-4.4,9-9.6C90.2,56.1,86,52.5,81.2,52.5z M81.5,67.5h-6.8c0.8-2.2,1.3-4.5,1.3-7v-5h5.5 c3.3,0,6,2.7,6,6S84.8,67.5,81.5,67.5z" fill="#58a8f6"></path><path d="M78.8,88H19.2c-1.1,0-2-0.9-2-2s0.9-2,2-2h59.5c1.1,0,2,0.9,2,2S79.9,88,78.8,88z" fill="rgba(80.78431372549018%,94.50980392156862%,72.15686274509802%,0)"></path></svg>'],j="",u=e.defineComponent({name:"FLoading",props:g,emits:["closed"],setup(a,l){const h=M,y=e.ref(!0),v=30,L=0,f=e.ref(null),r=e.ref(null);e.onMounted(()=>{var d,c,t,o;if(y.value){const i=f.value;(d=i==null?void 0:i.style)==null||d.setProperty("display","block");const s=r.value;(c=s==null?void 0:s.style)==null||c.setProperty("left","0"),z(),(t=s==null?void 0:s.style)==null||t.removeProperty("visibility"),(o=s==null?void 0:s.style)==null||o.removeProperty("left")}});function T(){f.value&&f.value.remove(),r.value&&r.value.remove(),y.value=!1,document.documentElement.removeAttribute("class"),l.emit("closed",y)}function z(){var s,m,b,w,x,k;const d=(s=r.value)==null?void 0:s.clientWidth,c=(m=r.value)==null?void 0:m.clientHeight,t=r.value,o=f.value;if(d&&c){(b=t==null?void 0:t.style)==null||b.setProperty("marginTop",-c/2+"px");let H=-d/2+"px";(w=t==null?void 0:t.style)==null||w.setProperty("marginLeft",H)}const i=A();(x=o==null?void 0:o.style)==null||x.setProperty("zIndex",(i+1).toString()),(k=t==null?void 0:t.style)==null||k.setProperty("zIndex",(i+1).toString())}function A(d=1){const c=["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"],t=Array.from(document.body.querySelectorAll(c.join(","))).filter(i=>i).map(i=>{const{display:s,zIndex:m}=window.getComputedStyle(i);return s==="none"?0:parseInt(m,10)}).filter(i=>i);let o=Math.max(...t);return o<1040&&(o=1040),o+d}const I=d=>{a.debug&&(d.stopPropagation(),T())};return()=>e.createVNode("div",null,[e.createVNode("div",{ref:f,class:"farris-loading-backdrop loading-wait",onClick:I},null),e.createVNode("div",{ref:r,class:"farris-loading",style:"visibility: hidden"},[e.createVNode("div",{class:"ng-busy-default-wrapper"},[e.createVNode("div",{class:"ng-busy-default-sign"},[e.createVNode("div",{style:[{display:"inline-block"},{margin:"4px"},{width:v+"px"},{height:v+"px"}],innerHTML:h[L]},null),a.showMessage&&e.createVNode("div",{class:"ng-busy-default-text",style:"margin-left:0;",innerHTML:a.message},null)])])])])}});let p=null;function S(a){const l=document.createElement("div");l.style.display="contents",p=e.createApp({setup(){return e.onUnmounted(()=>{document.body.removeChild(l)}),()=>e.createVNode(u,{message:a.message},null)}}),document.body.appendChild(l),p.mount(l)}class P{static show(l){p||S({message:l})}static close(){p&&(p.unmount(),p=null)}}const N={install(a){a.component(u.name,u),a.provide("LoadingService",P)}};n.Loading=u,n.default=N,n.loadingProps=g,Object.defineProperties(n,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

package/loading/package.json

@@ -0,0 +1,8 @@
+{
+    "name": "loading",
+    "version": "1.0.2",
+    "main": "index.umd.js",
+    "module": "index.esm.js",
+    "style": "style.css",
+    "types": "../types/loading/index.d.ts"
+}

package/loading/style.css

@@ -0,0 +1 @@
+.loading-wait{cursor:wait}.farris-loading-backdrop{position:absolute;top:0;left:0;right:0;bottom:0;z-index:2001;background:#cccccc;opacity:.3}.farris-loading{position:absolute;top:50%;left:50%}.ng-busy-default-wrapper{text-align:center}.ng-busy-default-sign{position:relative;display:inline-block;z-index:2003;padding:12px 14px;border:1px solid #d8d8d8;border-radius:4px;box-shadow:0 1px 2px #0000000d;background:#f8f8f8;color:#333}.ng-busy-default-text{display:inline-block;margin-left:6px;max-width:400px;font-size:14px;text-align:left}.ng-busy-default-spinner{position:relative;display:inline-block;width:25px;height:25px;vertical-align:middle}.ng-busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:10%;height:26%;background:#666;border-radius:50px;box-shadow:0 0 3px #0003;opacity:0;-webkit-animation:busy-spinner-anim 1s linear infinite;animation:busy-spinner-anim 1s linear infinite}.ng-busy-default-spinner .bar1{-webkit-transform:rotate(0deg) translate(0,-142%);transform:rotate(0) translateY(-142%);-webkit-animation-delay:-1s;animation-delay:-1s}.ng-busy-default-spinner .bar2{-webkit-transform:rotate(30deg) translate(0,-142%);transform:rotate(30deg) translateY(-142%);-webkit-animation-delay:-.91666667s;animation-delay:-.91666667s}.ng-busy-default-spinner .bar3{-webkit-transform:rotate(60deg) translate(0,-142%);transform:rotate(60deg) translateY(-142%);-webkit-animation-delay:-.83333333s;animation-delay:-.83333333s}.ng-busy-default-spinner .bar4{-webkit-transform:rotate(90deg) translate(0,-142%);transform:rotate(90deg) translateY(-142%);-webkit-animation-delay:-.75s;animation-delay:-.75s}.ng-busy-default-spinner .bar5{-webkit-transform:rotate(120deg) translate(0,-142%);transform:rotate(120deg) translateY(-142%);-webkit-animation-delay:-.66666667s;animation-delay:-.66666667s}.ng-busy-default-spinner .bar6{-webkit-transform:rotate(150deg) translate(0,-142%);transform:rotate(150deg) translateY(-142%);-webkit-animation-delay:-.58333333s;animation-delay:-.58333333s}.ng-busy-default-spinner .bar7{-webkit-transform:rotate(180deg) translate(0,-142%);transform:rotate(180deg) translateY(-142%);-webkit-animation-delay:-.5s;animation-delay:-.5s}.ng-busy-default-spinner .bar8{-webkit-transform:rotate(210deg) translate(0,-142%);transform:rotate(210deg) translateY(-142%);-webkit-animation-delay:-.41666667s;animation-delay:-.41666667s}.ng-busy-default-spinner .bar9{-webkit-transform:rotate(240deg) translate(0,-142%);transform:rotate(240deg) translateY(-142%);-webkit-animation-delay:-.33333333s;animation-delay:-.33333333s}.ng-busy-default-spinner .bar10{-webkit-transform:rotate(270deg) translate(0,-142%);transform:rotate(270deg) translateY(-142%);-webkit-animation-delay:-.25s;animation-delay:-.25s}.ng-busy-default-spinner .bar11{-webkit-transform:rotate(300deg) translate(0,-142%);transform:rotate(300deg) translateY(-142%);-webkit-animation-delay:-.16666667s;animation-delay:-.16666667s}.ng-busy-default-spinner .bar12{-webkit-transform:rotate(330deg) translate(0,-142%);transform:rotate(330deg) translateY(-142%);-webkit-animation-delay:-.08333333s;animation-delay:-.08333333s}@-webkit-keyframes busy-spinner-anim{0%{opacity:1}to{opacity:.25}}@keyframes busy-spinner-anim{0%{opacity:1}to{opacity:.25}}