@expo/ui 56.0.3 → 56.0.4

package/CHANGELOG.md

@@ -10,6 +10,12 @@
 
 ### 💡 Others
 
+## 56.0.4 — 2026-05-08
+
+### 💡 Others
+
+- [universal] Refactored web components to use `StyleSheet.create` instead of inline styles, added `react-native-web` type declarations, and tightened prop handling. ([#45485](https://github.com/expo/expo/pull/45485) by [@zoontek](https://github.com/zoontek))
+
 ## 56.0.3 — 2026-05-07
 
 _This version does not introduce any user-facing changes._

package/android/build.gradle

@@ -12,13 +12,13 @@ apply plugin: 'expo-module-gradle-plugin'
 apply plugin: 'org.jetbrains.kotlin.plugin.compose'
 
 group = 'expo.modules.ui'
-version = '56.0.3'
+version = '56.0.4'
 
 android {
   namespace "expo.modules.ui"
   defaultConfig {
     versionCode 1
-    versionName "56.0.3"
+    versionName "56.0.4"
     testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
   }
   buildFeatures {

package/build/universal/Button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Button/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAiB,MAAM,SAAS,CAAC;AA2C1D;;GAEG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,KAAK,EACL,OAAO,EACP,OAAkB,EAClB,KAAK,EACL,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,MAAM,EACN,MAAM,GACP,EAAE,WAAW,2CAyBb;AAED,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Button/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAiB,MAAM,SAAS,CAAC;AAoC1D;;GAEG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,KAAK,EACL,OAAO,EACP,OAAkB,EAClB,KAAK,EACL,QAAQ,EACR,WAAW,EACX,QAAgB,EAChB,MAAc,EACd,MAAM,GACP,EAAE,WAAW,2CAoBb;AAED,cAAc,SAAS,CAAC"}

package/build/universal/Checkbox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Checkbox/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE7C;;GAEG;AACH,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,aAAa,2CAaxF;AAcD,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Checkbox/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAwB7C;;GAEG;AACH,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,QAAgB,EAAE,MAAM,EAAE,EAAE,aAAa,2CAahG;AAED,cAAc,SAAS,CAAC"}

package/build/universal/Column/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Column/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAU3C;;GAEG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,SAAmB,EACnB,OAAO,EACP,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,MAAM,EACN,MAAM,GACP,EAAE,WAAW,2CAmBb;AAED,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Column/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAmB3C;;GAEG;AACH,wBAAgB,MAAM,CAAC,EACrB,QAAQ,EACR,SAAmB,EACnB,OAAO,EACP,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAW,EACX,QAAgB,EAChB,MAAc,EACd,MAAM,GACP,EAAE,WAAW,2CAqBb;AAED,cAAc,SAAS,CAAC"}

package/build/universal/FieldGroup/FieldGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../src/universal/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAG/C;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,WAAW,EACX,MAAM,EACN,MAAM,GACP,EAAE,eAAe,2CAkBjB"}
+{"version":3,"file":"FieldGroup.d.ts","sourceRoot":"","sources":["../../../src/universal/FieldGroup/FieldGroup.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAqB/C;;;;;;GAMG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,KAAK,EACL,QAAQ,EACR,WAAW,EACX,MAAc,EACd,MAAM,GACP,EAAE,eAAe,2CAkBjB"}

package/build/universal/FieldGroup/FieldSection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FieldSection.d.ts","sourceRoot":"","sources":["../../../src/universal/FieldGroup/FieldSection.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAGjD;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,KAAK,EACL,KAAK,EACL,QAAQ,EACR,WAAW,EACX,MAAM,EACN,MAAM,EACN,cAAsB,GACvB,EAAE,iBAAiB,2CA2CnB"}
+{"version":3,"file":"FieldSection.d.ts","sourceRoot":"","sources":["../../../src/universal/FieldGroup/FieldSection.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAuDjD;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,EAC3B,QAAQ,EACR,KAAK,EACL,KAAK,EACL,QAAQ,EACR,WAAW,EACX,MAAM,EACN,MAAM,EACN,cAAsB,GACvB,EAAE,iBAAiB,2CAsCnB"}

package/build/universal/Row/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Row/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AAUxC;;GAEG;AACH,wBAAgB,GAAG,CAAC,EAClB,QAAQ,EACR,SAAmB,EACnB,OAAO,EACP,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,MAAM,EACN,MAAM,GACP,EAAE,QAAQ,2CAyBV;AAED,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Row/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAC;AA2BxC;;GAEG;AACH,wBAAgB,GAAG,CAAC,EAClB,QAAQ,EACR,SAAmB,EACnB,OAAO,EACP,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAW,EACX,QAAgB,EAChB,MAAc,EACd,MAAM,GACP,EAAE,QAAQ,2CAqBV;AAED,cAAc,SAAS,CAAC"}

package/build/universal/ScrollView/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/ScrollView/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAG/C;;GAEG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,SAAsB,EACtB,eAAsB,EACtB,KAAK,EAGL,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,MAAM,EACN,MAAM,GACP,EAAE,eAAe,2CA+BjB;AAED,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/ScrollView/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAkB/C;;GAEG;AACH,wBAAgB,UAAU,CAAC,EACzB,QAAQ,EACR,SAAsB,EACtB,eAAsB,EACtB,KAAK,EAGL,QAAQ,EACR,WAAW,EACX,QAAgB,EAChB,MAAc,EACd,MAAM,GACP,EAAE,eAAe,2CA2BjB;AAED,cAAc,SAAS,CAAC"}

package/build/universal/Slider/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Slider/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;GAEG;AACH,wBAAgB,MAAM,CAAC,EACrB,KAAK,EACL,aAAa,EACb,GAAO,EACP,GAAO,EACP,IAAI,EACJ,QAAQ,EACR,MAAM,GACP,EAAE,WAAW,2CAgBb;AAYD,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Slider/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAiB3C;;GAEG;AACH,wBAAgB,MAAM,CAAC,EACrB,KAAK,EACL,aAAa,EACb,GAAO,EACP,GAAO,EACP,IAAI,EACJ,QAAgB,EAChB,MAAM,GACP,EAAE,WAAW,2CAeb;AAED,cAAc,SAAS,CAAC"}

package/build/universal/Spacer/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Spacer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAG3C;;;GAGG;AACH,wBAAgB,MAAM,CAAC,EACrB,IAAI,EACJ,QAAgB,EAChB,KAAK,EACL,QAAQ,EACR,WAAW,EACX,MAAM,EACN,MAAM,GACP,EAAE,WAAW,2CAWb;AAED,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Spacer/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAQ3C;;;GAGG;AACH,wBAAgB,MAAM,CAAC,EACrB,IAAI,EACJ,QAAgB,EAChB,KAAK,EACL,QAAQ,EACR,WAAW,EACX,MAAc,EACd,MAAM,GACP,EAAE,WAAW,2CAcb;AAED,cAAc,SAAS,CAAC"}

package/build/universal/Switch/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Switch/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C;;GAEG;AACH,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,EAAE,WAAW,2CAoBpF;AAED,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Switch/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAc3C;;GAEG;AACH,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,QAAgB,EAAE,MAAM,EAAE,EAAE,WAAW,2CAa5F;AAED,cAAc,SAAS,CAAC"}

package/build/universal/Text/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Text/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAGzC;;GAEG;AACH,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,SAAS,EACT,aAAa,EACb,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAW,EACX,QAAQ,EACR,MAAM,EACN,MAAM,GACP,EAAE,SAAS,2CA+BX;AAkBD,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/universal/Text/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAUzC;;GAEG;AACH,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,SAAS,EACT,aAAa,EACb,KAAK,EACL,OAAO,EACP,QAAQ,EACR,WAAW,EACX,QAAgB,EAChB,MAAc,EACd,MAAM,GACP,EAAE,SAAS,2CAqBX;AAED,cAAc,SAAS,CAAC"}

package/expo-module.config.json

@@ -10,7 +10,7 @@
     "publication": {
       "groupId": "expo.modules.ui",
       "artifactId": "expo.modules.ui",
-      "version": "56.0.3",
+      "version": "56.0.4",
       "repository": "local-maven-repo"
     }
   }

package/local-maven-repo/expo/modules/ui/expo.modules.ui/{56.0.3/expo.modules.ui-56.0.3.module → 56.0.4/expo.modules.ui-56.0.4.module}

@@ -3,7 +3,7 @@
   "component": {
     "group": "expo.modules.ui",
     "module": "expo.modules.ui",
-    "version": "56.0.3",
+    "version": "56.0.4",
     "attributes": {
       "org.gradle.status": "release"
     }
@@ -24,8 +24,8 @@
       },
       "files": [
         {
-          "name": "expo.modules.ui-56.0.3.aar",
-          "url": "expo.modules.ui-56.0.3.aar",
+          "name": "expo.modules.ui-56.0.4.aar",
+          "url": "expo.modules.ui-56.0.4.aar",
           "size": 1740154,
           "sha512": "24e656ae1e397c8abea2fb5a2d49bc826a58f84afd58b3104ff22cede3fcf720f86ac532223279fa5efda5c402d0c75f3ab700bdcbb5b0847c2618028243c04c",
           "sha256": "c04258a22308940aa735f6f81a47fa83d842db257c39396b2e3d9007cb6802fb",
@@ -141,8 +141,8 @@
       ],
       "files": [
         {
-          "name": "expo.modules.ui-56.0.3.aar",
-          "url": "expo.modules.ui-56.0.3.aar",
+          "name": "expo.modules.ui-56.0.4.aar",
+          "url": "expo.modules.ui-56.0.4.aar",
           "size": 1740154,
           "sha512": "24e656ae1e397c8abea2fb5a2d49bc826a58f84afd58b3104ff22cede3fcf720f86ac532223279fa5efda5c402d0c75f3ab700bdcbb5b0847c2618028243c04c",
           "sha256": "c04258a22308940aa735f6f81a47fa83d842db257c39396b2e3d9007cb6802fb",
@@ -161,8 +161,8 @@
       },
       "files": [
         {
-          "name": "expo.modules.ui-56.0.3-sources.jar",
-          "url": "expo.modules.ui-56.0.3-sources.jar",
+          "name": "expo.modules.ui-56.0.4-sources.jar",
+          "url": "expo.modules.ui-56.0.4-sources.jar",
           "size": 82167,
           "sha512": "788dc7a233524ec8b7eed4a0f242bf546284f3a2ea501806e2e90047c3221702430584413d684677dc330195a378feed1bb1956e2d980c8f689ebce716cf54b6",
           "sha256": "e144b778f1df5f7e73be22ffe120819c376f3309599468cc22a5c5528ce3ad84",

package/local-maven-repo/expo/modules/ui/expo.modules.ui/56.0.4/expo.modules.ui-56.0.4.module.md5

@@ -0,0 +1 @@
+ed200764f7fa23e508e0a909fe2d0c2e

package/local-maven-repo/expo/modules/ui/expo.modules.ui/56.0.4/expo.modules.ui-56.0.4.module.sha1

@@ -0,0 +1 @@
+0e06cad6985db57df681002fe110d3b7b4abdd3a

package/local-maven-repo/expo/modules/ui/expo.modules.ui/56.0.4/expo.modules.ui-56.0.4.module.sha256

@@ -0,0 +1 @@
+e68cdab048fade6260bdcb13e26dfcbbdf9b32f93cf906853739a20ac9159cf2

package/local-maven-repo/expo/modules/ui/expo.modules.ui/56.0.4/expo.modules.ui-56.0.4.module.sha512

@@ -0,0 +1 @@
+19fdcfa01a7b33c136b6d6602b86fda5d41c915782b7a4e62ee775c86c9274f1f358f59aef042b3f05b563977899ead45052f2a3050ec3e7a11e0bee4683c13b

package/local-maven-repo/expo/modules/ui/expo.modules.ui/{56.0.3/expo.modules.ui-56.0.3.pom → 56.0.4/expo.modules.ui-56.0.4.pom}

@@ -9,7 +9,7 @@
   <modelVersion>4.0.0</modelVersion>
   <groupId>expo.modules.ui</groupId>
   <artifactId>expo.modules.ui</artifactId>
-  <version>56.0.3</version>
+  <version>56.0.4</version>
   <packaging>aar</packaging>
   <name>expo.modules.ui</name>
   <url>https://github.com/expo/expo</url>

package/local-maven-repo/expo/modules/ui/expo.modules.ui/56.0.4/expo.modules.ui-56.0.4.pom.md5

@@ -0,0 +1 @@
+97b1fdd351fb091af6ba8179c75f6dac

package/local-maven-repo/expo/modules/ui/expo.modules.ui/56.0.4/expo.modules.ui-56.0.4.pom.sha1

@@ -0,0 +1 @@
+578fe568a309a9a5eabd852ac4ac683ab90a1425

package/local-maven-repo/expo/modules/ui/expo.modules.ui/56.0.4/expo.modules.ui-56.0.4.pom.sha256

@@ -0,0 +1 @@
+68ca52a8f7523da45ec6d5ea6c32cc43e79cb03f4ce419ca0045b0d7a37d88cd

package/local-maven-repo/expo/modules/ui/expo.modules.ui/56.0.4/expo.modules.ui-56.0.4.pom.sha512

@@ -0,0 +1 @@
+5846b988314dfe489a315a6867b90bb18b754eff1ddda8372c37a8255fc1b4720cbf849161c63f3e77612d5a94671b10c06455566a5a862e5c9d3609a8591b03

package/local-maven-repo/expo/modules/ui/expo.modules.ui/maven-metadata.xml

@@ -3,11 +3,11 @@
   <groupId>expo.modules.ui</groupId>
   <artifactId>expo.modules.ui</artifactId>
   <versioning>
-    <latest>56.0.3</latest>
-    <release>56.0.3</release>
+    <latest>56.0.4</latest>
+    <release>56.0.4</release>
     <versions>
-      <version>56.0.3</version>
+      <version>56.0.4</version>
     </versions>
-    <lastUpdated>20260507183248</lastUpdated>
+    <lastUpdated>20260508193741</lastUpdated>
   </versioning>
 </metadata>

package/local-maven-repo/expo/modules/ui/expo.modules.ui/maven-metadata.xml.md5

@@ -1 +1 @@
-2702a9cd8caa702a371daaa128e279b6
+0353edd352ef8d23fd2c25605acce957

package/local-maven-repo/expo/modules/ui/expo.modules.ui/maven-metadata.xml.sha1

@@ -1 +1 @@
-28b12bfa1f6047e1d7d83a26d0634e6ea132984d
+1be87e0b21c297d2164f2c6cce94471c3f08282a

package/local-maven-repo/expo/modules/ui/expo.modules.ui/maven-metadata.xml.sha256

@@ -1 +1 @@
-bec6765e9b4021cab658bdd7166664ad2965e243fe454dceb03eee957a882710
+9eddcd5edc295d99bcb6a5b1a2b56feeddcf04eccd4b0c850a2ebf3aa44a8431

package/local-maven-repo/expo/modules/ui/expo.modules.ui/maven-metadata.xml.sha512

@@ -1 +1 @@
-7d81095908e1c9f3e0480cb0787557ebc93b0721ba5da187bbabf0b2efb1f05ca77ff00d9fac3de537706e203024f5439428a890074ef651b619864bd44e2d44
+fa71ba728a32752b3b8d26ccd45cb960c27b569b108ed1eb545600621a2b0e9e6839c3fc4cefe5bce0c2b498aa76fdc06d271db7f86e9815ba765ee048501653

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@expo/ui",
-  "version": "56.0.3",
+  "version": "56.0.4",
   "description": "A collection of UI components",
   "sideEffects": [
     "*.fx.js"
@@ -83,7 +83,7 @@
     "@types/react": "~19.2.0",
     "react-native-reanimated": "4.3.0",
     "react-native-worklets": "0.8.3",
-    "expo": "56.0.0-preview.6",
+    "expo": "56.0.0-preview.7",
     "expo-module-scripts": "56.0.2"
   },
   "jest": {
@@ -112,7 +112,7 @@
       "optional": true
     }
   },
-  "gitHead": "d7b4e5edff4bf2e619d2c2f16d158798c6d592ef",
+  "gitHead": "a30353e69ca0d72b9fac5830abc631feda1ba3ae",
   "scripts": {
     "build": "expo-module build",
     "clean": "expo-module clean",

package/src/ts-declarations/react-native-web.d.ts

@@ -0,0 +1,112 @@
+import * as ReactNative from 'react-native';
+
+declare module 'react-native' {
+  export const unstable_createElement: <P>(
+    type: React.ElementType,
+    props?: P
+  ) => React.ReactElement<P>;
+
+  type DisplayValue = ReactNative.FlexStyle['display'] | 'inline-flex';
+
+  type WebRole =
+    | ReactNative.Role
+    /**
+     * Accessibility roles mapped to components
+     * @see https://github.com/necolas/react-native-web/blob/0.19.1/packages/react-native-web/src/modules/AccessibilityUtil/propsToAccessibilityComponent.js
+     */
+    | 'article' // <article />
+    | 'banner' // <header />
+    | 'blockquote' // <blockquote />
+    | 'button' // <button />
+    | 'code' // <code />
+    | 'complementary' // <aside />
+    | 'contentinfo' // <footer />
+    | 'deletion' // <del />
+    | 'emphasis' // <em />
+    | 'figure' // <figure />
+    | 'form' // <form />
+    | 'heading' // <h{1,6} />
+    | 'insertion' // <ins />
+    | 'label' // <label />
+    | 'list' // <ul />
+    | 'listitem' // <li />
+    | 'main' // <main />
+    | 'navigation' // <nav />
+    | 'paragraph' // <p />
+    | 'region' // <section />
+    | 'strong'; // <strong />
+
+  interface WebAccessibilityProps {
+    /**
+     * Additional accessibility props
+     */
+    tabIndex?: 0 | -1;
+
+    /**
+     * Aria props (additional, minus existants)
+     * @see https://necolas.github.io/react-native-web/docs/accessibility
+     * @see https://reactnative.dev/docs/accessibility#aria-valuemax
+     */
+    'aria-activedescendant'?: string;
+    'aria-atomic'?: boolean;
+    'aria-autocomplete'?: string;
+    'aria-colcount'?: number;
+    'aria-colindex'?: number;
+    'aria-colspan'?: number;
+    'aria-controls'?: string;
+    'aria-current'?: boolean | 'page' | 'step' | 'location' | 'date' | 'time';
+    'aria-describedby'?: string;
+    'aria-details'?: string;
+    'aria-errormessage'?: string;
+    'aria-flowto'?: string;
+    'aria-haspopup'?: string;
+    'aria-invalid'?: boolean;
+    'aria-keyshortcuts'?: string;
+    'aria-level'?: number;
+    'aria-multiline'?: boolean;
+    'aria-multiselectable'?: boolean;
+    'aria-orientation'?: 'horizontal' | 'vertical';
+    'aria-owns'?: string;
+    'aria-placeholder'?: string;
+    'aria-posinset'?: number;
+    'aria-pressed'?: boolean;
+    'aria-readonly'?: boolean;
+    'aria-required'?: boolean;
+    'aria-roledescription'?: string;
+    'aria-rowcount'?: number;
+    'aria-rowindex'?: number;
+    'aria-rowspan'?: number;
+    'aria-setsize'?: number;
+    'aria-sort'?: 'ascending' | 'descending' | 'none' | 'other';
+  }
+
+  export interface PressableStateCallbackType {
+    readonly focused: boolean;
+    readonly hovered: boolean;
+    readonly pressed: boolean;
+  }
+
+  export interface ImageProps extends WebAccessibilityProps {
+    role?: WebRole;
+  }
+
+  export interface TextProps extends WebAccessibilityProps {
+    role?: WebRole;
+  }
+
+  export interface ViewProps extends WebAccessibilityProps {
+    role?: WebRole;
+  }
+
+  export interface ImageStyle {
+    display?: DisplayValue;
+  }
+
+  export interface TextStyle {
+    display?: DisplayValue;
+  }
+
+  export interface ViewStyle {
+    display?: DisplayValue;
+  }
+}

package/src/universal/Button/index.tsx

@@ -1,48 +1,40 @@
-import { useState } from 'react';
-import { Pressable, Text, type ViewStyle } from 'react-native';
+import { Pressable, StyleSheet, Text, type TextStyle, type ViewStyle } from 'react-native';
 
 import type { ButtonProps, ButtonVariant } from './types';
 import { useUniversalLifecycle } from '../hooks';
 
-const variantStyles: Record<ButtonVariant, ViewStyle> = {
-  filled: {
-    backgroundColor: '#007AFF',
+const styles = StyleSheet.create({
+  button: {
     paddingHorizontal: 16,
     paddingVertical: 10,
     borderRadius: 8,
+    userSelect: 'none',
   },
+  disabled: { opacity: 0.5 },
+  hidden: { display: 'none' },
+  label: { textAlign: 'center' },
+});
+
+const variantStyles = StyleSheet.create({
+  filled: { backgroundColor: '#007AFF' },
   outlined: {
-    backgroundColor: 'transparent',
-    paddingHorizontal: 16,
-    paddingVertical: 10,
-    borderRadius: 8,
-    borderWidth: 1,
     borderColor: '#007AFF',
+    borderWidth: 1,
   },
-  text: {
-    backgroundColor: 'transparent',
-    paddingHorizontal: 16,
-    paddingVertical: 10,
-  },
-};
+  text: {},
+} satisfies Record<ButtonVariant, ViewStyle>);
 
-const variantHoverStyles: Record<ButtonVariant, ViewStyle> = {
-  filled: {
-    backgroundColor: '#0066DB',
-  },
-  outlined: {
-    backgroundColor: 'rgba(0, 122, 255, 0.08)',
-  },
-  text: {
-    backgroundColor: 'rgba(0, 122, 255, 0.08)',
-  },
-};
+const variantHoverStyles = StyleSheet.create({
+  filled: { backgroundColor: '#0066DB' },
+  outlined: { backgroundColor: 'rgba(0, 122, 255, 0.08)' },
+  text: { backgroundColor: 'rgba(0, 122, 255, 0.08)' },
+} satisfies Record<ButtonVariant, ViewStyle>);
 
-const variantTextColors: Record<ButtonVariant, string> = {
-  filled: '#FFFFFF',
-  outlined: '#007AFF',
-  text: '#007AFF',
-};
+const variantLabelStyles = StyleSheet.create({
+  filled: { color: '#FFFFFF' },
+  outlined: { color: '#007AFF' },
+  text: { color: '#007AFF' },
+} satisfies Record<ButtonVariant, TextStyle>);
 
 /**
  * A pressable button that supports multiple visual variants.
@@ -55,32 +47,27 @@ export function Button({
   style,
   onAppear,
   onDisappear,
-  disabled,
-  hidden,
+  disabled = false,
+  hidden = false,
   testID,
 }: ButtonProps) {
   useUniversalLifecycle(onAppear, onDisappear);
-  const [hovered, setHovered] = useState(false);
-
-  const pressableStyle: ViewStyle = {
-    ...variantStyles[variant],
-    ...style,
-    ...(hovered && !disabled ? variantHoverStyles[variant] : undefined),
-    ...(hidden ? { display: 'none' } : undefined),
-    ...(disabled ? { opacity: 0.5 } : undefined),
-  };
 
   return (
     <Pressable
-      style={pressableStyle}
+      role="button"
       onPress={onPress}
-      onHoverIn={() => setHovered(true)}
-      onHoverOut={() => setHovered(false)}
       disabled={disabled}
-      testID={testID}>
-      {children ?? (
-        <Text style={{ color: variantTextColors[variant], textAlign: 'center' }}>{label}</Text>
-      )}
+      testID={testID}
+      style={({ hovered }) => [
+        styles.button,
+        variantStyles[variant],
+        style,
+        hovered && !disabled && variantHoverStyles[variant],
+        hidden && styles.hidden,
+        disabled && styles.disabled,
+      ]}>
+      {children ?? <Text style={[styles.label, variantLabelStyles[variant]]}>{label}</Text>}
     </Pressable>
   );
 }

package/src/universal/Checkbox/index.tsx

@@ -1,33 +1,46 @@
+import type { ComponentProps } from 'react';
+import { StyleSheet, Text, unstable_createElement, View, type ViewProps } from 'react-native';
+
 import type { CheckboxProps } from './types';
 
+const styles = StyleSheet.create({
+  label: {
+    flexDirection: 'row',
+    display: 'inline-flex',
+    alignItems: 'center',
+    gap: 8,
+    cursor: 'pointer',
+  },
+  disabled: {
+    opacity: 0.5,
+    cursor: 'auto',
+  },
+  cursorInherit: {
+    // @ts-expect-error
+    cursor: 'inherit',
+  },
+});
+
+const NativeCheckbox = (
+  props: Omit<ComponentProps<'input'>, 'style' | 'type'> & { style?: ViewProps['style'] }
+) => unstable_createElement('input', { ...props, type: 'checkbox' });
+
 /**
  * A toggle control that represents a checked or unchecked state.
  */
-export function Checkbox({ value, onValueChange, label, disabled, testID }: CheckboxProps) {
+export function Checkbox({ value, onValueChange, label, disabled = false, testID }: CheckboxProps) {
   return (
-    <label style={{ ...labelStyle, ...(disabled ? disabledStyle : undefined) }}>
-      <input
-        type="checkbox"
+    <View role="label" aria-disabled={disabled} style={[styles.label, disabled && styles.disabled]}>
+      <NativeCheckbox
         checked={value}
         onChange={(e) => onValueChange(e.target.checked)}
         disabled={disabled}
         data-testid={testID}
+        style={styles.cursorInherit}
       />
-      {label != null && <span>{label}</span>}
-    </label>
+      {label != null && <Text>{label}</Text>}
+    </View>
   );
 }
 
-const labelStyle: React.CSSProperties = {
-  display: 'inline-flex',
-  alignItems: 'center',
-  gap: 8,
-  cursor: 'pointer',
-};
-
-const disabledStyle: React.CSSProperties = {
-  opacity: 0.5,
-  cursor: 'default',
-};
-
 export * from './types';

package/src/universal/Column/index.tsx

@@ -1,14 +1,23 @@
-import { Pressable, View, type ViewStyle } from 'react-native';
+import { Pressable, StyleSheet, View, type ViewStyle } from 'react-native';
 
 import type { ColumnProps } from './types';
 import { useUniversalLifecycle } from '../hooks';
 import type { UniversalAlignment } from '../types';
 
-const alignmentMap: Record<UniversalAlignment, ViewStyle['alignItems']> = {
-  start: 'flex-start',
-  center: 'center',
-  end: 'flex-end',
-};
+const styles = StyleSheet.create({
+  column: { flexDirection: 'column' },
+  hidden: { display: 'none' },
+  disabled: {
+    opacity: 0.5,
+    pointerEvents: 'none',
+  },
+});
+
+const alignmentStyles = StyleSheet.create({
+  start: { alignItems: 'flex-start' },
+  center: { alignItems: 'center' },
+  end: { alignItems: 'flex-end' },
+} satisfies Record<UniversalAlignment, ViewStyle>);
 
 /**
  * A vertical layout container that arranges its children from top to bottom.
@@ -21,25 +30,27 @@ export function Column({
   onPress,
   onAppear,
   onDisappear,
-  disabled,
-  hidden,
+  disabled = false,
+  hidden = false,
   testID,
 }: ColumnProps) {
   useUniversalLifecycle(onAppear, onDisappear);
 
-  const viewStyle: ViewStyle = {
-    flexDirection: 'column',
-    alignItems: alignmentMap[alignment],
-    gap: spacing,
-    ...style,
-    ...(hidden ? { display: 'none' } : undefined),
-    ...(disabled ? { opacity: 0.5, pointerEvents: 'none' } : undefined),
-  };
-
   const Container = onPress ? Pressable : View;
 
   return (
-    <Container style={viewStyle} onPress={onPress} disabled={disabled} testID={testID}>
+    <Container
+      onPress={onPress}
+      disabled={disabled}
+      testID={testID}
+      style={[
+        styles.column,
+        alignmentStyles[alignment],
+        spacing != null && { gap: spacing },
+        style,
+        hidden && styles.hidden,
+        disabled && styles.disabled,
+      ]}>
       {children}
     </Container>
   );