Merge branch 'main' into feat-attribute-passing-web-components

packages/cli/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @builder.io/mitosis-cli
 
+## 0.5.27
+
+### Patch Changes
+
+- 92ad2c6: Misc: stop using `fs-extra-promise` dependency
+- Updated dependencies [92ad2c6]
+  - @builder.io/[email protected]
+
+## 0.5.26
+
+### Patch Changes
+
+- Updated dependencies [57bdffe]
+  - @builder.io/[email protected]
+
+## 0.5.25
+
+### Patch Changes
+
+- Updated dependencies [af43f50]
+- Updated dependencies [20ad8dc]
+  - @builder.io/[email protected]
+
 ## 0.5.24
 
 ### Patch Changes

packages/cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@builder.io/mitosis-cli",
-  "version": "0.5.24",
+  "version": "0.5.27",
   "description": "mitosis CLI",
   "types": "build/types/types.d.ts",
   "bin": {

packages/core/CHANGELOG.md

@@ -1,5 +1,77 @@
 # Change Log
 
+## 0.5.27
+
+### Patch Changes
+
+- 92ad2c6: Misc: stop using `fs-extra-promise` dependency
+
+## 0.5.26
+
+### Patch Changes
+
+- 57bdffe: [angular] fix issue with definite assignment (!) for props with defaultProps
+
+## 0.5.25
+
+### Patch Changes
+
+- af43f50: [All] Refactored `useMetadata` hook to enable import resolution instead of simple `JSON5` parsing.
+
+  You could use a normal JS `Object` and import it inside your `*.lite.tsx` file like this:
+
+  ```ts
+  // data.ts
+
+  export const myMetadata: Record<string, string | number> = {
+    a: 'b',
+    c: 1,
+  };
+  ```
+
+  ```tsx
+  // my-button.lite.tsx
+  import { useMetadata } from '@builder.io/mitosis';
+  import { myMetadata } from './data.ts';
+
+  useMetadata({
+    x: 'y',
+    my: myMetadata,
+  });
+
+  export default function MyButton() {
+    return <button></button>;
+  }
+  ```
+
+- 20ad8dc: [angular]: Fix issue with events forced to become `toLowerCase()`.
+
+  Based on [choosing-event-names](https://angular.dev/guide/components/outputs#choosing-event-names) custom events are camelCase.
+  [DOM events](https://www.w3schools.com/jsref/dom_obj_event.asp) are always lower-cased for Angular components.
+
+  Checkout [event-handlers.ts](https://github.com/BuilderIO/mitosis/blob/main/packages/core/src/helpers/event-handlers.ts) for a list of all events that are automatically lower-cased. Everything else will be treated as a custom event and therefore camelCased.
+
+  If you need some other event to be lower-cased you can use `useMetadata.angular.nativeEvents`:
+
+  ```tsx
+  import { useMetadata } from '@builder.io/mitosis';
+
+  useMetadata({
+    angular: {
+      nativeEvents: ['onNativeEvent'],
+    },
+  });
+
+  export default function MyComponent(props) {
+    return (
+      <div>
+        <input onNativeEvent={(event) => console.log(event)} />
+        Hello!
+      </div>
+    );
+  }
+  ```
+
 ## 0.5.24
 
 ### Patch Changes

packages/core/package.json

@@ -22,7 +22,7 @@
     "name": "Builder.io",
     "url": "https://www.builder.io"
   },
-  "version": "0.5.24",
+  "version": "0.5.27",
   "homepage": "https://github.com/BuilderIO/mitosis",
   "main": "./dist/src/index.js",
   "exports": {
@@ -86,7 +86,6 @@
     "@types/babel__core": "7.1.14",
     "@types/dedent": "^0.7.0",
     "@types/estree": "^1.0.2",
-    "@types/fs-extra-promise": "^1.0.10",
     "@types/hash-sum": "^1.0.0",
     "@types/json5": "0.0.30",
     "@types/lodash": "^4.14.165",
@@ -95,7 +94,6 @@
     "@types/prettier": "^2.1.5",
     "@types/rollup__plugin-virtual": "^2.0.1",
     "concurrently": "^8.2.2",
-    "fs-extra-promise": "^1.0.1",
     "rimraf": "^5.0.5",
     "rollup": "^2.70.1",
     "strip-ansi": "^6.0.1",

packages/core/src/__tests__/qwik.test.ts

@@ -1,9 +1,9 @@
-import { outputFileAsync } from 'fs-extra-promise';
+import { mkdirSync, writeFileSync } from 'fs';
 import { resolve } from 'path';
 import stripAnsi from 'strip-ansi';
 import { File } from '../generators/qwik';
 import { componentToQwik } from '../generators/qwik/component-generator';
-import { addComponent, createFileSet, FileSet } from '../generators/qwik/index';
+import { FileSet, addComponent, createFileSet } from '../generators/qwik/index';
 import { builderContentToMitosisComponent } from '../parsers/builder';
 import { parseJsx } from '../parsers/jsx';
 import {
@@ -27,7 +27,8 @@ const debugOutput = async (fileSet: FileSet) => {
   if (debugFiles) {
     for (const key in fileSet) {
       const file = (fileSet as any)[key];
-      await outputFileAsync(resolve(base, file.path), file.contents);
+      await mkdirSync(base, { recursive: true });
+      await writeFileSync(resolve(base, file.path), file.contents);
     }
   }
 };

packages/core/src/generators/angular/index.ts

@@ -631,9 +631,12 @@ export const componentToAngular: TranspilerGenerator<ToAngularOptions> =
       ${Array.from(props)
         .filter((item) => !isSlotProperty(item) && item !== 'children')
         .map((item) => {
+          const hasDefaultProp = json.defaultProps && json.defaultProps.hasOwnProperty(item);
           const propType = propsTypeRef ? `${propsTypeRef}["${item}"]` : 'any';
-          let propDeclaration = `@Input() ${item}${options.typescript ? `!: ${propType}` : ''}`;
-          if (json.defaultProps && json.defaultProps.hasOwnProperty(item)) {
+          let propDeclaration = `@Input() ${item}${
+            options.typescript ? `${hasDefaultProp ? '' : '!'}: ${propType}` : ''
+          }`;
+          if (hasDefaultProp) {
             propDeclaration += ` = defaultProps["${item}"]`;
           }
           return propDeclaration;

packages/core/src/parsers/jsx/hooks/use-metadata.ts

@@ -9,7 +9,7 @@ import { Context, ParseMitosisOptions, ResolvedImport } from '@/parsers/jsx/type
 import { MitosisImport } from '@/types/mitosis-component';
 import * as babel from '@babel/core';
 import { NodePath } from '@babel/core';
-import { existsSync, readFileSync } from 'fs-extra-promise';
+import { existsSync, readFileSync } from 'fs';
 import * as path from 'path';
 
 type ResolveData = {

yarn.lock

@@ -3376,7 +3376,6 @@ __metadata:
     "@types/babel__core": "npm:7.1.14"
     "@types/dedent": "npm:^0.7.0"
     "@types/estree": "npm:^1.0.2"
-    "@types/fs-extra-promise": "npm:^1.0.10"
     "@types/hash-sum": "npm:^1.0.0"
     "@types/json5": "npm:0.0.30"
     "@types/lodash": "npm:^4.14.165"
@@ -3388,7 +3387,6 @@ __metadata:
     concurrently: "npm:^8.2.2"
     csstype: "npm:^3.0.4"
     fp-ts: "npm:^2.11.10"
-    fs-extra-promise: "npm:^1.0.1"
     hash-sum: "npm:^2.0.0"
     json5: "npm:^2.1.3"
     lodash: "npm:^4.17.20"
@@ -6226,13 +6224,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/bluebird@npm:*":
-  version: 3.5.36
-  resolution: "@types/bluebird@npm:3.5.36"
-  checksum: 10/74d3870a745a3a70a5f516b8a85746938506b013ca4f8722b4f9b252860efd645d7ce7599dca8e0c86b4145c290f67daa812ad6c9274cc1b450d690b60de7b19
-  languageName: node
-  linkType: hard
-
 "@types/body-parser@npm:*":
   version: 1.19.2
   resolution: "@types/body-parser@npm:1.19.2"
@@ -6453,26 +6444,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@types/fs-extra-promise@npm:^1.0.10":
-  version: 1.0.10
-  resolution: "@types/fs-extra-promise@npm:1.0.10"
-  dependencies:
-    "@types/bluebird": "npm:*"
-    "@types/fs-extra": "npm:^4"
-    "@types/node": "npm:*"
-  checksum: 10/a65d59cb9335df5ed30deade86763c99771b76694b04bec15bbadaeedf4e4f8557aa7d7cbf6d08f2e92ac4e5b4be071e9a89f50d03490dd3fe8d2699029e6b74
-  languageName: node
-  linkType: hard
-
-"@types/fs-extra@npm:^4":
-  version: 4.0.12
-  resolution: "@types/fs-extra@npm:4.0.12"
-  dependencies:
-    "@types/node": "npm:*"
-  checksum: 10/a78250cb222bb64966747ca16120485e1b14d985a2d1bb6b2d4f21113925c39155e02749c4d6fcc4c6e10b80fc332345a89f5a93756439aaede6f7d4ea81db89
-  languageName: node
-  linkType: hard
-
 "@types/fs-extra@npm:^9.0.13":
   version: 9.0.13
   resolution: "@types/fs-extra@npm:9.0.13"
@@ -8756,13 +8727,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"bluebird@npm:^3.5.0":
-  version: 3.7.2
-  resolution: "bluebird@npm:3.7.2"
-  checksum: 10/007c7bad22c5d799c8dd49c85b47d012a1fe3045be57447721e6afbd1d5be43237af1db62e26cb9b0d9ba812d2e4ca3bac82f6d7e016b6b88de06ee25ceb96e7
-  languageName: node
-  linkType: hard
-
 "bn.js@npm:^4.0.0, bn.js@npm:^4.1.0, bn.js@npm:^4.11.9":
   version: 4.12.0
   resolution: "bn.js@npm:4.12.0"
@@ -12879,16 +12843,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"fs-extra-promise@npm:^1.0.1":
-  version: 1.0.1
-  resolution: "fs-extra-promise@npm:1.0.1"
-  dependencies:
-    bluebird: "npm:^3.5.0"
-    fs-extra: "npm:^2.1.2"
-  checksum: 10/09b29c5df8e1b333090deef0127ba9094ebb7dc9a4cd7c8163b048b82eaccb978674b2cf3565d2d8332c40ecfd0e6587f1415d10ff3b7f99735b5c52b676d62e
-  languageName: node
-  linkType: hard
-
 "fs-extra@npm:^10.1.0":
   version: 10.1.0
   resolution: "fs-extra@npm:10.1.0"
@@ -12911,16 +12865,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"fs-extra@npm:^2.1.2":
-  version: 2.1.2
-  resolution: "fs-extra@npm:2.1.2"
-  dependencies:
-    graceful-fs: "npm:^4.1.2"
-    jsonfile: "npm:^2.1.0"
-  checksum: 10/2cd92acba96fc2a180b7fc9d7966765d3eb4dfe8b52c112da62d421b40d07554e814ead8364f7be002449bfecb2180ec9ee37f85c4eee28e5281c7969c5cd059
-  languageName: node
-  linkType: hard
-
 "fs-extra@npm:^7.0.1, fs-extra@npm:~7.0.1":
   version: 7.0.1
   resolution: "fs-extra@npm:7.0.1"
@@ -15044,18 +14988,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"jsonfile@npm:^2.1.0":
-  version: 2.4.0
-  resolution: "jsonfile@npm:2.4.0"
-  dependencies:
-    graceful-fs: "npm:^4.1.6"
-  dependenciesMeta:
-    graceful-fs:
-      optional: true
-  checksum: 10/517656e0a7c4eda5a90341dd0ec9e9b7590d0c77d66d8aad0162615dfc7c5f219c82565b927cc4cc774ca93e484d118a274ef0def74279a3d8afb4ff2f4e4800
-  languageName: node
-  linkType: hard
-
 "jsonfile@npm:^4.0.0":
   version: 4.0.0
   resolution: "jsonfile@npm:4.0.0"