wdy_custom_hooks/dist/wdy_custom_hooks.umd.js

one custom hooks of vue3

(function(c,d){typeof exports=="object"&&typeof module<"u"?d(exports):typeof define=="function"&&define.amd?define(["exports"],d):(c=typeof globalThis<"u"?globalThis:c||self,d(c.useResize={}))})(this,function(c){"use strict";const d=new WeakMap;function h(t,e,n=200){H(t);let s=null,a=t.offsetWidth,i=t.offsetHeight;const o=new ResizeObserver(u=>{const r=u[0],{width:f,height:l}=r.contentRect;f===a&&l===i||(a=f,i=l,s&&clearTimeout(s),s=window.setTimeout(()=>{e(r.contentRect),s=null},n))});o.observe(t),d.set(t,{observer:o,debounceTimer:s,lastWidth:a,lastHeight:i})}function H(t){const e=d.get(t);e&&(e.debounceTimer&&clearTimeout(e.debounceTimer),e.observer.disconnect(),d.delete(t))}const U=t=>{t.directive("resize",{mounted(e,n){const s=n.arg?parseInt(n.arg):200;h(e,n.value,s)},beforeUnmount(e){H(e)}})};h.install=U;function g(t){if(t.tagName.toLowerCase()==="input")t.focus();else{const e=t.querySelector("input");e&&e.focus()}}const F=t=>{t.directive("focus",{mounted(e){g(e)}})};g.install=F;const y=new WeakMap;async function b(t,e,n){if(!t){n==null||n("The copy content cannot be empty.");return}try{await navigator.clipboard.writeText(t),e&&typeof e=="function"?e==null||e():console.log("复制成功")}catch(s){n&&typeof n=="function"?n==null||n(s):console.error("Failed to copy text: ",s)}}const $=t=>{t.directive("copy",{mounted(e,n){const{text:s,success:a,error:i}=n.value,o=()=>{b(s,a,i)};e.addEventListener("click",o),y.set(e,o)},beforeUnmount(e){const n=y.get(e);n&&(e.removeEventListener("click",n),y.delete(e))}})};b.install=$;const w=new WeakMap;async function M(t,e,n){const s=t.scrollHeight,a=t.offsetHeight,i=t.scrollTop;s-a-i<=n&&await e()}const D=t=>{t.directive("scrollLoad",{mounted(e,n){const{loadMoreFn:s,distance:a=100}=n.value,i=()=>{M(e,s,a)};e.addEventListener("scroll",i),w.set(e,i)},beforeUnmount(e){const n=w.get(e);n&&(e.removeEventListener("scroll",n),w.delete(e))}})};M.install=D;function k(t,e,n,s){const a=t instanceof HTMLImageElement?t:t.querySelector("img");if(!a){console.warn("未找到 img 元素");return}n&&(a.src=n),new IntersectionObserver((o,u)=>{o.forEach(r=>{r.isIntersecting&&(a.src=e,a.onload=()=>{},a.onerror=()=>{s&&(a.src=s),console.error("图片加载失败：",e)},u.unobserve(t))})}).observe(t)}const N=t=>{t.directive("lazyLoad",{mounted(e,n){const{src:s,placeholderSrc:a,errorSrc:i}=n.value;k(e,s,a,i)}})};k.install=N;const E=new WeakMap;function L(t,e,n){if(typeof e!="function")throw new Error("v-longpress 指令的值必须是一个函数");let s=null;const a=n||2e3,i=r=>{s===null&&(s=window.setTimeout(()=>{e(r)},a))},o=()=>{s!==null&&(clearTimeout(s),s=null)};t.addEventListener("mousedown",i),t.addEventListener("touchstart",i),t.addEventListener("mouseup",o),t.addEventListener("mouseleave",o),t.addEventListener("touchend",o),t.addEventListener("touchcancel",o);const u=()=>{t.removeEventListener("mousedown",i),t.removeEventListener("touchstart",i),t.removeEventListener("mouseup",o),t.removeEventListener("mouseleave",o),t.removeEventListener("touchend",o),t.removeEventListener("touchcancel",o)};E.set(t,u)}const A=t=>{t.directive("longPress",{mounted(e,n){const{time:s,callback:a}=n.value;L(e,a,s)},beforeMount(e){const n=E.get(e);n&&(n(),E.delete(e))}})};L.install=A;const p=new WeakMap,T=new WeakMap,W=new WeakMap;function C(t,e,n,s,a,i){if(!e){console.warn("v-watermark 指令需要传入水印文本");return}const o=document.createElement("div");o.style.position="absolute",o.style.top="0",o.style.left="0",o.style.width="100%",o.style.height="100%",o.style.pointerEvents="none",o.style.backgroundImage=`url(${q(e,n,s,a,i)})`,o.style.backgroundRepeat="repeat",o.style.zIndex="9999",t.style.position="relative",t.appendChild(o),p.set(t,o),W.set(o,o.getAttribute("style")||"")}function q(t,e,n,s,a){const i=document.createElement("canvas"),o=i.getContext("2d");if(!o)throw new Error("无法创建 canvas 上下文");o.font=e;const r=o.measureText(t).width,f=parseInt(e,10),l=s*Math.PI/180,Q=Math.abs(r*Math.cos(l))+Math.abs(f*Math.sin(l)),V=Math.abs(r*Math.sin(l))+Math.abs(f*Math.cos(l)),O=a;return i.width=Q+O,i.height=V+O,o.font=e,o.fillStyle=n,o.textAlign="center",o.textBaseline="middle",o.translate(i.width/2,i.height/2),o.rotate(l),o.fillText(t,0,0),i.toDataURL("image/png")}function j(t,e){const n={attributes:!0,attributeFilter:["style"],attributeOldValue:!0},s=function(i){for(const o of i)if(o.type==="attributes"&&o.attributeName==="style"){const u=e.getAttribute("style")||"",r=W.get(e)||"";u!==r&&(a.disconnect(),e.setAttribute("style",r),a.observe(e,n))}},a=new MutationObserver(s);a.observe(e,n),T.set(t,a)}const B=t=>{t.directive("waterMarker",{mounted(e,n){const{text:s,font:a="16px Microsoft Yahei",color:i="rgba(0, 0, 0, 0.1)",rotate:o=-20,labelGap:u=50}=n.value;C(e,s,a,i,o,u);const r=p.get(e);r&&j(e,r)},unmounted(e){const n=p.get(e);n&&(e.removeChild(n),p.delete(e),W.delete(n));const s=T.get(e);s&&(s.disconnect(),T.delete(e))}})};C.install=B;const S=new WeakMap;function x(t,e,n){t===e.target||t.contains(e.target)||n(e)}const G=t=>{t.directive("outsideClick",{mounted(e,n){const s=a=>{x(e,a,n.value)};document.addEventListener("click",s),S.set(e,s)},beforeUnmount(e){const n=S.get(e);n&&(e.removeEventListener("click",n),S.delete(e))}})};x.install=G;const z=new WeakMap;function I(t,e,n="click",s=300){if(typeof e!="function"){console.warn("v-debounce expects a function as the value");return}if(!["click","dblclick","mousedown","mouseup","mousemove","keydown","keyup","keypress","input","change"].includes(n)){console.warn("v-debounce expects a valid event type as the argument");return}let i;const o=()=>{i&&clearTimeout(i),i=setTimeout(()=>{e()},s)};t.addEventListener(n,o),z.set(t,o)}const Y=t=>{t.directive("debounce",{mounted(e,n){const{value:s,arg:a="click"}=n,{callback:i,delay:o=300}=s;I(e,i,a,o)},beforeMount(e){const n=z.get(e);n&&(n(),z.delete(e))}})};I.install=Y;const P=new WeakMap;function R(t,e,n="click",s=300){if(typeof e!="function"){console.warn("v-throttle expects a function as the value");return}if(!["click","dblclick","mousedown","mouseup","mousemove","keydown","keyup","keypress","input","change"].includes(n)){console.warn("v-throttle expects a valid event type as the argument");return}let i=0;const o=()=>{const u=Date.now();u-i>=s&&(e(),i=u)};t.addEventListener(n,o),P.set(t,()=>{t.removeEventListener(n,o)})}const J=t=>{t.directive("throttle",{mounted(e,n){const{value:s,arg:a="click"}=n,{callback:i,delay:o=300}=s;R(e,i,a,o)},beforeUnmount(e){const n=P.get(e);n&&(n(),P.delete(e))}})};R.install=J;const v=new WeakMap;function m(t,e){return t?e?e.includes(t):(console.error("user permission list is required"),!1):(console.error("Must provide a permission value"),!1)}const K=t=>{t.directive("permission",{mounted(e,n){const{value:s,arg:a}=n;if(console.log(a,s),!s)throw new Error("must provide a permission array");v.set(e,{parent:e.parentNode,nextSibling:e.nextSibling}),m(a,s)||e.parentNode&&e.parentNode.removeChild(e)},updated(e,n){const{value:s,arg:a}=n;if(!s)throw new Error("must provide a permission array");const{parent:i,nextSibling:o}=v.get(e);m(a,s)?i.contains(e)||(o?i.insertBefore(e,o):i.appendChild(e)):i.contains(e)&&i.removeChild(e)},beforeUnmount(e){v.get(e)&&v.delete(e)}})};m.install=K,c.useCopy=b,c.useDebounce=I,c.useFocus=g,c.useImgLazy=k,c.useLongPress=L,c.useOutsideClick=x,c.usePermission=m,c.useResize=h,c.useSrcollLoad=M,c.useThrottle=R,c.useWaterMarker=C,Object.defineProperty(c,Symbol.toStringTag,{value:"Module"})});