# antonbobrov/vevet architecture

> Architecture diagram of the GitHub repository antonbobrov/vevet, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-25). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/antonbobrov/vevet
- Repository: https://github.com/antonbobrov/vevet

## Overview

Vevet.js is a client-side interaction library: an application imports its API, initializes or uses the shared core, then composes components to turn browser events, viewport state, and media resources into animations and interactive DOM/canvas behavior. The README documents the full component catalog; sampled source confirms core setup and internal wiring for Cursor, Snap, Swipe, and Scrollbar. Other component relationships are intentionally limited to documented responsibilities because their implementations were not sampled.

Main entry points: [`src/index.ts`](https://github.com/antonbobrov/vevet/blob/master/src/index.ts) (Public exports), [`src/core/index.ts`](https://github.com/antonbobrov/vevet/blob/master/src/core/index.ts) (Core instance), [`src/components/Swipe/index.ts`](https://github.com/antonbobrov/vevet/blob/master/src/components/Swipe/index.ts) (Swipe and inertia), [`src/components/Snap/index.ts`](https://github.com/antonbobrov/vevet/blob/master/src/components/Snap/index.ts) (Snap carousel)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_entry["Public API and core"]
  node_api["Public exports<br/>[index.ts]"]
  node_core["Core instance<br/>[index.ts]"]
  node_init["Core initializer<br/>[initVevet.ts]"]
  node_viewport["Viewport handler<br/>[index.ts]"]
  node_pageload["Page-load handler<br/>[index.ts]"]
end

subgraph group_foundation["Shared foundations"]
  node_base["Module and callbacks<br/>[index.ts]"]
  node_responsive["Responsive base<br/>[index.ts]"]
  node_utils["Shared utilities<br/>[index.ts]"]
end

subgraph group_input["Input and navigation"]
  node_pointers["Pointer tracking<br/>[index.ts]"]
  node_swipe["Swipe and inertia<br/>[index.ts]"]
  node_snap["Snap carousel<br/>[index.ts]"]
  node_scrollbar["Custom scrollbar<br/>[index.ts]"]
  node_scrollprogress["Scroll progress<br/>[index.ts]"]
end

subgraph group_visual["Visual components"]
  node_canvas["Canvas rendering<br/>[index.ts]"]
  node_canvasmedia["Canvas media<br/>[index.ts]"]
  node_cursor["Custom cursor<br/>[index.ts]"]
  node_marquee["Marquee<br/>[index.ts]"]
  node_splittext["Split text<br/>[index.ts]"]
  node_inview["Viewport visibility<br/>[index.ts]"]
end

subgraph group_lifecycle["Animation and loading"]
  node_preloader["Preloader<br/>[index.ts]"]
  node_progresspreloader["Progress preloader<br/>[index.ts]"]
  node_raf["Animation frame loop<br/>[index.ts]"]
  node_timeline["Animation timeline<br/>[index.ts]"]
end

node_app(("Application code"))
node_browser(("Browser runtime"))

node_app -->|"imports"| node_api
node_api -->|"initializes"| node_init
node_api -->|"exports"| node_core
node_api -->|"exports"| node_pointers
node_api -->|"exports"| node_swipe
node_api -->|"exports"| node_snap
node_api -->|"exports"| node_scrollbar
node_api -->|"exports"| node_scrollprogress
node_api -->|"exports"| node_canvas
node_api -->|"exports"| node_canvasmedia
node_api -->|"exports"| node_cursor
node_api -->|"exports"| node_marquee
node_api -->|"exports"| node_splittext
node_api -->|"exports"| node_inview
node_api -->|"exports"| node_preloader
node_api -->|"exports"| node_progresspreloader
node_api -->|"exports"| node_raf
node_api -->|"exports"| node_timeline
node_init -->|"creates"| node_core
node_core -->|"creates"| node_viewport
node_core -->|"creates"| node_pageload
node_browser -->|"provides runtime data"| node_core
node_core -->|"updates from"| node_viewport
node_cursor -->|"reads prefix"| node_init
node_cursor -->|"animates with"| node_raf
node_snap -->|"extends"| node_base
node_snap -->|"uses"| node_utils
node_snap -.->|"emits resize state"| node_scrollbar
node_scrollbar -->|"creates"| node_swipe
node_scrollbar -->|"reads scroll state"| node_snap
node_swipe -->|"tracks pointers"| node_pointers
node_swipe -->|"animates bounce"| node_timeline
node_swipe -->|"extends"| node_base
node_cursor -->|"extends"| node_base
node_scrollbar -->|"extends"| node_base
node_canvasmedia -->|"renders media on"| node_canvas
node_progresspreloader -->|"preloads resources"| node_browser
node_preloader -->|"controls loading UI"| node_browser
node_raf -->|"schedules frames"| node_browser
node_inview -->|"observes visibility"| node_browser
node_scrollprogress -->|"reads scroll position"| node_browser

click node_api "https://github.com/antonbobrov/vevet/blob/master/src/index.ts"
click node_core "https://github.com/antonbobrov/vevet/blob/master/src/core/index.ts"
click node_init "https://github.com/antonbobrov/vevet/blob/master/src/global/initVevet.ts"
click node_viewport "https://github.com/antonbobrov/vevet/blob/master/src/core/handlers/createViewport/index.ts"
click node_pageload "https://github.com/antonbobrov/vevet/blob/master/src/core/handlers/createPageLoad/index.ts"
click node_base "https://github.com/antonbobrov/vevet/blob/master/src/base/Module/index.ts"
click node_responsive "https://github.com/antonbobrov/vevet/blob/master/src/base/Responsive/index.ts"
click node_utils "https://github.com/antonbobrov/vevet/blob/master/src/utils/index.ts"
click node_pointers "https://github.com/antonbobrov/vevet/blob/master/src/components/Pointers/index.ts"
click node_swipe "https://github.com/antonbobrov/vevet/blob/master/src/components/Swipe/index.ts"
click node_snap "https://github.com/antonbobrov/vevet/blob/master/src/components/Snap/index.ts"
click node_scrollbar "https://github.com/antonbobrov/vevet/blob/master/src/components/Scrollbar/index.ts"
click node_scrollprogress "https://github.com/antonbobrov/vevet/blob/master/src/components/ScrollProgress/index.ts"
click node_canvas "https://github.com/antonbobrov/vevet/blob/master/src/components/Canvas/index.ts"
click node_canvasmedia "https://github.com/antonbobrov/vevet/blob/master/src/components/CanvasMedia/index.ts"
click node_cursor "https://github.com/antonbobrov/vevet/blob/master/src/components/Cursor/index.ts"
click node_marquee "https://github.com/antonbobrov/vevet/blob/master/src/components/Marquee/index.ts"
click node_splittext "https://github.com/antonbobrov/vevet/blob/master/src/components/SplitText/index.ts"
click node_inview "https://github.com/antonbobrov/vevet/blob/master/src/components/InView/index.ts"
click node_preloader "https://github.com/antonbobrov/vevet/blob/master/src/components/Preloader/index.ts"
click node_progresspreloader "https://github.com/antonbobrov/vevet/blob/master/src/components/ProgressPreloader/index.ts"
click node_raf "https://github.com/antonbobrov/vevet/blob/master/src/components/Raf/index.ts"
click node_timeline "https://github.com/antonbobrov/vevet/blob/master/src/components/Timeline/index.ts"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_api,node_core,node_init,node_viewport,node_pageload,node_browser toneBlue
class node_base,node_responsive,node_utils toneAmber
class node_pointers,node_swipe,node_snap,node_scrollbar,node_scrollprogress toneMint
class node_canvas,node_canvasmedia,node_cursor,node_marquee,node_splittext,node_inview toneRose
class node_preloader,node_progresspreloader,node_raf,node_timeline,node_app toneIndigo
```

## Components

### Public API and core

- [Public exports](https://github.com/antonbobrov/vevet/blob/master/src/index.ts): `src/index.ts`
- [Core instance](https://github.com/antonbobrov/vevet/blob/master/src/core/index.ts): `src/core/index.ts`
- [Core initializer](https://github.com/antonbobrov/vevet/blob/master/src/global/initVevet.ts): `src/global/initVevet.ts`
- [Viewport handler](https://github.com/antonbobrov/vevet/blob/master/src/core/handlers/createViewport/index.ts): `src/core/handlers/createViewport/index.ts`
- [Page-load handler](https://github.com/antonbobrov/vevet/blob/master/src/core/handlers/createPageLoad/index.ts): `src/core/handlers/createPageLoad/index.ts`

### Shared foundations

- [Module and callbacks](https://github.com/antonbobrov/vevet/blob/master/src/base/Module/index.ts): `src/base/Module/index.ts`
- [Responsive base](https://github.com/antonbobrov/vevet/blob/master/src/base/Responsive/index.ts): `src/base/Responsive/index.ts`
- [Shared utilities](https://github.com/antonbobrov/vevet/blob/master/src/utils/index.ts): `src/utils/index.ts`

### Input and navigation

- [Pointer tracking](https://github.com/antonbobrov/vevet/blob/master/src/components/Pointers/index.ts): `src/components/Pointers/index.ts`
- [Swipe and inertia](https://github.com/antonbobrov/vevet/blob/master/src/components/Swipe/index.ts): `src/components/Swipe/index.ts`
- [Snap carousel](https://github.com/antonbobrov/vevet/blob/master/src/components/Snap/index.ts): `src/components/Snap/index.ts`
- [Custom scrollbar](https://github.com/antonbobrov/vevet/blob/master/src/components/Scrollbar/index.ts): `src/components/Scrollbar/index.ts`
- [Scroll progress](https://github.com/antonbobrov/vevet/blob/master/src/components/ScrollProgress/index.ts): `src/components/ScrollProgress/index.ts`

### Visual components

- [Canvas rendering](https://github.com/antonbobrov/vevet/blob/master/src/components/Canvas/index.ts): `src/components/Canvas/index.ts`
- [Canvas media](https://github.com/antonbobrov/vevet/blob/master/src/components/CanvasMedia/index.ts): `src/components/CanvasMedia/index.ts`
- [Custom cursor](https://github.com/antonbobrov/vevet/blob/master/src/components/Cursor/index.ts): `src/components/Cursor/index.ts`
- [Marquee](https://github.com/antonbobrov/vevet/blob/master/src/components/Marquee/index.ts): `src/components/Marquee/index.ts`
- [Split text](https://github.com/antonbobrov/vevet/blob/master/src/components/SplitText/index.ts): `src/components/SplitText/index.ts`
- [Viewport visibility](https://github.com/antonbobrov/vevet/blob/master/src/components/InView/index.ts): `src/components/InView/index.ts`

### Animation and loading

- [Preloader](https://github.com/antonbobrov/vevet/blob/master/src/components/Preloader/index.ts): `src/components/Preloader/index.ts`
- [Progress preloader](https://github.com/antonbobrov/vevet/blob/master/src/components/ProgressPreloader/index.ts): `src/components/ProgressPreloader/index.ts`
- [Animation frame loop](https://github.com/antonbobrov/vevet/blob/master/src/components/Raf/index.ts): `src/components/Raf/index.ts`
- [Animation timeline](https://github.com/antonbobrov/vevet/blob/master/src/components/Timeline/index.ts): `src/components/Timeline/index.ts`

### Other components

- **Application code**
- **Browser runtime**

## Connections

- Application code → Public exports: imports
- Public exports → Core initializer: initializes
- Public exports → Core instance: exports
- Public exports → Pointer tracking: exports
- Public exports → Swipe and inertia: exports
- Public exports → Snap carousel: exports
- Public exports → Custom scrollbar: exports
- Public exports → Scroll progress: exports
- Public exports → Canvas rendering: exports
- Public exports → Canvas media: exports
- Public exports → Custom cursor: exports
- Public exports → Marquee: exports
- Public exports → Split text: exports
- Public exports → Viewport visibility: exports
- Public exports → Preloader: exports
- Public exports → Progress preloader: exports
- Public exports → Animation frame loop: exports
- Public exports → Animation timeline: exports
- Core initializer → Core instance: creates
- Core instance → Viewport handler: creates
- Core instance → Page-load handler: creates
- Browser runtime → Core instance: provides runtime data
- Core instance → Viewport handler: updates from
- Custom cursor → Core initializer: reads prefix
- Custom cursor → Animation frame loop: animates with
- Snap carousel → Module and callbacks: extends
- Snap carousel → Shared utilities: uses
- Snap carousel → Custom scrollbar: emits resize state
- Custom scrollbar → Swipe and inertia: creates
- Custom scrollbar → Snap carousel: reads scroll state
- Swipe and inertia → Pointer tracking: tracks pointers
- Swipe and inertia → Animation timeline: animates bounce
- Swipe and inertia → Module and callbacks: extends
- Custom cursor → Module and callbacks: extends
- Custom scrollbar → Module and callbacks: extends
- Canvas media → Canvas rendering: renders media on
- Progress preloader → Browser runtime: preloads resources
- Preloader → Browser runtime: controls loading UI
- Animation frame loop → Browser runtime: schedules frames
- Viewport visibility → Browser runtime: observes visibility
- Scroll progress → Browser runtime: reads scroll position