@dimailn/vuetify 2.7.2-alpha56 → 2.7.2-alpha58
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/dist/json/attributes.json +3945 -417
- package/dist/json/tags.json +1120 -133
- package/dist/json/web-types.json +12516 -2651
- package/dist/vuetify.js +93 -102
- package/dist/vuetify.js.map +1 -1
- package/dist/vuetify.min.css +1 -1
- package/dist/vuetify.min.js +2 -2
- package/es5/directives/click-outside/index.js +19 -21
- package/es5/directives/click-outside/index.js.map +1 -1
- package/es5/directives/intersect/index.js +12 -17
- package/es5/directives/intersect/index.js.map +1 -1
- package/es5/directives/mutate/index.js +9 -11
- package/es5/directives/mutate/index.js.map +1 -1
- package/es5/directives/resize/index.js +8 -10
- package/es5/directives/resize/index.js.map +1 -1
- package/es5/directives/scroll/index.js +11 -12
- package/es5/directives/scroll/index.js.map +1 -1
- package/es5/directives/touch/index.js +6 -5
- package/es5/directives/touch/index.js.map +1 -1
- package/es5/framework.js +1 -1
- package/es5/mixins/overlayable/index.js +27 -26
- package/es5/mixins/overlayable/index.js.map +1 -1
- package/es5/services/theme/utils.js.map +1 -1
- package/lib/directives/click-outside/index.js +17 -19
- package/lib/directives/click-outside/index.js.map +1 -1
- package/lib/directives/intersect/index.js +12 -16
- package/lib/directives/intersect/index.js.map +1 -1
- package/lib/directives/mutate/index.js +9 -11
- package/lib/directives/mutate/index.js.map +1 -1
- package/lib/directives/resize/index.js +8 -8
- package/lib/directives/resize/index.js.map +1 -1
- package/lib/directives/scroll/index.js +8 -8
- package/lib/directives/scroll/index.js.map +1 -1
- package/lib/directives/touch/index.js +6 -5
- package/lib/directives/touch/index.js.map +1 -1
- package/lib/framework.js +1 -1
- package/lib/mixins/overlayable/index.js +28 -27
- package/lib/mixins/overlayable/index.js.map +1 -1
- package/lib/services/theme/utils.js.map +1 -1
- package/package.json +1 -1
- package/src/components/VMenu/__tests__/VMenuActivatorTest.spec.ts +25 -0
- package/src/components/VMenu/__tests__/test-with-directives.spec.ts +50 -0
- package/src/directives/click-outside/__tests__/click-outside-shadow-dom.spec.ts +2 -1
- package/src/directives/click-outside/__tests__/click-outside.spec.ts +2 -1
- package/src/directives/click-outside/index.ts +25 -18
- package/src/directives/intersect/__tests__/intersect.spec.ts +31 -13
- package/src/directives/intersect/index.ts +15 -19
- package/src/directives/mutate/__tests__/mutate.spec.ts +35 -27
- package/src/directives/mutate/index.ts +12 -6
- package/src/directives/resize/__tests__/resize.spec.ts +4 -4
- package/src/directives/resize/index.ts +11 -18
- package/src/directives/scroll/__tests__/scroll.spec.ts +5 -29
- package/src/directives/scroll/index.ts +14 -7
- package/src/directives/touch/index.ts +6 -5
- package/src/mixins/overlayable/__tests__/overlayable.spec.ts +24 -0
- package/src/mixins/overlayable/index.ts +25 -23
- package/src/services/theme/utils.ts +1 -1
|
@@ -31,7 +31,7 @@ export default defineComponent({
|
|
|
31
31
|
},
|
|
32
32
|
|
|
33
33
|
beforeUnmount() {
|
|
34
|
-
this.
|
|
34
|
+
this.destroyOverlay();
|
|
35
35
|
},
|
|
36
36
|
|
|
37
37
|
methods: {
|
|
@@ -82,21 +82,13 @@ export default defineComponent({
|
|
|
82
82
|
},
|
|
83
83
|
|
|
84
84
|
genOverlay() {
|
|
85
|
-
var _a, _b
|
|
85
|
+
var _a, _b;
|
|
86
86
|
|
|
87
87
|
this.hideScroll();
|
|
88
88
|
if (this.hideOverlay) return;
|
|
89
89
|
|
|
90
90
|
if (!((_b = (_a = this.overlay) === null || _a === void 0 ? void 0 : _a.$el) === null || _b === void 0 ? void 0 : _b.isConnected)) {
|
|
91
|
-
|
|
92
|
-
cancelAnimationFrame(this.animationFrame);
|
|
93
|
-
const container = (_c = this.overlay.$el) === null || _c === void 0 ? void 0 : _c.parentNode;
|
|
94
|
-
(_d = this.overlayApp) === null || _d === void 0 ? void 0 : _d.unmount();
|
|
95
|
-
this.overlayApp = null;
|
|
96
|
-
if (container === null || container === void 0 ? void 0 : container.parentNode) container.parentNode.removeChild(container);
|
|
97
|
-
this.overlay = null;
|
|
98
|
-
}
|
|
99
|
-
|
|
91
|
+
this.teardownOverlay();
|
|
100
92
|
this.createOverlay();
|
|
101
93
|
}
|
|
102
94
|
|
|
@@ -116,31 +108,18 @@ export default defineComponent({
|
|
|
116
108
|
|
|
117
109
|
/** removeOverlay(false) will not restore the scollbar afterwards */
|
|
118
110
|
removeOverlay(showScroll = true) {
|
|
119
|
-
var _a
|
|
111
|
+
var _a;
|
|
120
112
|
|
|
121
113
|
if (this.overlay) {
|
|
122
114
|
if (!((_a = this.overlay.$el) === null || _a === void 0 ? void 0 : _a.isConnected)) {
|
|
123
|
-
|
|
124
|
-
(_b = this.overlayApp) === null || _b === void 0 ? void 0 : _b.unmount();
|
|
125
|
-
this.overlayApp = null;
|
|
126
|
-
this.overlay = null;
|
|
115
|
+
this.teardownOverlay();
|
|
127
116
|
showScroll && this.showScroll();
|
|
128
117
|
return;
|
|
129
118
|
}
|
|
130
119
|
|
|
131
120
|
addOnceEventListener(this.overlay.$el, 'transitionend', () => {
|
|
132
|
-
var _a;
|
|
133
|
-
|
|
134
121
|
if (!this.overlay || !this.overlay.$el || !this.overlay.$el.parentNode || this.overlay.value || this.isActive) return;
|
|
135
|
-
|
|
136
|
-
(_a = this.overlayApp) === null || _a === void 0 ? void 0 : _a.unmount();
|
|
137
|
-
this.overlayApp = null;
|
|
138
|
-
|
|
139
|
-
if (overlayContainer === null || overlayContainer === void 0 ? void 0 : overlayContainer.parentNode) {
|
|
140
|
-
overlayContainer.parentNode.removeChild(overlayContainer);
|
|
141
|
-
}
|
|
142
|
-
|
|
143
|
-
this.overlay = null;
|
|
122
|
+
this.teardownOverlay();
|
|
144
123
|
}); // Cancel animation frame in case
|
|
145
124
|
// overlay is removed before it
|
|
146
125
|
// has finished its animation
|
|
@@ -152,6 +131,28 @@ export default defineComponent({
|
|
|
152
131
|
showScroll && this.showScroll();
|
|
153
132
|
},
|
|
154
133
|
|
|
134
|
+
teardownOverlay() {
|
|
135
|
+
var _a, _b;
|
|
136
|
+
|
|
137
|
+
cancelAnimationFrame(this.animationFrame);
|
|
138
|
+
if (!this.overlay) return;
|
|
139
|
+
const container = (_a = this.overlay.$el) === null || _a === void 0 ? void 0 : _a.parentNode;
|
|
140
|
+
(_b = this.overlayApp) === null || _b === void 0 ? void 0 : _b.unmount();
|
|
141
|
+
this.overlayApp = null;
|
|
142
|
+
|
|
143
|
+
if (container === null || container === void 0 ? void 0 : container.parentNode) {
|
|
144
|
+
container.parentNode.removeChild(container);
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
this.overlay = null;
|
|
148
|
+
},
|
|
149
|
+
|
|
150
|
+
/** Синхронно уничтожает оверлей независимо от isActive/анимации. Для unmount. */
|
|
151
|
+
destroyOverlay() {
|
|
152
|
+
this.teardownOverlay();
|
|
153
|
+
this.showScroll();
|
|
154
|
+
},
|
|
155
|
+
|
|
155
156
|
scrollListener(e) {
|
|
156
157
|
if ('key' in e) {
|
|
157
158
|
if (['INPUT', 'TEXTAREA', 'SELECT'].includes(e.target.tagName) || // https://github.com/vuetifyjs/vuetify/issues/4715
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/mixins/overlayable/index.ts"],"names":[],"mappings":"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","sourcesContent":["// Components\nimport VOverlay from '../../components/VOverlay'\n\n// Utilities\nimport {\n keyCodes,\n addOnceEventListener,\n addPassiveEventListener,\n getZIndex,\n composedPath\n} from '../../util/helpers'\n\n// Types\nimport { defineComponent, App, createApp, h } from 'vue'\n\ninterface Toggleable extends App {\n isActive?: boolean\n}\n\ninterface Stackable extends App {\n activeZIndex: number\n}\n\ninterface options {\n absolute?: boolean\n $refs: {\n dialog?: HTMLElement\n content?: HTMLElement\n }\n}\n\n/* @vue/component */\nexport default defineComponent({\n name: 'overlayable',\n\n props: {\n hideOverlay: Boolean,\n overlayColor: String,\n overlayOpacity: [Number, String]\n },\n\n data () {\n return {\n animationFrame: 0,\n overlay: null as InstanceType<typeof VOverlay> | null,\n overlayApp: null as App<Element> | null\n }\n },\n\n watch: {\n hideOverlay (value) {\n if (!this.isActive) return\n\n if (value) this.removeOverlay()\n else this.genOverlay()\n }\n },\n\n beforeUnmount () {\n this.removeOverlay()\n },\n\n methods: {\n createOverlay () {\n // Create a container element\n const container = document.createElement('div')\n\n const props = {\n absolute: this.absolute,\n color: this.overlayColor,\n opacity: this.overlayOpacity\n }\n const wrapper = {\n data () {\n return { value: false, zIndex: undefined }\n },\n render () {\n return h(VOverlay, {\n modelValue: this.value,\n zIndex: this.zIndex,\n ...props\n })\n }\n }\n // // Create the overlay app\n // const overlayApp = createApp(VOverlay, {\n // absolute: this.absolute,\n // value: false,\n // color: this.overlayColor,\n // opacity: this.overlayOpacity,\n // });\n\n const overlayApp = createApp(wrapper)\n\n // Mount the app to the container\n const overlayInstance = overlayApp.mount(container)\n\n // Determine the parent element\n const parent = this.absolute\n ? this.$el.parentNode\n : document.querySelector('[data-app]')\n\n if (parent) {\n parent.insertBefore(container, parent.firstChild)\n }\n\n this.overlay = overlayInstance\n this.overlayApp = overlayApp\n },\n genOverlay () {\n this.hideScroll()\n\n if (this.hideOverlay) return\n\n if (!this.overlay?.$el?.isConnected) {\n if (this.overlay) {\n cancelAnimationFrame(this.animationFrame)\n const container = this.overlay.$el?.parentNode as HTMLElement | null\n this.overlayApp?.unmount()\n this.overlayApp = null\n if (container?.parentNode) container.parentNode.removeChild(container)\n this.overlay = null\n }\n this.createOverlay()\n }\n\n this.animationFrame = requestAnimationFrame(() => {\n if (!this.overlay) return\n\n if (this.activeZIndex !== undefined) {\n this.overlay.zIndex = String(this.activeZIndex - 1)\n } else if (this.$el) {\n this.overlay.zIndex = getZIndex(this.$el)\n }\n\n this.overlay.value = true\n })\n\n return true\n },\n /** removeOverlay(false) will not restore the scollbar afterwards */\n removeOverlay (showScroll = true) {\n if (this.overlay) {\n if (!this.overlay.$el?.isConnected) {\n cancelAnimationFrame(this.animationFrame)\n this.overlayApp?.unmount()\n this.overlayApp = null\n this.overlay = null\n showScroll && this.showScroll()\n return\n }\n\n addOnceEventListener(this.overlay.$el, 'transitionend', () => {\n if (\n !this.overlay ||\n !this.overlay.$el ||\n !this.overlay.$el.parentNode ||\n this.overlay.value ||\n this.isActive\n ) return\n\n const overlayContainer = this.overlay.$el.parentNode as HTMLElement | null\n\n this.overlayApp?.unmount()\n this.overlayApp = null\n\n if (overlayContainer?.parentNode) {\n overlayContainer.parentNode.removeChild(overlayContainer)\n }\n\n this.overlay = null\n })\n\n // Cancel animation frame in case\n // overlay is removed before it\n // has finished its animation\n cancelAnimationFrame(this.animationFrame)\n\n this.overlay.value = false\n }\n\n showScroll && this.showScroll()\n },\n scrollListener (e: WheelEvent | KeyboardEvent) {\n if ('key' in e) {\n if (\n ['INPUT', 'TEXTAREA', 'SELECT'].includes((e.target as Element).tagName) ||\n // https://github.com/vuetifyjs/vuetify/issues/4715\n (e.target as HTMLElement).isContentEditable\n ) return\n\n const up = [keyCodes.up, keyCodes.pageup]\n const down = [keyCodes.down, keyCodes.pagedown]\n\n if (up.includes(e.keyCode as typeof keyCodes.up | typeof keyCodes.pageup)) {\n (e as any).deltaY = -1\n } else if (down.includes(e.keyCode as typeof keyCodes.down | typeof keyCodes.pagedown)) {\n (e as any).deltaY = 1\n } else {\n return\n }\n }\n\n if (e.target === this.overlay ||\n (e.type !== 'keydown' && e.target === document.body) ||\n this.checkPath(e as WheelEvent)) e.preventDefault()\n },\n hasScrollbar (el?: Element) {\n if (!el || el.nodeType !== Node.ELEMENT_NODE) return false\n\n const style = window.getComputedStyle(el)\n return ((['auto', 'scroll'].includes(style.overflowY!) || el.tagName === 'SELECT') && el.scrollHeight > el.clientHeight) ||\n ((['auto', 'scroll'].includes(style.overflowX!)) && el.scrollWidth > el.clientWidth)\n },\n shouldScroll (el: Element, e: WheelEvent): boolean {\n if (el.hasAttribute('data-app')) return false\n\n const dir = e.shiftKey || e.deltaX ? 'x' : 'y'\n const delta = dir === 'y' ? e.deltaY : e.deltaX || e.deltaY\n\n let alreadyAtStart: boolean\n let alreadyAtEnd: boolean\n if (dir === 'y') {\n alreadyAtStart = el.scrollTop === 0\n alreadyAtEnd = el.scrollTop + el.clientHeight === el.scrollHeight\n } else {\n alreadyAtStart = el.scrollLeft === 0\n alreadyAtEnd = el.scrollLeft + el.clientWidth === el.scrollWidth\n }\n\n const scrollingUp = delta < 0\n const scrollingDown = delta > 0\n\n if (!alreadyAtStart && scrollingUp) return true\n if (!alreadyAtEnd && scrollingDown) return true\n if ((alreadyAtStart || alreadyAtEnd) && el.parentNode) {\n return this.shouldScroll(el.parentNode as Element, e)\n }\n\n return false\n },\n isInside (el: Element, parent: Element): boolean {\n if (el === parent) {\n return true\n } else if (el === null || el === document.body) {\n return false\n } else {\n return this.isInside(el.parentNode as Element, parent)\n }\n },\n checkPath (e: WheelEvent) {\n const path = composedPath(e)\n\n if (e.type === 'keydown' && path[0] === document.body) {\n const dialog = this.$refs.dialog\n // getSelection returns null in firefox in some edge cases, can be ignored\n const selected = window.getSelection()!.anchorNode as Element\n if (dialog && this.hasScrollbar(dialog) && this.isInside(selected, dialog)) {\n return !this.shouldScroll(dialog, e)\n }\n return true\n }\n\n for (let index = 0; index < path.length; index++) {\n const el = path[index]\n\n if (el === document) return true\n if (el === document.documentElement) return true\n if (el === this.$refs.content) return true\n\n if (this.hasScrollbar(el as Element)) return !this.shouldScroll(el as Element, e)\n }\n\n return true\n },\n hideScroll () {\n if (this.$vuetify.breakpoint.smAndDown) {\n document.documentElement!.classList.add('overflow-y-hidden')\n } else {\n addPassiveEventListener(window, 'wheel', this.scrollListener, { passive: false })\n window.addEventListener('keydown', this.scrollListener)\n }\n },\n showScroll () {\n document.documentElement!.classList.remove('overflow-y-hidden')\n window.removeEventListener('wheel', this.scrollListener)\n window.removeEventListener('keydown', this.scrollListener)\n }\n }\n})\n"],"sourceRoot":"","file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/mixins/overlayable/index.ts"],"names":[],"mappings":"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","sourcesContent":["// Components\nimport VOverlay from '../../components/VOverlay'\n\n// Utilities\nimport {\n keyCodes,\n addOnceEventListener,\n addPassiveEventListener,\n getZIndex,\n composedPath\n} from '../../util/helpers'\n\n// Types\nimport { defineComponent, App, createApp, h } from 'vue'\n\ninterface Toggleable extends App {\n isActive?: boolean\n}\n\ninterface Stackable extends App {\n activeZIndex: number\n}\n\ninterface options {\n absolute?: boolean\n $refs: {\n dialog?: HTMLElement\n content?: HTMLElement\n }\n}\n\n/* @vue/component */\nexport default defineComponent({\n name: 'overlayable',\n\n props: {\n hideOverlay: Boolean,\n overlayColor: String,\n overlayOpacity: [Number, String]\n },\n\n data () {\n return {\n animationFrame: 0,\n overlay: null as InstanceType<typeof VOverlay> | null,\n overlayApp: null as App<Element> | null\n }\n },\n\n watch: {\n hideOverlay (value) {\n if (!this.isActive) return\n\n if (value) this.removeOverlay()\n else this.genOverlay()\n }\n },\n\n beforeUnmount () {\n this.destroyOverlay()\n },\n\n methods: {\n createOverlay () {\n // Create a container element\n const container = document.createElement('div')\n\n const props = {\n absolute: this.absolute,\n color: this.overlayColor,\n opacity: this.overlayOpacity\n }\n const wrapper = {\n data () {\n return { value: false, zIndex: undefined }\n },\n render () {\n return h(VOverlay, {\n modelValue: this.value,\n zIndex: this.zIndex,\n ...props\n })\n }\n }\n // // Create the overlay app\n // const overlayApp = createApp(VOverlay, {\n // absolute: this.absolute,\n // value: false,\n // color: this.overlayColor,\n // opacity: this.overlayOpacity,\n // });\n\n const overlayApp = createApp(wrapper)\n\n // Mount the app to the container\n const overlayInstance = overlayApp.mount(container)\n\n // Determine the parent element\n const parent = this.absolute\n ? this.$el.parentNode\n : document.querySelector('[data-app]')\n\n if (parent) {\n parent.insertBefore(container, parent.firstChild)\n }\n\n this.overlay = overlayInstance\n this.overlayApp = overlayApp\n },\n genOverlay () {\n this.hideScroll()\n\n if (this.hideOverlay) return\n\n if (!this.overlay?.$el?.isConnected) {\n this.teardownOverlay()\n this.createOverlay()\n }\n\n this.animationFrame = requestAnimationFrame(() => {\n if (!this.overlay) return\n\n if (this.activeZIndex !== undefined) {\n this.overlay.zIndex = String(this.activeZIndex - 1)\n } else if (this.$el) {\n this.overlay.zIndex = getZIndex(this.$el)\n }\n\n this.overlay.value = true\n })\n\n return true\n },\n /** removeOverlay(false) will not restore the scollbar afterwards */\n removeOverlay (showScroll = true) {\n if (this.overlay) {\n if (!this.overlay.$el?.isConnected) {\n this.teardownOverlay()\n showScroll && this.showScroll()\n return\n }\n\n addOnceEventListener(this.overlay.$el, 'transitionend', () => {\n if (\n !this.overlay ||\n !this.overlay.$el ||\n !this.overlay.$el.parentNode ||\n this.overlay.value ||\n this.isActive\n ) return\n\n this.teardownOverlay()\n })\n\n // Cancel animation frame in case\n // overlay is removed before it\n // has finished its animation\n cancelAnimationFrame(this.animationFrame)\n\n this.overlay.value = false\n }\n\n showScroll && this.showScroll()\n },\n teardownOverlay () {\n cancelAnimationFrame(this.animationFrame)\n\n if (!this.overlay) return\n\n const container = this.overlay.$el?.parentNode as HTMLElement | null\n\n this.overlayApp?.unmount()\n this.overlayApp = null\n\n if (container?.parentNode) {\n container.parentNode.removeChild(container)\n }\n\n this.overlay = null\n },\n /** Синхронно уничтожает оверлей независимо от isActive/анимации. Для unmount. */\n destroyOverlay () {\n this.teardownOverlay()\n this.showScroll()\n },\n scrollListener (e: WheelEvent | KeyboardEvent) {\n if ('key' in e) {\n if (\n ['INPUT', 'TEXTAREA', 'SELECT'].includes((e.target as Element).tagName) ||\n // https://github.com/vuetifyjs/vuetify/issues/4715\n (e.target as HTMLElement).isContentEditable\n ) return\n\n const up = [keyCodes.up, keyCodes.pageup]\n const down = [keyCodes.down, keyCodes.pagedown]\n\n if (up.includes(e.keyCode as typeof keyCodes.up | typeof keyCodes.pageup)) {\n (e as any).deltaY = -1\n } else if (down.includes(e.keyCode as typeof keyCodes.down | typeof keyCodes.pagedown)) {\n (e as any).deltaY = 1\n } else {\n return\n }\n }\n\n if (e.target === this.overlay ||\n (e.type !== 'keydown' && e.target === document.body) ||\n this.checkPath(e as WheelEvent)) e.preventDefault()\n },\n hasScrollbar (el?: Element) {\n if (!el || el.nodeType !== Node.ELEMENT_NODE) return false\n\n const style = window.getComputedStyle(el)\n return ((['auto', 'scroll'].includes(style.overflowY!) || el.tagName === 'SELECT') && el.scrollHeight > el.clientHeight) ||\n ((['auto', 'scroll'].includes(style.overflowX!)) && el.scrollWidth > el.clientWidth)\n },\n shouldScroll (el: Element, e: WheelEvent): boolean {\n if (el.hasAttribute('data-app')) return false\n\n const dir = e.shiftKey || e.deltaX ? 'x' : 'y'\n const delta = dir === 'y' ? e.deltaY : e.deltaX || e.deltaY\n\n let alreadyAtStart: boolean\n let alreadyAtEnd: boolean\n if (dir === 'y') {\n alreadyAtStart = el.scrollTop === 0\n alreadyAtEnd = el.scrollTop + el.clientHeight === el.scrollHeight\n } else {\n alreadyAtStart = el.scrollLeft === 0\n alreadyAtEnd = el.scrollLeft + el.clientWidth === el.scrollWidth\n }\n\n const scrollingUp = delta < 0\n const scrollingDown = delta > 0\n\n if (!alreadyAtStart && scrollingUp) return true\n if (!alreadyAtEnd && scrollingDown) return true\n if ((alreadyAtStart || alreadyAtEnd) && el.parentNode) {\n return this.shouldScroll(el.parentNode as Element, e)\n }\n\n return false\n },\n isInside (el: Element, parent: Element): boolean {\n if (el === parent) {\n return true\n } else if (el === null || el === document.body) {\n return false\n } else {\n return this.isInside(el.parentNode as Element, parent)\n }\n },\n checkPath (e: WheelEvent) {\n const path = composedPath(e)\n\n if (e.type === 'keydown' && path[0] === document.body) {\n const dialog = this.$refs.dialog\n // getSelection returns null in firefox in some edge cases, can be ignored\n const selected = window.getSelection()!.anchorNode as Element\n if (dialog && this.hasScrollbar(dialog) && this.isInside(selected, dialog)) {\n return !this.shouldScroll(dialog, e)\n }\n return true\n }\n\n for (let index = 0; index < path.length; index++) {\n const el = path[index]\n\n if (el === document) return true\n if (el === document.documentElement) return true\n if (el === this.$refs.content) return true\n\n if (this.hasScrollbar(el as Element)) return !this.shouldScroll(el as Element, e)\n }\n\n return true\n },\n hideScroll () {\n if (this.$vuetify.breakpoint.smAndDown) {\n document.documentElement!.classList.add('overflow-y-hidden')\n } else {\n addPassiveEventListener(window, 'wheel', this.scrollListener, { passive: false })\n window.addEventListener('keydown', this.scrollListener)\n }\n },\n showScroll () {\n document.documentElement!.classList.remove('overflow-y-hidden')\n window.removeEventListener('wheel', this.scrollListener)\n window.removeEventListener('keydown', this.scrollListener)\n }\n }\n})\n"],"sourceRoot":"","file":"index.js"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/services/theme/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { keys } from '../../util/helpers'\nimport { colorToInt, intToHex, colorToHex, ColorInt } from '../../util/colorUtils'\nimport * as sRGB from '../../util/color/transformSRGB'\nimport * as LAB from '../../util/color/transformCIELAB'\nimport {\n VuetifyParsedTheme,\n VuetifyThemeItem\n} from 'vuetify/types/services/theme'\n\nexport function parse (\n theme: Record<string, VuetifyThemeItem>,\n isItem = false,\n variations = true\n): VuetifyParsedTheme {\n const { anchor, ...variant } = theme\n const colors = Object.keys(variant)\n const parsedTheme: any = {}\n\n for (let i = 0; i < colors.length; ++i) {\n const name = colors[i]\n const value = theme[name]\n\n if (value == null) continue\n\n if (!variations) {\n parsedTheme[name] = { base: intToHex(colorToInt(value)) }\n } else if (isItem) {\n /* istanbul ignore else */\n if (name === 'base' || name.startsWith('lighten') || name.startsWith('darken')) {\n parsedTheme[name] = colorToHex(value)\n }\n } else if (typeof value === 'object') {\n parsedTheme[name] = parse(value, true, variations)\n } else {\n parsedTheme[name] = genVariations(name, colorToInt(value))\n }\n }\n\n if (!isItem) {\n parsedTheme.anchor = anchor || parsedTheme.base || parsedTheme.primary.base\n }\n\n return parsedTheme\n}\n\n/**\n * Generate the CSS for a base color (.primary)\n */\nconst genBaseColor = (name: string, value: string): string => {\n return `\n.v-application .${name} {\n background-color: ${value} !important;\n border-color: ${value} !important;\n}\n.v-application .${name}--text {\n color: ${value} !important;\n caret-color: ${value} !important;\n}`\n}\n\n/**\n * Generate the CSS for a variant color (.primary.darken-2)\n */\nconst genVariantColor = (name: string, variant: string, value: string): string => {\n const [type, n] = variant.split(/(\\d)/, 2)\n return `\n.v-application .${name}.${type}-${n} {\n background-color: ${value} !important;\n border-color: ${value} !important;\n}\n.v-application .${name}--text.text--${type}-${n} {\n color: ${value} !important;\n caret-color: ${value} !important;\n}`\n}\n\nconst genColorVariableName = (name: string, variant = 'base'): string => `--v-${name}-${variant}`\n\nconst genColorVariable = (name: string, variant = 'base'): string => `var(${genColorVariableName(name, variant)})`\n\nexport function genStyles (theme: VuetifyParsedTheme, cssVar = false): string {\n const { anchor, ...variant } = theme\n const colors = Object.keys(variant)\n\n if (!colors.length) return ''\n\n let variablesCss = ''\n let css = ''\n\n const aColor = cssVar ? genColorVariable('anchor') : anchor\n css += `.v-application a { color: ${aColor}; }`\n cssVar && (variablesCss += ` ${genColorVariableName('anchor')}: ${anchor};\\n`)\n\n for (let i = 0; i < colors.length; ++i) {\n const name = colors[i]\n const value = theme[name]\n\n css += genBaseColor(name, cssVar ? genColorVariable(name) : value.base)\n cssVar && (variablesCss += ` ${genColorVariableName(name)}: ${value.base};\\n`)\n\n const variants = keys(value)\n for (let i = 0; i < variants.length; ++i) {\n const variant = variants[i]\n const variantValue = value[variant]\n if (variant === 'base') continue\n\n css += genVariantColor(name, variant, cssVar ? genColorVariable(name, variant) : variantValue)\n cssVar && (variablesCss += ` ${genColorVariableName(name, variant)}: ${variantValue};\\n`)\n }\n }\n\n if (cssVar) {\n variablesCss = `:root {\\n${variablesCss}}\\n\\n`\n }\n\n return variablesCss + css\n}\n\nexport function genVariations (name: string, value: ColorInt): Record<string, string> {\n const values: Record<string, string> = {\n base: intToHex(value)\n }\n\n for (let i = 5; i > 0; --i) {\n values[`lighten${i}`] = intToHex(lighten(value, i))\n }\n\n for (let i = 1; i <= 4; ++i) {\n values[`darken${i}`] = intToHex(darken(value, i))\n }\n\n return values\n}\n\nexport function lighten (value: ColorInt, amount: number): ColorInt {\n const lab = LAB.fromXYZ(sRGB.toXYZ(value))\n lab[0] = lab[0] + amount * 10\n return sRGB.fromXYZ(LAB.toXYZ(lab))\n}\n\nexport function darken (value: ColorInt, amount: number): ColorInt {\n const lab = LAB.fromXYZ(sRGB.toXYZ(value))\n lab[0] = lab[0] - amount * 10\n return sRGB.fromXYZ(LAB.toXYZ(lab))\n}\n"],"sourceRoot":"","file":"utils.js"}
|
|
1
|
+
{"version":3,"sources":["../../../src/services/theme/utils.ts"],"names":[],"mappings":"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","sourcesContent":["import { keys } from '../../util/helpers'\nimport { colorToInt, intToHex, colorToHex, ColorInt } from '../../util/colorUtils'\nimport * as sRGB from '../../util/color/transformSRGB'\nimport * as LAB from '../../util/color/transformCIELAB'\nimport {\n VuetifyParsedTheme,\n VuetifyThemeItem\n} from 'vuetify/types/services/theme'\n\nexport function parse (\n theme: Record<string, VuetifyThemeItem>,\n isItem = false,\n variations = true\n): VuetifyParsedTheme {\n const { anchor, ...variant } = theme\n const colors = Object.keys(variant)\n const parsedTheme: any = {}\n\n for (let i = 0; i < colors.length; ++i) {\n const name = colors[i]\n const value = theme[name]\n\n if (value == null) continue\n\n if (!variations) {\n parsedTheme[name] = { base: intToHex(colorToInt(value)) }\n } else if (isItem) {\n /* istanbul ignore else */\n if (name === 'base' || name.startsWith('lighten') || name.startsWith('darken')) {\n parsedTheme[name] = colorToHex(value)\n }\n } else if (typeof value === 'object') {\n parsedTheme[name] = parse(value, true, variations)\n } else {\n parsedTheme[name] = genVariations(name, colorToInt(value))\n }\n }\n\n if (!isItem) {\n parsedTheme.anchor = anchor || parsedTheme.base || parsedTheme.primary.base\n }\n\n return parsedTheme\n}\n\n/**\n * Generate the CSS for a base color (.primary)\n */\nconst genBaseColor = (name: string, value: string): string => {\n return `\n.v-application .${name} {\n background-color: ${value} !important;\n border-color: ${value} !important;\n}\n.v-application .${name}--text {\n color: ${value} !important;\n caret-color: ${value} !important;\n}`\n}\n\n/**\n * Generate the CSS for a variant color (.primary.darken-2)\n */\nconst genVariantColor = (name: string, variant: string, value: string): string => {\n const [type, n] = variant.split(/(\\d)/, 2)\n return `\n.v-application .${name}.${type}-${n} {\n background-color: ${value} !important;\n border-color: ${value} !important;\n}\n.v-application .${name}--text.text--${type}-${n} {\n color: ${value} !important;\n caret-color: ${value} !important;\n}`\n}\n\nconst genColorVariableName = (name: string, variant = 'base'): string => `--v-${name}-${variant}`\n\nconst genColorVariable = (name: string, variant = 'base'): string => `var(${genColorVariableName(name, variant)})`\n\nexport function genStyles (theme: VuetifyParsedTheme, cssVar = false): string {\n const { anchor, ...variant } = theme\n const colors = Object.keys(variant)\n\n if (!colors.length) return ''\n\n let variablesCss = ''\n let css = ''\n\n const aColor = cssVar ? genColorVariable('anchor') : anchor\n css += `.v-application a { color: ${aColor}; }`\n cssVar && (variablesCss += ` ${genColorVariableName('anchor')}: ${anchor};\\n`)\n\n for (let i = 0; i < colors.length; ++i) {\n const name = colors[i]\n const value = theme[name]\n\n css += genBaseColor(name, cssVar ? genColorVariable(name) : value.base)\n cssVar && (variablesCss += ` ${genColorVariableName(name)}: ${value.base};\\n`)\n\n const variants = keys(value)\n for (let i = 0; i < variants.length; ++i) {\n const variant = variants[i] as string\n const variantValue = value[variant]\n if (variant === 'base') continue\n\n css += genVariantColor(name, variant, cssVar ? genColorVariable(name, variant) : variantValue)\n cssVar && (variablesCss += ` ${genColorVariableName(name, variant)}: ${variantValue};\\n`)\n }\n }\n\n if (cssVar) {\n variablesCss = `:root {\\n${variablesCss}}\\n\\n`\n }\n\n return variablesCss + css\n}\n\nexport function genVariations (name: string, value: ColorInt): Record<string, string> {\n const values: Record<string, string> = {\n base: intToHex(value)\n }\n\n for (let i = 5; i > 0; --i) {\n values[`lighten${i}`] = intToHex(lighten(value, i))\n }\n\n for (let i = 1; i <= 4; ++i) {\n values[`darken${i}`] = intToHex(darken(value, i))\n }\n\n return values\n}\n\nexport function lighten (value: ColorInt, amount: number): ColorInt {\n const lab = LAB.fromXYZ(sRGB.toXYZ(value))\n lab[0] = lab[0] + amount * 10\n return sRGB.fromXYZ(LAB.toXYZ(lab))\n}\n\nexport function darken (value: ColorInt, amount: number): ColorInt {\n const lab = LAB.fromXYZ(sRGB.toXYZ(value))\n lab[0] = lab[0] - amount * 10\n return sRGB.fromXYZ(LAB.toXYZ(lab))\n}\n"],"sourceRoot":"","file":"utils.js"}
|
package/package.json
CHANGED
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { mount } from '@vue/test-utils'
|
|
2
|
+
import VMenu from '../VMenu'
|
|
3
|
+
import { h } from 'vue'
|
|
4
|
+
|
|
5
|
+
describe('activator test', () => {
|
|
6
|
+
it('passes onClick to the slot', async () => {
|
|
7
|
+
const el = document.createElement('div')
|
|
8
|
+
el.setAttribute('data-app', 'true')
|
|
9
|
+
document.body.appendChild(el)
|
|
10
|
+
|
|
11
|
+
const wrapper = mount(VMenu, {
|
|
12
|
+
props: {
|
|
13
|
+
attach: true
|
|
14
|
+
},
|
|
15
|
+
slots: {
|
|
16
|
+
activator: (props: any) => h('button', { class: 'activator', ...props.attrs }, 'Activator'),
|
|
17
|
+
default: () => h('div', 'Content')
|
|
18
|
+
}
|
|
19
|
+
})
|
|
20
|
+
|
|
21
|
+
const btn = wrapper.find('.activator')
|
|
22
|
+
await btn.trigger('click')
|
|
23
|
+
console.log('isActive:', (wrapper.vm as any).isActive)
|
|
24
|
+
})
|
|
25
|
+
})
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { mount } from '@vue/test-utils'
|
|
2
|
+
import { h, defineComponent, withDirectives, resolveComponent } from 'vue'
|
|
3
|
+
|
|
4
|
+
const MyDir = { mounted: () => {} }
|
|
5
|
+
|
|
6
|
+
const VBtn = defineComponent({
|
|
7
|
+
name: 'v-btn',
|
|
8
|
+
render () {
|
|
9
|
+
return withDirectives(h('button', { ref: 'btn' }, 'btn'), [[MyDir]])
|
|
10
|
+
}
|
|
11
|
+
})
|
|
12
|
+
|
|
13
|
+
const VMenu = defineComponent({
|
|
14
|
+
name: 'v-menu',
|
|
15
|
+
data: () => ({ activatorNode: [] as any[] }),
|
|
16
|
+
render () {
|
|
17
|
+
const act = this.$slots.activator ? this.$slots.activator({ attrs: { class: 'act' } }) : []
|
|
18
|
+
this.activatorNode = act
|
|
19
|
+
return h('div', [this.activatorNode])
|
|
20
|
+
}
|
|
21
|
+
})
|
|
22
|
+
|
|
23
|
+
describe('test', () => {
|
|
24
|
+
it('works', () => {
|
|
25
|
+
const AppBtn = defineComponent({
|
|
26
|
+
setup (props, { slots, attrs }) {
|
|
27
|
+
return () => h(VBtn, attrs, slots)
|
|
28
|
+
}
|
|
29
|
+
})
|
|
30
|
+
|
|
31
|
+
const AppMenu = defineComponent({
|
|
32
|
+
setup (props, { slots }) {
|
|
33
|
+
return () => h(VMenu, null, {
|
|
34
|
+
activator: (props: any) => slots.activator ? slots.activator(props) : null
|
|
35
|
+
})
|
|
36
|
+
}
|
|
37
|
+
})
|
|
38
|
+
|
|
39
|
+
const App = defineComponent({
|
|
40
|
+
render () {
|
|
41
|
+
return h(AppMenu, null, {
|
|
42
|
+
activator: ({ attrs }: any) => h(AppBtn, attrs)
|
|
43
|
+
})
|
|
44
|
+
}
|
|
45
|
+
})
|
|
46
|
+
|
|
47
|
+
const wrapper = mount(App)
|
|
48
|
+
console.log(wrapper.html())
|
|
49
|
+
})
|
|
50
|
+
})
|
|
@@ -9,12 +9,13 @@ function bootstrap (args?: object) {
|
|
|
9
9
|
const shadowEl = document.createElement('div')
|
|
10
10
|
|
|
11
11
|
const binding = {
|
|
12
|
+
instance: { $: { uid: 1 } },
|
|
12
13
|
value: {
|
|
13
14
|
handler: jest.fn(),
|
|
14
15
|
...args
|
|
15
16
|
}
|
|
16
17
|
} as any
|
|
17
|
-
const vnode = {
|
|
18
|
+
const vnode = {} as any
|
|
18
19
|
|
|
19
20
|
let shadowClickHandler
|
|
20
21
|
let outsideClickHandler
|
|
@@ -6,12 +6,13 @@ function bootstrap (args?: object) {
|
|
|
6
6
|
const el = document.createElement('div')
|
|
7
7
|
|
|
8
8
|
const binding = {
|
|
9
|
+
instance: { $: { uid: 1 } },
|
|
9
10
|
value: {
|
|
10
11
|
handler: jest.fn(),
|
|
11
12
|
...args
|
|
12
13
|
}
|
|
13
14
|
} as any
|
|
14
|
-
const vnode = {
|
|
15
|
+
const vnode = {} as any
|
|
15
16
|
|
|
16
17
|
let clickHandler
|
|
17
18
|
let mousedownHandler
|
|
@@ -12,6 +12,14 @@ type ClickOutsideDirective = VNodeDirective & {
|
|
|
12
12
|
value?: ((e: Event) => void) | ClickOutsideBindingArgs
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
+
interface ClickOutsideState {
|
|
16
|
+
onClick: (e: Event) => void
|
|
17
|
+
onMousedown: (e: Event) => void
|
|
18
|
+
lastMousedownWasOutside: boolean
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
const clickOutsideState = new WeakMap<HTMLElement, ClickOutsideState>()
|
|
22
|
+
|
|
15
23
|
function defaultConditional () {
|
|
16
24
|
return true
|
|
17
25
|
}
|
|
@@ -55,8 +63,10 @@ function checkIsActive (e: PointerEvent, binding: ClickOutsideDirective): boolea
|
|
|
55
63
|
|
|
56
64
|
function directive (e: PointerEvent, el: HTMLElement, binding: ClickOutsideDirective) {
|
|
57
65
|
const handler = typeof binding.value === 'function' ? binding.value : binding.value!.handler
|
|
66
|
+
const state = clickOutsideState.get(el)
|
|
67
|
+
if (!state) return
|
|
58
68
|
|
|
59
|
-
|
|
69
|
+
state.lastMousedownWasOutside && checkEvent(e, el, binding) && setTimeout(() => {
|
|
60
70
|
checkIsActive(e, binding) && handler && handler(e)
|
|
61
71
|
}, 0)
|
|
62
72
|
}
|
|
@@ -80,39 +90,36 @@ export const ClickOutside = {
|
|
|
80
90
|
mounted (el: HTMLElement, binding: ClickOutsideDirective, vnode: VNode) {
|
|
81
91
|
const onClick = (e: Event) => directive(e as PointerEvent, el, binding)
|
|
82
92
|
const onMousedown = (e: Event) => {
|
|
83
|
-
|
|
93
|
+
const state = clickOutsideState.get(el)
|
|
94
|
+
if (!state) return
|
|
95
|
+
state.lastMousedownWasOutside = checkEvent(e as PointerEvent, el, binding)
|
|
84
96
|
}
|
|
85
97
|
|
|
98
|
+
clickOutsideState.set(el, {
|
|
99
|
+
onClick,
|
|
100
|
+
onMousedown,
|
|
101
|
+
lastMousedownWasOutside: true
|
|
102
|
+
})
|
|
103
|
+
|
|
86
104
|
handleShadow(el, (app: HTMLElement) => {
|
|
87
105
|
app.addEventListener('click', onClick, true)
|
|
88
106
|
app.addEventListener('mousedown', onMousedown, true)
|
|
89
107
|
})
|
|
90
|
-
|
|
91
|
-
if (!el._clickOutside) {
|
|
92
|
-
el._clickOutside = {
|
|
93
|
-
lastMousedownWasOutside: true
|
|
94
|
-
}
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
el._clickOutside[vnode.ctx.uid] = {
|
|
98
|
-
onClick,
|
|
99
|
-
onMousedown
|
|
100
|
-
}
|
|
101
108
|
},
|
|
102
109
|
|
|
103
110
|
unmounted (el: HTMLElement, binding: ClickOutsideDirective, vnode: VNode) {
|
|
104
|
-
|
|
111
|
+
const state = clickOutsideState.get(el)
|
|
112
|
+
if (!state) return
|
|
105
113
|
|
|
106
114
|
handleShadow(el, (app: HTMLElement) => {
|
|
107
|
-
if (!app
|
|
108
|
-
|
|
109
|
-
const { onClick, onMousedown } = el._clickOutside[vnode.ctx.uid]!
|
|
115
|
+
if (!app) return
|
|
110
116
|
|
|
117
|
+
const { onClick, onMousedown } = state
|
|
111
118
|
app.removeEventListener('click', onClick, true)
|
|
112
119
|
app.removeEventListener('mousedown', onMousedown, true)
|
|
113
120
|
})
|
|
114
121
|
|
|
115
|
-
delete
|
|
122
|
+
clickOutsideState.delete(el)
|
|
116
123
|
}
|
|
117
124
|
}
|
|
118
125
|
|
|
@@ -2,27 +2,45 @@
|
|
|
2
2
|
import Intersect from '../'
|
|
3
3
|
|
|
4
4
|
describe('intersect', () => {
|
|
5
|
+
let observerInstance: any
|
|
6
|
+
|
|
7
|
+
beforeEach(() => {
|
|
8
|
+
observerInstance = undefined
|
|
9
|
+
;(global as any).IntersectionObserver = class IntersectionObserver {
|
|
10
|
+
callback: (entries: any, observer: any) => void
|
|
11
|
+
observe = jest.fn()
|
|
12
|
+
unobserve = jest.fn()
|
|
13
|
+
|
|
14
|
+
constructor (callback: (entries: any, observer: any) => void) {
|
|
15
|
+
this.callback = callback
|
|
16
|
+
observerInstance = this
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
})
|
|
20
|
+
|
|
5
21
|
it('should bind event on mounted', () => {
|
|
6
22
|
const callback = jest.fn()
|
|
7
23
|
const el = document.createElement('div')
|
|
8
24
|
document.body.appendChild(el)
|
|
9
25
|
|
|
10
26
|
Intersect.mounted(el, {
|
|
27
|
+
instance: { $: { uid: 1 } },
|
|
11
28
|
value: callback,
|
|
12
29
|
modifiers: { quiet: true }
|
|
13
|
-
} as any, {
|
|
30
|
+
} as any, {} as any)
|
|
14
31
|
|
|
15
|
-
expect(
|
|
32
|
+
expect(observerInstance).toBeTruthy()
|
|
33
|
+
expect(observerInstance.observe).toHaveBeenCalledWith(el)
|
|
16
34
|
expect(callback).not.toHaveBeenCalled()
|
|
17
35
|
|
|
18
36
|
document.body.removeChild(el)
|
|
19
37
|
|
|
20
38
|
Intersect.unmounted(el, {
|
|
39
|
+
instance: { $: { uid: 1 } },
|
|
21
40
|
value: callback,
|
|
22
41
|
modifiers: { quiet: true }
|
|
23
|
-
} as any, {
|
|
24
|
-
|
|
25
|
-
expect((el as any)._observe[1]).toBeFalsy()
|
|
42
|
+
} as any, {} as any)
|
|
43
|
+
expect(observerInstance.unobserve).toHaveBeenCalledWith(el)
|
|
26
44
|
})
|
|
27
45
|
|
|
28
46
|
it('should invoke callback once and unbind', () => {
|
|
@@ -33,21 +51,21 @@ describe('intersect', () => {
|
|
|
33
51
|
const callback = jest.fn()
|
|
34
52
|
|
|
35
53
|
Intersect.mounted(el, {
|
|
54
|
+
instance: { $: { uid: 1 } },
|
|
36
55
|
value: callback,
|
|
37
56
|
modifiers: { once: true }
|
|
38
|
-
} as any, {
|
|
57
|
+
} as any, {} as any)
|
|
39
58
|
|
|
40
59
|
expect(callback).toHaveBeenCalledTimes(0)
|
|
41
|
-
expect(
|
|
60
|
+
expect(observerInstance).toBeTruthy()
|
|
42
61
|
|
|
43
|
-
|
|
62
|
+
observerInstance.callback([{ isIntersecting: false }], observerInstance)
|
|
44
63
|
|
|
45
|
-
expect(callback).toHaveBeenCalledTimes(
|
|
46
|
-
expect((el as any)._observe[1]).toBeTruthy()
|
|
64
|
+
expect(callback).toHaveBeenCalledTimes(0)
|
|
47
65
|
|
|
48
|
-
|
|
66
|
+
observerInstance.callback([{ isIntersecting: true }], observerInstance)
|
|
49
67
|
|
|
50
|
-
expect(callback).toHaveBeenCalledTimes(
|
|
51
|
-
expect(
|
|
68
|
+
expect(callback).toHaveBeenCalledTimes(1)
|
|
69
|
+
expect(observerInstance.unobserve).toHaveBeenCalledWith(el)
|
|
52
70
|
})
|
|
53
71
|
})
|
|
@@ -17,16 +17,13 @@ interface ObserveDirectiveBinding
|
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
19
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
_observe?: Record<
|
|
24
|
-
number,
|
|
25
|
-
{ init: boolean, observer: IntersectionObserver }
|
|
26
|
-
>
|
|
27
|
-
}
|
|
20
|
+
interface IntersectState {
|
|
21
|
+
init: boolean
|
|
22
|
+
observer: IntersectionObserver
|
|
28
23
|
}
|
|
29
24
|
|
|
25
|
+
const intersectState = new WeakMap<HTMLElement, IntersectState>()
|
|
26
|
+
|
|
30
27
|
function mounted (
|
|
31
28
|
el: HTMLElement,
|
|
32
29
|
binding: ObserveDirectiveBinding,
|
|
@@ -48,8 +45,8 @@ function mounted (
|
|
|
48
45
|
entries: IntersectionObserverEntry[] = [],
|
|
49
46
|
observer: IntersectionObserver
|
|
50
47
|
) => {
|
|
51
|
-
const
|
|
52
|
-
if (!
|
|
48
|
+
const state = intersectState.get(el)
|
|
49
|
+
if (!state) return // Just in case, should never fire
|
|
53
50
|
|
|
54
51
|
const isIntersecting = entries.some(entry => entry.isIntersecting)
|
|
55
52
|
|
|
@@ -58,20 +55,19 @@ function mounted (
|
|
|
58
55
|
if (
|
|
59
56
|
handler &&
|
|
60
57
|
typeof handler === 'function' &&
|
|
61
|
-
(!modifiers.quiet ||
|
|
62
|
-
(!modifiers.once || isIntersecting ||
|
|
58
|
+
(!modifiers.quiet || state.init) &&
|
|
59
|
+
(!modifiers.once || isIntersecting || state.init)
|
|
63
60
|
) {
|
|
64
61
|
handler(entries, observer, isIntersecting)
|
|
65
62
|
}
|
|
66
63
|
|
|
67
64
|
if (isIntersecting && modifiers.once) unmounted(el, binding, vnode)
|
|
68
|
-
else
|
|
65
|
+
else state.init = true
|
|
69
66
|
},
|
|
70
67
|
options
|
|
71
68
|
)
|
|
72
69
|
|
|
73
|
-
el
|
|
74
|
-
el._observe![vnode.ctx!.uid] = { init: false, observer }
|
|
70
|
+
intersectState.set(el, { init: false, observer })
|
|
75
71
|
|
|
76
72
|
observer.observe(el)
|
|
77
73
|
}
|
|
@@ -93,11 +89,11 @@ function unmounted (
|
|
|
93
89
|
binding: ObserveDirectiveBinding,
|
|
94
90
|
vnode: VNode
|
|
95
91
|
) {
|
|
96
|
-
const
|
|
97
|
-
if (!
|
|
92
|
+
const state = intersectState.get(el)
|
|
93
|
+
if (!state) return
|
|
98
94
|
|
|
99
|
-
|
|
100
|
-
delete
|
|
95
|
+
state.observer.unobserve(el)
|
|
96
|
+
intersectState.delete(el)
|
|
101
97
|
}
|
|
102
98
|
|
|
103
99
|
export const Intersect: ObjectDirective<
|