From 2853f21f88cb895acbf507fd9a70563a63324a83 Mon Sep 17 00:00:00 2001
From: Abdul Rehman Talat <rehman.talat@gmail.com>
Date: Tue, 16 Apr 2019 15:34:20 +0500
Subject: [PATCH 1/2] =?UTF-8?q?feat(=F0=9F=96=A5=20Screen=20Observers):=20?=
 =?UTF-8?q?Added=20OrientationObserver=20&=20ScreenSizeOverserver?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/OrientationObserver.ts | 14 ++++++++++++++
 src/components/ScreenSizeObserver.ts  | 16 ++++++++++++++++
 src/components/index.ts               |  2 ++
 3 files changed, 32 insertions(+)
 create mode 100644 src/components/OrientationObserver.ts
 create mode 100644 src/components/ScreenSizeObserver.ts

diff --git a/src/components/OrientationObserver.ts b/src/components/OrientationObserver.ts
new file mode 100644
index 0000000..3066343
--- /dev/null
+++ b/src/components/OrientationObserver.ts
@@ -0,0 +1,14 @@
+import { RenderPropChildren, getComponent } from '@bluebase/core';
+
+export interface OrientationObserverProps {
+	children: RenderPropChildren<OrientationObserverState>
+}
+
+export interface OrientationObserverState {
+	isLandscape: boolean,
+}
+
+/**
+ * # 🖥 Observes changes in Screen Orientation
+ */
+export const OrientationObserver = getComponent<OrientationObserverProps>('OrientationObserver');
diff --git a/src/components/ScreenSizeObserver.ts b/src/components/ScreenSizeObserver.ts
new file mode 100644
index 0000000..8281320
--- /dev/null
+++ b/src/components/ScreenSizeObserver.ts
@@ -0,0 +1,16 @@
+import { RenderPropChildren, getComponent } from '@bluebase/core';
+
+export type SCREEN_SIZE = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+
+export interface ScreenSizeObserverProps {
+	children: RenderPropChildren<SCREEN_SIZE>
+}
+
+export interface ScreenSizeObserverState {
+	readonly size: SCREEN_SIZE;
+}
+
+/**
+ * # 🖥 Observes changes in Screen Size
+ */
+export const ScreenSizeObserver = getComponent<ScreenSizeObserverProps>('ScreenSizeObserver');
diff --git a/src/components/index.ts b/src/components/index.ts
index 2a371df..82d896a 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -59,6 +59,7 @@ export * from './MenuItem';
 export * from './Navigation';
 export * from './NavigationActions';
 export * from './Noop';
+export * from './OrientationObserver';
 export * from './Overline';
 export * from './PluginIcon';
 export * from './ProgressBar';
@@ -69,6 +70,7 @@ export * from './RadioGroup';
 export * from './Redirect';
 export * from './ResponsiveLayout';
 export * from './Row';
+export * from './ScreenSizeObserver';
 export * from './Slider';
 export * from './Snackbar';
 export * from './StatefulComponent';

From ddc3f43958e3dc8dbc4e8515898ab5ac61560e7f Mon Sep 17 00:00:00 2001
From: Abdul Rehman Talat <rehman.talat@gmail.com>
Date: Tue, 16 Apr 2019 15:40:55 +0500
Subject: [PATCH 2/2] style: Fixed prettier issues

---
 src/components/OrientationObserver.ts | 4 ++--
 src/components/ScreenSizeObserver.ts  | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/OrientationObserver.ts b/src/components/OrientationObserver.ts
index 3066343..f9b408f 100644
--- a/src/components/OrientationObserver.ts
+++ b/src/components/OrientationObserver.ts
@@ -1,11 +1,11 @@
 import { RenderPropChildren, getComponent } from '@bluebase/core';
 
 export interface OrientationObserverProps {
-	children: RenderPropChildren<OrientationObserverState>
+	children: RenderPropChildren<OrientationObserverState>;
 }
 
 export interface OrientationObserverState {
-	isLandscape: boolean,
+	isLandscape: boolean;
 }
 
 /**
diff --git a/src/components/ScreenSizeObserver.ts b/src/components/ScreenSizeObserver.ts
index 8281320..9f9f929 100644
--- a/src/components/ScreenSizeObserver.ts
+++ b/src/components/ScreenSizeObserver.ts
@@ -3,7 +3,7 @@ import { RenderPropChildren, getComponent } from '@bluebase/core';
 export type SCREEN_SIZE = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 
 export interface ScreenSizeObserverProps {
-	children: RenderPropChildren<SCREEN_SIZE>
+	children: RenderPropChildren<SCREEN_SIZE>;
 }
 
 export interface ScreenSizeObserverState {