capacitor-plugin-status-bar 2.0.0

package/android/src/main/java/com/cap/plugins/statusbar/StatusBarPlugin.java

@@ -0,0 +1,120 @@
+package com.cap.plugins.statusbar;
+
+import com.getcapacitor.Plugin;
+import com.getcapacitor.PluginCall;
+import com.getcapacitor.PluginMethod;
+import com.getcapacitor.annotation.CapacitorPlugin;
+
+@CapacitorPlugin(name = "StatusBar")
+public class StatusBarPlugin extends Plugin {
+    private final StatusBar implementation = new StatusBar();
+
+    @Override
+    public void load() {
+        super.load();
+        // Apply default style based on system theme on plugin load
+        getActivity().runOnUiThread(() -> {
+            implementation.ensureEdgeToEdgeConfigured(getActivity());
+            implementation.applyDefaultStyle(getActivity());
+        });
+    }
+
+    @PluginMethod
+    public void setStyle(PluginCall call) {
+        try {
+            String style = call.getString("style");
+            String color = call.getString("color");
+            if (style == null) {
+                call.reject("style is required");
+                return;
+            }
+            getActivity().runOnUiThread(() -> {
+                implementation.setStyle(getActivity(), style, color);
+                call.resolve();
+            });
+        } catch (Exception e) {
+            call.reject(e.getMessage());
+        }
+    }
+
+    @PluginMethod
+    public void show(PluginCall call) {
+        try {
+            boolean animated = Boolean.TRUE.equals(call.getBoolean("animated", true));
+            getActivity().runOnUiThread(() -> {
+                implementation.showStatusBar(getActivity(), animated);
+                call.resolve();
+            });
+        } catch (Exception e) {
+            call.reject(e.getMessage());
+        }
+    }
+
+    @PluginMethod
+    public void hide(PluginCall call) {
+        try {
+            String animation = call.getString("animation");
+            if (animation == null) {
+                call.reject("animation is required");
+                return;
+            }
+            getActivity().runOnUiThread(() -> {
+                implementation.hideStatusBar(getActivity(), animation);
+                call.resolve();
+            });
+        } catch (Exception e) {
+            call.reject(e.getMessage());
+        }
+    }
+
+    @PluginMethod
+    public void setOverlaysWebView(PluginCall call) {
+        try {
+            Boolean value = call.getBoolean("value");
+            if (value == null) {
+                call.reject("value is required");
+                return;
+            }
+            getActivity().runOnUiThread(() -> {
+                implementation.setOverlaysWebView(getActivity(), value);
+                call.resolve();
+            });
+        } catch (Exception e) {
+            call.reject(e.getMessage());
+        }
+    }
+
+    @PluginMethod
+    public void setBackground(PluginCall call) {
+        try {
+            String color = call.getString("color");
+            if (color == null) {
+                call.reject("color is required");
+                return;
+            }
+            getActivity().runOnUiThread(() -> {
+                implementation.setBackground(getActivity(), color);
+                call.resolve();
+            });
+        } catch (Exception e) {
+            call.reject(e.getMessage());
+        }
+    }
+
+    @PluginMethod
+    public void getSafeAreaInsets(PluginCall call) {
+        try {
+            getActivity().runOnUiThread(() -> {
+                java.util.Map<String, Integer> insets = implementation.getSafeAreaInsets(getActivity());
+                com.getcapacitor.JSObject result = new com.getcapacitor.JSObject();
+                result.put("top", insets.get("top"));
+                result.put("bottom", insets.get("bottom"));
+                result.put("left", insets.get("left"));
+                result.put("right", insets.get("right"));
+                call.resolve(result);
+            });
+        } catch (Exception e) {
+            call.reject(e.getMessage());
+        }
+    }
+}

package/dist/docs.json

@@ -0,0 +1,332 @@
+{
+  "api": {
+    "name": "StatusBarPlugin",
+    "slug": "statusbarplugin",
+    "docs": "",
+    "tags": [],
+    "methods": [
+      {
+        "name": "setStyle",
+        "signature": "(options: StatusBarOptions) => Promise<void>",
+        "parameters": [
+          {
+            "name": "options",
+            "docs": "- The options to set the status bar style and color.",
+            "type": "StatusBarStyleOptions"
+          }
+        ],
+        "returns": "Promise<void>",
+        "tags": [
+          {
+            "name": "param",
+            "text": "options - The options to set the status bar style and color."
+          },
+          {
+            "name": "param",
+            "text": "options.style - The style of the status bar."
+          },
+          {
+            "name": "param",
+            "text": "options.color - The color of the status bar."
+          }
+        ],
+        "docs": "Set the status bar and navigation bar style and color.",
+        "complexTypes": [
+          "StatusBarOptions"
+        ],
+        "slug": "setstyle"
+      },
+      {
+        "name": "show",
+        "signature": "(options: StatusBarShowOptions) => Promise<void>",
+        "parameters": [
+          {
+            "name": "options",
+            "docs": "- The options to show the status bar.",
+            "type": "StatusBarShowOptions"
+          }
+        ],
+        "returns": "Promise<void>",
+        "tags": [
+          {
+            "name": "param",
+            "text": "options - The options to show the status bar."
+          },
+          {
+            "name": "param",
+            "text": "options.animated - Whether to animate the status bar."
+          }
+        ],
+        "docs": "Show the status bar.",
+        "complexTypes": [
+          "StatusBarShowOptions"
+        ],
+        "slug": "show"
+      },
+      {
+        "name": "hide",
+        "signature": "(options: StatusBarHideOptions) => Promise<void>",
+        "parameters": [
+          {
+            "name": "options",
+            "docs": "- The options to hide the status bar.",
+            "type": "StatusBarHideOptions"
+          }
+        ],
+        "returns": "Promise<void>",
+        "tags": [
+          {
+            "name": "param",
+            "text": "options - The options to hide the status bar."
+          },
+          {
+            "name": "param",
+            "text": "options.animation - The animation type: 'fade' makes background transparent, 'slide' hides bars completely."
+          }
+        ],
+        "docs": "Hide the status bar.",
+        "complexTypes": [
+          "StatusBarHideOptions"
+        ],
+        "slug": "hide"
+      },
+      {
+        "name": "setOverlaysWebView",
+        "signature": "(options: StatusBarSetOverlaysWebViewOptions) => Promise<void>",
+        "parameters": [
+          {
+            "name": "options",
+            "docs": "- The options to set the status bar overlays web view.",
+            "type": "StatusBarSetOverlaysWebViewOptions"
+          }
+        ],
+        "returns": "Promise<void>",
+        "tags": [
+          {
+            "name": "param",
+            "text": "options - The options to set the status bar overlays web view."
+          },
+          {
+            "name": "param",
+            "text": "options.value - Whether the status bar overlays the web view (required)."
+          }
+        ],
+        "docs": "Set whether the status bar overlays the web view.\n\n**iOS only** - On Android this is a no-op (resolves without error).\n\n- `true`: Web content extends behind the status bar (transparent background),\n  allowing content to be visible through the status bar area on scroll.\n- `false`: Restores the status bar background to the color set by `setStyle`\n  or falls back to the default style from Capacitor config.",
+        "complexTypes": [
+          "StatusBarSetOverlaysWebViewOptions"
+        ],
+        "slug": "setoverlayswebview"
+      },
+      {
+        "name": "setBackground",
+        "signature": "(options: StatusBarSetBackgroundOptions) => Promise<void>",
+        "parameters": [
+          {
+            "name": "options",
+            "docs": "- The options to set the window background color.",
+            "type": "StatusBarSetBackgroundOptions"
+          }
+        ],
+        "returns": "Promise<void>",
+        "tags": [
+          {
+            "name": "param",
+            "text": "options - The options to set the window background color."
+          },
+          {
+            "name": "param",
+            "text": "options.color - The background color in HEX format."
+          }
+        ],
+        "docs": "Set the window background color.",
+        "complexTypes": [
+          "StatusBarSetBackgroundOptions"
+        ],
+        "slug": "setbackground"
+      },
+      {
+        "name": "getSafeAreaInsets",
+        "signature": "() => Promise<SafeAreaInsets>",
+        "parameters": [],
+        "returns": "Promise<SafeAreaInsets>",
+        "tags": [],
+        "docs": "Get the safe area insets.\nReturns the insets for status bar, navigation bar, and notch areas.\nValues are in pixels on Android and points on iOS.",
+        "complexTypes": [
+          "SafeAreaInsets"
+        ],
+        "slug": "getsafeareainsets"
+      }
+    ],
+    "properties": []
+  },
+  "interfaces": [],
+  "enums": [
+    {
+      "name": "Style",
+      "slug": "style",
+      "members": [
+        {
+          "name": "LIGHT",
+          "value": "'LIGHT'",
+          "tags": [],
+          "docs": ""
+        },
+        {
+          "name": "DARK",
+          "value": "'DARK'",
+          "tags": [],
+          "docs": ""
+        },
+        {
+          "name": "CUSTOM",
+          "value": "'CUSTOM'",
+          "tags": [],
+          "docs": ""
+        }
+      ]
+    },
+    {
+      "name": "StatusBarAnimation",
+      "slug": "statusbaranimation",
+      "members": [
+        {
+          "name": "NONE",
+          "value": "'none'",
+          "tags": [],
+          "docs": ""
+        },
+        {
+          "name": "FADE",
+          "value": "'fade'",
+          "tags": [],
+          "docs": ""
+        },
+        {
+          "name": "SLIDE",
+          "value": "'slide'",
+          "tags": [],
+          "docs": ""
+        }
+      ]
+    }
+  ],
+  "typeAliases": [
+    {
+      "name": "StatusBarOptions",
+      "slug": "statusbaroptions",
+      "docs": "",
+      "types": [
+        {
+          "text": "StatusBarStyleOptions",
+          "complexTypes": [
+            "StatusBarStyleOptions"
+          ]
+        }
+      ]
+    },
+    {
+      "name": "StatusBarStyleOptions",
+      "slug": "statusbarstyleoptions",
+      "docs": "",
+      "types": [
+        {
+          "text": "StatusBarStyleNoDefaultOptions",
+          "complexTypes": [
+            "StatusBarStyleNoDefaultOptions"
+          ]
+        },
+        {
+          "text": "{\n      style: Style.CUSTOM;\n      color: StatusBarColor;\n    }",
+          "complexTypes": [
+            "Style",
+            "StatusBarColor"
+          ]
+        }
+      ]
+    },
+    {
+      "name": "StatusBarStyleNoDefaultOptions",
+      "slug": "statusbarstylenodefaultoptions",
+      "docs": "",
+      "types": [
+        {
+          "text": "{\n  style: Style;\n}",
+          "complexTypes": [
+            "Style"
+          ]
+        }
+      ]
+    },
+    {
+      "name": "StatusBarColor",
+      "slug": "statusbarcolor",
+      "docs": "Full HEX color format only (6 or 8 digits).\n- 6 digits: #RRGGBB (e.g., #FFFFFF, #000000, #FF5733)\n- 8 digits: #RRGGBBAA with alpha channel (e.g., #FFFFFF00, #FF5733CC)\n\nNote: Short 3-digit format (#FFF) is NOT supported.",
+      "types": [
+        {
+          "text": "`#${string}`",
+          "complexTypes": []
+        }
+      ]
+    },
+    {
+      "name": "StatusBarShowOptions",
+      "slug": "statusbarshowoptions",
+      "docs": "",
+      "types": [
+        {
+          "text": "{\n  animated: boolean;\n}",
+          "complexTypes": []
+        }
+      ]
+    },
+    {
+      "name": "StatusBarHideOptions",
+      "slug": "statusbarhideoptions",
+      "docs": "",
+      "types": [
+        {
+          "text": "{\n  /**\n   * The animation type for hiding the status bar.\n   * - 'fade': Makes the background transparent without removing the status bar and navigation bar.\n   * - 'slide': Hides the status bar and navigation bar completely (default behavior).\n   */\n  animation: StatusBarAnimation;\n}",
+          "complexTypes": [
+            "StatusBarAnimation"
+          ]
+        }
+      ]
+    },
+    {
+      "name": "StatusBarSetOverlaysWebViewOptions",
+      "slug": "statusbarsetoverlayswebviewoptions",
+      "docs": "",
+      "types": [
+        {
+          "text": "{\n  value: boolean;\n}",
+          "complexTypes": []
+        }
+      ]
+    },
+    {
+      "name": "StatusBarSetBackgroundOptions",
+      "slug": "statusbarsetbackgroundoptions",
+      "docs": "",
+      "types": [
+        {
+          "text": "{\n  color: StatusBarColor;\n}",
+          "complexTypes": [
+            "StatusBarColor"
+          ]
+        }
+      ]
+    },
+    {
+      "name": "SafeAreaInsets",
+      "slug": "safeareainsets",
+      "docs": "",
+      "types": [
+        {
+          "text": "{\n  top: number;\n  bottom: number;\n  left: number;\n  right: number;\n}",
+          "complexTypes": []
+        }
+      ]
+    }
+  ],
+  "pluginConfigs": []
+}

package/dist/esm/definitions.d.ts

@@ -0,0 +1,97 @@
+export declare enum Style {
+    LIGHT = "LIGHT",
+    DARK = "DARK",
+    CUSTOM = "CUSTOM"
+}
+/**
+ * Full HEX color format only (6 or 8 digits).
+ * - 6 digits: #RRGGBB (e.g., #FFFFFF, #000000, #FF5733)
+ * - 8 digits: #RRGGBBAA with alpha channel (e.g., #FFFFFF00, #FF5733CC)
+ *
+ * Note: Short 3-digit format (#FFF) is NOT supported.
+ */
+export declare type StatusBarColor = `#${string}`;
+export declare enum StatusBarAnimation {
+    NONE = "none",
+    FADE = "fade",
+    SLIDE = "slide"
+}
+declare type StatusBarStyleNoDefaultOptions = {
+    style: Style;
+};
+declare type StatusBarStyleOptions = StatusBarStyleNoDefaultOptions | {
+    style: Style.CUSTOM;
+    color: StatusBarColor;
+};
+export declare type StatusBarOptions = StatusBarStyleOptions;
+export declare type StatusBarShowOptions = {
+    animated: boolean;
+};
+export declare type StatusBarHideOptions = {
+    /**
+     * The animation type for hiding the status bar.
+     * - 'fade': Makes the background transparent without removing the status bar and navigation bar.
+     * - 'slide': Hides the status bar and navigation bar completely (default behavior).
+     */
+    animation: StatusBarAnimation;
+};
+export declare type StatusBarSetOverlaysWebViewOptions = {
+    value: boolean;
+};
+export declare type StatusBarSetBackgroundOptions = {
+    color: StatusBarColor;
+};
+export declare type SafeAreaInsets = {
+    top: number;
+    bottom: number;
+    left: number;
+    right: number;
+};
+export interface StatusBarPlugin {
+    /**
+     * Set the status bar and navigation bar style and color.
+     * @param options - The options to set the status bar style and color.
+     * @param options.style - The style of the status bar.
+     * @param options.color - The color of the status bar.
+     */
+    setStyle(options: StatusBarOptions): Promise<void>;
+    /**
+     * Show the status bar.
+     * @param options - The options to show the status bar.
+     * @param options.animated - Whether to animate the status bar.
+     */
+    show(options: StatusBarShowOptions): Promise<void>;
+    /**
+     * Hide the status bar.
+     * @param options - The options to hide the status bar.
+     * @param options.animation - The animation type: 'fade' makes background transparent, 'slide' hides bars completely.
+     */
+    hide(options: StatusBarHideOptions): Promise<void>;
+    /**
+     * Set whether the status bar overlays the web view.
+     *
+     * **iOS only** - On Android this is a no-op (resolves without error).
+     *
+     * - `true`: Web content extends behind the status bar (transparent background),
+     *   allowing content to be visible through the status bar area on scroll.
+     * - `false`: Restores the status bar background to the color set by `setStyle`
+     *   or falls back to the default style from Capacitor config.
+     *
+     * @param options - The options to set the status bar overlays web view.
+     * @param options.value - Whether the status bar overlays the web view (required).
+     */
+    setOverlaysWebView(options: StatusBarSetOverlaysWebViewOptions): Promise<void>;
+    /**
+     * Set the window background color.
+     * @param options - The options to set the window background color.
+     * @param options.color - The background color in HEX format.
+     */
+    setBackground(options: StatusBarSetBackgroundOptions): Promise<void>;
+    /**
+     * Get the safe area insets.
+     * Returns the insets for status bar, navigation bar, and notch areas.
+     * Values are in pixels on Android and points on iOS.
+     */
+    getSafeAreaInsets(): Promise<SafeAreaInsets>;
+}
+export {};

package/dist/esm/definitions.js

@@ -0,0 +1,13 @@
+export var Style;
+(function (Style) {
+    Style["LIGHT"] = "LIGHT";
+    Style["DARK"] = "DARK";
+    Style["CUSTOM"] = "CUSTOM";
+})(Style || (Style = {}));
+export var StatusBarAnimation;
+(function (StatusBarAnimation) {
+    StatusBarAnimation["NONE"] = "none";
+    StatusBarAnimation["FADE"] = "fade";
+    StatusBarAnimation["SLIDE"] = "slide";
+})(StatusBarAnimation || (StatusBarAnimation = {}));
+//# 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":"AAAA,MAAM,CAAN,IAAY,KAIX;AAJD,WAAY,KAAK;IACf,wBAAe,CAAA;IACf,sBAAa,CAAA;IACb,0BAAiB,CAAA;AACnB,CAAC,EAJW,KAAK,KAAL,KAAK,QAIhB;AAWD,MAAM,CAAN,IAAY,kBAIX;AAJD,WAAY,kBAAkB;IAC5B,mCAAa,CAAA;IACb,mCAAa,CAAA;IACb,qCAAe,CAAA;AACjB,CAAC,EAJW,kBAAkB,KAAlB,kBAAkB,QAI7B","sourcesContent":["export enum Style {\n  LIGHT = 'LIGHT',\n  DARK = 'DARK',\n  CUSTOM = 'CUSTOM',\n}\n\n/**\n * Full HEX color format only (6 or 8 digits).\n * - 6 digits: #RRGGBB (e.g., #FFFFFF, #000000, #FF5733)\n * - 8 digits: #RRGGBBAA with alpha channel (e.g., #FFFFFF00, #FF5733CC)\n *\n * Note: Short 3-digit format (#FFF) is NOT supported.\n */\nexport type StatusBarColor = `#${string}`;\n\nexport enum StatusBarAnimation {\n  NONE = 'none',\n  FADE = 'fade',\n  SLIDE = 'slide',\n}\n\ntype StatusBarStyleNoDefaultOptions = {\n  style: Style;\n};\n\ntype StatusBarStyleOptions =\n  | StatusBarStyleNoDefaultOptions\n  | {\n      style: Style.CUSTOM;\n      color: StatusBarColor;\n    };\n\nexport type StatusBarOptions = StatusBarStyleOptions;\n\nexport type StatusBarShowOptions = {\n  animated: boolean;\n};\n\nexport type StatusBarHideOptions = {\n  /**\n   * The animation type for hiding the status bar.\n   * - 'fade': Makes the background transparent without removing the status bar and navigation bar.\n   * - 'slide': Hides the status bar and navigation bar completely (default behavior).\n   */\n  animation: StatusBarAnimation;\n};\n\nexport type StatusBarSetOverlaysWebViewOptions = {\n  value: boolean;\n};\n\nexport type StatusBarSetBackgroundOptions = {\n  color: StatusBarColor;\n};\n\nexport type SafeAreaInsets = {\n  top: number;\n  bottom: number;\n  left: number;\n  right: number;\n};\n\nexport interface StatusBarPlugin {\n  /**\n   * Set the status bar and navigation bar style and color.\n   * @param options - The options to set the status bar style and color.\n   * @param options.style - The style of the status bar.\n   * @param options.color - The color of the status bar.\n   */\n  setStyle(options: StatusBarOptions): Promise<void>;\n  /**\n   * Show the status bar.\n   * @param options - The options to show the status bar.\n   * @param options.animated - Whether to animate the status bar.\n   */\n  show(options: StatusBarShowOptions): Promise<void>;\n  /**\n   * Hide the status bar.\n   * @param options - The options to hide the status bar.\n   * @param options.animation - The animation type: 'fade' makes background transparent, 'slide' hides bars completely.\n   */\n  hide(options: StatusBarHideOptions): Promise<void>;\n  /**\n   * Set whether the status bar overlays the web view.\n   *\n   * **iOS only** - On Android this is a no-op (resolves without error).\n   *\n   * - `true`: Web content extends behind the status bar (transparent background),\n   *   allowing content to be visible through the status bar area on scroll.\n   * - `false`: Restores the status bar background to the color set by `setStyle`\n   *   or falls back to the default style from Capacitor config.\n   *\n   * @param options - The options to set the status bar overlays web view.\n   * @param options.value - Whether the status bar overlays the web view (required).\n   */\n  setOverlaysWebView(options: StatusBarSetOverlaysWebViewOptions): Promise<void>;\n  /**\n   * Set the window background color.\n   * @param options - The options to set the window background color.\n   * @param options.color - The background color in HEX format.\n   */\n  setBackground(options: StatusBarSetBackgroundOptions): Promise<void>;\n  /**\n   * Get the safe area insets.\n   * Returns the insets for status bar, navigation bar, and notch areas.\n   * Values are in pixels on Android and points on iOS.\n   */\n  getSafeAreaInsets(): Promise<SafeAreaInsets>;\n}\n"]}

package/dist/esm/index.d.ts

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

package/dist/esm/index.js

@@ -0,0 +1,7 @@
+import { registerPlugin } from '@capacitor/core';
+const StatusBar = registerPlugin('StatusBar', {
+    web: () => import('./web').then((m) => new m.StatusBarWeb()),
+});
+export * from './definitions';
+export { StatusBar };
+//# 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,SAAS,GAAG,cAAc,CAAkB,WAAW,EAAE;IAC7D,GAAG,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC,YAAY,EAAE,CAAC;CAC7D,CAAC,CAAC;AAEH,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,SAAS,EAAE,CAAC","sourcesContent":["import { registerPlugin } from '@capacitor/core';\n\nimport type { StatusBarPlugin } from './definitions';\n\nconst StatusBar = registerPlugin<StatusBarPlugin>('StatusBar', {\n  web: () => import('./web').then((m) => new m.StatusBarWeb()),\n});\n\nexport * from './definitions';\nexport { StatusBar };\n"]}

package/dist/esm/web.d.ts

@@ -0,0 +1,10 @@
+import { WebPlugin } from '@capacitor/core';
+import type { StatusBarOptions, StatusBarPlugin, StatusBarSetOverlaysWebViewOptions, StatusBarShowOptions, StatusBarHideOptions, StatusBarSetBackgroundOptions, SafeAreaInsets } from './definitions';
+export declare class StatusBarWeb extends WebPlugin implements StatusBarPlugin {
+    setStyle(options: StatusBarOptions): Promise<void>;
+    show(options: StatusBarShowOptions): Promise<void>;
+    hide(options: StatusBarHideOptions): Promise<void>;
+    setOverlaysWebView(options: StatusBarSetOverlaysWebViewOptions): Promise<void>;
+    setBackground(options: StatusBarSetBackgroundOptions): Promise<void>;
+    getSafeAreaInsets(): Promise<SafeAreaInsets>;
+}

package/dist/esm/web.js

@@ -0,0 +1,35 @@
+import { WebPlugin } from '@capacitor/core';
+export class StatusBarWeb extends WebPlugin {
+    async setStyle(options) {
+        console.log('setStyle', options);
+    }
+    async show(options) {
+        console.log('show', options);
+    }
+    async hide(options) {
+        console.log('hide', options);
+    }
+    async setOverlaysWebView(options) {
+        console.log('setOverlaysWebView', options);
+    }
+    async setBackground(options) {
+        console.log('setBackground', options);
+    }
+    async getSafeAreaInsets() {
+        // On web, we can use CSS environment variables to get safe area insets
+        // These are set by the browser on devices with notches, etc.
+        const getInsetValue = (variable) => {
+            const value = getComputedStyle(document.documentElement).getPropertyValue(variable).trim();
+            return value ? parseInt(value, 10) : 0;
+        };
+        const insets = {
+            top: getInsetValue('env(safe-area-inset-top)') || getInsetValue('constant(safe-area-inset-top)') || 0,
+            bottom: getInsetValue('env(safe-area-inset-bottom)') || getInsetValue('constant(safe-area-inset-bottom)') || 0,
+            left: getInsetValue('env(safe-area-inset-left)') || getInsetValue('constant(safe-area-inset-left)') || 0,
+            right: getInsetValue('env(safe-area-inset-right)') || getInsetValue('constant(safe-area-inset-right)') || 0,
+        };
+        console.log('getSafeAreaInsets', insets);
+        return insets;
+    }
+}
+//# sourceMappingURL=web.js.map

package/dist/esm/web.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"web.js","sourceRoot":"","sources":["../../src/web.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAY5C,MAAM,OAAO,YAAa,SAAQ,SAAS;IACzC,KAAK,CAAC,QAAQ,CAAC,OAAyB;QACtC,OAAO,CAAC,GAAG,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;IACnC,CAAC;IAED,KAAK,CAAC,IAAI,CAAC,OAA6B;QACtC,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/B,CAAC;IAED,KAAK,CAAC,IAAI,CAAC,OAA6B;QACtC,OAAO,CAAC,GAAG,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/B,CAAC;IAED,KAAK,CAAC,kBAAkB,CAAC,OAA2C;QAClE,OAAO,CAAC,GAAG,CAAC,oBAAoB,EAAE,OAAO,CAAC,CAAC;IAC7C,CAAC;IAED,KAAK,CAAC,aAAa,CAAC,OAAsC;QACxD,OAAO,CAAC,GAAG,CAAC,eAAe,EAAE,OAAO,CAAC,CAAC;IACxC,CAAC;IAED,KAAK,CAAC,iBAAiB;QACrB,uEAAuE;QACvE,6DAA6D;QAC7D,MAAM,aAAa,GAAG,CAAC,QAAgB,EAAU,EAAE;YACjD,MAAM,KAAK,GAAG,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,IAAI,EAAE,CAAC;YAC3F,OAAO,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACzC,CAAC,CAAC;QAEF,MAAM,MAAM,GAAmB;YAC7B,GAAG,EAAE,aAAa,CAAC,0BAA0B,CAAC,IAAI,aAAa,CAAC,+BAA+B,CAAC,IAAI,CAAC;YACrG,MAAM,EAAE,aAAa,CAAC,6BAA6B,CAAC,IAAI,aAAa,CAAC,kCAAkC,CAAC,IAAI,CAAC;YAC9G,IAAI,EAAE,aAAa,CAAC,2BAA2B,CAAC,IAAI,aAAa,CAAC,gCAAgC,CAAC,IAAI,CAAC;YACxG,KAAK,EAAE,aAAa,CAAC,4BAA4B,CAAC,IAAI,aAAa,CAAC,iCAAiC,CAAC,IAAI,CAAC;SAC5G,CAAC;QAEF,OAAO,CAAC,GAAG,CAAC,mBAAmB,EAAE,MAAM,CAAC,CAAC;QACzC,OAAO,MAAM,CAAC;IAChB,CAAC;CACF","sourcesContent":["import { WebPlugin } from '@capacitor/core';\n\nimport type {\n  StatusBarOptions,\n  StatusBarPlugin,\n  StatusBarSetOverlaysWebViewOptions,\n  StatusBarShowOptions,\n  StatusBarHideOptions,\n  StatusBarSetBackgroundOptions,\n  SafeAreaInsets,\n} from './definitions';\n\nexport class StatusBarWeb extends WebPlugin implements StatusBarPlugin {\n  async setStyle(options: StatusBarOptions): Promise<void> {\n    console.log('setStyle', options);\n  }\n\n  async show(options: StatusBarShowOptions): Promise<void> {\n    console.log('show', options);\n  }\n\n  async hide(options: StatusBarHideOptions): Promise<void> {\n    console.log('hide', options);\n  }\n\n  async setOverlaysWebView(options: StatusBarSetOverlaysWebViewOptions): Promise<void> {\n    console.log('setOverlaysWebView', options);\n  }\n\n  async setBackground(options: StatusBarSetBackgroundOptions): Promise<void> {\n    console.log('setBackground', options);\n  }\n\n  async getSafeAreaInsets(): Promise<SafeAreaInsets> {\n    // On web, we can use CSS environment variables to get safe area insets\n    // These are set by the browser on devices with notches, etc.\n    const getInsetValue = (variable: string): number => {\n      const value = getComputedStyle(document.documentElement).getPropertyValue(variable).trim();\n      return value ? parseInt(value, 10) : 0;\n    };\n\n    const insets: SafeAreaInsets = {\n      top: getInsetValue('env(safe-area-inset-top)') || getInsetValue('constant(safe-area-inset-top)') || 0,\n      bottom: getInsetValue('env(safe-area-inset-bottom)') || getInsetValue('constant(safe-area-inset-bottom)') || 0,\n      left: getInsetValue('env(safe-area-inset-left)') || getInsetValue('constant(safe-area-inset-left)') || 0,\n      right: getInsetValue('env(safe-area-inset-right)') || getInsetValue('constant(safe-area-inset-right)') || 0,\n    };\n\n    console.log('getSafeAreaInsets', insets);\n    return insets;\n  }\n}\n"]}