Skip to content

Commit d102ca5

Browse files
committed
Update hyperapp (syntax) to 2.0.8
1 parent 52f4a2e commit d102ca5

File tree

2 files changed

+41
-93
lines changed

2 files changed

+41
-93
lines changed

frameworks/keyed/hyperapp/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
"frameworkVersionFromPackage": "hyperapp"
88
},
99
"dependencies": {
10-
"hyperapp": "2.0.4"
10+
"hyperapp": "2.0.8"
1111
},
1212
"devDependencies": {
1313
"@rollup/plugin-node-resolve": "^7.1.3",
Lines changed: 40 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { h, Lazy, app } from "hyperapp"
1+
import { h, memo, text, app } from "hyperapp"
22
import { buildData } from "./store"
33

44
const updateRow = (id, label) => ({
@@ -50,162 +50,110 @@ const swapRows = (state) => {
5050
}
5151

5252
const Row = ({ data, label, styleClass }) =>
53-
h(
54-
"tr",
55-
{ key: data.id, class: styleClass },
56-
h("td", { class: "col-md-1" }, data.id),
57-
h(
58-
"td",
59-
{ class: "col-md-4" },
60-
h("a", { onclick: [selectRow, data.id] }, label)
53+
h("tr", { key: data.id, class: styleClass }, [
54+
h("td", { class: "col-md-1" }, text(data.id)),
55+
h("td", { class: "col-md-4" },
56+
h("a", { onclick: [ selectRow, data.id ] }, text(label)),
6157
),
62-
h(
63-
"td",
64-
{ class: "col-md-1" },
65-
h(
66-
"a",
67-
{ onclick: [deleteRow, data.id] },
58+
h("td", { class: "col-md-1" },
59+
h("a", { onclick: [ deleteRow, data.id ] },
6860
h("span", {
6961
class: "glyphicon glyphicon-remove",
7062
"aria-hidden": "true",
7163
})
72-
)
64+
),
7365
),
74-
h("td", { class: "col-md-6" })
75-
)
76-
77-
const LazyRow = ({ data, label, styleClass }) =>
78-
Lazy({ view: Row, data, label, styleClass })
66+
h("td", { class: "col-md-6" }),
67+
])
7968

8069
app({
8170
init: {
8271
data: [],
8372
selected: false,
8473
},
8574
view: (state) =>
86-
h(
87-
"div",
88-
{ class: "container" },
89-
h(
90-
"div",
91-
{ class: "jumbotron" },
92-
h(
93-
"div",
94-
{ class: "row" },
95-
h("div", { class: "col-md-6" }, h("h1", null, "Hyperapp")),
96-
h(
97-
"div",
98-
{ class: "col-md-6" },
99-
h(
100-
"div",
101-
{ class: "row" },
102-
h(
103-
"div",
104-
{ class: "col-sm-6 smallpad" },
105-
h(
106-
"button",
107-
{
75+
h("div", { class: "container" }, [
76+
h("div", { class: "jumbotron" },
77+
h("div", { class: "row" }, [
78+
h("div", { class: "col-md-6" }, h("h1", {}, text("Hyperapp"))),
79+
h("div", { class: "col-md-6" },
80+
h("div", { class: "row" }, [
81+
h("div", { class: "col-sm-6 smallpad" },
82+
h("button", {
10883
type: "button",
10984
class: "btn btn-primary btn-block",
11085
id: "run",
11186
onclick: create1K,
11287
},
113-
"Create 1,000 rows"
88+
text("Create 1,000 rows")
11489
)
11590
),
116-
h(
117-
"div",
118-
{ class: "col-sm-6 smallpad" },
119-
h(
120-
"button",
121-
{
91+
h("div", { class: "col-sm-6 smallpad" },
92+
h("button", {
12293
type: "button",
12394
class: "btn btn-primary btn-block",
12495
id: "runlots",
12596
onclick: create10K,
12697
},
127-
"Create 10,000 rows"
98+
text("Create 10,000 rows")
12899
)
129100
),
130-
h(
131-
"div",
132-
{ class: "col-sm-6 smallpad" },
133-
h(
134-
"button",
135-
{
101+
h("div", { class: "col-sm-6 smallpad" },
102+
h("button", {
136103
type: "button",
137104
class: "btn btn-primary btn-block",
138105
id: "add",
139106
onclick: append1K,
140107
},
141-
"Append 1,000 rows"
108+
text("Append 1,000 rows")
142109
)
143110
),
144-
h(
145-
"div",
146-
{ class: "col-sm-6 smallpad" },
147-
h(
148-
"button",
149-
{
111+
h("div", { class: "col-sm-6 smallpad" },
112+
h("button", {
150113
type: "button",
151114
class: "btn btn-primary btn-block",
152115
id: "update",
153116
onclick: updateEveryTenth,
154117
},
155-
"Update every 10th row"
118+
text("Update every 10th row")
156119
)
157120
),
158-
h(
159-
"div",
160-
{ class: "col-sm-6 smallpad" },
161-
h(
162-
"button",
163-
{
121+
h("div", { class: "col-sm-6 smallpad" },
122+
h("button", {
164123
type: "button",
165124
class: "btn btn-primary btn-block",
166125
id: "clear",
167126
onclick: clearAllRows,
168127
},
169-
"Clear"
128+
text("Clear")
170129
)
171130
),
172-
h(
173-
"div",
174-
{ class: "col-sm-6 smallpad" },
175-
h(
176-
"button",
177-
{
131+
h("div", { class: "col-sm-6 smallpad" },
132+
h("button", {
178133
type: "button",
179134
class: "btn btn-primary btn-block",
180135
id: "swaprows",
181136
onclick: swapRows,
182137
},
183-
"Swap Rows"
138+
text("Swap Rows")
184139
)
185140
)
186-
)
187-
)
141+
])
142+
)]
188143
)
189144
),
190-
h(
191-
"table",
192-
{ class: "table table-hover table-striped test-data" },
193-
h(
194-
"tbody",
195-
null,
196-
state.data.map((data) =>
197-
LazyRow({
145+
h("table", { class: "table table-hover table-striped test-data" },
146+
h("tbody", {}, state.data.map((data) => memo(Row, {
198147
data,
199148
label: data.label,
200149
styleClass: data.id === state.selected ? "danger" : "",
201-
})
202-
)
150+
}))
203151
)
204152
),
205153
h("span", {
206154
class: "preloadicon glyphicon glyphicon-remove",
207155
"aria-hidden": "true",
208156
})
209-
),
157+
]),
210158
node: document.getElementById("app"),
211159
})

0 commit comments

Comments
 (0)