make record type for props with attrs

Author: mununki

cli/reactjs_jsx_v4.ml

@@ -289,14 +289,15 @@ let makePropsTypeParams ?(stripExplicitOption = false)
 
 let makeLabelDecls ~loc namedTypeList =
   namedTypeList
-  |> List.map (fun (isOptional, label, _, interiorType) ->
+  |> List.map (fun (isOptional, label, attrs, interiorType) ->
          if label = "key" then
-           Type.field ~loc ~attrs:optionalAttrs {txt = label; loc} interiorType
+           Type.field ~loc ~attrs:(optionalAttrs @ attrs) {txt = label; loc}
+             interiorType
          else if isOptional then
-           Type.field ~loc ~attrs:optionalAttrs {txt = label; loc}
+           Type.field ~loc ~attrs:(optionalAttrs @ attrs) {txt = label; loc}
              (Typ.var @@ safeTypeFromValue @@ Labelled label)
          else
-           Type.field ~loc {txt = label; loc}
+           Type.field ~loc ~attrs {txt = label; loc}
              (Typ.var @@ safeTypeFromValue @@ Labelled label))
 
 let makeTypeDecls propsName loc namedTypeList =
@@ -681,7 +682,9 @@ let newtypeToVar newtype type_ =
   mapper.typ mapper type_
 
 let argToType ~newtypes ~(typeConstraints : core_type option) types
-    (name, default, _noLabelName, _alias, loc, type_) =
+    ((name, default, {ppat_attributes = attrs}, _alias, loc, type_) :
+      arg_label * expression option * pattern * label * 'loc * core_type option)
+    =
   let rec getType name coreType =
     match coreType with
     | {ptyp_desc = Ptyp_arrow (arg, c1, c2)} ->
@@ -699,28 +702,29 @@ let argToType ~newtypes ~(typeConstraints : core_type option) types
   in
   match (type_, name, default) with
   | Some type_, name, _ when isOptional name ->
-    (true, getLabel name, [], {type_ with ptyp_attributes = optionalAttrs})
+    (true, getLabel name, attrs, {type_ with ptyp_attributes = optionalAttrs})
     :: types
-  | Some type_, name, _ -> (false, getLabel name, [], type_) :: types
+  | Some type_, name, _ -> (false, getLabel name, attrs, type_) :: types
   | None, name, _ when isOptional name ->
     ( true,
       getLabel name,
-      [],
+      attrs,
       Typ.var ~loc ~attrs:optionalAttrs (safeTypeFromValue name) )
     :: types
   | None, name, _ when isLabelled name ->
-    (false, getLabel name, [], Typ.var ~loc (safeTypeFromValue name)) :: types
+    (false, getLabel name, attrs, Typ.var ~loc (safeTypeFromValue name))
+    :: types
   | _ -> types
 
 let argWithDefaultValue (name, default, _, _, _, _) =
   match default with
   | Some default when isOptional name -> Some (getLabel name, default)
   | _ -> None
 
-let argToConcreteType types (name, _loc, type_) =
+let argToConcreteType types (name, attrs, _loc, type_) =
   match name with
-  | name when isLabelled name -> (false, getLabel name, [], type_) :: types
-  | name when isOptional name -> (true, getLabel name, [], type_) :: types
+  | name when isLabelled name -> (false, getLabel name, attrs, type_) :: types
+  | name when isOptional name -> (true, getLabel name, attrs, type_) :: types
   | _ -> types
 
 let check_string_int_attribute_iter =
@@ -757,15 +761,19 @@ let transformStructureItem ~config mapper item =
           |> Option.map React_jsx_common.typVarsOfCoreType
           |> Option.value ~default:[]
         in
-        let rec getPropTypes types ({ptyp_loc; ptyp_desc} as fullType) =
+        let rec getPropTypes types
+            ({ptyp_loc; ptyp_desc; ptyp_attributes} as fullType) =
           match ptyp_desc with
           | Ptyp_arrow (name, type_, ({ptyp_desc = Ptyp_arrow _} as rest))
             when isLabelled name || isOptional name ->
-            getPropTypes ((name, ptyp_loc, type_) :: types) rest
+            getPropTypes
+              ((name, ptyp_attributes, ptyp_loc, type_) :: types)
+              rest
           | Ptyp_arrow (Nolabel, _type, rest) -> getPropTypes types rest
           | Ptyp_arrow (name, type_, returnValue)
             when isLabelled name || isOptional name ->
-            (returnValue, (name, returnValue.ptyp_loc, type_) :: types)
+            ( returnValue,
+              (name, ptyp_attributes, returnValue.ptyp_loc, type_) :: types )
           | _ -> (fullType, types)
         in
         let innerType, propTypes = getPropTypes [] pval_type in
@@ -1237,19 +1245,22 @@ let transformSignatureItem ~config _mapper item =
       in
       let rec getPropTypes types ({ptyp_loc; ptyp_desc} as fullType) =
         match ptyp_desc with
-        | Ptyp_arrow (name, type_, ({ptyp_desc = Ptyp_arrow _} as rest))
+        | Ptyp_arrow
+            ( name,
+              ({ptyp_attributes = attrs} as type_),
+              ({ptyp_desc = Ptyp_arrow _} as rest) )
           when isOptional name || isLabelled name ->
-          getPropTypes ((name, ptyp_loc, type_) :: types) rest
+          getPropTypes ((name, attrs, ptyp_loc, type_) :: types) rest
         | Ptyp_arrow
             (Nolabel, {ptyp_desc = Ptyp_constr ({txt = Lident "unit"}, _)}, rest)
           ->
           getPropTypes types rest
         | Ptyp_arrow (Nolabel, _type, rest) ->
           hasForwardRef := true;
           getPropTypes types rest
-        | Ptyp_arrow (name, type_, returnValue)
+        | Ptyp_arrow (name, ({ptyp_attributes = attrs} as type_), returnValue)
           when isOptional name || isLabelled name ->
-          (returnValue, (name, returnValue.ptyp_loc, type_) :: types)
+          (returnValue, (name, attrs, returnValue.ptyp_loc, type_) :: types)
         | _ -> (fullType, types)
       in
       let innerType, propTypes = getPropTypes [] pval_type in

tests/ppx/react/expected/mangleKeyword.res.txt

@@ -3,7 +3,7 @@
 module C0 = {
   @obj external makeProps: (~_open: 'T_open, ~key: string=?, unit) => {"_open": 'T_open} = ""
 
-  @react.component let make = (@warning("-16") ~_open) => React.string(_open)
+  @react.component let make = @warning("-16") (~_open) => React.string(_open)
   let make = {
     let \"MangleKeyword$C0" = (\"Props": {"_open": 'T_open}) => make(~_open=\"Props"["_open"])
     \"MangleKeyword$C0"
@@ -20,49 +20,57 @@ let c1 = React.createElement(C1.make, C1.makeProps(~_open="x", ()))
 @@jsxConfig({version: 4, mode: "classic"})
 
 module C0 = {
-  type props<'T_open> = {
-    _open: 'T_open,
+  type props<'T_open, 'T_type> = {
+    @as("open") _open: 'T_open,
+    @as("type") _type: 'T_type,
   }
 
-  @react.component let make = ({_open, _}: props<'T_open>) => React.string(_open)
+  @react.component
+  let make = ({@as("open") _open, @as("type") _type, _}: props<'T_open, string>) =>
+    React.string(_open)
   let make = {
     let \"MangleKeyword$C0" = (props: props<_>) => make(props)
 
     \"MangleKeyword$C0"
   }
 }
 module C1 = {
-  type props<'T_open> = {
-    _open: 'T_open,
+  type props<'T_open, 'T_type> = {
+    @as("open") _open: 'T_open,
+    @as("type") _type: 'T_type,
   }
 
-  external make: @as("open") React.componentLike<props<string>, React.element> = "default"
+  external make: @as("open") React.componentLike<props<string, string>, React.element> = "default"
 }
 
-let c0 = React.createElement(C0.make, {_open: "x"})
-let c1 = React.createElement(C1.make, {_open: "x"})
+let c0 = React.createElement(C0.make, {_open: "x", _type: "t"})
+let c1 = React.createElement(C1.make, {_open: "x", _type: "t"})
 
 @@jsxConfig({version: 4, mode: "automatic"})
 
 module C0 = {
-  type props<'T_open> = {
-    _open: 'T_open,
+  type props<'T_open, 'T_type> = {
+    @as("open") _open: 'T_open,
+    @as("type") _type: 'T_type,
   }
 
-  @react.component let make = ({_open, _}: props<'T_open>) => React.string(_open)
+  @react.component
+  let make = ({@as("open") _open, @as("type") _type, _}: props<'T_open, string>) =>
+    React.string(_open)
   let make = {
     let \"MangleKeyword$C0" = (props: props<_>) => make(props)
 
     \"MangleKeyword$C0"
   }
 }
 module C1 = {
-  type props<'T_open> = {
-    _open: 'T_open,
+  type props<'T_open, 'T_type> = {
+    @as("open") _open: 'T_open,
+    @as("type") _type: 'T_type,
   }
 
-  external make: @as("open") React.componentLike<props<string>, React.element> = "default"
+  external make: @as("open") React.componentLike<props<string, string>, React.element> = "default"
 }
 
-let c0 = React.jsx(C0.make, {_open: "x"})
-let c1 = React.jsx(C1.make, {_open: "x"})
+let c0 = React.jsx(C0.make, {_open: "x", _type: "t"})
+let c1 = React.jsx(C1.make, {_open: "x", _type: "t"})

tests/ppx/react/mangleKeyword.res

@@ -17,27 +17,29 @@ let c1 = <C1 _open="x" />
 module C0 = {
   @react.component
   let make =
-    (@as("open") ~_open) => React.string(_open)
+    (@as("open") ~_open, @as("type") ~_type: string) => React.string(_open)
 }
 module C1 = {
   @react.component
-  external make: (@as("open") ~_open: string) => React.element = "default"
+  external make: (@as("open") ~_open: string, @as("type") ~_type: string) => React.element =
+    "default"
 }
 
-let c0 = <C0 _open="x" />
-let c1 = <C1 _open="x" />
+let c0 = <C0 _open="x" _type="t" />
+let c1 = <C1 _open="x" _type="t" />
 
 @@jsxConfig({version: 4, mode: "automatic"})
 
 module C0 = {
   @react.component
   let make =
-    (@as("open") ~_open) => React.string(_open)
+    (@as("open") ~_open, @as("type") ~_type: string) => React.string(_open)
 }
 module C1 = {
   @react.component
-  external make: (@as("open") ~_open: string) => React.element = "default"
+  external make: (@as("open") ~_open: string, @as("type") ~_type: string) => React.element =
+    "default"
 }
 
-let c0 = <C0 _open="x" />
-let c1 = <C1 _open="x" />
+let c0 = <C0 _open="x" _type="t" />
+let c1 = <C1 _open="x" _type="t" />