Skip to content
This repository was archived by the owner on Apr 8, 2019. It is now read-only.

Commit 65e0df0

Browse files
committed
v0.2.0
1 parent 9ec0aea commit 65e0df0

7 files changed

Lines changed: 537 additions & 168 deletions

File tree

lib/__tests__/integration-tests/kitchen-sink-test.js

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -63,4 +63,66 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
6363
null,
6464
"Column C"
6565
)
66+
));
67+
68+
(0, _testRender2.default)("Columns, rows, section styles should all work together", _react2.default.createElement(
69+
"div",
70+
{ align: "center", border: { horizontal: "#", vertical: "#" } },
71+
"Some App",
72+
_react2.default.createElement("br", null),
73+
_react2.default.createElement(
74+
"div",
75+
{ horizontal: true },
76+
_react2.default.createElement(
77+
"div",
78+
{ align: "center", border: { horizontal: "*", vertical: "*" } },
79+
"\u2714\uFE0E Step 1",
80+
_react2.default.createElement("br", null),
81+
"\u25EF Step 2",
82+
_react2.default.createElement("br", null),
83+
"\u25EF Step 3"
84+
),
85+
_react2.default.createElement(
86+
"div",
87+
{ border: { horizontal: "-", vertical: "|" } },
88+
"Some messages for this app"
89+
)
90+
),
91+
_react2.default.createElement(
92+
"div",
93+
{ align: "center" },
94+
"Some stuff for this app is done! \uD83E\uDD18",
95+
_react2.default.createElement("br", null),
96+
"Heres some more informative stuff about your app",
97+
_react2.default.createElement("br", null),
98+
"browser",
99+
_react2.default.createElement("br", null),
100+
"\u2199\u2197 \u2196\u2198",
101+
_react2.default.createElement(
102+
"div",
103+
{ horizontal: true },
104+
_react2.default.createElement(
105+
"div",
106+
{ align: "center", border: { horizontal: "-", vertical: "|" } },
107+
"server",
108+
_react2.default.createElement("br", null),
109+
"(initial response)",
110+
_react2.default.createElement("br", null),
111+
"localhost:3000"
112+
),
113+
_react2.default.createElement(
114+
"div",
115+
{ align: "center", border: { horizontal: "-", vertical: "|" } },
116+
"dev-server",
117+
_react2.default.createElement("br", null),
118+
"(app bundle)",
119+
_react2.default.createElement("br", null),
120+
"localhost:8080",
121+
_react2.default.createElement("br", null),
122+
"websocket server (for HMR)",
123+
_react2.default.createElement("br", null),
124+
"localhost:8081"
125+
)
126+
)
127+
)
66128
));

lib/__tests__/section-test.js

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,4 +71,53 @@ test("sections should be able to align text center", function (done) {
7171
expect(outputString).toMatchSnapshot();
7272
done();
7373
}, "+");
74+
});
75+
76+
test("sections should be able to render a border", function (done) {
77+
_index2.default.render(React.createElement(
78+
"div",
79+
null,
80+
React.createElement(
81+
"div",
82+
{
83+
align: "center",
84+
border: {
85+
horizontal: "-",
86+
vertical: "|",
87+
cornerTopLeft: "*",
88+
cornerTopRight: "*",
89+
cornerBottomLeft: "*",
90+
cornerBottomRight: "*"
91+
}
92+
},
93+
"Test section with border"
94+
)
95+
), undefined, 50, function (outputString) {
96+
expect(outputString).toMatchSnapshot();
97+
done();
98+
}, "+");
99+
100+
_index2.default.render(React.createElement(
101+
"div",
102+
{ horizontal: true, border: { horizontal: "*", vertical: "*" } },
103+
"Some Text",
104+
React.createElement(
105+
"div",
106+
{
107+
align: "center",
108+
border: {
109+
horizontal: "-",
110+
vertical: "|",
111+
cornerTopLeft: "*",
112+
cornerTopRight: "*",
113+
cornerBottomLeft: "*",
114+
cornerBottomRight: "*"
115+
}
116+
},
117+
"Test section with border"
118+
)
119+
), undefined, 50, function (outputString) {
120+
expect(outputString).toMatchSnapshot();
121+
done();
122+
}, "+");
74123
});

lib/components.js

Lines changed: 98 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,98 @@
1+
"use strict";
2+
3+
Object.defineProperty(exports, "__esModule", {
4+
value: true
5+
});
6+
exports.Break = exports.Text = exports.Section = undefined;
7+
8+
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); // strict
9+
10+
var _wrapAnsi = require("wrap-ansi");
11+
12+
var _wrapAnsi2 = _interopRequireDefault(_wrapAnsi);
13+
14+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15+
16+
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
17+
18+
// this module is helpful for dealing with ansi characters, but it returns a
19+
// string with embedded new lines. We need it as an array, so we'll split it here
20+
var wrapAnsi = function wrapAnsi(input, columns) {
21+
return (0, _wrapAnsi2.default)(input, columns).split("\n");
22+
};
23+
24+
var Border = function () {
25+
function Border(_ref) {
26+
var vertical = _ref.vertical,
27+
horizontal = _ref.horizontal,
28+
cornerTopLeft = _ref.cornerTopLeft,
29+
cornerTopRight = _ref.cornerTopRight,
30+
cornerBottomLeft = _ref.cornerBottomLeft,
31+
cornerBottomRight = _ref.cornerBottomRight;
32+
33+
_classCallCheck(this, Border);
34+
35+
this.vertical = vertical;
36+
this.horizontal = horizontal;
37+
this.cornerTopLeft = cornerTopLeft;
38+
this.cornerTopRight = cornerTopRight;
39+
this.cornerBottomLeft = cornerBottomLeft;
40+
this.cornerBottomRight = cornerBottomRight;
41+
}
42+
43+
_createClass(Border, [{
44+
key: "horizontalWidth",
45+
value: function horizontalWidth() {
46+
return Math.max(this.vertical ? this.vertical.length : 0, this.cornerTopLeft ? this.cornerTopLeft.length : 0, this.cornerBottomLeft ? this.cornerBottomLeft.length : 0) + Math.max(this.vertical ? this.vertical.length : 0, this.cornerTopRight ? this.cornerTopRight.length : 0, this.cornerBottomRight ? this.cornerBottomRight.length : 0);
47+
}
48+
}, {
49+
key: "verticalHeight",
50+
value: function verticalHeight() {
51+
return Math.max(this.horizontal ? this.horizontal.length : 0, this.cornerTopLeft ? this.cornerTopLeft.length : 0, this.cornerTopRight ? this.cornerTopRight.length : 0) + Math.max(this.horizontal ? this.horizontal.length : 0, this.cornerBottomLeft ? this.cornerBottomLeft.length : 0, this.cornerBottomRight ? this.cornerBottomRight.length : 0);
52+
}
53+
}]);
54+
55+
return Border;
56+
}();
57+
58+
var Section = exports.Section = function () {
59+
function Section(_ref2) {
60+
var _ref2$useHorizontalOr = _ref2.useHorizontalOrientation,
61+
useHorizontalOrientation = _ref2$useHorizontalOr === undefined ? false : _ref2$useHorizontalOr,
62+
_ref2$align = _ref2.align,
63+
align = _ref2$align === undefined ? "left" : _ref2$align,
64+
_ref2$border = _ref2.border,
65+
border = _ref2$border === undefined ? {} : _ref2$border;
66+
67+
_classCallCheck(this, Section);
68+
69+
this.children = [];
70+
71+
this.orientation = useHorizontalOrientation ? "horizontal" : "vertical";
72+
this.align = align;
73+
this.border = new Border(border);
74+
}
75+
76+
_createClass(Section, [{
77+
key: "convertTextToArray",
78+
value: function convertTextToArray(text, totalWidth) {
79+
return wrapAnsi(text.text, totalWidth - this.border.horizontalWidth());
80+
}
81+
}]);
82+
83+
return Section;
84+
}();
85+
86+
Section.type = "div";
87+
88+
var Text = exports.Text = function Text(text) {
89+
_classCallCheck(this, Text);
90+
91+
this.text = text;
92+
};
93+
94+
var Break = exports.Break = function Break() {
95+
_classCallCheck(this, Break);
96+
};
97+
98+
Break.type = "br";

0 commit comments

Comments
 (0)