@loupekit/sdk 0.10.2-next.43 → 0.10.2-next.44

package/dist/index.global.js

@@ -2870,10 +2870,10 @@ var Loupe = (() => {
       if (canShareScreen()) {
         tools.append(inspectBtn, freeBtn, regionBtn, recordBtn);
       } else if (isTouchDevice()) {
-        const cameraBtn = this.toolBtn(CAMERA_ICON, "Camera", "camera");
-        cameraBtn.title = "Record a video with the camera and comment";
-        cameraBtn.onclick = () => this.pickCameraVideo();
-        tools.append(inspectBtn, freeBtn, regionBtn, cameraBtn);
+        const videoBtn = this.toolBtn(VIDEO_ICON, "Video", "video");
+        videoBtn.title = "Attach a video \u2014 record your screen with your phone, then pick it here";
+        videoBtn.onclick = () => this.pickVideo();
+        tools.append(inspectBtn, freeBtn, regionBtn, videoBtn);
       } else {
         tools.append(inspectBtn, freeBtn, regionBtn);
       }
@@ -3052,16 +3052,16 @@ var Loupe = (() => {
       );
     }
     /**
-     * Touch devices with no screen recorder (every iOS browser) can still report a video:
-     * record one with the camera. Opens the native recorder and hands the clip to the
-     * composer exactly like the screen capture does.
+     * Attach a video on a phone, where the page cannot record the screen: the reporter
+     * records it with the phone's own screen recorder first, then picks the clip here. No
+     * `capture` attribute on purpose — that would force the camera open, and a video of the
+     * room is not a screen recording.
      */
-    pickCameraVideo() {
+    pickVideo() {
       this.setMode("off");
       const input = document.createElement("input");
       input.type = "file";
       input.accept = "video/*";
-      input.setAttribute("capture", "environment");
       input.style.display = "none";
       input.onchange = () => {
         const file = input.files?.[0];
@@ -3073,7 +3073,7 @@ var Loupe = (() => {
         const docH = Math.max(1, document.documentElement.scrollHeight);
         const offset = { x: clamp(docX / docW), y: clamp(docY / docH) };
         this.openComposer(
-          { kind: "free", offset, point: { x: docX, y: docY }, label: "Camera video \xB7 attached" },
+          { kind: "free", offset, point: { x: docX, y: docY }, label: "Video \xB7 attached" },
           8,
           window.innerHeight / 2,
           [file]
@@ -3729,7 +3729,7 @@ var Loupe = (() => {
   var REGION_ICON = `<svg width="15" height="15" viewBox="0 0 15 15" fill="none" aria-hidden="true"><rect x="1.5" y="2.5" width="12" height="10" rx="1.5" stroke="currentColor" stroke-width="1.4" stroke-dasharray="2.4 1.8"/></svg>`;
   var NOTE_ICON = `<svg width="15" height="15" viewBox="0 0 15 15" fill="none" aria-hidden="true"><path d="M2 2.5h11v7.5H6l-3 2.5v-2.5H2z" stroke="currentColor" stroke-width="1.3" stroke-linejoin="round"/></svg>`;
   var RECORD_ICON = `<svg width="15" height="15" viewBox="0 0 15 15" fill="none" aria-hidden="true"><rect x="1.5" y="2.5" width="12" height="10" rx="1.5" stroke="currentColor" stroke-width="1.4" stroke-dasharray="2.4 1.8"/><circle cx="7.5" cy="7.5" r="2.4" fill="currentColor"/></svg>`;
-  var CAMERA_ICON = `<svg width="15" height="15" viewBox="0 0 15 15" fill="none" aria-hidden="true"><rect x="1.2" y="3.8" width="9.2" height="7.4" rx="1.6" stroke="currentColor" stroke-width="1.3"/><path d="M10.4 7.3l3.4-2v4.4l-3.4-2z" stroke="currentColor" stroke-width="1.3" stroke-linejoin="round"/></svg>`;
+  var VIDEO_ICON = `<svg width="15" height="15" viewBox="0 0 15 15" fill="none" aria-hidden="true"><rect x="1.5" y="2.5" width="12" height="10" rx="1.5" stroke="currentColor" stroke-width="1.4"/><path d="M6.3 5.5l3.9 2.2-3.9 2.2z" fill="currentColor"/></svg>`;
   var I_GITHUB = `<svg width="18" height="18" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 .2a8 8 0 0 0-2.5 15.6c.4.07.55-.17.55-.38v-1.3c-2.2.48-2.67-1.07-2.67-1.07-.36-.92-.88-1.16-.88-1.16-.72-.5.05-.48.05-.48.8.056 1.22.82 1.22.82.71 1.22 1.87.87 2.33.66.07-.52.28-.87.5-1.07-1.76-.2-3.6-.88-3.6-3.9 0-.86.3-1.57.82-2.12-.08-.2-.36-1 .08-2.1 0 0 .67-.21 2.2.8a7.6 7.6 0 0 1 4 0c1.53-1.02 2.2-.8 2.2-.8.44 1.1.16 1.9.08 2.1.5.55.82 1.26.82 2.12 0 3.03-1.85 3.7-3.61 3.9.28.24.54.72.54 1.46v2.16c0 .21.14.46.55.38A8 8 0 0 0 8 .2z"/></svg>`;
   var I_SLACK = `<svg width="18" height="18" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M3.4 10.1a1.6 1.6 0 1 1-1.6-1.6h1.6v1.6zm.8 0a1.6 1.6 0 0 1 3.2 0v4a1.6 1.6 0 1 1-3.2 0v-4zM5.8 3.4a1.6 1.6 0 1 1 1.6-1.6v1.6H5.8zm0 .8a1.6 1.6 0 0 1 0 3.2h-4a1.6 1.6 0 1 1 0-3.2h4zm6.7 1.6a1.6 1.6 0 1 1 1.6 1.6h-1.6V5.8zm-.8 0a1.6 1.6 0 0 1-3.2 0v-4a1.6 1.6 0 1 1 3.2 0v4zm-1.6 6.7a1.6 1.6 0 1 1-1.6 1.6v-1.6h1.6zm0-.8a1.6 1.6 0 0 1 0-3.2h4a1.6 1.6 0 1 1 0 3.2h-4z"/></svg>`;
   var I_TELEGRAM = `<svg width="18" height="18" viewBox="0 0 16 16" fill="currentColor" aria-hidden="true"><path d="M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0zm3.7 5.4-1.24 5.85c-.09.41-.34.51-.69.32l-1.9-1.4-.92.88c-.1.1-.19.19-.38.19l.14-1.93 3.5-3.17c.15-.13-.03-.2-.24-.07l-4.32 2.72-1.86-.58c-.4-.13-.41-.4.09-.6l7.26-2.8c.34-.12.63.08.52.6z"/></svg>`;