cerxes/babel
3
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

make react JSX transformer more generic and allow JSX comments - closes #841

Browse Source
This commit is contained in:
Sebastian McKenzie 2015-02-21 12:53:09 +11:00
parent 74186241f9
commit 35bd510930
4 changed files with 42 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
lib/babel/transformation/helpers/build-react-transformer.js
View File

@ -73,7 +73,7 @@ module.exports = function (exports, opts) {
};
if (opts.pre) {
opts.pre(state);
opts.pre(state, file);
}
var attribs = node.attributes;
@ -86,7 +86,7 @@ module.exports = function (exports, opts) {
args.push(attribs);
if (opts.post) {
opts.post(state);
opts.post(state, file);
}
return state.call || t.callExpression(state.callee, args);

20
lib/babel/transformation/transformers/other/react.js vendored
View File

@ -3,6 +3,22 @@
var react = require("../../helpers/react");
var t = require("../../../types");
var JSX_ANNOTATION_REGEX = /^\*\s*@jsx\s+([^\s]+)/;
exports.Program = function (node, parent, scope, file) {
var id = "React.createElement";
var comment = file.ast.comments[0];
if (comment) {
var matches = JSX_ANNOTATION_REGEX.exec(comment.value);
if (matches) id = matches[1];
}
file.set("jsxIdentifier", id.split(".").map(t.identifier).reduce(function (object, property) {
return t.memberExpression(object, property);
}));
};
require("../../helpers/build-react-transformer")(exports, {
pre: function (state) {
var tagName = state.tagName;
@ -14,7 +30,7 @@ require("../../helpers/build-react-transformer")(exports, {
}
},
post: function (state) {
state.callee = t.memberExpression(t.identifier("React"), t.identifier("createElement"));
post: function (state, file) {
state.callee = file.get("jsxIdentifier");
}
});

8
test/fixtures/transformation/react/honor-custom-jsx-comment/actual.js vendored Normal file
View File

@ -0,0 +1,8 @@
/** @jsx dom */
<Foo></Foo>;
var profile = <div>
<img src="avatar.png" className="profile" />
<h3>{[user.firstName, user.lastName].join(" ")}</h3>
</div>;

14
test/fixtures/transformation/react/honor-custom-jsx-comment/expected.js vendored Normal file
View File

@ -0,0 +1,14 @@
/** @jsx dom */
dom(Foo, null);
var profile = dom(
"div",
null,
dom("img", { src: "avatar.png", className: "profile" }),
dom(
"h3",
null,
[user.firstName, user.lastName].join(" ")
)
);