@xrift/world-components 0.21.12 → 0.22.0

package/dist/components/LiveVideoPlayer/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/LiveVideoPlayer/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,oBAAoB;IACnC,sBAAsB;IACtB,EAAE,EAAE,MAAM,CAAA;IACV,eAAe;IACf,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACnC,eAAe;IACf,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACnC,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,iCAAiC;IACjC,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,2BAA2B;IAC3B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yBAAyB;IACzB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,6BAA6B;IAC7B,IAAI,CAAC,EAAE,QAAQ,GAAG,OAAO,CAAA;IACzB,oBAAoB;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;CACjC;AAED,MAAM,WAAW,qBAAqB;IACpC,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,EAAE,MAAM,CAAA;IACpB,OAAO,EAAE,OAAO,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,WAAW,EAAE,OAAO,CAAA;IACpB,UAAU,EAAE,MAAM,CAAA;IAClB,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACxC,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAED,MAAM,WAAW,oBAAoB;IACnC,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,OAAO,CAAA;IAChB,UAAU,EAAE,MAAM,IAAI,CAAA;CACvB;AAED,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC,IAAI,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,MAAM,CAAA;IACd,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;CACzC;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC,IAAI,EAAE,MAAM,CAAA;IACZ,OAAO,EAAE,OAAO,CAAA;CACjB;AAED,MAAM,WAAW,mBAAmB;IAClC,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC,IAAI,EAAE,MAAM,CAAA;CACb;AAED,MAAM,WAAW,mBAAmB;IAClC,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,CAAA;IAClB,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAED,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC,IAAI,EAAE,MAAM,CAAA;IACZ,UAAU,EAAE,MAAM,IAAI,CAAA;CACvB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/LiveVideoPlayer/types.ts"],"names":[],"mappings":"AAAA,2BAA2B;AAC3B,MAAM,WAAW,cAAc;IAC7B,cAAc;IACd,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,cAAc;IACd,OAAO,EAAE,OAAO,CAAA;IAChB,mBAAmB;IACnB,SAAS,EAAE,MAAM,CAAA;CAClB"}

package/dist/components/Video180Sphere/EyeView.d.ts

@@ -0,0 +1,14 @@
+interface EyeViewProps {
+    video: HTMLVideoElement;
+    eye: 'left' | 'right';
+    radius: number;
+    segments: number;
+    placeholderColor: string;
+}
+/**
+ * 各目用のビューを表示する内部コンポーネント
+ * Three.jsのlayersを使用してVR時に左右の目に適切な映像を表示
+ */
+export declare const EyeView: ({ video, eye, radius, segments, placeholderColor }: EyeViewProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=EyeView.d.ts.map

package/dist/components/Video180Sphere/EyeView.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EyeView.d.ts","sourceRoot":"","sources":["../../../src/components/Video180Sphere/EyeView.tsx"],"names":[],"mappings":"AAGA,UAAU,YAAY;IACpB,KAAK,EAAE,gBAAgB,CAAA;IACvB,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;IACrB,MAAM,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,MAAM,CAAA;IAChB,gBAAgB,EAAE,MAAM,CAAA;CACzB;AAED;;;GAGG;AACH,eAAO,MAAM,OAAO,GAAI,oDAAoD,YAAY,4CAiFvF,CAAA"}

package/dist/components/Video180Sphere/EyeView.js

@@ -0,0 +1,77 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef } from 'react';
+import { BackSide, Color, SRGBColorSpace, VideoTexture } from 'three';
+/**
+ * 各目用のビューを表示する内部コンポーネント
+ * Three.jsのlayersを使用してVR時に左右の目に適切な映像を表示
+ */
+export const EyeView = ({ video, eye, radius, segments, placeholderColor }) => {
+    const eyeIndex = eye === 'left' ? 0 : 1;
+    const meshRef = useRef(null);
+    const texture = useMemo(() => {
+        const tex = new VideoTexture(video);
+        tex.colorSpace = SRGBColorSpace;
+        return tex;
+    }, [video]);
+    const placeholderColorVec = useMemo(() => {
+        const color = new Color(placeholderColor);
+        return [color.r, color.g, color.b];
+    }, [placeholderColor]);
+    useEffect(() => {
+        if (!meshRef.current)
+            return;
+        // layer 0 = 通常カメラ（非VR）, layer 1 = 左目, layer 2 = 右目
+        // 左目のメッシュはlayer 0と1に、右目はlayer 2のみ
+        // これにより非VRモードでは左目の映像が見える
+        if (eye === 'left') {
+            meshRef.current.layers.enable(0);
+            meshRef.current.layers.enable(1);
+        }
+        else {
+            meshRef.current.layers.set(2);
+        }
+    }, [eye]);
+    useEffect(() => {
+        return () => {
+            texture.dispose();
+        };
+    }, [texture]);
+    // X軸のスケールを反転させて正しい向きのテクスチャを表示
+    // rotation=[0, Math.PI, 0]で180度回転し、前方を向くように調整
+    return (_jsxs("mesh", { rotation: [0, Math.PI, 0], scale: [-1, 1, 1], ref: meshRef, children: [_jsx("sphereGeometry", { args: [radius, segments, segments, 0, Math.PI] }), _jsx("shaderMaterial", { uniforms: {
+                    map: { value: texture },
+                    eyeIndex: { value: eyeIndex },
+                    placeholderColor: { value: placeholderColorVec },
+                }, side: BackSide, vertexShader: `
+          varying vec2 vUv;
+          void main() {
+            vUv = uv;
+            gl_Position = projectionMatrix * modelViewMatrix * vec4(position, 1.0);
+          }
+        `, fragmentShader: `
+          uniform sampler2D map;
+          uniform int eyeIndex;
+          uniform vec3 placeholderColor;
+          varying vec2 vUv;
+          void main() {
+            vec2 uv = vUv;
+            // Side-by-Side形式のステレオ動画: 左半分が左目、右半分が右目
+            if (eyeIndex == 0) {
+              // 左目: テクスチャの左半分を使用
+              uv.x = uv.x * 0.5;
+            } else {
+              // 右目: テクスチャの右半分を使用
+              uv.x = uv.x * 0.5 + 0.5;
+            }
+            vec4 texColor = texture2D(map, uv);
+            // 動画未読み込み時（黒い画面）はプレースホルダー色を表示
+            float luminance = dot(texColor.rgb, vec3(0.299, 0.587, 0.114));
+            if (luminance < 0.01) {
+              gl_FragColor = vec4(placeholderColor, 1.0);
+              return;
+            }
+            gl_FragColor = texColor;
+          }
+        ` })] }));
+};
+//# sourceMappingURL=EyeView.js.map

package/dist/components/Video180Sphere/EyeView.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EyeView.js","sourceRoot":"","sources":["../../../src/components/Video180Sphere/EyeView.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAQ,cAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAA;AAU3E;;;GAGG;AACH,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EAAE,KAAK,EAAE,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,gBAAgB,EAAgB,EAAE,EAAE;IAC1F,MAAM,QAAQ,GAAG,GAAG,KAAK,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;IACvC,MAAM,OAAO,GAAG,MAAM,CAAO,IAAI,CAAC,CAAA;IAElC,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,MAAM,GAAG,GAAG,IAAI,YAAY,CAAC,KAAK,CAAC,CAAA;QACnC,GAAG,CAAC,UAAU,GAAG,cAAc,CAAA;QAC/B,OAAO,GAAG,CAAA;IACZ,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAA;IAEX,MAAM,mBAAmB,GAAG,OAAO,CAAC,GAAG,EAAE;QACvC,MAAM,KAAK,GAAG,IAAI,KAAK,CAAC,gBAAgB,CAAC,CAAA;QACzC,OAAO,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAA;IACpC,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAA;IAEtB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO,CAAC,OAAO;YAAE,OAAM;QAC5B,mDAAmD;QACnD,kCAAkC;QAClC,yBAAyB;QACzB,IAAI,GAAG,KAAK,MAAM,EAAE,CAAC;YACnB,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;YAChC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;QAClC,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAA;QAC/B,CAAC;IACH,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAA;IAET,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,OAAO,EAAE,CAAA;QACnB,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAA;IAEb,8BAA8B;IAC9B,8CAA8C;IAC9C,OAAO,CACL,gBAAM,QAAQ,EAAE,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,OAAO,aAC9D,yBAAgB,IAAI,EAAE,CAAC,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,GAAI,EAClE,yBACE,QAAQ,EAAE;oBACR,GAAG,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE;oBACvB,QAAQ,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE;oBAC7B,gBAAgB,EAAE,EAAE,KAAK,EAAE,mBAAmB,EAAE;iBACjD,EACD,IAAI,EAAE,QAAQ,EACd,YAAY,EAAE;;;;;;SAMb,EACD,cAAc,EAAE;;;;;;;;;;;;;;;;;;;;;;;;SAwBf,GACD,IACG,CACR,CAAA;AACH,CAAC,CAAA"}

package/dist/components/Video180Sphere/index.d.ts

@@ -0,0 +1,19 @@
+import type { Video180SphereProps } from './types';
+export type { Video180SphereProps } from './types';
+/**
+ * 180度ステレオスコピック動画を半球に表示するコンポーネント
+ *
+ * Side-by-Side形式のステレオ動画に対応。
+ * VRモードでは左目と右目に適切な映像を表示する。
+ *
+ * @example
+ * ```tsx
+ * <Video180Sphere
+ *   url="/videos/sample-180-3d.mp4"
+ *   playing={true}
+ *   volume={0.8}
+ * />
+ * ```
+ */
+export declare const Video180Sphere: import("react").MemoExoticComponent<({ url, position, rotation, scale, playing, muted, volume, radius, segments, loop, placeholderColor, onEnded, onLoadedMetadata, onProgress, }: Video180SphereProps) => import("react/jsx-runtime").JSX.Element>;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Video180Sphere/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Video180Sphere/index.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAElD,YAAY,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAKlD;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,cAAc,qLAgBtB,mBAAmB,6CAkFvB,CAAA"}

package/dist/components/Video180Sphere/index.js

@@ -0,0 +1,90 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef, memo } from 'react';
+import { useFrame } from '@react-three/fiber';
+import { EyeView } from './EyeView';
+import { useWebAudioVolume } from '../../hooks/useWebAudioVolume';
+const DEFAULT_RADIUS = 5;
+const DEFAULT_SEGMENTS = 64;
+/**
+ * 180度ステレオスコピック動画を半球に表示するコンポーネント
+ *
+ * Side-by-Side形式のステレオ動画に対応。
+ * VRモードでは左目と右目に適切な映像を表示する。
+ *
+ * @example
+ * ```tsx
+ * <Video180Sphere
+ *   url="/videos/sample-180-3d.mp4"
+ *   playing={true}
+ *   volume={0.8}
+ * />
+ * ```
+ */
+export const Video180Sphere = memo(({ url, position, rotation, scale, playing = false, muted = false, volume = 1, radius = DEFAULT_RADIUS, segments = DEFAULT_SEGMENTS, loop = false, placeholderColor = '#000000', onEnded, onLoadedMetadata, onProgress, }) => {
+    const videoRef = useRef(null);
+    const video = useMemo(() => {
+        const vid = document.createElement('video');
+        vid.src = url;
+        vid.currentTime = 0;
+        vid.loop = loop;
+        vid.muted = muted;
+        vid.crossOrigin = 'anonymous';
+        vid.playsInline = true;
+        return vid;
+    }, [url, loop, muted]);
+    // videoRefを更新
+    useEffect(() => {
+        videoRef.current = video;
+    }, [video]);
+    // イベントハンドラの設定
+    useEffect(() => {
+        const handleEnded = () => {
+            onEnded?.();
+        };
+        const handleLoadedMetadata = () => {
+            onLoadedMetadata?.({ duration: video.duration });
+        };
+        const handleTimeUpdate = () => {
+            onProgress?.({ currentTime: video.currentTime });
+        };
+        video.addEventListener('ended', handleEnded);
+        video.addEventListener('loadedmetadata', handleLoadedMetadata);
+        video.addEventListener('timeupdate', handleTimeUpdate);
+        return () => {
+            video.removeEventListener('ended', handleEnded);
+            video.removeEventListener('loadedmetadata', handleLoadedMetadata);
+            video.removeEventListener('timeupdate', handleTimeUpdate);
+        };
+    }, [video, onEnded, onLoadedMetadata, onProgress]);
+    // 再生/停止の制御
+    useEffect(() => {
+        if (playing) {
+            video.play().catch((err) => {
+                console.error('Video play error:', err);
+            });
+        }
+        else {
+            video.pause();
+        }
+    }, [video, playing]);
+    // Web Audio API を使用した音量制御（iOS対応）
+    useWebAudioVolume(videoRef.current, volume);
+    // クリーンアップ
+    useEffect(() => {
+        return () => {
+            video.pause();
+            video.src = '';
+            video.removeAttribute('src');
+            video.srcObject = null;
+            video.load();
+        };
+    }, [video]);
+    // カメラのlayers設定（@react-three/xrのバグ対策）
+    // https://github.com/pmndrs/xr/issues/398
+    useFrame(({ camera }) => {
+        camera.layers.set(0);
+    });
+    return (_jsxs("group", { position: position, rotation: rotation, scale: scale, children: [_jsx(EyeView, { video: video, eye: "left", radius: radius, segments: segments, placeholderColor: placeholderColor }), _jsx(EyeView, { video: video, eye: "right", radius: radius, segments: segments, placeholderColor: placeholderColor })] }));
+});
+Video180Sphere.displayName = 'Video180Sphere';
+//# sourceMappingURL=index.js.map

package/dist/components/Video180Sphere/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Video180Sphere/index.tsx"],"names":[],"mappings":"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"}

package/dist/components/Video180Sphere/types.d.ts

@@ -0,0 +1,35 @@
+export interface Video180SphereProps {
+    /** 動画のURL */
+    url: string;
+    /** 位置 */
+    position?: [number, number, number];
+    /** 回転 */
+    rotation?: [number, number, number];
+    /** スケール */
+    scale?: number | [number, number, number];
+    /** 再生状態 */
+    playing?: boolean;
+    /** ミュート状態（trueにするとブラウザの自動再生制限を回避できる） */
+    muted?: boolean;
+    /** 音量 (0-1) */
+    volume?: number;
+    /** 半球の半径 */
+    radius?: number;
+    /** ジオメトリの解像度（セグメント数） */
+    segments?: number;
+    /** ループ再生するか */
+    loop?: boolean;
+    /** プレースホルダーの色（動画読み込み前に表示、デフォルト: 黒） */
+    placeholderColor?: string;
+    /** 動画終了時のコールバック */
+    onEnded?: () => void;
+    /** メタデータ読み込み時のコールバック */
+    onLoadedMetadata?: (event: {
+        duration: number;
+    }) => void;
+    /** 再生進捗更新時のコールバック */
+    onProgress?: (event: {
+        currentTime: number;
+    }) => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/components/Video180Sphere/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/Video180Sphere/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,mBAAmB;IAClC,aAAa;IACb,GAAG,EAAE,MAAM,CAAA;IACX,SAAS;IACT,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACnC,SAAS;IACT,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACnC,WAAW;IACX,KAAK,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACzC,WAAW;IACX,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,wCAAwC;IACxC,KAAK,CAAC,EAAE,OAAO,CAAA;IACf,eAAe;IACf,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,YAAY;IACZ,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,wBAAwB;IACxB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,eAAe;IACf,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,sCAAsC;IACtC,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,mBAAmB;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,wBAAwB;IACxB,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;IACxD,qBAAqB;IACrB,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,WAAW,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAA;CACtD"}

package/dist/components/Video180Sphere/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

package/dist/components/Video180Sphere/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/Video180Sphere/types.ts"],"names":[],"mappings":""}

package/dist/components/VideoPlayer/ControlPanel.d.ts

@@ -1,3 +1,3 @@
 import type { ControlPanelProps } from './types';
-export declare const ControlPanel: import("react").MemoExoticComponent<({ id, width, screenHeight, playing, progress, duration, volume, currentUrl, onPlayPause, onStop, onSeek, onVolumeChange, onUrlChange, }: ControlPanelProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const ControlPanel: import("react").MemoExoticComponent<({ id, width, screenHeight, playing, progress, duration, volume, url, onPlayPause, onStop, onSeek, onVolumeChange, onUrlChange, }: ControlPanelProps) => import("react/jsx-runtime").JSX.Element>;
 //# sourceMappingURL=ControlPanel.d.ts.map

package/dist/components/VideoPlayer/ControlPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ControlPanel.d.ts","sourceRoot":"","sources":["../../../src/components/VideoPlayer/ControlPanel.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAOhD,eAAO,MAAM,YAAY,gLAepB,iBAAiB,6CA2ErB,CAAA"}
+{"version":3,"file":"ControlPanel.d.ts","sourceRoot":"","sources":["../../../src/components/VideoPlayer/ControlPanel.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAOhD,eAAO,MAAM,YAAY,yKAepB,iBAAiB,6CA6FrB,CAAA"}

package/dist/components/VideoPlayer/ControlPanel.js

@@ -1,23 +1,34 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo } from 'react';
+import { memo, useCallback } from 'react';
 import { Text } from '@react-three/drei';
-import { PlayPauseButton } from './PlayPauseButton';
-import { StopButton } from './StopButton';
+import { IconButton } from '../commons/IconButton';
+import { VolumeControl } from '../commons/VolumeControl';
 import { ProgressBar } from './ProgressBar';
-import { VolumeControl } from './VolumeControl';
-import { UrlInputButton } from './UrlInputButton';
 import { formatTime } from './utils';
+import { useTextInputContext } from '../../contexts/TextInputContext';
 const PANEL_HEIGHT = 0.15;
-const BUTTON_SIZE_RATIO = 0.6;
+const BUTTON_SIZE = PANEL_HEIGHT * 0.6;
 const PROGRESS_BAR_WIDTH_RATIO = 0.5;
 const PROGRESS_BAR_HEIGHT = 0.02;
-export const ControlPanel = memo(({ id, width, screenHeight, playing, progress, duration, volume, currentUrl, onPlayPause, onStop, onSeek, onVolumeChange, onUrlChange, }) => {
+export const ControlPanel = memo(({ id, width, screenHeight, playing, progress, duration, volume, url, onPlayPause, onStop, onSeek, onVolumeChange, onUrlChange, }) => {
     const panelY = -screenHeight / 2 - PANEL_HEIGHT / 2;
-    const buttonSize = PANEL_HEIGHT * BUTTON_SIZE_RATIO;
     const progressBarWidth = width * PROGRESS_BAR_WIDTH_RATIO;
     const currentTime = progress * duration;
     const timeText = `${formatTime(currentTime)} / ${formatTime(duration)}`;
-    return (_jsxs("group", { position: [0, panelY, 0], children: [_jsxs("mesh", { position: [0, 0, 0], children: [_jsx("planeGeometry", { args: [width, PANEL_HEIGHT] }), _jsx("meshBasicMaterial", { color: "#1a1a2a", transparent: true, opacity: 0.9 })] }), _jsx(UrlInputButton, { id: `${id}-url-input`, position: [-width * 0.45, 0, 0.01], size: buttonSize, currentUrl: currentUrl, onUrlChange: onUrlChange }), _jsx(PlayPauseButton, { id: `${id}-play-pause`, position: [-width * 0.38, 0, 0.01], size: buttonSize, playing: playing, onInteract: onPlayPause }), _jsx(StopButton, { id: `${id}-stop`, position: [-width * 0.31, 0, 0.01], size: buttonSize, onInteract: onStop }), _jsx(ProgressBar, { id: `${id}-progress`, position: [0, 0.01, 0.01], width: progressBarWidth, height: PROGRESS_BAR_HEIGHT, progress: progress, duration: duration, onSeek: onSeek }), _jsx(Text, { position: [0, -0.035, 0.01], fontSize: 0.025, color: "#aaaaaa", anchorX: "center", anchorY: "middle", children: timeText }), _jsx(VolumeControl, { id: `${id}-volume`, position: [width * 0.4, 0, 0.01], size: buttonSize, volume: volume, onVolumeChange: onVolumeChange })] }));
+    const { requestTextInput } = useTextInputContext();
+    const handleUrlInput = useCallback(() => {
+        requestTextInput({
+            id: `${id}-url-input`,
+            placeholder: '動画のURLを入力',
+            initialValue: url,
+            onSubmit: (value) => {
+                if (value && value.trim() !== '') {
+                    onUrlChange(value.trim());
+                }
+            },
+        });
+    }, [id, url, onUrlChange, requestTextInput]);
+    return (_jsxs("group", { position: [0, panelY, 0], children: [_jsxs("mesh", { position: [0, 0, 0], children: [_jsx("planeGeometry", { args: [width, PANEL_HEIGHT] }), _jsx("meshBasicMaterial", { color: "#1a1a2a", transparent: true, opacity: 0.9 })] }), _jsx(IconButton, { id: `${id}-url-input`, position: [-width * 0.45, 0, 0.01], size: BUTTON_SIZE, icon: "\uD83D\uDD17", interactionText: "URL\u5909\u66F4", onInteract: handleUrlInput }), _jsx(IconButton, { id: `${id}-play-pause`, position: [-width * 0.38, 0, 0.01], size: BUTTON_SIZE, icon: playing ? "||" : "▶", interactionText: playing ? "一時停止" : "再生", onInteract: onPlayPause }), _jsx(IconButton, { id: `${id}-stop`, position: [-width * 0.31, 0, 0.01], size: BUTTON_SIZE, icon: "\u25A0", interactionText: "\u505C\u6B62", onInteract: onStop }), _jsx(ProgressBar, { id: `${id}-progress`, position: [0, 0.01, 0.01], width: progressBarWidth, height: PROGRESS_BAR_HEIGHT, progress: progress, duration: duration, onSeek: onSeek }), _jsx(Text, { position: [0, -0.035, 0.01], fontSize: 0.025, color: "#aaaaaa", anchorX: "center", anchorY: "middle", children: timeText }), _jsx(VolumeControl, { id: `${id}-volume`, position: [width * 0.4, 0, 0.01], size: BUTTON_SIZE, volume: volume, onVolumeChange: onVolumeChange })] }));
 });
 ControlPanel.displayName = 'ControlPanel';
 //# sourceMappingURL=ControlPanel.js.map

package/dist/components/VideoPlayer/ControlPanel.js.map

@@ -1 +1 @@
-{"version":3,"file":"ControlPanel.js","sourceRoot":"","sources":["../../../src/components/VideoPlayer/ControlPanel.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"ControlPanel.js","sourceRoot":"","sources":["../../../src/components/VideoPlayer/ControlPanel.tsx"],"names":[],"mappings":"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"}

package/dist/components/VideoPlayer/ProgressBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../../src/components/VideoPlayer/ProgressBar.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAI/C,eAAO,MAAM,WAAW,qGASnB,gBAAgB,6CA8CpB,CAAA"}
+{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../../src/components/VideoPlayer/ProgressBar.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAI/C,eAAO,MAAM,WAAW,qGASnB,gBAAgB,6CA8CpB,CAAA"}

package/dist/components/VideoPlayer/ProgressBar.js

@@ -1,7 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { memo, useMemo } from 'react';
 import { Interactable } from '../Interactable';
-import { formatTime, calculateSegments, calculateProgressBar } from './utils';
+import { calculateSegments, calculateProgressBar } from '../commons/utils';
+import { formatTime } from './utils';
 const SEGMENTS = 20;
 export const ProgressBar = memo(({ id, position, width, height, progress, duration, onSeek, }) => {
     const { width: progressWidth, offset: progressOffset } = calculateProgressBar(progress, width);

package/dist/components/VideoPlayer/ProgressBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../src/components/VideoPlayer/ProgressBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,UAAU,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAG7E,MAAM,QAAQ,GAAG,EAAE,CAAA;AAEnB,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,CAC7B,CAAC,EACC,EAAE,EACF,QAAQ,EACR,KAAK,EACL,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,MAAM,GACW,EAAE,EAAE;IACrB,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,cAAc,EAAE,GAAG,oBAAoB,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAA;IAC9F,MAAM,YAAY,GAAG,KAAK,GAAG,QAAQ,CAAA;IAErC,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5B,OAAO,iBAAiB,CAAC;YACvB,QAAQ,EAAE,QAAQ;YAClB,KAAK;YACL,QAAQ,EAAE,QAAQ;YAClB,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;SACpE,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAA;IAErB,OAAO,CACL,iBAAO,QAAQ,EAAE,QAAQ,aAEvB,gBAAM,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,aACvB,wBAAe,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,GAAI,EACxC,4BAAmB,KAAK,EAAC,SAAS,GAAG,IAChC,EAGN,aAAa,GAAG,CAAC,IAAI,CACpB,gBAAM,QAAQ,EAAE,CAAC,cAAc,EAAE,CAAC,EAAE,KAAK,CAAC,aACxC,wBAAe,IAAI,EAAE,CAAC,aAAa,EAAE,MAAM,CAAC,GAAI,EAChD,4BAAmB,KAAK,EAAC,SAAS,GAAG,IAChC,CACR,EAGA,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACzB,KAAC,YAAY,IAEX,EAAE,EAAE,GAAG,EAAE,QAAQ,OAAO,CAAC,KAAK,EAAE,EAChC,UAAU,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EACvC,eAAe,EAAE,OAAO,CAAC,KAAK,YAE9B,gBAAM,QAAQ,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,aACtC,wBAAe,IAAI,EAAE,CAAC,YAAY,GAAG,IAAI,EAAE,MAAM,GAAG,CAAC,CAAC,GAAI,EAC1D,4BAAmB,WAAW,QAAC,OAAO,EAAE,CAAC,EAAE,UAAU,EAAE,KAAK,GAAI,IAC3D,IARF,OAAO,CAAC,KAAK,CASL,CAChB,CAAC,IACI,CACT,CAAA;AACH,CAAC,CACF,CAAA;AAED,WAAW,CAAC,WAAW,GAAG,aAAa,CAAA"}
+{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../src/components/VideoPlayer/ProgressBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAA;AAC1E,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AAGpC,MAAM,QAAQ,GAAG,EAAE,CAAA;AAEnB,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,CAC7B,CAAC,EACC,EAAE,EACF,QAAQ,EACR,KAAK,EACL,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,MAAM,GACW,EAAE,EAAE;IACrB,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,cAAc,EAAE,GAAG,oBAAoB,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAA;IAC9F,MAAM,YAAY,GAAG,KAAK,GAAG,QAAQ,CAAA;IAErC,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5B,OAAO,iBAAiB,CAAC;YACvB,QAAQ,EAAE,QAAQ;YAClB,KAAK;YACL,QAAQ,EAAE,QAAQ;YAClB,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;SACpE,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAA;IAErB,OAAO,CACL,iBAAO,QAAQ,EAAE,QAAQ,aAEvB,gBAAM,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,aACvB,wBAAe,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,GAAI,EACxC,4BAAmB,KAAK,EAAC,SAAS,GAAG,IAChC,EAGN,aAAa,GAAG,CAAC,IAAI,CACpB,gBAAM,QAAQ,EAAE,CAAC,cAAc,EAAE,CAAC,EAAE,KAAK,CAAC,aACxC,wBAAe,IAAI,EAAE,CAAC,aAAa,EAAE,MAAM,CAAC,GAAI,EAChD,4BAAmB,KAAK,EAAC,SAAS,GAAG,IAChC,CACR,EAGA,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACzB,KAAC,YAAY,IAEX,EAAE,EAAE,GAAG,EAAE,QAAQ,OAAO,CAAC,KAAK,EAAE,EAChC,UAAU,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EACvC,eAAe,EAAE,OAAO,CAAC,KAAK,YAE9B,gBAAM,QAAQ,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,aACtC,wBAAe,IAAI,EAAE,CAAC,YAAY,GAAG,IAAI,EAAE,MAAM,GAAG,CAAC,CAAC,GAAI,EAC1D,4BAAmB,WAAW,QAAC,OAAO,EAAE,CAAC,EAAE,UAAU,EAAE,KAAK,GAAI,IAC3D,IARF,OAAO,CAAC,KAAK,CASL,CAChB,CAAC,IACI,CACT,CAAA;AACH,CAAC,CACF,CAAA;AAED,WAAW,CAAC,WAAW,GAAG,aAAa,CAAA"}

package/dist/components/VideoPlayer/__tests__/utils.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=utils.test.d.ts.map

package/dist/components/VideoPlayer/__tests__/utils.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.test.d.ts","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/__tests__/utils.test.ts"],"names":[],"mappings":""}

package/dist/components/VideoPlayer/__tests__/utils.test.js

@@ -0,0 +1,23 @@
+import { describe, it, expect } from 'vitest';
+import { formatTime } from '../utils';
+describe('formatTime', () => {
+    it('0秒を0:00にフォーマット', () => {
+        expect(formatTime(0)).toBe('0:00');
+    });
+    it('59秒を0:59にフォーマット', () => {
+        expect(formatTime(59)).toBe('0:59');
+    });
+    it('60秒を1:00にフォーマット', () => {
+        expect(formatTime(60)).toBe('1:00');
+    });
+    it('90秒を1:30にフォーマット', () => {
+        expect(formatTime(90)).toBe('1:30');
+    });
+    it('3661秒を61:01にフォーマット', () => {
+        expect(formatTime(3661)).toBe('61:01');
+    });
+    it('小数点以下を切り捨て', () => {
+        expect(formatTime(65.9)).toBe('1:05');
+    });
+});
+//# sourceMappingURL=utils.test.js.map

package/dist/components/VideoPlayer/__tests__/utils.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.test.js","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/__tests__/utils.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAA;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAErC,QAAQ,CAAC,YAAY,EAAE,GAAG,EAAE;IAC1B,EAAE,CAAC,gBAAgB,EAAE,GAAG,EAAE;QACxB,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IACpC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,iBAAiB,EAAE,GAAG,EAAE;QACzB,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IACrC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,iBAAiB,EAAE,GAAG,EAAE;QACzB,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IACrC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,iBAAiB,EAAE,GAAG,EAAE;QACzB,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IACrC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,oBAAoB,EAAE,GAAG,EAAE;QAC5B,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;IACxC,CAAC,CAAC,CAAA;IAEF,EAAE,CAAC,YAAY,EAAE,GAAG,EAAE;QACpB,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAA;IACvC,CAAC,CAAC,CAAA;AACJ,CAAC,CAAC,CAAA"}

package/dist/components/VideoPlayer/components/ControlPanel.d.ts

@@ -0,0 +1,18 @@
+interface Props {
+    id: string;
+    width: number;
+    screenHeight: number;
+    playing: boolean;
+    progress: number;
+    duration: number;
+    volume: number;
+    url: string;
+    onPlayPause: () => void;
+    onStop: () => void;
+    onSeek: (time: number) => void;
+    onVolumeChange: (volume: number) => void;
+    onUrlChange: (url: string) => void;
+}
+export declare const ControlPanel: import("react").MemoExoticComponent<({ id, width, screenHeight, playing, progress, duration, volume, url, onPlayPause, onStop, onSeek, onVolumeChange, onUrlChange, }: Props) => import("react/jsx-runtime").JSX.Element>;
+export {};
+//# sourceMappingURL=ControlPanel.d.ts.map

package/dist/components/VideoPlayer/components/ControlPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ControlPanel.d.ts","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/components/ControlPanel.tsx"],"names":[],"mappings":"AAQA,UAAU,KAAK;IACb,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,EAAE,MAAM,CAAA;IACpB,OAAO,EAAE,OAAO,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,MAAM,CAAA;IACd,GAAG,EAAE,MAAM,CAAA;IACX,WAAW,EAAE,MAAM,IAAI,CAAA;IACvB,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAC9B,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAA;IACxC,WAAW,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CACnC;AAOD,eAAO,MAAM,YAAY,yKAepB,KAAK,6CA6FT,CAAA"}

package/dist/components/VideoPlayer/components/ControlPanel.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useCallback } from 'react';
+import { Text } from '@react-three/drei';
+import { IconButton } from '../../commons/IconButton';
+import { VolumeControl } from '../../commons/VolumeControl';
+import { ProgressBar } from './ProgressBar';
+import { formatTime } from '../utils';
+import { useTextInputContext } from '../../../contexts/TextInputContext';
+const PANEL_HEIGHT = 0.15;
+const BUTTON_SIZE = PANEL_HEIGHT * 0.6;
+const PROGRESS_BAR_WIDTH_RATIO = 0.5;
+const PROGRESS_BAR_HEIGHT = 0.02;
+export const ControlPanel = memo(({ id, width, screenHeight, playing, progress, duration, volume, url, onPlayPause, onStop, onSeek, onVolumeChange, onUrlChange, }) => {
+    const panelY = -screenHeight / 2 - PANEL_HEIGHT / 2;
+    const progressBarWidth = width * PROGRESS_BAR_WIDTH_RATIO;
+    const currentTime = progress * duration;
+    const timeText = `${formatTime(currentTime)} / ${formatTime(duration)}`;
+    const { requestTextInput } = useTextInputContext();
+    const handleUrlInput = useCallback(() => {
+        requestTextInput({
+            id: `${id}-url-input`,
+            placeholder: '動画のURLを入力',
+            initialValue: url,
+            onSubmit: (value) => {
+                if (value && value.trim() !== '') {
+                    onUrlChange(value.trim());
+                }
+            },
+        });
+    }, [id, url, onUrlChange, requestTextInput]);
+    return (_jsxs("group", { position: [0, panelY, 0], children: [_jsxs("mesh", { position: [0, 0, 0], children: [_jsx("planeGeometry", { args: [width, PANEL_HEIGHT] }), _jsx("meshBasicMaterial", { color: "#1a1a2a", transparent: true, opacity: 0.9 })] }), _jsx(IconButton, { id: `${id}-url-input`, position: [-width * 0.45, 0, 0.01], size: BUTTON_SIZE, icon: "\uD83D\uDD17", interactionText: "URL\u5909\u66F4", onInteract: handleUrlInput }), _jsx(IconButton, { id: `${id}-play-pause`, position: [-width * 0.38, 0, 0.01], size: BUTTON_SIZE, icon: playing ? "||" : "▶", interactionText: playing ? "一時停止" : "再生", onInteract: onPlayPause }), _jsx(IconButton, { id: `${id}-stop`, position: [-width * 0.31, 0, 0.01], size: BUTTON_SIZE, icon: "\u25A0", interactionText: "\u505C\u6B62", onInteract: onStop }), _jsx(ProgressBar, { id: `${id}-progress`, position: [0, 0.01, 0.01], width: progressBarWidth, height: PROGRESS_BAR_HEIGHT, progress: progress, duration: duration, onSeek: onSeek }), _jsx(Text, { position: [0, -0.035, 0.01], fontSize: 0.025, color: "#aaaaaa", anchorX: "center", anchorY: "middle", children: timeText }), _jsx(VolumeControl, { id: `${id}-volume`, position: [width * 0.4, 0, 0.01], size: BUTTON_SIZE, volume: volume, onVolumeChange: onVolumeChange })] }));
+});
+ControlPanel.displayName = 'ControlPanel';
+//# sourceMappingURL=ControlPanel.js.map

package/dist/components/VideoPlayer/components/ControlPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ControlPanel.js","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/components/ControlPanel.tsx"],"names":[],"mappings":"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"}

package/dist/components/VideoPlayer/components/ProgressBar.d.ts

@@ -0,0 +1,12 @@
+interface Props {
+    id: string;
+    position: [number, number, number];
+    width: number;
+    height: number;
+    progress: number;
+    duration: number;
+    onSeek: (time: number) => void;
+}
+export declare const ProgressBar: import("react").MemoExoticComponent<({ id, position, width, height, progress, duration, onSeek, }: Props) => import("react/jsx-runtime").JSX.Element>;
+export {};
+//# sourceMappingURL=ProgressBar.d.ts.map

package/dist/components/VideoPlayer/components/ProgressBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressBar.d.ts","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/components/ProgressBar.tsx"],"names":[],"mappings":"AAKA,UAAU,KAAK;IACb,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IAClC,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;CAC/B;AAID,eAAO,MAAM,WAAW,qGASnB,KAAK,6CA8CT,CAAA"}

package/dist/components/VideoPlayer/components/ProgressBar.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { memo, useMemo } from 'react';
+import { Interactable } from '../../Interactable';
+import { calculateSegments, calculateProgressBar } from '../../commons/utils';
+import { formatTime } from '../utils';
+const SEGMENTS = 20;
+export const ProgressBar = memo(({ id, position, width, height, progress, duration, onSeek, }) => {
+    const { width: progressWidth, offset: progressOffset } = calculateProgressBar(progress, width);
+    const segmentWidth = width / SEGMENTS;
+    const segments = useMemo(() => {
+        return calculateSegments({
+            segments: SEGMENTS,
+            width,
+            maxValue: duration,
+            formatLabel: (value) => (value === 0 ? '最初に戻る' : formatTime(value)),
+        });
+    }, [duration, width]);
+    return (_jsxs("group", { position: position, children: [_jsxs("mesh", { position: [0, 0, 0], children: [_jsx("planeGeometry", { args: [width, height] }), _jsx("meshBasicMaterial", { color: "#333333" })] }), progressWidth > 0 && (_jsxs("mesh", { position: [progressOffset, 0, 0.001], children: [_jsx("planeGeometry", { args: [progressWidth, height] }), _jsx("meshBasicMaterial", { color: "#4a9eff" })] })), segments.map((segment) => (_jsx(Interactable, { id: `${id}-seg-${segment.index}`, onInteract: () => onSeek(segment.value), interactionText: segment.label, children: _jsxs("mesh", { position: [segment.xPos, 0, 0.002], children: [_jsx("planeGeometry", { args: [segmentWidth * 0.98, height * 2] }), _jsx("meshBasicMaterial", { transparent: true, opacity: 0, depthWrite: false })] }) }, segment.index)))] }));
+});
+ProgressBar.displayName = 'ProgressBar';
+//# sourceMappingURL=ProgressBar.js.map

package/dist/components/VideoPlayer/components/ProgressBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressBar.js","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/components/ProgressBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACrC,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AACjD,OAAO,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAYrC,MAAM,QAAQ,GAAG,EAAE,CAAA;AAEnB,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,CAC7B,CAAC,EACC,EAAE,EACF,QAAQ,EACR,KAAK,EACL,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,MAAM,GACA,EAAE,EAAE;IACV,MAAM,EAAE,KAAK,EAAE,aAAa,EAAE,MAAM,EAAE,cAAc,EAAE,GAAG,oBAAoB,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAA;IAC9F,MAAM,YAAY,GAAG,KAAK,GAAG,QAAQ,CAAA;IAErC,MAAM,QAAQ,GAAG,OAAO,CAAC,GAAG,EAAE;QAC5B,OAAO,iBAAiB,CAAC;YACvB,QAAQ,EAAE,QAAQ;YAClB,KAAK;YACL,QAAQ,EAAE,QAAQ;YAClB,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;SACpE,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC,CAAA;IAErB,OAAO,CACL,iBAAO,QAAQ,EAAE,QAAQ,aAEvB,gBAAM,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,aACvB,wBAAe,IAAI,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,GAAI,EACxC,4BAAmB,KAAK,EAAC,SAAS,GAAG,IAChC,EAGN,aAAa,GAAG,CAAC,IAAI,CACpB,gBAAM,QAAQ,EAAE,CAAC,cAAc,EAAE,CAAC,EAAE,KAAK,CAAC,aACxC,wBAAe,IAAI,EAAE,CAAC,aAAa,EAAE,MAAM,CAAC,GAAI,EAChD,4BAAmB,KAAK,EAAC,SAAS,GAAG,IAChC,CACR,EAGA,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CACzB,KAAC,YAAY,IAEX,EAAE,EAAE,GAAG,EAAE,QAAQ,OAAO,CAAC,KAAK,EAAE,EAChC,UAAU,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EACvC,eAAe,EAAE,OAAO,CAAC,KAAK,YAE9B,gBAAM,QAAQ,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,CAAC,aACtC,wBAAe,IAAI,EAAE,CAAC,YAAY,GAAG,IAAI,EAAE,MAAM,GAAG,CAAC,CAAC,GAAI,EAC1D,4BAAmB,WAAW,QAAC,OAAO,EAAE,CAAC,EAAE,UAAU,EAAE,KAAK,GAAI,IAC3D,IARF,OAAO,CAAC,KAAK,CASL,CAChB,CAAC,IACI,CACT,CAAA;AACH,CAAC,CACF,CAAA;AAED,WAAW,CAAC,WAAW,GAAG,aAAa,CAAA"}

package/dist/components/VideoPlayer/components/index.d.ts

@@ -0,0 +1,3 @@
+export { ControlPanel } from './ControlPanel';
+export { ProgressBar } from './ProgressBar';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/VideoPlayer/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA"}

package/dist/components/VideoPlayer/components/index.js

@@ -0,0 +1,3 @@
+export { ControlPanel } from './ControlPanel';
+export { ProgressBar } from './ProgressBar';
+//# sourceMappingURL=index.js.map

package/dist/components/VideoPlayer/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/VideoPlayer/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAA"}

package/dist/components/VideoPlayer/index.d.ts

@@ -1,4 +1,21 @@
-import type { VideoPlayerProps } from './types';
-export type { VideoPlayerProps } from './types';
-export declare const VideoPlayer: import("react").MemoExoticComponent<({ id, position, rotation, width, url: initialUrl, playing: initialPlaying, volume: initialVolume, }: VideoPlayerProps) => import("react/jsx-runtime").JSX.Element>;
+interface Props {
+    /** スクリーンの一意なID（必須） */
+    id: string;
+    /** スクリーンの位置 */
+    position?: [number, number, number];
+    /** スクリーンの回転 */
+    rotation?: [number, number, number];
+    /** スクリーンの幅（高さは16:9で自動計算、デフォルト: 4） */
+    width?: number;
+    /** 動画のURL */
+    url?: string;
+    /** 初期再生状態（デフォルト: true） */
+    playing?: boolean;
+    /** 初期音量 0〜1（デフォルト: 1） */
+    volume?: number;
+}
+/** @public */
+export type VideoPlayerProps = Props;
+export declare const VideoPlayer: import("react").MemoExoticComponent<({ id, position, rotation, width, url: initialUrl, playing: initialPlaying, volume: initialVolume, }: Props) => import("react/jsx-runtime").JSX.Element>;
+export {};
 //# sourceMappingURL=index.d.ts.map

package/dist/components/VideoPlayer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/VideoPlayer/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAE/C,YAAY,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AA+J/C,eAAO,MAAM,WAAW,4IASnB,gBAAgB,6CAmHpB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/VideoPlayer/index.tsx"],"names":[],"mappings":"AASA,UAAU,KAAK;IACb,sBAAsB;IACtB,EAAE,EAAE,MAAM,CAAA;IACV,eAAe;IACf,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACnC,eAAe;IACf,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACnC,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,aAAa;IACb,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,0BAA0B;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,yBAAyB;IACzB,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB;AAED,cAAc;AACd,MAAM,MAAM,gBAAgB,GAAG,KAAK,CAAA;AA8DpC,eAAO,MAAM,WAAW,4IASnB,KAAK,6CAiHT,CAAA"}