Remove ability to use key with `data-persist` (#788)

* Remove ability to use key with `data-persist`

* Fix example and test

* Update link
This commit is contained in:
Ben Croker 2025-03-23 08:35:42 -06:00 committed by GitHub
parent 09bd26ccd2
commit e28bb58eee
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
12 changed files with 50 additions and 56 deletions

View File

@ -25,4 +25,5 @@ Each tagged version of Datastar is accompanied by a release note. Read the [rele
### Removed
- Removed the ability to use a key with the `data-persist` attribute.
- Removed settling from SSE events, which has become redundant ([#764](https://github.com/starfederation/datastar/issues/764)).

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -8,24 +8,19 @@ import {
type AttributePlugin,
type NestedValues,
PluginType,
Requirement,
} from '../../../../engine/types'
import { kebab, modifyCasing, trimDollarSignPrefix } from '../../../../utils/text'
import { trimDollarSignPrefix } from '../../../../utils/text'
const SESSION = 'session'
export const Persist: AttributePlugin = {
type: PluginType.Attribute,
name: 'persist',
keyReq: Requirement.Denied,
mods: new Set([SESSION]),
onLoad: ({ key, effect, mods, signals, value }) => {
if (key === '') {
key = DATASTAR
} else {
// Default to kebab-case and allow modifying
key = kebab(key)
key = modifyCasing(key, mods)
}
onLoad: ({ effect, mods, signals, value }) => {
const key = DATASTAR
const storage = mods.has(SESSION) ? sessionStorage : localStorage
let paths = value.split(/\s+/).filter((p) => p !== '')
paths = paths.map((p) => trimDollarSignPrefix(p))

4
sdk/go/consts.go generated
View File

@ -7,8 +7,8 @@ import "time"
const (
DatastarKey = "datastar"
Version = "1.0.0-beta.9"
VersionClientByteSize = 39632
VersionClientByteSizeGzip = 14845
VersionClientByteSize = 39610
VersionClientByteSizeGzip = 14830
//region Default durations

View File

@ -240,6 +240,15 @@ templ OnValueRequired(name string, info *RuntimeErrorInfo) {
}
}
templ PersistKeyNotAllowed(name string, info *RuntimeErrorInfo) {
@RuntimeErrorView(name, info) {
@keyNotAllowed("persist", info.Expression.Key)
<p>The <code>data-persist</code> attribute must <em>not</em> have a key. If one or more space-separated values are provided as a string, only those signals are persisted.</p>
@sampleCode("Example", "html", `<div data-persist="foo bar"></div>`)
@attributeDocs("persist")
}
}
templ RefKeyAndValueProvided(name string, info *RuntimeErrorInfo) {
@RuntimeErrorView(name, info) {
@keyAndValueProvided("ref")
@ -486,7 +495,7 @@ templ replaceUrlError() {
}
templ scrollIntoViewError() {
<p> The <code>data-scroll-into-view</code> attribute must <em>not</em> have a key <em>nor</em> a value.</p>
<p>The <code>data-scroll-into-view</code> attribute must <em>not</em> have a key <em>nor</em> a value.</p>
@sampleCode("Example", "html", `<div data-scroll-into-view></div>`)
@attributeDocs("scroll-into-view")
}

View File

@ -16,7 +16,7 @@ func TestExamplePersist(t *testing.T) {
expected := "foo"
checkLocalStorage := func() string {
fromLocalStorage := page.MustEval(`k => localStorage[k]`, "foo")
fromLocalStorage := page.MustEval(`k => localStorage[k]`, "datastar")
marshalled := fromLocalStorage.String()
c, err := gabs.ParseJSON([]byte(marshalled))
assert.NoError(t, err)

View File

@ -1,6 +1,6 @@
## Demo
<div data-signals="{namespace: {test1: 'foo', test2: 'bar', test3: 'baz'}}" data-persist-foo="namespace.test1 namespace.test3">
<div data-signals="{namespace: {test1: 'foo', test2: 'bar', test3: 'baz'}}" data-persist="namespace.test1 namespace.test3">
<input id="keyInput1" data-bind="namespace.test1" class="input input-bordered" />
<br>
<input data-bind="namespace.test2" class="input input-bordered" />
@ -14,7 +14,7 @@
```html
<div
data-signals="{namespace: {test1: 'foo', test2: 'bar', test3: 'baz'}}"
data-persist-foo="namespace.test1 namespace.test3"
data-persist="namespace.test1 namespace.test3"
>
<input data-bind="namespace.test1" />
<input data-bind="namespace.test2" />
@ -27,4 +27,4 @@ Look at your Local Storage in your browser's developer tools.
In this example we are caching the `namespace.test1` and `namespace.test3` values in the Local Storage.
If you don't use any values it will cache the entire signals.
If you don't use any values it will cache all signals.

View File

@ -534,4 +534,4 @@ This toggles the values of all signals containing `form.` (to either `true` or `
</button>
</div>
View the [attribute plugins reference](/reference/attribute_plugins).
View the [full reference](/reference/overview).

View File

@ -186,7 +186,7 @@ The signal name can be specified in the key (as above), or in the value (as belo
The signal value can then be used to reference the element.
```html
`foo` holds a <span data-text="$foo.tagName"></span> element.
`$foo` holds a <span data-text="$foo.tagName"></span> element.
```
#### Modifiers
@ -395,25 +395,14 @@ If one or more space-separated values are provided as a string, only those signa
<div data-persist="foo bar"></div>
```
If a key is provided, it will be used as the key when saving in storage, otherwise `datastar` will be used.
```html
<div data-persist-mykey="foo bar"></div>
```
#### Modifiers
Modifiers allow you to modify the key and storage target.
Modifiers allow you to modify the storage target.
- `__case` - Converts the casing of the key.
- `.camel` - Camel case: `myKey`
- `.kebab` - Kebab case: `my-key` (default)
- `.snake` - Snake case: `my_key`
- `.pascal` - Pascal case: `MyKey`
- `__session` - Persists signals in Session Storage.
```html
<div data-persist-my-key__case.kebab__session></div>
<div data-persist__session="foo bar"></div>
```
### `data-replace-url`