chore: cleanup unused packages and update setup

.github/pull_request_template.md

@@ -13,4 +13,4 @@
 
 <!-- Describe the **steps to test this change**, so that a reviewer can verify it. Provide screenshots or videos if the change affects UI. -->
 
-<!-- Keep in mind that PR changes must pass lint, typescript and tests. -->
+<!-- Keep in mind that PR changes must pass lint, typecheck and tests. -->

.github/workflows/ci.yml

@@ -18,22 +18,22 @@
         uses: ./.github/actions/setup
 
       - name: Lint
-        run: yarn lint-no-fix
+        run: yarn lint
 
-  typescript:
-    name: TypeScript
+  typecheck:
+    name: Typecheck
     runs-on: ubuntu-latest
     steps:
       - name: Checkout
         uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
 
       - name: Setup
         uses: ./.github/actions/setup
 
       - name: Check types
-        run: yarn typescript
+        run: yarn typecheck
 
   unit-tests:
     name: Unit tests
     runs-on: ubuntu-latest
     steps:
@@ -73,9 +73,22 @@
       - name: Build package
         run: |
           yarn prepack
-          node ./scripts/typescript-output-lint
+          node ./scripts/typescript-output-lint.ts
+
+  build-example:
+    name: Build example
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2
+
+      - name: Setup
+        uses: ./.github/actions/setup
+
+      - name: Build example
+        run: yarn example expo export --platform all
 
   build-docs:
     name: Build docs
     if: github.event_name == 'pull_request'
     runs-on: ubuntu-latest

.gitignore

@@ -43,6 +43,11 @@ yarn-error.log
 #
 coverage/
 cache/jest/
+__ts-tests__/
+
+# ESLint
+#
+.eslintcache
 
 # BUCK
 #
@@ -63,12 +68,10 @@ CHANGELOG.md
 # generated by bob
 lib/
 
-.expo
-
 # Yarn
 .yarn/*
 !.yarn/patches
 !.yarn/plugins
 !.yarn/releases
 !.yarn/sdks
-!.yarn/versions
+!.yarn/versions

CONTRIBUTING.md

@@ -32,9 +32,9 @@ Our pre-commit hooks verify that your commit message matches this format when co
 
 ### Linting and tests
 
-We use `typescript` for type checking, `eslint` with `prettier` for linting and formatting the code, and `jest` for testing. Our pre-commit hooks verify that the linter and tests pass when commiting. You can also run the following commands manually:
+We use `typescript` for type checking, `eslint` with `prettier` for linting and formatting the code, and `jest` for testing. Our pre-commit hooks verify that type checking, linting, and tests pass when committing. You can also run the following commands manually:
 
-- `yarn typescript`: type-check files with `tsc`.
+- `yarn typecheck`: type-check files with `tsc`.
 - `yarn lint`: lint files with `eslint` and `prettier`.
 - `yarn test`: run unit tests with `jest`.
 
@@ -43,7 +43,7 @@ We use `typescript` for type checking, `eslint` with `prettier` for linting and
 When you're sending a pull request:
 
 - Prefer small pull requests focused on one change.
-- Verify that `typescript`, `eslint` and all tests are passing.
+- Verify that `typecheck`, `lint` and all tests are passing.
 - Preview the documentation to make sure it looks good.
 - Follow the pull request template when opening a pull request.
 
@@ -58,7 +58,7 @@ When you're working on a component:
 
 The example app uses [Expo](https://expo.dev/) for the React Native example. You will need to install the Expo app for [Android](https://play.google.com/store/apps/details?id=host.exp.exponent) and [iOS](https://itunes.apple.com/app/apple-store/id982107779) to start developing.
 
-> [!IMPORTANT]  
+> [!IMPORTANT]
 > The example app is built with `react-native@0.77.x` and Expo SDK 52, which isn’t compatible with Expo Go. To run the app, you have to create a [development build](https://docs.expo.dev/develop/development-builds/create-a-build/).
 
 After you're done, you can run `yarn example start` in the project root (or `npx expo start` in the `example/` folder) and scan the QR code to launch it on your device.
@@ -72,7 +72,7 @@ If you want to test the changes brought by a pull request, you can do so by poin
 ```json
 {
   "dependencies": {
-    "react-native-paper": "git+https://github.com/callstack/react-native-paper.git#<commit-hash>",
+    "react-native-paper": "git+https://github.com/callstack/react-native-paper.git#<commit-hash>"
   }
 }
 ```

docs/component-docs-plugin/generatePageMDX.js

@@ -5,7 +5,6 @@ const { baseUrl, customFields } = config;
 function renderBadge(annotation) {
   const [annotType, ...annotLabel] = annotation.split(' ');
 
-  // eslint-disable-next-line prettier/prettier
   return `<span class="badge badge-${annotType.replace('@', '')} "><span class="badge-text">${annotLabel.join(' ')}</span></span>`;
 }
 

docs/component-docs-plugin/index.js

@@ -8,7 +8,7 @@ const generatePageMDX = require('./generatePageMDX');
 
 const pluginName = 'component-docs-plugin';
 
-async function componentsPlugin(_, options) {
+function componentsPlugin(_, options) {
   const { docsRootDir, libsRootDir, pages } = options;
 
   function clean() {
@@ -55,7 +55,7 @@ async function componentsPlugin(_, options) {
 
   return {
     name: pluginName,
-    async loadContent() {
+    loadContent() {
       // Clean up docs directory.
       clean();
       // Create root components category.
@@ -80,7 +80,7 @@ async function componentsPlugin(_, options) {
 
       return docs;
     },
-    async contentLoaded({ content: docs, actions }) {
+    contentLoaded({ content: docs, actions }) {
       // Store component docs global data so it can be used in `PropsTable` component.
       actions.setGlobalData({
         docs,

docs/package.json

@@ -20,6 +20,7 @@
     "@docusaurus/core": "^2.3.6",
     "@docusaurus/preset-classic": "^2.3.6",
     "@docusaurus/remark-plugin-npm2yarn": "^2.3.6",
+    "@docusaurus/theme-common": "^2.3.6",
     "@easyops-cn/docusaurus-search-local": "^0.33.4",
     "@material/material-color-utilities": "0.2.4",
     "@mdx-js/react": "^1.6.22",
@@ -39,13 +40,13 @@
   },
   "devDependencies": {
     "@docusaurus/module-type-aliases": "^2.3.6",
-    "@jest/globals": "^29.7.0",
     "@tsconfig/docusaurus": "^1.0.6",
     "@types/marked": "^4.0.7",
     "@types/react-color": "^3.0.6",
     "component-docs": "^0.24.0",
     "patch-package": "^6.5.0",
-    "typescript": "^4.8.4"
+    "typescript": "^4.8.4",
+    "webpack": "^5.73.0"
   },
   "browserslist": {
     "production": [

docs/src/components/DynamicColorTheme.tsx

@@ -3,7 +3,6 @@ import type { ReactNode } from 'react';
 
 import Color from 'color';
 //@ts-ignore
-// eslint-disable-next-line import/no-unresolved
 import { BlockPicker } from 'react-color';
 
 import Switch from './Switch';
@@ -161,7 +160,7 @@ const CodePreview = ({
   };
 
   const onCopy = () => {
-    navigator.clipboard.writeText(getColorScheme());
+    void navigator.clipboard.writeText(getColorScheme());
     setCopied(true);
 
     setTimeout(() => setCopied(false), 1000);

docs/src/components/PropTable.tsx

@@ -1,5 +1,4 @@
 // @ts-ignore
-// eslint-disable-next-line import/no-unresolved
 import useDoc from '@site/component-docs-plugin/useDocs';
 
 import Markdown from './Markdown';
@@ -27,7 +26,6 @@ const typeDefinitions = {
 const renderBadge = (annotation: string) => {
   const [annotType, ...annotLabel] = annotation.split(' ');
 
-  // eslint-disable-next-line prettier/prettier
   return `<span class="badge badge-${annotType.replace(
     '@',
     ''
@@ -65,7 +63,7 @@ export default function PropTable({
           // Replace annotations with styled badges.
           if (line.includes('@')) {
             const annotIndex = line.indexOf('@');
-            // eslint-disable-next-line prettier/prettier
+
             return `${line.substr(0, annotIndex)} ${renderBadge(
               line.substr(annotIndex)
             )}`;