Skip to content

Commit d33eff4

Browse files
authored
Merge pull request #35 from sveltejs/master
Sync Fork from Upstream Repo
2 parents 0e89cd2 + b9368d5 commit d33eff4

File tree

5 files changed

+28
-27
lines changed

5 files changed

+28
-27
lines changed

site/content/docs/01-component-format.md

Lines changed: 15 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -147,24 +147,7 @@ If a statement consists entirely of an assignment to an undeclared variable, Sve
147147

148148
---
149149

150-
A *store* is any object that allows reactive access to a value via a simple *store contract*.
151-
152-
The [`svelte/store` module](docs#svelte_store) contains minimal store implementations which fulfil this contract. You can use these as the basis for your own stores, or you can implement your stores from scratch.
153-
154-
A store must contain a `.subscribe` method, which must accept as its argument a subscription function. This subscription function must be immediately and synchronously called with the store's current value upon calling `.subscribe`. All of a store's active subscription functions must later be synchronously called whenever the store's value changes. The `.subscribe` method must also return an unsubscription function. Calling an unsubscription function must stop its subscription, and its corresponding subscription function must not be called again by the store.
155-
156-
A store may optionally contain a `.set` method, which must accept as its argument a new value for the store, and which synchronously calls all of the store's active subscription functions. Such a store is called a *writable store*.
157-
158-
```js
159-
const unsubscribe = store.subscribe(value => {
160-
console.log(value);
161-
}); // logs `value`
162-
163-
// later...
164-
unsubscribe();
165-
```
166-
167-
---
150+
A *store* is an object that allows reactive access to a value via a simple *store contract*. The [`svelte/store` module](docs#svelte_store) contains minimal store implementations which fulfil this contract.
168151

169152
Any time you have a reference to a store, you can access its value inside a component by prefixing it with the `$` character. This causes Svelte to declare the prefixed variable, and set up a store subscription that will be unsubscribed when appropriate.
170153

@@ -189,6 +172,20 @@ Local variables (that do not represent store values) must *not* have a `$` prefi
189172
</script>
190173
```
191174

175+
##### Store contract
176+
177+
```js
178+
store = { subscribe: (subscription: (value: any) => void) => () => void, set?: (value: any) => void }
179+
```
180+
181+
You can create your own stores without relying on [`svelte/store`](docs#svelte_store), by implementing the *store contract*:
182+
183+
1. A store must contain a `.subscribe` method, which must accept as its argument a subscription function. This subscription function must be immediately and synchronously called with the store's current value upon calling `.subscribe`. All of a store's active subscription functions must later be synchronously called whenever the store's value changes.
184+
2. The `.subscribe` method must return an unsubscribe function. Calling an unsubscribe function must stop its subscription, and its corresponding subscription function must not be called again by the store.
185+
3. A store may *optionally* contain a `.set` method, which must accept as its argument a new value for the store, and which synchronously calls all of the store's active subscription functions. Such a store is called a *writable store*.
186+
187+
For interoperability with RxJS Observables, the `.subscribe` method is also allowed to return an object with an `.unsubscribe` method, rather than return the unsubscription function directly. Note however that unless `.subscribe` synchronously calls the subscription (which is not required by the Observable spec), Svelte will see the value of the store as `undefined` until it does.
188+
192189

193190
### &lt;script context="module"&gt;
194191

site/content/docs/02-template-syntax.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1018,7 +1018,7 @@ DOMRect {
10181018
​top: number,
10191019
width: number,
10201020
x: number,
1021-
y:number
1021+
y: number
10221022
}
10231023
```
10241024

site/content/docs/03-run-time.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -214,7 +214,11 @@ Events dispatched from child components can be listened to in their parent. Any
214214

215215
### `svelte/store`
216216

217-
The `svelte/store` module exports functions for creating [stores](docs#4_Prefix_stores_with_$_to_access_their_values).
217+
The `svelte/store` module exports functions for creating [readable](docs#readable), [writable](docs#writable) and [derived](docs#derived) stores.
218+
219+
Keep in mind that you don't *have* to use these functions to enjoy the [reactive `$store` syntax](docs#4_Prefix_stores_with_$_to_access_their_values) in your components. Any object that correctly implements `.subscribe`, unsubscribe, and (optionally) `.set` is a valid store, and will work both with the special syntax, and with Svelte's built-in [`derived` stores](docs#derived).
220+
221+
This makes it possible to wrap almost any other reactive state handling library for use in Svelte. Read more about the [store contract](docs#Store_contract) to see what a correct implementation looks like.
218222

219223
#### `writable`
220224

src/compiler/compile/Component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -472,7 +472,7 @@ export default class Component {
472472
if (variable.writable && !(variable.referenced || variable.referenced_from_script || variable.subscribable)) {
473473
this.warn(declarator, {
474474
code: `unused-export-let`,
475-
message: `${this.name.name} has unused export property '${name}'. If it is for external reference only, please consider using \`export const '${name}'\``
475+
message: `${this.name.name} has unused export property '${name}'. If it is for external reference only, please consider using \`export const ${name}\``
476476
});
477477
}
478478
});
@@ -495,7 +495,7 @@ export default class Component {
495495
if (variable.writable && !(variable.referenced || variable.referenced_from_script || variable.subscribable)) {
496496
this.warn(specifier, {
497497
code: `unused-export-let`,
498-
message: `${this.name.name} has unused export property '${specifier.exported.name}'. If it is for external reference only, please consider using \`export const '${specifier.exported.name}'\``
498+
message: `${this.name.name} has unused export property '${specifier.exported.name}'. If it is for external reference only, please consider using \`export const ${specifier.exported.name}\``
499499
});
500500
}
501501
}

test/validator/samples/unreferenced-variables/warnings.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"column": 12,
77
"line": 8
88
},
9-
"message": "Component has unused export property 'd'. If it is for external reference only, please consider using `export const 'd'`",
9+
"message": "Component has unused export property 'd'. If it is for external reference only, please consider using `export const d`",
1010
"pos": 102,
1111
"start": {
1212
"character": 102,
@@ -21,7 +21,7 @@
2121
"column": 15,
2222
"line": 8
2323
},
24-
"message": "Component has unused export property 'e'. If it is for external reference only, please consider using `export const 'e'`",
24+
"message": "Component has unused export property 'e'. If it is for external reference only, please consider using `export const e`",
2525
"pos": 105,
2626
"start": {
2727
"character": 105,
@@ -36,7 +36,7 @@
3636
"column": 18,
3737
"line": 9
3838
},
39-
"message": "Component has unused export property 'g'. If it is for external reference only, please consider using `export const 'g'`",
39+
"message": "Component has unused export property 'g'. If it is for external reference only, please consider using `export const g`",
4040
"pos": 125,
4141
"start": {
4242
"character": 125,
@@ -51,7 +51,7 @@
5151
"column": 18,
5252
"line": 10
5353
},
54-
"message": "Component has unused export property 'h'. If it is for external reference only, please consider using `export const 'h'`",
54+
"message": "Component has unused export property 'h'. If it is for external reference only, please consider using `export const h`",
5555
"pos": 145,
5656
"start": {
5757
"character": 145,
@@ -66,7 +66,7 @@
6666
"column": 25,
6767
"line": 12
6868
},
69-
"message": "Component has unused export property 'j'. If it is for external reference only, please consider using `export const 'j'`",
69+
"message": "Component has unused export property 'j'. If it is for external reference only, please consider using `export const j`",
7070
"pos": 187,
7171
"start": {
7272
"character": 187,

0 commit comments

Comments
 (0)