@soei/flyweight 0.2.11 → 0.2.13
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 +1 -1
- package/Flyweight.js +111 -99
- package/README.md +1 -1
- package/package.json +1 -1
- package/style.css +1 -1
- package/vue2/index.cjs +1 -1
- package/vue2/index.js +93 -82
- package/vue2/style.css +1 -1
package/Flyweight.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("@soei/util"),i=require("vue");let I=/(\d+|[+\-\*/]|%)/g,E={"+":(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=o.runer("match",e,I)){let n=s.length,l,h=0,r,c=[];for(;n--;)h=s.shift(),h in E?(l&&c.push(l),h==="%"&&(c.length=2),r=h):+h&&c.push(+h),c.length==2&&(c.push(t),l=E[r].apply(null,c),c.length=0);+l||(l=+c.pop()),e=l>>0}return e},B=e=>(e+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");const L=(e,t)=>{const s=e.__vccOpts||e;for(const[n,l]of t)s[n]=l;return s};let C=e=>e==null||e==null,V=(...e)=>{console.info("::::FLYWEIGHT",...e)};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(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){V(e)}this.scrollx=o.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(()=>{o.isArray(e)||(e=[[e,t]]),o.each(e,(s,n)=>{this.$emit(n[0],C(n[1])?!0:n[1])})})},cheackflys(e){if(!this.flys.length)return e&&this.task.push(e),!0},setview(e){o.runer([this.cheackflys,t=>{t=t||{};let s=t.index||o.each(this.flys,(n,l,h,r)=>{if(l[h]==r)return n},t.picker,t.id);C(s)||this.setindex(s)}],this,e)},setindex(e){o.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(()=>{o.runer(e)},t||this.lazy)},run(e){let t=[],s=o.runer(this.direction,e.target),n={offset:s,top:s,width:this.realW,height:this.realH,index:s/this.expand>>0};o.merge(n,this.space),e.from||t.push(["onscroll",n]);let l=!1;o.each(this.flyweights,(h,r,c,d,f,u,p,g,a)=>{if(c=h/f>>0,g=c+d*(+(c<u%d)+(u/d>>0)),a=g*f+h%f,a>=this.count){l||(t.push(["onend"]),l=!0);return}r.index=g,r.i=a,r.data=this.flys[a];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=o.picker(n,this.BoxRule);this.$nextTick(()=>{let h=/true/.test(this.auto),[r,c]=this.offset,d=l.width,f=l.height,u=(N(this.width,d)||d)+r,p=N(this.height,f)+c,g=[d/u>>0||1,f/p>>0||1];s&&g.reverse();let[a,y]=g,_=this.padding,S,k=0,m,b;s?(m=u,u-=r,b=w=>w*(p-c)+(w+1)*c):(h?(u=(d-r*(a+2*_-1))/a,S=!_*r,k=_*r):(S=0,k=(d%u+r*a)/(a+1)>>0,u-=r),b=w=>w*(u+S)+(w+1)*k,m=p),this.row=y+2,this.column=a,this.realH=p-c,this.realW=u,this.expand=m,this.Size=Math.ceil(e/a)*m;let T=Math.min(e,a*this.row),x=T-1,z;for(;T-- >0;)z=x-T,this.$set(t,z,{x:r,y:c,width:u,height:p-c,space:b(z%a),data:{}});t.length=x+1;let v=[];f/m>x/a&&v.push(["onend"]),this.flyweight&&(this.flyweight[this.direction]=0),this.$nextTick(()=>{this.setindex(this.selectIndex||0),this.scroll()}),v.push(["update:space",{row:(x/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(v)})}}},j={class:"flyweight-all"};function M(e,t,s,n,l,h){return i.openBlock(),i.createElementBlock("div",{ref:"flyweight",class:i.normalizeClass(["flyweight",{"flyweight-active":l.actice}]),style:i.normalizeStyle({"--width":h.exec(l.realW),"--height":h.exec(l.realH),"--flyweight-content":h.exec(l.Size)}),onScroll:t[0]||(t[0]=(...r)=>h.scroll&&h.scroll(...r))},[i.createElementVNode("div",j,[(i.openBlock(!0),i.createElementBlock(i.Fragment,null,i.renderList(l.flyweights,(r,c)=>(i.openBlock(),i.createElementBlock("div",{key:c,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=L(W,[["render",M],["__scopeId","data-v-8f29f044"]]);function $(e,t){return t&&(e=e.replace(/[a-z]/g,"")),e.toLowerCase()}let O={close:{handler(e){this.change(e)},deep:!0},offset:{handler(e){this.margin(e)},deep:!0}},q=["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],A={};o.each(q,(e,t,s)=>{e=$(t),A["--"+$(t,!0)]=e,s[e]=function(){this.trigger++}},O);const G={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:{},trigger:0,default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){return this.tr()}},watch:O,methods:{exec:B,isEmpty:o.isEmpty,isSimplyType:o.isSimplyType,tr(){let e={};return this.margin(this.offset),o.each(A,(t,s)=>{this.css(e,t,s)}),e},tolower:$,css(e,t,s){let n=this[s]||this.default[s];!n||this.default[s]==n||(e[t]=B(n))},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)}},P={class:"card-title"},D={class:"card-content"};function U(e,t,s,n,l,h){return i.openBlock(),i.createElementBlock("div",{class:"card",key:l.trigger,style:i.normalizeStyle(h.isEmpty(h.style)?h.tr():h.style)},[i.renderSlot(e.$slots,"default",{},()=>[i.renderSlot(e.$slots,"title",{},()=>[i.createElementVNode("div",P,[i.createTextVNode(i.toDisplayString(s.show||s.title)+" ",1),i.createElementVNode("div",{class:i.normalizeClass(["card-close",{hide:h.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",D,[i.renderSlot(e.$slots,"inner",{},void 0,!0)])],!0)],!0)],4)}const F=L(G,[["render",U],["__scopeId","data-v-23ece4cb"]]),R={name:"Stream",props:{type:{type:String,default:"div"},data:{type:Array,default:()=>[]},T:{type:Array,default:()=>[]}},render(e){return e(this.type,{props:{data:this.data}},this._l(this.T,(t,s)=>{let n=o.picker(t,"slot|name|type=>name").name,l=o.picker(this,o.format("$scopedSlots.?|$slots.?|$scopedSlots.default=>?",n));return o.merge(t,{index:s}),o.runer(n,l,t)}))}},X=[H,F,R],Y={install(e){X.forEach(t=>{e.component("S"+t.name,t),e.component(t.name+"S",t)})}};exports.Card=F;exports.Flyweight=H;exports.Stream=R;exports.default=Y;
|
package/Flyweight.js
CHANGED
|
@@ -1,31 +1,31 @@
|
|
|
1
|
-
import { runer as p, isArray as
|
|
2
|
-
import { openBlock as
|
|
3
|
-
let
|
|
1
|
+
import { runer as p, isArray as D, each as x, merge as R, picker as _, isEmpty as P, isSimplyType as E, isString as U, format as X } from "@soei/util";
|
|
2
|
+
import { openBlock as S, createElementBlock as T, normalizeClass as j, normalizeStyle as z, createElementVNode as k, Fragment as Y, renderList as q, renderSlot as g, mergeProps as J, createCommentVNode as K, createTextVNode as Q, toDisplayString as Z } from "vue";
|
|
3
|
+
let ee = /(\d+|[+\-\*/]|%)/g, F = {
|
|
4
4
|
"+": (e, t) => e + t,
|
|
5
5
|
"-": (e, t) => e - t,
|
|
6
6
|
"*": (e, t) => e * t,
|
|
7
7
|
"/": (e, t) => e / t,
|
|
8
8
|
"%": (e, t, s) => parseFloat(e) / 100 * s
|
|
9
|
-
},
|
|
9
|
+
}, I = (e, t) => {
|
|
10
10
|
let s;
|
|
11
|
-
if (s = p("match", e,
|
|
11
|
+
if (s = p("match", e, ee)) {
|
|
12
12
|
let r = s.length, i, h = 0, l, n = [];
|
|
13
13
|
for (; r--; )
|
|
14
|
-
h = s.shift(), h in
|
|
14
|
+
h = s.shift(), h in F ? (i && n.push(i), h === "%" && (n.length = 2), l = h) : +h && n.push(+h), n.length == 2 && (n.push(t), i = F[l].apply(null, n), n.length = 0);
|
|
15
15
|
+i || (i = +n.pop()), e = i >> 0;
|
|
16
16
|
}
|
|
17
17
|
return e;
|
|
18
|
-
},
|
|
19
|
-
const
|
|
18
|
+
}, C = (e) => (e + "").replace(/\w+\((.*)\)/g, "$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g, "$1px");
|
|
19
|
+
const V = (e, t) => {
|
|
20
20
|
const s = e.__vccOpts || e;
|
|
21
21
|
for (const [r, i] of t)
|
|
22
22
|
s[r] = i;
|
|
23
23
|
return s;
|
|
24
24
|
};
|
|
25
|
-
let W = (e) => e == null || e == null,
|
|
25
|
+
let W = (e) => e == null || e == null, te = (...e) => {
|
|
26
26
|
console.info("::::FLYWEIGHT", ...e);
|
|
27
27
|
};
|
|
28
|
-
const
|
|
28
|
+
const se = {
|
|
29
29
|
name: "Flyweight",
|
|
30
30
|
props: {
|
|
31
31
|
flys: {
|
|
@@ -130,16 +130,16 @@ const Z = {
|
|
|
130
130
|
this.rebuild(), this.$emit("resize");
|
|
131
131
|
}).observe(this.flyweight);
|
|
132
132
|
} catch (e) {
|
|
133
|
-
|
|
133
|
+
te(e);
|
|
134
134
|
}
|
|
135
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
|
-
exec:
|
|
139
|
+
exec: C,
|
|
140
140
|
trigger(e, t) {
|
|
141
141
|
this.lazyrun(() => {
|
|
142
|
-
|
|
142
|
+
D(e) || (e = [[e, t]]), x(e, (s, r) => {
|
|
143
143
|
this.$emit(r[0], W(r[1]) ? !0 : r[1]);
|
|
144
144
|
});
|
|
145
145
|
});
|
|
@@ -151,7 +151,7 @@ const Z = {
|
|
|
151
151
|
setview(e) {
|
|
152
152
|
p([this.cheackflys, (t) => {
|
|
153
153
|
t = t || {};
|
|
154
|
-
let s = t.index ||
|
|
154
|
+
let s = t.index || x(this.flys, (r, i, h, l) => {
|
|
155
155
|
if (i[h] == l)
|
|
156
156
|
return r;
|
|
157
157
|
}, t.picker, t.id);
|
|
@@ -181,24 +181,24 @@ const Z = {
|
|
|
181
181
|
/* 显示区域第一行的索引 */
|
|
182
182
|
index: s / this.expand >> 0
|
|
183
183
|
};
|
|
184
|
-
|
|
184
|
+
R(r, this.space), e.from || t.push(["onscroll", r]);
|
|
185
185
|
let i = !1;
|
|
186
|
-
|
|
186
|
+
x(
|
|
187
187
|
this.flyweights,
|
|
188
|
-
(h, l, n, c,
|
|
189
|
-
if (n = h /
|
|
190
|
-
(+(n < a % c) + (a / c >> 0)), o =
|
|
188
|
+
(h, l, n, c, u, a, d, f, o) => {
|
|
189
|
+
if (n = h / u >> 0, f = n + c * /* 偏移量, 如果超出顶部 + 1轮,排列到列队后, 否则保持在当前*/
|
|
190
|
+
(+(n < a % c) + (a / c >> 0)), o = f * u + h % u, o >= this.count) {
|
|
191
191
|
i || (t.push(["onend"]), i = !0);
|
|
192
192
|
return;
|
|
193
193
|
}
|
|
194
|
-
l.index =
|
|
194
|
+
l.index = f, l.i = o, l.data = this.flys[o];
|
|
195
195
|
let y = [
|
|
196
196
|
/* top */
|
|
197
|
-
|
|
197
|
+
f * this.expand + l.x,
|
|
198
198
|
/* left */
|
|
199
199
|
l.space
|
|
200
200
|
];
|
|
201
|
-
|
|
201
|
+
d && y.reverse(), l.top = y[0], l.left = y[1];
|
|
202
202
|
},
|
|
203
203
|
null,
|
|
204
204
|
this.row,
|
|
@@ -216,68 +216,90 @@ const Z = {
|
|
|
216
216
|
if (!e)
|
|
217
217
|
return t.length = e;
|
|
218
218
|
this.count = e;
|
|
219
|
-
let s = this.scrollx, r = this.flyweight, i =
|
|
219
|
+
let s = this.scrollx, r = this.flyweight, i = _(r, this.BoxRule);
|
|
220
220
|
this.$nextTick(() => {
|
|
221
|
-
let h = /true/.test(this.auto), [l, n] = this.offset, c = i.width,
|
|
222
|
-
s &&
|
|
223
|
-
let [o, y] =
|
|
221
|
+
let h = /true/.test(this.auto), [l, n] = this.offset, c = i.width, u = i.height, a = (I(this.width, c) || c) + l, d = I(this.height, u) + n, f = [c / a >> 0 || 1, u / d >> 0 || 1];
|
|
222
|
+
s && f.reverse();
|
|
223
|
+
let [o, y] = f, v = this.padding, $, N = 0, m, B;
|
|
224
224
|
s ? (m = a, a -= l, B = (w) => (
|
|
225
225
|
/* 计算top偏移量 */
|
|
226
|
-
w * (
|
|
227
|
-
)) : (h ? (a = (c - l * (o + 2 *
|
|
228
|
-
let
|
|
229
|
-
for (;
|
|
230
|
-
|
|
226
|
+
w * (d - n) + (w + 1) * n
|
|
227
|
+
)) : (h ? (a = (c - l * (o + 2 * v - 1)) / o, $ = !v * l, N = v * l) : ($ = 0, N = (c % a + l * o) / (o + 1) >> 0, a -= l), B = (w) => w * (a + $) + (w + 1) * N, m = d), this.row = y + 2, this.column = o, this.realH = d - n, this.realW = a, this.expand = m, this.Size = Math.ceil(e / o) * m;
|
|
228
|
+
let L = Math.min(e, o * this.row), b = L - 1, H;
|
|
229
|
+
for (; L-- > 0; )
|
|
230
|
+
H = b - L, this.$set(t, H, {
|
|
231
231
|
x: l,
|
|
232
232
|
y: n,
|
|
233
233
|
width: a,
|
|
234
|
-
height:
|
|
235
|
-
space: B(
|
|
234
|
+
height: d - n,
|
|
235
|
+
space: B(H % o),
|
|
236
236
|
data: {}
|
|
237
237
|
});
|
|
238
|
-
t.length =
|
|
239
|
-
let
|
|
240
|
-
|
|
238
|
+
t.length = b + 1;
|
|
239
|
+
let A = [];
|
|
240
|
+
u / m > b / o && A.push(["onend"]), this.flyweight && (this.flyweight[this.direction] = 0), this.$nextTick(() => {
|
|
241
241
|
this.setindex(this.selectIndex || 0), this.scroll();
|
|
242
|
-
}),
|
|
243
|
-
row: (
|
|
242
|
+
}), A.push(["update:space", {
|
|
243
|
+
row: (b / o >> 0) + 1,
|
|
244
244
|
column: o,
|
|
245
245
|
showrow: this.row,
|
|
246
246
|
showcolumn: this.column
|
|
247
|
-
}]), this.trigger(
|
|
247
|
+
}]), this.trigger(A);
|
|
248
248
|
});
|
|
249
249
|
}
|
|
250
250
|
}
|
|
251
|
-
},
|
|
252
|
-
function
|
|
253
|
-
return
|
|
251
|
+
}, ie = { class: "flyweight-all" };
|
|
252
|
+
function le(e, t, s, r, i, h) {
|
|
253
|
+
return S(), T("div", {
|
|
254
254
|
ref: "flyweight",
|
|
255
|
-
class:
|
|
255
|
+
class: j(["flyweight", {
|
|
256
256
|
"flyweight-active": i.actice
|
|
257
257
|
}]),
|
|
258
|
-
style:
|
|
258
|
+
style: z({
|
|
259
259
|
"--width": h.exec(i.realW),
|
|
260
260
|
"--height": h.exec(i.realH),
|
|
261
261
|
"--flyweight-content": h.exec(i.Size)
|
|
262
262
|
}),
|
|
263
263
|
onScroll: t[0] || (t[0] = (...l) => h.scroll && h.scroll(...l))
|
|
264
264
|
}, [
|
|
265
|
-
|
|
266
|
-
(
|
|
265
|
+
k("div", ie, [
|
|
266
|
+
(S(!0), T(Y, null, q(i.flyweights, (l, n) => (S(), T("div", {
|
|
267
267
|
key: n,
|
|
268
|
-
style:
|
|
268
|
+
style: z({
|
|
269
269
|
top: l.top + "px",
|
|
270
270
|
left: l.left + "px"
|
|
271
271
|
})
|
|
272
272
|
}, [
|
|
273
|
-
g(e.$slots, "default",
|
|
273
|
+
g(e.$slots, "default", J({ ref_for: !0 }, l), void 0, !0)
|
|
274
274
|
], 4))), 128))
|
|
275
275
|
]),
|
|
276
|
-
i.flyweights.length ? g(e.$slots, "end", { key: 0 }, void 0, !0) :
|
|
276
|
+
i.flyweights.length ? g(e.$slots, "end", { key: 0 }, void 0, !0) : K("", !0)
|
|
277
277
|
], 38);
|
|
278
278
|
}
|
|
279
|
-
const
|
|
280
|
-
|
|
279
|
+
const re = /* @__PURE__ */ V(se, [["render", le], ["__scopeId", "data-v-8f29f044"]]);
|
|
280
|
+
function O(e, t) {
|
|
281
|
+
return t && (e = e.replace(/[a-z]/g, "")), e.toLowerCase();
|
|
282
|
+
}
|
|
283
|
+
let G = {
|
|
284
|
+
close: {
|
|
285
|
+
handler(e) {
|
|
286
|
+
this.change(e);
|
|
287
|
+
},
|
|
288
|
+
deep: !0
|
|
289
|
+
},
|
|
290
|
+
offset: {
|
|
291
|
+
handler(e) {
|
|
292
|
+
this.margin(e);
|
|
293
|
+
},
|
|
294
|
+
deep: !0
|
|
295
|
+
}
|
|
296
|
+
}, he = ["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], M = {};
|
|
297
|
+
x(he, (e, t, s) => {
|
|
298
|
+
e = O(t), M["--" + O(t, !0)] = e, s[e] = function() {
|
|
299
|
+
this.trigger++;
|
|
300
|
+
};
|
|
301
|
+
}, G);
|
|
302
|
+
const ne = {
|
|
281
303
|
name: "Card",
|
|
282
304
|
// inheritAttrs: false,
|
|
283
305
|
props: {
|
|
@@ -318,6 +340,7 @@ const ie = {
|
|
|
318
340
|
return {
|
|
319
341
|
closecss: {},
|
|
320
342
|
style: {},
|
|
343
|
+
trigger: 0,
|
|
321
344
|
default: {
|
|
322
345
|
top: "0px",
|
|
323
346
|
right: "0px",
|
|
@@ -332,43 +355,31 @@ const ie = {
|
|
|
332
355
|
},
|
|
333
356
|
computed: {
|
|
334
357
|
style() {
|
|
335
|
-
|
|
336
|
-
return this.margin(this.offset), S(["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], (t, s) => {
|
|
337
|
-
this.css(e, s);
|
|
338
|
-
}), e;
|
|
339
|
-
}
|
|
340
|
-
},
|
|
341
|
-
watch: {
|
|
342
|
-
close: {
|
|
343
|
-
handler(e) {
|
|
344
|
-
this.change(e);
|
|
345
|
-
},
|
|
346
|
-
deep: !0
|
|
347
|
-
},
|
|
348
|
-
offset: {
|
|
349
|
-
handler(e) {
|
|
350
|
-
this.margin(e);
|
|
351
|
-
},
|
|
352
|
-
deep: !0
|
|
358
|
+
return this.tr();
|
|
353
359
|
}
|
|
354
360
|
},
|
|
361
|
+
watch: G,
|
|
355
362
|
methods: {
|
|
356
|
-
exec:
|
|
357
|
-
isEmpty:
|
|
358
|
-
isSimplyType:
|
|
359
|
-
|
|
360
|
-
|
|
363
|
+
exec: C,
|
|
364
|
+
isEmpty: P,
|
|
365
|
+
isSimplyType: E,
|
|
366
|
+
tr() {
|
|
367
|
+
let e = {};
|
|
368
|
+
return this.margin(this.offset), x(M, (t, s) => {
|
|
369
|
+
this.css(e, t, s);
|
|
370
|
+
}), e;
|
|
361
371
|
},
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
372
|
+
tolower: O,
|
|
373
|
+
css(e, t, s) {
|
|
374
|
+
let r = this[s] || this.default[s];
|
|
375
|
+
!r || this.default[s] == r || (e[t] = C(r));
|
|
365
376
|
},
|
|
366
377
|
change(e) {
|
|
367
|
-
|
|
378
|
+
E(e) || (this.closecss = _(e, "color=>--s-card-close-color,*"));
|
|
368
379
|
},
|
|
369
380
|
margin(e) {
|
|
370
|
-
|
|
371
|
-
|
|
381
|
+
R(this, _(
|
|
382
|
+
U(e) ? e.split(/\s*(?:,|\s+)\s*/) : e,
|
|
372
383
|
"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",
|
|
373
384
|
!0
|
|
374
385
|
), !0);
|
|
@@ -377,32 +388,33 @@ const ie = {
|
|
|
377
388
|
mounted() {
|
|
378
389
|
this.change(this.close);
|
|
379
390
|
}
|
|
380
|
-
},
|
|
381
|
-
function
|
|
382
|
-
return
|
|
391
|
+
}, oe = { class: "card-title" }, ae = { class: "card-content" };
|
|
392
|
+
function ce(e, t, s, r, i, h) {
|
|
393
|
+
return S(), T("div", {
|
|
383
394
|
class: "card",
|
|
384
|
-
|
|
395
|
+
key: i.trigger,
|
|
396
|
+
style: z(h.isEmpty(h.style) ? h.tr() : h.style)
|
|
385
397
|
}, [
|
|
386
398
|
g(e.$slots, "default", {}, () => [
|
|
387
399
|
g(e.$slots, "title", {}, () => [
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
class:
|
|
392
|
-
style:
|
|
400
|
+
k("div", oe, [
|
|
401
|
+
Q(Z(s.show || s.title) + " ", 1),
|
|
402
|
+
k("div", {
|
|
403
|
+
class: j(["card-close", { hide: h.isSimplyType(s.close) ? !s.close : !1 }]),
|
|
404
|
+
style: z(i.closecss),
|
|
393
405
|
onClick: t[0] || (t[0] = (l) => e.$emit("close"))
|
|
394
406
|
}, null, 6)
|
|
395
407
|
])
|
|
396
408
|
], !0),
|
|
397
409
|
g(e.$slots, "content", {}, () => [
|
|
398
|
-
|
|
410
|
+
k("div", ae, [
|
|
399
411
|
g(e.$slots, "inner", {}, void 0, !0)
|
|
400
412
|
])
|
|
401
413
|
], !0)
|
|
402
414
|
], !0)
|
|
403
415
|
], 4);
|
|
404
416
|
}
|
|
405
|
-
const
|
|
417
|
+
const ue = /* @__PURE__ */ V(ne, [["render", ce], ["__scopeId", "data-v-23ece4cb"]]), de = {
|
|
406
418
|
name: "Stream",
|
|
407
419
|
props: {
|
|
408
420
|
type: {
|
|
@@ -428,21 +440,21 @@ const ne = /* @__PURE__ */ j(ie, [["render", he], ["__scopeId", "data-v-def66c95
|
|
|
428
440
|
}
|
|
429
441
|
},
|
|
430
442
|
this._l(this.T, (t, s) => {
|
|
431
|
-
let r =
|
|
432
|
-
return
|
|
443
|
+
let r = _(t, "slot|name|type=>name").name, i = _(this, X("$scopedSlots.?|$slots.?|$scopedSlots.default=>?", r));
|
|
444
|
+
return R(t, { index: s }), p(r, i, t);
|
|
433
445
|
})
|
|
434
446
|
);
|
|
435
447
|
}
|
|
436
|
-
},
|
|
448
|
+
}, fe = [re, ue, de], ye = {
|
|
437
449
|
install(e) {
|
|
438
|
-
|
|
450
|
+
fe.forEach((t) => {
|
|
439
451
|
e.component("S" + t.name, t), e.component(t.name + "S", t);
|
|
440
452
|
});
|
|
441
453
|
}
|
|
442
454
|
};
|
|
443
455
|
export {
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
456
|
+
ue as Card,
|
|
457
|
+
re as Flyweight,
|
|
458
|
+
de as Stream,
|
|
459
|
+
ye as default
|
|
448
460
|
};
|
package/README.md
CHANGED
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
<div>Flyweight Test</div>
|
|
18
18
|
</template>
|
|
19
19
|
<template #inner>
|
|
20
|
-
<Card class="applist"
|
|
20
|
+
<Card class="applist" background="#f7f7f7" border="0.1px" height="100%">
|
|
21
21
|
<Flyweight
|
|
22
22
|
:flys="flys"
|
|
23
23
|
hover-scroll
|
package/package.json
CHANGED
package/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
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-
|
|
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-23ece4cb]{--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-23ece4cb]::-webkit-scrollbar-track,.card[auto-scroll][data-v-23ece4cb]::-webkit-scrollbar-track{border-radius:10px}.card[hover-scroll][data-v-23ece4cb]::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-23ece4cb]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.card[hover-scroll][data-v-23ece4cb]::-webkit-scrollbar,.card[auto-scroll][data-v-23ece4cb]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.card[hover-scroll][data-v-23ece4cb]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-23ece4cb]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.card[hover-scroll][data-v-23ece4cb]:hover::-webkit-scrollbar-thumb:hover,.card[auto-scroll][data-v-23ece4cb]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.card[hover-scroll][data-v-23ece4cb]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-23ece4cb]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.card[simply][data-v-23ece4cb],.card [simply][data-v-23ece4cb]{background-color:inherit;border:0!important}.card[flex][data-v-23ece4cb],.card [flex][data-v-23ece4cb]{display:flex}.card[column][data-v-23ece4cb],.card [column][data-v-23ece4cb]{flex-direction:column}.card[row][data-v-23ece4cb],.card [row][data-v-23ece4cb]{flex-direction:row}.card[center][data-v-23ece4cb],.card [center][data-v-23ece4cb]{justify-content:center}.card[vcenter][data-v-23ece4cb],.card [vcenter][data-v-23ece4cb]{align-items:center}.card .card-title[data-v-23ece4cb]{max-height:40px}.card .card-close[data-v-23ece4cb]{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-23ece4cb]{display:none}.card .card-close[data-v-23ece4cb]:before,.card .card-close[data-v-23ece4cb]: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-23ece4cb]:before{transform:rotate(var(--s-transform, 45deg))}.card .card-close[data-v-23ece4cb]:after{transform:rotate(calc(0deg - var(--s-transform, 45deg)))}.card .card-close[data-v-23ece4cb]:hover:before{transform:rotate(var(--s-hover-transform, 45deg))}.card .card-close[data-v-23ece4cb]:hover:after{transform:rotate(calc(0deg - var(--s-hover-transform, 45deg)))}.card .card-content[data-v-23ece4cb]{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
|
|
1
|
+
"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("@soei/util");let W=/(\d+|[+\-\*/]|%)/g,R={"+":(t,e)=>t+e,"-":(t,e)=>t-e,"*":(t,e)=>t*e,"/":(t,e)=>t/e,"%":(t,e,s)=>parseFloat(t)/100*s},F=(t,e)=>{let s;if(s=l.runer("match",t,W)){let i=s.length,r,c=0,n,o=[];for(;i--;)c=s.shift(),c in R?(r&&o.push(r),c==="%"&&(o.length=2),n=c):+c&&o.push(+c),o.length==2&&(o.push(e),r=R[n].apply(null,o),o.length=0);+r||(r=+o.pop()),t=r>>0}return t},k=t=>(t+"").replace(/\w+\((.*)\)/g,"$1").replace(/(?=\s+|^)(\d+(\.\d+)*)(?!(?:\.)*\d|%|\w)/g,"$1px");function z(t,e,s,i,r,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__),r&&r.call(this,u),u&&u._registeredComponents&&u._registeredComponents.add(n)},h._ssrRegister=f):r&&(f=o?function(){r.call(this,(h.functional?this.parent:this).$root.$options.shadowRoot)}:r),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 N=t=>t==null||t==null,E=(...t)=>{console.info("::::FLYWEIGHT",...t)};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(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){E(t)}this.scrollx=l.runer("hasAttribute",this.flyweight,"scroll-x"),this.BoxRule="clientHeight=>height,clientWidth=>width",this.direction=this.scrollx?"scrollLeft":"scrollTop"},methods:{exec:k,trigger(t,e){this.lazyrun(()=>{l.isArray(t)||(t=[[t,e]]),l.each(t,(s,i)=>{this.$emit(i[0],N(i[1])?!0:i[1])})})},cheackflys(t){if(!this.flys.length)return t&&this.task.push(t),!0},setview(t){l.runer([this.cheackflys,e=>{e=e||{};let s=e.index||l.each(this.flys,(i,r,c,n)=>{if(r[c]==n)return i},e.picker,e.id);N(s)||this.setindex(s)}],this,t)},setindex(t){l.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(()=>{l.runer(t)},e||this.lazy)},run(t){let e=[],s=l.runer(this.direction,t.target),i={offset:s,top:s,width:this.realW,height:this.realH,index:s/this.expand>>0};l.merge(i,this.space),t.from||e.push(["onscroll",i]);let r=!1;l.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){r||(e.push(["onend"]),r=!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,r=l.picker(i,this.BoxRule);this.$nextTick(()=>{let c=/true/.test(this.auto),[n,o]=this.offset,h=r.width,f=r.height,d=(F(this.width,h)||h)+n,p=F(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 T=[];f/y>m/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:(m/a>>0)+1,column:a,showrow:this.row,showcolumn:this.column}]),this.trigger(T)})}}};var M=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,r){return s("div",{key:r,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)},U=[],X=z(I,M,U,!1,null,"05373fe1",null,null);const O=X.exports;function C(t,e){return e&&(t=t.replace(/[a-z]/g,"")),t.toLowerCase()}let H={close:{handler(t){this.change(t)},deep:!0},offset:{handler(t){this.margin(t)},deep:!0}},j=["BackGround","BordeR","Height","Width","Top","Right","Bottom","Left"],L={};l.each(j,(t,e,s)=>{t=C(e),L["--"+C(e,!0)]=t,s[t]=function(){this.trigger++}},H);const G={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:{},trigger:0,default:{top:"0px",right:"0px",bottom:"0px",left:"0px",height:"100%",width:"100%",background:"",border:"1px"}}},computed:{style(){return this.tr()}},watch:H,methods:{exec:k,isEmpty:l.isEmpty,isSimplyType:l.isSimplyType,tr(){let t={};return this.margin(this.offset),l.each(L,(e,s)=>{this.css(t,e,s)}),t},tolower:C,css(t,e,s){let i=this[s]||this.default[s];!i||this.default[s]==i||(t[e]=k(i))},change(t){l.isSimplyType(t)||(this.closecss=l.picker(t,"color=>--s-card-close-color,*"))},margin(t){l.merge(this,l.picker(l.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 V=function(){var e=this,s=e._self._c;return s("div",{key:e.trigger,staticClass:"card",style:e.isEmpty(e.style)?e.tr():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)},q=[],P=z(G,V,q,!1,null,"b6ea8a12",null,null);const A=P.exports,Y={name:"Stream",props:{type:{type:String,default:"div"},data:{type:Array,default:()=>[]},T:{type:Array,default:()=>[]}},render(t){return t(this.type,{props:{data:this.data}},this._l(this.T,(e,s)=>{let i=l.picker(e,"slot|name|type=>name").name,r=l.picker(this,l.format("$scopedSlots.?|$slots.?|$scopedSlots.default=>?",i));return l.merge(e,{index:s}),l.runer(i,r,e)}))}},D=null,J=null;var K=z(Y,D,J,!1,null,null,null,null);const B=K.exports,Q=[O,A,B],Z={install(t){Q.forEach(e=>{t.component("S"+e.name,e),t.component(e.name+"S",e)})}};exports.Card=A;exports.Flyweight=O;exports.Stream=B;exports.default=Z;
|
package/vue2/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { runer as g, isArray as
|
|
2
|
-
let
|
|
1
|
+
import { runer as g, isArray as E, each as m, merge as F, picker as w, isEmpty as I, isSimplyType as H, isString as U, format as X } from "@soei/util";
|
|
2
|
+
let G = /(\d+|[+\-\*/]|%)/g, L = {
|
|
3
3
|
"+": (t, e) => t + e,
|
|
4
4
|
"-": (t, e) => t - e,
|
|
5
5
|
"*": (t, e) => t * e,
|
|
@@ -7,15 +7,15 @@ let I = /(\d+|[+\-\*/]|%)/g, H = {
|
|
|
7
7
|
"%": (t, e, s) => parseFloat(t) / 100 * s
|
|
8
8
|
}, O = (t, e) => {
|
|
9
9
|
let s;
|
|
10
|
-
if (s = g("match", t,
|
|
10
|
+
if (s = g("match", t, G)) {
|
|
11
11
|
let i = s.length, l, a = 0, r, h = [];
|
|
12
12
|
for (; i--; )
|
|
13
|
-
a = s.shift(), a in
|
|
13
|
+
a = s.shift(), a in L ? (l && h.push(l), a === "%" && (h.length = 2), r = a) : +a && h.push(+a), h.length == 2 && (h.push(e), l = L[r].apply(null, h), h.length = 0);
|
|
14
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
|
|
18
|
+
function N(t, e, s, i, l, a, r, h) {
|
|
19
19
|
var n = typeof t == "function" ? t.options : t;
|
|
20
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;
|
|
@@ -44,10 +44,10 @@ function F(t, e, s, i, l, a, r, h) {
|
|
|
44
44
|
options: n
|
|
45
45
|
};
|
|
46
46
|
}
|
|
47
|
-
let
|
|
47
|
+
let A = (t) => t == null || t == null, M = (...t) => {
|
|
48
48
|
console.info("::::FLYWEIGHT", ...t);
|
|
49
49
|
};
|
|
50
|
-
const
|
|
50
|
+
const V = {
|
|
51
51
|
name: "Flyweight",
|
|
52
52
|
props: {
|
|
53
53
|
flys: {
|
|
@@ -152,7 +152,7 @@ const X = {
|
|
|
152
152
|
this.rebuild(), this.$emit("resize");
|
|
153
153
|
}).observe(this.flyweight);
|
|
154
154
|
} catch (t) {
|
|
155
|
-
|
|
155
|
+
M(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 X = {
|
|
|
161
161
|
exec: z,
|
|
162
162
|
trigger(t, e) {
|
|
163
163
|
this.lazyrun(() => {
|
|
164
|
-
|
|
165
|
-
this.$emit(i[0],
|
|
164
|
+
E(t) || (t = [[t, e]]), m(t, (s, i) => {
|
|
165
|
+
this.$emit(i[0], A(i[1]) ? !0 : i[1]);
|
|
166
166
|
});
|
|
167
167
|
});
|
|
168
168
|
},
|
|
@@ -173,11 +173,11 @@ const X = {
|
|
|
173
173
|
setview(t) {
|
|
174
174
|
g([this.cheackflys, (e) => {
|
|
175
175
|
e = e || {};
|
|
176
|
-
let s = e.index ||
|
|
176
|
+
let s = e.index || m(this.flys, (i, l, a, r) => {
|
|
177
177
|
if (l[a] == r)
|
|
178
178
|
return i;
|
|
179
179
|
}, e.picker, e.id);
|
|
180
|
-
|
|
180
|
+
A(s) || this.setindex(s);
|
|
181
181
|
}], this, t);
|
|
182
182
|
},
|
|
183
183
|
setindex(t) {
|
|
@@ -203,9 +203,9 @@ const X = {
|
|
|
203
203
|
/* 显示区域第一行的索引 */
|
|
204
204
|
index: s / this.expand >> 0
|
|
205
205
|
};
|
|
206
|
-
|
|
206
|
+
F(i, this.space), t.from || e.push(["onscroll", i]);
|
|
207
207
|
let l = !1;
|
|
208
|
-
|
|
208
|
+
m(
|
|
209
209
|
this.flyweights,
|
|
210
210
|
(a, r, h, n, f, u, d, c, o) => {
|
|
211
211
|
if (h = a / f >> 0, c = h + n * /* 偏移量, 如果超出顶部 + 1轮,排列到列队后, 否则保持在当前*/
|
|
@@ -238,40 +238,40 @@ const X = {
|
|
|
238
238
|
if (!t)
|
|
239
239
|
return e.length = t;
|
|
240
240
|
this.count = t;
|
|
241
|
-
let s = this.scrollx, i = this.flyweight, l =
|
|
241
|
+
let s = this.scrollx, i = this.flyweight, l = w(i, this.BoxRule);
|
|
242
242
|
this.$nextTick(() => {
|
|
243
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
244
|
s && c.reverse();
|
|
245
|
-
let [o, p] = c,
|
|
245
|
+
let [o, p] = c, $ = this.padding, v, b = 0, y, S;
|
|
246
246
|
s ? (y = u, u -= r, S = (_) => (
|
|
247
247
|
/* 计算top偏移量 */
|
|
248
248
|
_ * (d - h) + (_ + 1) * h
|
|
249
|
-
)) : (a ? (u = (n - r * (o + 2 *
|
|
250
|
-
let T = Math.min(t, o * this.row),
|
|
249
|
+
)) : (a ? (u = (n - r * (o + 2 * $ - 1)) / o, v = !$ * r, b = $ * r) : (v = 0, b = (n % u + r * o) / (o + 1) >> 0, u -= r), S = (_) => _ * (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 T = Math.min(t, o * this.row), x = T - 1, C;
|
|
251
251
|
for (; T-- > 0; )
|
|
252
|
-
|
|
252
|
+
C = x - T, this.$set(e, C, {
|
|
253
253
|
x: r,
|
|
254
254
|
y: h,
|
|
255
255
|
width: u,
|
|
256
256
|
height: d - h,
|
|
257
|
-
space: S(
|
|
257
|
+
space: S(C % o),
|
|
258
258
|
data: {}
|
|
259
259
|
});
|
|
260
|
-
e.length =
|
|
261
|
-
let
|
|
262
|
-
f / y >
|
|
260
|
+
e.length = x + 1;
|
|
261
|
+
let k = [];
|
|
262
|
+
f / y > x / o && k.push(["onend"]), this.flyweight && (this.flyweight[this.direction] = 0), this.$nextTick(() => {
|
|
263
263
|
this.setindex(this.selectIndex || 0), this.scroll();
|
|
264
|
-
}),
|
|
265
|
-
row: (
|
|
264
|
+
}), k.push(["update:space", {
|
|
265
|
+
row: (x / o >> 0) + 1,
|
|
266
266
|
column: o,
|
|
267
267
|
showrow: this.row,
|
|
268
268
|
showcolumn: this.column
|
|
269
|
-
}]), this.trigger(
|
|
269
|
+
}]), this.trigger(k);
|
|
270
270
|
});
|
|
271
271
|
}
|
|
272
272
|
}
|
|
273
273
|
};
|
|
274
|
-
var
|
|
274
|
+
var j = function() {
|
|
275
275
|
var e = this, s = e._self._c;
|
|
276
276
|
return s("div", { ref: "flyweight", staticClass: "flyweight", class: {
|
|
277
277
|
"flyweight-active": e.actice
|
|
@@ -285,18 +285,40 @@ var G = function() {
|
|
|
285
285
|
left: i.left + "px"
|
|
286
286
|
} }, [e._t("default", null, null, i)], 2);
|
|
287
287
|
}), 0), e.flyweights.length ? e._t("end") : e._e()], 2);
|
|
288
|
-
},
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
288
|
+
}, Y = [], q = /* @__PURE__ */ N(
|
|
289
|
+
V,
|
|
290
|
+
j,
|
|
291
|
+
Y,
|
|
292
292
|
!1,
|
|
293
293
|
null,
|
|
294
294
|
"05373fe1",
|
|
295
295
|
null,
|
|
296
296
|
null
|
|
297
297
|
);
|
|
298
|
-
const
|
|
299
|
-
|
|
298
|
+
const D = q.exports;
|
|
299
|
+
function R(t, e) {
|
|
300
|
+
return e && (t = t.replace(/[a-z]/g, "")), t.toLowerCase();
|
|
301
|
+
}
|
|
302
|
+
let B = {
|
|
303
|
+
close: {
|
|
304
|
+
handler(t) {
|
|
305
|
+
this.change(t);
|
|
306
|
+
},
|
|
307
|
+
deep: !0
|
|
308
|
+
},
|
|
309
|
+
offset: {
|
|
310
|
+
handler(t) {
|
|
311
|
+
this.margin(t);
|
|
312
|
+
},
|
|
313
|
+
deep: !0
|
|
314
|
+
}
|
|
315
|
+
}, J = ["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], W = {};
|
|
316
|
+
m(J, (t, e, s) => {
|
|
317
|
+
t = R(e), W["--" + R(e, !0)] = t, s[t] = function() {
|
|
318
|
+
this.trigger++;
|
|
319
|
+
};
|
|
320
|
+
}, B);
|
|
321
|
+
const K = {
|
|
300
322
|
name: "Card",
|
|
301
323
|
// inheritAttrs: false,
|
|
302
324
|
props: {
|
|
@@ -337,6 +359,7 @@ const Y = {
|
|
|
337
359
|
return {
|
|
338
360
|
closecss: {},
|
|
339
361
|
style: {},
|
|
362
|
+
trigger: 0,
|
|
340
363
|
default: {
|
|
341
364
|
top: "0px",
|
|
342
365
|
right: "0px",
|
|
@@ -351,43 +374,31 @@ const Y = {
|
|
|
351
374
|
},
|
|
352
375
|
computed: {
|
|
353
376
|
style() {
|
|
354
|
-
|
|
355
|
-
return this.margin(this.offset), x(["BackGround", "BordeR", "Height", "Width", "Top", "Right", "Bottom", "Left"], (e, s) => {
|
|
356
|
-
this.css(t, s);
|
|
357
|
-
}), t;
|
|
358
|
-
}
|
|
359
|
-
},
|
|
360
|
-
watch: {
|
|
361
|
-
close: {
|
|
362
|
-
handler(t) {
|
|
363
|
-
this.change(t);
|
|
364
|
-
},
|
|
365
|
-
deep: !0
|
|
366
|
-
},
|
|
367
|
-
offset: {
|
|
368
|
-
handler(t) {
|
|
369
|
-
this.margin(t);
|
|
370
|
-
},
|
|
371
|
-
deep: !0
|
|
377
|
+
return this.tr();
|
|
372
378
|
}
|
|
373
379
|
},
|
|
380
|
+
watch: B,
|
|
374
381
|
methods: {
|
|
375
382
|
exec: z,
|
|
376
|
-
isEmpty:
|
|
377
|
-
isSimplyType:
|
|
378
|
-
|
|
379
|
-
|
|
383
|
+
isEmpty: I,
|
|
384
|
+
isSimplyType: H,
|
|
385
|
+
tr() {
|
|
386
|
+
let t = {};
|
|
387
|
+
return this.margin(this.offset), m(W, (e, s) => {
|
|
388
|
+
this.css(t, e, s);
|
|
389
|
+
}), t;
|
|
380
390
|
},
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
391
|
+
tolower: R,
|
|
392
|
+
css(t, e, s) {
|
|
393
|
+
let i = this[s] || this.default[s];
|
|
394
|
+
!i || this.default[s] == i || (t[e] = z(i));
|
|
384
395
|
},
|
|
385
396
|
change(t) {
|
|
386
|
-
|
|
397
|
+
H(t) || (this.closecss = w(t, "color=>--s-card-close-color,*"));
|
|
387
398
|
},
|
|
388
399
|
margin(t) {
|
|
389
|
-
|
|
390
|
-
|
|
400
|
+
F(this, w(
|
|
401
|
+
U(t) ? t.split(/\s*(?:,|\s+)\s*/) : t,
|
|
391
402
|
"0=>top,1|0=>right,2|0=>bottom,3|1|0=>left",
|
|
392
403
|
!0
|
|
393
404
|
), !0);
|
|
@@ -397,9 +408,9 @@ const Y = {
|
|
|
397
408
|
this.change(this.close);
|
|
398
409
|
}
|
|
399
410
|
};
|
|
400
|
-
var
|
|
411
|
+
var P = function() {
|
|
401
412
|
var e = this, s = e._self._c;
|
|
402
|
-
return s("div", { staticClass: "card", style: e.style }, [e._t("default", function() {
|
|
413
|
+
return s("div", { key: e.trigger, staticClass: "card", style: e.isEmpty(e.style) ? e.tr() : e.style }, [e._t("default", function() {
|
|
403
414
|
return [e._t("title", function() {
|
|
404
415
|
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
416
|
return e.$emit("close");
|
|
@@ -408,17 +419,17 @@ var q = function() {
|
|
|
408
419
|
return [s("div", { staticClass: "card-content" }, [e._t("inner")], 2)];
|
|
409
420
|
})];
|
|
410
421
|
})], 2);
|
|
411
|
-
},
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
422
|
+
}, Q = [], Z = /* @__PURE__ */ N(
|
|
423
|
+
K,
|
|
424
|
+
P,
|
|
425
|
+
Q,
|
|
415
426
|
!1,
|
|
416
427
|
null,
|
|
417
|
-
"
|
|
428
|
+
"b6ea8a12",
|
|
418
429
|
null,
|
|
419
430
|
null
|
|
420
431
|
);
|
|
421
|
-
const
|
|
432
|
+
const tt = Z.exports, et = {
|
|
422
433
|
name: "Stream",
|
|
423
434
|
props: {
|
|
424
435
|
type: {
|
|
@@ -444,32 +455,32 @@ const K = J.exports, P = {
|
|
|
444
455
|
}
|
|
445
456
|
},
|
|
446
457
|
this._l(this.T, (e, s) => {
|
|
447
|
-
let i =
|
|
448
|
-
return
|
|
458
|
+
let i = w(e, "slot|name|type=>name").name, l = w(this, X("$scopedSlots.?|$slots.?|$scopedSlots.default=>?", i));
|
|
459
|
+
return F(e, { index: s }), g(i, l, e);
|
|
449
460
|
})
|
|
450
461
|
);
|
|
451
462
|
}
|
|
452
|
-
},
|
|
453
|
-
var
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
463
|
+
}, st = null, it = null;
|
|
464
|
+
var lt = /* @__PURE__ */ N(
|
|
465
|
+
et,
|
|
466
|
+
st,
|
|
467
|
+
it,
|
|
457
468
|
!1,
|
|
458
469
|
null,
|
|
459
470
|
null,
|
|
460
471
|
null,
|
|
461
472
|
null
|
|
462
473
|
);
|
|
463
|
-
const
|
|
474
|
+
const rt = lt.exports, nt = [D, tt, rt], ot = {
|
|
464
475
|
install(t) {
|
|
465
|
-
|
|
476
|
+
nt.forEach((e) => {
|
|
466
477
|
t.component("S" + e.name, e), t.component(e.name + "S", e);
|
|
467
478
|
});
|
|
468
479
|
}
|
|
469
480
|
};
|
|
470
481
|
export {
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
482
|
+
tt as Card,
|
|
483
|
+
D as Flyweight,
|
|
484
|
+
rt as Stream,
|
|
485
|
+
ot as default
|
|
475
486
|
};
|
package/vue2/style.css
CHANGED
|
@@ -1 +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-
|
|
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-b6ea8a12]{--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-b6ea8a12]::-webkit-scrollbar-track,.card[auto-scroll][data-v-b6ea8a12]::-webkit-scrollbar-track{border-radius:10px}.card[hover-scroll][data-v-b6ea8a12]::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-b6ea8a12]::-webkit-scrollbar-thumb{border-radius:10px;background-color:transparent}.card[hover-scroll][data-v-b6ea8a12]::-webkit-scrollbar,.card[auto-scroll][data-v-b6ea8a12]::-webkit-scrollbar{border-radius:10px;width:var(--scrollbar-width, 8px);height:var(--scrollbar-width, 8px)}.card[hover-scroll][data-v-b6ea8a12]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-b6ea8a12]::-webkit-scrollbar-thumb{border-style:dashed;border-color:transparent;border-width:2px;background-clip:padding-box;cursor:pointer}.card[hover-scroll][data-v-b6ea8a12]:hover::-webkit-scrollbar-thumb:hover,.card[auto-scroll][data-v-b6ea8a12]::-webkit-scrollbar-thumb:hover{background:var(--scrollbar-color, #101010)}.card[hover-scroll][data-v-b6ea8a12]:hover::-webkit-scrollbar-thumb,.card[auto-scroll][data-v-b6ea8a12]::-webkit-scrollbar-thumb{background-color:var(--scrollbar-color, #101010)}.card[simply][data-v-b6ea8a12],.card [simply][data-v-b6ea8a12]{background-color:inherit;border:0!important}.card[flex][data-v-b6ea8a12],.card [flex][data-v-b6ea8a12]{display:flex}.card[column][data-v-b6ea8a12],.card [column][data-v-b6ea8a12]{flex-direction:column}.card[row][data-v-b6ea8a12],.card [row][data-v-b6ea8a12]{flex-direction:row}.card[center][data-v-b6ea8a12],.card [center][data-v-b6ea8a12]{justify-content:center}.card[vcenter][data-v-b6ea8a12],.card [vcenter][data-v-b6ea8a12]{align-items:center}.card .card-title[data-v-b6ea8a12]{max-height:40px}.card .card-close[data-v-b6ea8a12]{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-b6ea8a12]{display:none}.card .card-close[data-v-b6ea8a12]:before,.card .card-close[data-v-b6ea8a12]: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-b6ea8a12]:before{transform:rotate(var(--s-transform, 45deg))}.card .card-close[data-v-b6ea8a12]:after{transform:rotate(calc(0deg - var(--s-transform, 45deg)))}.card .card-close[data-v-b6ea8a12]:hover:before{transform:rotate(var(--s-hover-transform, 45deg))}.card .card-close[data-v-b6ea8a12]:hover:after{transform:rotate(calc(0deg - var(--s-hover-transform, 45deg)))}.card .card-content[data-v-b6ea8a12]{overflow:auto;height:100%}
|