From 02a3af8c601aaa47da47497204fb3247adeb81f8 Mon Sep 17 00:00:00 2001 From: mattdamon108 Date: Wed, 26 Oct 2022 09:59:13 +0900 Subject: [PATCH 1/5] update v4 spec about sharing props --- cli/JSXV4.md | 33 +++++++++++++++++++++++++++++++++ 1 file changed, 33 insertions(+) diff --git a/cli/JSXV4.md b/cli/JSXV4.md index 5d3326ae..b66c8c29 100644 --- a/cli/JSXV4.md +++ b/cli/JSXV4.md @@ -373,3 +373,36 @@ let p: A.props<_> = {x: "x", y: "y"} ``` + +### Shared props type (new feature) + +V4 introduces support to set a props type from the outside. It allows sharing of the props type between components. + +```rescript +type sharedProps<'a> = {x: 'a, y: string} + +module A = { + @react.component(:sharedProps<'a>) + let make = (~x, ~y) => React.string(x ++ y) +} + +module B = { + @react.component(:sharedProps<'a>) + let make = (~x, ~y) => React.string(x ++ y) +} + +// is transformed to +module A = { + type props<'a> = sharedProps<'a> + + let make = ({x, y, _}: props<'a>) => React.string(x ++ y) + ... +} + +module B = { + type props<'a> = sharedProps<'a> + + let make = ({x, y, _}: props<'a>) => React.string(x ++ y) + ... +} +``` \ No newline at end of file From c052cb99bf5a0b99a247b929a3bf170635ca0dc8 Mon Sep 17 00:00:00 2001 From: mattdamon108 Date: Thu, 27 Oct 2022 15:26:59 +0900 Subject: [PATCH 2/5] fix the example of shared props for v4 spec --- cli/JSXV4.md | 33 +++++++++++++++------------------ 1 file changed, 15 insertions(+), 18 deletions(-) diff --git a/cli/JSXV4.md b/cli/JSXV4.md index b66c8c29..e2586be6 100644 --- a/cli/JSXV4.md +++ b/cli/JSXV4.md @@ -379,30 +379,27 @@ let p: A.props<_> = {x: "x", y: "y"} V4 introduces support to set a props type from the outside. It allows sharing of the props type between components. ```rescript -type sharedProps<'a> = {x: 'a, y: string} +type sp = {x: string, y: string} +type sp1<'a> = {x: 'a, y: string} +type sp2<'a, 'b> = {x: 'a, y: 'b} -module A = { - @react.component(:sharedProps<'a>) - let make = (~x, ~y) => React.string(x ++ y) +module C1 = { + @react.component(:sp) + let make = (~x, ~y) => body } -module B = { - @react.component(:sharedProps<'a>) - let make = (~x, ~y) => React.string(x ++ y) +module C2 = { + @react.component(:sp1<'a>) + let make = (~x, ~y) => body } -// is transformed to -module A = { - type props<'a> = sharedProps<'a> - - let make = ({x, y, _}: props<'a>) => React.string(x ++ y) - ... +module C3 = { + @react.component(:sp2<'a, 'b>) + let make = (~x, ~y) => body } -module B = { - type props<'a> = sharedProps<'a> - - let make = ({x, y, _}: props<'a>) => React.string(x ++ y) - ... +module C4 = { + @react.component(:sp) + let make = (~x:int, ~y) => body // type annotation is ignored by type sp1 } ``` \ No newline at end of file From 1112ae60bde5e5b44b1c611d6e80122568877ae0 Mon Sep 17 00:00:00 2001 From: mattdamon108 Date: Thu, 27 Oct 2022 15:28:31 +0900 Subject: [PATCH 3/5] clean up the spec about shared props --- cli/JSXV4.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/cli/JSXV4.md b/cli/JSXV4.md index e2586be6..2bce1546 100644 --- a/cli/JSXV4.md +++ b/cli/JSXV4.md @@ -383,23 +383,23 @@ type sp = {x: string, y: string} type sp1<'a> = {x: 'a, y: string} type sp2<'a, 'b> = {x: 'a, y: 'b} -module C1 = { +module C = { @react.component(:sp) let make = (~x, ~y) => body } -module C2 = { +module C1 = { @react.component(:sp1<'a>) let make = (~x, ~y) => body } -module C3 = { +module C2 = { @react.component(:sp2<'a, 'b>) let make = (~x, ~y) => body } -module C4 = { +module C3 = { @react.component(:sp) - let make = (~x:int, ~y) => body // type annotation is ignored by type sp1 + let make = (~x:int, ~y) => body // type annotation is ignored by type sp } ``` \ No newline at end of file From 168d69165ca8446fc18f4862ac60e3258302a792 Mon Sep 17 00:00:00 2001 From: Cristiano Calcagno Date: Thu, 27 Oct 2022 09:13:12 +0200 Subject: [PATCH 4/5] Update JSXV4.md --- cli/JSXV4.md | 46 ++++++++++++++++++++++++++++++++-------------- 1 file changed, 32 insertions(+), 14 deletions(-) diff --git a/cli/JSXV4.md b/cli/JSXV4.md index 2bce1546..a9b1f3cf 100644 --- a/cli/JSXV4.md +++ b/cli/JSXV4.md @@ -376,30 +376,48 @@ let p: A.props<_> = {x: "x", y: "y"} ### Shared props type (new feature) -V4 introduces support to set a props type from the outside. It allows sharing of the props type between components. +V4 introduces support to control the definition of the `props` type by passing as argument to `@react.component` the body of the type definition of `props`. The main application is sharing a single type definition across several components. Here are a few examples: + ```rescript -type sp = {x: string, y: string} -type sp1<'a> = {x: 'a, y: string} -type sp2<'a, 'b> = {x: 'a, y: 'b} +type sharedprops<'x, 'y> = {x: 'x, y: 'y, z:string} -module C = { - @react.component(:sp) - let make = (~x, ~y) => body +module C1 = { + @react.component(:sharedProps<'a, 'b>) + let make = (~x, ~y) => React.string(x ++ y ++ z) +} + +module C2 = { + @react.component(:sharedProps) + let make = (~x, ~y) => React.string(x ++ y ++ z) +} + +module C3 = { + type myProps = sharedProps + @react.component(:myProps) + let make = (~x, ~y) => React.int(x + y) } +``` + +The generated code (some details removed) looks like this: +```rescript +@@jsxConfig({version: 4, mode: "classic"}) + +type sharedprops<'x, 'y> = {x: 'x, y: 'y, z: string} module C1 = { - @react.component(:sp1<'a>) - let make = (~x, ~y) => body + type props<'a, 'b> = sharedProps<'a, 'b> + let make = ({x, y, _}: props<'a, 'b>) => React.string(x ++ y ++ z) } module C2 = { - @react.component(:sp2<'a, 'b>) - let make = (~x, ~y) => body + type props<'b> = sharedProps + let make = ({x, y, _}: props<'b>) => React.string(x ++ y ++ z) } module C3 = { - @react.component(:sp) - let make = (~x:int, ~y) => body // type annotation is ignored by type sp + type myProps = sharedProps + type props = myProps + let make = ({x, y, _}: props) => React.int(x + y) } -``` \ No newline at end of file +``` From 4ef6c4b67dc9e2a9349fd277d3621c1c120d124b Mon Sep 17 00:00:00 2001 From: mattdamon108 Date: Thu, 27 Oct 2022 18:44:12 +0900 Subject: [PATCH 5/5] update jsx v4 spec about shared props constraint --- cli/JSXV4.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/cli/JSXV4.md b/cli/JSXV4.md index a9b1f3cf..b8f6b0ef 100644 --- a/cli/JSXV4.md +++ b/cli/JSXV4.md @@ -407,12 +407,12 @@ type sharedprops<'x, 'y> = {x: 'x, y: 'y, z: string} module C1 = { type props<'a, 'b> = sharedProps<'a, 'b> - let make = ({x, y, _}: props<'a, 'b>) => React.string(x ++ y ++ z) + let make = ({x, y, _}: props<_>) => React.string(x ++ y ++ z) } module C2 = { type props<'b> = sharedProps - let make = ({x, y, _}: props<'b>) => React.string(x ++ y ++ z) + let make = ({x, y, _}: props<_>) => React.string(x ++ y ++ z) } module C3 = {