@cocreate/state 1.29.0 → 2.0.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.
- package/.github/FUNDING.yml +1 -1
- package/.github/workflows/automated.yml +18 -7
- package/CHANGELOG.md +423 -392
- package/CONTRIBUTING.md +6 -6
- package/README.md +241 -48
- package/demo/iframe.html +1 -1
- package/demo/index.html +3 -3
- package/demo/pass-prefix.html +2 -2
- package/demo/pass-value-input.1.html +2 -2
- package/demo/pass-value-input.html +11 -11
- package/demo/pass-value.html +1 -1
- package/demo/test.html +1 -1
- package/docs/index.html +7 -7
- package/package.json +9 -9
- package/src/index.js +371 -69
- package/test/hidden-state.test.cjs +21 -0
- package/test/source-state-order.test.cjs +84 -0
package/CONTRIBUTING.md
CHANGED
|
@@ -1,19 +1,19 @@
|
|
|
1
1
|
# Contributing to CoCreate-state
|
|
2
2
|
|
|
3
|
-
This project is work of [many contributors](https://github.com/
|
|
4
|
-
You're encouraged to submit [pull requests](https://github.com/
|
|
5
|
-
[propose features and discuss issues](https://github.com/
|
|
3
|
+
This project is work of [many contributors](https://github.com/CoCreateJS/state/graphs/contributors).
|
|
4
|
+
You're encouraged to submit [pull requests](https://github.com/CoCreateJS/state/pulls),
|
|
5
|
+
[propose features and discuss issues](https://github.com/CoCreateJS/state/issues).
|
|
6
6
|
|
|
7
7
|
In the examples below, substitute your Github username for `contributor` in URLs.
|
|
8
8
|
|
|
9
9
|
## Fork the Project
|
|
10
10
|
|
|
11
|
-
Fork the [project on Github](https://github.com/
|
|
11
|
+
Fork the [project on Github](https://github.com/CoCreateJS/state) and check out your copy.
|
|
12
12
|
|
|
13
13
|
```
|
|
14
14
|
git state https://github.com/contributor/CoCreate-state.git
|
|
15
15
|
cd CoCreate-state
|
|
16
|
-
git remote add upstream https://github.com/
|
|
16
|
+
git remote add upstream https://github.com/CoCreateJS/state.git
|
|
17
17
|
```
|
|
18
18
|
|
|
19
19
|
## Create a Topic Branch
|
|
@@ -74,7 +74,7 @@ git push origin my-feature-branch
|
|
|
74
74
|
|
|
75
75
|
## Make a Pull Request
|
|
76
76
|
|
|
77
|
-
Go to [https://github.com/
|
|
77
|
+
Go to [https://github.com/CoCreateJS/state](https://github.com/CoCreateJS/state) and select your feature branch.
|
|
78
78
|
Click the 'Pull Request' button and fill out the form. Pull requests are usually reviewed within a few days.
|
|
79
79
|
|
|
80
80
|
## Rebase
|
package/README.md
CHANGED
|
@@ -1,91 +1,284 @@
|
|
|
1
1
|
# CoCreate-state
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
`@cocreate/state` provides declarative state persistence and state-driven UI updates for CoCreate applications. A source element stores selected values under one or more keys, and elements with matching `state-id` attributes replay those values into their attributes, values, classes, or element methods.
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
5
|
+
[Docs and demo](https://CoCreateJS.com/docs/state) | [Changelog](https://github.com/CoCreateJS/state/blob/master/CHANGELOG.md) | [Issues](https://github.com/CoCreateJS/state/issues)
|
|
11
6
|
|
|
12
|
-
|
|
7
|
+
## Installation
|
|
13
8
|
|
|
14
|
-
|
|
9
|
+
### CDN
|
|
15
10
|
|
|
16
|
-
|
|
11
|
+
```html
|
|
12
|
+
<script src="https://cdn.CoCreateJS.com/state/latest/CoCreate-state.min.js"></script>
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
### npm
|
|
16
|
+
|
|
17
|
+
```bash
|
|
18
|
+
npm install @cocreate/state
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
```javascript
|
|
22
|
+
import "@cocreate/state";
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
### yarn
|
|
26
|
+
|
|
27
|
+
```bash
|
|
28
|
+
yarn add @cocreate/state
|
|
29
|
+
```
|
|
17
30
|
|
|
18
|
-
##
|
|
31
|
+
## Core model
|
|
32
|
+
|
|
33
|
+
State has two sides:
|
|
34
|
+
|
|
35
|
+
- A **writer** has `state-to="key"` and one or more `state.*` attributes.
|
|
36
|
+
- A **reader** has `state-id="key"` and receives the stored values associated with that key.
|
|
19
37
|
|
|
20
38
|
```html
|
|
21
|
-
<
|
|
39
|
+
<button
|
|
40
|
+
state-to="profile"
|
|
41
|
+
state.data-name="Ada Lovelace"
|
|
42
|
+
state.data-role="admin"
|
|
43
|
+
>
|
|
44
|
+
Select profile
|
|
45
|
+
</button>
|
|
46
|
+
|
|
47
|
+
<div state-id="profile" data-name="" data-role="">
|
|
48
|
+
Profile details
|
|
49
|
+
</div>
|
|
22
50
|
```
|
|
23
51
|
|
|
52
|
+
When the button is activated, the module stores `{ "data-name": "Ada Lovelace", "data-role": "admin" }` under `profile`, then applies those values to the reader. The reader declares the target attributes because ordinary attributes are only assigned when the target already has that attribute. State keys and IDs can be comma-separated and whitespace is trimmed.
|
|
53
|
+
|
|
54
|
+
## Writer attributes
|
|
55
|
+
|
|
56
|
+
| Attribute | Purpose | Example |
|
|
57
|
+
| --- | --- | --- |
|
|
58
|
+
| `state-to` | One or more comma-separated state keys to write. | `state-to="profile, sidebar"` |
|
|
59
|
+
| `state.*` | Captures an attribute value under the name after `state.`. | `state.name="Ada"` |
|
|
60
|
+
| `state-localstorage` | Writes to local storage instead of session storage. | `state-localstorage` |
|
|
61
|
+
| `state-onstoragechange` | Uses local storage and opts a reader into storage-change reinitialization. | `state-onstoragechange` |
|
|
62
|
+
| `state-title` | Sets the document title used for the history entry. | `state-title="Profile"` |
|
|
63
|
+
|
|
64
|
+
The `state.*` syntax is an attribute namespace. For example, `state.class="selected"` stores a class value under `class`; `state.value=""` reads the writer's current value through `getValue()`.
|
|
65
|
+
|
|
66
|
+
## Reader attributes
|
|
67
|
+
|
|
68
|
+
| Attribute | Purpose | Example |
|
|
69
|
+
| --- | --- | --- |
|
|
70
|
+
| `state-id` | One or more state keys whose values should be applied to the element. | `state-id="profile"` |
|
|
71
|
+
| `state-overwrite` | Allows overwriting by default; set to `false` to preserve existing values. | `state-overwrite="false"` |
|
|
72
|
+
| `state-localstorage` | Reads from local storage instead of session storage. | `state-localstorage` |
|
|
73
|
+
| `state-onstoragechange` | Reads local storage and allows the reader to refresh after a storage event. | `state-onstoragechange` |
|
|
74
|
+
|
|
75
|
+
The reader applies each stored property according to the following rules:
|
|
76
|
+
|
|
77
|
+
- `value` updates the element's value or calls its CoCreate `setValue()` method.
|
|
78
|
+
- `class` adds the stored class names to the existing class list.
|
|
79
|
+
- An ordinary HTML attribute is set only when the reader already declares that attribute; overwrite controls whether its existing value may be replaced.
|
|
80
|
+
- A key beginning with `$` invokes the matching element method or assigns its property. For example, `$focus` can call `focus()` when the target supports it.
|
|
81
|
+
|
|
82
|
+
## Session and local storage
|
|
83
|
+
|
|
84
|
+
By default, state is stored in the CoCreate session storage adapter under the single `state` record. Add `state-localstorage` to the writer and reader to use the local storage adapter instead.
|
|
85
|
+
|
|
24
86
|
```html
|
|
25
|
-
<
|
|
87
|
+
<button
|
|
88
|
+
state-to="theme"
|
|
89
|
+
state-localstorage
|
|
90
|
+
state.mode="dark"
|
|
91
|
+
>
|
|
92
|
+
Dark theme
|
|
93
|
+
</button>
|
|
94
|
+
|
|
95
|
+
<body state-id="theme" state-localstorage>
|
|
96
|
+
...
|
|
97
|
+
</body>
|
|
26
98
|
```
|
|
27
99
|
|
|
28
|
-
|
|
100
|
+
The storage record is a JSON object keyed by state ID:
|
|
29
101
|
|
|
30
|
-
```
|
|
31
|
-
|
|
102
|
+
```json
|
|
103
|
+
{
|
|
104
|
+
"theme": {
|
|
105
|
+
"mode": "dark"
|
|
106
|
+
}
|
|
107
|
+
}
|
|
32
108
|
```
|
|
33
109
|
|
|
34
|
-
|
|
110
|
+
`state-onstoragechange` is also treated as a local-storage marker. Readers with this attribute are reinitialized when a browser `storage` event for the `state` key is received. Storage events normally notify other documents, not the document that performed the write.
|
|
111
|
+
|
|
112
|
+
## Overwrite behavior
|
|
113
|
+
|
|
114
|
+
State overwrites existing reader values by default. No `state-overwrite` attribute is needed:
|
|
35
115
|
|
|
36
|
-
```
|
|
37
|
-
|
|
116
|
+
```html
|
|
117
|
+
<form state-id="offcanvas-app-form" array="" object=""></form>
|
|
118
|
+
<button state-to="offcanvas-app-form" state.array="apps" state.object="first-id">First app</button>
|
|
119
|
+
<button state-to="offcanvas-app-form" state.array="apps" state.object="second-id">Second app</button>
|
|
38
120
|
```
|
|
39
121
|
|
|
40
|
-
|
|
122
|
+
Clicking the buttons in order changes the form's `object` from `first-id` to `second-id`.
|
|
41
123
|
|
|
42
|
-
-
|
|
43
|
-
- [Announcements](#announcements)
|
|
44
|
-
- [Roadmap](#roadmap)
|
|
45
|
-
- [How to Contribute](#how-to-contribute)
|
|
46
|
-
- [About](#about)
|
|
47
|
-
- [License](#license)
|
|
124
|
+
Set `state-overwrite="false"` on the **reader** to preserve its existing nonempty attributes:
|
|
48
125
|
|
|
49
|
-
|
|
126
|
+
```html
|
|
127
|
+
<form state-id="initial-app" state-overwrite="false" array="" object=""></form>
|
|
128
|
+
<button state-to="initial-app" state.array="apps" state.object="first-id">First app</button>
|
|
129
|
+
<button state-to="initial-app" state.array="apps" state.object="second-id">Second app</button>
|
|
130
|
+
```
|
|
50
131
|
|
|
51
|
-
|
|
132
|
+
The first click fills the empty `array` and `object` attributes. The second click leaves those values unchanged. An attribute that already has a nonempty value in the HTML is preserved from the start.
|
|
52
133
|
|
|
53
|
-
|
|
134
|
+
| Reader attribute | Behavior |
|
|
135
|
+
| --- | --- |
|
|
136
|
+
| Omitted | Overwrite existing values (default). |
|
|
137
|
+
| `state-overwrite` or `state-overwrite=""` | Overwrite existing values. |
|
|
138
|
+
| `state-overwrite="true"` | Overwrite existing values. |
|
|
139
|
+
| `state-overwrite="false"` | Preserve existing nonempty values. |
|
|
54
140
|
|
|
55
|
-
|
|
141
|
+
Use the exact value `"false"` to disable overwrite. The stored `overwrite` property does not control this behavior.
|
|
56
142
|
|
|
57
|
-
|
|
143
|
+
This is a check of the reader's current value, not a one-time initialization flag. Clearing a declared attribute to `""` allows state to fill it again. Stored state can still change, and other readers can continue receiving updates.
|
|
58
144
|
|
|
59
|
-
|
|
145
|
+
Readers must declare the ordinary attributes they accept, such as `array=""` and `object=""`; enabling overwrite does not add undeclared attributes. Values, classes, and `$` methods follow the rules below.
|
|
60
146
|
|
|
61
|
-
|
|
147
|
+
## Values, classes, and methods
|
|
62
148
|
|
|
63
|
-
|
|
149
|
+
### Values
|
|
64
150
|
|
|
65
|
-
|
|
151
|
+
An empty `state.value` attribute reads the writer's current value asynchronously:
|
|
66
152
|
|
|
67
|
-
|
|
153
|
+
```html
|
|
154
|
+
<input id="query" value="co">
|
|
155
|
+
<button state-to="search" state.value="">Save search</button>
|
|
156
|
+
<input state-id="search">
|
|
157
|
+
```
|
|
68
158
|
|
|
69
|
-
|
|
159
|
+
If the value is not empty, the literal attribute value is stored. Readers may use native `.value` assignment or `setValue()` depending on the element state and overwrite rules.
|
|
70
160
|
|
|
71
|
-
|
|
161
|
+
### Classes
|
|
72
162
|
|
|
73
|
-
|
|
163
|
+
Class values are split on whitespace and added to the reader without removing existing classes:
|
|
74
164
|
|
|
75
|
-
|
|
165
|
+
```html
|
|
166
|
+
<button state-to="tabs" state.class="active">Current</button>
|
|
167
|
+
<div state-id="tabs" class="tab">Tab</div>
|
|
168
|
+
```
|
|
76
169
|
|
|
77
|
-
|
|
170
|
+
State currently adds classes; it does not provide a declarative class-removal operation.
|
|
78
171
|
|
|
79
|
-
|
|
172
|
+
### Element methods and properties
|
|
80
173
|
|
|
81
|
-
|
|
174
|
+
Keys beginning with `$` are interpreted as element operations:
|
|
82
175
|
|
|
83
|
-
|
|
176
|
+
```html
|
|
177
|
+
<button state-to="focus" state.$focus="">Focus input</button>
|
|
178
|
+
<input state-id="focus">
|
|
179
|
+
```
|
|
84
180
|
|
|
85
|
-
|
|
181
|
+
The target must expose the named property or method. A method receives the stored value as its argument. Unsupported operations are ignored.
|
|
86
182
|
|
|
87
|
-
|
|
183
|
+
## Navigation and browser history
|
|
88
184
|
|
|
89
|
-
|
|
185
|
+
State writes create a history entry at the current URL and include serialized session state, local state, title, and URL in the history state object. `state-title` updates `document.title` before the entry is pushed, falling back to the current document title.
|
|
186
|
+
|
|
187
|
+
The special values `$back` and `$forward` in a stored `src` or `href` request browser history navigation:
|
|
188
|
+
|
|
189
|
+
```html
|
|
190
|
+
<button state-to="navigation" state.href="$back">Back</button>
|
|
191
|
+
<button state-to="navigation" state.href="$forward">Forward</button>
|
|
192
|
+
```
|
|
193
|
+
|
|
194
|
+
When either value is used, the module calls `history.back()` or `history.forward()` and does not write a new state record for that activation. On `popstate`, stored session and local state are restored and all `state-id` readers are initialized again.
|
|
195
|
+
|
|
196
|
+
## Actions integration
|
|
197
|
+
|
|
198
|
+
The module registers a `state` action with `@cocreate/actions`. Action chains can therefore invoke state persistence and wait for the `stateEnd` completion event:
|
|
199
|
+
|
|
200
|
+
```html
|
|
201
|
+
<button
|
|
202
|
+
actions="state, notify"
|
|
203
|
+
state-to="profile"
|
|
204
|
+
state.name="Ada"
|
|
205
|
+
>
|
|
206
|
+
Save
|
|
207
|
+
</button>
|
|
208
|
+
```
|
|
209
|
+
|
|
210
|
+
Direct clicks on `[state-to]` elements are handled automatically. If the clicked element is inside an element whose `actions` attribute contains `state`, the document click handler skips the direct call so the action system can own the operation and completion lifecycle.
|
|
211
|
+
|
|
212
|
+
## JavaScript API
|
|
213
|
+
|
|
214
|
+
The default export exposes the following functions:
|
|
215
|
+
|
|
216
|
+
```javascript
|
|
217
|
+
import CoCreateState from "@cocreate/state";
|
|
218
|
+
|
|
219
|
+
CoCreateState.initElements(document.querySelectorAll("[state-id]"));
|
|
220
|
+
CoCreateState.initElement(document.querySelector("[state-id]"));
|
|
221
|
+
await CoCreateState.stateAttributes(document.querySelector("[state-to]"));
|
|
222
|
+
```
|
|
223
|
+
|
|
224
|
+
### `initElements(elements)`
|
|
225
|
+
|
|
226
|
+
Initializes each reader in an iterable collection. It reads the selected storage record and applies matching state IDs.
|
|
227
|
+
|
|
228
|
+
### `initElement(element)`
|
|
229
|
+
|
|
230
|
+
Initializes one reader. A comma-separated `state-id` applies values from each matching key in order.
|
|
231
|
+
|
|
232
|
+
### `stateAttributes(element)`
|
|
233
|
+
|
|
234
|
+
Collects `state.*` attributes from the clicked or action element, writes them under each `state-to` key, updates matching readers immediately, and dispatches `stateEnd` when complete.
|
|
235
|
+
|
|
236
|
+
## Lifecycle
|
|
237
|
+
|
|
238
|
+
- The module initializes `[state-id]` elements during module load.
|
|
239
|
+
- Added nodes matching `[state-id]` are initialized through `@cocreate/observer`.
|
|
240
|
+
- A document click on the nearest `[state-to]` ancestor triggers a state write unless an enclosing action chain owns `state`.
|
|
241
|
+
- Browser `storage` events refresh readers opted into `state-onstoragechange`.
|
|
242
|
+
- Browser `popstate` restores the state captured in the history entry and reinitializes readers.
|
|
243
|
+
|
|
244
|
+
## Current limitations and implementation notes
|
|
245
|
+
|
|
246
|
+
These points reflect the current implementation and are important when designing integrations:
|
|
247
|
+
|
|
248
|
+
- State is stored as one JSON object under the `state` key in each storage adapter. State values should therefore remain JSON serializable.
|
|
249
|
+
- `state-localstorage` and `state-onstoragechange` select local storage for both writers and readers. A reader using only session storage will not see a local state key.
|
|
250
|
+
- State writers call `_getStateId()` immediately, so matching readers update before the storage write completes. Storage and reader updates are intentionally coupled.
|
|
251
|
+
- Class state is additive. Writing a new class does not remove a previous state class.
|
|
252
|
+
- Ordinary attribute assignment requires the reader to declare the target attribute. Overwrite is enabled by default; `state-overwrite="false"` preserves nonempty existing attributes.
|
|
253
|
+
- The source checks `element.closest("href")` when deciding whether to push history. `href` is normally an attribute on an anchor rather than an HTML element name, so links should be tested carefully; this is a likely navigation bug and should be reviewed before relying on it.
|
|
254
|
+
- `init()` registers global click, storage, load, and popstate listeners immediately when the module is imported. Applications should avoid loading the module more than once.
|
|
255
|
+
- There is no built-in state deletion or reset attribute. Clearing a key currently requires writing a new state object through the storage adapter or adding an explicit integration.
|
|
256
|
+
|
|
257
|
+
## Troubleshooting
|
|
258
|
+
|
|
259
|
+
### A reader does not update
|
|
260
|
+
|
|
261
|
+
Confirm that its `state-id` exactly matches a `state-to` key, including whitespace after comma splitting. Confirm that the reader and writer select the same storage type and that the stored state JSON is valid.
|
|
262
|
+
|
|
263
|
+
### A value is not replaced
|
|
264
|
+
|
|
265
|
+
Check whether the reader has `state-overwrite="false"`. Remove it to restore the default overwrite behavior. For ordinary attributes, also ensure the reader declares the target attribute.
|
|
266
|
+
|
|
267
|
+
### Another tab does not refresh
|
|
268
|
+
|
|
269
|
+
Use `state-localstorage` or `state-onstoragechange` on the reader. The browser storage event is cross-document and does not fire in the same document that performed the write.
|
|
270
|
+
|
|
271
|
+
### The action chain continues too early
|
|
272
|
+
|
|
273
|
+
Use the registered action name `state` and ensure the action element receives the `stateEnd` event. Direct calls to a custom wrapper must await `stateAttributes()` when sequencing depends on completion.
|
|
274
|
+
|
|
275
|
+
## Contributing
|
|
276
|
+
|
|
277
|
+
Please read the [contributing guide](https://github.com/CoCreateJS/state/blob/master/CONTRIBUTING.md), open an [issue](https://github.com/CoCreateJS/state/issues), or submit a pull request. Changes to storage selection, state shape, attribute assignment, history behavior, and the `stateEnd` event are compatibility-sensitive and should include documentation and examples.
|
|
278
|
+
|
|
279
|
+
## License
|
|
280
|
+
|
|
281
|
+
This software is dual-licensed under the GNU Affero General Public License version 3 (AGPLv3) and a commercial license.
|
|
90
282
|
|
|
91
|
-
|
|
283
|
+
- **Open source use:** For open-source projects and non-commercial use, the software is available under the AGPLv3. See the [LICENSE file](https://github.com/CoCreateJS/state/blob/master/LICENSE).
|
|
284
|
+
- **Commercial use:** For-profit use requires a commercial license from [CoCreate](https://CoCreateJS.com).
|
package/demo/iframe.html
CHANGED
package/demo/index.html
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
<!-- CoCreate CSS CDN -->
|
|
13
13
|
<link
|
|
14
14
|
rel="stylesheet"
|
|
15
|
-
href="https://cdn.
|
|
15
|
+
href="https://cdn.CoCreateJS.com/state/latest/CoCreate-state.min.css"
|
|
16
16
|
type="text/css" />
|
|
17
17
|
<link rel="manifest" href="/manifest.webmanifest" />
|
|
18
18
|
</head>
|
|
@@ -80,7 +80,7 @@
|
|
|
80
80
|
|
|
81
81
|
<button>
|
|
82
82
|
<a
|
|
83
|
-
href="https://server.
|
|
83
|
+
href="https://server.CoCreateJS.com/CoCreate-attributes/CoCreate-attibutes.html"
|
|
84
84
|
target="_blank"
|
|
85
85
|
state-array="modules"
|
|
86
86
|
state-object="5ebc16fc8917bc59483a7e3b"
|
|
@@ -183,6 +183,6 @@
|
|
|
183
183
|
<div id="modal-viewport"></div>
|
|
184
184
|
|
|
185
185
|
<!--<script src="../dist/CoCreate-state.js"></script>-->
|
|
186
|
-
<script src="https://
|
|
186
|
+
<script src="https://CoCreateJS.com/dist/CoCreate.js"></script>
|
|
187
187
|
</body>
|
|
188
188
|
</html>
|
package/demo/pass-prefix.html
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
<!-- CoCreate CSS CDN -->
|
|
13
13
|
<link
|
|
14
14
|
rel="stylesheet"
|
|
15
|
-
href="https://cdn.
|
|
15
|
+
href="https://cdn.CoCreateJS.com/state/latest/CoCreate-state.min.css"
|
|
16
16
|
type="text/css" />
|
|
17
17
|
<link rel="manifest" href="/manifest.webmanifest" />
|
|
18
18
|
</head>
|
|
@@ -44,6 +44,6 @@
|
|
|
44
44
|
<div id="modal-viewport"></div>
|
|
45
45
|
|
|
46
46
|
<!--CoCreateJS CDN-->
|
|
47
|
-
<script src="https://cdn.
|
|
47
|
+
<script src="https://cdn.CoCreateJS.com/state/latest/CoCreate-state.min.js"></script>
|
|
48
48
|
</body>
|
|
49
49
|
</html>
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
placeholder="Test 2"></textarea>
|
|
44
44
|
</form>
|
|
45
45
|
|
|
46
|
-
<!--<script src="https://
|
|
47
|
-
<script src="https://
|
|
46
|
+
<!--<script src="https://CoCreateJS.com/dist/CoCreate.js"></script>-->
|
|
47
|
+
<script src="https://CoCreateJS.com/dist/CoCreate.js"></script>
|
|
48
48
|
</body>
|
|
49
49
|
</html>
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
<!
|
|
1
|
+
<!doctype html>
|
|
2
2
|
<html lang="en">
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
3
|
+
<body class="padding:5px">
|
|
4
|
+
<input state_id="test" />
|
|
5
|
+
<a actions="state" state-value="hello" state_to="test"
|
|
6
|
+
>Click to state: hello</a
|
|
7
|
+
>
|
|
8
|
+
<a actions="state" state-value="goodbye" state_to="test"
|
|
9
|
+
>Click to state: goodbye</a
|
|
10
|
+
>
|
|
11
11
|
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
<script src="https://CoCreateJS.com/dist/CoCreate.js"></script>
|
|
13
|
+
</body>
|
|
14
14
|
</html>
|
package/demo/pass-value.html
CHANGED
package/demo/test.html
CHANGED
package/docs/index.html
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
rel="icon"
|
|
10
10
|
type="image/png"
|
|
11
11
|
sizes="32x32"
|
|
12
|
-
href="https://
|
|
12
|
+
href="https://CoCreateJS.com/images/favicon.ico" />
|
|
13
13
|
<meta
|
|
14
14
|
name="description"
|
|
15
15
|
content="Data attributes which can be used for components in CoCreate framework combined as a group of attributes that dynamically change attributes & fetch custom data" />
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
<meta name="robots" content="index,follow" />
|
|
20
20
|
<meta
|
|
21
21
|
property="og:image"
|
|
22
|
-
content="https://cdn.
|
|
22
|
+
content="https://cdn.CoCreateJS.com/docs/state.png" />
|
|
23
23
|
|
|
24
24
|
<link
|
|
25
25
|
rel="stylesheet"
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
share-title="CoCreate-state"
|
|
74
74
|
share-height="600"
|
|
75
75
|
share-width="700"
|
|
76
|
-
share-media="https://cdn.
|
|
76
|
+
share-media="https://cdn.CoCreateJS.com/docs/state.png"
|
|
77
77
|
hover="display:block!important"
|
|
78
78
|
hover-query=".social-networks">
|
|
79
79
|
<div class="display:none social-networks">
|
|
@@ -104,7 +104,7 @@
|
|
|
104
104
|
></a>
|
|
105
105
|
</div>
|
|
106
106
|
<a
|
|
107
|
-
href="https://github.com/
|
|
107
|
+
href="https://github.com/CoCreateJS/CoCreate-state"
|
|
108
108
|
target="_blank"
|
|
109
109
|
class="margin-right:15px"
|
|
110
110
|
><i src="/assets/svg/github.svg"></i
|
|
@@ -142,7 +142,7 @@
|
|
|
142
142
|
<p class="padding:10px_0px line-height:1.5">
|
|
143
143
|
Or you can use cdn link:
|
|
144
144
|
</p>
|
|
145
|
-
<pre><code class="language-html"><script>https://cdn.
|
|
145
|
+
<pre><code class="language-html"><script>https://cdn.CoCreateJS.com/state/latest/CoCreate-state.min.js</script></code></pre>
|
|
146
146
|
|
|
147
147
|
<div
|
|
148
148
|
id="state-usage"
|
|
@@ -327,13 +327,13 @@
|
|
|
327
327
|
</div>
|
|
328
328
|
</div>
|
|
329
329
|
<button
|
|
330
|
-
href="https://github.com/
|
|
330
|
+
href="https://github.com/CoCreateJS/CoCreate-state/tree/master/docs/index.html?message=docs%3A%20describe%20your%20change..."
|
|
331
331
|
target="_blank"
|
|
332
332
|
class="display:flex justify-content:center align-items:center position:fixed bottom:15px right:15px height:50px width:50px border-radius:50% box-shadow:0px_2px_10px_0px_rgba(0,_0,_0,_0.4)">
|
|
333
333
|
<i src="../assets/svg/pencil-alt.svg"></i>
|
|
334
334
|
</button>
|
|
335
335
|
</main>
|
|
336
336
|
|
|
337
|
-
<script src="https://
|
|
337
|
+
<script src="https://CoCreateJS.com/dist/CoCreate.js"></script>
|
|
338
338
|
</body>
|
|
339
339
|
</html>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cocreate/state",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0",
|
|
4
4
|
"description": "Data attributes which can be used for components in CoCreate framework combined as a group of attributes that dynamically change attributes & fetch custom data.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"state",
|
|
@@ -22,28 +22,28 @@
|
|
|
22
22
|
},
|
|
23
23
|
"repository": {
|
|
24
24
|
"type": "git",
|
|
25
|
-
"url": "git+https://github.com/
|
|
25
|
+
"url": "git+https://github.com/CoCreateJS/state.git"
|
|
26
26
|
},
|
|
27
27
|
"author": "CoCreate LLC",
|
|
28
28
|
"license": "AGPL-3.0",
|
|
29
29
|
"bugs": {
|
|
30
|
-
"url": "https://github.com/
|
|
30
|
+
"url": "https://github.com/CoCreateJS/state/issues"
|
|
31
31
|
},
|
|
32
|
-
"homepage": "https://
|
|
32
|
+
"homepage": "https://CoCreateJS.com/docs/state",
|
|
33
33
|
"funding": {
|
|
34
34
|
"type": "GitHub Sponsors ❤",
|
|
35
|
-
"url": "https://github.com/sponsors/
|
|
35
|
+
"url": "https://github.com/sponsors/CoCreateJS"
|
|
36
36
|
},
|
|
37
37
|
"main": "./src/index.js",
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@cocreate/actions": "^1.24.0",
|
|
40
|
-
"@cocreate/crud-client": "^1.
|
|
40
|
+
"@cocreate/crud-client": "^1.37.0",
|
|
41
41
|
"@cocreate/element-prototype": "^1.35.0",
|
|
42
|
-
"@cocreate/local-storage": "^1.
|
|
43
|
-
"@cocreate/observer": "^1.
|
|
42
|
+
"@cocreate/local-storage": "^1.20.0",
|
|
43
|
+
"@cocreate/observer": "^1.23.0"
|
|
44
44
|
},
|
|
45
45
|
"devDependencies": {
|
|
46
|
-
"@cocreate/webpack": "^1.
|
|
46
|
+
"@cocreate/webpack": "^1.9.0"
|
|
47
47
|
},
|
|
48
48
|
"allowScripts": {
|
|
49
49
|
"@cocreate/actions@1.21.4": true,
|