UNPKG

4.84 kBJavaScriptView Raw
1'use strict';
2
3Object.defineProperty(exports, "__esModule", {
4 value: true
5});
6
7var _isArray2 = require('lodash/lang/isArray');
8
9var _isArray3 = _interopRequireDefault(_isArray2);
10
11var _isObject2 = require('lodash/lang/isObject');
12
13var _isObject3 = _interopRequireDefault(_isObject2);
14
15var _map2 = require('lodash/collection/map');
16
17var _map3 = _interopRequireDefault(_map2);
18
19var _filter2 = require('lodash/collection/filter');
20
21var _filter3 = _interopRequireDefault(_filter2);
22
23var _react = require('react');
24
25var _react2 = _interopRequireDefault(_react);
26
27var _makeConfiguration = require('./makeConfiguration');
28
29var _makeConfiguration2 = _interopRequireDefault(_makeConfiguration);
30
31var _isIterable = require('./isIterable');
32
33var _isIterable2 = _interopRequireDefault(_isIterable);
34
35function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
36
37var generateAppendClassName = undefined,
38 linkClass = undefined,
39 parseStyleName = undefined;
40
41parseStyleName = function (styleNamePropertyValue, allowMultiple) {
42 var styleNames = undefined;
43
44 styleNames = styleNamePropertyValue.split(' ');
45 styleNames = (0, _filter3.default)(styleNames);
46
47 if (allowMultiple === false && styleNames.length > 1) {
48 throw new Error('ReactElement styleName property defines multiple module names ("' + styleNamePropertyValue + '").');
49 }
50
51 return styleNames;
52};
53
54generateAppendClassName = function (styles, styleNames, errorWhenNotFound) {
55 var appendClassName = undefined;
56
57 appendClassName = '';
58
59 appendClassName = (0, _map3.default)(styleNames, function (styleName) {
60 if (styles[styleName]) {
61 return styles[styleName];
62 } else {
63 if (errorWhenNotFound === true) {
64 throw new Error('"' + styleName + '" CSS module is undefined.');
65 }
66
67 return '';
68 }
69 });
70
71 appendClassName = (0, _filter3.default)(appendClassName, 'length');
72
73 appendClassName = appendClassName.join(' ');
74
75 return appendClassName;
76};
77
78/**
79 * @param {ReactElement} element
80 * @param {Object} styles CSS modules class map.
81 * @param {CSSModules~Options} userConfiguration
82 * @returns {ReactElement}
83 */
84linkClass = function (element) {
85 var styles = arguments.length <= 1 || arguments[1] === undefined ? {} : arguments[1];
86 var userConfiguration = arguments[2];
87
88 var appendClassName = undefined,
89 children = undefined,
90 clonedElement = undefined,
91 configuration = undefined,
92 newChildren = undefined,
93 newProps = undefined,
94 styleNames = undefined;
95
96 // @see https://github.com/gajus/react-css-modules/pull/30
97 if (!(0, _isObject3.default)(element)) {
98 return element;
99 }
100
101 configuration = (0, _makeConfiguration2.default)(userConfiguration);
102
103 styleNames = parseStyleName(element.props.styleName || '', configuration.allowMultiple);
104
105 if (styleNames.length) {
106 appendClassName = generateAppendClassName(styles, styleNames, configuration.errorWhenNotFound);
107 }
108
109 // element.props.children can be one of the following:
110 // 'text'
111 // ['text']
112 // [ReactElement, 'text']
113 // ReactElement
114
115 children = element.props.children;
116
117 if (_react2.default.isValidElement(children)) {
118 newChildren = linkClass(_react2.default.Children.only(children), styles, configuration);
119 } else if ((0, _isArray3.default)(children) || (0, _isIterable2.default)(children)) {
120 /* eslint-disable lodash3/prefer-lodash-method */
121 newChildren = _react2.default.Children.map(children, function (node) {
122 /* eslint-enable lodash3/prefer-lodash-method */
123 if (_react2.default.isValidElement(node)) {
124 return linkClass(node, styles, configuration);
125 } else {
126 return node;
127 }
128 });
129
130 // https://github.com/facebook/react/issues/4723#issuecomment-135555277
131 // Forcing children into an array produces the following error:
132 // Warning: A ReactFragment is an opaque type. Accessing any of its properties is deprecated. Pass it to one of the React.Children helpers.
133 // newChildren = _.values(newChildren);
134 }
135
136 if (appendClassName) {
137 if (element.props.className) {
138 appendClassName = element.props.className + ' ' + appendClassName;
139 }
140
141 newProps = {
142 className: appendClassName,
143 styleName: null
144 };
145 }
146
147 if (newChildren) {
148 clonedElement = _react2.default.cloneElement(element, newProps, newChildren);
149 } else {
150 clonedElement = _react2.default.cloneElement(element, newProps);
151 }
152
153 return clonedElement;
154};
155
156exports.default = linkClass;
157module.exports = exports['default'];
158//# sourceMappingURL=linkClass.js.map