masoneffect 2.0.10 β 2.0.12
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 +2 -2
- package/dist/core/typing/index.d.ts +2 -0
- package/dist/core/typing/index.d.ts.map +1 -1
- package/dist/count/core/typing/index.d.ts +2 -0
- package/dist/count/core/typing/index.d.ts.map +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.mjs +1 -1
- package/dist/react/core/typing/index.d.ts +2 -0
- package/dist/react/count/core/typing/index.d.ts +2 -0
- package/dist/react/count/core/typing/index.d.ts.map +1 -1
- package/dist/react/scrollFadeIn/core/typing/index.d.ts +2 -0
- package/dist/react/scrollFadeIn/core/typing/index.d.ts.map +1 -1
- package/dist/react/textToParticle/core/typing/index.d.ts +2 -0
- package/dist/react/textToParticle/core/typing/index.d.ts.map +1 -1
- package/dist/react/typing/core/typing/index.d.ts +2 -0
- package/dist/react/typing/core/typing/index.d.ts.map +1 -1
- package/dist/react/typing/index.cjs +1 -1
- package/dist/react/typing/index.mjs +1 -1
- package/dist/scrollFadeIn/core/typing/index.d.ts +2 -0
- package/dist/scrollFadeIn/core/typing/index.d.ts.map +1 -1
- package/dist/svelte/count/index.d.ts +2 -0
- package/dist/svelte/index.cjs +1 -1
- package/dist/svelte/index.d.ts +2 -0
- package/dist/svelte/index.mjs +53 -1
- package/dist/svelte/scrollFadeIn/index.d.ts +2 -0
- package/dist/svelte/textToParticle/index.d.ts +2 -0
- package/dist/svelte/typing/index.cjs +1 -1
- package/dist/svelte/typing/index.d.ts +2 -0
- package/dist/svelte/typing/index.mjs +53 -1
- package/dist/textToParticle/core/typing/index.d.ts +2 -0
- package/dist/textToParticle/core/typing/index.d.ts.map +1 -1
- package/dist/typing/core/typing/index.d.ts +2 -0
- package/dist/typing/core/typing/index.d.ts.map +1 -1
- package/dist/typing/index.cjs +1 -1
- package/dist/typing/index.mjs +1 -1
- package/dist/vue/count/index.d.ts +2 -0
- package/dist/vue/index.cjs +1 -1
- package/dist/vue/index.d.ts +2 -0
- package/dist/vue/index.mjs +53 -1
- package/dist/vue/scrollFadeIn/index.d.ts +2 -0
- package/dist/vue/textToParticle/index.d.ts +2 -0
- package/dist/vue/typing/index.cjs +1 -1
- package/dist/vue/typing/index.d.ts +2 -0
- package/dist/vue/typing/index.mjs +53 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# MasonEffect 
|
|
2
2
|
|
|
3
|
-
**Release version 2.0.
|
|
3
|
+
**Release version 2.0.12**
|
|
4
4
|
|
|
5
5
|
A collection of animation effects library. Supports React, Vue, Svelte, and vanilla JavaScript with **Tree-shaking** support.
|
|
6
6
|
|
|
@@ -594,7 +594,7 @@ npm run serve
|
|
|
594
594
|
## π¦ CDN Usage (UMD)
|
|
595
595
|
|
|
596
596
|
```html
|
|
597
|
-
<script src="https://cdn.jsdelivr.net/npm/masoneffect@2.0.
|
|
597
|
+
<script src="https://cdn.jsdelivr.net/npm/masoneffect@2.0.12/dist/index.umd.min.js"></script>
|
|
598
598
|
<script>
|
|
599
599
|
// TextToParticle (MasonEffect alias for backward compatibility)
|
|
600
600
|
const container = document.getElementById('my-container');
|
|
@@ -40,6 +40,7 @@ export declare class Typing {
|
|
|
40
40
|
originalText: string;
|
|
41
41
|
constructor(container: HTMLElement | string, options: TypingOptions);
|
|
42
42
|
init(): void;
|
|
43
|
+
private injectStyles;
|
|
43
44
|
setupVisibilityManager(): void;
|
|
44
45
|
private buildTextFromUnits;
|
|
45
46
|
start(): void;
|
|
@@ -47,6 +48,7 @@ export declare class Typing {
|
|
|
47
48
|
stop(): void;
|
|
48
49
|
reset(): void;
|
|
49
50
|
updateDisplay(text: string): void;
|
|
51
|
+
private escapeHtml;
|
|
50
52
|
setText(newText: string): void;
|
|
51
53
|
destroy(): void;
|
|
52
54
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;IAWZ,OAAO,CAAC,YAAY;IAuBpB,sBAAsB,IAAI,IAAI;IAmB9B,OAAO,CAAC,kBAAkB;IAgD1B,KAAK,IAAI,IAAI;IASb,QAAQ,IAAI,IAAI;IAuChB,IAAI,IAAI,IAAI;IAQZ,KAAK,IAAI,IAAI;IAQb,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAiDjC,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAa9B,OAAO,IAAI,IAAI;CAOhB;AAGD,eAAe,MAAM,CAAC"}
|
|
@@ -40,6 +40,7 @@ export declare class Typing {
|
|
|
40
40
|
originalText: string;
|
|
41
41
|
constructor(container: HTMLElement | string, options: TypingOptions);
|
|
42
42
|
init(): void;
|
|
43
|
+
private injectStyles;
|
|
43
44
|
setupVisibilityManager(): void;
|
|
44
45
|
private buildTextFromUnits;
|
|
45
46
|
start(): void;
|
|
@@ -47,6 +48,7 @@ export declare class Typing {
|
|
|
47
48
|
stop(): void;
|
|
48
49
|
reset(): void;
|
|
49
50
|
updateDisplay(text: string): void;
|
|
51
|
+
private escapeHtml;
|
|
50
52
|
setText(newText: string): void;
|
|
51
53
|
destroy(): void;
|
|
52
54
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;IAWZ,OAAO,CAAC,YAAY;IAuBpB,sBAAsB,IAAI,IAAI;IAmB9B,OAAO,CAAC,kBAAkB;IAgD1B,KAAK,IAAI,IAAI;IASb,QAAQ,IAAI,IAAI;IAuChB,IAAI,IAAI,IAAI;IAQZ,KAAK,IAAI,IAAI;IAQb,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAiDjC,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAa9B,OAAO,IAAI,IAAI;CAOhB;AAGD,eAAe,MAAM,CAAC"}
|
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,"t",{value:!0});class t{constructor(t,i={}){this.container=t,this.options={threshold:i.threshold??.1,rootMargin:i.rootMargin??"0px",root:i.root??null,onVisible:i.onVisible,onHidden:i.onHidden},this.intersectionObserver=null,this.visibilityChangeHandler=null,this.isVisible=!1,this.isPageVisible="undefined"==typeof document||!document.hidden,this.setupIntersectionObserver(),this.setupPageVisibility()}setupIntersectionObserver(){if("undefined"==typeof window||void 0===window.IntersectionObserver)return this.isVisible=!0,void(this.isPageVisible&&this.options.onVisible&&this.options.onVisible());this.intersectionObserver=new IntersectionObserver(t=>{for(const i of t)i.target===this.container&&(i.isIntersecting?(this.isVisible=!0,this.isPageVisible&&this.options.onVisible&&this.options.onVisible()):(this.isVisible=!1,this.options.onHidden&&this.options.onHidden()))},{threshold:this.options.threshold,rootMargin:this.options.rootMargin,root:this.options.root||null}),this.intersectionObserver.observe(this.container)}setupPageVisibility(){"undefined"!=typeof document&&(this.visibilityChangeHandler=()=>{const t=this.isPageVisible;this.isPageVisible=!document.hidden,document.hidden?this.options.onHidden&&this.options.onHidden():t!==this.isPageVisible&&this.isVisible&&this.options.onVisible&&this.options.onVisible()},document.addEventListener("visibilitychange",this.visibilityChangeHandler),document.hidden&&this.isVisible&&this.options.onHidden&&this.options.onHidden())}getIsVisible(){return this.isVisible&&this.isPageVisible}updateOptions(t){this.options={...this.options,...t},this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.setupIntersectionObserver()}destroy(){this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.visibilityChangeHandler&&"undefined"!=typeof document&&(document.removeEventListener("visibilitychange",this.visibilityChangeHandler),this.visibilityChangeHandler=null)}}function i(t,i){let s=null;return function(...h){null!==s&&clearTimeout(s),s=setTimeout(()=>{s=null,t.apply(this,h)},i)}}class s{constructor(t,s={}){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={text:s.text||"mason effect",densityStep:s.densityStep??2,maxParticles:s.maxParticles??3200,pointSize:s.pointSize??.5,ease:s.ease??.05,repelRadius:s.repelRadius??150,repelStrength:s.repelStrength??1,particleColor:s.particleColor||"#fff",fontFamily:s.fontFamily||"Inter, system-ui, Arial",fontSize:s.fontSize||null,width:s.width||null,height:s.height||null,devicePixelRatio:s.devicePixelRatio??null,onReady:s.onReady||null,onUpdate:s.onUpdate||null},this.canvas=document.createElement("canvas");const h=this.canvas.getContext("2d",{willReadFrequently:!0});if(!h)throw new Error("Canvas context not available");this.ctx=h,this.container.appendChild(this.canvas),this.canvas.style.display="block",this.offCanvas=document.createElement("canvas");const e=this.offCanvas.getContext("2d",{willReadFrequently:!0});if(!e)throw new Error("Offscreen canvas context not available");this.offCtx=e,this.W=0,this.H=0,this.DPR=this.config.devicePixelRatio||Math.min(window.devicePixelRatio||1,1.8),this.particles=[],this.mouse={x:0,y:0,down:!1},this.animationId=null,this.isRunning=!1,this.visibilityManager=null,this.debounceDelay=s.debounceDelay??150;const n=this.handleResize.bind(this);this.handleResize=i(n,this.debounceDelay),this.handleMouseMove=this.handleMouseMove.bind(this),this.handleMouseLeave=this.handleMouseLeave.bind(this),this.handleMouseDown=this.handleMouseDown.bind(this),this.handleMouseUp=this.handleMouseUp.bind(this),this.i=i(this.h.bind(this),this.debounceDelay),this.o=i(this.l.bind(this),this.debounceDelay),this.init()}init(){this.resize(),this.setupEventListeners(),this.setupVisibilityManager(),this.config.onReady&&this.config.onReady(this)}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:.1,onVisible:()=>{this.start()},onHidden:()=>{this.stop()}})}resize(){const t=this.container.getBoundingClientRect(),i=this.config.width||t.width||this.container.clientWidth||window.innerWidth,s=this.config.height||t.height||this.container.clientHeight||.7*window.innerHeight;if(i<=0||s<=0)return;this.W=Math.floor(i*this.DPR),this.H=Math.floor(s*this.DPR);const h=4096;if(this.W>h||this.H>h){const t=Math.min(h/this.W,h/this.H);this.W=Math.floor(this.W*t),this.H=Math.floor(this.H*t),this.DPR=this.DPR*t}this.canvas.width=this.W,this.canvas.height=this.H,this.canvas.style.width=i+"px",this.canvas.style.height=s+"px",this.W>0&&this.H>0&&(this.buildTargets(),this.particles.length||this.initParticles())}measureTextFit(t,i,s,h){this.offCtx.font=`400 ${t}px ${this.config.fontFamily}`;const e=i.split("\n"),n=t,o=.1*t,r=.05*t;let a=0;for(const t of e){if(0===t.length)continue;const i=this.offCtx.measureText(t).width+r*(t.length>0?t.length-1:0);a=Math.max(a,i)}const l=e.length>0?n*e.length+o*(e.length-1):n;return{width:a,height:l,fits:a<=s&&l<=h}}findOptimalFontSize(t,i,s,h){if(this.measureTextFit(h,t,i,s).fits)return h;if(h<=12)return 12;let e=12,n=h,o=12;for(;e<=n;){const h=Math.floor((e+n)/2);this.measureTextFit(h,t,i,s).fits?(o=h,e=h+1):n=h-1}return o}buildTargets(){if(this.W<=0||this.H<=0)return;const t=this.config.text;this.offCanvas.width=this.W,this.offCanvas.height=this.H,this.offCtx.clearRect(0,0,this.offCanvas.width,this.offCanvas.height);const i=Math.min(this.W,this.H),s=this.config.fontSize||Math.max(80,Math.floor(.18*i)),h=this.W-80,e=this.H-80,n=this.findOptimalFontSize(t,h,e,s);this.offCtx.fillStyle="#ffffff",this.offCtx.textAlign="center",this.offCtx.textBaseline="middle",this.offCtx.font=`400 ${n}px ${this.config.fontFamily}`;const o=t.split("\n"),r=n,a=.1*n,l=.05*n,u=o.length>0?r*o.length+a*(o.length-1):r;let c=this.H/2-u/2+r/2;for(const t of o){if(0===t.length){c+=r+a;continue}const i=t.split(""),s=this.offCtx.measureText(t).width+l*(i.length>0?i.length-1:0);let h=this.W/2-s/2;for(const t of i)this.offCtx.fillText(t,h+this.offCtx.measureText(t).width/2,c),h+=this.offCtx.measureText(t).width+l;c+=r+a}const d=Math.max(2,this.config.densityStep),f=this.offCtx.getImageData(0,0,this.W,this.H).data,p=[];for(let t=0;t<this.H;t+=d)for(let i=0;i<this.W;i+=d){const s=4*(t*this.W+i);f[s]+f[s+1]+f[s+2]>600&&p.push({x:i,y:t})}for(;p.length>this.config.maxParticles;)p.splice(Math.floor(Math.random()*p.length),1);if(this.particles.length<p.length){const t=p.length-this.particles.length;for(let i=0;i<t;i++)this.particles.push(this.makeParticle())}else this.particles.length>p.length&&(this.particles.length=p.length);for(let t=0;t<this.particles.length;t++){const i=this.particles[t],s=p[t];i.tx=s.x,i.ty=s.y}}makeParticle(){const t=Math.random()*this.W,i=Math.random()*this.H;return{x:t,y:i,vx:0,vy:0,tx:t,ty:i,initialX:t,initialY:i,j:Math.random()*Math.PI*2}}initParticles(){for(const t of this.particles){const i=Math.random()*this.W,s=Math.random()*this.H;t.x=i,t.y=s,t.vx=t.vy=0,t.initialX=i,t.initialY=s}}scatter(){for(const t of this.particles)void 0!==t.initialX&&void 0!==t.initialY?(t.tx=t.initialX,t.ty=t.initialY):(t.initialX=t.x,t.initialY=t.y,t.tx=t.initialX,t.ty=t.initialY)}morph(t){this.i(t)}h(t){if(0!==this.W&&0!==this.H||this.resize(),"string"==typeof t)this.config.text=t,this.buildTargets();else if(t&&"object"==typeof t){const i=void 0!==t.text;this.config={...this.config,...t},i&&this.buildTargets()}else this.buildTargets()}update(){this.ctx.clearRect(0,0,this.W,this.H);for(const t of this.particles){let i=(t.tx-t.x)*this.config.ease,s=(t.ty-t.y)*this.config.ease;if(this.mouse.x||this.mouse.y){const h=t.x-this.mouse.x,e=t.y-this.mouse.y,n=h*h+e*e,o=this.config.repelRadius*this.DPR;if(n<o*o){const t=Math.sqrt(n)+1e-4,r=(this.mouse.down?-1:1)*this.config.repelStrength*(1-t/o);i+=h/t*r*6,s+=e/t*r*6}}t.j+=2,i+=.05*Math.cos(t.j),s+=.05*Math.sin(1.3*t.j),t.vx=(t.vx+i)*Math.random(),t.vy=(t.vy+s)*Math.random(),t.x+=t.vx,t.y+=t.vy}this.ctx.fillStyle=this.config.particleColor;const t=Math.min(this.W,this.H)/this.DPR,i=Math.max(.5,Math.min(2,t/1920)),s=this.config.pointSize*this.DPR*i;for(const t of this.particles)this.ctx.beginPath(),this.ctx.arc(t.x,t.y,s,0,2*Math.PI),this.ctx.fill();this.config.onUpdate&&this.config.onUpdate(this)}animate(){this.isRunning&&(this.update(),this.animationId=requestAnimationFrame(()=>this.animate()))}start(){this.isRunning||(this.isRunning=!0,this.animate())}stop(){this.isRunning=!1,this.animationId&&(cancelAnimationFrame(this.animationId),this.animationId=null)}setupEventListeners(){window.addEventListener("resize",this.handleResize),this.canvas.addEventListener("mousemove",this.handleMouseMove),this.canvas.addEventListener("mouseleave",this.handleMouseLeave),this.canvas.addEventListener("mousedown",this.handleMouseDown),window.addEventListener("mouseup",this.handleMouseUp)}removeEventListeners(){window.removeEventListener("resize",this.handleResize),this.canvas.removeEventListener("mousemove",this.handleMouseMove),this.canvas.removeEventListener("mouseleave",this.handleMouseLeave),this.canvas.removeEventListener("mousedown",this.handleMouseDown),window.removeEventListener("mouseup",this.handleMouseUp)}handleResize(){this.resize()}handleMouseMove(t){const i=this.canvas.getBoundingClientRect();this.mouse.x=(t.clientX-i.left)*this.DPR,this.mouse.y=(t.clientY-i.top)*this.DPR}handleMouseLeave(){this.mouse.x=this.mouse.y=0}handleMouseDown(){this.mouse.down=!0}handleMouseUp(){this.mouse.down=!1}updateConfig(t){this.o(t)}l(t){this.config={...this.config,...t},t.text&&this.buildTargets()}destroy(){this.stop(),this.removeEventListeners(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.canvas&&this.canvas.parentNode&&this.canvas.parentNode.removeChild(this.canvas)}}const h={linear:t=>t,easeInQuad:t=>t*t,easeOutQuad:t=>t*(2-t),easeInOutQuad:t=>t<.5?2*t*t:(4-2*t)*t-1,easeOutCubic:t=>--t*t*t+1};function e(t){const i=t.charCodeAt(0);if(i<44032||i>55203)return[t];const s=i-44032,h=Math.floor(s/588),e=Math.floor(s%588/28),n=s%28,o=[];return o.push(["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][h]),o.push(["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"][e]),n>0&&o.push(["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][n]),o}function n(t,i,s){const h=["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(t),e=["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"].indexOf(i),n=s?["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(s):0;if(-1===h||-1===e)return t+(i||"")+(s||"");const o=44032+21*h*28+28*e+n;return String.fromCharCode(o)}function o(t){const i=[],s=[];for(let h=0;h<t.length;h++){const n=t[h],o=n.charCodeAt(0),r=i.length;if(o>=44032&&o<=55203){const t=e(n);i.push(...t),s.push({start:r,end:i.length,isHangul:!0})}else i.push(n),s.push({start:r,end:i.length,isHangul:!1})}return{units:i,charUnitRanges:s}}const r=t=>--t*t*t+1;exports.Count=class{constructor(t,i){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={targetValue:i.targetValue,duration:i.duration??2e3,startValue:i.startValue??0,enabled:i.enabled??!0,easing:i.easing??h.linear,threshold:i.threshold??.2,rootMargin:i.rootMargin??"0px 0px -100px 0px",triggerOnce:i.triggerOnce??!1,onUpdate:i.onUpdate||null,onComplete:i.onComplete||null},this.currentValue=this.config.startValue,this.startTime=null,this.animationFrameId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(this.config.startValue),this.setupVisibilityManager()}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,this.start())},onHidden:()=>{!this.config.triggerOnce&&this.isRunning&&this.reset()}})}start(){if(this.isRunning)return;if(!this.config.enabled)return;this.isRunning=!0,this.startTime=null,this.currentValue=this.config.startValue,this.updateDisplay(this.currentValue);const t=i=>{null===this.startTime&&(this.startTime=i);const s=i-this.startTime,h=Math.min(s/this.config.duration,1),e=this.config.easing(h);this.currentValue=Math.floor(this.config.startValue+(this.config.targetValue-this.config.startValue)*e),this.updateDisplay(this.currentValue),this.config.onUpdate&&this.config.onUpdate(this.currentValue),h<1?this.animationFrameId=requestAnimationFrame(t):(this.currentValue=this.config.targetValue,this.updateDisplay(this.currentValue),this.isRunning=!1,this.config.onComplete&&this.config.onComplete())};this.animationFrameId=requestAnimationFrame(t)}stop(){this.isRunning=!1,null!==this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}reset(){this.stop(),this.currentValue=this.config.startValue,this.updateDisplay(this.currentValue),this.hasTriggered=!1,this.startTime=null}updateDisplay(t){this.container.textContent=this.formatNumber(t)}formatNumber(t){return Math.floor(t).toLocaleString()}updateConfig(t){const i=this.isRunning;this.stop(),this.config={...this.config,...t,onUpdate:void 0!==t.onUpdate?t.onUpdate:this.config.onUpdate,onComplete:void 0!==t.onComplete?t.onComplete:this.config.onComplete},void 0!==t.targetValue?(this.reset(),i&&this.config.enabled&&this.start()):i&&this.config.enabled&&this.start()}getValue(){return this.currentValue}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}},exports.MasonEffect=s,exports.ScrollFadeIn=class{constructor(t,i={}){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={direction:i.direction??"bottom",distance:i.distance??"50px",duration:i.duration??800,threshold:i.threshold??.1,rootMargin:i.rootMargin??"0px",root:i.root??null,triggerOnce:i.triggerOnce??!1,enabled:i.enabled??!0,onStart:i.onStart||null,onComplete:i.onComplete||null},this.easing=r,this.visibilityManager=null,this.animationFrameId=null,this.startTime=null,this.isRunning=!1,this.hasTriggered=!1,this.initialTransform="",this.targetDistance=0,this.init()}init(){const t=window.getComputedStyle(this.container);this.initialTransform="none"!==t.transform?t.transform:this.container.style.transform||"",this.targetDistance=this.parseDistance(this.config.distance),this.setInitialPosition(),this.setupVisibilityManager()}parseDistance(t){const i=t.match(/^(-?\d+\.?\d*)(px|rem|em|%|vh|vw)$/);if(!i)return parseFloat(t)||50;const s=parseFloat(i[1]);switch(i[2]){case"px":default:return s;case"rem":case"em":return s*(parseFloat(getComputedStyle(document.documentElement).fontSize)||16);case"%":const t=this.container.getBoundingClientRect();return s/100*("top"===this.config.direction||"bottom"===this.config.direction?t.height:t.width);case"vh":return s/100*window.innerHeight;case"vw":return s/100*window.innerWidth}}setInitialPosition(){let t=0,i=0;switch(this.config.direction){case"top":i=-this.targetDistance;break;case"right":t=this.targetDistance;break;case"bottom":i=this.targetDistance;break;case"left":t=-this.targetDistance}const s=this.initialTransform||"",h=`translate(${t}px, ${i}px)`;this.container.style.transform=s&&"none"!==s?`${h} ${s}`:h,this.container.style.opacity="0",this.container.style.transition="none"}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,root:this.config.root,onVisible:()=>{this.config.enabled&&(this.config.triggerOnce&&this.hasTriggered||(this.hasTriggered=!0,this.start()))},onHidden:()=>{this.config.enabled&&(this.stop(),this.config.triggerOnce||(this.hasTriggered=!1),this.setInitialPosition())}})}start(){this.isRunning||(this.isRunning=!0,this.startTime=performance.now(),this.config.onStart&&this.config.onStart(),this.container.style.transition="none",this.animate())}animate(){if(!this.isRunning)return;const t=performance.now()-(this.startTime||0),i=Math.min(t/this.config.duration,1),s=this.easing(i);let h=0,e=0;switch(this.config.direction){case"top":e=-this.targetDistance*(1-s);break;case"right":h=this.targetDistance*(1-s);break;case"bottom":e=this.targetDistance*(1-s);break;case"left":h=-this.targetDistance*(1-s)}const n=this.initialTransform||"",o=`translate(${h}px, ${e}px)`;this.container.style.transform=n&&"none"!==n?`${o} ${n}`:o,this.container.style.opacity=String(s),i<1?this.animationFrameId=requestAnimationFrame(()=>this.animate()):this.complete()}complete(){this.isRunning=!1,this.initialTransform&&"none"!==this.initialTransform?this.container.style.transform=this.initialTransform:this.container.style.transform="",this.container.style.opacity="1",this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null),this.config.onComplete&&this.config.onComplete()}reset(){this.stop(),this.hasTriggered=!1,this.setInitialPosition()}stop(){this.isRunning=!1,this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}updateConfig(t){const i=this.isRunning;this.stop(),this.config={...this.config,...t,onStart:t.onStart??this.config.onStart,onComplete:t.onComplete??this.config.onComplete},t.distance&&(this.targetDistance=this.parseDistance(this.config.distance)),this.setInitialPosition(),void 0===t.threshold&&void 0===t.rootMargin&&void 0===t.root||(this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.setupVisibilityManager()),i&&this.config.enabled&&this.start()}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.container.style.transform=this.initialTransform||"",this.container.style.opacity="",this.container.style.transition=""}},exports.TextToParticle=s,exports.Typing=class{constructor(t,i){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.originalText=i.text,this.config={text:i.text,speed:i.speed??50,delay:i.delay??0,enabled:i.enabled??!0,threshold:i.threshold??.2,rootMargin:i.rootMargin??"0px 0px -100px 0px",triggerOnce:i.triggerOnce??!1,showCursor:i.showCursor??!0,cursorChar:i.cursorChar??"|",onUpdate:i.onUpdate||null,onComplete:i.onComplete||null};const s=o(this.config.text);this.textUnits=s.units,this.charUnitRanges=s.charUnitRanges,this.currentIndex=0,this.displayedText="",this.timeoutId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(""),this.setupVisibilityManager()}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,setTimeout(()=>this.start(),this.config.delay))},onHidden:()=>{}})}buildTextFromUnits(t){if(0===t)return"";let i="";for(let s=0;s<this.charUnitRanges.length;s++){const h=this.charUnitRanges[s];if(h.start>=t)break;const e=Math.min(t-h.start,h.end-h.start);if(e<=0)break;if(h.isHangul){const t=this.textUnits.slice(h.start,h.start+e);1===t.length?i+=t[0]:2===t.length?i+=n(t[0],t[1]):t.length>=3&&(i+=n(t[0],t[1],t[2]))}else e>0&&(i+=this.textUnits[h.start])}return i}start(){this.isRunning||(this.isRunning=!0,this.currentIndex=0,this.displayedText="",this.typeNext())}typeNext(){if(this.currentIndex>=this.textUnits.length)return this.isRunning=!1,this.config.showCursor&&this.updateDisplay(this.originalText),void(this.config.onComplete&&this.config.onComplete());this.displayedText=this.buildTextFromUnits(this.currentIndex+1);let t=this.displayedText;this.config.showCursor&&(t+=this.config.cursorChar),this.updateDisplay(t),this.config.onUpdate&&this.config.onUpdate(this.displayedText),this.currentIndex++,this.timeoutId=setTimeout(()=>{this.typeNext()},this.config.speed)}stop(){this.isRunning=!1,this.timeoutId&&(clearTimeout(this.timeoutId),this.timeoutId=null)}reset(){this.stop(),this.currentIndex=0,this.displayedText="",this.hasTriggered=!1,this.updateDisplay("")}updateDisplay(t){this.container.textContent=t}setText(t){this.originalText=t,this.config.text=t;const i=o(t);this.textUnits=i.units,this.charUnitRanges=i.charUnitRanges,this.reset(),this.config.enabled&&setTimeout(()=>this.start(),this.config.delay)}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}},exports.default=s,exports.easingFunctions=h;
|
|
1
|
+
Object.defineProperty(exports,"t",{value:!0});class t{constructor(t,s={}){this.container=t,this.options={threshold:s.threshold??.1,rootMargin:s.rootMargin??"0px",root:s.root??null,onVisible:s.onVisible,onHidden:s.onHidden},this.intersectionObserver=null,this.visibilityChangeHandler=null,this.isVisible=!1,this.isPageVisible="undefined"==typeof document||!document.hidden,this.setupIntersectionObserver(),this.setupPageVisibility()}setupIntersectionObserver(){if("undefined"==typeof window||void 0===window.IntersectionObserver)return this.isVisible=!0,void(this.isPageVisible&&this.options.onVisible&&this.options.onVisible());this.intersectionObserver=new IntersectionObserver(t=>{for(const s of t)s.target===this.container&&(s.isIntersecting?(this.isVisible=!0,this.isPageVisible&&this.options.onVisible&&this.options.onVisible()):(this.isVisible=!1,this.options.onHidden&&this.options.onHidden()))},{threshold:this.options.threshold,rootMargin:this.options.rootMargin,root:this.options.root||null}),this.intersectionObserver.observe(this.container)}setupPageVisibility(){"undefined"!=typeof document&&(this.visibilityChangeHandler=()=>{const t=this.isPageVisible;this.isPageVisible=!document.hidden,document.hidden?this.options.onHidden&&this.options.onHidden():t!==this.isPageVisible&&this.isVisible&&this.options.onVisible&&this.options.onVisible()},document.addEventListener("visibilitychange",this.visibilityChangeHandler),document.hidden&&this.isVisible&&this.options.onHidden&&this.options.onHidden())}getIsVisible(){return this.isVisible&&this.isPageVisible}updateOptions(t){this.options={...this.options,...t},this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.setupIntersectionObserver()}destroy(){this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.visibilityChangeHandler&&"undefined"!=typeof document&&(document.removeEventListener("visibilitychange",this.visibilityChangeHandler),this.visibilityChangeHandler=null)}}function s(t,s){let i=null;return function(...h){null!==i&&clearTimeout(i),i=setTimeout(()=>{i=null,t.apply(this,h)},s)}}class i{constructor(t,i={}){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={text:i.text||"mason effect",densityStep:i.densityStep??2,maxParticles:i.maxParticles??3200,pointSize:i.pointSize??.5,ease:i.ease??.05,repelRadius:i.repelRadius??150,repelStrength:i.repelStrength??1,particleColor:i.particleColor||"#fff",fontFamily:i.fontFamily||"Inter, system-ui, Arial",fontSize:i.fontSize||null,width:i.width||null,height:i.height||null,devicePixelRatio:i.devicePixelRatio??null,onReady:i.onReady||null,onUpdate:i.onUpdate||null},this.canvas=document.createElement("canvas");const h=this.canvas.getContext("2d",{willReadFrequently:!0});if(!h)throw new Error("Canvas context not available");this.ctx=h,this.container.appendChild(this.canvas),this.canvas.style.display="block",this.offCanvas=document.createElement("canvas");const e=this.offCanvas.getContext("2d",{willReadFrequently:!0});if(!e)throw new Error("Offscreen canvas context not available");this.offCtx=e,this.W=0,this.H=0,this.DPR=this.config.devicePixelRatio||Math.min(window.devicePixelRatio||1,1.8),this.particles=[],this.mouse={x:0,y:0,down:!1},this.animationId=null,this.isRunning=!1,this.visibilityManager=null,this.debounceDelay=i.debounceDelay??150;const n=this.handleResize.bind(this);this.handleResize=s(n,this.debounceDelay),this.handleMouseMove=this.handleMouseMove.bind(this),this.handleMouseLeave=this.handleMouseLeave.bind(this),this.handleMouseDown=this.handleMouseDown.bind(this),this.handleMouseUp=this.handleMouseUp.bind(this),this.i=s(this.h.bind(this),this.debounceDelay),this.o=s(this.l.bind(this),this.debounceDelay),this.init()}init(){this.resize(),this.setupEventListeners(),this.setupVisibilityManager(),this.config.onReady&&this.config.onReady(this)}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:.1,onVisible:()=>{this.start()},onHidden:()=>{this.stop()}})}resize(){const t=this.container.getBoundingClientRect(),s=this.config.width||t.width||this.container.clientWidth||window.innerWidth,i=this.config.height||t.height||this.container.clientHeight||.7*window.innerHeight;if(s<=0||i<=0)return;this.W=Math.floor(s*this.DPR),this.H=Math.floor(i*this.DPR);const h=4096;if(this.W>h||this.H>h){const t=Math.min(h/this.W,h/this.H);this.W=Math.floor(this.W*t),this.H=Math.floor(this.H*t),this.DPR=this.DPR*t}this.canvas.width=this.W,this.canvas.height=this.H,this.canvas.style.width=s+"px",this.canvas.style.height=i+"px",this.W>0&&this.H>0&&(this.buildTargets(),this.particles.length||this.initParticles())}measureTextFit(t,s,i,h){this.offCtx.font=`400 ${t}px ${this.config.fontFamily}`;const e=s.split("\n"),n=t,o=.1*t,r=.05*t;let a=0;for(const t of e){if(0===t.length)continue;const s=this.offCtx.measureText(t).width+r*(t.length>0?t.length-1:0);a=Math.max(a,s)}const l=e.length>0?n*e.length+o*(e.length-1):n;return{width:a,height:l,fits:a<=i&&l<=h}}findOptimalFontSize(t,s,i,h){if(this.measureTextFit(h,t,s,i).fits)return h;if(h<=12)return 12;let e=12,n=h,o=12;for(;e<=n;){const h=Math.floor((e+n)/2);this.measureTextFit(h,t,s,i).fits?(o=h,e=h+1):n=h-1}return o}buildTargets(){if(this.W<=0||this.H<=0)return;const t=this.config.text;this.offCanvas.width=this.W,this.offCanvas.height=this.H,this.offCtx.clearRect(0,0,this.offCanvas.width,this.offCanvas.height);const s=Math.min(this.W,this.H),i=this.config.fontSize||Math.max(80,Math.floor(.18*s)),h=this.W-80,e=this.H-80,n=this.findOptimalFontSize(t,h,e,i);this.offCtx.fillStyle="#ffffff",this.offCtx.textAlign="center",this.offCtx.textBaseline="middle",this.offCtx.font=`400 ${n}px ${this.config.fontFamily}`;const o=t.split("\n"),r=n,a=.1*n,l=.05*n,u=o.length>0?r*o.length+a*(o.length-1):r;let c=this.H/2-u/2+r/2;for(const t of o){if(0===t.length){c+=r+a;continue}const s=t.split(""),i=this.offCtx.measureText(t).width+l*(s.length>0?s.length-1:0);let h=this.W/2-i/2;for(const t of s)this.offCtx.fillText(t,h+this.offCtx.measureText(t).width/2,c),h+=this.offCtx.measureText(t).width+l;c+=r+a}const d=Math.max(2,this.config.densityStep),p=this.offCtx.getImageData(0,0,this.W,this.H).data,f=[];for(let t=0;t<this.H;t+=d)for(let s=0;s<this.W;s+=d){const i=4*(t*this.W+s);p[i]+p[i+1]+p[i+2]>600&&f.push({x:s,y:t})}for(;f.length>this.config.maxParticles;)f.splice(Math.floor(Math.random()*f.length),1);if(this.particles.length<f.length){const t=f.length-this.particles.length;for(let s=0;s<t;s++)this.particles.push(this.makeParticle())}else this.particles.length>f.length&&(this.particles.length=f.length);for(let t=0;t<this.particles.length;t++){const s=this.particles[t],i=f[t];s.tx=i.x,s.ty=i.y}}makeParticle(){const t=Math.random()*this.W,s=Math.random()*this.H;return{x:t,y:s,vx:0,vy:0,tx:t,ty:s,initialX:t,initialY:s,j:Math.random()*Math.PI*2}}initParticles(){for(const t of this.particles){const s=Math.random()*this.W,i=Math.random()*this.H;t.x=s,t.y=i,t.vx=t.vy=0,t.initialX=s,t.initialY=i}}scatter(){for(const t of this.particles)void 0!==t.initialX&&void 0!==t.initialY?(t.tx=t.initialX,t.ty=t.initialY):(t.initialX=t.x,t.initialY=t.y,t.tx=t.initialX,t.ty=t.initialY)}morph(t){this.i(t)}h(t){if(0!==this.W&&0!==this.H||this.resize(),"string"==typeof t)this.config.text=t,this.buildTargets();else if(t&&"object"==typeof t){const s=void 0!==t.text;this.config={...this.config,...t},s&&this.buildTargets()}else this.buildTargets()}update(){this.ctx.clearRect(0,0,this.W,this.H);for(const t of this.particles){let s=(t.tx-t.x)*this.config.ease,i=(t.ty-t.y)*this.config.ease;if(this.mouse.x||this.mouse.y){const h=t.x-this.mouse.x,e=t.y-this.mouse.y,n=h*h+e*e,o=this.config.repelRadius*this.DPR;if(n<o*o){const t=Math.sqrt(n)+1e-4,r=(this.mouse.down?-1:1)*this.config.repelStrength*(1-t/o);s+=h/t*r*6,i+=e/t*r*6}}t.j+=2,s+=.05*Math.cos(t.j),i+=.05*Math.sin(1.3*t.j),t.vx=(t.vx+s)*Math.random(),t.vy=(t.vy+i)*Math.random(),t.x+=t.vx,t.y+=t.vy}this.ctx.fillStyle=this.config.particleColor;const t=Math.min(this.W,this.H)/this.DPR,s=Math.max(.5,Math.min(2,t/1920)),i=this.config.pointSize*this.DPR*s;for(const t of this.particles)this.ctx.beginPath(),this.ctx.arc(t.x,t.y,i,0,2*Math.PI),this.ctx.fill();this.config.onUpdate&&this.config.onUpdate(this)}animate(){this.isRunning&&(this.update(),this.animationId=requestAnimationFrame(()=>this.animate()))}start(){this.isRunning||(this.isRunning=!0,this.animate())}stop(){this.isRunning=!1,this.animationId&&(cancelAnimationFrame(this.animationId),this.animationId=null)}setupEventListeners(){window.addEventListener("resize",this.handleResize),this.canvas.addEventListener("mousemove",this.handleMouseMove),this.canvas.addEventListener("mouseleave",this.handleMouseLeave),this.canvas.addEventListener("mousedown",this.handleMouseDown),window.addEventListener("mouseup",this.handleMouseUp)}removeEventListeners(){window.removeEventListener("resize",this.handleResize),this.canvas.removeEventListener("mousemove",this.handleMouseMove),this.canvas.removeEventListener("mouseleave",this.handleMouseLeave),this.canvas.removeEventListener("mousedown",this.handleMouseDown),window.removeEventListener("mouseup",this.handleMouseUp)}handleResize(){this.resize()}handleMouseMove(t){const s=this.canvas.getBoundingClientRect();this.mouse.x=(t.clientX-s.left)*this.DPR,this.mouse.y=(t.clientY-s.top)*this.DPR}handleMouseLeave(){this.mouse.x=this.mouse.y=0}handleMouseDown(){this.mouse.down=!0}handleMouseUp(){this.mouse.down=!1}updateConfig(t){this.o(t)}l(t){this.config={...this.config,...t},t.text&&this.buildTargets()}destroy(){this.stop(),this.removeEventListeners(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.canvas&&this.canvas.parentNode&&this.canvas.parentNode.removeChild(this.canvas)}}const h={linear:t=>t,easeInQuad:t=>t*t,easeOutQuad:t=>t*(2-t),easeInOutQuad:t=>t<.5?2*t*t:(4-2*t)*t-1,easeOutCubic:t=>--t*t*t+1};function e(t){const s=t.charCodeAt(0);if(s<44032||s>55203)return[t];const i=s-44032,h=Math.floor(i/588),e=Math.floor(i%588/28),n=i%28,o=[];return o.push(["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][h]),o.push(["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"][e]),n>0&&o.push(["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][n]),o}function n(t,s,i){const h=["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(t),e=["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"].indexOf(s),n=i?["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(i):0;if(-1===h||-1===e)return t+(s||"")+(i||"");const o=44032+21*h*28+28*e+n;return String.fromCharCode(o)}function o(t){const s=[],i=[];for(let h=0;h<t.length;h++){const n=t[h],o=n.charCodeAt(0),r=s.length;if(o>=44032&&o<=55203){const t=e(n);s.push(...t),i.push({start:r,end:s.length,isHangul:!0})}else s.push(n),i.push({start:r,end:s.length,isHangul:!1})}return{units:s,charUnitRanges:i}}const r=t=>--t*t*t+1;exports.Count=class{constructor(t,s){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={targetValue:s.targetValue,duration:s.duration??2e3,startValue:s.startValue??0,enabled:s.enabled??!0,easing:s.easing??h.linear,threshold:s.threshold??.2,rootMargin:s.rootMargin??"0px 0px -100px 0px",triggerOnce:s.triggerOnce??!1,onUpdate:s.onUpdate||null,onComplete:s.onComplete||null},this.currentValue=this.config.startValue,this.startTime=null,this.animationFrameId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(this.config.startValue),this.setupVisibilityManager()}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,this.start())},onHidden:()=>{!this.config.triggerOnce&&this.isRunning&&this.reset()}})}start(){if(this.isRunning)return;if(!this.config.enabled)return;this.isRunning=!0,this.startTime=null,this.currentValue=this.config.startValue,this.updateDisplay(this.currentValue);const t=s=>{null===this.startTime&&(this.startTime=s);const i=s-this.startTime,h=Math.min(i/this.config.duration,1),e=this.config.easing(h);this.currentValue=Math.floor(this.config.startValue+(this.config.targetValue-this.config.startValue)*e),this.updateDisplay(this.currentValue),this.config.onUpdate&&this.config.onUpdate(this.currentValue),h<1?this.animationFrameId=requestAnimationFrame(t):(this.currentValue=this.config.targetValue,this.updateDisplay(this.currentValue),this.isRunning=!1,this.config.onComplete&&this.config.onComplete())};this.animationFrameId=requestAnimationFrame(t)}stop(){this.isRunning=!1,null!==this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}reset(){this.stop(),this.currentValue=this.config.startValue,this.updateDisplay(this.currentValue),this.hasTriggered=!1,this.startTime=null}updateDisplay(t){this.container.textContent=this.formatNumber(t)}formatNumber(t){return Math.floor(t).toLocaleString()}updateConfig(t){const s=this.isRunning;this.stop(),this.config={...this.config,...t,onUpdate:void 0!==t.onUpdate?t.onUpdate:this.config.onUpdate,onComplete:void 0!==t.onComplete?t.onComplete:this.config.onComplete},void 0!==t.targetValue?(this.reset(),s&&this.config.enabled&&this.start()):s&&this.config.enabled&&this.start()}getValue(){return this.currentValue}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}},exports.MasonEffect=i,exports.ScrollFadeIn=class{constructor(t,s={}){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={direction:s.direction??"bottom",distance:s.distance??"50px",duration:s.duration??800,threshold:s.threshold??.1,rootMargin:s.rootMargin??"0px",root:s.root??null,triggerOnce:s.triggerOnce??!1,enabled:s.enabled??!0,onStart:s.onStart||null,onComplete:s.onComplete||null},this.easing=r,this.visibilityManager=null,this.animationFrameId=null,this.startTime=null,this.isRunning=!1,this.hasTriggered=!1,this.initialTransform="",this.targetDistance=0,this.init()}init(){const t=window.getComputedStyle(this.container);this.initialTransform="none"!==t.transform?t.transform:this.container.style.transform||"",this.targetDistance=this.parseDistance(this.config.distance),this.setInitialPosition(),this.setupVisibilityManager()}parseDistance(t){const s=t.match(/^(-?\d+\.?\d*)(px|rem|em|%|vh|vw)$/);if(!s)return parseFloat(t)||50;const i=parseFloat(s[1]);switch(s[2]){case"px":default:return i;case"rem":case"em":return i*(parseFloat(getComputedStyle(document.documentElement).fontSize)||16);case"%":const t=this.container.getBoundingClientRect();return i/100*("top"===this.config.direction||"bottom"===this.config.direction?t.height:t.width);case"vh":return i/100*window.innerHeight;case"vw":return i/100*window.innerWidth}}setInitialPosition(){let t=0,s=0;switch(this.config.direction){case"top":s=-this.targetDistance;break;case"right":t=this.targetDistance;break;case"bottom":s=this.targetDistance;break;case"left":t=-this.targetDistance}const i=this.initialTransform||"",h=`translate(${t}px, ${s}px)`;this.container.style.transform=i&&"none"!==i?`${h} ${i}`:h,this.container.style.opacity="0",this.container.style.transition="none"}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,root:this.config.root,onVisible:()=>{this.config.enabled&&(this.config.triggerOnce&&this.hasTriggered||(this.hasTriggered=!0,this.start()))},onHidden:()=>{this.config.enabled&&(this.stop(),this.config.triggerOnce||(this.hasTriggered=!1),this.setInitialPosition())}})}start(){this.isRunning||(this.isRunning=!0,this.startTime=performance.now(),this.config.onStart&&this.config.onStart(),this.container.style.transition="none",this.animate())}animate(){if(!this.isRunning)return;const t=performance.now()-(this.startTime||0),s=Math.min(t/this.config.duration,1),i=this.easing(s);let h=0,e=0;switch(this.config.direction){case"top":e=-this.targetDistance*(1-i);break;case"right":h=this.targetDistance*(1-i);break;case"bottom":e=this.targetDistance*(1-i);break;case"left":h=-this.targetDistance*(1-i)}const n=this.initialTransform||"",o=`translate(${h}px, ${e}px)`;this.container.style.transform=n&&"none"!==n?`${o} ${n}`:o,this.container.style.opacity=String(i),s<1?this.animationFrameId=requestAnimationFrame(()=>this.animate()):this.complete()}complete(){this.isRunning=!1,this.initialTransform&&"none"!==this.initialTransform?this.container.style.transform=this.initialTransform:this.container.style.transform="",this.container.style.opacity="1",this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null),this.config.onComplete&&this.config.onComplete()}reset(){this.stop(),this.hasTriggered=!1,this.setInitialPosition()}stop(){this.isRunning=!1,this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}updateConfig(t){const s=this.isRunning;this.stop(),this.config={...this.config,...t,onStart:t.onStart??this.config.onStart,onComplete:t.onComplete??this.config.onComplete},t.distance&&(this.targetDistance=this.parseDistance(this.config.distance)),this.setInitialPosition(),void 0===t.threshold&&void 0===t.rootMargin&&void 0===t.root||(this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.setupVisibilityManager()),s&&this.config.enabled&&this.start()}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.container.style.transform=this.initialTransform||"",this.container.style.opacity="",this.container.style.transition=""}},exports.TextToParticle=i,exports.Typing=class{constructor(t,s){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.originalText=s.text,this.config={text:s.text,speed:s.speed??50,delay:s.delay??0,enabled:s.enabled??!0,threshold:s.threshold??.2,rootMargin:s.rootMargin??"0px 0px -100px 0px",triggerOnce:s.triggerOnce??!1,showCursor:s.showCursor??!0,cursorChar:s.cursorChar??"|",onUpdate:s.onUpdate||null,onComplete:s.onComplete||null};const i=o(this.config.text);this.textUnits=i.units,this.charUnitRanges=i.charUnitRanges,this.currentIndex=0,this.displayedText="",this.timeoutId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(""),this.injectStyles(),this.setupVisibilityManager()}injectStyles(){if(document.getElementById("masoneffect-typing-styles"))return;const t=document.createElement("style");t.id="masoneffect-typing-styles",t.textContent="\n .typing-char {\n transition: opacity 0.3s ease-in;\n display: inline-block;\n }\n .typing-cursor {\n display: inline-block;\n }\n ",document.head.appendChild(t),this.container.style.whiteSpace="pre-wrap"}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,setTimeout(()=>this.start(),this.config.delay))},onHidden:()=>{}})}buildTextFromUnits(t){if(0===t)return"";let s="";for(let i=0;i<this.charUnitRanges.length;i++){const h=this.charUnitRanges[i];if(h.start>=t)break;const e=Math.min(t-h.start,h.end-h.start);if(e<=0)break;if(h.isHangul){const t=this.textUnits.slice(h.start,h.start+e);1===t.length?s+=t[0]:2===t.length?s+=n(t[0],t[1]):t.length>=3&&(s+=n(t[0],t[1],t[2]))}else e>0&&(s+=this.textUnits[h.start])}return s}start(){this.isRunning||(this.isRunning=!0,this.currentIndex=0,this.displayedText="",this.typeNext())}typeNext(){if(this.currentIndex>=this.textUnits.length)return this.isRunning=!1,this.config.showCursor&&this.updateDisplay(this.originalText),void(this.config.onComplete&&this.config.onComplete());this.displayedText=this.buildTextFromUnits(this.currentIndex+1);let t=this.displayedText;this.config.showCursor&&(t+=this.config.cursorChar),this.updateDisplay(t),this.config.onUpdate&&this.config.onUpdate(this.displayedText),this.currentIndex++,this.timeoutId=setTimeout(()=>{this.typeNext()},this.config.speed)}stop(){this.isRunning=!1,this.timeoutId&&(clearTimeout(this.timeoutId),this.timeoutId=null)}reset(){this.stop(),this.currentIndex=0,this.displayedText="",this.hasTriggered=!1,this.updateDisplay("")}updateDisplay(t){const s=t.replace(new RegExp(this.escapeHtml(this.config.cursorChar)+"$"),""),i=t.endsWith(this.config.cursorChar),h=(this.container.textContent||"").replace(new RegExp(this.config.cursorChar+"$"),"");let e="";for(let t=0;t<s.length;t++){const i=s[t],n=t>=h.length,o=" "===i?" ":this.escapeHtml(i);e+=n?`<span class="typing-char typing-fade-in" style="opacity: 0;">${o}</span>`:`<span class="typing-char" style="opacity: 1;">${o}</span>`}i&&(e+=`<span class="typing-cursor">${this.escapeHtml(this.config.cursorChar)}</span>`),this.container.innerHTML=e;const n=this.container.querySelectorAll(".typing-fade-in");n.length>0&&requestAnimationFrame(()=>{n.forEach(t=>{t.style.opacity="1",t.classList.remove("typing-fade-in")})})}escapeHtml(t){const s=document.createElement("div");return s.textContent=t,s.innerHTML}setText(t){this.originalText=t,this.config.text=t;const s=o(t);this.textUnits=s.units,this.charUnitRanges=s.charUnitRanges,this.reset(),this.config.enabled&&setTimeout(()=>this.start(),this.config.delay)}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}},exports.default=i,exports.easingFunctions=h;
|
package/dist/index.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
class t{constructor(t,i={}){this.container=t,this.options={threshold:i.threshold??.1,rootMargin:i.rootMargin??"0px",root:i.root??null,onVisible:i.onVisible,onHidden:i.onHidden},this.intersectionObserver=null,this.visibilityChangeHandler=null,this.isVisible=!1,this.isPageVisible="undefined"==typeof document||!document.hidden,this.setupIntersectionObserver(),this.setupPageVisibility()}setupIntersectionObserver(){if("undefined"==typeof window||void 0===window.IntersectionObserver)return this.isVisible=!0,void(this.isPageVisible&&this.options.onVisible&&this.options.onVisible());this.intersectionObserver=new IntersectionObserver(t=>{for(const i of t)i.target===this.container&&(i.isIntersecting?(this.isVisible=!0,this.isPageVisible&&this.options.onVisible&&this.options.onVisible()):(this.isVisible=!1,this.options.onHidden&&this.options.onHidden()))},{threshold:this.options.threshold,rootMargin:this.options.rootMargin,root:this.options.root||null}),this.intersectionObserver.observe(this.container)}setupPageVisibility(){"undefined"!=typeof document&&(this.visibilityChangeHandler=()=>{const t=this.isPageVisible;this.isPageVisible=!document.hidden,document.hidden?this.options.onHidden&&this.options.onHidden():t!==this.isPageVisible&&this.isVisible&&this.options.onVisible&&this.options.onVisible()},document.addEventListener("visibilitychange",this.visibilityChangeHandler),document.hidden&&this.isVisible&&this.options.onHidden&&this.options.onHidden())}getIsVisible(){return this.isVisible&&this.isPageVisible}updateOptions(t){this.options={...this.options,...t},this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.setupIntersectionObserver()}destroy(){this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.visibilityChangeHandler&&"undefined"!=typeof document&&(document.removeEventListener("visibilitychange",this.visibilityChangeHandler),this.visibilityChangeHandler=null)}}function i(t,i){let s=null;return function(...h){null!==s&&clearTimeout(s),s=setTimeout(()=>{s=null,t.apply(this,h)},i)}}class s{constructor(t,s={}){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={text:s.text||"mason effect",densityStep:s.densityStep??2,maxParticles:s.maxParticles??3200,pointSize:s.pointSize??.5,ease:s.ease??.05,repelRadius:s.repelRadius??150,repelStrength:s.repelStrength??1,particleColor:s.particleColor||"#fff",fontFamily:s.fontFamily||"Inter, system-ui, Arial",fontSize:s.fontSize||null,width:s.width||null,height:s.height||null,devicePixelRatio:s.devicePixelRatio??null,onReady:s.onReady||null,onUpdate:s.onUpdate||null},this.canvas=document.createElement("canvas");const h=this.canvas.getContext("2d",{willReadFrequently:!0});if(!h)throw new Error("Canvas context not available");this.ctx=h,this.container.appendChild(this.canvas),this.canvas.style.display="block",this.offCanvas=document.createElement("canvas");const e=this.offCanvas.getContext("2d",{willReadFrequently:!0});if(!e)throw new Error("Offscreen canvas context not available");this.offCtx=e,this.W=0,this.H=0,this.DPR=this.config.devicePixelRatio||Math.min(window.devicePixelRatio||1,1.8),this.particles=[],this.mouse={x:0,y:0,down:!1},this.animationId=null,this.isRunning=!1,this.visibilityManager=null,this.debounceDelay=s.debounceDelay??150;const n=this.handleResize.bind(this);this.handleResize=i(n,this.debounceDelay),this.handleMouseMove=this.handleMouseMove.bind(this),this.handleMouseLeave=this.handleMouseLeave.bind(this),this.handleMouseDown=this.handleMouseDown.bind(this),this.handleMouseUp=this.handleMouseUp.bind(this),this.t=i(this.i.bind(this),this.debounceDelay),this.h=i(this.o.bind(this),this.debounceDelay),this.init()}init(){this.resize(),this.setupEventListeners(),this.setupVisibilityManager(),this.config.onReady&&this.config.onReady(this)}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:.1,onVisible:()=>{this.start()},onHidden:()=>{this.stop()}})}resize(){const t=this.container.getBoundingClientRect(),i=this.config.width||t.width||this.container.clientWidth||window.innerWidth,s=this.config.height||t.height||this.container.clientHeight||.7*window.innerHeight;if(i<=0||s<=0)return;this.W=Math.floor(i*this.DPR),this.H=Math.floor(s*this.DPR);const h=4096;if(this.W>h||this.H>h){const t=Math.min(h/this.W,h/this.H);this.W=Math.floor(this.W*t),this.H=Math.floor(this.H*t),this.DPR=this.DPR*t}this.canvas.width=this.W,this.canvas.height=this.H,this.canvas.style.width=i+"px",this.canvas.style.height=s+"px",this.W>0&&this.H>0&&(this.buildTargets(),this.particles.length||this.initParticles())}measureTextFit(t,i,s,h){this.offCtx.font=`400 ${t}px ${this.config.fontFamily}`;const e=i.split("\n"),n=t,o=.1*t,r=.05*t;let a=0;for(const t of e){if(0===t.length)continue;const i=this.offCtx.measureText(t).width+r*(t.length>0?t.length-1:0);a=Math.max(a,i)}const l=e.length>0?n*e.length+o*(e.length-1):n;return{width:a,height:l,fits:a<=s&&l<=h}}findOptimalFontSize(t,i,s,h){if(this.measureTextFit(h,t,i,s).fits)return h;if(h<=12)return 12;let e=12,n=h,o=12;for(;e<=n;){const h=Math.floor((e+n)/2);this.measureTextFit(h,t,i,s).fits?(o=h,e=h+1):n=h-1}return o}buildTargets(){if(this.W<=0||this.H<=0)return;const t=this.config.text;this.offCanvas.width=this.W,this.offCanvas.height=this.H,this.offCtx.clearRect(0,0,this.offCanvas.width,this.offCanvas.height);const i=Math.min(this.W,this.H),s=this.config.fontSize||Math.max(80,Math.floor(.18*i)),h=this.W-80,e=this.H-80,n=this.findOptimalFontSize(t,h,e,s);this.offCtx.fillStyle="#ffffff",this.offCtx.textAlign="center",this.offCtx.textBaseline="middle",this.offCtx.font=`400 ${n}px ${this.config.fontFamily}`;const o=t.split("\n"),r=n,a=.1*n,l=.05*n,u=o.length>0?r*o.length+a*(o.length-1):r;let c=this.H/2-u/2+r/2;for(const t of o){if(0===t.length){c+=r+a;continue}const i=t.split(""),s=this.offCtx.measureText(t).width+l*(i.length>0?i.length-1:0);let h=this.W/2-s/2;for(const t of i)this.offCtx.fillText(t,h+this.offCtx.measureText(t).width/2,c),h+=this.offCtx.measureText(t).width+l;c+=r+a}const d=Math.max(2,this.config.densityStep),f=this.offCtx.getImageData(0,0,this.W,this.H).data,p=[];for(let t=0;t<this.H;t+=d)for(let i=0;i<this.W;i+=d){const s=4*(t*this.W+i);f[s]+f[s+1]+f[s+2]>600&&p.push({x:i,y:t})}for(;p.length>this.config.maxParticles;)p.splice(Math.floor(Math.random()*p.length),1);if(this.particles.length<p.length){const t=p.length-this.particles.length;for(let i=0;i<t;i++)this.particles.push(this.makeParticle())}else this.particles.length>p.length&&(this.particles.length=p.length);for(let t=0;t<this.particles.length;t++){const i=this.particles[t],s=p[t];i.tx=s.x,i.ty=s.y}}makeParticle(){const t=Math.random()*this.W,i=Math.random()*this.H;return{x:t,y:i,vx:0,vy:0,tx:t,ty:i,initialX:t,initialY:i,j:Math.random()*Math.PI*2}}initParticles(){for(const t of this.particles){const i=Math.random()*this.W,s=Math.random()*this.H;t.x=i,t.y=s,t.vx=t.vy=0,t.initialX=i,t.initialY=s}}scatter(){for(const t of this.particles)void 0!==t.initialX&&void 0!==t.initialY?(t.tx=t.initialX,t.ty=t.initialY):(t.initialX=t.x,t.initialY=t.y,t.tx=t.initialX,t.ty=t.initialY)}morph(t){this.t(t)}i(t){if(0!==this.W&&0!==this.H||this.resize(),"string"==typeof t)this.config.text=t,this.buildTargets();else if(t&&"object"==typeof t){const i=void 0!==t.text;this.config={...this.config,...t},i&&this.buildTargets()}else this.buildTargets()}update(){this.ctx.clearRect(0,0,this.W,this.H);for(const t of this.particles){let i=(t.tx-t.x)*this.config.ease,s=(t.ty-t.y)*this.config.ease;if(this.mouse.x||this.mouse.y){const h=t.x-this.mouse.x,e=t.y-this.mouse.y,n=h*h+e*e,o=this.config.repelRadius*this.DPR;if(n<o*o){const t=Math.sqrt(n)+1e-4,r=(this.mouse.down?-1:1)*this.config.repelStrength*(1-t/o);i+=h/t*r*6,s+=e/t*r*6}}t.j+=2,i+=.05*Math.cos(t.j),s+=.05*Math.sin(1.3*t.j),t.vx=(t.vx+i)*Math.random(),t.vy=(t.vy+s)*Math.random(),t.x+=t.vx,t.y+=t.vy}this.ctx.fillStyle=this.config.particleColor;const t=Math.min(this.W,this.H)/this.DPR,i=Math.max(.5,Math.min(2,t/1920)),s=this.config.pointSize*this.DPR*i;for(const t of this.particles)this.ctx.beginPath(),this.ctx.arc(t.x,t.y,s,0,2*Math.PI),this.ctx.fill();this.config.onUpdate&&this.config.onUpdate(this)}animate(){this.isRunning&&(this.update(),this.animationId=requestAnimationFrame(()=>this.animate()))}start(){this.isRunning||(this.isRunning=!0,this.animate())}stop(){this.isRunning=!1,this.animationId&&(cancelAnimationFrame(this.animationId),this.animationId=null)}setupEventListeners(){window.addEventListener("resize",this.handleResize),this.canvas.addEventListener("mousemove",this.handleMouseMove),this.canvas.addEventListener("mouseleave",this.handleMouseLeave),this.canvas.addEventListener("mousedown",this.handleMouseDown),window.addEventListener("mouseup",this.handleMouseUp)}removeEventListeners(){window.removeEventListener("resize",this.handleResize),this.canvas.removeEventListener("mousemove",this.handleMouseMove),this.canvas.removeEventListener("mouseleave",this.handleMouseLeave),this.canvas.removeEventListener("mousedown",this.handleMouseDown),window.removeEventListener("mouseup",this.handleMouseUp)}handleResize(){this.resize()}handleMouseMove(t){const i=this.canvas.getBoundingClientRect();this.mouse.x=(t.clientX-i.left)*this.DPR,this.mouse.y=(t.clientY-i.top)*this.DPR}handleMouseLeave(){this.mouse.x=this.mouse.y=0}handleMouseDown(){this.mouse.down=!0}handleMouseUp(){this.mouse.down=!1}updateConfig(t){this.h(t)}o(t){this.config={...this.config,...t},t.text&&this.buildTargets()}destroy(){this.stop(),this.removeEventListeners(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.canvas&&this.canvas.parentNode&&this.canvas.parentNode.removeChild(this.canvas)}}const h={linear:t=>t,easeInQuad:t=>t*t,easeOutQuad:t=>t*(2-t),easeInOutQuad:t=>t<.5?2*t*t:(4-2*t)*t-1,easeOutCubic:t=>--t*t*t+1};class e{constructor(t,i){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={targetValue:i.targetValue,duration:i.duration??2e3,startValue:i.startValue??0,enabled:i.enabled??!0,easing:i.easing??h.linear,threshold:i.threshold??.2,rootMargin:i.rootMargin??"0px 0px -100px 0px",triggerOnce:i.triggerOnce??!1,onUpdate:i.onUpdate||null,onComplete:i.onComplete||null},this.currentValue=this.config.startValue,this.startTime=null,this.animationFrameId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(this.config.startValue),this.setupVisibilityManager()}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,this.start())},onHidden:()=>{!this.config.triggerOnce&&this.isRunning&&this.reset()}})}start(){if(this.isRunning)return;if(!this.config.enabled)return;this.isRunning=!0,this.startTime=null,this.currentValue=this.config.startValue,this.updateDisplay(this.currentValue);const t=i=>{null===this.startTime&&(this.startTime=i);const s=i-this.startTime,h=Math.min(s/this.config.duration,1),e=this.config.easing(h);this.currentValue=Math.floor(this.config.startValue+(this.config.targetValue-this.config.startValue)*e),this.updateDisplay(this.currentValue),this.config.onUpdate&&this.config.onUpdate(this.currentValue),h<1?this.animationFrameId=requestAnimationFrame(t):(this.currentValue=this.config.targetValue,this.updateDisplay(this.currentValue),this.isRunning=!1,this.config.onComplete&&this.config.onComplete())};this.animationFrameId=requestAnimationFrame(t)}stop(){this.isRunning=!1,null!==this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}reset(){this.stop(),this.currentValue=this.config.startValue,this.updateDisplay(this.currentValue),this.hasTriggered=!1,this.startTime=null}updateDisplay(t){this.container.textContent=this.formatNumber(t)}formatNumber(t){return Math.floor(t).toLocaleString()}updateConfig(t){const i=this.isRunning;this.stop(),this.config={...this.config,...t,onUpdate:void 0!==t.onUpdate?t.onUpdate:this.config.onUpdate,onComplete:void 0!==t.onComplete?t.onComplete:this.config.onComplete},void 0!==t.targetValue?(this.reset(),i&&this.config.enabled&&this.start()):i&&this.config.enabled&&this.start()}getValue(){return this.currentValue}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}}function n(t){const i=t.charCodeAt(0);if(i<44032||i>55203)return[t];const s=i-44032,h=Math.floor(s/588),e=Math.floor(s%588/28),n=s%28,o=[];return o.push(["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][h]),o.push(["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"][e]),n>0&&o.push(["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][n]),o}function o(t,i,s){const h=["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(t),e=["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"].indexOf(i),n=s?["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(s):0;if(-1===h||-1===e)return t+(i||"")+(s||"");const o=44032+21*h*28+28*e+n;return String.fromCharCode(o)}function r(t){const i=[],s=[];for(let h=0;h<t.length;h++){const e=t[h],o=e.charCodeAt(0),r=i.length;if(o>=44032&&o<=55203){const t=n(e);i.push(...t),s.push({start:r,end:i.length,isHangul:!0})}else i.push(e),s.push({start:r,end:i.length,isHangul:!1})}return{units:i,charUnitRanges:s}}class a{constructor(t,i){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.originalText=i.text,this.config={text:i.text,speed:i.speed??50,delay:i.delay??0,enabled:i.enabled??!0,threshold:i.threshold??.2,rootMargin:i.rootMargin??"0px 0px -100px 0px",triggerOnce:i.triggerOnce??!1,showCursor:i.showCursor??!0,cursorChar:i.cursorChar??"|",onUpdate:i.onUpdate||null,onComplete:i.onComplete||null};const s=r(this.config.text);this.textUnits=s.units,this.charUnitRanges=s.charUnitRanges,this.currentIndex=0,this.displayedText="",this.timeoutId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(""),this.setupVisibilityManager()}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,setTimeout(()=>this.start(),this.config.delay))},onHidden:()=>{}})}buildTextFromUnits(t){if(0===t)return"";let i="";for(let s=0;s<this.charUnitRanges.length;s++){const h=this.charUnitRanges[s];if(h.start>=t)break;const e=Math.min(t-h.start,h.end-h.start);if(e<=0)break;if(h.isHangul){const t=this.textUnits.slice(h.start,h.start+e);1===t.length?i+=t[0]:2===t.length?i+=o(t[0],t[1]):t.length>=3&&(i+=o(t[0],t[1],t[2]))}else e>0&&(i+=this.textUnits[h.start])}return i}start(){this.isRunning||(this.isRunning=!0,this.currentIndex=0,this.displayedText="",this.typeNext())}typeNext(){if(this.currentIndex>=this.textUnits.length)return this.isRunning=!1,this.config.showCursor&&this.updateDisplay(this.originalText),void(this.config.onComplete&&this.config.onComplete());this.displayedText=this.buildTextFromUnits(this.currentIndex+1);let t=this.displayedText;this.config.showCursor&&(t+=this.config.cursorChar),this.updateDisplay(t),this.config.onUpdate&&this.config.onUpdate(this.displayedText),this.currentIndex++,this.timeoutId=setTimeout(()=>{this.typeNext()},this.config.speed)}stop(){this.isRunning=!1,this.timeoutId&&(clearTimeout(this.timeoutId),this.timeoutId=null)}reset(){this.stop(),this.currentIndex=0,this.displayedText="",this.hasTriggered=!1,this.updateDisplay("")}updateDisplay(t){this.container.textContent=t}setText(t){this.originalText=t,this.config.text=t;const i=r(t);this.textUnits=i.units,this.charUnitRanges=i.charUnitRanges,this.reset(),this.config.enabled&&setTimeout(()=>this.start(),this.config.delay)}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}}const l=t=>--t*t*t+1;class u{constructor(t,i={}){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={direction:i.direction??"bottom",distance:i.distance??"50px",duration:i.duration??800,threshold:i.threshold??.1,rootMargin:i.rootMargin??"0px",root:i.root??null,triggerOnce:i.triggerOnce??!1,enabled:i.enabled??!0,onStart:i.onStart||null,onComplete:i.onComplete||null},this.easing=l,this.visibilityManager=null,this.animationFrameId=null,this.startTime=null,this.isRunning=!1,this.hasTriggered=!1,this.initialTransform="",this.targetDistance=0,this.init()}init(){const t=window.getComputedStyle(this.container);this.initialTransform="none"!==t.transform?t.transform:this.container.style.transform||"",this.targetDistance=this.parseDistance(this.config.distance),this.setInitialPosition(),this.setupVisibilityManager()}parseDistance(t){const i=t.match(/^(-?\d+\.?\d*)(px|rem|em|%|vh|vw)$/);if(!i)return parseFloat(t)||50;const s=parseFloat(i[1]);switch(i[2]){case"px":default:return s;case"rem":case"em":return s*(parseFloat(getComputedStyle(document.documentElement).fontSize)||16);case"%":const t=this.container.getBoundingClientRect();return s/100*("top"===this.config.direction||"bottom"===this.config.direction?t.height:t.width);case"vh":return s/100*window.innerHeight;case"vw":return s/100*window.innerWidth}}setInitialPosition(){let t=0,i=0;switch(this.config.direction){case"top":i=-this.targetDistance;break;case"right":t=this.targetDistance;break;case"bottom":i=this.targetDistance;break;case"left":t=-this.targetDistance}const s=this.initialTransform||"",h=`translate(${t}px, ${i}px)`;this.container.style.transform=s&&"none"!==s?`${h} ${s}`:h,this.container.style.opacity="0",this.container.style.transition="none"}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,root:this.config.root,onVisible:()=>{this.config.enabled&&(this.config.triggerOnce&&this.hasTriggered||(this.hasTriggered=!0,this.start()))},onHidden:()=>{this.config.enabled&&(this.stop(),this.config.triggerOnce||(this.hasTriggered=!1),this.setInitialPosition())}})}start(){this.isRunning||(this.isRunning=!0,this.startTime=performance.now(),this.config.onStart&&this.config.onStart(),this.container.style.transition="none",this.animate())}animate(){if(!this.isRunning)return;const t=performance.now()-(this.startTime||0),i=Math.min(t/this.config.duration,1),s=this.easing(i);let h=0,e=0;switch(this.config.direction){case"top":e=-this.targetDistance*(1-s);break;case"right":h=this.targetDistance*(1-s);break;case"bottom":e=this.targetDistance*(1-s);break;case"left":h=-this.targetDistance*(1-s)}const n=this.initialTransform||"",o=`translate(${h}px, ${e}px)`;this.container.style.transform=n&&"none"!==n?`${o} ${n}`:o,this.container.style.opacity=String(s),i<1?this.animationFrameId=requestAnimationFrame(()=>this.animate()):this.complete()}complete(){this.isRunning=!1,this.initialTransform&&"none"!==this.initialTransform?this.container.style.transform=this.initialTransform:this.container.style.transform="",this.container.style.opacity="1",this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null),this.config.onComplete&&this.config.onComplete()}reset(){this.stop(),this.hasTriggered=!1,this.setInitialPosition()}stop(){this.isRunning=!1,this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}updateConfig(t){const i=this.isRunning;this.stop(),this.config={...this.config,...t,onStart:t.onStart??this.config.onStart,onComplete:t.onComplete??this.config.onComplete},t.distance&&(this.targetDistance=this.parseDistance(this.config.distance)),this.setInitialPosition(),void 0===t.threshold&&void 0===t.rootMargin&&void 0===t.root||(this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.setupVisibilityManager()),i&&this.config.enabled&&this.start()}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.container.style.transform=this.initialTransform||"",this.container.style.opacity="",this.container.style.transition=""}}export{e as Count,s as MasonEffect,u as ScrollFadeIn,s as TextToParticle,a as Typing,s as default,h as easingFunctions};
|
|
1
|
+
class t{constructor(t,i={}){this.container=t,this.options={threshold:i.threshold??.1,rootMargin:i.rootMargin??"0px",root:i.root??null,onVisible:i.onVisible,onHidden:i.onHidden},this.intersectionObserver=null,this.visibilityChangeHandler=null,this.isVisible=!1,this.isPageVisible="undefined"==typeof document||!document.hidden,this.setupIntersectionObserver(),this.setupPageVisibility()}setupIntersectionObserver(){if("undefined"==typeof window||void 0===window.IntersectionObserver)return this.isVisible=!0,void(this.isPageVisible&&this.options.onVisible&&this.options.onVisible());this.intersectionObserver=new IntersectionObserver(t=>{for(const i of t)i.target===this.container&&(i.isIntersecting?(this.isVisible=!0,this.isPageVisible&&this.options.onVisible&&this.options.onVisible()):(this.isVisible=!1,this.options.onHidden&&this.options.onHidden()))},{threshold:this.options.threshold,rootMargin:this.options.rootMargin,root:this.options.root||null}),this.intersectionObserver.observe(this.container)}setupPageVisibility(){"undefined"!=typeof document&&(this.visibilityChangeHandler=()=>{const t=this.isPageVisible;this.isPageVisible=!document.hidden,document.hidden?this.options.onHidden&&this.options.onHidden():t!==this.isPageVisible&&this.isVisible&&this.options.onVisible&&this.options.onVisible()},document.addEventListener("visibilitychange",this.visibilityChangeHandler),document.hidden&&this.isVisible&&this.options.onHidden&&this.options.onHidden())}getIsVisible(){return this.isVisible&&this.isPageVisible}updateOptions(t){this.options={...this.options,...t},this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.setupIntersectionObserver()}destroy(){this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.visibilityChangeHandler&&"undefined"!=typeof document&&(document.removeEventListener("visibilitychange",this.visibilityChangeHandler),this.visibilityChangeHandler=null)}}function i(t,i){let s=null;return function(...h){null!==s&&clearTimeout(s),s=setTimeout(()=>{s=null,t.apply(this,h)},i)}}class s{constructor(t,s={}){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={text:s.text||"mason effect",densityStep:s.densityStep??2,maxParticles:s.maxParticles??3200,pointSize:s.pointSize??.5,ease:s.ease??.05,repelRadius:s.repelRadius??150,repelStrength:s.repelStrength??1,particleColor:s.particleColor||"#fff",fontFamily:s.fontFamily||"Inter, system-ui, Arial",fontSize:s.fontSize||null,width:s.width||null,height:s.height||null,devicePixelRatio:s.devicePixelRatio??null,onReady:s.onReady||null,onUpdate:s.onUpdate||null},this.canvas=document.createElement("canvas");const h=this.canvas.getContext("2d",{willReadFrequently:!0});if(!h)throw new Error("Canvas context not available");this.ctx=h,this.container.appendChild(this.canvas),this.canvas.style.display="block",this.offCanvas=document.createElement("canvas");const e=this.offCanvas.getContext("2d",{willReadFrequently:!0});if(!e)throw new Error("Offscreen canvas context not available");this.offCtx=e,this.W=0,this.H=0,this.DPR=this.config.devicePixelRatio||Math.min(window.devicePixelRatio||1,1.8),this.particles=[],this.mouse={x:0,y:0,down:!1},this.animationId=null,this.isRunning=!1,this.visibilityManager=null,this.debounceDelay=s.debounceDelay??150;const n=this.handleResize.bind(this);this.handleResize=i(n,this.debounceDelay),this.handleMouseMove=this.handleMouseMove.bind(this),this.handleMouseLeave=this.handleMouseLeave.bind(this),this.handleMouseDown=this.handleMouseDown.bind(this),this.handleMouseUp=this.handleMouseUp.bind(this),this.t=i(this.i.bind(this),this.debounceDelay),this.h=i(this.o.bind(this),this.debounceDelay),this.init()}init(){this.resize(),this.setupEventListeners(),this.setupVisibilityManager(),this.config.onReady&&this.config.onReady(this)}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:.1,onVisible:()=>{this.start()},onHidden:()=>{this.stop()}})}resize(){const t=this.container.getBoundingClientRect(),i=this.config.width||t.width||this.container.clientWidth||window.innerWidth,s=this.config.height||t.height||this.container.clientHeight||.7*window.innerHeight;if(i<=0||s<=0)return;this.W=Math.floor(i*this.DPR),this.H=Math.floor(s*this.DPR);const h=4096;if(this.W>h||this.H>h){const t=Math.min(h/this.W,h/this.H);this.W=Math.floor(this.W*t),this.H=Math.floor(this.H*t),this.DPR=this.DPR*t}this.canvas.width=this.W,this.canvas.height=this.H,this.canvas.style.width=i+"px",this.canvas.style.height=s+"px",this.W>0&&this.H>0&&(this.buildTargets(),this.particles.length||this.initParticles())}measureTextFit(t,i,s,h){this.offCtx.font=`400 ${t}px ${this.config.fontFamily}`;const e=i.split("\n"),n=t,o=.1*t,r=.05*t;let a=0;for(const t of e){if(0===t.length)continue;const i=this.offCtx.measureText(t).width+r*(t.length>0?t.length-1:0);a=Math.max(a,i)}const l=e.length>0?n*e.length+o*(e.length-1):n;return{width:a,height:l,fits:a<=s&&l<=h}}findOptimalFontSize(t,i,s,h){if(this.measureTextFit(h,t,i,s).fits)return h;if(h<=12)return 12;let e=12,n=h,o=12;for(;e<=n;){const h=Math.floor((e+n)/2);this.measureTextFit(h,t,i,s).fits?(o=h,e=h+1):n=h-1}return o}buildTargets(){if(this.W<=0||this.H<=0)return;const t=this.config.text;this.offCanvas.width=this.W,this.offCanvas.height=this.H,this.offCtx.clearRect(0,0,this.offCanvas.width,this.offCanvas.height);const i=Math.min(this.W,this.H),s=this.config.fontSize||Math.max(80,Math.floor(.18*i)),h=this.W-80,e=this.H-80,n=this.findOptimalFontSize(t,h,e,s);this.offCtx.fillStyle="#ffffff",this.offCtx.textAlign="center",this.offCtx.textBaseline="middle",this.offCtx.font=`400 ${n}px ${this.config.fontFamily}`;const o=t.split("\n"),r=n,a=.1*n,l=.05*n,u=o.length>0?r*o.length+a*(o.length-1):r;let c=this.H/2-u/2+r/2;for(const t of o){if(0===t.length){c+=r+a;continue}const i=t.split(""),s=this.offCtx.measureText(t).width+l*(i.length>0?i.length-1:0);let h=this.W/2-s/2;for(const t of i)this.offCtx.fillText(t,h+this.offCtx.measureText(t).width/2,c),h+=this.offCtx.measureText(t).width+l;c+=r+a}const d=Math.max(2,this.config.densityStep),f=this.offCtx.getImageData(0,0,this.W,this.H).data,p=[];for(let t=0;t<this.H;t+=d)for(let i=0;i<this.W;i+=d){const s=4*(t*this.W+i);f[s]+f[s+1]+f[s+2]>600&&p.push({x:i,y:t})}for(;p.length>this.config.maxParticles;)p.splice(Math.floor(Math.random()*p.length),1);if(this.particles.length<p.length){const t=p.length-this.particles.length;for(let i=0;i<t;i++)this.particles.push(this.makeParticle())}else this.particles.length>p.length&&(this.particles.length=p.length);for(let t=0;t<this.particles.length;t++){const i=this.particles[t],s=p[t];i.tx=s.x,i.ty=s.y}}makeParticle(){const t=Math.random()*this.W,i=Math.random()*this.H;return{x:t,y:i,vx:0,vy:0,tx:t,ty:i,initialX:t,initialY:i,j:Math.random()*Math.PI*2}}initParticles(){for(const t of this.particles){const i=Math.random()*this.W,s=Math.random()*this.H;t.x=i,t.y=s,t.vx=t.vy=0,t.initialX=i,t.initialY=s}}scatter(){for(const t of this.particles)void 0!==t.initialX&&void 0!==t.initialY?(t.tx=t.initialX,t.ty=t.initialY):(t.initialX=t.x,t.initialY=t.y,t.tx=t.initialX,t.ty=t.initialY)}morph(t){this.t(t)}i(t){if(0!==this.W&&0!==this.H||this.resize(),"string"==typeof t)this.config.text=t,this.buildTargets();else if(t&&"object"==typeof t){const i=void 0!==t.text;this.config={...this.config,...t},i&&this.buildTargets()}else this.buildTargets()}update(){this.ctx.clearRect(0,0,this.W,this.H);for(const t of this.particles){let i=(t.tx-t.x)*this.config.ease,s=(t.ty-t.y)*this.config.ease;if(this.mouse.x||this.mouse.y){const h=t.x-this.mouse.x,e=t.y-this.mouse.y,n=h*h+e*e,o=this.config.repelRadius*this.DPR;if(n<o*o){const t=Math.sqrt(n)+1e-4,r=(this.mouse.down?-1:1)*this.config.repelStrength*(1-t/o);i+=h/t*r*6,s+=e/t*r*6}}t.j+=2,i+=.05*Math.cos(t.j),s+=.05*Math.sin(1.3*t.j),t.vx=(t.vx+i)*Math.random(),t.vy=(t.vy+s)*Math.random(),t.x+=t.vx,t.y+=t.vy}this.ctx.fillStyle=this.config.particleColor;const t=Math.min(this.W,this.H)/this.DPR,i=Math.max(.5,Math.min(2,t/1920)),s=this.config.pointSize*this.DPR*i;for(const t of this.particles)this.ctx.beginPath(),this.ctx.arc(t.x,t.y,s,0,2*Math.PI),this.ctx.fill();this.config.onUpdate&&this.config.onUpdate(this)}animate(){this.isRunning&&(this.update(),this.animationId=requestAnimationFrame(()=>this.animate()))}start(){this.isRunning||(this.isRunning=!0,this.animate())}stop(){this.isRunning=!1,this.animationId&&(cancelAnimationFrame(this.animationId),this.animationId=null)}setupEventListeners(){window.addEventListener("resize",this.handleResize),this.canvas.addEventListener("mousemove",this.handleMouseMove),this.canvas.addEventListener("mouseleave",this.handleMouseLeave),this.canvas.addEventListener("mousedown",this.handleMouseDown),window.addEventListener("mouseup",this.handleMouseUp)}removeEventListeners(){window.removeEventListener("resize",this.handleResize),this.canvas.removeEventListener("mousemove",this.handleMouseMove),this.canvas.removeEventListener("mouseleave",this.handleMouseLeave),this.canvas.removeEventListener("mousedown",this.handleMouseDown),window.removeEventListener("mouseup",this.handleMouseUp)}handleResize(){this.resize()}handleMouseMove(t){const i=this.canvas.getBoundingClientRect();this.mouse.x=(t.clientX-i.left)*this.DPR,this.mouse.y=(t.clientY-i.top)*this.DPR}handleMouseLeave(){this.mouse.x=this.mouse.y=0}handleMouseDown(){this.mouse.down=!0}handleMouseUp(){this.mouse.down=!1}updateConfig(t){this.h(t)}o(t){this.config={...this.config,...t},t.text&&this.buildTargets()}destroy(){this.stop(),this.removeEventListeners(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.canvas&&this.canvas.parentNode&&this.canvas.parentNode.removeChild(this.canvas)}}const h={linear:t=>t,easeInQuad:t=>t*t,easeOutQuad:t=>t*(2-t),easeInOutQuad:t=>t<.5?2*t*t:(4-2*t)*t-1,easeOutCubic:t=>--t*t*t+1};class e{constructor(t,i){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={targetValue:i.targetValue,duration:i.duration??2e3,startValue:i.startValue??0,enabled:i.enabled??!0,easing:i.easing??h.linear,threshold:i.threshold??.2,rootMargin:i.rootMargin??"0px 0px -100px 0px",triggerOnce:i.triggerOnce??!1,onUpdate:i.onUpdate||null,onComplete:i.onComplete||null},this.currentValue=this.config.startValue,this.startTime=null,this.animationFrameId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(this.config.startValue),this.setupVisibilityManager()}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,this.start())},onHidden:()=>{!this.config.triggerOnce&&this.isRunning&&this.reset()}})}start(){if(this.isRunning)return;if(!this.config.enabled)return;this.isRunning=!0,this.startTime=null,this.currentValue=this.config.startValue,this.updateDisplay(this.currentValue);const t=i=>{null===this.startTime&&(this.startTime=i);const s=i-this.startTime,h=Math.min(s/this.config.duration,1),e=this.config.easing(h);this.currentValue=Math.floor(this.config.startValue+(this.config.targetValue-this.config.startValue)*e),this.updateDisplay(this.currentValue),this.config.onUpdate&&this.config.onUpdate(this.currentValue),h<1?this.animationFrameId=requestAnimationFrame(t):(this.currentValue=this.config.targetValue,this.updateDisplay(this.currentValue),this.isRunning=!1,this.config.onComplete&&this.config.onComplete())};this.animationFrameId=requestAnimationFrame(t)}stop(){this.isRunning=!1,null!==this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}reset(){this.stop(),this.currentValue=this.config.startValue,this.updateDisplay(this.currentValue),this.hasTriggered=!1,this.startTime=null}updateDisplay(t){this.container.textContent=this.formatNumber(t)}formatNumber(t){return Math.floor(t).toLocaleString()}updateConfig(t){const i=this.isRunning;this.stop(),this.config={...this.config,...t,onUpdate:void 0!==t.onUpdate?t.onUpdate:this.config.onUpdate,onComplete:void 0!==t.onComplete?t.onComplete:this.config.onComplete},void 0!==t.targetValue?(this.reset(),i&&this.config.enabled&&this.start()):i&&this.config.enabled&&this.start()}getValue(){return this.currentValue}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}}function n(t){const i=t.charCodeAt(0);if(i<44032||i>55203)return[t];const s=i-44032,h=Math.floor(s/588),e=Math.floor(s%588/28),n=s%28,o=[];return o.push(["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][h]),o.push(["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"][e]),n>0&&o.push(["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][n]),o}function o(t,i,s){const h=["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(t),e=["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"].indexOf(i),n=s?["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(s):0;if(-1===h||-1===e)return t+(i||"")+(s||"");const o=44032+21*h*28+28*e+n;return String.fromCharCode(o)}function r(t){const i=[],s=[];for(let h=0;h<t.length;h++){const e=t[h],o=e.charCodeAt(0),r=i.length;if(o>=44032&&o<=55203){const t=n(e);i.push(...t),s.push({start:r,end:i.length,isHangul:!0})}else i.push(e),s.push({start:r,end:i.length,isHangul:!1})}return{units:i,charUnitRanges:s}}class a{constructor(t,i){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.originalText=i.text,this.config={text:i.text,speed:i.speed??50,delay:i.delay??0,enabled:i.enabled??!0,threshold:i.threshold??.2,rootMargin:i.rootMargin??"0px 0px -100px 0px",triggerOnce:i.triggerOnce??!1,showCursor:i.showCursor??!0,cursorChar:i.cursorChar??"|",onUpdate:i.onUpdate||null,onComplete:i.onComplete||null};const s=r(this.config.text);this.textUnits=s.units,this.charUnitRanges=s.charUnitRanges,this.currentIndex=0,this.displayedText="",this.timeoutId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(""),this.injectStyles(),this.setupVisibilityManager()}injectStyles(){if(document.getElementById("masoneffect-typing-styles"))return;const t=document.createElement("style");t.id="masoneffect-typing-styles",t.textContent="\n .typing-char {\n transition: opacity 0.3s ease-in;\n display: inline-block;\n }\n .typing-cursor {\n display: inline-block;\n }\n ",document.head.appendChild(t),this.container.style.whiteSpace="pre-wrap"}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,setTimeout(()=>this.start(),this.config.delay))},onHidden:()=>{}})}buildTextFromUnits(t){if(0===t)return"";let i="";for(let s=0;s<this.charUnitRanges.length;s++){const h=this.charUnitRanges[s];if(h.start>=t)break;const e=Math.min(t-h.start,h.end-h.start);if(e<=0)break;if(h.isHangul){const t=this.textUnits.slice(h.start,h.start+e);1===t.length?i+=t[0]:2===t.length?i+=o(t[0],t[1]):t.length>=3&&(i+=o(t[0],t[1],t[2]))}else e>0&&(i+=this.textUnits[h.start])}return i}start(){this.isRunning||(this.isRunning=!0,this.currentIndex=0,this.displayedText="",this.typeNext())}typeNext(){if(this.currentIndex>=this.textUnits.length)return this.isRunning=!1,this.config.showCursor&&this.updateDisplay(this.originalText),void(this.config.onComplete&&this.config.onComplete());this.displayedText=this.buildTextFromUnits(this.currentIndex+1);let t=this.displayedText;this.config.showCursor&&(t+=this.config.cursorChar),this.updateDisplay(t),this.config.onUpdate&&this.config.onUpdate(this.displayedText),this.currentIndex++,this.timeoutId=setTimeout(()=>{this.typeNext()},this.config.speed)}stop(){this.isRunning=!1,this.timeoutId&&(clearTimeout(this.timeoutId),this.timeoutId=null)}reset(){this.stop(),this.currentIndex=0,this.displayedText="",this.hasTriggered=!1,this.updateDisplay("")}updateDisplay(t){const i=t.replace(new RegExp(this.escapeHtml(this.config.cursorChar)+"$"),""),s=t.endsWith(this.config.cursorChar),h=(this.container.textContent||"").replace(new RegExp(this.config.cursorChar+"$"),"");let e="";for(let t=0;t<i.length;t++){const s=i[t],n=t>=h.length,o=" "===s?" ":this.escapeHtml(s);e+=n?`<span class="typing-char typing-fade-in" style="opacity: 0;">${o}</span>`:`<span class="typing-char" style="opacity: 1;">${o}</span>`}s&&(e+=`<span class="typing-cursor">${this.escapeHtml(this.config.cursorChar)}</span>`),this.container.innerHTML=e;const n=this.container.querySelectorAll(".typing-fade-in");n.length>0&&requestAnimationFrame(()=>{n.forEach(t=>{t.style.opacity="1",t.classList.remove("typing-fade-in")})})}escapeHtml(t){const i=document.createElement("div");return i.textContent=t,i.innerHTML}setText(t){this.originalText=t,this.config.text=t;const i=r(t);this.textUnits=i.units,this.charUnitRanges=i.charUnitRanges,this.reset(),this.config.enabled&&setTimeout(()=>this.start(),this.config.delay)}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}}const l=t=>--t*t*t+1;class u{constructor(t,i={}){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.config={direction:i.direction??"bottom",distance:i.distance??"50px",duration:i.duration??800,threshold:i.threshold??.1,rootMargin:i.rootMargin??"0px",root:i.root??null,triggerOnce:i.triggerOnce??!1,enabled:i.enabled??!0,onStart:i.onStart||null,onComplete:i.onComplete||null},this.easing=l,this.visibilityManager=null,this.animationFrameId=null,this.startTime=null,this.isRunning=!1,this.hasTriggered=!1,this.initialTransform="",this.targetDistance=0,this.init()}init(){const t=window.getComputedStyle(this.container);this.initialTransform="none"!==t.transform?t.transform:this.container.style.transform||"",this.targetDistance=this.parseDistance(this.config.distance),this.setInitialPosition(),this.setupVisibilityManager()}parseDistance(t){const i=t.match(/^(-?\d+\.?\d*)(px|rem|em|%|vh|vw)$/);if(!i)return parseFloat(t)||50;const s=parseFloat(i[1]);switch(i[2]){case"px":default:return s;case"rem":case"em":return s*(parseFloat(getComputedStyle(document.documentElement).fontSize)||16);case"%":const t=this.container.getBoundingClientRect();return s/100*("top"===this.config.direction||"bottom"===this.config.direction?t.height:t.width);case"vh":return s/100*window.innerHeight;case"vw":return s/100*window.innerWidth}}setInitialPosition(){let t=0,i=0;switch(this.config.direction){case"top":i=-this.targetDistance;break;case"right":t=this.targetDistance;break;case"bottom":i=this.targetDistance;break;case"left":t=-this.targetDistance}const s=this.initialTransform||"",h=`translate(${t}px, ${i}px)`;this.container.style.transform=s&&"none"!==s?`${h} ${s}`:h,this.container.style.opacity="0",this.container.style.transition="none"}setupVisibilityManager(){this.visibilityManager=new t(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,root:this.config.root,onVisible:()=>{this.config.enabled&&(this.config.triggerOnce&&this.hasTriggered||(this.hasTriggered=!0,this.start()))},onHidden:()=>{this.config.enabled&&(this.stop(),this.config.triggerOnce||(this.hasTriggered=!1),this.setInitialPosition())}})}start(){this.isRunning||(this.isRunning=!0,this.startTime=performance.now(),this.config.onStart&&this.config.onStart(),this.container.style.transition="none",this.animate())}animate(){if(!this.isRunning)return;const t=performance.now()-(this.startTime||0),i=Math.min(t/this.config.duration,1),s=this.easing(i);let h=0,e=0;switch(this.config.direction){case"top":e=-this.targetDistance*(1-s);break;case"right":h=this.targetDistance*(1-s);break;case"bottom":e=this.targetDistance*(1-s);break;case"left":h=-this.targetDistance*(1-s)}const n=this.initialTransform||"",o=`translate(${h}px, ${e}px)`;this.container.style.transform=n&&"none"!==n?`${o} ${n}`:o,this.container.style.opacity=String(s),i<1?this.animationFrameId=requestAnimationFrame(()=>this.animate()):this.complete()}complete(){this.isRunning=!1,this.initialTransform&&"none"!==this.initialTransform?this.container.style.transform=this.initialTransform:this.container.style.transform="",this.container.style.opacity="1",this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null),this.config.onComplete&&this.config.onComplete()}reset(){this.stop(),this.hasTriggered=!1,this.setInitialPosition()}stop(){this.isRunning=!1,this.animationFrameId&&(cancelAnimationFrame(this.animationFrameId),this.animationFrameId=null)}updateConfig(t){const i=this.isRunning;this.stop(),this.config={...this.config,...t,onStart:t.onStart??this.config.onStart,onComplete:t.onComplete??this.config.onComplete},t.distance&&(this.targetDistance=this.parseDistance(this.config.distance)),this.setInitialPosition(),void 0===t.threshold&&void 0===t.rootMargin&&void 0===t.root||(this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.setupVisibilityManager()),i&&this.config.enabled&&this.start()}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null),this.container.style.transform=this.initialTransform||"",this.container.style.opacity="",this.container.style.transition=""}}export{e as Count,s as MasonEffect,u as ScrollFadeIn,s as TextToParticle,a as Typing,s as default,h as easingFunctions};
|
|
@@ -40,6 +40,7 @@ export declare class Typing {
|
|
|
40
40
|
originalText: string;
|
|
41
41
|
constructor(container: HTMLElement | string, options: TypingOptions);
|
|
42
42
|
init(): void;
|
|
43
|
+
private injectStyles;
|
|
43
44
|
setupVisibilityManager(): void;
|
|
44
45
|
private buildTextFromUnits;
|
|
45
46
|
start(): void;
|
|
@@ -47,6 +48,7 @@ export declare class Typing {
|
|
|
47
48
|
stop(): void;
|
|
48
49
|
reset(): void;
|
|
49
50
|
updateDisplay(text: string): void;
|
|
51
|
+
private escapeHtml;
|
|
50
52
|
setText(newText: string): void;
|
|
51
53
|
destroy(): void;
|
|
52
54
|
}
|
|
@@ -40,6 +40,7 @@ export declare class Typing {
|
|
|
40
40
|
originalText: string;
|
|
41
41
|
constructor(container: HTMLElement | string, options: TypingOptions);
|
|
42
42
|
init(): void;
|
|
43
|
+
private injectStyles;
|
|
43
44
|
setupVisibilityManager(): void;
|
|
44
45
|
private buildTextFromUnits;
|
|
45
46
|
start(): void;
|
|
@@ -47,6 +48,7 @@ export declare class Typing {
|
|
|
47
48
|
stop(): void;
|
|
48
49
|
reset(): void;
|
|
49
50
|
updateDisplay(text: string): void;
|
|
51
|
+
private escapeHtml;
|
|
50
52
|
setText(newText: string): void;
|
|
51
53
|
destroy(): void;
|
|
52
54
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;IAWZ,OAAO,CAAC,YAAY;IAuBpB,sBAAsB,IAAI,IAAI;IAmB9B,OAAO,CAAC,kBAAkB;IAgD1B,KAAK,IAAI,IAAI;IASb,QAAQ,IAAI,IAAI;IAuChB,IAAI,IAAI,IAAI;IAQZ,KAAK,IAAI,IAAI;IAQb,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAiDjC,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAa9B,OAAO,IAAI,IAAI;CAOhB;AAGD,eAAe,MAAM,CAAC"}
|
|
@@ -40,6 +40,7 @@ export declare class Typing {
|
|
|
40
40
|
originalText: string;
|
|
41
41
|
constructor(container: HTMLElement | string, options: TypingOptions);
|
|
42
42
|
init(): void;
|
|
43
|
+
private injectStyles;
|
|
43
44
|
setupVisibilityManager(): void;
|
|
44
45
|
private buildTextFromUnits;
|
|
45
46
|
start(): void;
|
|
@@ -47,6 +48,7 @@ export declare class Typing {
|
|
|
47
48
|
stop(): void;
|
|
48
49
|
reset(): void;
|
|
49
50
|
updateDisplay(text: string): void;
|
|
51
|
+
private escapeHtml;
|
|
50
52
|
setText(newText: string): void;
|
|
51
53
|
destroy(): void;
|
|
52
54
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;IAWZ,OAAO,CAAC,YAAY;IAuBpB,sBAAsB,IAAI,IAAI;IAmB9B,OAAO,CAAC,kBAAkB;IAgD1B,KAAK,IAAI,IAAI;IASb,QAAQ,IAAI,IAAI;IAuChB,IAAI,IAAI,IAAI;IAQZ,KAAK,IAAI,IAAI;IAQb,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAiDjC,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAa9B,OAAO,IAAI,IAAI;CAOhB;AAGD,eAAe,MAAM,CAAC"}
|
|
@@ -40,6 +40,7 @@ export declare class Typing {
|
|
|
40
40
|
originalText: string;
|
|
41
41
|
constructor(container: HTMLElement | string, options: TypingOptions);
|
|
42
42
|
init(): void;
|
|
43
|
+
private injectStyles;
|
|
43
44
|
setupVisibilityManager(): void;
|
|
44
45
|
private buildTextFromUnits;
|
|
45
46
|
start(): void;
|
|
@@ -47,6 +48,7 @@ export declare class Typing {
|
|
|
47
48
|
stop(): void;
|
|
48
49
|
reset(): void;
|
|
49
50
|
updateDisplay(text: string): void;
|
|
51
|
+
private escapeHtml;
|
|
50
52
|
setText(newText: string): void;
|
|
51
53
|
destroy(): void;
|
|
52
54
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;IAWZ,OAAO,CAAC,YAAY;IAuBpB,sBAAsB,IAAI,IAAI;IAmB9B,OAAO,CAAC,kBAAkB;IAgD1B,KAAK,IAAI,IAAI;IASb,QAAQ,IAAI,IAAI;IAuChB,IAAI,IAAI,IAAI;IAQZ,KAAK,IAAI,IAAI;IAQb,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAiDjC,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAa9B,OAAO,IAAI,IAAI;CAOhB;AAGD,eAAe,MAAM,CAAC"}
|
|
@@ -40,6 +40,7 @@ export declare class Typing {
|
|
|
40
40
|
originalText: string;
|
|
41
41
|
constructor(container: HTMLElement | string, options: TypingOptions);
|
|
42
42
|
init(): void;
|
|
43
|
+
private injectStyles;
|
|
43
44
|
setupVisibilityManager(): void;
|
|
44
45
|
private buildTextFromUnits;
|
|
45
46
|
start(): void;
|
|
@@ -47,6 +48,7 @@ export declare class Typing {
|
|
|
47
48
|
stop(): void;
|
|
48
49
|
reset(): void;
|
|
49
50
|
updateDisplay(text: string): void;
|
|
51
|
+
private escapeHtml;
|
|
50
52
|
setText(newText: string): void;
|
|
51
53
|
destroy(): void;
|
|
52
54
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;IAWZ,OAAO,CAAC,YAAY;IAuBpB,sBAAsB,IAAI,IAAI;IAmB9B,OAAO,CAAC,kBAAkB;IAgD1B,KAAK,IAAI,IAAI;IASb,QAAQ,IAAI,IAAI;IAuChB,IAAI,IAAI,IAAI;IAQZ,KAAK,IAAI,IAAI;IAQb,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAiDjC,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAa9B,OAAO,IAAI,IAAI;CAOhB;AAGD,eAAe,MAAM,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,"t",{value:!0});var t=require("react");class s{constructor(t,s={}){this.container=t,this.options={threshold:s.threshold??.1,rootMargin:s.rootMargin??"0px",root:s.root??null,onVisible:s.onVisible,onHidden:s.onHidden},this.intersectionObserver=null,this.visibilityChangeHandler=null,this.isVisible=!1,this.isPageVisible="undefined"==typeof document||!document.hidden,this.setupIntersectionObserver(),this.setupPageVisibility()}setupIntersectionObserver(){if("undefined"==typeof window||void 0===window.IntersectionObserver)return this.isVisible=!0,void(this.isPageVisible&&this.options.onVisible&&this.options.onVisible());this.intersectionObserver=new IntersectionObserver(t=>{for(const s of t)s.target===this.container&&(s.isIntersecting?(this.isVisible=!0,this.isPageVisible&&this.options.onVisible&&this.options.onVisible()):(this.isVisible=!1,this.options.onHidden&&this.options.onHidden()))},{threshold:this.options.threshold,rootMargin:this.options.rootMargin,root:this.options.root||null}),this.intersectionObserver.observe(this.container)}setupPageVisibility(){"undefined"!=typeof document&&(this.visibilityChangeHandler=()=>{const t=this.isPageVisible;this.isPageVisible=!document.hidden,document.hidden?this.options.onHidden&&this.options.onHidden():t!==this.isPageVisible&&this.isVisible&&this.options.onVisible&&this.options.onVisible()},document.addEventListener("visibilitychange",this.visibilityChangeHandler),document.hidden&&this.isVisible&&this.options.onHidden&&this.options.onHidden())}getIsVisible(){return this.isVisible&&this.isPageVisible}updateOptions(t){this.options={...this.options,...t},this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.setupIntersectionObserver()}destroy(){this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.visibilityChangeHandler&&"undefined"!=typeof document&&(document.removeEventListener("visibilitychange",this.visibilityChangeHandler),this.visibilityChangeHandler=null)}}function i(t){const s=t.charCodeAt(0);if(s<44032||s>55203)return[t];const i=s-44032,e=Math.floor(i/588),
|
|
1
|
+
Object.defineProperty(exports,"t",{value:!0});var t=require("react");class s{constructor(t,s={}){this.container=t,this.options={threshold:s.threshold??.1,rootMargin:s.rootMargin??"0px",root:s.root??null,onVisible:s.onVisible,onHidden:s.onHidden},this.intersectionObserver=null,this.visibilityChangeHandler=null,this.isVisible=!1,this.isPageVisible="undefined"==typeof document||!document.hidden,this.setupIntersectionObserver(),this.setupPageVisibility()}setupIntersectionObserver(){if("undefined"==typeof window||void 0===window.IntersectionObserver)return this.isVisible=!0,void(this.isPageVisible&&this.options.onVisible&&this.options.onVisible());this.intersectionObserver=new IntersectionObserver(t=>{for(const s of t)s.target===this.container&&(s.isIntersecting?(this.isVisible=!0,this.isPageVisible&&this.options.onVisible&&this.options.onVisible()):(this.isVisible=!1,this.options.onHidden&&this.options.onHidden()))},{threshold:this.options.threshold,rootMargin:this.options.rootMargin,root:this.options.root||null}),this.intersectionObserver.observe(this.container)}setupPageVisibility(){"undefined"!=typeof document&&(this.visibilityChangeHandler=()=>{const t=this.isPageVisible;this.isPageVisible=!document.hidden,document.hidden?this.options.onHidden&&this.options.onHidden():t!==this.isPageVisible&&this.isVisible&&this.options.onVisible&&this.options.onVisible()},document.addEventListener("visibilitychange",this.visibilityChangeHandler),document.hidden&&this.isVisible&&this.options.onHidden&&this.options.onHidden())}getIsVisible(){return this.isVisible&&this.isPageVisible}updateOptions(t){this.options={...this.options,...t},this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.setupIntersectionObserver()}destroy(){this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.visibilityChangeHandler&&"undefined"!=typeof document&&(document.removeEventListener("visibilitychange",this.visibilityChangeHandler),this.visibilityChangeHandler=null)}}function i(t){const s=t.charCodeAt(0);if(s<44032||s>55203)return[t];const i=s-44032,e=Math.floor(i/588),n=Math.floor(i%588/28),h=i%28,o=[];return o.push(["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][e]),o.push(["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"][n]),h>0&&o.push(["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][h]),o}function e(t,s,i){const e=["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(t),n=["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"].indexOf(s),h=i?["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(i):0;if(-1===e||-1===n)return t+(s||"")+(i||"");const o=44032+21*e*28+28*n+h;return String.fromCharCode(o)}function n(t){const s=[],e=[];for(let n=0;n<t.length;n++){const h=t[n],o=h.charCodeAt(0),r=s.length;if(o>=44032&&o<=55203){const t=i(h);s.push(...t),e.push({start:r,end:s.length,isHangul:!0})}else s.push(h),e.push({start:r,end:s.length,isHangul:!1})}return{units:s,charUnitRanges:e}}class h{constructor(t,s){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.originalText=s.text,this.config={text:s.text,speed:s.speed??50,delay:s.delay??0,enabled:s.enabled??!0,threshold:s.threshold??.2,rootMargin:s.rootMargin??"0px 0px -100px 0px",triggerOnce:s.triggerOnce??!1,showCursor:s.showCursor??!0,cursorChar:s.cursorChar??"|",onUpdate:s.onUpdate||null,onComplete:s.onComplete||null};const i=n(this.config.text);this.textUnits=i.units,this.charUnitRanges=i.charUnitRanges,this.currentIndex=0,this.displayedText="",this.timeoutId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(""),this.injectStyles(),this.setupVisibilityManager()}injectStyles(){if(document.getElementById("masoneffect-typing-styles"))return;const t=document.createElement("style");t.id="masoneffect-typing-styles",t.textContent="\n .typing-char {\n transition: opacity 0.3s ease-in;\n display: inline-block;\n }\n .typing-cursor {\n display: inline-block;\n }\n ",document.head.appendChild(t),this.container.style.whiteSpace="pre-wrap"}setupVisibilityManager(){this.visibilityManager=new s(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,setTimeout(()=>this.start(),this.config.delay))},onHidden:()=>{}})}buildTextFromUnits(t){if(0===t)return"";let s="";for(let i=0;i<this.charUnitRanges.length;i++){const n=this.charUnitRanges[i];if(n.start>=t)break;const h=Math.min(t-n.start,n.end-n.start);if(h<=0)break;if(n.isHangul){const t=this.textUnits.slice(n.start,n.start+h);1===t.length?s+=t[0]:2===t.length?s+=e(t[0],t[1]):t.length>=3&&(s+=e(t[0],t[1],t[2]))}else h>0&&(s+=this.textUnits[n.start])}return s}start(){this.isRunning||(this.isRunning=!0,this.currentIndex=0,this.displayedText="",this.typeNext())}typeNext(){if(this.currentIndex>=this.textUnits.length)return this.isRunning=!1,this.config.showCursor&&this.updateDisplay(this.originalText),void(this.config.onComplete&&this.config.onComplete());this.displayedText=this.buildTextFromUnits(this.currentIndex+1);let t=this.displayedText;this.config.showCursor&&(t+=this.config.cursorChar),this.updateDisplay(t),this.config.onUpdate&&this.config.onUpdate(this.displayedText),this.currentIndex++,this.timeoutId=setTimeout(()=>{this.typeNext()},this.config.speed)}stop(){this.isRunning=!1,this.timeoutId&&(clearTimeout(this.timeoutId),this.timeoutId=null)}reset(){this.stop(),this.currentIndex=0,this.displayedText="",this.hasTriggered=!1,this.updateDisplay("")}updateDisplay(t){const s=t.replace(new RegExp(this.escapeHtml(this.config.cursorChar)+"$"),""),i=t.endsWith(this.config.cursorChar),e=(this.container.textContent||"").replace(new RegExp(this.config.cursorChar+"$"),"");let n="";for(let t=0;t<s.length;t++){const i=s[t],h=t>=e.length,o=" "===i?" ":this.escapeHtml(i);n+=h?`<span class="typing-char typing-fade-in" style="opacity: 0;">${o}</span>`:`<span class="typing-char" style="opacity: 1;">${o}</span>`}i&&(n+=`<span class="typing-cursor">${this.escapeHtml(this.config.cursorChar)}</span>`),this.container.innerHTML=n;const h=this.container.querySelectorAll(".typing-fade-in");h.length>0&&requestAnimationFrame(()=>{h.forEach(t=>{t.style.opacity="1",t.classList.remove("typing-fade-in")})})}escapeHtml(t){const s=document.createElement("div");return s.textContent=t,s.innerHTML}setText(t){this.originalText=t,this.config.text=t;const s=n(t);this.textUnits=s.units,this.charUnitRanges=s.charUnitRanges,this.reset(),this.config.enabled&&setTimeout(()=>this.start(),this.config.delay)}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}}const o=t.forwardRef((s,i)=>{const e=t.useRef(null),n=t.useRef(null);return t.useEffect(()=>{if(!e.current)return;if(n.current)return;const{className:t,style:i,text:o,speed:r,delay:l,enabled:c,threshold:u,rootMargin:a,triggerOnce:d,showCursor:p,cursorChar:y,onUpdate:g,onComplete:f}=s,m={text:o,speed:r,delay:l,enabled:c,threshold:u,rootMargin:a,triggerOnce:d,showCursor:p,cursorChar:y,onUpdate:g,onComplete:f};return n.current=new h(e.current,m),()=>{n.current&&(n.current.destroy(),n.current=null)}},[]),t.useEffect(()=>{if(!n.current)return;const{text:t,speed:i,delay:e,enabled:h,threshold:o,rootMargin:r,triggerOnce:l,showCursor:c,cursorChar:u,onUpdate:a,onComplete:d}=s;void 0!==t&&t!==n.current.originalText&&n.current.setText(t)},[s.text,s.speed,s.delay,s.enabled,s.threshold,s.rootMargin,s.triggerOnce,s.showCursor,s.cursorChar,s.onUpdate,s.onComplete]),t.useImperativeHandle(i,()=>({start:()=>{n.current?n.current.start():console.warn("Typing: μΈμ€ν΄μ€κ° μμ§ μ΄κΈ°νλμ§ μμμ΅λλ€.")},stop:()=>{n.current?n.current.stop():console.warn("Typing: μΈμ€ν΄μ€κ° μμ§ μ΄κΈ°νλμ§ μμμ΅λλ€.")},reset:()=>{n.current?n.current.reset():console.warn("Typing: μΈμ€ν΄μ€κ° μμ§ μ΄κΈ°νλμ§ μμμ΅λλ€.")},setText:t=>{n.current?n.current.setText(t):console.warn("Typing: μΈμ€ν΄μ€κ° μμ§ μ΄κΈ°νλμ§ μμμ΅λλ€.")},destroy:()=>{n.current&&(n.current.destroy(),n.current=null)}})),t.createElement("div",{ref:e,className:s.className,style:s.style})});o.displayName="Typing",exports.default=o;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import t,{useRef as s,useEffect as i}from"react";class e{constructor(t,s={}){this.container=t,this.options={threshold:s.threshold??.1,rootMargin:s.rootMargin??"0px",root:s.root??null,onVisible:s.onVisible,onHidden:s.onHidden},this.intersectionObserver=null,this.visibilityChangeHandler=null,this.isVisible=!1,this.isPageVisible="undefined"==typeof document||!document.hidden,this.setupIntersectionObserver(),this.setupPageVisibility()}setupIntersectionObserver(){if("undefined"==typeof window||void 0===window.IntersectionObserver)return this.isVisible=!0,void(this.isPageVisible&&this.options.onVisible&&this.options.onVisible());this.intersectionObserver=new IntersectionObserver(t=>{for(const s of t)s.target===this.container&&(s.isIntersecting?(this.isVisible=!0,this.isPageVisible&&this.options.onVisible&&this.options.onVisible()):(this.isVisible=!1,this.options.onHidden&&this.options.onHidden()))},{threshold:this.options.threshold,rootMargin:this.options.rootMargin,root:this.options.root||null}),this.intersectionObserver.observe(this.container)}setupPageVisibility(){"undefined"!=typeof document&&(this.visibilityChangeHandler=()=>{const t=this.isPageVisible;this.isPageVisible=!document.hidden,document.hidden?this.options.onHidden&&this.options.onHidden():t!==this.isPageVisible&&this.isVisible&&this.options.onVisible&&this.options.onVisible()},document.addEventListener("visibilitychange",this.visibilityChangeHandler),document.hidden&&this.isVisible&&this.options.onHidden&&this.options.onHidden())}getIsVisible(){return this.isVisible&&this.isPageVisible}updateOptions(t){this.options={...this.options,...t},this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.setupIntersectionObserver()}destroy(){this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.visibilityChangeHandler&&"undefined"!=typeof document&&(document.removeEventListener("visibilitychange",this.visibilityChangeHandler),this.visibilityChangeHandler=null)}}function
|
|
1
|
+
import t,{useRef as s,useEffect as i}from"react";class e{constructor(t,s={}){this.container=t,this.options={threshold:s.threshold??.1,rootMargin:s.rootMargin??"0px",root:s.root??null,onVisible:s.onVisible,onHidden:s.onHidden},this.intersectionObserver=null,this.visibilityChangeHandler=null,this.isVisible=!1,this.isPageVisible="undefined"==typeof document||!document.hidden,this.setupIntersectionObserver(),this.setupPageVisibility()}setupIntersectionObserver(){if("undefined"==typeof window||void 0===window.IntersectionObserver)return this.isVisible=!0,void(this.isPageVisible&&this.options.onVisible&&this.options.onVisible());this.intersectionObserver=new IntersectionObserver(t=>{for(const s of t)s.target===this.container&&(s.isIntersecting?(this.isVisible=!0,this.isPageVisible&&this.options.onVisible&&this.options.onVisible()):(this.isVisible=!1,this.options.onHidden&&this.options.onHidden()))},{threshold:this.options.threshold,rootMargin:this.options.rootMargin,root:this.options.root||null}),this.intersectionObserver.observe(this.container)}setupPageVisibility(){"undefined"!=typeof document&&(this.visibilityChangeHandler=()=>{const t=this.isPageVisible;this.isPageVisible=!document.hidden,document.hidden?this.options.onHidden&&this.options.onHidden():t!==this.isPageVisible&&this.isVisible&&this.options.onVisible&&this.options.onVisible()},document.addEventListener("visibilitychange",this.visibilityChangeHandler),document.hidden&&this.isVisible&&this.options.onHidden&&this.options.onHidden())}getIsVisible(){return this.isVisible&&this.isPageVisible}updateOptions(t){this.options={...this.options,...t},this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.setupIntersectionObserver()}destroy(){this.intersectionObserver&&(this.intersectionObserver.disconnect(),this.intersectionObserver=null),this.visibilityChangeHandler&&"undefined"!=typeof document&&(document.removeEventListener("visibilitychange",this.visibilityChangeHandler),this.visibilityChangeHandler=null)}}function n(t){const s=t.charCodeAt(0);if(s<44032||s>55203)return[t];const i=s-44032,e=Math.floor(i/588),n=Math.floor(i%588/28),h=i%28,o=[];return o.push(["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][e]),o.push(["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"][n]),h>0&&o.push(["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"][h]),o}function h(t,s,i){const e=["γ±","γ²","γ΄","γ·","γΈ","γΉ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(t),n=["γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
‘","γ
’","γ
£"].indexOf(s),h=i?["","γ±","γ²","γ³","γ΄","γ΅","γΆ","γ·","γΉ","γΊ","γ»","γΌ","γ½","γΎ","γΏ","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
","γ
"].indexOf(i):0;if(-1===e||-1===n)return t+(s||"")+(i||"");const o=44032+21*e*28+28*n+h;return String.fromCharCode(o)}function o(t){const s=[],i=[];for(let e=0;e<t.length;e++){const h=t[e],o=h.charCodeAt(0),r=s.length;if(o>=44032&&o<=55203){const t=n(h);s.push(...t),i.push({start:r,end:s.length,isHangul:!0})}else s.push(h),i.push({start:r,end:s.length,isHangul:!1})}return{units:s,charUnitRanges:i}}class r{constructor(t,s){if(this.container="string"==typeof t?document.querySelector(t):t,!this.container)throw new Error("Container element not found");this.originalText=s.text,this.config={text:s.text,speed:s.speed??50,delay:s.delay??0,enabled:s.enabled??!0,threshold:s.threshold??.2,rootMargin:s.rootMargin??"0px 0px -100px 0px",triggerOnce:s.triggerOnce??!1,showCursor:s.showCursor??!0,cursorChar:s.cursorChar??"|",onUpdate:s.onUpdate||null,onComplete:s.onComplete||null};const i=o(this.config.text);this.textUnits=i.units,this.charUnitRanges=i.charUnitRanges,this.currentIndex=0,this.displayedText="",this.timeoutId=null,this.visibilityManager=null,this.isRunning=!1,this.hasTriggered=!1,this.init()}init(){this.updateDisplay(""),this.injectStyles(),this.setupVisibilityManager()}injectStyles(){if(document.getElementById("masoneffect-typing-styles"))return;const t=document.createElement("style");t.id="masoneffect-typing-styles",t.textContent="\n .typing-char {\n transition: opacity 0.3s ease-in;\n display: inline-block;\n }\n .typing-cursor {\n display: inline-block;\n }\n ",document.head.appendChild(t),this.container.style.whiteSpace="pre-wrap"}setupVisibilityManager(){this.visibilityManager=new e(this.container,{threshold:this.config.threshold,rootMargin:this.config.rootMargin,onVisible:()=>{!this.hasTriggered&&this.config.enabled&&(this.hasTriggered=!0,setTimeout(()=>this.start(),this.config.delay))},onHidden:()=>{}})}buildTextFromUnits(t){if(0===t)return"";let s="";for(let i=0;i<this.charUnitRanges.length;i++){const e=this.charUnitRanges[i];if(e.start>=t)break;const n=Math.min(t-e.start,e.end-e.start);if(n<=0)break;if(e.isHangul){const t=this.textUnits.slice(e.start,e.start+n);1===t.length?s+=t[0]:2===t.length?s+=h(t[0],t[1]):t.length>=3&&(s+=h(t[0],t[1],t[2]))}else n>0&&(s+=this.textUnits[e.start])}return s}start(){this.isRunning||(this.isRunning=!0,this.currentIndex=0,this.displayedText="",this.typeNext())}typeNext(){if(this.currentIndex>=this.textUnits.length)return this.isRunning=!1,this.config.showCursor&&this.updateDisplay(this.originalText),void(this.config.onComplete&&this.config.onComplete());this.displayedText=this.buildTextFromUnits(this.currentIndex+1);let t=this.displayedText;this.config.showCursor&&(t+=this.config.cursorChar),this.updateDisplay(t),this.config.onUpdate&&this.config.onUpdate(this.displayedText),this.currentIndex++,this.timeoutId=setTimeout(()=>{this.typeNext()},this.config.speed)}stop(){this.isRunning=!1,this.timeoutId&&(clearTimeout(this.timeoutId),this.timeoutId=null)}reset(){this.stop(),this.currentIndex=0,this.displayedText="",this.hasTriggered=!1,this.updateDisplay("")}updateDisplay(t){const s=t.replace(new RegExp(this.escapeHtml(this.config.cursorChar)+"$"),""),i=t.endsWith(this.config.cursorChar),e=(this.container.textContent||"").replace(new RegExp(this.config.cursorChar+"$"),"");let n="";for(let t=0;t<s.length;t++){const i=s[t],h=t>=e.length,o=" "===i?" ":this.escapeHtml(i);n+=h?`<span class="typing-char typing-fade-in" style="opacity: 0;">${o}</span>`:`<span class="typing-char" style="opacity: 1;">${o}</span>`}i&&(n+=`<span class="typing-cursor">${this.escapeHtml(this.config.cursorChar)}</span>`),this.container.innerHTML=n;const h=this.container.querySelectorAll(".typing-fade-in");h.length>0&&requestAnimationFrame(()=>{h.forEach(t=>{t.style.opacity="1",t.classList.remove("typing-fade-in")})})}escapeHtml(t){const s=document.createElement("div");return s.textContent=t,s.innerHTML}setText(t){this.originalText=t,this.config.text=t;const s=o(t);this.textUnits=s.units,this.charUnitRanges=s.charUnitRanges,this.reset(),this.config.enabled&&setTimeout(()=>this.start(),this.config.delay)}destroy(){this.stop(),this.visibilityManager&&(this.visibilityManager.destroy(),this.visibilityManager=null)}}const l=t.forwardRef((e,n)=>{const h=s(null),o=s(null);return i(()=>{if(!h.current)return;if(o.current)return;const{className:t,style:s,text:i,speed:n,delay:l,enabled:c,threshold:a,rootMargin:u,triggerOnce:d,showCursor:p,cursorChar:y,onUpdate:f,onComplete:g}=e,m={text:i,speed:n,delay:l,enabled:c,threshold:a,rootMargin:u,triggerOnce:d,showCursor:p,cursorChar:y,onUpdate:f,onComplete:g};return o.current=new r(h.current,m),()=>{o.current&&(o.current.destroy(),o.current=null)}},[]),i(()=>{if(!o.current)return;const{text:t,speed:s,delay:i,enabled:n,threshold:h,rootMargin:r,triggerOnce:l,showCursor:c,cursorChar:a,onUpdate:u,onComplete:d}=e;void 0!==t&&t!==o.current.originalText&&o.current.setText(t)},[e.text,e.speed,e.delay,e.enabled,e.threshold,e.rootMargin,e.triggerOnce,e.showCursor,e.cursorChar,e.onUpdate,e.onComplete]),t.useImperativeHandle(n,()=>({start:()=>{o.current?o.current.start():console.warn("Typing: μΈμ€ν΄μ€κ° μμ§ μ΄κΈ°νλμ§ μμμ΅λλ€.")},stop:()=>{o.current?o.current.stop():console.warn("Typing: μΈμ€ν΄μ€κ° μμ§ μ΄κΈ°νλμ§ μμμ΅λλ€.")},reset:()=>{o.current?o.current.reset():console.warn("Typing: μΈμ€ν΄μ€κ° μμ§ μ΄κΈ°νλμ§ μμμ΅λλ€.")},setText:t=>{o.current?o.current.setText(t):console.warn("Typing: μΈμ€ν΄μ€κ° μμ§ μ΄κΈ°νλμ§ μμμ΅λλ€.")},destroy:()=>{o.current&&(o.current.destroy(),o.current=null)}})),t.createElement("div",{ref:h,className:e.className,style:e.style})});l.displayName="Typing";export{l as default};
|
|
@@ -40,6 +40,7 @@ export declare class Typing {
|
|
|
40
40
|
originalText: string;
|
|
41
41
|
constructor(container: HTMLElement | string, options: TypingOptions);
|
|
42
42
|
init(): void;
|
|
43
|
+
private injectStyles;
|
|
43
44
|
setupVisibilityManager(): void;
|
|
44
45
|
private buildTextFromUnits;
|
|
45
46
|
start(): void;
|
|
@@ -47,6 +48,7 @@ export declare class Typing {
|
|
|
47
48
|
stop(): void;
|
|
48
49
|
reset(): void;
|
|
49
50
|
updateDisplay(text: string): void;
|
|
51
|
+
private escapeHtml;
|
|
50
52
|
setText(newText: string): void;
|
|
51
53
|
destroy(): void;
|
|
52
54
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/core/typing/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAEH,OAAO,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAElE,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CACzB;AAyFD,qBAAa,MAAM;IACjB,SAAS,EAAE,WAAW,CAAC;IACvB,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,aAAa,EAAE,UAAU,GAAG,YAAY,CAAC,CAAC,GAAG;QACjE,QAAQ,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;QACpC,UAAU,EAAE,aAAa,CAAC,YAAY,CAAC,CAAC;KACzC,CAAC;IACF,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,OAAO,CAAA;KAAE,CAAC,CAAC;IACzE,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,SAAS,EAAE,UAAU,CAAC,OAAO,UAAU,CAAC,GAAG,IAAI,CAAC;IAChD,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAAC;IAC5C,SAAS,EAAE,OAAO,CAAC;IACnB,YAAY,EAAE,OAAO,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;gBAET,SAAS,EAAE,WAAW,GAAG,MAAM,EAAE,OAAO,EAAE,aAAa;IA6CnE,IAAI,IAAI,IAAI;IAWZ,OAAO,CAAC,YAAY;IAuBpB,sBAAsB,IAAI,IAAI;IAmB9B,OAAO,CAAC,kBAAkB;IAgD1B,KAAK,IAAI,IAAI;IASb,QAAQ,IAAI,IAAI;IAuChB,IAAI,IAAI,IAAI;IAQZ,KAAK,IAAI,IAAI;IAQb,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAiDjC,OAAO,CAAC,UAAU;IAOlB,OAAO,CAAC,OAAO,EAAE,MAAM,GAAG,IAAI;IAa9B,OAAO,IAAI,IAAI;CAOhB;AAGD,eAAe,MAAM,CAAC"}
|
|
@@ -208,6 +208,7 @@ declare class TextToParticle {
|
|
|
208
208
|
originalText: string;
|
|
209
209
|
constructor(container: HTMLElement | string, options: TypingOptions);
|
|
210
210
|
init(): void;
|
|
211
|
+
private injectStyles;
|
|
211
212
|
setupVisibilityManager(): void;
|
|
212
213
|
private buildTextFromUnits;
|
|
213
214
|
start(): void;
|
|
@@ -215,6 +216,7 @@ declare class TextToParticle {
|
|
|
215
216
|
stop(): void;
|
|
216
217
|
reset(): void;
|
|
217
218
|
updateDisplay(text: string): void;
|
|
219
|
+
private escapeHtml;
|
|
218
220
|
setText(newText: string): void;
|
|
219
221
|
destroy(): void;
|
|
220
222
|
}
|