tanstack 1.0.6 โ 2.0.2
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/LICENSE +21 -0
- package/README.md +241 -37
- package/dist/index.cjs +79 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +4 -0
- package/dist/index.d.ts +4 -0
- package/dist/index.js +6 -0
- package/dist/index.js.map +1 -0
- package/package.json +76 -18
- package/packages/adapter-videojs/package.json +33 -0
- package/packages/core/package.json +26 -0
- package/packages/plugin-bookmark/package.json +29 -0
- package/packages/react/package.json +40 -0
- package/index.js +0 -33
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026-present TanStack Player Contributors
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/README.md
CHANGED
|
@@ -1,67 +1,271 @@
|
|
|
1
|
-
|
|
1
|
+
<div align="center">
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
<a href="https://30tools.com">
|
|
4
|
+
<img src="https://img.shields.io/badge/Sponsored%20by-30tools.com-6c5ce7?style=for-the-badge&logo=data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0id2hpdGUiPjxwYXRoIGQ9Ik0xMiAyQzYuNDggMiAyIDYuNDggMiAxMnM0LjQ4IDEwIDEwIDEwIDEwLTQuNDggMTAtMTBTMTcuNTIgMiAxMiAyem0wIDE4Yy00LjQxIDAtOC0zLjU5LTgtOHMzLjU5LTggOC04IDggMy41OSA4IDgtMy41OSA4LTggNHoiLz48L3N2Zz4=" alt="Sponsored by 30tools.com" />
|
|
5
|
+
</a>
|
|
4
6
|
|
|
5
|
-
|
|
7
|
+
**[30tools.com](https://30tools.com)** โ **All Your Tools. One Platform.** 194+ free, privacy-first online tools for Image, PDF, Video, Developer, SEO & more. Fast, beautiful, and no uploads required.
|
|
6
8
|
|
|
7
|
-
|
|
9
|
+
<br/>
|
|
10
|
+
|
|
11
|
+
# โถ TanStack Player
|
|
12
|
+
|
|
13
|
+
**A developer-first, universal Video Player SDK built on Video.js**
|
|
14
|
+
|
|
15
|
+
Headless hooks ยท Plugin architecture ยท React-first DX ยท Streaming ready
|
|
16
|
+
|
|
17
|
+
[](https://www.npmjs.com/package/tanstack)
|
|
18
|
+
[](https://www.npmjs.com/package/tanstack)
|
|
19
|
+
[](https://bundlephobia.com/package/tanstack)
|
|
20
|
+
[](LICENSE)
|
|
21
|
+
[](https://github.com/sh20raj/tanstack)
|
|
22
|
+
[](https://github.com/sh20raj/tanstack/issues)
|
|
23
|
+
[](https://github.com/sh20raj/tanstack/pulls)
|
|
24
|
+
[](https://www.typescriptlang.org/)
|
|
25
|
+
[](https://videojs.com/)
|
|
8
26
|
[](https://visitorbadge.io/status?path=https%3A%2F%2Fwww.npmjs.com%2Fpackage%2Ftanstack%3FactiveTab%3Dreadme)
|
|
27
|
+
|
|
28
|
+
[Documentation](https://sh20raj.github.io/tanstack) ยท [npm](https://www.npmjs.com/package/tanstack) ยท [Examples](https://github.com/sh20raj/tanstack/tree/main/examples) ยท [Contributing](CONTRIBUTING.md)
|
|
29
|
+
|
|
30
|
+
</div>
|
|
31
|
+
|
|
9
32
|
---
|
|
10
33
|
|
|
11
|
-
##
|
|
34
|
+
## โจ Why TanStack Player?
|
|
12
35
|
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
|
16
|
-
|
|
17
|
-
| ๐ฌ **
|
|
18
|
-
|
|
|
19
|
-
|
|
|
20
|
-
|
|
|
21
|
-
|
|
|
22
|
-
|
|
|
23
|
-
| ๐ **[SEO Tools](https://30tools.com/search?category=seo)** | Keyword research, rank tracking, technical SEO & more |
|
|
36
|
+
Building video experiences is hard โ buffering, streaming formats, browser quirks, accessibility, and state management all add complexity. TanStack Player abstracts all of this behind a clean, modern SDK:
|
|
37
|
+
|
|
38
|
+
| Feature | Description |
|
|
39
|
+
|---------|-------------|
|
|
40
|
+
| ๐ฌ **Headless Core** | Framework-agnostic engine with play/pause/seek/volume/speed |
|
|
41
|
+
| ๐ช **React Hooks** | `useTanStackPlayer()`, `useProgress()`, `useBookmarks()` |
|
|
42
|
+
| ๐ **Plugin System** | Lifecycle-aware plugins with event bus access |
|
|
43
|
+
| ๐ก **Streaming** | HLS, DASH, adaptive bitrate via Video.js |
|
|
44
|
+
| โก **Tiny** | ~21KB total SDK (ESM, gzipped much smaller) |
|
|
45
|
+
| ๐ฏ **TypeScript** | Full typed API with JSDoc |
|
|
24
46
|
|
|
25
47
|
---
|
|
26
48
|
|
|
27
|
-
##
|
|
49
|
+
## ๐ฆ Installation
|
|
50
|
+
|
|
51
|
+
```bash
|
|
52
|
+
npm install tanstack video.js
|
|
53
|
+
```
|
|
28
54
|
|
|
29
|
-
|
|
30
|
-
|
|
55
|
+
> **Note:** `video.js` is a peer dependency. Load it via CDN or bundle it.
|
|
56
|
+
|
|
57
|
+
---
|
|
31
58
|
|
|
32
|
-
|
|
33
|
-
Instant processing. No queues, no countdown timers, no "premium speed" gates.
|
|
59
|
+
## ๐ Quick Start
|
|
34
60
|
|
|
35
|
-
|
|
36
|
-
|
|
61
|
+
```tsx
|
|
62
|
+
import { TanStackPlayer } from 'tanstack'
|
|
63
|
+
|
|
64
|
+
export default function App() {
|
|
65
|
+
return (
|
|
66
|
+
<TanStackPlayer
|
|
67
|
+
src="https://example.com/video.mp4"
|
|
68
|
+
controls
|
|
69
|
+
autoPlay={false}
|
|
70
|
+
/>
|
|
71
|
+
)
|
|
72
|
+
}
|
|
73
|
+
```
|
|
37
74
|
|
|
38
75
|
---
|
|
39
76
|
|
|
40
|
-
##
|
|
77
|
+
## ๐ช Hooks API
|
|
41
78
|
|
|
42
|
-
|
|
79
|
+
Build completely custom UI with headless hooks:
|
|
43
80
|
|
|
44
|
-
|
|
81
|
+
```tsx
|
|
82
|
+
import { useTanStackPlayer, useProgress } from 'tanstack'
|
|
83
|
+
|
|
84
|
+
function Controls() {
|
|
85
|
+
const { play, pause, isPlaying, seek, setVolume } = useTanStackPlayer()
|
|
86
|
+
const { progress, buffered, currentTime, duration } = useProgress()
|
|
87
|
+
|
|
88
|
+
return (
|
|
89
|
+
<div>
|
|
90
|
+
<button onClick={() => isPlaying ? pause() : play()}>
|
|
91
|
+
{isPlaying ? 'โธ' : 'โถ'}
|
|
92
|
+
</button>
|
|
93
|
+
<div>Progress: {progress.toFixed(1)}%</div>
|
|
94
|
+
</div>
|
|
95
|
+
)
|
|
96
|
+
}
|
|
97
|
+
```
|
|
45
98
|
|
|
46
99
|
---
|
|
47
100
|
|
|
48
|
-
##
|
|
101
|
+
## ๐ Plugin System
|
|
102
|
+
|
|
103
|
+
Extend player capabilities with plugins:
|
|
104
|
+
|
|
105
|
+
```tsx
|
|
106
|
+
import { TanStackPlayer, createBookmarkPlugin } from 'tanstack'
|
|
107
|
+
|
|
108
|
+
const bookmarks = createBookmarkPlugin()
|
|
109
|
+
|
|
110
|
+
function App() {
|
|
111
|
+
return (
|
|
112
|
+
<TanStackPlayer
|
|
113
|
+
src="/video.mp4"
|
|
114
|
+
plugins={[bookmarks]}
|
|
115
|
+
>
|
|
116
|
+
<BookmarkControls />
|
|
117
|
+
</TanStackPlayer>
|
|
118
|
+
)
|
|
119
|
+
}
|
|
120
|
+
```
|
|
121
|
+
|
|
122
|
+
### Using Bookmark Hooks
|
|
123
|
+
|
|
124
|
+
```tsx
|
|
125
|
+
import { useBookmarks } from 'tanstack'
|
|
126
|
+
|
|
127
|
+
function BookmarkControls() {
|
|
128
|
+
const { bookmarks, addBookmark, seekToBookmark } = useBookmarks()
|
|
129
|
+
|
|
130
|
+
return (
|
|
131
|
+
<div>
|
|
132
|
+
<button onClick={() => addBookmark('Important moment')}>
|
|
133
|
+
๐ Bookmark
|
|
134
|
+
</button>
|
|
135
|
+
{bookmarks.map(bm => (
|
|
136
|
+
<button key={bm.id} onClick={() => seekToBookmark(bm.id)}>
|
|
137
|
+
{bm.label} ({bm.time}s)
|
|
138
|
+
</button>
|
|
139
|
+
))}
|
|
140
|
+
</div>
|
|
141
|
+
)
|
|
142
|
+
}
|
|
143
|
+
```
|
|
144
|
+
|
|
145
|
+
---
|
|
146
|
+
|
|
147
|
+
## ๐ฆ Packages
|
|
148
|
+
|
|
149
|
+
| Package | Size | Description |
|
|
150
|
+
|---------|------|-------------|
|
|
151
|
+
| `tanstack` | โ | All-in-one package (re-exports everything) |
|
|
152
|
+
| `@tanstack-player/core` | 8.7KB | Headless event bus, state store, controller, plugin runtime |
|
|
153
|
+
| `@tanstack-player/adapter-videojs` | 4.6KB | Video.js engine adapter |
|
|
154
|
+
| `@tanstack-player/react` | 6.2KB | React component + hooks |
|
|
155
|
+
| `@tanstack-player/plugin-bookmark` | 1.6KB | Bookmark plugin |
|
|
156
|
+
|
|
157
|
+
---
|
|
158
|
+
|
|
159
|
+
## ๐ Architecture
|
|
160
|
+
|
|
161
|
+
```
|
|
162
|
+
TanStack Player
|
|
163
|
+
โโ Core (headless)
|
|
164
|
+
โ โโโ EventBus โ typed event emitter
|
|
165
|
+
โ โโโ StateStore โ reactive state management
|
|
166
|
+
โ โโโ PlayerController โ unified playback API
|
|
167
|
+
โ โโโ PluginRuntime โ plugin lifecycle manager
|
|
168
|
+
โ
|
|
169
|
+
โโ Adapters
|
|
170
|
+
โ โโโ VideoJsAdapter โ Video.js โ Core bridge
|
|
171
|
+
โ
|
|
172
|
+
โโ React
|
|
173
|
+
โ โโโ <TanStackPlayer /> โ component
|
|
174
|
+
โ โโโ useTanStackPlayer โ control hook
|
|
175
|
+
โ โโโ useProgress โ progress hook
|
|
176
|
+
โ โโโ useBookmarks โ bookmark plugin hook
|
|
177
|
+
โ
|
|
178
|
+
โโ Plugins
|
|
179
|
+
โโโ BookmarkPlugin โ timestamp bookmarks
|
|
180
|
+
```
|
|
181
|
+
|
|
182
|
+
---
|
|
183
|
+
|
|
184
|
+
## โ๏ธ Video.js Options
|
|
185
|
+
|
|
186
|
+
Pass native Video.js configuration through:
|
|
187
|
+
|
|
188
|
+
```tsx
|
|
189
|
+
<TanStackPlayer
|
|
190
|
+
src="/video.mp4"
|
|
191
|
+
videojsOptions={{
|
|
192
|
+
fluid: true,
|
|
193
|
+
preload: 'auto',
|
|
194
|
+
playbackRates: [0.5, 1, 1.5, 2],
|
|
195
|
+
}}
|
|
196
|
+
/>
|
|
197
|
+
```
|
|
198
|
+
|
|
199
|
+
---
|
|
200
|
+
|
|
201
|
+
## ๐ฏ Events
|
|
202
|
+
|
|
203
|
+
Unified event system across all adapters:
|
|
204
|
+
|
|
205
|
+
```tsx
|
|
206
|
+
<TanStackPlayer
|
|
207
|
+
src="/video.mp4"
|
|
208
|
+
onReady={() => console.log('Ready!')}
|
|
209
|
+
onPlay={() => console.log('Playing')}
|
|
210
|
+
onPause={() => console.log('Paused')}
|
|
211
|
+
onEnded={() => console.log('Ended')}
|
|
212
|
+
onTimeUpdate={(time, duration) => console.log(`${time}/${duration}`)}
|
|
213
|
+
onError={(err) => console.error(err)}
|
|
214
|
+
/>
|
|
215
|
+
```
|
|
216
|
+
|
|
217
|
+
---
|
|
218
|
+
|
|
219
|
+
## ๐ Development
|
|
49
220
|
|
|
50
221
|
```bash
|
|
51
|
-
|
|
222
|
+
git clone https://github.com/sh20raj/tanstack
|
|
223
|
+
cd tanstack
|
|
224
|
+
npm install
|
|
225
|
+
npm run build
|
|
226
|
+
npm run dev
|
|
52
227
|
```
|
|
53
228
|
|
|
54
|
-
|
|
229
|
+
See [CONTRIBUTING.md](CONTRIBUTING.md) for detailed guidelines.
|
|
230
|
+
|
|
231
|
+
---
|
|
232
|
+
|
|
233
|
+
## ๐ฃ Roadmap
|
|
55
234
|
|
|
56
|
-
-
|
|
57
|
-
-
|
|
58
|
-
-
|
|
59
|
-
-
|
|
60
|
-
-
|
|
61
|
-
-
|
|
235
|
+
- [ ] HLS.js adapter
|
|
236
|
+
- [ ] Plyr lightweight adapter
|
|
237
|
+
- [ ] Analytics plugin
|
|
238
|
+
- [ ] Floating mini-player plugin
|
|
239
|
+
- [ ] Subtitle editor plugin
|
|
240
|
+
- [ ] AI chapter detection plugin
|
|
241
|
+
- [ ] React Native support
|
|
62
242
|
|
|
63
243
|
---
|
|
64
244
|
|
|
65
|
-
##
|
|
245
|
+
## ๐งฐ Recommended Tools
|
|
246
|
+
|
|
247
|
+
Looking for developer utilities to use alongside TanStack Player? Check out **[30tools.com](https://30tools.com)** โ a suite of **194+ free, privacy-first online tools** for developers:
|
|
248
|
+
|
|
249
|
+
- **JSON Formatter & Diff Viewer** โ perfect for debugging API responses
|
|
250
|
+
- **Image Compressor & Converter** โ optimize video thumbnails and posters
|
|
251
|
+
- **JWT Decoder** โ inspect auth tokens for protected video content
|
|
252
|
+
- **CSS Gradient Generator** โ create beautiful player UI gradients
|
|
253
|
+
- **Base64 โ Image** โ handle inline poster images
|
|
254
|
+
|
|
255
|
+
All tools run directly in your browser for maximum privacy. No uploads, no tracking.
|
|
256
|
+
|
|
257
|
+
๐ **[30tools.com](https://30tools.com)** โ One platform, every tool you need.
|
|
258
|
+
|
|
259
|
+
---
|
|
260
|
+
|
|
261
|
+
## ๐ License
|
|
262
|
+
|
|
263
|
+
[MIT](LICENSE) โ Made with โค๏ธ by [@sh20raj](https://github.com/sh20raj)
|
|
264
|
+
|
|
265
|
+
---
|
|
266
|
+
|
|
267
|
+
<div align="center">
|
|
268
|
+
|
|
269
|
+
**[โญ Star on GitHub](https://github.com/sh20raj/tanstack)** โ it helps a lot!
|
|
66
270
|
|
|
67
|
-
|
|
271
|
+
</div>
|
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,79 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var core = require('@tanstack-player/core');
|
|
4
|
+
var adapterVideojs = require('@tanstack-player/adapter-videojs');
|
|
5
|
+
var react = require('@tanstack-player/react');
|
|
6
|
+
var pluginBookmark = require('@tanstack-player/plugin-bookmark');
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
Object.defineProperty(exports, "EventBus", {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function () { return core.EventBus; }
|
|
13
|
+
});
|
|
14
|
+
Object.defineProperty(exports, "INITIAL_STATE", {
|
|
15
|
+
enumerable: true,
|
|
16
|
+
get: function () { return core.INITIAL_STATE; }
|
|
17
|
+
});
|
|
18
|
+
Object.defineProperty(exports, "PlayerController", {
|
|
19
|
+
enumerable: true,
|
|
20
|
+
get: function () { return core.PlayerController; }
|
|
21
|
+
});
|
|
22
|
+
Object.defineProperty(exports, "PlayerEvent", {
|
|
23
|
+
enumerable: true,
|
|
24
|
+
get: function () { return core.PlayerEvent; }
|
|
25
|
+
});
|
|
26
|
+
Object.defineProperty(exports, "PluginRuntime", {
|
|
27
|
+
enumerable: true,
|
|
28
|
+
get: function () { return core.PluginRuntime; }
|
|
29
|
+
});
|
|
30
|
+
Object.defineProperty(exports, "StateStore", {
|
|
31
|
+
enumerable: true,
|
|
32
|
+
get: function () { return core.StateStore; }
|
|
33
|
+
});
|
|
34
|
+
Object.defineProperty(exports, "VideoJsAdapter", {
|
|
35
|
+
enumerable: true,
|
|
36
|
+
get: function () { return adapterVideojs.VideoJsAdapter; }
|
|
37
|
+
});
|
|
38
|
+
Object.defineProperty(exports, "createVideoJsAdapter", {
|
|
39
|
+
enumerable: true,
|
|
40
|
+
get: function () { return adapterVideojs.createVideoJsAdapter; }
|
|
41
|
+
});
|
|
42
|
+
Object.defineProperty(exports, "TanStackPlayer", {
|
|
43
|
+
enumerable: true,
|
|
44
|
+
get: function () { return react.TanStackPlayer; }
|
|
45
|
+
});
|
|
46
|
+
Object.defineProperty(exports, "TanStackPlayerContext", {
|
|
47
|
+
enumerable: true,
|
|
48
|
+
get: function () { return react.TanStackPlayerContext; }
|
|
49
|
+
});
|
|
50
|
+
Object.defineProperty(exports, "useBookmarks", {
|
|
51
|
+
enumerable: true,
|
|
52
|
+
get: function () { return react.useBookmarks; }
|
|
53
|
+
});
|
|
54
|
+
Object.defineProperty(exports, "usePlayerContext", {
|
|
55
|
+
enumerable: true,
|
|
56
|
+
get: function () { return react.usePlayerContext; }
|
|
57
|
+
});
|
|
58
|
+
Object.defineProperty(exports, "useProgress", {
|
|
59
|
+
enumerable: true,
|
|
60
|
+
get: function () { return react.useProgress; }
|
|
61
|
+
});
|
|
62
|
+
Object.defineProperty(exports, "useTanStackPlayer", {
|
|
63
|
+
enumerable: true,
|
|
64
|
+
get: function () { return react.useTanStackPlayer; }
|
|
65
|
+
});
|
|
66
|
+
Object.defineProperty(exports, "BookmarkEvent", {
|
|
67
|
+
enumerable: true,
|
|
68
|
+
get: function () { return pluginBookmark.BookmarkEvent; }
|
|
69
|
+
});
|
|
70
|
+
Object.defineProperty(exports, "BookmarkPlugin", {
|
|
71
|
+
enumerable: true,
|
|
72
|
+
get: function () { return pluginBookmark.BookmarkPlugin; }
|
|
73
|
+
});
|
|
74
|
+
Object.defineProperty(exports, "createBookmarkPlugin", {
|
|
75
|
+
enumerable: true,
|
|
76
|
+
get: function () { return pluginBookmark.createBookmarkPlugin; }
|
|
77
|
+
});
|
|
78
|
+
//# sourceMappingURL=index.cjs.map
|
|
79
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs","sourcesContent":[]}
|
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export { EngineAdapter, EngineAdapterOptions, EventBridgeFn, EventBus, EventBusInterface, EventListener, INITIAL_STATE, PlayerContext, PlayerController, PlayerControllerInterface, PlayerControllerOptions, PlayerEvent, PlayerEventMap, PlayerSource, PlayerState, PluginFactory, PluginRuntime, StateListener, StateStore, StateStoreInterface, TanStackPlugin } from '@tanstack-player/core';
|
|
2
|
+
export { VideoJsAdapter, createVideoJsAdapter } from '@tanstack-player/adapter-videojs';
|
|
3
|
+
export { TanStackPlayer, TanStackPlayerContext, TanStackPlayerProps, useBookmarks, usePlayerContext, useProgress, useTanStackPlayer } from '@tanstack-player/react';
|
|
4
|
+
export { Bookmark, BookmarkEvent, BookmarkPlugin, createBookmarkPlugin } from '@tanstack-player/plugin-bookmark';
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
export { EngineAdapter, EngineAdapterOptions, EventBridgeFn, EventBus, EventBusInterface, EventListener, INITIAL_STATE, PlayerContext, PlayerController, PlayerControllerInterface, PlayerControllerOptions, PlayerEvent, PlayerEventMap, PlayerSource, PlayerState, PluginFactory, PluginRuntime, StateListener, StateStore, StateStoreInterface, TanStackPlugin } from '@tanstack-player/core';
|
|
2
|
+
export { VideoJsAdapter, createVideoJsAdapter } from '@tanstack-player/adapter-videojs';
|
|
3
|
+
export { TanStackPlayer, TanStackPlayerContext, TanStackPlayerProps, useBookmarks, usePlayerContext, useProgress, useTanStackPlayer } from '@tanstack-player/react';
|
|
4
|
+
export { Bookmark, BookmarkEvent, BookmarkPlugin, createBookmarkPlugin } from '@tanstack-player/plugin-bookmark';
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export { EventBus, INITIAL_STATE, PlayerController, PlayerEvent, PluginRuntime, StateStore } from '@tanstack-player/core';
|
|
2
|
+
export { VideoJsAdapter, createVideoJsAdapter } from '@tanstack-player/adapter-videojs';
|
|
3
|
+
export { TanStackPlayer, TanStackPlayerContext, useBookmarks, usePlayerContext, useProgress, useTanStackPlayer } from '@tanstack-player/react';
|
|
4
|
+
export { BookmarkEvent, BookmarkPlugin, createBookmarkPlugin } from '@tanstack-player/plugin-bookmark';
|
|
5
|
+
//# sourceMappingURL=index.js.map
|
|
6
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js","sourcesContent":[]}
|
package/package.json
CHANGED
|
@@ -1,31 +1,89 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "tanstack",
|
|
3
|
-
"version": "
|
|
4
|
-
"
|
|
5
|
-
"
|
|
3
|
+
"version": "2.0.2",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"description": "TanStack Player โ A developer-first, universal Video Player SDK built on Video.js with headless hooks, plugin architecture, and React-first DX",
|
|
6
|
+
"main": "dist/index.js",
|
|
7
|
+
"module": "dist/index.mjs",
|
|
8
|
+
"types": "dist/index.d.ts",
|
|
9
|
+
"exports": {
|
|
10
|
+
".": {
|
|
11
|
+
"types": "./dist/index.d.ts",
|
|
12
|
+
"import": "./dist/index.mjs",
|
|
13
|
+
"require": "./dist/index.js"
|
|
14
|
+
}
|
|
15
|
+
},
|
|
16
|
+
"files": [
|
|
17
|
+
"dist",
|
|
18
|
+
"packages/*/dist",
|
|
19
|
+
"packages/*/package.json",
|
|
20
|
+
"README.md",
|
|
21
|
+
"LICENSE"
|
|
22
|
+
],
|
|
23
|
+
"workspaces": [
|
|
24
|
+
"packages/*",
|
|
25
|
+
"examples/*"
|
|
26
|
+
],
|
|
6
27
|
"scripts": {
|
|
7
|
-
"
|
|
28
|
+
"build": "npm run build --workspaces --if-present && tsup",
|
|
29
|
+
"build:packages": "npm run build --workspaces --if-present",
|
|
30
|
+
"build:root": "tsup",
|
|
31
|
+
"dev": "npm run dev --workspace=examples/react-basic",
|
|
32
|
+
"docs:dev": "vitepress dev docs",
|
|
33
|
+
"docs:build": "vitepress build docs",
|
|
34
|
+
"docs:preview": "vitepress preview docs",
|
|
35
|
+
"clean": "rm -rf dist packages/*/dist examples/*/dist",
|
|
36
|
+
"prepublishOnly": "npm run build"
|
|
8
37
|
},
|
|
9
38
|
"keywords": [
|
|
10
|
-
"
|
|
11
|
-
"
|
|
12
|
-
"
|
|
13
|
-
"
|
|
14
|
-
"
|
|
15
|
-
"
|
|
16
|
-
"
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
39
|
+
"tanstack",
|
|
40
|
+
"video",
|
|
41
|
+
"player",
|
|
42
|
+
"video-player",
|
|
43
|
+
"videojs",
|
|
44
|
+
"video.js",
|
|
45
|
+
"react",
|
|
46
|
+
"hooks",
|
|
47
|
+
"headless",
|
|
48
|
+
"plugin",
|
|
49
|
+
"streaming",
|
|
50
|
+
"hls",
|
|
51
|
+
"sdk",
|
|
52
|
+
"media",
|
|
53
|
+
"playback"
|
|
20
54
|
],
|
|
21
|
-
"author": "
|
|
55
|
+
"author": "sh20raj",
|
|
22
56
|
"license": "MIT",
|
|
23
|
-
"homepage": "https://30tools.com",
|
|
24
57
|
"repository": {
|
|
25
58
|
"type": "git",
|
|
26
|
-
"url": "https://
|
|
59
|
+
"url": "https://github.com/sh20raj/tanstack"
|
|
27
60
|
},
|
|
61
|
+
"homepage": "https://sh20raj.github.io/tanstack",
|
|
28
62
|
"bugs": {
|
|
29
|
-
"url": "https://
|
|
63
|
+
"url": "https://github.com/sh20raj/tanstack/issues"
|
|
64
|
+
},
|
|
65
|
+
"dependencies": {
|
|
66
|
+
"@tanstack-player/core": "*",
|
|
67
|
+
"@tanstack-player/adapter-videojs": "*",
|
|
68
|
+
"@tanstack-player/react": "*",
|
|
69
|
+
"@tanstack-player/plugin-bookmark": "*"
|
|
70
|
+
},
|
|
71
|
+
"peerDependencies": {
|
|
72
|
+
"react": ">=18.0.0",
|
|
73
|
+
"react-dom": ">=18.0.0",
|
|
74
|
+
"video.js": ">=7.0.0"
|
|
75
|
+
},
|
|
76
|
+
"peerDependenciesMeta": {
|
|
77
|
+
"react": {
|
|
78
|
+
"optional": true
|
|
79
|
+
},
|
|
80
|
+
"react-dom": {
|
|
81
|
+
"optional": true
|
|
82
|
+
}
|
|
83
|
+
},
|
|
84
|
+
"devDependencies": {
|
|
85
|
+
"tsup": "^8.0.0",
|
|
86
|
+
"typescript": "^5.4.0",
|
|
87
|
+
"vitepress": "^1.5.0"
|
|
30
88
|
}
|
|
31
89
|
}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@tanstack-player/adapter-videojs",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "TanStack Player โ Video.js adapter",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"module": "dist/index.mjs",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/index.mjs",
|
|
11
|
+
"require": "./dist/index.js",
|
|
12
|
+
"types": "./dist/index.d.ts"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
"files": ["dist"],
|
|
16
|
+
"scripts": {
|
|
17
|
+
"build": "tsup",
|
|
18
|
+
"dev": "tsup --watch"
|
|
19
|
+
},
|
|
20
|
+
"sideEffects": false,
|
|
21
|
+
"license": "MIT",
|
|
22
|
+
"dependencies": {
|
|
23
|
+
"@tanstack-player/core": "*"
|
|
24
|
+
},
|
|
25
|
+
"peerDependencies": {
|
|
26
|
+
"video.js": ">=7.0.0"
|
|
27
|
+
},
|
|
28
|
+
"devDependencies": {
|
|
29
|
+
"tsup": "^8.0.0",
|
|
30
|
+
"typescript": "^5.4.0",
|
|
31
|
+
"video.js": "^8.0.0"
|
|
32
|
+
}
|
|
33
|
+
}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@tanstack-player/core",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "TanStack Player โ Headless core engine",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"module": "dist/index.mjs",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/index.mjs",
|
|
11
|
+
"require": "./dist/index.js",
|
|
12
|
+
"types": "./dist/index.d.ts"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
"files": ["dist"],
|
|
16
|
+
"scripts": {
|
|
17
|
+
"build": "tsup",
|
|
18
|
+
"dev": "tsup --watch"
|
|
19
|
+
},
|
|
20
|
+
"sideEffects": false,
|
|
21
|
+
"license": "MIT",
|
|
22
|
+
"devDependencies": {
|
|
23
|
+
"tsup": "^8.0.0",
|
|
24
|
+
"typescript": "^5.4.0"
|
|
25
|
+
}
|
|
26
|
+
}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@tanstack-player/plugin-bookmark",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "TanStack Player โ Bookmark plugin",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"module": "dist/index.mjs",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/index.mjs",
|
|
11
|
+
"require": "./dist/index.js",
|
|
12
|
+
"types": "./dist/index.d.ts"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
"files": ["dist"],
|
|
16
|
+
"scripts": {
|
|
17
|
+
"build": "tsup",
|
|
18
|
+
"dev": "tsup --watch"
|
|
19
|
+
},
|
|
20
|
+
"sideEffects": false,
|
|
21
|
+
"license": "MIT",
|
|
22
|
+
"dependencies": {
|
|
23
|
+
"@tanstack-player/core": "*"
|
|
24
|
+
},
|
|
25
|
+
"devDependencies": {
|
|
26
|
+
"tsup": "^8.0.0",
|
|
27
|
+
"typescript": "^5.4.0"
|
|
28
|
+
}
|
|
29
|
+
}
|
|
@@ -0,0 +1,40 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@tanstack-player/react",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"description": "TanStack Player โ React component and hooks",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"module": "dist/index.mjs",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/index.mjs",
|
|
11
|
+
"require": "./dist/index.js",
|
|
12
|
+
"types": "./dist/index.d.ts"
|
|
13
|
+
}
|
|
14
|
+
},
|
|
15
|
+
"files": ["dist"],
|
|
16
|
+
"scripts": {
|
|
17
|
+
"build": "tsup",
|
|
18
|
+
"dev": "tsup --watch"
|
|
19
|
+
},
|
|
20
|
+
"sideEffects": false,
|
|
21
|
+
"license": "MIT",
|
|
22
|
+
"dependencies": {
|
|
23
|
+
"@tanstack-player/core": "*",
|
|
24
|
+
"@tanstack-player/adapter-videojs": "*"
|
|
25
|
+
},
|
|
26
|
+
"peerDependencies": {
|
|
27
|
+
"react": ">=18.0.0",
|
|
28
|
+
"react-dom": ">=18.0.0",
|
|
29
|
+
"video.js": ">=7.0.0"
|
|
30
|
+
},
|
|
31
|
+
"devDependencies": {
|
|
32
|
+
"@types/react": "^18.0.0",
|
|
33
|
+
"@types/react-dom": "^18.0.0",
|
|
34
|
+
"react": "^18.0.0",
|
|
35
|
+
"react-dom": "^18.0.0",
|
|
36
|
+
"tsup": "^8.0.0",
|
|
37
|
+
"typescript": "^5.4.0",
|
|
38
|
+
"video.js": "^8.0.0"
|
|
39
|
+
}
|
|
40
|
+
}
|
package/index.js
DELETED
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* thirty-tools
|
|
3
|
-
*
|
|
4
|
-
* 194+ Free Online Tools & Converters
|
|
5
|
-
* https://30tools.com
|
|
6
|
-
*
|
|
7
|
-
* Compress images, edit PDFs, download videos, and more.
|
|
8
|
-
* 100% free, private, and browser-based.
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
module.exports = {
|
|
12
|
-
name: "thirty-tools",
|
|
13
|
-
version: "1.0.0",
|
|
14
|
-
url: "https://30tools.com",
|
|
15
|
-
description: "194+ free online tools & converters for image, PDF, video, SEO, and developer workflows.",
|
|
16
|
-
categories: [
|
|
17
|
-
"Image Tools",
|
|
18
|
-
"PDF Tools",
|
|
19
|
-
"Video Tools",
|
|
20
|
-
"Social Media Downloaders",
|
|
21
|
-
"Audio Tools",
|
|
22
|
-
"Utility Tools",
|
|
23
|
-
"Developer Tools",
|
|
24
|
-
"Fun Generators",
|
|
25
|
-
"SEO Tools"
|
|
26
|
-
],
|
|
27
|
-
visit: function () {
|
|
28
|
-
console.log("\n๐ง thirty-tools โ All Your Tools. One Platform.");
|
|
29
|
-
console.log(" https://30tools.com\n");
|
|
30
|
-
console.log(" 194+ free online tools for image, PDF, video, SEO & developer workflows.");
|
|
31
|
-
console.log(" 100% free โข Private by design โข No waiting\n");
|
|
32
|
-
}
|
|
33
|
-
};
|