@fusion.dev/helix-templates 0.184.0 → 0.186.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +1 -1
- package/templates/angular/src/app/overview.html +12 -10
- package/templates/react-nextjs/app/overview.tsx +13 -10
- package/templates/react-vite/src/overview.tsx +13 -10
- package/templates/solid-vite/src/overview.tsx +12 -10
- package/templates/svelte-vite/src/Overview.svelte +12 -10
- package/templates/vue-vite/src/OverviewPage.vue +12 -10
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fusion.dev/helix-templates",
|
|
3
3
|
"description": "Starter templates for Helix, as data. Read by `helix new` and by `npm create @fusion.dev/helix-app`.",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.186.0",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"author": "Ross Sheppard <ross.sheppard@fusion.dev>",
|
|
7
7
|
"repository": {
|
|
@@ -9,6 +9,7 @@
|
|
|
9
9
|
|
|
10
10
|
<section class="section">
|
|
11
11
|
<helix-data-table
|
|
12
|
+
columns="minmax(5.5rem, 1.6fr) minmax(4.5rem, 1fr) minmax(4.5rem, 1fr) max-content"
|
|
12
13
|
default-sort="name:asc"
|
|
13
14
|
label="Roster"
|
|
14
15
|
page-size="6"
|
|
@@ -16,20 +17,21 @@
|
|
|
16
17
|
[rows]="members"
|
|
17
18
|
selectable
|
|
18
19
|
>
|
|
19
|
-
<!--
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
20
|
+
<!-- **`columns` says what each column may give up**, a track to a column:
|
|
21
|
+
a floor, which is what the words need, and a share of the slack. The
|
|
22
|
+
numerals take `max-content`, their one right width. At 390 the four
|
|
23
|
+
columns and the checkboxes fit the box, and below 376 the table
|
|
24
|
+
scrolls its own box. On the table, so a page rendered on a server is
|
|
25
|
+
laid out at these widths before the script runs. -->
|
|
26
|
+
<helix-table-column field="name" sortable>
|
|
24
27
|
Name
|
|
25
28
|
</helix-table-column>
|
|
26
|
-
<helix-table-column field="team" sortable
|
|
29
|
+
<helix-table-column field="team" sortable>
|
|
27
30
|
Team
|
|
28
31
|
</helix-table-column>
|
|
29
|
-
<helix-table-column field="role"
|
|
30
|
-
<!-- `end` lines the digits up under each other.
|
|
31
|
-
|
|
32
|
-
<helix-table-column field="reviews" sortable text-align="end" width="max-content">
|
|
32
|
+
<helix-table-column field="role">Role</helix-table-column>
|
|
33
|
+
<!-- `end` lines the digits up under each other. -->
|
|
34
|
+
<helix-table-column field="reviews" sortable text-align="end">
|
|
33
35
|
Reviews
|
|
34
36
|
</helix-table-column>
|
|
35
37
|
|
|
@@ -37,6 +37,7 @@ export function Overview() {
|
|
|
37
37
|
|
|
38
38
|
<section className="section">
|
|
39
39
|
<helix-data-table
|
|
40
|
+
columns="minmax(5.5rem, 1.6fr) minmax(4.5rem, 1fr) minmax(4.5rem, 1fr) max-content"
|
|
40
41
|
default-sort="name:asc"
|
|
41
42
|
label="Roster"
|
|
42
43
|
page-size={6}
|
|
@@ -44,31 +45,33 @@ export function Overview() {
|
|
|
44
45
|
rows={members}
|
|
45
46
|
selectable
|
|
46
47
|
>
|
|
47
|
-
{/*
|
|
48
|
-
the narrow-window story
|
|
48
|
+
{/* **`columns` says what each column may give up, which is the whole
|
|
49
|
+
of the narrow-window story**, one track to a column in the order
|
|
50
|
+
they are written. A column left to itself takes
|
|
49
51
|
`minmax(max-content, 1fr)`, which never goes below its longest
|
|
50
52
|
cell, so the last column is pushed outside the box and you have to
|
|
51
|
-
scroll the table sideways to read a value. Each
|
|
53
|
+
scroll the table sideways to read a value. Each track here has a
|
|
52
54
|
floor and a share: the floor is what the words need, and the share
|
|
53
55
|
is how the spare width is divided. Measured September 16, 2026: at
|
|
54
56
|
390 the four columns and the checkboxes come to 358 in a box of
|
|
55
57
|
358, so nothing is cut and nothing wraps. The floors alone come to
|
|
56
58
|
344, so at a 376 pixel window they exactly fit, and below it the
|
|
57
59
|
table scrolls its own box and fades whichever edge has more behind
|
|
58
|
-
it.
|
|
59
|
-
|
|
60
|
+
it. The last is `max-content`, since a column of numerals has one
|
|
61
|
+
right width. On the table, so a page rendered on a server is laid
|
|
62
|
+
out at these widths before the script runs. */}
|
|
63
|
+
<helix-table-column field="name" sortable>
|
|
60
64
|
Name
|
|
61
65
|
</helix-table-column>
|
|
62
|
-
<helix-table-column field="team" sortable
|
|
66
|
+
<helix-table-column field="team" sortable>
|
|
63
67
|
Team
|
|
64
68
|
</helix-table-column>
|
|
65
|
-
<helix-table-column field="role"
|
|
69
|
+
<helix-table-column field="role">
|
|
66
70
|
Role
|
|
67
71
|
</helix-table-column>
|
|
68
72
|
{/* `end` lines the digits up under each other, which is what makes a
|
|
69
|
-
number column different from a text one.
|
|
70
|
-
|
|
71
|
-
<helix-table-column field="reviews" sortable text-align="end" width="max-content">
|
|
73
|
+
number column different from a text one. */}
|
|
74
|
+
<helix-table-column field="reviews" sortable text-align="end">
|
|
72
75
|
Reviews
|
|
73
76
|
</helix-table-column>
|
|
74
77
|
|
|
@@ -37,6 +37,7 @@ export function Overview() {
|
|
|
37
37
|
|
|
38
38
|
<section className="section">
|
|
39
39
|
<helix-data-table
|
|
40
|
+
columns="minmax(5.5rem, 1.6fr) minmax(4.5rem, 1fr) minmax(4.5rem, 1fr) max-content"
|
|
40
41
|
default-sort="name:asc"
|
|
41
42
|
label="Roster"
|
|
42
43
|
page-size={6}
|
|
@@ -44,31 +45,33 @@ export function Overview() {
|
|
|
44
45
|
rows={members}
|
|
45
46
|
selectable
|
|
46
47
|
>
|
|
47
|
-
{/*
|
|
48
|
-
the narrow-window story
|
|
48
|
+
{/* **`columns` says what each column may give up, which is the whole
|
|
49
|
+
of the narrow-window story**, one track to a column in the order
|
|
50
|
+
they are written. A column left to itself takes
|
|
49
51
|
`minmax(max-content, 1fr)`, which never goes below its longest
|
|
50
52
|
cell, so the last column is pushed outside the box and you have to
|
|
51
|
-
scroll the table sideways to read a value. Each
|
|
53
|
+
scroll the table sideways to read a value. Each track here has a
|
|
52
54
|
floor and a share: the floor is what the words need, and the share
|
|
53
55
|
is how the spare width is divided. Measured September 16, 2026: at
|
|
54
56
|
390 the four columns and the checkboxes come to 358 in a box of
|
|
55
57
|
358, so nothing is cut and nothing wraps. The floors alone come to
|
|
56
58
|
344, so at a 376 pixel window they exactly fit, and below it the
|
|
57
59
|
table scrolls its own box and fades whichever edge has more behind
|
|
58
|
-
it.
|
|
59
|
-
|
|
60
|
+
it. The last is `max-content`, since a column of numerals has one
|
|
61
|
+
right width. On the table, so a page rendered on a server is laid
|
|
62
|
+
out at these widths before the script runs. */}
|
|
63
|
+
<helix-table-column field="name" sortable>
|
|
60
64
|
Name
|
|
61
65
|
</helix-table-column>
|
|
62
|
-
<helix-table-column field="team" sortable
|
|
66
|
+
<helix-table-column field="team" sortable>
|
|
63
67
|
Team
|
|
64
68
|
</helix-table-column>
|
|
65
|
-
<helix-table-column field="role"
|
|
69
|
+
<helix-table-column field="role">
|
|
66
70
|
Role
|
|
67
71
|
</helix-table-column>
|
|
68
72
|
{/* `end` lines the digits up under each other, which is what makes a
|
|
69
|
-
number column different from a text one.
|
|
70
|
-
|
|
71
|
-
<helix-table-column field="reviews" sortable text-align="end" width="max-content">
|
|
73
|
+
number column different from a text one. */}
|
|
74
|
+
<helix-table-column field="reviews" sortable text-align="end">
|
|
72
75
|
Reviews
|
|
73
76
|
</helix-table-column>
|
|
74
77
|
|
|
@@ -36,6 +36,7 @@ export function Overview() {
|
|
|
36
36
|
|
|
37
37
|
<section class="section">
|
|
38
38
|
<helix-data-table
|
|
39
|
+
columns="minmax(5.5rem, 1.6fr) minmax(4.5rem, 1fr) minmax(4.5rem, 1fr) max-content"
|
|
39
40
|
default-sort="name:asc"
|
|
40
41
|
label="Roster"
|
|
41
42
|
page-size={6}
|
|
@@ -43,22 +44,23 @@ export function Overview() {
|
|
|
43
44
|
rows={members}
|
|
44
45
|
selectable
|
|
45
46
|
>
|
|
46
|
-
{/*
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
box, and below 376 the table
|
|
50
|
-
|
|
47
|
+
{/* **`columns` says what each column may give up**, a track to a column:
|
|
48
|
+
a floor, which is what the words need, and a share of the slack. The
|
|
49
|
+
numerals take `max-content`, their one right width. At 390 the four
|
|
50
|
+
columns and the checkboxes fit the box, and below 376 the table
|
|
51
|
+
scrolls its own box. On the table, so a page rendered on a server is
|
|
52
|
+
laid out at these widths before the script runs. */}
|
|
53
|
+
<helix-table-column field="name" sortable>
|
|
51
54
|
Name
|
|
52
55
|
</helix-table-column>
|
|
53
|
-
<helix-table-column field="team" sortable
|
|
56
|
+
<helix-table-column field="team" sortable>
|
|
54
57
|
Team
|
|
55
58
|
</helix-table-column>
|
|
56
|
-
<helix-table-column field="role"
|
|
59
|
+
<helix-table-column field="role">
|
|
57
60
|
Role
|
|
58
61
|
</helix-table-column>
|
|
59
|
-
{/* `end` lines the digits up under each other.
|
|
60
|
-
|
|
61
|
-
<helix-table-column field="reviews" sortable text-align="end" width="max-content">
|
|
62
|
+
{/* `end` lines the digits up under each other. */}
|
|
63
|
+
<helix-table-column field="reviews" sortable text-align="end">
|
|
62
64
|
Reviews
|
|
63
65
|
</helix-table-column>
|
|
64
66
|
|
|
@@ -26,6 +26,7 @@
|
|
|
26
26
|
|
|
27
27
|
<section class="section">
|
|
28
28
|
<helix-data-table
|
|
29
|
+
columns="minmax(5.5rem, 1.6fr) minmax(4.5rem, 1fr) minmax(4.5rem, 1fr) max-content"
|
|
29
30
|
default-sort="name:asc"
|
|
30
31
|
label="Roster"
|
|
31
32
|
page-size={6}
|
|
@@ -33,20 +34,21 @@
|
|
|
33
34
|
rows={members}
|
|
34
35
|
selectable
|
|
35
36
|
>
|
|
36
|
-
<!--
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
37
|
+
<!-- **`columns` says what each column may give up**, a track to a column:
|
|
38
|
+
a floor, which is what the words need, and a share of the slack. The
|
|
39
|
+
numerals take `max-content`, their one right width. At 390 the four
|
|
40
|
+
columns and the checkboxes fit the box, and below 376 the table
|
|
41
|
+
scrolls its own box. On the table, so a page rendered on a server is
|
|
42
|
+
laid out at these widths before the script runs. -->
|
|
43
|
+
<helix-table-column field="name" sortable>
|
|
41
44
|
Name
|
|
42
45
|
</helix-table-column>
|
|
43
|
-
<helix-table-column field="team" sortable
|
|
46
|
+
<helix-table-column field="team" sortable>
|
|
44
47
|
Team
|
|
45
48
|
</helix-table-column>
|
|
46
|
-
<helix-table-column field="role"
|
|
47
|
-
<!-- `end` lines the digits up under each other.
|
|
48
|
-
|
|
49
|
-
<helix-table-column field="reviews" sortable text-align="end" width="max-content">
|
|
49
|
+
<helix-table-column field="role">Role</helix-table-column>
|
|
50
|
+
<!-- `end` lines the digits up under each other. -->
|
|
51
|
+
<helix-table-column field="reviews" sortable text-align="end">
|
|
50
52
|
Reviews
|
|
51
53
|
</helix-table-column>
|
|
52
54
|
|
|
@@ -27,6 +27,7 @@ import { DOCS } from './docs.ts'
|
|
|
27
27
|
|
|
28
28
|
<section class="section">
|
|
29
29
|
<helix-data-table
|
|
30
|
+
columns="minmax(5.5rem, 1.6fr) minmax(4.5rem, 1fr) minmax(4.5rem, 1fr) max-content"
|
|
30
31
|
default-sort="name:asc"
|
|
31
32
|
label="Roster"
|
|
32
33
|
:page-size="6"
|
|
@@ -34,20 +35,21 @@ import { DOCS } from './docs.ts'
|
|
|
34
35
|
:rows="members"
|
|
35
36
|
selectable
|
|
36
37
|
>
|
|
37
|
-
<!--
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
38
|
+
<!-- **`columns` says what each column may give up**, a track to a column:
|
|
39
|
+
a floor, which is what the words need, and a share of the slack. The
|
|
40
|
+
numerals take `max-content`, their one right width. At 390 the four
|
|
41
|
+
columns and the checkboxes fit the box, and below 376 the table
|
|
42
|
+
scrolls its own box. On the table, so a page rendered on a server is
|
|
43
|
+
laid out at these widths before the script runs. -->
|
|
44
|
+
<helix-table-column field="name" sortable>
|
|
42
45
|
Name
|
|
43
46
|
</helix-table-column>
|
|
44
|
-
<helix-table-column field="team" sortable
|
|
47
|
+
<helix-table-column field="team" sortable>
|
|
45
48
|
Team
|
|
46
49
|
</helix-table-column>
|
|
47
|
-
<helix-table-column field="role"
|
|
48
|
-
<!-- `end` lines the digits up under each other.
|
|
49
|
-
|
|
50
|
-
<helix-table-column field="reviews" sortable text-align="end" width="max-content">
|
|
50
|
+
<helix-table-column field="role">Role</helix-table-column>
|
|
51
|
+
<!-- `end` lines the digits up under each other. -->
|
|
52
|
+
<helix-table-column field="reviews" sortable text-align="end">
|
|
51
53
|
Reviews
|
|
52
54
|
</helix-table-column>
|
|
53
55
|
|