Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support mjs and ts config #26

Merged
merged 4 commits into from
Dec 27, 2024
Merged

Support mjs and ts config #26

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
118d514
Support mjs and ts config
pontusab Dec 27, 2024
3870c20
Format
pontusab Dec 27, 2024
6320d90
Format
pontusab Dec 27, 2024
f0a7969
Bump version
pontusab Dec 27, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions biome.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
"enabled": true
},
"linter": {
"ignore": ["node_modules"],
"ignore": ["node_modules", ".next", "*.json", "test", "dist"],
"enabled": true,
"rules": {
"recommended": true,
Expand All @@ -22,6 +22,6 @@
},
"formatter": {
"indentStyle": "space",
"ignore": ["test/resources", "test/snapshots"]
"ignore": ["*.json", ".next", "dist", "test"]
}
}
Binary file modified bun.lockb
View file
Open in desktop
Binary file not shown.
8 changes: 3 additions & 5 deletions examples/android/languine.config.ts → examples/android/languine.config.mjs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
import { defineConfig } from "languine";

export default defineConfig({
version: "0.6.7",
export default {
version: "0.6.8",
locale: {
source: "en",
targets: ["es"],
Expand All @@ -15,4 +13,4 @@ export default defineConfig({
provider: "openai",
model: "gpt-4-turbo",
},
});
};
4 changes: 2 additions & 2 deletions examples/android/locales/es.xml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,8 +41,8 @@
<item quantity="other">%d canciones en cola</item>
</plurals>
<plurals name="notification_likes">
<item quantity="one">A %d persona le gustó tu publicación</item>
<item quantity="other">A %d personas les gustó tu publicación</item>
<item quantity="one">%d persona le gustó tu publicación</item>
<item quantity="other">%d personas les gustó tu publicación</item>
</plurals>
<plurals name="game_achievements">
<item quantity="one">%d logro desbloqueado</item>
Expand Down
35 changes: 20 additions & 15 deletions examples/expo/app/(tabs)/_layout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,43 +1,48 @@
import { Tabs } from 'expo-router';
import React from 'react';
import { Platform } from 'react-native';
import { Tabs } from "expo-router";
import React from "react";
import { Platform } from "react-native";

import { HapticTab } from '@/components/HapticTab';
import { IconSymbol } from '@/components/ui/IconSymbol';
import TabBarBackground from '@/components/ui/TabBarBackground';
import { Colors } from '@/constants/Colors';
import { useColorScheme } from '@/hooks/useColorScheme';
import { HapticTab } from "@/components/HapticTab";
import { IconSymbol } from "@/components/ui/IconSymbol";
import TabBarBackground from "@/components/ui/TabBarBackground";
import { Colors } from "@/constants/Colors";
import { useColorScheme } from "@/hooks/useColorScheme";

export default function TabLayout() {
const colorScheme = useColorScheme();

return (
<Tabs
screenOptions={{
tabBarActiveTintColor: Colors[colorScheme ?? 'light'].tint,
tabBarActiveTintColor: Colors[colorScheme ?? "light"].tint,
headerShown: false,
tabBarButton: HapticTab,
tabBarBackground: TabBarBackground,
tabBarStyle: Platform.select({
ios: {
// Use a transparent background on iOS to show the blur effect
position: 'absolute',
position: "absolute",
},
default: {},
}),
}}>
}}
>
<Tabs.Screen
name="index"
options={{
title: 'Home',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="house.fill" color={color} />,
title: "Home",
tabBarIcon: ({ color }) => (
<IconSymbol size={28} name="house.fill" color={color} />
),
}}
/>
<Tabs.Screen
name="explore"
options={{
title: 'Explore',
tabBarIcon: ({ color }) => <IconSymbol size={28} name="paperplane.fill" color={color} />,
title: "Explore",
tabBarIcon: ({ color }) => (
<IconSymbol size={28} name="paperplane.fill" color={color} />
),
}}
/>
</Tabs>
Expand Down
82 changes: 51 additions & 31 deletions examples/expo/app/(tabs)/explore.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,36 +1,41 @@
import { StyleSheet, Image, Platform } from 'react-native';
import { StyleSheet, Image, Platform } from "react-native";

import { Collapsible } from '@/components/Collapsible';
import { ExternalLink } from '@/components/ExternalLink';
import ParallaxScrollView from '@/components/ParallaxScrollView';
import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
import { IconSymbol } from '@/components/ui/IconSymbol';
import { Collapsible } from "@/components/Collapsible";
import { ExternalLink } from "@/components/ExternalLink";
import ParallaxScrollView from "@/components/ParallaxScrollView";
import { ThemedText } from "@/components/ThemedText";
import { ThemedView } from "@/components/ThemedView";
import { IconSymbol } from "@/components/ui/IconSymbol";

export default function TabTwoScreen() {
return (
<ParallaxScrollView
headerBackgroundColor={{ light: '#D0D0D0', dark: '#353636' }}
headerBackgroundColor={{ light: "#D0D0D0", dark: "#353636" }}
headerImage={
<IconSymbol
size={310}
color="#808080"
name="chevron.left.forwardslash.chevron.right"
style={styles.headerImage}
/>
}>
}
>
<ThemedView style={styles.titleContainer}>
<ThemedText type="title">Explore</ThemedText>
</ThemedView>
<ThemedText>This app includes example code to help you get started.</ThemedText>
<ThemedText>
This app includes example code to help you get started.
</ThemedText>
<Collapsible title="File-based routing">
<ThemedText>
This app has two screens:{' '}
<ThemedText type="defaultSemiBold">app/(tabs)/index.tsx</ThemedText> and{' '}
This app has two screens:{" "}
<ThemedText type="defaultSemiBold">app/(tabs)/index.tsx</ThemedText>{" "}
and{" "}
<ThemedText type="defaultSemiBold">app/(tabs)/explore.tsx</ThemedText>
</ThemedText>
<ThemedText>
The layout file in <ThemedText type="defaultSemiBold">app/(tabs)/_layout.tsx</ThemedText>{' '}
The layout file in{" "}
<ThemedText type="defaultSemiBold">app/(tabs)/_layout.tsx</ThemedText>{" "}
sets up the tab navigator.
</ThemedText>
<ExternalLink href="https://docs.expo.dev/router/introduction">
Expand All @@ -39,25 +44,31 @@ export default function TabTwoScreen() {
</Collapsible>
<Collapsible title="Android, iOS, and web support">
<ThemedText>
You can open this project on Android, iOS, and the web. To open the web version, press{' '}
<ThemedText type="defaultSemiBold">w</ThemedText> in the terminal running this project.
You can open this project on Android, iOS, and the web. To open the
web version, press <ThemedText type="defaultSemiBold">w</ThemedText>{" "}
in the terminal running this project.
</ThemedText>
</Collapsible>
<Collapsible title="Images">
<ThemedText>
For static images, you can use the <ThemedText type="defaultSemiBold">@2x</ThemedText> and{' '}
<ThemedText type="defaultSemiBold">@3x</ThemedText> suffixes to provide files for
different screen densities
For static images, you can use the{" "}
<ThemedText type="defaultSemiBold">@2x</ThemedText> and{" "}
<ThemedText type="defaultSemiBold">@3x</ThemedText> suffixes to
provide files for different screen densities
</ThemedText>
<Image source={require('@/assets/images/react-logo.png')} style={{ alignSelf: 'center' }} />
<Image
source={require("@/assets/images/react-logo.png")}
style={{ alignSelf: "center" }}
/>
<ExternalLink href="https://reactnative.dev/docs/images">
<ThemedText type="link">Learn more</ThemedText>
</ExternalLink>
</Collapsible>
<Collapsible title="Custom fonts">
<ThemedText>
Open <ThemedText type="defaultSemiBold">app/_layout.tsx</ThemedText> to see how to load{' '}
<ThemedText style={{ fontFamily: 'SpaceMono' }}>
Open <ThemedText type="defaultSemiBold">app/_layout.tsx</ThemedText>{" "}
to see how to load{" "}
<ThemedText style={{ fontFamily: "SpaceMono" }}>
custom fonts such as this one.
</ThemedText>
</ThemedText>
Expand All @@ -67,25 +78,34 @@ export default function TabTwoScreen() {
</Collapsible>
<Collapsible title="Light and dark mode components">
<ThemedText>
This template has light and dark mode support. The{' '}
<ThemedText type="defaultSemiBold">useColorScheme()</ThemedText> hook lets you inspect
what the user's current color scheme is, and so you can adjust UI colors accordingly.
This template has light and dark mode support. The{" "}
<ThemedText type="defaultSemiBold">useColorScheme()</ThemedText> hook
lets you inspect what the user's current color scheme is, and so you
can adjust UI colors accordingly.
</ThemedText>
<ExternalLink href="https://docs.expo.dev/develop/user-interface/color-themes/">
<ThemedText type="link">Learn more</ThemedText>
</ExternalLink>
</Collapsible>
<Collapsible title="Animations">
<ThemedText>
This template includes an example of an animated component. The{' '}
<ThemedText type="defaultSemiBold">components/HelloWave.tsx</ThemedText> component uses
the powerful <ThemedText type="defaultSemiBold">react-native-reanimated</ThemedText>{' '}
This template includes an example of an animated component. The{" "}
<ThemedText type="defaultSemiBold">
components/HelloWave.tsx
</ThemedText>{" "}
component uses the powerful{" "}
<ThemedText type="defaultSemiBold">
react-native-reanimated
</ThemedText>{" "}
library to create a waving hand animation.
</ThemedText>
{Platform.select({
ios: (
<ThemedText>
The <ThemedText type="defaultSemiBold">components/ParallaxScrollView.tsx</ThemedText>{' '}
The{" "}
<ThemedText type="defaultSemiBold">
components/ParallaxScrollView.tsx
</ThemedText>{" "}
component provides a parallax effect for the header image.
</ThemedText>
),
Expand All @@ -97,13 +117,13 @@ export default function TabTwoScreen() {

const styles = StyleSheet.create({
headerImage: {
color: '#808080',
color: "#808080",
bottom: -90,
left: -35,
position: 'absolute',
position: "absolute",
},
titleContainer: {
flexDirection: 'row',
flexDirection: "row",
gap: 8,
},
});
48 changes: 26 additions & 22 deletions examples/expo/app/(tabs)/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,52 +1,56 @@
import { Image, StyleSheet, Platform } from 'react-native';
import { Image, StyleSheet, Platform } from "react-native";

import { HelloWave } from '@/components/HelloWave';
import ParallaxScrollView from '@/components/ParallaxScrollView';
import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
import { HelloWave } from "@/components/HelloWave";
import ParallaxScrollView from "@/components/ParallaxScrollView";
import { ThemedText } from "@/components/ThemedText";
import { ThemedView } from "@/components/ThemedView";

export default function HomeScreen() {
return (
<ParallaxScrollView
headerBackgroundColor={{ light: '#A1CEDC', dark: '#1D3D47' }}
headerBackgroundColor={{ light: "#A1CEDC", dark: "#1D3D47" }}
headerImage={
<Image
source={require('@/assets/images/partial-react-logo.png')}
source={require("@/assets/images/partial-react-logo.png")}
style={styles.reactLogo}
/>
}>
}
>
<ThemedView style={styles.titleContainer}>
<ThemedText type="title">Welcome!</ThemedText>
<HelloWave />
</ThemedView>
<ThemedView style={styles.stepContainer}>
<ThemedText type="subtitle">Step 1: Try it</ThemedText>
<ThemedText>
Edit <ThemedText type="defaultSemiBold">app/(tabs)/index.tsx</ThemedText> to see changes.
Press{' '}
Edit{" "}
<ThemedText type="defaultSemiBold">app/(tabs)/index.tsx</ThemedText>{" "}
to see changes. Press{" "}
<ThemedText type="defaultSemiBold">
{Platform.select({
ios: 'cmd + d',
android: 'cmd + m',
web: 'F12'
ios: "cmd + d",
android: "cmd + m",
web: "F12",
})}
</ThemedText>{' '}
</ThemedText>{" "}
to open developer tools.
</ThemedText>
</ThemedView>
<ThemedView style={styles.stepContainer}>
<ThemedText type="subtitle">Step 2: Explore</ThemedText>
<ThemedText>
Tap the Explore tab to learn more about what's included in this starter app.
Tap the Explore tab to learn more about what's included in this
starter app.
</ThemedText>
</ThemedView>
<ThemedView style={styles.stepContainer}>
<ThemedText type="subtitle">Step 3: Get a fresh start</ThemedText>
<ThemedText>
When you're ready, run{' '}
<ThemedText type="defaultSemiBold">npm run reset-project</ThemedText> to get a fresh{' '}
<ThemedText type="defaultSemiBold">app</ThemedText> directory. This will move the current{' '}
<ThemedText type="defaultSemiBold">app</ThemedText> to{' '}
When you're ready, run{" "}
<ThemedText type="defaultSemiBold">npm run reset-project</ThemedText>{" "}
to get a fresh <ThemedText type="defaultSemiBold">app</ThemedText>{" "}
directory. This will move the current{" "}
<ThemedText type="defaultSemiBold">app</ThemedText> to{" "}
<ThemedText type="defaultSemiBold">app-example</ThemedText>.
</ThemedText>
</ThemedView>
Expand All @@ -56,8 +60,8 @@ export default function HomeScreen() {

const styles = StyleSheet.create({
titleContainer: {
flexDirection: 'row',
alignItems: 'center',
flexDirection: "row",
alignItems: "center",
gap: 8,
},
stepContainer: {
Expand All @@ -69,6 +73,6 @@ const styles = StyleSheet.create({
width: 290,
bottom: 0,
left: 0,
position: 'absolute',
position: "absolute",
},
});
14 changes: 7 additions & 7 deletions examples/expo/app/+not-found.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,13 +1,13 @@
import { Link, Stack } from 'expo-router';
import { StyleSheet } from 'react-native';
import { Link, Stack } from "expo-router";
import { StyleSheet } from "react-native";

import { ThemedText } from '@/components/ThemedText';
import { ThemedView } from '@/components/ThemedView';
import { ThemedText } from "@/components/ThemedText";
import { ThemedView } from "@/components/ThemedView";

export default function NotFoundScreen() {
return (
<>
<Stack.Screen options={{ title: 'Oops!' }} />
<Stack.Screen options={{ title: "Oops!" }} />
<ThemedView style={styles.container}>
<ThemedText type="title">This screen doesn't exist.</ThemedText>
<Link href="/" style={styles.link}>
Expand All @@ -21,8 +21,8 @@ export default function NotFoundScreen() {
const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
justifyContent: 'center',
alignItems: "center",
justifyContent: "center",
padding: 20,
},
link: {
Expand Down
Loading
Loading