├── .gitignore ├── .vscode └── settings.json ├── README.md ├── apps └── native │ ├── .gitignore │ ├── App.tsx │ ├── app.json │ ├── assets │ ├── adaptive-icon.png │ ├── favicon.png │ ├── icon.png │ └── splash.png │ ├── babel.config.js │ ├── index.js │ ├── metro.config.js │ ├── package.json │ └── tsconfig.json ├── biome.json ├── package.json ├── packages ├── core │ ├── .gitignore │ ├── README.md │ ├── package.json │ ├── src │ │ ├── components │ │ │ ├── button │ │ │ │ ├── button.test.tsx │ │ │ │ ├── button.tsx │ │ │ │ └── index.tsx │ │ │ ├── flex │ │ │ │ ├── flex.tsx │ │ │ │ └── index.ts │ │ │ └── index.tsx │ │ └── index.tsx │ ├── tsconfig.json │ └── tsup.config.ts ├── package-config │ └── tsup.ts └── typescript-config │ ├── base.json │ ├── nextjs.json │ ├── package.json │ └── react-native-library.json ├── scripts ├── create-package.ts └── example │ ├── .gitignore │ ├── README.md │ ├── package.json │ ├── src │ ├── index.tsx │ └── text.tsx │ ├── tsconfig.json │ └── tsup.config.ts ├── tsconfig.json ├── turbo.json └── yarn.lock /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | node_modules 5 | .pnp 6 | .pnp.js 7 | 8 | # testing 9 | coverage 10 | 11 | # next.js 12 | .next/ 13 | .swc/ 14 | out/ 15 | build 16 | 17 | # expo 18 | .expo 19 | 20 | # misc 21 | .DS_Store 22 | *.pem 23 | dist 24 | 25 | # debug 26 | npm-debug.log* 27 | yarn-debug.log* 28 | yarn-error.log* 29 | 30 | # local env files 31 | .env.local 32 | .env.development.local 33 | .env.test.local 34 | .env.production.local 35 | 36 | # turbo 37 | .turbo 38 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "java.configuration.updateBuildConfiguration": "interactive" 3 | } 4 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Lext - React Native UI Library 2 | 3 | ## Simplify Mobile App Development with Powerful, Flexible, and User-Friendly UI Components 4 | 5 | ![Lext Logo](https://res.cloudinary.com/dwmejslx5/video/upload/v1712173674/namsqlrjd4yslli11tzv.jpg) 6 | 7 | Lext is a sophisticated UI library designed for React Native, aiming to enhance mobile app development. 8 | 9 | [![npm version](https://img.shields.io/npm/v/@lextdev/core.svg?style=flat)](https://www.npmjs.com/package/@lextdev/core) 10 | [![GitHub issues](https://img.shields.io/github/issues/lextdev/lext)](https://github.com/lextdev/lext/issues) 11 | [![Contributions welcome](https://img.shields.io/badge/contributions-welcome-orange.svg)](https://github.com/lextdev/lext/pulls) 12 | [![License](https://img.shields.io/badge/license-MIT-blue.svg)](https://opensource.org/licenses/MIT) 13 | 14 | ## 🚀 About 15 | 16 | Lext is a UI library created for React Native developers who aspire to build modern and innovative mobile applications. Developing interfaces with Lext is not only quick and effective but also enjoyable. Our library provides everything your application needs, from basic UI components to complex controls. 17 | 18 | ## ✨ Features 19 | 20 | - [**Core**](packages/core/README.md): Essential UI components. Buttons, cards, modals, and more. 21 | - [**Hook**](packages/hook/README.md): Enhance your development experience with custom React Native hooks. 22 | - [**Storage**](packages/storage/README.md): Tools for easy data storage and management. 23 | - [**Form**](packages/form/README.md): Strong form management and validation features. 24 | 25 | Each package can be installed and used modularly, according to your project's needs. 26 | 27 | ## 🤝 Contributing 28 | 29 | As the Lext community, we always welcome developers who want to contribute to the project! Whether it's a bug fix or a new feature, we look forward to your ideas and pull requests. 30 | 31 | ## 📄 License 32 | 33 | Lext is licensed under the MIT License. For details, see the License file. -------------------------------------------------------------------------------- /apps/native/.gitignore: -------------------------------------------------------------------------------- 1 | # Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files 2 | 3 | # dependencies 4 | node_modules/ 5 | 6 | # Expo 7 | .expo/ 8 | dist/ 9 | web-build/ 10 | 11 | # Native 12 | *.orig.* 13 | *.jks 14 | *.p8 15 | *.p12 16 | *.key 17 | *.mobileprovision 18 | 19 | # Metro 20 | .metro-health-check* 21 | 22 | # debug 23 | npm-debug.* 24 | yarn-debug.* 25 | yarn-error.* 26 | 27 | # macOS 28 | .DS_Store 29 | *.pem 30 | 31 | # local env files 32 | .env*.local 33 | 34 | # typescript 35 | *.tsbuildinfo 36 | -------------------------------------------------------------------------------- /apps/native/App.tsx: -------------------------------------------------------------------------------- 1 | import { Text, View } from "react-native"; 2 | 3 | export default function App() { 4 | return ( 5 | 6 | Open up App.tsx to start working on your app! 7 | Hello World! 8 | 9 | ); 10 | } 11 | -------------------------------------------------------------------------------- /apps/native/app.json: -------------------------------------------------------------------------------- 1 | { 2 | "expo": { 3 | "name": "example", 4 | "slug": "example", 5 | "version": "1.0.0", 6 | "orientation": "portrait", 7 | "icon": "./assets/icon.png", 8 | "userInterfaceStyle": "light", 9 | "splash": { 10 | "image": "./assets/splash.png", 11 | "resizeMode": "contain", 12 | "backgroundColor": "#ffffff" 13 | }, 14 | "ios": { 15 | "supportsTablet": true, 16 | "bundleIdentifier": "com.ynssenem.example" 17 | }, 18 | "android": { 19 | "adaptiveIcon": { 20 | "foregroundImage": "./assets/adaptive-icon.png", 21 | "backgroundColor": "#ffffff" 22 | }, 23 | "package": "com.ynssenem.example" 24 | }, 25 | "web": { 26 | "favicon": "./assets/favicon.png" 27 | } 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /apps/native/assets/adaptive-icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lextdev/lext/2150c69b987e619280631eff3618ebbaa84e0d33/apps/native/assets/adaptive-icon.png -------------------------------------------------------------------------------- /apps/native/assets/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lextdev/lext/2150c69b987e619280631eff3618ebbaa84e0d33/apps/native/assets/favicon.png -------------------------------------------------------------------------------- /apps/native/assets/icon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lextdev/lext/2150c69b987e619280631eff3618ebbaa84e0d33/apps/native/assets/icon.png -------------------------------------------------------------------------------- /apps/native/assets/splash.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/lextdev/lext/2150c69b987e619280631eff3618ebbaa84e0d33/apps/native/assets/splash.png -------------------------------------------------------------------------------- /apps/native/babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = (api) => { 2 | api.cache(true); 3 | return { 4 | presets: ["babel-preset-expo"], 5 | }; 6 | }; 7 | -------------------------------------------------------------------------------- /apps/native/index.js: -------------------------------------------------------------------------------- 1 | import { registerRootComponent } from 'expo'; 2 | 3 | import App from './App'; 4 | 5 | // registerRootComponent calls AppRegistry.registerComponent('main', () => App); 6 | // It also ensures that whether you load the app in Expo Go or in a native build, 7 | // the environment is set up appropriately 8 | registerRootComponent(App); 9 | -------------------------------------------------------------------------------- /apps/native/metro.config.js: -------------------------------------------------------------------------------- 1 | // Learn more https://docs.expo.io/guides/customizing-metro 2 | const { getDefaultConfig } = require("expo/metro-config"); 3 | const path = require("node:path"); 4 | 5 | // Find the workspace root, this can be replaced with `find-yarn-workspace-root` 6 | const workspaceRoot = path.resolve(__dirname, "../.."); 7 | const projectRoot = __dirname; 8 | 9 | const config = getDefaultConfig(projectRoot); 10 | 11 | // 1. Watch all files within the monorepo 12 | config.watchFolders = [workspaceRoot]; 13 | // 2. Let Metro know where to resolve packages, and in what order 14 | config.resolver.nodeModulesPaths = [ 15 | path.resolve(projectRoot, "node_modules"), 16 | path.resolve(workspaceRoot, "node_modules"), 17 | ]; 18 | // 3. Force Metro to resolve (sub)dependencies only from the `nodeModulesPaths` 19 | config.resolver.disableHierarchicalLookup = true; 20 | 21 | module.exports = config; 22 | -------------------------------------------------------------------------------- /apps/native/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@lextdev/native", 3 | "version": "1.0.0", 4 | "scripts": { 5 | "start": "expo start", 6 | "android": "expo start --android", 7 | "dev": "expo start --ios", 8 | "ios": "expo start --ios", 9 | "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf ios && rm -rf android" 10 | }, 11 | "dependencies": { 12 | "@lextdev/core": "*", 13 | "expo": "^52.0.17", 14 | "expo-status-bar": "^2.0.0", 15 | "react": "^18.2.0", 16 | "react-native": "^0.76.3" 17 | }, 18 | "devDependencies": { 19 | "@babel/core": "^7.20.0", 20 | "@types/react": "^18.2.64", 21 | "typescript": "^5.4.2" 22 | }, 23 | "private": true 24 | } 25 | -------------------------------------------------------------------------------- /apps/native/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "expo/tsconfig.base", 3 | "compilerOptions": { 4 | "strict": true 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /biome.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json", 3 | "vcs": { 4 | "enabled": false, 5 | "clientKind": "git", 6 | "useIgnoreFile": false 7 | }, 8 | "files": { 9 | "ignoreUnknown": false, 10 | "ignore": [] 11 | }, 12 | "formatter": { 13 | "enabled": true, 14 | "indentStyle": "tab" 15 | }, 16 | "organizeImports": { 17 | "enabled": true 18 | }, 19 | "linter": { 20 | "enabled": true, 21 | "rules": { 22 | "recommended": true 23 | } 24 | }, 25 | "javascript": { 26 | "formatter": { 27 | "quoteStyle": "double" 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "lextdev", 3 | "private": true, 4 | "workspaces": ["apps/*", "packages/*"], 5 | "scripts": { 6 | "prebuild": "turbo run prebuild --filter=@lextdev/native", 7 | "dev": "turbo run dev", 8 | "clean": "turbo run clean && rm -rf node_modules", 9 | "test": "turbo run test", 10 | "create": "yarn run scripts/create-package.ts", 11 | "format": "turbo run format", 12 | "format:check": "turbo run format:check", 13 | "pod": "cd apps/native/ios && pod install", 14 | "setup:ios": "yarn prebuild && yarn pod" 15 | }, 16 | "devDependencies": { 17 | "@biomejs/biome": "^1.9.4", 18 | "turbo": "^2.3.3" 19 | }, 20 | "engines": { 21 | "node": ">=18" 22 | }, 23 | "packageManager": "yarn@1.22.22" 24 | } 25 | -------------------------------------------------------------------------------- /packages/core/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | node_modules 5 | .pnp 6 | .pnp.js 7 | 8 | # misc 9 | .DS_Store 10 | *.pem 11 | 12 | # build 13 | dist 14 | 15 | # debug 16 | npm-debug.log* 17 | yarn-debug.log* 18 | yarn-error.log* 19 | 20 | # local env files 21 | .env.local 22 | .env.development.local 23 | .env.test.local 24 | .env.production.local 25 | 26 | # turbo 27 | .turbo 28 | -------------------------------------------------------------------------------- /packages/core/README.md: -------------------------------------------------------------------------------- 1 | # button 2 | 3 | To install dependencies: 4 | 5 | ```bash 6 | yarn install 7 | ``` 8 | 9 | To run: 10 | 11 | ```bash 12 | yarn index.ts 13 | ``` 14 | -------------------------------------------------------------------------------- /packages/core/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@lextdev/core", 3 | "version": "1.0.0", 4 | "main": "dist/index.js", 5 | "module": "dist/index.mjs", 6 | "types": "dist/index.d.ts", 7 | "scripts": { 8 | "build": "tsup", 9 | "dev": "tsup --watch", 10 | "clean": "rm -rf dist", 11 | "test": "yarn test" 12 | }, 13 | "dependencies": { 14 | "react": ">=18", 15 | "react-native": ">=0.73" 16 | }, 17 | "devDependencies": { 18 | "@testing-library/react-native": "^12.9.0", 19 | "@types/jest": "^29.5.14", 20 | "@types/mocha": "^10.0.10", 21 | "@types/react": "^18.2.64", 22 | "@types/react-native": "^0.73.0", 23 | "tsup": "^8.0.2", 24 | "typescript": "^5.4.2" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /packages/core/src/components/button/button.test.tsx: -------------------------------------------------------------------------------- 1 | import { fireEvent, render } from "@testing-library/react-native"; 2 | import * as React from "react"; 3 | import { Button } from "./button"; 4 | 5 | describe("Button", () => { 6 | it("renders correctly", () => { 7 | const { getByText } = render( 8 |