lildocs 0.0.0 → 0.1.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.
@@ -0,0 +1,650 @@
1
+ :where(*, *::before, *::after) {
2
+ box-sizing: border-box;
3
+ }
4
+
5
+ html {
6
+ -webkit-text-size-adjust: 100%;
7
+ text-size-adjust: 100%;
8
+ }
9
+
10
+ body {
11
+ min-height: 100vh;
12
+ margin: 0;
13
+ }
14
+
15
+ :where(img, picture, video, canvas, svg) {
16
+ display: block;
17
+ max-width: 100%;
18
+ }
19
+
20
+ :where(input, button, textarea, select) {
21
+ font: inherit;
22
+ }
23
+
24
+ :where(p, h1, h2, h3, h4, h5, h6) {
25
+ overflow-wrap: break-word;
26
+ }
27
+
28
+ :where(h1, h2, h3, h4, h5, h6) {
29
+ text-wrap: balance;
30
+ }
31
+
32
+ :target {
33
+ scroll-margin-block: 2rem;
34
+ }
35
+
36
+ .pageShell {
37
+ width: 92vw;
38
+ max-width: 1280px;
39
+ margin-inline: auto;
40
+ color: var(--ld-color-text);
41
+ font-family: var(--ld-font-body);
42
+ }
43
+
44
+ body {
45
+ background-color: var(--ld-color-background);
46
+ background-image: var(--ld-background-image);
47
+ background-blend-mode: var(--ld-background-blend-mode);
48
+ background-position: center top;
49
+ background-size: cover;
50
+ background-repeat: no-repeat;
51
+ }
52
+
53
+ .siteHeader {
54
+ min-height: 64px;
55
+ display: flex;
56
+ align-items: center;
57
+ justify-content: space-between;
58
+ gap: 24px;
59
+ border-bottom: 1px solid var(--ld-color-border);
60
+ }
61
+
62
+ .brand {
63
+ display: inline-flex;
64
+ align-items: center;
65
+ gap: 10px;
66
+ color: var(--ld-color-text);
67
+ font-family: var(--ld-font-logo);
68
+ font-weight: 700;
69
+ text-decoration: none;
70
+ }
71
+
72
+ .brandLogo {
73
+ display: block;
74
+ width: auto;
75
+ max-width: 120px;
76
+ height: 28px;
77
+ object-fit: contain;
78
+ }
79
+
80
+ .contentGrid {
81
+ display: grid;
82
+ grid-template-columns: minmax(180px, 22vw) minmax(0, 1fr) minmax(160px, 18vw);
83
+ gap: 32px;
84
+ }
85
+
86
+ html.is-changing :where(.transition-fade, .transition-slide, .transition-scale) {
87
+ transition:
88
+ opacity var(--ld-navigation-duration) var(--ld-navigation-easing),
89
+ transform var(--ld-navigation-duration) var(--ld-navigation-easing);
90
+ opacity: 1;
91
+ transform: none;
92
+ }
93
+
94
+ html.is-animating .transition-fade {
95
+ opacity: 0;
96
+ }
97
+
98
+ html.is-animating .transition-slide {
99
+ opacity: 0;
100
+ transform: translateY(10px);
101
+ }
102
+
103
+ html.is-animating .transition-scale {
104
+ opacity: 0;
105
+ transform: scale(0.985);
106
+ }
107
+
108
+ @media (prefers-reduced-motion: reduce) {
109
+ html.is-changing :where(.transition-fade, .transition-slide, .transition-scale) {
110
+ transition: none;
111
+ }
112
+
113
+ html.is-animating :where(.transition-slide, .transition-scale) {
114
+ transform: none;
115
+ }
116
+ }
117
+
118
+ .sidebar,
119
+ .toc {
120
+ position: sticky;
121
+ top: 0;
122
+ align-self: start;
123
+ max-height: 100vh;
124
+ overflow: auto;
125
+ padding-block: 24px;
126
+ }
127
+
128
+ .sidebar {
129
+ overscroll-behavior: contain;
130
+ padding-bottom: calc(24px + 40vh);
131
+ }
132
+
133
+ .content {
134
+ min-width: 0;
135
+ padding-block: 28px 64px;
136
+ line-height: 1.65;
137
+ }
138
+
139
+ .content h1,
140
+ .content h2,
141
+ .content h3,
142
+ .content h4,
143
+ .content h5,
144
+ .content h6 {
145
+ font-family: var(--ld-font-heading);
146
+ }
147
+
148
+ .content img {
149
+ max-width: 100%;
150
+ height: auto;
151
+ }
152
+
153
+ .content article li {
154
+ margin-bottom: 8px;
155
+ }
156
+
157
+ .content blockquote {
158
+ margin: 20px 0;
159
+ padding: 10px 16px;
160
+ border-left: 4px solid var(--ld-color-border);
161
+ border-radius: 0 6px 6px 0;
162
+ background: color-mix(in srgb, var(--ld-color-code-background) 72%, transparent);
163
+ color: var(--ld-color-muted-text);
164
+ }
165
+
166
+ .content blockquote > :first-child {
167
+ margin-top: 0;
168
+ }
169
+
170
+ .content blockquote > :last-child {
171
+ margin-bottom: 0;
172
+ }
173
+
174
+ .mermaidDiagram {
175
+ overflow-x: auto;
176
+ }
177
+
178
+ .mermaidDiagram svg {
179
+ max-width: 100%;
180
+ height: auto;
181
+ }
182
+
183
+ .content a,
184
+ .toc a,
185
+ .navList a {
186
+ color: var(--ld-color-link);
187
+ }
188
+
189
+ .content a {
190
+ text-decoration: var(--ld-link-text-decoration);
191
+ }
192
+
193
+ .content a:hover {
194
+ text-decoration: var(--ld-link-hover-text-decoration);
195
+ }
196
+
197
+ .navList {
198
+ list-style: none;
199
+ margin: 0;
200
+ padding-left: 0;
201
+ }
202
+
203
+ .navList > li + li {
204
+ margin-top: 2px;
205
+ }
206
+
207
+ .navList > .navGroup {
208
+ margin-top: 12px;
209
+ }
210
+
211
+ .navList > .navGroup:first-child {
212
+ margin-top: 0;
213
+ }
214
+
215
+ .navList a,
216
+ .navDisclosure summary,
217
+ .navFolder {
218
+ display: block;
219
+ padding: 6px 8px;
220
+ border-radius: 6px;
221
+ }
222
+
223
+ .navList a,
224
+ .navDisclosure summary {
225
+ color: var(--ld-color-muted-text);
226
+ text-decoration: none;
227
+ }
228
+
229
+ .navDisclosure summary {
230
+ display: flex;
231
+ align-items: center;
232
+ justify-content: space-between;
233
+ gap: 8px;
234
+ cursor: pointer;
235
+ list-style: none;
236
+ }
237
+
238
+ .navDisclosure summary::-webkit-details-marker {
239
+ display: none;
240
+ }
241
+
242
+ .navDisclosure summary::after {
243
+ width: 7px;
244
+ height: 7px;
245
+ border-right: 1.5px solid currentColor;
246
+ border-bottom: 1.5px solid currentColor;
247
+ content: "";
248
+ transform: rotate(-45deg);
249
+ }
250
+
251
+ .navDisclosure[open] > summary::after {
252
+ transform: rotate(45deg);
253
+ }
254
+
255
+ .navFolder {
256
+ color: color-mix(in srgb, var(--ld-color-muted-text) 72%, var(--ld-color-sidebar-background));
257
+ font-size: 0.78rem;
258
+ font-weight: 600;
259
+ }
260
+
261
+ .navList a.active,
262
+ .navDisclosure summary.active {
263
+ color: var(--ld-color-text);
264
+ background: var(--ld-color-code-background);
265
+ font-weight: 600;
266
+ }
267
+
268
+ .content pre {
269
+ position: relative;
270
+ overflow: auto;
271
+ padding: 14px 52px 14px 14px;
272
+ border-radius: 8px;
273
+ background: var(--ld-color-code-background);
274
+ white-space: pre;
275
+ }
276
+
277
+ .content pre code {
278
+ display: block;
279
+ white-space: inherit;
280
+ }
281
+
282
+ .content pre.shiki {
283
+ color: var(--shiki-light);
284
+ background: var(--shiki-light-bg);
285
+ }
286
+
287
+ .content pre.shiki span {
288
+ color: var(--shiki-light);
289
+ font-style: var(--shiki-light-font-style);
290
+ font-weight: var(--shiki-light-font-weight);
291
+ text-decoration: var(--shiki-light-text-decoration);
292
+ }
293
+
294
+ @media (prefers-color-scheme: dark) {
295
+ .content pre.shiki {
296
+ color: var(--shiki-dark);
297
+ background: var(--shiki-dark-bg);
298
+ }
299
+
300
+ .content pre.shiki span {
301
+ color: var(--shiki-dark);
302
+ font-style: var(--shiki-dark-font-style);
303
+ font-weight: var(--shiki-dark-font-weight);
304
+ text-decoration: var(--shiki-dark-text-decoration);
305
+ }
306
+ }
307
+
308
+ .content code {
309
+ font-family: var(--ld-font-code);
310
+ font-size: 0.92em;
311
+ }
312
+
313
+ .copyCodeButton {
314
+ position: absolute;
315
+ top: 10px;
316
+ right: 10px;
317
+ display: inline-flex;
318
+ align-items: center;
319
+ justify-content: center;
320
+ width: 28px;
321
+ height: 28px;
322
+ padding: 0;
323
+ border: 1px solid var(--ld-color-border);
324
+ border-radius: 6px;
325
+ background: color-mix(in srgb, var(--ld-color-background) 88%, transparent);
326
+ color: var(--ld-color-muted-text);
327
+ line-height: 1;
328
+ vertical-align: top;
329
+ cursor: pointer;
330
+ }
331
+
332
+ .copyCodeIcon {
333
+ font-size: 18px;
334
+ line-height: 1;
335
+ }
336
+
337
+ .copyCodeButton:hover,
338
+ .copyCodeButton:focus-visible {
339
+ border-color: var(--ld-color-link);
340
+ color: var(--ld-color-link);
341
+ }
342
+
343
+ .copyCodeButton:focus-visible {
344
+ outline: 2px solid color-mix(in srgb, var(--ld-color-link) 45%, transparent);
345
+ outline-offset: 2px;
346
+ }
347
+
348
+ .content table {
349
+ width: 100%;
350
+ border-collapse: collapse;
351
+ }
352
+
353
+ .markdown-alert {
354
+ margin-block: 18px;
355
+ padding: 8px 16px;
356
+ border-left: 4px solid var(--ld-alert-color);
357
+ background: color-mix(in srgb, var(--ld-alert-color) 8%, transparent);
358
+ }
359
+
360
+ .markdown-alert p {
361
+ margin-block: 8px;
362
+ }
363
+
364
+ .markdown-alert-title {
365
+ display: flex;
366
+ align-items: center;
367
+ gap: 8px;
368
+ color: var(--ld-alert-color);
369
+ font-weight: 700;
370
+ }
371
+
372
+ .markdown-alert-icon {
373
+ flex: 0 0 auto;
374
+ }
375
+
376
+ .markdown-alert-note {
377
+ --ld-alert-color: #0969da;
378
+ }
379
+
380
+ .markdown-alert-tip {
381
+ --ld-alert-color: #1a7f37;
382
+ }
383
+
384
+ .markdown-alert-important {
385
+ --ld-alert-color: #8250df;
386
+ }
387
+
388
+ .markdown-alert-warning {
389
+ --ld-alert-color: #9a6700;
390
+ }
391
+
392
+ .markdown-alert-caution {
393
+ --ld-alert-color: #cf222e;
394
+ }
395
+
396
+ .content th,
397
+ .content td {
398
+ padding: 8px;
399
+ border: 1px solid var(--ld-color-border);
400
+ }
401
+
402
+ .pageNav {
403
+ display: grid;
404
+ grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
405
+ gap: 16px;
406
+ margin-top: 48px;
407
+ padding-top: 24px;
408
+ border-top: 1px solid var(--ld-color-border);
409
+ }
410
+
411
+ .pageNavLink {
412
+ display: block;
413
+ min-width: 0;
414
+ padding: 12px 14px;
415
+ border: 1px solid var(--ld-color-border);
416
+ border-radius: 8px;
417
+ color: var(--ld-color-link);
418
+ line-height: 1.25;
419
+ text-decoration: none;
420
+ }
421
+
422
+ .content .pageNavLink,
423
+ .content .pageNavLink:hover {
424
+ text-decoration: none;
425
+ }
426
+
427
+ .pageNavLink span {
428
+ display: block;
429
+ margin-bottom: 2px;
430
+ color: var(--ld-color-muted-text);
431
+ font-size: 0.84rem;
432
+ }
433
+
434
+ .pageNavNext {
435
+ text-align: right;
436
+ }
437
+
438
+ .pageNavLink:hover {
439
+ background: var(--ld-color-code-background);
440
+ text-decoration: none;
441
+ }
442
+
443
+ .pageNavLink:focus-visible {
444
+ outline: 2px solid var(--ld-color-link);
445
+ outline-offset: 2px;
446
+ }
447
+
448
+ .toc {
449
+ color: var(--ld-color-muted-text);
450
+ font-size: 0.9rem;
451
+ }
452
+
453
+ .toc p {
454
+ margin-top: 0;
455
+ color: var(--ld-color-text);
456
+ font-weight: 700;
457
+ }
458
+
459
+ .toc ul {
460
+ display: grid;
461
+ gap: 6px;
462
+ list-style: none;
463
+ padding-left: 0;
464
+ }
465
+
466
+ .toc a {
467
+ text-decoration: none;
468
+ }
469
+
470
+ .tocDepth3 {
471
+ padding-left: 12px;
472
+ }
473
+
474
+ .headerActions {
475
+ display: flex;
476
+ align-items: center;
477
+ gap: 10px;
478
+ }
479
+
480
+ .repoButton {
481
+ display: inline-flex;
482
+ align-items: center;
483
+ justify-content: center;
484
+ width: 38px;
485
+ height: 38px;
486
+ flex: 0 0 auto;
487
+ border: 1px solid var(--ld-color-border);
488
+ border-radius: 6px;
489
+ color: var(--ld-color-muted-text);
490
+ text-decoration: none;
491
+ }
492
+
493
+ .repoButton:hover,
494
+ .repoButton:focus-visible {
495
+ border-color: var(--ld-color-link);
496
+ color: var(--ld-color-link);
497
+ }
498
+
499
+ .repoButton:focus-visible {
500
+ outline: 2px solid color-mix(in srgb, var(--ld-color-link) 45%, transparent);
501
+ outline-offset: 2px;
502
+ }
503
+
504
+ .repoIcon {
505
+ display: block;
506
+ width: 20px;
507
+ height: 20px;
508
+ background: currentColor;
509
+ mask: var(--ld-repo-icon) center / contain no-repeat;
510
+ -webkit-mask: var(--ld-repo-icon) center / contain no-repeat;
511
+ }
512
+
513
+ .searchBox {
514
+ position: relative;
515
+ flex: 1 1 min(340px, 42vw);
516
+ min-width: 0;
517
+ width: min(340px, 42vw);
518
+ }
519
+
520
+ .searchIcon {
521
+ position: absolute;
522
+ top: 50%;
523
+ left: 10px;
524
+ color: var(--ld-color-muted-text);
525
+ font-size: 20px;
526
+ line-height: 1;
527
+ pointer-events: none;
528
+ transform: translateY(-50%);
529
+ }
530
+
531
+ .material-symbols-rounded {
532
+ font-family: "Material Symbols Rounded";
533
+ font-weight: normal;
534
+ font-style: normal;
535
+ font-size: 20px;
536
+ line-height: 1;
537
+ letter-spacing: normal;
538
+ text-transform: none;
539
+ white-space: nowrap;
540
+ word-wrap: normal;
541
+ direction: ltr;
542
+ font-feature-settings: "liga";
543
+ -webkit-font-smoothing: antialiased;
544
+ }
545
+
546
+ .searchBox input {
547
+ box-sizing: border-box;
548
+ width: 100%;
549
+ padding: 9px 10px 9px 36px;
550
+ border: 1px solid var(--ld-color-border);
551
+ border-radius: 6px;
552
+ background: var(--ld-color-background);
553
+ color: var(--ld-color-text);
554
+ }
555
+
556
+ .searchBox input::placeholder {
557
+ color: var(--ld-color-muted-text);
558
+ }
559
+
560
+ .searchBox input:focus {
561
+ border-color: var(--ld-color-link);
562
+ outline: 2px solid color-mix(in srgb, var(--ld-color-link) 45%, transparent);
563
+ outline-offset: 2px;
564
+ }
565
+
566
+ .searchResults {
567
+ z-index: 10;
568
+ width: min(420px, 88vw);
569
+ max-height: 56vh;
570
+ overflow: auto;
571
+ border: 1px solid var(--ld-color-border);
572
+ border-radius: 8px;
573
+ background: var(--ld-color-background);
574
+ box-shadow: 0 12px 30px rgb(0 0 0 / 12%);
575
+ color: var(--ld-color-text);
576
+ font-family: var(--ld-font-body);
577
+ line-height: 1.4;
578
+ }
579
+
580
+ .searchResults a,
581
+ .searchResults p {
582
+ display: block;
583
+ margin: 0;
584
+ padding: 10px 12px;
585
+ }
586
+
587
+ .searchResults a {
588
+ color: var(--ld-color-text);
589
+ text-decoration: none;
590
+ }
591
+
592
+ .searchResults a.selected,
593
+ .searchResults a:hover {
594
+ background: var(--ld-color-code-background);
595
+ }
596
+
597
+ .searchResults span {
598
+ display: block;
599
+ color: var(--ld-color-muted-text);
600
+ font-size: 0.84rem;
601
+ }
602
+
603
+ .searchResults mark {
604
+ border-radius: 3px;
605
+ background: color-mix(in srgb, var(--ld-color-link) 18%, transparent);
606
+ color: inherit;
607
+ }
608
+
609
+ @media (max-width: 860px) {
610
+ .pageShell {
611
+ width: 94vw;
612
+ }
613
+
614
+ .siteHeader {
615
+ align-items: stretch;
616
+ flex-direction: column;
617
+ padding-block: 14px;
618
+ }
619
+
620
+ .headerActions {
621
+ width: 100%;
622
+ }
623
+
624
+ .searchBox {
625
+ width: 100%;
626
+ }
627
+
628
+ .contentGrid {
629
+ display: block;
630
+ }
631
+
632
+ .sidebar,
633
+ .toc {
634
+ position: static;
635
+ max-height: none;
636
+ border-bottom: 1px solid var(--ld-color-border);
637
+ }
638
+
639
+ .sidebar {
640
+ padding-bottom: 24px;
641
+ }
642
+
643
+ .pageNav {
644
+ grid-template-columns: 1fr;
645
+ }
646
+
647
+ .pageNavNext {
648
+ text-align: left;
649
+ }
650
+ }
package/package.json CHANGED
@@ -1,13 +1,54 @@
1
1
  {
2
2
  "name": "lildocs",
3
- "version": "0.0.0",
4
- "description": "",
5
- "main": "index.js",
6
- "keywords": [],
7
- "author": "",
8
- "license": "MIT",
9
- "type": "commonjs",
3
+ "version": "0.1.0",
4
+ "description": "A lightweight CLI that turns Markdown docs into a static searchable documentation site.",
5
+ "repository": {
6
+ "type": "git",
7
+ "url": "https://github.com/aleclarson/lildocs"
8
+ },
9
+ "bin": {
10
+ "lildocs": "dist/cli.mjs"
11
+ },
12
+ "files": [
13
+ "dist"
14
+ ],
15
+ "type": "module",
10
16
  "scripts": {
11
- "test": "echo \"Error: no test specified\" && exit 1"
12
- }
13
- }
17
+ "build": "tsdown",
18
+ "docs:serve": "pnpm run build && node dist/cli.mjs build ./docs --out ./dist/docs && sirv ./dist/docs",
19
+ "format": "oxfmt --write src schemas package.json tsconfig.json tsdown.config.ts .oxlintrc.json .oxfmtrc.json .vscode/settings.json",
20
+ "format:check": "oxfmt --check src schemas package.json tsconfig.json tsdown.config.ts .oxlintrc.json .oxfmtrc.json .vscode/settings.json",
21
+ "lint": "oxlint src tsdown.config.ts",
22
+ "test": "pnpm run build && node --test test/*.test.mjs",
23
+ "typecheck": "tsc --noEmit"
24
+ },
25
+ "dependencies": {
26
+ "@goddard-ai/ui-primitives": "^0.1.1",
27
+ "@preact/signals": "^2.9.2",
28
+ "beautiful-mermaid": "^1.1.3",
29
+ "cmd-ts": "^0.15.0",
30
+ "culori": "^4.0.2",
31
+ "exports-md": "^0.1.3",
32
+ "gray-matter": "^4.0.3",
33
+ "jiti": "^2.7.0",
34
+ "marked": "^18.0.3",
35
+ "marked-shiki": "^1.2.1",
36
+ "preact": "^10.29.2",
37
+ "preact-render-to-string": "^6.7.0",
38
+ "shiki": "^4.0.2",
39
+ "swup": "^4.9.0"
40
+ },
41
+ "devDependencies": {
42
+ "@types/culori": "^4.0.1",
43
+ "@types/node": "^24.0.0",
44
+ "oxfmt": "^0.50.0",
45
+ "oxlint": "^1.65.0",
46
+ "sirv": "^3.0.2",
47
+ "tsdown": "^0.22.0",
48
+ "typescript": "^5.9.0"
49
+ },
50
+ "engines": {
51
+ "node": "^22.18.0 || >=24.2.0"
52
+ },
53
+ "packageManager": "pnpm@10.29.3"
54
+ }
package/readme.md DELETED
@@ -1 +0,0 @@
1
- Coming soon...