@soei/flyweight 0.2.8 → 0.2.9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/Flyweight.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const c=require("@soei/util"),i=require("vue");let O=/(\d+|[+\-\*/]|%)/g,N={"+":(e,t)=>e+t,"-":(e,t)=>e-t,"*":(e,t)=>e*t,"/":(e,t)=>e/t,"%":(e,t,s)=>parseFloat(e)/100*s},$=(e,t)=>{let s;if(s=c.runer("match",e,O)){let h=s.length,r,n=0,l,o=[];for(;h--;)n=s.shift(),n in N?(r&&o.push(r),n==="%"&&(o.length=2),l=n):+n&&o.push(+n),o.length==2&&(o.push(t),r=N[l].apply(null,o),o.length=0);+r||(r=+o.pop()),e=r>>0}return e},B=e=>(e+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");const C=(e,t)=>{const s=e.__vccOpts||e;for(const[h,r]of t)s[h]=r;return s};let E=e=>e==null||e==null,F=(...e)=>{console.info("::::FLYWEIGHT",...e)};const I={name:"Flyweight",props:{flys:{type:Array,default:()=>[]},width:{type:Number,default:0},height:{type:Number,default:100},offset:{type:Array,default:()=>[0,0]},lazy:{type:Number,default:100},view:{type:Object,default:()=>({id:0})},index:{type:Number,default:0},top:{type:Number,default:!1},left:{type:Number,default:!1},auto:{type:[Boolean,String],default:!1},space:{type:Object,default:()=>null},padding:{type:Boolean,default:!1}},computed:{flyweight(){return this.$refs.flyweight||""}},data(){return{flyweights:[],actice:!1,Size:null,column:1,row:1,expand:10,count:0,task:[],realW:0,realH:0}},watch:{flys(e){this.count=e.length,this.rebuild();let t=this.task.shift();t&&this.$nextTick(()=>{this.setview(t)})},view:{handler(e){this.setview(e)},immediate:!0,deep:!0},index(e){this.setindex(e)},top(e){this.flyweight.scrollTop=e},left(e){this.flyweight.scrollLeft=e}},mounted(){this.flyweights=[],this.$set||(this.$set=(e,t,s)=>{e[t]=s}),this.setindex(this.index);try{new ResizeObserver(()=>{this.rebuild(),this.$emit("resize")}).observe(this.flyweight)}catch(e){F(e)}this.scrollx=c.runer("hasAttribute",this.flyweight,"scroll-x"),this.BoxRule="clientHeight=>height,clientWidth=>width",this.direction=this.scrollx?"scrollLeft":"scrollTop"},methods:{exec:B,trigger(e,t){this.lazyrun(()=>{c.isArray(e)||(e=[[e,t]]),c.each(e,(s,h)=>{this.$emit(h[0],E(h[1])?!0:h[1])})})},cheackflys(e){if(!this.flys.length)return e&&this.task.push(e),!0},setview(e){c.runer([this.cheackflys,t=>{t=t||{};let s=t.index||c.each(this.flys,(h,r,n,l)=>{if(r[n]==l)return h},t.picker,t.id);E(s)||this.setindex(s)}],this,e)},setindex(e){c.runer([this.cheackflys,({index:t})=>{this.selectIndex=t,this.$nextTick(()=>{let s=t/this.column>>0,h=this.expand;(this.flyweight[this.direction]/h>>0)+this.row-s-1>0||(this.flyweight[this.direction]=s*h,this.scroll())})}],this,{index:e})},lazyrun(e,t){clearTimeout(this.time),this.time=setTimeout(()=>{c.runer(e)},t||this.lazy)},run(e){let t=[],s=c.runer(this.direction,e.target),h={offset:s,top:s,width:this.realW,height:this.realH,index:s/this.expand>>0};c.merge(h,this.space),e.from||t.push(["onscroll",h]);let r=!1;c.each(this.flyweights,(n,l,o,d,f,u,p,g,a)=>{if(o=n/f>>0,g=o+d*(+(o<u%d)+(u/d>>0)),a=g*f+n%f,a>=this.count){r||(t.push(["onend"]),r=!0);return}l.index=g,l.i=a,l.data=this.flys[a];let y=[g*this.expand+l.x,l.space];p&&y.reverse(),l.top=y[0],l.left=y[1]},null,this.row,this.column,h.index,this.scrollx),this.trigger(t),t=null},scroll(e){this.run(e||{target:this.flyweight,from:"space"})},rebuild(){let e=this.count||this.flys.length,t=this.flyweights;if(!e)return t.length=e;this.count=e;let s=this.scrollx,h=this.flyweight,r=c.picker(h,this.BoxRule);this.$nextTick(()=>{let n=/true/.test(this.auto),[l,o]=this.offset,d=r.width,f=r.height,u=($(this.width,d)||d)+l,p=$(this.height,f)+o,g=[d/u>>0||1,f/p>>0];s&&g.reverse();let[a,y]=g,_=this.padding,S,k=0,m,b;s?(m=u,u-=l,b=w=>w*(p-o)+(w+1)*o):(n?(u=(d-l*(a+2*_-1))/a,S=!_*l,k=_*l):(S=0,k=(d%u+l*a)/(a+1)>>0,u-=l),b=w=>w*(u+S)+(w+1)*k,m=p),this.row=y+2,this.column=a,this.realH=p-o,this.realW=u,this.expand=m,this.Size=Math.ceil(e/a)*m;let z=Math.min(e,a*this.row),x=z-1,v;for(;z-- >0;)v=x-z,this.$set(t,v,{x:l,y:o,width:u,height:p-o,space:b(v%a),data:{}});t.length=x+1;let T=[];f/m>x/a&&T.push(["onend"]),this.flyweight&&(this.flyweight[this.direction]=0),this.$nextTick(()=>{this.setindex(this.selectIndex||0),this.scroll()}),T.push(["update:space",{row:(x/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(T)})}}},R={class:"flyweight-all"};function V(e,t,s,h,r,n){return i.openBlock(),i.createElementBlock("div",{ref:"flyweight",class:i.normalizeClass(["flyweight",{"flyweight-active":r.actice}]),style:i.normalizeStyle({"--width":n.exec(r.realW),"--height":n.exec(r.realH),"--flyweight-content":n.exec(r.Size)}),onScroll:t[0]||(t[0]=(...l)=>n.scroll&&n.scroll(...l))},[i.createElementVNode("div",R,[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(r.flyweights,(l,o)=>(i.openBlock(),i.createElementBlock("div",{key:o,style:i.normalizeStyle({top:l.top+"px",left:l.left+"px"})},[i.renderSlot(e.$slots,"default",i.mergeProps({ref_for:!0},l),void 0,!0)],4))),128))]),r.flyweights.length?i.renderSlot(e.$slots,"end",{key:0},void 0,!0):i.createCommentVNode("",!0)],38)}const H=C(I,[["render",V],["__scopeId","data-v-15867e3c"]]);const W={name:"Card",props:{offset:{type:[String,Array],default:()=>[0,0,0,0]},background:{type:String,default:""},border:{type:String,default:"1px"},height:{type:String,default:"100%"},width:{type:String,default:"100%"},show:{type:String,default:""},close:{type:Object,default:null},title:{type:String,default:""}},data(){return{closecss:{},style:{},default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){let e={};return this.margin(this.offset),c.each(["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],(t,s)=>{this.css(e,s)}),e}},watch:{close:{handler(e){this.change(e)},deep:!0},offset:{handler(e){this.margin(e)},deep:!0}},methods:{exec:B,isEmpty:c.isEmpty,isSimplyType:c.isSimplyType,tolower(e,t){return t&&(e=e.replace(/[a-z]/g,"")),e.toLowerCase()},css(e,t){let s=this.tolower(t),h=this[s]||this.default[s];!h||this.default[s]==h||(e["--"+this.tolower(t,!0)]=B(h))},change(e){c.isSimplyType(e)||(this.closecss=c.picker(e,"color=>--s-card-close-color,*"))},margin(e){c.merge(this,c.picker(c.isString(e)?e.split(/\s*(?:,|\s+)\s*/):e,"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",!0),!0)}},mounted(){this.change(this.close)}},j={class:"card-title"},A={class:"card-content"};function M(e,t,s,h,r,n){return i.openBlock(),i.createElementBlock("div",{class:"card",style:i.normalizeStyle(n.style)},[i.renderSlot(e.$slots,"default",{},()=>[i.renderSlot(e.$slots,"title",{},()=>[i.createElementVNode("div",j,[i.createTextVNode(i.toDisplayString(s.show||s.title)+" ",1),i.createElementVNode("div",{class:i.normalizeClass(["card-close",{hide:n.isSimplyType(s.close)?!s.close:!1}]),style:i.normalizeStyle(r.closecss),onClick:t[0]||(t[0]=l=>e.$emit("close"))},null,6)])],!0),i.renderSlot(e.$slots,"content",{},()=>[i.createElementVNode("div",A,[i.renderSlot(e.$slots,"inner",{},void 0,!0)])],!0)],!0)],4)}const L=C(W,[["render",M],["__scopeId","data-v-1c7635d6"]]),q=[H,L],G={install(e){q.forEach(t=>{e.component("S"+t.name,t),e.component(t.name+"S",t)})}};exports.Card=L;exports.Flyweight=H;exports.default=G;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const h=require("@soei/util"),i=require("vue");let F=/(\d+|[+\-\*/]|%)/g,B={"+":(e,t)=>e+t,"-":(e,t)=>e-t,"*":(e,t)=>e*t,"/":(e,t)=>e/t,"%":(e,t,s)=>parseFloat(e)/100*s},N=(e,t)=>{let s;if(s=h.runer("match",e,F)){let n=s.length,l,o=0,r,a=[];for(;n--;)o=s.shift(),o in B?(l&&a.push(l),o==="%"&&(a.length=2),r=o):+o&&a.push(+o),a.length==2&&(a.push(t),l=B[r].apply(null,a),a.length=0);+l||(l=+a.pop()),e=l>>0}return e},$=e=>(e+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");const C=(e,t)=>{const s=e.__vccOpts||e;for(const[n,l]of t)s[n]=l;return s};let E=e=>e==null||e==null,A=(...e)=>{console.info("::::FLYWEIGHT",...e)};const I={name:"Flyweight",props:{flys:{type:Array,default:()=>[]},width:{type:Number,default:0},height:{type:Number,default:100},offset:{type:Array,default:()=>[0,0]},lazy:{type:Number,default:100},view:{type:Object,default:()=>({id:0})},index:{type:Number,default:0},top:{type:Number,default:!1},left:{type:Number,default:!1},auto:{type:[Boolean,String],default:!1},space:{type:Object,default:()=>null},padding:{type:Boolean,default:!1}},computed:{flyweight(){return this.$refs.flyweight||""}},data(){return{flyweights:[],actice:!1,Size:null,column:1,row:1,expand:10,count:0,task:[],realW:0,realH:0}},watch:{flys(e){this.count=e.length,this.rebuild();let t=this.task.shift();t&&this.$nextTick(()=>{this.setview(t)})},view:{handler(e){this.setview(e)},immediate:!0,deep:!0},index(e){this.setindex(e)},top(e){this.flyweight.scrollTop=e},left(e){this.flyweight.scrollLeft=e}},mounted(){this.flyweights=[],this.$set||(this.$set=(e,t,s)=>{e[t]=s}),this.setindex(this.index);try{new ResizeObserver(()=>{this.rebuild(),this.$emit("resize")}).observe(this.flyweight)}catch(e){A(e)}this.scrollx=h.runer("hasAttribute",this.flyweight,"scroll-x"),this.BoxRule="clientHeight=>height,clientWidth=>width",this.direction=this.scrollx?"scrollLeft":"scrollTop"},methods:{exec:$,trigger(e,t){this.lazyrun(()=>{h.isArray(e)||(e=[[e,t]]),h.each(e,(s,n)=>{this.$emit(n[0],E(n[1])?!0:n[1])})})},cheackflys(e){if(!this.flys.length)return e&&this.task.push(e),!0},setview(e){h.runer([this.cheackflys,t=>{t=t||{};let s=t.index||h.each(this.flys,(n,l,o,r)=>{if(l[o]==r)return n},t.picker,t.id);E(s)||this.setindex(s)}],this,e)},setindex(e){h.runer([this.cheackflys,({index:t})=>{this.selectIndex=t,this.$nextTick(()=>{let s=t/this.column>>0,n=this.expand;(this.flyweight[this.direction]/n>>0)+this.row-s-1>0||(this.flyweight[this.direction]=s*n,this.scroll())})}],this,{index:e})},lazyrun(e,t){clearTimeout(this.time),this.time=setTimeout(()=>{h.runer(e)},t||this.lazy)},run(e){let t=[],s=h.runer(this.direction,e.target),n={offset:s,top:s,width:this.realW,height:this.realH,index:s/this.expand>>0};h.merge(n,this.space),e.from||t.push(["onscroll",n]);let l=!1;h.each(this.flyweights,(o,r,a,u,f,d,p,g,c)=>{if(a=o/f>>0,g=a+u*(+(a<d%u)+(d/u>>0)),c=g*f+o%f,c>=this.count){l||(t.push(["onend"]),l=!0);return}r.index=g,r.i=c,r.data=this.flys[c];let y=[g*this.expand+r.x,r.space];p&&y.reverse(),r.top=y[0],r.left=y[1]},null,this.row,this.column,n.index,this.scrollx),this.trigger(t),t=null},scroll(e){this.run(e||{target:this.flyweight,from:"space"})},rebuild(){let e=this.count||this.flys.length,t=this.flyweights;if(!e)return t.length=e;this.count=e;let s=this.scrollx,n=this.flyweight,l=h.picker(n,this.BoxRule);this.$nextTick(()=>{let o=/true/.test(this.auto),[r,a]=this.offset,u=l.width,f=l.height,d=(N(this.width,u)||u)+r,p=N(this.height,f)+a,g=[u/d>>0||1,f/p>>0||1];s&&g.reverse();let[c,y]=g,_=this.padding,S,k=0,m,b;s?(m=d,d-=r,b=w=>w*(p-a)+(w+1)*a):(o?(d=(u-r*(c+2*_-1))/c,S=!_*r,k=_*r):(S=0,k=(u%d+r*c)/(c+1)>>0,d-=r),b=w=>w*(d+S)+(w+1)*k,m=p),this.row=y+2,this.column=c,this.realH=p-a,this.realW=d,this.expand=m,this.Size=Math.ceil(e/c)*m;let v=Math.min(e,c*this.row),x=v-1,z;for(;v-- >0;)z=x-v,this.$set(t,z,{x:r,y:a,width:d,height:p-a,space:b(z%c),data:{}});t.length=x+1;let T=[];f/m>x/c&&T.push(["onend"]),this.flyweight&&(this.flyweight[this.direction]=0),this.$nextTick(()=>{this.setindex(this.selectIndex||0),this.scroll()}),T.push(["update:space",{row:(x/c>>0)+1,column:c,showrow:this.row,showcolumn:this.column}]),this.trigger(T)})}}},R={class:"flyweight-all"};function V(e,t,s,n,l,o){return i.openBlock(),i.createElementBlock("div",{ref:"flyweight",class:i.normalizeClass(["flyweight",{"flyweight-active":l.actice}]),style:i.normalizeStyle({"--width":o.exec(l.realW),"--height":o.exec(l.realH),"--flyweight-content":o.exec(l.Size)}),onScroll:t[0]||(t[0]=(...r)=>o.scroll&&o.scroll(...r))},[i.createElementVNode("div",R,[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(l.flyweights,(r,a)=>(i.openBlock(),i.createElementBlock("div",{key:a,style:i.normalizeStyle({top:r.top+"px",left:r.left+"px"})},[i.renderSlot(e.$slots,"default",i.mergeProps({ref_for:!0},r),void 0,!0)],4))),128))]),l.flyweights.length?i.renderSlot(e.$slots,"end",{key:0},void 0,!0):i.createCommentVNode("",!0)],38)}const H=C(I,[["render",V],["__scopeId","data-v-8f29f044"]]);const W={name:"Card",props:{offset:{type:[String,Array],default:()=>[0,0,0,0]},background:{type:String,default:""},border:{type:String,default:"1px"},height:{type:String,default:"100%"},width:{type:String,default:"100%"},show:{type:String,default:""},close:{type:Object,default:null},title:{type:String,default:""}},data(){return{closecss:{},style:{},default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){let e={};return this.margin(this.offset),h.each(["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],(t,s)=>{this.css(e,s)}),e}},watch:{close:{handler(e){this.change(e)},deep:!0},offset:{handler(e){this.margin(e)},deep:!0}},methods:{exec:$,isEmpty:h.isEmpty,isSimplyType:h.isSimplyType,tolower(e,t){return t&&(e=e.replace(/[a-z]/g,"")),e.toLowerCase()},css(e,t){let s=this.tolower(t),n=this[s]||this.default[s];!n||this.default[s]==n||(e["--"+this.tolower(t,!0)]=$(n))},change(e){h.isSimplyType(e)||(this.closecss=h.picker(e,"color=>--s-card-close-color,*"))},margin(e){h.merge(this,h.picker(h.isString(e)?e.split(/\s*(?:,|\s+)\s*/):e,"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",!0),!0)}},mounted(){this.change(this.close)}},j={class:"card-title"},M={class:"card-content"};function q(e,t,s,n,l,o){return i.openBlock(),i.createElementBlock("div",{class:"card",style:i.normalizeStyle(o.style)},[i.renderSlot(e.$slots,"default",{},()=>[i.renderSlot(e.$slots,"title",{},()=>[i.createElementVNode("div",j,[i.createTextVNode(i.toDisplayString(s.show||s.title)+" ",1),i.createElementVNode("div",{class:i.normalizeClass(["card-close",{hide:o.isSimplyType(s.close)?!s.close:!1}]),style:i.normalizeStyle(l.closecss),onClick:t[0]||(t[0]=r=>e.$emit("close"))},null,6)])],!0),i.renderSlot(e.$slots,"content",{},()=>[i.createElementVNode("div",M,[i.renderSlot(e.$slots,"inner",{},void 0,!0)])],!0)],!0)],4)}const L=C(W,[["render",q],["__scopeId","data-v-def66c95"]]),O={name:"Stream",props:{type:{type:String,default:"div"},data:{type:Array,default:()=>({})},T:{type:Array,default:()=>[]}},render(e){return e(this.type||"div",{props:{data:this.data}},this._l(this.T,(t,s)=>{let n=h.picker(t,"slot|name=>name").name,l=h.picker(this,h.format("$scopedSlots.?|$slots.?|$scopedSlots.default=>?",n));return h.merge(t,{index:s}),h.runer(n,l,t)}))}},G=[H,L,O],P={install(e){G.forEach(t=>{e.component("S"+t.name,t),e.component(t.name+"S",t)})}};exports.Card=L;exports.Flyweight=H;exports.Stream=O;exports.default=P;
package/Flyweight.js CHANGED
@@ -1,6 +1,6 @@
1
- import { runer as g, isArray as V, each as _, merge as E, picker as C, isEmpty as G, isSimplyType as F, isString as M } from "@soei/util";
2
- import { openBlock as b, createElementBlock as k, normalizeClass as A, normalizeStyle as v, createElementVNode as S, Fragment as D, renderList as P, renderSlot as p, mergeProps as U, createCommentVNode as X, createTextVNode as Y, toDisplayString as q } from "vue";
3
- let J = /(\d+|[+\-\*/]|%)/g, I = {
1
+ import { runer as p, isArray as V, each as S, merge as A, picker as x, isEmpty as G, isSimplyType as F, isString as M, format as D } from "@soei/util";
2
+ import { openBlock as b, createElementBlock as k, normalizeClass as E, normalizeStyle as T, createElementVNode as v, Fragment as P, renderList as U, renderSlot as g, mergeProps as X, createCommentVNode as Y, createTextVNode as q, toDisplayString as J } from "vue";
3
+ let K = /(\d+|[+\-\*/]|%)/g, I = {
4
4
  "+": (e, t) => e + t,
5
5
  "-": (e, t) => e - t,
6
6
  "*": (e, t) => e * t,
@@ -8,24 +8,24 @@ let J = /(\d+|[+\-\*/]|%)/g, I = {
8
8
  "%": (e, t, s) => parseFloat(e) / 100 * s
9
9
  }, R = (e, t) => {
10
10
  let s;
11
- if (s = g("match", e, J)) {
12
- let r = s.length, l, h = 0, i, n = [];
11
+ if (s = p("match", e, K)) {
12
+ let r = s.length, i, h = 0, l, n = [];
13
13
  for (; r--; )
14
- h = s.shift(), h in I ? (l && n.push(l), h === "%" && (n.length = 2), i = h) : +h && n.push(+h), n.length == 2 && (n.push(t), l = I[i].apply(null, n), n.length = 0);
15
- +l || (l = +n.pop()), e = l >> 0;
14
+ h = s.shift(), h in I ? (i && n.push(i), h === "%" && (n.length = 2), l = h) : +h && n.push(+h), n.length == 2 && (n.push(t), i = I[l].apply(null, n), n.length = 0);
15
+ +i || (i = +n.pop()), e = i >> 0;
16
16
  }
17
17
  return e;
18
18
  }, O = (e) => (e + "").replace(/\w+\((.*)\)/g, "$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g, "$1px");
19
19
  const j = (e, t) => {
20
20
  const s = e.__vccOpts || e;
21
- for (const [r, l] of t)
22
- s[r] = l;
21
+ for (const [r, i] of t)
22
+ s[r] = i;
23
23
  return s;
24
24
  };
25
- let W = (e) => e == null || e == null, K = (...e) => {
25
+ let W = (e) => e == null || e == null, Q = (...e) => {
26
26
  console.info("::::FLYWEIGHT", ...e);
27
27
  };
28
- const Q = {
28
+ const Z = {
29
29
  name: "Flyweight",
30
30
  props: {
31
31
  flys: {
@@ -130,16 +130,16 @@ const Q = {
130
130
  this.rebuild(), this.$emit("resize");
131
131
  }).observe(this.flyweight);
132
132
  } catch (e) {
133
- K(e);
133
+ Q(e);
134
134
  }
135
- this.scrollx = g("hasAttribute", this.flyweight, "scroll-x"), this.BoxRule = /* this.scrollx ? 'clientHeight=>width,clientWidth=>height' : */
135
+ this.scrollx = p("hasAttribute", this.flyweight, "scroll-x"), this.BoxRule = /* this.scrollx ? 'clientHeight=>width,clientWidth=>height' : */
136
136
  "clientHeight=>height,clientWidth=>width", this.direction = this.scrollx ? "scrollLeft" : "scrollTop";
137
137
  },
138
138
  methods: {
139
139
  exec: O,
140
140
  trigger(e, t) {
141
141
  this.lazyrun(() => {
142
- V(e) || (e = [[e, t]]), _(e, (s, r) => {
142
+ V(e) || (e = [[e, t]]), S(e, (s, r) => {
143
143
  this.$emit(r[0], W(r[1]) ? !0 : r[1]);
144
144
  });
145
145
  });
@@ -149,17 +149,17 @@ const Q = {
149
149
  return e && this.task.push(e), !0;
150
150
  },
151
151
  setview(e) {
152
- g([this.cheackflys, (t) => {
152
+ p([this.cheackflys, (t) => {
153
153
  t = t || {};
154
- let s = t.index || _(this.flys, (r, l, h, i) => {
155
- if (l[h] == i)
154
+ let s = t.index || S(this.flys, (r, i, h, l) => {
155
+ if (i[h] == l)
156
156
  return r;
157
157
  }, t.picker, t.id);
158
158
  W(s) || this.setindex(s);
159
159
  }], this, e);
160
160
  },
161
161
  setindex(e) {
162
- g([this.cheackflys, ({ index: t }) => {
162
+ p([this.cheackflys, ({ index: t }) => {
163
163
  this.selectIndex = t, this.$nextTick(() => {
164
164
  let s = t / this.column >> 0, r = this.expand;
165
165
  (this.flyweight[this.direction] / r >> 0) + this.row - s - 1 > 0 || (this.flyweight[this.direction] = s * r, this.scroll());
@@ -168,11 +168,11 @@ const Q = {
168
168
  },
169
169
  lazyrun(e, t) {
170
170
  clearTimeout(this.time), this.time = setTimeout(() => {
171
- g(e);
171
+ p(e);
172
172
  }, t || this.lazy);
173
173
  },
174
174
  run(e) {
175
- let t = [], s = g(this.direction, e.target), r = {
175
+ let t = [], s = p(this.direction, e.target), r = {
176
176
  // ...this
177
177
  offset: s,
178
178
  top: s,
@@ -181,24 +181,24 @@ const Q = {
181
181
  /* 显示区域第一行的索引 */
182
182
  index: s / this.expand >> 0
183
183
  };
184
- E(r, this.space), e.from || t.push(["onscroll", r]);
185
- let l = !1;
186
- _(
184
+ A(r, this.space), e.from || t.push(["onscroll", r]);
185
+ let i = !1;
186
+ S(
187
187
  this.flyweights,
188
- (h, i, n, a, d, c, u, f, o) => {
189
- if (n = h / d >> 0, f = n + a * /* 偏移量, 如果超出顶部 + 1轮,排列到列队后, 否则保持在当前*/
190
- (+(n < c % a) + (c / a >> 0)), o = f * d + h % d, o >= this.count) {
191
- l || (t.push(["onend"]), l = !0);
188
+ (h, l, n, c, d, a, f, u, o) => {
189
+ if (n = h / d >> 0, u = n + c * /* 偏移量, 如果超出顶部 + 1轮,排列到列队后, 否则保持在当前*/
190
+ (+(n < a % c) + (a / c >> 0)), o = u * d + h % d, o >= this.count) {
191
+ i || (t.push(["onend"]), i = !0);
192
192
  return;
193
193
  }
194
- i.index = f, i.i = o, i.data = this.flys[o];
194
+ l.index = u, l.i = o, l.data = this.flys[o];
195
195
  let y = [
196
196
  /* top */
197
- f * this.expand + i.x,
197
+ u * this.expand + l.x,
198
198
  /* left */
199
- i.space
199
+ l.space
200
200
  ];
201
- u && y.reverse(), i.top = y[0], i.left = y[1];
201
+ f && y.reverse(), l.top = y[0], l.left = y[1];
202
202
  },
203
203
  null,
204
204
  this.row,
@@ -216,68 +216,68 @@ const Q = {
216
216
  if (!e)
217
217
  return t.length = e;
218
218
  this.count = e;
219
- let s = this.scrollx, r = this.flyweight, l = C(r, this.BoxRule);
219
+ let s = this.scrollx, r = this.flyweight, i = x(r, this.BoxRule);
220
220
  this.$nextTick(() => {
221
- let h = /true/.test(this.auto), [i, n] = this.offset, a = l.width, d = l.height, c = (R(this.width, a) || a) + i, u = R(this.height, d) + n, f = [a / c >> 0 || 1, d / u >> 0];
222
- s && f.reverse();
223
- let [o, y] = f, z = this.padding, T, $ = 0, w, N;
224
- s ? (w = c, c -= i, N = (m) => (
221
+ let h = /true/.test(this.auto), [l, n] = this.offset, c = i.width, d = i.height, a = (R(this.width, c) || c) + l, f = R(this.height, d) + n, u = [c / a >> 0 || 1, d / f >> 0 || 1];
222
+ s && u.reverse();
223
+ let [o, y] = u, $ = this.padding, z, N = 0, m, B;
224
+ s ? (m = a, a -= l, B = (w) => (
225
225
  /* 计算top偏移量 */
226
- m * (u - n) + (m + 1) * n
227
- )) : (h ? (c = (a - i * (o + 2 * z - 1)) / o, T = !z * i, $ = z * i) : (T = 0, $ = (a % c + i * o) / (o + 1) >> 0, c -= i), N = (m) => m * (c + T) + (m + 1) * $, w = u), this.row = y + 2, this.column = o, this.realH = u - n, this.realW = c, this.expand = w, this.Size = Math.ceil(e / o) * w;
228
- let B = Math.min(e, o * this.row), x = B - 1, H;
229
- for (; B-- > 0; )
230
- H = x - B, this.$set(t, H, {
231
- x: i,
226
+ w * (f - n) + (w + 1) * n
227
+ )) : (h ? (a = (c - l * (o + 2 * $ - 1)) / o, z = !$ * l, N = $ * l) : (z = 0, N = (c % a + l * o) / (o + 1) >> 0, a -= l), B = (w) => w * (a + z) + (w + 1) * N, m = f), this.row = y + 2, this.column = o, this.realH = f - n, this.realW = a, this.expand = m, this.Size = Math.ceil(e / o) * m;
228
+ let H = Math.min(e, o * this.row), _ = H - 1, L;
229
+ for (; H-- > 0; )
230
+ L = _ - H, this.$set(t, L, {
231
+ x: l,
232
232
  y: n,
233
- width: c,
234
- height: u - n,
235
- space: N(H % o),
233
+ width: a,
234
+ height: f - n,
235
+ space: B(L % o),
236
236
  data: {}
237
237
  });
238
- t.length = x + 1;
239
- let L = [];
240
- d / w > x / o && L.push(["onend"]), this.flyweight && (this.flyweight[this.direction] = 0), this.$nextTick(() => {
238
+ t.length = _ + 1;
239
+ let C = [];
240
+ d / m > _ / o && C.push(["onend"]), this.flyweight && (this.flyweight[this.direction] = 0), this.$nextTick(() => {
241
241
  this.setindex(this.selectIndex || 0), this.scroll();
242
- }), L.push(["update:space", {
243
- row: (x / o >> 0) + 1,
242
+ }), C.push(["update:space", {
243
+ row: (_ / o >> 0) + 1,
244
244
  column: o,
245
245
  showrow: this.row,
246
246
  showcolumn: this.column
247
- }]), this.trigger(L);
247
+ }]), this.trigger(C);
248
248
  });
249
249
  }
250
250
  }
251
- }, Z = { class: "flyweight-all" };
252
- function ee(e, t, s, r, l, h) {
251
+ }, ee = { class: "flyweight-all" };
252
+ function te(e, t, s, r, i, h) {
253
253
  return b(), k("div", {
254
254
  ref: "flyweight",
255
- class: A(["flyweight", {
256
- "flyweight-active": l.actice
255
+ class: E(["flyweight", {
256
+ "flyweight-active": i.actice
257
257
  }]),
258
- style: v({
259
- "--width": h.exec(l.realW),
260
- "--height": h.exec(l.realH),
261
- "--flyweight-content": h.exec(l.Size)
258
+ style: T({
259
+ "--width": h.exec(i.realW),
260
+ "--height": h.exec(i.realH),
261
+ "--flyweight-content": h.exec(i.Size)
262
262
  }),
263
- onScroll: t[0] || (t[0] = (...i) => h.scroll && h.scroll(...i))
263
+ onScroll: t[0] || (t[0] = (...l) => h.scroll && h.scroll(...l))
264
264
  }, [
265
- S("div", Z, [
266
- (b(!0), k(D, null, P(l.flyweights, (i, n) => (b(), k("div", {
265
+ v("div", ee, [
266
+ (b(!0), k(P, null, U(i.flyweights, (l, n) => (b(), k("div", {
267
267
  key: n,
268
- style: v({
269
- top: i.top + "px",
270
- left: i.left + "px"
268
+ style: T({
269
+ top: l.top + "px",
270
+ left: l.left + "px"
271
271
  })
272
272
  }, [
273
- p(e.$slots, "default", U({ ref_for: !0 }, i), void 0, !0)
273
+ g(e.$slots, "default", X({ ref_for: !0 }, l), void 0, !0)
274
274
  ], 4))), 128))
275
275
  ]),
276
- l.flyweights.length ? p(e.$slots, "end", { key: 0 }, void 0, !0) : X("", !0)
276
+ i.flyweights.length ? g(e.$slots, "end", { key: 0 }, void 0, !0) : Y("", !0)
277
277
  ], 38);
278
278
  }
279
- const te = /* @__PURE__ */ j(Q, [["render", ee], ["__scopeId", "data-v-15867e3c"]]);
280
- const se = {
279
+ const se = /* @__PURE__ */ j(Z, [["render", te], ["__scopeId", "data-v-8f29f044"]]);
280
+ const ie = {
281
281
  name: "Card",
282
282
  // inheritAttrs: false,
283
283
  props: {
@@ -333,7 +333,7 @@ const se = {
333
333
  computed: {
334
334
  style() {
335
335
  let e = {};
336
- return this.margin(this.offset), _(["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], (t, s) => {
336
+ return this.margin(this.offset), S(["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], (t, s) => {
337
337
  this.css(e, s);
338
338
  }), e;
339
339
  }
@@ -364,10 +364,10 @@ const se = {
364
364
  !r || this.default[s] == r || (e["--" + this.tolower(t, !0)] = O(r));
365
365
  },
366
366
  change(e) {
367
- F(e) || (this.closecss = C(e, "color=>--s-card-close-color,*"));
367
+ F(e) || (this.closecss = x(e, "color=>--s-card-close-color,*"));
368
368
  },
369
369
  margin(e) {
370
- E(this, C(
370
+ A(this, x(
371
371
  M(e) ? e.split(/\s*(?:,|\s+)\s*/) : e,
372
372
  "0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",
373
373
  !0
@@ -377,40 +377,72 @@ const se = {
377
377
  mounted() {
378
378
  this.change(this.close);
379
379
  }
380
- }, ie = { class: "card-title" }, le = { class: "card-content" };
381
- function re(e, t, s, r, l, h) {
380
+ }, le = { class: "card-title" }, re = { class: "card-content" };
381
+ function he(e, t, s, r, i, h) {
382
382
  return b(), k("div", {
383
383
  class: "card",
384
- style: v(h.style)
384
+ style: T(h.style)
385
385
  }, [
386
- p(e.$slots, "default", {}, () => [
387
- p(e.$slots, "title", {}, () => [
388
- S("div", ie, [
389
- Y(q(s.show || s.title) + " ", 1),
390
- S("div", {
391
- class: A(["card-close", { hide: h.isSimplyType(s.close) ? !s.close : !1 }]),
392
- style: v(l.closecss),
393
- onClick: t[0] || (t[0] = (i) => e.$emit("close"))
386
+ g(e.$slots, "default", {}, () => [
387
+ g(e.$slots, "title", {}, () => [
388
+ v("div", le, [
389
+ q(J(s.show || s.title) + " ", 1),
390
+ v("div", {
391
+ class: E(["card-close", { hide: h.isSimplyType(s.close) ? !s.close : !1 }]),
392
+ style: T(i.closecss),
393
+ onClick: t[0] || (t[0] = (l) => e.$emit("close"))
394
394
  }, null, 6)
395
395
  ])
396
396
  ], !0),
397
- p(e.$slots, "content", {}, () => [
398
- S("div", le, [
399
- p(e.$slots, "inner", {}, void 0, !0)
397
+ g(e.$slots, "content", {}, () => [
398
+ v("div", re, [
399
+ g(e.$slots, "inner", {}, void 0, !0)
400
400
  ])
401
401
  ], !0)
402
402
  ], !0)
403
403
  ], 4);
404
404
  }
405
- const he = /* @__PURE__ */ j(se, [["render", re], ["__scopeId", "data-v-1c7635d6"]]), ne = [te, he], ae = {
405
+ const ne = /* @__PURE__ */ j(ie, [["render", he], ["__scopeId", "data-v-def66c95"]]), oe = {
406
+ name: "Stream",
407
+ props: {
408
+ type: {
409
+ type: String,
410
+ default: "div"
411
+ },
412
+ data: {
413
+ type: Array,
414
+ default: () => ({})
415
+ },
416
+ T: {
417
+ type: Array,
418
+ default: () => []
419
+ }
420
+ },
421
+ render(e) {
422
+ return e(
423
+ this.type || "div",
424
+ {
425
+ // ...item,
426
+ props: {
427
+ data: this.data
428
+ }
429
+ },
430
+ this._l(this.T, (t, s) => {
431
+ let r = x(t, "slot|name=>name").name, i = x(this, D("$scopedSlots.?|$slots.?|$scopedSlots.default=>?", r));
432
+ return A(t, { index: s }), p(r, i, t);
433
+ })
434
+ );
435
+ }
436
+ }, ae = [se, ne, oe], fe = {
406
437
  install(e) {
407
- ne.forEach((t) => {
438
+ ae.forEach((t) => {
408
439
  e.component("S" + t.name, t), e.component(t.name + "S", t);
409
440
  });
410
441
  }
411
442
  };
412
443
  export {
413
- he as Card,
414
- te as Flyweight,
415
- ae as default
444
+ ne as Card,
445
+ se as Flyweight,
446
+ oe as Stream,
447
+ fe as default
416
448
  };
package/README.md CHANGED
@@ -11,10 +11,103 @@
11
11
  <!-- 确认父容器 宽 高 存在, 依赖父容器 `宽`, `高` 计算 -->
12
12
  <s-flyweight ...></s-flyweight>
13
13
  </div>
14
+ <template>
15
+ <Card class="flyweight-test" flex column simply>
16
+ <template #title>
17
+ <div>Flyweight Test</div>
18
+ </template>
19
+ <template #inner>
20
+ <Card class="applist" backgroundd="#f7f7f7" border="0.1px" height="100%">
21
+ <Flyweight
22
+ :flys="flys"
23
+ hover-scroll
24
+ scroll-x
25
+ auto
26
+ :view="view"
27
+ :width="100"
28
+ padding
29
+ height="100% - 10px"
30
+ :offset="[10, 10]"
31
+ >
32
+ <template #default="{ data, x, y, width, height, space, i }">
33
+ <div
34
+ class="flyweight-item demo"
35
+ :class="{ [`flyweight-item-${i & 3}`]: true}"
36
+ >
37
+ {{ data.name }}
38
+ </div>
39
+ </template>
40
+ <template #end>
41
+ <div>end</div>
42
+ </template>
43
+ </Flyweight>
44
+ </Card>
45
+ </template>
46
+ </Card>
47
+ </template>
48
+
49
+ <script setup>
50
+ //...
51
+ /* 引入依赖 */
52
+ import { Flyweight, Card } from "@soei/flyweight";
53
+ let flys = ref([]);
54
+ flys.value = Array.from({ length: 200 }, (_, i) => ({ name: i }));
55
+ let view = reactive({
56
+ picker: "name",
57
+ id: 10,
58
+ });
59
+ //...
60
+ </script>
14
61
  ```
15
62
 
16
63
  [![安装](https://img.shields.io/badge/引用-import_{_Flyweight_}_from_"@soei/flyweight"-00bcd4?style=flat-square)](https://npmjs.com/package/@soei/flyweight)
17
64
 
65
+ ## 新增 `Stream` 组件池
66
+
67
+ ```html
68
+ <template>
69
+ <Stream
70
+ class="form"
71
+ :T="[
72
+ { type: 'name', label: '输入框' },
73
+ { type: 'state', label: '选择任务', data: [{label, value}, ...] },
74
+ { type: 'state', label: '选择事件', data: [{label, value}, ...] },
75
+ ]"
76
+ >
77
+ <template #state="{ type, label, index, data }">
78
+ <div class="form_item">
79
+ <el-select size="mini" v-model="search[type]" :placeholder="label">
80
+ <el-option
81
+ v-for="item in data"
82
+ :key="item.value"
83
+ :label="item.label"
84
+ :value="item.value"
85
+ >
86
+ </el-option>
87
+ </el-select>
88
+ </div>
89
+ </template>
90
+ <template #default="{ slot, label, index }">
91
+ <div class="form_item">
92
+ <el-input
93
+ size="mini"
94
+ v-model="search[slot]"
95
+ :placeholder="label"
96
+ ></el-input>
97
+ </div>
98
+ </template>
99
+ </Stream>
100
+ </template>
101
+ <script setup>
102
+ // 导入
103
+ import { Stream } from "@soei/flyweight";
104
+ </script>
105
+ ```
106
+
107
+ ## 问题修复
108
+
109
+ - #### 修复了上版本极限显示,当`高度不足显示一行`的问题
110
+
18
111
  ## `安装`
19
112
 
20
113
  ```bash
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@soei/flyweight",
3
3
  "private": false,
4
4
  "description": "Vue组件, 列表de享元模式~减少DOM节点 flyweight, Card组件",
5
- "version": "0.2.8",
5
+ "version": "0.2.9",
6
6
  "type": "module",
7
7
  "main": "Flyweight.cjs",
8
8
  "module": "Flyweight.js",
package/style.css CHANGED
@@ -1 +1 @@
1
- @charset "UTF-8";.flyweight[data-v-15867e3c]{height:100%;width:100%;overflow:auto;position:relative}.flyweight[hover-scroll][data-v-15867e3c]::-webkit-scrollbar-track,.flyweight[auto-scroll][data-v-15867e3c]::-webkit-scrollbar-track{border-radius:10px}.flyweight[hover-scroll][data-v-15867e3c]::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-15867e3c]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.flyweight[hover-scroll][data-v-15867e3c]::-webkit-scrollbar,.flyweight[auto-scroll][data-v-15867e3c]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 5px);height:var(--scrollbar-width, 5px)}.flyweight[hover-scroll][data-v-15867e3c]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-15867e3c]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.flyweight[scroll-x] .flyweight-all[data-v-15867e3c]{width:var(--flyweight-content);height:auto;min-height:100%}.flyweight[scroll-x] .flyweight-all[data-v-15867e3c]+*{left:var(--flyweight-content);position:absolute;top:0;height:100%}.flyweight .flyweight-all[data-v-15867e3c]{height:var(--flyweight-content)}.flyweight .flyweight-all[data-v-15867e3c]>*{width:calc(var(--width));height:var(--height);position:absolute}.card[data-v-1c7635d6]{--t: 0px;--r: 0px;--b: 0px;--l: 0px;--h: 100%;--w: 100%;--br: 1px;position:relative;background-color:var(--bg, var(--card-background-color, #fff));padding:10px;border-radius:10px;box-sizing:border-box;border-style:solid;border-color:var(--card-border-color, #555);border-width:var(--br);justify-content:flex-start;margin:var(--t) var(--r) var(--b) var(--l);height:calc(var(--h) - var(--t) - var(--b));width:calc(var(--w) - var(--l) - var(--r));overflow:auto}.card[hover-scroll][data-v-1c7635d6]::-webkit-scrollbar-track,.card[auto-scroll][data-v-1c7635d6]::-webkit-scrollbar-track{border-radius:10px}.card[hover-scroll][data-v-1c7635d6]::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-1c7635d6]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.card[hover-scroll][data-v-1c7635d6]::-webkit-scrollbar,.card[auto-scroll][data-v-1c7635d6]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 5px);height:var(--scrollbar-width, 5px)}.card[hover-scroll][data-v-1c7635d6]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-1c7635d6]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.card[simply][data-v-1c7635d6],.card [simply][data-v-1c7635d6]{background-color:inherit;border:0!important}.card[flex][data-v-1c7635d6],.card [flex][data-v-1c7635d6]{display:flex}.card[column][data-v-1c7635d6],.card [column][data-v-1c7635d6]{flex-direction:column}.card[row][data-v-1c7635d6],.card [row][data-v-1c7635d6]{flex-direction:row}.card[center][data-v-1c7635d6],.card [center][data-v-1c7635d6]{justify-content:center}.card[vcenter][data-v-1c7635d6],.card [vcenter][data-v-1c7635d6]{align-items:center}.card .card-title[data-v-1c7635d6]{max-height:40px}.card .card-close[data-v-1c7635d6]{position:absolute;width:20px;height:20px;right:10px;top:10px;border-radius:10px;z-index:1;--s-transform: 45deg;--s-hover-transform: 35deg;--s-close-width: 11px;--s-close-height: 2px;cursor:pointer;background-color:var(--s-card-close-background-color, transparent);transition:all .3s ease}.card .card-close.hide[data-v-1c7635d6]{display:none}.card .card-close[data-v-1c7635d6]:before,.card .card-close[data-v-1c7635d6]:after{content:"";width:var(--s-close-width, 11px);height:var(--s-close-height, 2px);background-color:var(--s-card-close-color, #555);transform-origin:center;position:inherit;border-radius:10px;top:calc(50% - var(--s-close-height, 2px) / 2);left:calc(50% - var(--s-close-width, 11px) / 2)}.card .card-close[data-v-1c7635d6]:before{transform:rotate(var(--s-transform, 45deg))}.card .card-close[data-v-1c7635d6]:after{transform:rotate(calc(0deg - var(--s-transform, 45deg)))}.card .card-close[data-v-1c7635d6]:hover:before{transform:rotate(var(--s-hover-transform, 45deg))}.card .card-close[data-v-1c7635d6]:hover:after{transform:rotate(calc(0deg - var(--s-hover-transform, 45deg)))}.card .card-content[data-v-1c7635d6]{overflow:auto;height:100%}
1
+ @charset "UTF-8";.flyweight[data-v-8f29f044]{height:100%;width:100%;overflow:auto;position:relative}.flyweight[hover-scroll][data-v-8f29f044]::-webkit-scrollbar-track,.flyweight[auto-scroll][data-v-8f29f044]::-webkit-scrollbar-track{border-radius:10px}.flyweight[hover-scroll][data-v-8f29f044]::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-8f29f044]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.flyweight[hover-scroll][data-v-8f29f044]::-webkit-scrollbar,.flyweight[auto-scroll][data-v-8f29f044]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.flyweight[hover-scroll][data-v-8f29f044]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-8f29f044]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.flyweight[hover-scroll][data-v-8f29f044]:hover::-webkit-scrollbar-thumb:hover,.flyweight[auto-scroll][data-v-8f29f044]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.flyweight[hover-scroll][data-v-8f29f044]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-8f29f044]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.flyweight[scroll-x] .flyweight-all[data-v-8f29f044]{width:var(--flyweight-content);height:auto;min-height:100%}.flyweight[scroll-x] .flyweight-all[data-v-8f29f044]+*{left:var(--flyweight-content);position:absolute;top:0;height:100%}.flyweight .flyweight-all[data-v-8f29f044]{height:var(--flyweight-content)}.flyweight .flyweight-all[data-v-8f29f044]>*{width:calc(var(--width));height:var(--height);position:absolute}@media screen and (-apple-system: Macintosh){.flyweight .flyweight-all[data-v-8f29f044]{background-color:red!important}}.card[data-v-def66c95]{--t: 0px;--r: 0px;--b: 0px;--l: 0px;--h: 100%;--w: 100%;--br: 1px;position:relative;background-color:var(--bg, var(--card-background-color, #fff));padding:10px;border-radius:10px;box-sizing:border-box;border-style:solid;border-color:var(--card-border-color, #555);border-width:var(--br);justify-content:flex-start;margin:var(--t) var(--r) var(--b) var(--l);height:calc(var(--h) - var(--t) - var(--b));width:calc(var(--w) - var(--l) - var(--r));overflow:auto}.card[hover-scroll][data-v-def66c95]::-webkit-scrollbar-track,.card[auto-scroll][data-v-def66c95]::-webkit-scrollbar-track{border-radius:10px}.card[hover-scroll][data-v-def66c95]::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-def66c95]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.card[hover-scroll][data-v-def66c95]::-webkit-scrollbar,.card[auto-scroll][data-v-def66c95]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.card[hover-scroll][data-v-def66c95]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-def66c95]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.card[hover-scroll][data-v-def66c95]:hover::-webkit-scrollbar-thumb:hover,.card[auto-scroll][data-v-def66c95]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.card[hover-scroll][data-v-def66c95]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-def66c95]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.card[simply][data-v-def66c95],.card [simply][data-v-def66c95]{background-color:inherit;border:0!important}.card[flex][data-v-def66c95],.card [flex][data-v-def66c95]{display:flex}.card[column][data-v-def66c95],.card [column][data-v-def66c95]{flex-direction:column}.card[row][data-v-def66c95],.card [row][data-v-def66c95]{flex-direction:row}.card[center][data-v-def66c95],.card [center][data-v-def66c95]{justify-content:center}.card[vcenter][data-v-def66c95],.card [vcenter][data-v-def66c95]{align-items:center}.card .card-title[data-v-def66c95]{max-height:40px}.card .card-close[data-v-def66c95]{position:absolute;width:20px;height:20px;right:10px;top:10px;border-radius:10px;z-index:1;--s-transform: 45deg;--s-hover-transform: 35deg;--s-close-width: 11px;--s-close-height: 2px;cursor:pointer;background-color:var(--s-card-close-background-color, transparent);transition:all .3s ease}.card .card-close.hide[data-v-def66c95]{display:none}.card .card-close[data-v-def66c95]:before,.card .card-close[data-v-def66c95]:after{content:"";width:var(--s-close-width, 11px);height:var(--s-close-height, 2px);background-color:var(--s-card-close-color, #555);transform-origin:center;position:inherit;border-radius:10px;top:calc(50% - var(--s-close-height, 2px) / 2);left:calc(50% - var(--s-close-width, 11px) / 2)}.card .card-close[data-v-def66c95]:before{transform:rotate(var(--s-transform, 45deg))}.card .card-close[data-v-def66c95]:after{transform:rotate(calc(0deg - var(--s-transform, 45deg)))}.card .card-close[data-v-def66c95]:hover:before{transform:rotate(var(--s-hover-transform, 45deg))}.card .card-close[data-v-def66c95]:hover:after{transform:rotate(calc(0deg - var(--s-hover-transform, 45deg)))}.card .card-content[data-v-def66c95]{overflow:auto;height:100%}
package/vue2/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("@soei/util");let H=/(\d+|[+\-\*/]|%)/g,C={"+":(e,t)=>e+t,"-":(e,t)=>e-t,"*":(e,t)=>e*t,"/":(e,t)=>e/t,"%":(e,t,i)=>parseFloat(e)/100*i},z=(e,t)=>{let i;if(i=o.runer("match",e,H)){let s=i.length,n,c=0,l,h=[];for(;s--;)c=i.shift(),c in C?(n&&h.push(n),c==="%"&&(h.length=2),l=c):+c&&h.push(+c),h.length==2&&(h.push(t),n=C[l].apply(null,h),h.length=0);+n||(n=+h.pop()),e=n>>0}return e},T=e=>(e+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");function F(e,t,i,s,n,c,l,h){var r=typeof e=="function"?e.options:e;t&&(r.render=t,r.staticRenderFns=i,r._compiled=!0),s&&(r.functional=!0),c&&(r._scopeId="data-v-"+c);var f;if(l?(f=function(u){u=u||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,!u&&typeof __VUE_SSR_CONTEXT__<"u"&&(u=__VUE_SSR_CONTEXT__),n&&n.call(this,u),u&&u._registeredComponents&&u._registeredComponents.add(l)},r._ssrRegister=f):n&&(f=h?function(){n.call(this,(r.functional?this.parent:this).$root.$options.shadowRoot)}:n),f)if(r.functional){r._injectStyles=f;var d=r.render;r.render=function(a,g){return f.call(g),d(a,g)}}else{var p=r.beforeCreate;r.beforeCreate=p?[].concat(p,f):[f]}return{exports:e,options:r}}let R=e=>e==null||e==null,B=(...e)=>{console.info("::::FLYWEIGHT",...e)};const L={name:"Flyweight",props:{flys:{type:Array,default:()=>[]},width:{type:Number,default:0},height:{type:Number,default:100},offset:{type:Array,default:()=>[0,0]},lazy:{type:Number,default:100},view:{type:Object,default:()=>({id:0})},index:{type:Number,default:0},top:{type:Number,default:!1},left:{type:Number,default:!1},auto:{type:[Boolean,String],default:!1},space:{type:Object,default:()=>null},padding:{type:Boolean,default:!1}},computed:{flyweight(){return this.$refs.flyweight||""}},data(){return{flyweights:[],actice:!1,Size:null,column:1,row:1,expand:10,count:0,task:[],realW:0,realH:0}},watch:{flys(e){this.count=e.length,this.rebuild();let t=this.task.shift();t&&this.$nextTick(()=>{this.setview(t)})},view:{handler(e){this.setview(e)},immediate:!0,deep:!0},index(e){this.setindex(e)},top(e){this.flyweight.scrollTop=e},left(e){this.flyweight.scrollLeft=e}},mounted(){this.flyweights=[],this.$set||(this.$set=(e,t,i)=>{e[t]=i}),this.setindex(this.index);try{new ResizeObserver(()=>{this.rebuild(),this.$emit("resize")}).observe(this.flyweight)}catch(e){B(e)}this.scrollx=o.runer("hasAttribute",this.flyweight,"scroll-x"),this.BoxRule="clientHeight=>height,clientWidth=>width",this.direction=this.scrollx?"scrollLeft":"scrollTop"},methods:{exec:T,trigger(e,t){this.lazyrun(()=>{o.isArray(e)||(e=[[e,t]]),o.each(e,(i,s)=>{this.$emit(s[0],R(s[1])?!0:s[1])})})},cheackflys(e){if(!this.flys.length)return e&&this.task.push(e),!0},setview(e){o.runer([this.cheackflys,t=>{t=t||{};let i=t.index||o.each(this.flys,(s,n,c,l)=>{if(n[c]==l)return s},t.picker,t.id);R(i)||this.setindex(i)}],this,e)},setindex(e){o.runer([this.cheackflys,({index:t})=>{this.selectIndex=t,this.$nextTick(()=>{let i=t/this.column>>0,s=this.expand;(this.flyweight[this.direction]/s>>0)+this.row-i-1>0||(this.flyweight[this.direction]=i*s,this.scroll())})}],this,{index:e})},lazyrun(e,t){clearTimeout(this.time),this.time=setTimeout(()=>{o.runer(e)},t||this.lazy)},run(e){let t=[],i=o.runer(this.direction,e.target),s={offset:i,top:i,width:this.realW,height:this.realH,index:i/this.expand>>0};o.merge(s,this.space),e.from||t.push(["onscroll",s]);let n=!1;o.each(this.flyweights,(c,l,h,r,f,d,p,u,a)=>{if(h=c/f>>0,u=h+r*(+(h<d%r)+(d/r>>0)),a=u*f+c%f,a>=this.count){n||(t.push(["onend"]),n=!0);return}l.index=u,l.i=a,l.data=this.flys[a];let g=[u*this.expand+l.x,l.space];p&&g.reverse(),l.top=g[0],l.left=g[1]},null,this.row,this.column,s.index,this.scrollx),this.trigger(t),t=null},scroll(e){this.run(e||{target:this.flyweight,from:"space"})},rebuild(){let e=this.count||this.flys.length,t=this.flyweights;if(!e)return t.length=e;this.count=e;let i=this.scrollx,s=this.flyweight,n=o.picker(s,this.BoxRule);this.$nextTick(()=>{let c=/true/.test(this.auto),[l,h]=this.offset,r=n.width,f=n.height,d=(z(this.width,r)||r)+l,p=z(this.height,f)+h,u=[r/d>>0||1,f/p>>0];i&&u.reverse();let[a,g]=u,m=this.padding,x,v=0,y,b;i?(y=d,d-=l,b=_=>_*(p-h)+(_+1)*h):(c?(d=(r-l*(a+2*m-1))/a,x=!m*l,v=m*l):(x=0,v=(r%d+l*a)/(a+1)>>0,d-=l),b=_=>_*(d+x)+(_+1)*v,y=p),this.row=g+2,this.column=a,this.realH=p-h,this.realW=d,this.expand=y,this.Size=Math.ceil(e/a)*y;let $=Math.min(e,a*this.row),w=$-1,S;for(;$-- >0;)S=w-$,this.$set(t,S,{x:l,y:h,width:d,height:p-h,space:b(S%a),data:{}});t.length=w+1;let k=[];f/y>w/a&&k.push(["onend"]),this.flyweight&&(this.flyweight[this.direction]=0),this.$nextTick(()=>{this.setindex(this.selectIndex||0),this.scroll()}),k.push(["update:space",{row:(w/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(k)})}}};var W=function(){var t=this,i=t._self._c;return i("div",{ref:"flyweight",staticClass:"flyweight",class:{"flyweight-active":t.actice},style:{"--width":t.exec(t.realW),"--height":t.exec(t.realH),"--flyweight-content":t.exec(t.Size)},on:{scroll:t.scroll}},[i("div",{staticClass:"flyweight-all"},t._l(t.flyweights,function(s,n){return i("div",{key:n,style:{top:s.top+"px",left:s.left+"px"}},[t._t("default",null,null,s)],2)}),0),t.flyweights.length?t._t("end"):t._e()],2)},E=[],A=F(L,W,E,!1,null,"15867e3c",null,null);const N=A.exports;const I={name:"Card",props:{offset:{type:[String,Array],default:()=>[0,0,0,0]},background:{type:String,default:""},border:{type:String,default:"1px"},height:{type:String,default:"100%"},width:{type:String,default:"100%"},show:{type:String,default:""},close:{type:Object,default:null},title:{type:String,default:""}},data(){return{closecss:{},style:{},default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){let e={};return this.margin(this.offset),o.each(["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],(t,i)=>{this.css(e,i)}),e}},watch:{close:{handler(e){this.change(e)},deep:!0},offset:{handler(e){this.margin(e)},deep:!0}},methods:{exec:T,isEmpty:o.isEmpty,isSimplyType:o.isSimplyType,tolower(e,t){return t&&(e=e.replace(/[a-z]/g,"")),e.toLowerCase()},css(e,t){let i=this.tolower(t),s=this[i]||this.default[i];!s||this.default[i]==s||(e["--"+this.tolower(t,!0)]=T(s))},change(e){o.isSimplyType(e)||(this.closecss=o.picker(e,"color=>--s-card-close-color,*"))},margin(e){o.merge(this,o.picker(o.isString(e)?e.split(/\s*(?:,|\s+)\s*/):e,"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",!0),!0)}},mounted(){this.change(this.close)}};var M=function(){var t=this,i=t._self._c;return i("div",{staticClass:"card",style:t.style},[t._t("default",function(){return[t._t("title",function(){return[i("div",{staticClass:"card-title"},[t._v(" "+t._s(t.show||t.title)+" "),i("div",{staticClass:"card-close",class:{hide:t.isSimplyType(t.close)?!t.close:!1},style:t.closecss,on:{click:function(s){return t.$emit("close")}}})])]}),t._t("content",function(){return[i("div",{staticClass:"card-content"},[t._t("inner")],2)]})]})],2)},U=[],X=F(I,M,U,!1,null,"1c7635d6",null,null);const O=X.exports,j=[N,O],G={install(e){j.forEach(t=>{e.component("S"+t.name,t),e.component(t.name+"S",t)})}};exports.Card=O;exports.Flyweight=N;exports.default=G;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const r=require("@soei/util");let B=/(\d+|[+\-\*/]|%)/g,z={"+":(t,e)=>t+e,"-":(t,e)=>t-e,"*":(t,e)=>t*e,"/":(t,e)=>t/e,"%":(t,e,s)=>parseFloat(t)/100*s},R=(t,e)=>{let s;if(s=r.runer("match",t,B)){let i=s.length,l,c=0,n,o=[];for(;i--;)c=s.shift(),c in z?(l&&o.push(l),c==="%"&&(o.length=2),n=c):+c&&o.push(+c),o.length==2&&(o.push(e),l=z[n].apply(null,o),o.length=0);+l||(l=+o.pop()),t=l>>0}return t},T=t=>(t+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");function C(t,e,s,i,l,c,n,o){var h=typeof t=="function"?t.options:t;e&&(h.render=e,h.staticRenderFns=s,h._compiled=!0),i&&(h.functional=!0),c&&(h._scopeId="data-v-"+c);var f;if(n?(f=function(u){u=u||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext,!u&&typeof __VUE_SSR_CONTEXT__<"u"&&(u=__VUE_SSR_CONTEXT__),l&&l.call(this,u),u&&u._registeredComponents&&u._registeredComponents.add(n)},h._ssrRegister=f):l&&(f=o?function(){l.call(this,(h.functional?this.parent:this).$root.$options.shadowRoot)}:l),f)if(h.functional){h._injectStyles=f;var d=h.render;h.render=function(a,g){return f.call(g),d(a,g)}}else{var p=h.beforeCreate;h.beforeCreate=p?[].concat(p,f):[f]}return{exports:t,options:h}}let F=t=>t==null||t==null,L=(...t)=>{console.info("::::FLYWEIGHT",...t)};const W={name:"Flyweight",props:{flys:{type:Array,default:()=>[]},width:{type:Number,default:0},height:{type:Number,default:100},offset:{type:Array,default:()=>[0,0]},lazy:{type:Number,default:100},view:{type:Object,default:()=>({id:0})},index:{type:Number,default:0},top:{type:Number,default:!1},left:{type:Number,default:!1},auto:{type:[Boolean,String],default:!1},space:{type:Object,default:()=>null},padding:{type:Boolean,default:!1}},computed:{flyweight(){return this.$refs.flyweight||""}},data(){return{flyweights:[],actice:!1,Size:null,column:1,row:1,expand:10,count:0,task:[],realW:0,realH:0}},watch:{flys(t){this.count=t.length,this.rebuild();let e=this.task.shift();e&&this.$nextTick(()=>{this.setview(e)})},view:{handler(t){this.setview(t)},immediate:!0,deep:!0},index(t){this.setindex(t)},top(t){this.flyweight.scrollTop=t},left(t){this.flyweight.scrollLeft=t}},mounted(){this.flyweights=[],this.$set||(this.$set=(t,e,s)=>{t[e]=s}),this.setindex(this.index);try{new ResizeObserver(()=>{this.rebuild(),this.$emit("resize")}).observe(this.flyweight)}catch(t){L(t)}this.scrollx=r.runer("hasAttribute",this.flyweight,"scroll-x"),this.BoxRule="clientHeight=>height,clientWidth=>width",this.direction=this.scrollx?"scrollLeft":"scrollTop"},methods:{exec:T,trigger(t,e){this.lazyrun(()=>{r.isArray(t)||(t=[[t,e]]),r.each(t,(s,i)=>{this.$emit(i[0],F(i[1])?!0:i[1])})})},cheackflys(t){if(!this.flys.length)return t&&this.task.push(t),!0},setview(t){r.runer([this.cheackflys,e=>{e=e||{};let s=e.index||r.each(this.flys,(i,l,c,n)=>{if(l[c]==n)return i},e.picker,e.id);F(s)||this.setindex(s)}],this,t)},setindex(t){r.runer([this.cheackflys,({index:e})=>{this.selectIndex=e,this.$nextTick(()=>{let s=e/this.column>>0,i=this.expand;(this.flyweight[this.direction]/i>>0)+this.row-s-1>0||(this.flyweight[this.direction]=s*i,this.scroll())})}],this,{index:t})},lazyrun(t,e){clearTimeout(this.time),this.time=setTimeout(()=>{r.runer(t)},e||this.lazy)},run(t){let e=[],s=r.runer(this.direction,t.target),i={offset:s,top:s,width:this.realW,height:this.realH,index:s/this.expand>>0};r.merge(i,this.space),t.from||e.push(["onscroll",i]);let l=!1;r.each(this.flyweights,(c,n,o,h,f,d,p,u,a)=>{if(o=c/f>>0,u=o+h*(+(o<d%h)+(d/h>>0)),a=u*f+c%f,a>=this.count){l||(e.push(["onend"]),l=!0);return}n.index=u,n.i=a,n.data=this.flys[a];let g=[u*this.expand+n.x,n.space];p&&g.reverse(),n.top=g[0],n.left=g[1]},null,this.row,this.column,i.index,this.scrollx),this.trigger(e),e=null},scroll(t){this.run(t||{target:this.flyweight,from:"space"})},rebuild(){let t=this.count||this.flys.length,e=this.flyweights;if(!t)return e.length=t;this.count=t;let s=this.scrollx,i=this.flyweight,l=r.picker(i,this.BoxRule);this.$nextTick(()=>{let c=/true/.test(this.auto),[n,o]=this.offset,h=l.width,f=l.height,d=(R(this.width,h)||h)+n,p=R(this.height,f)+o,u=[h/d>>0||1,f/p>>0||1];s&&u.reverse();let[a,g]=u,w=this.padding,x,v=0,y,$;s?(y=d,d-=n,$=_=>_*(p-o)+(_+1)*o):(c?(d=(h-n*(a+2*w-1))/a,x=!w*n,v=w*n):(x=0,v=(h%d+n*a)/(a+1)>>0,d-=n),$=_=>_*(d+x)+(_+1)*v,y=p),this.row=g+2,this.column=a,this.realH=p-o,this.realW=d,this.expand=y,this.Size=Math.ceil(t/a)*y;let b=Math.min(t,a*this.row),m=b-1,S;for(;b-- >0;)S=m-b,this.$set(e,S,{x:n,y:o,width:d,height:p-o,space:$(S%a),data:{}});e.length=m+1;let k=[];f/y>m/a&&k.push(["onend"]),this.flyweight&&(this.flyweight[this.direction]=0),this.$nextTick(()=>{this.setindex(this.selectIndex||0),this.scroll()}),k.push(["update:space",{row:(m/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(k)})}}};var A=function(){var e=this,s=e._self._c;return s("div",{ref:"flyweight",staticClass:"flyweight",class:{"flyweight-active":e.actice},style:{"--width":e.exec(e.realW),"--height":e.exec(e.realH),"--flyweight-content":e.exec(e.Size)},on:{scroll:e.scroll}},[s("div",{staticClass:"flyweight-all"},e._l(e.flyweights,function(i,l){return s("div",{key:l,style:{top:i.top+"px",left:i.left+"px"}},[e._t("default",null,null,i)],2)}),0),e.flyweights.length?e._t("end"):e._e()],2)},E=[],I=C(W,A,E,!1,null,"05373fe1",null,null);const N=I.exports;const M={name:"Card",props:{offset:{type:[String,Array],default:()=>[0,0,0,0]},background:{type:String,default:""},border:{type:String,default:"1px"},height:{type:String,default:"100%"},width:{type:String,default:"100%"},show:{type:String,default:""},close:{type:Object,default:null},title:{type:String,default:""}},data(){return{closecss:{},style:{},default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){let t={};return this.margin(this.offset),r.each(["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],(e,s)=>{this.css(t,s)}),t}},watch:{close:{handler(t){this.change(t)},deep:!0},offset:{handler(t){this.margin(t)},deep:!0}},methods:{exec:T,isEmpty:r.isEmpty,isSimplyType:r.isSimplyType,tolower(t,e){return e&&(t=t.replace(/[a-z]/g,"")),t.toLowerCase()},css(t,e){let s=this.tolower(e),i=this[s]||this.default[s];!i||this.default[s]==i||(t["--"+this.tolower(e,!0)]=T(i))},change(t){r.isSimplyType(t)||(this.closecss=r.picker(t,"color=>--s-card-close-color,*"))},margin(t){r.merge(this,r.picker(r.isString(t)?t.split(/\s*(?:,|\s+)\s*/):t,"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",!0),!0)}},mounted(){this.change(this.close)}};var U=function(){var e=this,s=e._self._c;return s("div",{staticClass:"card",style:e.style},[e._t("default",function(){return[e._t("title",function(){return[s("div",{staticClass:"card-title"},[e._v(" "+e._s(e.show||e.title)+" "),s("div",{staticClass:"card-close",class:{hide:e.isSimplyType(e.close)?!e.close:!1},style:e.closecss,on:{click:function(i){return e.$emit("close")}}})])]}),e._t("content",function(){return[s("div",{staticClass:"card-content"},[e._t("inner")],2)]})]})],2)},X=[],j=C(M,U,X,!1,null,"b762d0c1",null,null);const O=j.exports,G={name:"Stream",props:{type:{type:String,default:"div"},data:{type:Array,default:()=>({})},T:{type:Array,default:()=>[]}},render(t){return t(this.type||"div",{props:{data:this.data}},this._l(this.T,(e,s)=>{let i=r.picker(e,"slot|name=>name").name,l=r.picker(this,r.format("$scopedSlots.?|$slots.?|$scopedSlots.default=>?",i));return r.merge(e,{index:s}),r.runer(i,l,e)}))}},V=null,q=null;var P=C(G,V,q,!1,null,null,null,null);const H=P.exports,Y=[N,O,H],D={install(t){Y.forEach(e=>{t.component("S"+e.name,e),t.component(e.name+"S",e)})}};exports.Card=O;exports.Flyweight=N;exports.Stream=H;exports.default=D;
package/vue2/index.js CHANGED
@@ -1,53 +1,53 @@
1
- import { runer as g, isArray as L, each as m, merge as O, picker as T, isEmpty as W, isSimplyType as R, isString as A } from "@soei/util";
2
- let E = /(\d+|[+\-\*/]|%)/g, N = {
1
+ import { runer as g, isArray as L, each as x, merge as R, picker as m, isEmpty as W, isSimplyType as N, isString as A, format as E } from "@soei/util";
2
+ let I = /(\d+|[+\-\*/]|%)/g, H = {
3
3
  "+": (t, e) => t + e,
4
4
  "-": (t, e) => t - e,
5
5
  "*": (t, e) => t * e,
6
6
  "/": (t, e) => t / e,
7
- "%": (t, e, i) => parseFloat(t) / 100 * i
8
- }, F = (t, e) => {
9
- let i;
10
- if (i = g("match", t, E)) {
11
- let s = i.length, n, a = 0, l, h = [];
12
- for (; s--; )
13
- a = i.shift(), a in N ? (n && h.push(n), a === "%" && (h.length = 2), l = a) : +a && h.push(+a), h.length == 2 && (h.push(e), n = N[l].apply(null, h), h.length = 0);
14
- +n || (n = +h.pop()), t = n >> 0;
7
+ "%": (t, e, s) => parseFloat(t) / 100 * s
8
+ }, O = (t, e) => {
9
+ let s;
10
+ if (s = g("match", t, I)) {
11
+ let i = s.length, l, a = 0, r, h = [];
12
+ for (; i--; )
13
+ a = s.shift(), a in H ? (l && h.push(l), a === "%" && (h.length = 2), r = a) : +a && h.push(+a), h.length == 2 && (h.push(e), l = H[r].apply(null, h), h.length = 0);
14
+ +l || (l = +h.pop()), t = l >> 0;
15
15
  }
16
16
  return t;
17
17
  }, z = (t) => (t + "").replace(/\w+\((.*)\)/g, "$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g, "$1px");
18
- function B(t, e, i, s, n, a, l, h) {
19
- var r = typeof t == "function" ? t.options : t;
20
- e && (r.render = e, r.staticRenderFns = i, r._compiled = !0), s && (r.functional = !0), a && (r._scopeId = "data-v-" + a);
18
+ function F(t, e, s, i, l, a, r, h) {
19
+ var n = typeof t == "function" ? t.options : t;
20
+ e && (n.render = e, n.staticRenderFns = s, n._compiled = !0), i && (n.functional = !0), a && (n._scopeId = "data-v-" + a);
21
21
  var f;
22
- if (l ? (f = function(c) {
22
+ if (r ? (f = function(c) {
23
23
  c = c || // cached call
24
24
  this.$vnode && this.$vnode.ssrContext || // stateful
25
- this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext, !c && typeof __VUE_SSR_CONTEXT__ < "u" && (c = __VUE_SSR_CONTEXT__), n && n.call(this, c), c && c._registeredComponents && c._registeredComponents.add(l);
26
- }, r._ssrRegister = f) : n && (f = h ? function() {
27
- n.call(
25
+ this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext, !c && typeof __VUE_SSR_CONTEXT__ < "u" && (c = __VUE_SSR_CONTEXT__), l && l.call(this, c), c && c._registeredComponents && c._registeredComponents.add(r);
26
+ }, n._ssrRegister = f) : l && (f = h ? function() {
27
+ l.call(
28
28
  this,
29
- (r.functional ? this.parent : this).$root.$options.shadowRoot
29
+ (n.functional ? this.parent : this).$root.$options.shadowRoot
30
30
  );
31
- } : n), f)
32
- if (r.functional) {
33
- r._injectStyles = f;
34
- var u = r.render;
35
- r.render = function(o, p) {
31
+ } : l), f)
32
+ if (n.functional) {
33
+ n._injectStyles = f;
34
+ var u = n.render;
35
+ n.render = function(o, p) {
36
36
  return f.call(p), u(o, p);
37
37
  };
38
38
  } else {
39
- var d = r.beforeCreate;
40
- r.beforeCreate = d ? [].concat(d, f) : [f];
39
+ var d = n.beforeCreate;
40
+ n.beforeCreate = d ? [].concat(d, f) : [f];
41
41
  }
42
42
  return {
43
43
  exports: t,
44
- options: r
44
+ options: n
45
45
  };
46
46
  }
47
- let H = (t) => t == null || t == null, I = (...t) => {
47
+ let B = (t) => t == null || t == null, U = (...t) => {
48
48
  console.info("::::FLYWEIGHT", ...t);
49
49
  };
50
- const U = {
50
+ const X = {
51
51
  name: "Flyweight",
52
52
  props: {
53
53
  flys: {
@@ -144,15 +144,15 @@ const U = {
144
144
  }
145
145
  },
146
146
  mounted() {
147
- this.flyweights = [], this.$set || (this.$set = (t, e, i) => {
148
- t[e] = i;
147
+ this.flyweights = [], this.$set || (this.$set = (t, e, s) => {
148
+ t[e] = s;
149
149
  }), this.setindex(this.index);
150
150
  try {
151
151
  new ResizeObserver(() => {
152
152
  this.rebuild(), this.$emit("resize");
153
153
  }).observe(this.flyweight);
154
154
  } catch (t) {
155
- I(t);
155
+ U(t);
156
156
  }
157
157
  this.scrollx = g("hasAttribute", this.flyweight, "scroll-x"), this.BoxRule = /* this.scrollx ? 'clientHeight=>width,clientWidth=>height' : */
158
158
  "clientHeight=>height,clientWidth=>width", this.direction = this.scrollx ? "scrollLeft" : "scrollTop";
@@ -161,8 +161,8 @@ const U = {
161
161
  exec: z,
162
162
  trigger(t, e) {
163
163
  this.lazyrun(() => {
164
- L(t) || (t = [[t, e]]), m(t, (i, s) => {
165
- this.$emit(s[0], H(s[1]) ? !0 : s[1]);
164
+ L(t) || (t = [[t, e]]), x(t, (s, i) => {
165
+ this.$emit(i[0], B(i[1]) ? !0 : i[1]);
166
166
  });
167
167
  });
168
168
  },
@@ -173,18 +173,18 @@ const U = {
173
173
  setview(t) {
174
174
  g([this.cheackflys, (e) => {
175
175
  e = e || {};
176
- let i = e.index || m(this.flys, (s, n, a, l) => {
177
- if (n[a] == l)
178
- return s;
176
+ let s = e.index || x(this.flys, (i, l, a, r) => {
177
+ if (l[a] == r)
178
+ return i;
179
179
  }, e.picker, e.id);
180
- H(i) || this.setindex(i);
180
+ B(s) || this.setindex(s);
181
181
  }], this, t);
182
182
  },
183
183
  setindex(t) {
184
184
  g([this.cheackflys, ({ index: e }) => {
185
185
  this.selectIndex = e, this.$nextTick(() => {
186
- let i = e / this.column >> 0, s = this.expand;
187
- (this.flyweight[this.direction] / s >> 0) + this.row - i - 1 > 0 || (this.flyweight[this.direction] = i * s, this.scroll());
186
+ let s = e / this.column >> 0, i = this.expand;
187
+ (this.flyweight[this.direction] / i >> 0) + this.row - s - 1 > 0 || (this.flyweight[this.direction] = s * i, this.scroll());
188
188
  });
189
189
  }], this, { index: t });
190
190
  },
@@ -194,39 +194,39 @@ const U = {
194
194
  }, e || this.lazy);
195
195
  },
196
196
  run(t) {
197
- let e = [], i = g(this.direction, t.target), s = {
197
+ let e = [], s = g(this.direction, t.target), i = {
198
198
  // ...this
199
- offset: i,
200
- top: i,
199
+ offset: s,
200
+ top: s,
201
201
  width: this.realW,
202
202
  height: this.realH,
203
203
  /* 显示区域第一行的索引 */
204
- index: i / this.expand >> 0
204
+ index: s / this.expand >> 0
205
205
  };
206
- O(s, this.space), t.from || e.push(["onscroll", s]);
207
- let n = !1;
208
- m(
206
+ R(i, this.space), t.from || e.push(["onscroll", i]);
207
+ let l = !1;
208
+ x(
209
209
  this.flyweights,
210
- (a, l, h, r, f, u, d, c, o) => {
211
- if (h = a / f >> 0, c = h + r * /* 偏移量, 如果超出顶部 + 1轮,排列到列队后, 否则保持在当前*/
212
- (+(h < u % r) + (u / r >> 0)), o = c * f + a % f, o >= this.count) {
213
- n || (e.push(["onend"]), n = !0);
210
+ (a, r, h, n, f, u, d, c, o) => {
211
+ if (h = a / f >> 0, c = h + n * /* 偏移量, 如果超出顶部 + 1轮,排列到列队后, 否则保持在当前*/
212
+ (+(h < u % n) + (u / n >> 0)), o = c * f + a % f, o >= this.count) {
213
+ l || (e.push(["onend"]), l = !0);
214
214
  return;
215
215
  }
216
- l.index = c, l.i = o, l.data = this.flys[o];
216
+ r.index = c, r.i = o, r.data = this.flys[o];
217
217
  let p = [
218
218
  /* top */
219
- c * this.expand + l.x,
219
+ c * this.expand + r.x,
220
220
  /* left */
221
- l.space
221
+ r.space
222
222
  ];
223
- d && p.reverse(), l.top = p[0], l.left = p[1];
223
+ d && p.reverse(), r.top = p[0], r.left = p[1];
224
224
  },
225
225
  null,
226
226
  this.row,
227
227
  this.column,
228
228
  /* 显示区域第一行的索引 */
229
- s.index,
229
+ i.index,
230
230
  this.scrollx
231
231
  ), this.trigger(e), e = null;
232
232
  },
@@ -238,65 +238,65 @@ const U = {
238
238
  if (!t)
239
239
  return e.length = t;
240
240
  this.count = t;
241
- let i = this.scrollx, s = this.flyweight, n = T(s, this.BoxRule);
241
+ let s = this.scrollx, i = this.flyweight, l = m(i, this.BoxRule);
242
242
  this.$nextTick(() => {
243
- let a = /true/.test(this.auto), [l, h] = this.offset, r = n.width, f = n.height, u = (F(this.width, r) || r) + l, d = F(this.height, f) + h, c = [r / u >> 0 || 1, f / d >> 0];
244
- i && c.reverse();
245
- let [o, p] = c, x = this.padding, v, b = 0, y, $;
246
- i ? (y = u, u -= l, $ = (_) => (
243
+ let a = /true/.test(this.auto), [r, h] = this.offset, n = l.width, f = l.height, u = (O(this.width, n) || n) + r, d = O(this.height, f) + h, c = [n / u >> 0 || 1, f / d >> 0 || 1];
244
+ s && c.reverse();
245
+ let [o, p] = c, v = this.padding, $, b = 0, y, S;
246
+ s ? (y = u, u -= r, S = (_) => (
247
247
  /* 计算top偏移量 */
248
248
  _ * (d - h) + (_ + 1) * h
249
- )) : (a ? (u = (r - l * (o + 2 * x - 1)) / o, v = !x * l, b = x * l) : (v = 0, b = (r % u + l * o) / (o + 1) >> 0, u -= l), $ = (_) => _ * (u + v) + (_ + 1) * b, y = d), this.row = p + 2, this.column = o, this.realH = d - h, this.realW = u, this.expand = y, this.Size = Math.ceil(t / o) * y;
250
- let k = Math.min(t, o * this.row), w = k - 1, C;
251
- for (; k-- > 0; )
252
- C = w - k, this.$set(e, C, {
253
- x: l,
249
+ )) : (a ? (u = (n - r * (o + 2 * v - 1)) / o, $ = !v * r, b = v * r) : ($ = 0, b = (n % u + r * o) / (o + 1) >> 0, u -= r), S = (_) => _ * (u + $) + (_ + 1) * b, y = d), this.row = p + 2, this.column = o, this.realH = d - h, this.realW = u, this.expand = y, this.Size = Math.ceil(t / o) * y;
250
+ let T = Math.min(t, o * this.row), w = T - 1, k;
251
+ for (; T-- > 0; )
252
+ k = w - T, this.$set(e, k, {
253
+ x: r,
254
254
  y: h,
255
255
  width: u,
256
256
  height: d - h,
257
- space: $(C % o),
257
+ space: S(k % o),
258
258
  data: {}
259
259
  });
260
260
  e.length = w + 1;
261
- let S = [];
262
- f / y > w / o && S.push(["onend"]), this.flyweight && (this.flyweight[this.direction] = 0), this.$nextTick(() => {
261
+ let C = [];
262
+ f / y > w / o && C.push(["onend"]), this.flyweight && (this.flyweight[this.direction] = 0), this.$nextTick(() => {
263
263
  this.setindex(this.selectIndex || 0), this.scroll();
264
- }), S.push(["update:space", {
264
+ }), C.push(["update:space", {
265
265
  row: (w / o >> 0) + 1,
266
266
  column: o,
267
267
  showrow: this.row,
268
268
  showcolumn: this.column
269
- }]), this.trigger(S);
269
+ }]), this.trigger(C);
270
270
  });
271
271
  }
272
272
  }
273
273
  };
274
- var X = function() {
275
- var e = this, i = e._self._c;
276
- return i("div", { ref: "flyweight", staticClass: "flyweight", class: {
274
+ var G = function() {
275
+ var e = this, s = e._self._c;
276
+ return s("div", { ref: "flyweight", staticClass: "flyweight", class: {
277
277
  "flyweight-active": e.actice
278
278
  }, style: {
279
279
  "--width": e.exec(e.realW),
280
280
  "--height": e.exec(e.realH),
281
281
  "--flyweight-content": e.exec(e.Size)
282
- }, on: { scroll: e.scroll } }, [i("div", { staticClass: "flyweight-all" }, e._l(e.flyweights, function(s, n) {
283
- return i("div", { key: n, style: {
284
- top: s.top + "px",
285
- left: s.left + "px"
286
- } }, [e._t("default", null, null, s)], 2);
282
+ }, on: { scroll: e.scroll } }, [s("div", { staticClass: "flyweight-all" }, e._l(e.flyweights, function(i, l) {
283
+ return s("div", { key: l, style: {
284
+ top: i.top + "px",
285
+ left: i.left + "px"
286
+ } }, [e._t("default", null, null, i)], 2);
287
287
  }), 0), e.flyweights.length ? e._t("end") : e._e()], 2);
288
- }, G = [], M = /* @__PURE__ */ B(
289
- U,
288
+ }, M = [], V = /* @__PURE__ */ F(
290
289
  X,
291
290
  G,
291
+ M,
292
292
  !1,
293
293
  null,
294
- "15867e3c",
294
+ "05373fe1",
295
295
  null,
296
296
  null
297
297
  );
298
- const V = M.exports;
299
- const j = {
298
+ const j = V.exports;
299
+ const Y = {
300
300
  name: "Card",
301
301
  // inheritAttrs: false,
302
302
  props: {
@@ -352,8 +352,8 @@ const j = {
352
352
  computed: {
353
353
  style() {
354
354
  let t = {};
355
- return this.margin(this.offset), m(["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], (e, i) => {
356
- this.css(t, i);
355
+ return this.margin(this.offset), x(["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], (e, s) => {
356
+ this.css(t, s);
357
357
  }), t;
358
358
  }
359
359
  },
@@ -374,19 +374,19 @@ const j = {
374
374
  methods: {
375
375
  exec: z,
376
376
  isEmpty: W,
377
- isSimplyType: R,
377
+ isSimplyType: N,
378
378
  tolower(t, e) {
379
379
  return e && (t = t.replace(/[a-z]/g, "")), t.toLowerCase();
380
380
  },
381
381
  css(t, e) {
382
- let i = this.tolower(e), s = this[i] || this.default[i];
383
- !s || this.default[i] == s || (t["--" + this.tolower(e, !0)] = z(s));
382
+ let s = this.tolower(e), i = this[s] || this.default[s];
383
+ !i || this.default[s] == i || (t["--" + this.tolower(e, !0)] = z(i));
384
384
  },
385
385
  change(t) {
386
- R(t) || (this.closecss = T(t, "color=>--s-card-close-color,*"));
386
+ N(t) || (this.closecss = m(t, "color=>--s-card-close-color,*"));
387
387
  },
388
388
  margin(t) {
389
- O(this, T(
389
+ R(this, m(
390
390
  A(t) ? t.split(/\s*(?:,|\s+)\s*/) : t,
391
391
  "0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",
392
392
  !0
@@ -397,36 +397,79 @@ const j = {
397
397
  this.change(this.close);
398
398
  }
399
399
  };
400
- var Y = function() {
401
- var e = this, i = e._self._c;
402
- return i("div", { staticClass: "card", style: e.style }, [e._t("default", function() {
400
+ var q = function() {
401
+ var e = this, s = e._self._c;
402
+ return s("div", { staticClass: "card", style: e.style }, [e._t("default", function() {
403
403
  return [e._t("title", function() {
404
- return [i("div", { staticClass: "card-title" }, [e._v(" " + e._s(e.show || e.title) + " "), i("div", { staticClass: "card-close", class: { hide: e.isSimplyType(e.close) ? !e.close : !1 }, style: e.closecss, on: { click: function(s) {
404
+ return [s("div", { staticClass: "card-title" }, [e._v(" " + e._s(e.show || e.title) + " "), s("div", { staticClass: "card-close", class: { hide: e.isSimplyType(e.close) ? !e.close : !1 }, style: e.closecss, on: { click: function(i) {
405
405
  return e.$emit("close");
406
406
  } } })])];
407
407
  }), e._t("content", function() {
408
- return [i("div", { staticClass: "card-content" }, [e._t("inner")], 2)];
408
+ return [s("div", { staticClass: "card-content" }, [e._t("inner")], 2)];
409
409
  })];
410
410
  })], 2);
411
- }, q = [], D = /* @__PURE__ */ B(
412
- j,
411
+ }, D = [], J = /* @__PURE__ */ F(
413
412
  Y,
414
413
  q,
414
+ D,
415
415
  !1,
416
416
  null,
417
- "1c7635d6",
417
+ "b762d0c1",
418
418
  null,
419
419
  null
420
420
  );
421
- const J = D.exports, K = [V, J], Q = {
421
+ const K = J.exports, P = {
422
+ name: "Stream",
423
+ props: {
424
+ type: {
425
+ type: String,
426
+ default: "div"
427
+ },
428
+ data: {
429
+ type: Array,
430
+ default: () => ({})
431
+ },
432
+ T: {
433
+ type: Array,
434
+ default: () => []
435
+ }
436
+ },
437
+ render(t) {
438
+ return t(
439
+ this.type || "div",
440
+ {
441
+ // ...item,
442
+ props: {
443
+ data: this.data
444
+ }
445
+ },
446
+ this._l(this.T, (e, s) => {
447
+ let i = m(e, "slot|name=>name").name, l = m(this, E("$scopedSlots.?|$slots.?|$scopedSlots.default=>?", i));
448
+ return R(e, { index: s }), g(i, l, e);
449
+ })
450
+ );
451
+ }
452
+ }, Q = null, Z = null;
453
+ var tt = /* @__PURE__ */ F(
454
+ P,
455
+ Q,
456
+ Z,
457
+ !1,
458
+ null,
459
+ null,
460
+ null,
461
+ null
462
+ );
463
+ const et = tt.exports, st = [j, K, et], lt = {
422
464
  install(t) {
423
- K.forEach((e) => {
465
+ st.forEach((e) => {
424
466
  t.component("S" + e.name, e), t.component(e.name + "S", e);
425
467
  });
426
468
  }
427
469
  };
428
470
  export {
429
- J as Card,
430
- V as Flyweight,
431
- Q as default
471
+ K as Card,
472
+ j as Flyweight,
473
+ et as Stream,
474
+ lt as default
432
475
  };
package/vue2/style.css ADDED
@@ -0,0 +1 @@
1
+ @charset "UTF-8";.flyweight[data-v-05373fe1]{height:100%;width:100%;overflow:auto;position:relative}.flyweight[hover-scroll][data-v-05373fe1]::-webkit-scrollbar-track,.flyweight[auto-scroll][data-v-05373fe1]::-webkit-scrollbar-track{border-radius:10px}.flyweight[hover-scroll][data-v-05373fe1]::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-05373fe1]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.flyweight[hover-scroll][data-v-05373fe1]::-webkit-scrollbar,.flyweight[auto-scroll][data-v-05373fe1]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.flyweight[hover-scroll][data-v-05373fe1]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-05373fe1]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.flyweight[hover-scroll][data-v-05373fe1]:hover::-webkit-scrollbar-thumb:hover,.flyweight[auto-scroll][data-v-05373fe1]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.flyweight[hover-scroll][data-v-05373fe1]:hover::-webkit-scrollbar-thumb,.flyweight[auto-scroll][data-v-05373fe1]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.flyweight[scroll-x] .flyweight-all[data-v-05373fe1]{width:var(--flyweight-content);height:auto;min-height:100%}.flyweight[scroll-x] .flyweight-all+*[data-v-05373fe1]{left:var(--flyweight-content);position:absolute;top:0;height:100%}.flyweight .flyweight-all[data-v-05373fe1]{height:var(--flyweight-content)}.flyweight .flyweight-all>*[data-v-05373fe1]{width:calc(var(--width));height:var(--height);position:absolute}@media screen and (-apple-system: Macintosh){.flyweight .flyweight-all[data-v-05373fe1]{background-color:red!important}}.card[data-v-b762d0c1]{--t: 0px;--r: 0px;--b: 0px;--l: 0px;--h: 100%;--w: 100%;--br: 1px;position:relative;background-color:var(--bg, var(--card-background-color, #fff));padding:10px;border-radius:10px;box-sizing:border-box;border-style:solid;border-color:var(--card-border-color, #555);border-width:var(--br);justify-content:flex-start;margin:var(--t) var(--r) var(--b) var(--l);height:calc(var(--h) - var(--t) - var(--b));width:calc(var(--w) - var(--l) - var(--r));overflow:auto}.card[hover-scroll][data-v-b762d0c1]::-webkit-scrollbar-track,.card[auto-scroll][data-v-b762d0c1]::-webkit-scrollbar-track{border-radius:10px}.card[hover-scroll][data-v-b762d0c1]::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-b762d0c1]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.card[hover-scroll][data-v-b762d0c1]::-webkit-scrollbar,.card[auto-scroll][data-v-b762d0c1]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.card[hover-scroll][data-v-b762d0c1]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-b762d0c1]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.card[hover-scroll][data-v-b762d0c1]:hover::-webkit-scrollbar-thumb:hover,.card[auto-scroll][data-v-b762d0c1]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.card[hover-scroll][data-v-b762d0c1]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-b762d0c1]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.card[simply][data-v-b762d0c1],.card [simply][data-v-b762d0c1]{background-color:inherit;border:0!important}.card[flex][data-v-b762d0c1],.card [flex][data-v-b762d0c1]{display:flex}.card[column][data-v-b762d0c1],.card [column][data-v-b762d0c1]{flex-direction:column}.card[row][data-v-b762d0c1],.card [row][data-v-b762d0c1]{flex-direction:row}.card[center][data-v-b762d0c1],.card [center][data-v-b762d0c1]{justify-content:center}.card[vcenter][data-v-b762d0c1],.card [vcenter][data-v-b762d0c1]{align-items:center}.card .card-title[data-v-b762d0c1]{max-height:40px}.card .card-close[data-v-b762d0c1]{position:absolute;width:20px;height:20px;right:10px;top:10px;border-radius:10px;z-index:1;--s-transform: 45deg;--s-hover-transform: 35deg;--s-close-width: 11px;--s-close-height: 2px;cursor:pointer;background-color:var(--s-card-close-background-color, transparent);transition:all .3s ease}.card .card-close.hide[data-v-b762d0c1]{display:none}.card .card-close[data-v-b762d0c1]:before,.card .card-close[data-v-b762d0c1]:after{content:"";width:var(--s-close-width, 11px);height:var(--s-close-height, 2px);background-color:var(--s-card-close-color, #555);transform-origin:center;position:inherit;border-radius:10px;top:calc(50% - var(--s-close-height, 2px) / 2);left:calc(50% - var(--s-close-width, 11px) / 2)}.card .card-close[data-v-b762d0c1]:before{transform:rotate(var(--s-transform, 45deg))}.card .card-close[data-v-b762d0c1]:after{transform:rotate(calc(0deg - var(--s-transform, 45deg)))}.card .card-close[data-v-b762d0c1]:hover:before{transform:rotate(var(--s-hover-transform, 45deg))}.card .card-close[data-v-b762d0c1]:hover:after{transform:rotate(calc(0deg - var(--s-hover-transform, 45deg)))}.card .card-content[data-v-b762d0c1]{overflow:auto;height:100%}