diff --git a/src/lib/attachments/clickOutside.svelte.js b/src/lib/attachments/clickOutside.svelte.js new file mode 100644 index 0000000..bd38e90 --- /dev/null +++ b/src/lib/attachments/clickOutside.svelte.js @@ -0,0 +1,15 @@ +export default (callback) => { + return (node) => { + const onclick = (event) => { + if (node && !node.contains(event.target) && !event.defaultPrevented && typeof callback === 'function') { + callback() + } + } + + document.addEventListener('click', onclick, true); + + return () => { + document.removeEventListener('click', onclick, true) + } + } +} \ No newline at end of file diff --git a/src/lib/attachments/intersection.svelte.js b/src/lib/attachments/intersection.svelte.js new file mode 100644 index 0000000..da03af8 --- /dev/null +++ b/src/lib/attachments/intersection.svelte.js @@ -0,0 +1,14 @@ +export default (callback) => { + return (node) => { + $effect(() => { + const observer = new IntersectionObserver((entries) => { + if (entries?.[0].isIntersecting) { + callback() + } + }) + + observer.observe(node) + return () => observer.disconnect() + }) + } +} \ No newline at end of file diff --git a/src/lib/index.js b/src/lib/index.js index e525dea..9884458 100644 --- a/src/lib/index.js +++ b/src/lib/index.js @@ -1,3 +1,6 @@ +export { default as clickOutside } from './attachments/clickOutside.svelte' +export { default as intersection } from './attachments/intersection.svelte' + export { default as Image } from './components/Image.svelte' export { default as Picture } from './components/Picture.svelte' export { default as YandexMetrika } from './components/YandexMetrika.svelte' \ No newline at end of file