This commit is contained in:
darenhsu
2022-07-17 13:16:16 +08:00
parent 84759556ff
commit befd344ab0
28070 changed files with 4008428 additions and 1 deletions
+80
View File
@@ -0,0 +1,80 @@
// Mixins
import Measurable from '../../mixins/measurable';
import Toggleable from '../../mixins/toggleable'; // Directives
import intersect from '../../directives/intersect'; // Utilities
import mixins from '../../util/mixins';
import { getSlot } from '../../util/helpers';
export default mixins(Measurable, Toggleable).extend({
name: 'VLazy',
directives: {
intersect
},
props: {
options: {
type: Object,
// For more information on types, navigate to:
// https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API
default: () => ({
root: undefined,
rootMargin: undefined,
threshold: undefined
})
},
tag: {
type: String,
default: 'div'
},
transition: {
type: String,
default: 'fade-transition'
}
},
computed: {
styles() {
return { ...this.measurableStyles
};
}
},
methods: {
genContent() {
const slot = getSlot(this);
/* istanbul ignore if */
if (!this.transition) return slot;
const children = [];
if (this.isActive) children.push(slot);
return this.$createElement('transition', {
props: {
name: this.transition
}
}, children);
},
onObserve(entries, observer, isIntersecting) {
if (this.isActive) return;
this.isActive = isIntersecting;
}
},
render(h) {
return h(this.tag, {
staticClass: 'v-lazy',
attrs: this.$attrs,
directives: [{
name: 'intersect',
value: {
handler: this.onObserve,
options: this.options
}
}],
on: this.$listeners,
style: this.styles
}, [this.genContent()]);
}
});
//# sourceMappingURL=VLazy.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../../../src/components/VLazy/VLazy.ts"],"names":[],"mappings":"AAAA;AACA,OAAO,UAAP,MAAuB,yBAAvB;AACA,OAAO,UAAP,MAAuB,yBAAvB,C,CAEA;;AACA,OAAO,SAAP,MAAsB,4BAAtB,C,CAEA;;AACA,OAAO,MAAP,MAAmB,mBAAnB;AACA,SAAS,OAAT,QAAwB,oBAAxB;AAMA,eAAe,MAAM,CACnB,UADmB,EAEnB,UAFmB,CAAN,CAGb,MAHa,CAGN;AACP,EAAA,IAAI,EAAE,OADC;AAGP,EAAA,UAAU,EAAE;AAAE,IAAA;AAAF,GAHL;AAKP,EAAA,KAAK,EAAE;AACL,IAAA,OAAO,EAAE;AACP,MAAA,IAAI,EAAE,MADC;AAEP;AACA;AACA,MAAA,OAAO,EAAE,OAAO;AACd,QAAA,IAAI,EAAE,SADQ;AAEd,QAAA,UAAU,EAAE,SAFE;AAGd,QAAA,SAAS,EAAE;AAHG,OAAP;AAJF,KADJ;AAWL,IAAA,GAAG,EAAE;AACH,MAAA,IAAI,EAAE,MADH;AAEH,MAAA,OAAO,EAAE;AAFN,KAXA;AAeL,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,MADI;AAEV,MAAA,OAAO,EAAE;AAFC;AAfP,GALA;AA0BP,EAAA,QAAQ,EAAE;AACR,IAAA,MAAM,GAAA;AACJ,aAAO,EACL,GAAG,KAAK;AADH,OAAP;AAGD;;AALO,GA1BH;AAkCP,EAAA,OAAO,EAAE;AACP,IAAA,UAAU,GAAA;AACR,YAAM,IAAI,GAAG,OAAO,CAAC,IAAD,CAApB;AAEA;;AACA,UAAI,CAAC,KAAK,UAAV,EAAsB,OAAO,IAAP;AAEtB,YAAM,QAAQ,GAAG,EAAjB;AAEA,UAAI,KAAK,QAAT,EAAmB,QAAQ,CAAC,IAAT,CAAc,IAAd;AAEnB,aAAO,KAAK,cAAL,CAAoB,YAApB,EAAkC;AACvC,QAAA,KAAK,EAAE;AAAE,UAAA,IAAI,EAAE,KAAK;AAAb;AADgC,OAAlC,EAEJ,QAFI,CAAP;AAGD,KAdM;;AAeP,IAAA,SAAS,CACP,OADO,EAEP,QAFO,EAGP,cAHO,EAGgB;AAEvB,UAAI,KAAK,QAAT,EAAmB;AAEnB,WAAK,QAAL,GAAgB,cAAhB;AACD;;AAvBM,GAlCF;;AA4DP,EAAA,MAAM,CAAE,CAAF,EAAG;AACP,WAAO,CAAC,CAAC,KAAK,GAAN,EAAW;AACjB,MAAA,WAAW,EAAE,QADI;AAEjB,MAAA,KAAK,EAAE,KAAK,MAFK;AAGjB,MAAA,UAAU,EAAE,CAAC;AACX,QAAA,IAAI,EAAE,WADK;AAEX,QAAA,KAAK,EAAE;AACL,UAAA,OAAO,EAAE,KAAK,SADT;AAEL,UAAA,OAAO,EAAE,KAAK;AAFT;AAFI,OAAD,CAHK;AAUjB,MAAA,EAAE,EAAE,KAAK,UAVQ;AAWjB,MAAA,KAAK,EAAE,KAAK;AAXK,KAAX,EAYL,CAAC,KAAK,UAAL,EAAD,CAZK,CAAR;AAaD;;AA1EM,CAHM,CAAf","sourcesContent":["// Mixins\nimport Measurable from '../../mixins/measurable'\nimport Toggleable from '../../mixins/toggleable'\n\n// Directives\nimport intersect from '../../directives/intersect'\n\n// Utilities\nimport mixins from '../../util/mixins'\nimport { getSlot } from '../../util/helpers'\n\n// Types\nimport { VNode } from 'vue'\nimport { PropValidator } from 'vue/types/options'\n\nexport default mixins(\n Measurable,\n Toggleable\n).extend({\n name: 'VLazy',\n\n directives: { intersect },\n\n props: {\n options: {\n type: Object,\n // For more information on types, navigate to:\n // https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API\n default: () => ({\n root: undefined,\n rootMargin: undefined,\n threshold: undefined,\n }),\n } as PropValidator<IntersectionObserverInit>,\n tag: {\n type: String,\n default: 'div',\n },\n transition: {\n type: String,\n default: 'fade-transition',\n },\n },\n\n computed: {\n styles (): object {\n return {\n ...this.measurableStyles,\n }\n },\n },\n\n methods: {\n genContent () {\n const slot = getSlot(this)\n\n /* istanbul ignore if */\n if (!this.transition) return slot\n\n const children = []\n\n if (this.isActive) children.push(slot)\n\n return this.$createElement('transition', {\n props: { name: this.transition },\n }, children)\n },\n onObserve (\n entries: IntersectionObserverEntry[],\n observer: IntersectionObserver,\n isIntersecting: boolean,\n ) {\n if (this.isActive) return\n\n this.isActive = isIntersecting\n },\n },\n\n render (h): VNode {\n return h(this.tag, {\n staticClass: 'v-lazy',\n attrs: this.$attrs,\n directives: [{\n name: 'intersect',\n value: {\n handler: this.onObserve,\n options: this.options,\n },\n }],\n on: this.$listeners,\n style: this.styles,\n }, [this.genContent()])\n },\n})\n"],"sourceRoot":"","file":"VLazy.js"}
+4
View File
@@ -0,0 +1,4 @@
import VLazy from './VLazy';
export { VLazy };
export default VLazy;
//# sourceMappingURL=index.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"sources":["../../../src/components/VLazy/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAP,MAAkB,SAAlB;AAEA,SAAS,KAAT;AACA,eAAe,KAAf","sourcesContent":["import VLazy from './VLazy'\n\nexport { VLazy }\nexport default VLazy\n"],"sourceRoot":"","file":"index.js"}