react-native-unistyles 2.8.0-rc.4 → 2.8.0-rc.6

package/cxx/UnistylesModel.h

@@ -7,6 +7,7 @@
 #include <optional>
 #include <variant>
 #include <math.h>
+#include <algorithm>
 
 using namespace facebook;
 

package/ios/UnistylesModule.h

@@ -1,6 +1,6 @@
 #import <React/RCTBridgeModule.h>
 #import <React/RCTEventEmitter.h>
-#import <ReactCommon/RCTRuntimeExecutor.h>
+
 #import <string>
 
 #if TARGET_OS_OSX

package/ios/platform/Platform_Shared.mm

@@ -1,3 +1,5 @@
+#if TARGET_OS_TV || TARGET_OS_VISION || TARGET_OS_IOS
+
 #include "Platform_Shared.h"
 
 std::string getContentSizeCategory() {
@@ -154,3 +156,5 @@ UIColor* colorFromHexString(NSString* hexString, float alpha) {
                     blue:(rgbValue & 0x0000FF) / 255.0
                     alpha:alpha];
 }
+
+#endif

package/ios/platform/Platform_macOS.mm

@@ -45,8 +45,12 @@
     });
     
     dispatch_async(dispatch_get_main_queue(), ^{
-        unistylesRuntime->screen = [self getScreenDimensions];
+        Screen screen = [self getScreenDimensions];
+        
+        unistylesRuntime->screen = Dimensions({screen.width, screen.height});
         unistylesRuntime->colorScheme = [self getColorScheme];
+        unistylesRuntime->fontScale = screen.fontScale;
+        unistylesRuntime->pixelRatio = screen.pixelRatio;
     });
 }
 
@@ -69,7 +73,7 @@
 }
 
 - (void)onWindowChange {
-    Dimensions screen = [self getScreenDimensions];
+    Screen screen = [self getScreenDimensions];
     
     if (self.unistylesRuntime != nullptr) {
         ((UnistylesRuntime*)self.unistylesRuntime)->handleScreenSizeChange(
@@ -91,11 +95,21 @@
     return UnistylesLightScheme;
 }
 
-- (Dimensions)getScreenDimensions {
+- (Screen)getScreenDimensions {
     NSWindow *window = RCTSharedApplication().mainWindow;
-    Dimensions screenDimension = {(int)window.frame.size.width, (int)window.frame.size.height};
+    int width = (int)window.frame.size.width;
+    int height = (int)window.frame.size.height;
+    float pixelRatio = window.backingScaleFactor;
+    float fontScale = [self getFontScale];
     
-    return screenDimension;
+    return Screen({width, height, pixelRatio, fontScale});
+}
+
+- (float)getFontScale {
+    NSFont *systemFont = [NSFont systemFontOfSize:[NSFont systemFontSize]];
+    CGFloat systemFontScale = systemFont.pointSize / 13.0;
+    
+    return systemFontScale;
 }
 
 @end

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-unistyles",
-  "version": "2.8.0-rc.4",
+  "version": "2.8.0-rc.6",
   "description": "Level up your React Native StyleSheet",
   "scripts": {
     "test": "jest",

package/windows/ExperimentalFeatures.props

@@ -2,10 +2,10 @@
 <Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
 
   <!--
-    Application projects contain a file with this name to specify some important settings
-    that will apply globally for the app and *all* native modules the app consumes. These
-    values are set by the app developer. However you can also set them here to test building
-    the library solution without an app.
+    This file contains some important settings that will apply globally for
+    your app and *all* native modules your app consumes. These values were
+    set when you created the app project, and in some cases cannot be
+    simply changed here without recreating a new project.
   -->
 
   <PropertyGroup Label="Microsoft.ReactNative Experimental Features">

package/windows/NuGet.Config

@@ -5,7 +5,6 @@
   </config>
   <packageSources>
     <clear />
-    <add key="react-native" value="https://pkgs.dev.azure.com/ms/react-native/_packaging/react-native-public/nuget/v3/index.json" />
     <add key="Nuget.org" value="https://api.nuget.org/v3/index.json" />
   </packageSources>
   <disabledPackageSources>

package/windows/ReactNativeUnistyles/ReactNativeUnistyles.h

@@ -8,21 +8,18 @@
 #include <winrt/Microsoft.ReactNative.h>
 #include <winrt/Windows.UI.Xaml.h>
 #include <winrt/Windows.UI.Core.h>
+#include <winrt/Windows.Graphics.Display.h>
 #include <winrt/Windows.UI.ViewManagement.h>
 #include "UnistylesRuntime.h"
+#include <TurboModuleProvider.h>
 
 using namespace winrt::Windows::UI::ViewManagement;
+using namespace winrt::Windows::Graphics::Display;
 using namespace winrt::Microsoft::ReactNative;
 using namespace winrt::Windows::UI::Xaml;
 using namespace winrt::Windows::UI::Core;
 using namespace facebook;
 
-struct UIInitialInfo {
-    Dimensions screen;
-    std::string colorScheme;
-    std::string contentSizeCategory;
-};
-
 namespace winrt::ReactNativeUnistyles
 {
 
@@ -30,157 +27,86 @@ REACT_MODULE(Unistyles, L"Unistyles")
 struct Unistyles {
 
     REACT_INIT(Initialize)
-    void Initialize(ReactContext const &reactContext) noexcept {
+        void Initialize(ReactContext const& reactContext) noexcept {
         m_reactContext = reactContext;
 
         m_reactContext.UIDispatcher().Post([this]() mutable {
             this->windowSizeChange = Window::Current().CoreWindow().SizeChanged(TypedEventHandler<CoreWindow, WindowSizeChangedEventArgs>([=](CoreWindow const sender, WindowSizeChangedEventArgs const&) {
-                auto bounds = Window::Current().Bounds();
-
                 if (this->unistylesRuntime != nullptr) {
-                    Dimensions screenDimensions = Dimensions{(int)bounds.Width, (int)bounds.Height};
-
-                    ((UnistylesRuntime*)this->unistylesRuntime)->handleScreenSizeChange(screenDimensions, this->getInsets(), this->getStatusBarDimensions(), this->getNavigationBarDimensions());
+                    ((UnistylesRuntime*)this->unistylesRuntime)->handleScreenSizeChange(getScreenDimensions(), std::nullopt, std::nullopt, std::nullopt);
                 }
             }));
 
-            UISettings settings;
-
-            this->colorValuesChange = settings.ColorValuesChanged(TypedEventHandler<UISettings, IInspectable>([this](UISettings const& sender, IInspectable const&){
+            this->colorValuesChange = UISettings().ColorValuesChanged(TypedEventHandler<UISettings, IInspectable>([this](UISettings const& sender, IInspectable const&) {
                 if (this->unistylesRuntime != nullptr) {
                     ((UnistylesRuntime*)this->unistylesRuntime)->handleAppearanceChange(this->getColorScheme());
                 }
             }));
         });
     }
-    
+
     REACT_SYNC_METHOD(install)
-    bool install() noexcept {
+        bool install() noexcept {
         if (m_reactContext == nullptr) {
             return false;
         }
 
         jsi::Runtime* jsiRuntime = TryGetOrCreateContextRuntime(m_reactContext);
-        
+
         if (jsiRuntime == nullptr) {
             return false;
         }
 
         auto& runtime = *jsiRuntime;
+        auto callInvoker = MakeAbiCallInvoker(m_reactContext.Handle().JSDispatcher());
 
-        registerUnistylesHostObject(runtime);
+        registerUnistylesHostObject(runtime, callInvoker);
 
         return true;
     }
 
-    void registerUnistylesHostObject(jsi::Runtime& runtime) {
-        std::promise<UIInitialInfo> uiInfoPromise;
-        auto uiInfoFuture = uiInfoPromise.get_future();
-
-        m_reactContext.UIDispatcher().Post([this, promise = std::move(uiInfoPromise)]() mutable {
-            UIInitialInfo uiMetadata;
-            auto bounds = Window::Current().Bounds();
+    void registerUnistylesHostObject(jsi::Runtime& runtime, std::shared_ptr<facebook::react::CallInvoker> callInvoker) {
+        auto unistylesRuntime = std::make_shared<UnistylesRuntime>(runtime, callInvoker);
 
-            uiMetadata.screen = Dimensions{(int)bounds.Width, (int)bounds.Height};
-            uiMetadata.colorScheme = this->getColorScheme();
-            uiMetadata.contentSizeCategory = UnistylesUnspecifiedScheme;
-
-            promise.set_value(std::move(uiMetadata));
-        });
-
-        UIInitialInfo uiInfo = uiInfoFuture.get();
+        this->unistylesRuntime = unistylesRuntime.get();
 
-        auto unistylesRuntime = std::make_shared<UnistylesRuntime>(
-            uiInfo.screen,
-            uiInfo.colorScheme,
-            uiInfo.contentSizeCategory,
-            this->getInsets(),
-            this->getStatusBarDimensions(),
-            this->getNavigationBarDimensions()
-        );
+        makeShared((UnistylesRuntime*)unistylesRuntime.get());
 
-        unistylesRuntime->onThemeChange([this](std::string theme) {
-            winrt::hstring themeName = winrt::to_hstring(theme);
+        auto hostObject = jsi::Object::createFromHostObject(runtime, unistylesRuntime);
 
-            auto payload = winrt::Microsoft::ReactNative::JSValueObject{
-                {"type", "theme"},
-                {"payload", winrt::Microsoft::ReactNative::JSValueObject{{"themeName", winrt::to_string(themeName)}}}
-            };
+        runtime.global().setProperty(runtime, "__UNISTYLES__", std::move(hostObject));
+    }
 
-            this->OnThemeChange(payload);
+    void makeShared(UnistylesRuntime* unistylesRuntime) {
+        unistylesRuntime->setScreenDimensionsCallback([this]() {
+            return getScreenDimensions();
         });
 
-        unistylesRuntime.get()->onLayoutChange([this](std::string breakpoint, std::string orientation, Dimensions& screen, Dimensions& statusBar, Insets& insets, Dimensions& navigationBar) {
-            auto payload = winrt::Microsoft::ReactNative::JSValueObject{
-                {"type", "layout"},
-                {"payload", winrt::Microsoft::ReactNative::JSValueObject{
-                    {"breakpoint", breakpoint},
-                    {"orientation", orientation},
-                    {"screen", winrt::Microsoft::ReactNative::JSValueObject{
-                        {"width", screen.width},
-                        {"height", screen.height}
-                    }},
-                    {"statusBar", winrt::Microsoft::ReactNative::JSValueObject{
-                        {"width", statusBar.width},
-                        {"height", statusBar.height}
-                    }},
-                    {"navigationBar", winrt::Microsoft::ReactNative::JSValueObject{
-                        {"width", navigationBar.width},
-                        {"height", navigationBar.height}
-                    }},
-                    {"insets", winrt::Microsoft::ReactNative::JSValueObject{
-                        {"top", insets.top},
-                        {"bottom", insets.bottom},
-                        {"left", insets.left},
-                        {"right", insets.right}
-                    }},
-                }}
-            };
-
-            this->OnLayoutChange(payload);
+        unistylesRuntime->setColorSchemeCallback([this]() {
+            return getColorScheme();
         });
 
-        unistylesRuntime.get()->onPluginChange([this]() {
-            auto payload = winrt::Microsoft::ReactNative::JSValueObject{
-                {"type", "plugin"}
-            };
+        m_reactContext.UIDispatcher().Post([this, unistylesRuntime]() {
+            auto screen = getScreenDimensions();
 
-            this->OnPluginChange(payload);
+            unistylesRuntime->screen = Dimensions({ screen.width, screen.height });
+            unistylesRuntime->pixelRatio = screen.pixelRatio;
+            unistylesRuntime->fontScale = screen.fontScale;
+            unistylesRuntime->colorScheme = getColorScheme();
         });
-
-        unistylesRuntime.get()->onContentSizeCategoryChange([this](std::string contentSizeCategory) {
-            // not available on windows
-        });
-
-        this->unistylesRuntime = unistylesRuntime.get();
-
-        auto hostObject = jsi::Object::createFromHostObject(runtime, unistylesRuntime);
-
-        runtime.global().setProperty(runtime, "__UNISTYLES__", std::move(hostObject));
     }
 
-    REACT_EVENT(OnThemeChange, L"__unistylesOnChange")
-    std::function<void(winrt::Microsoft::ReactNative::JSValueObject const&)> OnThemeChange;
-
-    REACT_EVENT(OnLayoutChange, L"__unistylesOnChange")
-    std::function<void(winrt::Microsoft::ReactNative::JSValueObject const&)> OnLayoutChange;
-
-    REACT_EVENT(OnPluginChange, L"__unistylesOnChange")
-    std::function<void(winrt::Microsoft::ReactNative::JSValueObject const&)> OnPluginChange;
-
     ~Unistyles() {
         if (this->unistylesRuntime != nullptr) {
             this->unistylesRuntime = nullptr;
         }
 
         if (this->windowSizeChange) {
-            Window::Current().CoreWindow().SizeChanged(this->windowSizeChange);
+            this->windowSizeChange = { NULL };
         }
 
         if (this->colorValuesChange) {
-            UISettings settings;
-
-            settings.ColorValuesChanged(this->colorValuesChange);
+            this->colorValuesChange = { NULL };
         }
     }
 
@@ -191,16 +117,17 @@ struct Unistyles {
         winrt::event_token colorValuesChange{ NULL };
 
         std::string getColorScheme() {
-            auto uiSettings = UISettings();
-            auto background = uiSettings.GetColorValue(UIColorType::Background);
+            UISettings uiSettings;
+
+            auto backgroundColor = uiSettings.GetColorValue(UIColorType::Background);
 
-            bool isDark = background == winrt::Windows::UI::Colors::Black();
+            bool isDark = backgroundColor == Colors::Black();
 
             if (isDark) {
                 return UnistylesDarkScheme;
             }
 
-            bool isLight = background == winrt::Windows::UI::Colors::White();
+            bool isLight = backgroundColor == Colors::White();
 
             if (isLight) {
                 return UnistylesLightScheme;
@@ -209,16 +136,13 @@ struct Unistyles {
             return UnistylesUnspecifiedScheme;
         }
 
-        Insets getInsets() {
-            return Insets{ 0, 0, 0, 0 };
-        }
-
-        Dimensions getStatusBarDimensions() {
-            return {0, 0};
-        }
+        Screen getScreenDimensions() {
+            auto bounds = Window::Current().Bounds();
+            auto displayInfo = DisplayInformation::GetForCurrentView();
+            auto pixelRatio = displayInfo.LogicalDpi() / 96.0f;
+            float fontScale = UISettings().TextScaleFactor();
 
-        Dimensions getNavigationBarDimensions() {
-            return { 0, 0 };
+            return Screen({ (int)bounds.Width, (int)bounds.Height, pixelRatio, fontScale });
         }
 };
 

package/windows/ReactNativeUnistyles/ReactNativeUnistyles.vcxproj

@@ -79,7 +79,7 @@
   <PropertyGroup Label="UserMacros" />
   <ItemDefinitionGroup>
     <ClCompile>
-      <PrecompiledHeader>Use</PrecompiledHeader>
+      <PrecompiledHeader>NotUsing</PrecompiledHeader>
       <PrecompiledHeaderFile>pch.h</PrecompiledHeaderFile>
       <PrecompiledHeaderOutputFile>$(IntDir)pch.pch</PrecompiledHeaderOutputFile>
       <WarningLevel>Level4</WarningLevel>
@@ -112,6 +112,9 @@
     </ClCompile>
   </ItemDefinitionGroup>
   <ItemGroup>
+    <ClInclude Include="..\..\cxx\Macros.h" />
+    <ClInclude Include="..\..\cxx\UnistylesModel.h" />
+    <ClInclude Include="..\..\cxx\UnistylesRuntime.h" />
     <ClInclude Include="ReactPackageProvider.h">
       <DependentUpon>ReactPackageProvider.idl</DependentUpon>
     </ClInclude>
@@ -119,6 +122,8 @@
     <ClInclude Include="pch.h" />
   </ItemGroup>
   <ItemGroup>
+    <ClCompile Include="..\..\cxx\UnistylesImpl.cpp" />
+    <ClCompile Include="..\..\cxx\UnistylesModel.cpp" />
     <ClCompile Include="..\..\cxx\UnistylesRuntime.cpp">
       <PrecompiledHeader Condition="'$(Configuration)|$(Platform)'=='Debug|ARM64'">NotUsing</PrecompiledHeader>
       <PrecompiledHeader Condition="'$(Configuration)|$(Platform)'=='Debug|Win32'">NotUsing</PrecompiledHeader>
@@ -154,4 +159,4 @@
     <Error Condition="!Exists('$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppLib.props')" Text="$([System.String]::Format('$(ErrorText)', '$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppLib.props'))" />
     <Error Condition="!Exists('$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppLib.targets')" Text="$([System.String]::Format('$(ErrorText)', '$(ReactNativeWindowsDir)\PropertySheets\External\Microsoft.ReactNative.Uwp.CppLib.targets'))" />
   </Target>
-</Project>
+</Project>

package/windows/ReactNativeUnistyles/ReactNativeUnistyles.vcxproj.filters

@@ -8,13 +8,18 @@
     <ClCompile Include="$(GeneratedFilesDir)module.g.cpp" />
     <ClCompile Include="ReactPackageProvider.cpp" />
     <ClCompile Include="..\..\cxx\UnistylesRuntime.cpp" />
+    <ClCompile Include="..\..\cxx\UnistylesImpl.cpp" />
+    <ClCompile Include="..\..\cxx\UnistylesModel.cpp" />
   </ItemGroup>
   <ItemGroup>
     <ClInclude Include="pch.h" />
     <ClInclude Include="ReactPackageProvider.h" />
     <ClInclude Include="ReactNativeUnistyles.h" />
+    <ClInclude Include="..\..\cxx\Macros.h" />
+    <ClInclude Include="..\..\cxx\UnistylesModel.h" />
+    <ClInclude Include="..\..\cxx\UnistylesRuntime.h" />
   </ItemGroup>
   <ItemGroup>
     <None Include="PropertySheet.props" />
   </ItemGroup>
-</Project>
+</Project>