sveld 0.30.0 → 0.30.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 +111 -1
- package/lib/ComponentParser.d.ts +13 -0
- package/lib/index.js +527 -519
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -129,9 +129,11 @@ export default class Button extends SvelteComponentTyped<
|
|
|
129
129
|
- [Available Options](#available-options)
|
|
130
130
|
- [API Reference](#api-reference)
|
|
131
131
|
- [@type](#type)
|
|
132
|
+
- [@default](#default)
|
|
132
133
|
- [@typedef](#typedef)
|
|
133
134
|
- [@callback](#callback)
|
|
134
135
|
- [@slot / @snippet](#slot--snippet)
|
|
136
|
+
- [Extra JSDoc tags before `@slot`](#extra-jsdoc-tags-before-slot)
|
|
135
137
|
- [Svelte 5 Snippet Compatibility](#svelte-5-snippet-compatibility)
|
|
136
138
|
- [@event](#event)
|
|
137
139
|
- [Context API](#context-api)
|
|
@@ -419,6 +421,88 @@ For runes components with multiple destructured props, place JSDoc on the indivi
|
|
|
419
421
|
</script>
|
|
420
422
|
```
|
|
421
423
|
|
|
424
|
+
### `@default`
|
|
425
|
+
|
|
426
|
+
By default, `sveld` infers the `@default` value from the prop's initializer and includes it in the generated TypeScript definitions:
|
|
427
|
+
|
|
428
|
+
```svelte
|
|
429
|
+
<script>
|
|
430
|
+
export let open = false;
|
|
431
|
+
</script>
|
|
432
|
+
```
|
|
433
|
+
|
|
434
|
+
```ts
|
|
435
|
+
/**
|
|
436
|
+
* @default false
|
|
437
|
+
*/
|
|
438
|
+
open?: boolean;
|
|
439
|
+
```
|
|
440
|
+
|
|
441
|
+
Use the `@default` tag to explicitly document the default value. When an explicit `@default` annotation is provided, `sveld` uses it instead of the inferred value, avoiding duplicate `@default` tags in the output.
|
|
442
|
+
|
|
443
|
+
This is useful when the initializer references a variable or expression that is not meaningful to consumers:
|
|
444
|
+
|
|
445
|
+
```svelte
|
|
446
|
+
<script>
|
|
447
|
+
const defaultFilter = () => true;
|
|
448
|
+
|
|
449
|
+
/**
|
|
450
|
+
* @default () => true
|
|
451
|
+
* @type {(item: string, value: string) => boolean}
|
|
452
|
+
*/
|
|
453
|
+
export let shouldFilter = defaultFilter;
|
|
454
|
+
</script>
|
|
455
|
+
```
|
|
456
|
+
|
|
457
|
+
```ts
|
|
458
|
+
/**
|
|
459
|
+
* @default () => true
|
|
460
|
+
*/
|
|
461
|
+
shouldFilter?: (item: string, value: string) => boolean;
|
|
462
|
+
```
|
|
463
|
+
|
|
464
|
+
#### Identifier resolution
|
|
465
|
+
|
|
466
|
+
When a prop's initializer is a variable reference, `sveld` resolves it to the actual value automatically:
|
|
467
|
+
|
|
468
|
+
```svelte
|
|
469
|
+
<script>
|
|
470
|
+
const DEFAULT_SIZE = "md";
|
|
471
|
+
|
|
472
|
+
/** @type {"sm" | "md" | "lg"} */
|
|
473
|
+
export let size = DEFAULT_SIZE;
|
|
474
|
+
</script>
|
|
475
|
+
```
|
|
476
|
+
|
|
477
|
+
```ts
|
|
478
|
+
/**
|
|
479
|
+
* @default "md"
|
|
480
|
+
*/
|
|
481
|
+
size?: "sm" | "md" | "lg";
|
|
482
|
+
```
|
|
483
|
+
|
|
484
|
+
Chained references are also resolved:
|
|
485
|
+
|
|
486
|
+
```svelte
|
|
487
|
+
<script>
|
|
488
|
+
const ACTUAL_VALUE = 42;
|
|
489
|
+
const ALIAS = ACTUAL_VALUE;
|
|
490
|
+
|
|
491
|
+
export let count = ALIAS;
|
|
492
|
+
</script>
|
|
493
|
+
```
|
|
494
|
+
|
|
495
|
+
```ts
|
|
496
|
+
/**
|
|
497
|
+
* @default 42
|
|
498
|
+
*/
|
|
499
|
+
count?: number;
|
|
500
|
+
```
|
|
501
|
+
|
|
502
|
+
Resolution follows up to 5 levels of indirection. Beyond that, the last resolved identifier name is used as the default value. If the identifier cannot be resolved (e.g., it is imported from another module), the variable name is used as-is.
|
|
503
|
+
|
|
504
|
+
When an explicit `@default` annotation is provided, it always takes precedence over the resolved value.
|
|
505
|
+
|
|
422
506
|
### `@typedef`
|
|
423
507
|
|
|
424
508
|
The `@typedef` tag can be used to define a common type that is used multiple times within a component. All typedefs defined in a component will be exported from the generated TypeScript definition file.
|
|
@@ -704,7 +788,7 @@ When `@returns` is omitted, the return type defaults to `void`. When no `@param`
|
|
|
704
788
|
|
|
705
789
|
Use the `@slot` tag for typing component slots. For Svelte 5 runes components, `@snippet` is also supported as an alias. Both are non-standard JSDoc tags.
|
|
706
790
|
|
|
707
|
-
Descriptions are optional for
|
|
791
|
+
Descriptions are optional for every slot, including the default slot: use prose lines in the same `/** */` block above `@slot` / `@snippet`, and/or an inline description on the `@slot` line for named slots.
|
|
708
792
|
|
|
709
793
|
**Signature:**
|
|
710
794
|
|
|
@@ -770,6 +854,32 @@ Omit the `slot-name` to type the default slot.
|
|
|
770
854
|
</p>
|
|
771
855
|
```
|
|
772
856
|
|
|
857
|
+
#### Extra JSDoc tags before `@slot`
|
|
858
|
+
|
|
859
|
+
Tags such as `@example`, `@deprecated`, `@see`, or `@since` that appear **after** the prose description and **before** the `@slot` / `@snippet` line are carried into generated `.d.ts` files: the emitted JSDoc above each slot’s snippet prop (and the traditional `SlotDefs` shape) contains the description, then those tags in source order. The same entries are available on each slot in JSON output as `tags: [{ "name", "body" }, ...]`.
|
|
860
|
+
|
|
861
|
+
Put `@slot` / `@snippet` last in the block (`description` → optional extra tags → slot tag). Tags placed after `@slot` / `@snippet` in the same comment are not tied to that slot. Unknown tag names are passed through as-is (no allowlist). Markdown docs do not render slot descriptions or these tags yet; use TypeScript hover or JSON for that metadata.
|
|
862
|
+
|
|
863
|
+
**Example (default slot with `@example` and `@deprecated`):**
|
|
864
|
+
|
|
865
|
+
````svelte
|
|
866
|
+
<script>
|
|
867
|
+
/**
|
|
868
|
+
* Spread `props` onto a custom element.
|
|
869
|
+
* @example
|
|
870
|
+
* ```svelte
|
|
871
|
+
* <Item let:props>
|
|
872
|
+
* <a {...props} href="/">Home</a>
|
|
873
|
+
* </Item>
|
|
874
|
+
* ```
|
|
875
|
+
* @deprecated Prefer the `link` snippet.
|
|
876
|
+
* @slot {{ props?: { class: string } }}
|
|
877
|
+
*/
|
|
878
|
+
</script>
|
|
879
|
+
|
|
880
|
+
<slot props={{ class: "bx--link" }} />
|
|
881
|
+
````
|
|
882
|
+
|
|
773
883
|
#### Svelte 5 Snippet Compatibility
|
|
774
884
|
|
|
775
885
|
For Svelte 5 compatibility, `sveld` automatically generates optional snippet props for all slots. This allows consumers to use either the traditional slot syntax or Svelte 5's `{#snippet}` syntax.
|
package/lib/ComponentParser.d.ts
CHANGED
|
@@ -92,6 +92,14 @@ interface ComponentSlot {
|
|
|
92
92
|
slot_props?: string;
|
|
93
93
|
/** Description extracted from JSDoc `@slot` or `@snippet` tags */
|
|
94
94
|
description?: string;
|
|
95
|
+
/**
|
|
96
|
+
* JSDoc tags that appeared after the prose description and before `@slot` / `@snippet`
|
|
97
|
+
* (e.g. `@example`, `@deprecated`), in source order.
|
|
98
|
+
*/
|
|
99
|
+
tags?: Array<{
|
|
100
|
+
name: string;
|
|
101
|
+
body: string;
|
|
102
|
+
}>;
|
|
95
103
|
}
|
|
96
104
|
/**
|
|
97
105
|
* Event that is forwarded from a child component or element.
|
|
@@ -520,6 +528,11 @@ export default class ComponentParser {
|
|
|
520
528
|
* ```
|
|
521
529
|
*/
|
|
522
530
|
private processInitializer;
|
|
531
|
+
/**
|
|
532
|
+
* Look up a local variable's initializer AST node by name.
|
|
533
|
+
* Returns the init node if found, or undefined.
|
|
534
|
+
*/
|
|
535
|
+
private resolveLocalVarInitializer;
|
|
523
536
|
/**
|
|
524
537
|
* Unwraps `$bindable(...)` calls so defaults are documented as their underlying values.
|
|
525
538
|
*/
|