@thanhphi/create-360-miniapp 0.0.0-stage → 0.2.1

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 thanhphi
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -1,3 +1,329 @@
-# Temporary Holding Version
+# @thanhphi/create-360-miniapp
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+Tạo mini app React Native chạy bên trong MySGR, có thể chạy độc lập để phát triển và kiểm thử.
+
+Project được tạo sẵn gồm TypeScript, navigation, đăng nhập qua host, HTTP client có refresh token, màn hồ sơ mẫu, theme 360, cấu hình môi trường và pipeline Azure DevOps.
+
+## Mục lục
+
+- [Bắt đầu nhanh](#bắt-đầu-nhanh)
+- [Yêu cầu](#yêu-cầu)
+- [Các lựa chọn khi tạo app](#các-lựa-chọn-khi-tạo-app)
+- [Cấu trúc project](#cấu-trúc-project)
+- [Cấu hình môi trường và API](#cấu-hình-môi-trường-và-api)
+- [Chạy trong MySGR](#chạy-trong-mysgr)
+- [Chạy độc lập](#chạy-độc-lập)
+- [Thêm màn hình và gọi API](#thêm-màn-hình-và-gọi-api)
+- [Màu sắc và kích thước UI](#màu-sắc-và-kích-thước-ui)
+- [Đóng gói và triển khai](#đóng-gói-và-triển-khai)
+- [Xử lý vấn đề thường gặp](#xử-lý-vấn-đề-thường-gặp)
+
+## Bắt đầu nhanh
+
+Ví dụ tạo mini app quản lý nghỉ phép:
+
+```sh
+npx @thanhphi/create-360-miniapp@latest leave-management --module leave --app-code LVE --port 8085
+cd leave-management
+npm install
+npm run env:staging
+npm run start:mf
+```
+
+Lệnh cuối mở Re.Pack dev server. Để xem giao diện, mở app đã đăng ký từ **host MySGR có cấu hình trỏ tới dev server này**. Đây không phải lệnh khởi chạy một ứng dụng độc lập trên điện thoại.
+
+Có thể tạo project bằng npm create thay cho npx:
+
+```sh
+npm create @thanhphi/360-miniapp@latest leave-management -- --module leave --app-code LVE --port 8085
+```
+
+Generator chỉ tạo thư mục mới, không ghi đè project có sẵn và không tự tạo Git repository. App vừa sinh có README riêng với các giá trị cấu hình đã được điền.
+
+## Yêu cầu
+
+Bộ phiên bản của template:
+
+| Thành phần                | Phiên bản                           |
+| ------------------------- | ----------------------------------- |
+| Node.js                   | Từ 20.19.4; khuyến nghị Node 22 LTS |
+| Expo                      | SDK 55                              |
+| React / React Native      | 19.2.0 / 0.83.6                     |
+| UI360 / miniapp-sdk       | 0.2.0 / 0.1.0                       |
+| Unistyles / Nitro Modules | 3.2.5 / 0.36.5                      |
+| Re.Pack                   | 5.2.x                               |
+
+- Chạy trong MySGR: cần host cung cấp các native dependencies tương thích, cấu hình tải remote và `hostCapabilities` theo SDK.
+- Chạy độc lập trên iOS: cần macOS, Xcode và CocoaPods.
+- Chạy độc lập trên Android: cần Android SDK, JDK và emulator hoặc thiết bị thật.
+- Không dùng Expo Go cho template này; các native dependencies yêu cầu development build.
+- UI360 được đóng gói trong mini app, không bắt buộc host dùng cùng phiên bản UI360. React, Unistyles và các native dependencies vẫn dùng chung với host.
+
+## Các lựa chọn khi tạo app
+
+```sh
+npx @thanhphi/create-360-miniapp@latest leave-management --module leave --container LeaveManagement --app-code LVE --display-name "Quản lý nghỉ phép" --bundle-id com.sungroup.leave --port 8085 --env staging
+```
+
+| Lựa chọn               | Ý nghĩa                                             | Mặc định                                           |
+| ---------------------- | --------------------------------------------------- | -------------------------------------------------- |
+| Tên project            | Tên thư mục và npm package, dạng `leave-management` | Bắt buộc                                           |
+| `--module`             | Thư mục nghiệp vụ trong `src/modules/`              | Tên project                                        |
+| `--container`          | Tên container Re.Pack, dạng PascalCase              | Tên project chuyển thành PascalCase                |
+| `--app-code`           | Mã nghiệp vụ của app trên backend                   | Tên project bỏ dấu gạch, viết hoa, tối đa 12 ký tự |
+| `--display-name`       | Tên hiển thị khi chạy độc lập                       | Tên container                                      |
+| `--bundle-id`          | ID ứng dụng native, phải riêng cho mỗi app          | `com.sungroup.<tên-project-bỏ-dấu-gạch>`           |
+| `--port`               | Port Re.Pack, từ 1024 đến 65535                     | `8085`                                             |
+| `--env`                | Môi trường ban đầu: `staging`, `beta`, `prod`       | `staging`                                          |
+| `--install`            | Tạo project rồi chạy npm install                    | Không tự cài                                       |
+| `--native`             | Cài dependencies và chạy Expo prebuild              | Không tạo ios/android                              |
+| `--help` / `--version` | Xem trợ giúp / phiên bản generator                  | —                                                  |
+
+App ID trong catalog mặc định bằng tên project, ví dụ `leave-management`. App code, container và app ID là ba giá trị khác nhau; kiểm tra bảng cấu hình trong README của project được sinh trước khi tích hợp host.
+
+Không đặt module là `auth`, `common`, `library`, `redux`, `navigation` hoặc `themes`; đây là các thư mục của base.
+
+## Cấu trúc project
+
+```text
+env/                         staging.json, beta.json, prod.json
+pipelines/                   Pipeline build và deployment
+scripts/                     Chọn env, dọn output bundle
+src/
+  common/mini-app/           Tích hợp host, provider và runtime
+  library/networking/       HTTP client dùng miniapp-sdk
+  modules/
+    auth/                   Trạng thái phiên và đăng nhập standalone
+    <module>/               Màn hình, hooks, services, Redux nghiệp vụ
+  navigation/               Root navigator
+  redux/                    Store và typed hooks
+  services/application.ts   Khởi tạo store, QueryClient và HTTP client
+  themes/                   Palette, geometry và cấu hình standalone
+  App.tsx                   Entry được host tải
+  StandaloneApp.tsx         Entry chạy độc lập
+```
+
+Phần lớn code tính năng mới đặt trong `src/modules/<module>/`. Không đặt endpoint nghiệp vụ hoặc logic màn hình trong provider/runtime.
+
+Commit lockfile được sinh sau khi cài dependencies. Các lần cài tiếp theo và CI dùng `npm ci` để giữ phiên bản nhất quán.
+
+## Cấu hình môi trường và API
+
+Sửa `env/staging.json`, `env/beta.json` và `env/prod.json`. Những URL, issuer và client ID mẫu phải được thay bằng cấu hình của app.
+
+```json
+{
+  "ENV": "staging",
+  "BASE_URL": "https://api.example.com",
+  "API_TIMEOUT_MS": 15000,
+  "AUTH": {
+    "issuer": "https://identity.example.com",
+    "clientId": "native-client-id",
+    "redirectUrl": "com.sungroup.leave.auth://oauth/redirect",
+    "scopes": ["openid", "profile", "offline_access"]
+  }
+}
+```
+
+Chọn môi trường trước khi chạy Re.Pack hoặc bundle:
+
+```sh
+npm run env:staging
+# Hoặc npm run env:beta / npm run env:prod
+```
+
+Script sinh `env/env-config.ts`; không sửa file này bằng tay. Đổi env cần restart dev server.
+
+**Các giá trị env được đưa vào bundle. Không đặt mật khẩu, client secret, private key hoặc token vào đây.** Lưu secret deployment trong cấu hình secret của CI.
+
+Màn mẫu chỉ gọi API khi người dùng nhấn **Tải hồ sơ**. Endpoint mặc định là `/me`; sửa `PROFILE_PATH` và mapping response trong `src/modules/<module>/services/profile.service.ts` theo backend thật.
+
+## Chạy trong MySGR
+
+### Cấu hình phía host
+
+Đăng ký các thông tin sau trong registry/resolver của host và catalog tương ứng:
+
+- App ID và app code.
+- Tên container, ví dụ `LeaveManagement`.
+- Module được expose: `LeaveManagement/MiniApp`.
+- Dev server URL/port khi phát triển, hoặc URL artifact khi triển khai.
+
+Các giá trị này có trong README được tạo cùng project. CLI không tự sửa repository host hay đăng ký dữ liệu backend.
+
+### Chạy local
+
+```sh
+npm run env:staging
+npm run start:mf
+```
+
+Dùng thiết bị thật:
+
+```sh
+npm run start:mf:device
+```
+
+Host phải trỏ tới IP LAN của máy phát triển và port đã chọn. Kiểm tra thiết bị truy cập được dev server; `localhost` trên điện thoại không phải máy tính.
+
+### Phiên đăng nhập
+
+Host truyền `hostCapabilities` vào mini app. Contract có `auth.getSnapshot()`, `auth.subscribe()`, `auth.refreshIfNeeded()` và `closeMiniApp()`.
+
+Base đã nối sẵn các chức năng này. HTTP client tự gắn access token, nhờ host refresh và retry tối đa một lần sau HTTP 401. Code màn hình/service không cần tự lưu token hoặc đăng nhập lại.
+
+- Host sở hữu refresh token và persistence.
+- Không persist token do host cấp trong mini app.
+- Session đổi khi người dùng đổi tài khoản; refresh access token trong cùng session không reset dữ liệu nghiệp vụ.
+- `param_supper_app` chứa dữ liệu mở app/thông báo, không dùng thay cho auth.
+- Nếu thiếu `hostCapabilities`, kiểm tra cấu hình tích hợp; hosted entry không tự chuyển sang đăng nhập standalone.
+
+## Chạy độc lập
+
+Cấu hình `AUTH` trong env trước, đăng ký OAuth native client và redirect URL với nhà cung cấp đăng nhập, sau đó:
+
+```sh
+npm run env:staging
+npx expo prebuild
+npm run ios:staging
+# Hoặc npm run android:staging
+```
+
+Sau khi có development build, có thể dùng `npm run start:staging` để chạy Metro.
+
+- Đăng nhập OIDC sử dụng `react-native-app-auth`.
+- Token standalone mặc định chỉ giữ trong bộ nhớ; đóng app/reset runtime sẽ mất phiên.
+- Scopes mẫu không tự cấp quyền API. Cấu hình audience/scopes đúng với backend.
+- Nếu backend yêu cầu đổi token OIDC sang token riêng, bổ sung flow exchange trong service auth.
+- Đổi redirect URL hoặc thêm native dependency cần cập nhật native build; đổi JavaScript không nhất thiết cần prebuild lại.
+
+Standalone là entry riêng; không xác định chế độ chạy chỉ bằng việc thiếu props host.
+
+## Thêm màn hình và gọi API
+
+1. Thêm screen/hook/service trong `src/modules/<module>/`.
+2. Đăng ký route trong navigator của module.
+3. Lấy HTTP client đã được tạo sẵn từ `useApplicationServices()`.
+4. Dùng Redux cho state nghiệp vụ và TanStack Query cho server data.
+
+Ví dụ service:
+
+```ts
+import type { ApiClient } from "../../../library/networking/client";
+
+export function getItems(api: ApiClient, signal?: AbortSignal) {
+  return api.get<{ id: string; name: string }[]>("/items", { signal });
+}
+```
+
+Ví dụ trong component/hook; điều chỉnh relative imports theo vị trí file:
+
+```tsx
+import { useQuery } from "@tanstack/react-query";
+import { useApplicationServices } from "./common/mini-app/provider";
+
+const { api } = useApplicationServices();
+const query = useQuery({
+  queryKey: ["items"],
+  queryFn: ({ signal }) => getItems(api, signal),
+});
+```
+
+Ví dụ trên giả định API trả trực tiếp một array. Nếu backend trả envelope, unwrap trong service module. Nếu API báo hết hạn token trong HTTP 200, cấu hình thêm `isAuthExpired` trong HTTP client theo contract backend.
+
+Khi query chứa dữ liệu cá nhân, đưa session ID vào query key như `useHome()` mẫu. Không lưu token trong query key.
+
+## Màu sắc và kích thước UI
+
+- `StyleSheet.configure()` cấp theme cho Unistyles.
+- `UIThemeProvider` cấp theme cho component UI360.
+- `createUITheme()` tạo object dữ liệu; không đăng ký hoặc thay đổi theme global.
+- `create360Theme()` tạo cùng dữ liệu và thêm `type/color` để dùng với Unistyles.
+
+Khi hosted, base giữ nguyên mode/màu của Unistyles đang hoạt động. Không map tên màu legacy, không trộn palette khác và không ghi đè runtime host.
+
+Geometry được tạo sẵn trong `src/themes/ui-geometry.ts` từ factory UI360, scale theo chiều rộng thiết kế 375. Provider và style mẫu cùng dùng geometry này; không cần host cung cấp spacing/radius/typography. Không nhân scale lại tại màn hình.
+
+```tsx
+import { StyleSheet } from "react-native-unistyles";
+import { uiGeometry } from "./themes/ui-geometry";
+
+const { spacing, radius } = uiGeometry;
+const styles = StyleSheet.create(({ color }) => ({
+  card: {
+    padding: spacing.xxl,
+    borderRadius: radius.lg,
+    backgroundColor: color.background,
+  },
+}));
+```
+
+Màu guideline: `content1` là chữ nội dung, `textPrimary` là chữ trên primary, `background` là nền card và `base3` là nền màn.
+
+Palette local nằm trong `src/themes/colors/light.ts` và `dark.ts`, được dùng để khởi tạo khi standalone. Cấu hình standalone nằm trong `src/themes/standalone.ts`.
+
+**Tách phiên bản UI360 không tự tách theme Unistyles.** Host vẫn cần cung cấp các tên màu mà app sử dụng; factory không tự đổi `bg_1` thành `background`. Nếu cần palette riêng khi hosted, phải thiết kế phạm vi theme riêng; template không tự bật cơ chế đó.
+
+## Đóng gói và triển khai
+
+Chọn env rồi tạo remote bundles:
+
+```sh
+npm run env:staging
+npm run bundle:mf:android
+npm run bundle:mf:ios
+```
+
+Artifact cần triển khai nằm ở:
+
+```text
+build/outputs/android/remotes/
+build/outputs/ios/remotes/
+```
+
+ZIP **toàn bộ nội dung** thư mục `remotes/` của từng platform, gồm container và các chunk; loại bỏ `*.map`. Không chỉ upload file container. Không dùng `build/generated/<platform>/index.bundle` làm remote artifact.
+
+Các lệnh trên chỉ tạo JavaScript/assets, không tạo IPA/APK. Thêm native module mới vẫn cần binary host hỗ trợ trước khi deploy remote.
+
+### Azure DevOps
+
+Chọn pipeline `pipelines/staging.yml`, `beta.yml` hoặc `production.yml`.
+
+Mặc định `deploy: false`: pipeline cài dependencies, kiểm tra, bundle hai platform, đóng ZIP và lưu artifacts. Chỉ bật deployment sau khi cấu hình:
+
+| Biến                                 | Giá trị cần cung cấp       |
+| ------------------------------------ | -------------------------- |
+| `MINIAPP_AZURE_SUBSCRIPTION`         | Azure service connection   |
+| `MINIAPP_STORAGE_ACCOUNT`            | Storage Account            |
+| `MINIAPP_STORAGE_CONTAINER`          | Blob container             |
+| `DB_HOST`, `DB_LOGIN`, `DB_DATABASE` | Kết nối PostgreSQL catalog |
+| `DB_PASSWORD`                        | Mật khẩu, đánh dấu secret  |
+
+Kiểm tra `appName`, `appId`, `appCode`, `envBuild`, `envFolder` và `miniAppVersion` trong YAML. Agent deployment cần Azure CLI, psql và quyền truy cập hạ tầng. Pipeline không tự tạo Storage Account, database/schema hay đăng ký registry trong code host.
+
+### Trước khi phát hành
+
+```sh
+npm run typecheck
+npm run lint
+npm test
+```
+
+Sau đó kiểm tra trên host: mở/đóng app, refresh token, đổi tài khoản, lỗi mạng, hiển thị theme, dialog/loading và remote bundle đúng platform. Xác nhận các dependencies native tương thích trước khi cập nhật catalog.
+
+## Xử lý vấn đề thường gặp
+
+| Hiện tượng                               | Kiểm tra                                                                                         |
+| ---------------------------------------- | ------------------------------------------------------------------------------------------------ |
+| Không tải được mini app                  | Container/module name, port hoặc URL resolver; artifact phải đủ chunk                            |
+| Thiếu hostCapabilities                   | Cách host mở app và object capabilities truyền vào                                               |
+| Lỗi đọc spacing.xxl                      | Dùng provider/geometry của base mới; không lấy geometry từ theme host chưa có token này          |
+| Thiếu màu hoặc màu không đúng            | Tên token Unistyles mà host cung cấp; không thêm mapping màu chỉ để sửa geometry                 |
+| Standalone không đăng nhập được          | Issuer, client ID, redirect URL, scopes và native build                                          |
+| API trả 401 sau đăng nhập                | Audience/scopes hoặc flow token exchange của backend                                             |
+| Thêm native package nhưng remote vẫn lỗi | Binary host phải có module native tương ứng                                                      |
+| Thay template nhưng app cũ không đổi     | Generator chỉ tạo project; cập nhật app đã sinh theo từng thay đổi, không chạy đè lên thư mục cũ |
+
+## License
+
+MIT.

package/bin/create-360-miniapp.cjs

@@ -0,0 +1,54 @@
+#!/usr/bin/env node
+const { spawnSync } = require('node:child_process');
+const { createApp } = require('../lib/create.cjs');
+
+const help = `Create a MySGR mini app (Expo 55 / React Native 0.83 / Re.Pack 5)
+
+  npx @thanhphi/create-360-miniapp my-app [options]
+  npm create @thanhphi/360-miniapp@latest my-app -- [options]
+
+Options:
+  --module <slug>       Feature module folder (default: app name)
+  --container <Name>    Federation container (default: PascalCase app name)
+  --app-code <CODE>     Backend mini-app code
+  --bundle-id <id>      Unique Android/iOS application ID
+  --display-name <name> Native display name
+  --port <number>       Re.Pack dev server port (default: 8085)
+  --env <flavor>        Initial staging, beta or prod (default: staging)
+  --install            Install dependencies and create package-lock.json
+  --native             Install if needed, then generate ios/ and android/
+  --help               Show usage
+  --version            Show generator version
+`;
+
+function main(argv) {
+  if (argv.includes('--help') || argv.includes('-h')) return process.stdout.write(help);
+  if (argv.includes('--version')) return process.stdout.write(require('../package.json').version + '\n');
+  const options = {};
+  const values = { '--module': 'module', '--container': 'container', '--app-code': 'appCode', '--bundle-id': 'bundleId', '--display-name': 'displayName', '--port': 'port', '--env': 'env' };
+  for (let i = 0; i < argv.length; i++) {
+    const arg = argv[i];
+    if (arg === '--') continue;
+    if (arg === '--install' || arg === '--native') options[arg.slice(2)] = true;
+    else if (values[arg]) {
+      const value = argv[++i];
+      if (!value || value.startsWith('--')) throw new Error(`Missing value for ${arg}.`);
+      options[values[arg]] = value;
+    } else if (arg.startsWith('-')) throw new Error(`Unknown option: ${arg}.`);
+    else if (options.name) throw new Error(`Unexpected argument: ${arg}.`);
+    else options.name = arg;
+  }
+  const app = createApp(options);
+  process.stdout.write(`Created ${app.appName} at ${app.destination}\n`);
+  function run(args) {
+    const result = spawnSync(process.platform === 'win32' ? 'npm.cmd' : 'npm', args, { cwd: app.destination, stdio: 'inherit', shell: process.platform === 'win32' });
+    if (result.error) throw result.error;
+    if (result.status !== 0) throw new Error(`npm ${args.join(' ')} failed. App files remain in ${app.destination}; fix the error and retry there.`);
+  }
+  if (options.install || options.native) run(['install']);
+  if (options.native) run(['exec', '--', 'expo', 'prebuild']);
+  process.stdout.write(`\nNext:\n  cd ${options.name}\n${options.install || options.native ? '' : '  npm install\n'}  npm run env:${app.environment}\n  npm run start:mf\n\nStandalone: npm run ios:${app.environment} or android:${app.environment}\nRead README.md for env, auth, host registration and pipeline setup.\n`);
+}
+
+try { main(process.argv.slice(2)); }
+catch (error) { process.stderr.write(`create-360-miniapp: ${error.message}\n`); process.exitCode = 1; }

package/lib/create.cjs

@@ -0,0 +1,56 @@
+const fs = require('node:fs');
+const path = require('node:path');
+
+const template = path.resolve(__dirname, '../template');
+const reserved = new Set(['auth', 'common', 'library', 'redux', 'navigation', 'themes']);
+
+function createApp(options, cwd = process.cwd()) {
+  const name = options.name;
+  if (!/^[a-z][a-z0-9]*(?:-[a-z0-9]+)*$/.test(name || '')) {
+    throw new Error('App name must be a lowercase slug, e.g. leave-management.');
+  }
+  const moduleName = options.module || name;
+  if (!/^[a-z][a-z0-9]*(?:-[a-z0-9]+)*$/.test(moduleName) || reserved.has(moduleName)) {
+    throw new Error('Module must be a lowercase feature name; auth and framework folders are reserved.');
+  }
+  const appName = options.container || name.split('-').map(part => part[0].toUpperCase() + part.slice(1)).join('');
+  if (!/^[A-Z][A-Za-z0-9]*$/.test(appName)) throw new Error('Container must be a PascalCase identifier.');
+  const appCode = options.appCode || name.replace(/-/g, '').slice(0, 12).toUpperCase();
+  if (!/^[A-Z][A-Z0-9_]{0,31}$/.test(appCode)) throw new Error('App code must contain uppercase letters, digits or underscore.');
+  const port = Number(options.port || 8085);
+  if (!Number.isInteger(port) || port < 1024 || port > 65535) throw new Error('Port must be an integer between 1024 and 65535.');
+  const bundleId = options.bundleId || `com.sungroup.${name.replace(/-/g, '')}`;
+  if (!/^[a-z][a-z0-9]*(?:\.[a-z][a-z0-9]*){2,}$/.test(bundleId)) throw new Error('Bundle ID must be a lowercase reverse-domain identifier without underscores.');
+  const displayName = options.displayName || appName;
+  // The same replacement is used in JS, JSON, Markdown and YAML. Keep it safe in all formats.
+  if (!/^[\p{L}\p{N} _.-]{1,80}$/u.test(displayName)) throw new Error('Display name can contain letters, numbers, spaces, dots, underscores and hyphens.');
+  const environment = options.env || 'staging';
+  if (!['staging', 'beta', 'prod'].includes(environment)) throw new Error('Environment must be staging, beta or prod.');
+  const destination = path.resolve(cwd, name);
+  if (fs.existsSync(destination)) throw new Error(`Destination already exists: ${destination}. Choose a new directory.`);
+  const replacements = {
+    __APP_NAME__: appName, __DISPLAY_NAME__: displayName, __PACKAGE_NAME__: name,
+    __APP_ID__: name, __APP_CODE__: appCode, __MODULE__: moduleName,
+    __PORT__: String(port), __BUNDLE_ID__: bundleId,
+  };
+  function render(value) {
+    return value.replace(/__(?:APP_NAME|DISPLAY_NAME|PACKAGE_NAME|APP_ID|APP_CODE|MODULE|PORT|BUNDLE_ID)__/g, key => replacements[key]);
+  }
+  function copy(directory, target) {
+    fs.mkdirSync(target, { recursive: true });
+    for (const entry of fs.readdirSync(directory, { withFileTypes: true })) {
+      const source = path.join(directory, entry.name);
+      // npm strips .gitignore; keep it as a normal file inside the published template.
+      const output = path.join(target, entry.name === 'gitignore' ? '.gitignore' : render(entry.name));
+      if (entry.isDirectory()) copy(source, output);
+      else if (entry.isFile()) fs.writeFileSync(output, render(fs.readFileSync(source, 'utf8')));
+      else throw new Error(`Unsupported template entry: ${source}`);
+    }
+  }
+  copy(template, destination);
+  const { syncEnv } = require(path.join(destination, 'scripts/sync-env.js'));
+  syncEnv(environment, destination);
+  return { destination, appName, moduleName, environment, port };
+}
+
+module.exports = { createApp };

package/package.json

@@ -1,6 +1,26 @@
 {
   "name": "@thanhphi/create-360-miniapp",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.2.1",
+  "description": "Create a MySGR Expo and Re.Pack mini app with modules, host auth and Azure pipelines",
+  "license": "MIT",
+  "bin": {
+    "create-360-miniapp": "bin/create-360-miniapp.cjs"
+  },
+  "files": [
+    "bin",
+    "lib",
+    "template",
+    "README.md",
+    "LICENSE"
+  ],
+  "scripts": {
+    "test": "node --test tests/*.test.cjs"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "engines": {
+    "node": ">=20"
+  }
+}

package/template/.eslintrc.cjs

@@ -0,0 +1 @@
+module.exports = { root: true, extends: '@react-native', ignorePatterns: ['build/', 'env/env-config.ts'] };

package/template/.prettierrc.cjs

@@ -0,0 +1 @@
+module.exports = { singleQuote: true, trailingComma: 'all', arrowParens: 'avoid' };

package/template/.watchmanconfig

@@ -0,0 +1 @@
+{}

package/template/App.tsx

@@ -0,0 +1,2 @@
+import 'react-native-gesture-handler';
+export { default } from './src/StandaloneApp';