From 7a999b4748f8477ed134c568afdfb57409c43ec1 Mon Sep 17 00:00:00 2001 From: FLGMwt Date: Fri, 29 May 2026 08:34:43 -0500 Subject: [PATCH 1/5] nativewind 4 spike --- babel.config.js | 3 +- global.css | 3 + metro.config.js | 10 +- package-lock.json | 502 ++++++++++++++++++----------- package.json | 2 +- src/components/App.js | 2 + src/components/styledComponents.ts | 29 +- tailwind.config.js | 1 + tsconfig.json | 79 +++-- 9 files changed, 410 insertions(+), 221 deletions(-) create mode 100644 global.css diff --git a/babel.config.js b/babel.config.js index b061354f8d..668e376ea1 100644 --- a/babel.config.js +++ b/babel.config.js @@ -1,11 +1,10 @@ module.exports = { - presets: ["module:@react-native/babel-preset"], + presets: ["module:@react-native/babel-preset", "nativewind/babel"], plugins: [ "babel-plugin-react-compiler", // must run first! "@babel/plugin-transform-export-namespace-from", "react-native-worklets-core/plugin", "transform-inline-environment-variables", - "nativewind/babel", ["module-resolver", { alias: { // constants is a reserved word, so jest won't run if we name the alias constants diff --git a/global.css b/global.css new file mode 100644 index 0000000000..b5c61c9567 --- /dev/null +++ b/global.css @@ -0,0 +1,3 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; diff --git a/metro.config.js b/metro.config.js index b9081b1b79..33e5dfbdfd 100644 --- a/metro.config.js +++ b/metro.config.js @@ -12,6 +12,7 @@ const { withRozenite } = require( "@rozenite/metro" ); const { withRozeniteRequireProfiler, } = require( "@rozenite/require-profiler-plugin/metro" ); +const { withNativeWind } = require( "nativewind/metro" ); const { resolver: { sourceExts, assetExts }, @@ -42,10 +43,17 @@ const config = { watchFolders: [...localPackagePaths], }; -module.exports = withRozenite( +const configWithRozenite = withRozenite( mergeConfig( getDefaultConfig( __dirname ), config ), { enabled: process.env.WITH_ROZENITE === "true", enhanceMetroConfig: config => withRozeniteRequireProfiler( config ), }, ); + +const configWithRozeniteAndNativeWind = withNativeWind( + configWithRozenite, + { input: "./global.css" }, +); + +module.exports = configWithRozeniteAndNativeWind; diff --git a/package-lock.json b/package-lock.json index b669dc74b3..41ded0db18 100644 --- a/package-lock.json +++ b/package-lock.json @@ -62,7 +62,7 @@ "linkifyjs": "^4.3.2", "lodash": "^4.18.1", "markdown-it": "^14.2.0", - "nativewind": "^2.0.11", + "nativewind": "^4.2.4", "react": "19.2.0", "react-dom": "19.1.1", "react-i18next": "^17.0.2", @@ -430,11 +430,13 @@ } }, "node_modules/@babel/helper-module-imports": { - "version": "7.18.6", - "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.18.6.tgz", - "integrity": "sha512-0NFvs3VkuSYbFi1x2Vd6tKrywq+z/cLeYC/RJNFrIX/30Bf5aiGYbtvGXolEktzJH8o5E5KJ3tT+nkxuuZFVlA==", + "version": "7.29.7", + "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.29.7.tgz", + "integrity": "sha512-ejHwrQQYcm9xnTivShn2IDOlIzInN34AXskvq9QicvCtEzq1Vzclu/tKF8Jq1Cg8JG2GL6/EmjgsCT7lXepE3g==", + "license": "MIT", "dependencies": { - "@babel/types": "^7.18.6" + "@babel/traverse": "^7.29.7", + "@babel/types": "^7.29.7" }, "engines": { "node": ">=6.9.0" @@ -1068,20 +1070,6 @@ "@babel/core": "^7.0.0-0" } }, - "node_modules/@babel/plugin-transform-async-to-generator/node_modules/@babel/helper-module-imports": { - "version": "7.27.1", - "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.27.1.tgz", - "integrity": "sha512-0gSFWUPNXNopqtIPQvlD5WgXYI5GY2kP2cCvoT8kczjbfcfuIljTbcWrulD1CIPIX2gt1wghbDy08yE1p+/r3w==", - "devOptional": true, - "license": "MIT", - "dependencies": { - "@babel/traverse": "^7.27.1", - "@babel/types": "^7.27.1" - }, - "engines": { - "node": ">=6.9.0" - } - }, "node_modules/@babel/plugin-transform-block-scoped-functions": { "version": "7.27.1", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-block-scoped-functions/-/plugin-transform-block-scoped-functions-7.27.1.tgz", @@ -1466,20 +1454,6 @@ "@babel/core": "^7.0.0-0" } }, - "node_modules/@babel/plugin-transform-modules-systemjs/node_modules/@babel/helper-module-imports": { - "version": "7.28.6", - "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.28.6.tgz", - "integrity": "sha512-l5XkZK7r7wa9LucGw9LwZyyCUscb4x37JWTPz7swwFE/0FMQAGpiWUZn8u9DzkSBWEcK25jmvubfpw2dnAMdbw==", - "dev": true, - "license": "MIT", - "dependencies": { - "@babel/traverse": "^7.28.6", - "@babel/types": "^7.28.6" - }, - "engines": { - "node": ">=6.9.0" - } - }, "node_modules/@babel/plugin-transform-modules-systemjs/node_modules/@babel/helper-module-transforms": { "version": "7.28.6", "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.28.6.tgz", @@ -1795,19 +1769,6 @@ "@babel/core": "^7.0.0-0" } }, - "node_modules/@babel/plugin-transform-react-jsx/node_modules/@babel/helper-module-imports": { - "version": "7.27.1", - "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.27.1.tgz", - "integrity": "sha512-0gSFWUPNXNopqtIPQvlD5WgXYI5GY2kP2cCvoT8kczjbfcfuIljTbcWrulD1CIPIX2gt1wghbDy08yE1p+/r3w==", - "devOptional": true, - "dependencies": { - "@babel/traverse": "^7.27.1", - "@babel/types": "^7.27.1" - }, - "engines": { - "node": ">=6.9.0" - } - }, "node_modules/@babel/plugin-transform-react-pure-annotations": { "version": "7.27.1", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-pure-annotations/-/plugin-transform-react-pure-annotations-7.27.1.tgz", @@ -1894,19 +1855,6 @@ "@babel/core": "^7.0.0-0" } }, - "node_modules/@babel/plugin-transform-runtime/node_modules/@babel/helper-module-imports": { - "version": "7.27.1", - "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.27.1.tgz", - "integrity": "sha512-0gSFWUPNXNopqtIPQvlD5WgXYI5GY2kP2cCvoT8kczjbfcfuIljTbcWrulD1CIPIX2gt1wghbDy08yE1p+/r3w==", - "devOptional": true, - "dependencies": { - "@babel/traverse": "^7.27.1", - "@babel/types": "^7.27.1" - }, - "engines": { - "node": ">=6.9.0" - } - }, "node_modules/@babel/plugin-transform-shorthand-properties": { "version": "7.27.1", "resolved": "https://registry.npmjs.org/@babel/plugin-transform-shorthand-properties/-/plugin-transform-shorthand-properties-7.27.1.tgz", @@ -8423,6 +8371,12 @@ "url": "https://github.com/sponsors/ljharb" } }, + "node_modules/array-timsort": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/array-timsort/-/array-timsort-1.0.3.tgz", + "integrity": "sha512-/+3GRL7dDAGEfM6TseQk/U+mi18TU2Ms9I3UlLdUMhz2hbvGNTKdj9xniwXfUqgYhHxRx0+8UnKkvlNwVU+cWQ==", + "license": "MIT" + }, "node_modules/array.prototype.findlast": { "version": "1.2.5", "resolved": "https://registry.npmjs.org/array.prototype.findlast/-/array.prototype.findlast-1.2.5.tgz", @@ -9773,6 +9727,19 @@ "node": "^12.20.0 || >=14" } }, + "node_modules/comment-json": { + "version": "4.6.2", + "resolved": "https://registry.npmjs.org/comment-json/-/comment-json-4.6.2.tgz", + "integrity": "sha512-R2rze/hDX30uul4NZoIZ76ImSJLFxn/1/ZxtKC1L77y2X1k+yYu1joKbAtMA2Fg3hZrTOiw0I5mwVMo0cf250w==", + "license": "MIT", + "dependencies": { + "array-timsort": "^1.0.3", + "esprima": "^4.0.1" + }, + "engines": { + "node": ">= 6" + } + }, "node_modules/commondir": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/commondir/-/commondir-1.0.1.tgz", @@ -10136,11 +10103,6 @@ "node": ">=4" } }, - "node_modules/css-mediaquery": { - "version": "0.1.2", - "resolved": "https://registry.npmjs.org/css-mediaquery/-/css-mediaquery-0.1.2.tgz", - "integrity": "sha512-COtn4EROW5dBGlE/4PiKnh6rZpAPxDeFLaEEwt4i10jpDMFt2EhQGS79QmmrO+iKCHv0PU/HrOWEhijFd1x99Q==" - }, "node_modules/css-select": { "version": "5.1.0", "resolved": "https://registry.npmjs.org/css-select/-/css-select-5.1.0.tgz", @@ -12808,11 +12770,6 @@ "url": "https://opencollective.com/express" } }, - "node_modules/extend": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz", - "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==" - }, "node_modules/factoria": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/factoria/-/factoria-4.0.1.tgz", @@ -16529,6 +16486,246 @@ "integrity": "sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==", "license": "MIT" }, + "node_modules/lightningcss": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.27.0.tgz", + "integrity": "sha512-8f7aNmS1+etYSLHht0fQApPc2kNO8qGRutifN5rVIc6Xo6ABsEbqOr758UwI7ALVbTt4x1fllKt0PYgzD9S3yQ==", + "license": "MPL-2.0", + "dependencies": { + "detect-libc": "^1.0.3" + }, + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + }, + "optionalDependencies": { + "lightningcss-darwin-arm64": "1.27.0", + "lightningcss-darwin-x64": "1.27.0", + "lightningcss-freebsd-x64": "1.27.0", + "lightningcss-linux-arm-gnueabihf": "1.27.0", + "lightningcss-linux-arm64-gnu": "1.27.0", + "lightningcss-linux-arm64-musl": "1.27.0", + "lightningcss-linux-x64-gnu": "1.27.0", + "lightningcss-linux-x64-musl": "1.27.0", + "lightningcss-win32-arm64-msvc": "1.27.0", + "lightningcss-win32-x64-msvc": "1.27.0" + } + }, + "node_modules/lightningcss-darwin-arm64": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.27.0.tgz", + "integrity": "sha512-Gl/lqIXY+d+ySmMbgDf0pgaWSqrWYxVHoc88q+Vhf2YNzZ8DwoRzGt5NZDVqqIW5ScpSnmmjcgXP87Dn2ylSSQ==", + "cpu": [ + "arm64" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-darwin-x64": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.27.0.tgz", + "integrity": "sha512-0+mZa54IlcNAoQS9E0+niovhyjjQWEMrwW0p2sSdLRhLDc8LMQ/b67z7+B5q4VmjYCMSfnFi3djAAQFIDuj/Tg==", + "cpu": [ + "x64" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "darwin" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-freebsd-x64": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.27.0.tgz", + "integrity": "sha512-n1sEf85fePoU2aDN2PzYjoI8gbBqnmLGEhKq7q0DKLj0UTVmOTwDC7PtLcy/zFxzASTSBlVQYJUhwIStQMIpRA==", + "cpu": [ + "x64" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "freebsd" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-arm-gnueabihf": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.27.0.tgz", + "integrity": "sha512-MUMRmtdRkOkd5z3h986HOuNBD1c2lq2BSQA1Jg88d9I7bmPGx08bwGcnB75dvr17CwxjxD6XPi3Qh8ArmKFqCA==", + "cpu": [ + "arm" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-arm64-gnu": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.27.0.tgz", + "integrity": "sha512-cPsxo1QEWq2sfKkSq2Bq5feQDHdUEwgtA9KaB27J5AX22+l4l0ptgjMZZtYtUnteBofjee+0oW1wQ1guv04a7A==", + "cpu": [ + "arm64" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-arm64-musl": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.27.0.tgz", + "integrity": "sha512-rCGBm2ax7kQ9pBSeITfCW9XSVF69VX+fm5DIpvDZQl4NnQoMQyRwhZQm9pd59m8leZ1IesRqWk2v/DntMo26lg==", + "cpu": [ + "arm64" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-x64-gnu": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.27.0.tgz", + "integrity": "sha512-Dk/jovSI7qqhJDiUibvaikNKI2x6kWPN79AQiD/E/KeQWMjdGe9kw51RAgoWFDi0coP4jinaH14Nrt/J8z3U4A==", + "cpu": [ + "x64" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-linux-x64-musl": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.27.0.tgz", + "integrity": "sha512-QKjTxXm8A9s6v9Tg3Fk0gscCQA1t/HMoF7Woy1u68wCk5kS4fR+q3vXa1p3++REW784cRAtkYKrPy6JKibrEZA==", + "cpu": [ + "x64" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "linux" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-win32-arm64-msvc": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.27.0.tgz", + "integrity": "sha512-/wXegPS1hnhkeG4OXQKEMQeJd48RDC3qdh+OA8pCuOPCyvnm/yEayrJdJVqzBsqpy1aJklRCVxscpFur80o6iQ==", + "cpu": [ + "arm64" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss-win32-x64-msvc": { + "version": "1.27.0", + "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.27.0.tgz", + "integrity": "sha512-/OJLj94Zm/waZShL8nB5jsNj3CfNATLCTyFxZyouilfTmSoLDX7VlVAmhPHoZWVFp4vdmoiEbPEYC8HID3m6yw==", + "cpu": [ + "x64" + ], + "license": "MPL-2.0", + "optional": true, + "os": [ + "win32" + ], + "engines": { + "node": ">= 12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/parcel" + } + }, + "node_modules/lightningcss/node_modules/detect-libc": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz", + "integrity": "sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==", + "license": "Apache-2.0", + "bin": { + "detect-libc": "bin/detect-libc.js" + }, + "engines": { + "node": ">=0.10" + } + }, "node_modules/lilconfig": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz", @@ -17752,49 +17949,22 @@ "integrity": "sha512-GEbrYkbfF7MoNaoh2iGG84Mnf/WZfB0GdGEsM8wz7Expx/LlWf5U8t9nvJKXSp3qr5IsEbK04cBGhol/KwOsWA==" }, "node_modules/nativewind": { - "version": "2.0.11", - "resolved": "https://registry.npmjs.org/nativewind/-/nativewind-2.0.11.tgz", - "integrity": "sha512-qCEXUwKW21RYJ33KRAJl3zXq2bCq82WoI564fI21D/TiqhfmstZOqPN53RF8qK1NDK6PGl56b2xaTxgObEePEg==", - "dependencies": { - "@babel/generator": "^7.18.7", - "@babel/helper-module-imports": "7.18.6", - "@babel/types": "7.19.0", - "css-mediaquery": "^0.1.2", - "css-to-react-native": "^3.0.0", - "micromatch": "^4.0.5", - "postcss": "^8.4.12", - "postcss-calc": "^8.2.4", - "postcss-color-functional-notation": "^4.2.2", - "postcss-css-variables": "^0.18.0", - "postcss-nested": "^5.0.6", - "react-is": "^18.1.0", - "use-sync-external-store": "^1.1.0" + "version": "4.2.4", + "resolved": "https://registry.npmjs.org/nativewind/-/nativewind-4.2.4.tgz", + "integrity": "sha512-PRO7X5a5cnmJD5ryijqeDJhmtabfbbZiPLk3ItTtL7trDzH3uWOv7kPJIqm6L0QFH98m2ynZ55DRPe3AETEOAQ==", + "license": "MIT", + "dependencies": { + "comment-json": "^4.2.5", + "debug": "^4.3.7", + "react-native-css-interop": "0.2.4" }, "engines": { - "node": ">=14.18" + "node": ">=16" }, "peerDependencies": { - "tailwindcss": "~3" - } - }, - "node_modules/nativewind/node_modules/@babel/types": { - "version": "7.19.0", - "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.19.0.tgz", - "integrity": "sha512-YuGopBq3ke25BVSiS6fgF49Ul9gH1x70Bcr6bqRLjWCkcX8Hre1/5+z+IiWOIerRMSSEfGZVB9z9kyq7wVs9YA==", - "dependencies": { - "@babel/helper-string-parser": "^7.18.10", - "@babel/helper-validator-identifier": "^7.18.6", - "to-fast-properties": "^2.0.0" - }, - "engines": { - "node": ">=6.9.0" + "tailwindcss": ">3.3.0" } }, - "node_modules/nativewind/node_modules/react-is": { - "version": "18.2.0", - "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.2.0.tgz", - "integrity": "sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==" - }, "node_modules/natural-compare": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz", @@ -19009,57 +19179,6 @@ "node": "^10 || ^12 || >=14" } }, - "node_modules/postcss-calc": { - "version": "8.2.4", - "resolved": "https://registry.npmjs.org/postcss-calc/-/postcss-calc-8.2.4.tgz", - "integrity": "sha512-SmWMSJmB8MRnnULldx0lQIyhSNvuDl9HfrZkaqqE/WHAhToYsAvDq+yAsA/kIyINDszOp3Rh0GFoNuH5Ypsm3Q==", - "dependencies": { - "postcss-selector-parser": "^6.0.9", - "postcss-value-parser": "^4.2.0" - }, - "peerDependencies": { - "postcss": "^8.2.2" - } - }, - "node_modules/postcss-color-functional-notation": { - "version": "4.2.4", - "resolved": "https://registry.npmjs.org/postcss-color-functional-notation/-/postcss-color-functional-notation-4.2.4.tgz", - "integrity": "sha512-2yrTAUZUab9s6CpxkxC4rVgFEVaR6/2Pipvi6qcgvnYiVqZcbDHEoBDhrXzyb7Efh2CCfHQNtcqWcIruDTIUeg==", - "dependencies": { - "postcss-value-parser": "^4.2.0" - }, - "engines": { - "node": "^12 || ^14 || >=16" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/csstools" - }, - "peerDependencies": { - "postcss": "^8.2" - } - }, - "node_modules/postcss-css-variables": { - "version": "0.18.0", - "resolved": "https://registry.npmjs.org/postcss-css-variables/-/postcss-css-variables-0.18.0.tgz", - "integrity": "sha512-lYS802gHbzn1GI+lXvy9MYIYDuGnl1WB4FTKoqMQqJ3Mab09A7a/1wZvGTkCEZJTM8mSbIyb1mJYn8f0aPye0Q==", - "dependencies": { - "balanced-match": "^1.0.0", - "escape-string-regexp": "^1.0.3", - "extend": "^3.0.1" - }, - "peerDependencies": { - "postcss": "^8.2.6" - } - }, - "node_modules/postcss-css-variables/node_modules/escape-string-regexp": { - "version": "1.0.5", - "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz", - "integrity": "sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==", - "engines": { - "node": ">=0.8.0" - } - }, "node_modules/postcss-import": { "version": "15.1.0", "resolved": "https://registry.npmjs.org/postcss-import/-/postcss-import-15.1.0.tgz", @@ -19122,24 +19241,6 @@ } } }, - "node_modules/postcss-nested": { - "version": "5.0.6", - "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-5.0.6.tgz", - "integrity": "sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA==", - "dependencies": { - "postcss-selector-parser": "^6.0.6" - }, - "engines": { - "node": ">=12.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/postcss/" - }, - "peerDependencies": { - "postcss": "^8.2.14" - } - }, "node_modules/postcss-selector-parser": { "version": "6.0.11", "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz", @@ -19734,6 +19835,49 @@ "node": ">=10" } }, + "node_modules/react-native-css-interop": { + "version": "0.2.4", + "resolved": "https://registry.npmjs.org/react-native-css-interop/-/react-native-css-interop-0.2.4.tgz", + "integrity": "sha512-ATP3BACxGM4h/l8cisFauGMGxnXpu8Bcp4Bc3O7iNZpq7j0VJjc1RRRBUSBY4C4WuI7VA/xvp3puijVS9d95rg==", + "license": "MIT", + "dependencies": { + "@babel/helper-module-imports": "^7.22.15", + "@babel/traverse": "^7.23.0", + "@babel/types": "^7.23.0", + "debug": "^4.3.7", + "lightningcss": "~1.27.0", + "semver": "^7.6.3" + }, + "engines": { + "node": ">=18" + }, + "peerDependencies": { + "react": ">=18", + "react-native": "*", + "react-native-reanimated": ">=3.6.2", + "tailwindcss": "~3" + }, + "peerDependenciesMeta": { + "react-native-safe-area-context": { + "optional": true + }, + "react-native-svg": { + "optional": true + } + } + }, + "node_modules/react-native-css-interop/node_modules/semver": { + "version": "7.8.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.1.tgz", + "integrity": "sha512-rkVq3IXh+4FDGch+KwzX3aV9W3kO54GyEgpvBzSyctDA6Xtd7RJQV1xmXbeQp5v7+VzLOfVqiutSE6GICgPFvg==", + "license": "ISC", + "bin": { + "semver": "bin/semver.js" + }, + "engines": { + "node": ">=10" + } + }, "node_modules/react-native-device-info": { "version": "15.0.1", "resolved": "https://registry.npmjs.org/react-native-device-info/-/react-native-device-info-15.0.1.tgz", @@ -22477,14 +22621,6 @@ "integrity": "sha512-lx9B5iv7msuFYE3dytT+KE5tap+rNYw+K4jVkb9R/asAb+pbBSM17jtunHplhBe6RRJdZx3Pn2Jph24O32mOVg==", "dev": true }, - "node_modules/to-fast-properties": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", - "integrity": "sha512-/OaKK0xYrs3DmxRYqL/yDc+FxFUVYhDlXMhRmv3z915w2HF1tnN1omB354j8VUGO/hbRzyD6Y3sA7v7GS/ceog==", - "engines": { - "node": ">=4" - } - }, "node_modules/to-regex-range": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", diff --git a/package.json b/package.json index a1b4810c88..e7e62127ad 100644 --- a/package.json +++ b/package.json @@ -99,7 +99,7 @@ "linkifyjs": "^4.3.2", "lodash": "^4.18.1", "markdown-it": "^14.2.0", - "nativewind": "^2.0.11", + "nativewind": "^4.2.4", "react": "19.2.0", "react-dom": "19.1.1", "react-i18next": "^17.0.2", diff --git a/src/components/App.js b/src/components/App.js index 73edc10c1f..6060b4b122 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -1,5 +1,7 @@ // @flow +import "../../global.css"; + import { useNavigation } from "@react-navigation/native"; import RootStackNavigator from "navigation/RootStackNavigator"; import type { Node } from "react"; diff --git a/src/components/styledComponents.ts b/src/components/styledComponents.ts index 30082b1925..52f3269cee 100644 --- a/src/components/styledComponents.ts +++ b/src/components/styledComponents.ts @@ -4,7 +4,6 @@ import { } from "@gorhom/bottom-sheet"; import UnstyledPressableWithTracking from "components/SharedComponents/Buttons/PressableWithTracking"; -import { styled } from "nativewind"; import { Image as UnstyledImage, ImageBackground as UnstyledImageBackground, @@ -19,29 +18,29 @@ import { import UnstyledLinearGradient from "react-native-linear-gradient"; import { SafeAreaView as UnstyledSafeAreaView } from "react-native-safe-area-context"; -const View = styled( UnstyledView ); -const KeyboardAvoidingView = styled( UnstyledKeyboardAvoidingView ); +const View = UnstyledView; +const KeyboardAvoidingView = UnstyledKeyboardAvoidingView; // Since upgrading to React Native 0.73 UnstyledSafeAreaView is undefined in the jest tests // Why I don't know. This is just to fix the failing tests. -const SafeAreaView = styled( UnstyledSafeAreaView === undefined +const SafeAreaView = UnstyledSafeAreaView === undefined ? UnstyledView - : UnstyledSafeAreaView ); -const ScrollView = styled( UnstyledScrollView ); -const Text = styled( UnstyledText ); -const TextInput = styled( UntyledTextInput ); -const Pressable = styled( UnstyledPressableWithTracking ); -const Image = styled( UnstyledImage ); -const BottomSheetTextInput = styled( StyledBottomSheetTextInput ); -const Modal = styled( UnstyledModal ); -const ImageBackground = styled( UnstyledImageBackground ); + : UnstyledSafeAreaView; +const ScrollView = UnstyledScrollView; +const Text = UnstyledText; +const TextInput = UntyledTextInput; +const Pressable = UnstyledPressableWithTracking; +const Image = UnstyledImage; +const BottomSheetTextInput = StyledBottomSheetTextInput; +const Modal = UnstyledModal; +const ImageBackground = UnstyledImageBackground; const fontMonoClass: string = ( Platform.OS === "ios" ? "font-Menlo" : "font-monospace" ); -const LinearGradient = styled( UnstyledLinearGradient ); +const LinearGradient = UnstyledLinearGradient; -const FasterImageView = styled( UnstyledFasterImageView ); +const FasterImageView = UnstyledFasterImageView; export { BottomSheetTextInput, diff --git a/tailwind.config.js b/tailwind.config.js index 1176c32ddd..ddc231c193 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -4,6 +4,7 @@ const setLineHeight = lineHeight => ( { lineHeight } ); module.exports = { content: ["./src/**/*.{js,jsx,ts,tsx}"], + presets: [require( "nativewind/preset" )], theme: { extend: { letterSpacing: { diff --git a/tsconfig.json b/tsconfig.json index 1e77773ef5..482e98f60a 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -4,25 +4,66 @@ "baseUrl": ".", "moduleResolution": "bundler", "paths": { - "*": ["src/*"], - "appConstants": ["src/appConstants"], - "api": ["src/api"], - "components": ["src/components"], - "dictionaries": ["src/dictionaries"], - "i18n": ["src/i18n"], - "images": ["src/images"], - "navigation": ["src/navigation"], - "providers": ["src/providers"], - "realmModels": ["src/realmModels"], - "sharedHelpers": ["src/sharedHelpers"], - "sharedHooks": ["src/sharedHooks"], - "stores": ["src/stores"], - "styles": ["src/styles"], - "tests": ["tests"], + "*": [ + "src/*" + ], + "appConstants": [ + "src/appConstants" + ], + "api": [ + "src/api" + ], + "components": [ + "src/components" + ], + "dictionaries": [ + "src/dictionaries" + ], + "i18n": [ + "src/i18n" + ], + "images": [ + "src/images" + ], + "navigation": [ + "src/navigation" + ], + "providers": [ + "src/providers" + ], + "realmModels": [ + "src/realmModels" + ], + "sharedHelpers": [ + "src/sharedHelpers" + ], + "sharedHooks": [ + "src/sharedHooks" + ], + "stores": [ + "src/stores" + ], + "styles": [ + "src/styles" + ], + "tests": [ + "tests" + ] }, "strict": true, - "types": ["nativewind/types", "jest"], + "types": [ + "nativewind/types", + "jest" + ] }, - "include": ["**/*.ts", "**/*.tsx"], - "exclude": ["flow-typed", "**/node_modules", "**/Pods"] -} + "include": [ + "**/*.ts", + "**/*.tsx", + "nativewind-env.d.ts" + ], + "exclude": [ + "flow-typed", + "**/node_modules", + "**/Pods" + ] +} \ No newline at end of file From 0ffc9756438ca0dc3b79136a3711b4b5220426ae Mon Sep 17 00:00:00 2001 From: FLGMwt Date: Fri, 10 Jul 2026 11:26:11 -0500 Subject: [PATCH 2/5] themed and cssInterop fixes --- .gitignore | 3 + jest.config.ts | 2 + metro.config.js | 7 +- package-lock.json | 337 ++--- package.json | 5 +- .../AddObsBottomSheet/AddObsBottomSheet.tsx | 2 +- src/components/Camera/FadeInOutView.tsx | 14 +- src/components/Camera/FocusSquare.tsx | 15 +- .../Camera/RotatableIconWrapper.tsx | 13 +- src/components/Match/PhotosSection.tsx | 8 +- src/components/MyObservations/LoginBanner.tsx | 2 +- .../MyObservationsEmptySimple.js | 8 +- .../Search/SearchedTaxonBanner.tsx | 4 +- .../Notifications/ObsNotification.tsx | 6 +- src/components/ObsDetails/DQAContainer.js | 4 +- .../ObsDetails/DataQualityAssessment.tsx | 10 +- .../ObsDetails/DetailsTab/DQAVoteButtons.js | 2 +- .../ObsDetails/DetailsTab/DetailsTab.js | 6 +- .../ObsDetails/DetailsTab/LocationSection.tsx | 2 +- .../ObsDetails/Sheets/AgreeWithIDSheet.js | 2 +- .../ObsDetails/Sheets/WithdrawIDSheet.js | 2 +- .../ActivityTab/ActivityHeader.js | 4 +- .../Sheets/AgreeWithIDSheet.js | 2 +- .../Sheets/SuggestIDSheet.tsx | 2 +- .../Onboarding/OnboardingCarousel.js | 10 +- .../SharedComponents/Buttons/Button.tsx | 8 +- .../Buttons/INatIconButton.tsx | 29 +- src/components/SharedComponents/KebabMenu.tsx | 4 +- src/components/SharedComponents/Map/Map.tsx | 5 + .../ObsDetails/ContentWithIcon.tsx | 2 +- .../SharedComponents/ObservationLocation.tsx | 4 +- .../SharedComponents/Sheets/TextInputSheet.js | 2 +- .../SharedComponents/TaxonSearch.tsx | 2 +- .../SharedComponents/Typography/Body1.tsx | 3 +- .../SharedComponents/Typography/Body2.tsx | 3 +- .../SharedComponents/Typography/Body3.tsx | 3 +- .../SharedComponents/Typography/Body4.tsx | 3 +- .../SharedComponents/Typography/Heading1.tsx | 8 +- .../SharedComponents/Typography/Heading2.tsx | 3 +- .../SharedComponents/Typography/Heading3.tsx | 3 +- .../SharedComponents/Typography/Heading4.tsx | 8 +- .../SharedComponents/Typography/Heading5.tsx | 8 +- .../SharedComponents/Typography/Heading6.tsx | 8 +- .../SharedComponents/Typography/InatText.tsx | 46 +- .../SharedComponents/Typography/List2.tsx | 13 +- .../SharedComponents/Typography/P.tsx | 3 +- .../Typography/Subheading1.tsx | 3 +- .../Typography/Subheading2.tsx | 3 +- .../Typography/UnderlinedLink.tsx | 8 +- .../SharedComponents/ViewWrapper.tsx | 7 +- src/components/styledComponents.ts | 12 +- src/navigation/FadeInView.tsx | 7 +- tests/helpers/mockMortalForIntegration.js | 5 +- tests/jest.globalSetup.js | 24 + tests/jest.setup.js | 11 +- tests/mocks/cssMock.js | 3 + tests/nativewind.setup.js | 28 + .../__snapshots__/AddObsButton.test.js.snap | 721 +++-------- .../__snapshots__/CustomTabBar.test.js.snap | 1143 +++++------------ .../__snapshots__/PhotoCarousel.test.js.snap | 689 +++------- .../__snapshots__/ActivityCount.test.js.snap | 49 +- .../__snapshots__/CommentsCount.test.js.snap | 150 +-- .../IdentificationsCount.test.js.snap | 150 +-- .../__snapshots__/Button.dark.test.js.snap | 768 +++-------- .../Buttons/__snapshots__/Button.test.js.snap | 768 +++-------- .../ContainedSquareButton.test.js.snap | 72 +- .../__snapshots__/INatIconButton.test.js.snap | 39 +- .../__snapshots__/Divider.test.js.snap | 14 +- .../__snapshots__/InlineUser.test.js.snap | 201 +-- .../__snapshots__/ObsGridItem.test.js.snap | 378 ++---- .../__snapshots__/PhotoCount.test.js.snap | 76 +- .../Tabs/__snapshots__/Tabs.test.js.snap | 170 +-- .../__snapshots__/Body1.test.js.snap | 29 +- .../__snapshots__/Body2.test.js.snap | 29 +- .../__snapshots__/Body3.test.js.snap | 29 +- .../__snapshots__/Body4.test.js.snap | 29 +- .../__snapshots__/Heading1.test.js.snap | 33 +- .../__snapshots__/Heading2.test.js.snap | 29 +- .../__snapshots__/Heading3.test.js.snap | 29 +- .../__snapshots__/Heading4.test.js.snap | 33 +- .../__snapshots__/Heading5.test.js.snap | 33 +- .../__snapshots__/List2.test.js.snap | 18 +- .../__snapshots__/Subheading1.test.js.snap | 29 +- .../__snapshots__/Subheading2.test.js.snap | 29 +- .../__snapshots__/UploadStatus.test.js.snap | 279 ++-- .../__snapshots__/TaxonResult.test.js.snap | 467 ++----- .../__snapshots__/UserIcon.test.js.snap | 71 +- .../unit/components/UserText/UserText.test.js | 8 +- 88 files changed, 2147 insertions(+), 5166 deletions(-) create mode 100644 tests/mocks/cssMock.js create mode 100644 tests/nativewind.setup.js diff --git a/.gitignore b/.gitignore index fdc770e2fb..15042fce93 100644 --- a/.gitignore +++ b/.gitignore @@ -117,3 +117,6 @@ artifacts/ # Rubocop cache **/tmp/rubocop_cache + +# Compiled tailwind CSS for jest (tests/jest.globalSetup.js) +tests/.cache/ diff --git a/jest.config.ts b/jest.config.ts index d36123368d..5ebc779c5f 100644 --- a/jest.config.ts +++ b/jest.config.ts @@ -8,12 +8,14 @@ const ignorePatterns = "node_modules/(?!(jest-)?@react-native|react-native|" const config: Config = { moduleNameMapper: { "\\.svg": "/tests/mocks/svgMock.js", + "\\.css$": "/tests/mocks/cssMock.js", }, preset: "react-native", setupFiles: [ "./node_modules/react-native-gesture-handler/jestSetup.js", "./node_modules/@react-native-google-signin/google-signin/jest/build/jest/setup.js", "/tests/jest.setup.js", + "/tests/nativewind.setup.js", ], globalSetup: "/tests/jest.globalSetup.js", setupFilesAfterEnv: [ diff --git a/metro.config.js b/metro.config.js index 33e5dfbdfd..680a0d7db9 100644 --- a/metro.config.js +++ b/metro.config.js @@ -53,7 +53,12 @@ const configWithRozenite = withRozenite( const configWithRozeniteAndNativeWind = withNativeWind( configWithRozenite, - { input: "./global.css" }, + { + input: "./global.css", + // nativewind 4 defaults to 14px per rem; nativewind 2 used 16px, and all + // of our rem-based spacing was designed against that + inlineRem: 16, + }, ); module.exports = configWithRozeniteAndNativeWind; diff --git a/package-lock.json b/package-lock.json index 41ded0db18..09963c6211 100644 --- a/package-lock.json +++ b/package-lock.json @@ -62,7 +62,7 @@ "linkifyjs": "^4.3.2", "lodash": "^4.18.1", "markdown-it": "^14.2.0", - "nativewind": "^4.2.4", + "nativewind": "^4.2.6", "react": "19.2.0", "react-dom": "19.1.1", "react-i18next": "^17.0.2", @@ -115,6 +115,7 @@ "react-native-worklets-core": "^1.6.3", "realm": "^20.2.0", "sanitize-html": "^2.17.4", + "tailwind-merge": "^3.6.0", "uuid": "^11.1.1", "vision-camera-plugin-inatvision": "github:inaturalist/vision-camera-plugin-inatvision#e8c4782cee82e781e8dc7016fffedbbd95070931", "zustand": "^4.5.7" @@ -185,7 +186,7 @@ "react-native-config-node": "^0.0.3", "react-test-renderer": "19.2.0", "reassure": "^1.4.1", - "tailwindcss": "^3.3.2", + "tailwindcss": "^3.4.17", "ts-node": "^10.9.2", "typescript": "^5.8.3", "yargs": "^17.7.2" @@ -2594,7 +2595,7 @@ "version": "0.8.1", "resolved": "https://registry.npmjs.org/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz", "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==", - "devOptional": true, + "dev": true, "dependencies": { "@jridgewell/trace-mapping": "0.3.9" }, @@ -2606,7 +2607,7 @@ "version": "0.3.9", "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz", "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==", - "devOptional": true, + "dev": true, "dependencies": { "@jridgewell/resolve-uri": "^3.0.3", "@jridgewell/sourcemap-codec": "^1.4.10" @@ -4291,14 +4292,6 @@ "node": ">=6.0.0" } }, - "node_modules/@jridgewell/set-array": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.2.1.tgz", - "integrity": "sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==", - "engines": { - "node": ">=6.0.0" - } - }, "node_modules/@jridgewell/source-map": { "version": "0.3.11", "resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.11.tgz", @@ -7388,25 +7381,25 @@ "version": "1.0.11", "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.11.tgz", "integrity": "sha512-DcRjDCujK/kCk/cUe8Xz8ZSpm8mS3mNNpta+jGCA6USEDfktlNvm1+IuZ9eTcDbNk41BHwpHHeW+N1lKCz4zOw==", - "devOptional": true + "dev": true }, "node_modules/@tsconfig/node12": { "version": "1.0.11", "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz", "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==", - "devOptional": true + "dev": true }, "node_modules/@tsconfig/node14": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz", "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==", - "devOptional": true + "dev": true }, "node_modules/@tsconfig/node16": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz", "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==", - "devOptional": true + "dev": true }, "node_modules/@types/babel__core": { "version": "7.20.5", @@ -8171,7 +8164,7 @@ "version": "8.3.2", "resolved": "https://registry.npmjs.org/acorn-walk/-/acorn-walk-8.3.2.tgz", "integrity": "sha512-cjkyv4OtNCIeqhHrfS81QWXoCBPExR/J62oyEqepVw8WaQeSqpW2uhuLPh1m9eWhDuOo/jUXVTlifvesOWp/4A==", - "devOptional": true, + "dev": true, "engines": { "node": ">=0.4.0" } @@ -8280,7 +8273,8 @@ "node_modules/any-promise": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/any-promise/-/any-promise-1.3.0.tgz", - "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==" + "integrity": "sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==", + "license": "MIT" }, "node_modules/anymatch": { "version": "3.1.2", @@ -8953,11 +8947,15 @@ } }, "node_modules/binary-extensions": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz", - "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz", + "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==", + "license": "MIT", "engines": { "node": ">=8" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" } }, "node_modules/bl": { @@ -9440,15 +9438,10 @@ } }, "node_modules/chokidar": { - "version": "3.5.3", - "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz", - "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==", - "funding": [ - { - "type": "individual", - "url": "https://paulmillr.com/funding/" - } - ], + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", + "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==", + "license": "MIT", "dependencies": { "anymatch": "~3.1.2", "braces": "~3.0.2", @@ -9461,6 +9454,9 @@ "engines": { "node": ">= 8.10.0" }, + "funding": { + "url": "https://paulmillr.com/funding/" + }, "optionalDependencies": { "fsevents": "~2.3.2" } @@ -10070,7 +10066,7 @@ "version": "1.1.1", "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz", "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==", - "devOptional": true + "dev": true }, "node_modules/cross-fetch": { "version": "3.1.5", @@ -10207,6 +10203,7 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/cssesc/-/cssesc-3.0.0.tgz", "integrity": "sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==", + "license": "MIT", "bin": { "cssesc": "bin/cssesc" }, @@ -11079,7 +11076,7 @@ "version": "4.0.2", "resolved": "https://registry.npmjs.org/diff/-/diff-4.0.2.tgz", "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==", - "devOptional": true, + "dev": true, "engines": { "node": ">=0.3.1" } @@ -11700,23 +11697,6 @@ "ms": "^2.1.1" } }, - "node_modules/eslint-import-resolver-node/node_modules/resolve": { - "version": "1.22.8", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.8.tgz", - "integrity": "sha512-oKWePCxqpd6FlLvGV1VU0x7bkPmmCNolxzjMf4NczoDnQcIWrAF+cPtZn5i6n+RfD2d9i0tzpKnG6Yk168yIyw==", - "dev": true, - "dependencies": { - "is-core-module": "^2.13.0", - "path-parse": "^1.0.7", - "supports-preserve-symlinks-flag": "^1.0.0" - }, - "bin": { - "resolve": "bin/resolve" - }, - "funding": { - "url": "https://github.com/sponsors/ljharb" - } - }, "node_modules/eslint-module-utils": { "version": "2.13.0", "resolved": "https://registry.npmjs.org/eslint-module-utils/-/eslint-module-utils-2.13.0.tgz", @@ -14186,6 +14166,7 @@ "version": "2.1.0", "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz", "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==", + "license": "MIT", "dependencies": { "binary-extensions": "^2.0.0" }, @@ -16189,9 +16170,10 @@ } }, "node_modules/jiti": { - "version": "1.21.0", - "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.0.tgz", - "integrity": "sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==", + "version": "1.21.7", + "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz", + "integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==", + "license": "MIT", "bin": { "jiti": "bin/jiti.js" } @@ -16601,6 +16583,9 @@ "cpu": [ "arm64" ], + "libc": [ + "glibc" + ], "license": "MPL-2.0", "optional": true, "os": [ @@ -16621,6 +16606,9 @@ "cpu": [ "arm64" ], + "libc": [ + "musl" + ], "license": "MPL-2.0", "optional": true, "os": [ @@ -16641,6 +16629,9 @@ "cpu": [ "x64" ], + "libc": [ + "glibc" + ], "license": "MPL-2.0", "optional": true, "os": [ @@ -16661,6 +16652,9 @@ "cpu": [ "x64" ], + "libc": [ + "musl" + ], "license": "MPL-2.0", "optional": true, "os": [ @@ -16727,11 +16721,15 @@ } }, "node_modules/lilconfig": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-2.1.0.tgz", - "integrity": "sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==", + "version": "3.1.3", + "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.3.tgz", + "integrity": "sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==", + "license": "MIT", "engines": { - "node": ">=10" + "node": ">=14" + }, + "funding": { + "url": "https://github.com/sponsors/antonk52" } }, "node_modules/lines-and-columns": { @@ -17111,7 +17109,7 @@ "version": "1.3.6", "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz", "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==", - "devOptional": true + "dev": true }, "node_modules/makeerror": { "version": "1.0.12", @@ -17902,6 +17900,7 @@ "version": "2.7.0", "resolved": "https://registry.npmjs.org/mz/-/mz-2.7.0.tgz", "integrity": "sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==", + "license": "MIT", "dependencies": { "any-promise": "^1.0.0", "object-assign": "^4.0.1", @@ -17949,14 +17948,14 @@ "integrity": "sha512-GEbrYkbfF7MoNaoh2iGG84Mnf/WZfB0GdGEsM8wz7Expx/LlWf5U8t9nvJKXSp3qr5IsEbK04cBGhol/KwOsWA==" }, "node_modules/nativewind": { - "version": "4.2.4", - "resolved": "https://registry.npmjs.org/nativewind/-/nativewind-4.2.4.tgz", - "integrity": "sha512-PRO7X5a5cnmJD5ryijqeDJhmtabfbbZiPLk3ItTtL7trDzH3uWOv7kPJIqm6L0QFH98m2ynZ55DRPe3AETEOAQ==", + "version": "4.2.6", + "resolved": "https://registry.npmjs.org/nativewind/-/nativewind-4.2.6.tgz", + "integrity": "sha512-kLPRH3Yh/hhIFufXzUZDe39fuK471GwaPBCqYNgcRygILr+obV+wFfDmG+zaJnniVUFFQzYOTCEldem6XktZ+A==", "license": "MIT", "dependencies": { "comment-json": "^4.2.5", "debug": "^4.3.7", - "react-native-css-interop": "0.2.4" + "react-native-css-interop": "0.2.6" }, "engines": { "node": ">=16" @@ -19214,37 +19213,77 @@ } }, "node_modules/postcss-load-config": { - "version": "4.0.1", - "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-4.0.1.tgz", - "integrity": "sha512-vEJIc8RdiBRu3oRAI0ymerOn+7rPuMvRXslTvZUKZonDHFIczxztIyJ1urxM1x9JXEikvpWWTUUqal5j/8QgvA==", + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-6.0.1.tgz", + "integrity": "sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==", + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", "dependencies": { - "lilconfig": "^2.0.5", - "yaml": "^2.1.1" + "lilconfig": "^3.1.1" }, "engines": { - "node": ">= 14" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/postcss/" + "node": ">= 18" }, "peerDependencies": { + "jiti": ">=1.21.0", "postcss": ">=8.0.9", - "ts-node": ">=9.0.0" + "tsx": "^4.8.1", + "yaml": "^2.4.2" }, "peerDependenciesMeta": { + "jiti": { + "optional": true + }, "postcss": { "optional": true }, - "ts-node": { + "tsx": { + "optional": true + }, + "yaml": { "optional": true } } }, + "node_modules/postcss-nested": { + "version": "6.2.0", + "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.2.0.tgz", + "integrity": "sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==", + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/postcss/" + }, + { + "type": "github", + "url": "https://github.com/sponsors/ai" + } + ], + "license": "MIT", + "dependencies": { + "postcss-selector-parser": "^6.1.1" + }, + "engines": { + "node": ">=12.0" + }, + "peerDependencies": { + "postcss": "^8.2.14" + } + }, "node_modules/postcss-selector-parser": { - "version": "6.0.11", - "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz", - "integrity": "sha512-zbARubNdogI9j7WY4nQJBiNqQf3sLS3wCP4WfOidu+p28LofJqDH1tcXypGrcmMHhDk2t9wGhCsYe/+szLTy1g==", + "version": "6.1.4", + "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.4.tgz", + "integrity": "sha512-bIoJLOmjCO1S9XdY/DcnR5hJxvrDir1PbGChrzXG3vw0/FOliy/fA3dmdhQ441kah4gKv+TwckGzex6wNS5cnQ==", + "license": "MIT", "dependencies": { "cssesc": "^3.0.0", "util-deprecate": "^1.0.2" @@ -19836,9 +19875,9 @@ } }, "node_modules/react-native-css-interop": { - "version": "0.2.4", - "resolved": "https://registry.npmjs.org/react-native-css-interop/-/react-native-css-interop-0.2.4.tgz", - "integrity": "sha512-ATP3BACxGM4h/l8cisFauGMGxnXpu8Bcp4Bc3O7iNZpq7j0VJjc1RRRBUSBY4C4WuI7VA/xvp3puijVS9d95rg==", + "version": "0.2.6", + "resolved": "https://registry.npmjs.org/react-native-css-interop/-/react-native-css-interop-0.2.6.tgz", + "integrity": "sha512-uXad6EWqufupnRjrba2De30tiAx26kLEcwSV3eSLVBwpfYeOnrpDc9k6kHk6SBNbmHHlE5sc9vsfKdVRS9msYg==", "license": "MIT", "dependencies": { "@babel/helper-module-imports": "^7.22.15", @@ -19867,9 +19906,9 @@ } }, "node_modules/react-native-css-interop/node_modules/semver": { - "version": "7.8.1", - "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.1.tgz", - "integrity": "sha512-rkVq3IXh+4FDGch+KwzX3aV9W3kO54GyEgpvBzSyctDA6Xtd7RJQV1xmXbeQp5v7+VzLOfVqiutSE6GICgPFvg==", + "version": "7.8.5", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.8.5.tgz", + "integrity": "sha512-Y7/KDsb8LjooZpwaqGyulO6DQlksgCncchHGk+sZIY4SBvUocMBEFH5Ur1fI4dV+Jvl0w6cjvucaIi40puRioA==", "license": "ISC", "bin": { "semver": "bin/semver.js" @@ -20704,6 +20743,7 @@ "version": "3.6.0", "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz", "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==", + "license": "MIT", "dependencies": { "picomatch": "^2.2.1" }, @@ -20921,17 +20961,22 @@ "dev": true }, "node_modules/resolve": { - "version": "1.22.2", - "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.2.tgz", - "integrity": "sha512-Sb+mjNHOULsBv818T40qSPeRiuWLyaGMa5ewydRLFimneixmVy2zdivRl+AF6jaYPC8ERxGDmFSiqui6SfPd+g==", + "version": "1.22.12", + "resolved": "https://registry.npmjs.org/resolve/-/resolve-1.22.12.tgz", + "integrity": "sha512-TyeJ1zif53BPfHootBGwPRYT1RUt6oGWsaQr8UyZW/eAm9bKoijtvruSDEmZHm92CwS9nj7/fWttqPCgzep8CA==", + "license": "MIT", "dependencies": { - "is-core-module": "^2.11.0", + "es-errors": "^1.3.0", + "is-core-module": "^2.16.1", "path-parse": "^1.0.7", "supports-preserve-symlinks-flag": "^1.0.0" }, "bin": { "resolve": "bin/resolve" }, + "engines": { + "node": ">= 0.4" + }, "funding": { "url": "https://github.com/sponsors/ljharb" } @@ -22176,16 +22221,17 @@ "license": "MIT" }, "node_modules/sucrase": { - "version": "3.32.0", - "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.32.0.tgz", - "integrity": "sha512-ydQOU34rpSyj2TGyz4D2p8rbktIOZ8QY9s+DGLvFU1i5pWJE8vkpruCjGCMHsdXwnD7JDcS+noSwM/a7zyNFDQ==", + "version": "3.35.1", + "resolved": "https://registry.npmjs.org/sucrase/-/sucrase-3.35.1.tgz", + "integrity": "sha512-DhuTmvZWux4H1UOnWMB3sk0sbaCVOoQZjv8u1rDoTV0HTdGem9hkAZtl4JZy8P2z4Bg0nT+YMeOFyVr4zcG5Tw==", + "license": "MIT", "dependencies": { "@jridgewell/gen-mapping": "^0.3.2", "commander": "^4.0.0", - "glob": "7.1.6", "lines-and-columns": "^1.1.6", "mz": "^2.7.0", "pirates": "^4.0.1", + "tinyglobby": "^0.2.11", "ts-interface-checker": "^0.1.9" }, "bin": { @@ -22193,49 +22239,18 @@ "sucrase-node": "bin/sucrase-node" }, "engines": { - "node": ">=8" - } - }, - "node_modules/sucrase/node_modules/@jridgewell/gen-mapping": { - "version": "0.3.3", - "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.3.tgz", - "integrity": "sha512-HLhSWOLRi875zjjMG/r+Nv0oCW8umGb0BgEhyX3dDX3egwZtB8PqLnjz3yedt8R5StBrzcg4aBpnh8UA9D1BoQ==", - "dependencies": { - "@jridgewell/set-array": "^1.0.1", - "@jridgewell/sourcemap-codec": "^1.4.10", - "@jridgewell/trace-mapping": "^0.3.9" - }, - "engines": { - "node": ">=6.0.0" + "node": ">=16 || 14 >=14.17" } }, "node_modules/sucrase/node_modules/commander": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/commander/-/commander-4.1.1.tgz", "integrity": "sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==", + "license": "MIT", "engines": { "node": ">= 6" } }, - "node_modules/sucrase/node_modules/glob": { - "version": "7.1.6", - "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz", - "integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==", - "dependencies": { - "fs.realpath": "^1.0.0", - "inflight": "^1.0.4", - "inherits": "2", - "minimatch": "^3.0.4", - "once": "^1.3.0", - "path-is-absolute": "^1.0.0" - }, - "engines": { - "node": "*" - }, - "funding": { - "url": "https://github.com/sponsors/isaacs" - } - }, "node_modules/superstruct": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/superstruct/-/superstruct-2.0.2.tgz", @@ -22328,34 +22343,44 @@ "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz", "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==" }, + "node_modules/tailwind-merge": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-3.6.0.tgz", + "integrity": "sha512-uxL7qAVQriqRQPAyK3pj66VqskWqoZ37PW94jwOTwNfq/z9oyu1V+eqrZqtR2+fCiXdYOZe/Modt8GtvqNzu+w==", + "license": "MIT", + "funding": { + "type": "github", + "url": "https://github.com/sponsors/dcastil" + } + }, "node_modules/tailwindcss": { - "version": "3.3.2", - "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.3.2.tgz", - "integrity": "sha512-9jPkMiIBXvPc2KywkraqsUfbfj+dHDb+JPWtSJa9MLFdrPyazI7q6WX2sUrm7R9eVR7qqv3Pas7EvQFzxKnI6w==", + "version": "3.4.19", + "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.19.tgz", + "integrity": "sha512-3ofp+LL8E+pK/JuPLPggVAIaEuhvIz4qNcf3nA1Xn2o/7fb7s/TYpHhwGDv1ZU3PkBluUVaF8PyCHcm48cKLWQ==", + "license": "MIT", "dependencies": { "@alloc/quick-lru": "^5.2.0", "arg": "^5.0.2", - "chokidar": "^3.5.3", + "chokidar": "^3.6.0", "didyoumean": "^1.2.2", "dlv": "^1.1.3", - "fast-glob": "^3.2.12", + "fast-glob": "^3.3.2", "glob-parent": "^6.0.2", "is-glob": "^4.0.3", - "jiti": "^1.18.2", - "lilconfig": "^2.1.0", - "micromatch": "^4.0.5", + "jiti": "^1.21.7", + "lilconfig": "^3.1.3", + "micromatch": "^4.0.8", "normalize-path": "^3.0.0", "object-hash": "^3.0.0", - "picocolors": "^1.0.0", - "postcss": "^8.4.23", + "picocolors": "^1.1.1", + "postcss": "^8.4.47", "postcss-import": "^15.1.0", "postcss-js": "^4.0.1", - "postcss-load-config": "^4.0.1", - "postcss-nested": "^6.0.1", - "postcss-selector-parser": "^6.0.11", - "postcss-value-parser": "^4.2.0", - "resolve": "^1.22.2", - "sucrase": "^3.32.0" + "postcss-load-config": "^4.0.2 || ^5.0 || ^6.0", + "postcss-nested": "^6.2.0", + "postcss-selector-parser": "^6.1.2", + "resolve": "^1.22.8", + "sucrase": "^3.35.0" }, "bin": { "tailwind": "lib/cli.js", @@ -22376,24 +22401,6 @@ "node": ">=10.13.0" } }, - "node_modules/tailwindcss/node_modules/postcss-nested": { - "version": "6.0.1", - "resolved": "https://registry.npmjs.org/postcss-nested/-/postcss-nested-6.0.1.tgz", - "integrity": "sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==", - "dependencies": { - "postcss-selector-parser": "^6.0.11" - }, - "engines": { - "node": ">=12.0" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/postcss/" - }, - "peerDependencies": { - "postcss": "^8.2.14" - } - }, "node_modules/tar-fs": { "version": "2.1.4", "resolved": "https://registry.npmjs.org/tar-fs/-/tar-fs-2.1.4.tgz", @@ -22518,6 +22525,7 @@ "version": "3.3.1", "resolved": "https://registry.npmjs.org/thenify/-/thenify-3.3.1.tgz", "integrity": "sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==", + "license": "MIT", "dependencies": { "any-promise": "^1.0.0" } @@ -22526,6 +22534,7 @@ "version": "1.6.0", "resolved": "https://registry.npmjs.org/thenify-all/-/thenify-all-1.6.0.tgz", "integrity": "sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==", + "license": "MIT", "dependencies": { "thenify": ">= 3.1.0 < 4" }, @@ -22556,7 +22565,6 @@ "version": "0.2.17", "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.17.tgz", "integrity": "sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==", - "dev": true, "license": "MIT", "dependencies": { "fdir": "^6.5.0", @@ -22573,7 +22581,6 @@ "version": "6.5.0", "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz", "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==", - "dev": true, "license": "MIT", "engines": { "node": ">=12.0.0" @@ -22591,7 +22598,6 @@ "version": "4.0.4", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz", "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==", - "dev": true, "license": "MIT", "engines": { "node": ">=12" @@ -22694,7 +22700,8 @@ "node_modules/ts-interface-checker": { "version": "0.1.13", "resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz", - "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==" + "integrity": "sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==", + "license": "Apache-2.0" }, "node_modules/ts-markdown-builder": { "version": "0.5.0", @@ -22710,7 +22717,7 @@ "version": "10.9.2", "resolved": "https://registry.npmjs.org/ts-node/-/ts-node-10.9.2.tgz", "integrity": "sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==", - "devOptional": true, + "dev": true, "dependencies": { "@cspotcode/source-map-support": "^0.8.0", "@tsconfig/node10": "^1.0.7", @@ -22753,7 +22760,7 @@ "version": "4.1.3", "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz", "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==", - "devOptional": true + "dev": true }, "node_modules/ts-regex-builder": { "version": "1.8.2", @@ -23181,7 +23188,7 @@ "version": "3.0.1", "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz", "integrity": "sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==", - "devOptional": true + "dev": true }, "node_modules/v8-to-istanbul": { "version": "9.2.0", @@ -23809,7 +23816,7 @@ "version": "3.1.1", "resolved": "https://registry.npmjs.org/yn/-/yn-3.1.1.tgz", "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==", - "devOptional": true, + "dev": true, "engines": { "node": ">=6" } diff --git a/package.json b/package.json index e7e62127ad..8353495e55 100644 --- a/package.json +++ b/package.json @@ -99,7 +99,7 @@ "linkifyjs": "^4.3.2", "lodash": "^4.18.1", "markdown-it": "^14.2.0", - "nativewind": "^4.2.4", + "nativewind": "^4.2.6", "react": "19.2.0", "react-dom": "19.1.1", "react-i18next": "^17.0.2", @@ -152,6 +152,7 @@ "react-native-worklets-core": "^1.6.3", "realm": "^20.2.0", "sanitize-html": "^2.17.4", + "tailwind-merge": "^3.6.0", "uuid": "^11.1.1", "vision-camera-plugin-inatvision": "github:inaturalist/vision-camera-plugin-inatvision#e8c4782cee82e781e8dc7016fffedbbd95070931", "zustand": "^4.5.7" @@ -222,7 +223,7 @@ "react-native-config-node": "^0.0.3", "react-test-renderer": "19.2.0", "reassure": "^1.4.1", - "tailwindcss": "^3.3.2", + "tailwindcss": "^3.4.17", "ts-node": "^10.9.2", "typescript": "^5.8.3", "yargs": "^17.7.2" diff --git a/src/components/AddObsBottomSheet/AddObsBottomSheet.tsx b/src/components/AddObsBottomSheet/AddObsBottomSheet.tsx index 3ec366b45e..b516a6d730 100644 --- a/src/components/AddObsBottomSheet/AddObsBottomSheet.tsx +++ b/src/components/AddObsBottomSheet/AddObsBottomSheet.tsx @@ -31,7 +31,7 @@ const AI_CAMERA_SUPPORTED = ( Platform.OS === "ios" && majorVersionIOS >= 11 ) || ( Platform.OS === "android" && Platform.Version > 21 ); const GREEN_CIRCLE_CLASS = "bg-inatGreen rounded-full h-[36px] w-[36px] mb-2"; -const ROW_CLASS = "flex-row justify-center space-x-4 w-full flex-1"; +const ROW_CLASS = "flex-row justify-center gap-x-4 w-full flex-1"; const AddObsBottomSheet = ( { closeBottomSheet, navAndCloseBottomSheet, hidden, diff --git a/src/components/Camera/FadeInOutView.tsx b/src/components/Camera/FadeInOutView.tsx index 6a6159299d..8bb5eafc1d 100644 --- a/src/components/Camera/FadeInOutView.tsx +++ b/src/components/Camera/FadeInOutView.tsx @@ -13,6 +13,17 @@ interface Props { cameraType: string; } +// Inline style instead of className: reanimated's Animated.View isn't +// registered with nativewind 4, so className has no effect on it +const OVERLAY_STYLE = { + alignItems: "center", + justifyContent: "center", + backgroundColor: colors.black, + position: "absolute", + height: "100%", + width: "100%", +} as const; + const FadeInOutView = ( { takingPhoto, cameraType }: Props ) => { const opacity = useSharedValue( 0 ); @@ -35,8 +46,7 @@ const FadeInOutView = ( { takingPhoto, cameraType }: Props ) => { <> {( takingPhoto && cameraType === "AI" ) && ( { if ( !tappedCoordinates ) { return null; } return ( diff --git a/src/components/Camera/RotatableIconWrapper.tsx b/src/components/Camera/RotatableIconWrapper.tsx index 77fbbab283..bc5731b3f0 100644 --- a/src/components/Camera/RotatableIconWrapper.tsx +++ b/src/components/Camera/RotatableIconWrapper.tsx @@ -26,13 +26,14 @@ const RotatableIconWrapper = ( { ); } + // className on the plain View, animation inside: reanimated's Animated.View + // isn't registered with nativewind 4, so className has no effect on it return ( - - {children} - + + + {children} + + ); }; diff --git a/src/components/Match/PhotosSection.tsx b/src/components/Match/PhotosSection.tsx index e31006a35d..34a865ad99 100644 --- a/src/components/Match/PhotosSection.tsx +++ b/src/components/Match/PhotosSection.tsx @@ -105,20 +105,20 @@ const PhotosSection = ( { containerClass = "flex-row"; observationPhotoClass = "w-2/3 h-full pr-[3px]"; if ( bestTaxonPhotos.length === 2 ) { - taxonPhotosContainerClass = "flex-col w-1/3 h-full space-y-[3px]"; + taxonPhotosContainerClass = "flex-col w-1/3 h-full gap-y-[3px]"; taxonPhotoClass = "w-full h-1/2"; } else { - taxonPhotosContainerClass = "flex-col w-1/3 h-full space-y-[3px]"; + taxonPhotosContainerClass = "flex-col w-1/3 h-full gap-y-[3px]"; taxonPhotoClass = "w-full h-1/3"; } } else { containerClass = "flex-col"; observationPhotoClass = "w-full h-2/3 pb-[3px]"; if ( bestTaxonPhotos.length === 2 ) { - taxonPhotosContainerClass = "flex-row w-full h-1/3 space-x-[3px]"; + taxonPhotosContainerClass = "flex-row w-full h-1/3 gap-x-[3px]"; taxonPhotoClass = "w-1/2 h-full"; } else { - taxonPhotosContainerClass = "flex-row w-full h-1/3 space-x-[3px]"; + taxonPhotosContainerClass = "flex-row w-full h-1/3 gap-x-[3px]"; taxonPhotoClass = "w-1/3 h-full"; } } diff --git a/src/components/MyObservations/LoginBanner.tsx b/src/components/MyObservations/LoginBanner.tsx index 38cf1e9cc0..13c3d1ca8c 100644 --- a/src/components/MyObservations/LoginBanner.tsx +++ b/src/components/MyObservations/LoginBanner.tsx @@ -51,7 +51,7 @@ const LoginBanner = ( { items-center justify-center p-[20px] - space-x-[12px] + gap-x-[12px] bg-white rounded-xl" onPress={( ) => navigation.navigate( "LoginStackNavigator" )} diff --git a/src/components/MyObservations/MyObservationsEmptySimple.js b/src/components/MyObservations/MyObservationsEmptySimple.js index bc5b96a878..4f72523728 100644 --- a/src/components/MyObservations/MyObservationsEmptySimple.js +++ b/src/components/MyObservations/MyObservationsEmptySimple.js @@ -56,8 +56,12 @@ const MyObservationsEmptySimple = ( { currentUser, isConnected, justFinishedSign - {/* $FlowIgnore[not-a-component] */} - + {/* View wrapper for positioning: className on an svg component + * has no effect with nativewind 4 */} + + {/* $FlowIgnore[not-a-component] */} + + { return ( - + {searchedTaxon.iconUri && ( { }; return ( - + - + { type && ( diff --git a/src/components/ObsDetails/DQAContainer.js b/src/components/ObsDetails/DQAContainer.js index 1a2321be5e..3a82bb1dca 100644 --- a/src/components/ObsDetails/DQAContainer.js +++ b/src/components/ObsDetails/DQAContainer.js @@ -282,7 +282,7 @@ const DQAContainer = ( ): React.Node => { hideCloseButton onPressClose={( ) => resetButtonsOnError( )} > - + {t( "Error-voting-in-DQA-description" )}