@stencil/react-output-target - npm Package Compare versions

Comparing version 0.0.1-dev.11711372539.10de27e3 to 0.0.1-dev.11712339520.1220c57d

package.json

 {
   "name": "@stencil/react-output-target",
-  "version": "0.0.1-dev.11711372539.10de27e3",
+  "version": "0.0.1-dev.11712339520.1220c57d",
   "description": "React output target for @stencil/core components.",
-  "main": "dist/index.cjs.js",
-  "module": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "main": "./dist/react-output-target.js",
+  "module": "./dist/react-output-target.js",
+  "types": "./dist/react-output-target/index.d.ts",
+  "type": "module",
   "files": [
-    "dist/",
-    "react-component-lib/"
+    "dist/"
   ],
@@ -17,12 +17,11 @@ "publishConfig": {
     "prepublishOnly": "npm run build",
-    "prebuild": "rimraf ./dist",
-    "build": "tsc && npm run rollup",
-    "watch": "tsc --watch",
-    "rollup": "rollup -c",
+    "build": "vite build && npm run build:dts",
+    "build:dts": "tsc -p tsconfig.json",
+    "build:tsup": "tsup",
     "version": "npm run build",
-    "prettier": "npm run prettier.base -- --write",
-    "prettier.base": "prettier \"./({react-component-lib,src,test,__tests__}/**/*.{ts,tsx,js,jsx})|*.{ts,tsx,js,jsx}\"",
-    "prettier.dry-run": "npm run prettier.base -- --list-different",
+    "prettier": "prettier \"./src/**/*.{html,ts,tsx,js,jsx}\" --write",
     "release": "np",
-    "test": "jest"
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "coverage": "vitest run --coverage"
   },
@@ -40,29 +39,36 @@ "repository": {
   "peerDependencies": {
-    "@stencil/core": ">=2.0.0 || >=3 || >= 4.0.0-beta.0 || >= 4.0.0"
+    "@stencil/core": ">=3 || >= 4.0.0-beta.0 || >= 4.0.0"
   },
   "devDependencies": {
-    "@types/react": "^16.7.0",
-    "@types/react-dom": "^16.7.0",
-    "react": "^16.7.0",
-    "react-dom": "^16.7.0",
-    "react-testing-library": "^7.0.0"
+    "react": "^18.2.0",
+    "ts-dedent": "^2.2.0",
+    "typescript": "^5.4.4",
+    "vite": "^5.0.0",
+    "vite-plugin-dts": "^3.8.1",
+    "vitest": "^1.4.0"
   },
-  "jest": {
-    "transform": {
-      "^.+\\.(js|ts|tsx)$": "<rootDir>/test/jest.preprocessor.js"
-    },
-    "testRegex": "(\\.(test|spec))\\.(ts?|tsx?|jsx?)$",
-    "moduleFileExtensions": [
-      "ts",
-      "tsx",
-      "js",
-      "json",
-      "jsx"
-    ],
-    "testURL": "http://localhost"
-  },
-  "gitHead": "0de27e325f2697a448cc8b3eb7495e814fe540cd",
+  "gitHead": "220c57d890b57d6d1b3bfc8afd93a261432ea3f4",
   "volta": {
     "extends": "../../package.json"
+  },
+  "dependencies": {
+    "@lit/react": "^1.0.4",
+    "ts-morph": "^22.0.0"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/react-output-target/index.d.ts",
+      "node": {
+        "default": "./dist/react-output-target.cjs"
+      },
+      "default": "./dist/react-output-target.js"
+    },
+    "./runtime": {
+      "types": "./dist/react/index.d.ts",
+      "browser": {
+        "default": "./dist/react.js"
+      },
+      "default": "./dist/react.js"
+    }
   }
 }

README.md

@@ -15,3 +15,3 @@ # @stencil/react-output-target
 ```bash
-npm install @stencil/react-output-target
+npm install @stencil/react-output-target --save-dev
 ```
@@ -31,8 +31,6 @@
     reactOutputTarget({
-      componentCorePackage: 'component-library',
-      proxiesFile: '../component-library-react/src/components.ts',
+      outDir: '../component-library-react/src/',
     }),
     {
-      type: 'dist',
-      esmLoaderPath: '../loader',
+      type: 'dist-custom-elements',
     },
@@ -45,11 +43,8 @@ ],
 
-| Property                      | Description                                                                                                                                                                                                                                                                                                                      |
-| ----------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `componentCorePackage`        | The NPM package name of your Stencil component library. This package is used as a dependency for your React wrappers.                                                                                                                                                                                                            |
-| `proxiesFile`                 | The output file of all the component wrappers generated by the output target. This file path should point to a location within your React library/project.                                                                                                                                                                       |
-| `excludeComponents`           | An array of tag names to exclude from generating component wrappers for. This is helpful when have a custom framework implementation of a specific component or need to extend the base component wrapper behavior.                                                                                                              |
-| `loaderDir`                   | This is the path to where the `defineCustomElements` function exists in your built project. If `loaderDir` is not provided, the `/dist/loader` directory will be used.                                                                                                                                                           |
-| `includePolyfills`            | If `true`, polyfills will automatically be imported and the `applyPolyfills` function will be called in your proxies file. This can only be used when lazy loading Web Components and will not work when `includeImportCustomElements` is `true`.                                                                                |
-| `includeDefineCustomElements` | If `true`, all Web Components will automatically be registered with the Custom Elements Registry. This can only be used when lazy loading Web Components and will not work when `includeImportCustomElements` is `true`.                                                                                                         |
-| `includeImportCustomElements` | If `true`, the output target will import the custom element instance and register it with the Custom Elements Registry when the component is imported inside of a user's app. This can only be used with the [Custom Elements Bundle](https://stenciljs.com/docs/custom-elements) and will not work with lazy loaded components. |
-| `customElementsDir`           | This is the directory where the custom elements are imported from when using the [Custom Elements Bundle](https://stenciljs.com/docs/custom-elements). Defaults to the `components` directory. Only applies when `includeImportCustomElements` is `true`.                                                                        |
+| Property                | Description                                                                                                                      |
+| ----------------------- | -------------------------------------------------------------------------------------------------------------------------------- |
+| `outDir`                | The directory where the React components will be generated.                                                                      |
+| `esModule`              | If `true`, the output target will generate ES module files for each React component wrapper. Defaults to `false`.                |
+| `stencilPackageName`    | The name of the package that exports the Stencil components. Defaults to the package.json detected by the Stencil compiler.      |
+| `excludeComponents`     | An array of component tag names to exclude from the React output target.                                                         |
+| `experimentalUseClient` | If `true`, the generated output target will include the [`use client;`](https://react.dev/reference/react/use-client) directive. |

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Fixed alerts

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Improved metrics

Number of low supply chain risk alerts

0

decreased by-100%

Is type module

Yes

Worsened metrics

Total package byte prevSize

26925

decreased by-63.08%

Dependency count

3

increased by200%

Dev dependency count

6

increased by20%

Number of package files

15

decreased by-31.82%

Number of low license alerts

1

increased byInfinity%

Lines of code

502

decreased by-65.5%

Number of low quality alerts

2

increased by100%

Number of lines in readme file

48

decreased by-9.43%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@lit/react@^1.0.4

• + Addedts-morph@^22.0.0

• + Added@lit/react@1.0.7(transitive)

• + Added@nodelib/fs.scandir@2.1.5(transitive)

• + Added@nodelib/fs.stat@2.0.5(transitive)

• + Added@nodelib/fs.walk@1.2.8(transitive)

• + Added@ts-morph/common@0.23.0(transitive)

• + Added@types/react@19.0.8(transitive)

• + Addedbalanced-match@1.0.2(transitive)

• + Addedbrace-expansion@2.0.1(transitive)

• + Addedbraces@3.0.3(transitive)

• + Addedcode-block-writer@13.0.3(transitive)

• + Addedcsstype@3.1.3(transitive)

• + Addedfast-glob@3.3.3(transitive)

• + Addedfastq@1.19.0(transitive)

• + Addedfill-range@7.1.1(transitive)

• + Addedglob-parent@5.1.2(transitive)

• + Addedis-extglob@2.1.1(transitive)

• + Addedis-glob@4.0.3(transitive)

• + Addedis-number@7.0.0(transitive)

• + Addedmerge2@1.4.1(transitive)

• + Addedmicromatch@4.0.8(transitive)

• + Addedminimatch@9.0.5(transitive)

• + Addedmkdirp@3.0.1(transitive)

• + Addedpath-browserify@1.0.1(transitive)

• + Addedpicomatch@2.3.1(transitive)

• + Addedqueue-microtask@1.2.3(transitive)

• + Addedreusify@1.0.4(transitive)

• + Addedrun-parallel@1.2.0(transitive)

• + Addedto-regex-range@5.0.1(transitive)

• + Addedts-morph@22.0.0(transitive)