react-native-unistyles 2.10.0 → 3.0.0-alpha.10

package/src/index.ts

@@ -1,56 +1,15 @@
-import { unistyles } from './core'
-import { mq } from './utils'
-import { useInitialTheme } from './hooks'
-import type { UnistylesPlugin, UnistylesValues, UnistyleText, UnistyleView, UnistyleImage, ExtractVariantNames, UnistylesTheme } from './types'
-import type { UnistylesThemes, UnistylesBreakpoints } from './global'
-import { ScreenOrientation, AndroidContentSizeCategory, IOSContentSizeCategory } from './common'
-import { useStyles } from './useStyles'
-import { createStyleSheet } from './createStyleSheet'
+import React from 'react'
 
-/**
- * Utility to interact with the Unistyles
- * (should be called only once)
- */
-const UnistylesRegistry = {
-    /**
-     * Register themes to be used in the app
-     * @param themes - Key value pair of themes
-     */
-    addThemes: unistyles.registry.addThemes,
-    /**
-     * Register breakpoints to be used in the app
-     * @param breakpoints - Key value pair of breakpoints
-     */
-    addBreakpoints: unistyles.registry.addBreakpoints,
-    /**
-     * Register additional config to customize the Unistyles
-     * @param config - Key value pair of config
-     */
-    addConfig: unistyles.registry.addConfig
-}
-
-const UnistylesRuntime = unistyles.runtime
+export * from './specs'
+export { mq } from './mq'
+export type { UnistylesThemes, UnistylesBreakpoints } from './global'
 
-export {
-    mq,
-    useStyles,
-    useInitialTheme,
-    createStyleSheet,
-    ScreenOrientation,
-    AndroidContentSizeCategory,
-    IOSContentSizeCategory,
-    UnistylesRegistry,
-    UnistylesRuntime
-}
+// todo verify true min version
+const minReactVersionRequiredByUnistyles = '18.3.1'
 
-export type {
-    UnistylesTheme,
-    UnistylesThemes,
-    UnistylesBreakpoints,
-    UnistylesPlugin,
-    UnistylesValues,
-    UnistyleText,
-    UnistyleView,
-    UnistyleImage,
-    ExtractVariantNames as UnistylesVariants
+if (React.version < minReactVersionRequiredByUnistyles) {
+    throw new Error(`
+        You are using an outdated version of React (${React.version}).
+        Unistyles requires at least React ${minReactVersionRequiredByUnistyles}.
+    `)
 }

package/src/{utils/mq.ts → mq.ts}

@@ -1,6 +1,5 @@
-import type { Nullable } from '../types'
-import type { UnistylesBreakpoints } from '../global'
-import { unistyles } from '../core'
+import type { Nullable } from './types'
+import type { UnistylesBreakpoints } from './global'
 
 type MQValue = keyof UnistylesBreakpoints | number
 
@@ -30,7 +29,17 @@ const getMQValue = (value: Nullable<MQValue>) => {
         return 0
     }
 
-    return unistyles.registry.breakpoints[value] ?? 0
+    // todo take it from js
+    const breakpoints = {
+        xs: 0,
+        sm: 300,
+        md: 500,
+        lg: 800,
+        xl: 1200
+    }
+
+    // @ts-ignore
+    return breakpoints[value] ?? 0
 }
 
 /**

package/src/specs/NativePlatform/NativePlatform.nitro.ts

@@ -0,0 +1,61 @@
+import type { HybridObject } from 'react-native-nitro-modules'
+import { type Dimensions, type Insets } from '../types'
+
+type ColorScheme = 'dark' | 'light' | 'unspecified'
+type Orientation = 'portrait' | 'landscape'
+
+export enum UnistyleDependency {
+    Theme = 0,
+    ThemeName = 1,
+    AdaptiveThemes = 2,
+    Breakpoints = 3,
+    Variants = 4,
+    ColorScheme = 5,
+    Dimensions = 6,
+    Orientation = 7,
+    ContentSizeCategory = 8,
+    Insets = 9,
+    PixelRatio = 10,
+    FontScale = 11,
+    StatusBar = 12,
+    NavigationBar = 13
+}
+
+export interface UnistylesNativeMiniRuntime {
+    readonly colorScheme: ColorScheme,
+    readonly screen: Dimensions,
+    readonly contentSizeCategory: string,
+    readonly insets: Insets,
+    readonly pixelRatio: number,
+    readonly fontScale: number,
+    readonly rtl: boolean
+    readonly statusBar: Dimensions,
+    readonly navigationBar: Dimensions
+    readonly orientation: Orientation
+}
+
+// represents any native API that can communicate with Unistyles
+// not available from JS
+export interface NativePlatform extends HybridObject<{ ios: 'swift', android: 'kotlin' }> {
+    getInsets(): Insets,
+    getColorScheme(): ColorScheme,
+    getFontScale(): number,
+    getPixelRatio(): number,
+    getOrientation(): Orientation,
+    getContentSizeCategory(): string,
+    getScreenDimensions(): Dimensions,
+    getStatusBarDimensions(): Dimensions,
+    getNavigationBarDimensions(): Dimensions,
+    getPrefersRtlDirection(): boolean,
+
+    setRootViewBackgroundColor(color: number): void,
+    setNavigationBarBackgroundColor?(color: number): void,
+    setNavigationBarHidden?(isHidden: boolean): void,
+    setStatusBarHidden(isHidden: boolean): void,
+    setStatusBarBackgroundColor?(color: number): void,
+    setImmersiveMode(isEnabled: boolean): void,
+
+    // private
+    getMiniRuntime(): UnistylesNativeMiniRuntime,
+    registerPlatformListener(callback: (dependencies: Array<UnistyleDependency>) => void): void
+}

package/src/specs/NativePlatform/index.ts

@@ -0,0 +1,2 @@
+export type { NativePlatform, UnistylesNativeMiniRuntime } from './NativePlatform.nitro'
+export { UnistyleDependency } from './NativePlatform.nitro'

package/src/specs/NavigtionBar/UnistylesNavigationBar.nitro.ts

@@ -0,0 +1,10 @@
+import type { HybridObject } from 'react-native-nitro-modules'
+
+// created from UnistylesRuntime, do not use it directly
+export interface UnistylesNavigationBar extends HybridObject<{ ios: 'c++', android: 'c++' }> {
+    readonly width: number,
+    readonly height: number,
+
+    setBackgroundColor(color: number): void,
+    setHidden(isHidden: boolean): void
+}

package/src/specs/NavigtionBar/index.ts

@@ -0,0 +1,25 @@
+import { processColor } from 'react-native'
+import type { UnistylesNavigationBar as UnistylesNavigationBarSpec } from './UnistylesNavigationBar.nitro'
+import type { Color } from '../types'
+
+interface PrivateUnistylesNavigationBar extends Omit<UnistylesNavigationBarSpec, 'setBackgroundColor'> {
+    setBackgroundColor(color?: string): void,
+    _setBackgroundColor(color?: Color): void
+}
+
+export const attachNavigationBarJSMethods = (hybridObject: UnistylesNavigationBar) => {
+    const privateHybrid = hybridObject as PrivateUnistylesNavigationBar
+
+    privateHybrid._setBackgroundColor = hybridObject.setBackgroundColor
+    hybridObject.setBackgroundColor = (color?: string) => {
+        const parsedColor = processColor(color) ?? 0
+
+        privateHybrid._setBackgroundColor(parsedColor as number)
+    }
+}
+
+type PrivateMethods =
+    | '_setBackgroundColor'
+    | 'dispose'
+
+export type UnistylesNavigationBar = Omit<PrivateUnistylesNavigationBar, PrivateMethods>

package/src/specs/ShadowRegistry/ShadowRegistry.nitro.ts

@@ -0,0 +1,3 @@
+import type { HybridObject } from 'react-native-nitro-modules'
+
+export interface UnistylesShadowRegistry extends HybridObject<{ ios: 'c++', android: 'c++' }> {}

package/src/specs/ShadowRegistry/index.ts

@@ -0,0 +1,51 @@
+import { NitroModules } from 'react-native-nitro-modules'
+import type { UnistylesShadowRegistry as UnistylesShadowRegistrySpec } from './ShadowRegistry.nitro'
+import type { ShadowNode, Unistyle, ViewHandle } from './types'
+
+interface ShadowRegistry extends UnistylesShadowRegistrySpec {
+    // Babel API
+    add(handle?: ViewHandle, style?: Unistyle, variants?: Record<string, string | boolean>, args?: Array<any>): void,
+    remove(handle?: ViewHandle, style?: Unistyle): void,
+    // JSI
+    link(node: ShadowNode, style: Unistyle, variants?: Record<string, string | boolean>, args?: Array<any>): void,
+    unlink(node: ShadowNode, style: Unistyle): void
+}
+
+const HybridShadowRegistry = NitroModules.createHybridObject<ShadowRegistry>('UnistylesShadowRegistry')
+
+const findShadowNodeForHandle = (handle: ViewHandle) => {
+    const node = handle?.__internalInstanceHandle?.stateNode?.node
+        ?? handle?.getScrollResponder?.()?.getNativeScrollRef?.()?.__internalInstanceHandle?.stateNode?.node
+        ?? handle?.getNativeScrollRef?.()?.__internalInstanceHandle?.stateNode?.node
+
+    if (!node) {
+        // todo extend log with file name / component name
+        throw new Error('Could not find shadow node for one of your components')
+    }
+
+    return node
+}
+
+HybridShadowRegistry.add = (handle, style, variants, args) => {
+    if (!handle || !style?.__unid) {
+        return
+    }
+
+    HybridShadowRegistry.link(findShadowNodeForHandle(handle), style, variants ?? {}, args ?? [])
+}
+
+HybridShadowRegistry.remove = (handle, style) => {
+    if (!handle || !style?.__unid) {
+        return
+    }
+
+    HybridShadowRegistry.unlink(findShadowNodeForHandle(handle), style)
+}
+
+type PrivateMethods =
+    | 'add'
+    | 'remove'
+    | 'link'
+    | 'unlink'
+
+export const UnistylesShadowRegistry = HybridShadowRegistry as Omit<ShadowRegistry, PrivateMethods>

package/src/specs/ShadowRegistry/types.ts

@@ -0,0 +1,29 @@
+export type StateNode = {
+    node?: ShadowNode
+}
+
+export type ShadowNode = {
+    __hostObjectShadowNodeWrapper: any
+}
+
+export type ViewHandle = {
+    __internalInstanceHandle?: {
+        stateNode?: StateNode
+    },
+    getScrollResponder?: () => {
+        getNativeScrollRef?: () => ({
+            __internalInstanceHandle?: {
+                stateNode?: StateNode
+            }
+        })
+    },
+    getNativeScrollRef?: () => ({
+        __internalInstanceHandle?: {
+            stateNode?: StateNode
+        }
+    })
+}
+
+export type Unistyle = {
+    __unid?: number
+}

package/src/specs/StatusBar/UnistylesStatusBar.nitro.ts

@@ -0,0 +1,10 @@
+import type { HybridObject } from 'react-native-nitro-modules'
+
+// created from UnistylesRuntime, do not use it directly
+export interface UnistylesStatusBar extends HybridObject<{ ios: 'c++', android: 'c++' }> {
+    readonly width: number,
+    readonly height: number,
+
+    setBackgroundColor(color: number): void,
+    setHidden(isHidden: boolean): void,
+}

package/src/specs/StatusBar/index.ts

@@ -0,0 +1,48 @@
+import { processColor, StatusBar as NativeStatusBar } from 'react-native'
+import type { UnistylesStatusBar as UnistylesStatusBarSpec } from './UnistylesStatusBar.nitro'
+import { type Color, StatusBarStyle } from '../types'
+
+export type StatusBarHiddenAnimation = 'none' | 'fade' | 'slide'
+
+interface PrivateUnistylesStatusBar extends Omit<UnistylesStatusBarSpec, 'setBackgroundColor' | 'setHidden'> {
+    setStyle(style: StatusBarStyle, animated?: boolean): void,
+    setHidden(isHidden: boolean, animation?: StatusBarHiddenAnimation): void,
+    _setHidden(isHidden: boolean, animation?: StatusBarHiddenAnimation): void,
+    setBackgroundColor(color?: string): void,
+    _setBackgroundColor(color?: Color): void
+}
+
+export const attachStatusBarJSMethods = (hybridObject: UnistylesStatusBar) => {
+    hybridObject.setStyle = (style: StatusBarStyle, animated?: boolean) => {
+        switch (style) {
+            case StatusBarStyle.Light:
+                return NativeStatusBar.setBarStyle('light-content', animated)
+            case StatusBarStyle.Dark:
+                return NativeStatusBar.setBarStyle('dark-content', animated)
+            case StatusBarStyle.Default:
+                return NativeStatusBar.setBarStyle('default', animated)
+        }
+    }
+
+    const privateHybrid = hybridObject as PrivateUnistylesStatusBar
+
+    privateHybrid._setHidden = hybridObject.setHidden
+    hybridObject.setHidden = (isHidden: boolean, animation?: StatusBarHiddenAnimation) => {
+        NativeStatusBar.setHidden(isHidden, animation)
+        privateHybrid._setHidden(isHidden)
+    }
+
+    privateHybrid._setBackgroundColor = hybridObject.setBackgroundColor
+    hybridObject.setBackgroundColor = (color?: string) => {
+        const parsedColor = processColor(color) ?? 0
+
+        privateHybrid._setBackgroundColor(parsedColor as number)
+    }
+}
+
+type PrivateMethods =
+    | '_setBackgroundColor'
+    | '_setHidden'
+    | 'dispose'
+
+export type UnistylesStatusBar = Omit<PrivateUnistylesStatusBar, PrivateMethods>

package/src/specs/StyleSheet/UnistylesStyleSheet.nitro.ts

@@ -0,0 +1,6 @@
+import type { HybridObject } from 'react-native-nitro-modules'
+
+export interface UnistylesStyleSheet extends HybridObject<{ ios: 'c++', android: 'c++' }> {
+    readonly hairlineWidth: number
+    readonly __unid: number
+}

package/src/specs/StyleSheet/index.ts

@@ -0,0 +1,46 @@
+import { NitroModules } from 'react-native-nitro-modules'
+import { processColor, StyleSheet as NativeStyleSheet } from 'react-native'
+import type { StyleSheet as NativeStyleSheetType } from 'react-native'
+import type { UnistylesStyleSheet as UnistylesStyleSheetSpec } from './UnistylesStyleSheet.nitro'
+import type { UnistylesBreakpoints, UnistylesThemes } from '../../global'
+import type { CreateUnistylesStyleSheet } from '../../types'
+
+type UnistylesSettings = {
+    adaptiveThemes?: boolean,
+    initialTheme?: (() => keyof UnistylesThemes) | keyof UnistylesThemes
+}
+
+export type UnistylesConfig = {
+    settings?: UnistylesSettings,
+    themes?: UnistylesThemes,
+    breakpoints?: UnistylesBreakpoints
+}
+
+export interface UnistylesStyleSheet extends UnistylesStyleSheetSpec {
+    absoluteFillObject: typeof NativeStyleSheetType.absoluteFillObject,
+    absoluteFill: typeof NativeStyleSheetType.absoluteFill,
+    compose: typeof NativeStyleSheetType.compose,
+    flatten: typeof NativeStyleSheetType.flatten,
+
+    // overridden methods
+    create: CreateUnistylesStyleSheet,
+    configure(config: UnistylesConfig): void,
+    jsMethods: {
+        processColor: typeof processColor
+    }
+}
+
+const HybridUnistylesStyleSheet = NitroModules
+    .createHybridObject<UnistylesStyleSheet>('UnistylesStyleSheet')
+
+HybridUnistylesStyleSheet.absoluteFillObject = NativeStyleSheet.absoluteFillObject
+HybridUnistylesStyleSheet.absoluteFill = NativeStyleSheet.absoluteFill
+HybridUnistylesStyleSheet.flatten = NativeStyleSheet.flatten
+HybridUnistylesStyleSheet.compose = NativeStyleSheet.compose
+HybridUnistylesStyleSheet.jsMethods = {
+    processColor
+}
+
+type PrivateMethods = 'jsMethods'
+
+export const StyleSheet = HybridUnistylesStyleSheet as Omit<UnistylesStyleSheet, PrivateMethods>

package/src/specs/TurboUnistyles/NativeTurboUnistyles.ts

@@ -0,0 +1,8 @@
+import type { TurboModule } from 'react-native'
+import { TurboModuleRegistry } from 'react-native'
+
+// this is empty spec for TurboModule that is required to hook
+// Unistyles to Fabric
+interface Spec extends TurboModule {}
+
+TurboModuleRegistry.get<Spec>('Unistyles')

package/src/specs/TurboUnistyles/index.ts

@@ -0,0 +1 @@
+import './NativeTurboUnistyles'

package/src/specs/UnistylesRuntime/UnistylesRuntime.nitro.ts

@@ -0,0 +1,47 @@
+import type { HybridObject } from 'react-native-nitro-modules'
+import type { AppBreakpoint, AppThemeName, Dimensions, Insets } from '../types'
+import type { AndroidContentSizeCategory, IOSContentSizeCategory, WebContentSizeCategory } from '../../types'
+import type { UnistylesNativeMiniRuntime } from '../NativePlatform'
+
+type ColorScheme = 'light' | 'dark' | 'unspecified'
+type Orientation = 'portrait' | 'landscape'
+
+// used for Nitro. It's Native + Cxx types
+export interface UnistylesCxxMiniRuntime extends UnistylesNativeMiniRuntime {
+    readonly themeName?: string,
+    readonly breakpoint?: string,
+    readonly orientation: Orientation,
+    readonly hasAdaptiveThemes: boolean,
+}
+
+// used for TS types
+export interface UnistylesMiniRuntime extends UnistylesCxxMiniRuntime {
+    readonly colorScheme: ColorScheme,
+    readonly contentSizeCategory: IOSContentSizeCategory | AndroidContentSizeCategory | WebContentSizeCategory,
+
+    // additional metadata
+    readonly themeName?: AppThemeName,
+    readonly breakpoint?: AppBreakpoint
+}
+
+export interface UnistylesRuntime extends HybridObject<{ ios: 'c++', android: 'c++' }> {
+    readonly colorScheme: ColorScheme,
+    readonly hasAdaptiveThemes: boolean,
+    readonly screen: Dimensions,
+    readonly themeName?: string,
+    readonly contentSizeCategory: string,
+    readonly breakpoint?: string,
+    readonly insets: Insets,
+    readonly orientation: Orientation,
+    readonly pixelRatio: number,
+    readonly fontScale: number,
+    readonly rtl: boolean,
+
+    setTheme(themeName: string): void,
+    setAdaptiveThemes(isEnabled: boolean): void,
+    setImmersiveMode(isEnabled: boolean): void,
+    setRootViewBackgroundColor(color: number): void
+
+    // private
+    readonly miniRuntime: UnistylesCxxMiniRuntime
+}

package/src/specs/UnistylesRuntime/index.ts

@@ -0,0 +1,64 @@
+import { processColor } from 'react-native'
+import { NitroModules } from 'react-native-nitro-modules'
+import type { UnistylesRuntime as UnistylesRuntimeSpec, UnistylesMiniRuntime } from './UnistylesRuntime.nitro'
+import type { AppBreakpoint, AppTheme, AppThemeName, Color, ColorScheme, Orientation } from '../types'
+import { attachStatusBarJSMethods, type UnistylesStatusBar } from '../StatusBar'
+import { attachNavigationBarJSMethods, type UnistylesNavigationBar } from '../NavigtionBar'
+import type { AndroidContentSizeCategory, IOSContentSizeCategory } from '../../types'
+import { isIOS } from '../../common'
+
+export interface UnistylesRuntimePrivate extends Omit<UnistylesRuntimeSpec, 'setRootViewBackgroundColor'> {
+    readonly colorScheme: ColorScheme,
+    readonly themeName?: AppThemeName,
+    readonly contentSizeCategory: IOSContentSizeCategory | AndroidContentSizeCategory,
+    readonly breakpoint?: AppBreakpoint,
+    readonly orientation: Orientation,
+
+    // other HybridObjects
+    statusBar: UnistylesStatusBar,
+    navigationBar: UnistylesNavigationBar,
+
+    setTheme(themeName: AppThemeName): void
+    updateTheme(themeName: AppThemeName, updater: (currentTheme: AppTheme) => AppTheme): void,
+    setRootViewBackgroundColor(color?: string): void,
+    _setRootViewBackgroundColor(color?: Color): void
+
+    // constructors
+    createHybridStatusBar(): UnistylesStatusBar,
+    createHybridNavigationBar(): UnistylesNavigationBar
+}
+
+type PrivateMethods =
+    |'createHybridStatusBar'
+    | 'createHybridNavigationBar'
+    | 'dispose'
+    | 'miniRuntime'
+    | '_setRootViewBackgroundColor'
+
+type UnistylesRuntime = Omit<UnistylesRuntimePrivate, PrivateMethods>
+
+const HybridUnistylesRuntime = NitroModules
+    .createHybridObject<UnistylesRuntimePrivate>('UnistylesRuntime')
+
+HybridUnistylesRuntime.statusBar = HybridUnistylesRuntime.createHybridStatusBar()
+HybridUnistylesRuntime.navigationBar = HybridUnistylesRuntime.createHybridNavigationBar()
+HybridUnistylesRuntime._setRootViewBackgroundColor = HybridUnistylesRuntime.setRootViewBackgroundColor
+
+HybridUnistylesRuntime.setRootViewBackgroundColor = (color?: string) => {
+    const parsedColor = processColor(color) ?? 0
+
+    HybridUnistylesRuntime._setRootViewBackgroundColor(parsedColor as number)
+}
+
+if (isIOS) {
+    HybridUnistylesRuntime.setImmersiveMode = (isEnabled: boolean) => HybridUnistylesRuntime.statusBar.setHidden(isEnabled, 'fade')
+}
+
+attachStatusBarJSMethods(HybridUnistylesRuntime.statusBar)
+attachNavigationBarJSMethods(HybridUnistylesRuntime.navigationBar)
+
+export const Runtime = HybridUnistylesRuntime as UnistylesRuntime
+
+export type {
+    UnistylesMiniRuntime
+}

package/src/specs/index.ts

@@ -0,0 +1,23 @@
+import './TurboUnistyles'
+
+import { Runtime } from './UnistylesRuntime'
+import { StyleSheet } from './StyleSheet'
+import { UnistylesShadowRegistry } from './ShadowRegistry'
+import type { UnistylesMiniRuntime } from './UnistylesRuntime'
+import { StatusBarStyle, ColorScheme, Orientation } from './types'
+
+export {
+    StatusBarStyle,
+    ColorScheme,
+    Orientation
+}
+
+export {
+    UnistylesShadowRegistry,
+    Runtime as UnistylesRuntime,
+    StyleSheet,
+}
+
+export type {
+    UnistylesMiniRuntime
+}

package/src/specs/index.web.ts

@@ -0,0 +1,5 @@
+import type { ReactElement } from 'react'
+
+export const getSSRUnistyles = () => [] as Array<ReactElement>
+
+export * from '../web'

package/src/specs/types.ts

@@ -0,0 +1,38 @@
+import type { ColorValue } from 'react-native'
+import type { UnistylesBreakpoints, UnistylesThemes } from '../global'
+
+export enum ColorScheme {
+    Light = 'light',
+    Dark = 'dark',
+    Unspecified = 'unspecified'
+}
+
+export enum Orientation {
+    Portrait = 'portrait',
+    Landscape = 'landscape'
+}
+
+export interface Dimensions {
+    readonly width: number,
+    readonly height: number
+}
+
+export interface Insets {
+    readonly top: number,
+    readonly bottom: number,
+    readonly left: number,
+    readonly right: number,
+    readonly ime: number
+}
+
+export enum StatusBarStyle {
+    Default = 'default',
+    Light = 'light',
+    Dark = 'dark'
+}
+
+export type AppThemeName = keyof UnistylesThemes
+export type AppBreakpoint = keyof UnistylesBreakpoints
+export type AppTheme = UnistylesThemes[AppThemeName]
+
+export type Color = ColorValue | number

package/src/types/accessibility.ts

@@ -0,0 +1,29 @@
+export enum IOSContentSizeCategory {
+    AccessibilityExtraExtraExtraLarge = 'accessibilityExtraExtraExtraLarge',
+    AccessibilityExtraExtraLarge = 'accessibilityExtraExtraLarge',
+    AccessibilityExtraLarge = 'accessibilityExtraLarge',
+    AccessibilityLarge = 'accessibilityLarge',
+    AccessibilityMedium = 'accessibilityMedium',
+    ExtraExtraExtraLarge = 'xxxLarge',
+    ExtraExtraLarge = 'xxLarge',
+    ExtraLarge = 'xLarge',
+    Large = 'Large',
+    Medium = 'Medium',
+    Small = 'Small',
+    ExtraSmall = 'xSmall',
+    Unspecified = 'unspecified'
+}
+
+export enum AndroidContentSizeCategory {
+    Small = 'Small',
+    Default = 'Default',
+    Large = 'Large',
+    ExtraLarge = 'ExtraLarge',
+    Huge = 'Huge',
+    ExtraHuge = 'ExtraHuge',
+    ExtraExtraHuge = 'ExtraExtraHuge'
+}
+
+export enum WebContentSizeCategory {
+    Unspecified = 'web-unspecified',
+}