@ronas-it/nx-generators 0.21.0 → 0.22.0-alpha.2

package/README.md

@@ -102,7 +102,7 @@ Configures code checks and formatting with pre-commit hook.
 ### 3. `expo-app`
 
 Generates and configures an Expo React Native app.
-Also generates [navigation utilities](#navigation-utilities).
+Also generates [navigation utilities](#navigation-utilities) and `.easignore` file for optimized [EAS Build](https://docs.expo.dev/build-reference/easignore/) uploads.
 
 #### Options
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ronas-it/nx-generators",
-  "version": "0.21.0",
+  "version": "0.22.0-alpha.2",
   "description": "Nx generators for Ronas IT projects",
   "license": "MIT",
   "author": "Ronas IT",

package/src/generators/expo-app/app-files/README.md.template

@@ -55,6 +55,19 @@ Create builds using [EAS Build](https://docs.expo.dev/build/introduction/):
 
 **Tip**: you can [create builds locally](https://docs.expo.dev/build-reference/local-builds/) by passing `--local` flag when starting build command.
 
+#### EAS Ignore
+
+The `.easignore` file in the repository root controls which files are uploaded to [EAS Build](https://docs.expo.dev/build-reference/easignore/) servers.
+It uses a whitelist approach — everything is ignored by default, and only files required for the mobile build are included:
+
+- App directory (`apps/{app-name}`)
+- App-specific and shared libraries (`libs/{app-name}`, `libs/shared`)
+- Translations (`i18n/{app-name}`, `i18n/shared`)
+- Dependency patches and root config files
+
+The file is generated automatically by the `expo-app` generator and supports multiple apps in a monorepo.
+When a new app is added, only its app-specific entries are appended — common entries are not duplicated.
+
 ### 3. Distribute
 
 #### Internal

package/src/generators/expo-app/app-files/app/_layout.tsx.template

@@ -1,9 +1,11 @@
 <% if(isStoreEnabled) { %> import { store } from '<%= libPath %>/shared/data-access/store';<% } %>
-import '<%= libPath %>/shared/ui/styles';
+import { fonts } from '<%= libPath %>/shared/ui/styles';
 import { setLanguage } from '@ronas-it/react-native-common-modules/i18n';
+import { useFonts } from 'expo-font';
 import { Stack } from 'expo-router';
+import * as SplashScreen from 'expo-splash-screen';
 import { StatusBar } from 'expo-status-bar';
-import { ReactElement } from 'react';
+import { ReactElement, useEffect } from 'react';
 <% if(isStoreEnabled) { %>import { Provider } from 'react-redux';<% } %>
 
 export { ErrorBoundary } from 'expo-router';
@@ -17,10 +19,8 @@ const translations = {
 
 const useLanguage = setLanguage(translations, 'en');
 
-// eslint-disable-next-line @typescript-eslint/naming-convention
-export const unstable_settings = {
-  initialRouteName: 'index',
-};
+// Prevent the splash screen from auto-hiding before asset loading is complete.
+SplashScreen.preventAutoHideAsync();
 
 function App(): ReactElement {
   useLanguage('en');
@@ -33,6 +33,23 @@ function App(): ReactElement {
 }
 
 export default function RootLayout(): ReactElement | null {
+  const [loaded, error] = useFonts(fonts);
+
+  // Expo Router uses Error Boundaries to catch errors in the navigation tree.
+  useEffect(() => {
+    if (error) throw error;
+  }, [error]);
+
+  useEffect(() => {
+    if (loaded) {
+      SplashScreen.hideAsync();
+    }
+  }, [loaded]);
+
+  if (!loaded) {
+    return null;
+  }
+
   return (
     <% if(isStoreEnabled) { %><Provider store={store}><% } %>
       <StatusBar style='light' />

package/src/generators/expo-app/easignore.d.ts

@@ -0,0 +1,2 @@
+import { Tree } from '@nx/devkit';
+export declare function generateEasignore(tree: Tree, directory: string): void;

package/src/generators/expo-app/easignore.js

@@ -0,0 +1,67 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.generateEasignore = generateEasignore;
+const EASIGNORE_PATH = '.easignore';
+const COMMON_LINES = `# Whitelist — ignore everything except what's needed for the mobile EAS build
+
+# Ignore everything
+*
+.*
+
+# Mobile apps
+!apps
+apps/*
+
+# Shared libraries
+!libs
+libs/*
+!libs/shared
+!libs/shared/**
+
+# i18n translations
+!i18n
+i18n/*
+!i18n/shared
+!i18n/shared/**
+
+# Dependency patches for React Native packages
+!patches
+!patches/**
+
+# Root config files required for the build
+!package.json
+!package-lock.json
+!tsconfig.json
+!tsconfig.base.json
+!babel.config.json
+!jest.config.ts
+!jest.preset.js
+!types.d.ts`;
+function getAppSpecificLines(directory) {
+    return `
+# Mobile app: ${directory}
+!apps/${directory}
+!apps/${directory}/**
+apps/${directory}/.expo
+
+# Libraries: ${directory}
+!libs/${directory}
+!libs/${directory}/**
+
+# i18n: ${directory}
+!i18n/${directory}
+!i18n/${directory}/**`;
+}
+function generateEasignore(tree, directory) {
+    const appSpecificLines = getAppSpecificLines(directory);
+    if (!tree.exists(EASIGNORE_PATH)) {
+        tree.write(EASIGNORE_PATH, COMMON_LINES + '\n' + appSpecificLines + '\n');
+        return;
+    }
+    const existingContent = tree.read(EASIGNORE_PATH, 'utf-8');
+    if (existingContent.includes(`!apps/${directory}\n`)) {
+        return;
+    }
+    tree.write(EASIGNORE_PATH, existingContent.trimEnd() + '\n' + appSpecificLines + '\n');
+}
+//# sourceMappingURL=easignore.js.map

package/src/generators/expo-app/easignore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"easignore.js","sourceRoot":"","sources":["../../../../../plugin/src/generators/expo-app/easignore.ts"],"names":[],"mappings":";;AAwDA,8CAgBC;AAtED,MAAM,cAAc,GAAG,YAAY,CAAC;AAEpC,MAAM,YAAY,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;YAkCT,CAAC;AAEb,SAAS,mBAAmB,CAAC,SAAiB;IAC5C,OAAO;gBACO,SAAS;QACjB,SAAS;QACT,SAAS;OACV,SAAS;;eAED,SAAS;QAChB,SAAS;QACT,SAAS;;UAEP,SAAS;QACX,SAAS;QACT,SAAS,KAAK,CAAC;AACvB,CAAC;AAED,SAAgB,iBAAiB,CAAC,IAAU,EAAE,SAAiB;IAC7D,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,SAAS,CAAC,CAAC;IAExD,IAAI,CAAC,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC,EAAE,CAAC;QACjC,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,YAAY,GAAG,IAAI,GAAG,gBAAgB,GAAG,IAAI,CAAC,CAAC;QAE1E,OAAO;IACT,CAAC;IAED,MAAM,eAAe,GAAG,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,OAAO,CAAE,CAAC;IAE5D,IAAI,eAAe,CAAC,QAAQ,CAAC,SAAS,SAAS,IAAI,CAAC,EAAE,CAAC;QACrD,OAAO;IACT,CAAC;IAED,IAAI,CAAC,KAAK,CAAC,cAAc,EAAE,eAAe,CAAC,OAAO,EAAE,GAAG,IAAI,GAAG,gBAAgB,GAAG,IAAI,CAAC,CAAC;AACzF,CAAC"}

package/src/generators/expo-app/generator.js

@@ -10,6 +10,7 @@ const dependencies_1 = require("../../shared/dependencies");
 const enums_1 = require("../../shared/enums");
 const generators_1 = require("../../shared/generators");
 const utils_1 = require("../../shared/utils");
+const easignore_1 = require("./easignore");
 const scripts_1 = require("./scripts");
 function expoAppGenerator(tree, options) {
     return tslib_1.__awaiter(this, void 0, void 0, function* () {
@@ -29,6 +30,7 @@ function expoAppGenerator(tree, options) {
         yield (0, generators_1.runAppEnvGenerator)(tree, options);
         yield (0, generators_1.runStorageGenerator)(tree, options);
         yield (0, generators_1.runRNStylesGenerator)(tree, options);
+        yield (0, generators_1.runUiKitGenerator)(tree, options);
         yield (0, generators_1.runNavigationUtilsGenerator)(tree, {
             appDirectory: options.directory,
             baseGeneratorType: enums_1.BaseGeneratorType.EXPO_APP,
@@ -70,6 +72,7 @@ function expoAppGenerator(tree, options) {
         (0, devkit_1.generateFiles)(tree, path.join(__dirname, 'app-files'), appRoot, Object.assign(Object.assign({}, options), { formatName: utils_1.formatName,
             formatAppIdentifier: utils_1.formatAppIdentifier,
             libPath, isStoreEnabled: options.withStore, appDirectory: options.directory }));
+        (0, easignore_1.generateEasignore)(tree, options.directory);
         tree.delete(`${appRoot}/tsconfig.app.json`);
         (0, utils_1.addNxAppTag)(tree, options.directory);
         (0, devkit_1.generateFiles)(tree, path.join(__dirname, 'i18n'), i18nRoot, {});

package/src/generators/expo-app/generator.js.map

@@ -1 +1 @@
-{"version":3,"file":"generator.js","sourceRoot":"","sources":["../../../../../plugin/src/generators/expo-app/generator.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"generator.js","sourceRoot":"","sources":["../../../../../plugin/src/generators/expo-app/generator.ts"],"names":[],"mappings":"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"}

package/src/generators/repo-config/files/AGENTS.md.template

@@ -0,0 +1,58 @@
+# Instructions for AI Assistants
+
+## Basic Guidelines
+
+- Always ask questions before implementation if something is unclear
+- Always read existing files before modifying them
+- Check for lint errors after making changes and fix them
+- When adding new features, follow existing patterns in the codebase
+- Suggest updates to this `AGENTS.md` file when discovering new patterns, but only apply after user confirmation
+- Do not leave obvious comments in code
+- Do not create new documentation until I asked to do so
+
+## Using the Open WebUI Knowledge MCP Server
+
+When working in this workspace, use the **open-webui-knowledge** MCP server to search company knowledge bases whenever relevant. Prefer it over generic answers for internal standards, architecture, and Ronas IT context.
+
+### When to Query Knowledge Bases
+
+Use the MCP tools **list_knowledge_bases**, **search_knowledge_base**, and **get_knowledge_base_info** (server: `user-open-webui-knowledge`) in these cases:
+
+1. **User mentions a knowledge base**
+   e.g. “knowledge base”, “check the docs”, “per our guidelines”, “in our documentation”.
+
+2. **Question is about architecture, standards, or recommended solutions** for:
+   - **React** → search **Frontend Docs**
+   - **React Native** → search **Frontend Docs**
+   - **Next.js** → search **Frontend Docs**
+   - **PHP / Laravel** → search **Backend Docs**
+
+3. **User mentions Ronas (Ronas IT, the company, our product)**
+   Use **Frontend Docs**, **Backend Docs**, or **Ronas IT Dribbble Portfolio** depending on whether the question is about frontend, backend, or design references.
+
+4. **Sales, marketing, or task templates**
+   Use **Sales Documentation**, **Sales**, **Marketing**, or **Tasks Templates** when the question is about processes, sales materials, or task formats.
+
+### Knowledge Base IDs (for search_knowledge_base)
+
+| Knowledge base            | ID |
+|---------------------------|----|
+| Backend Docs (Laravel)    | `60603f2d-1318-4e81-adbd-681b47b22b3a` |
+| Frontend Docs (RN, Next)  | `7de525d2-a308-41e4-ab15-42d527549703` |
+| Sales Documentation       | `b0d7f492-cf20-442b-a767-2255113f036f` |
+| Ronas IT Dribbble         | `e64d0850-bd4d-4e68-9ca4-4e2211d795d4` |
+| Sales                     | `8f8bb651-a5dc-43e5-a650-a3a145543690` |
+| Marketing                 | `5006584c-28f5-4a5b-8fa8-0f61e3c7f981` |
+| Tasks Templates           | `44fc3e2e-c0eb-4700-bb51-4d80cadbf0f9` |
+
+**Keeping the table up to date:** If you call **list_knowledge_bases** and the result shows new bases, different IDs, or missing entries compared to the table above, update the "Knowledge Base IDs" table in this file (AGENTS.md) so it matches the current list. That keeps the reference accurate for future sessions.
+
+If in doubt, call **list_knowledge_bases** first to get the current list and descriptions.
+
+### How to Search
+
+- Use **search_knowledge_base** with `knowledge_base_id` and `query` (and optionally `k` for number of results).
+- Formulate `query` from the user’s question (architecture, tech stack, “how we do X”, naming, etc.).
+- Prefer the most specific base (e.g. Frontend Docs for React/Next/RN, Backend Docs for Laravel) and optionally search multiple bases when the question spans domains or company practices.
+
+Cite retrieved snippets and, when they conflict with generic best practices, prefer the knowledge base content for this project.

package/src/generators/repo-config/generator.js

@@ -13,6 +13,7 @@ function repoConfigGenerator(tree) {
         const projectPackagePath = 'package.json';
         // Remove unnecessary files and files that will be replaced
         tree.delete('README.md');
+        tree.delete('AGENTS.md');
         tree.delete('packages');
         // Update project package.json
         const projectPackageJson = (0, devkit_1.readJson)(tree, projectPackagePath);

package/src/generators/repo-config/generator.js.map

@@ -1 +1 @@
-{"version":3,"file":"generator.js","sourceRoot":"","sources":["../../../../../plugin/src/generators/repo-config/generator.ts"],"names":[],"mappings":";;AAcA,kDA4BC;;AA1CD,6BAA6B;AAC7B,uCAQoB;AACpB,4DAA4D;AAC5D,8CAAgE;AAChE,uCAAgC;AAEhC,SAAsB,mBAAmB,CAAC,IAAU;;QAClD,MAAM,WAAW,GAAG,GAAG,CAAC;QACxB,MAAM,kBAAkB,GAAG,cAAc,CAAC;QAE1C,2DAA2D;QAC3D,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;QACzB,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;QAExB,8BAA8B;QAC9B,MAAM,kBAAkB,GAAG,IAAA,iBAAQ,EAAC,IAAI,EAAE,kBAAkB,CAAC,CAAC;QAC9D,kBAAkB,CAAC,UAAU,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC3C,kBAAkB,CAAC,OAAO,GAAG,iBAAO,CAAC;QACrC,IAAA,kBAAS,EAAC,IAAI,EAAE,kBAAkB,EAAE,kBAAkB,CAAC,CAAC;QAExD,oBAAoB;QACpB,IAAA,sBAAa,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC,EAAE,WAAW,EAAE;YAC9D,IAAI,EAAE,IAAA,sBAAc,EAAC,kBAAkB,CAAC,IAAI,CAAC;YAC7C,UAAU,EAAV,kBAAU;SACX,CAAC,CAAC;QAEH,mBAAmB;QACnB,IAAA,qCAA4B,EAAC,IAAI,EAAE,EAAE,EAAE,8BAAe,CAAC,aAAa,CAAC,CAAC,CAAC;QAEvE,MAAM,IAAA,oBAAW,EAAC,IAAI,CAAC,CAAC;QAExB,OAAO,GAAS,EAAE;YAChB,IAAA,4BAAmB,EAAC,IAAI,CAAC,CAAC;QAC5B,CAAC,CAAC;IACJ,CAAC;CAAA;AAED,kBAAe,mBAAmB,CAAC"}
+{"version":3,"file":"generator.js","sourceRoot":"","sources":["../../../../../plugin/src/generators/repo-config/generator.ts"],"names":[],"mappings":";;AAcA,kDA6BC;;AA3CD,6BAA6B;AAC7B,uCAQoB;AACpB,4DAA4D;AAC5D,8CAAgE;AAChE,uCAAgC;AAEhC,SAAsB,mBAAmB,CAAC,IAAU;;QAClD,MAAM,WAAW,GAAG,GAAG,CAAC;QACxB,MAAM,kBAAkB,GAAG,cAAc,CAAC;QAE1C,2DAA2D;QAC3D,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;QACzB,IAAI,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;QACzB,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;QAExB,8BAA8B;QAC9B,MAAM,kBAAkB,GAAG,IAAA,iBAAQ,EAAC,IAAI,EAAE,kBAAkB,CAAC,CAAC;QAC9D,kBAAkB,CAAC,UAAU,GAAG,CAAC,QAAQ,CAAC,CAAC;QAC3C,kBAAkB,CAAC,OAAO,GAAG,iBAAO,CAAC;QACrC,IAAA,kBAAS,EAAC,IAAI,EAAE,kBAAkB,EAAE,kBAAkB,CAAC,CAAC;QAExD,oBAAoB;QACpB,IAAA,sBAAa,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,OAAO,CAAC,EAAE,WAAW,EAAE;YAC9D,IAAI,EAAE,IAAA,sBAAc,EAAC,kBAAkB,CAAC,IAAI,CAAC;YAC7C,UAAU,EAAV,kBAAU;SACX,CAAC,CAAC;QAEH,mBAAmB;QACnB,IAAA,qCAA4B,EAAC,IAAI,EAAE,EAAE,EAAE,8BAAe,CAAC,aAAa,CAAC,CAAC,CAAC;QAEvE,MAAM,IAAA,oBAAW,EAAC,IAAI,CAAC,CAAC;QAExB,OAAO,GAAS,EAAE;YAChB,IAAA,4BAAmB,EAAC,IAAI,CAAC,CAAC;QAC5B,CAAC,CAAC;IACJ,CAAC;CAAA;AAED,kBAAe,mBAAmB,CAAC"}

package/src/shared/dependencies.d.ts

@@ -43,6 +43,10 @@ export declare const dependencies: {
         'react-native-edge-to-edge': string;
         'react-native-nitro-modules': string;
     };
+    'ui-kit': {
+        'react-native-reanimated': string;
+        'react-native-worklets': string;
+    };
     store: {
         '@ronas-it/rtkq-entity-api': string;
         'react-redux': string;

package/src/shared/dependencies.js

@@ -46,6 +46,10 @@ exports.dependencies = {
         'react-native-edge-to-edge': '^1.7.0',
         'react-native-nitro-modules': '0.33.2',
     },
+    'ui-kit': {
+        'react-native-reanimated': '^4.1.5',
+        'react-native-worklets': '0.7.1',
+    },
     store: {
         '@ronas-it/rtkq-entity-api': '^0.5.0',
         'react-redux': '^9.2.0',

package/src/shared/dependencies.js.map

@@ -1 +1 @@
-{"version":3,"file":"dependencies.js","sourceRoot":"","sources":["../../../../plugin/src/shared/dependencies.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"dependencies.js","sourceRoot":"","sources":["../../../../plugin/src/shared/dependencies.ts"],"names":[],"mappings":"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"}

package/src/shared/generators/index.d.ts

@@ -7,3 +7,4 @@ export * from './rn-styles';
 export * from './form-utils';
 export * from './i18n-next';
 export * from './navigation-utils';
+export * from './ui-kit';

package/src/shared/generators/index.js

@@ -10,4 +10,5 @@ tslib_1.__exportStar(require("./rn-styles"), exports);
 tslib_1.__exportStar(require("./form-utils"), exports);
 tslib_1.__exportStar(require("./i18n-next"), exports);
 tslib_1.__exportStar(require("./navigation-utils"), exports);
+tslib_1.__exportStar(require("./ui-kit"), exports);
 //# sourceMappingURL=index.js.map

package/src/shared/generators/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../plugin/src/shared/generators/index.ts"],"names":[],"mappings":";;;AAAA,kDAAwB;AACxB,oDAA0B;AAC1B,uDAA6B;AAC7B,iDAAuB;AACvB,oDAA0B;AAC1B,sDAA4B;AAC5B,uDAA6B;AAC7B,sDAA4B;AAC5B,6DAAmC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../plugin/src/shared/generators/index.ts"],"names":[],"mappings":";;;AAAA,kDAAwB;AACxB,oDAA0B;AAC1B,uDAA6B;AAC7B,iDAAuB;AACvB,oDAA0B;AAC1B,sDAA4B;AAC5B,uDAA6B;AAC7B,sDAA4B;AAC5B,6DAAmC;AACnC,mDAAyB"}

package/src/shared/generators/rn-styles/lib-files/shared/ui/styles/src/lib/fonts/fonts.ts.template

@@ -0,0 +1,7 @@
+import { fontFamily } from '../variables';
+
+export const fonts = {
+  [fontFamily.semiBold]: require('./Gilroy-Semibold.ttf'),
+  [fontFamily.regular]: require('./Gilroy-Regular.ttf'),
+  [fontFamily.bold]: require('./Gilroy-Bold.ttf'),
+};

package/src/shared/generators/rn-styles/lib-files/shared/ui/styles/src/lib/fonts/index.ts.template

@@ -0,0 +1 @@
+export * from './fonts';

package/src/shared/generators/rn-styles/lib-files/shared/ui/styles/src/lib/index.ts.template

@@ -1,3 +1,4 @@
 export * from './variables';
 export * from './styles';
+export * from './fonts';
 export * from './metrics';

package/src/shared/generators/rn-styles/lib-files/shared/ui/styles/src/lib/variables.ts.template

@@ -37,7 +37,7 @@ export const spacings = {
 };
 
 export const fontFamily = {
-  regular: 'System',
-  bold: 'System',
-  semiBold: 'System'
+  regular: 'Gilroy Regular',
+  bold: 'Gilroy Bold',
+  semiBold: 'Gilroy SemiBold',
 };

package/src/shared/generators/ui-kit/app-files/.babelrc.js.template

@@ -0,0 +1,16 @@
+module.exports = function (api) {
+  api.cache(true);
+  return {
+    presets: ['babel-preset-expo'],
+    plugins: [
+      [
+        'react-native-unistyles/plugin',
+        {
+          root: 'app',
+          autoProcessImports: '<%= libPath %>',
+        },
+      ],
+      ['react-native-worklets/plugin'],
+    ],
+  };
+};

package/src/shared/generators/ui-kit/generator.d.ts

@@ -0,0 +1,6 @@
+import { Tree } from '@nx/devkit';
+export declare function runUiKitGenerator(tree: Tree, options: {
+    name: string;
+    directory: string;
+}): Promise<void>;
+export default runUiKitGenerator;

package/src/shared/generators/ui-kit/generator.js

@@ -0,0 +1,40 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.runUiKitGenerator = runUiKitGenerator;
+const tslib_1 = require("tslib");
+const child_process_1 = require("child_process");
+const fs_1 = require("fs");
+const path = require("path");
+const devkit_1 = require("@nx/devkit");
+const dependencies_1 = require("../../dependencies");
+const utils_1 = require("../../utils");
+function runUiKitGenerator(tree, options) {
+    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        const appRoot = `apps/${options.directory}`;
+        const libRoot = `libs/${options.directory}`;
+        const libPath = `${(0, utils_1.getImportPathPrefix)(tree)}/${options.directory}`;
+        const appPackagePath = `${appRoot}/package.json`;
+        const appLayoutPath = `${appRoot}/app`;
+        // Generate ui-kit lib
+        (0, child_process_1.execSync)(`npx nx g react-lib --app=${options.directory} --scope=shared --type=ui --name=ui-kit --withComponent=false`, {
+            stdio: 'inherit',
+        });
+        // Remove unnecessary files
+        tree.delete(`${libRoot}/shared/ui/ui-kit/src/index.ts`);
+        tree.delete(`${appLayoutPath}/index.tsx`);
+        // Add lib files
+        (0, devkit_1.generateFiles)(tree, path.join(__dirname, 'lib-files'), libRoot, Object.assign(Object.assign({}, options), { libPath }));
+        // Add app files
+        (0, devkit_1.generateFiles)(tree, path.join(__dirname, 'app-files'), appRoot, Object.assign(Object.assign({}, options), { libPath }));
+        // Add layout files
+        (0, devkit_1.generateFiles)(tree, path.join(__dirname, 'layout-files'), appLayoutPath, Object.assign(Object.assign({}, options), { libPath }));
+        // Add dependencies
+        (0, devkit_1.addDependenciesToPackageJson)(tree, dependencies_1.dependencies['ui-kit'], {});
+        if ((0, fs_1.existsSync)(appPackagePath)) {
+            (0, devkit_1.addDependenciesToPackageJson)(tree, dependencies_1.dependencies['ui-kit'], {}, appPackagePath);
+        }
+        yield (0, devkit_1.formatFiles)(tree);
+    });
+}
+exports.default = runUiKitGenerator;
+//# sourceMappingURL=generator.js.map

package/src/shared/generators/ui-kit/generator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"generator.js","sourceRoot":"","sources":["../../../../../../plugin/src/shared/generators/ui-kit/generator.ts"],"names":[],"mappings":";;AAOA,8CA8CC;;AArDD,iDAAyC;AACzC,2BAAgC;AAChC,6BAA6B;AAC7B,uCAA4F;AAC5F,qDAAkD;AAClD,uCAAkD;AAElD,SAAsB,iBAAiB,CAAC,IAAU,EAAE,OAA4C;;QAC9F,MAAM,OAAO,GAAG,QAAQ,OAAO,CAAC,SAAS,EAAE,CAAC;QAC5C,MAAM,OAAO,GAAG,QAAQ,OAAO,CAAC,SAAS,EAAE,CAAC;QAC5C,MAAM,OAAO,GAAG,GAAG,IAAA,2BAAmB,EAAC,IAAI,CAAC,IAAI,OAAO,CAAC,SAAS,EAAE,CAAC;QAEpE,MAAM,cAAc,GAAG,GAAG,OAAO,eAAe,CAAC;QACjD,MAAM,aAAa,GAAG,GAAG,OAAO,MAAM,CAAC;QAEvC,sBAAsB;QACtB,IAAA,wBAAQ,EACN,4BAA4B,OAAO,CAAC,SAAS,+DAA+D,EAC5G;YACE,KAAK,EAAE,SAAS;SACjB,CACF,CAAC;QAEF,2BAA2B;QAC3B,IAAI,CAAC,MAAM,CAAC,GAAG,OAAO,gCAAgC,CAAC,CAAC;QACxD,IAAI,CAAC,MAAM,CAAC,GAAG,aAAa,YAAY,CAAC,CAAC;QAE1C,gBAAgB;QAChB,IAAA,sBAAa,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,CAAC,EAAE,OAAO,kCACzD,OAAO,KACV,OAAO,IACP,CAAC;QAEH,gBAAgB;QAChB,IAAA,sBAAa,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,WAAW,CAAC,EAAE,OAAO,kCACzD,OAAO,KACV,OAAO,IACP,CAAC;QAEH,mBAAmB;QACnB,IAAA,sBAAa,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,SAAS,EAAE,cAAc,CAAC,EAAE,aAAa,kCAClE,OAAO,KACV,OAAO,IACP,CAAC;QAEH,mBAAmB;QACnB,IAAA,qCAA4B,EAAC,IAAI,EAAE,2BAAY,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC,CAAC;QAE/D,IAAI,IAAA,eAAU,EAAC,cAAc,CAAC,EAAE,CAAC;YAC/B,IAAA,qCAA4B,EAAC,IAAI,EAAE,2BAAY,CAAC,QAAQ,CAAC,EAAE,EAAE,EAAE,cAAc,CAAC,CAAC;QACjF,CAAC;QAED,MAAM,IAAA,oBAAW,EAAC,IAAI,CAAC,CAAC;IAC1B,CAAC;CAAA;AAED,kBAAe,iBAAiB,CAAC"}

package/src/shared/generators/ui-kit/index.d.ts

@@ -0,0 +1 @@
+export * from './generator';

package/src/shared/generators/ui-kit/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./generator"), exports);
+//# sourceMappingURL=index.js.map

package/src/shared/generators/ui-kit/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../plugin/src/shared/generators/ui-kit/index.ts"],"names":[],"mappings":";;;AAAA,sDAA4B"}

package/src/shared/generators/ui-kit/layout-files/index.tsx.template

@@ -0,0 +1,51 @@
+import { AppButton, AppScreen, AppSpinner, AppText, AppTextInput } from '<%= libPath %>/shared/ui/ui-kit';
+import { ReactElement, useState } from 'react';
+import { StyleSheet } from 'react-native-unistyles';
+
+export default function RootScreen(): ReactElement {
+  const [username, setUsername] = useState<string>('');
+  const [password, setPassword] = useState<string>('');
+
+  return (
+    <AppScreen style={styles.container}>
+      <AppText>Title H1</AppText>
+      <AppText>Title H2</AppText>
+      <AppText>Title H3</AppText>
+      <AppText>Title H4</AppText>
+      <AppText>Title H5</AppText>
+      <AppText>Title H6</AppText>
+      <AppText>Body Large</AppText>
+      <AppText>Body Large Bold</AppText>
+      <AppText>Body Default</AppText>
+      <AppText>Body Default Bold</AppText>
+      <AppText>Body Small</AppText>
+      <AppText>Body Small Bold</AppText>
+      <AppText>Body Extra Small</AppText>
+      <AppText>Body Extra Small Bold</AppText>
+      <AppTextInput
+        label='Username'
+        autoCapitalize='none'
+        autoCorrect={false}
+        value={username}
+        onChangeText={setUsername}
+      />
+      <AppTextInput isPassword={true} label='Password' value={password} onChangeText={setPassword} />
+      <AppButton text='Button Primary Regular' />
+      <AppButton text='Button Primary Small' size='small' />
+      <AppButton text='Button Secondary Regular' variant='secondary' />
+      <AppButton text='Button Secondary Small' variant='secondary' size='small' />
+      <AppButton text='Button Tertiary Regular' variant='tertiary' />
+      <AppButton text='Button Tertiary Small' variant='tertiary' size='small' />
+      <AppButton text='Button Danger Regular' variant='danger' />
+      <AppButton text='Button Danger Small' variant='danger' size='small' />
+      <AppSpinner />
+    </AppScreen>
+  );
+}
+
+const styles = StyleSheet.create(({ spacings }) => ({
+  container: {
+    gap: spacings.xs,
+    paddingVertical: spacings.md,
+  },
+}));

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/assets/icons/eye-off.svg.template

@@ -0,0 +1,23 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g clip-path="url(#clip0_944_8975)">
+    <mask id="mask0_944_8975" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0"
+      width="26" height="24">
+      <path d="M26 24H0V0H26V24ZM4 19.8496L6.7002 22.5498L21.5498 7.7002L18.8496 5L4 19.8496Z"
+        fill="white" />
+    </mask>
+    <g mask="url(#mask0_944_8975)">
+      <mask id="path-2-inside-1_944_8975" fill="white">
+        <path
+          d="M12 6C16.6993 6 20.799 8.55443 22.9951 12.3486C20.7992 16.1435 16.6998 18.6992 12 18.6992C7.30007 18.6992 3.19976 16.1437 1.00391 12.3486C3.19993 8.5542 7.30057 6 12 6Z" />
+      </mask>
+      <path
+        d="M12 6L12 4.4H12V6ZM22.9951 12.3486L24.38 13.15L24.8437 12.3485L24.3799 11.5471L22.9951 12.3486ZM12 18.6992V20.2992H12L12 18.6992ZM1.00391 12.3486L-0.380895 11.5472L-0.844675 12.3485L-0.380983 13.1499L1.00391 12.3486ZM12 6L12 7.6C16.1042 7.6 19.6881 9.82899 21.6103 13.1501L22.9951 12.3486L24.3799 11.5471C21.91 7.27987 17.2943 4.4 12 4.4L12 6ZM22.9951 12.3486L21.6103 11.5473C19.688 14.8693 16.1044 17.0992 12 17.0992L12 18.6992L12 20.2992C17.2951 20.2992 21.9104 17.4177 24.38 13.15L22.9951 12.3486ZM12 18.6992V17.0992C7.89525 17.0992 4.31091 14.8693 2.3888 11.5473L1.00391 12.3486L-0.380983 13.1499C2.08861 17.4181 6.7049 20.2992 12 20.2992V18.6992ZM1.00391 12.3486L2.38871 13.1501C4.31083 9.82891 7.89541 7.6 12 7.6V6V4.4C6.70574 4.4 2.08903 7.27948 -0.380895 11.5472L1.00391 12.3486Z"
+        fill="currentColor" mask="url(#path-2-inside-1_944_8975)" />
+      <path
+        d="M12.1289 9.00293C12.0465 9.23685 12 9.48789 12 9.75C12 10.9926 13.0074 12 14.25 12C14.5119 12 14.7623 11.9524 14.9961 11.8701C14.9979 11.9132 15 11.9565 15 12C15 13.6569 13.6569 15 12 15C10.3431 15 9 13.6569 9 12C9 10.3431 10.3431 9 12 9C12.0432 9 12.0862 9.00112 12.1289 9.00293Z"
+        fill="currentColor" />
+    </g>
+    <path d="M20.5 3L3 20.5" stroke="currentColor" stroke-width="1.6" />
+  </g>
+</svg>
+  

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/assets/icons/eye.svg.template

@@ -0,0 +1,13 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <mask id="path-1-inside-1_28393_1814" fill="white">
+    <path
+      d="M12 6C16.6993 6 20.799 8.55443 22.9951 12.3486C20.7992 16.1435 16.6998 18.6992 12 18.6992C7.30007 18.6992 3.19976 16.1437 1.00391 12.3486C3.19993 8.5542 7.30057 6 12 6Z" />
+  </mask>
+  <path
+    d="M12 6L12 4.4H12V6ZM22.9951 12.3486L24.38 13.15L24.8437 12.3485L24.3799 11.5471L22.9951 12.3486ZM12 18.6992V20.2992H12L12 18.6992ZM1.00391 12.3486L-0.380895 11.5472L-0.844675 12.3485L-0.380983 13.1499L1.00391 12.3486ZM12 6L12 7.6C16.1042 7.6 19.6881 9.82899 21.6103 13.1501L22.9951 12.3486L24.3799 11.5471C21.91 7.27987 17.2943 4.4 12 4.4L12 6ZM22.9951 12.3486L21.6103 11.5473C19.688 14.8693 16.1044 17.0992 12 17.0992L12 18.6992L12 20.2992C17.2951 20.2992 21.9104 17.4177 24.38 13.15L22.9951 12.3486ZM12 18.6992V17.0992C7.89525 17.0992 4.31091 14.8693 2.3888 11.5473L1.00391 12.3486L-0.380983 13.1499C2.08861 17.4181 6.7049 20.2992 12 20.2992V18.6992ZM1.00391 12.3486L2.38871 13.1501C4.31083 9.82891 7.89541 7.6 12 7.6V6V4.4C6.70574 4.4 2.08903 7.27948 -0.380895 11.5472L1.00391 12.3486Z"
+    fill="currentColor" mask="url(#path-1-inside-1_28393_1814)" />
+  <path
+    d="M12.1289 9.00293C12.0465 9.23685 12 9.48789 12 9.75C12 10.9926 13.0074 12 14.25 12C14.5119 12 14.7623 11.9524 14.9961 11.8701C14.9979 11.9132 15 11.9565 15 12C15 13.6569 13.6569 15 12 15C10.3431 15 9 13.6569 9 12C9 10.3431 10.3431 9 12 9C12.0432 9 12.0862 9.00112 12.1289 9.00293Z"
+    fill="currentColor" />
+</svg>
+  

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/assets/icons/index.ts.template

@@ -0,0 +1,7 @@
+import eyeOff from './eye-off';
+import eye from './eye.svg';
+
+export const Icons = {
+  eyeOff,
+  eye,
+};

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/assets/index.ts.template

@@ -0,0 +1 @@
+export * from './icons';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/button/component.tsx.template

@@ -0,0 +1,122 @@
+import { Fragment, ReactElement } from 'react';
+import { Pressable, PressableProps, StyleProp, ViewStyle } from 'react-native';
+import { UnistylesVariants, StyleSheet } from 'react-native-unistyles';
+import { colors, rem, spacings } from '<%= libPath %>/shared/ui/styles';
+import { AppSpinner } from '../spinner';
+import { AppText } from '../text';
+
+type AppButtonProps = UnistylesVariants<typeof buttonStyles> &
+  Omit<PressableProps, 'style'> & {
+    accessoryLeft?: ReactElement;
+    accessoryRight?: ReactElement;
+    text?: string;
+    isLoading?: boolean;
+    isFilled?: boolean;
+    style?: StyleProp<ViewStyle>;
+  };
+
+export const AppButton = ({
+  variant = 'primary',
+  size = 'regular',
+  disabled,
+  text,
+  isLoading,
+  isFilled,
+  style,
+  accessoryLeft,
+  accessoryRight,
+  ...props
+}: AppButtonProps): ReactElement => {
+  buttonStyles.useVariants({ variant, size });
+  textStyles.useVariants({ variant });
+
+  const buttonDisabled = disabled || isLoading;
+
+  return (
+    <Pressable
+      style={({ pressed }) => [buttonStyles.button(pressed, !!isFilled), style]}
+      disabled={buttonDisabled}
+      {...props}>
+      {({ pressed }): ReactElement =>
+        isLoading ? (
+          <AppSpinner size='small' color={variant === 'primary' ? colors.backgroundPrimary : colors.textPrimary} />
+        ) : (
+          <Fragment>
+            {accessoryLeft}
+            <AppText
+              variant={size === 'regular' ? 'bodyDefaultBold' : 'bodySmallBold'}
+              style={textStyles.text(!!buttonDisabled, pressed)}>
+              {text}
+            </AppText>
+            {accessoryRight}
+          </Fragment>
+        )
+      }
+    </Pressable>
+  );
+};
+
+const buttonStyles = StyleSheet.create(({ colors }) => ({
+  button: (pressed: boolean, filled: boolean) => ({
+    flex: filled ? 1 : 0,
+    flexDirection: 'row',
+    gap: spacings.xs,
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderWidth: 1,
+    borderColor: 'transparent',
+    variants: {
+      variant: {
+        primary: {
+          backgroundColor: colors.primary,
+        },
+        secondary: {
+          backgroundColor: colors.backgroundSecondary,
+        },
+        tertiary: {
+          backgroundColor: 'transparent',
+          borderColor: pressed ? colors.textTertiary : 'transparent',
+        },
+        danger: {
+          backgroundColor: 'transparent',
+          borderColor: pressed ? colors.textTertiary : 'transparent',
+        },
+      },
+      size: {
+        regular: {
+          borderRadius: 1 * rem,
+          minHeight: 3.5 * rem,
+          paddingHorizontal: 2.625 * rem,
+        },
+        small: {
+          borderRadius: 1 * rem,
+          minHeight: 2 * rem,
+          paddingHorizontal: 1 * rem,
+        },
+      },
+    },
+  }),
+}));
+
+const textStyles = StyleSheet.create(({ colors }) => ({
+  text: (disabled: boolean, pressed: boolean) => ({
+    variants: {
+      variant: {
+        primary: {
+          color: colors.textPrimary,
+          opacity: disabled ? 0.4 : pressed ? 0.8 : 1,
+        },
+        secondary: {
+          color: disabled ? colors.textSecondary : pressed ? colors.primary : colors.textPrimary,
+        },
+        tertiary: {
+          color: disabled ? colors.textSecondary : colors.textPrimary,
+        },
+        danger: {
+          color: colors.error,
+          opacity: disabled ? 0.4 : pressed ? 0.8 : 1,
+        },
+      },
+    },
+  }),
+}));

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/button/index.ts.template

@@ -0,0 +1 @@
+export * from './component';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/icon/component.tsx.template

@@ -0,0 +1,21 @@
+import { ReactNode } from 'react';
+import { SvgProps } from 'react-native-svg';
+import { colors } from '<%= libPath %>/shared/ui/styles';
+import { Icons } from '../assets';
+import { IconName } from './types';
+
+export interface IconProps extends SvgProps {
+  name: IconName;
+}
+
+const defaultColor = colors.textPrimary;
+
+export function Icon({ name, ...restProps }: IconProps): ReactNode {
+  const props: SvgProps = {
+    color: defaultColor,
+    ...restProps,
+  };
+  const Component = name in Icons && Icons[name];
+
+  return Component ? <Component {...props} /> : null;
+}

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/icon/index.ts.template

@@ -0,0 +1 @@
+export * from './component';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/icon/types/icon-name.ts.template

@@ -0,0 +1,3 @@
+import { Icons } from '../../assets';
+
+export type IconName = keyof typeof Icons;

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/icon/types/index.ts.template

@@ -0,0 +1 @@
+export * from './icon-name';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/index.ts.template

@@ -0,0 +1,9 @@
+export * from './assets';
+export * from './button';
+export * from './icon';
+export * from './pressable';
+export * from './pressable-icon';
+export * from './screen';
+export * from './spinner';
+export * from './text';
+export * from './text-input';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/pressable/component.tsx.template

@@ -0,0 +1,26 @@
+import { ForwardedRef, ReactElement } from 'react';
+import { Pressable, PressableProps, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
+
+export interface AppPressableProps extends PressableProps {
+  pressedOpacity?: number;
+  ref?: ForwardedRef<View>;
+}
+
+export function AppPressable({
+  children,
+  style,
+  pressedOpacity = 0.4,
+  ref,
+  ...props
+}: AppPressableProps): ReactElement {
+  return (
+    <Pressable
+      ref={ref}
+      style={({ pressed }) =>
+        StyleSheet.flatten([{ opacity: pressed ? pressedOpacity : 1 }, style as StyleProp<ViewStyle>])
+      }
+      {...props}>
+      {children}
+    </Pressable>
+  );
+}

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/pressable/index.ts.template

@@ -0,0 +1 @@
+export * from './component';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/pressable-icon/component.tsx.template

@@ -0,0 +1,17 @@
+import { ReactElement } from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+import { Icon, IconProps } from '../icon';
+import { AppPressable } from '../pressable';
+
+export interface AppPressableIconProps extends IconProps {
+  onPress: () => void;
+  layoutStyle?: StyleProp<ViewStyle>;
+}
+
+export function AppPressableIcon({ onPress, layoutStyle, disabled, ...props }: AppPressableIconProps): ReactElement {
+  return (
+    <AppPressable onPress={onPress} style={layoutStyle} hitSlop={10} disabled={disabled}>
+      <Icon {...props} />
+    </AppPressable>
+  );
+}

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/pressable-icon/index.ts.template

@@ -0,0 +1 @@
+export * from './component';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/screen/component.tsx.template

@@ -0,0 +1,61 @@
+import { ReactElement, useMemo } from 'react';
+import { ScrollView, ScrollViewProps, View, ViewProps } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { commonStyle, spacings } from '<%= libPath %>/shared/ui/styles';
+
+export interface AppScreenProps {
+  scrollDisabled?: boolean;
+  noOutsideSpacing?: boolean;
+}
+
+interface NonScrollableScreenProps extends ViewProps {
+  scrollDisabled: true;
+}
+
+interface ScrollableScreenProps extends ScrollViewProps {
+  scrollDisabled?: false;
+}
+
+export function AppScreen(props: AppScreenProps & (ScrollableScreenProps | NonScrollableScreenProps)): ReactElement {
+  const { children, style: elementStyle = {}, testID, scrollDisabled, noOutsideSpacing, ...restProps } = props;
+
+  const [ViewComponent, viewComponentProps] = useMemo(
+    (): [typeof View, ViewProps] | [typeof ScrollView, ScrollViewProps] =>
+      scrollDisabled
+        ? [
+            View,
+            {
+              style: [commonStyle.fullFlex, !noOutsideSpacing && styles.spacingsContainer, elementStyle],
+              ...restProps,
+            },
+          ]
+        : [
+            ScrollView,
+            {
+              contentContainerStyle: [styles.scroll, !noOutsideSpacing && styles.spacingsContainer, elementStyle],
+              showsVerticalScrollIndicator: false,
+              keyboardShouldPersistTaps: 'handled',
+              ...restProps,
+            },
+          ],
+    [scrollDisabled, restProps, noOutsideSpacing],
+  );
+
+  return (
+    <View style={[styles.container, commonStyle.fullFlex]}>
+      <ViewComponent {...viewComponentProps}>{children}</ViewComponent>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create(({ colors }) => ({
+  container: {
+    backgroundColor: colors.backgroundPrimary,
+  },
+  spacingsContainer: {
+    paddingHorizontal: spacings.md,
+  },
+  scroll: {
+    minHeight: '100%',
+  },
+}));

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/screen/index.ts.template

@@ -0,0 +1 @@
+export * from './component';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/spinner/component.tsx.template

@@ -0,0 +1,29 @@
+import { ReactElement } from 'react';
+import { StyleProp, View, ViewStyle, ActivityIndicator, ActivityIndicatorProps } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { commonStyle, colors } from '<%= libPath %>/shared/ui/styles';
+
+export interface AppSpinnerProps extends ActivityIndicatorProps {
+  isFullScreen?: boolean;
+  containerStyle?: StyleProp<ViewStyle>;
+}
+
+export function AppSpinner({
+  isFullScreen,
+  size = 'large',
+  containerStyle,
+  ...restProps
+}: AppSpinnerProps): ReactElement {
+  return (
+    <View style={[styles.container, isFullScreen && commonStyle.fullFlex, containerStyle]}>
+      <ActivityIndicator color={colors.primary} size={size} {...restProps} />
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    alignItems: 'center',
+    justifyContent: 'center',
+  },
+});

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/spinner/index.ts.template

@@ -0,0 +1 @@
+export * from './component';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/text/component.tsx.template

@@ -0,0 +1,107 @@
+import { ReactElement } from 'react';
+import { Text, type TextProps } from 'react-native';
+import { UnistylesVariants, StyleSheet } from 'react-native-unistyles';
+import { fontFamily, rem } from '<%= libPath %>/shared/ui/styles';
+
+export type AppTextProps = UnistylesVariants<typeof textStyles> & TextProps;
+
+export const AppText = ({ variant = 'bodyDefault', children, style, ...props }: AppTextProps): ReactElement => {
+  textStyles.useVariants({ variant });
+
+  return (
+    <Text style={[textStyles.text, style]} {...props}>
+      {children}
+    </Text>
+  );
+};
+
+export const textStyles = StyleSheet.create(({ colors }) => ({
+  text: {
+    color: colors.textPrimary,
+    variants: {
+      variant: {
+        // Titles
+        h1: {
+          fontFamily: fontFamily.regular,
+          fontSize: 1.5 * rem, // 24px
+          lineHeight: 1.875 * rem, // 30px
+          fontWeight: 500,
+        },
+        h2: {
+          fontFamily: fontFamily.regular,
+          fontSize: 1.375 * rem, // 22px
+          lineHeight: 1.75 * rem, // 28px
+        },
+        h3: {
+          fontFamily: fontFamily.regular,
+          fontSize: 1.1875 * rem, // 19px
+          lineHeight: 1.5 * rem, // 24px
+        },
+        h4: {
+          fontFamily: fontFamily.regular,
+          fontSize: 1.1875 * rem, // 19px
+          lineHeight: 1.5 * rem, // 24px
+          fontWeight: 500,
+        },
+        h5: {
+          fontFamily: fontFamily.regular,
+          fontSize: 1 * rem, // 16px
+          lineHeight: 1.25 * rem, // 20px
+          fontWeight: 500,
+        },
+        h6: {
+          fontFamily: fontFamily.regular,
+          fontSize: 1 * rem, // 16px
+          lineHeight: 1.25 * rem, // 20px
+          fontWeight: 500,
+        },
+
+        // Body
+        bodyLarge: {
+          fontFamily: fontFamily.regular,
+          fontSize: 1.0625 * rem, // 17px
+          lineHeight: 1.5 * rem, // 24px
+        },
+        bodyLargeBold: {
+          fontFamily: fontFamily.bold,
+          fontSize: 1.0625 * rem, // 17px
+          lineHeight: 1.5 * rem, // 24px
+          fontWeight: 500,
+        },
+        bodyDefault: {
+          fontFamily: fontFamily.regular,
+          fontSize: 1 * rem, // 16px
+          lineHeight: 1.4375 * rem, // 23px
+        },
+        bodyDefaultBold: {
+          fontFamily: fontFamily.bold,
+          fontSize: 1 * rem, // 16px
+          lineHeight: 1.4375 * rem, // 23px
+          fontWeight: 500,
+        },
+        bodySmall: {
+          fontFamily: fontFamily.regular,
+          fontSize: 0.8125 * rem, // 13px
+          lineHeight: 1.1875 * rem, // 19px
+        },
+        bodySmallBold: {
+          fontFamily: fontFamily.semiBold,
+          fontSize: 0.8125 * rem, // 13px
+          lineHeight: 1.1875 * rem, // 19px
+          fontWeight: 500,
+        },
+        bodyExtraSmall: {
+          fontFamily: fontFamily.regular,
+          fontSize: 0.6875 * rem, // 11px
+          lineHeight: 0.875 * rem, // 14px
+        },
+        bodyExtraSmallBold: {
+          fontFamily: fontFamily.semiBold,
+          fontSize: 0.6875 * rem, // 11px
+          lineHeight: 0.875 * rem, // 14px
+          fontWeight: 500,
+        },
+      },
+    },
+  },
+}));

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/text/index.ts.template

@@ -0,0 +1 @@
+export * from './component';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/text-input/component.tsx.template

@@ -0,0 +1,156 @@
+import { ReactElement, RefObject, useRef, useState } from 'react';
+import { TextInput, FocusEvent, TextInputProps, View, Platform, TouchableWithoutFeedback } from 'react-native';
+import Animated, { useSharedValue } from 'react-native-reanimated';
+import { StyleSheet } from 'react-native-unistyles';
+import { colors, commonStyle, rem, spacings } from '<%= libPath %>/shared/ui/styles';
+import { AppPressableIcon } from '../pressable-icon';
+import { AppText, textStyles as appTextStyles } from '../text';
+import { useAnimatedLabel } from './hooks';
+
+export interface AppTextInputProps extends TextInputProps {
+  accessoryRight?: ReactElement;
+  label?: string;
+  error?: string;
+  disabled?: boolean;
+  isPassword?: boolean;
+  ref?: RefObject<TextInput | null>;
+  nextInputRef?: RefObject<TextInput | null>;
+}
+
+export const AppTextInput = ({
+  disabled,
+  label,
+  error,
+  style,
+  accessoryRight,
+  value,
+  isPassword,
+  onFocus,
+  onBlur,
+  ref,
+  nextInputRef,
+  onSubmitEditing,
+  returnKeyType,
+  placeholder,
+  ...props
+}: AppTextInputProps): ReactElement => {
+  appTextStyles.useVariants({ variant: 'bodyDefault' });
+  const isIos = Platform.OS === 'ios';
+  const inputRef = ref || useRef<TextInput>(null);
+  const labelWidth = useSharedValue(0);
+
+  const [isFocused, setIsFocused] = useState(false);
+  const [isSecured, setIsSecured] = useState(true);
+
+  const isLabelFloated = (isFocused || !!value) && !!label;
+
+  const { labelAnimatedStyle } = useAnimatedLabel(isLabelFloated, labelWidth);
+
+  const handleOnFocus = (e: FocusEvent) => {
+    setIsFocused(true);
+    onFocus?.(e);
+  };
+
+  const handleBlur = (e: FocusEvent): void => {
+    setIsFocused(false);
+    onBlur?.(e);
+  };
+
+  const goToNextRef = (): void => nextInputRef?.current?.focus();
+
+  const handleInputPress = (): void => inputRef.current?.focus();
+
+  const accessoryRightComponent = isPassword ? (
+    <AppPressableIcon name={isSecured ? 'eye' : 'eyeOff'} onPress={() => setIsSecured(!isSecured)} />
+  ) : (
+    accessoryRight
+  );
+
+  return (
+    <View style={styles.wrapper}>
+      <View style={inputStyles.container(isFocused, !!disabled, !!error)}>
+        <TouchableWithoutFeedback onPress={handleInputPress}>
+          <View style={commonStyle.fullFlex}>
+            {label && (
+              <Animated.View style={labelAnimatedStyle} pointerEvents='none'>
+                <AppText
+                  variant='bodyDefault'
+                  style={textStyles.label}
+                  onLayout={(e) => {
+                    labelWidth.value = e.nativeEvent.layout.width;
+                  }}>
+                  {label}
+                </AppText>
+              </Animated.View>
+            )}
+            <TextInput
+              ref={inputRef}
+              editable={!disabled}
+              value={value}
+              onFocus={handleOnFocus}
+              onBlur={handleBlur}
+              style={[appTextStyles.text, textStyles.input(!!disabled, isIos), inputStyles.input]}
+              cursorColor={colors.textPrimary}
+              selectionColor={colors.textPrimary}
+              hitSlop={{ top: 40 }}
+              secureTextEntry={isSecured && isPassword}
+              onSubmitEditing={nextInputRef ? goToNextRef : onSubmitEditing}
+              returnKeyType={nextInputRef ? 'next' : returnKeyType}
+              placeholder={label ? undefined : placeholder}
+              {...props}
+            />
+          </View>
+        </TouchableWithoutFeedback>
+        {accessoryRightComponent}
+      </View>
+      {error && (
+        <AppText variant='bodySmall' style={textStyles.error}>
+          {error}
+        </AppText>
+      )}
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  wrapper: {
+    gap: spacings.xs,
+  },
+});
+
+const inputStyles = StyleSheet.create(({ colors }) => ({
+  container: (focused: boolean, disabled: boolean, errored: boolean) => ({
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: spacings.xs,
+    borderWidth: 1,
+    backgroundColor: disabled ? colors.backgroundPrimary : colors.backgroundSecondary,
+    borderColor: focused || disabled ? colors.textTertiary : errored ? colors.error : 'transparent',
+    borderRadius: spacings.md,
+    minHeight: 3.5 * rem,
+    paddingHorizontal: spacings.md,
+    paddingVertical: 0.375 * rem,
+  }),
+  input: {
+    padding: 0,
+    marginTop: 1.4375 * rem * 0.8,
+    flex: 1,
+  },
+}));
+
+const textStyles = StyleSheet.create(({ colors }) => ({
+  label: {
+    color: colors.textSecondary,
+  },
+  input: (disabled: boolean, isIos: boolean) => ({
+    color: disabled ? colors.textSecondary : colors.textPrimary,
+    lineHeight: isIos ? 0 : 1.4375 * rem,
+    // NOTE: Needs to fix Android spacings
+    // https://reactnative.dev/docs/text-style-props#includefontpadding-android
+    includeFontPadding: false,
+    textAlignVertical: 'center',
+  }),
+  error: {
+    color: colors.error,
+  },
+}));

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/text-input/hooks/index.ts.template

@@ -0,0 +1 @@
+export * from './use-animated-label';

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/text-input/hooks/use-animated-label.ts.template

@@ -0,0 +1,32 @@
+import { useEffect } from 'react';
+import { AnimatedStyle, SharedValue, useAnimatedStyle, useSharedValue, withTiming } from 'react-native-reanimated';
+
+interface UseAnimatedLabelResult {
+  labelAnimatedStyle: AnimatedStyle;
+}
+
+export function useAnimatedLabel(isLabelFloated: boolean, labelWidth: SharedValue<number>): UseAnimatedLabelResult {
+  const labelTop = useSharedValue(8);
+  const labelScale = useSharedValue(1);
+
+  const labelAnimatedStyle = useAnimatedStyle(() => {
+    const scale = labelScale.value;
+    const width = labelWidth.value;
+
+    return {
+      position: 'absolute',
+      zIndex: 999,
+      top: labelTop.value,
+      transform: [{ translateX: -width / 2 }, { scale }, { translateX: width / 2 }],
+    };
+  });
+
+  useEffect(() => {
+    labelTop.value = withTiming(isLabelFloated ? -2 : 8, { duration: 180 });
+    labelScale.value = withTiming(isLabelFloated ? 0.8 : 1, { duration: 180 });
+  }, [isLabelFloated]);
+
+  return {
+    labelAnimatedStyle,
+  };
+}

package/src/shared/generators/ui-kit/lib-files/shared/ui/ui-kit/src/text-input/index.ts.template

@@ -0,0 +1 @@
+export * from './component';