@mmmmzxe/react-360-view 1.0.0 → 1.0.1
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 +5 -5
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# @mmmmzxe/react-360-
|
|
1
|
+
# @mmmmzxe/react-360-view
|
|
2
2
|
|
|
3
3
|
A standalone, configurable 360° image viewer for React with drag rotation, zoom, hotspots, and auto-rotate support.
|
|
4
4
|
|
|
@@ -17,7 +17,7 @@ A standalone, configurable 360° image viewer for React with drag rotation, zoom
|
|
|
17
17
|
## Installation
|
|
18
18
|
|
|
19
19
|
```bash
|
|
20
|
-
npm install @mmmmzxe/react-360-
|
|
20
|
+
npm install @mmmmzxe/react-360-view
|
|
21
21
|
```
|
|
22
22
|
|
|
23
23
|
### Peer Dependencies
|
|
@@ -31,7 +31,7 @@ npm install react react-dom lucide-react
|
|
|
31
31
|
Import the stylesheet once in your app (e.g. in your root layout or entry file):
|
|
32
32
|
|
|
33
33
|
```tsx
|
|
34
|
-
import '@mmmmzxe/react-360-
|
|
34
|
+
import '@mmmmzxe/react-360-view/styles.css';
|
|
35
35
|
```
|
|
36
36
|
|
|
37
37
|
Styles are scoped to `[data-viewer-360]` via CSS `@scope` and will not override your app's global theme or Tailwind classes. Requires a **client component** in Next.js App Router (`'use client'`).
|
|
@@ -53,12 +53,12 @@ If styles don't appear after updating, delete `.next` and restart the dev server
|
|
|
53
53
|
```tsx
|
|
54
54
|
'use client';
|
|
55
55
|
|
|
56
|
-
import '@mmmmzxe/react-360-
|
|
56
|
+
import '@mmmmzxe/react-360-view/styles.css';
|
|
57
57
|
import { useState } from "react";
|
|
58
58
|
import {
|
|
59
59
|
Viewer360,
|
|
60
60
|
type Viewer360Frame,
|
|
61
|
-
} from "@mmmmzxe/react-360-
|
|
61
|
+
} from "@mmmmzxe/react-360-view";
|
|
62
62
|
|
|
63
63
|
const frames: Viewer360Frame[] = [
|
|
64
64
|
{ id: "1", src: "/images/frame-01.jpg", label: "Front" },
|
package/package.json
CHANGED