Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat(react-property): rewrite build svg script
No longer generate the following from svg build script: - attributes.json - attribute-to-property.json - boolean-properties.json - overloaded-boolean-properties.json The reason is these files have redundant attribute names, which makes the final bundle size larger than expected. Also, the svg attribute names are lowercased instead of camelcased. Now the following file is generated: - properties.json It's similar to `react-dom/lib/SVGDOMPropertyConfig.js` except redundant attribute to property name mappings are deleted. Also, update svg index module to include the injection properties.
- Loading branch information
1 parent
8559c38
commit eb7a59b
Showing
2 changed files
with
74 additions
and
46 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,14 +1,51 @@ | ||
var attributeToProperty = require('../../lib/svg/attribute-to-property'); | ||
var attributes = require('../../lib/svg/attributes'); | ||
var properties = require('./properties'); | ||
|
||
var attributeMap = {}; | ||
var injection = properties.injection; | ||
var MUST_USE_PROPERTY = injection.MUST_USE_PROPERTY; | ||
var HAS_BOOLEAN_VALUE = injection.HAS_BOOLEAN_VALUE; | ||
var HAS_NUMERIC_VALUE = injection.HAS_NUMERIC_VALUE; | ||
var HAS_POSITIVE_NUMERIC_VALUE = injection.HAS_POSITIVE_NUMERIC_VALUE; | ||
var HAS_OVERLOADED_BOOLEAN_VALUE = injection.HAS_OVERLOADED_BOOLEAN_VALUE; | ||
var Properties = properties.Properties; | ||
var DOMAttributeNames = properties.DOMAttributeNames; | ||
|
||
/** | ||
* @see https://github.com/facebook/react/blob/15-stable/src/renderers/dom/shared/DOMProperty.js#L14-L16 | ||
* | ||
* @param {Number} value | ||
* @param {Number} bitmask | ||
* @return {Boolean} | ||
*/ | ||
function checkMask(value, bitmask) { | ||
return (value & bitmask) === bitmask; | ||
} | ||
|
||
/** | ||
* Config map. | ||
* | ||
* @type {Object} | ||
*/ | ||
var config = {}; | ||
var attributeName; | ||
var propertyName; | ||
var propConfig; | ||
|
||
for (propertyName in Properties) { | ||
attributeName = DOMAttributeNames[propertyName] || propertyName; | ||
propConfig = Properties[propertyName]; | ||
|
||
for (var i = 0, len = attributes.length; i < len; i++) { | ||
attributeName = attributes[i]; | ||
propertyName = attributeToProperty[attributeName] || attributeName; | ||
attributeMap[attributeName] = { propertyName: propertyName }; | ||
config[attributeName] = { | ||
attributeName: attributeName, | ||
propertyName: propertyName, | ||
mustUseProperty: checkMask(propConfig, MUST_USE_PROPERTY), | ||
hasBooleanValue: checkMask(propConfig, HAS_BOOLEAN_VALUE), | ||
hasNumericValue: checkMask(propConfig, HAS_NUMERIC_VALUE), | ||
hasPositiveNumericValue: checkMask(propConfig, HAS_POSITIVE_NUMERIC_VALUE), | ||
hasOverloadedBooleanValue: checkMask( | ||
propConfig, | ||
HAS_OVERLOADED_BOOLEAN_VALUE | ||
) | ||
}; | ||
} | ||
|
||
module.exports = attributeMap; | ||
module.exports = config; |