react-native-unistyles 3.0.0-alpha.9 → 3.0.0-beta.1

package/lib/typescript/src/web/convert/boxShadow.d.ts

@@ -1,3 +0,0 @@
-import type { NestedCSSProperties } from 'typestyle/lib/types';
-export declare const getBoxShadowStyle: (styles: Record<string, any>) => NestedCSSProperties;
-//# sourceMappingURL=boxShadow.d.ts.map

package/lib/typescript/src/web/convert/boxShadow.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"boxShadow.d.ts","sourceRoot":"","sources":["../../../../../src/web/convert/boxShadow.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAkB9D,eAAO,MAAM,iBAAiB,WAAY,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAG,mBAoD/D,CAAA"}

package/lib/typescript/src/web/convert/breakpoint.d.ts

@@ -1,3 +0,0 @@
-import type { MediaQuery } from 'typestyle/lib/types';
-export declare const convertBreakpoint: (breakpoint: string) => MediaQuery;
-//# sourceMappingURL=breakpoint.d.ts.map

package/lib/typescript/src/web/convert/breakpoint.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"breakpoint.d.ts","sourceRoot":"","sources":["../../../../../src/web/convert/breakpoint.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAMrD,eAAO,MAAM,iBAAiB,eAAgB,MAAM,KAAG,UActD,CAAA"}

package/lib/typescript/src/web/convert/shadow.d.ts

@@ -1,2 +0,0 @@
-export declare const validateShadow: (shadowProperties: ReadonlyArray<string>, styles: Record<string, any>, breakpoints: Set<string>) => void;
-//# sourceMappingURL=shadow.d.ts.map

package/lib/typescript/src/web/convert/shadow.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"shadow.d.ts","sourceRoot":"","sources":["../../../../../src/web/convert/shadow.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,cAAc,qBAAsB,aAAa,CAAC,MAAM,CAAC,UAAU,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,eAAe,GAAG,CAAC,MAAM,CAAC,SAiE5H,CAAA"}

package/lib/typescript/src/web/convert/textShadow.d.ts

@@ -1,3 +0,0 @@
-import type { NestedCSSProperties } from 'typestyle/lib/types';
-export declare const getTextShadowStyle: (styles: Record<string, any>) => NestedCSSProperties;
-//# sourceMappingURL=textShadow.d.ts.map

package/lib/typescript/src/web/convert/textShadow.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"textShadow.d.ts","sourceRoot":"","sources":["../../../../../src/web/convert/textShadow.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAiB9D,eAAO,MAAM,kBAAkB,WAAY,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAG,mBAkDhE,CAAA"}

package/lib/typescript/src/web/convert/transform.d.ts

@@ -1,5 +0,0 @@
-import type { NestedCSSProperties } from 'typestyle/lib/types';
-type Transforms = Array<Record<string, any>>;
-export declare const getTransformStyle: (transforms: Transforms) => NestedCSSProperties;
-export {};
-//# sourceMappingURL=transform.d.ts.map

package/lib/typescript/src/web/convert/transform.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"transform.d.ts","sourceRoot":"","sources":["../../../../../src/web/convert/transform.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qBAAqB,CAAA;AAK9D,KAAK,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAAA;AAmC5C,eAAO,MAAM,iBAAiB,eAAgB,UAAU,KAAG,mBA+C1D,CAAA"}

package/lib/typescript/src/web/listener/index.d.ts

@@ -1,2 +0,0 @@
-export { UnistylesListener } from './listener';
-//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/web/listener/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/web/listener/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAA"}

package/lib/typescript/src/web/listener/listener.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"listener.d.ts","sourceRoot":"","sources":["../../../../../src/web/listener/listener.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAA;AAG/D,qBAAa,wBAAwB;IACjC,OAAO,CAAC,aAAa,CAAQ;IAC7B,OAAO,CAAC,SAAS,CAAoG;IAErH,UAAU,eAAgB,kBAAkB,UAE3C;IAED,aAAa,aAUZ;IAED,YAAY,iBAAkB,KAAK,CAAC,kBAAkB,CAAC,YAAY,YAAY,gBAM9E;CACJ;AAED,eAAO,MAAM,iBAAiB,0BAAiC,CAAA"}

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

@@ -1,4 +0,0 @@
-import type { MediaQuery } from 'typestyle/lib/types';
-export declare const parseMq: (mq: string) => MediaQuery;
-export declare const isUnistylesMq: (mq: string) => boolean;
-//# sourceMappingURL=mq.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"mq.d.ts","sourceRoot":"","sources":["../../../../src/web/mq.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAA;AAMrD,eAAO,MAAM,OAAO,OAAQ,MAAM,KAAG,UAUpC,CAAA;AAED,eAAO,MAAM,aAAa,OAAQ,MAAM,YAAgC,CAAA"}

package/lib/typescript/src/web/pseudo.d.ts

@@ -1,4 +0,0 @@
-export declare const pseudos: readonly ["_hover", "_css", "_before", "_after"];
-export declare const isPseudo: (selector: string) => boolean;
-export type Pseudo = typeof pseudos[number];
-//# sourceMappingURL=pseudo.d.ts.map

package/lib/typescript/src/web/pseudo.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"pseudo.d.ts","sourceRoot":"","sources":["../../../../src/web/pseudo.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,OAAO,kDAKV,CAAA;AAEV,eAAO,MAAM,QAAQ,aAAc,MAAM,YAAyC,CAAA;AAElF,MAAM,MAAM,MAAM,GAAG,OAAO,OAAO,CAAC,MAAM,CAAC,CAAA"}

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

@@ -1,20 +0,0 @@
-import { ColorScheme, type AppThemeName } from '../specs/types';
-import type { UnistylesValues } from '../types';
-export declare const reduceObject: <TObj extends Record<string, any>, TReducer>(obj: TObj, reducer: (value: TObj[keyof TObj], key: keyof TObj) => TReducer) => { [K in keyof TObj]: TReducer; };
-export declare const toReactNativeClassName: (className: string | null, values: UnistylesValues) => {
-    [x: string]: string | boolean;
-    $$css: boolean;
-} | {
-    $$css?: undefined;
-};
-export declare const keyInObject: <T extends Record<string, any>>(obj: T, key: PropertyKey) => key is keyof T;
-export declare const schemeToTheme: (scheme: ColorScheme) => AppThemeName;
-export declare const hexToRGBA: (hex: string, opacity: number) => string;
-export declare const isServer: () => boolean;
-/**
-* Deeply merges properties of passed object
-*/
-export declare const deepMergeObjects: <T extends Record<PropertyKey, any>>(...sources: Array<T>) => T;
-export declare const warn: (message: string) => void;
-export declare const equal: <T>(a: T, b: T) => boolean;
-//# sourceMappingURL=utils.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/web/utils.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,KAAK,YAAY,EAAC,MAAM,gBAAgB,CAAA;AAC9D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE/C,eAAO,MAAM,YAAY,GAAI,IAAI,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAAE,QAAQ,OAC9D,IAAI,WACA,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,IAAI,CAAC,EAAE,GAAG,EAAE,MAAM,IAAI,KAAK,QAAQ,KACmD,GAAG,CAAe,IAAV,MAAM,IAAI,GAAG,QAAQ,GAAE,CAAA;AAErJ,eAAO,MAAM,sBAAsB,cAAe,MAAM,GAAG,IAAI,UAAU,eAAe;;;;;CAavF,CAAA;AAED,eAAO,MAAM,WAAW,GAAI,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,OAAO,CAAC,OAAO,WAAW,KAAG,GAAG,IAAI,MAAM,CAAe,CAAA;AAElH,eAAO,MAAM,aAAa,WAAY,WAAW,KAAG,YAQnD,CAAA;AAED,eAAO,MAAM,SAAS,QAAS,MAAM,WAAW,MAAM,WAM5B,CAAA;AAE1B,eAAO,MAAM,QAAQ,eAAsC,CAAA;AAE3D;;EAEE;AACF,eAAO,MAAM,gBAAgB,GAAI,CAAC,SAAS,MAAM,CAAC,WAAW,EAAE,GAAG,CAAC,cAAc,KAAK,CAAC,CAAC,CAAC,MAqBxF,CAAA;AAED,eAAO,MAAM,IAAI,YAAa,MAAM,SAA2D,CAAA;AAE/F,eAAO,MAAM,KAAK,GAAI,CAAC,KAAK,CAAC,KAAK,CAAC,YAqBlC,CAAA"}

package/lib/typescript/src/web/variants/getVariants.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"getVariants.d.ts","sourceRoot":"","sources":["../../../../../src/web/variants/getVariants.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,qBAAqB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAWpE,eAAO,MAAM,WAAW,WAAY,qBAAqB,CAAC,UAAU,CAAC,oBAAoB,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,+BA8B3G,CAAA"}

package/lib/typescript/src/web/variants/index.d.ts

@@ -1,3 +0,0 @@
-export * from './useVariants';
-export * from './getVariants';
-//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/web/variants/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/web/variants/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAA;AAC7B,cAAc,eAAe,CAAA"}

package/lib/typescript/src/web/variants/useVariants.d.ts

@@ -1,3 +0,0 @@
-import type { ReactNativeStyleSheet, StyleSheet } from '../../types';
-export declare const createUseVariants: (styles: ReactNativeStyleSheet<StyleSheet>, setSelectedVariants: (variants: Record<string, any>) => void) => void;
-//# sourceMappingURL=useVariants.d.ts.map

package/lib/typescript/src/web/variants/useVariants.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useVariants.d.ts","sourceRoot":"","sources":["../../../../../src/web/variants/useVariants.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AAKpE,eAAO,MAAM,iBAAiB,WAAY,qBAAqB,CAAC,UAAU,CAAC,uBAAuB,CAAC,QAAQ,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,KAAK,IAAI,SAuExI,CAAA"}

package/nitrogen/generated/android/c++/JFunc_void_std__vector_UnistyleDependency_.hpp

@@ -1,60 +0,0 @@
-///
-/// JFunc_void_std__vector_UnistyleDependency_.hpp
-/// This file was generated by nitrogen. DO NOT MODIFY THIS FILE.
-/// https://github.com/mrousavy/nitro
-/// Copyright © 2024 Marc Rousavy @ Margelo
-///
-
-#pragma once
-
-#include <fbjni/fbjni.h>
-#include <functional>
-
-#include <functional>
-#include <vector>
-#include "UnistyleDependency.hpp"
-#include "JUnistyleDependency.hpp"
-
-namespace margelo::nitro::unistyles {
-
-  using namespace facebook;
-
-  /**
-   * C++ representation of the callback Func_void_std__vector_UnistyleDependency_.
-   * This is a Kotlin `(dependencies: Array<UnistyleDependency>) -> Unit`, backed by a `std::function<...>`.
-   */
-  struct JFunc_void_std__vector_UnistyleDependency_ final: public jni::HybridClass<JFunc_void_std__vector_UnistyleDependency_> {
-  public:
-    static jni::local_ref<JFunc_void_std__vector_UnistyleDependency_::javaobject> fromCpp(const std::function<void(const std::vector<UnistyleDependency>& /* dependencies */)>& func) {
-      return JFunc_void_std__vector_UnistyleDependency_::newObjectCxxArgs(func);
-    }
-
-  public:
-    void call(const jni::alias_ref<jni::JArrayClass<JUnistyleDependency>>& dependencies) {
-      return _func([&]() {
-        size_t size = dependencies->size();
-        std::vector<UnistyleDependency> vector;
-        vector.reserve(size);
-        for (size_t i = 0; i < size; i++) {
-          auto element = dependencies->getElement(i);
-          vector.push_back(element->toCpp());
-        }
-        return vector;
-      }());
-    }
-
-  public:
-    static auto constexpr kJavaDescriptor = "Lcom/margelo/nitro/unistyles/Func_void_std__vector_UnistyleDependency_;";
-    static void registerNatives() {
-      registerHybrid({makeNativeMethod("call", JFunc_void_std__vector_UnistyleDependency_::call)});
-    }
-
-  private:
-    explicit JFunc_void_std__vector_UnistyleDependency_(const std::function<void(const std::vector<UnistyleDependency>& /* dependencies */)>& func): _func(func) { }
-
-  private:
-    friend HybridBase;
-    std::function<void(const std::vector<UnistyleDependency>& /* dependencies */)> _func;
-  };
-
-} // namespace margelo::nitro::unistyles

package/plugin/__tests__/dependencies.spec.js

@@ -1,438 +0,0 @@
-import { pluginTester } from 'babel-plugin-tester'
-import plugin from '../'
-
-pluginTester({
-    plugin,
-    pluginOptions: {
-        debug: false
-    },
-    babelOptions: {
-        plugins: ['@babel/plugin-syntax-jsx'],
-        generatorOpts: {
-            retainLines: true
-        }
-    },
-    tests: [
-        {
-            title: 'Should detect dependencies in variants',
-            code: `
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View style={styles.container}>
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create((theme, rt) => ({
-                    container: {
-                        variants: {
-                            size: {
-                                small: {
-                                    backgroundColor: theme.colors.blue,
-                                    paddingTop: theme.gap(10),
-                                    marginBottom: rt.insets.bottom === 0
-                                        ? theme.gap(20)
-                                        : theme.gap(30)
-                                }
-                            }
-                        }
-                    }
-                }))
-            `,
-            output: `
-                import { UnistylesShadowRegistry } from 'react-native-unistyles'
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View
-                            style={styles.container}
-                            ref={ref => {
-                                UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
-                                return () => UnistylesShadowRegistry.remove(ref, styles.container)
-                            }}
-                        >
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create(
-                    (theme, rt) => ({
-                        container: {
-                            variants: {
-                                size: {
-                                    small: {
-                                        backgroundColor: theme.colors.blue,
-                                        paddingTop: theme.gap(10),
-                                        marginBottom: rt.insets.bottom === 0 ? theme.gap(20) : theme.gap(30)
-                                    }
-                                }
-                            },
-                            uni__dependencies: [0, 9, 4]
-                        }
-                    }),
-                    276736056
-                )
-            `
-        },
-        {
-            title: 'Should detect dependencies in breakpoints',
-            code: `
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View style={styles.container}>
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create((theme, rt) => ({
-                    container: {
-                        backgroundColor: {
-                            sm: theme.colors.blue
-                        },
-                        padding: {
-                            xs: rt.insets.top
-                        }
-                    }
-                }))
-            `,
-            output: `
-                import { UnistylesShadowRegistry } from 'react-native-unistyles'
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View
-                            style={styles.container}
-                            ref={ref => {
-                                UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
-                                return () => UnistylesShadowRegistry.remove(ref, styles.container)
-                            }}
-                        >
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create(
-                    (theme, rt) => ({
-                        container: {
-                            backgroundColor: {
-                                sm: theme.colors.blue
-                            },
-                            padding: {
-                                xs: rt.insets.top
-                            },
-                            uni__dependencies: [0, 9]
-                        }
-                    }),
-                    276736056
-                )
-            `
-        },
-        {
-            title: 'Should detect dependencies in calculations',
-            code: `
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View style={styles.container}>
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create((theme, rt) => ({
-                    container: {
-                        marginTop: theme.gap(2) + rt.insets.bottom,
-                        marginBottom: theme.gap(2) * rt.statusBar.height,
-                        paddingTop: theme.gap(2) - rt.navigationBar.height
-                    }
-                }))
-            `,
-            output: `
-                import { UnistylesShadowRegistry } from 'react-native-unistyles'
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View
-                            style={styles.container}
-                            ref={ref => {
-                                UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
-                                return () => UnistylesShadowRegistry.remove(ref, styles.container)
-                            }}
-                        >
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create(
-                    (theme, rt) => ({
-                        container: {
-                            marginTop: theme.gap(2) + rt.insets.bottom,
-                            marginBottom: theme.gap(2) * rt.statusBar.height,
-                            paddingTop: theme.gap(2) - rt.navigationBar.height,
-                            uni__dependencies: [0, 9, 12, 13]
-                        }
-                    }),
-                    276736056
-                )
-            `
-        },
-        {
-            title: 'Should detect dependencies in _web',
-            code: `
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View style={styles.container}>
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create((theme, rt) => ({
-                    container: {
-                        flex: 1,
-                        display: 'flex'
-                    },
-                    static: {
-                        backgroundColor: 'pink'
-                    },
-                    staticText: {
-                        color: 'red'
-                    },
-                    theme: {
-                        backgroundColor: theme.colors.backgroundColor
-                    },
-                    themeText: {
-                        color: theme.colors.typography
-                    },
-                    themeButtonsContainer: {
-                        marginTop: 20,
-                        flexDirection: 'row',
-                        gap: 10
-                    },
-                    dynamic: state => ({
-                        backgroundColor: state % 2 === 0 ? theme.colors.fog : theme.colors.oak
-                    }),
-                    whiteText: {
-                        color: 'white',
-                        textAlign: 'center'
-                    },
-                    hover: {
-                        backgroundColor: theme.colors.blood,
-                        cursor: 'pointer',
-                        _web: {
-                            _hover: {
-                                backgroundColor: theme.colors.sky,
-                                paddingTop: rt.insets.top
-                            }
-                        }
-                    },
-                    breakpoint: {
-                        backgroundColor: {
-                            xs: theme.colors.blood,
-                            md: theme.colors.sky,
-                            xl: theme.colors.aloes
-                        },
-                        transform: [
-                            {
-                                translateX: {
-                                    xs: rt.fontScale * 10,
-                                    md: rt.pixelRatio * 10
-                                }
-                            }
-                        ],
-                        position: 'relative',
-                        _web: {
-                            _after: {
-                                fontWeight: 'bold',
-                                content: rt.breakpoint,
-                                color: 'white',
-                                position: 'absolute',
-                                top: '60%',
-                                left: '50%',
-                                transform: 'translate(-50%, -50%)',
-                                backgroundColor: rt.colorScheme === 'dark' ? 'black' : 'white'
-                            }
-                        }
-                    }
-                }))
-            `,
-            output: `
-                import { UnistylesShadowRegistry } from 'react-native-unistyles'
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View
-                            style={styles.container}
-                            ref={ref => {
-                                UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
-                                return () => UnistylesShadowRegistry.remove(ref, styles.container)
-                            }}
-                        >
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create(
-                    (theme, rt) => ({
-                        container: {
-                            flex: 1,
-                            display: 'flex'
-                        },
-                        static: {
-                            backgroundColor: 'pink'
-                        },
-                        staticText: {
-                            color: 'red'
-                        },
-                        theme: {
-                            backgroundColor: theme.colors.backgroundColor,
-                            uni__dependencies: [0]
-                        },
-                        themeText: {
-                            color: theme.colors.typography,
-                            uni__dependencies: [0]
-                        },
-                        themeButtonsContainer: {
-                            marginTop: 20,
-                            flexDirection: 'row',
-                            gap: 10
-                        },
-                        dynamic: state => ({
-                            backgroundColor: state % 2 === 0 ? theme.colors.fog : theme.colors.oak,
-                            uni__dependencies: [0]
-                        }),
-                        whiteText: {
-                            color: 'white',
-                            textAlign: 'center'
-                        },
-                        hover: {
-                            backgroundColor: theme.colors.blood,
-                            cursor: 'pointer',
-                            _web: {
-                                _hover: {
-                                    backgroundColor: theme.colors.sky,
-                                    paddingTop: rt.insets.top
-                                }
-                            },
-                            uni__dependencies: [0, 9]
-                        },
-                        breakpoint: {
-                            backgroundColor: {
-                                xs: theme.colors.blood,
-                                md: theme.colors.sky,
-                                xl: theme.colors.aloes
-                            },
-                            transform: [
-                                {
-                                    translateX: {
-                                        xs: rt.fontScale * 10,
-                                        md: rt.pixelRatio * 10
-                                    }
-                                }
-                            ],
-
-                            position: 'relative',
-                            _web: {
-                                _after: {
-                                    fontWeight: 'bold',
-                                    content: rt.breakpoint,
-                                    color: 'white',
-                                    position: 'absolute',
-                                    top: '60%',
-                                    left: '50%',
-                                    transform: 'translate(-50%, -50%)',
-                                    backgroundColor: rt.colorScheme === 'dark' ? 'black' : 'white'
-                                }
-                            },
-                            uni__dependencies: [0, 11, 10, 3, 5]
-                        }
-                    }),
-                    276736056
-                )
-            `
-        },
-        {
-            title: 'Should allow user to use arrow functions with body for dynamic functions',
-            code: `
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View style={styles.container}>
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create((theme, rt) => ({
-                    container: () => {
-                        const b = 2 + 2
-
-                        return {
-                            backgroundColor: {
-                                sm: theme.colors.blue
-                            },
-                            padding: {
-                                xs: rt.insets.top + b
-                            }
-                        }
-                    }
-                }))
-            `,
-            output: `
-                import { UnistylesShadowRegistry } from 'react-native-unistyles'
-                import { StyleSheet } from 'react-native-unistyles'
-
-                export const Example = () => {
-                    return (
-                        <View
-                            style={styles.container}
-                            ref={ref => {
-                                UnistylesShadowRegistry.add(ref, styles.container, undefined, undefined)
-                                return () => UnistylesShadowRegistry.remove(ref, styles.container)
-                            }}
-                        >
-                            <Text>Hello world</Text>
-                        </View>
-                    )
-                }
-
-                const styles = StyleSheet.create(
-                    (theme, rt) => ({
-                        container: () => {
-                            const b = 2 + 2
-
-                            return {
-                                backgroundColor: {
-                                    sm: theme.colors.blue
-                                },
-                                padding: {
-                                    xs: rt.insets.top + b
-                                },
-                                uni__dependencies: [0, 9]
-                            }
-                        }
-                    }),
-                    276736056
-                )
-            `
-        },
-    ]
-})