@screenbook/ui 1.1.0 → 1.1.2
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/README.md +30 -0
- package/dist/client/_astro/coverage.BzPU-EGZ.css +1 -0
- package/dist/server/entry.mjs +1 -1
- package/dist/server/{manifest_smcahUO6.mjs → manifest_BGl49hHW.mjs} +1 -1
- package/dist/server/pages/coverage.astro.mjs +1 -1
- package/dist/server/pages/editor.astro.mjs +1 -1
- package/dist/server/pages/graph.astro.mjs +1 -1
- package/dist/server/pages/impact.astro.mjs +1 -1
- package/dist/server/pages/index.astro.mjs +1 -1
- package/dist/server/pages/screen/_id_.astro.mjs +1 -1
- package/package.json +5 -1
- package/.astro/content-assets.mjs +0 -1
- package/.astro/content-modules.mjs +0 -1
- package/.astro/content.d.ts +0 -199
- package/.astro/types.d.ts +0 -2
- package/.prettierrc +0 -15
- package/CHANGELOG.md +0 -77
- package/astro.config.mjs +0 -20
- package/dist/client/_astro/coverage.DLKSOM4m.css +0 -1
- package/public/logo.svg +0 -5
- package/src/components/MockFormEditor.tsx +0 -1280
- package/src/components/MockPreview.astro +0 -811
- package/src/layouts/Layout.astro +0 -77
- package/src/pages/api/save-mock.ts +0 -182
- package/src/pages/coverage.astro +0 -399
- package/src/pages/editor.astro +0 -33
- package/src/pages/graph.astro +0 -368
- package/src/pages/impact.astro +0 -462
- package/src/pages/index.astro +0 -176
- package/src/pages/screen/[id].astro +0 -195
- package/src/styles/global.css +0 -904
- package/src/styles/mock-editor.css +0 -1351
- package/src/utils/impactAnalysis.ts +0 -304
- package/src/utils/loadCoverage.ts +0 -30
- package/src/utils/loadScreens.ts +0 -18
- package/tsconfig.json +0 -10
- /package/dist/server/chunks/{loadScreens_CkCqdbH2.mjs → loadScreens_B8bVK3q5.mjs} +0 -0
|
@@ -1,195 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
import Layout from "@/layouts/Layout.astro"
|
|
3
|
-
import MockPreview from "@/components/MockPreview.astro"
|
|
4
|
-
import { loadScreens } from "@/utils/loadScreens"
|
|
5
|
-
import { getApiDependencyCount } from "@/utils/impactAnalysis"
|
|
6
|
-
|
|
7
|
-
const screens = loadScreens()
|
|
8
|
-
const apiCounts = getApiDependencyCount(screens)
|
|
9
|
-
|
|
10
|
-
export function getStaticPaths() {
|
|
11
|
-
const screens = loadScreens()
|
|
12
|
-
return screens.map((screen) => ({
|
|
13
|
-
params: { id: screen.id },
|
|
14
|
-
}))
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
const { id } = Astro.params
|
|
18
|
-
const screen = screens.find((s) => s.id === id)
|
|
19
|
-
|
|
20
|
-
if (!screen) {
|
|
21
|
-
return Astro.redirect("/")
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
// Find related screens
|
|
25
|
-
const entryScreens = screens.filter((s) => screen.entryPoints?.includes(s.id))
|
|
26
|
-
const nextScreens = screens.filter((s) => screen.next?.includes(s.id))
|
|
27
|
-
---
|
|
28
|
-
|
|
29
|
-
<Layout title={screen.title}>
|
|
30
|
-
<div class="container">
|
|
31
|
-
<a href="/" class="back-link">
|
|
32
|
-
<svg aria-hidden="true" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
33
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M10.5 19.5L3 12m0 0l7.5-7.5M3 12h18" />
|
|
34
|
-
</svg>
|
|
35
|
-
Back to screens
|
|
36
|
-
</a>
|
|
37
|
-
|
|
38
|
-
<div class="detail-header">
|
|
39
|
-
<h1 class="detail-title">{screen.title}</h1>
|
|
40
|
-
<div class="detail-route">
|
|
41
|
-
<svg aria-hidden="true" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
42
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M13.19 8.688a4.5 4.5 0 011.242 7.244l-4.5 4.5a4.5 4.5 0 01-6.364-6.364l1.757-1.757m13.35-.622l1.757-1.757a4.5 4.5 0 00-6.364-6.364l-4.5 4.5a4.5 4.5 0 001.242 7.244" />
|
|
43
|
-
</svg>
|
|
44
|
-
{screen.route}
|
|
45
|
-
</div>
|
|
46
|
-
</div>
|
|
47
|
-
|
|
48
|
-
<div class="detail-content">
|
|
49
|
-
<div>
|
|
50
|
-
<!-- Information -->
|
|
51
|
-
<div class="section">
|
|
52
|
-
<h2 class="section-title">Information</h2>
|
|
53
|
-
<div class="info-list">
|
|
54
|
-
<div class="info-item">
|
|
55
|
-
<span class="info-label">ID</span>
|
|
56
|
-
<span class="info-value"><code>{screen.id}</code></span>
|
|
57
|
-
</div>
|
|
58
|
-
{screen.owner && screen.owner.length > 0 && (
|
|
59
|
-
<div class="info-item">
|
|
60
|
-
<span class="info-label">Owner</span>
|
|
61
|
-
<span class="info-value">{screen.owner.join(", ")}</span>
|
|
62
|
-
</div>
|
|
63
|
-
)}
|
|
64
|
-
{screen.tags && screen.tags.length > 0 && (
|
|
65
|
-
<div class="info-item">
|
|
66
|
-
<span class="info-label">Tags</span>
|
|
67
|
-
<span class="info-value">
|
|
68
|
-
<div class="card-tags">
|
|
69
|
-
{screen.tags.map((tag) => (
|
|
70
|
-
<span class="card-tag">{tag}</span>
|
|
71
|
-
))}
|
|
72
|
-
</div>
|
|
73
|
-
</span>
|
|
74
|
-
</div>
|
|
75
|
-
)}
|
|
76
|
-
{screen.description && (
|
|
77
|
-
<div class="info-item">
|
|
78
|
-
<span class="info-label">Description</span>
|
|
79
|
-
<span class="info-value">{screen.description}</span>
|
|
80
|
-
</div>
|
|
81
|
-
)}
|
|
82
|
-
</div>
|
|
83
|
-
</div>
|
|
84
|
-
|
|
85
|
-
<!-- Dependencies -->
|
|
86
|
-
{screen.dependsOn && screen.dependsOn.length > 0 && (
|
|
87
|
-
<div class="section">
|
|
88
|
-
<h2 class="section-title">Dependencies</h2>
|
|
89
|
-
<div class="dep-list">
|
|
90
|
-
{screen.dependsOn.map((dep) => {
|
|
91
|
-
const count = apiCounts.get(dep) || 1
|
|
92
|
-
const otherCount = count - 1
|
|
93
|
-
return (
|
|
94
|
-
<a href={`/impact?api=${encodeURIComponent(dep)}`} class="dep-item dep-item-link">
|
|
95
|
-
<div class="dep-item-main">
|
|
96
|
-
<svg aria-hidden="true" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
97
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M17.25 6.75L22.5 12l-5.25 5.25m-10.5 0L1.5 12l5.25-5.25m7.5-3l-4.5 16.5" />
|
|
98
|
-
</svg>
|
|
99
|
-
<span>{dep}</span>
|
|
100
|
-
</div>
|
|
101
|
-
<div class="dep-item-meta">
|
|
102
|
-
{otherCount > 0 && (
|
|
103
|
-
<span class="dep-count">+{otherCount} other{otherCount > 1 ? "s" : ""}</span>
|
|
104
|
-
)}
|
|
105
|
-
<svg class="dep-arrow" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
106
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 13.5l10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75z" />
|
|
107
|
-
</svg>
|
|
108
|
-
</div>
|
|
109
|
-
</a>
|
|
110
|
-
)
|
|
111
|
-
})}
|
|
112
|
-
</div>
|
|
113
|
-
</div>
|
|
114
|
-
)}
|
|
115
|
-
|
|
116
|
-
<!-- External Links -->
|
|
117
|
-
{screen.links && screen.links.length > 0 && (
|
|
118
|
-
<div class="section">
|
|
119
|
-
<h2 class="section-title">Links</h2>
|
|
120
|
-
<div class="dep-list">
|
|
121
|
-
{screen.links.map((link) => (
|
|
122
|
-
<a href={link.url} target="_blank" rel="noopener noreferrer" class="dep-item">
|
|
123
|
-
<svg aria-hidden="true" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
124
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M13.5 6H5.25A2.25 2.25 0 003 8.25v10.5A2.25 2.25 0 005.25 21h10.5A2.25 2.25 0 0018 18.75V10.5m-10.5 6L21 3m0 0h-5.25M21 3v5.25" />
|
|
125
|
-
</svg>
|
|
126
|
-
{link.label}
|
|
127
|
-
</a>
|
|
128
|
-
))}
|
|
129
|
-
</div>
|
|
130
|
-
</div>
|
|
131
|
-
)}
|
|
132
|
-
|
|
133
|
-
<!-- Mock Preview -->
|
|
134
|
-
{screen.mock && (
|
|
135
|
-
<div class="section">
|
|
136
|
-
<h2 class="section-title">UI Wireframe</h2>
|
|
137
|
-
<MockPreview mock={screen.mock} screenId={screen.id} />
|
|
138
|
-
</div>
|
|
139
|
-
)}
|
|
140
|
-
</div>
|
|
141
|
-
|
|
142
|
-
<div>
|
|
143
|
-
<!-- Entry Points -->
|
|
144
|
-
{entryScreens.length > 0 && (
|
|
145
|
-
<div class="sidebar-card">
|
|
146
|
-
<h3 class="sidebar-card-title">
|
|
147
|
-
<svg aria-hidden="true" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
148
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M9 15L3 9m0 0l6-6M3 9h12a6 6 0 010 12h-3" />
|
|
149
|
-
</svg>
|
|
150
|
-
Entry Points
|
|
151
|
-
</h3>
|
|
152
|
-
<div class="screen-link-list">
|
|
153
|
-
{entryScreens.map((s) => (
|
|
154
|
-
<a href={`/screen/${s.id}`} class="screen-link">
|
|
155
|
-
<div class="screen-link-info">
|
|
156
|
-
<span class="screen-link-title">{s.title}</span>
|
|
157
|
-
<span class="screen-link-id">{s.id}</span>
|
|
158
|
-
</div>
|
|
159
|
-
<svg class="screen-link-arrow" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
160
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
|
|
161
|
-
</svg>
|
|
162
|
-
</a>
|
|
163
|
-
))}
|
|
164
|
-
</div>
|
|
165
|
-
</div>
|
|
166
|
-
)}
|
|
167
|
-
|
|
168
|
-
<!-- Next Screens -->
|
|
169
|
-
{nextScreens.length > 0 && (
|
|
170
|
-
<div class="sidebar-card">
|
|
171
|
-
<h3 class="sidebar-card-title">
|
|
172
|
-
<svg aria-hidden="true" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
173
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M13.5 4.5L21 12m0 0l-7.5 7.5M21 12H3" />
|
|
174
|
-
</svg>
|
|
175
|
-
Next Screens
|
|
176
|
-
</h3>
|
|
177
|
-
<div class="screen-link-list">
|
|
178
|
-
{nextScreens.map((s) => (
|
|
179
|
-
<a href={`/screen/${s.id}`} class="screen-link">
|
|
180
|
-
<div class="screen-link-info">
|
|
181
|
-
<span class="screen-link-title">{s.title}</span>
|
|
182
|
-
<span class="screen-link-id">{s.id}</span>
|
|
183
|
-
</div>
|
|
184
|
-
<svg class="screen-link-arrow" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
185
|
-
<path stroke-linecap="round" stroke-linejoin="round" d="M8.25 4.5l7.5 7.5-7.5 7.5" />
|
|
186
|
-
</svg>
|
|
187
|
-
</a>
|
|
188
|
-
))}
|
|
189
|
-
</div>
|
|
190
|
-
</div>
|
|
191
|
-
)}
|
|
192
|
-
</div>
|
|
193
|
-
</div>
|
|
194
|
-
</div>
|
|
195
|
-
</Layout>
|