Skip to content

Commit 6a4d76c

Browse files
twharmontwharmon
committed
Remove unneeded Button component
1 parent f6e1134 commit 6a4d76c

File tree

9 files changed

+88
-107
lines changed

9 files changed

+88
-107
lines changed

‎frameworks/keyed/rendrjs/index.html

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,9 +9,6 @@
99
<script type="module" crossorigin src="dist/main.js"></script>
1010
</head>
1111

12-
<body>
13-
<div id="root"></div>
14-
15-
</body>
12+
<body></body>
1613

1714
</html>

‎frameworks/keyed/rendrjs/package-lock.json

Lines changed: 4 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎frameworks/keyed/rendrjs/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
"webpack-cli": "5.1.4"
1111
},
1212
"dependencies": {
13-
"@rendrjs/core": "0.1.244"
13+
"@rendrjs/core": "0.1.247"
1414
},
1515
"js-framework-benchmark": {
1616
"frameworkVersionFromPackage": "@rendrjs/core",

‎frameworks/keyed/rendrjs/src/App.js

Lines changed: 4 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -3,65 +3,21 @@ import { Jumbotron } from './Jumbotron';
33
import { Row } from './Row';
44
import { makeIcon } from './RemoveIcon';
55

6-
let random = (max) => Math.round(Math.random() * 1000) % max;
7-
8-
let A = ['pretty', 'large', 'big', 'small', 'tall', 'short', 'long', 'handsome',
9-
'plain', 'quaint', 'clean', 'elegant', 'easy', 'angry', 'crazy', 'helpful', 'mushy',
10-
'odd', 'unsightly', 'adorable', 'important', 'inexpensive', 'cheap', 'expensive',
11-
'fancy'];
12-
let C = ['red', 'yellow', 'blue', 'green', 'pink', 'brown', 'purple', 'brown',
13-
'white', 'black', 'orange'];
14-
let N = ['table', 'chair', 'house', 'bbq', 'desk', 'car', 'pony', 'cookie',
15-
'sandwich', 'burger', 'pizza', 'mouse', 'keyboard'];
16-
17-
let nextId = 1;
18-
19-
let buildData = (count) => {
20-
let data = new Array(count);
21-
22-
for (let i = 0; i < count; i++) {
23-
data[i] = {
24-
id: nextId++,
25-
label: `${A[random(A.length)]} ${C[random(C.length)]} ${N[random(N.length)]}`,
26-
};
27-
}
28-
29-
return data;
30-
};
31-
326
let preloadIcon = makeIcon(true);
337

348
export let App = () => {
35-
let [state, setState] = useState({ arr: [], sel: 0 });
9+
let [state, setState] = useState({ arr: [] });
3610

37-
let run = () => setState({ arr: buildData(1000), sel: 0 });
38-
let lots = () => setState({ arr: buildData(10000), sel: 0 });
39-
let clear = () => setState({ arr: [], sel: 0 });
40-
let update = () => setState(old => {
41-
for (let i = 0; i < old.arr.length; i += 10) {
42-
old.arr[i].label += ' !!!';
43-
}
44-
return { ...old };
45-
});
46-
let swap = () => setState(old => {
47-
if (old.arr.length > 998) {
48-
let one = old.arr[1];
49-
old.arr[1] = old.arr[998];
50-
old.arr[998] = one;
51-
}
52-
return { ...old, sel: 0 };
53-
});
54-
let push = () => setState(old => ({ arr: old.arr.concat(buildData(1000)), sel: old.sel }));
55-
let del = (id) => setState(old => {
56-
old.arr.splice(old.arr.findIndex((d) => d.id === id), 1);
11+
let del = id => setState(old => {
12+
old.arr.splice(old.arr.findIndex(d => d.id === id), 1);
5713
return { ...old };
5814
});
5915
let sel = id => setState(old => ({ ...old, sel: id }));
6016

6117
return div({
6218
class: 'container',
6319
slot: [
64-
rendr(Jumbotron, { run, lots, clear, update, swap, push, memo: [] }),
20+
rendr(Jumbotron, { set: setState, memo: [] }),
6521
table({
6622
class: 'table table-hover table-striped test-data',
6723
slot: tbody({

‎frameworks/keyed/rendrjs/src/Button.js

Lines changed: 0 additions & 14 deletions
This file was deleted.

‎frameworks/keyed/rendrjs/src/Jumbotron.js

Lines changed: 71 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,75 @@
1-
import { div, h1, rendr } from '@rendrjs/core';
2-
import { Button } from './Button';
1+
import { div, h1, button } from '@rendrjs/core';
32

4-
let header = div({
5-
class: 'col-md-6',
6-
slot: h1({ slot: 'Rendrjs keyed' }),
3+
let A = ['pretty', 'large', 'big', 'small', 'tall', 'short', 'long', 'handsome',
4+
'plain', 'quaint', 'clean', 'elegant', 'easy', 'angry', 'crazy', 'helpful', 'mushy',
5+
'odd', 'unsightly', 'adorable', 'important', 'inexpensive', 'cheap', 'expensive',
6+
'fancy'];
7+
let C = ['red', 'yellow', 'blue', 'green', 'pink', 'brown', 'purple', 'brown',
8+
'white', 'black', 'orange'];
9+
let N = ['table', 'chair', 'house', 'bbq', 'desk', 'car', 'pony', 'cookie',
10+
'sandwich', 'burger', 'pizza', 'mouse', 'keyboard'];
11+
12+
let rand = arr => arr[Math.round(Math.random() * 1000) % arr.length];
13+
14+
let nextId = 1;
15+
16+
let buildData = (count = 1000) => {
17+
let data = new Array(count);
18+
for (let i = 0; i < count; i++) {
19+
data[i] = {
20+
id: nextId++,
21+
label: `${rand(A)} ${rand(C)} ${rand(N)}`,
22+
};
23+
}
24+
return data;
25+
};
26+
27+
let btn = (id, slot, onclick) => div({
28+
class: 'col-sm-6 smallpad',
29+
slot: button({
30+
id,
31+
onclick,
32+
type: 'button',
33+
class: 'btn btn-primary btn-block',
34+
slot,
35+
}),
736
});
837

9-
export let Jumbotron = (props) => {
10-
return div({
11-
class: 'jumbotron',
12-
slot: div({
13-
class: 'row',
14-
slot: [
15-
header,
16-
div({
17-
class: 'col-md-6',
18-
slot: div({
19-
class: 'row',
20-
slot: [
21-
rendr(Button, { id: 'run', text: 'Create 1,000 rows', cb: props.run }),
22-
rendr(Button, { id: 'runlots', text: 'Create 10,000 rows', cb: props.lots }),
23-
rendr(Button, { id: 'add', text: 'Append 1,000 rows', cb: props.push }),
24-
rendr(Button, { id: 'update', text: 'Update every 10th row', cb: props.update }),
25-
rendr(Button, { id: 'clear', text: 'Clear', cb: props.clear }),
26-
rendr(Button, { id: 'swaprows', text: 'Swap rows', cb: props.swap }),
27-
],
28-
}),
38+
export let Jumbotron = ({ set }) => div({
39+
class: 'jumbotron',
40+
slot: div({
41+
class: 'row',
42+
slot: [
43+
div({
44+
class: 'col-md-6',
45+
slot: h1('Rendrjs'),
46+
}),
47+
div({
48+
class: 'col-md-6',
49+
slot: div({
50+
class: 'row',
51+
slot: [
52+
btn('run', 'Create 1,000 rows', () => set({ arr: buildData() })),
53+
btn('runlots', 'Create 10,000 rows', () => set({ arr: buildData(10000) })),
54+
btn('add', 'Append 1,000 rows', () => set(old => ({ ...old, arr: old.arr.concat(buildData()) }))),
55+
btn('update', 'Update every 10th row', () => set(old => {
56+
for (let i = 0; i < old.arr.length; i += 10) {
57+
old.arr[i].label += ' !!!';
58+
}
59+
return { ...old };
60+
})),
61+
btn('clear', 'Clear', () => set({ arr: [] })),
62+
btn('swaprows', 'Swap rows', () => set(old => {
63+
let two = old.arr[998];
64+
if (two) {
65+
old.arr[998] = old.arr[1];
66+
old.arr[1] = two;
67+
}
68+
return { ...old };
69+
})),
70+
],
2971
}),
30-
],
31-
}),
32-
});
33-
};
72+
}),
73+
],
74+
}),
75+
});

‎frameworks/keyed/rendrjs/src/RemoveIcon.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { span } from '@rendrjs/core';
22

33
export let makeIcon = preload => span({
4-
class: `${preload ? 'preloadicon ' : ''}glyphicon glyphicon-remove`,
4+
class: preload ? 'preloadicon ' : '' + 'glyphicon glyphicon-remove',
55
ariaHidden: true,
66
});

‎frameworks/keyed/rendrjs/src/Row.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,22 +4,22 @@ import { makeIcon } from './RemoveIcon';
44
let icon = makeIcon();
55
let emptyTd = td({ class: 'col-md-6' });
66

7-
export let Row = ({ hi, sel, item, del }) => {
7+
export let Row = ({ hi, sel, item: { id, label }, del }) => {
88
return tr({
99
class: hi ? 'danger' : undefined,
1010
slot: [
11-
td({ class: 'col-md-1', slot: `${item.id}` }),
11+
td({ class: 'col-md-1', slot: `${id}` }),
1212
td({
1313
class: 'col-md-4',
1414
slot: a({
15-
onclick: () => sel(item.id),
16-
slot: item.label,
15+
onclick: () => sel(id),
16+
slot: label,
1717
}),
1818
}),
1919
td({
2020
class: 'col-md-1',
2121
slot: a({
22-
onclick: () => del(item.id),
22+
onclick: () => del(id),
2323
slot: icon,
2424
}),
2525
}),

‎frameworks/keyed/rendrjs/src/main.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
import { mount } from '@rendrjs/core';
22
import { App } from './App';
33

4-
mount(document.querySelector('#root'), App);
4+
mount(document.body, App);

0 commit comments

Comments
 (0)