From c5d316e71e8701b9f2b61a535f0db81f05d6ed59 Mon Sep 17 00:00:00 2001
From: Ashutosh <asutosh.dubey97@gmail.com>
Date: Sun, 18 Jun 2023 01:12:04 +0530
Subject: [PATCH] chore: publish v2.1.1

=> updated example app to compily with new changes
---
 CHANGELOG.md                        | 18 ++++++++++++++++++
 example/src/js/capacitor-welcome.js |  3 +++
 package.json                        |  2 +-
 3 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index dc8f7a0..e25ba00 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,23 @@
 # Changelog
 
+## [v2.1.1](https://github.com/Aashu-Dubey/capacitor-statusbar-safe-area/compare/v2.1.0...v2.1.1) - (18 Jun 2023)
+
+## Breaking Change
+
+- Make `safe-area` custom element opt-in to register only if needed and to also to prevent breaking evaluating `SafeAreaController` in SSR environments. by @jjang16 in [#9](https://github.com/Aashu-Dubey/capacitor-statusbar-safe-area/pull/9)
+
+If earlier you were using the `safe-area` tag by simple (Empty) import, you now have to import and call function `registerSafeAreaElement`
+
+```js
+// root.component.ts or your-component.ts
+
+import { registerSafeAreaElement } '@aashu-dubey/capacitor-statusbar-safe-area';
+
+registerSafeAreaElement();
+```
+
+- `SafeAreaType` type has been renamed to `SafeAreaInset` ([changelog](https://github.com/Aashu-Dubey/capacitor-statusbar-safe-area/compare/08404be...e181a2e))
+
 ## [v2.1.0](https://github.com/Aashu-Dubey/capacitor-statusbar-safe-area/compare/v2.0.0...v2.1.0) - (14 May 2023)
 
 ✨ Improvements
diff --git a/example/src/js/capacitor-welcome.js b/example/src/js/capacitor-welcome.js
index 8c2f486..be39ff8 100644
--- a/example/src/js/capacitor-welcome.js
+++ b/example/src/js/capacitor-welcome.js
@@ -1,6 +1,7 @@
 import {
   SafeArea,
   SafeAreaController,
+  registerSafeAreaElement,
 } from '@aashu-dubey/capacitor-statusbar-safe-area';
 import { SplashScreen } from '@capacitor/splash-screen';
 
@@ -104,6 +105,8 @@ window.customElements.define(
 
       // Injecting CSS variable so we can use then in styles
       SafeAreaController.injectCSSVariables();
+      // Registering the safe-area custom element to use as an html tag
+      registerSafeAreaElement();
 
       // Using plugin's following methods to get status bar height and safe area insets info
       const { height } = await SafeArea.getStatusBarHeight();
diff --git a/package.json b/package.json
index 77c1ce3..e325487 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@aashu-dubey/capacitor-statusbar-safe-area",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "Get Status bar height and Safe area insets on Android & iOS.",
   "main": "dist/plugin.cjs.js",
   "module": "dist/esm/index.js",