@petit-kit/scoped 0.0.6 → 0.0.7
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/README.md +26 -11
- package/dist/index.cjs +2 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.ts +656 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +1 -1
- package/dist/plugins/content/index.d.ts +1 -0
- package/dist/plugins/content/index.d.ts.map +1 -0
- package/dist/plugins/device/index.d.ts +8 -0
- package/dist/plugins/device/index.d.ts.map +1 -0
- package/dist/plugins/index.d.ts +12 -0
- package/dist/plugins/index.d.ts.map +1 -0
- package/dist/plugins/inview/index.d.ts +63 -0
- package/dist/plugins/inview/index.d.ts.map +1 -0
- package/dist/plugins/lenis/index.d.ts +37 -0
- package/dist/plugins/lenis/index.d.ts.map +1 -0
- package/dist/plugins/lerp/index.d.ts +42 -0
- package/dist/plugins/lerp/index.d.ts.map +1 -0
- package/dist/plugins/localstorage/index.d.ts +57 -0
- package/dist/plugins/localstorage/index.d.ts.map +1 -0
- package/dist/plugins/morph/index.d.ts +92 -0
- package/dist/plugins/morph/index.d.ts.map +1 -0
- package/dist/plugins/mouse/index.d.ts +91 -0
- package/dist/plugins/mouse/index.d.ts.map +1 -0
- package/dist/plugins/pointer/index.d.ts +59 -0
- package/dist/plugins/pointer/index.d.ts.map +1 -0
- package/dist/plugins/spring/index.d.ts +42 -0
- package/dist/plugins/spring/index.d.ts.map +1 -0
- package/dist/plugins/timer/index.d.ts +82 -0
- package/dist/plugins/timer/index.d.ts.map +1 -0
- package/dist/plugins/window/index.d.ts +14 -0
- package/dist/plugins/window/index.d.ts.map +1 -0
- package/package.json +13 -11
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function t({from:t=0,to:e=1,mass:n=1,stiffness:i=120,damping:s=14,velocity:o=0,tolerance:r=.001,resumeOnTarget:c=!0}={}){function h(){return d(v)}function f(t){if(M)return h();if(u(v)&&u(S)&&u(b)){let e=!0;for(let o=0;o<v.length;o+=1){const c=v[o]-S[o],h=(-i*c-s*b[o])/n;b[o]+=h*t,v[o]+=b[o]*t;const f=v[o]-S[o];(Math.abs(b[o])>=r||Math.abs(f)>=r)&&(e=!1)}if(e){for(let t=0;t<v.length;t+=1)v[t]=S[t],b[t]=0;M=!0}return l.value=v,l.velocity=b,d(v)}if(a(v)&&a(S)&&a(b)){const e=l.objectKeys??Object.keys(v);let o=!0;for(const c of e){const e=v[c]-S[c],h=(-i*e-s*b[c])/n;b[c]+=h*t,v[c]+=b[c]*t;const f=v[c]-S[c];(Math.abs(b[c])>=r||Math.abs(f)>=r)&&(o=!1)}if(o){for(const t of e)v[t]=S[t],b[t]=0;M=!0}return l.value=v,l.velocity=b,d(v)}const e=S;let o=b;o+=(-i*(v-e)-s*o)/n*t,v+=o*t,b=o,l.value=v,l.velocity=b;const c=v-e;return Math.abs(o)<r&&Math.abs(c)<r&&(v=e,b=0,l.value=v,l.velocity=b,M=!0),v}const l=y({from:t,to:e,velocity:o,label:"Spring"}),g=l.normalizeInput;let v=l.value,b=l.velocity??o,S=l.target,j=null,M=!1;const O=new Set;return{setTarget:function(t){const e=g(t),n=!m(e,S);if(S=e,l.target=e,v=l.value,c&&M&&n){M=!1,j=null;for(const t of O)t(S)}},setValue:function(t,e={}){const{resetVelocity:n=!0,resetTime:i=!0,setTarget:s=!1,markDone:o=!1}=e;v=g(t),l.value=v,s&&(S=d(v),l.target=S);const r=M||!m(v,S);if(n&&(b=null!=l.arrayLength?p(0,l.arrayLength):null!=l.objectKeys?w(0,l.objectKeys):0,l.velocity=b),i&&(j=null),o&&(M=!0),r&&!o){M=!1,j=null;for(const t of O)t(S)}},getValue:h,isDone:function(){return M},onResume:function(t){return O.add(t),()=>{O.delete(t)}},step:f,next:function(t=performance.now()){if(null==j)return j=t,h();const e=(t-j)/1e3;j=t;const n=1/30;let i=e,s=h();for(;i>0&&!M;){const t=Math.min(i,n);s=f(t),i-=t}return s}}}function e(t,e){if(!e||"object"!=typeof e||null==e.type)return null!=t?t:e;const{type:n,default:i}=e;if(null==t)return i;try{switch(n){case String:return String(t);case Number:{const e=Number(t);return Number.isNaN(e)?i:e}case Boolean:return""===t||"true"===t||"false"!==t&&"0"!==t&&null!=t;case Object:try{return"string"==typeof t?JSON.parse(t):t}catch{return i}case Array:try{return"string"==typeof t?JSON.parse(t):t}catch{return Array.isArray(i)?i:[]}default:return t}}catch{return i}}function n(t,e,n,i){if(!i||"object"!=typeof i||!i.reflect)return;let s=null;const o=i.type;if(o===Boolean)return n?void t.setAttribute(e,""):void t.removeAttribute(e);if(o===Object||o===Array)try{s=null==n?null:JSON.stringify(n)}catch{s=null}else s=null==n?null:String(n);null==s?t.removeAttribute(e):t.setAttribute(e,s)}function i(t,i={},s){const{props:o={},shadow:r=!1,styles:c,plugins:h}=i,f=h??[],l=()=>{};class u extends HTMLElement{constructor(){super(),this.version=M,this.t={};for(const t of Object.keys(o)){const e=o[t];this.t[t]=e&&"object"==typeof e&&("type"in e||"default"in e)?e:{type:void 0,default:e,reflect:!1}}this.props={},this.state={},this.actions={},this.refs={},this.emit=this.emit.bind(this),this.listen=this.listen.bind(this),this.setState=this.setState.bind(this),this.updateState=this.updateState.bind(this),this.setProps=this.setProps.bind(this),this.scheduleUpdate=this.scheduleUpdate.bind(this),this.update=this.update.bind(this),this.forceRender=this.forceRender.bind(this),this.destroy=this.destroy.bind(this),this.$=this.$.bind(this),this.i=null,this.o=null,this.h=!1,this.l=!1,this.u=r,this.m=r?this.attachShadow({mode:"open"}):this,this.p=null,this.S=[],this.j=[],this.M=[],this.O=[],this._=[],this.A=[],this.T=[],this.k=[],this.L=new Map,this.F=!1,this.I=!1,this.R={},this.V=!1,this.C=t,this.H=!1,this.D=new Set,this.U=!1,this.q=new Map,this.B=0,this.N=!1}W(t){const e=this.u?this.m.host:this;let n=t.parentElement;for(;n;){if(n===e)return!1;if(n.tagName.includes("-"))return!0;n=n.parentElement}return!1}static get observedAttributes(){return Object.keys(o)}attributeChangedCallback(t,n,i){if(n===i)return;const s=this.t[t],o=this.R[t],r=e(i,s);if(this.props[t]=r,this.F&&o!==r)for(const e of this.k)try{e(t,o,r)}catch(t){l(String(t?.message||t))}this.R[t]=r,this.D.has(t)?this.D.delete(t):this.i&&this.isConnected?this.U?this.H=!0:this.update(!0):this.H=!0}connectedCallback(){for(const t in this.t){if(!this.t.hasOwnProperty(t))continue;const n=e(this.getAttribute(t),this.t[t]);this.props[t]=n,this.R[t]=n}r||this.p||(this.p=this.P());let t=null;try{if(s){const e={props:this.props,state:this.state,actions:this.actions,refs:this.refs,emit:this.emit,listen:this.listen,updateState:this.updateState.bind(this),$:this.$,host:this,onMount:t=>this.M.push(t),onDestroy:t=>this.O.push(t),onUpdate:t=>this._.push(t),onBeforeUpdate:t=>this.A.push(t),onFirstUpdate:t=>this.T.push(t),onPropsChanged:t=>this.k.push(t),link:(t,e)=>{const i=e||t;this.state[i]=this.props[t],this.k.push((e,n,s)=>{e===t&&(Object.is(this.state[i],s)||(this.state[i]=s))});const s={fn:()=>{const e=this.state[i];if(Object.is(this.props[t],e))return;this.props[t]=e,this.R[t]=e;const s=this.t[t],o=s?{...s,reflect:!0}:s,r=this.getAttribute(t);this.D.add(t),n(this,t,e,o),r===this.getAttribute(t)&&this.D.delete(t)},deps:()=>[this.state[i]]};this.S.push(s)},computed:(t,e)=>{let n;if(void 0!==e)try{const t="function"==typeof e?e():e;Array.isArray(t)&&(n=t)}catch(t){String(t?.message||t)}const i={getter:t,deps:e,value:void 0!==e?t(n):t()};this.j.push(i);const s=()=>i.value;return s.J=i,this.K(s),s},effect:(t,e)=>{const n={fn:t,deps:e};return this.S.push(n),()=>this.Z(n)},delegate:(t,e,n)=>(this.G(t,e,n),()=>this.X(t,e,n))};for(const t of f)if(t)try{const n=t.extend(e,this);n&&"object"==typeof n&&Object.assign(e,n)}catch(t){l(String(t?.message||t))}t=s(e)}}catch(t){String(t?.message||t)}if(this.i="function"!=typeof t?()=>"":t,this.U=!0,this.update(!0),this.U=!1,this.H&&(this.H=!1,this.update(!0)),!this.F){this.F=!0;for(const t of this.M)try{t()}catch(t){l(String(t?.message||t))}}}disconnectedCallback(){this.destroy()}remove(){super.remove()}$(t){const e=this.m.querySelectorAll(t);return 0===e.length?null:1===e.length?e[0]:Array.from(e)}destroy(){for(const t of this.O)try{t()}catch(t){l(String(t?.message||t))}for(const t of this.S)if(t.cleanup){try{t.cleanup()}catch(t){l(String(t?.message||t))}t.cleanup=void 0}for(const[,t]of this.L)try{this.m.removeEventListener(t.eventType,t.listener)}catch{}this.L.clear(),this.F=!1}emit(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}listen(t,e,n,i){const s=n;t.addEventListener(e,s,i);const o=()=>{try{t.removeEventListener(e,s,i)}catch{}};return this.O.push(o),o}setState(t){let e=!1;const n=t,i=this.state;for(const t in n){if(!Object.prototype.hasOwnProperty.call(n,t))continue;const s=n[t];Object.is(i[t],s)||(i[t]=s,e=!0)}if(e)if(this.U||!this.F)this.update(!0);else{if(!this.i||!this.isConnected)return;if(this.h)return;this.h=!0,requestAnimationFrame(()=>{this.h=!1,this.i&&this.isConnected&&this.update(!0)})}}updateState(t){Object.assign(this.state,t),this.i&&this.isConnected&&this.Y()}setProps(t){const e=Object.keys(t);if(0===e.length)return;const i=[];for(const s of e){const e=t[s],o=this.R[s];this.props[s]=e,this.F&&o!==e&&i.push(s);const r=this.t[s];r&&r.reflect&&n(this,s,e,r),this.F&&o===e||(this.R[s]=e)}if(this.F&&i.length>0)for(const e of i){const n=this.R[e],i=t[e];for(const t of this.k)try{t(e,n,i)}catch(t){l(String(t?.message||t))}}this.i&&this.isConnected?this.update(!0):this.H=!0}scheduleUpdate(){this.i&&this.isConnected&&this.Y()}Y(){this.l||this.h||(this.l=!0,("function"==typeof queueMicrotask?queueMicrotask:t=>Promise.resolve().then(t))(()=>{this.l=!1,this.i&&this.isConnected&&(this.h||this.update(!1))}))}update(t){if(this.i){if(t&&this.F)for(const t of this.A)try{t()}catch(t){l(String(t?.message||t))}if(t){this.tt();let t="";try{t=this.i()}catch(e){String(e?.message||e),t=""}if("string"!=typeof t&&(t=null==t?"":String(t)),t=((t,e)=>{const n={...this.props,...e};return t.replace($,(t,e)=>{const i=n[e];return null==i?"":String(i)})})(t,this.state),!this.u){const e=`data-scope-owner="${this.C}"`;t=t.replace(/<slot(?![^>]*data-scope-owner)(\s|>)/g,`<slot ${e}$1`)}this.N=!1;const e=null!==this.o&&Object.is(this.o,t);let n=!1;e&&this.F||(this.u,this.m.innerHTML=t,this.o=t,n=!0),this.U?(this.et(),("function"==typeof requestAnimationFrame?requestAnimationFrame:t=>setTimeout(t,0))(()=>{this.i&&this.isConnected&&(n&&!r&&this.projectSlots(),n&&this.nt(),this.it(),this.st())})):(n&&!r&&this.projectSlots(),n&&this.ot(),this.it(),this.st())}else this.N&&this.tt(),this.it(),this.F&&this.st()}}forceRender(){this.o=null,this.i&&this.isConnected?this.U?this.H=!0:this.update(!0):this.H=!0}st(){if(!this.I){this.I=!0;for(const t of this.T)try{t()}catch(t){l(String(t?.message||t))}}for(const t of this._)try{t()}catch(t){l(String(t?.message||t))}this.rt()}rt(){const t=(this.u?this.m:this).querySelectorAll("*"),e=Object.prototype.hasOwnProperty,n=this.state,i=this.props;this.actions;for(let s=0;s<t.length;s++){const o=t[s];if(this.W(o))continue;if(0===o.attributes.length)continue;const r=o.attributes;for(let t=r.length-1;t>=0;t--){const s=r[t];if(!s.name.startsWith(_))continue;const c=s.name.slice(5),h=s.value,f=h?h.trim():"";let l,u=!1;if(f){const t=this.q.get(f);if(t){t.J&&(this.N=!0);try{l=t()}catch{}u=!0}}if(!u){const t=f||c,s=e.call(n,t),o=!s&&e.call(i,t);s?l=n[t]:o&&(l=i[t])}if("text"===c){const t=null==l?"":String(l);o.textContent!==t&&(o.textContent=t)}else if("html"===c){const t=null==l?"":String(l);o.innerHTML!==t&&(o.innerHTML=t)}else if(c in o){if(!Object.is(o[c],l))try{o[c]=l}catch{}if("value"===c)try{null==l?o.removeAttribute("value"):o.setAttribute("value",String(l))}catch{}}else if(null!=l)try{o.setAttribute(c,String(l))}catch{}const a=`__scopeBind_${c}`,d=o[a];if(d){const t=d.ct;t&&o.removeEventListener(t,d),delete o[a]}}}}tt(){for(const t of this.j){let e,n=!0;if(void 0!==t.deps)try{const i="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(i)&&(e=i,t.prevDeps&&t.prevDeps.length===e.length)){n=!1;for(let i=0;i<e.length;i++)if(!Object.is(t.prevDeps[i],e[i])){n=!0;break}}}catch(t){l(String(t?.message||t)),n=!0,e=void 0}if(n){try{t.value=void 0!==t.deps?t.getter(e):t.getter()}catch(t){l(String(t?.message||t))}e&&(t.prevDeps=e.slice())}}}it(){for(const t of this.S){let e,n=!0;if(void 0!==t.deps)try{const i="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(i)&&(e=i,t.prevDeps&&t.prevDeps.length===e.length)){n=!1;for(let i=0;i<e.length;i++)if(!Object.is(t.prevDeps[i],e[i])){n=!0;break}}}catch(t){l(String(t?.message||t)),n=!0,e=void 0}if(n){if(t.cleanup){try{t.cleanup()}catch{}t.cleanup=void 0}try{const n=void 0!==t.deps?t.fn(e):t.fn();"function"==typeof n&&(t.cleanup=n)}catch{}e&&(t.prevDeps=e.slice())}}}Z(t){const e=this.S.indexOf(t);if(-1!==e){if(t.cleanup)try{t.cleanup()}catch{}this.S.splice(e,1)}}K(t){const e=t.ht;if(e&&"string"==typeof e)return this.q.set(e,t),e;const n=`__scope_bind_${++this.B}__`;this.q.set(n,t);try{t.ht=n,t.toString=()=>n}catch{}return n}et(){const t=(this.u?this.m:this).querySelectorAll("[ref]"),e=this.refs;for(const t in e)e.hasOwnProperty(t)&&delete e[t];if(0!==t.length)for(let n=0;n<t.length;n++){const i=t[n];if(this.W(i))continue;const s=i.getAttribute("ref");s&&(e[s]?Array.isArray(e[s])?e[s].push(i):e[s]=[e[s],i]:e[s]=i)}}nt(){const t=(this.u?this.m:this).querySelectorAll("*");for(let e=0;e<t.length;e++){const n=t[e];if(this.W(n))continue;if(0===n.attributes.length)continue;const i=n.attributes;for(let t=i.length-1;t>=0;t--){const e=i[t];if(!e.name.startsWith("on:"))continue;const s=e.name.slice(3),o=e.value,r=`__tinyHandler_${s}`,c=n[r];c&&n.removeEventListener(s,c),n.removeAttribute(e.name);const h=this.actions[o];if(h&&"function"==typeof h){const t=t=>{h.call(this.actions,t)};n[r]=t,n.addEventListener(s,t)}}}}ot(){const t=(this.u?this.m:this).querySelectorAll("*"),e=this.refs;for(const t in e)e.hasOwnProperty(t)&&delete e[t];for(let n=0;n<t.length;n++){const i=t[n];if(this.W(i))continue;const s=i.getAttribute("ref");if(s&&(e[s]?Array.isArray(e[s])?e[s].push(i):e[s]=[e[s],i]:e[s]=i),i.attributes.length>0){const t=i.attributes;for(let e=t.length-1;e>=0;e--){const n=t[e];if(!n.name.startsWith("on:"))continue;const s=n.name.slice(3),o=n.value,r=`__tinyHandler_${s}`,c=i[r];c&&i.removeEventListener(s,c),i.removeAttribute(n.name);const h=this.actions[o];if(h&&"function"==typeof h){const t=t=>{h.call(this.actions,t)};i[r]=t,i.addEventListener(s,t)}}}}}P(){const t=new Map,e=this.childNodes,n=[];for(let t=0;t<e.length;t++)n.push(e[t]);for(let e=0;e<n.length;e++){const i=n[e];let s="";1===i.nodeType&&i.getAttribute&&(s=i.getAttribute("slot")||""),t.has(s)||t.set(s,[]),t.get(s).push(i)}for(let t=0;t<n.length;t++){const e=n[t];e.parentNode&&e.parentNode.removeChild(e)}return t}projectSlots(){const t=this.p||new Map,e=(this.u?this.m:this).querySelectorAll(`slot[data-scope-owner="${this.C}"]`);if(0!==e.length)for(let n=0;n<e.length;n++){const i=e[n],s=i.getAttribute("name")||"",o=t.get(s)||[];if(o.length){const t=document.createDocumentFragment();for(let e=0;e<o.length;e++){const n=o[e];let i;if(1===n.nodeType&&n.tagName.includes("-")&&n.p instanceof Map){const t=n,e=document.createElement(t.tagName.toLowerCase());for(let n=0;n<t.attributes.length;n++){const i=t.attributes[n];e.setAttribute(i.name,i.value)}for(const n of t.p.values())for(let t=0;t<n.length;t++)e.appendChild(n[t].cloneNode(!0));i=e}else i=n.cloneNode(!0);t.appendChild(i)}i.replaceWith(t)}else{const t=i.childNodes,e=[];for(let n=0;n<t.length;n++)e.push(t[n]);if(e.length>0){const t=document.createDocumentFragment();for(let n=0;n<e.length;n++)t.appendChild(e[n]);i.replaceWith(t)}}}}G(t,e,n){const i=`${t}::${e}`;let s=this.L.get(i);if(!s){const n=t=>{const n=t.target&&t.target.closest?t.target.closest(e):null;if(n)for(const e of s.handlers)try{e(t,n)}catch{}};s={eventType:t,selector:e,listener:n,handlers:new Set},this.L.set(i,s),this.m.addEventListener(t,n)}s.handlers.add(n)}X(t,e,n){const i=`${t}::${e}`,s=this.L.get(i);if(s&&(s.handlers.delete(n),0===s.handlers.size)){try{this.m.removeEventListener(t,s.listener)}catch{}this.L.delete(i)}}}if(!customElements.get(t)){if(c&&"undefined"!=typeof document){const e=`scope-${t}-styles`;if(!document.getElementById(e)){const t=document.createElement("style");t.id=e,t.textContent=c,document.head.appendChild(t)}}try{customElements.define(t,u)}catch(t){String(t?.message||t)}}return u}const s=()=>({name:"device",extend:t=>{const e=new Map;return t.onDestroy(()=>{for(const[t,n]of e)t.removeEventListener("change",n);e.clear()}),{onMediaQuery:(t,n,i={})=>{if("undefined"==typeof window||"undefined"==typeof matchMedia)return()=>{};const{immediate:s=!0}=i,o=matchMedia(t),r=t=>{n(t.matches,t)};return o.addEventListener("change",r),e.set(o,r),s&&n(o.matches,null),()=>{o.removeEventListener("change",r),e.delete(o)}}}}}),o=(t,e={})=>({name:"morph",extend:(n,i)=>{const{ignoreActiveValue:s=!0,callbacks:o}=e,r=t(),c=i,h=c.m,f=c.u?ShadowRoot.prototype:HTMLElement.prototype,l=Object.getOwnPropertyDescriptor(f,"innerHTML"),u=t=>{r.morph(h,t,{morphStyle:"innerHTML",ignoreActiveValue:s,callbacks:o})};let a=!0;return Object.defineProperty(h,"innerHTML",{set(t){a?(l.set.call(this,t),a=!1):u(t)},get(){return l.get.call(this)},configurable:!0}),n.onDestroy(()=>{delete h.innerHTML}),{morph:u}}}),r=()=>({name:"window",extend:t=>{const e=new Set,n=new Set,i=new Set,s=(t,n={})=>{if("undefined"==typeof window)return()=>{};const{immediate:i=!0}=n,s=e=>{t(window.innerWidth,window.innerHeight,e)};return window.addEventListener("resize",s),e.add(s),i&&s(new UIEvent("resize")),()=>{window.removeEventListener("resize",s),e.delete(s)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const t of e)window.removeEventListener("resize",t);e.clear();for(const t of i)t.disconnect();i.clear();for(const t of n)window.removeEventListener("scroll",t);n.clear()}}),{onViewportResize:s,onWindowResize:(t,e={})=>{if("undefined"==typeof window)return()=>{};if("undefined"==typeof ResizeObserver)return s((e,n,i)=>t(e,n,i),e);const{immediate:n=!0}=e,o=document.documentElement,r=new ResizeObserver(e=>{const n=e[0];if(!n)return;const{width:i,height:s}=n.contentRect;t(i,s,n)});if(r.observe(o),i.add(r),n){const e=o.getBoundingClientRect();t(e.width,e.height,new UIEvent("resize"))}return()=>{r.disconnect(),i.delete(r)}},onWindowScroll:(t,e={})=>{if("undefined"==typeof window)return()=>{};const{immediate:i=!0}=e,s=e=>{t(window.scrollX,window.scrollY,e)};return window.addEventListener("scroll",s,{passive:!0}),n.add(s),i&&s(new Event("scroll")),()=>{window.removeEventListener("scroll",s),n.delete(s)}}}}}),c=()=>({name:"inview",extend:(t,e)=>{const n=new Set,i=(t,e,i={})=>{if("undefined"==typeof window||"undefined"==typeof IntersectionObserver)return()=>{};const{immediate:s=!0,...o}=i;let r=!s;const c=new IntersectionObserver(n=>{for(const i of n)i.target===t&&(r?r=!1:e(i.isIntersecting,i))},o);return c.observe(t),n.add(c),()=>{c.unobserve(t),c.disconnect(),n.delete(c)}};return t.onDestroy(()=>{for(const t of n)t.disconnect();n.clear()}),{onInView:(t,n)=>i(e,t,n),observeInView:(t,e,n)=>i(t,e,n)}}}),h=t=>({name:"lenis",extend:e=>{const n=new Set;return e.onDestroy(()=>{for(const{lenis:t,handler:e}of n)"function"==typeof t.off&&t.off("scroll",e);n.clear()}),{onLenisScroll:e=>{const i=t();if(!i)return()=>{};const s=t=>{e(t)};i.on("scroll",s);const o={lenis:i,handler:s};return n.add(o),()=>{n.has(o)&&(n.delete(o),"function"==typeof i.off&&i.off("scroll",s))}}}}}),f=()=>({name:"timer",extend:t=>{const e=new Set,n=new Set,i=new Set,s={setTimeout:(t,n,...i)=>{let s;return s=setTimeout((...n)=>{e.delete(s),t(...n)},n,...i),e.add(s),s},setInterval:(t,e,...i)=>{const s=setInterval(t,e,...i);return n.add(s),s},raf:(t,e)=>{let n=0,s=!0,o=0;const r="number"==typeof e&&e>0?1e3/e:0,c=e=>{if(i.delete(n),s){if(r){if(e-o>=r){const n=o?e-o:r;o=e,t(e,n)}}else{const n=o?e-o:0;o=e,t(e,n)}n=requestAnimationFrame(c),i.add(n)}};return n=requestAnimationFrame(c),i.add(n),()=>{s&&(s=!1,i.delete(n),cancelAnimationFrame(n))}}};return t.onDestroy(()=>{for(const t of e)clearTimeout(t);e.clear();for(const t of n)clearInterval(t);n.clear();for(const t of i)cancelAnimationFrame(t);i.clear()}),{timer:s}}}),l=()=>({name:"mouse",extend:t=>{const e=new Map,n=(t,n)=>{if("undefined"==typeof window)return()=>{};const i=t=>{const e=t;n(e.clientX,e.clientY,e)};window.addEventListener(t,i);let s=e.get(t);return s||(s=new Set,e.set(t,s)),s.add(i),()=>{window.removeEventListener(t,i),s?.delete(i)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const[t,n]of e){for(const e of n)window.removeEventListener(t,e);n.clear()}e.clear()}}),{onMouseMove:t=>n("mousemove",t),onMouseDown:t=>n("mousedown",t),onMouseUp:t=>n("mouseup",t),onMouseWheel:t=>(t=>{if("undefined"==typeof window)return()=>{};const n=e=>{const n=e;t(n.clientX,n.clientY,n.deltaY,n)};window.addEventListener("wheel",n);let i=e.get("wheel");return i||(i=new Set,e.set("wheel",i)),i.add(n),()=>{window.removeEventListener("wheel",n),i?.delete(n)}})(t)}}}),u=t=>Array.isArray(t),a=t=>null!=t&&"object"==typeof t&&!Array.isArray(t),d=t=>u(t)?t.slice():a(t)?{...t}:t,m=(t,e)=>{if(u(t)&&u(e)){if(t.length!==e.length)return!1;for(let n=0;n<t.length;n+=1)if(!Object.is(t[n],e[n]))return!1;return!0}if(a(t)&&a(e)){const n=Object.keys(t),i=Object.keys(e);if(n.length!==i.length)return!1;for(const i of n){if(!(i in e))return!1;if(!Object.is(t[i],e[i]))return!1}return!0}return!(u(t)||u(e)||a(t)||a(e))&&Object.is(t,e)},p=(t,e)=>Array.from({length:e},()=>t),w=(t,e)=>e.reduce((e,n)=>(e[n]=t,e),{}),y=({from:t,to:e,velocity:n,label:i})=>{const s={value:t,target:e,velocity:n,arrayLength:null,objectKeys:null,normalizeInput:t=>t},o=t=>{if(null==s.arrayLength){if(null!=s.objectKeys)throw new Error(`${i} value shape mismatch (array vs object).`);s.arrayLength=t,u(s.value)||(s.value=p(s.value,t)),u(s.target)||(s.target=p(s.target,t)),void 0===s.velocity||u(s.velocity)||(s.velocity=p(s.velocity,t))}},r=t=>{if(null==s.objectKeys){if(null!=s.arrayLength)throw new Error(`${i} value shape mismatch (object vs array).`);s.objectKeys=t,a(s.value)||(s.value=w(s.value,t)),a(s.target)||(s.target=w(s.target,t)),void 0===s.velocity||a(s.velocity)||(s.velocity=w(s.velocity,t))}},c=t=>{if(u(t)){if(null!=s.objectKeys)throw new Error(`${i} value shape mismatch (array vs object).`);if(null==s.arrayLength&&o(t.length),t.length!==s.arrayLength)throw new Error(`${i} value length mismatch (expected ${s.arrayLength}, got ${t.length}).`);return t.slice()}if(a(t)){if(null!=s.arrayLength)throw new Error(`${i} value shape mismatch (object vs array).`);const e=Object.keys(t);if(null==s.objectKeys&&r(e),s.objectKeys&&e.length!==s.objectKeys.length)throw new Error(`${i} value keys mismatch (expected ${s.objectKeys.length}, got ${e.length}).`);if(s.objectKeys)for(const e of s.objectKeys)if(!(e in t))throw new Error(`${i} value keys mismatch (missing key "${e}").`);return{...t}}return null!=s.arrayLength?p(t,s.arrayLength):null!=s.objectKeys?w(t,s.objectKeys):t};s.normalizeInput=c;const h=u(t)||u(e)||void 0!==n&&u(n),f=a(t)||a(e)||void 0!==n&&a(n);if(h&&f)throw new Error(`${i} value shape mismatch (array vs object).`);if(h){const i=u(t)?t.length:u(e)?e.length:n.length;o(i),s.value=c(t),s.target=c(e),void 0!==s.velocity&&(s.velocity=c(s.velocity))}else if(f){const i=a(t)?Object.keys(t):a(e)?Object.keys(e):Object.keys(n);r(i),s.value=c(t),s.target=c(e),void 0!==s.velocity&&(s.velocity=c(s.velocity))}return s};let g={x:-1,y:-1};const v={stiffness:300,damping:30,mass:1},b=()=>({name:"pointer",extend:e=>{const{onMouseMove:n}=l().extend(e,e.host),{timer:i}=f().extend(e,e.host);g.x=window.innerWidth/2,g.y=window.innerHeight/2;const s={x:t({from:g.x,to:g.x,...v}),y:t({from:g.y,to:g.y,...v})};return n((t,e)=>{s.x.setTarget(t),s.y.setTarget(e)}),{onPointerMove:t=>{let e=g.x,n=g.y;i.raf(i=>{const o=s.x.next(i),r=s.y.next(i);var c,h;e===o&&n===r||(t({x:o,y:r,v:(c={x:o,y:r},h={x:e,y:n},{x:c.x-h.x,y:c.y-h.y,magnitude:Math.sqrt((c.x-h.x)*(c.x-h.x)+(c.y-h.y)*(c.y-h.y))}).magnitude}),e=o,n=r)})},onMouseMove:n}}}),S=()=>({name:"lerp",extend:t=>{const{timer:e}=f().extend(t,t.host),n=new Set;return t.onDestroy(()=>{for(const t of n)t();n.clear()}),{createLerp:t=>function({from:t=0,to:e=1,lerp:n=.1,tolerance:i=.001,resumeOnTarget:s=!0}={}){function o(){return d(f)}function r(t){if(w)return o();const e=(t=>t<0?0:t>1?1:t)(n);if(0===e)return o();if(1===e)return f=d(l),c.value=f,w=!0,o();const s=t>0?1-Math.pow(1-e,60*t):0;if(u(f)&&u(l)){let t=!0;for(let e=0;e<f.length;e+=1)f[e]+=(l[e]-f[e])*s,Math.abs(l[e]-f[e])>=i&&(t=!1);if(t){for(let t=0;t<f.length;t+=1)f[t]=l[t];w=!0}return c.value=f,d(f)}if(a(f)&&a(l)){const t=c.objectKeys??Object.keys(f);let e=!0;for(const n of t)f[n]+=(l[n]-f[n])*s,Math.abs(l[n]-f[n])>=i&&(e=!1);if(e){for(const e of t)f[e]=l[e];w=!0}return c.value=f,d(f)}const r=l;return f+=(r-f)*s,c.value=f,Math.abs(r-f)<i&&(f=r,c.value=f,w=!0),f}const c=y({from:t,to:e,label:"Lerp"}),h=c.normalizeInput;let f=c.value,l=c.target,p=null,w=!1;const g=new Set;return{setTarget:function(t){const e=h(t),n=!m(e,l);if(l=e,c.target=e,f=c.value,s&&w&&n){w=!1,p=null;for(const t of g)t(l)}},setValue:function(t,e={}){const{resetTime:n=!0,setTarget:i=!1,markDone:s=!1}=e;f=h(t),c.value=f,i&&(l=d(f),c.target=l);const o=w||!m(f,l);if(n&&(p=null),s&&(w=!0),o&&!s){w=!1,p=null;for(const t of g)t(l)}},getValue:o,isDone:function(){return w},onResume:function(t){return g.add(t),()=>{g.delete(t)}},step:r,next:function(t=performance.now()){if(null==p)return p=t,o();const e=(t-p)/1e3;p=t;const n=1/30;let i=e,s=o();for(;i>0&&!w;){const t=Math.min(i,n);s=r(t),i-=t}return s}}}(t),runLerp:(t,i,s={})=>{const{fps:o,immediate:r=!0,stopWhenDone:c=!0}=s;let h=!1,f=null;r&&i(t.getValue(),t);const l=()=>{f||(f=e.raf(e=>{if(h)return;const n=t.next(e);i(n,t),c&&t.isDone()&&u()},o))},u=()=>{f&&(f(),f=null)};l();const a=t.onResume(()=>{!h&&c&&(r&&i(t.getValue(),t),l())}),d=()=>{h||(h=!0,a(),u(),n.delete(d))};return n.add(d),d}}}}),j=()=>({name:"spring",extend:e=>{const{timer:n}=f().extend(e,e.host),i=new Set;return e.onDestroy(()=>{for(const t of i)t();i.clear()}),{createSpring:e=>t(e),runSpring:(t,e,s={})=>{const{fps:o,immediate:r=!0,stopWhenDone:c=!0}=s;let h=!1,f=null;r&&e(t.getValue(),t);const l=()=>{f||(f=n.raf(n=>{if(h)return;const i=t.next(n);e(i,t),c&&t.isDone()&&u()},o))},u=()=>{f&&(f(),f=null)};l();const a=t.onResume(()=>{!h&&c&&(r&&e(t.getValue(),t),l())}),d=()=>{h||(h=!0,a(),u(),i.delete(d))};return i.add(d),d}}}}),M="0.0.5",O=()=>{console.info("The website is using @petit-kit/scoped v"+M,"\nhttps://github.com/petit-kit/scoped")},$=/\{([A-Za-z_$][\w$]*)\}/g,_="bind:";export{M as SCOPE_VERSION,i as define,s as devicePlugin,O as happy,c as inViewPlugin,h as lenisPlugin,S as lerpPlugin,o as morphPlugin,l as mousePlugin,b as pointerPlugin,j as springPlugin,f as timerPlugin,r as windowPlugin};
|
|
1
|
+
function t({from:t=0,to:e=1,mass:n=1,stiffness:i=120,damping:s=14,velocity:o=0,tolerance:r=.001,resumeOnTarget:c=!0}={}){function h(){return m(v)}function f(t){if(M)return h();if(a(v)&&a(S)&&a(b)){let e=!0;for(let o=0;o<v.length;o+=1){const c=v[o]-S[o],h=(-i*c-s*b[o])/n;b[o]+=h*t,v[o]+=b[o]*t;const f=v[o]-S[o];(Math.abs(b[o])>=r||Math.abs(f)>=r)&&(e=!1)}if(e){for(let t=0;t<v.length;t+=1)v[t]=S[t],b[t]=0;M=!0}return l.value=v,l.velocity=b,m(v)}if(d(v)&&d(S)&&d(b)){const e=l.objectKeys??Object.keys(v);let o=!0;for(const c of e){const e=v[c]-S[c],h=(-i*e-s*b[c])/n;b[c]+=h*t,v[c]+=b[c]*t;const f=v[c]-S[c];(Math.abs(b[c])>=r||Math.abs(f)>=r)&&(o=!1)}if(o){for(const t of e)v[t]=S[t],b[t]=0;M=!0}return l.value=v,l.velocity=b,m(v)}const e=S;let o=b;o+=(-i*(v-e)-s*o)/n*t,v+=o*t,b=o,l.value=v,l.velocity=b;const c=v-e;return Math.abs(o)<r&&Math.abs(c)<r&&(v=e,b=0,l.value=v,l.velocity=b,M=!0),v}const l=g({from:t,to:e,velocity:o,label:"Spring"}),u=l.normalizeInput;let v=l.value,b=l.velocity??o,S=l.target,j=null,M=!1;const O=new Set;return{setTarget:function(t){const e=u(t),n=!p(e,S);if(S=e,l.target=e,v=l.value,c&&M&&n){M=!1,j=null;for(const t of O)t(S)}},setValue:function(t,e={}){const{resetVelocity:n=!0,resetTime:i=!0,setTarget:s=!1,markDone:o=!1}=e;v=u(t),l.value=v,s&&(S=m(v),l.target=S);const r=M||!p(v,S);if(n&&(b=null!=l.arrayLength?w(0,l.arrayLength):null!=l.objectKeys?y(0,l.objectKeys):0,l.velocity=b),i&&(j=null),o&&(M=!0),r&&!o){M=!1,j=null;for(const t of O)t(S)}},getValue:h,isDone:function(){return M},onResume:function(t){return O.add(t),()=>{O.delete(t)}},step:f,next:function(t=performance.now()){if(null==j)return j=t,h();const e=(t-j)/1e3;j=t;const n=1/30;let i=e,s=h();for(;i>0&&!M;){const t=Math.min(i,n);s=f(t),i-=t}return s}}}function e(t,e){return t?`${t}:${e}`:e}function n(t,e){if(!e||"object"!=typeof e||null==e.type)return null!=t?t:e;const{type:n,default:i}=e;if(null==t)return i;try{switch(n){case String:return String(t);case Number:{const e=Number(t);return Number.isNaN(e)?i:e}case Boolean:return""===t||"true"===t||"false"!==t&&"0"!==t&&null!=t;case Object:try{return"string"==typeof t?JSON.parse(t):t}catch{return i}case Array:try{return"string"==typeof t?JSON.parse(t):t}catch{return Array.isArray(i)?i:[]}default:return t}}catch{return i}}function i(t,e,n,i){if(!i||"object"!=typeof i||!i.reflect)return;let s=null;const o=i.type;if(o===Boolean)return n?void t.setAttribute(e,""):void t.removeAttribute(e);if(o===Object||o===Array)try{s=null==n?null:JSON.stringify(n)}catch{s=null}else s=null==n?null:String(n);null==s?t.removeAttribute(e):t.setAttribute(e,s)}function s(t,e={},s){const{props:o={},shadow:r=!1,styles:c,plugins:h}=e,f=h??[],l=()=>{};class u extends HTMLElement{constructor(){super(),this.version=$,this.t={};for(const t of Object.keys(o)){const e=o[t];this.t[t]=e&&"object"==typeof e&&("type"in e||"default"in e)?e:{type:void 0,default:e,reflect:!1}}this.props={},this.state={},this.actions={},this.refs={},this.emit=this.emit.bind(this),this.listen=this.listen.bind(this),this.setState=this.setState.bind(this),this.updateState=this.updateState.bind(this),this.setProps=this.setProps.bind(this),this.scheduleUpdate=this.scheduleUpdate.bind(this),this.update=this.update.bind(this),this.forceRender=this.forceRender.bind(this),this.destroy=this.destroy.bind(this),this.$=this.$.bind(this),this.i=null,this.o=null,this.h=!1,this.l=!1,this.u=r,this.m=r?this.attachShadow({mode:"open"}):this,this.p=null,this.S=[],this.j=[],this.M=[],this.O=[],this._=[],this.A=[],this.T=[],this.k=[],this.L=new Map,this.F=!1,this.H=!1,this.I={},this.R=!1,this.V=t,this.C=!1,this.N=new Set,this.q=!1,this.D=new Map,this.U=0,this.B=!1}W(t){const e=this.u?this.m.host:this;let n=t.parentElement;for(;n;){if(n===e)return!1;if(n.tagName.includes("-"))return!0;n=n.parentElement}return!1}static get observedAttributes(){return Object.keys(o)}attributeChangedCallback(t,e,i){if(e===i)return;const s=this.t[t],o=this.I[t],r=n(i,s);if(this.props[t]=r,this.F&&o!==r)for(const e of this.k)try{e(t,o,r)}catch(t){l(String(t?.message||t))}this.I[t]=r,this.N.has(t)?this.N.delete(t):this.i&&this.isConnected?this.q?this.C=!0:this.update(!0):this.C=!0}connectedCallback(){for(const t in this.t){if(!this.t.hasOwnProperty(t))continue;const e=n(this.getAttribute(t),this.t[t]);this.props[t]=e,this.I[t]=e}r||this.p||(this.p=this.J());let t=null;try{if(s){const e={props:this.props,state:this.state,actions:this.actions,refs:this.refs,emit:this.emit,listen:this.listen,updateState:this.updateState.bind(this),$:this.$,host:this,onMount:t=>this.M.push(t),onDestroy:t=>this.O.push(t),onUpdate:t=>this._.push(t),onBeforeUpdate:t=>this.A.push(t),onFirstUpdate:t=>this.T.push(t),onPropsChanged:t=>this.k.push(t),link:(t,e)=>{const n=e||t;this.state[n]=this.props[t],this.k.push((e,i,s)=>{e===t&&(Object.is(this.state[n],s)||(this.state[n]=s))});const s={fn:()=>{const e=this.state[n];if(Object.is(this.props[t],e))return;this.props[t]=e,this.I[t]=e;const s=this.t[t],o=s?{...s,reflect:!0}:s,r=this.getAttribute(t);this.N.add(t),i(this,t,e,o),r===this.getAttribute(t)&&this.N.delete(t)},deps:()=>[this.state[n]]};this.S.push(s)},computed:(t,e)=>{let n;if(void 0!==e)try{const t="function"==typeof e?e():e;Array.isArray(t)&&(n=t)}catch(t){String(t?.message||t)}const i={getter:t,deps:e,value:void 0!==e?t(n):t()};this.j.push(i);const s=()=>i.value;return s.P=i,this.K(s),s},effect:(t,e)=>{const n={fn:t,deps:e};return this.S.push(n),()=>this.Z(n)},delegate:(t,e,n)=>(this.G(t,e,n),()=>this.X(t,e,n)),escapeHtml:x};for(const t of f)if(t)try{const n=t.extend(e,this);n&&"object"==typeof n&&Object.assign(e,n)}catch(t){l(String(t?.message||t))}t=s(e)}}catch(t){String(t?.message||t)}if(this.i="function"!=typeof t?()=>"":t,this.q=!0,this.update(!0),this.q=!1,this.C&&(this.C=!1,this.update(!0)),!this.F){this.F=!0;for(const t of this.M)try{t()}catch(t){l(String(t?.message||t))}}}disconnectedCallback(){this.destroy()}remove(){super.remove()}$(t){const e=this.m.querySelectorAll(t);return 0===e.length?null:1===e.length?e[0]:Array.from(e)}destroy(){for(const t of this.O)try{t()}catch(t){l(String(t?.message||t))}for(const t of this.S)if(t.cleanup){try{t.cleanup()}catch(t){l(String(t?.message||t))}t.cleanup=void 0}for(const[,t]of this.L)try{this.m.removeEventListener(t.eventType,t.listener)}catch{}this.L.clear(),this.F=!1}emit(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}listen(t,e,n,i){const s=n;t.addEventListener(e,s,i);const o=()=>{try{t.removeEventListener(e,s,i)}catch{}};return this.O.push(o),o}setState(t){let e=!1;const n=t,i=this.state;for(const t in n){if(!Object.prototype.hasOwnProperty.call(n,t))continue;const s=n[t];Object.is(i[t],s)||(i[t]=s,e=!0)}if(e)if(this.q||!this.F)this.update(!0);else{if(!this.i||!this.isConnected)return;if(this.h)return;this.h=!0,requestAnimationFrame(()=>{this.h=!1,this.i&&this.isConnected&&this.update(!0)})}}updateState(t){Object.assign(this.state,t),this.i&&this.isConnected&&this.Y()}setProps(t){const e=Object.keys(t);if(0===e.length)return;const n=[];for(const s of e){const e=t[s],o=this.I[s];this.props[s]=e,this.F&&o!==e&&n.push(s);const r=this.t[s];r&&r.reflect&&i(this,s,e,r),this.F&&o===e||(this.I[s]=e)}if(this.F&&n.length>0)for(const e of n){const n=this.I[e],i=t[e];for(const t of this.k)try{t(e,n,i)}catch(t){l(String(t?.message||t))}}this.i&&this.isConnected?this.update(!0):this.C=!0}scheduleUpdate(){this.i&&this.isConnected&&this.Y()}Y(){this.l||this.h||(this.l=!0,("function"==typeof queueMicrotask?queueMicrotask:t=>Promise.resolve().then(t))(()=>{this.l=!1,this.i&&this.isConnected&&(this.h||this.update(!1))}))}update(t){if(this.i){if(t&&this.F)for(const t of this.A)try{t()}catch(t){l(String(t?.message||t))}if(t){this.tt();let t="";try{t=this.i()}catch(e){String(e?.message||e),t=""}if("string"!=typeof t&&(t=null==t?"":String(t)),t=((t,e)=>{const n={...this.props,...e};return t.replace(A,(t,e)=>{const i=n[e];return null==i?"":String(i)})})(t,this.state),!this.u){const e=`data-scope-owner="${this.V}"`;t=t.replace(/<slot(?![^>]*data-scope-owner)(\s|>)/g,`<slot ${e}$1`)}this.B=!1;const e=null!==this.o&&Object.is(this.o,t);let n=!1;e&&this.F||(this.u,this.m.innerHTML=t,this.o=t,n=!0),this.q?(this.et(),("function"==typeof requestAnimationFrame?requestAnimationFrame:t=>setTimeout(t,0))(()=>{this.i&&this.isConnected&&(n&&!r&&this.projectSlots(),n&&this.nt(),this.it(),this.st())})):(n&&!r&&this.projectSlots(),n&&this.ot(),this.it(),this.st())}else this.B&&this.tt(),this.it(),this.F&&this.st()}}forceRender(){this.o=null,this.i&&this.isConnected?this.q?this.C=!0:this.update(!0):this.C=!0}st(){if(!this.H){this.H=!0;for(const t of this.T)try{t()}catch(t){l(String(t?.message||t))}}for(const t of this._)try{t()}catch(t){l(String(t?.message||t))}this.rt()}rt(){const t=(this.u?this.m:this).querySelectorAll("*"),e=Object.prototype.hasOwnProperty,n=this.state,i=this.props;this.actions;for(let s=0;s<t.length;s++){const o=t[s];if(this.W(o))continue;if(0===o.attributes.length)continue;const r=o.attributes;for(let t=r.length-1;t>=0;t--){const s=r[t];if(!s.name.startsWith(E))continue;const c=s.name.slice(5),h=s.value,f=h?h.trim():"";let l,u=!1;if(f){const t=this.D.get(f);if(t){t.P&&(this.B=!0);try{l=t()}catch{}u=!0}}if(!u){const t=f||c,s=e.call(n,t),o=!s&&e.call(i,t);s?l=n[t]:o&&(l=i[t])}if("text"===c){const t=null==l?"":String(l);o.textContent!==t&&(o.textContent=t)}else if("html"===c){const t=null==l?"":String(l);o.innerHTML!==t&&(o.innerHTML=t)}else if(c in o){if(!Object.is(o[c],l))try{o[c]=l}catch{}if("value"===c)try{null==l?o.removeAttribute("value"):o.setAttribute("value",String(l))}catch{}}else if(null!=l)try{o.setAttribute(c,String(l))}catch{}const a=`__scopeBind_${c}`,d=o[a];if(d){const t=d.ct;t&&o.removeEventListener(t,d),delete o[a]}}}}tt(){for(const t of this.j){let e,n=!0;if(void 0!==t.deps)try{const i="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(i)&&(e=i,t.prevDeps&&t.prevDeps.length===e.length)){n=!1;for(let i=0;i<e.length;i++)if(!Object.is(t.prevDeps[i],e[i])){n=!0;break}}}catch(t){l(String(t?.message||t)),n=!0,e=void 0}if(n){try{t.value=void 0!==t.deps?t.getter(e):t.getter()}catch(t){l(String(t?.message||t))}e&&(t.prevDeps=e.slice())}}}it(){for(const t of this.S){let e,n=!0;if(void 0!==t.deps)try{const i="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(i)&&(e=i,t.prevDeps&&t.prevDeps.length===e.length)){n=!1;for(let i=0;i<e.length;i++)if(!Object.is(t.prevDeps[i],e[i])){n=!0;break}}}catch(t){l(String(t?.message||t)),n=!0,e=void 0}if(n){if(t.cleanup){try{t.cleanup()}catch{}t.cleanup=void 0}try{const n=void 0!==t.deps?t.fn(e):t.fn();"function"==typeof n&&(t.cleanup=n)}catch{}e&&(t.prevDeps=e.slice())}}}Z(t){const e=this.S.indexOf(t);if(-1!==e){if(t.cleanup)try{t.cleanup()}catch{}this.S.splice(e,1)}}K(t){const e=t.ht;if(e&&"string"==typeof e)return this.D.set(e,t),e;const n=`__scope_bind_${++this.U}__`;this.D.set(n,t);try{t.ht=n,t.toString=()=>n}catch{}return n}et(){const t=(this.u?this.m:this).querySelectorAll("[ref]"),e=this.refs;for(const t in e)e.hasOwnProperty(t)&&delete e[t];if(0!==t.length)for(let n=0;n<t.length;n++){const i=t[n];if(this.W(i))continue;const s=i.getAttribute("ref");s&&(e[s]?Array.isArray(e[s])?e[s].push(i):e[s]=[e[s],i]:e[s]=i)}}nt(){const t=(this.u?this.m:this).querySelectorAll("*");for(let e=0;e<t.length;e++){const n=t[e];if(this.W(n))continue;if(0===n.attributes.length)continue;const i=n.attributes;for(let t=i.length-1;t>=0;t--){const e=i[t];if(!e.name.startsWith("on:"))continue;const s=e.name.slice(3),o=e.value,r=`__tinyHandler_${s}`,c=n[r];c&&n.removeEventListener(s,c),n.removeAttribute(e.name);const h=this.actions[o];if(h&&"function"==typeof h){const t=t=>{h.call(this.actions,t)};n[r]=t,n.addEventListener(s,t)}}}}ot(){const t=(this.u?this.m:this).querySelectorAll("*"),e=this.refs;for(const t in e)e.hasOwnProperty(t)&&delete e[t];for(let n=0;n<t.length;n++){const i=t[n];if(this.W(i))continue;const s=i.getAttribute("ref");if(s&&(e[s]?Array.isArray(e[s])?e[s].push(i):e[s]=[e[s],i]:e[s]=i),i.attributes.length>0){const t=i.attributes;for(let e=t.length-1;e>=0;e--){const n=t[e];if(!n.name.startsWith("on:"))continue;const s=n.name.slice(3),o=n.value,r=`__tinyHandler_${s}`,c=i[r];c&&i.removeEventListener(s,c),i.removeAttribute(n.name);const h=this.actions[o];if(h&&"function"==typeof h){const t=t=>{h.call(this.actions,t)};i[r]=t,i.addEventListener(s,t)}}}}}J(){const t=new Map,e=this.childNodes,n=[];for(let t=0;t<e.length;t++)n.push(e[t]);for(let e=0;e<n.length;e++){const i=n[e];let s="";1===i.nodeType&&i.getAttribute&&(s=i.getAttribute("slot")||""),t.has(s)||t.set(s,[]),t.get(s).push(i)}for(let t=0;t<n.length;t++){const e=n[t];e.parentNode&&e.parentNode.removeChild(e)}return t}projectSlots(){const t=this.p||new Map,e=(this.u?this.m:this).querySelectorAll(`slot[data-scope-owner="${this.V}"]`);if(0!==e.length)for(let n=0;n<e.length;n++){const i=e[n],s=i.getAttribute("name")||"",o=t.get(s)||[];if(o.length){const t=document.createDocumentFragment();for(let e=0;e<o.length;e++){const n=o[e];let i;if(1===n.nodeType&&n.tagName.includes("-")&&n.p instanceof Map){const t=n,e=document.createElement(t.tagName.toLowerCase());for(let n=0;n<t.attributes.length;n++){const i=t.attributes[n];e.setAttribute(i.name,i.value)}for(const n of t.p.values())for(let t=0;t<n.length;t++)e.appendChild(n[t].cloneNode(!0));i=e}else i=n.cloneNode(!0);t.appendChild(i)}i.replaceWith(t)}else{const t=i.childNodes,e=[];for(let n=0;n<t.length;n++)e.push(t[n]);if(e.length>0){const t=document.createDocumentFragment();for(let n=0;n<e.length;n++)t.appendChild(e[n]);i.replaceWith(t)}}}}G(t,e,n){const i=`${t}::${e}`;let s=this.L.get(i);if(!s){const n=t=>{const n=t.target&&t.target.closest?t.target.closest(e):null;if(n)for(const e of s.handlers)try{e(t,n)}catch{}};s={eventType:t,selector:e,listener:n,handlers:new Set},this.L.set(i,s),this.m.addEventListener(t,n)}s.handlers.add(n)}X(t,e,n){const i=`${t}::${e}`,s=this.L.get(i);if(s&&(s.handlers.delete(n),0===s.handlers.size)){try{this.m.removeEventListener(t,s.listener)}catch{}this.L.delete(i)}}}if(!customElements.get(t)){if(c&&"undefined"!=typeof document){const e=`scope-${t}-styles`;if(!document.getElementById(e)){const t=document.createElement("style");t.id=e,t.textContent=c,document.head.appendChild(t)}}try{customElements.define(t,u)}catch(t){String(t?.message||t)}}return u}const o=()=>({name:"device",extend:t=>{const e=new Map;return t.onDestroy(()=>{for(const[t,n]of e)t.removeEventListener("change",n);e.clear()}),{onMediaQuery:(t,n,i={})=>{if("undefined"==typeof window||"undefined"==typeof matchMedia)return()=>{};const{immediate:s=!0}=i,o=matchMedia(t),r=t=>{n(t.matches,t)};return o.addEventListener("change",r),e.set(o,r),s&&n(o.matches,null),()=>{o.removeEventListener("change",r),e.delete(o)}}}}}),r=(t,e={})=>({name:"morph",extend:(n,i)=>{const{ignoreActiveValue:s=!0,callbacks:o}=e,r=t(),c=i,h=c.m,f=c.u?ShadowRoot.prototype:HTMLElement.prototype,l=Object.getOwnPropertyDescriptor(f,"innerHTML"),u=t=>{r.morph(h,t,{morphStyle:"innerHTML",ignoreActiveValue:s,callbacks:o})};let a=!0;return Object.defineProperty(h,"innerHTML",{set(t){a?(l.set.call(this,t),a=!1):u(t)},get(){return l.get.call(this)},configurable:!0}),n.onDestroy(()=>{delete h.innerHTML}),{morph:u}}}),c=()=>({name:"window",extend:t=>{const e=new Set,n=new Set,i=new Set,s=(t,n={})=>{if("undefined"==typeof window)return()=>{};const{immediate:i=!0}=n,s=e=>{t(window.innerWidth,window.innerHeight,e)};return window.addEventListener("resize",s),e.add(s),i&&s(new UIEvent("resize")),()=>{window.removeEventListener("resize",s),e.delete(s)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const t of e)window.removeEventListener("resize",t);e.clear();for(const t of i)t.disconnect();i.clear();for(const t of n)window.removeEventListener("scroll",t);n.clear()}}),{onViewportResize:s,onWindowResize:(t,e={})=>{if("undefined"==typeof window)return()=>{};if("undefined"==typeof ResizeObserver)return s((e,n,i)=>t(e,n,i),e);const{immediate:n=!0}=e,o=document.documentElement,r=new ResizeObserver(e=>{const n=e[0];if(!n)return;const{width:i,height:s}=n.contentRect;t(i,s,n)});if(r.observe(o),i.add(r),n){const e=o.getBoundingClientRect();t(e.width,e.height,new UIEvent("resize"))}return()=>{r.disconnect(),i.delete(r)}},onWindowScroll:(t,e={})=>{if("undefined"==typeof window)return()=>{};const{immediate:i=!0}=e,s=e=>{t(window.scrollX,window.scrollY,e)};return window.addEventListener("scroll",s,{passive:!0}),n.add(s),i&&s(new Event("scroll")),()=>{window.removeEventListener("scroll",s),n.delete(s)}}}}}),h=()=>({name:"inview",extend:(t,e)=>{const n=new Set,i=(t,e,i={})=>{if("undefined"==typeof window||"undefined"==typeof IntersectionObserver)return()=>{};const{immediate:s=!0,...o}=i;let r=!s;const c=new IntersectionObserver(n=>{for(const i of n)i.target===t&&(r?r=!1:e(i.isIntersecting,i))},o);return c.observe(t),n.add(c),()=>{c.unobserve(t),c.disconnect(),n.delete(c)}};return t.onDestroy(()=>{for(const t of n)t.disconnect();n.clear()}),{onInView:(t,n)=>i(e,t,n),observeInView:(t,e,n)=>i(t,e,n)}}}),f=t=>({name:"lenis",extend:e=>{const n=new Set;return e.onDestroy(()=>{for(const{lenis:t,handler:e}of n)"function"==typeof t.off&&t.off("scroll",e);n.clear()}),{onLenisScroll:e=>{const i=t();if(!i)return()=>{};const s=t=>{e(t)};i.on("scroll",s);const o={lenis:i,handler:s};return n.add(o),()=>{n.has(o)&&(n.delete(o),"function"==typeof i.off&&i.off("scroll",s))}}}}}),l=()=>({name:"timer",extend:t=>{const e=new Set,n=new Set,i=new Set,s={setTimeout:(t,n,...i)=>{let s;return s=setTimeout((...n)=>{e.delete(s),t(...n)},n,...i),e.add(s),s},setInterval:(t,e,...i)=>{const s=setInterval(t,e,...i);return n.add(s),s},raf:(t,e)=>{let n=0,s=!0,o=0;const r="number"==typeof e&&e>0?1e3/e:0,c=e=>{if(i.delete(n),s){if(r){if(e-o>=r){const n=o?e-o:r;o=e,t(e,n)}}else{const n=o?e-o:0;o=e,t(e,n)}n=requestAnimationFrame(c),i.add(n)}};return n=requestAnimationFrame(c),i.add(n),()=>{s&&(s=!1,i.delete(n),cancelAnimationFrame(n))}}};return t.onDestroy(()=>{for(const t of e)clearTimeout(t);e.clear();for(const t of n)clearInterval(t);n.clear();for(const t of i)cancelAnimationFrame(t);i.clear()}),{timer:s}}}),u=()=>({name:"mouse",extend:t=>{const e=new Map,n=(t,n)=>{if("undefined"==typeof window)return()=>{};const i=t=>{const e=t;n(e.clientX,e.clientY,e)};window.addEventListener(t,i);let s=e.get(t);return s||(s=new Set,e.set(t,s)),s.add(i),()=>{window.removeEventListener(t,i),s?.delete(i)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const[t,n]of e){for(const e of n)window.removeEventListener(t,e);n.clear()}e.clear()}}),{onMouseMove:t=>n("mousemove",t),onMouseDown:t=>n("mousedown",t),onMouseUp:t=>n("mouseup",t),onMouseWheel:t=>(t=>{if("undefined"==typeof window)return()=>{};const n=e=>{const n=e;t(n.clientX,n.clientY,n.deltaY,n)};window.addEventListener("wheel",n);let i=e.get("wheel");return i||(i=new Set,e.set("wheel",i)),i.add(n),()=>{window.removeEventListener("wheel",n),i?.delete(n)}})(t)}}}),a=t=>Array.isArray(t),d=t=>null!=t&&"object"==typeof t&&!Array.isArray(t),m=t=>a(t)?t.slice():d(t)?{...t}:t,p=(t,e)=>{if(a(t)&&a(e)){if(t.length!==e.length)return!1;for(let n=0;n<t.length;n+=1)if(!Object.is(t[n],e[n]))return!1;return!0}if(d(t)&&d(e)){const n=Object.keys(t),i=Object.keys(e);if(n.length!==i.length)return!1;for(const i of n){if(!(i in e))return!1;if(!Object.is(t[i],e[i]))return!1}return!0}return!(a(t)||a(e)||d(t)||d(e))&&Object.is(t,e)},w=(t,e)=>Array.from({length:e},()=>t),y=(t,e)=>e.reduce((e,n)=>(e[n]=t,e),{}),g=({from:t,to:e,velocity:n,label:i})=>{const s={value:t,target:e,velocity:n,arrayLength:null,objectKeys:null,normalizeInput:t=>t},o=t=>{if(null==s.arrayLength){if(null!=s.objectKeys)throw new Error(`${i} value shape mismatch (array vs object).`);s.arrayLength=t,a(s.value)||(s.value=w(s.value,t)),a(s.target)||(s.target=w(s.target,t)),void 0===s.velocity||a(s.velocity)||(s.velocity=w(s.velocity,t))}},r=t=>{if(null==s.objectKeys){if(null!=s.arrayLength)throw new Error(`${i} value shape mismatch (object vs array).`);s.objectKeys=t,d(s.value)||(s.value=y(s.value,t)),d(s.target)||(s.target=y(s.target,t)),void 0===s.velocity||d(s.velocity)||(s.velocity=y(s.velocity,t))}},c=t=>{if(a(t)){if(null!=s.objectKeys)throw new Error(`${i} value shape mismatch (array vs object).`);if(null==s.arrayLength&&o(t.length),t.length!==s.arrayLength)throw new Error(`${i} value length mismatch (expected ${s.arrayLength}, got ${t.length}).`);return t.slice()}if(d(t)){if(null!=s.arrayLength)throw new Error(`${i} value shape mismatch (object vs array).`);const e=Object.keys(t);if(null==s.objectKeys&&r(e),s.objectKeys&&e.length!==s.objectKeys.length)throw new Error(`${i} value keys mismatch (expected ${s.objectKeys.length}, got ${e.length}).`);if(s.objectKeys)for(const e of s.objectKeys)if(!(e in t))throw new Error(`${i} value keys mismatch (missing key "${e}").`);return{...t}}return null!=s.arrayLength?w(t,s.arrayLength):null!=s.objectKeys?y(t,s.objectKeys):t};s.normalizeInput=c;const h=a(t)||a(e)||void 0!==n&&a(n),f=d(t)||d(e)||void 0!==n&&d(n);if(h&&f)throw new Error(`${i} value shape mismatch (array vs object).`);if(h){const i=a(t)?t.length:a(e)?e.length:n.length;o(i),s.value=c(t),s.target=c(e),void 0!==s.velocity&&(s.velocity=c(s.velocity))}else if(f){const i=d(t)?Object.keys(t):d(e)?Object.keys(e):Object.keys(n);r(i),s.value=c(t),s.target=c(e),void 0!==s.velocity&&(s.velocity=c(s.velocity))}return s};let v={x:-1,y:-1};const b={stiffness:300,damping:30,mass:1},S=()=>({name:"pointer",extend:e=>{const{onMouseMove:n}=u().extend(e,e.host),{timer:i}=l().extend(e,e.host);v.x=window.innerWidth/2,v.y=window.innerHeight/2;const s={x:t({from:v.x,to:v.x,...b}),y:t({from:v.y,to:v.y,...b})};return n((t,e)=>{s.x.setTarget(t),s.y.setTarget(e)}),{onPointerMove:t=>{let e=v.x,n=v.y;i.raf(i=>{const o=s.x.next(i),r=s.y.next(i);var c,h;e===o&&n===r||(t({x:o,y:r,v:(c={x:o,y:r},h={x:e,y:n},{x:c.x-h.x,y:c.y-h.y,magnitude:Math.sqrt((c.x-h.x)*(c.x-h.x)+(c.y-h.y)*(c.y-h.y))}).magnitude}),e=o,n=r)})},onMouseMove:n}}}),j=()=>({name:"lerp",extend:t=>{const{timer:e}=l().extend(t,t.host),n=new Set;return t.onDestroy(()=>{for(const t of n)t();n.clear()}),{createLerp:t=>function({from:t=0,to:e=1,lerp:n=.1,tolerance:i=.001,resumeOnTarget:s=!0}={}){function o(){return m(f)}function r(t){if(w)return o();const e=(t=>t<0?0:t>1?1:t)(n);if(0===e)return o();if(1===e)return f=m(l),c.value=f,w=!0,o();const s=t>0?1-Math.pow(1-e,60*t):0;if(a(f)&&a(l)){let t=!0;for(let e=0;e<f.length;e+=1)f[e]+=(l[e]-f[e])*s,Math.abs(l[e]-f[e])>=i&&(t=!1);if(t){for(let t=0;t<f.length;t+=1)f[t]=l[t];w=!0}return c.value=f,m(f)}if(d(f)&&d(l)){const t=c.objectKeys??Object.keys(f);let e=!0;for(const n of t)f[n]+=(l[n]-f[n])*s,Math.abs(l[n]-f[n])>=i&&(e=!1);if(e){for(const e of t)f[e]=l[e];w=!0}return c.value=f,m(f)}const r=l;return f+=(r-f)*s,c.value=f,Math.abs(r-f)<i&&(f=r,c.value=f,w=!0),f}const c=g({from:t,to:e,label:"Lerp"}),h=c.normalizeInput;let f=c.value,l=c.target,u=null,w=!1;const y=new Set;return{setTarget:function(t){const e=h(t),n=!p(e,l);if(l=e,c.target=e,f=c.value,s&&w&&n){w=!1,u=null;for(const t of y)t(l)}},setValue:function(t,e={}){const{resetTime:n=!0,setTarget:i=!1,markDone:s=!1}=e;f=h(t),c.value=f,i&&(l=m(f),c.target=l);const o=w||!p(f,l);if(n&&(u=null),s&&(w=!0),o&&!s){w=!1,u=null;for(const t of y)t(l)}},getValue:o,isDone:function(){return w},onResume:function(t){return y.add(t),()=>{y.delete(t)}},step:r,next:function(t=performance.now()){if(null==u)return u=t,o();const e=(t-u)/1e3;u=t;const n=1/30;let i=e,s=o();for(;i>0&&!w;){const t=Math.min(i,n);s=r(t),i-=t}return s}}}(t),runLerp:(t,i,s={})=>{const{fps:o,immediate:r=!0,stopWhenDone:c=!0}=s;let h=!1,f=null;r&&i(t.getValue(),t);const l=()=>{f||(f=e.raf(e=>{if(h)return;const n=t.next(e);i(n,t),c&&t.isDone()&&u()},o))},u=()=>{f&&(f(),f=null)};l();const a=t.onResume(()=>{!h&&c&&(r&&i(t.getValue(),t),l())}),d=()=>{h||(h=!0,a(),u(),n.delete(d))};return n.add(d),d}}}}),M=()=>({name:"spring",extend:e=>{const{timer:n}=l().extend(e,e.host),i=new Set;return e.onDestroy(()=>{for(const t of i)t();i.clear()}),{createSpring:e=>t(e),runSpring:(t,e,s={})=>{const{fps:o,immediate:r=!0,stopWhenDone:c=!0}=s;let h=!1,f=null;r&&e(t.getValue(),t);const l=()=>{f||(f=n.raf(n=>{if(h)return;const i=t.next(n);e(i,t),c&&t.isDone()&&u()},o))},u=()=>{f&&(f(),f=null)};l();const a=t.onResume(()=>{!h&&c&&(r&&e(t.getValue(),t),l())}),d=()=>{h||(h=!0,a(),u(),i.delete(d))};return i.add(d),d}}}}),O=(t={})=>({name:"localstorage",extend:n=>{const{prefix:i="",json:s=!0}=t,o="undefined"==typeof window?null:window.localStorage;return{storage:{get:t=>{if(o)try{const n=o.getItem(e(i,t));if(null===n)return;return s?JSON.parse(n):n}catch{return}},set:(t,n)=>{if(o)try{const r=s?JSON.stringify(n):String(n);o.setItem(e(i,t),r)}catch{}},remove:t=>{o&&o.removeItem(e(i,t))},clear:()=>{if(!o)return;if(!i)return;const t=[];for(let e=0;e<o.length;e++){const n=o.key(e);null!=n&&n.startsWith(i+":")&&t.push(n)}for(const e of t)o.removeItem(e)}}}}}),$="0.0.7",_=()=>{console.info("The website is using @petit-kit/scoped v"+$,"\nhttps://github.com/petit-kit/scoped")},x=t=>null==t||""===t?"":String(t).replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/"/g,""").replace(/'/g,"'"),A=/\{([A-Za-z_$][\w$]*)\}/g,E="bind:";export{$ as SCOPE_VERSION,s as define,o as devicePlugin,_ as happy,h as inViewPlugin,f as lenisPlugin,j as lerpPlugin,O as localStoragePlugin,r as morphPlugin,u as mousePlugin,S as pointerPlugin,M as springPlugin,l as timerPlugin,c as windowPlugin};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/content/index.ts"],"names":[],"mappings":""}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import type { ComponentPlugin } from '../../index';
|
|
2
|
+
export type DeviceControls = {
|
|
3
|
+
onMediaQuery: (query: string, handler: (matches: boolean, event: MediaQueryListEvent | null) => void, options?: {
|
|
4
|
+
immediate?: boolean;
|
|
5
|
+
}) => () => void;
|
|
6
|
+
};
|
|
7
|
+
export declare const devicePlugin: () => ComponentPlugin<DeviceControls>;
|
|
8
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/device/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAwB,MAAM,aAAa,CAAC;AAEzE,MAAM,MAAM,cAAc,GAAG;IAS3B,YAAY,EAAE,CACZ,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,mBAAmB,GAAG,IAAI,KAAK,IAAI,EACtE,OAAO,CAAC,EAAE;QAAE,SAAS,CAAC,EAAE,OAAO,CAAA;KAAE,KAC9B,MAAM,IAAI,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,YAAY,QAAO,eAAe,CAAC,cAAc,CA6C5D,CAAC"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export { devicePlugin, type DeviceControls } from './device';
|
|
2
|
+
export { morphPlugin, type IdiomorphAPI, type IdiomorphGetter, type MorphControls, type MorphOptions, } from './morph';
|
|
3
|
+
export { windowPlugin, type WindowControls } from './window';
|
|
4
|
+
export { inViewPlugin, type InViewControls, type InViewHandler, type InViewOptions, } from './inview';
|
|
5
|
+
export { lenisPlugin, type LenisControls, type LenisGetter, type LenisInstance, type LenisScrollEvent, type LenisScrollHandler, } from './lenis';
|
|
6
|
+
export { timerPlugin, type TimerControls, type TimerIntervalHandle, type TimerRafCallback, type TimerRafUnsubscribe, type TimerTimeoutHandle, } from './timer';
|
|
7
|
+
export { mousePlugin, type MouseControls, type MouseEventHandler, type MouseUnsubscribe, type MouseWheelHandler, } from './mouse';
|
|
8
|
+
export { pointerPlugin, type PointerControls } from './pointer';
|
|
9
|
+
export { lerpPlugin, type LerpControls } from './lerp';
|
|
10
|
+
export { springPlugin, type SpringControls } from './spring';
|
|
11
|
+
export { localStoragePlugin, type LocalStorageControls, type LocalStoragePluginOptions, } from './localstorage';
|
|
12
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/plugins/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,KAAK,cAAc,EAAE,MAAM,UAAU,CAAC;AAC7D,OAAO,EACL,WAAW,EACX,KAAK,YAAY,EACjB,KAAK,eAAe,EACpB,KAAK,aAAa,EAClB,KAAK,YAAY,GAClB,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,YAAY,EAAE,KAAK,cAAc,EAAE,MAAM,UAAU,CAAC;AAC7D,OAAO,EACL,YAAY,EACZ,KAAK,cAAc,EACnB,KAAK,aAAa,EAClB,KAAK,aAAa,GACnB,MAAM,UAAU,CAAC;AAClB,OAAO,EACL,WAAW,EACX,KAAK,aAAa,EAClB,KAAK,WAAW,EAChB,KAAK,aAAa,EAClB,KAAK,gBAAgB,EACrB,KAAK,kBAAkB,GACxB,MAAM,SAAS,CAAC;AACjB,OAAO,EACL,WAAW,EACX,KAAK,aAAa,EAClB,KAAK,mBAAmB,EACxB,KAAK,gBAAgB,EACrB,KAAK,mBAAmB,EACxB,KAAK,kBAAkB,GACxB,MAAM,SAAS,CAAC;AACjB,OAAO,EACL,WAAW,EACX,KAAK,aAAa,EAClB,KAAK,iBAAiB,EACtB,KAAK,gBAAgB,EACrB,KAAK,iBAAiB,GACvB,MAAM,SAAS,CAAC;AACjB,OAAO,EAAE,aAAa,EAAE,KAAK,eAAe,EAAE,MAAM,WAAW,CAAC;AAChE,OAAO,EAAE,UAAU,EAAE,KAAK,YAAY,EAAE,MAAM,QAAQ,CAAC;AACvD,OAAO,EAAE,YAAY,EAAE,KAAK,cAAc,EAAE,MAAM,UAAU,CAAC;AAC7D,OAAO,EACL,kBAAkB,EAClB,KAAK,oBAAoB,EACzB,KAAK,yBAAyB,GAC/B,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,63 @@
|
|
|
1
|
+
import type { ComponentPlugin } from '../../index';
|
|
2
|
+
/**
|
|
3
|
+
* In-view handler signature.
|
|
4
|
+
*
|
|
5
|
+
* @example
|
|
6
|
+
* ```ts
|
|
7
|
+
* const handler: InViewHandler = (isInView, entry) => {
|
|
8
|
+
* if (isInView) entry.target.classList.add("is-in");
|
|
9
|
+
* };
|
|
10
|
+
* ```
|
|
11
|
+
*/
|
|
12
|
+
export type InViewHandler = (isInView: boolean, entry: IntersectionObserverEntry) => void;
|
|
13
|
+
/**
|
|
14
|
+
* Options for IntersectionObserver plus an immediate callback toggle.
|
|
15
|
+
*
|
|
16
|
+
* `immediate` controls whether the first observer callback is skipped.
|
|
17
|
+
*/
|
|
18
|
+
export type InViewOptions = IntersectionObserverInit & {
|
|
19
|
+
immediate?: boolean;
|
|
20
|
+
};
|
|
21
|
+
/**
|
|
22
|
+
* In-view plugin controls.
|
|
23
|
+
*
|
|
24
|
+
* @example
|
|
25
|
+
* ```ts
|
|
26
|
+
* import { inViewPlugin } from "@/lib/plugins/inview";
|
|
27
|
+
*
|
|
28
|
+
* define(
|
|
29
|
+
* "c-example",
|
|
30
|
+
* { plugins: [inViewPlugin()] },
|
|
31
|
+
* ({ onInView }) => {
|
|
32
|
+
* onInView((isInView) => {
|
|
33
|
+
* console.log("host in view:", isInView);
|
|
34
|
+
* });
|
|
35
|
+
* return () => "<div>...</div>";
|
|
36
|
+
* }
|
|
37
|
+
* );
|
|
38
|
+
* ```
|
|
39
|
+
*/
|
|
40
|
+
export type InViewControls = {
|
|
41
|
+
/**
|
|
42
|
+
* Observe the component host element.
|
|
43
|
+
*/
|
|
44
|
+
onInView: (handler: InViewHandler, options?: InViewOptions) => () => void;
|
|
45
|
+
/**
|
|
46
|
+
* Observe a specific element (ref or any Element).
|
|
47
|
+
*/
|
|
48
|
+
observeInView: (element: Element, handler: InViewHandler, options?: InViewOptions) => () => void;
|
|
49
|
+
};
|
|
50
|
+
/**
|
|
51
|
+
* In-view plugin based on IntersectionObserver.
|
|
52
|
+
*
|
|
53
|
+
* @example
|
|
54
|
+
* ```ts
|
|
55
|
+
* const { observeInView } = inViewPlugin().extend(ctx, host);
|
|
56
|
+
* observeInView(el, (isInView) => {
|
|
57
|
+
* el.toggleAttribute("data-inview", isInView);
|
|
58
|
+
* }, { rootMargin: "0px 0px -20% 0px" });
|
|
59
|
+
* ```
|
|
60
|
+
*/
|
|
61
|
+
declare const inViewPlugin: () => ComponentPlugin<InViewControls>;
|
|
62
|
+
export { inViewPlugin, type InViewControls as InViewPluginControls, type InViewHandler as InViewPluginHandler, type InViewOptions as InViewPluginOptions, };
|
|
63
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/inview/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAwB,MAAM,aAAa,CAAC;AAEzE;;;;;;;;;GASG;AACH,MAAM,MAAM,aAAa,GAAG,CAC1B,QAAQ,EAAE,OAAO,EACjB,KAAK,EAAE,yBAAyB,KAC7B,IAAI,CAAC;AAEV;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,wBAAwB,GAAG;IACrD,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,MAAM,cAAc,GAAG;IAC3B;;OAEG;IACH,QAAQ,EAAE,CAAC,OAAO,EAAE,aAAa,EAAE,OAAO,CAAC,EAAE,aAAa,KAAK,MAAM,IAAI,CAAC;IAC1E;;OAEG;IACH,aAAa,EAAE,CACb,OAAO,EAAE,OAAO,EAChB,OAAO,EAAE,aAAa,EACtB,OAAO,CAAC,EAAE,aAAa,KACpB,MAAM,IAAI,CAAC;CACjB,CAAC;AAEF;;;;;;;;;;GAUG;AACH,QAAA,MAAM,YAAY,QAAO,eAAe,CAAC,cAAc,CA4DrD,CAAC;AAEH,OAAO,EACL,YAAY,EACZ,KAAK,cAAc,IAAI,oBAAoB,EAC3C,KAAK,aAAa,IAAI,mBAAmB,EACzC,KAAK,aAAa,IAAI,mBAAmB,GAC1C,CAAC"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
import type { ComponentPlugin } from '../../index';
|
|
2
|
+
/**
|
|
3
|
+
* Minimal Lenis instance interface used by this plugin.
|
|
4
|
+
* Compatible with the Lenis smooth scroll library (lenis package).
|
|
5
|
+
*/
|
|
6
|
+
export interface LenisInstance {
|
|
7
|
+
on(event: 'scroll', handler: (event: LenisScrollEvent) => void): void;
|
|
8
|
+
off?(event: 'scroll', handler: (event: LenisScrollEvent) => void): void;
|
|
9
|
+
}
|
|
10
|
+
/**
|
|
11
|
+
* Lenis scroll event payload.
|
|
12
|
+
* Emitted on each scroll update with current scroll state.
|
|
13
|
+
*/
|
|
14
|
+
export interface LenisScrollEvent {
|
|
15
|
+
scroll: number;
|
|
16
|
+
limit: number;
|
|
17
|
+
velocity: number;
|
|
18
|
+
direction: number;
|
|
19
|
+
progress: number;
|
|
20
|
+
}
|
|
21
|
+
/** Handler called on each Lenis scroll event. */
|
|
22
|
+
export type LenisScrollHandler = (event: LenisScrollEvent) => void;
|
|
23
|
+
/** Controls exposed to components when the lenis plugin is used. */
|
|
24
|
+
export type LenisControls = {
|
|
25
|
+
/** Subscribe to Lenis scroll events. Returns an unsubscribe function. */
|
|
26
|
+
onLenisScroll: (handler: LenisScrollHandler) => () => void;
|
|
27
|
+
};
|
|
28
|
+
/** Factory that returns the current Lenis instance (may be null before init). */
|
|
29
|
+
export type LenisGetter = () => LenisInstance | null | undefined;
|
|
30
|
+
/**
|
|
31
|
+
* Plugin that wires components to Lenis smooth scroll events.
|
|
32
|
+
*
|
|
33
|
+
* @param getLenis - Function that returns the current Lenis instance
|
|
34
|
+
* @returns A component plugin providing onLenisScroll
|
|
35
|
+
*/
|
|
36
|
+
export declare const lenisPlugin: (getLenis: LenisGetter) => ComponentPlugin<LenisControls>;
|
|
37
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/lenis/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAwB,MAAM,aAAa,CAAC;AAEzE;;;GAGG;AACH,MAAM,WAAW,aAAa;IAC5B,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,GAAG,IAAI,CAAC;IACtE,GAAG,CAAC,CAAC,KAAK,EAAE,QAAQ,EAAE,OAAO,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,GAAG,IAAI,CAAC;CACzE;AAED;;;GAGG;AACH,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,iDAAiD;AACjD,MAAM,MAAM,kBAAkB,GAAG,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;AAEnE,oEAAoE;AACpE,MAAM,MAAM,aAAa,GAAG;IAC1B,yEAAyE;IACzE,aAAa,EAAE,CAAC,OAAO,EAAE,kBAAkB,KAAK,MAAM,IAAI,CAAC;CAC5D,CAAC;AAEF,iFAAiF;AACjF,MAAM,MAAM,WAAW,GAAG,MAAM,aAAa,GAAG,IAAI,GAAG,SAAS,CAAC;AAEjE;;;;;GAKG;AACH,eAAO,MAAM,WAAW,GACtB,UAAU,WAAW,KACpB,eAAe,CAAC,aAAa,CAyC9B,CAAC"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import type { ComponentPlugin } from '../../index';
|
|
2
|
+
import { lerp } from '@petit-kit/animate';
|
|
3
|
+
type LerpValue = number | number[] | Record<string, number>;
|
|
4
|
+
type LerpOptions<T extends LerpValue = number> = Parameters<typeof lerp<T>>[0];
|
|
5
|
+
type LerpController<T extends LerpValue = number> = ReturnType<typeof lerp<T>>;
|
|
6
|
+
export type LerpControls = {
|
|
7
|
+
/**
|
|
8
|
+
* Create an independent lerp controller.
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* const lerpX = createLerp({ from: 0, to: 1, lerp: 0.2 });
|
|
12
|
+
* lerpX.setTarget(1);
|
|
13
|
+
*/
|
|
14
|
+
createLerp: <T extends LerpValue>(options?: LerpOptions<T>) => LerpController<T>;
|
|
15
|
+
/**
|
|
16
|
+
* Drive a lerp controller on the scoped timer RAF.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* const opacity = createLerp({ from: 0, to: 1 });
|
|
20
|
+
* const stop = runLerp(opacity, (value) => {
|
|
21
|
+
* host.updateState({ opacity: value });
|
|
22
|
+
* });
|
|
23
|
+
*/
|
|
24
|
+
runLerp: <T extends LerpValue>(controller: LerpController<T>, onUpdate: (value: T, controller: LerpController<T>) => void, options?: {
|
|
25
|
+
fps?: number;
|
|
26
|
+
immediate?: boolean;
|
|
27
|
+
stopWhenDone?: boolean;
|
|
28
|
+
}) => () => void;
|
|
29
|
+
};
|
|
30
|
+
/**
|
|
31
|
+
* Scoped lerp plugin built on top of the timer plugin.
|
|
32
|
+
*
|
|
33
|
+
* @example
|
|
34
|
+
* define("my-component", { plugins: [lerpPlugin()] }, ({ createLerp, runLerp, host }) => {
|
|
35
|
+
* const opacity = createLerp({ from: 0, to: 1 });
|
|
36
|
+
* runLerp(opacity, (value) => host.updateState({ opacity: value }));
|
|
37
|
+
* return () => `<div bind:style="opacity: {opacity}"></div>`;
|
|
38
|
+
* });
|
|
39
|
+
*/
|
|
40
|
+
export declare const lerpPlugin: () => ComponentPlugin<LerpControls>;
|
|
41
|
+
export {};
|
|
42
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/lerp/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAwB,MAAM,aAAa,CAAC;AACzE,OAAO,EAAE,IAAI,EAAE,MAAM,oBAAoB,CAAC;AAI1C,KAAK,SAAS,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC5D,KAAK,WAAW,CAAC,CAAC,SAAS,SAAS,GAAG,MAAM,IAAI,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAC/E,KAAK,cAAc,CAAC,CAAC,SAAS,SAAS,GAAG,MAAM,IAAI,UAAU,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC;AAE/E,MAAM,MAAM,YAAY,GAAG;IACzB;;;;;;OAMG;IACH,UAAU,EAAE,CAAC,CAAC,SAAS,SAAS,EAC9B,OAAO,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,KACrB,cAAc,CAAC,CAAC,CAAC,CAAC;IACvB;;;;;;;;OAQG;IACH,OAAO,EAAE,CAAC,CAAC,SAAS,SAAS,EAC3B,UAAU,EAAE,cAAc,CAAC,CAAC,CAAC,EAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,UAAU,EAAE,cAAc,CAAC,CAAC,CAAC,KAAK,IAAI,EAC3D,OAAO,CAAC,EAAE;QAAE,GAAG,CAAC,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,OAAO,CAAC;QAAC,YAAY,CAAC,EAAE,OAAO,CAAA;KAAE,KACpE,MAAM,IAAI,CAAC;CACjB,CAAC;AAEF;;;;;;;;;GASG;AACH,eAAO,MAAM,UAAU,QAAO,eAAe,CAAC,YAAY,CAwExD,CAAC"}
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
import type { ComponentPlugin } from '../../index';
|
|
2
|
+
export type LocalStoragePluginOptions = {
|
|
3
|
+
/** Key prefix for namespacing. Default: empty. */
|
|
4
|
+
prefix?: string;
|
|
5
|
+
/** Use JSON parse/stringify for values. Default: true. */
|
|
6
|
+
json?: boolean;
|
|
7
|
+
};
|
|
8
|
+
/**
|
|
9
|
+
* LocalStorage plugin controls. Provides a scoped localStorage API with optional
|
|
10
|
+
* key prefixing and JSON serialization.
|
|
11
|
+
*
|
|
12
|
+
* @example
|
|
13
|
+
* ```ts
|
|
14
|
+
* define("my-settings", { plugins: [localStoragePlugin()] }, ({ storage }) => {
|
|
15
|
+
* const theme = storage.get("theme") ?? "dark";
|
|
16
|
+
* actions.setTheme = (t) => {
|
|
17
|
+
* storage.set("theme", t);
|
|
18
|
+
* state.theme = t;
|
|
19
|
+
* };
|
|
20
|
+
* return () => `...`;
|
|
21
|
+
* });
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
export type LocalStorageControls = {
|
|
25
|
+
/** Get a value by key. Returns undefined if not found or on parse error. */
|
|
26
|
+
get: <T = unknown>(key: string) => T | undefined;
|
|
27
|
+
/** Set a value. Values are JSON-serialized when json option is true. */
|
|
28
|
+
set: (key: string, value: unknown) => void;
|
|
29
|
+
/** Remove a key. */
|
|
30
|
+
remove: (key: string) => void;
|
|
31
|
+
/** Clear all keys with this plugin's prefix. */
|
|
32
|
+
clear: () => void;
|
|
33
|
+
};
|
|
34
|
+
/**
|
|
35
|
+
* LocalStorage plugin – scoped localStorage with optional prefix and JSON serialization.
|
|
36
|
+
*
|
|
37
|
+
* Use a key prefix to namespace values per component or app. Values are automatically
|
|
38
|
+
* JSON-serialized/parsed when the json option is true (default). Safe when window
|
|
39
|
+
* is undefined (SSR); methods no-op.
|
|
40
|
+
*
|
|
41
|
+
* @example
|
|
42
|
+
* ```ts
|
|
43
|
+
* define("c-settings", { plugins: [localStoragePlugin({ prefix: "app" })] }, ({ storage }) => {
|
|
44
|
+
* state.theme = storage.get("theme") ?? "dark";
|
|
45
|
+
* actions.toggleTheme = () => {
|
|
46
|
+
* const next = state.theme === "dark" ? "light" : "dark";
|
|
47
|
+
* storage.set("theme", next);
|
|
48
|
+
* state.theme = next;
|
|
49
|
+
* };
|
|
50
|
+
* return () => `<div class="{theme}">...</div>`;
|
|
51
|
+
* });
|
|
52
|
+
* ```
|
|
53
|
+
*/
|
|
54
|
+
export declare const localStoragePlugin: (options?: LocalStoragePluginOptions) => ComponentPlugin<{
|
|
55
|
+
storage: LocalStorageControls;
|
|
56
|
+
}>;
|
|
57
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/localstorage/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAwB,MAAM,aAAa,CAAC;AAEzE,MAAM,MAAM,yBAAyB,GAAG;IACtC,kDAAkD;IAClD,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,0DAA0D;IAC1D,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,MAAM,MAAM,oBAAoB,GAAG;IACjC,4EAA4E;IAC5E,GAAG,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC,GAAG,SAAS,CAAC;IACjD,wEAAwE;IACxE,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3C,oBAAoB;IACpB,MAAM,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9B,gDAAgD;IAChD,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC;AAMF;;;;;;;;;;;;;;;;;;;GAmBG;AACH,eAAO,MAAM,kBAAkB,GAC7B,UAAS,yBAA8B,KACtC,eAAe,CAAC;IAAE,OAAO,EAAE,oBAAoB,CAAA;CAAE,CAkDlD,CAAC"}
|
|
@@ -0,0 +1,92 @@
|
|
|
1
|
+
import type { ComponentPlugin } from '../../index';
|
|
2
|
+
/**
|
|
3
|
+
* Minimal Idiomorph API used by this plugin.
|
|
4
|
+
* Compatible with the idiomorph package.
|
|
5
|
+
*/
|
|
6
|
+
export interface IdiomorphAPI {
|
|
7
|
+
morph(target: Element, html: string, options?: Record<string, unknown>): void;
|
|
8
|
+
}
|
|
9
|
+
/** Factory that returns the Idiomorph instance to use for morphing. */
|
|
10
|
+
export type IdiomorphGetter = () => IdiomorphAPI;
|
|
11
|
+
/**
|
|
12
|
+
* Options for the morph plugin.
|
|
13
|
+
*/
|
|
14
|
+
export type MorphOptions = {
|
|
15
|
+
/**
|
|
16
|
+
* Preserve the value of the focused input element during morph.
|
|
17
|
+
* @default true
|
|
18
|
+
*/
|
|
19
|
+
ignoreActiveValue?: boolean;
|
|
20
|
+
/**
|
|
21
|
+
* Additional callbacks forwarded to Idiomorph.
|
|
22
|
+
*
|
|
23
|
+
* @see https://github.com/bigskysoftware/idiomorph#callbacks
|
|
24
|
+
*/
|
|
25
|
+
callbacks?: Record<string, (...args: any[]) => any>;
|
|
26
|
+
};
|
|
27
|
+
/**
|
|
28
|
+
* Morph plugin controls.
|
|
29
|
+
*
|
|
30
|
+
* @example
|
|
31
|
+
* ```ts
|
|
32
|
+
* import { Idiomorph } from 'idiomorph';
|
|
33
|
+
* import { morphPlugin } from "@/lib/plugins/morph";
|
|
34
|
+
*
|
|
35
|
+
* define(
|
|
36
|
+
* "c-search",
|
|
37
|
+
* { plugins: [morphPlugin(() => Idiomorph)] },
|
|
38
|
+
* ({ morph, state, actions, host }) => {
|
|
39
|
+
* state.query = "";
|
|
40
|
+
* actions.onInput = (e: Event) => {
|
|
41
|
+
* host.setState({ query: (e.target as HTMLInputElement).value });
|
|
42
|
+
* };
|
|
43
|
+
* return () => `
|
|
44
|
+
* <input type="text" on:input="onInput" />
|
|
45
|
+
* <p>Results for: {query}</p>
|
|
46
|
+
* `;
|
|
47
|
+
* }
|
|
48
|
+
* );
|
|
49
|
+
* ```
|
|
50
|
+
*/
|
|
51
|
+
export type MorphControls = {
|
|
52
|
+
/**
|
|
53
|
+
* Morph the component root with the given HTML string.
|
|
54
|
+
*
|
|
55
|
+
* @example
|
|
56
|
+
* ```ts
|
|
57
|
+
* morph('<div class="updated">New content</div>');
|
|
58
|
+
* ```
|
|
59
|
+
*/
|
|
60
|
+
morph: (html: string) => void;
|
|
61
|
+
};
|
|
62
|
+
/**
|
|
63
|
+
* DOM morphing plugin powered by Idiomorph.
|
|
64
|
+
*
|
|
65
|
+
* Intercepts `innerHTML` writes on the component root so that every
|
|
66
|
+
* re-render after the initial mount patches the existing DOM in place
|
|
67
|
+
* instead of replacing it. This preserves focus, selection, scroll
|
|
68
|
+
* position and running CSS animations across re-renders.
|
|
69
|
+
*
|
|
70
|
+
* The first render always uses native `innerHTML` for speed since
|
|
71
|
+
* there is no existing DOM state to preserve.
|
|
72
|
+
*
|
|
73
|
+
* @example Basic usage
|
|
74
|
+
* ```ts
|
|
75
|
+
* import { Idiomorph } from 'idiomorph';
|
|
76
|
+
*
|
|
77
|
+
* define("c-counter", { plugins: [morphPlugin(() => Idiomorph)] }, ({ state, actions, host }) => {
|
|
78
|
+
* state.count = 0;
|
|
79
|
+
* actions.increment = () => host.setState({ count: state.count + 1 });
|
|
80
|
+
* return () => `<button on:click="increment">Count: {count}</button>`;
|
|
81
|
+
* });
|
|
82
|
+
* ```
|
|
83
|
+
*
|
|
84
|
+
* @example With options
|
|
85
|
+
* ```ts
|
|
86
|
+
* define("c-editor", { plugins: [morphPlugin(() => Idiomorph, { ignoreActiveValue: false })] }, ({ host }) => {
|
|
87
|
+
* return () => `<textarea></textarea>`;
|
|
88
|
+
* });
|
|
89
|
+
* ```
|
|
90
|
+
*/
|
|
91
|
+
export declare const morphPlugin: (getIdiomorph: IdiomorphGetter, options?: MorphOptions) => ComponentPlugin<MorphControls>;
|
|
92
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/morph/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAwB,MAAM,aAAa,CAAC;AAEzE;;;GAGG;AACH,MAAM,WAAW,YAAY;IAC3B,KAAK,CAAC,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI,CAAC;CAC/E;AAED,uEAAuE;AACvE,MAAM,MAAM,eAAe,GAAG,MAAM,YAAY,CAAC;AAEjD;;GAEG;AACH,MAAM,MAAM,YAAY,GAAG;IACzB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAC;CACrD,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B;;;;;;;OAOG;IACH,KAAK,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CAC/B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,WAAW,GACtB,cAAc,eAAe,EAC7B,UAAS,YAAiB,KACzB,eAAe,CAAC,aAAa,CAkD9B,CAAC"}
|
|
@@ -0,0 +1,91 @@
|
|
|
1
|
+
import type { ComponentPlugin } from '../../index';
|
|
2
|
+
/** Handler for mouse move, down, and up events. Receives client coordinates and the native event. */
|
|
3
|
+
export type MouseEventHandler = (x: number, y: number, event: MouseEvent) => void;
|
|
4
|
+
/** Handler for wheel events. Receives client coordinates, scroll delta, and the native event. */
|
|
5
|
+
export type MouseWheelHandler = (x: number, y: number, deltaY: number, event: WheelEvent) => void;
|
|
6
|
+
/** Unsubscribe function returned by each mouse listener. Call to remove the listener. */
|
|
7
|
+
export type MouseUnsubscribe = () => void;
|
|
8
|
+
/**
|
|
9
|
+
* Mouse plugin controls. All listeners are bound to `window` and cleaned up on component destroy.
|
|
10
|
+
*
|
|
11
|
+
* @example
|
|
12
|
+
* ```ts
|
|
13
|
+
* define("cursor-follower", { plugins: [mousePlugin()] }, ({ onMouseMove, host }) => {
|
|
14
|
+
* const stop = onMouseMove((x, y) => {
|
|
15
|
+
* host.updateState({ cursorX: x, cursorY: y });
|
|
16
|
+
* });
|
|
17
|
+
* return () => `<div style="left: {cursorX}px; top: {cursorY}px">...</div>`;
|
|
18
|
+
* });
|
|
19
|
+
* ```
|
|
20
|
+
*
|
|
21
|
+
* @example
|
|
22
|
+
* ```ts
|
|
23
|
+
* // Parallax on scroll
|
|
24
|
+
* onMouseWheel((x, y, deltaY) => {
|
|
25
|
+
* parallaxOffset += deltaY * 0.1;
|
|
26
|
+
* });
|
|
27
|
+
* ```
|
|
28
|
+
*/
|
|
29
|
+
export type MouseControls = {
|
|
30
|
+
/**
|
|
31
|
+
* Subscribe to global mouse move. Returns an unsubscribe function.
|
|
32
|
+
*
|
|
33
|
+
* @example
|
|
34
|
+
* ```ts
|
|
35
|
+
* const stop = onMouseMove((x, y) => {
|
|
36
|
+
* console.log(`cursor at ${x}, ${y}`);
|
|
37
|
+
* });
|
|
38
|
+
* // later: stop();
|
|
39
|
+
* ```
|
|
40
|
+
*/
|
|
41
|
+
onMouseMove: (handler: MouseEventHandler) => MouseUnsubscribe;
|
|
42
|
+
/**
|
|
43
|
+
* Subscribe to global mouse down. Returns an unsubscribe function.
|
|
44
|
+
*
|
|
45
|
+
* @example
|
|
46
|
+
* ```ts
|
|
47
|
+
* onMouseDown((x, y, e) => {
|
|
48
|
+
* if (e.button === 0) startDrag(x, y);
|
|
49
|
+
* });
|
|
50
|
+
* ```
|
|
51
|
+
*/
|
|
52
|
+
onMouseDown: (handler: MouseEventHandler) => MouseUnsubscribe;
|
|
53
|
+
/**
|
|
54
|
+
* Subscribe to global mouse up. Returns an unsubscribe function.
|
|
55
|
+
*
|
|
56
|
+
* @example
|
|
57
|
+
* ```ts
|
|
58
|
+
* onMouseUp(() => endDrag());
|
|
59
|
+
* ```
|
|
60
|
+
*/
|
|
61
|
+
onMouseUp: (handler: MouseEventHandler) => MouseUnsubscribe;
|
|
62
|
+
/**
|
|
63
|
+
* Subscribe to global wheel events. Returns an unsubscribe function.
|
|
64
|
+
*
|
|
65
|
+
* @example
|
|
66
|
+
* ```ts
|
|
67
|
+
* onMouseWheel((x, y, deltaY) => {
|
|
68
|
+
* zoomLevel += deltaY > 0 ? -0.1 : 0.1;
|
|
69
|
+
* });
|
|
70
|
+
* ```
|
|
71
|
+
*/
|
|
72
|
+
onMouseWheel: (handler: MouseWheelHandler) => MouseUnsubscribe;
|
|
73
|
+
};
|
|
74
|
+
/**
|
|
75
|
+
* Mouse plugin – global mouse and wheel listeners with automatic cleanup.
|
|
76
|
+
*
|
|
77
|
+
* Listeners are attached to `window`. All subscriptions are removed when the
|
|
78
|
+
* component is destroyed. Safe to use in SSR (no-op when `window` is undefined).
|
|
79
|
+
*
|
|
80
|
+
* @example
|
|
81
|
+
* ```ts
|
|
82
|
+
* define("my-component", { plugins: [mousePlugin()] }, ({ onMouseMove, onMouseDown, onMouseUp }) => {
|
|
83
|
+
* onMouseMove((x, y) => updateCursor(x, y));
|
|
84
|
+
* onMouseDown((x, y, e) => e.button === 0 && startDrag(x, y));
|
|
85
|
+
* onMouseUp(() => endDrag());
|
|
86
|
+
* return () => `<div>...</div>`;
|
|
87
|
+
* });
|
|
88
|
+
* ```
|
|
89
|
+
*/
|
|
90
|
+
export declare const mousePlugin: () => ComponentPlugin<MouseControls>;
|
|
91
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/mouse/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAwB,MAAM,aAAa,CAAC;AAEzE,qGAAqG;AACrG,MAAM,MAAM,iBAAiB,GAAG,CAC9B,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,KAAK,EAAE,UAAU,KACd,IAAI,CAAC;AAEV,iGAAiG;AACjG,MAAM,MAAM,iBAAiB,GAAG,CAC9B,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,MAAM,EAAE,MAAM,EACd,KAAK,EAAE,UAAU,KACd,IAAI,CAAC;AAEV,yFAAyF;AACzF,MAAM,MAAM,gBAAgB,GAAG,MAAM,IAAI,CAAC;AAE1C;;;;;;;;;;;;;;;;;;;;GAoBG;AACH,MAAM,MAAM,aAAa,GAAG;IAC1B;;;;;;;;;;OAUG;IACH,WAAW,EAAE,CAAC,OAAO,EAAE,iBAAiB,KAAK,gBAAgB,CAAC;IAC9D;;;;;;;;;OASG;IACH,WAAW,EAAE,CAAC,OAAO,EAAE,iBAAiB,KAAK,gBAAgB,CAAC;IAC9D;;;;;;;OAOG;IACH,SAAS,EAAE,CAAC,OAAO,EAAE,iBAAiB,KAAK,gBAAgB,CAAC;IAC5D;;;;;;;;;OASG;IACH,YAAY,EAAE,CAAC,OAAO,EAAE,iBAAiB,KAAK,gBAAgB,CAAC;CAChE,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,WAAW,QAAO,eAAe,CAAC,aAAa,CAyE1D,CAAC"}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
import type { ComponentPlugin } from '../../index';
|
|
2
|
+
import { type MouseControls } from '../mouse';
|
|
3
|
+
/** Smoothed pointer position with velocity. */
|
|
4
|
+
export type PointerPosition = {
|
|
5
|
+
x: number;
|
|
6
|
+
y: number;
|
|
7
|
+
v: number;
|
|
8
|
+
};
|
|
9
|
+
/** Handler for smoothed pointer move. Receives position and velocity magnitude. */
|
|
10
|
+
export type PointerMoveHandler = (pos: PointerPosition) => void;
|
|
11
|
+
/**
|
|
12
|
+
* Pointer plugin controls. Combines raw mouse input with spring-smoothed position and velocity.
|
|
13
|
+
*
|
|
14
|
+
* @example
|
|
15
|
+
* ```ts
|
|
16
|
+
* define("cursor-follower", { plugins: [pointerPlugin()] }, ({ onPointerMove }) => {
|
|
17
|
+
* onPointerMove(({ x, y, v }) => {
|
|
18
|
+
* host.updateState({ cursorX: x, cursorY: y, speed: v });
|
|
19
|
+
* });
|
|
20
|
+
* return () => `<div style="left: {cursorX}px; top: {cursorY}px">...</div>`;
|
|
21
|
+
* });
|
|
22
|
+
* ```
|
|
23
|
+
*/
|
|
24
|
+
export type PointerControls = {
|
|
25
|
+
/**
|
|
26
|
+
* Subscribe to spring-smoothed pointer movement. Fires each frame when position changes.
|
|
27
|
+
* Receives position (x, y) and velocity magnitude (v). Uses RAF internally.
|
|
28
|
+
*
|
|
29
|
+
* @example
|
|
30
|
+
* ```ts
|
|
31
|
+
* onPointerMove(({ x, y, v }) => {
|
|
32
|
+
* // Smooth position for cursor-following
|
|
33
|
+
* host.updateState({ posX: x, posY: y });
|
|
34
|
+
* // Use v for hover intensity or transition speed
|
|
35
|
+
* if (v > 5) setActive(true);
|
|
36
|
+
* });
|
|
37
|
+
* ```
|
|
38
|
+
*/
|
|
39
|
+
onPointerMove: (handler: PointerMoveHandler) => void;
|
|
40
|
+
/** Raw mouse move subscription (from mouse plugin). See MouseControls. */
|
|
41
|
+
onMouseMove: MouseControls['onMouseMove'];
|
|
42
|
+
};
|
|
43
|
+
/**
|
|
44
|
+
* Pointer plugin – spring-smoothed cursor position and velocity.
|
|
45
|
+
*
|
|
46
|
+
* Wraps the mouse plugin to provide smoothed pointer coordinates via spring physics.
|
|
47
|
+
* `onPointerMove` fires on RAF when the smoothed position changes, and includes
|
|
48
|
+
* velocity magnitude for effects (e.g., intensity, transitions).
|
|
49
|
+
*
|
|
50
|
+
* @example
|
|
51
|
+
* ```ts
|
|
52
|
+
* define("my-component", { plugins: [pointerPlugin()] }, ({ onPointerMove, onMouseMove }) => {
|
|
53
|
+
* onPointerMove(({ x, y, v }) => host.updateState({ cx: x, cy: y, velocity: v }));
|
|
54
|
+
* return () => `<div style="transform: translate({cx}px, {cy}px)">...</div>`;
|
|
55
|
+
* });
|
|
56
|
+
* ```
|
|
57
|
+
*/
|
|
58
|
+
export declare const pointerPlugin: () => ComponentPlugin<PointerControls>;
|
|
59
|
+
//# sourceMappingURL=index.d.ts.map
|