@converse/skeletor 0.0.8 → 0.0.9
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 +38 -25
- package/dist/skeletor.js +9232 -5096
- package/dist/skeletor.js.map +1 -1
- package/dist/skeletor.min.js +74 -3
- package/dist/skeletor.min.js.map +1 -1
- package/package.json +21 -11
- package/src/collection.js +540 -395
- package/src/drivers/sessionStorage.js +222 -219
- package/src/element.js +132 -82
- package/src/eventemitter.js +187 -0
- package/src/helpers.js +143 -118
- package/src/{main.js → index.js} +21 -17
- package/src/listening.js +81 -0
- package/src/model.js +340 -238
- package/src/storage.js +222 -230
- package/src/types/collection.d.ts +366 -0
- package/src/types/collection.d.ts.map +1 -0
- package/src/types/drivers/sessionStorage.d.ts +37 -0
- package/src/types/drivers/sessionStorage.d.ts.map +1 -0
- package/src/types/element.d.ts +115 -0
- package/src/types/element.d.ts.map +1 -0
- package/src/types/eventemitter.d.ts +93 -0
- package/src/types/eventemitter.d.ts.map +1 -0
- package/src/types/helpers.d.ts +62 -0
- package/src/types/helpers.d.ts.map +1 -0
- package/src/types/index.d.ts +19 -0
- package/src/types/index.d.ts.map +1 -0
- package/src/types/listening.d.ts +40 -0
- package/src/types/listening.d.ts.map +1 -0
- package/src/types/model.d.ts +230 -0
- package/src/types/model.d.ts.map +1 -0
- package/src/types/storage.d.ts +35 -0
- package/src/types/storage.d.ts.map +1 -0
- package/src/types/utils/events.d.ts +28 -0
- package/src/types/utils/events.d.ts.map +1 -0
- package/src/utils/events.js +174 -0
- package/src/drivers/sessionStorage.js~ +0 -307
- package/src/events.js +0 -328
- package/src/history.js +0 -301
- package/src/overview.js +0 -191
- package/src/router.js +0 -119
- package/src/view.js +0 -267
package/README.md
CHANGED
|
@@ -1,19 +1,22 @@
|
|
|
1
1
|
# Skeletor
|
|
2
2
|
|
|
3
3
|
[](https://inverse.chat/#converse/room?jid=discuss@conference.conversejs.org)
|
|
4
|
-
[](https://github.com/conversejs/skeletor/actions/workflows/karma-tests.yml)
|
|
5
5
|
|
|
6
|
-
Skeletor is a [Backbone](http://backbonejs.org)
|
|
6
|
+
Skeletor is a modernization of [Backbone](http://backbonejs.org)'s Models and Collections,
|
|
7
|
+
while getting rid of the old Views.
|
|
8
|
+
|
|
9
|
+
It provides you with a more modern Backbone-like way to manage state.
|
|
7
10
|
|
|
8
11
|
## Introduction
|
|
9
12
|
|
|
10
|
-
The goal of Skeletor
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
updates only the changed parts of the DOM, similarly to basically
|
|
14
|
-
JavaScript frameworks.
|
|
13
|
+
The original goal of Skeletor was to modernize Backbone to allow writing
|
|
14
|
+
declarative view code instead of the imperative code (e.g. manually adding and
|
|
15
|
+
removing DOM nodes). In other words, to allow for component-based code that
|
|
16
|
+
automatically updates only the changed parts of the DOM, similarly to basically
|
|
17
|
+
all modern JavaScript frameworks.
|
|
15
18
|
|
|
16
|
-
The original Backbone Views aren't components can't be rendered in a nested and
|
|
19
|
+
The original Backbone Views aren't components and can't be rendered in a nested and
|
|
17
20
|
declarative way. Instead, it's up to you to manually make sure that these views
|
|
18
21
|
are rendered in the correct place in the DOM. This approach becomes unwieldy,
|
|
19
22
|
difficult and fragile as your site becomes larger and more complex.
|
|
@@ -23,44 +26,53 @@ which is very similar to the original Backbone `View` but which is also a web
|
|
|
23
26
|
component that gets instantiated automatically as soon as its rendered in the
|
|
24
27
|
DOM.
|
|
25
28
|
|
|
26
|
-
|
|
29
|
+
The thing is, [Lit](https://lit.dev) Elements already provide anything one
|
|
30
|
+
might need for a modern Backbone-line application. There's not really a need
|
|
31
|
+
for the `ElementView` anymore, except to provide an upgrade path from a
|
|
32
|
+
Backbone app to one that uses web components. It'll therefore likely be removed
|
|
33
|
+
entirely in a future version, thereby leaving only Models and Collections, for
|
|
34
|
+
managing state.
|
|
27
35
|
|
|
28
|
-
|
|
29
|
-
XMPP webchat client to use web components (using [LitElement](https://lit-element.polymer-project.org/))
|
|
30
|
-
without requiring us to put everything on hold in order to do a massive rewrite.
|
|
36
|
+
## Installation
|
|
31
37
|
|
|
32
|
-
|
|
38
|
+
```
|
|
39
|
+
npm install @converse/skeletor
|
|
40
|
+
```
|
|
33
41
|
|
|
34
|
-
|
|
35
|
-
(more accurately, "custom elements"), this allows us to declaratively render the
|
|
36
|
-
UI, while we're progressively getting rid of the views.
|
|
42
|
+
## Changes from Backbone
|
|
37
43
|
|
|
38
|
-
|
|
44
|
+
We've made big, backwards incompatible changes in version 2:
|
|
39
45
|
|
|
40
|
-
|
|
46
|
+
- Removed the old `View` type
|
|
47
|
+
- Removed the old `Events` constructor function and instead added the `EventsEmitter` mixin class.
|
|
48
|
+
- Removed the `Router` and `History` classes.
|
|
49
|
+
- All other types (`Model`, `Collection`, `ElementView`) are now ES6 classes.
|
|
41
50
|
|
|
51
|
+
### Sekeletor adds the following changes to Backbone
|
|
52
|
+
|
|
53
|
+
* Added TypeScript type declarations (generated from typed JSDoc comments)
|
|
42
54
|
* Removes the dependency on jQuery
|
|
43
|
-
* Instead of the `render` method Views can have a `toHTML` method which must return a [lit-html](https://lit-html.polymer-project.org/) `TemplateResult`.
|
|
44
55
|
* Replaces [underscore](http://underscorejs.org) with [lodash](https://lodash.com)
|
|
45
56
|
* Imports lodash methods individually to allow for tree-shaking
|
|
46
57
|
* Uses the native browser API instead of lodash whereever possible
|
|
47
58
|
* Drops support for older browsers (including IE) and uses ES6+ language features
|
|
48
|
-
* Splits models
|
|
59
|
+
* Splits models and collections into separate modules
|
|
49
60
|
* Adds the possibility to returns promises for asynchronous operations
|
|
50
61
|
* Adds a new `ElementView` class, which is a like a Backbone View, but doubles
|
|
51
62
|
as an instance of HTMLElement and can be used to register a custom element or
|
|
52
63
|
web-component.
|
|
53
64
|
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
### Backwards incompatible changes
|
|
65
|
+
### Other backwards incompatible changes
|
|
57
66
|
|
|
58
67
|
* Collection.prototype.forEach no longer returns the items being iterated over.
|
|
59
68
|
If you need that, use `map` instead.
|
|
60
|
-
* The `chain`
|
|
69
|
+
* The `chain`, `clone` and `escape` methods on Models have been removed.
|
|
70
|
+
* The `clone` method has also been removed from Collections
|
|
61
71
|
* The `inject`, `foldl` and `foldr` methods on Collections has been removed. You can use `reduce` instead.
|
|
62
72
|
* Removed the `sample`, `take`, `tail` and `initial` method on Collections.
|
|
63
73
|
* Removed the `without`, `reject` and `select` methods on Collections, use `filter`.
|
|
74
|
+
* Removed the `.extend()` method on `Model` and `Collection`.
|
|
75
|
+
* Models and Collections should be defined via `class .. extends` syntax.
|
|
64
76
|
|
|
65
77
|
#### Changes due to using Lodash instead of Underscore
|
|
66
78
|
|
|
@@ -70,7 +82,6 @@ UI, while we're progressively getting rid of the views.
|
|
|
70
82
|
4. Use `includes` instead of `contains`
|
|
71
83
|
5. The `partition` and `invokeMap` methods have been removed.
|
|
72
84
|
|
|
73
|
-

|
|
74
85
|
### ElementView example
|
|
75
86
|
|
|
76
87
|
The ElementView looks very similar to a normal Backbone View.
|
|
@@ -123,3 +134,5 @@ the browser, your ElementView will automatically be instantiated and
|
|
|
123
134
|
<my-custom-button></my-custom-button>
|
|
124
135
|
</div>
|
|
125
136
|
```
|
|
137
|
+
|
|
138
|
+

|