@petit-kit/scoped 0.0.1 → 0.0.3
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 +11 -15
- package/dist/index.cjs +1 -1
- package/dist/index.js +1 -1
- package/dist/plugins/index.d.ts +3 -0
- package/dist/plugins/index.d.ts.map +1 -1
- package/dist/plugins/lerp/index.d.ts +41 -0
- package/dist/plugins/lerp/index.d.ts.map +1 -1
- 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 +41 -0
- package/dist/plugins/spring/index.d.ts.map +1 -1
- package/package.json +4 -1
package/README.md
CHANGED
|
@@ -483,34 +483,30 @@ Scoped includes a set of optional plugins to extend or enhance component behavio
|
|
|
483
483
|
|
|
484
484
|
**Available Plugins:**
|
|
485
485
|
|
|
486
|
-
- **
|
|
486
|
+
- **[lerpPlugin](src/plugins/lerp/README.md) & [springPlugin](src/plugins/spring/README.md)**
|
|
487
|
+
Adds a reactive spring physics engine for animating values with natural, spring-like motion. Powered by [@petit-kit/animate](https://github.com/petit-kit/animate). Integrates seamlessly with the timer plugin for requestAnimationFrame-based updates.
|
|
488
|
+
|
|
489
|
+
- **[morphPlugin](src/plugins/morph/README.md)**
|
|
487
490
|
Provides idiomorph-based DOM morphing for efficient, non-destructive updates.
|
|
488
491
|
|
|
489
|
-
- **devicePlugin**
|
|
492
|
+
- **[devicePlugin](src/plugins/device/README.md)**
|
|
490
493
|
Detects and reacts to device and input type changes (e.g., pointer type, hover support).
|
|
491
494
|
|
|
492
|
-
- **lenisPlugin**
|
|
495
|
+
- **[lenisPlugin](src/plugins/lenis/README.md)**
|
|
493
496
|
Integrates the [Lenis](https://github.com/studio-freight/lenis) smooth scrolling library.
|
|
494
497
|
|
|
495
|
-
- **timerPlugin**
|
|
498
|
+
- **[timerPlugin](src/plugins/timer/README.md)**
|
|
496
499
|
Adds easy interval, timeout, and requestAnimationFrame timers to your component logic.
|
|
497
500
|
|
|
498
|
-
- **windowPlugin**
|
|
501
|
+
- **[windowPlugin](src/plugins/window/README.md)**
|
|
499
502
|
Supplies window-level utilities such as window resize and scroll event listeners.
|
|
500
503
|
|
|
501
|
-
- **inViewPlugin**
|
|
504
|
+
- **[inViewPlugin](src/plugins/inview/README.md)**
|
|
502
505
|
Detects when an element is within the viewport and triggers handlers (uses IntersectionObserver).
|
|
503
506
|
|
|
504
|
-
- **mousePlugin**
|
|
507
|
+
- **[mousePlugin](src/plugins/mouse/README.md)**
|
|
505
508
|
Tracks mouse position, mouse events, and allows you to listen to wheel/pointer activity.
|
|
506
509
|
|
|
507
|
-
<!--
|
|
508
|
-
**(Commented-out/incomplete plugins):**
|
|
509
|
-
- contentPlugin
|
|
510
|
-
- lerpPlugin
|
|
511
|
-
- springPlugin
|
|
512
|
-
-->
|
|
513
|
-
|
|
514
510
|
**Usage Example:**
|
|
515
511
|
|
|
516
512
|
```javascript
|
|
@@ -531,4 +527,4 @@ define(
|
|
|
531
527
|
|
|
532
528
|
All plugins are tree-shakeable—import only what you need.
|
|
533
529
|
|
|
534
|
-
See plugin
|
|
530
|
+
See each plugin's README (linked above) for API docs, options, and usage examples.
|
package/dist/index.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";function t(t,e){if(!e||"object"!=typeof e||null==e.type)return null!=t?t:e;const{type:s,default:i}=e;if(null==t)return i;try{switch(s){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 e(t,e,s,i){if(!i||"object"!=typeof i||!i.reflect)return;let n=null;const o=i.type;if(o===Boolean)return s?void t.setAttribute(e,""):void t.removeAttribute(e);if(o===Object||o===Array)try{n=null==s?null:JSON.stringify(s)}catch{n=null}else n=null==s?null:String(s);null==n?t.removeAttribute(e):t.setAttribute(e,n)}const s="0.0.1",i=/\{([A-Za-z_$][\w$]*)\}/g;exports.SCOPE_VERSION=s,exports.define=function(n,o={},r){const{props:h={},shadow:c=!1,styles:f,plugins:u}=o,l=u??[],a=()=>{};class d extends HTMLElement{constructor(){super(),this.version=s,this.t={};for(const t of Object.keys(h)){const e=h[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.i=null,this.o=null,this.h=!1,this.u=!1,this.l=c,this.p=c?this.attachShadow({mode:"open"}):this,this.m=null,this.S=[],this.v=[],this._=[],this.O=[],this.j=[],this.M=[],this.A=[],this.$=[],this.k=new Map,this.F=!1,this.T=!1,this.C={},this.H=!1,this.I=n,this.R=!1,this.U=new Set,this.q=!1,this.B=new Map,this.L=0,this.N=!1}V(t){const e=this.l?this.p.host:this;let s=t.parentElement;for(;s;){if(s===e)return!1;if(s.tagName.includes("-"))return!0;s=s.parentElement}return!1}static get observedAttributes(){return Object.keys(h)}attributeChangedCallback(e,s,i){if(s===i)return;const n=this.t[e],o=this.C[e],r=t(i,n);if(this.props[e]=r,this.F&&o!==r)for(const t of this.$)try{t(e,o,r)}catch(t){a(String(t?.message||t))}this.C[e]=r,this.U.has(e)?this.U.delete(e):this.i&&this.isConnected?this.q?this.R=!0:this.update(!0):this.R=!0}connectedCallback(){for(const e in this.t){if(!this.t.hasOwnProperty(e))continue;const s=t(this.getAttribute(e),this.t[e]);this.props[e]=s,this.C[e]=s}c||this.m||(this.m=this.J());let s=null;try{if(r){const t={props:this.props,state:this.state,actions:this.actions,refs:this.refs,emit:this.emit,listen:this.listen,updateState:this.updateState.bind(this),host:this,onMount:t=>this._.push(t),onDestroy:t=>this.O.push(t),onUpdate:t=>this.j.push(t),onBeforeUpdate:t=>this.M.push(t),onFirstUpdate:t=>this.A.push(t),onPropsChanged:t=>this.$.push(t),link:(t,s)=>{const i=s||t;this.state[i]=this.props[t],this.$.push((e,s,n)=>{e===t&&(Object.is(this.state[i],n)||(this.state[i]=n))});const n={fn:()=>{const s=this.state[i];if(Object.is(this.props[t],s))return;this.props[t]=s,this.C[t]=s;const n=this.t[t],o=n?{...n,reflect:!0}:n,r=this.getAttribute(t);this.U.add(t),e(this,t,s,o),r===this.getAttribute(t)&&this.U.delete(t)},deps:()=>[this.state[i]]};this.S.push(n)},computed:(t,e)=>{let s;if(void 0!==e)try{const t="function"==typeof e?e():e;Array.isArray(t)&&(s=t)}catch(t){String(t?.message||t)}const i={getter:t,deps:e,value:void 0!==e?t(s):t()};this.v.push(i);const n=()=>i.value;return n.P=i,this.W(n),n},effect:(t,e)=>{const s={fn:t,deps:e};return this.S.push(s),()=>this.D(s)},delegate:(t,e,s)=>(this.Z(t,e,s),()=>this.G(t,e,s))};for(const e of l)if(e)try{const s=e.extend(t,this);s&&"object"==typeof s&&Object.assign(t,s)}catch(t){a(String(t?.message||t))}s=r(t)}}catch(t){String(t?.message||t)}if(this.i="function"!=typeof s?()=>"":s,this.q=!0,this.update(!0),this.q=!1,this.R&&(this.R=!1,this.update(!0)),!this.F){this.F=!0;for(const t of this._)try{t()}catch(t){a(String(t?.message||t))}}}disconnectedCallback(){this.destroy()}remove(){super.remove()}destroy(){for(const t of this.O)try{t()}catch(t){a(String(t?.message||t))}for(const t of this.S)if(t.cleanup){try{t.cleanup()}catch(t){a(String(t?.message||t))}t.cleanup=void 0}for(const[,t]of this.k)try{this.p.removeEventListener(t.eventType,t.listener)}catch{}this.k.clear(),this.F=!1}emit(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}listen(t,e,s,i){const n=s;t.addEventListener(e,n,i);const o=()=>{try{t.removeEventListener(e,n,i)}catch{}};return this.O.push(o),o}setState(t){let e=!1;const s=t,i=this.state;for(const t in s){if(!Object.prototype.hasOwnProperty.call(s,t))continue;const n=s[t];Object.is(i[t],n)||(i[t]=n,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.K()}setProps(t){const s=Object.keys(t);if(0===s.length)return;const i=[];for(const n of s){const s=t[n],o=this.C[n];this.props[n]=s,this.F&&o!==s&&i.push(n);const r=this.t[n];r&&r.reflect&&e(this,n,s,r),this.F&&o===s||(this.C[n]=s)}if(this.F&&i.length>0)for(const e of i){const s=this.C[e],i=t[e];for(const t of this.$)try{t(e,s,i)}catch(t){a(String(t?.message||t))}}this.i&&this.isConnected?this.update(!0):this.R=!0}scheduleUpdate(){this.i&&this.isConnected&&this.K()}K(){this.u||this.h||(this.u=!0,("function"==typeof queueMicrotask?queueMicrotask:t=>Promise.resolve().then(t))(()=>{this.u=!1,this.i&&this.isConnected&&(this.h||this.update(!1))}))}update(t){if(this.i){if(t&&this.F)for(const t of this.M)try{t()}catch(t){a(String(t?.message||t))}if(t){this.X();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 s={...this.props,...e};return t.replace(i,(t,e)=>{const i=s[e];return null==i?"":String(i)})})(t,this.state),!this.l){const e=`data-scope-owner="${this.I}"`;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 s=!1;e&&this.F||(this.l,this.p.innerHTML=t,this.o=t,s=!0),this.q?(this.Y(),("function"==typeof requestAnimationFrame?requestAnimationFrame:t=>setTimeout(t,0))(()=>{this.i&&this.isConnected&&(s&&!c&&this.projectSlots(),s&&this.tt(),this.et(),this.st())})):(s&&!c&&this.projectSlots(),s&&this.it(),this.et(),this.st())}else this.N&&this.X(),this.et(),this.F&&this.st()}}forceRender(){this.o=null,this.i&&this.isConnected?this.q?this.R=!0:this.update(!0):this.R=!0}st(){if(!this.T){this.T=!0;for(const t of this.A)try{t()}catch(t){a(String(t?.message||t))}}for(const t of this.j)try{t()}catch(t){a(String(t?.message||t))}this.nt()}nt(){const t=(this.l?this.p:this).querySelectorAll("*"),e=Object.prototype.hasOwnProperty,s=this.state,i=this.props;this.actions;for(let n=0;n<t.length;n++){const o=t[n];if(this.V(o))continue;if(0===o.attributes.length)continue;const r=o.attributes;for(let t=r.length-1;t>=0;t--){const n=r[t];if(!n.name.startsWith("bind:"))continue;const h=n.name.slice(5),c=n.value,f=c?c.trim():"";let u,l=!1;if(f){const t=this.B.get(f);if(t){t.P&&(this.N=!0);try{u=t()}catch{}l=!0}}if(!l){const t=f||h,n=e.call(s,t),o=!n&&e.call(i,t);n?u=s[t]:o&&(u=i[t])}if("text"===h){const t=null==u?"":String(u);o.textContent!==t&&(o.textContent=t)}else if("html"===h){const t=null==u?"":String(u);o.innerHTML!==t&&(o.innerHTML=t)}else if(h in o){if(!Object.is(o[h],u))try{o[h]=u}catch{}if("value"===h)try{null==u?o.removeAttribute("value"):o.setAttribute("value",String(u))}catch{}}else if(null!=u)try{o.setAttribute(h,String(u))}catch{}const a=`__scopeBind_${h}`,d=o[a];if(d){const t=d.ot;t&&o.removeEventListener(t,d),delete o[a]}}}}X(){for(const t of this.v){let e,s=!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)){s=!1;for(let i=0;i<e.length;i++)if(!Object.is(t.prevDeps[i],e[i])){s=!0;break}}}catch(t){a(String(t?.message||t)),s=!0,e=void 0}if(s){try{t.value=void 0!==t.deps?t.getter(e):t.getter()}catch(t){a(String(t?.message||t))}e&&(t.prevDeps=e.slice())}}}et(){for(const t of this.S){let e,s=!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)){s=!1;for(let i=0;i<e.length;i++)if(!Object.is(t.prevDeps[i],e[i])){s=!0;break}}}catch(t){a(String(t?.message||t)),s=!0,e=void 0}if(s){if(t.cleanup){try{t.cleanup()}catch{}t.cleanup=void 0}try{const s=void 0!==t.deps?t.fn(e):t.fn();"function"==typeof s&&(t.cleanup=s)}catch{}e&&(t.prevDeps=e.slice())}}}D(t){const e=this.S.indexOf(t);if(-1!==e){if(t.cleanup)try{t.cleanup()}catch{}this.S.splice(e,1)}}W(t){const e=t.rt;if(e&&"string"==typeof e)return this.B.set(e,t),e;const s=`__scope_bind_${++this.L}__`;this.B.set(s,t);try{t.rt=s,t.toString=()=>s}catch{}return s}Y(){const t=(this.l?this.p:this).querySelectorAll("[ref]"),e=this.refs;for(const t in e)e.hasOwnProperty(t)&&delete e[t];if(0!==t.length)for(let s=0;s<t.length;s++){const i=t[s];if(this.V(i))continue;const n=i.getAttribute("ref");n&&(e[n]?Array.isArray(e[n])?e[n].push(i):e[n]=[e[n],i]:e[n]=i)}}tt(){const t=(this.l?this.p:this).querySelectorAll("*");for(let e=0;e<t.length;e++){const s=t[e];if(this.V(s))continue;if(0===s.attributes.length)continue;const i=s.attributes;for(let t=i.length-1;t>=0;t--){const e=i[t];if(!e.name.startsWith("on:"))continue;const n=e.name.slice(3),o=e.value,r=`__tinyHandler_${n}`,h=s[r];h&&s.removeEventListener(n,h),s.removeAttribute(e.name);const c=this.actions[o];if(c&&"function"==typeof c){const t=t=>{c.call(this.actions,t)};s[r]=t,s.addEventListener(n,t)}}}}it(){const t=(this.l?this.p:this).querySelectorAll("*"),e=this.refs;for(const t in e)e.hasOwnProperty(t)&&delete e[t];for(let s=0;s<t.length;s++){const i=t[s];if(this.V(i))continue;const n=i.getAttribute("ref");if(n&&(e[n]?Array.isArray(e[n])?e[n].push(i):e[n]=[e[n],i]:e[n]=i),i.attributes.length>0){const t=i.attributes;for(let e=t.length-1;e>=0;e--){const s=t[e];if(!s.name.startsWith("on:"))continue;const n=s.name.slice(3),o=s.value,r=`__tinyHandler_${n}`,h=i[r];h&&i.removeEventListener(n,h),i.removeAttribute(s.name);const c=this.actions[o];if(c&&"function"==typeof c){const t=t=>{c.call(this.actions,t)};i[r]=t,i.addEventListener(n,t)}}}}}J(){const t=new Map,e=this.childNodes,s=[];for(let t=0;t<e.length;t++)s.push(e[t]);for(let e=0;e<s.length;e++){const i=s[e];let n="";1===i.nodeType&&i.getAttribute&&(n=i.getAttribute("slot")||""),t.has(n)||t.set(n,[]),t.get(n).push(i)}for(let t=0;t<s.length;t++){const e=s[t];e.parentNode&&e.parentNode.removeChild(e)}return t}projectSlots(){const t=this.m||new Map,e=(this.l?this.p:this).querySelectorAll(`slot[data-scope-owner="${this.I}"]`);if(0!==e.length)for(let s=0;s<e.length;s++){const i=e[s],n=i.getAttribute("name")||"",o=t.get(n)||[];if(o.length){const t=document.createDocumentFragment();for(let e=0;e<o.length;e++){const s=o[e];let i;if(1===s.nodeType&&s.tagName.includes("-")&&s.m instanceof Map){const t=s,e=document.createElement(t.tagName.toLowerCase());for(let s=0;s<t.attributes.length;s++){const i=t.attributes[s];e.setAttribute(i.name,i.value)}for(const s of t.m.values())for(let t=0;t<s.length;t++)e.appendChild(s[t].cloneNode(!0));i=e}else i=s.cloneNode(!0);t.appendChild(i)}i.replaceWith(t)}else{const t=i.childNodes,e=[];for(let s=0;s<t.length;s++)e.push(t[s]);if(e.length>0){const t=document.createDocumentFragment();for(let s=0;s<e.length;s++)t.appendChild(e[s]);i.replaceWith(t)}}}}Z(t,e,s){const i=`${t}::${e}`;let n=this.k.get(i);if(!n){const s=t=>{const s=t.target&&t.target.closest?t.target.closest(e):null;if(s)for(const e of n.handlers)try{e(t,s)}catch{}};n={eventType:t,selector:e,listener:s,handlers:new Set},this.k.set(i,n),this.p.addEventListener(t,s)}n.handlers.add(s)}G(t,e,s){const i=`${t}::${e}`,n=this.k.get(i);if(n&&(n.handlers.delete(s),0===n.handlers.size)){try{this.p.removeEventListener(t,n.listener)}catch{}this.k.delete(i)}}}if(!customElements.get(n)){if(f&&"undefined"!=typeof document){const t=`scope-${n}-styles`;if(!document.getElementById(t)){const e=document.createElement("style");e.id=t,e.textContent=f,document.head.appendChild(e)}}try{customElements.define(n,d)}catch(t){String(t?.message||t)}}return d},exports.devicePlugin=()=>({name:"device",extend:t=>{const e=new Map;return t.onDestroy(()=>{for(const[t,s]of e)t.removeEventListener("change",s);e.clear()}),{onMediaQuery:(t,s,i={})=>{if("undefined"==typeof window||"undefined"==typeof matchMedia)return()=>{};const{immediate:n=!0}=i,o=matchMedia(t),r=t=>{s(t.matches,t)};return o.addEventListener("change",r),e.set(o,r),n&&s(o.matches,null),()=>{o.removeEventListener("change",r),e.delete(o)}}}}}),exports.inViewPlugin=()=>({name:"inview",extend:(t,e)=>{const s=new Set,i=(t,e,i={})=>{if("undefined"==typeof window||"undefined"==typeof IntersectionObserver)return()=>{};const{immediate:n=!0,...o}=i;let r=!n;const h=new IntersectionObserver(s=>{for(const i of s)i.target===t&&(r?r=!1:e(i.isIntersecting,i))},o);return h.observe(t),s.add(h),()=>{h.unobserve(t),h.disconnect(),s.delete(h)}};return t.onDestroy(()=>{for(const t of s)t.disconnect();s.clear()}),{onInView:(t,s)=>i(e,t,s),observeInView:(t,e,s)=>i(t,e,s)}}}),exports.lenisPlugin=t=>({name:"lenis",extend:e=>{const s=new Set;return e.onDestroy(()=>{for(const{lenis:t,handler:e}of s)"function"==typeof t.off&&t.off("scroll",e);s.clear()}),{onLenisScroll:e=>{const i=t();if(!i)return()=>{};const n=t=>{e(t)};i.on("scroll",n);const o={lenis:i,handler:n};return s.add(o),()=>{s.has(o)&&(s.delete(o),"function"==typeof i.off&&i.off("scroll",n))}}}}}),exports.morphPlugin=(t,e={})=>({name:"morph",extend:(s,i)=>{const{ignoreActiveValue:n=!0,callbacks:o}=e,r=t(),h=i,c=h.p,f=h.l?ShadowRoot.prototype:HTMLElement.prototype,u=Object.getOwnPropertyDescriptor(f,"innerHTML"),l=t=>{r.morph(c,t,{morphStyle:"innerHTML",ignoreActiveValue:n,callbacks:o})};let a=!0;return Object.defineProperty(c,"innerHTML",{set(t){a?(u.set.call(this,t),a=!1):l(t)},get(){return u.get.call(this)},configurable:!0}),s.onDestroy(()=>{delete c.innerHTML}),{morph:l}}}),exports.mousePlugin=()=>({name:"mouse",extend:t=>{const e=new Map,s=(t,s)=>{if("undefined"==typeof window)return()=>{};const i=t=>{const e=t;s(e.clientX,e.clientY,e)};window.addEventListener(t,i);let n=e.get(t);return n||(n=new Set,e.set(t,n)),n.add(i),()=>{window.removeEventListener(t,i),n?.delete(i)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const[t,s]of e){for(const e of s)window.removeEventListener(t,e);s.clear()}e.clear()}}),{onMouseMove:t=>s("mousemove",t),onMouseDown:t=>s("mousedown",t),onMouseUp:t=>s("mouseup",t),onMouseWheel:t=>(t=>{if("undefined"==typeof window)return()=>{};const s=e=>{const s=e;t(s.clientX,s.clientY,s.deltaY,s)};window.addEventListener("wheel",s);let i=e.get("wheel");return i||(i=new Set,e.set("wheel",i)),i.add(s),()=>{window.removeEventListener("wheel",s),i?.delete(s)}})(t)}}}),exports.timerPlugin=()=>({name:"timer",extend:t=>{const e=new Set,s=new Set,i=new Set,n={setTimeout:(t,s,...i)=>{let n;return n=setTimeout((...s)=>{e.delete(n),t(...s)},s,...i),e.add(n),n},setInterval:(t,e,...i)=>{const n=setInterval(t,e,...i);return s.add(n),n},raf:(t,e)=>{let s=0,n=!0,o=0;const r="number"==typeof e&&e>0?1e3/e:0,h=e=>{if(i.delete(s),n){if(r){if(e-o>=r){const s=o?e-o:r;o=e,t(e,s)}}else{const s=o?e-o:0;o=e,t(e,s)}s=requestAnimationFrame(h),i.add(s)}};return s=requestAnimationFrame(h),i.add(s),()=>{n&&(n=!1,i.delete(s),cancelAnimationFrame(s))}}};return t.onDestroy(()=>{for(const t of e)clearTimeout(t);e.clear();for(const t of s)clearInterval(t);s.clear();for(const t of i)cancelAnimationFrame(t);i.clear()}),{timer:n}}}),exports.windowPlugin=()=>({name:"window",extend:t=>{const e=new Set,s=new Set,i=(t,s={})=>{if("undefined"==typeof window)return()=>{};const{immediate:i=!0}=s,n=e=>{t(window.innerWidth,window.innerHeight,e)};return window.addEventListener("resize",n),e.add(n),i&&n(new UIEvent("resize")),()=>{window.removeEventListener("resize",n),e.delete(n)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const t of e)window.removeEventListener("resize",t);e.clear();for(const t of s)t.disconnect();s.clear()}}),{onViewportResize:i,onWindowResize:(t,e={})=>{if("undefined"==typeof window)return()=>{};if("undefined"==typeof ResizeObserver)return i((e,s,i)=>t(e,s,i),e);const{immediate:n=!0}=e,o=document.documentElement,r=new ResizeObserver(e=>{const s=e[0];if(!s)return;const{width:i,height:n}=s.contentRect;t(i,n,s)});if(r.observe(o),s.add(r),n){const e=o.getBoundingClientRect();t(e.width,e.height,new UIEvent("resize"))}return()=>{r.disconnect(),s.delete(r)}}}}});
|
|
1
|
+
"use strict";function t({from:t=0,to:e=1,mass:n=1,stiffness:s=120,damping:i=14,velocity:a=0,tolerance:d=.001,resumeOnTarget:m=!0}={}){function p(){return c(b)}function y(t){if(M)return p();if(o(b)&&o(S)&&o(v)){let e=!0;for(let o=0;o<b.length;o+=1){const r=b[o]-S[o],c=(-s*r-i*v[o])/n;v[o]+=c*t,b[o]+=v[o]*t;const h=b[o]-S[o];(Math.abs(v[o])>=d||Math.abs(h)>=d)&&(e=!1)}if(e){for(let t=0;t<b.length;t+=1)b[t]=S[t],v[t]=0;M=!0}return w.value=b,w.velocity=v,c(b)}if(r(b)&&r(S)&&r(v)){const e=w.objectKeys??Object.keys(b);let o=!0;for(const r of e){const e=b[r]-S[r],c=(-s*e-i*v[r])/n;v[r]+=c*t,b[r]+=v[r]*t;const h=b[r]-S[r];(Math.abs(v[r])>=d||Math.abs(h)>=d)&&(o=!1)}if(o){for(const t of e)b[t]=S[t],v[t]=0;M=!0}return w.value=b,w.velocity=v,c(b)}const e=S;let h=v;h+=(-s*(b-e)-i*h)/n*t,b+=h*t,v=h,w.value=b,w.velocity=v;const f=b-e;return Math.abs(h)<d&&Math.abs(f)<d&&(b=e,v=0,w.value=b,w.velocity=v,M=!0),b}const w=l({from:t,to:e,velocity:a,label:"Spring"}),g=w.normalizeInput;let b=w.value,v=w.velocity??a,S=w.target,j=null,M=!1;const O=new Set;return{setTarget:function(t){const e=g(t),n=!h(e,S);if(S=e,w.target=e,b=w.value,m&&M&&n){M=!1,j=null;for(const t of O)t(S)}},setValue:function(t,e={}){const{resetVelocity:n=!0,resetTime:s=!0,setTarget:i=!1,markDone:o=!1}=e;b=g(t),w.value=b,i&&(S=c(b),w.target=S);const r=M||!h(b,S);if(n&&(v=null!=w.arrayLength?f(0,w.arrayLength):null!=w.objectKeys?u(0,w.objectKeys):0,w.velocity=v),s&&(j=null),o&&(M=!0),r&&!o){M=!1,j=null;for(const t of O)t(S)}},getValue:p,isDone:function(){return M},onResume:function(t){return O.add(t),()=>{O.delete(t)}},step:y,next:function(t=performance.now()){if(null==j)return j=t,p();const e=(t-j)/1e3;j=t;const n=1/30;let s=e,i=p();for(;s>0&&!M;){const t=Math.min(s,n);i=y(t),s-=t}return i}}}function e(t,e){if(!e||"object"!=typeof e||null==e.type)return null!=t?t:e;const{type:n,default:s}=e;if(null==t)return s;try{switch(n){case String:return String(t);case Number:{const e=Number(t);return Number.isNaN(e)?s: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 s}case Array:try{return"string"==typeof t?JSON.parse(t):t}catch{return Array.isArray(s)?s:[]}default:return t}}catch{return s}}function n(t,e,n,s){if(!s||"object"!=typeof s||!s.reflect)return;let i=null;const o=s.type;if(o===Boolean)return n?void t.setAttribute(e,""):void t.removeAttribute(e);if(o===Object||o===Array)try{i=null==n?null:JSON.stringify(n)}catch{i=null}else i=null==n?null:String(n);null==i?t.removeAttribute(e):t.setAttribute(e,i)}const s=()=>({name:"timer",extend:t=>{const e=new Set,n=new Set,s=new Set,i={setTimeout:(t,n,...s)=>{let i;return i=setTimeout((...n)=>{e.delete(i),t(...n)},n,...s),e.add(i),i},setInterval:(t,e,...s)=>{const i=setInterval(t,e,...s);return n.add(i),i},raf:(t,e)=>{let n=0,i=!0,o=0;const r="number"==typeof e&&e>0?1e3/e:0,c=e=>{if(s.delete(n),i){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),s.add(n)}};return n=requestAnimationFrame(c),s.add(n),()=>{i&&(i=!1,s.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 s)cancelAnimationFrame(t);s.clear()}),{timer:i}}}),i=()=>({name:"mouse",extend:t=>{const e=new Map,n=(t,n)=>{if("undefined"==typeof window)return()=>{};const s=t=>{const e=t;n(e.clientX,e.clientY,e)};window.addEventListener(t,s);let i=e.get(t);return i||(i=new Set,e.set(t,i)),i.add(s),()=>{window.removeEventListener(t,s),i?.delete(s)}};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 s=e.get("wheel");return s||(s=new Set,e.set("wheel",s)),s.add(n),()=>{window.removeEventListener("wheel",n),s?.delete(n)}})(t)}}}),o=t=>Array.isArray(t),r=t=>null!=t&&"object"==typeof t&&!Array.isArray(t),c=t=>o(t)?t.slice():r(t)?{...t}:t,h=(t,e)=>{if(o(t)&&o(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(r(t)&&r(e)){const n=Object.keys(t),s=Object.keys(e);if(n.length!==s.length)return!1;for(const s of n){if(!(s in e))return!1;if(!Object.is(t[s],e[s]))return!1}return!0}return!(o(t)||o(e)||r(t)||r(e))&&Object.is(t,e)},f=(t,e)=>Array.from({length:e},()=>t),u=(t,e)=>e.reduce((e,n)=>(e[n]=t,e),{}),l=({from:t,to:e,velocity:n,label:s})=>{const i={value:t,target:e,velocity:n,arrayLength:null,objectKeys:null,normalizeInput:t=>t},c=t=>{if(null==i.arrayLength){if(null!=i.objectKeys)throw new Error(`${s} value shape mismatch (array vs object).`);i.arrayLength=t,o(i.value)||(i.value=f(i.value,t)),o(i.target)||(i.target=f(i.target,t)),void 0===i.velocity||o(i.velocity)||(i.velocity=f(i.velocity,t))}},h=t=>{if(null==i.objectKeys){if(null!=i.arrayLength)throw new Error(`${s} value shape mismatch (object vs array).`);i.objectKeys=t,r(i.value)||(i.value=u(i.value,t)),r(i.target)||(i.target=u(i.target,t)),void 0===i.velocity||r(i.velocity)||(i.velocity=u(i.velocity,t))}},l=t=>{if(o(t)){if(null!=i.objectKeys)throw new Error(`${s} value shape mismatch (array vs object).`);if(null==i.arrayLength&&c(t.length),t.length!==i.arrayLength)throw new Error(`${s} value length mismatch (expected ${i.arrayLength}, got ${t.length}).`);return t.slice()}if(r(t)){if(null!=i.arrayLength)throw new Error(`${s} value shape mismatch (object vs array).`);const e=Object.keys(t);if(null==i.objectKeys&&h(e),i.objectKeys&&e.length!==i.objectKeys.length)throw new Error(`${s} value keys mismatch (expected ${i.objectKeys.length}, got ${e.length}).`);if(i.objectKeys)for(const e of i.objectKeys)if(!(e in t))throw new Error(`${s} value keys mismatch (missing key "${e}").`);return{...t}}return null!=i.arrayLength?f(t,i.arrayLength):null!=i.objectKeys?u(t,i.objectKeys):t};i.normalizeInput=l;const a=o(t)||o(e)||void 0!==n&&o(n),d=r(t)||r(e)||void 0!==n&&r(n);if(a&&d)throw new Error(`${s} value shape mismatch (array vs object).`);if(a){const s=o(t)?t.length:o(e)?e.length:n.length;c(s),i.value=l(t),i.target=l(e),void 0!==i.velocity&&(i.velocity=l(i.velocity))}else if(d){const s=r(t)?Object.keys(t):r(e)?Object.keys(e):Object.keys(n);h(s),i.value=l(t),i.target=l(e),void 0!==i.velocity&&(i.velocity=l(i.velocity))}return i};let a={x:-1,y:-1};const d={stiffness:300,damping:30,mass:1},m="0.0.1",p=/\{([A-Za-z_$][\w$]*)\}/g;exports.SCOPE_VERSION=m,exports.define=function(t,s={},i){const{props:o={},shadow:r=!1,styles:c,plugins:h}=s,f=h??[],u=()=>{};class l 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.i=null,this.o=null,this.h=!1,this.u=!1,this.l=r,this.m=r?this.attachShadow({mode:"open"}):this,this.p=null,this.S=[],this.j=[],this.M=[],this.O=[],this._=[],this.$=[],this.A=[],this.T=[],this.k=new Map,this.L=!1,this.F=!1,this.I={},this.R=!1,this.V=t,this.C=!1,this.H=new Set,this.D=!1,this.U=new Map,this.q=0,this.B=!1}N(t){const e=this.l?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,s){if(n===s)return;const i=this.t[t],o=this.I[t],r=e(s,i);if(this.props[t]=r,this.L&&o!==r)for(const e of this.T)try{e(t,o,r)}catch(t){u(String(t?.message||t))}this.I[t]=r,this.H.has(t)?this.H.delete(t):this.i&&this.isConnected?this.D?this.C=!0:this.update(!0):this.C=!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.I[t]=n}r||this.p||(this.p=this.W());let t=null;try{if(i){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),host:this,onMount:t=>this.M.push(t),onDestroy:t=>this.O.push(t),onUpdate:t=>this._.push(t),onBeforeUpdate:t=>this.$.push(t),onFirstUpdate:t=>this.A.push(t),onPropsChanged:t=>this.T.push(t),link:(t,e)=>{const s=e||t;this.state[s]=this.props[t],this.T.push((e,n,i)=>{e===t&&(Object.is(this.state[s],i)||(this.state[s]=i))});const i={fn:()=>{const e=this.state[s];if(Object.is(this.props[t],e))return;this.props[t]=e,this.I[t]=e;const i=this.t[t],o=i?{...i,reflect:!0}:i,r=this.getAttribute(t);this.H.add(t),n(this,t,e,o),r===this.getAttribute(t)&&this.H.delete(t)},deps:()=>[this.state[s]]};this.S.push(i)},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 s={getter:t,deps:e,value:void 0!==e?t(n):t()};this.j.push(s);const i=()=>s.value;return i.P=s,this.J(i),i},effect:(t,e)=>{const n={fn:t,deps:e};return this.S.push(n),()=>this.K(n)},delegate:(t,e,n)=>(this.Z(t,e,n),()=>this.G(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){u(String(t?.message||t))}t=i(e)}}catch(t){String(t?.message||t)}if(this.i="function"!=typeof t?()=>"":t,this.D=!0,this.update(!0),this.D=!1,this.C&&(this.C=!1,this.update(!0)),!this.L){this.L=!0;for(const t of this.M)try{t()}catch(t){u(String(t?.message||t))}}}disconnectedCallback(){this.destroy()}remove(){super.remove()}destroy(){for(const t of this.O)try{t()}catch(t){u(String(t?.message||t))}for(const t of this.S)if(t.cleanup){try{t.cleanup()}catch(t){u(String(t?.message||t))}t.cleanup=void 0}for(const[,t]of this.k)try{this.m.removeEventListener(t.eventType,t.listener)}catch{}this.k.clear(),this.L=!1}emit(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}listen(t,e,n,s){const i=n;t.addEventListener(e,i,s);const o=()=>{try{t.removeEventListener(e,i,s)}catch{}};return this.O.push(o),o}setState(t){let e=!1;const n=t,s=this.state;for(const t in n){if(!Object.prototype.hasOwnProperty.call(n,t))continue;const i=n[t];Object.is(s[t],i)||(s[t]=i,e=!0)}if(e)if(this.D||!this.L)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.X()}setProps(t){const e=Object.keys(t);if(0===e.length)return;const s=[];for(const i of e){const e=t[i],o=this.I[i];this.props[i]=e,this.L&&o!==e&&s.push(i);const r=this.t[i];r&&r.reflect&&n(this,i,e,r),this.L&&o===e||(this.I[i]=e)}if(this.L&&s.length>0)for(const e of s){const n=this.I[e],s=t[e];for(const t of this.T)try{t(e,n,s)}catch(t){u(String(t?.message||t))}}this.i&&this.isConnected?this.update(!0):this.C=!0}scheduleUpdate(){this.i&&this.isConnected&&this.X()}X(){this.u||this.h||(this.u=!0,("function"==typeof queueMicrotask?queueMicrotask:t=>Promise.resolve().then(t))(()=>{this.u=!1,this.i&&this.isConnected&&(this.h||this.update(!1))}))}update(t){if(this.i){if(t&&this.L)for(const t of this.$)try{t()}catch(t){u(String(t?.message||t))}if(t){this.Y();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(p,(t,e)=>{const s=n[e];return null==s?"":String(s)})})(t,this.state),!this.l){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.L||(this.l,this.m.innerHTML=t,this.o=t,n=!0),this.D?(this.tt(),("function"==typeof requestAnimationFrame?requestAnimationFrame:t=>setTimeout(t,0))(()=>{this.i&&this.isConnected&&(n&&!r&&this.projectSlots(),n&&this.et(),this.nt(),this.st())})):(n&&!r&&this.projectSlots(),n&&this.it(),this.nt(),this.st())}else this.B&&this.Y(),this.nt(),this.L&&this.st()}}forceRender(){this.o=null,this.i&&this.isConnected?this.D?this.C=!0:this.update(!0):this.C=!0}st(){if(!this.F){this.F=!0;for(const t of this.A)try{t()}catch(t){u(String(t?.message||t))}}for(const t of this._)try{t()}catch(t){u(String(t?.message||t))}this.ot()}ot(){const t=(this.l?this.m:this).querySelectorAll("*"),e=Object.prototype.hasOwnProperty,n=this.state,s=this.props;this.actions;for(let i=0;i<t.length;i++){const o=t[i];if(this.N(o))continue;if(0===o.attributes.length)continue;const r=o.attributes;for(let t=r.length-1;t>=0;t--){const i=r[t];if(!i.name.startsWith("bind:"))continue;const c=i.name.slice(5),h=i.value,f=h?h.trim():"";let u,l=!1;if(f){const t=this.U.get(f);if(t){t.P&&(this.B=!0);try{u=t()}catch{}l=!0}}if(!l){const t=f||c,i=e.call(n,t),o=!i&&e.call(s,t);i?u=n[t]:o&&(u=s[t])}if("text"===c){const t=null==u?"":String(u);o.textContent!==t&&(o.textContent=t)}else if("html"===c){const t=null==u?"":String(u);o.innerHTML!==t&&(o.innerHTML=t)}else if(c in o){if(!Object.is(o[c],u))try{o[c]=u}catch{}if("value"===c)try{null==u?o.removeAttribute("value"):o.setAttribute("value",String(u))}catch{}}else if(null!=u)try{o.setAttribute(c,String(u))}catch{}const a=`__scopeBind_${c}`,d=o[a];if(d){const t=d.rt;t&&o.removeEventListener(t,d),delete o[a]}}}}Y(){for(const t of this.j){let e,n=!0;if(void 0!==t.deps)try{const s="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(s)&&(e=s,t.prevDeps&&t.prevDeps.length===e.length)){n=!1;for(let s=0;s<e.length;s++)if(!Object.is(t.prevDeps[s],e[s])){n=!0;break}}}catch(t){u(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){u(String(t?.message||t))}e&&(t.prevDeps=e.slice())}}}nt(){for(const t of this.S){let e,n=!0;if(void 0!==t.deps)try{const s="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(s)&&(e=s,t.prevDeps&&t.prevDeps.length===e.length)){n=!1;for(let s=0;s<e.length;s++)if(!Object.is(t.prevDeps[s],e[s])){n=!0;break}}}catch(t){u(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())}}}K(t){const e=this.S.indexOf(t);if(-1!==e){if(t.cleanup)try{t.cleanup()}catch{}this.S.splice(e,1)}}J(t){const e=t.ct;if(e&&"string"==typeof e)return this.U.set(e,t),e;const n=`__scope_bind_${++this.q}__`;this.U.set(n,t);try{t.ct=n,t.toString=()=>n}catch{}return n}tt(){const t=(this.l?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 s=t[n];if(this.N(s))continue;const i=s.getAttribute("ref");i&&(e[i]?Array.isArray(e[i])?e[i].push(s):e[i]=[e[i],s]:e[i]=s)}}et(){const t=(this.l?this.m:this).querySelectorAll("*");for(let e=0;e<t.length;e++){const n=t[e];if(this.N(n))continue;if(0===n.attributes.length)continue;const s=n.attributes;for(let t=s.length-1;t>=0;t--){const e=s[t];if(!e.name.startsWith("on:"))continue;const i=e.name.slice(3),o=e.value,r=`__tinyHandler_${i}`,c=n[r];c&&n.removeEventListener(i,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(i,t)}}}}it(){const t=(this.l?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 s=t[n];if(this.N(s))continue;const i=s.getAttribute("ref");if(i&&(e[i]?Array.isArray(e[i])?e[i].push(s):e[i]=[e[i],s]:e[i]=s),s.attributes.length>0){const t=s.attributes;for(let e=t.length-1;e>=0;e--){const n=t[e];if(!n.name.startsWith("on:"))continue;const i=n.name.slice(3),o=n.value,r=`__tinyHandler_${i}`,c=s[r];c&&s.removeEventListener(i,c),s.removeAttribute(n.name);const h=this.actions[o];if(h&&"function"==typeof h){const t=t=>{h.call(this.actions,t)};s[r]=t,s.addEventListener(i,t)}}}}}W(){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 s=n[e];let i="";1===s.nodeType&&s.getAttribute&&(i=s.getAttribute("slot")||""),t.has(i)||t.set(i,[]),t.get(i).push(s)}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.l?this.m:this).querySelectorAll(`slot[data-scope-owner="${this.V}"]`);if(0!==e.length)for(let n=0;n<e.length;n++){const s=e[n],i=s.getAttribute("name")||"",o=t.get(i)||[];if(o.length){const t=document.createDocumentFragment();for(let e=0;e<o.length;e++){const n=o[e];let s;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 s=t.attributes[n];e.setAttribute(s.name,s.value)}for(const n of t.p.values())for(let t=0;t<n.length;t++)e.appendChild(n[t].cloneNode(!0));s=e}else s=n.cloneNode(!0);t.appendChild(s)}s.replaceWith(t)}else{const t=s.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]);s.replaceWith(t)}}}}Z(t,e,n){const s=`${t}::${e}`;let i=this.k.get(s);if(!i){const n=t=>{const n=t.target&&t.target.closest?t.target.closest(e):null;if(n)for(const e of i.handlers)try{e(t,n)}catch{}};i={eventType:t,selector:e,listener:n,handlers:new Set},this.k.set(s,i),this.m.addEventListener(t,n)}i.handlers.add(n)}G(t,e,n){const s=`${t}::${e}`,i=this.k.get(s);if(i&&(i.handlers.delete(n),0===i.handlers.size)){try{this.m.removeEventListener(t,i.listener)}catch{}this.k.delete(s)}}}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,l)}catch(t){String(t?.message||t)}}return l},exports.devicePlugin=()=>({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,s={})=>{if("undefined"==typeof window||"undefined"==typeof matchMedia)return()=>{};const{immediate:i=!0}=s,o=matchMedia(t),r=t=>{n(t.matches,t)};return o.addEventListener("change",r),e.set(o,r),i&&n(o.matches,null),()=>{o.removeEventListener("change",r),e.delete(o)}}}}}),exports.inViewPlugin=()=>({name:"inview",extend:(t,e)=>{const n=new Set,s=(t,e,s={})=>{if("undefined"==typeof window||"undefined"==typeof IntersectionObserver)return()=>{};const{immediate:i=!0,...o}=s;let r=!i;const c=new IntersectionObserver(n=>{for(const s of n)s.target===t&&(r?r=!1:e(s.isIntersecting,s))},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)=>s(e,t,n),observeInView:(t,e,n)=>s(t,e,n)}}}),exports.lenisPlugin=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 s=t();if(!s)return()=>{};const i=t=>{e(t)};s.on("scroll",i);const o={lenis:s,handler:i};return n.add(o),()=>{n.has(o)&&(n.delete(o),"function"==typeof s.off&&s.off("scroll",i))}}}}}),exports.lerpPlugin=()=>({name:"lerp",extend:t=>{const{timer:e}=s().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:s=.001,resumeOnTarget:i=!0}={}){function f(){return c(m)}function u(t){if(w)return f();const e=(t=>t<0?0:t>1?1:t)(n);if(0===e)return f();if(1===e)return m=c(p),a.value=m,w=!0,f();const i=t>0?1-Math.pow(1-e,60*t):0;if(o(m)&&o(p)){let t=!0;for(let e=0;e<m.length;e+=1)m[e]+=(p[e]-m[e])*i,Math.abs(p[e]-m[e])>=s&&(t=!1);if(t){for(let t=0;t<m.length;t+=1)m[t]=p[t];w=!0}return a.value=m,c(m)}if(r(m)&&r(p)){const t=a.objectKeys??Object.keys(m);let e=!0;for(const n of t)m[n]+=(p[n]-m[n])*i,Math.abs(p[n]-m[n])>=s&&(e=!1);if(e){for(const e of t)m[e]=p[e];w=!0}return a.value=m,c(m)}const h=p;return m+=(h-m)*i,a.value=m,Math.abs(h-m)<s&&(m=h,a.value=m,w=!0),m}const a=l({from:t,to:e,label:"Lerp"}),d=a.normalizeInput;let m=a.value,p=a.target,y=null,w=!1;const g=new Set;return{setTarget:function(t){const e=d(t),n=!h(e,p);if(p=e,a.target=e,m=a.value,i&&w&&n){w=!1,y=null;for(const t of g)t(p)}},setValue:function(t,e={}){const{resetTime:n=!0,setTarget:s=!1,markDone:i=!1}=e;m=d(t),a.value=m,s&&(p=c(m),a.target=p);const o=w||!h(m,p);if(n&&(y=null),i&&(w=!0),o&&!i){w=!1,y=null;for(const t of g)t(p)}},getValue:f,isDone:function(){return w},onResume:function(t){return g.add(t),()=>{g.delete(t)}},step:u,next:function(t=performance.now()){if(null==y)return y=t,f();const e=(t-y)/1e3;y=t;const n=1/30;let s=e,i=f();for(;s>0&&!w;){const t=Math.min(s,n);i=u(t),s-=t}return i}}}(t),runLerp:(t,s,i={})=>{const{fps:o,immediate:r=!0,stopWhenDone:c=!0}=i;let h=!1,f=null;r&&s(t.getValue(),t);const u=()=>{f||(f=e.raf(e=>{if(h)return;const n=t.next(e);s(n,t),c&&t.isDone()&&l()},o))},l=()=>{f&&(f(),f=null)};u();const a=t.onResume(()=>{!h&&c&&(r&&s(t.getValue(),t),u())}),d=()=>{h||(h=!0,a(),l(),n.delete(d))};return n.add(d),d}}}}),exports.morphPlugin=(t,e={})=>({name:"morph",extend:(n,s)=>{const{ignoreActiveValue:i=!0,callbacks:o}=e,r=t(),c=s,h=c.m,f=c.l?ShadowRoot.prototype:HTMLElement.prototype,u=Object.getOwnPropertyDescriptor(f,"innerHTML"),l=t=>{r.morph(h,t,{morphStyle:"innerHTML",ignoreActiveValue:i,callbacks:o})};let a=!0;return Object.defineProperty(h,"innerHTML",{set(t){a?(u.set.call(this,t),a=!1):l(t)},get(){return u.get.call(this)},configurable:!0}),n.onDestroy(()=>{delete h.innerHTML}),{morph:l}}}),exports.mousePlugin=i,exports.pointerPlugin=()=>({name:"pointer",extend:e=>{const{onMouseMove:n}=i().extend(e,e.host),{timer:o}=s().extend(e,e.host);a.x=window.innerWidth/2,a.y=window.innerHeight/2;const r={x:t({from:a.x,to:a.x,...d}),y:t({from:a.y,to:a.y,...d})};return n((t,e)=>{r.x.setTarget(t),r.y.setTarget(e)}),{onPointerMove:t=>{let e=a.x,n=a.y;o.raf(s=>{const i=r.x.next(s),o=r.y.next(s);var c,h;e===i&&n===o||(t({x:i,y:o,v:(c={x:i,y:o},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=i,n=o)})},onMouseMove:n}}}),exports.springPlugin=()=>({name:"spring",extend:e=>{const{timer:n}=s().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 u=()=>{f||(f=n.raf(n=>{if(h)return;const s=t.next(n);e(s,t),c&&t.isDone()&&l()},o))},l=()=>{f&&(f(),f=null)};u();const a=t.onResume(()=>{!h&&c&&(r&&e(t.getValue(),t),u())}),d=()=>{h||(h=!0,a(),l(),i.delete(d))};return i.add(d),d}}}}),exports.timerPlugin=s,exports.windowPlugin=()=>({name:"window",extend:t=>{const e=new Set,n=new Set,s=(t,n={})=>{if("undefined"==typeof window)return()=>{};const{immediate:s=!0}=n,i=e=>{t(window.innerWidth,window.innerHeight,e)};return window.addEventListener("resize",i),e.add(i),s&&i(new UIEvent("resize")),()=>{window.removeEventListener("resize",i),e.delete(i)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const t of e)window.removeEventListener("resize",t);e.clear();for(const t of n)t.disconnect();n.clear()}}),{onViewportResize:s,onWindowResize:(t,e={})=>{if("undefined"==typeof window)return()=>{};if("undefined"==typeof ResizeObserver)return s((e,n,s)=>t(e,n,s),e);const{immediate:i=!0}=e,o=document.documentElement,r=new ResizeObserver(e=>{const n=e[0];if(!n)return;const{width:s,height:i}=n.contentRect;t(s,i,n)});if(r.observe(o),n.add(r),i){const e=o.getBoundingClientRect();t(e.width,e.height,new UIEvent("resize"))}return()=>{r.disconnect(),n.delete(r)}}}}});
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
package/dist/index.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
function t(t,i){if(!i||"object"!=typeof i||null==i.type)return null!=t?t:i;const{type:e,default:s}=i;if(null==t)return s;try{switch(e){case String:return String(t);case Number:{const i=Number(t);return Number.isNaN(i)?s:i}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 s}case Array:try{return"string"==typeof t?JSON.parse(t):t}catch{return Array.isArray(s)?s:[]}default:return t}}catch{return s}}function i(t,i,e,s){if(!s||"object"!=typeof s||!s.reflect)return;let n=null;const o=s.type;if(o===Boolean)return e?void t.setAttribute(i,""):void t.removeAttribute(i);if(o===Object||o===Array)try{n=null==e?null:JSON.stringify(e)}catch{n=null}else n=null==e?null:String(e);null==n?t.removeAttribute(i):t.setAttribute(i,n)}function e(e,s={},n){const{props:o={},shadow:r=!1,styles:h,plugins:c}=s,f=c??[],d=()=>{};class y extends HTMLElement{constructor(){super(),this.version=u,this.t={};for(const t of Object.keys(o)){const i=o[t];this.t[t]=i&&"object"==typeof i&&("type"in i||"default"in i)?i:{type:void 0,default:i,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.i=null,this.o=null,this.h=!1,this.u=!1,this.l=r,this.p=r?this.attachShadow({mode:"open"}):this,this.m=null,this.S=[],this.v=[],this._=[],this.O=[],this.j=[],this.M=[],this.A=[],this.$=[],this.k=new Map,this.F=!1,this.T=!1,this.C={},this.H=!1,this.I=e,this.R=!1,this.U=new Set,this.q=!1,this.B=new Map,this.L=0,this.N=!1}V(t){const i=this.l?this.p.host:this;let e=t.parentElement;for(;e;){if(e===i)return!1;if(e.tagName.includes("-"))return!0;e=e.parentElement}return!1}static get observedAttributes(){return Object.keys(o)}attributeChangedCallback(i,e,s){if(e===s)return;const n=this.t[i],o=this.C[i],r=t(s,n);if(this.props[i]=r,this.F&&o!==r)for(const t of this.$)try{t(i,o,r)}catch(t){d(String(t?.message||t))}this.C[i]=r,this.U.has(i)?this.U.delete(i):this.i&&this.isConnected?this.q?this.R=!0:this.update(!0):this.R=!0}connectedCallback(){for(const i in this.t){if(!this.t.hasOwnProperty(i))continue;const e=t(this.getAttribute(i),this.t[i]);this.props[i]=e,this.C[i]=e}r||this.m||(this.m=this.J());let e=null;try{if(n){const t={props:this.props,state:this.state,actions:this.actions,refs:this.refs,emit:this.emit,listen:this.listen,updateState:this.updateState.bind(this),host:this,onMount:t=>this._.push(t),onDestroy:t=>this.O.push(t),onUpdate:t=>this.j.push(t),onBeforeUpdate:t=>this.M.push(t),onFirstUpdate:t=>this.A.push(t),onPropsChanged:t=>this.$.push(t),link:(t,e)=>{const s=e||t;this.state[s]=this.props[t],this.$.push((i,e,n)=>{i===t&&(Object.is(this.state[s],n)||(this.state[s]=n))});const n={fn:()=>{const e=this.state[s];if(Object.is(this.props[t],e))return;this.props[t]=e,this.C[t]=e;const n=this.t[t],o=n?{...n,reflect:!0}:n,r=this.getAttribute(t);this.U.add(t),i(this,t,e,o),r===this.getAttribute(t)&&this.U.delete(t)},deps:()=>[this.state[s]]};this.S.push(n)},computed:(t,i)=>{let e;if(void 0!==i)try{const t="function"==typeof i?i():i;Array.isArray(t)&&(e=t)}catch(t){String(t?.message||t)}const s={getter:t,deps:i,value:void 0!==i?t(e):t()};this.v.push(s);const n=()=>s.value;return n.P=s,this.W(n),n},effect:(t,i)=>{const e={fn:t,deps:i};return this.S.push(e),()=>this.D(e)},delegate:(t,i,e)=>(this.Z(t,i,e),()=>this.G(t,i,e))};for(const i of f)if(i)try{const e=i.extend(t,this);e&&"object"==typeof e&&Object.assign(t,e)}catch(t){d(String(t?.message||t))}e=n(t)}}catch(t){String(t?.message||t)}if(this.i="function"!=typeof e?()=>"":e,this.q=!0,this.update(!0),this.q=!1,this.R&&(this.R=!1,this.update(!0)),!this.F){this.F=!0;for(const t of this._)try{t()}catch(t){d(String(t?.message||t))}}}disconnectedCallback(){this.destroy()}remove(){super.remove()}destroy(){for(const t of this.O)try{t()}catch(t){d(String(t?.message||t))}for(const t of this.S)if(t.cleanup){try{t.cleanup()}catch(t){d(String(t?.message||t))}t.cleanup=void 0}for(const[,t]of this.k)try{this.p.removeEventListener(t.eventType,t.listener)}catch{}this.k.clear(),this.F=!1}emit(t,i){this.dispatchEvent(new CustomEvent(t,{detail:i,bubbles:!0,composed:!0}))}listen(t,i,e,s){const n=e;t.addEventListener(i,n,s);const o=()=>{try{t.removeEventListener(i,n,s)}catch{}};return this.O.push(o),o}setState(t){let i=!1;const e=t,s=this.state;for(const t in e){if(!Object.prototype.hasOwnProperty.call(e,t))continue;const n=e[t];Object.is(s[t],n)||(s[t]=n,i=!0)}if(i)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.K()}setProps(t){const e=Object.keys(t);if(0===e.length)return;const s=[];for(const n of e){const e=t[n],o=this.C[n];this.props[n]=e,this.F&&o!==e&&s.push(n);const r=this.t[n];r&&r.reflect&&i(this,n,e,r),this.F&&o===e||(this.C[n]=e)}if(this.F&&s.length>0)for(const i of s){const e=this.C[i],s=t[i];for(const t of this.$)try{t(i,e,s)}catch(t){d(String(t?.message||t))}}this.i&&this.isConnected?this.update(!0):this.R=!0}scheduleUpdate(){this.i&&this.isConnected&&this.K()}K(){this.u||this.h||(this.u=!0,("function"==typeof queueMicrotask?queueMicrotask:t=>Promise.resolve().then(t))(()=>{this.u=!1,this.i&&this.isConnected&&(this.h||this.update(!1))}))}update(t){if(this.i){if(t&&this.F)for(const t of this.M)try{t()}catch(t){d(String(t?.message||t))}if(t){this.X();let t="";try{t=this.i()}catch(i){String(i?.message||i),t=""}if("string"!=typeof t&&(t=null==t?"":String(t)),t=((t,i)=>{const e={...this.props,...i};return t.replace(l,(t,i)=>{const s=e[i];return null==s?"":String(s)})})(t,this.state),!this.l){const i=`data-scope-owner="${this.I}"`;t=t.replace(/<slot(?![^>]*data-scope-owner)(\s|>)/g,`<slot ${i}$1`)}this.N=!1;const i=null!==this.o&&Object.is(this.o,t);let e=!1;i&&this.F||(this.l,this.p.innerHTML=t,this.o=t,e=!0),this.q?(this.Y(),("function"==typeof requestAnimationFrame?requestAnimationFrame:t=>setTimeout(t,0))(()=>{this.i&&this.isConnected&&(e&&!r&&this.projectSlots(),e&&this.tt(),this.it(),this.et())})):(e&&!r&&this.projectSlots(),e&&this.st(),this.it(),this.et())}else this.N&&this.X(),this.it(),this.F&&this.et()}}forceRender(){this.o=null,this.i&&this.isConnected?this.q?this.R=!0:this.update(!0):this.R=!0}et(){if(!this.T){this.T=!0;for(const t of this.A)try{t()}catch(t){d(String(t?.message||t))}}for(const t of this.j)try{t()}catch(t){d(String(t?.message||t))}this.nt()}nt(){const t=(this.l?this.p:this).querySelectorAll("*"),i=Object.prototype.hasOwnProperty,e=this.state,s=this.props;this.actions;for(let n=0;n<t.length;n++){const o=t[n];if(this.V(o))continue;if(0===o.attributes.length)continue;const r=o.attributes;for(let t=r.length-1;t>=0;t--){const n=r[t];if(!n.name.startsWith(a))continue;const h=n.name.slice(5),c=n.value,f=c?c.trim():"";let u,l=!1;if(f){const t=this.B.get(f);if(t){t.P&&(this.N=!0);try{u=t()}catch{}l=!0}}if(!l){const t=f||h,n=i.call(e,t),o=!n&&i.call(s,t);n?u=e[t]:o&&(u=s[t])}if("text"===h){const t=null==u?"":String(u);o.textContent!==t&&(o.textContent=t)}else if("html"===h){const t=null==u?"":String(u);o.innerHTML!==t&&(o.innerHTML=t)}else if(h in o){if(!Object.is(o[h],u))try{o[h]=u}catch{}if("value"===h)try{null==u?o.removeAttribute("value"):o.setAttribute("value",String(u))}catch{}}else if(null!=u)try{o.setAttribute(h,String(u))}catch{}const d=`__scopeBind_${h}`,y=o[d];if(y){const t=y.ot;t&&o.removeEventListener(t,y),delete o[d]}}}}X(){for(const t of this.v){let i,e=!0;if(void 0!==t.deps)try{const s="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(s)&&(i=s,t.prevDeps&&t.prevDeps.length===i.length)){e=!1;for(let s=0;s<i.length;s++)if(!Object.is(t.prevDeps[s],i[s])){e=!0;break}}}catch(t){d(String(t?.message||t)),e=!0,i=void 0}if(e){try{t.value=void 0!==t.deps?t.getter(i):t.getter()}catch(t){d(String(t?.message||t))}i&&(t.prevDeps=i.slice())}}}it(){for(const t of this.S){let i,e=!0;if(void 0!==t.deps)try{const s="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(s)&&(i=s,t.prevDeps&&t.prevDeps.length===i.length)){e=!1;for(let s=0;s<i.length;s++)if(!Object.is(t.prevDeps[s],i[s])){e=!0;break}}}catch(t){d(String(t?.message||t)),e=!0,i=void 0}if(e){if(t.cleanup){try{t.cleanup()}catch{}t.cleanup=void 0}try{const e=void 0!==t.deps?t.fn(i):t.fn();"function"==typeof e&&(t.cleanup=e)}catch{}i&&(t.prevDeps=i.slice())}}}D(t){const i=this.S.indexOf(t);if(-1!==i){if(t.cleanup)try{t.cleanup()}catch{}this.S.splice(i,1)}}W(t){const i=t.rt;if(i&&"string"==typeof i)return this.B.set(i,t),i;const e=`__scope_bind_${++this.L}__`;this.B.set(e,t);try{t.rt=e,t.toString=()=>e}catch{}return e}Y(){const t=(this.l?this.p:this).querySelectorAll("[ref]"),i=this.refs;for(const t in i)i.hasOwnProperty(t)&&delete i[t];if(0!==t.length)for(let e=0;e<t.length;e++){const s=t[e];if(this.V(s))continue;const n=s.getAttribute("ref");n&&(i[n]?Array.isArray(i[n])?i[n].push(s):i[n]=[i[n],s]:i[n]=s)}}tt(){const t=(this.l?this.p:this).querySelectorAll("*");for(let i=0;i<t.length;i++){const e=t[i];if(this.V(e))continue;if(0===e.attributes.length)continue;const s=e.attributes;for(let t=s.length-1;t>=0;t--){const i=s[t];if(!i.name.startsWith("on:"))continue;const n=i.name.slice(3),o=i.value,r=`__tinyHandler_${n}`,h=e[r];h&&e.removeEventListener(n,h),e.removeAttribute(i.name);const c=this.actions[o];if(c&&"function"==typeof c){const t=t=>{c.call(this.actions,t)};e[r]=t,e.addEventListener(n,t)}}}}st(){const t=(this.l?this.p:this).querySelectorAll("*"),i=this.refs;for(const t in i)i.hasOwnProperty(t)&&delete i[t];for(let e=0;e<t.length;e++){const s=t[e];if(this.V(s))continue;const n=s.getAttribute("ref");if(n&&(i[n]?Array.isArray(i[n])?i[n].push(s):i[n]=[i[n],s]:i[n]=s),s.attributes.length>0){const t=s.attributes;for(let i=t.length-1;i>=0;i--){const e=t[i];if(!e.name.startsWith("on:"))continue;const n=e.name.slice(3),o=e.value,r=`__tinyHandler_${n}`,h=s[r];h&&s.removeEventListener(n,h),s.removeAttribute(e.name);const c=this.actions[o];if(c&&"function"==typeof c){const t=t=>{c.call(this.actions,t)};s[r]=t,s.addEventListener(n,t)}}}}}J(){const t=new Map,i=this.childNodes,e=[];for(let t=0;t<i.length;t++)e.push(i[t]);for(let i=0;i<e.length;i++){const s=e[i];let n="";1===s.nodeType&&s.getAttribute&&(n=s.getAttribute("slot")||""),t.has(n)||t.set(n,[]),t.get(n).push(s)}for(let t=0;t<e.length;t++){const i=e[t];i.parentNode&&i.parentNode.removeChild(i)}return t}projectSlots(){const t=this.m||new Map,i=(this.l?this.p:this).querySelectorAll(`slot[data-scope-owner="${this.I}"]`);if(0!==i.length)for(let e=0;e<i.length;e++){const s=i[e],n=s.getAttribute("name")||"",o=t.get(n)||[];if(o.length){const t=document.createDocumentFragment();for(let i=0;i<o.length;i++){const e=o[i];let s;if(1===e.nodeType&&e.tagName.includes("-")&&e.m instanceof Map){const t=e,i=document.createElement(t.tagName.toLowerCase());for(let e=0;e<t.attributes.length;e++){const s=t.attributes[e];i.setAttribute(s.name,s.value)}for(const e of t.m.values())for(let t=0;t<e.length;t++)i.appendChild(e[t].cloneNode(!0));s=i}else s=e.cloneNode(!0);t.appendChild(s)}s.replaceWith(t)}else{const t=s.childNodes,i=[];for(let e=0;e<t.length;e++)i.push(t[e]);if(i.length>0){const t=document.createDocumentFragment();for(let e=0;e<i.length;e++)t.appendChild(i[e]);s.replaceWith(t)}}}}Z(t,i,e){const s=`${t}::${i}`;let n=this.k.get(s);if(!n){const e=t=>{const e=t.target&&t.target.closest?t.target.closest(i):null;if(e)for(const i of n.handlers)try{i(t,e)}catch{}};n={eventType:t,selector:i,listener:e,handlers:new Set},this.k.set(s,n),this.p.addEventListener(t,e)}n.handlers.add(e)}G(t,i,e){const s=`${t}::${i}`,n=this.k.get(s);if(n&&(n.handlers.delete(e),0===n.handlers.size)){try{this.p.removeEventListener(t,n.listener)}catch{}this.k.delete(s)}}}if(!customElements.get(e)){if(h&&"undefined"!=typeof document){const t=`scope-${e}-styles`;if(!document.getElementById(t)){const i=document.createElement("style");i.id=t,i.textContent=h,document.head.appendChild(i)}}try{customElements.define(e,y)}catch(t){String(t?.message||t)}}return y}const s=()=>({name:"device",extend:t=>{const i=new Map;return t.onDestroy(()=>{for(const[t,e]of i)t.removeEventListener("change",e);i.clear()}),{onMediaQuery:(t,e,s={})=>{if("undefined"==typeof window||"undefined"==typeof matchMedia)return()=>{};const{immediate:n=!0}=s,o=matchMedia(t),r=t=>{e(t.matches,t)};return o.addEventListener("change",r),i.set(o,r),n&&e(o.matches,null),()=>{o.removeEventListener("change",r),i.delete(o)}}}}}),n=(t,i={})=>({name:"morph",extend:(e,s)=>{const{ignoreActiveValue:n=!0,callbacks:o}=i,r=t(),h=s,c=h.p,f=h.l?ShadowRoot.prototype:HTMLElement.prototype,u=Object.getOwnPropertyDescriptor(f,"innerHTML"),l=t=>{r.morph(c,t,{morphStyle:"innerHTML",ignoreActiveValue:n,callbacks:o})};let a=!0;return Object.defineProperty(c,"innerHTML",{set(t){a?(u.set.call(this,t),a=!1):l(t)},get(){return u.get.call(this)},configurable:!0}),e.onDestroy(()=>{delete c.innerHTML}),{morph:l}}}),o=()=>({name:"window",extend:t=>{const i=new Set,e=new Set,s=(t,e={})=>{if("undefined"==typeof window)return()=>{};const{immediate:s=!0}=e,n=i=>{t(window.innerWidth,window.innerHeight,i)};return window.addEventListener("resize",n),i.add(n),s&&n(new UIEvent("resize")),()=>{window.removeEventListener("resize",n),i.delete(n)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const t of i)window.removeEventListener("resize",t);i.clear();for(const t of e)t.disconnect();e.clear()}}),{onViewportResize:s,onWindowResize:(t,i={})=>{if("undefined"==typeof window)return()=>{};if("undefined"==typeof ResizeObserver)return s((i,e,s)=>t(i,e,s),i);const{immediate:n=!0}=i,o=document.documentElement,r=new ResizeObserver(i=>{const e=i[0];if(!e)return;const{width:s,height:n}=e.contentRect;t(s,n,e)});if(r.observe(o),e.add(r),n){const i=o.getBoundingClientRect();t(i.width,i.height,new UIEvent("resize"))}return()=>{r.disconnect(),e.delete(r)}}}}}),r=()=>({name:"inview",extend:(t,i)=>{const e=new Set,s=(t,i,s={})=>{if("undefined"==typeof window||"undefined"==typeof IntersectionObserver)return()=>{};const{immediate:n=!0,...o}=s;let r=!n;const h=new IntersectionObserver(e=>{for(const s of e)s.target===t&&(r?r=!1:i(s.isIntersecting,s))},o);return h.observe(t),e.add(h),()=>{h.unobserve(t),h.disconnect(),e.delete(h)}};return t.onDestroy(()=>{for(const t of e)t.disconnect();e.clear()}),{onInView:(t,e)=>s(i,t,e),observeInView:(t,i,e)=>s(t,i,e)}}}),h=t=>({name:"lenis",extend:i=>{const e=new Set;return i.onDestroy(()=>{for(const{lenis:t,handler:i}of e)"function"==typeof t.off&&t.off("scroll",i);e.clear()}),{onLenisScroll:i=>{const s=t();if(!s)return()=>{};const n=t=>{i(t)};s.on("scroll",n);const o={lenis:s,handler:n};return e.add(o),()=>{e.has(o)&&(e.delete(o),"function"==typeof s.off&&s.off("scroll",n))}}}}}),c=()=>({name:"timer",extend:t=>{const i=new Set,e=new Set,s=new Set,n={setTimeout:(t,e,...s)=>{let n;return n=setTimeout((...e)=>{i.delete(n),t(...e)},e,...s),i.add(n),n},setInterval:(t,i,...s)=>{const n=setInterval(t,i,...s);return e.add(n),n},raf:(t,i)=>{let e=0,n=!0,o=0;const r="number"==typeof i&&i>0?1e3/i:0,h=i=>{if(s.delete(e),n){if(r){if(i-o>=r){const e=o?i-o:r;o=i,t(i,e)}}else{const e=o?i-o:0;o=i,t(i,e)}e=requestAnimationFrame(h),s.add(e)}};return e=requestAnimationFrame(h),s.add(e),()=>{n&&(n=!1,s.delete(e),cancelAnimationFrame(e))}}};return t.onDestroy(()=>{for(const t of i)clearTimeout(t);i.clear();for(const t of e)clearInterval(t);e.clear();for(const t of s)cancelAnimationFrame(t);s.clear()}),{timer:n}}}),f=()=>({name:"mouse",extend:t=>{const i=new Map,e=(t,e)=>{if("undefined"==typeof window)return()=>{};const s=t=>{const i=t;e(i.clientX,i.clientY,i)};window.addEventListener(t,s);let n=i.get(t);return n||(n=new Set,i.set(t,n)),n.add(s),()=>{window.removeEventListener(t,s),n?.delete(s)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const[t,e]of i){for(const i of e)window.removeEventListener(t,i);e.clear()}i.clear()}}),{onMouseMove:t=>e("mousemove",t),onMouseDown:t=>e("mousedown",t),onMouseUp:t=>e("mouseup",t),onMouseWheel:t=>(t=>{if("undefined"==typeof window)return()=>{};const e=i=>{const e=i;t(e.clientX,e.clientY,e.deltaY,e)};window.addEventListener("wheel",e);let s=i.get("wheel");return s||(s=new Set,i.set("wheel",s)),s.add(e),()=>{window.removeEventListener("wheel",e),s?.delete(e)}})(t)}}}),u="0.0.1",l=/\{([A-Za-z_$][\w$]*)\}/g,a="bind:";export{u as SCOPE_VERSION,e as define,s as devicePlugin,r as inViewPlugin,h as lenisPlugin,n as morphPlugin,f as mousePlugin,c as timerPlugin,o as windowPlugin};
|
|
1
|
+
function t({from:t=0,to:e=1,mass:n=1,stiffness:s=120,damping:i=14,velocity:o=0,tolerance:r=.001,resumeOnTarget:c=!0}={}){function h(){return d(b)}function f(t){if(M)return h();if(l(b)&&l(S)&&l(v)){let e=!0;for(let o=0;o<b.length;o+=1){const c=b[o]-S[o],h=(-s*c-i*v[o])/n;v[o]+=h*t,b[o]+=v[o]*t;const f=b[o]-S[o];(Math.abs(v[o])>=r||Math.abs(f)>=r)&&(e=!1)}if(e){for(let t=0;t<b.length;t+=1)b[t]=S[t],v[t]=0;M=!0}return u.value=b,u.velocity=v,d(b)}if(a(b)&&a(S)&&a(v)){const e=u.objectKeys??Object.keys(b);let o=!0;for(const c of e){const e=b[c]-S[c],h=(-s*e-i*v[c])/n;v[c]+=h*t,b[c]+=v[c]*t;const f=b[c]-S[c];(Math.abs(v[c])>=r||Math.abs(f)>=r)&&(o=!1)}if(o){for(const t of e)b[t]=S[t],v[t]=0;M=!0}return u.value=b,u.velocity=v,d(b)}const e=S;let o=v;o+=(-s*(b-e)-i*o)/n*t,b+=o*t,v=o,u.value=b,u.velocity=v;const c=b-e;return Math.abs(o)<r&&Math.abs(c)<r&&(b=e,v=0,u.value=b,u.velocity=v,M=!0),b}const u=w({from:t,to:e,velocity:o,label:"Spring"}),g=u.normalizeInput;let b=u.value,v=u.velocity??o,S=u.target,j=null,M=!1;const O=new Set;return{setTarget:function(t){const e=g(t),n=!m(e,S);if(S=e,u.target=e,b=u.value,c&&M&&n){M=!1,j=null;for(const t of O)t(S)}},setValue:function(t,e={}){const{resetVelocity:n=!0,resetTime:s=!0,setTarget:i=!1,markDone:o=!1}=e;b=g(t),u.value=b,i&&(S=d(b),u.target=S);const r=M||!m(b,S);if(n&&(v=null!=u.arrayLength?p(0,u.arrayLength):null!=u.objectKeys?y(0,u.objectKeys):0,u.velocity=v),s&&(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 s=e,i=h();for(;s>0&&!M;){const t=Math.min(s,n);i=f(t),s-=t}return i}}}function e(t,e){if(!e||"object"!=typeof e||null==e.type)return null!=t?t:e;const{type:n,default:s}=e;if(null==t)return s;try{switch(n){case String:return String(t);case Number:{const e=Number(t);return Number.isNaN(e)?s: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 s}case Array:try{return"string"==typeof t?JSON.parse(t):t}catch{return Array.isArray(s)?s:[]}default:return t}}catch{return s}}function n(t,e,n,s){if(!s||"object"!=typeof s||!s.reflect)return;let i=null;const o=s.type;if(o===Boolean)return n?void t.setAttribute(e,""):void t.removeAttribute(e);if(o===Object||o===Array)try{i=null==n?null:JSON.stringify(n)}catch{i=null}else i=null==n?null:String(n);null==i?t.removeAttribute(e):t.setAttribute(e,i)}function s(t,s={},i){const{props:o={},shadow:r=!1,styles:c,plugins:h}=s,f=h??[],u=()=>{};class l 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.i=null,this.o=null,this.h=!1,this.u=!1,this.l=r,this.m=r?this.attachShadow({mode:"open"}):this,this.p=null,this.S=[],this.j=[],this.M=[],this.O=[],this._=[],this.$=[],this.A=[],this.T=[],this.k=new Map,this.L=!1,this.F=!1,this.I={},this.R=!1,this.V=t,this.C=!1,this.H=new Set,this.D=!1,this.U=new Map,this.q=0,this.B=!1}N(t){const e=this.l?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,s){if(n===s)return;const i=this.t[t],o=this.I[t],r=e(s,i);if(this.props[t]=r,this.L&&o!==r)for(const e of this.T)try{e(t,o,r)}catch(t){u(String(t?.message||t))}this.I[t]=r,this.H.has(t)?this.H.delete(t):this.i&&this.isConnected?this.D?this.C=!0:this.update(!0):this.C=!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.I[t]=n}r||this.p||(this.p=this.W());let t=null;try{if(i){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),host:this,onMount:t=>this.M.push(t),onDestroy:t=>this.O.push(t),onUpdate:t=>this._.push(t),onBeforeUpdate:t=>this.$.push(t),onFirstUpdate:t=>this.A.push(t),onPropsChanged:t=>this.T.push(t),link:(t,e)=>{const s=e||t;this.state[s]=this.props[t],this.T.push((e,n,i)=>{e===t&&(Object.is(this.state[s],i)||(this.state[s]=i))});const i={fn:()=>{const e=this.state[s];if(Object.is(this.props[t],e))return;this.props[t]=e,this.I[t]=e;const i=this.t[t],o=i?{...i,reflect:!0}:i,r=this.getAttribute(t);this.H.add(t),n(this,t,e,o),r===this.getAttribute(t)&&this.H.delete(t)},deps:()=>[this.state[s]]};this.S.push(i)},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 s={getter:t,deps:e,value:void 0!==e?t(n):t()};this.j.push(s);const i=()=>s.value;return i.P=s,this.J(i),i},effect:(t,e)=>{const n={fn:t,deps:e};return this.S.push(n),()=>this.K(n)},delegate:(t,e,n)=>(this.Z(t,e,n),()=>this.G(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){u(String(t?.message||t))}t=i(e)}}catch(t){String(t?.message||t)}if(this.i="function"!=typeof t?()=>"":t,this.D=!0,this.update(!0),this.D=!1,this.C&&(this.C=!1,this.update(!0)),!this.L){this.L=!0;for(const t of this.M)try{t()}catch(t){u(String(t?.message||t))}}}disconnectedCallback(){this.destroy()}remove(){super.remove()}destroy(){for(const t of this.O)try{t()}catch(t){u(String(t?.message||t))}for(const t of this.S)if(t.cleanup){try{t.cleanup()}catch(t){u(String(t?.message||t))}t.cleanup=void 0}for(const[,t]of this.k)try{this.m.removeEventListener(t.eventType,t.listener)}catch{}this.k.clear(),this.L=!1}emit(t,e){this.dispatchEvent(new CustomEvent(t,{detail:e,bubbles:!0,composed:!0}))}listen(t,e,n,s){const i=n;t.addEventListener(e,i,s);const o=()=>{try{t.removeEventListener(e,i,s)}catch{}};return this.O.push(o),o}setState(t){let e=!1;const n=t,s=this.state;for(const t in n){if(!Object.prototype.hasOwnProperty.call(n,t))continue;const i=n[t];Object.is(s[t],i)||(s[t]=i,e=!0)}if(e)if(this.D||!this.L)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.X()}setProps(t){const e=Object.keys(t);if(0===e.length)return;const s=[];for(const i of e){const e=t[i],o=this.I[i];this.props[i]=e,this.L&&o!==e&&s.push(i);const r=this.t[i];r&&r.reflect&&n(this,i,e,r),this.L&&o===e||(this.I[i]=e)}if(this.L&&s.length>0)for(const e of s){const n=this.I[e],s=t[e];for(const t of this.T)try{t(e,n,s)}catch(t){u(String(t?.message||t))}}this.i&&this.isConnected?this.update(!0):this.C=!0}scheduleUpdate(){this.i&&this.isConnected&&this.X()}X(){this.u||this.h||(this.u=!0,("function"==typeof queueMicrotask?queueMicrotask:t=>Promise.resolve().then(t))(()=>{this.u=!1,this.i&&this.isConnected&&(this.h||this.update(!1))}))}update(t){if(this.i){if(t&&this.L)for(const t of this.$)try{t()}catch(t){u(String(t?.message||t))}if(t){this.Y();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(O,(t,e)=>{const s=n[e];return null==s?"":String(s)})})(t,this.state),!this.l){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.L||(this.l,this.m.innerHTML=t,this.o=t,n=!0),this.D?(this.tt(),("function"==typeof requestAnimationFrame?requestAnimationFrame:t=>setTimeout(t,0))(()=>{this.i&&this.isConnected&&(n&&!r&&this.projectSlots(),n&&this.et(),this.nt(),this.st())})):(n&&!r&&this.projectSlots(),n&&this.it(),this.nt(),this.st())}else this.B&&this.Y(),this.nt(),this.L&&this.st()}}forceRender(){this.o=null,this.i&&this.isConnected?this.D?this.C=!0:this.update(!0):this.C=!0}st(){if(!this.F){this.F=!0;for(const t of this.A)try{t()}catch(t){u(String(t?.message||t))}}for(const t of this._)try{t()}catch(t){u(String(t?.message||t))}this.ot()}ot(){const t=(this.l?this.m:this).querySelectorAll("*"),e=Object.prototype.hasOwnProperty,n=this.state,s=this.props;this.actions;for(let i=0;i<t.length;i++){const o=t[i];if(this.N(o))continue;if(0===o.attributes.length)continue;const r=o.attributes;for(let t=r.length-1;t>=0;t--){const i=r[t];if(!i.name.startsWith(_))continue;const c=i.name.slice(5),h=i.value,f=h?h.trim():"";let u,l=!1;if(f){const t=this.U.get(f);if(t){t.P&&(this.B=!0);try{u=t()}catch{}l=!0}}if(!l){const t=f||c,i=e.call(n,t),o=!i&&e.call(s,t);i?u=n[t]:o&&(u=s[t])}if("text"===c){const t=null==u?"":String(u);o.textContent!==t&&(o.textContent=t)}else if("html"===c){const t=null==u?"":String(u);o.innerHTML!==t&&(o.innerHTML=t)}else if(c in o){if(!Object.is(o[c],u))try{o[c]=u}catch{}if("value"===c)try{null==u?o.removeAttribute("value"):o.setAttribute("value",String(u))}catch{}}else if(null!=u)try{o.setAttribute(c,String(u))}catch{}const a=`__scopeBind_${c}`,d=o[a];if(d){const t=d.rt;t&&o.removeEventListener(t,d),delete o[a]}}}}Y(){for(const t of this.j){let e,n=!0;if(void 0!==t.deps)try{const s="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(s)&&(e=s,t.prevDeps&&t.prevDeps.length===e.length)){n=!1;for(let s=0;s<e.length;s++)if(!Object.is(t.prevDeps[s],e[s])){n=!0;break}}}catch(t){u(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){u(String(t?.message||t))}e&&(t.prevDeps=e.slice())}}}nt(){for(const t of this.S){let e,n=!0;if(void 0!==t.deps)try{const s="function"==typeof t.deps?t.deps():t.deps;if(Array.isArray(s)&&(e=s,t.prevDeps&&t.prevDeps.length===e.length)){n=!1;for(let s=0;s<e.length;s++)if(!Object.is(t.prevDeps[s],e[s])){n=!0;break}}}catch(t){u(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())}}}K(t){const e=this.S.indexOf(t);if(-1!==e){if(t.cleanup)try{t.cleanup()}catch{}this.S.splice(e,1)}}J(t){const e=t.ct;if(e&&"string"==typeof e)return this.U.set(e,t),e;const n=`__scope_bind_${++this.q}__`;this.U.set(n,t);try{t.ct=n,t.toString=()=>n}catch{}return n}tt(){const t=(this.l?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 s=t[n];if(this.N(s))continue;const i=s.getAttribute("ref");i&&(e[i]?Array.isArray(e[i])?e[i].push(s):e[i]=[e[i],s]:e[i]=s)}}et(){const t=(this.l?this.m:this).querySelectorAll("*");for(let e=0;e<t.length;e++){const n=t[e];if(this.N(n))continue;if(0===n.attributes.length)continue;const s=n.attributes;for(let t=s.length-1;t>=0;t--){const e=s[t];if(!e.name.startsWith("on:"))continue;const i=e.name.slice(3),o=e.value,r=`__tinyHandler_${i}`,c=n[r];c&&n.removeEventListener(i,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(i,t)}}}}it(){const t=(this.l?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 s=t[n];if(this.N(s))continue;const i=s.getAttribute("ref");if(i&&(e[i]?Array.isArray(e[i])?e[i].push(s):e[i]=[e[i],s]:e[i]=s),s.attributes.length>0){const t=s.attributes;for(let e=t.length-1;e>=0;e--){const n=t[e];if(!n.name.startsWith("on:"))continue;const i=n.name.slice(3),o=n.value,r=`__tinyHandler_${i}`,c=s[r];c&&s.removeEventListener(i,c),s.removeAttribute(n.name);const h=this.actions[o];if(h&&"function"==typeof h){const t=t=>{h.call(this.actions,t)};s[r]=t,s.addEventListener(i,t)}}}}}W(){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 s=n[e];let i="";1===s.nodeType&&s.getAttribute&&(i=s.getAttribute("slot")||""),t.has(i)||t.set(i,[]),t.get(i).push(s)}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.l?this.m:this).querySelectorAll(`slot[data-scope-owner="${this.V}"]`);if(0!==e.length)for(let n=0;n<e.length;n++){const s=e[n],i=s.getAttribute("name")||"",o=t.get(i)||[];if(o.length){const t=document.createDocumentFragment();for(let e=0;e<o.length;e++){const n=o[e];let s;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 s=t.attributes[n];e.setAttribute(s.name,s.value)}for(const n of t.p.values())for(let t=0;t<n.length;t++)e.appendChild(n[t].cloneNode(!0));s=e}else s=n.cloneNode(!0);t.appendChild(s)}s.replaceWith(t)}else{const t=s.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]);s.replaceWith(t)}}}}Z(t,e,n){const s=`${t}::${e}`;let i=this.k.get(s);if(!i){const n=t=>{const n=t.target&&t.target.closest?t.target.closest(e):null;if(n)for(const e of i.handlers)try{e(t,n)}catch{}};i={eventType:t,selector:e,listener:n,handlers:new Set},this.k.set(s,i),this.m.addEventListener(t,n)}i.handlers.add(n)}G(t,e,n){const s=`${t}::${e}`,i=this.k.get(s);if(i&&(i.handlers.delete(n),0===i.handlers.size)){try{this.m.removeEventListener(t,i.listener)}catch{}this.k.delete(s)}}}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,l)}catch(t){String(t?.message||t)}}return l}const i=()=>({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,s={})=>{if("undefined"==typeof window||"undefined"==typeof matchMedia)return()=>{};const{immediate:i=!0}=s,o=matchMedia(t),r=t=>{n(t.matches,t)};return o.addEventListener("change",r),e.set(o,r),i&&n(o.matches,null),()=>{o.removeEventListener("change",r),e.delete(o)}}}}}),o=(t,e={})=>({name:"morph",extend:(n,s)=>{const{ignoreActiveValue:i=!0,callbacks:o}=e,r=t(),c=s,h=c.m,f=c.l?ShadowRoot.prototype:HTMLElement.prototype,u=Object.getOwnPropertyDescriptor(f,"innerHTML"),l=t=>{r.morph(h,t,{morphStyle:"innerHTML",ignoreActiveValue:i,callbacks:o})};let a=!0;return Object.defineProperty(h,"innerHTML",{set(t){a?(u.set.call(this,t),a=!1):l(t)},get(){return u.get.call(this)},configurable:!0}),n.onDestroy(()=>{delete h.innerHTML}),{morph:l}}}),r=()=>({name:"window",extend:t=>{const e=new Set,n=new Set,s=(t,n={})=>{if("undefined"==typeof window)return()=>{};const{immediate:s=!0}=n,i=e=>{t(window.innerWidth,window.innerHeight,e)};return window.addEventListener("resize",i),e.add(i),s&&i(new UIEvent("resize")),()=>{window.removeEventListener("resize",i),e.delete(i)}};return t.onDestroy(()=>{if("undefined"!=typeof window){for(const t of e)window.removeEventListener("resize",t);e.clear();for(const t of n)t.disconnect();n.clear()}}),{onViewportResize:s,onWindowResize:(t,e={})=>{if("undefined"==typeof window)return()=>{};if("undefined"==typeof ResizeObserver)return s((e,n,s)=>t(e,n,s),e);const{immediate:i=!0}=e,o=document.documentElement,r=new ResizeObserver(e=>{const n=e[0];if(!n)return;const{width:s,height:i}=n.contentRect;t(s,i,n)});if(r.observe(o),n.add(r),i){const e=o.getBoundingClientRect();t(e.width,e.height,new UIEvent("resize"))}return()=>{r.disconnect(),n.delete(r)}}}}}),c=()=>({name:"inview",extend:(t,e)=>{const n=new Set,s=(t,e,s={})=>{if("undefined"==typeof window||"undefined"==typeof IntersectionObserver)return()=>{};const{immediate:i=!0,...o}=s;let r=!i;const c=new IntersectionObserver(n=>{for(const s of n)s.target===t&&(r?r=!1:e(s.isIntersecting,s))},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)=>s(e,t,n),observeInView:(t,e,n)=>s(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 s=t();if(!s)return()=>{};const i=t=>{e(t)};s.on("scroll",i);const o={lenis:s,handler:i};return n.add(o),()=>{n.has(o)&&(n.delete(o),"function"==typeof s.off&&s.off("scroll",i))}}}}}),f=()=>({name:"timer",extend:t=>{const e=new Set,n=new Set,s=new Set,i={setTimeout:(t,n,...s)=>{let i;return i=setTimeout((...n)=>{e.delete(i),t(...n)},n,...s),e.add(i),i},setInterval:(t,e,...s)=>{const i=setInterval(t,e,...s);return n.add(i),i},raf:(t,e)=>{let n=0,i=!0,o=0;const r="number"==typeof e&&e>0?1e3/e:0,c=e=>{if(s.delete(n),i){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),s.add(n)}};return n=requestAnimationFrame(c),s.add(n),()=>{i&&(i=!1,s.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 s)cancelAnimationFrame(t);s.clear()}),{timer:i}}}),u=()=>({name:"mouse",extend:t=>{const e=new Map,n=(t,n)=>{if("undefined"==typeof window)return()=>{};const s=t=>{const e=t;n(e.clientX,e.clientY,e)};window.addEventListener(t,s);let i=e.get(t);return i||(i=new Set,e.set(t,i)),i.add(s),()=>{window.removeEventListener(t,s),i?.delete(s)}};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 s=e.get("wheel");return s||(s=new Set,e.set("wheel",s)),s.add(n),()=>{window.removeEventListener("wheel",n),s?.delete(n)}})(t)}}}),l=t=>Array.isArray(t),a=t=>null!=t&&"object"==typeof t&&!Array.isArray(t),d=t=>l(t)?t.slice():a(t)?{...t}:t,m=(t,e)=>{if(l(t)&&l(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),s=Object.keys(e);if(n.length!==s.length)return!1;for(const s of n){if(!(s in e))return!1;if(!Object.is(t[s],e[s]))return!1}return!0}return!(l(t)||l(e)||a(t)||a(e))&&Object.is(t,e)},p=(t,e)=>Array.from({length:e},()=>t),y=(t,e)=>e.reduce((e,n)=>(e[n]=t,e),{}),w=({from:t,to:e,velocity:n,label:s})=>{const i={value:t,target:e,velocity:n,arrayLength:null,objectKeys:null,normalizeInput:t=>t},o=t=>{if(null==i.arrayLength){if(null!=i.objectKeys)throw new Error(`${s} value shape mismatch (array vs object).`);i.arrayLength=t,l(i.value)||(i.value=p(i.value,t)),l(i.target)||(i.target=p(i.target,t)),void 0===i.velocity||l(i.velocity)||(i.velocity=p(i.velocity,t))}},r=t=>{if(null==i.objectKeys){if(null!=i.arrayLength)throw new Error(`${s} value shape mismatch (object vs array).`);i.objectKeys=t,a(i.value)||(i.value=y(i.value,t)),a(i.target)||(i.target=y(i.target,t)),void 0===i.velocity||a(i.velocity)||(i.velocity=y(i.velocity,t))}},c=t=>{if(l(t)){if(null!=i.objectKeys)throw new Error(`${s} value shape mismatch (array vs object).`);if(null==i.arrayLength&&o(t.length),t.length!==i.arrayLength)throw new Error(`${s} value length mismatch (expected ${i.arrayLength}, got ${t.length}).`);return t.slice()}if(a(t)){if(null!=i.arrayLength)throw new Error(`${s} value shape mismatch (object vs array).`);const e=Object.keys(t);if(null==i.objectKeys&&r(e),i.objectKeys&&e.length!==i.objectKeys.length)throw new Error(`${s} value keys mismatch (expected ${i.objectKeys.length}, got ${e.length}).`);if(i.objectKeys)for(const e of i.objectKeys)if(!(e in t))throw new Error(`${s} value keys mismatch (missing key "${e}").`);return{...t}}return null!=i.arrayLength?p(t,i.arrayLength):null!=i.objectKeys?y(t,i.objectKeys):t};i.normalizeInput=c;const h=l(t)||l(e)||void 0!==n&&l(n),f=a(t)||a(e)||void 0!==n&&a(n);if(h&&f)throw new Error(`${s} value shape mismatch (array vs object).`);if(h){const s=l(t)?t.length:l(e)?e.length:n.length;o(s),i.value=c(t),i.target=c(e),void 0!==i.velocity&&(i.velocity=c(i.velocity))}else if(f){const s=a(t)?Object.keys(t):a(e)?Object.keys(e):Object.keys(n);r(s),i.value=c(t),i.target=c(e),void 0!==i.velocity&&(i.velocity=c(i.velocity))}return i};let g={x:-1,y:-1};const b={stiffness:300,damping:30,mass:1},v=()=>({name:"pointer",extend:e=>{const{onMouseMove:n}=u().extend(e,e.host),{timer:s}=f().extend(e,e.host);g.x=window.innerWidth/2,g.y=window.innerHeight/2;const i={x:t({from:g.x,to:g.x,...b}),y:t({from:g.y,to:g.y,...b})};return n((t,e)=>{i.x.setTarget(t),i.y.setTarget(e)}),{onPointerMove:t=>{let e=g.x,n=g.y;s.raf(s=>{const o=i.x.next(s),r=i.y.next(s);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:s=.001,resumeOnTarget:i=!0}={}){function o(){return d(f)}function r(t){if(y)return o();const e=(t=>t<0?0:t>1?1:t)(n);if(0===e)return o();if(1===e)return f=d(u),c.value=f,y=!0,o();const i=t>0?1-Math.pow(1-e,60*t):0;if(l(f)&&l(u)){let t=!0;for(let e=0;e<f.length;e+=1)f[e]+=(u[e]-f[e])*i,Math.abs(u[e]-f[e])>=s&&(t=!1);if(t){for(let t=0;t<f.length;t+=1)f[t]=u[t];y=!0}return c.value=f,d(f)}if(a(f)&&a(u)){const t=c.objectKeys??Object.keys(f);let e=!0;for(const n of t)f[n]+=(u[n]-f[n])*i,Math.abs(u[n]-f[n])>=s&&(e=!1);if(e){for(const e of t)f[e]=u[e];y=!0}return c.value=f,d(f)}const r=u;return f+=(r-f)*i,c.value=f,Math.abs(r-f)<s&&(f=r,c.value=f,y=!0),f}const c=w({from:t,to:e,label:"Lerp"}),h=c.normalizeInput;let f=c.value,u=c.target,p=null,y=!1;const g=new Set;return{setTarget:function(t){const e=h(t),n=!m(e,u);if(u=e,c.target=e,f=c.value,i&&y&&n){y=!1,p=null;for(const t of g)t(u)}},setValue:function(t,e={}){const{resetTime:n=!0,setTarget:s=!1,markDone:i=!1}=e;f=h(t),c.value=f,s&&(u=d(f),c.target=u);const o=y||!m(f,u);if(n&&(p=null),i&&(y=!0),o&&!i){y=!1,p=null;for(const t of g)t(u)}},getValue:o,isDone:function(){return y},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 s=e,i=o();for(;s>0&&!y;){const t=Math.min(s,n);i=r(t),s-=t}return i}}}(t),runLerp:(t,s,i={})=>{const{fps:o,immediate:r=!0,stopWhenDone:c=!0}=i;let h=!1,f=null;r&&s(t.getValue(),t);const u=()=>{f||(f=e.raf(e=>{if(h)return;const n=t.next(e);s(n,t),c&&t.isDone()&&l()},o))},l=()=>{f&&(f(),f=null)};u();const a=t.onResume(()=>{!h&&c&&(r&&s(t.getValue(),t),u())}),d=()=>{h||(h=!0,a(),l(),n.delete(d))};return n.add(d),d}}}}),j=()=>({name:"spring",extend:e=>{const{timer:n}=f().extend(e,e.host),s=new Set;return e.onDestroy(()=>{for(const t of s)t();s.clear()}),{createSpring:e=>t(e),runSpring:(t,e,i={})=>{const{fps:o,immediate:r=!0,stopWhenDone:c=!0}=i;let h=!1,f=null;r&&e(t.getValue(),t);const u=()=>{f||(f=n.raf(n=>{if(h)return;const s=t.next(n);e(s,t),c&&t.isDone()&&l()},o))},l=()=>{f&&(f(),f=null)};u();const a=t.onResume(()=>{!h&&c&&(r&&e(t.getValue(),t),u())}),d=()=>{h||(h=!0,a(),l(),s.delete(d))};return s.add(d),d}}}}),M="0.0.1",O=/\{([A-Za-z_$][\w$]*)\}/g,_="bind:";export{M as SCOPE_VERSION,s as define,i as devicePlugin,c as inViewPlugin,h as lenisPlugin,S as lerpPlugin,o as morphPlugin,u as mousePlugin,v as pointerPlugin,j as springPlugin,f as timerPlugin,r as windowPlugin};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|
package/dist/plugins/index.d.ts
CHANGED
|
@@ -5,4 +5,7 @@ export { inViewPlugin, type InViewControls, type InViewHandler, type InViewOptio
|
|
|
5
5
|
export { lenisPlugin, type LenisControls, type LenisGetter, type LenisInstance, type LenisScrollEvent, type LenisScrollHandler, } from './lenis';
|
|
6
6
|
export { timerPlugin, type TimerControls, type TimerIntervalHandle, type TimerRafCallback, type TimerRafUnsubscribe, type TimerTimeoutHandle, } from './timer';
|
|
7
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';
|
|
8
11
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +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"}
|
|
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"}
|
|
@@ -1 +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 {};
|
|
1
42
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/lerp/index.ts"],"names":[],"mappings":""}
|
|
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,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
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/pointer/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAwB,MAAM,aAAa,CAAC;AACzE,OAAO,EAAe,KAAK,aAAa,EAAE,MAAM,UAAU,CAAC;AAW3D,+CAA+C;AAC/C,MAAM,MAAM,eAAe,GAAG;IAC5B,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACX,CAAC;AAEF,mFAAmF;AACnF,MAAM,MAAM,kBAAkB,GAAG,CAAC,GAAG,EAAE,eAAe,KAAK,IAAI,CAAC;AAEhE;;;;;;;;;;;;GAYG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B;;;;;;;;;;;;;OAaG;IACH,aAAa,EAAE,CAAC,OAAO,EAAE,kBAAkB,KAAK,IAAI,CAAC;IACrD,0EAA0E;IAC1E,WAAW,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;CAC3C,CAAC;AAoCF;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,aAAa,QAAO,eAAe,CAAC,eAAe,CAsD9D,CAAC"}
|
|
@@ -1 +1,42 @@
|
|
|
1
|
+
import type { ComponentPlugin } from '../../index';
|
|
2
|
+
import { spring } from '@petit-kit/animate';
|
|
3
|
+
type SpringValue = number | number[] | Record<string, number>;
|
|
4
|
+
type SpringOptions<T extends SpringValue = number> = Parameters<typeof spring<T>>[0];
|
|
5
|
+
type SpringController<T extends SpringValue = number> = ReturnType<typeof spring<T>>;
|
|
6
|
+
export type SpringControls = {
|
|
7
|
+
/**
|
|
8
|
+
* Create an independent spring controller.
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* const springX = createSpring({ from: 0, to: 1, stiffness: 200 });
|
|
12
|
+
* springX.setTarget(1);
|
|
13
|
+
*/
|
|
14
|
+
createSpring: <T extends SpringValue>(options?: SpringOptions<T>) => SpringController<T>;
|
|
15
|
+
/**
|
|
16
|
+
* Drive a spring controller on the scoped timer RAF.
|
|
17
|
+
*
|
|
18
|
+
* @example
|
|
19
|
+
* const scale = createSpring({ from: 0, to: 1 });
|
|
20
|
+
* const stop = runSpring(scale, (value) => {
|
|
21
|
+
* host.updateState({ scale: value });
|
|
22
|
+
* });
|
|
23
|
+
*/
|
|
24
|
+
runSpring: <T extends SpringValue>(controller: SpringController<T>, onUpdate: (value: T, controller: SpringController<T>) => void, options?: {
|
|
25
|
+
fps?: number;
|
|
26
|
+
immediate?: boolean;
|
|
27
|
+
stopWhenDone?: boolean;
|
|
28
|
+
}) => () => void;
|
|
29
|
+
};
|
|
30
|
+
/**
|
|
31
|
+
* Scoped spring plugin built on top of the timer plugin.
|
|
32
|
+
*
|
|
33
|
+
* @example
|
|
34
|
+
* define("my-component", { plugins: [springPlugin()] }, ({ createSpring, runSpring, host }) => {
|
|
35
|
+
* const scale = createSpring({ from: 0.8, to: 1 });
|
|
36
|
+
* runSpring(scale, (value) => host.updateState({ scale: value }));
|
|
37
|
+
* return () => `<div bind:style="transform: scale({scale})"></div>`;
|
|
38
|
+
* });
|
|
39
|
+
*/
|
|
40
|
+
export declare const springPlugin: () => ComponentPlugin<SpringControls>;
|
|
41
|
+
export {};
|
|
1
42
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/spring/index.ts"],"names":[],"mappings":""}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/plugins/spring/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAwB,MAAM,aAAa,CAAC;AACzE,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAC;AAI5C,KAAK,WAAW,GAAG,MAAM,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC9D,KAAK,aAAa,CAAC,CAAC,SAAS,WAAW,GAAG,MAAM,IAAI,UAAU,CAC7D,OAAO,MAAM,CAAC,CAAC,CAAC,CACjB,CAAC,CAAC,CAAC,CAAC;AACL,KAAK,gBAAgB,CAAC,CAAC,SAAS,WAAW,GAAG,MAAM,IAAI,UAAU,CAChE,OAAO,MAAM,CAAC,CAAC,CAAC,CACjB,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B;;;;;;OAMG;IACH,YAAY,EAAE,CAAC,CAAC,SAAS,WAAW,EAClC,OAAO,CAAC,EAAE,aAAa,CAAC,CAAC,CAAC,KACvB,gBAAgB,CAAC,CAAC,CAAC,CAAC;IACzB;;;;;;;;OAQG;IACH,SAAS,EAAE,CAAC,CAAC,SAAS,WAAW,EAC/B,UAAU,EAAE,gBAAgB,CAAC,CAAC,CAAC,EAC/B,QAAQ,EAAE,CAAC,KAAK,EAAE,CAAC,EAAE,UAAU,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAK,IAAI,EAC7D,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,YAAY,QAAO,eAAe,CAAC,cAAc,CAyE5D,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@petit-kit/scoped",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.3",
|
|
4
4
|
"description": "A lightweight, reactive web component framework with built-in plugins for modern web development.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"web-components",
|
|
@@ -44,6 +44,9 @@
|
|
|
44
44
|
"tslib": "^2.8.1",
|
|
45
45
|
"typescript": "^5.7.2"
|
|
46
46
|
},
|
|
47
|
+
"dependencies": {
|
|
48
|
+
"@petit-kit/animate": "^0.0.1"
|
|
49
|
+
},
|
|
47
50
|
"scripts": {
|
|
48
51
|
"build": "npm run clean && npm run format && rollup -c && npm run build:types",
|
|
49
52
|
"build:types": "tsc -p tsconfig.declarations.json",
|