Export all event types and apply patches

Author: binarykitchen

.storybook/public/mockServiceWorker.js

@@ -7,7 +7,7 @@
  * - Please do NOT modify this file.
  */
 
-const PACKAGE_VERSION = '2.12.3'
+const PACKAGE_VERSION = '2.12.4'
 const INTEGRITY_CHECKSUM = '4db4a41e972cec1b64cc569c66952d82'
 const IS_MOCKED_RESPONSE = Symbol('isMockedResponse')
 const activeClientIds = new Set()

package-lock.json

@@ -79,12 +79,12 @@
     "@eslint/js": "9.39.1",
     "@rsbuild/plugin-node-polyfill": "1.4.2",
     "@rsbuild/plugin-stylus": "1.2.0",
-    "@rsdoctor/rspack-plugin": "1.3.11",
-    "@rslib/core": "0.18.2",
-    "@storybook/addon-a11y": "10.1.2",
-    "@storybook/addon-docs": "10.1.2",
-    "@storybook/addon-links": "10.1.2",
-    "@storybook/html": "10.1.2",
+    "@rsdoctor/rspack-plugin": "1.3.12",
+    "@rslib/core": "0.18.3",
+    "@storybook/addon-a11y": "10.1.4",
+    "@storybook/addon-docs": "10.1.4",
+    "@storybook/addon-links": "10.1.4",
+    "@storybook/html": "10.1.4",
     "@tsconfig/node22": "22.0.5",
     "@tsconfig/strictest": "2.0.8",
     "@types/defined": "1.0.2",
@@ -105,22 +105,22 @@
     "eslint-plugin-regexp": "2.10.0",
     "eslint-plugin-security": "3.0.1",
     "eslint-plugin-simple-import-sort": "12.1.1",
-    "eslint-plugin-storybook": "10.1.2",
+    "eslint-plugin-storybook": "10.1.4",
     "globals": "16.5.0",
     "jsdom": "27.2.0",
-    "msw": "2.12.3",
+    "msw": "2.12.4",
     "msw-storybook-addon": "2.0.6",
-    "prettier": "3.7.3",
+    "prettier": "3.7.4",
     "prettier-plugin-curly": "0.4.1",
     "prettier-plugin-packagejson": "2.5.20",
     "prettier-plugin-sh": "0.18.0",
     "release-it": "19.0.6",
-    "storybook": "10.1.2",
-    "storybook-html-rsbuild": "3.0.0",
-    "type-fest": "5.2.0",
+    "storybook": "10.1.4",
+    "storybook-html-rsbuild": "3.1.0",
+    "type-fest": "5.3.0",
     "typescript": "5.9.3",
-    "typescript-eslint": "8.48.0",
-    "vitest": "4.0.14"
+    "typescript-eslint": "8.48.1",
+    "vitest": "4.0.15"
   },
   "engines": {
     "node": "^24.11.0",

package.json

@@ -6,7 +6,8 @@ export type { VideomailCommandArgs } from "./types/command";
 export type { DeliveryRecord } from "./types/Delivery";
 export type { EmailAddress, EmailAddresses } from "./types/EmailAddress";
 export type { FullVideomailErrorData, VideomailErrorData } from "./types/error";
-export type { VideomailEvents, VideomailPreviewParams } from "./types/events";
+export type { VideomailEvents } from "./types/events";
+export type * from "./types/events/params";
 export type { VideomailClientOptions } from "./types/options";
 export type { RecordingStats } from "./types/RecordingStats";
 export type { PartialVideomail, Videomail } from "./types/Videomail";

src/index.ts

@@ -2,9 +2,7 @@ import type { Meta, StoryObj } from "@storybook/html";
 
 import { VideomailClient } from "../client";
 import { PartialVideomailClientOptions } from "../types/options";
-import videomailExample from "./static/json/videomail";
-
-// TODO Migrate more from Legacy
+import videomailExample from "./static/json/desktopVideomail";
 
 const meta: Meta<PartialVideomailClientOptions> = {
   title: "Correct",

src/stories/Correct.stories.ts

@@ -1,8 +1,7 @@
 import type { Meta, StoryObj } from "@storybook/html";
 import { http, HttpResponse } from "msw";
 
-import { Videomail, VideomailClient } from "../index";
-import { SubmittedParams } from "../types/events";
+import { Videomail, VideomailClient, VideomailSubmittedParams } from "../index";
 import { PartialVideomailClientOptions } from "../types/options";
 
 const meta: Meta<PartialVideomailClientOptions> = {
@@ -54,7 +53,7 @@ export const DirectSubmission: Story = {
   play: ({ args }) => {
     const videomailClient = new VideomailClient(args);
 
-    const onSubmitted = ({ videomail }: SubmittedParams) => {
+    const onSubmitted = ({ videomail }: VideomailSubmittedParams) => {
       videomailClient.replay(videomail, "viewVideo");
 
       const startOverButton = document.getElementById("startOver");
@@ -200,7 +199,7 @@ export const ContactForm: Story = {
       };
     }
 
-    const onSubmitted = ({ videomail, response }: SubmittedParams) => {
+    const onSubmitted = ({ videomail, response }: VideomailSubmittedParams) => {
       const statusHeader = document.querySelector<HTMLHeadElement>("h3.status");
 
       if (statusHeader) {
@@ -285,7 +284,7 @@ export const VideoSubmissionOnly: Story = {
       }
     }
 
-    const onSubmitted = ({ videomail }: SubmittedParams) => {
+    const onSubmitted = ({ videomail }: VideomailSubmittedParams) => {
       setAttribute(videomail, "url");
       setAttribute(videomail, "webm");
       setAttribute(videomail, "mp4");
@@ -359,7 +358,7 @@ export const Stretch: Story = {
   play: ({ args }) => {
     const videomailClient = new VideomailClient(args);
 
-    const onSubmitted = ({ videomail, response }: SubmittedParams) => {
+    const onSubmitted = ({ videomail, response }: VideomailSubmittedParams) => {
       const statusHeader = document.querySelector("h3.status");
 
       if (statusHeader) {
@@ -463,7 +462,7 @@ export const WithCCAndBCC: Story = {
   play: ({ args }) => {
     const videomailClient = new VideomailClient(args);
 
-    const onSubmitted = ({ videomail, response }: SubmittedParams) => {
+    const onSubmitted = ({ videomail, response }: VideomailSubmittedParams) => {
       const statusHeader = document.querySelector("h3.status");
 
       if (statusHeader) {

src/stories/Form.stories.ts

@@ -2,7 +2,8 @@ import type { Meta, StoryObj } from "@storybook/html";
 
 import { VideomailClient } from "../client";
 import { PartialVideomailClientOptions } from "../types/options";
-import videomailExample from "./static/json/videomail";
+import videomailDesktopExample from "./static/json/desktopVideomail";
+import videomailMobileExample from "./static/json/mobileVideomail";
 
 const meta: Meta<PartialVideomailClientOptions> = {
   title: "Player",
@@ -14,12 +15,21 @@ const meta: Meta<PartialVideomailClientOptions> = {
 
 type Story = StoryObj<PartialVideomailClientOptions>;
 
-// Play an existing videomail, nothing else
-export const PlayVideomail: Story = {
-  name: "Play videomail",
+// Play an existing desktop videomail, nothing else
+export const PlayDesktopVideomail: Story = {
+  name: "Play desktop videomail",
   render: (args) => {
     const videomailClient = new VideomailClient(args);
-    return videomailClient.replay(videomailExample);
+    return videomailClient.replay(videomailDesktopExample);
+  },
+};
+
+// Play an existing videomail recorded on mobile, nothing else
+export const PlayMobileVideomail: Story = {
+  name: "Play mobile videomail",
+  render: (args) => {
+    const videomailClient = new VideomailClient(args);
+    return videomailClient.replay(videomailMobileExample);
   },
 };
 
@@ -71,7 +81,7 @@ export const PlayVideomailWithForm: Story = {
 
     // just a copy paste of json of the videomail
     // you normally would get from a xhr get request
-    videomailClient.replay(videomailExample, "videomail");
+    videomailClient.replay(videomailDesktopExample, "videomail");
   },
 };
 

src/stories/Player.stories.ts

@@ -2,7 +2,7 @@
 
 import { Videomail } from "../../../types/Videomail";
 
-const videomailExample: Videomail = {
+const videomailDesktopExample: Videomail = {
   subject: "Hamster on Speed",
   from: "[email protected]",
   to: ["[email protected]"],
@@ -57,4 +57,4 @@ const videomailExample: Videomail = {
   expiresAfterServerPretty: "14 Dec 2024, 12:10 pm",
 };
 
-export default videomailExample;
+export default videomailDesktopExample;

src/stories/static/json/videomail.ts …/stories/static/json/desktopVideomail.tssrc/stories/static/json/videomail.ts renamed to src/stories/static/json/desktopVideomail.ts src/stories/static/json/videomail.ts renamed to src/stories/static/json/desktopVideomail.ts

@@ -0,0 +1,72 @@
+// Used for mocked MSW responses in storybook
+
+import { Videomail } from "../../../types/Videomail";
+
+const videomailMobileExample: Videomail = {
+  alias: "re-test-furz-3-dec-2025-06-17-pm-144110111540",
+  correctUrl:
+    "https://videomail.io/videomail/alias/re-test-furz-3-dec-2025-06-17-pm-144110111540/correct",
+  dateCreated: 1764739035953,
+  dateCreatedServerPretty: "3 Dec 2025, 06:17 pm (NZDT)",
+  dateUpdated: 1764739038454,
+  dateUpdatedServerPretty: "3 Dec 2025, 06:17 pm (NZDT)",
+  expiresAfter: 1769923035953,
+  expiresAfterIso: "2026-02-01T05:17:15.953Z",
+  expiresAfterServerPretty: "1 Feb 2026, 06:17 pm (NZDT)",
+  format: {
+    bit_rate: 516619,
+    duration: 6.07,
+    format_long_name: "Matroska / WebM",
+    format_name: "matroska,webm",
+    nb_programs: 0,
+    nb_streams: 1,
+    probe_score: 100,
+    size: 391985,
+    start_time: 0,
+    tags: {
+      ENCODER: "Lavf60.3.100",
+    },
+  },
+  from: "[email protected]",
+  height: 300,
+  key: "1f0d0073-ca74-68f0-b34a-d7bf88d120e4",
+  mp4: "https://videomail.io/api/videomail/key/1f0d0073-ca74-68f0-b34a-d7bf88d120e4/type/mp4/",
+  poster:
+    "https://videomail.io/api/videomail/key/1f0d0073-ca74-68f0-b34a-d7bf88d120e4/poster/",
+  recordLocation: "https://videomail.io/",
+  recordingStats: {
+    avgFps: 20.148637489677952,
+    avgInterval: 49.631147540983605,
+    framesCount: 122,
+    intervalSum: 6055,
+    videoType: "mp4",
+    waitingTime: 213,
+    wantedFps: 18,
+    wantedInterval: 55.55555555555556,
+  },
+  replyAllUrl:
+    "https://videomail.io/videomail/alias/re-test-furz-3-dec-2025-06-17-pm-144110111540/replyAll",
+  replyUrl:
+    "https://videomail.io/videomail/alias/re-test-furz-3-dec-2025-06-17-pm-144110111540/reply",
+  sending: false,
+  sent: true,
+  sentDate: 1764739038454,
+  sentDateIso: "2025-12-03T05:17:18.454Z",
+  sentDateServerPretty: "3 Dec 2025, 06:17 pm (NZDT)",
+  sentTo: {
+    "[email protected]": {
+      userKey: false,
+    },
+  },
+  serverTimePretty: "4 Dec 2025, 06:42 pm",
+  siteName: "videomail.io",
+  subject: "RE: Test furz",
+  url: "https://videomail.io/videomail/alias/re-test-furz-3-dec-2025-06-17-pm-144110111540",
+  versions: {
+    videomailClient: "13.5.3",
+  },
+  webm: "https://videomail.io/api/videomail/key/1f0d0073-ca74-68f0-b34a-d7bf88d120e4/type/webm/",
+  width: 390,
+};
+
+export default videomailMobileExample;

src/stories/static/json/mobileVideomail.ts

@@ -49,6 +49,7 @@ export interface Videomail {
   sentDate?: number;
   sentDateIso?: string;
   sentDateServerPretty?: string;
+  serverTimePretty?: string;
 
   siteName: string;
   siteTitle?: string;