sdocs 0.0.47 → 0.0.48

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 (3) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/explorer/views/ComponentView.svelte +72 -50
  3. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -7,6 +7,15 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
7
7
 
8
8
  ## [Unreleased]
9
9
 
10
+ ## [0.0.48] - 2026-07-05
11
+
12
+ ### Changed
13
+
14
+ - **Empty API sections are hidden on component pages.** Props, CSS Props,
15
+ Events, Snippets, Methods, and States sections now render only when the
16
+ component actually has entries for them, instead of every section always
17
+ showing with a "None" placeholder.
18
+
10
19
  ## [0.0.47] - 2026-07-05
11
20
 
12
21
  ### Fixed
package/dist/explorer/views/ComponentView.svelte CHANGED
@@ -278,6 +278,13 @@
278
278
  description: s.description,
279
279
  })),
280
280
  );
281
+
282
+ // The Reset button normally sits in the Props header; when a component has
283
+ // editable CSS vars but no regular props, that section is hidden, so show
284
+ // Reset in the CSS Props header instead.
285
+ const showResetInCss = $derived(
286
+ hasEditableControls && propsRows.length === 0 && cssPropsRows.length > 0,
287
+ );
281
288
  </script>
282
289
 
283
290
  <div class="sdocs-component-view">
@@ -373,56 +380,71 @@
373
380
  {/if}
374
381
  {/snippet}
375
382
 
376
- <section class="sdocs-doc-section">
377
- <h2 class="sdocs-doc-section-title">
378
- <Icon name="sliders-horizontal" --w="15px" --h="15px" --fill="var(--color-base-500)" />
379
- Props
380
- {#if hasEditableControls}
381
- <button class="sdocs-reset-btn" onclick={handleReset}>Reset</button>
382
- {/if}
383
- </h2>
384
- <ApiTable rows={propsRows} control={propControl} />
385
- </section>
386
-
387
- <section class="sdocs-doc-section">
388
- <h2 class="sdocs-doc-section-title">
389
- <Icon name="palette" --w="15px" --h="15px" --fill="var(--color-base-500)" />
390
- CSS Props
391
- </h2>
392
- <ApiTable rows={cssPropsRows} control={cssPropControl} />
393
- </section>
394
-
395
- <section class="sdocs-doc-section">
396
- <h2 class="sdocs-doc-section-title">
397
- <Icon name="zap" --w="15px" --h="15px" --fill="var(--color-base-500)" />
398
- Events
399
- </h2>
400
- <ApiTable rows={eventsRows} showDefault={false} />
401
- </section>
402
-
403
- <section class="sdocs-doc-section">
404
- <h2 class="sdocs-doc-section-title">
405
- <Icon name="code" --w="15px" --h="15px" --fill="var(--color-base-500)" />
406
- Snippets
407
- </h2>
408
- <ApiTable rows={snippetsRows} showDefault={false} />
409
- </section>
410
-
411
- <section class="sdocs-doc-section">
412
- <h2 class="sdocs-doc-section-title">
413
- <Icon name="square-function" --w="15px" --h="15px" --fill="var(--color-base-500)" />
414
- Methods
415
- </h2>
416
- <ApiTable rows={methodsRows} showDefault={false} control={methodControl} />
417
- </section>
418
-
419
- <section class="sdocs-doc-section">
420
- <h2 class="sdocs-doc-section-title">
421
- <Icon name="database" --w="15px" --h="15px" --fill="var(--color-base-500)" />
422
- States
423
- </h2>
424
- <ApiTable rows={stateRows} defaultLabel="Current value" />
425
- </section>
383
+ {#if propsRows.length > 0}
384
+ <section class="sdocs-doc-section">
385
+ <h2 class="sdocs-doc-section-title">
386
+ <Icon name="sliders-horizontal" --w="15px" --h="15px" --fill="var(--color-base-500)" />
387
+ Props
388
+ {#if hasEditableControls}
389
+ <button class="sdocs-reset-btn" onclick={handleReset}>Reset</button>
390
+ {/if}
391
+ </h2>
392
+ <ApiTable rows={propsRows} control={propControl} />
393
+ </section>
394
+ {/if}
395
+
396
+ {#if cssPropsRows.length > 0}
397
+ <section class="sdocs-doc-section">
398
+ <h2 class="sdocs-doc-section-title">
399
+ <Icon name="palette" --w="15px" --h="15px" --fill="var(--color-base-500)" />
400
+ CSS Props
401
+ {#if showResetInCss}
402
+ <button class="sdocs-reset-btn" onclick={handleReset}>Reset</button>
403
+ {/if}
404
+ </h2>
405
+ <ApiTable rows={cssPropsRows} control={cssPropControl} />
406
+ </section>
407
+ {/if}
408
+
409
+ {#if eventsRows.length > 0}
410
+ <section class="sdocs-doc-section">
411
+ <h2 class="sdocs-doc-section-title">
412
+ <Icon name="zap" --w="15px" --h="15px" --fill="var(--color-base-500)" />
413
+ Events
414
+ </h2>
415
+ <ApiTable rows={eventsRows} showDefault={false} />
416
+ </section>
417
+ {/if}
418
+
419
+ {#if snippetsRows.length > 0}
420
+ <section class="sdocs-doc-section">
421
+ <h2 class="sdocs-doc-section-title">
422
+ <Icon name="code" --w="15px" --h="15px" --fill="var(--color-base-500)" />
423
+ Snippets
424
+ </h2>
425
+ <ApiTable rows={snippetsRows} showDefault={false} />
426
+ </section>
427
+ {/if}
428
+
429
+ {#if methodsRows.length > 0}
430
+ <section class="sdocs-doc-section">
431
+ <h2 class="sdocs-doc-section-title">
432
+ <Icon name="square-function" --w="15px" --h="15px" --fill="var(--color-base-500)" />
433
+ Methods
434
+ </h2>
435
+ <ApiTable rows={methodsRows} showDefault={false} control={methodControl} />
436
+ </section>
437
+ {/if}
438
+
439
+ {#if stateRows.length > 0}
440
+ <section class="sdocs-doc-section">
441
+ <h2 class="sdocs-doc-section-title">
442
+ <Icon name="database" --w="15px" --h="15px" --fill="var(--color-base-500)" />
443
+ States
444
+ </h2>
445
+ <ApiTable rows={stateRows} defaultLabel="Current value" />
446
+ </section>
447
+ {/if}
426
448
 
427
449
  {#if exampleSnippets.length > 0}
428
450
  <hr class="sdocs-divider" />
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sdocs",
3
- "version": "0.0.47",
3
+ "version": "0.0.48",
4
4
  "description": "A lightweight documentation tool for Svelte 5 components",
5
5
  "type": "module",
6
6
  "license": "MIT",