Skip to content

Commit 03a6535

Browse files
siddharthkpsiddharthkp
committed
API#4
1 parent f755230 commit 03a6535

File tree

11 files changed

+1174
-195
lines changed

11 files changed

+1174
-195
lines changed

‎api3.js

Lines changed: 73 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,73 @@
1+
import React from 'react';
2+
3+
function cssConstructor (className) {
4+
if (typeof className === 'function') {
5+
Object.defineProperty(className.prototype, 'render', {
6+
value: wrapper(className)
7+
});
8+
}
9+
}
10+
11+
function wrapper(className) {
12+
let fn = className.prototype.render;
13+
return function () {
14+
let rawCSS = className.prototype.css.apply(this, arguments);
15+
let style = parseCss(rawCSS);
16+
let renderedElement = fn.apply(this, arguments);
17+
let newProps = {...renderedElement.props, style};
18+
return React.cloneElement(renderedElement, newProps, renderedElement.props.children);
19+
}
20+
}
21+
22+
let camelCase = (key) => key.replace(/(\-[a-z])/g, $1 => $1.toUpperCase().replace('-',''));
23+
24+
let parseCss = (rawCSS) => {
25+
let styles = {};
26+
let rules = rawCSS.trim().split('\n');
27+
for (let rule of rules) {
28+
let [key, value] = rule.trim().replace(';', '').split(':');
29+
key = camelCase(key.trim());
30+
value = value.trim();
31+
styles[key] = value;
32+
}
33+
return styles;
34+
}
35+
36+
function css (rawCSS) {
37+
let rules = rawCSS[0].trim().split('\n');
38+
39+
return function (target, name, descriptor) {
40+
return {
41+
...descriptor,
42+
value: function () {
43+
let props;
44+
function giveMeProps(object) {
45+
props = object.props;
46+
return object;
47+
}
48+
let rendered = descriptor.value.apply(giveMeProps(this), arguments);
49+
let newProps = {...props};
50+
51+
return React.cloneElement(rendered, newProps, rendered.props.children);
52+
}
53+
}
54+
};
55+
}
56+
57+
function css1 (rawCSS) {
58+
return function (target, name, descriptor) {
59+
return {
60+
...descriptor,
61+
value: () => {
62+
let style = parseCss(rawCSS);
63+
let renderedElement = descriptor.value.apply(this, arguments);
64+
let newProps = {...renderedElement.props, style};
65+
return React.cloneElement(renderedElement, newProps, renderedElement.props.children);
66+
}
67+
}
68+
}
69+
};
70+
71+
module.exports = {
72+
cssConstructor, css
73+
}

‎api4.js

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
import React from 'react';
2+
3+
function css (rawCSS) {
4+
let rules = rawCSS[0].trim().split('\n');
5+
6+
return function (target, name, descriptor) {
7+
return {
8+
...descriptor,
9+
value: function () {
10+
let style = parseCss(rawCSS);
11+
let props;
12+
function giveMeProps(object) {
13+
props = object.props;
14+
return object;
15+
}
16+
let rendered = descriptor.value.apply(giveMeProps(this), arguments);
17+
let newProps = {...props, style};
18+
19+
return React.cloneElement(rendered, newProps, rendered.props.children);
20+
}
21+
}
22+
};
23+
}
24+
25+
let camelCase = (key) => key.replace(/(\-[a-z])/g, $1 => $1.toUpperCase().replace('-',''));
26+
27+
let parseCss = (rawCSS) => {
28+
let styles = {};
29+
let rules = rawCSS[0].trim().split('\n');
30+
for (let rule of rules) {
31+
let [key, value] = rule.trim().replace(';', '').split(':');
32+
key = camelCase(key.trim());
33+
value = value.trim();
34+
styles[key] = value;
35+
}
36+
return styles;
37+
}
38+
39+
export default css;

‎css3.js

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
'use strict';
2+
3+
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
4+
5+
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
6+
7+
var _react = require('react');
8+
9+
var _react2 = _interopRequireDefault(_react);
10+
11+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12+
13+
function cssConstructor(className) {
14+
if (typeof className === 'function') {
15+
Object.defineProperty(className.prototype, 'render', {
16+
value: wrapper(className)
17+
});
18+
}
19+
}
20+
21+
function wrapper(className) {
22+
var fn = className.prototype.render;
23+
return function () {
24+
var rawCSS = className.prototype.css.apply(this, arguments);
25+
var style = parseCss(rawCSS);
26+
var renderedElement = fn.apply(this, arguments);
27+
var newProps = _extends({}, renderedElement.props, { style: style });
28+
return _react2.default.cloneElement(renderedElement, newProps, renderedElement.props.children);
29+
};
30+
}
31+
32+
var camelCase = function camelCase(key) {
33+
return key.replace(/(\-[a-z])/g, function ($1) {
34+
return $1.toUpperCase().replace('-', '');
35+
});
36+
};
37+
38+
var parseCss = function parseCss(rawCSS) {
39+
var styles = {};
40+
var rules = rawCSS.trim().split('\n');
41+
var _iteratorNormalCompletion = true;
42+
var _didIteratorError = false;
43+
var _iteratorError = undefined;
44+
45+
try {
46+
for (var _iterator = rules[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
47+
var rule = _step.value;
48+
49+
var _rule$trim$replace$sp = rule.trim().replace(';', '').split(':'),
50+
_rule$trim$replace$sp2 = _slicedToArray(_rule$trim$replace$sp, 2),
51+
key = _rule$trim$replace$sp2[0],
52+
value = _rule$trim$replace$sp2[1];
53+
54+
key = camelCase(key.trim());
55+
value = value.trim();
56+
styles[key] = value;
57+
}
58+
} catch (err) {
59+
_didIteratorError = true;
60+
_iteratorError = err;
61+
} finally {
62+
try {
63+
if (!_iteratorNormalCompletion && _iterator.return) {
64+
_iterator.return();
65+
}
66+
} finally {
67+
if (_didIteratorError) {
68+
throw _iteratorError;
69+
}
70+
}
71+
}
72+
73+
return styles;
74+
};
75+
76+
function css(rawCSS) {
77+
var rules = rawCSS[0].trim().split('\n');
78+
79+
return function (target, name, descriptor) {
80+
return _extends({}, descriptor, {
81+
value: function value() {
82+
var props = void 0;
83+
function giveMeProps(object) {
84+
props = object.props;
85+
return object;
86+
}
87+
var rendered = descriptor.value.apply(giveMeProps(this), arguments);
88+
var newProps = _extends({}, props);
89+
90+
return _react2.default.cloneElement(rendered, newProps, rendered.props.children);
91+
}
92+
});
93+
};
94+
}
95+
96+
function css1(rawCSS) {
97+
return function (target, name, descriptor) {
98+
var _this = this,
99+
_arguments = arguments;
100+
101+
return _extends({}, descriptor, {
102+
value: function value() {
103+
var style = parseCss(rawCSS);
104+
var renderedElement = descriptor.value.apply(_this, _arguments);
105+
var newProps = _extends({}, renderedElement.props, { style: style });
106+
return _react2.default.cloneElement(renderedElement, newProps, renderedElement.props.children);
107+
}
108+
});
109+
};
110+
};
111+
112+
module.exports = {
113+
cssConstructor: cssConstructor, css: css
114+
};

‎css4.js

Lines changed: 82 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,82 @@
1+
'use strict';
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
7+
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
8+
9+
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
10+
11+
var _react = require('react');
12+
13+
var _react2 = _interopRequireDefault(_react);
14+
15+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16+
17+
function css(rawCSS) {
18+
var rules = rawCSS[0].trim().split('\n');
19+
20+
return function (target, name, descriptor) {
21+
return _extends({}, descriptor, {
22+
value: function value() {
23+
var style = parseCss(rawCSS);
24+
var props = void 0;
25+
function giveMeProps(object) {
26+
props = object.props;
27+
return object;
28+
}
29+
var rendered = descriptor.value.apply(giveMeProps(this), arguments);
30+
var newProps = _extends({}, props, { style: style });
31+
32+
return _react2.default.cloneElement(rendered, newProps, rendered.props.children);
33+
}
34+
});
35+
};
36+
}
37+
38+
var camelCase = function camelCase(key) {
39+
return key.replace(/(\-[a-z])/g, function ($1) {
40+
return $1.toUpperCase().replace('-', '');
41+
});
42+
};
43+
44+
var parseCss = function parseCss(rawCSS) {
45+
var styles = {};
46+
var rules = rawCSS[0].trim().split('\n');
47+
var _iteratorNormalCompletion = true;
48+
var _didIteratorError = false;
49+
var _iteratorError = undefined;
50+
51+
try {
52+
for (var _iterator = rules[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
53+
var rule = _step.value;
54+
55+
var _rule$trim$replace$sp = rule.trim().replace(';', '').split(':'),
56+
_rule$trim$replace$sp2 = _slicedToArray(_rule$trim$replace$sp, 2),
57+
key = _rule$trim$replace$sp2[0],
58+
value = _rule$trim$replace$sp2[1];
59+
60+
key = camelCase(key.trim());
61+
value = value.trim();
62+
styles[key] = value;
63+
}
64+
} catch (err) {
65+
_didIteratorError = true;
66+
_iteratorError = err;
67+
} finally {
68+
try {
69+
if (!_iteratorNormalCompletion && _iterator.return) {
70+
_iterator.return();
71+
}
72+
} finally {
73+
if (_didIteratorError) {
74+
throw _iteratorError;
75+
}
76+
}
77+
}
78+
79+
return styles;
80+
};
81+
82+
exports.default = css;

0 commit comments

Comments
 (0)