presetter-preset-react 5.0.0 → 6.1.0

package/README.md

@@ -18,7 +18,7 @@
 
 ## Features
 
-**presetter-preset-react** is an opinionated preset for you to setup a React project in a fraction of time you usually take via [**presetter**](https://github.com/alvis/presetter).
+**presetter-preset-react** is an extension of [**presetter-preset-web**](https://github.com/alvis/presetter) with additional tools to help you to develop a React project with ease via [**presetter**](https://github.com/alvis/presetter).
 
 - ✨ TSX support
 - 🧪 @testing-library/react
@@ -28,15 +28,31 @@
 
 [**FULL DOCUMENTATION IS AVAILABLE HERE**](https://github.com/alvis/presetter/blob/master/README.md)
 
-1. Bootstrap your project with `presetter-preset-esm` & `presetter-preset-react`
+### 1. Bootstrap your project with presetter-preset-react
 
-```shell
-npx presetter use presetter-preset presetter-preset-react
+On your project root, create a `presetter.config.ts` file with the following content:
+
+```typescript
+// presetter.config.ts
+
+import { preset } from 'presetter';
+import esm from 'presetter-preset-esm';
+import react from 'presetter-preset-react';
+
+export default preset('project name', {
+  // NOTE
+  // you don't need to extends presetter-preset-web presets here since they are already included in the react preset
+  // however, you may need an additional preset like presetter-preset-esm for ESM support and other basic toolings
+  extends: [esm, react],
+  override: {
+    // override the configuration here
+  },
+});
 ```
 
-That's. One command and you're set.
+Then, install your project as usual with `npm install` or any package manager you prefer.
 
-2. Develop and run life cycle scripts provided by the preset
+### 2. Develop and run life cycle scripts provided by the preset
 
 At this point, all development packages specified in the preset are installed,
 and now you can try to run some example life cycle scripts (e.g. run prepare).
@@ -45,17 +61,20 @@ and now you can try to run some example life cycle scripts (e.g. run prepare).
 
 ## Project Structure
 
-After installation, your project file structure should resemble the following or with more configuration files if you also installed other presets such as [`presetter-preset-esm`](https://github.com/alvis/presetter/blob/master/packages/preset-esm).
+After installation, your project file structure should resemble the following, or include more configuration files if you also installed other presets.
+
+Implement your business logic under `source` and prepare tests under `spec`.
+The `.d.ts` files are handy type definitions for you to import `.css` or image files in typescript.
 
-Implement your business logic under `source` and prepare tests under `spec`. The `.d.ts` files are handy type definitions for you to import `.css` or image files in typescript.
+**NOTE** You will notice there's no additional configuration file on your root folder like other presets such as [`presetter-preset-esm`](https://github.com/alvis/presetter/blob/master/packages/preset-esm).
+It's because `presetter-preset-react` extends `presetter-preset-web` which is a bundle only preset, meaning it only helps you to install the development packages specified in this preset only.
 
-**TIPS** You can always change the source directory to other (e.g. src) by setting the `source` variable in `.presetterrc.json`. See the [customization](https://github.com/alvis/presetter/blob/master/packages/preset-react#customization) section below for more details.
+**TIPS** You can always change the source directory to other (e.g. src) by setting the `source` variable in `presetter.config.ts`. See the [customization](https://github.com/alvis/presetter/blob/master/packages/preset-essentials#customization) section below for more details.
 
 ```
 (root)
- ├─ .eslintrc.json
  ├─ .git
- ├─ .presetterrc.json
+ ├─ presetter.config.ts
  ├─ node_modules
  ├─ source
  │   ├─ <folders>
@@ -67,6 +86,7 @@ Implement your business logic under `source` and prepare tests under `spec`. The
  │   ├─ image.d.ts
  │   ├─ style.d.ts
  │   ├─ (type).d.ts
+ ├─ eslint.config.ts
  ├─ package.json
  └─ tsconfig.json
 ```
@@ -74,34 +94,16 @@ Implement your business logic under `source` and prepare tests under `spec`. The
 ## Customization
 
 By default, this preset exports a handy configuration set for a React project written in typescript.
-But you can further customize (either extending or replacing) the configuration by specifying the change in the config file (`.presetterrc` or `.presetterrc.json`).
-
-These settings are available in the `config` field in the config file. For directories, the setting is specified in the `variable` field.
-
-The structure of `.presetterrc` should follow the interface below:
-
-```ts
-interface PresetterRC {
-  /** name(s) of the preset e.g. presetter-preset-react */
-  name: string | string[];
-  /** additional configuration passed to the preset for generating the configuration files */
-  config?: {
-    //  ┌─ configuration for other tools via other presets (e.g. presetter-preset-esm)
-    // ...
-
-    /** configuration to be merged with .eslintrc */
-    eslint?: Record<string, unknown>;
-    /** configuration to be merged with tsconfig.json */
-    tsconfig?: Record<string, unknown>;
-    /** variables to be substituted in templates */
-    variable?: {
-      /** the directory containing all source code (default: source) */
-      source?: string;
-      /** the directory containing all typing files (default: types) */
-      types?: string;
-      /** the directory containing all output tile (default: source) */
-      output?: string;
-    };
-  };
-}
-```
+
+You can further customize (either extending or replacing) the configuration by specifying the changes in the config file `presetter.config.ts`.
+
+## Script Template Summary
+
+- **`run build`**: Transpile source code from typescript and replace any mapped paths
+- **`run clean`**: Clean up any previously transpiled code
+- **`run develop -- <file path>`**: Create a service that run the specified file whenever the source has changed
+- **`run test`**: Run all tests
+- **`run watch`**: Rerun all tests whenever the source has change
+- **`run coverage`**: Run all test with coverage report
+- **`run release`**: Bump the version and automatically generate a change log
+- **`run release -- --prerelease <tag>`**: Release with a prerelease tag

package/lib/eslint.override.d.ts

@@ -0,0 +1,6 @@
+import type { Linter } from 'eslint';
+declare const _default: import("presetter").PresetContent<{
+    default: Linter.Config[];
+}>;
+export default _default;
+//# sourceMappingURL=eslint.override.d.ts.map

package/lib/eslint.override.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"eslint.override.d.ts","sourceRoot":"","sources":["../source/eslint.override.ts"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;;aAEL,MAAM,CAAC,MAAM,EAAE;;AAA/C,wBAuGG"}

package/lib/eslint.override.js

@@ -0,0 +1,103 @@
+/* v8 ignore start */
+import testing from 'eslint-plugin-testing-library';
+import { asset } from 'presetter';
+export default asset((current) => {
+    const configs = current?.default ?? [];
+    const hasTypescriptEslint = configs.some((config) => !!config.plugins?.['@typescript-eslint']);
+    const hasJsDoc = configs.some((config) => !!config.plugins?.jsdoc);
+    return {
+        default: [
+            ...configs,
+            {
+                name: 'presetter-preset-react:override:test-files',
+                files: ['**/__tests__/**/*.[jt]sx', '**/?(*.)+(spec|test).[jt]sx'],
+                ...testing.configs['flat/react'],
+            },
+            {
+                name: 'presetter-preset-react:override:react-files',
+                files: ['**/*.[jt]sx'],
+                rules: {
+                    'max-lines-per-function': [
+                        'warn',
+                        {
+                            max: 120, // extend the default to 120 lines for functional components
+                        },
+                    ],
+                    ...(hasTypescriptEslint && {
+                        '@typescript-eslint/naming-convention': [
+                            'error', // add PascalCase to the list for functional components
+                            {
+                                selector: 'default',
+                                format: [
+                                    'camelCase', // default
+                                ],
+                                leadingUnderscore: 'allow', // default
+                                trailingUnderscore: 'allow', // default
+                            },
+                            {
+                                selector: 'import',
+                                format: [
+                                    'camelCase', // default, for functions and variables
+                                    'PascalCase', // default, for classes
+                                ],
+                            },
+                            {
+                                selector: 'function',
+                                format: [
+                                    'camelCase', // default
+                                    'PascalCase', // for react components
+                                ],
+                            },
+                            {
+                                selector: 'objectLiteralMethod',
+                                format: null, // disable as an object literal is likely used for assigning parameters to a third-party library
+                            },
+                            {
+                                selector: 'objectLiteralProperty',
+                                format: null, // disable as an object literal is likely used for assigning parameters to a third-party library
+                            },
+                            {
+                                selector: 'parameter',
+                                format: [
+                                    'camelCase', // default
+                                    'PascalCase', // for react components
+                                ],
+                                leadingUnderscore: 'allow', // default
+                                trailingUnderscore: 'allow', // default
+                            },
+                            {
+                                selector: 'variable',
+                                format: [
+                                    'PascalCase', // for react functional components
+                                    'camelCase', // default, for variables
+                                    'UPPER_CASE', // default, for constants
+                                ],
+                                leadingUnderscore: 'allow', // add _prefix to ignore the rule
+                                trailingUnderscore: 'allow', // add _suffix to ignore the rule
+                            },
+                            {
+                                selector: 'typeLike',
+                                format: [
+                                    'PascalCase', // default
+                                ],
+                            },
+                        ],
+                    }),
+                    ...(hasJsDoc && {
+                        'jsdoc/require-returns': [
+                            'error', // tell us what the function is expected to return unless it's a JSX element
+                            {
+                                checkGetters: false,
+                                contexts: [
+                                    "FunctionDeclaration:has(BlockStatement > ReturnStatement:not([argument.type='JSXElement']))",
+                                    "ArrowFunctionExpression:has(BlockStatement > ReturnStatement:not([argument.type='JSXElement']))",
+                                ],
+                            },
+                        ],
+                    }),
+                },
+            },
+        ],
+    };
+});
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXNsaW50Lm92ZXJyaWRlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vc291cmNlL2VzbGludC5vdmVycmlkZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxxQkFBcUI7QUFFckIsT0FBTyxPQUFPLE1BQU0sK0JBQStCLENBQUM7QUFDcEQsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLFdBQVcsQ0FBQztBQUlsQyxlQUFlLEtBQUssQ0FBK0IsQ0FBQyxPQUFPLEVBQUUsRUFBRTtJQUM3RCxNQUFNLE9BQU8sR0FBRyxPQUFPLEVBQUUsT0FBTyxJQUFJLEVBQUUsQ0FBQztJQUV2QyxNQUFNLG1CQUFtQixHQUFHLE9BQU8sQ0FBQyxJQUFJLENBQ3RDLENBQUMsTUFBTSxFQUFFLEVBQUUsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLE9BQU8sRUFBRSxDQUFDLG9CQUFvQixDQUFDLENBQ3JELENBQUM7SUFFRixNQUFNLFFBQVEsR0FBRyxPQUFPLENBQUMsSUFBSSxDQUFDLENBQUMsTUFBTSxFQUFFLEVBQUUsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLE9BQU8sRUFBRSxLQUFLLENBQUMsQ0FBQztJQUVuRSxPQUFPO1FBQ0wsT0FBTyxFQUFFO1lBQ1AsR0FBRyxPQUFPO1lBQ1Y7Z0JBQ0UsSUFBSSxFQUFFLDRDQUE0QztnQkFDbEQsS0FBSyxFQUFFLENBQUMsMEJBQTBCLEVBQUUsNkJBQTZCLENBQUM7Z0JBQ2xFLEdBQUcsT0FBTyxDQUFDLE9BQU8sQ0FBQyxZQUFZLENBQUM7YUFDakM7WUFDRDtnQkFDRSxJQUFJLEVBQUUsNkNBQTZDO2dCQUNuRCxLQUFLLEVBQUUsQ0FBQyxhQUFhLENBQUM7Z0JBQ3RCLEtBQUssRUFBRTtvQkFDTCx3QkFBd0IsRUFBRTt3QkFDeEIsTUFBTTt3QkFDTjs0QkFDRSxHQUFHLEVBQUUsR0FBRyxFQUFFLDREQUE0RDt5QkFDdkU7cUJBQ0Y7b0JBQ0QsR0FBRyxDQUFDLG1CQUFtQixJQUFJO3dCQUN6QixzQ0FBc0MsRUFBRTs0QkFDdEMsT0FBTyxFQUFFLHVEQUF1RDs0QkFDaEU7Z0NBQ0UsUUFBUSxFQUFFLFNBQVM7Z0NBQ25CLE1BQU0sRUFBRTtvQ0FDTixXQUFXLEVBQUUsVUFBVTtpQ0FDeEI7Z0NBQ0QsaUJBQWlCLEVBQUUsT0FBTyxFQUFFLFVBQVU7Z0NBQ3RDLGtCQUFrQixFQUFFLE9BQU8sRUFBRSxVQUFVOzZCQUN4Qzs0QkFDRDtnQ0FDRSxRQUFRLEVBQUUsUUFBUTtnQ0FDbEIsTUFBTSxFQUFFO29DQUNOLFdBQVcsRUFBRSx1Q0FBdUM7b0NBQ3BELFlBQVksRUFBRSx1QkFBdUI7aUNBQ3RDOzZCQUNGOzRCQUNEO2dDQUNFLFFBQVEsRUFBRSxVQUFVO2dDQUNwQixNQUFNLEVBQUU7b0NBQ04sV0FBVyxFQUFFLFVBQVU7b0NBQ3ZCLFlBQVksRUFBRSx1QkFBdUI7aUNBQ3RDOzZCQUNGOzRCQUNEO2dDQUNFLFFBQVEsRUFBRSxxQkFBcUI7Z0NBQy9CLE1BQU0sRUFBRSxJQUFJLEVBQUUsZ0dBQWdHOzZCQUMvRzs0QkFDRDtnQ0FDRSxRQUFRLEVBQUUsdUJBQXVCO2dDQUNqQyxNQUFNLEVBQUUsSUFBSSxFQUFFLGdHQUFnRzs2QkFDL0c7NEJBQ0Q7Z0NBQ0UsUUFBUSxFQUFFLFdBQVc7Z0NBQ3JCLE1BQU0sRUFBRTtvQ0FDTixXQUFXLEVBQUUsVUFBVTtvQ0FDdkIsWUFBWSxFQUFFLHVCQUF1QjtpQ0FDdEM7Z0NBQ0QsaUJBQWlCLEVBQUUsT0FBTyxFQUFFLFVBQVU7Z0NBQ3RDLGtCQUFrQixFQUFFLE9BQU8sRUFBRSxVQUFVOzZCQUN4Qzs0QkFDRDtnQ0FDRSxRQUFRLEVBQUUsVUFBVTtnQ0FDcEIsTUFBTSxFQUFFO29DQUNOLFlBQVksRUFBRSxrQ0FBa0M7b0NBQ2hELFdBQVcsRUFBRSx5QkFBeUI7b0NBQ3RDLFlBQVksRUFBRSx5QkFBeUI7aUNBQ3hDO2dDQUNELGlCQUFpQixFQUFFLE9BQU8sRUFBRSxpQ0FBaUM7Z0NBQzdELGtCQUFrQixFQUFFLE9BQU8sRUFBRSxpQ0FBaUM7NkJBQy9EOzRCQUNEO2dDQUNFLFFBQVEsRUFBRSxVQUFVO2dDQUNwQixNQUFNLEVBQUU7b0NBQ04sWUFBWSxFQUFFLFVBQVU7aUNBQ3pCOzZCQUNGO3lCQUNGO3FCQUNGLENBQUM7b0JBQ0YsR0FBRyxDQUFDLFFBQVEsSUFBSTt3QkFDZCx1QkFBdUIsRUFBRTs0QkFDdkIsT0FBTyxFQUFFLDRFQUE0RTs0QkFDckY7Z0NBQ0UsWUFBWSxFQUFFLEtBQUs7Z0NBQ25CLFFBQVEsRUFBRTtvQ0FDUiw2RkFBNkY7b0NBQzdGLGlHQUFpRztpQ0FDbEc7NkJBQ0Y7eUJBQ0Y7cUJBQ0YsQ0FBQztpQkFDSDthQUNGO1NBQ2lCO0tBQ3JCLENBQUM7QUFDSixDQUFDLENBQUMsQ0FBQyJ9

package/lib/eslint.template.d.ts

@@ -0,0 +1,4 @@
+import type { Linter } from 'eslint';
+declare const _default: Linter.Config[];
+export default _default;
+//# sourceMappingURL=eslint.template.d.ts.map

package/lib/eslint.template.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"eslint.template.d.ts","sourceRoot":"","sources":["../source/eslint.template.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,QAAQ,CAAC;wBA8BhC,MAAM,CAAC,MAAM,EAAE;AA5BpB,wBA4BqB"}

package/lib/eslint.template.js

@@ -0,0 +1,32 @@
+/* v8 ignore start */
+import react from 'eslint-plugin-react';
+export default [
+    react.configs.flat.recommended,
+    react.configs.flat['jsx-runtime'],
+    {
+        name: 'presetter-preset-react',
+        plugins: { react },
+        languageOptions: {
+            parserOptions: {
+                ecmaFeatures: {
+                    jsx: true,
+                },
+            },
+        },
+        rules: {
+            'react/boolean-prop-naming': 'warn', // enforce consistent naming for boolean props
+            'react/button-has-type': 'warn', // enforce button elements to contain a type attribute
+            'react/destructuring-assignment': 'warn', // enforce usage of destructuring assignment in component
+            'react/prop-types': 'off', // we use TypeScript for prop types
+            'react/sort-comp': 'warn', // enforce component methods order
+            'react/jsx-sort-props': [
+                'warn', // enforce props order
+                {
+                    callbacksLast: true,
+                    shorthandFirst: true,
+                },
+            ],
+        },
+    },
+];
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXNsaW50LnRlbXBsYXRlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vc291cmNlL2VzbGludC50ZW1wbGF0ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxxQkFBcUI7QUFFckIsT0FBTyxLQUFLLE1BQU0scUJBQXFCLENBQUM7QUFJeEMsZUFBZTtJQUNiLEtBQUssQ0FBQyxPQUFPLENBQUMsSUFBSSxDQUFDLFdBQVc7SUFDOUIsS0FBSyxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDO0lBQ2pDO1FBQ0UsSUFBSSxFQUFFLHdCQUF3QjtRQUM5QixPQUFPLEVBQUUsRUFBRSxLQUFLLEVBQUU7UUFDbEIsZUFBZSxFQUFFO1lBQ2YsYUFBYSxFQUFFO2dCQUNiLFlBQVksRUFBRTtvQkFDWixHQUFHLEVBQUUsSUFBSTtpQkFDVjthQUNGO1NBQ0Y7UUFDRCxLQUFLLEVBQUU7WUFDTCwyQkFBMkIsRUFBRSxNQUFNLEVBQUUsOENBQThDO1lBQ25GLHVCQUF1QixFQUFFLE1BQU0sRUFBRSxzREFBc0Q7WUFDdkYsZ0NBQWdDLEVBQUUsTUFBTSxFQUFFLHlEQUF5RDtZQUNuRyxrQkFBa0IsRUFBRSxLQUFLLEVBQUUsbUNBQW1DO1lBQzlELGlCQUFpQixFQUFFLE1BQU0sRUFBRSxrQ0FBa0M7WUFDN0Qsc0JBQXNCLEVBQUU7Z0JBQ3RCLE1BQU0sRUFBRSxzQkFBc0I7Z0JBQzlCO29CQUNFLGFBQWEsRUFBRSxJQUFJO29CQUNuQixjQUFjLEVBQUUsSUFBSTtpQkFDckI7YUFDRjtTQUNGO0tBQ0Y7Q0FDaUIsQ0FBQyJ9

package/lib/index.d.ts

@@ -1,24 +1,24 @@
-import type { PresetAsset } from 'presetter-types';
 /** config for this preset */
-export type PresetConfig = {
+export interface PresetConfig {
     /** configuration to be merged with .eslintrc */
     eslint?: Record<string, unknown>;
     /** configuration to be merged with tsconfig.json */
     tsconfig?: Record<string, unknown>;
-};
+}
 /** list of configurable variables */
-export type Variable = {
+export interface Variables {
     /** the directory containing all source code (default: source) */
-    source?: string;
+    source: string;
     /** the directory containing all extra typing files (default: types) */
-    types?: string;
+    types: string;
     /** the directory containing all the compiled files (default: lib) */
-    output?: string;
+    output: string;
+}
+export declare const DEFAULT_VARIABLES: {
+    source: string;
+    types: string;
+    output: string;
 };
-export declare const DEFAULT_VARIABLE: Variable;
-/**
- * get the list of templates provided by this preset
- * @returns list of preset templates
- */
-export default function (): Promise<PresetAsset>;
+declare const _default: import("presetter-types").Preset;
+export default _default;
 //# sourceMappingURL=index.d.ts.map

package/lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../source/index.ts"],"names":[],"mappings":"AAkBA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAQnD,6BAA6B;AAC7B,MAAM,MAAM,YAAY,GAAG;IACzB,gDAAgD;IAChD,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,oDAAoD;IACpD,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACpC,CAAC;AAEF,qCAAqC;AACrC,MAAM,MAAM,QAAQ,GAAG;IACrB,iEAAiE;IACjE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,uEAAuE;IACvE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qEAAqE;IACrE,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,QAI9B,CAAC;AAmCF;;;GAGG;AACH,4BAAkC,OAAO,CAAC,WAAW,CAAC,CAQrD"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../source/index.ts"],"names":[],"mappings":"AAeA,6BAA6B;AAC7B,MAAM,WAAW,YAAY;IAC3B,gDAAgD;IAChD,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACjC,oDAAoD;IACpD,QAAQ,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACpC;AAED,qCAAqC;AACrC,MAAM,WAAW,SAAS;IACxB,iEAAiE;IACjE,MAAM,EAAE,MAAM,CAAC;IACf,uEAAuE;IACvE,KAAK,EAAE,MAAM,CAAC;IACd,qEAAqE;IACrE,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,iBAAiB;;;;CAIT,CAAC;;AAKtB,wBA4BG"}

package/lib/index.js

@@ -1,56 +1,41 @@
-/*
- *                            *** MIT LICENSE ***
- * -------------------------------------------------------------------------
- * This code may be modified and distributed under the MIT license.
- * See the LICENSE file for details.
- * -------------------------------------------------------------------------
- *
- * @summary   Preset for a React project
- *
- * @author    Alvis HT Tang <alvis@hilbert.space>
- * @license   MIT
- * @copyright Copyright (c) 2021 - All Rights Reserved.
- * -------------------------------------------------------------------------
- */
-import { dirname, join, resolve } from 'node:path';
+import { dirname, resolve } from 'node:path';
 import { fileURLToPath } from 'node:url';
+import web from 'presetter-preset-web';
+import { preset } from 'presetter-types';
+import eslintOverride from './eslint.override.js';
+import * as eslint from './eslint.template.js';
 const DIR = fileURLToPath(dirname(import.meta.url));
 // paths to the template directory
 const TEMPLATES = resolve(DIR, '..', 'templates');
-const CONFIGS = resolve(DIR, '..', 'configs');
-export const DEFAULT_VARIABLE = {
+const OVERRIDES = resolve(DIR, '..', 'overrides');
+export const DEFAULT_VARIABLES = {
     source: 'source',
     types: 'types',
     output: 'lib',
 };
 const IMAGE_TYPE = 'image.d.ts';
 const STYLE_TYPE = 'style.d.ts';
-const template = ({ custom: { variable: { types }, }, }) => ({
-    /* eslint-disable @typescript-eslint/naming-convention */
-    '.eslintrc.json': resolve(TEMPLATES, 'eslintrc.yaml'),
-    'tsconfig.json': resolve(TEMPLATES, 'tsconfig.yaml'),
-    'tsconfig.build.json': resolve(TEMPLATES, 'tsconfig.build.yaml'),
-    [join(types, IMAGE_TYPE)]: resolve(TEMPLATES, IMAGE_TYPE),
-    [join(types, STYLE_TYPE)]: resolve(TEMPLATES, STYLE_TYPE),
-    /* eslint-enable @typescript-eslint/naming-convention */
+export default preset('presetter-preset-react', {
+    extends: [web],
+    variables: DEFAULT_VARIABLES,
+    scripts: resolve(TEMPLATES, 'scripts.yaml'),
+    assets: ({ variables }) => ({
+        '.gitignore': (current, { variables }) => [
+            ...(current ?? []),
+            `/${variables.types}/${IMAGE_TYPE}`,
+            `/${variables.types}/${STYLE_TYPE}`,
+        ],
+        'eslint.config.ts': eslint,
+        'tsconfig.json': resolve(TEMPLATES, 'tsconfig.yaml'),
+        'tsconfig.build.json': resolve(TEMPLATES, 'tsconfig.build.yaml'),
+        [`${variables.types}/${IMAGE_TYPE}`]: resolve(TEMPLATES, IMAGE_TYPE),
+        [`${variables.types}/${STYLE_TYPE}`]: resolve(TEMPLATES, STYLE_TYPE),
+    }),
+    override: {
+        assets: {
+            '.lintstagedrc.json': resolve(OVERRIDES, 'lintstaged.yaml'),
+            'eslint.config.ts': eslintOverride,
+        },
+    },
 });
-const noSymlinks = ({ custom: { variable: { types }, }, }) => [join(types, IMAGE_TYPE), join(types, STYLE_TYPE)];
-const supplementaryConfig = () => ({
-    eslint: resolve(CONFIGS, 'eslint.yaml'),
-    gitignore: ({ custom: { variable: { types }, }, }) => [join('/', types, IMAGE_TYPE), join('/', types, STYLE_TYPE)],
-    lintstaged: resolve(CONFIGS, 'lintstaged.yaml'),
-});
-/**
- * get the list of templates provided by this preset
- * @returns list of preset templates
- */
-export default async function () {
-    return {
-        scripts: resolve(TEMPLATES, 'scripts.yaml'),
-        template,
-        noSymlinks,
-        supplementaryConfig,
-        variable: DEFAULT_VARIABLE,
-    };
-}
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zb3VyY2UvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7Ozs7Ozs7Ozs7Ozs7R0FhRztBQUVILE9BQU8sRUFBRSxPQUFPLEVBQUUsSUFBSSxFQUFFLE9BQU8sRUFBRSxNQUFNLFdBQVcsQ0FBQztBQUNuRCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sVUFBVSxDQUFDO0FBSXpDLE1BQU0sR0FBRyxHQUFHLGFBQWEsQ0FBQyxPQUFPLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDO0FBRXBELGtDQUFrQztBQUNsQyxNQUFNLFNBQVMsR0FBRyxPQUFPLENBQUMsR0FBRyxFQUFFLElBQUksRUFBRSxXQUFXLENBQUMsQ0FBQztBQUNsRCxNQUFNLE9BQU8sR0FBRyxPQUFPLENBQUMsR0FBRyxFQUFFLElBQUksRUFBRSxTQUFTLENBQUMsQ0FBQztBQW9COUMsTUFBTSxDQUFDLE1BQU0sZ0JBQWdCLEdBQWE7SUFDeEMsTUFBTSxFQUFFLFFBQVE7SUFDaEIsS0FBSyxFQUFFLE9BQU87SUFDZCxNQUFNLEVBQUUsS0FBSztDQUNkLENBQUM7QUFFRixNQUFNLFVBQVUsR0FBRyxZQUFZLENBQUM7QUFDaEMsTUFBTSxVQUFVLEdBQUcsWUFBWSxDQUFDO0FBRWhDLE1BQU0sUUFBUSxHQUE0QixDQUFDLEVBQ3pDLE1BQU0sRUFBRSxFQUNOLFFBQVEsRUFBRSxFQUFFLEtBQUssRUFBRSxHQUNwQixHQUNGLEVBQUUsRUFBRSxDQUFDLENBQUM7SUFDTCx5REFBeUQ7SUFDekQsZ0JBQWdCLEVBQUUsT0FBTyxDQUFDLFNBQVMsRUFBRSxlQUFlLENBQUM7SUFDckQsZUFBZSxFQUFFLE9BQU8sQ0FBQyxTQUFTLEVBQUUsZUFBZSxDQUFDO0lBQ3BELHFCQUFxQixFQUFFLE9BQU8sQ0FBQyxTQUFTLEVBQUUscUJBQXFCLENBQUM7SUFDaEUsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLFVBQVUsQ0FBQyxDQUFDLEVBQUUsT0FBTyxDQUFDLFNBQVMsRUFBRSxVQUFVLENBQUM7SUFDekQsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLFVBQVUsQ0FBQyxDQUFDLEVBQUUsT0FBTyxDQUFDLFNBQVMsRUFBRSxVQUFVLENBQUM7SUFDekQsd0RBQXdEO0NBQ3pELENBQUMsQ0FBQztBQUVILE1BQU0sVUFBVSxHQUE4QixDQUFDLEVBQzdDLE1BQU0sRUFBRSxFQUNOLFFBQVEsRUFBRSxFQUFFLEtBQUssRUFBRSxHQUNwQixHQUNGLEVBQUUsRUFBRSxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxVQUFVLENBQUMsRUFBRSxJQUFJLENBQUMsS0FBSyxFQUFFLFVBQVUsQ0FBQyxDQUFDLENBQUM7QUFFekQsTUFBTSxtQkFBbUIsR0FBdUMsR0FBRyxFQUFFLENBQUMsQ0FBQztJQUNyRSxNQUFNLEVBQUUsT0FBTyxDQUFDLE9BQU8sRUFBRSxhQUFhLENBQUM7SUFDdkMsU0FBUyxFQUFFLENBQUMsRUFDVixNQUFNLEVBQUUsRUFDTixRQUFRLEVBQUUsRUFBRSxLQUFLLEVBQUUsR0FDcEIsR0FDRixFQUFFLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxHQUFHLEVBQUUsS0FBSyxFQUFFLFVBQVUsQ0FBQyxFQUFFLElBQUksQ0FBQyxHQUFHLEVBQUUsS0FBSyxFQUFFLFVBQVUsQ0FBQyxDQUFDO0lBQ2xFLFVBQVUsRUFBRSxPQUFPLENBQUMsT0FBTyxFQUFFLGlCQUFpQixDQUFDO0NBQ2hELENBQUMsQ0FBQztBQUVIOzs7R0FHRztBQUNILE1BQU0sQ0FBQyxPQUFPLENBQUMsS0FBSztJQUNsQixPQUFPO1FBQ0wsT0FBTyxFQUFFLE9BQU8sQ0FBQyxTQUFTLEVBQUUsY0FBYyxDQUFDO1FBQzNDLFFBQVE7UUFDUixVQUFVO1FBQ1YsbUJBQW1CO1FBQ25CLFFBQVEsRUFBRSxnQkFBZ0I7S0FDM0IsQ0FBQztBQUNKLENBQUMifQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zb3VyY2UvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLE9BQU8sRUFBRSxPQUFPLEVBQUUsTUFBTSxXQUFXLENBQUM7QUFDN0MsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLFVBQVUsQ0FBQztBQUV6QyxPQUFPLEdBQUcsTUFBTSxzQkFBc0IsQ0FBQztBQUN2QyxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFFekMsT0FBTyxjQUFjLE1BQU0sbUJBQW1CLENBQUM7QUFDL0MsT0FBTyxLQUFLLE1BQU0sTUFBTSxtQkFBbUIsQ0FBQztBQUU1QyxNQUFNLEdBQUcsR0FBRyxhQUFhLENBQUMsT0FBTyxDQUFDLE1BQU0sQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQztBQUVwRCxrQ0FBa0M7QUFDbEMsTUFBTSxTQUFTLEdBQUcsT0FBTyxDQUFDLEdBQUcsRUFBRSxJQUFJLEVBQUUsV0FBVyxDQUFDLENBQUM7QUFDbEQsTUFBTSxTQUFTLEdBQUcsT0FBTyxDQUFDLEdBQUcsRUFBRSxJQUFJLEVBQUUsV0FBVyxDQUFDLENBQUM7QUFvQmxELE1BQU0sQ0FBQyxNQUFNLGlCQUFpQixHQUFHO0lBQy9CLE1BQU0sRUFBRSxRQUFRO0lBQ2hCLEtBQUssRUFBRSxPQUFPO0lBQ2QsTUFBTSxFQUFFLEtBQUs7Q0FDTSxDQUFDO0FBRXRCLE1BQU0sVUFBVSxHQUFHLFlBQVksQ0FBQztBQUNoQyxNQUFNLFVBQVUsR0FBRyxZQUFZLENBQUM7QUFFaEMsZUFBZSxNQUFNLENBQUMsd0JBQXdCLEVBQUU7SUFDOUMsT0FBTyxFQUFFLENBQUMsR0FBRyxDQUFDO0lBQ2QsU0FBUyxFQUFFLGlCQUFpQjtJQUM1QixPQUFPLEVBQUUsT0FBTyxDQUFDLFNBQVMsRUFBRSxjQUFjLENBQUM7SUFDM0MsTUFBTSxFQUFFLENBQUMsRUFBRSxTQUFTLEVBQUUsRUFBRSxFQUFFLENBQUMsQ0FBQztRQUMxQixZQUFZLEVBQUUsQ0FBQyxPQUFPLEVBQUUsRUFBRSxTQUFTLEVBQUUsRUFBRSxFQUFFLENBQUM7WUFDeEMsR0FBRyxDQUFDLE9BQU8sSUFBSSxFQUFFLENBQUM7WUFDbEIsSUFBSSxTQUFTLENBQUMsS0FBTSxJQUFJLFVBQVUsRUFBRTtZQUNwQyxJQUFJLFNBQVMsQ0FBQyxLQUFNLElBQUksVUFBVSxFQUFFO1NBQ3JDO1FBQ0Qsa0JBQWtCLEVBQUUsTUFBTTtRQUMxQixlQUFlLEVBQUUsT0FBTyxDQUFDLFNBQVMsRUFBRSxlQUFlLENBQUM7UUFDcEQscUJBQXFCLEVBQUUsT0FBTyxDQUFDLFNBQVMsRUFBRSxxQkFBcUIsQ0FBQztRQUNoRSxDQUFDLEdBQUcsU0FBUyxDQUFDLEtBQU0sSUFBSSxVQUFVLEVBQWtCLENBQUMsRUFBRSxPQUFPLENBQzVELFNBQVMsRUFDVCxVQUFVLENBQ1g7UUFDRCxDQUFDLEdBQUcsU0FBUyxDQUFDLEtBQU0sSUFBSSxVQUFVLEVBQWtCLENBQUMsRUFBRSxPQUFPLENBQzVELFNBQVMsRUFDVCxVQUFVLENBQ1g7S0FDRixDQUFDO0lBQ0YsUUFBUSxFQUFFO1FBQ1IsTUFBTSxFQUFFO1lBQ04sb0JBQW9CLEVBQUUsT0FBTyxDQUFDLFNBQVMsRUFBRSxpQkFBaUIsQ0FBQztZQUMzRCxrQkFBa0IsRUFBRSxjQUFjO1NBQ25DO0tBQ0Y7Q0FDRixDQUFDLENBQUMifQ==

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "presetter-preset-react",
-  "version": "5.0.0",
+  "version": "6.1.0",
   "description": "An opinionated presetter preset for a React project",
   "keywords": [
     "presetter",
@@ -15,6 +15,12 @@
   "main": "lib/index.js",
   "types": "lib/index.d.ts",
   "type": "module",
+  "exports": {
+    ".": {
+      "default": "./lib/index.js",
+      "types": "./lib/index.d.ts"
+    }
+  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/alvis/presetter.git"
@@ -24,13 +30,14 @@
     "@types/react": "^18.0.0",
     "eslint-plugin-react": "^7.0.0",
     "eslint-plugin-testing-library": "^6.0.0",
-    "presetter": "5.0.0"
+    "presetter": "6.1.0",
+    "presetter-preset-web": "6.1.0"
   },
   "devDependencies": {
-    "presetter": "5.0.0"
+    "presetter": "6.1.0"
   },
   "dependencies": {
-    "presetter-types": "5.0.0"
+    "presetter-types": "6.1.0"
   },
   "scripts": {
     "build": "run build",

package/configs/eslint.yaml

@@ -1,21 +0,0 @@
-overrides:
-  - files:
-      - '{source}/**/*.tsx'
-    rules:
-      max-lines-per-function:
-        - error
-        - max: 90
-rules:
-  '@typescript-eslint/naming-convention':
-    - error
-    - selector: variable
-      types:
-        - function
-      format:
-        - camelCase
-        - PascalCase
-  jsdoc/require-returns: # tell us what the function is expected to return
-    1:
-      contexts:
-        - FunctionDeclaration:has(BlockStatement > ReturnStatement:not([argument.type='JSXElement']))
-        - ArrowFunctionExpression:has(BlockStatement > ReturnStatement:not([argument.type='JSXElement']))

package/templates/eslintrc.yaml

@@ -1,60 +0,0 @@
-extends:
-  - plugin:react/recommended
-  - plugin:react/jsx-runtime
-rules:
-  react/boolean-prop-naming: warn
-  react/button-has-type: warn
-  react/destructuring-assignment: warn
-  react/prop-types: off
-  react/sort-comp: warn
-  react/jsx-sort-props:
-    - warn
-    - callbacksLast: true
-      shorthandFirst: true
-overrides:
-  - files:
-      - '**/__tests__/**/*.[jt]sx'
-      - '**/?(*.)+(spec|test).[jt]sx'
-    extends:
-      - plugin:testing-library/react
-  - files:
-      - src/**/*.tsx
-    rules:
-      max-lines-per-function:
-        - warn
-        - max: 120
-      '@typescript-eslint/naming-convention': # use JS/TS naming convention
-        - error
-        - selector: default
-          format:
-            - camelCase # default
-          leadingUnderscore: allow # default
-          trailingUnderscore: allow # default
-        - selector: import
-          format:
-            - camelCase # default, for functions and variables
-            - PascalCase # default, for classes
-        - selector: function
-          format:
-            - camelCase # default
-            - PascalCase # for react components
-        - selector: objectLiteralMethod
-          format: null # disable as an object literal is likely used for assigning parameters to a third-party library
-        - selector: objectLiteralProperty
-          format: null # disable as an object literal is likely used for assigning parameters to a third-party library
-        - selector: parameter
-          format:
-            - camelCase # default
-            - PascalCase # for react components
-          leadingUnderscore: allow # default
-          trailingUnderscore: allow # default
-        - selector: variable
-          format:
-            - PascalCase # for react functional components
-            - camelCase # default
-            - UPPER_CASE # default, for constants
-          leadingUnderscore: allow
-          trailingUnderscore: allow
-        - selector: typeLike
-          format:
-            - PascalCase # default