react-native-unistyles 2.0.0-alpha.7 → 2.0.0-alpha.8

package/lib/typescript/src/types/{cxx.d.ts → unistyles.d.ts}

@@ -1,16 +1,11 @@
+import { CxxUnistylesEventTypes, ScreenOrientation } from '../common';
 import type { UnistylesThemes, UnistylesBreakpoints } from '../global';
-import type { ScreenSize } from './breakpoints';
-import type { NestedKeys } from './core';
-export type Optional<T> = T | undefined;
-export type Nullable<T> = T | null;
+import type { NestedKeys, ScreenSize } from './core';
+import type { Optional } from './common';
 export type ColorSchemeName = Optional<'light' | 'dark'>;
 export type UnistylesConfig = {
     adaptiveThemes?: boolean;
 };
-export declare enum ScreenOrientation {
-    Portrait = 1,
-    Landscape = 2
-}
 export type UnistylesBridge = {
     screenWidth: number;
     screenHeight: number;
@@ -25,10 +20,6 @@ export type UnistylesBridge = {
     useAdaptiveThemes(enable: boolean): void;
     unregister(): void;
 };
-export declare enum CxxUnistylesEventTypes {
-    Theme = "theme",
-    Layout = "layout"
-}
 export type UnistylesThemeEvent = {
     type: CxxUnistylesEventTypes.Theme;
     payload: {
@@ -44,16 +35,7 @@ export type UnistylesMobileLayoutEvent = {
     };
 };
 export type UnistylesEvents = UnistylesThemeEvent | UnistylesMobileLayoutEvent;
-export declare enum UnistylesError {
-    RuntimeUnavailable = "UNISTYLES_ERROR_RUNTIME_UNAVAILABLE",
-    ThemeNotFound = "UNISTYLES_ERROR_THEME_NOT_FOUND",
-    ThemeNotRegistered = "UNISTYLES_ERROR_THEME_NOT_REGISTERED",
-    ThemesCannotBeEmpty = "UNISTYLES_ERROR_THEMES_CANNOT_BE_EMPTY",
-    BreakpointsCannotBeEmpty = "UNISTYLES_ERROR_BREAKPOINTS_CANNOT_BE_EMPTY",
-    BreakpointsMustStartFromZero = "UNISTYLES_ERROR_BREAKPOINTS_MUST_START_FROM_ZERO"
-}
 export interface UnistylesEngine {
-    isMediaQuery(key: string): boolean;
     didMatchMediaQuery(keys: NestedKeys): Optional<string>;
 }
-//# sourceMappingURL=cxx.d.ts.map
+//# sourceMappingURL=unistyles.d.ts.map

package/lib/typescript/src/types/unistyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"unistyles.d.ts","sourceRoot":"","sources":["../../../../src/types/unistyles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,sBAAsB,EAAE,iBAAiB,EAAE,MAAM,WAAW,CAAA;AACrE,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AACtE,OAAO,KAAK,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAA;AACpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAExC,MAAM,MAAM,eAAe,GAAG,QAAQ,CAAC,OAAO,GAAG,MAAM,CAAC,CAAA;AAExD,MAAM,MAAM,eAAe,GAAG;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAA;CAC3B,CAAA;AAED,MAAM,MAAM,eAAe,GAAG;IAE1B,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,iBAAiB,EAAE,OAAO,CAAC;IAC3B,SAAS,EAAE,MAAM,eAAe,CAAC;IACjC,UAAU,EAAE,MAAM,oBAAoB,CAAC;IACvC,WAAW,EAAE,eAAe,CAAC;IAC7B,qBAAqB,EAAE,KAAK,CAAC,CAAC,MAAM,oBAAoB,EAAE,oBAAoB,CAAC,MAAM,oBAAoB,CAAC,CAAC,CAAC,CAAC;IAG7G,MAAM,EAAE,KAAK,CAAC,MAAM,eAAe,CAAC,CAAC;IACrC,cAAc,CAAC,WAAW,EAAE,oBAAoB,GAAG,IAAI,CAAC;IACxD,QAAQ,CAAC,IAAI,EAAE,MAAM,eAAe,GAAG,IAAI,CAAC;IAC5C,iBAAiB,CAAC,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IAGzC,UAAU,IAAI,IAAI,CAAA;CACrB,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAC9B,IAAI,EAAE,sBAAsB,CAAC,KAAK,CAAC;IACnC,OAAO,EAAE;QACL,SAAS,EAAE,MAAM,eAAe,CAAA;KACnC,CAAA;CACJ,CAAA;AAED,MAAM,MAAM,0BAA0B,GAAG;IACrC,IAAI,EAAE,sBAAsB,CAAC,MAAM,CAAC;IACpC,OAAO,EAAE;QACL,MAAM,EAAE,UAAU,CAAC;QACnB,UAAU,EAAE,MAAM,oBAAoB,CAAC;QACvC,WAAW,EAAE,iBAAiB,CAAA;KACjC,CAAA;CACJ,CAAA;AAED,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAAG,0BAA0B,CAAA;AAE9E,MAAM,WAAW,eAAe;IAC5B,kBAAkB,CAAC,IAAI,EAAE,UAAU,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC;CAC1D"}

package/lib/typescript/src/useStyles.d.ts

@@ -1,8 +1,10 @@
-import type { CreateStylesFactory, CustomNamedStyles, ExtractBreakpoints, RemoveKeysWithPrefix } from './types';
-import type { UnistylesTheme } from './types';
-export declare const useStyles: <ST extends CustomNamedStyles<ST>>(stylesheet?: ST | CreateStylesFactory<ST, never> | undefined) => {
-    theme: never;
-    breakpoint: keyof import("./global").UnistylesBreakpoints;
-    styles: ExtractBreakpoints<RemoveKeysWithPrefix<ST>>;
+import type { CreateStylesFactory, CustomNamedStyles, ReactNativeStyleSheet, UnistylesTheme } from './types';
+import type { UnistylesBreakpoints } from './global';
+type ParsedStylesheet<ST extends CustomNamedStyles<ST>> = {
+    theme: UnistylesTheme;
+    breakpoint: keyof UnistylesBreakpoints;
+    styles: ReactNativeStyleSheet<ST>;
 };
+export declare const useStyles: <ST extends CustomNamedStyles<ST>>(stylesheet?: ST | CreateStylesFactory<ST, never> | undefined) => ParsedStylesheet<ST>;
+export {};
 //# sourceMappingURL=useStyles.d.ts.map

package/lib/typescript/src/useStyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useStyles.d.ts","sourceRoot":"","sources":["../../../src/useStyles.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAE/G,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE7C,eAAO,MAAM,SAAS;;;;CAsCrB,CAAA"}
+{"version":3,"file":"useStyles.d.ts","sourceRoot":"","sources":["../../../src/useStyles.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,mBAAmB,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA;AAE5G,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAA;AAEpD,KAAK,gBAAgB,CAAC,EAAE,SAAS,iBAAiB,CAAC,EAAE,CAAC,IAAI;IACtD,KAAK,EAAE,cAAc,CAAC;IACtB,UAAU,EAAE,MAAM,oBAAoB,CAAC;IACvC,MAAM,EAAE,qBAAqB,CAAC,EAAE,CAAC,CAAA;CACpC,CAAA;AAED,eAAO,MAAM,SAAS,0HAuCrB,CAAA"}

package/lib/typescript/src/utils/breakpoints.d.ts

@@ -1,6 +1,6 @@
-import type { MediaQueries } from '../types';
+import type { MediaQuery } from '../types';
 import type { UnistylesBreakpoints } from '../global';
 export declare const sortAndValidateBreakpoints: (breakpoints: UnistylesBreakpoints) => UnistylesBreakpoints;
 export declare const getBreakpointFromScreenWidth: (width: number, breakpointEntries: Array<[keyof UnistylesBreakpoints, UnistylesBreakpoints[keyof UnistylesBreakpoints]]>) => keyof UnistylesBreakpoints & string;
-export declare const getValueForBreakpoint: (value: Record<keyof UnistylesBreakpoints | MediaQueries, string | number | undefined>) => string | number | undefined;
+export declare const getValueForBreakpoint: (value: Record<keyof UnistylesBreakpoints | MediaQuery, string | number | undefined>) => string | number | undefined;
 //# sourceMappingURL=breakpoints.d.ts.map

package/lib/typescript/src/utils/breakpoints.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"breakpoints.d.ts","sourceRoot":"","sources":["../../../../src/utils/breakpoints.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAA;AAE5C,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAErD,eAAO,MAAM,0BAA0B,gBAAiB,oBAAoB,KAAG,oBAuB9E,CAAA;AAED,eAAO,MAAM,4BAA4B,UAAW,MAAM,qBAAqB,MAAM,CAAC,MAAM,oBAAoB,EAAE,oBAAoB,CAAC,MAAM,oBAAoB,CAAC,CAAC,CAAC,KAAG,MAAM,oBAAoB,GAAG,MAcnM,CAAA;AAED,eAAO,MAAM,qBAAqB,UAAW,OAAO,MAAM,oBAAoB,GAAG,YAAY,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,KAAG,MAAM,GAAG,MAAM,GAAG,SAmD/I,CAAA"}
+{"version":3,"file":"breakpoints.d.ts","sourceRoot":"","sources":["../../../../src/utils/breakpoints.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAc,MAAM,UAAU,CAAA;AACtD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAIrD,eAAO,MAAM,0BAA0B,gBAAiB,oBAAoB,KAAG,oBAuB9E,CAAA;AAED,eAAO,MAAM,4BAA4B,UAAW,MAAM,qBAAqB,MAAM,CAAC,MAAM,oBAAoB,EAAE,oBAAoB,CAAC,MAAM,oBAAoB,CAAC,CAAC,CAAC,KAAG,MAAM,oBAAoB,GAAG,MAcnM,CAAA;AAED,eAAO,MAAM,qBAAqB,UAAW,OAAO,MAAM,oBAAoB,GAAG,UAAU,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAAC,KAAG,MAAM,GAAG,MAAM,GAAG,SAmD7I,CAAA"}

package/lib/typescript/src/utils/index.d.ts

@@ -1,8 +1,8 @@
 export { normalizeStyles } from './normalizeStyles';
 export * from './normalizer';
-export { mq } from './mq';
+export { mq, MQSymbol } from './mq';
+export { getKeyForUnistylesMediaQuery } from './mqParser';
 export { getBreakpointFromScreenWidth, sortAndValidateBreakpoints, getValueForBreakpoint } from './breakpoints';
 export { proxifyFunction, parseStyle } from './styles';
 export { isServer, Orientation } from './common';
-export { extractValues, getKeyForCustomMediaQuery, isMediaQuery, isWithinTheHeight, isWithinTheWidth, isWithinTheWidthAndHeight } from './mediaQueries';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,cAAc,cAAc,CAAA;AAC5B,OAAO,EAAE,EAAE,EAAE,MAAM,MAAM,CAAA;AACzB,OAAO,EAAE,4BAA4B,EAAE,0BAA0B,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAC/G,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AACtD,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA;AAChD,OAAO,EACH,aAAa,EACb,yBAAyB,EACzB,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,yBAAyB,EAC5B,MAAM,gBAAgB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,cAAc,cAAc,CAAA;AAC5B,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,MAAM,MAAM,CAAA;AACnC,OAAO,EAAE,4BAA4B,EAAE,MAAM,YAAY,CAAA;AACzD,OAAO,EAAE,4BAA4B,EAAE,0BAA0B,EAAE,qBAAqB,EAAE,MAAM,eAAe,CAAA;AAC/G,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AACtD,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,UAAU,CAAA"}

package/lib/typescript/src/utils/mq.d.ts

@@ -1,15 +1,21 @@
+import type { MediaQuery, Nullable } from '../types';
 import type { UnistylesBreakpoints } from '../global';
-declare const MQSymbol: unique symbol;
+export declare const MQSymbol: unique symbol;
 type MQValue = keyof UnistylesBreakpoints | number;
+type MQHandler = {
+    w(wMin?: Nullable<MQValue>, wMax?: MQValue): WidthHandler;
+    width(wMin?: Nullable<MQValue>, wMax?: MQValue): WidthHandler;
+    h(hMin?: Nullable<MQValue>, hMax?: MQValue): HeightHandler;
+    height(hMin?: Nullable<MQValue>, hMax?: MQValue): HeightHandler;
+};
 type HeightHandler = {
-    width(wMin?: MQValue, wMax?: MQValue): typeof MQSymbol;
-} & typeof MQSymbol;
+    w(wMin?: Nullable<MQValue>, wMax?: MQValue): MediaQuery;
+    width(wMin?: Nullable<MQValue>, wMax?: MQValue): MediaQuery;
+} & MediaQuery;
 type WidthHandler = {
-    height(hMin?: MQValue, hMax?: MQValue): typeof MQSymbol;
-} & typeof MQSymbol;
-export declare const mq: {
-    height: (hMin?: MQValue, hMax?: MQValue) => HeightHandler;
-    width: (wMin?: MQValue, wMax?: MQValue) => WidthHandler;
-};
+    h(hMin?: Nullable<MQValue>, hMax?: MQValue): MediaQuery;
+    height(hMin?: Nullable<MQValue>, hMax?: MQValue): MediaQuery;
+} & MediaQuery;
+export declare const mq: MQHandler;
 export {};
 //# sourceMappingURL=mq.d.ts.map

package/lib/typescript/src/utils/mq.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mq.d.ts","sourceRoot":"","sources":["../../../../src/utils/mq.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAGrD,QAAA,MAAM,QAAQ,eAAyB,CAAA;AAEvC,KAAK,OAAO,GAAG,MAAM,oBAAoB,GAAG,MAAM,CAAA;AAElD,KAAK,aAAa,GAAG;IACjB,KAAK,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,QAAQ,CAAA;CACzD,GAAG,OAAO,QAAQ,CAAA;AAEnB,KAAK,YAAY,GAAG;IAChB,MAAM,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,OAAO,QAAQ,CAAA;CAC1D,GAAG,OAAO,QAAQ,CAAA;AAoBnB,eAAO,MAAM,EAAE;oBACI,OAAO,SAAY,OAAO;mBAqB3B,OAAO,SAAY,OAAO;CAqB3C,CAAA"}
+{"version":3,"file":"mq.d.ts","sourceRoot":"","sources":["../../../../src/utils/mq.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AACpD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAGrD,eAAO,MAAM,QAAQ,eAAyB,CAAA;AAE9C,KAAK,OAAO,GAAG,MAAM,oBAAoB,GAAG,MAAM,CAAA;AAElD,KAAK,SAAS,GAAG;IACb,CAAC,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,YAAY,CAAC;IAC1D,KAAK,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,YAAY,CAAC;IAC9D,CAAC,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,aAAa,CAAC;IAC3D,MAAM,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,aAAa,CAAA;CAClE,CAAA;AAED,KAAK,aAAa,GAAG;IACjB,CAAC,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IACxD,KAAK,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAA;CAC9D,GAAG,UAAU,CAAA;AAEd,KAAK,YAAY,GAAG;IAChB,CAAC,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC;IACxD,MAAM,CAAC,IAAI,CAAC,EAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,IAAI,CAAC,EAAE,OAAO,GAAG,UAAU,CAAA;CAC/D,GAAG,UAAU,CAAA;AAsEd,eAAO,MAAM,EAAE,WAYb,CAAA"}

package/lib/typescript/src/utils/mqParser.d.ts

@@ -0,0 +1,3 @@
+import type { NestedKeys, Optional, ScreenSize } from '../types';
+export declare const getKeyForUnistylesMediaQuery: (mediaQueries: NestedKeys, screenSize: ScreenSize) => Optional<string>;
+//# sourceMappingURL=mqParser.d.ts.map

package/lib/typescript/src/utils/mqParser.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mqParser.d.ts","sourceRoot":"","sources":["../../../../src/utils/mqParser.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAkFhE,eAAO,MAAM,4BAA4B,yCAA0C,UAAU,qBAgB5F,CAAA"}

package/lib/typescript/src/utils/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/utils/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAgB,UAAU,EAAE,MAAM,UAAU,CAAA;AAG3E,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAGrD,eAAO,MAAM,eAAe,OACpB,QAAQ,cAAc,MAAM,oBAAoB,GAAG,MAAM,cACjD,UAAU,KACvB,QAGD,CAAA;AAEF,eAAO,MAAM,eAAe,8BAA6B,OAMxD,CAAA;AAED,eAAO,MAAM,UAAU,+CAEP,MAAM,oBAAoB,GAAG,MAAM,cACnC,UAAU,MA6CzB,CAAA"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../src/utils/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAc,MAAM,UAAU,CAAA;AAGzE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AAGrD,eAAO,MAAM,eAAe,OACpB,QAAQ,cAAc,MAAM,oBAAoB,GAAG,MAAM,cACjD,UAAU,KACvB,QAGD,CAAA;AAEF,eAAO,MAAM,eAAe,8BAA6B,OAMxD,CAAA;AAED,eAAO,MAAM,UAAU,+CAEP,MAAM,oBAAoB,GAAG,MAAM,cACnC,UAAU,MA6CzB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-unistyles",
-  "version": "2.0.0-alpha.7",
+  "version": "2.0.0-alpha.8",
   "description": "Level up your React Native StyleSheet",
   "scripts": {
     "test": "jest",

package/src/common.ts

@@ -0,0 +1,18 @@
+export enum CxxUnistylesEventTypes {
+    Theme = 'theme',
+    Layout = 'layout'
+}
+
+export enum UnistylesError {
+    RuntimeUnavailable = 'UNISTYLES_ERROR_RUNTIME_UNAVAILABLE',
+    ThemeNotFound = 'UNISTYLES_ERROR_THEME_NOT_FOUND',
+    ThemeNotRegistered = 'UNISTYLES_ERROR_THEME_NOT_REGISTERED',
+    ThemesCannotBeEmpty = 'UNISTYLES_ERROR_THEMES_CANNOT_BE_EMPTY',
+    BreakpointsCannotBeEmpty = 'UNISTYLES_ERROR_BREAKPOINTS_CANNOT_BE_EMPTY',
+    BreakpointsMustStartFromZero = 'UNISTYLES_ERROR_BREAKPOINTS_MUST_START_FROM_ZERO',
+}
+
+export enum ScreenOrientation {
+    Portrait = 1,
+    Landscape = 2
+}

package/src/{UnistyleRegistry.ts → core/UnistyleRegistry.ts}

@@ -1,5 +1,5 @@
-import type { UnistylesBridge, UnistylesConfig } from './types'
-import type { UnistylesThemes, UnistylesBreakpoints } from './global'
+import type { UnistylesBridge, UnistylesConfig } from '../types'
+import type { UnistylesBreakpoints, UnistylesThemes } from '../global'
 
 export class UnistyleRegistry {
     public config: UnistylesConfig = {}

package/src/{Unistyles.ts → core/Unistyles.ts}

@@ -1,13 +1,11 @@
 import { UnistylesModule } from './UnistylesModule'
 import { UnistylesRuntime } from './UnistylesRuntime'
-import { UnistylesBuiltInEngine } from './UnistylesEngine'
 import { UnistyleRegistry } from './UnistyleRegistry'
-import type { UnistylesBridge } from './types'
-import { UnistylesError } from './types'
+import type { UnistylesBridge } from '../types'
+import { UnistylesError } from '../common'
 
 class Unistyles {
     private _runtime: UnistylesRuntime
-    private _engine: UnistylesBuiltInEngine
     private _registry: UnistyleRegistry
     private _bridge: UnistylesBridge
 
@@ -22,7 +20,6 @@ class Unistyles {
         this._bridge = global.__UNISTYLES__ as UnistylesBridge
         this._registry = new UnistyleRegistry(this._bridge)
         this._runtime = new UnistylesRuntime(this._bridge, this._registry)
-        this._engine = new UnistylesBuiltInEngine(this._registry, this._runtime)
     }
 
     public get registry() {
@@ -32,10 +29,6 @@ class Unistyles {
     public get runtime() {
         return this._runtime
     }
-
-    public get engine() {
-        return this._engine
-    }
 }
 
 export const unistyles = new Unistyles()

package/src/{UnistylesRuntime.ts → core/UnistylesRuntime.ts}

@@ -1,7 +1,7 @@
-import type { UnistylesBridge } from './types'
+import { ScreenOrientation, UnistylesError } from '../common'
+import type { UnistylesBridge } from '../types'
+import type { UnistylesThemes } from '../global'
 import type { UnistyleRegistry } from './UnistyleRegistry'
-import { ScreenOrientation, UnistylesError } from './types'
-import type { UnistylesThemes } from './global'
 
 export class UnistylesRuntime {
     constructor(private unistylesBridge: UnistylesBridge, private registry: UnistyleRegistry) {}

package/src/core/index.ts

@@ -0,0 +1 @@
+export { unistyles } from './Unistyles'

package/src/hooks/index.ts

@@ -1 +1,2 @@
-export { useDimensions } from './useDimensions'
+export { useInitialTheme } from './useInitialTheme'
+export { useUnistyles } from './useUnistyles'

package/src/{useInitialTheme.ts → hooks/useInitialTheme.ts}

@@ -1,6 +1,6 @@
 import { useMemo } from 'react'
-import { unistyles } from './Unistyles'
-import type { UnistylesThemes } from './global'
+import { unistyles } from '../core'
+import type { UnistylesThemes } from '../global'
 
 export const useInitialTheme = (forName: keyof UnistylesThemes) => {
     useMemo(() => unistyles.runtime.setTheme(forName), [])

package/src/hooks/useUnistyles.ts

@@ -0,0 +1,55 @@
+import { NativeEventEmitter, NativeModules } from 'react-native'
+import { useEffect, useState } from 'react'
+import { unistyles } from '../core'
+import { CxxUnistylesEventTypes } from '../common'
+import type { UnistylesEvents, UnistylesMobileLayoutEvent, UnistylesThemeEvent } from '../types'
+
+const unistylesEvents = new NativeEventEmitter(NativeModules.Unistyles)
+
+export const useUnistyles = () => {
+    const [theme, setTheme] = useState(unistyles.runtime.getTheme(unistyles.runtime.themeName))
+    const [layout, setLayout] = useState({
+        breakpoint: unistyles.runtime.breakpoint,
+        orientation: unistyles.runtime.orientation,
+        screenSize: {
+            width: unistyles.runtime.screen.width,
+            height: unistyles.runtime.screen.height
+        }
+    })
+
+    useEffect(() => {
+        const subscription = unistylesEvents.addListener(
+            'onChange',
+            (event: UnistylesEvents) => {
+                switch (event.type) {
+                    case CxxUnistylesEventTypes.Theme: {
+                        const themeEvent = event as UnistylesThemeEvent
+
+                        return setTheme(unistyles.runtime.getTheme(themeEvent.payload.themeName))
+                    }
+                    case CxxUnistylesEventTypes.Layout: {
+                        const layoutEvent = event as UnistylesMobileLayoutEvent
+
+                        return setLayout({
+                            breakpoint: layoutEvent.payload.breakpoint,
+                            orientation: layoutEvent.payload.orientation,
+                            screenSize: {
+                                width: layoutEvent.payload.screen.width,
+                                height: layoutEvent.payload.screen.height
+                            }
+                        })
+                    }
+                    default:
+                        return
+                }
+            }
+        )
+
+        return subscription.remove
+    }, [])
+
+    return {
+        theme,
+        layout
+    }
+}

package/src/index.ts

@@ -1,12 +1,10 @@
-import { unistyles } from './Unistyles'
+import { unistyles } from './core'
+import { mq } from './utils'
+import { useInitialTheme } from './hooks'
 import type { UnistylesThemes, UnistylesBreakpoints } from './global'
-import { ScreenOrientation } from './types'
-
-export { mq } from './utils'
-export { useInitialTheme } from './useInitialTheme'
-
-export { useStyles } from './useStyles'
-export { createStyleSheet } from './createStyleSheet'
+import { ScreenOrientation } from './common'
+import { useStyles } from './useStyles'
+import { createStyleSheet } from './createStyleSheet'
 
 const { addThemes, addBreakpoints, addConfig  } = unistyles.registry
 const UnistylesRuntime = unistyles.runtime
@@ -24,6 +22,10 @@ export {
 }
 
 export {
+    mq,
+    useInitialTheme,
+    useStyles,
+    createStyleSheet,
     ScreenOrientation
 }
 

package/src/types/breakpoints.ts

@@ -1,17 +1,10 @@
 import type { OpaqueColorValue } from 'react-native'
 import type { UnistylesBreakpoints } from '../global'
-import type { MediaQueries } from './mediaQueries'
-
-export type ScreenSize = {
-    width: number,
-    height: number
-}
-
-export type CreateStylesFactory<ST, Theme> = (theme: Theme) => ST
+import type { MediaQuery } from './mq'
 
 type WithEmptyObject<V> = keyof V extends never ? {} : V
 
-export type ExtractBreakpoints<T> = T extends Partial<Record<keyof UnistylesBreakpoints & string, infer V>>
+type ExtractBreakpoints<T> = T extends Partial<Record<keyof UnistylesBreakpoints & string, infer V>>
     ? WithEmptyObject<V>
     : T extends (...args: infer A) => infer R
         ? (...args: A) => ExtractBreakpoints<R>
@@ -23,12 +16,14 @@ export type ExtractBreakpoints<T> = T extends Partial<Record<keyof UnistylesBrea
                     : T[K]
         }
 
-export type RemoveKeysWithPrefix<T> = T extends (...args: Array<any>) => infer R
+type RemoveKeysWithPrefix<T> = T extends (...args: Array<any>) => infer R
     ? (...args: Parameters<T>) => RemoveKeysWithPrefix<R>
     : T extends object
         ? T extends OpaqueColorValue
             ? string
             : T extends Record<string, infer _V>
-                ? { [K in keyof T as K extends MediaQueries ? keyof UnistylesBreakpoints & string : K]: RemoveKeysWithPrefix<T[K]> }
+                ? { [K in keyof T as K extends MediaQuery ? keyof UnistylesBreakpoints & string : K]: RemoveKeysWithPrefix<T[K]> }
                 : { [K in keyof T]: RemoveKeysWithPrefix<T[K]> }
         : T
+
+export type ReactNativeStyleSheet<T> = ExtractBreakpoints<RemoveKeysWithPrefix<T>>

package/src/types/common.ts

@@ -0,0 +1,2 @@
+export type Optional<T> = T | undefined
+export type Nullable<T> = T | null

package/src/types/core.ts

@@ -14,14 +14,19 @@ import type {
     TranslateYTransform
 } from 'react-native/Libraries/StyleSheet/StyleSheetTypes'
 import type { ImageStyle, TextStyle, ViewStyle } from 'react-native'
-import type { MediaQueries } from './mediaQueries'
 import type { UnistylesBreakpoints, UnistylesThemes } from '../global'
+import type { MediaQuery } from './mq'
 
 type ShadowOffset = {
     width: number,
     height: number
 }
 
+export type ScreenSize = {
+    width: number,
+    height: number
+}
+
 type TransformStyles =
     & PerpectiveTransform
     & RotateTransform
@@ -44,9 +49,9 @@ type UnistyleNested = {
 }
 
 type UniStyle<V> = {
-    [innerKey in keyof UnistylesBreakpoints]: V
+    [innerKey in keyof UnistylesBreakpoints]?: V
 } | {
-    [innerKey in MediaQueries]: V
+    [innerKey in MediaQuery]: V
 }
 
 type DeepUniStyle<T> = {
@@ -72,5 +77,6 @@ export type CustomNamedStyles<T> = {
         : StaticStyles
 }
 
-export type NestedKeys = Array<[keyof UnistylesBreakpoints | MediaQueries, string | number | undefined]>
+export type NestedKeys = Array<[keyof UnistylesBreakpoints | MediaQuery, string | number | undefined]>
 export type UnistylesTheme = UnistylesThemes[keyof UnistylesThemes]
+export type CreateStylesFactory<ST, Theme> = (theme: Theme) => ST

package/src/types/index.ts

@@ -1,10 +1,6 @@
 export * from './normalizer'
-export * from './cxx'
-export type { CustomNamedStyles, NestedKeys, UnistylesTheme } from './core'
-export type { MediaQueries } from './mediaQueries'
-export type {
-    ScreenSize,
-    CreateStylesFactory,
-    ExtractBreakpoints,
-    RemoveKeysWithPrefix
-} from './breakpoints'
+export * from './unistyles'
+export type { Optional, Nullable } from './common'
+export type { MediaQuery } from './mq'
+export type { CustomNamedStyles, NestedKeys, UnistylesTheme, CreateStylesFactory, ScreenSize } from './core'
+export type { ReactNativeStyleSheet } from './breakpoints'

package/src/types/mq.ts

@@ -0,0 +1,3 @@
+import { MQSymbol } from '../utils'
+
+export type MediaQuery = typeof MQSymbol

package/src/types/{cxx.ts → unistyles.ts}

@@ -1,20 +1,14 @@
+import { CxxUnistylesEventTypes, ScreenOrientation } from '../common'
 import type { UnistylesThemes, UnistylesBreakpoints } from '../global'
-import type { ScreenSize } from './breakpoints'
-import type { NestedKeys } from './core'
+import type { NestedKeys, ScreenSize } from './core'
+import type { Optional } from './common'
 
-export type Optional<T> = T | undefined
-export type Nullable<T> = T | null
 export type ColorSchemeName = Optional<'light' | 'dark'>
 
 export type UnistylesConfig = {
     adaptiveThemes?: boolean
 }
 
-export enum ScreenOrientation {
-    Portrait = 1,
-    Landscape = 2
-}
-
 export type UnistylesBridge = {
     // getters
     screenWidth: number,
@@ -35,11 +29,6 @@ export type UnistylesBridge = {
     unregister(): void
 }
 
-export enum CxxUnistylesEventTypes {
-    Theme = 'theme',
-    Layout = 'layout'
-}
-
 export type UnistylesThemeEvent = {
     type: CxxUnistylesEventTypes.Theme,
     payload: {
@@ -58,16 +47,6 @@ export type UnistylesMobileLayoutEvent = {
 
 export type UnistylesEvents = UnistylesThemeEvent | UnistylesMobileLayoutEvent
 
-export enum UnistylesError {
-    RuntimeUnavailable = 'UNISTYLES_ERROR_RUNTIME_UNAVAILABLE',
-    ThemeNotFound = 'UNISTYLES_ERROR_THEME_NOT_FOUND',
-    ThemeNotRegistered = 'UNISTYLES_ERROR_THEME_NOT_REGISTERED',
-    ThemesCannotBeEmpty = 'UNISTYLES_ERROR_THEMES_CANNOT_BE_EMPTY',
-    BreakpointsCannotBeEmpty = 'UNISTYLES_ERROR_BREAKPOINTS_CANNOT_BE_EMPTY',
-    BreakpointsMustStartFromZero = 'UNISTYLES_ERROR_BREAKPOINTS_MUST_START_FROM_ZERO',
-}
-
 export interface UnistylesEngine {
-    isMediaQuery(key: string): boolean,
     didMatchMediaQuery(keys: NestedKeys): Optional<string>,
 }

package/src/useStyles.ts

@@ -1,18 +1,25 @@
 import { useMemo } from 'react'
 import { StyleSheet } from 'react-native'
 import { parseStyle, proxifyFunction } from './utils'
-import type { CreateStylesFactory, CustomNamedStyles, ExtractBreakpoints, RemoveKeysWithPrefix } from './types'
-import { useUnistyles } from './useUnistyles'
-import type { UnistylesTheme } from './types'
+import type { CreateStylesFactory, CustomNamedStyles, ReactNativeStyleSheet, UnistylesTheme } from './types'
+import { useUnistyles } from './hooks'
+import type { UnistylesBreakpoints } from './global'
 
-export const useStyles = <ST extends CustomNamedStyles<ST>>(stylesheet?: ST | CreateStylesFactory<ST, UnistylesTheme>) => {
-    const { theme, breakpoint, screenSize } = useUnistyles()
+type ParsedStylesheet<ST extends CustomNamedStyles<ST>> = {
+    theme: UnistylesTheme,
+    breakpoint: keyof UnistylesBreakpoints,
+    styles: ReactNativeStyleSheet<ST>
+}
+
+export const useStyles = <ST extends CustomNamedStyles<ST>>(stylesheet?: ST | CreateStylesFactory<ST, UnistylesTheme>): ParsedStylesheet<ST> => {
+    const { theme, layout } = useUnistyles()
+    const { screenSize, breakpoint } = layout
 
     if (!stylesheet) {
         return {
             theme,
             breakpoint,
-            styles: {} as ExtractBreakpoints<RemoveKeysWithPrefix<ST>>
+            styles: {} as ReactNativeStyleSheet<ST>
         }
     }
 
@@ -36,11 +43,11 @@ export const useStyles = <ST extends CustomNamedStyles<ST>>(stylesheet?: ST | Cr
                 ...acc,
                 [key]: parseStyle<ST>(style, breakpoint, screenSize)
             })
-        }, {} as ST), [breakpoint, screenSize, parsedStyles])
+        }, {} as ST), [breakpoint, screenSize, parsedStyles]) as ReactNativeStyleSheet<ST>
 
     return {
         theme,
         breakpoint,
-        styles: dynamicStyleSheet as ExtractBreakpoints<RemoveKeysWithPrefix<ST>>
+        styles: dynamicStyleSheet
     }
 }

package/src/utils/breakpoints.ts

@@ -1,8 +1,9 @@
-import { unistyles } from '../Unistyles'
+import { unistyles } from '../core'
 import { isMobile, Orientation, throwError } from './common'
-import type { MediaQueries } from '../types'
-import { ScreenOrientation } from '../types'
+import type { MediaQuery, NestedKeys } from '../types'
 import type { UnistylesBreakpoints } from '../global'
+import { ScreenOrientation } from '../common'
+import { getKeyForUnistylesMediaQuery } from './mqParser'
 
 export const sortAndValidateBreakpoints = (breakpoints: UnistylesBreakpoints): UnistylesBreakpoints => {
     const sortedPairs = Object
@@ -45,15 +46,14 @@ export const getBreakpointFromScreenWidth = (width: number, breakpointEntries: A
     return key
 }
 
-export const getValueForBreakpoint = (value: Record<keyof UnistylesBreakpoints | MediaQueries, string | number | undefined>): string | number | undefined => {
+export const getValueForBreakpoint = (value: Record<keyof UnistylesBreakpoints | MediaQuery, string | number | undefined>): string | number | undefined => {
     // the highest priority is for custom media queries
-    const customMediaQueries = Object
-        .entries(value)
-        .filter(([key]) => unistyles.engine.isMediaQuery(key)) as Array<[keyof UnistylesBreakpoints | MediaQueries, string | number | undefined]>
-    // const customMediaQueryKey = getKeyForCustomMediaQuery(customMediaQueries, screenSize) as keyof typeof value
-    const customMediaQueryKey = unistyles.engine.didMatchMediaQuery(customMediaQueries) as keyof typeof value
+    const customMediaQueryKey = getKeyForUnistylesMediaQuery(
+        Object.entries(value) as NestedKeys,
+        unistyles.runtime.screen
+    ) as keyof typeof value
 
-    if (customMediaQueryKey && customMediaQueryKey in value) {
+    if (customMediaQueryKey) {
         return value[customMediaQueryKey]
     }
 
@@ -61,8 +61,8 @@ export const getValueForBreakpoint = (value: Record<keyof UnistylesBreakpoints |
     // check if user defined any breakpoints
     const hasBreakpoints = unistyles.runtime.sortedBreakpoints.length > 0
 
-    // if not then we can fallback to horizontal and portrait (mobile only)
-    if (!hasBreakpoints && isMobile && (Orientation.Landscape in  value || Orientation.Portrait in value)) {
+    // if not then we can fall back to horizontal and portrait (mobile only)
+    if (!hasBreakpoints && isMobile && (Orientation.Landscape in value || Orientation.Portrait in value)) {
         return value[
             unistyles.runtime.orientation === ScreenOrientation.Portrait
                 ? Orientation.Portrait
@@ -70,6 +70,7 @@ export const getValueForBreakpoint = (value: Record<keyof UnistylesBreakpoints |
         ]
     }
 
+    // let's get the current breakpoint
     const breakpoint = unistyles.runtime.breakpoint
 
     if (!breakpoint) {

package/src/utils/index.ts

@@ -1,14 +1,7 @@
 export { normalizeStyles } from './normalizeStyles'
 export * from './normalizer'
-export { mq } from './mq'
+export { mq, MQSymbol } from './mq'
+export { getKeyForUnistylesMediaQuery } from './mqParser'
 export { getBreakpointFromScreenWidth, sortAndValidateBreakpoints, getValueForBreakpoint } from './breakpoints'
 export { proxifyFunction, parseStyle } from './styles'
 export { isServer, Orientation } from './common'
-export {
-    extractValues,
-    getKeyForCustomMediaQuery,
-    isMediaQuery,
-    isWithinTheHeight,
-    isWithinTheWidth,
-    isWithinTheWidthAndHeight
-} from './mediaQueries'