@devvit/client 0.12.1-next-2025-09-22-20-12-49-9b3f04aa9.0 → 0.12.1-next-2025-09-23-19-50-15-c6a0f8346.0

package/effects/web-view-mode.d.ts

@@ -0,0 +1,66 @@
+/**
+ * The presentation mode of the web view.
+ * 'inline' The web view is displayed inline within a feed or post detail page
+ * 'expanded' The web view is displayed in a larger modal presentation
+ */
+export type WebViewMode = 'inline' | 'expanded';
+/**
+ * A listener that is called when the web view mode changes.
+ * @param mode The new mode, either 'inline' or 'expanded'.
+ */
+export type WebViewModeListener = (mode: WebViewMode) => void;
+/**
+ * Represents the current web view mode state for the application.
+ *
+ * @defaultValue 'inline'
+ */
+export declare const getWebViewMode: () => WebViewMode;
+/**
+ * Requests expanded mode for the web view.
+ * This will display the web view in a larger modal presentation.
+ *
+ * @param event The event that triggered the request, must be a trusted event.
+ * @returns A promise that resolves request has been received.
+ *
+ * @example
+ * ```ts
+ * button.addEventListener('click', async (event) => {
+ *   await requestExpandedMode(event);
+ * });
+ * ```
+ */
+export declare function requestExpandedMode(event: PointerEvent): Promise<void>;
+/**
+ * Exits expanded mode for the web view.
+ * This will display the web view in an inline presentation.
+ *
+ * @param event The event that triggered the request, must be a trusted event.
+ * @returns A promise that resolves request has been received.
+ *
+ * @example
+ * ```ts
+ * button.addEventListener('click', async (event) => {
+ *   await exitExpandedMode(event);
+ * });
+ * ```
+ */
+export declare function exitExpandedMode(event: PointerEvent): Promise<void>;
+/**
+ * Adds a listener that is called when the web view mode changes.
+ * The listener will be called with the new mode, either 'inline' or 'expanded'.
+ *
+ * @param callback The callback to be called when the mode changes.
+ */
+export declare function addWebViewModeListener(callback: WebViewModeListener): void;
+/**
+ * Removes a listener that was previously added with `addWebViewModeListener`.
+ *
+ * @param callback The callback to be removed.
+ */
+export declare function removeWebViewModeListener(callback: WebViewModeListener): void;
+/**
+ * @internal
+ * Handles incoming messages from the client, like when the user closes the immersive modal
+ */
+export declare function registerListener(): void;
+//# sourceMappingURL=web-view-mode.d.ts.map

package/effects/web-view-mode.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"web-view-mode.d.ts","sourceRoot":"","sources":["../../src/effects/web-view-mode.ts"],"names":[],"mappings":"AAKA;;;;GAIG;AACH,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEhD;;;GAGG;AACH,MAAM,MAAM,mBAAmB,GAAG,CAAC,IAAI,EAAE,WAAW,KAAK,IAAI,CAAC;AAI9D;;;;GAIG;AACH,eAAO,MAAM,cAAc,QAAO,WAA8C,CAAC;AAEjF;;;;;;;;;;;;;GAaG;AACH,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,CAEtE;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,YAAY,GAAG,OAAO,CAAC,IAAI,CAAC,CAEnE;AAED;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,QAAQ,EAAE,mBAAmB,GAAG,IAAI,CAE1E;AAED;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,QAAQ,EAAE,mBAAmB,GAAG,IAAI,CAE7E;AAYD;;;GAGG;AACH,wBAAgB,gBAAgB,SAiB/B"}

package/effects/web-view-mode.js

@@ -0,0 +1,101 @@
+import { WebViewImmersiveMode } from '@devvit/protos/json/devvit/ui/effects/web_view/v1alpha/immersive_mode.js';
+import { emitEffect } from '@devvit/shared-types/client/emit-effect.js';
+const modeListeners = new Set();
+/**
+ * Represents the current web view mode state for the application.
+ *
+ * @defaultValue 'inline'
+ */
+export const getWebViewMode = () => webViewMode(devvit.webViewMode);
+/**
+ * Requests expanded mode for the web view.
+ * This will display the web view in a larger modal presentation.
+ *
+ * @param event The event that triggered the request, must be a trusted event.
+ * @returns A promise that resolves request has been received.
+ *
+ * @example
+ * ```ts
+ * button.addEventListener('click', async (event) => {
+ *   await requestExpandedMode(event);
+ * });
+ * ```
+ */
+export function requestExpandedMode(event) {
+    return emitModeEffect(WebViewImmersiveMode.IMMERSIVE_MODE, event);
+}
+/**
+ * Exits expanded mode for the web view.
+ * This will display the web view in an inline presentation.
+ *
+ * @param event The event that triggered the request, must be a trusted event.
+ * @returns A promise that resolves request has been received.
+ *
+ * @example
+ * ```ts
+ * button.addEventListener('click', async (event) => {
+ *   await exitExpandedMode(event);
+ * });
+ * ```
+ */
+export function exitExpandedMode(event) {
+    return emitModeEffect(WebViewImmersiveMode.INLINE_MODE, event);
+}
+/**
+ * Adds a listener that is called when the web view mode changes.
+ * The listener will be called with the new mode, either 'inline' or 'expanded'.
+ *
+ * @param callback The callback to be called when the mode changes.
+ */
+export function addWebViewModeListener(callback) {
+    modeListeners.add(callback);
+}
+/**
+ * Removes a listener that was previously added with `addWebViewModeListener`.
+ *
+ * @param callback The callback to be removed.
+ */
+export function removeWebViewModeListener(callback) {
+    modeListeners.delete(callback);
+}
+async function emitModeEffect(mode, event) {
+    if (!event.isTrusted || event.type !== 'click') {
+        console.error('Expanded mode effect ignored due to untrusted event');
+        throw new Error('Untrusted event');
+    }
+    const type = 9;
+    await emitEffect({ type, immersiveMode: { immersiveMode: mode } });
+}
+/**
+ * @internal
+ * Handles incoming messages from the client, like when the user closes the immersive modal
+ */
+export function registerListener() {
+    console.log('Registering web view mode listener');
+    addEventListener('message', (event) => {
+        const { type, data } = event.data;
+        if (type !== 'devvit-message') {
+            return;
+        }
+        if (!data?.immersiveModeEvent) {
+            return;
+        }
+        devvit.webViewMode = data.immersiveModeEvent.immersiveMode;
+        const webViewModeString = webViewMode(data.immersiveModeEvent.immersiveMode);
+        modeListeners.forEach((listener) => listener(webViewModeString));
+    });
+}
+function webViewMode(mode) {
+    switch (mode) {
+        case WebViewImmersiveMode.IMMERSIVE_MODE:
+            return 'expanded';
+        case WebViewImmersiveMode.INLINE_MODE:
+        case WebViewImmersiveMode.UNRECOGNIZED:
+        case WebViewImmersiveMode.UNSPECIFIED:
+        case undefined:
+            return 'inline';
+        default:
+            mode;
+            throw Error(`${mode} not a WebViewImmersiveMode`);
+    }
+}

package/effects/web-view-mode.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"web-view-mode.test.d.ts","sourceRoot":"","sources":["../../src/effects/web-view-mode.test.ts"],"names":[],"mappings":""}

package/index.d.ts

@@ -1,9 +1,9 @@
 export { context } from './clientContext.js';
-export { addImmersiveModeChangeEventListener, exitImmersiveMode, removeImmersiveModeChangeEventListener, requestImmersiveMode, } from './effects/immersive-mode.js';
 export { navigateTo } from './effects/navigate-to.js';
 export { canRunAsUser } from './effects/run-as-user.js';
 export { getShareData, type ShareSheetOpts, showShareSheet } from './effects/share.js';
 export { showForm } from './effects/show-form.js';
 export { showToast } from './effects/show-toast.js';
+export { addWebViewModeListener, exitExpandedMode, getWebViewMode, removeWebViewModeListener, requestExpandedMode, } from './effects/web-view-mode.js';
 export type { PostData } from '@devvit/shared-types/PostData.js';
 //# sourceMappingURL=index.d.ts.map

package/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAC7C,OAAO,EACL,mCAAmC,EACnC,iBAAiB,EACjB,sCAAsC,EACtC,oBAAoB,GACrB,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,KAAK,cAAc,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACvF,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,YAAY,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAC;AACxD,OAAO,EAAE,YAAY,EAAE,KAAK,cAAc,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACvF,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,OAAO,EACL,sBAAsB,EACtB,gBAAgB,EAChB,cAAc,EACd,yBAAyB,EACzB,mBAAmB,GACpB,MAAM,4BAA4B,CAAC;AACpC,YAAY,EAAE,QAAQ,EAAE,MAAM,kCAAkC,CAAC"}

package/index.js

@@ -1,7 +1,9 @@
 export { context } from './clientContext.js';
-export { addImmersiveModeChangeEventListener, exitImmersiveMode, removeImmersiveModeChangeEventListener, requestImmersiveMode, } from './effects/immersive-mode.js';
 export { navigateTo } from './effects/navigate-to.js';
 export { canRunAsUser } from './effects/run-as-user.js';
 export { getShareData, showShareSheet } from './effects/share.js';
 export { showForm } from './effects/show-form.js';
 export { showToast } from './effects/show-toast.js';
+export { addWebViewModeListener, exitExpandedMode, getWebViewMode, removeWebViewModeListener, requestExpandedMode, } from './effects/web-view-mode.js';
+import { registerListener } from './effects/web-view-mode.js';
+registerListener();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devvit/client",
-  "version": "0.12.1-next-2025-09-22-20-12-49-9b3f04aa9.0",
+  "version": "0.12.1-next-2025-09-23-19-50-15-c6a0f8346.0",
   "license": "BSD-3-Clause",
   "repository": {
     "type": "git",
@@ -33,15 +33,15 @@
     "test:unit-with-coverage": "vitest run --coverage"
   },
   "dependencies": {
-    "@devvit/protos": "0.12.1-next-2025-09-22-20-12-49-9b3f04aa9.0",
-    "@devvit/shared": "0.12.1-next-2025-09-22-20-12-49-9b3f04aa9.0",
-    "@devvit/shared-types": "0.12.1-next-2025-09-22-20-12-49-9b3f04aa9.0",
-    "@devvit/web-view-scripts": "0.12.1-next-2025-09-22-20-12-49-9b3f04aa9.0"
+    "@devvit/protos": "0.12.1-next-2025-09-23-19-50-15-c6a0f8346.0",
+    "@devvit/shared": "0.12.1-next-2025-09-23-19-50-15-c6a0f8346.0",
+    "@devvit/shared-types": "0.12.1-next-2025-09-23-19-50-15-c6a0f8346.0",
+    "@devvit/web-view-scripts": "0.12.1-next-2025-09-23-19-50-15-c6a0f8346.0"
   },
   "devDependencies": {
     "@ampproject/filesize": "4.3.0",
-    "@devvit/repo-tools": "0.12.1-next-2025-09-22-20-12-49-9b3f04aa9.0",
-    "@devvit/tsconfig": "0.12.1-next-2025-09-22-20-12-49-9b3f04aa9.0",
+    "@devvit/repo-tools": "0.12.1-next-2025-09-23-19-50-15-c6a0f8346.0",
+    "@devvit/tsconfig": "0.12.1-next-2025-09-23-19-50-15-c6a0f8346.0",
     "esbuild": "0.25.9",
     "eslint": "9.11.1",
     "typescript": "5.8.3",
@@ -53,5 +53,5 @@
       "none": "105 KB"
     }
   },
-  "gitHead": "5a216cfbb873d9d818cb009701fb203f6c026258"
+  "gitHead": "f58870e7a3c0cde2e845693a14f1b3e48b676c61"
 }

package/effects/immersive-mode-listeners.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"immersive-mode-listeners.test.d.ts","sourceRoot":"","sources":["../../src/effects/immersive-mode-listeners.test.ts"],"names":[],"mappings":""}

package/effects/immersive-mode.d.ts

@@ -1,51 +0,0 @@
-/**
- * The presentation mode of the web view.
- * 'inline' The web view is displayed inline within a feed or post detail page
- * 'immersive' The web view is displayed in a larger modal presentation
- */
-export type ImmersiveMode = 'inline' | 'immersive';
-/**
- * A listener that is called when the immersive mode changes.
- * @param immersiveMode The new immersive mode, either 'inline' or 'immersive'.
- */
-export type ImmersiveListener = (immersiveMode: ImmersiveMode) => void;
-/**
- * Requests immersive mode for the web view.
- * This will display the web view in a larger modal presentation.
- *
- * @param event The event that triggered the request, must be a trusted event.
- * @returns A promise that resolves when the effect is emitted.
- *
- * @example
- * button.addEventListener('click', async (event) => {
- *   await requestImmersiveMode(event);
- * });
- */
-export declare function requestImmersiveMode(event: Event): Promise<void>;
-/**
- * Exits immersive mode for the web view.
- * This will display the web view in an inline presentation.
- *
- * @param event The event that triggered the request, must be a trusted event.
- * @returns A promise that resolves when the effect is emitted.
- *
- * @example
- * button.addEventListener('click', async (event) => {
- *   await emitImmersiveModeEffect(event);
- * });
- */
-export declare function exitImmersiveMode(event: Event): Promise<void>;
-/**
- * Adds a listener that is called when the immersive mode changes.
- * The listener will be called with the new immersive mode, either 'inline' or 'immersive'.
- *
- * @param callback The callback to be called when the immersive mode changes.
- */
-export declare function addImmersiveModeChangeEventListener(callback: ImmersiveListener): void;
-/**
- * Removes a listener that was previously added with `addImmersiveModeChangeEventListener`.
- *
- * @param callback The callback to be removed.
- */
-export declare function removeImmersiveModeChangeEventListener(callback: ImmersiveListener): void;
-//# sourceMappingURL=immersive-mode.d.ts.map

package/effects/immersive-mode.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"immersive-mode.d.ts","sourceRoot":"","sources":["../../src/effects/immersive-mode.ts"],"names":[],"mappings":"AAKA;;;;GAIG;AACH,MAAM,MAAM,aAAa,GAAG,QAAQ,GAAG,WAAW,CAAC;AAEnD;;;GAGG;AACH,MAAM,MAAM,iBAAiB,GAAG,CAAC,aAAa,EAAE,aAAa,KAAK,IAAI,CAAC;AAIvE;;;;;;;;;;;GAWG;AACH,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,KAAK,GAAG,OAAO,CAAC,IAAI,CAAC,CAEhE;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,KAAK,GAAG,OAAO,CAAC,IAAI,CAAC,CAE7D;AAED;;;;;GAKG;AACH,wBAAgB,mCAAmC,CAAC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAErF;AAED;;;;GAIG;AACH,wBAAgB,sCAAsC,CAAC,QAAQ,EAAE,iBAAiB,GAAG,IAAI,CAExF"}

package/effects/immersive-mode.js

@@ -1,75 +0,0 @@
-import { WebViewImmersiveMode } from '@devvit/protos/types/devvit/ui/effects/web_view/v1alpha/immersive_mode.js';
-import { emitEffect } from '@devvit/shared-types/client/emit-effect.js';
-const immersiveListeners = new Set();
-/**
- * Requests immersive mode for the web view.
- * This will display the web view in a larger modal presentation.
- *
- * @param event The event that triggered the request, must be a trusted event.
- * @returns A promise that resolves when the effect is emitted.
- *
- * @example
- * button.addEventListener('click', async (event) => {
- *   await requestImmersiveMode(event);
- * });
- */
-export function requestImmersiveMode(event) {
-    return emitImmersiveModeEffect(2, event);
-}
-/**
- * Exits immersive mode for the web view.
- * This will display the web view in an inline presentation.
- *
- * @param event The event that triggered the request, must be a trusted event.
- * @returns A promise that resolves when the effect is emitted.
- *
- * @example
- * button.addEventListener('click', async (event) => {
- *   await emitImmersiveModeEffect(event);
- * });
- */
-export function exitImmersiveMode(event) {
-    return emitImmersiveModeEffect(1, event);
-}
-/**
- * Adds a listener that is called when the immersive mode changes.
- * The listener will be called with the new immersive mode, either 'inline' or 'immersive'.
- *
- * @param callback The callback to be called when the immersive mode changes.
- */
-export function addImmersiveModeChangeEventListener(callback) {
-    immersiveListeners.add(callback);
-}
-/**
- * Removes a listener that was previously added with `addImmersiveModeChangeEventListener`.
- *
- * @param callback The callback to be removed.
- */
-export function removeImmersiveModeChangeEventListener(callback) {
-    immersiveListeners.delete(callback);
-}
-async function emitImmersiveModeEffect(mode, event) {
-    if (!event.isTrusted) {
-        console.error('Immersive mode effect ignored due to untrusted event');
-        throw new Error('Untrusted event');
-    }
-    const type = 9;
-    await emitEffect({ type, immersiveMode: { immersiveMode: mode } });
-}
-/**
- * Handles incoming messages from the client, like when the user closes the immersive modal
- */
-if (typeof addEventListener === 'function') {
-    addEventListener('message', (event) => {
-        const { type, data } = event.data;
-        if (type !== 'devvit-message') {
-            return;
-        }
-        if (!data?.immersiveModeEvent) {
-            return;
-        }
-        const immersiveMode = event.data.data?.immersiveModeEvent?.immersiveMode;
-        const modeString = immersiveMode === 2 ? 'immersive' : 'inline';
-        immersiveListeners.forEach((listener) => listener(modeString));
-    });
-}

package/effects/immersive-mode.test.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"immersive-mode.test.d.ts","sourceRoot":"","sources":["../../src/effects/immersive-mode.test.ts"],"names":[],"mappings":""}

package/index.test.d.ts.map

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