@capawesome/capacitor-android-edge-to-edge-support 7.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2025 Robin Genz
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,78 @@
+# @capawesome/capacitor-android-edge-to-edge-support
+
+Capacitor plugin to support edge-to-edge display on Android.
+
+| Before                                                                                                      | After                                                                                                       | Before                                                                                                      | After                                                                                                       |
+| ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
+| <image src="https://github.com/user-attachments/assets/1c42aa63-1191-4b9b-860f-ffc47881d815" width="200" /> | <image src="https://github.com/user-attachments/assets/a4df4e58-0c21-45b5-aadd-ca197308016a" width="200" /> | <image src="https://github.com/user-attachments/assets/22c94f95-a0c4-4ace-8a3b-3a0feabf9191" width="200" /> | <image src="https://github.com/user-attachments/assets/21ece022-fb74-4067-889b-6922ecd0e2a5" width="200" /> |
+
+## Installation
+
+```bash
+npm install @capawesome/capacitor-android-edge-to-edge-support
+npx cap sync
+```
+
+## Usage
+
+The plugin **only needs to be installed**. It applies insets to the web view to support edge-to-edge display on Android. The plugin also provides a method to set the background color of the status bar and navigation bar. It's recommended to use this method in combination with the [Status Bar](https://capacitorjs.com/docs/apis/status-bar) plugin.
+
+```typescript
+import { EdgeToEdge } from '@capawesome/capacitor-android-edge-to-edge-support';
+import { StatusBar, Style } from '@capacitor/status-bar';
+
+const setBackgroundColor = async () => {
+  await EdgeToEdge.setBackgroundColor({ color: '#ffffff' });
+  await StatusBar.setStyle({ style: Style.Light });
+};
+```
+
+## API
+
+<docgen-index>
+
+* [`setBackgroundColor(...)`](#setbackgroundcolor)
+* [Interfaces](#interfaces)
+
+</docgen-index>
+
+<docgen-api>
+<!--Update the source file JSDoc comments and rerun docgen to update the docs below-->
+
+### setBackgroundColor(...)
+
+```typescript
+setBackgroundColor(options: SetBackgroundColorOptions) => Promise<void>
+```
+
+Set the background color of the status bar and navigation bar.
+
+Only available on Android.
+
+| Param         | Type                                                                            |
+| ------------- | ------------------------------------------------------------------------------- |
+| **`options`** | <code><a href="#setbackgroundcoloroptions">SetBackgroundColorOptions</a></code> |
+
+**Since:** 7.0.0
+
+--------------------
+
+
+### Interfaces
+
+
+#### SetBackgroundColorOptions
+
+| Prop        | Type                | Description                                                                                | Since |
+| ----------- | ------------------- | ------------------------------------------------------------------------------------------ | ----- |
+| **`color`** | <code>string</code> | The hexadecimal color to set as the background color of the status bar and navigation bar. | 7.0.0 |
+
+</docgen-api>
+
+## Changelog
+
+See [CHANGELOG.md](https://github.com/capawesome-team/capacitor-plugins/blob/main/packages/android-edge-to-edge-support/CHANGELOG.md).
+
+## License
+
+See [LICENSE](https://github.com/capawesome-team/capacitor-plugins/blob/main/packages/android-edge-to-edge-support/LICENSE).

package/android/build.gradle

@@ -0,0 +1,58 @@
+ext {
+    junitVersion = project.hasProperty('junitVersion') ? rootProject.ext.junitVersion : '4.13.2'
+    androidxAppCompatVersion = project.hasProperty('androidxAppCompatVersion') ? rootProject.ext.androidxAppCompatVersion : '1.7.0'
+    androidxJunitVersion = project.hasProperty('androidxJunitVersion') ? rootProject.ext.androidxJunitVersion : '1.2.1'
+    androidxEspressoCoreVersion = project.hasProperty('androidxEspressoCoreVersion') ? rootProject.ext.androidxEspressoCoreVersion : '3.6.1'
+}
+
+buildscript {
+    repositories {
+        google()
+        mavenCentral()
+    }
+    dependencies {
+        classpath 'com.android.tools.build:gradle:8.7.2'
+    }
+}
+
+apply plugin: 'com.android.library'
+
+android {
+    namespace "io.capawesome.capacitorjs.plugins.androidedgetoedge"
+    compileSdk project.hasProperty('compileSdkVersion') ? rootProject.ext.compileSdkVersion : 35
+    defaultConfig {
+        minSdkVersion project.hasProperty('minSdkVersion') ? rootProject.ext.minSdkVersion : 23
+        targetSdkVersion project.hasProperty('targetSdkVersion') ? rootProject.ext.targetSdkVersion : 35
+        versionCode 1
+        versionName "1.0"
+        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
+    }
+    buildTypes {
+        release {
+            minifyEnabled false
+            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
+        }
+    }
+    lintOptions {
+        abortOnError false
+    }
+    compileOptions {
+        sourceCompatibility JavaVersion.VERSION_21
+        targetCompatibility JavaVersion.VERSION_21
+    }
+}
+
+repositories {
+    google()
+    mavenCentral()
+}
+
+
+dependencies {
+    implementation fileTree(dir: 'libs', include: ['*.jar'])
+    implementation project(':capacitor-android')
+    implementation "androidx.appcompat:appcompat:$androidxAppCompatVersion"
+    testImplementation "junit:junit:$junitVersion"
+    androidTestImplementation "androidx.test.ext:junit:$androidxJunitVersion"
+    androidTestImplementation "androidx.test.espresso:espresso-core:$androidxEspressoCoreVersion"
+}

package/android/src/main/AndroidManifest.xml

@@ -0,0 +1,2 @@
+<manifest xmlns:android="http://schemas.android.com/apk/res/android">
+</manifest>

package/android/src/main/java/io/capawesome/capacitorjs/plugins/androidedgetoedgesupport/EdgeToEdge.java

@@ -0,0 +1,54 @@
+package io.capawesome.capacitorjs.plugins.androidedgetoedgesupport;
+
+import android.graphics.Color;
+import android.view.View;
+import android.view.ViewGroup;
+import androidx.annotation.NonNull;
+import androidx.core.graphics.Insets;
+import androidx.core.view.ViewCompat;
+import androidx.core.view.WindowInsetsCompat;
+
+public class EdgeToEdge {
+
+    @NonNull
+    private final EdgeToEdgePlugin plugin;
+
+    public EdgeToEdge(@NonNull EdgeToEdgePlugin plugin) {
+        this.plugin = plugin;
+        // Apply insets to disable the edge-to-edge feature
+        applyInsets();
+    }
+
+    public void setBackgroundColor(String color) {
+        View view = plugin.getBridge().getWebView();
+        if (view == null) {
+            return;
+        }
+        // Get parent view
+        ViewGroup parent = (ViewGroup) view.getParent();
+        // Set background color to black
+        parent.setBackgroundColor(Color.parseColor(color));
+    }
+
+    private void applyInsets() {
+        View view = plugin.getBridge().getWebView();
+        if (view == null) {
+            return;
+        }
+        // Get parent view
+        ViewGroup parent = (ViewGroup) view.getParent();
+        // Set background color to black
+        parent.setBackgroundColor(Color.WHITE);
+        // Apply insets to disable the edge-to-edge feature
+        ViewCompat.setOnApplyWindowInsetsListener(view, (v, windowInsets) -> {
+            Insets insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars());
+            ViewGroup.MarginLayoutParams mlp = (ViewGroup.MarginLayoutParams) v.getLayoutParams();
+            mlp.bottomMargin = insets.bottom;
+            mlp.leftMargin = insets.left;
+            mlp.rightMargin = insets.right;
+            mlp.topMargin = insets.top;
+            v.setLayoutParams(mlp);
+            return WindowInsetsCompat.CONSUMED;
+        });
+    }
+}

package/android/src/main/java/io/capawesome/capacitorjs/plugins/androidedgetoedgesupport/EdgeToEdgePlugin.java

@@ -0,0 +1,33 @@
+package io.capawesome.capacitorjs.plugins.androidedgetoedgesupport;
+
+import androidx.annotation.Nullable;
+import com.getcapacitor.Plugin;
+import com.getcapacitor.PluginCall;
+import com.getcapacitor.PluginMethod;
+import com.getcapacitor.annotation.CapacitorPlugin;
+
+@CapacitorPlugin(name = "EdgeToEdge")
+public class EdgeToEdgePlugin extends Plugin {
+
+    private static final String ERROR_COLOR_MISSING = "color must be provided.";
+    private static final String TAG = "EdgeToEdge";
+
+    @Nullable
+    private EdgeToEdge implementation;
+
+    @Override
+    public void load() {
+        implementation = new EdgeToEdge(this);
+    }
+
+    @PluginMethod
+    public void setBackgroundColor(PluginCall call) {
+        String color = call.getString("color");
+        if (color == null) {
+            call.reject(ERROR_COLOR_MISSING);
+            return;
+        }
+        implementation.setBackgroundColor(color);
+        call.resolve();
+    }
+}

package/dist/docs.json

@@ -0,0 +1,73 @@
+{
+  "api": {
+    "name": "EdgeToEdgePlugin",
+    "slug": "edgetoedgeplugin",
+    "docs": "",
+    "tags": [],
+    "methods": [
+      {
+        "name": "setBackgroundColor",
+        "signature": "(options: SetBackgroundColorOptions) => Promise<void>",
+        "parameters": [
+          {
+            "name": "options",
+            "docs": "",
+            "type": "SetBackgroundColorOptions"
+          }
+        ],
+        "returns": "Promise<void>",
+        "tags": [
+          {
+            "name": "since",
+            "text": "7.0.0"
+          }
+        ],
+        "docs": "Set the background color of the status bar and navigation bar.\n\nOnly available on Android.",
+        "complexTypes": [
+          "SetBackgroundColorOptions"
+        ],
+        "slug": "setbackgroundcolor"
+      }
+    ],
+    "properties": []
+  },
+  "interfaces": [
+    {
+      "name": "SetBackgroundColorOptions",
+      "slug": "setbackgroundcoloroptions",
+      "docs": "",
+      "tags": [
+        {
+          "text": "7.0.0",
+          "name": "since"
+        }
+      ],
+      "methods": [],
+      "properties": [
+        {
+          "name": "color",
+          "tags": [
+            {
+              "text": "7.0.0",
+              "name": "since"
+            },
+            {
+              "text": "\"#ffffff\"",
+              "name": "example"
+            },
+            {
+              "text": "\"#000000\"",
+              "name": "example"
+            }
+          ],
+          "docs": "The hexadecimal color to set as the background color of the status bar and navigation bar.",
+          "complexTypes": [],
+          "type": "string"
+        }
+      ]
+    }
+  ],
+  "enums": [],
+  "typeAliases": [],
+  "pluginConfigs": []
+}

package/dist/esm/definitions.d.ts

@@ -0,0 +1,23 @@
+export interface EdgeToEdgePlugin {
+    /**
+     * Set the background color of the status bar and navigation bar.
+     *
+     * Only available on Android.
+     *
+     * @since 7.0.0
+     */
+    setBackgroundColor(options: SetBackgroundColorOptions): Promise<void>;
+}
+/**
+ * @since 7.0.0
+ */
+export interface SetBackgroundColorOptions {
+    /**
+     * The hexadecimal color to set as the background color of the status bar and navigation bar.
+     *
+     * @since 7.0.0
+     * @example "#ffffff"
+     * @example "#000000"
+     */
+    color: string;
+}

package/dist/esm/definitions.js

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

package/dist/esm/definitions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"definitions.js","sourceRoot":"","sources":["../../src/definitions.ts"],"names":[],"mappings":"","sourcesContent":["export interface EdgeToEdgePlugin {\n  /**\n   * Set the background color of the status bar and navigation bar.\n   *\n   * Only available on Android.\n   *\n   * @since 7.0.0\n   */\n  setBackgroundColor(options: SetBackgroundColorOptions): Promise<void>;\n}\n\n/**\n * @since 7.0.0\n */\nexport interface SetBackgroundColorOptions {\n  /**\n   * The hexadecimal color to set as the background color of the status bar and navigation bar.\n   *\n   * @since 7.0.0\n   * @example \"#ffffff\"\n   * @example \"#000000\"\n   */\n  color: string;\n}\n"]}

package/dist/esm/index.d.ts

@@ -0,0 +1,4 @@
+import type { EdgeToEdgePlugin } from './definitions';
+declare const EdgeToEdge: EdgeToEdgePlugin;
+export * from './definitions';
+export { EdgeToEdge };

package/dist/esm/index.js

@@ -0,0 +1,5 @@
+import { registerPlugin } from '@capacitor/core';
+const EdgeToEdge = registerPlugin('EdgeToEdge', {});
+export * from './definitions';
+export { EdgeToEdge };
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAIjD,MAAM,UAAU,GAAG,cAAc,CAAmB,YAAY,EAAE,EAAE,CAAC,CAAC;AAEtE,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,UAAU,EAAE,CAAC","sourcesContent":["import { registerPlugin } from '@capacitor/core';\n\nimport type { EdgeToEdgePlugin } from './definitions';\n\nconst EdgeToEdge = registerPlugin<EdgeToEdgePlugin>('EdgeToEdge', {});\n\nexport * from './definitions';\nexport { EdgeToEdge };\n"]}

package/dist/plugin.cjs.js

@@ -0,0 +1,8 @@
+'use strict';
+
+var core = require('@capacitor/core');
+
+const EdgeToEdge = core.registerPlugin('EdgeToEdge', {});
+
+exports.EdgeToEdge = EdgeToEdge;
+//# sourceMappingURL=plugin.cjs.js.map

package/dist/plugin.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin.cjs.js","sources":["esm/index.js"],"sourcesContent":["import { registerPlugin } from '@capacitor/core';\nconst EdgeToEdge = registerPlugin('EdgeToEdge', {});\nexport * from './definitions';\nexport { EdgeToEdge };\n//# sourceMappingURL=index.js.map"],"names":["registerPlugin"],"mappings":";;;;AACK,MAAC,UAAU,GAAGA,mBAAc,CAAC,YAAY,EAAE,EAAE;;;;"}

package/dist/plugin.js

@@ -0,0 +1,11 @@
+var capacitorEdgeToEdge = (function (exports, core) {
+	'use strict';
+
+	const EdgeToEdge = core.registerPlugin('EdgeToEdge', {});
+
+	exports.EdgeToEdge = EdgeToEdge;
+
+	return exports;
+
+})({}, capacitorExports);
+//# sourceMappingURL=plugin.js.map

package/dist/plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"plugin.js","sources":["esm/index.js"],"sourcesContent":["import { registerPlugin } from '@capacitor/core';\nconst EdgeToEdge = registerPlugin('EdgeToEdge', {});\nexport * from './definitions';\nexport { EdgeToEdge };\n//# sourceMappingURL=index.js.map"],"names":["registerPlugin"],"mappings":";;;AACK,OAAC,UAAU,GAAGA,mBAAc,CAAC,YAAY,EAAE,EAAE;;;;;;;;;;"}

package/package.json

@@ -0,0 +1,74 @@
+{
+  "name": "@capawesome/capacitor-android-edge-to-edge-support",
+  "version": "7.0.0",
+  "description": "Capacitor plugin to support edge-to-edge display on Android.",
+  "main": "dist/plugin.cjs.js",
+  "module": "dist/esm/index.js",
+  "types": "dist/esm/index.d.ts",
+  "unpkg": "dist/plugin.js",
+  "files": [
+    "android/src/main/",
+    "android/build.gradle",
+    "dist/"
+  ],
+  "author": "Robin Genz <mail@robingenz.dev>",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/capawesome-team/capacitor-plugins.git"
+  },
+  "bugs": {
+    "url": "https://github.com/capawesome-team/capacitor-plugins/issues"
+  },
+  "funding": [
+    {
+      "type": "github",
+      "url": "https://github.com/sponsors/capawesome-team/"
+    },
+    {
+      "type": "opencollective",
+      "url": "https://opencollective.com/capawesome"
+    }
+  ],
+  "homepage": "https://capawesome.io/plugins/android-edge-to-edge-support/",
+  "keywords": [
+    "capacitor",
+    "plugin",
+    "native"
+  ],
+  "scripts": {
+    "verify": "npm run verify:android && npm run verify:web",
+    "verify:android": "cd android && ./gradlew clean build test && cd ..",
+    "verify:web": "npm run build",
+    "lint": "npm run prettier -- --check",
+    "fmt": "npm run prettier -- --write",
+    "prettier": "prettier \"**/*.{css,html,ts,js,java}\"",
+    "docgen": "docgen --api EdgeToEdgePlugin --output-readme README.md --output-json dist/docs.json",
+    "build": "npm run clean && npm run docgen && tsc && rollup -c rollup.config.mjs",
+    "clean": "rimraf ./dist",
+    "watch": "tsc --watch",
+    "prepublishOnly": "npm run build"
+  },
+  "devDependencies": {
+    "@capacitor/android": "7.0.0",
+    "@capacitor/cli": "7.0.0",
+    "@capacitor/core": "7.0.0",
+    "@capacitor/docgen": "0.3.0",
+    "prettier": "3.4.2",
+    "prettier-plugin-java": "2.6.7",
+    "rimraf": "6.0.1",
+    "rollup": "4.30.1",
+    "typescript": "4.1.5"
+  },
+  "peerDependencies": {
+    "@capacitor/core": ">=7.0.0"
+  },
+  "capacitor": {
+    "android": {
+      "src": "android"
+    }
+  },
+  "publishConfig": {
+    "access": "public"
+  }
+}