recoat 0.0.1 → 0.1.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Murat Kamci
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,160 @@
+# recoat
+
+Animated backgrounds and text effects for the web. Zero dependencies.
+
+- **13 Backgrounds** — Canvas-based (zero deps) + Three.js-powered (optional peer dep)
+- **12 Text Animations** — DOM-based text effects, no canvas needed
+- **TypeScript** — Full type definitions included
+- **Tree-shakeable** — ESM + CJS, import only what you use
+
+## Install
+
+```bash
+npm install recoat
+```
+
+## Backgrounds
+
+### Canvas (zero dependencies)
+
+```js
+import { Aurora } from 'recoat';
+
+const bg = Aurora({ container: '#my-element' });
+bg.start();
+```
+
+Available: `Aurora`, `AsciiGrid`, `GlitchFog`, `StaticNoise`, `VoronoiShatter`, `MagneticSand`, `PixelCity`, `Underwater`
+
+### Three.js (requires `three` as peer dependency)
+
+```js
+import { Labyrinth } from 'recoat/three';
+
+const bg = Labyrinth({ container: '#my-element' });
+bg.start();
+```
+
+Available: `Labyrinth`, `ChromaticSpace`, `ImpossibleStairs`, `FiberNodes`, `DeepOcean`
+
+### Background API
+
+Every background returns the same interface:
+
+```ts
+interface BackgroundInstance {
+    start(): void;
+    stop(): void;
+    destroy(): void;
+    resize(width: number, height: number): void;
+}
+```
+
+### Background Config
+
+All backgrounds accept a config object:
+
+```ts
+Aurora({
+    container: '#hero',       // required — element or CSS selector
+    width: 1920,              // optional — defaults to container width
+    height: 1080,             // optional — defaults to container height
+    responsive: true,         // optional — auto-resize on window resize
+    // ...effect-specific options (colors, speed, intensity, etc.)
+});
+```
+
+## Text Animations
+
+```js
+import { GlitchText } from 'recoat/text';
+
+const anim = GlitchText({
+    element: '#my-heading',
+    text: 'Hello World',
+});
+anim.play();
+```
+
+Available: `Typewriter`, `GlitchText`, `ScrambleReveal`, `ChromaticText`, `GradientText`, `NeonPulse`, `WavyBounce`, `MatrixRain`, `GravityDrop`, `InkBleed`, `MagneticAssemble`, `EchoTrail`
+
+### Text Animation API
+
+Every text animation returns:
+
+```ts
+interface TextAnimationInstance {
+    play(): void;
+    reset(): void;
+    destroy(): void;
+}
+```
+
+## Entry Points
+
+| Import from | Contents | Dependencies |
+|---|---|---|
+| `recoat` | 8 canvas backgrounds | None |
+| `recoat/three` | 5 Three.js backgrounds | `three` (peer) |
+| `recoat/text` | 12 text animations | None |
+
+## Usage with Frameworks
+
+### React
+
+```jsx
+import { useEffect, useRef } from 'react';
+import { Aurora } from 'recoat';
+
+function Hero() {
+    const ref = useRef(null);
+
+    useEffect(() => {
+        if (!ref.current) return;
+        const bg = Aurora({ container: ref.current });
+        bg.start();
+        return () => bg.destroy();
+    }, []);
+
+    return <div ref={ref} style={{ width: '100%', height: '100vh' }} />;
+}
+```
+
+### Vue
+
+```vue
+<script setup>
+import { ref, onMounted, onUnmounted } from 'vue';
+import { Aurora } from 'recoat';
+
+const el = ref(null);
+let bg;
+
+onMounted(() => {
+    bg = Aurora({ container: el.value });
+    bg.start();
+});
+
+onUnmounted(() => bg?.destroy());
+</script>
+
+<template>
+    <div ref="el" style="width: 100%; height: 100vh" />
+</template>
+```
+
+### CDN / Script Tag
+
+```html
+<div id="bg" style="width: 100%; height: 100vh"></div>
+
+<script type="module">
+    import { Aurora } from 'https://unpkg.com/recoat/dist/index.mjs';
+
+    Aurora({ container: '#bg' }).start();
+</script>
+```
+
+## License
+
+MIT

package/dist/index.d.mts

@@ -0,0 +1,21 @@
+import { B as BackgroundFactory, a as BackgroundConfig, b as BackgroundInstance, A as AuroraConfig, c as AsciiGridConfig, G as GlitchFogConfig, S as StaticNoiseConfig, V as VoronoiShatterConfig, M as MagneticSandConfig, P as PixelCityConfig, U as UnderwaterConfig } from './types-Clm6ZZVT.mjs';
+
+declare function createBackground(factory: BackgroundFactory, config: BackgroundConfig): BackgroundInstance;
+
+declare function Aurora(config: AuroraConfig): BackgroundInstance;
+
+declare function AsciiGrid(config: AsciiGridConfig): BackgroundInstance;
+
+declare function GlitchFog(config: GlitchFogConfig): BackgroundInstance;
+
+declare function StaticNoise(config: StaticNoiseConfig): BackgroundInstance;
+
+declare function VoronoiShatter(config: VoronoiShatterConfig): BackgroundInstance;
+
+declare function MagneticSand(config: MagneticSandConfig): BackgroundInstance;
+
+declare function PixelCity(config: PixelCityConfig): BackgroundInstance;
+
+declare function Underwater(config: UnderwaterConfig): BackgroundInstance;
+
+export { AsciiGrid, AsciiGridConfig, Aurora, AuroraConfig, BackgroundConfig, BackgroundInstance, GlitchFog, GlitchFogConfig, MagneticSand, MagneticSandConfig, PixelCity, PixelCityConfig, StaticNoise, StaticNoiseConfig, Underwater, UnderwaterConfig, VoronoiShatter, VoronoiShatterConfig, createBackground };

package/dist/index.d.ts

@@ -0,0 +1,21 @@
+import { B as BackgroundFactory, a as BackgroundConfig, b as BackgroundInstance, A as AuroraConfig, c as AsciiGridConfig, G as GlitchFogConfig, S as StaticNoiseConfig, V as VoronoiShatterConfig, M as MagneticSandConfig, P as PixelCityConfig, U as UnderwaterConfig } from './types-Clm6ZZVT.js';
+
+declare function createBackground(factory: BackgroundFactory, config: BackgroundConfig): BackgroundInstance;
+
+declare function Aurora(config: AuroraConfig): BackgroundInstance;
+
+declare function AsciiGrid(config: AsciiGridConfig): BackgroundInstance;
+
+declare function GlitchFog(config: GlitchFogConfig): BackgroundInstance;
+
+declare function StaticNoise(config: StaticNoiseConfig): BackgroundInstance;
+
+declare function VoronoiShatter(config: VoronoiShatterConfig): BackgroundInstance;
+
+declare function MagneticSand(config: MagneticSandConfig): BackgroundInstance;
+
+declare function PixelCity(config: PixelCityConfig): BackgroundInstance;
+
+declare function Underwater(config: UnderwaterConfig): BackgroundInstance;
+
+export { AsciiGrid, AsciiGridConfig, Aurora, AuroraConfig, BackgroundConfig, BackgroundInstance, GlitchFog, GlitchFogConfig, MagneticSand, MagneticSandConfig, PixelCity, PixelCityConfig, StaticNoise, StaticNoiseConfig, Underwater, UnderwaterConfig, VoronoiShatter, VoronoiShatterConfig, createBackground };