jskelet 0.6.1 → 0.6.3

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.
Files changed (155) hide show
  1. package/AGENTS.md +136 -136
  2. package/CHANGELOG.md +620 -596
  3. package/LICENSE +21 -21
  4. package/bin/jskelet.mjs +130 -130
  5. package/docs/01-baslangic.md +291 -291
  6. package/docs/02-mimari.md +310 -309
  7. package/docs/03-routing.md +515 -515
  8. package/docs/04-render-ve-sablonlar.md +661 -661
  9. package/docs/05-islands.md +486 -486
  10. package/docs/06-cache.md +1443 -1423
  11. package/docs/07-yapilandirma.md +12 -6
  12. package/docs/08-build.md +429 -428
  13. package/docs/09-dev-araclari.md +364 -364
  14. package/docs/10-dagitim.md +338 -338
  15. package/docs/12-panel-ve-oturum.md +478 -478
  16. package/docs/README.md +83 -83
  17. package/docs/en/01-getting-started.md +298 -298
  18. package/docs/en/02-architecture.md +329 -328
  19. package/docs/en/03-routing.md +531 -531
  20. package/docs/en/04-rendering.md +669 -669
  21. package/docs/en/05-islands.md +497 -497
  22. package/docs/en/06-caching.md +1453 -1431
  23. package/docs/en/07-configuration.md +1219 -1214
  24. package/docs/en/08-build.md +447 -446
  25. package/docs/en/09-dev-tools.md +373 -373
  26. package/docs/en/10-deployment.md +340 -340
  27. package/docs/en/11-migration.md +398 -398
  28. package/docs/en/12-dashboards-and-sessions.md +488 -488
  29. package/docs/en/README.md +87 -87
  30. package/package.json +137 -137
  31. package/src/build/ensure-build.mjs +19 -19
  32. package/src/build/paths.mjs +153 -153
  33. package/src/build/resolve-peer.mjs +36 -36
  34. package/src/build/tasks/client.mjs +349 -349
  35. package/src/build/tasks/css.mjs +235 -235
  36. package/src/build/tasks/fonts.mjs +146 -146
  37. package/src/build/tasks/icons.mjs +357 -357
  38. package/src/build/tasks/images.mjs +244 -244
  39. package/src/build/tasks/precompress.mjs +78 -78
  40. package/src/build/tasks/templates.mjs +20 -20
  41. package/src/client/admin/i18n.js +764 -764
  42. package/src/client/admin/login.html +74 -74
  43. package/src/client/admin/panel.css +809 -809
  44. package/src/client/admin/panel.html +495 -495
  45. package/src/client/admin/panel.js +1251 -1251
  46. package/src/client/devtools/report.html +185 -185
  47. package/src/client/devtools/report.js +745 -745
  48. package/src/client/devtools/seo.js +628 -628
  49. package/src/client/dom.js +95 -95
  50. package/src/client/form.js +192 -192
  51. package/src/client/index.js +45 -45
  52. package/src/client/registry.js +305 -305
  53. package/src/client/safe-image.js +91 -91
  54. package/src/client/shared-cookie.js +225 -225
  55. package/src/client/store.js +36 -36
  56. package/src/client/swap.js +188 -188
  57. package/src/compile/codegen.js +336 -336
  58. package/src/compile/compile-all.js +149 -149
  59. package/src/compile/errors.js +66 -66
  60. package/src/compile/expr.js +409 -409
  61. package/src/compile/index.js +17 -17
  62. package/src/compile/parse.js +541 -541
  63. package/src/compile/resolve.js +211 -211
  64. package/src/compile/scan-exports.js +51 -51
  65. package/src/config/defaults.js +17 -1
  66. package/src/config/index.js +13 -0
  67. package/src/config/pattern.js +107 -107
  68. package/src/generate.mjs +163 -163
  69. package/src/http/control-flow.js +71 -71
  70. package/src/http/cookies-entry.js +21 -21
  71. package/src/http/cookies.js +277 -277
  72. package/src/http/request-cache.js +46 -46
  73. package/src/http/request-context.js +165 -165
  74. package/src/http/shared-cookie.js +178 -178
  75. package/src/index.js +101 -101
  76. package/src/init.mjs +230 -230
  77. package/src/migrate/apply.mjs +262 -262
  78. package/src/migrate/babel.mjs +79 -79
  79. package/src/migrate/classify.mjs +155 -155
  80. package/src/migrate/config.mjs +126 -126
  81. package/src/migrate/fs-walk.mjs +191 -191
  82. package/src/migrate/parse.mjs +26 -26
  83. package/src/migrate/scan.mjs +177 -177
  84. package/src/migrate/transform/expr-source.mjs +168 -168
  85. package/src/migrate/transform/island.mjs +67 -67
  86. package/src/migrate/transform/jsx-to-component.mjs +302 -302
  87. package/src/migrate/transform/jsx-to-jsk.mjs +330 -330
  88. package/src/migrate/transform/page-split.mjs +435 -435
  89. package/src/migrate/write.mjs +81 -81
  90. package/src/migrate.mjs +171 -171
  91. package/src/runtime/alias-hooks.mjs +119 -119
  92. package/src/runtime/register.mjs +4 -4
  93. package/src/server/admin/actions.js +229 -229
  94. package/src/server/admin/auth.js +125 -125
  95. package/src/server/admin/event-log.js +151 -151
  96. package/src/server/admin/gate.js +209 -209
  97. package/src/server/admin/inventory.js +188 -188
  98. package/src/server/admin/mount.js +56 -56
  99. package/src/server/admin/router.js +216 -216
  100. package/src/server/admin/snapshot.js +241 -241
  101. package/src/server/assets.js +147 -147
  102. package/src/server/auth/handoff.js +309 -309
  103. package/src/server/cache-blob.js +70 -0
  104. package/src/server/cache-deps.js +42 -42
  105. package/src/server/cache-vary.js +113 -113
  106. package/src/server/cloudflare.js +607 -607
  107. package/src/server/create-app.js +366 -366
  108. package/src/server/data-cache.js +553 -462
  109. package/src/server/dev/report.js +485 -485
  110. package/src/server/dev/socket.js +170 -170
  111. package/src/server/dev/version-check.mjs +139 -139
  112. package/src/server/disk-cache.js +233 -0
  113. package/src/server/ejs-adapter.js +59 -59
  114. package/src/server/html-cache.js +1196 -1122
  115. package/src/server/image-optimizer.js +500 -407
  116. package/src/server/logs/access-middleware.js +66 -66
  117. package/src/server/logs/file-sink.js +193 -66
  118. package/src/server/logs/pipeline.js +165 -158
  119. package/src/server/logs/s3-put.js +214 -214
  120. package/src/server/logs/s3-sink.js +112 -112
  121. package/src/server/metadata.js +102 -102
  122. package/src/server/middleware/compression.js +205 -205
  123. package/src/server/middleware/csrf.js +134 -134
  124. package/src/server/middleware/dev-gate.js +75 -75
  125. package/src/server/middleware/headers.js +37 -37
  126. package/src/server/middleware/redirects.js +32 -32
  127. package/src/server/middleware/robots-txt.js +341 -341
  128. package/src/server/middleware/static-precompressed.js +121 -100
  129. package/src/server/middleware/trailing-slash.js +53 -53
  130. package/src/server/middleware/upstream-proxy.js +141 -141
  131. package/src/server/og-image.js +356 -356
  132. package/src/server/port-guard.js +255 -255
  133. package/src/server/prewarm.js +1082 -1058
  134. package/src/server/redis.js +588 -569
  135. package/src/server/render.js +4 -4
  136. package/src/server/router.js +157 -157
  137. package/src/server/status-page.js +265 -265
  138. package/src/server/upstream-limiter.js +376 -376
  139. package/src/server/upstream-tracking.js +166 -166
  140. package/src/shared/cookie-domain.js +66 -66
  141. package/src/start.mjs +22 -22
  142. package/src/templates/layout.ejs +30 -30
  143. package/src/templates/layout.jsk +30 -30
  144. package/src/version.mjs +31 -31
  145. package/src/views/components/loader.js +101 -101
  146. package/src/views/helpers/html.js +102 -102
  147. package/src/views/helpers/tags.js +375 -375
  148. package/types/config/defaults.d.ts +15 -1
  149. package/types/config/index.d.ts +8 -0
  150. package/types/server/cache-blob.d.ts +13 -0
  151. package/types/server/data-cache.d.ts +9 -0
  152. package/types/server/disk-cache.d.ts +36 -0
  153. package/types/server/html-cache.d.ts +26 -3
  154. package/types/server/logs/file-sink.d.ts +16 -5
  155. package/types/server/redis.d.ts +2 -1
package/src/client/devtools/report.html CHANGED
@@ -1,185 +1,185 @@
1
- <!doctype html>
2
- <html lang="tr">
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1" />
6
- <meta name="robots" content="noindex" />
7
- <title>JSkelet Dev · Detaylı İnceleme</title>
8
- <link rel="icon" href="/__jskelet/dev/logo.png" />
9
- <style>
10
- :root {
11
- --bg: #0a0c10;
12
- --panel: #10131a;
13
- --surface: rgba(255, 255, 255, 0.045);
14
- --surface-hover: rgba(255, 255, 255, 0.08);
15
- --line: rgba(255, 255, 255, 0.09);
16
- --text: #eef1f5;
17
- --muted: #8b95a3;
18
- --good: #34d399;
19
- --mid: #fbbf24;
20
- --bad: #fb7185;
21
- --info: #60a5fa;
22
- color-scheme: dark;
23
- }
24
-
25
- * { box-sizing: border-box; }
26
-
27
- body {
28
- margin: 0;
29
- background:
30
- radial-gradient(1200px 600px at 20% -10%, #171c25 0%, transparent 60%),
31
- var(--bg);
32
- color: var(--text);
33
- font: 400 13px/1.6 ui-sans-serif, system-ui, -apple-system, sans-serif;
34
- min-height: 100vh;
35
- }
36
-
37
- a { color: inherit; }
38
-
39
- header {
40
- position: sticky; top: 0; z-index: 10;
41
- display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
42
- padding: 14px 24px;
43
- background: rgba(10, 12, 16, 0.86);
44
- border-bottom: 1px solid var(--line);
45
- backdrop-filter: blur(10px);
46
- }
47
- header img { width: 24px; height: 24px; object-fit: contain; }
48
- header h1 { margin: 0; font-size: 15px; font-weight: 700; letter-spacing: -0.01em; }
49
- header .spacer { flex: 1; }
50
-
51
- .pill {
52
- display: inline-flex; align-items: center; gap: 7px;
53
- padding: 4px 10px; border-radius: 999px;
54
- border: 1px solid var(--line); background: var(--surface);
55
- color: var(--muted); font-size: 11.5px; font-weight: 600;
56
- }
57
- .pill .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--good); }
58
-
59
- button, .btn {
60
- display: inline-flex; align-items: center; gap: 7px;
61
- background: var(--surface); border: 1px solid var(--line); color: var(--text);
62
- border-radius: 9px; padding: 6px 11px; font-size: 12px; font-weight: 600;
63
- cursor: pointer; font-family: inherit; text-decoration: none;
64
- transition: background 0.15s ease, border-color 0.15s ease;
65
- }
66
- button:hover, .btn:hover { background: var(--surface-hover); }
67
- button[aria-pressed="true"] { border-color: rgba(96, 165, 250, 0.5); color: #cfe3ff; }
68
- button.danger { color: #ffc9d2; border-color: rgba(251, 113, 133, 0.28); background: rgba(251, 113, 133, 0.1); }
69
- button.danger:hover { border-color: rgba(251, 113, 133, 0.55); background: rgba(251, 113, 133, 0.22); }
70
-
71
- nav {
72
- display: flex; gap: 6px; flex-wrap: wrap;
73
- padding: 12px 24px 0;
74
- }
75
- nav button {
76
- border-radius: 999px; color: var(--muted); background: transparent;
77
- border-color: transparent;
78
- }
79
- nav button:hover { color: var(--text); background: var(--surface); }
80
- nav button[aria-selected="true"] {
81
- color: #fff; background: var(--surface-hover); border-color: var(--line);
82
- }
83
-
84
- main { padding: 18px 24px 60px; }
85
- section[hidden] { display: none; }
86
-
87
- h2 {
88
- margin: 26px 0 12px; font-size: 11px; color: var(--muted);
89
- text-transform: uppercase; letter-spacing: 0.08em; font-weight: 700;
90
- }
91
- h2:first-child { margin-top: 6px; }
92
- h2 .note { text-transform: none; letter-spacing: 0; font-weight: 600; color: #6c7684; margin-left: 8px; }
93
-
94
- .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
95
- .metric {
96
- background: var(--panel); border: 1px solid var(--line);
97
- border-radius: 14px; padding: 13px 15px 15px;
98
- }
99
- .metric .label { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
100
- .metric .value { font-size: 24px; font-weight: 700; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
101
- .metric .sub { color: var(--muted); font-size: 11px; }
102
- .metric .bar { margin-top: 8px; height: 3px; border-radius: 999px; background: rgba(255, 255, 255, 0.08); overflow: hidden; }
103
- .metric .bar span { display: block; height: 100%; background: var(--muted); }
104
-
105
- .good { color: var(--good); } .mid { color: var(--mid); } .bad { color: var(--bad); }
106
- .bar span.good { background: var(--good); } .bar span.mid { background: var(--mid); } .bar span.bad { background: var(--bad); }
107
-
108
- .card {
109
- background: var(--panel); border: 1px solid var(--line);
110
- border-radius: 14px; padding: 14px 16px; margin-bottom: 12px;
111
- }
112
-
113
- .toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
114
- input[type="search"] {
115
- flex: 1; min-width: 220px;
116
- background: var(--surface); border: 1px solid var(--line); color: var(--text);
117
- border-radius: 9px; padding: 7px 11px; font: inherit; font-size: 12px;
118
- }
119
- input[type="search"]::placeholder { color: #61697a; }
120
-
121
- .table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); }
122
- table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
123
- th, td { text-align: right; padding: 9px 12px; white-space: nowrap; border-bottom: 1px solid rgba(255, 255, 255, 0.05); }
124
- th:first-child, td:first-child { text-align: left; }
125
- th {
126
- position: sticky; top: 0; z-index: 1;
127
- background: #141821; color: var(--muted); font-size: 10.5px;
128
- text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; user-select: none;
129
- }
130
- th:hover { color: var(--text); }
131
- th[data-dir]::after { content: " ↓"; }
132
- th[data-dir="asc"]::after { content: " ↑"; }
133
- tbody tr:hover { background: var(--surface); }
134
- tbody tr.clickable { cursor: pointer; }
135
- tbody tr.selected { background: rgba(96, 165, 250, 0.1); }
136
- td.path { font-family: ui-monospace, SFMono-Regular, monospace; font-size: 11.5px; max-width: 420px; overflow: hidden; text-overflow: ellipsis; }
137
- td.path a { text-decoration: none; border-bottom: 1px solid transparent; }
138
- td.path a:hover { border-bottom-color: rgba(255, 255, 255, 0.35); }
139
-
140
- .tag {
141
- border: 1px solid var(--line); border-radius: 999px; padding: 1px 7px;
142
- font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
143
- color: var(--muted);
144
- }
145
- .tag.entry { color: #cfe3ff; border-color: rgba(96, 165, 250, 0.4); }
146
- .tag.chunk { color: #ffeec2; border-color: rgba(251, 191, 36, 0.35); }
147
-
148
- .split { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 14px; align-items: start; }
149
- @media (max-width: 1000px) { .split { grid-template-columns: 1fr; } }
150
-
151
- .bars { display: flex; flex-direction: column; gap: 7px; }
152
- .barrow { display: grid; grid-template-columns: minmax(0, 1fr) 76px; gap: 10px; align-items: center; }
153
- .barrow .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: ui-monospace, SFMono-Regular, monospace; font-size: 11px; color: #cfd6de; }
154
- .barrow .track { grid-column: 1 / -1; height: 4px; border-radius: 999px; background: rgba(255, 255, 255, 0.07); overflow: hidden; margin-top: -4px; }
155
- .barrow .track span { display: block; height: 100%; background: var(--info); }
156
- .barrow .size { text-align: right; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
157
-
158
- .empty {
159
- color: #5f6874; padding: 18px; text-align: center;
160
- background: var(--panel); border: 1px dashed var(--line); border-radius: 14px;
161
- }
162
- code { font-family: ui-monospace, SFMono-Regular, monospace; font-size: 11.5px; background: rgba(0, 0, 0, 0.4); border: 1px solid var(--line); border-radius: 6px; padding: 1px 5px; }
163
- .hint { color: var(--muted); font-size: 11.5px; }
164
- .status { border-radius: 6px; padding: 1px 6px; font-size: 10.5px; font-weight: 700; background: rgba(52, 211, 153, 0.14); color: var(--good); }
165
- .status.warn { background: rgba(251, 191, 36, 0.14); color: var(--mid); }
166
- .status.bad { background: rgba(251, 113, 133, 0.14); color: var(--bad); }
167
- </style>
168
- </head>
169
- <body>
170
- <header>
171
- <img src="/__jskelet/dev/logo.png" alt="" />
172
- <h1>JSkelet Dev · Detaylı İnceleme</h1>
173
- <span class="pill"><span class="dot"></span><span data-part="status">yükleniyor…</span></span>
174
- <span class="spacer"></span>
175
- <button data-action="refresh">Yenile</button>
176
- <button data-action="auto" aria-pressed="false">Otomatik yenile</button>
177
- <button class="danger" data-action="reset">Ölçümleri sıfırla</button>
178
- </header>
179
-
180
- <nav data-part="tabs"></nav>
181
- <main data-part="main"></main>
182
-
183
- <script type="module" src="/__jskelet/dev/report.js"></script>
184
- </body>
185
- </html>
1
+ <!doctype html>
2
+ <html lang="tr">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
6
+ <meta name="robots" content="noindex" />
7
+ <title>JSkelet Dev · Detaylı İnceleme</title>
8
+ <link rel="icon" href="/__jskelet/dev/logo.png" />
9
+ <style>
10
+ :root {
11
+ --bg: #0a0c10;
12
+ --panel: #10131a;
13
+ --surface: rgba(255, 255, 255, 0.045);
14
+ --surface-hover: rgba(255, 255, 255, 0.08);
15
+ --line: rgba(255, 255, 255, 0.09);
16
+ --text: #eef1f5;
17
+ --muted: #8b95a3;
18
+ --good: #34d399;
19
+ --mid: #fbbf24;
20
+ --bad: #fb7185;
21
+ --info: #60a5fa;
22
+ color-scheme: dark;
23
+ }
24
+
25
+ * { box-sizing: border-box; }
26
+
27
+ body {
28
+ margin: 0;
29
+ background:
30
+ radial-gradient(1200px 600px at 20% -10%, #171c25 0%, transparent 60%),
31
+ var(--bg);
32
+ color: var(--text);
33
+ font: 400 13px/1.6 ui-sans-serif, system-ui, -apple-system, sans-serif;
34
+ min-height: 100vh;
35
+ }
36
+
37
+ a { color: inherit; }
38
+
39
+ header {
40
+ position: sticky; top: 0; z-index: 10;
41
+ display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
42
+ padding: 14px 24px;
43
+ background: rgba(10, 12, 16, 0.86);
44
+ border-bottom: 1px solid var(--line);
45
+ backdrop-filter: blur(10px);
46
+ }
47
+ header img { width: 24px; height: 24px; object-fit: contain; }
48
+ header h1 { margin: 0; font-size: 15px; font-weight: 700; letter-spacing: -0.01em; }
49
+ header .spacer { flex: 1; }
50
+
51
+ .pill {
52
+ display: inline-flex; align-items: center; gap: 7px;
53
+ padding: 4px 10px; border-radius: 999px;
54
+ border: 1px solid var(--line); background: var(--surface);
55
+ color: var(--muted); font-size: 11.5px; font-weight: 600;
56
+ }
57
+ .pill .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--good); }
58
+
59
+ button, .btn {
60
+ display: inline-flex; align-items: center; gap: 7px;
61
+ background: var(--surface); border: 1px solid var(--line); color: var(--text);
62
+ border-radius: 9px; padding: 6px 11px; font-size: 12px; font-weight: 600;
63
+ cursor: pointer; font-family: inherit; text-decoration: none;
64
+ transition: background 0.15s ease, border-color 0.15s ease;
65
+ }
66
+ button:hover, .btn:hover { background: var(--surface-hover); }
67
+ button[aria-pressed="true"] { border-color: rgba(96, 165, 250, 0.5); color: #cfe3ff; }
68
+ button.danger { color: #ffc9d2; border-color: rgba(251, 113, 133, 0.28); background: rgba(251, 113, 133, 0.1); }
69
+ button.danger:hover { border-color: rgba(251, 113, 133, 0.55); background: rgba(251, 113, 133, 0.22); }
70
+
71
+ nav {
72
+ display: flex; gap: 6px; flex-wrap: wrap;
73
+ padding: 12px 24px 0;
74
+ }
75
+ nav button {
76
+ border-radius: 999px; color: var(--muted); background: transparent;
77
+ border-color: transparent;
78
+ }
79
+ nav button:hover { color: var(--text); background: var(--surface); }
80
+ nav button[aria-selected="true"] {
81
+ color: #fff; background: var(--surface-hover); border-color: var(--line);
82
+ }
83
+
84
+ main { padding: 18px 24px 60px; }
85
+ section[hidden] { display: none; }
86
+
87
+ h2 {
88
+ margin: 26px 0 12px; font-size: 11px; color: var(--muted);
89
+ text-transform: uppercase; letter-spacing: 0.08em; font-weight: 700;
90
+ }
91
+ h2:first-child { margin-top: 6px; }
92
+ h2 .note { text-transform: none; letter-spacing: 0; font-weight: 600; color: #6c7684; margin-left: 8px; }
93
+
94
+ .grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; }
95
+ .metric {
96
+ background: var(--panel); border: 1px solid var(--line);
97
+ border-radius: 14px; padding: 13px 15px 15px;
98
+ }
99
+ .metric .label { color: var(--muted); font-size: 10px; text-transform: uppercase; letter-spacing: 0.06em; font-weight: 700; }
100
+ .metric .value { font-size: 24px; font-weight: 700; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
101
+ .metric .sub { color: var(--muted); font-size: 11px; }
102
+ .metric .bar { margin-top: 8px; height: 3px; border-radius: 999px; background: rgba(255, 255, 255, 0.08); overflow: hidden; }
103
+ .metric .bar span { display: block; height: 100%; background: var(--muted); }
104
+
105
+ .good { color: var(--good); } .mid { color: var(--mid); } .bad { color: var(--bad); }
106
+ .bar span.good { background: var(--good); } .bar span.mid { background: var(--mid); } .bar span.bad { background: var(--bad); }
107
+
108
+ .card {
109
+ background: var(--panel); border: 1px solid var(--line);
110
+ border-radius: 14px; padding: 14px 16px; margin-bottom: 12px;
111
+ }
112
+
113
+ .toolbar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
114
+ input[type="search"] {
115
+ flex: 1; min-width: 220px;
116
+ background: var(--surface); border: 1px solid var(--line); color: var(--text);
117
+ border-radius: 9px; padding: 7px 11px; font: inherit; font-size: 12px;
118
+ }
119
+ input[type="search"]::placeholder { color: #61697a; }
120
+
121
+ .table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 14px; background: var(--panel); }
122
+ table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
123
+ th, td { text-align: right; padding: 9px 12px; white-space: nowrap; border-bottom: 1px solid rgba(255, 255, 255, 0.05); }
124
+ th:first-child, td:first-child { text-align: left; }
125
+ th {
126
+ position: sticky; top: 0; z-index: 1;
127
+ background: #141821; color: var(--muted); font-size: 10.5px;
128
+ text-transform: uppercase; letter-spacing: 0.05em; cursor: pointer; user-select: none;
129
+ }
130
+ th:hover { color: var(--text); }
131
+ th[data-dir]::after { content: " ↓"; }
132
+ th[data-dir="asc"]::after { content: " ↑"; }
133
+ tbody tr:hover { background: var(--surface); }
134
+ tbody tr.clickable { cursor: pointer; }
135
+ tbody tr.selected { background: rgba(96, 165, 250, 0.1); }
136
+ td.path { font-family: ui-monospace, SFMono-Regular, monospace; font-size: 11.5px; max-width: 420px; overflow: hidden; text-overflow: ellipsis; }
137
+ td.path a { text-decoration: none; border-bottom: 1px solid transparent; }
138
+ td.path a:hover { border-bottom-color: rgba(255, 255, 255, 0.35); }
139
+
140
+ .tag {
141
+ border: 1px solid var(--line); border-radius: 999px; padding: 1px 7px;
142
+ font-size: 9.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em;
143
+ color: var(--muted);
144
+ }
145
+ .tag.entry { color: #cfe3ff; border-color: rgba(96, 165, 250, 0.4); }
146
+ .tag.chunk { color: #ffeec2; border-color: rgba(251, 191, 36, 0.35); }
147
+
148
+ .split { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 14px; align-items: start; }
149
+ @media (max-width: 1000px) { .split { grid-template-columns: 1fr; } }
150
+
151
+ .bars { display: flex; flex-direction: column; gap: 7px; }
152
+ .barrow { display: grid; grid-template-columns: minmax(0, 1fr) 76px; gap: 10px; align-items: center; }
153
+ .barrow .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: ui-monospace, SFMono-Regular, monospace; font-size: 11px; color: #cfd6de; }
154
+ .barrow .track { grid-column: 1 / -1; height: 4px; border-radius: 999px; background: rgba(255, 255, 255, 0.07); overflow: hidden; margin-top: -4px; }
155
+ .barrow .track span { display: block; height: 100%; background: var(--info); }
156
+ .barrow .size { text-align: right; color: var(--muted); font-size: 11px; font-variant-numeric: tabular-nums; }
157
+
158
+ .empty {
159
+ color: #5f6874; padding: 18px; text-align: center;
160
+ background: var(--panel); border: 1px dashed var(--line); border-radius: 14px;
161
+ }
162
+ code { font-family: ui-monospace, SFMono-Regular, monospace; font-size: 11.5px; background: rgba(0, 0, 0, 0.4); border: 1px solid var(--line); border-radius: 6px; padding: 1px 5px; }
163
+ .hint { color: var(--muted); font-size: 11.5px; }
164
+ .status { border-radius: 6px; padding: 1px 6px; font-size: 10.5px; font-weight: 700; background: rgba(52, 211, 153, 0.14); color: var(--good); }
165
+ .status.warn { background: rgba(251, 191, 36, 0.14); color: var(--mid); }
166
+ .status.bad { background: rgba(251, 113, 133, 0.14); color: var(--bad); }
167
+ </style>
168
+ </head>
169
+ <body>
170
+ <header>
171
+ <img src="/__jskelet/dev/logo.png" alt="" />
172
+ <h1>JSkelet Dev · Detaylı İnceleme</h1>
173
+ <span class="pill"><span class="dot"></span><span data-part="status">yükleniyor…</span></span>
174
+ <span class="spacer"></span>
175
+ <button data-action="refresh">Yenile</button>
176
+ <button data-action="auto" aria-pressed="false">Otomatik yenile</button>
177
+ <button class="danger" data-action="reset">Ölçümleri sıfırla</button>
178
+ </header>
179
+
180
+ <nav data-part="tabs"></nav>
181
+ <main data-part="main"></main>
182
+
183
+ <script type="module" src="/__jskelet/dev/report.js"></script>
184
+ </body>
185
+ </html>