@caperjs/core 0.7.1 → 0.7.3

package/src/ui/UICanvas.test.ts

@@ -23,7 +23,7 @@ vi.mock('../core/Application', async () => {
 // constructed. See importOrder.containerFirst.test.ts.
 import '../mixins/factory/const';
 import { Signal } from '../signals';
-import { computeEffectivePadding, UICanvas } from './UICanvas';
+import { computeEffectivePadding, resolveSafeArea, UICanvas } from './UICanvas';
 
 const zero = { top: 0, right: 0, bottom: 0, left: 0 };
 
@@ -51,6 +51,28 @@ describe('computeEffectivePadding', () => {
   });
 });
 
+describe('resolveSafeArea', () => {
+  const insets = { top: 51, right: 4, bottom: 34, left: 4 };
+
+  it('keeps every inset when useSafeArea is true', () => {
+    expect(resolveSafeArea(insets, true)).toEqual(insets);
+  });
+
+  it('drops every inset when useSafeArea is false', () => {
+    expect(resolveSafeArea(insets, false)).toEqual(zero);
+  });
+
+  it('drops only the edges set to false, keeping the ones left out', () => {
+    expect(resolveSafeArea(insets, { top: false })).toEqual({ top: 0, right: 4, bottom: 34, left: 4 });
+    expect(resolveSafeArea(insets, { top: false, bottom: true, left: false })).toEqual({
+      top: 0,
+      right: 4,
+      bottom: 34,
+      left: 0,
+    });
+  });
+});
+
 describe('UICanvas element reordering', () => {
   let app: any;
   let originalAppDescriptor: PropertyDescriptor | undefined;

package/src/ui/UICanvas.ts

@@ -73,11 +73,18 @@ export type UICanvasConfig = {
   padding: Padding;
   size: Size;
   useAppSize: boolean;
-  useSafeArea: boolean;
+  useSafeArea: UICanvasSafeArea;
   layout?: Omit<LayoutOptions, 'target'> | null | boolean;
   autoLayoutChildren?: boolean;
 };
 
+/**
+ * Which device safe-area insets the canvas pads by: `true` (all four, the default), `false`
+ * (none), or per edge, where an edge left out stays on. `{ top: false }` lets top-row UI sit
+ * in the camera strip of a punch-hole phone while the bottom still clears the gesture bar.
+ */
+export type UICanvasSafeArea = boolean | Partial<Record<keyof Padding, boolean>>;
+
 export const UICanvasConfigKeys: (keyof UICanvasConfig)[] = [
   'debug',
   'padding',
@@ -92,7 +99,7 @@ export type UICanvasProps = {
   padding: Partial<Padding> | PointLike;
   size?: SizeLike;
   useAppSize?: boolean;
-  useSafeArea?: boolean;
+  useSafeArea?: UICanvasSafeArea;
   layout?: Omit<LayoutOptions, 'target'> | null | boolean;
   autoLayoutChildren?: boolean;
 };
@@ -113,6 +120,18 @@ export function computeEffectivePadding(padding: Padding, safeArea: Padding): Pa
   };
 }
 
+/** The safe-area insets `useSafeArea` keeps: all, none, or the edges not set to `false`. */
+export function resolveSafeArea(safeArea: Padding, useSafeArea: UICanvasSafeArea): Padding {
+  if (useSafeArea === true) return { ...safeArea };
+  if (useSafeArea === false) return { ...zeroPadding };
+  return {
+    top: useSafeArea.top === false ? 0 : safeArea.top,
+    right: useSafeArea.right === false ? 0 : safeArea.right,
+    bottom: useSafeArea.bottom === false ? 0 : safeArea.bottom,
+    left: useSafeArea.left === false ? 0 : safeArea.left,
+  };
+}
+
 const defaultLayout = {
   flexGrow: 0,
   flexShrink: 0,
@@ -449,7 +468,7 @@ export class UICanvas extends _UICanvas {
   private _applyPadding() {
     const padding = computeEffectivePadding(
       this.config.padding,
-      this.config.useSafeArea ? this.app.safeArea : zeroPadding,
+      resolveSafeArea(this.app.safeArea, this.config.useSafeArea),
     );
     this.layout = {
       paddingLeft: padding.left,

package/src/utils/platform.test.ts

@@ -0,0 +1,20 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+
+describe('isTauri', () => {
+  beforeEach(() => {
+    delete (window as unknown as { __TAURI_INTERNALS__?: unknown }).__TAURI_INTERNALS__;
+    vi.resetModules();
+  });
+
+  it('is false in the default test env', async () => {
+    const { isTauri } = await import('./platform');
+    expect(isTauri).toBe(false);
+  });
+
+  it('is true when window.__TAURI_INTERNALS__ is defined before a fresh import', async () => {
+    (window as unknown as { __TAURI_INTERNALS__?: unknown }).__TAURI_INTERNALS__ = {};
+    vi.resetModules();
+    const { isTauri } = await import('./platform');
+    expect(isTauri).toBe(true);
+  });
+});

package/src/utils/platform.ts

@@ -23,6 +23,12 @@ export const isTouch: boolean =
     ? 'ontouchstart' in window || navigator.maxTouchPoints > 0
     : false;
 
+/**
+ * Check if we're running inside a Tauri webview (the native app shell), as
+ * opposed to a plain browser tab.
+ */
+export const isTauri: boolean = typeof window !== 'undefined' ? '__TAURI_INTERNALS__' in window : false;
+
 /**
  * Checks if the device is a mobile device.
  * This uses the `isMobile` function from the `@pixi/utils` package.

package/src/utils/types.ts

@@ -286,7 +286,11 @@ export type KeyboardKey =
   | 'IntlBackslash'
   | 'MetaLeft'
   | 'MetaRight'
-  | 'ContextMenu';
+  | 'ContextMenu'
+  // Navigation keys sent by Android's back button/gesture (delivered by
+  // @caperjs/plugin-tauri), TV remotes, and some Android browsers.
+  | 'GoBack'
+  | 'BrowserBack';
 
 export type { Spine } from '../plugins/spine/pixi-spine';
 

package/src/version.ts

@@ -1,3 +1,3 @@
 // This file is auto-generated during the build process.
-export const version: string = '0.7.1';
-export const pixiVersion: string = '8.21.0';
+export const version: string = '0.7.3';
+export const pixiVersion: string = '8.22.0';