diff --git a/.prettierrc b/.prettierrc index 3baced4..d55c115 100644 --- a/.prettierrc +++ b/.prettierrc @@ -1,4 +1,5 @@ { "singleQuote": true, - "endOfLine": "auto" + "endOfLine": "auto", + "plugins": ["prettier-plugin-tailwindcss"] } diff --git a/apps/mobile/app/(tabs)/_layout.tsx b/apps/mobile/app/(tabs)/_layout.tsx index b37f63d..475f761 100644 --- a/apps/mobile/app/(tabs)/_layout.tsx +++ b/apps/mobile/app/(tabs)/_layout.tsx @@ -1,7 +1,7 @@ import { Tabs } from 'expo-router'; -import Colors from '../../constants/Colors'; import TabBarIcon from '../../components/TabBarIcon'; +import Colors from '../../constants/Colors.js'; import { globalStyles } from '../../styles/global'; export default function TabLayout() { @@ -12,9 +12,9 @@ export default function TabLayout() { }} screenOptions={{ headerShown: false, - tabBarActiveTintColor: Colors.dark.purple100, + tabBarActiveTintColor: Colors.purple[100], tabBarStyle: { - backgroundColor: Colors.dark.shade700, + backgroundColor: Colors.shade[700], borderTopColor: 'transparent', borderTopRightRadius: 20, borderTopLeftRadius: 20, @@ -65,7 +65,7 @@ export default function TabLayout() { style={{ position: 'relative', top: -1, - backgroundColor: Colors.dark.purple400, + backgroundColor: Colors.purple[400], display: 'flex', alignItems: 'center', justifyContent: 'center', diff --git a/apps/mobile/app/(tabs)/about.tsx b/apps/mobile/app/(tabs)/about.tsx index fc530b8..52ffa0c 100644 --- a/apps/mobile/app/(tabs)/about.tsx +++ b/apps/mobile/app/(tabs)/about.tsx @@ -1,8 +1,5 @@ -import { StyleSheet } from 'react-native'; - -import ScreenLayout from '../../components/layout/screenLayout'; -import { globalStyles } from '../../styles/global'; -import { RegularText } from '../../components/Styled'; +import ScreenLayout from '../../components/layout/ScreenLayout'; +import { RegularText } from '../../components/ui/Text'; export default function AboutScreen() { return ( @@ -10,27 +7,10 @@ export default function AboutScreen() { title="About" subtitle="What is movie-web and how content is served?" > - + No content is served from movie-web directly and movie web does not host anything. ); } - -const styles = StyleSheet.create({ - container: { - flex: 1, - alignItems: 'center', - justifyContent: 'center', - }, - title: { - fontSize: 20, - fontWeight: 'bold', - }, - separator: { - marginVertical: 30, - height: 1, - width: '80%', - }, -}); diff --git a/apps/mobile/app/(tabs)/account.tsx b/apps/mobile/app/(tabs)/account.tsx index e28c546..ee2ecaa 100644 --- a/apps/mobile/app/(tabs)/account.tsx +++ b/apps/mobile/app/(tabs)/account.tsx @@ -1,8 +1,5 @@ -import { StyleSheet, Text } from 'react-native'; - -import { globalStyles } from '../../styles/global'; -import ScreenLayout from '../../components/layout/screenLayout'; -import { RegularText } from '../../components/Styled'; +import ScreenLayout from '../../components/layout/ScreenLayout'; +import { RegularText } from '../../components/ui/Text'; export default function AccountScreen() { return ( @@ -10,7 +7,7 @@ export default function AccountScreen() { title="Account" subtitle="Manage your movie web account from here" > - + Hey Bro! what are you up to? diff --git a/apps/mobile/app/(tabs)/index.tsx b/apps/mobile/app/(tabs)/index.tsx index 58d9f6b..b456b98 100644 --- a/apps/mobile/app/(tabs)/index.tsx +++ b/apps/mobile/app/(tabs)/index.tsx @@ -1,11 +1,10 @@ -import { RegularText } from '../../components/Styled'; -import ScreenLayout from '../../components/layout/screenLayout'; -import { globalStyles } from '../../styles/global'; +import ScreenLayout from '../../components/layout/ScreenLayout'; +import { RegularText } from '../../components/ui/Text'; export default function HomeScreen() { return ( - + Movies will be listed here diff --git a/apps/mobile/app/(tabs)/search/Searchbar.tsx b/apps/mobile/app/(tabs)/search/Searchbar.tsx index 73fd655..bd09bb1 100644 --- a/apps/mobile/app/(tabs)/search/Searchbar.tsx +++ b/apps/mobile/app/(tabs)/search/Searchbar.tsx @@ -1,10 +1,11 @@ import { FontAwesome5 } from '@expo/vector-icons'; +import { useFocusEffect } from 'expo-router'; import { useCallback, useRef, useState } from 'react'; import { View } from 'react-native'; import { TextInput } from 'react-native-gesture-handler'; + +import Colors from '../../../constants/Colors.js'; import { globalStyles } from '../../../styles/global'; -import Colors from '../../../constants/Colors'; -import { useFocusEffect } from 'expo-router'; export default function Searchbar() { const [keyword, setKeyword] = useState(''); @@ -24,41 +25,19 @@ export default function Searchbar() { ); return ( - - - + + + setKeyword(text)} ref={inputRef} placeholder="What are you looking for?" - placeholderTextColor={Colors.dark.shade200} - style={[ - globalStyles.input, - globalStyles.fOpenSansRegular, - { - width: '100%', - }, - ]} - > + placeholderTextColor={Colors.shade[200]} + className="rounded-3xl py-3 pr-5 text-white" + /> ); } diff --git a/apps/mobile/app/(tabs)/search/_layout.tsx b/apps/mobile/app/(tabs)/search/_layout.tsx index 5fc46d9..2c8a6b0 100644 --- a/apps/mobile/app/(tabs)/search/_layout.tsx +++ b/apps/mobile/app/(tabs)/search/_layout.tsx @@ -1,37 +1,37 @@ -import { Dimensions, ScrollView, View } from 'react-native'; - -import { globalStyles } from '../../../styles/global'; -import ScreenLayout from '../../../components/layout/screenLayout'; -import { TextInput } from 'react-native-gesture-handler'; -import styles from './styles'; -import { useCallback, useEffect, useRef, useState } from 'react'; import { useFocusEffect } from 'expo-router'; -import { BoldText } from '../../../components/Styled'; -import Item from '../../../components/item/item'; +import { useCallback, useEffect, useRef, useState } from 'react'; +import { Dimensions, ScrollView, View } from 'react-native'; +import { TextInput } from 'react-native-gesture-handler'; + import Searchbar from './Searchbar'; +import styles from './styles'; +import Item from '../../../components/item/item'; +import ScreenLayout from '../../../components/layout/ScreenLayout'; +import { BoldText } from '../../../components/ui/Text'; +import { globalStyles } from '../../../styles/global'; export default function SearchScreen() { return ( - Search + + + Search + } subtitle="Looking for something?" > - - + + - + - + diff --git a/apps/mobile/app/(tabs)/settings.tsx b/apps/mobile/app/(tabs)/settings.tsx index 5dd243d..6c87e60 100644 --- a/apps/mobile/app/(tabs)/settings.tsx +++ b/apps/mobile/app/(tabs)/settings.tsx @@ -1,12 +1,10 @@ -import { RegularText } from '../../components/Styled'; -import ScreenLayout from '../../components/layout/screenLayout'; -import { globalStyles } from '../../styles/global'; -import { StyleSheet, Text } from 'react-native'; +import ScreenLayout from '../../components/layout/ScreenLayout'; +import { RegularText } from '../../components/ui/Text'; export default function SettingsScreen() { return ( - + Settings would be listed in here. Coming soon diff --git a/apps/mobile/app/[...missing].tsx b/apps/mobile/app/[...missing].tsx index 78408c6..d724747 100644 --- a/apps/mobile/app/[...missing].tsx +++ b/apps/mobile/app/[...missing].tsx @@ -1,41 +1,23 @@ import { Link, Stack } from 'expo-router'; -import { StyleSheet, View } from 'react-native'; -import { BoldText, RegularText } from '../components/Styled'; +import { View } from 'react-native'; + +import { BoldText, RegularText } from '../components/ui/Text'; export default function NotFoundScreen() { return ( <> - - + + This screen doesn't exist. - - Go to home screen! + + + Go to home screen! + ); } - -const styles = StyleSheet.create({ - container: { - flex: 1, - alignItems: 'center', - justifyContent: 'center', - padding: 20, - }, - title: { - fontSize: 20, - fontWeight: 'bold', - }, - link: { - marginTop: 15, - paddingVertical: 15, - }, - linkText: { - fontSize: 14, - color: '#2e78b7', - }, -}); diff --git a/apps/mobile/app/_layout.tsx b/apps/mobile/app/_layout.tsx index 7428383..a981ea5 100644 --- a/apps/mobile/app/_layout.tsx +++ b/apps/mobile/app/_layout.tsx @@ -1,3 +1,4 @@ +/* eslint-disable global-require */ import FontAwesome from '@expo/vector-icons/FontAwesome'; import { DarkTheme, @@ -9,7 +10,7 @@ import { SplashScreen, Stack } from 'expo-router'; import { useEffect } from 'react'; import { useColorScheme } from 'react-native'; -import Colors from '../constants/Colors'; +import Colors from '../constants/Colors.js'; export { // Catch any errors thrown by the Layout component. @@ -27,7 +28,6 @@ SplashScreen.preventAutoHideAsync(); export default function RootLayout() { const [loaded, error] = useFonts({ - // eslint-disable-next-line global-require OpenSansRegular: require('../assets/fonts/OpenSans-Regular.ttf'), OpenSansLight: require('../assets/fonts/OpenSans-Light.ttf'), OpenSansMedium: require('../assets/fonts/OpenSans-Medium.ttf'), @@ -65,12 +65,11 @@ function RootLayoutNav() { gestureEnabled: true, headerShown: false, contentStyle: { - backgroundColor: Colors.dark.shade900, + backgroundColor: Colors.shade[900], }, }} > - ); diff --git a/apps/mobile/app/modal.tsx b/apps/mobile/app/modal.tsx deleted file mode 100644 index 2d22e9a..0000000 --- a/apps/mobile/app/modal.tsx +++ /dev/null @@ -1,33 +0,0 @@ -import { StatusBar } from 'expo-status-bar'; -import { Platform, StyleSheet, View } from 'react-native'; -import { BoldText, RegularText } from '../components/Styled'; - -export default function ModalScreen() { - return ( - - Modal - - Modal?! - - {/* Use a light status bar on iOS to account for the black space above the modal */} - - - ); -} - -const styles = StyleSheet.create({ - container: { - flex: 1, - alignItems: 'center', - justifyContent: 'center', - }, - title: { - fontSize: 20, - fontWeight: 'bold', - }, - separator: { - marginVertical: 30, - height: 1, - width: '80%', - }, -}); diff --git a/apps/mobile/babel.config.js b/apps/mobile/babel.config.js index 7b6d299..95fa08c 100644 --- a/apps/mobile/babel.config.js +++ b/apps/mobile/babel.config.js @@ -2,9 +2,10 @@ module.exports = function (api) { api.cache(true); return { presets: ['babel-preset-expo'], - plugins: [ - // Required for expo-router - 'expo-router/babel', - ], + plugins: [ + // Required for expo-router + 'expo-router/babel', + 'nativewind/babel', + ], }; }; diff --git a/apps/mobile/components/ExternalLink.tsx b/apps/mobile/components/ExternalLink.tsx index 66a00ac..1478149 100644 --- a/apps/mobile/components/ExternalLink.tsx +++ b/apps/mobile/components/ExternalLink.tsx @@ -13,7 +13,6 @@ export function ExternalLink( target: '_blank', }} {...props} - // @ts-expect-error: External URLs are not typed. href={props.href} onPress={(e) => { if (Platform.OS !== 'web') { diff --git a/apps/mobile/components/TabBarIcon.tsx b/apps/mobile/components/TabBarIcon.tsx index b1ff95f..6cb2f1f 100644 --- a/apps/mobile/components/TabBarIcon.tsx +++ b/apps/mobile/components/TabBarIcon.tsx @@ -1,5 +1,6 @@ import { FontAwesome } from '@expo/vector-icons'; -import Colors from '../constants/Colors'; + +import Colors from '../constants/Colors.js'; type Props = { focused?: boolean; @@ -7,13 +8,13 @@ type Props = { } & React.ComponentProps; export default function TabBarIcon({ - color = Colors.dark.shade300, + color = Colors.shade[300], focused, ...rest }: Props) { return ( diff --git a/apps/mobile/components/item/item.tsx b/apps/mobile/components/item/item.tsx index f413cac..5d2369b 100644 --- a/apps/mobile/components/item/item.tsx +++ b/apps/mobile/components/item/item.tsx @@ -1,30 +1,25 @@ -import { globalStyles } from '../../styles/global'; -import { Image, Text, View } from 'react-native'; -import styles from './styles'; -import { BoldText, RegularText } from '../Styled'; +import { Image, View } from 'react-native'; + import { TMDB_POSTER_PATH } from '../../constants/General'; +import { BoldText, RegularText } from '../ui/Text'; export default function Item() { return ( - - + + - Hamilton - - - Movie - - - - 2023 - + Hamilton + + Movie + + 2023 ); diff --git a/apps/mobile/components/item/styles.tsx b/apps/mobile/components/item/styles.tsx deleted file mode 100644 index 7ce5fc2..0000000 --- a/apps/mobile/components/item/styles.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import Colors from '../../constants/Colors'; -import { StyleSheet } from 'react-native'; - -const styles = StyleSheet.create({ - wrapper: { - width: '100%', - }, - imageWrapper: { - borderRadius: 16, - aspectRatio: 9 / 14, - width: '100%', - overflow: 'hidden', - position: 'relative', - marginBottom: 6, - }, - image: { - width: '100%', - height: '100%', - resizeMode: 'cover', - }, - meta: { - flexDirection: 'row', - gap: 6, - alignItems: 'center', - }, - smallText: { - fontSize: 12, - }, -}); - -export default styles; diff --git a/apps/mobile/components/layout/screenLayout.tsx b/apps/mobile/components/layout/screenLayout.tsx index b752aa2..fc56b80 100644 --- a/apps/mobile/components/layout/screenLayout.tsx +++ b/apps/mobile/components/layout/screenLayout.tsx @@ -1,7 +1,6 @@ import { View } from 'react-native'; -import { globalStyles } from '../../styles/global'; -import { styles } from './styles'; -import { BoldText, RegularText } from '../Styled'; + +import { BoldText, RegularText } from '../ui/Text'; type Props = { title?: React.ReactNode | string; @@ -11,21 +10,15 @@ type Props = { export default function ScreenLayout({ title, subtitle, children }: Props) { return ( - + {typeof title === 'string' && ( - {title} + {title} )} {typeof title !== 'string' && title} - + {subtitle} - {children} + {children} ); } diff --git a/apps/mobile/components/Styled.tsx b/apps/mobile/components/ui/Text.tsx similarity index 58% rename from apps/mobile/components/Styled.tsx rename to apps/mobile/components/ui/Text.tsx index 8662625..137d2ee 100644 --- a/apps/mobile/components/Styled.tsx +++ b/apps/mobile/components/ui/Text.tsx @@ -1,44 +1,44 @@ -import { Text } from 'react-native'; - -export const RegularText = ({ style, children, ...rest }: Text['props']) => { - return ( - - {children} - - ); -}; -export const BoldText = ({ style, children, ...rest }: Text['props']) => { - return ( - - {children} - - ); -}; -export const SemiBoldText = ({ style, children, ...rest }: Text['props']) => { - return ( - - {children} - - ); -}; -export const MediumText = ({ style, children, ...rest }: Text['props']) => { - return ( - - {children} - - ); -}; -export const ExtraBoldText = ({ style, children, ...rest }: Text['props']) => { - return ( - - {children} - - ); -}; -export const LightText = ({ style, children, ...rest }: Text['props']) => { - return ( - - {children} - - ); -}; +import { Text } from 'react-native'; + +export function RegularText({ style, children, ...rest }: Text['props']) { + return ( + + {children} + + ); +} +export function BoldText({ style, children, ...rest }: Text['props']) { + return ( + + {children} + + ); +} +export function SemiBoldText({ style, children, ...rest }: Text['props']) { + return ( + + {children} + + ); +} +export function MediumText({ style, children, ...rest }: Text['props']) { + return ( + + {children} + + ); +} +export function ExtraBoldText({ style, children, ...rest }: Text['props']) { + return ( + + {children} + + ); +} +export function LightText({ style, children, ...rest }: Text['props']) { + return ( + + {children} + + ); +} diff --git a/apps/mobile/constants/Colors.ts b/apps/mobile/constants/Colors.ts index 8e7bb23..a5afb78 100644 --- a/apps/mobile/constants/Colors.ts +++ b/apps/mobile/constants/Colors.ts @@ -1,27 +1,42 @@ const tintColorLight = '#2f95dc'; const tintColorDark = '#fff'; +// export default { +// light: { +// text: '#000', +// background: '#fff', +// tint: tintColorLight, +// tabIconDefault: '#ccc', +// tabIconSelected: tintColorLight, +// }, +// dark: { +// text: '#fff', +// background: '#000', +// tint: tintColorDark, +// tabIconDefault: '#ccc', +// tabIconSelected: tintColorDark, +// purple100: '#C082FF', +// purple300: '#8D44D6', +// purple400: '#7831BF', +// shade50: '#676790', +// shade200: '#3F3F60', +// shade300: '#32324F', +// shade700: '#131322', +// shade900: '#0A0A12', +// }, +// }; + export default { - light: { - text: '#000', - background: '#fff', - tint: tintColorLight, - tabIconDefault: '#ccc', - tabIconSelected: tintColorLight, + purple: { + 100: '#C082FF', + 300: '#8D44D6', + 400: '#7831BF', }, - dark: { - text: '#fff', - background: '#000', - tint: tintColorDark, - tabIconDefault: '#ccc', - tabIconSelected: tintColorDark, - purple100: '#C082FF', - purple300: '#8D44D6', - purple400: '#7831BF', - shade50: '#676790', - shade200: '#3F3F60', - shade300: '#32324F', - shade700: '#131322', - shade900: '#0A0A12', + shade: { + 50: '#676790', + 200: '#3F3F60', + 300: '#32324F', + 700: '#131322', + 900: '#0A0A12', }, }; diff --git a/apps/mobile/package.json b/apps/mobile/package.json index 65982df..f4cffec 100644 --- a/apps/mobile/package.json +++ b/apps/mobile/package.json @@ -12,8 +12,13 @@ "@expo/vector-icons": "^13.0.0", "@nx/expo": "*", "@react-navigation/native": "^6.1.9", + "@rnx-kit/metro-config": "*", + "@rnx-kit/metro-resolver-symlinks": "*", "@testing-library/jest-native": "*", "@testing-library/react-native": "*", + "@types/react": "*", + "eslint-plugin-react": "*", + "eslint-plugin-react-hooks": "*", "expo": "*", "expo-font": "^11.4.0", "expo-linking": "^5.0.2", @@ -22,7 +27,10 @@ "expo-status-bar": "*", "expo-system-ui": "^2.6.0", "expo-web-browser": "^12.5.0", + "jest": "*", + "jest-expo": "*", "metro-config": "*", + "nativewind": "^2.0.11", "pod-install": "*", "react": "*", "react-dom": "18.2.0", @@ -33,15 +41,9 @@ "react-native-svg": "*", "react-native-svg-transformer": "*", "react-native-web": "^0.19.10", - "@rnx-kit/metro-config": "*", - "@rnx-kit/metro-resolver-symlinks": "*", - "@types/react": "*", - "eslint-plugin-react": "*", - "eslint-plugin-react-hooks": "*", - "jest": "*", - "jest-expo": "*", "react-test-renderer": "*", - "typescript": "*" + "typescript": "*", + "tailwindcss": "*" }, "scripts": { "eas-build-pre-install": "cd ../../ && node tools/scripts/eas-build-pre-install.mjs . apps/mobile && cp pnpm-lock.yaml apps/mobile", @@ -63,6 +65,7 @@ "jest-expo": "~49.0.0", "pod-install": "^0.1.39", "react-test-renderer": "18.2.0", + "tailwindcss": "^3.4.1", "typescript": "~5.2.2" }, "overrides": { diff --git a/apps/mobile/styles/global.tsx b/apps/mobile/styles/global.tsx index d044512..8cc788b 100644 --- a/apps/mobile/styles/global.tsx +++ b/apps/mobile/styles/global.tsx @@ -1,50 +1,6 @@ import { StyleSheet } from 'react-native'; -import Colors from '../constants/Colors'; export const globalStyles = StyleSheet.create({ - pageContainer: { - flex: 1, - backgroundColor: Colors.dark.shade900, - paddingVertical: 48, - }, - container: { - padding: 24, - }, - sectionTitle: { - color: '#FFF', - letterSpacing: -1.5, - fontWeight: 'bold', - fontSize: 28, - }, - sectionSubtitle: { - color: Colors.dark.shade200, - fontSize: 14, - }, - textWhite: { - color: '#FFF', - }, - flexRow: { - flexDirection: 'row', - }, - itemsCenter: { - alignItems: 'center', - }, - justifyCenter: { - justifyContent: 'center', - }, - input: { - borderRadius: 24, - paddingRight: 18, - paddingVertical: 12, - color: '#FFF', - }, - border: { - borderWidth: 1, - borderColor: 'rgba(255,255,255,.1)', - }, - roundedFull: { - borderRadius: 34, - }, fOpenSansLight: { fontFamily: 'OpenSansLight', }, @@ -63,13 +19,4 @@ export const globalStyles = StyleSheet.create({ fOpenSansRegular: { fontFamily: 'OpenSansRegular', }, - textMuted: { - color: '#5F5F7A', - }, - dotSeperator: { - width: 4, - height: 4, - backgroundColor: '#5F5F7A', - borderRadius: 50, - }, }); diff --git a/apps/mobile/tailwind.config.ts b/apps/mobile/tailwind.config.ts new file mode 100644 index 0000000..8d1224e --- /dev/null +++ b/apps/mobile/tailwind.config.ts @@ -0,0 +1,13 @@ +import type { Config } from 'tailwindcss'; + +import colors from './constants/Colors'; + +export default { + content: [], + theme: { + extend: { + colors, + }, + }, + plugins: [], +} satisfies Config; diff --git a/apps/mobile/tsconfig.app.json b/apps/mobile/tsconfig.app.json index 393d226..457425b 100644 --- a/apps/mobile/tsconfig.app.json +++ b/apps/mobile/tsconfig.app.json @@ -1,6 +1,7 @@ { "extends": "./tsconfig.json", "compilerOptions": { + "composite": true, "outDir": "../../dist/out-tsc", "types": ["node"] }, @@ -11,5 +12,5 @@ "**/*.spec.tsx", "test-setup.ts" ], - "include": ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx"] + "include": ["**/*.ts", "**/*.tsx", "**/*.js", "**/*.jsx", "constants/Colors.ts", "tailwind.config.mjs"] } diff --git a/apps/mobile/tsconfig.spec.json b/apps/mobile/tsconfig.spec.json index 26ef046..0e85b1d 100644 --- a/apps/mobile/tsconfig.spec.json +++ b/apps/mobile/tsconfig.spec.json @@ -1,6 +1,7 @@ { "extends": "./tsconfig.json", "compilerOptions": { + "composite": true, "outDir": "../../dist/out-tsc", "module": "commonjs", "types": ["jest", "node"] diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index f58bc65..817671e 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -156,6 +156,9 @@ importers: prettier: specifier: ^3.0.3 version: 3.2.4 + prettier-plugin-tailwindcss: + specifier: ^0.5.11 + version: 0.5.11(prettier@3.2.4) react-test-renderer: specifier: 18.2.0 version: 18.2.0(react@18.2.0) @@ -240,6 +243,9 @@ importers: metro-config: specifier: '*' version: 0.80.4 + nativewind: + specifier: ^2.0.11 + version: 2.0.11(react@18.2.0)(tailwindcss@3.4.1) pod-install: specifier: '*' version: 0.2.0 @@ -276,6 +282,10 @@ importers: typescript: specifier: '*' version: 5.2.2 + devDependencies: + tailwindcss: + specifier: ^3.4.1 + version: 3.4.1(ts-node@10.9.1) packages: @@ -296,6 +306,10 @@ packages: /@adobe/css-tools@4.3.2: resolution: {integrity: sha512-DA5a1C0gD/pLOvhv33YMrbf2FK3oUzwNl9oOJqE4XVjuEtt6XIakRcsd7eLiOSPkp1kTRQGICTA8cKra/vFbjw==} + /@alloc/quick-lru@5.2.0: + resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==} + engines: {node: '>=10'} + /@ampproject/remapping@2.2.1: resolution: {integrity: sha512-lFMjJTrFL3j7L9yBxwYfCq2k6qqwHyzuUl/XBnif78PWTJYyL/dfowQHWE3sp6U6ZzqWiiIZnpTMO96zhkjwtg==} engines: {node: '>=6.0.0'} @@ -457,6 +471,13 @@ packages: dependencies: '@babel/types': 7.23.6 + /@babel/helper-module-imports@7.18.6: + resolution: {integrity: sha512-0NFvs3VkuSYbFi1x2Vd6tKrywq+z/cLeYC/RJNFrIX/30Bf5aiGYbtvGXolEktzJH8o5E5KJ3tT+nkxuuZFVlA==} + engines: {node: '>=6.9.0'} + dependencies: + '@babel/types': 7.23.6 + dev: false + /@babel/helper-module-imports@7.22.15: resolution: {integrity: sha512-0pYVBnDKZO2fnSPCrgM/6WMc7eS20Fbok+0r88fp+YtWVLZrp4CkafFGIp+W0VKw4a22sgebPT99y+FDNMdP4w==} engines: {node: '>=6.9.0'} @@ -1703,6 +1724,15 @@ packages: transitivePeerDependencies: - supports-color + /@babel/types@7.19.0: + resolution: {integrity: sha512-YuGopBq3ke25BVSiS6fgF49Ul9gH1x70Bcr6bqRLjWCkcX8Hre1/5+z+IiWOIerRMSSEfGZVB9z9kyq7wVs9YA==} + engines: {node: '>=6.9.0'} + dependencies: + '@babel/helper-string-parser': 7.23.4 + '@babel/helper-validator-identifier': 7.22.20 + to-fast-properties: 2.0.0 + dev: false + /@babel/types@7.23.6: resolution: {integrity: sha512-+uarb83brBzPKN38NX1MkB6vb6+mwvR6amUulqAE7ccQw1pEl+bCia9TbdG1lsnFP7lZySvUn37CHyXQdfTwzg==} engines: {node: '>=6.9.0'} @@ -2001,7 +2031,7 @@ packages: getenv: 1.0.0 glob: 7.1.6 resolve-from: 5.0.0 - semver: 7.5.3 + semver: 7.5.4 slash: 3.0.0 slugify: 1.6.6 xcode: 3.0.1 @@ -5690,6 +5720,10 @@ packages: resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==} engines: {node: '>=6'} + /camelcase-css@2.0.1: + resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==} + engines: {node: '>= 6'} + /camelcase@5.3.1: resolution: {integrity: sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==} engines: {node: '>=6'} @@ -5698,6 +5732,10 @@ packages: resolution: {integrity: sha512-Gmy6FhYlCY7uOElZUSbxo2UCDH8owEk996gkbrpsgGtrJLM3J7jGxl9Ic7Qwwj4ivOE5AWZWRMecDdF7hqGjFA==} engines: {node: '>=10'} + /camelize@1.0.1: + resolution: {integrity: sha512-dU+Tx2fsypxTgtLoE36npi3UqcjSSMNYfkqgmoEhtZrraP5VWq0K7FkWVTYa8eMPtnU/G2txVsfdCJTn9uzpuQ==} + dev: false + /caniuse-api@3.0.0: resolution: {integrity: sha512-bsTwuIg/BZZK/vreVTYYbSWoe2F+71P7K5QGEX+pT250DZbfU1MQ5prOKpPR+LL6uWKK3KMwMCAS74QB3Um1uw==} dependencies: @@ -6156,6 +6194,11 @@ packages: resolution: {integrity: sha512-v1plID3y9r/lPhviJ1wrXpLeyUIGAZ2SHNYTEapm7/8A9nLPoyvVp3RK/EPFqn5kEznyWgYZNsRtYYIWbuG8KA==} engines: {node: '>=8'} + /css-color-keywords@1.0.0: + resolution: {integrity: sha512-FyyrDHZKEjXDpNJYvVsV960FiqQyXc/LlYmsxl2BcdMb2WPx0OGRVgTg55rPSyLSNMqP52R9r8geSp7apN3Ofg==} + engines: {node: '>=4'} + dev: false + /css-declaration-sorter@7.1.1(postcss@8.4.33): resolution: {integrity: sha512-dZ3bVTEEc1vxr3Bek9vGwfB5Z6ESPULhcRvO472mfjVnj8jRcTnKO8/JTczlvxM10Myb+wBM++1MtdO76eWcaQ==} engines: {node: ^14 || ^16 || >=18} @@ -6186,6 +6229,10 @@ packages: semver: 7.5.4 webpack: 5.89.0(@swc/core@1.3.105) + /css-mediaquery@0.1.2: + resolution: {integrity: sha512-COtn4EROW5dBGlE/4PiKnh6rZpAPxDeFLaEEwt4i10jpDMFt2EhQGS79QmmrO+iKCHv0PU/HrOWEhijFd1x99Q==} + dev: false + /css-minimizer-webpack-plugin@5.0.1(webpack@5.89.0): resolution: {integrity: sha512-3caImjKFQkS+ws1TGcFn0V1HyDJFq1Euy589JlD6/3rV2kj+w7r5G9WDMgSHvpvXHNZ2calVypZWuEDQd9wfLg==} engines: {node: '>= 14.15.0'} @@ -6228,6 +6275,14 @@ packages: domutils: 3.1.0 nth-check: 2.1.1 + /css-to-react-native@3.2.0: + resolution: {integrity: sha512-e8RKaLXMOFii+02mOlqwjbD00KSEKqblnpO9e++1aXS1fPQOpS1YoqdVHBqPjHNoxeF2mimzVqawm2KCbEdtHQ==} + dependencies: + camelize: 1.0.1 + css-color-keywords: 1.0.0 + postcss-value-parser: 4.2.0 + dev: false + /css-tree@1.1.3: resolution: {integrity: sha512-tRpdppF7TRazZrjJ6v3stzv93qxRcSsFmW6cX0Zm2NVKpxE1WV1HblnghVv9TreireHkqI/VDEsfolRF1p6y7Q==} engines: {node: '>=8.0.0'} @@ -6592,6 +6647,9 @@ packages: dependencies: streamsearch: 1.1.0 + /didyoumean@1.2.2: + resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==} + /diff-sequences@29.6.3: resolution: {integrity: sha512-EjePK1srD3P08o2j4f0ExnylqRs5B9tJjcp9t1krH2qRi8CCdsYfwe9JgSLurFBWwq4uOlipzfk5fHNvwFKr8Q==} engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0} @@ -6606,6 +6664,9 @@ packages: dependencies: path-type: 4.0.0 + /dlv@1.1.3: + resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==} + /dns-packet@5.6.1: resolution: {integrity: sha512-l4gcSouhcgIKRvyy99RNVOgxXiicE+2jZoNmaNmZ6JXiGajBOJAesk1OBlJuM5k2c+eudGdLxDqXuPCKIj6kpw==} engines: {node: '>=6'} @@ -7681,6 +7742,10 @@ packages: transitivePeerDependencies: - supports-color + /extend@3.0.2: + resolution: {integrity: sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==} + dev: false + /fast-deep-equal@3.1.3: resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==} @@ -9481,6 +9546,10 @@ packages: /jimp-compact@0.16.1: resolution: {integrity: sha512-dZ6Ra7u1G8c4Letq/B5EzAxj4tLFHL+cGtdpR+PVm4yzPDj+lCk+AbivWt1eOM+ikzkowtyV7qSqX6qr3t71Ww==} + /jiti@1.21.0: + resolution: {integrity: sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q==} + hasBin: true + /jks-js@1.1.0: resolution: {integrity: sha512-irWi8S2V029Vic63w0/TYa8NIZwXu9oeMtHQsX51JDIVBo0lrEaOoyM8ALEEh5PVKD6TrA26FixQK6TzT7dHqA==} dependencies: @@ -9856,6 +9925,10 @@ packages: lightningcss-linux-x64-musl: 1.19.0 lightningcss-win32-x64-msvc: 1.19.0 + /lilconfig@2.1.0: + resolution: {integrity: sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==} + engines: {node: '>=10'} + /lilconfig@3.0.0: resolution: {integrity: sha512-K2U4W2Ff5ibV7j7ydLr+zLAkIg5JJ4lPn1Ltsdt+Tz/IjQ8buJ55pZAxoP34lqIiwtF9iAvtLv3JGv7CAyAg+g==} engines: {node: '>=14'} @@ -10776,6 +10849,30 @@ packages: engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} hasBin: true + /nativewind@2.0.11(react@18.2.0)(tailwindcss@3.4.1): + resolution: {integrity: sha512-qCEXUwKW21RYJ33KRAJl3zXq2bCq82WoI564fI21D/TiqhfmstZOqPN53RF8qK1NDK6PGl56b2xaTxgObEePEg==} + engines: {node: '>=14.18'} + peerDependencies: + tailwindcss: ~3 + dependencies: + '@babel/generator': 7.23.6 + '@babel/helper-module-imports': 7.18.6 + '@babel/types': 7.19.0 + css-mediaquery: 0.1.2 + css-to-react-native: 3.2.0 + micromatch: 4.0.5 + postcss: 8.4.33 + postcss-calc: 8.2.4(postcss@8.4.33) + postcss-color-functional-notation: 4.2.4(postcss@8.4.33) + postcss-css-variables: 0.18.0(postcss@8.4.33) + postcss-nested: 5.0.6(postcss@8.4.33) + react-is: 18.2.0 + tailwindcss: 3.4.1(ts-node@10.9.1) + use-sync-external-store: 1.2.0(react@18.2.0) + transitivePeerDependencies: + - react + dev: false + /natural-compare@1.4.0: resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==} @@ -11019,6 +11116,10 @@ packages: resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==} engines: {node: '>=0.10.0'} + /object-hash@3.0.0: + resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==} + engines: {node: '>= 6'} + /object-inspect@1.13.1: resolution: {integrity: sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==} @@ -11444,6 +11545,16 @@ packages: transitivePeerDependencies: - supports-color + /postcss-calc@8.2.4(postcss@8.4.33): + resolution: {integrity: sha512-SmWMSJmB8MRnnULldx0lQIyhSNvuDl9HfrZkaqqE/WHAhToYsAvDq+yAsA/kIyINDszOp3Rh0GFoNuH5Ypsm3Q==} + peerDependencies: + postcss: ^8.2.2 + dependencies: + postcss: 8.4.33 + postcss-selector-parser: 6.0.15 + postcss-value-parser: 4.2.0 + dev: false + /postcss-calc@9.0.1(postcss@8.4.33): resolution: {integrity: sha512-TipgjGyzP5QzEhsOZUaIkeO5mKeMFpebWzRogWG/ysonUlnHcq5aJe0jOjpfzUU8PeSaBQnrE8ehR0QA5vs8PQ==} engines: {node: ^14 || ^16 || >=18.0} @@ -11454,6 +11565,16 @@ packages: postcss-selector-parser: 6.0.15 postcss-value-parser: 4.2.0 + /postcss-color-functional-notation@4.2.4(postcss@8.4.33): + resolution: {integrity: sha512-2yrTAUZUab9s6CpxkxC4rVgFEVaR6/2Pipvi6qcgvnYiVqZcbDHEoBDhrXzyb7Efh2CCfHQNtcqWcIruDTIUeg==} + engines: {node: ^12 || ^14 || >=16} + peerDependencies: + postcss: ^8.2 + dependencies: + postcss: 8.4.33 + postcss-value-parser: 4.2.0 + dev: false + /postcss-colormin@6.0.2(postcss@8.4.33): resolution: {integrity: sha512-TXKOxs9LWcdYo5cgmcSHPkyrLAh86hX1ijmyy6J8SbOhyv6ua053M3ZAM/0j44UsnQNIWdl8gb5L7xX2htKeLw==} engines: {node: ^14 || ^16 || >=18.0} @@ -11476,6 +11597,17 @@ packages: postcss: 8.4.33 postcss-value-parser: 4.2.0 + /postcss-css-variables@0.18.0(postcss@8.4.33): + resolution: {integrity: sha512-lYS802gHbzn1GI+lXvy9MYIYDuGnl1WB4FTKoqMQqJ3Mab09A7a/1wZvGTkCEZJTM8mSbIyb1mJYn8f0aPye0Q==} + peerDependencies: + postcss: ^8.2.6 + dependencies: + balanced-match: 1.0.2 + escape-string-regexp: 1.0.5 + extend: 3.0.2 + postcss: 8.4.33 + dev: false + /postcss-discard-comments@6.0.1(postcss@8.4.33): resolution: {integrity: sha512-f1KYNPtqYLUeZGCHQPKzzFtsHaRuECe6jLakf/RjSRqvF5XHLZnM2+fXLhb8Qh/HBFHs3M4cSLb1k3B899RYIg==} engines: {node: ^14 || ^16 || >=18.0} @@ -11519,6 +11651,43 @@ packages: read-cache: 1.0.0 resolve: 1.22.8 + /postcss-import@15.1.0(postcss@8.4.33): + resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==} + engines: {node: '>=14.0.0'} + peerDependencies: + postcss: ^8.0.0 + dependencies: + postcss: 8.4.33 + postcss-value-parser: 4.2.0 + read-cache: 1.0.0 + resolve: 1.22.8 + + /postcss-js@4.0.1(postcss@8.4.33): + resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==} + engines: {node: ^12 || ^14 || >= 16} + peerDependencies: + postcss: ^8.4.21 + dependencies: + camelcase-css: 2.0.1 + postcss: 8.4.33 + + /postcss-load-config@4.0.2(postcss@8.4.33)(ts-node@10.9.1): + resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==} + engines: {node: '>= 14'} + peerDependencies: + postcss: '>=8.0.9' + ts-node: '>=9.0.0' + peerDependenciesMeta: + postcss: + optional: true + ts-node: + optional: true + dependencies: + lilconfig: 3.0.0 + postcss: 8.4.33 + ts-node: 10.9.1(@swc/core@1.3.105)(@types/node@18.16.9)(typescript@5.2.2) + yaml: 2.3.4 + /postcss-loader@6.2.1(postcss@8.4.33)(webpack@5.89.0): resolution: {integrity: sha512-WbbYpmAaKcux/P66bZ40bpWsBucjx/TTgVVzRZ9yUO8yQfVBlameJ0ZGVaPfH64hNSBh63a+ICP5nqOpBA0w+Q==} engines: {node: '>= 12.13.0'} @@ -11631,6 +11800,25 @@ packages: icss-utils: 5.1.0(postcss@8.4.33) postcss: 8.4.33 + /postcss-nested@5.0.6(postcss@8.4.33): + resolution: {integrity: sha512-rKqm2Fk0KbA8Vt3AdGN0FB9OBOMDVajMG6ZCf/GoHgdxUJ4sBFp0A/uMIRm+MJUdo33YXEtjqIz8u7DAp8B7DA==} + engines: {node: '>=12.0'} + peerDependencies: + postcss: ^8.2.14 + dependencies: + postcss: 8.4.33 + postcss-selector-parser: 6.0.15 + dev: false + + /postcss-nested@6.0.1(postcss@8.4.33): + resolution: {integrity: sha512-mEp4xPMi5bSWiMbsgoPfcP74lsWLHkQbZc3sY+jWYd65CUwXrUaTp0fmNpa01ZcETKlIgUdFN/MpS2xZtqL9dQ==} + engines: {node: '>=12.0'} + peerDependencies: + postcss: ^8.2.14 + dependencies: + postcss: 8.4.33 + postcss-selector-parser: 6.0.15 + /postcss-normalize-charset@6.0.1(postcss@8.4.33): resolution: {integrity: sha512-aW5LbMNRZ+oDV57PF9K+WI1Z8MPnF+A8qbajg/T8PP126YrGX1f9IQx21GI2OlGz7XFJi/fNi0GTbY948XJtXg==} engines: {node: ^14 || ^16 || >=18.0} @@ -11794,6 +11982,58 @@ packages: fast-diff: 1.3.0 dev: true + /prettier-plugin-tailwindcss@0.5.11(prettier@3.2.4): + resolution: {integrity: sha512-AvI/DNyMctyyxGOjyePgi/gqj5hJYClZ1avtQvLlqMT3uDZkRbi4HhGUpok3DRzv9z7Lti85Kdj3s3/1CeNI0w==} + engines: {node: '>=14.21.3'} + peerDependencies: + '@ianvs/prettier-plugin-sort-imports': '*' + '@prettier/plugin-pug': '*' + '@shopify/prettier-plugin-liquid': '*' + '@trivago/prettier-plugin-sort-imports': '*' + prettier: ^3.0 + prettier-plugin-astro: '*' + prettier-plugin-css-order: '*' + prettier-plugin-import-sort: '*' + prettier-plugin-jsdoc: '*' + prettier-plugin-marko: '*' + prettier-plugin-organize-attributes: '*' + prettier-plugin-organize-imports: '*' + prettier-plugin-style-order: '*' + prettier-plugin-svelte: '*' + prettier-plugin-twig-melody: '*' + peerDependenciesMeta: + '@ianvs/prettier-plugin-sort-imports': + optional: true + '@prettier/plugin-pug': + optional: true + '@shopify/prettier-plugin-liquid': + optional: true + '@trivago/prettier-plugin-sort-imports': + optional: true + prettier-plugin-astro: + optional: true + prettier-plugin-css-order: + optional: true + prettier-plugin-import-sort: + optional: true + prettier-plugin-jsdoc: + optional: true + prettier-plugin-marko: + optional: true + prettier-plugin-organize-attributes: + optional: true + prettier-plugin-organize-imports: + optional: true + prettier-plugin-style-order: + optional: true + prettier-plugin-svelte: + optional: true + prettier-plugin-twig-melody: + optional: true + dependencies: + prettier: 3.2.4 + dev: true + /prettier@3.2.4: resolution: {integrity: sha512-FWu1oLHKCrtpO1ypU6J0SbK2d9Ckwysq6bHj/uaCP26DxrPpppCLQRGVuqAxSTvhF00AcvDRyYrLNW7ocBhFFQ==} engines: {node: '>=14'} @@ -13249,6 +13489,36 @@ packages: tslib: 2.6.2 dev: true + /tailwindcss@3.4.1(ts-node@10.9.1): + resolution: {integrity: sha512-qAYmXRfk3ENzuPBakNK0SRrUDipP8NQnEY6772uDhflcQz5EhRdD7JNZxyrFHVQNCwULPBn6FNPp9brpO7ctcA==} + engines: {node: '>=14.0.0'} + hasBin: true + dependencies: + '@alloc/quick-lru': 5.2.0 + arg: 5.0.2 + chokidar: 3.5.3 + didyoumean: 1.2.2 + dlv: 1.1.3 + fast-glob: 3.3.2 + glob-parent: 6.0.2 + is-glob: 4.0.3 + jiti: 1.21.0 + lilconfig: 2.1.0 + micromatch: 4.0.5 + normalize-path: 3.0.0 + object-hash: 3.0.0 + picocolors: 1.0.0 + postcss: 8.4.33 + postcss-import: 15.1.0(postcss@8.4.33) + postcss-js: 4.0.1(postcss@8.4.33) + postcss-load-config: 4.0.2(postcss@8.4.33)(ts-node@10.9.1) + postcss-nested: 6.0.1(postcss@8.4.33) + postcss-selector-parser: 6.0.15 + resolve: 1.22.8 + sucrase: 3.35.0 + transitivePeerDependencies: + - ts-node + /tapable@2.2.1: resolution: {integrity: sha512-GNzQvQTOIP6RyTfE2Qxb8ZVlNmw0n88vp1szwWRimP02mnTsx3Wtn5qRdqY9w2XduFNUgvOwhNnQsjwCp+kqaQ==} engines: {node: '>=6'}