stagnate 1.0.5 → 1.0.7
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 +236 -1
- package/lib/Slot.js +8 -2
- package/lib/Slot.js.map +1 -1
- package/lib/jsx-runtime.js +5 -3
- package/lib/jsx-runtime.js.map +1 -1
- package/lib/types.d.ts +1 -5
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,3 +1,238 @@
|
|
|
1
1
|
# Stagnate
|
|
2
2
|
|
|
3
|
-
React but not reactive, lol
|
|
3
|
+
> React but not reactive, lol
|
|
4
|
+
|
|
5
|
+
This project started basically as an meme. Yet somehow it ended up being a very useful tool for creating small web apps.
|
|
6
|
+
|
|
7
|
+
The basic idea is very simple and can be explained in one sentence:
|
|
8
|
+
> react but components get rendered only once
|
|
9
|
+
|
|
10
|
+
This throws out the need for any vDOM as you never need to mutate any already rendered component. Thanks to that components can get rendered directly into DOM in a single pass.
|
|
11
|
+
|
|
12
|
+
Well... but how do you update anything then? Manually. References to created JSX elements get stored inside the component class for further use.
|
|
13
|
+
|
|
14
|
+
This library has no dependencies and is simple as it can gets (it's literally ~300 lines of code). For me it's my goto thing when working on smaller things.
|
|
15
|
+
|
|
16
|
+
## Setup
|
|
17
|
+
|
|
18
|
+
Intended to be used with typesciprt.
|
|
19
|
+
|
|
20
|
+
1. npm install stagnate
|
|
21
|
+
2. add the following to `compilerOptions` in `tsconfig.json`
|
|
22
|
+
```json
|
|
23
|
+
{
|
|
24
|
+
"jsx": "react-jsx",
|
|
25
|
+
"jsxImportSource": "stagnate"
|
|
26
|
+
}
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
That's it. JSX can now be used within `.tsx` files added to the typescript project.
|
|
30
|
+
|
|
31
|
+
## Function components
|
|
32
|
+
|
|
33
|
+
Function components work like in react minus the fact that they don't have any kind of hooks. Because there is no vDOM, calling a function component from code will leave you with a pain HTMLElement.
|
|
34
|
+
|
|
35
|
+
## Class components
|
|
36
|
+
|
|
37
|
+
Class components have a simple lifecycle that includes `onAttach` and `onDetach` function calls but there is a major caveat to remember: DOM is not being watched in any way so a component needs to be informed by another already attached component that it has been attached. Same applies to `onDetach`. For it to be called the component needs to know it has been destroyed.
|
|
38
|
+
|
|
39
|
+
Both of the above can be achieved by correctly binding child components to parent components via `ref` JSX attributes or by manually creating components from code.
|
|
40
|
+
|
|
41
|
+
### Component root element
|
|
42
|
+
|
|
43
|
+
Each class component has a single root HTML element. This value is set to the value returned from the `render` function and saved as a protected class property called `root`.
|
|
44
|
+
|
|
45
|
+
### Properties
|
|
46
|
+
|
|
47
|
+
Properties are passed as an object in component constructor and available as a readonly `props` class property. They are not used for anything internally, they are simply there to hold attributes passed from JSX.
|
|
48
|
+
|
|
49
|
+
### Refs object, ref member function and JSX ref attribute
|
|
50
|
+
|
|
51
|
+
`refs` component class property hold references to all HTML elements and child components that had `ref` JSX attribute set. See example below for a better explanation:
|
|
52
|
+
|
|
53
|
+
```typescript
|
|
54
|
+
class Example extends Component<{foo: HTMLDivElement}> {
|
|
55
|
+
render() {
|
|
56
|
+
return <div>
|
|
57
|
+
<span ref={this.ref("foo")} />
|
|
58
|
+
</div>
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
```
|
|
62
|
+
|
|
63
|
+
In the example above `this.refs.foo` will point to the `<span>` element (`HTMLSpanElement` instance).
|
|
64
|
+
|
|
65
|
+
The JSX `ref` attribute works exactly like in react, it accepts a callback with a single argument that gets called when the element / component is created. The value of that argument is a reference to the crated element or (for class components) the created component instance.
|
|
66
|
+
|
|
67
|
+
The `Component.ref` member function returns a callback to be set as the `ref` JSX attribute. The string argument for that function sets the name under which it should be saved in the `refs` object. For class components it also sets the parent of the created component. It can also be called without argument to just set the parent without saving it under `refs`.
|
|
68
|
+
|
|
69
|
+
> When using class components in JSX it is important to always bind them or else the `onAttach` / `onDetach` functions will never be called.
|
|
70
|
+
>
|
|
71
|
+
> For example let's say `Foo` is a class component that has an `onAttach` function defined. We want to use it inside `Bar` component's render function but we don't want it saved under `refs`. What we should do is `<Foo ref={this.ref()} />`. Writing `<Foo />` would crate the component and insert it to DOM, but would never call `onAttach` as the parent would be left unset.
|
|
72
|
+
|
|
73
|
+
### Creating component programmatically
|
|
74
|
+
|
|
75
|
+
Three member methods can be used to add (attach) a component into DOM.
|
|
76
|
+
|
|
77
|
+
#### The `create` member function
|
|
78
|
+
|
|
79
|
+
```typescript
|
|
80
|
+
create(parent: Component, target?: Element | Component | null, before?: Element | Component | number)
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
This method immediately renders the component and appends it to `target`. The component's parent is set to `parent` and the component get's registers as `parent's` child.
|
|
84
|
+
|
|
85
|
+
If `parent` is attached `onAttach` will be called immediately, if not it will be called once `parent` is attached.
|
|
86
|
+
|
|
87
|
+
If `target` is `null` then `parent.root` element will be used as `target`.
|
|
88
|
+
|
|
89
|
+
If `before` is set the element will be inserted before that element.
|
|
90
|
+
|
|
91
|
+
#### The `replace` member function
|
|
92
|
+
|
|
93
|
+
```typescript
|
|
94
|
+
replace(parent: Component, target: Element | Component)
|
|
95
|
+
```
|
|
96
|
+
|
|
97
|
+
Same as `create` but replaces `target` instead of being appended to it.
|
|
98
|
+
|
|
99
|
+
#### The `createOrphanized` member function
|
|
100
|
+
|
|
101
|
+
```typescript
|
|
102
|
+
createOrphanized(target?: Element | null)
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
Same as `create` but intended to create the root component. The component is automatically set as attached after render.
|
|
106
|
+
|
|
107
|
+
If `target` is `null` then component is appended to `document.body`.
|
|
108
|
+
|
|
109
|
+
## JSX attribute handling
|
|
110
|
+
|
|
111
|
+
### `ref` attribute
|
|
112
|
+
|
|
113
|
+
Callback with a single argument that gets called when the element / component is created. The value of that argument is a reference to the crated element or (for class components) the created component instance.
|
|
114
|
+
|
|
115
|
+
### `class` attribute
|
|
116
|
+
|
|
117
|
+
In contrast to react `class` in used instead of `className`. What's more the value can be an array. The passed array will be flattened, filtered and then joined to create a single string. This allows writing things like `class={["class1", condition && "class2"]}` without and additional functions or libraries.
|
|
118
|
+
|
|
119
|
+
### `innerHTML` attribute
|
|
120
|
+
|
|
121
|
+
It will simply set innerHTML.
|
|
122
|
+
|
|
123
|
+
### `style` attribute
|
|
124
|
+
|
|
125
|
+
Does `Object.assign(element.style, value)`
|
|
126
|
+
|
|
127
|
+
### Event attributes
|
|
128
|
+
|
|
129
|
+
Every attribute starting with `on` will be treated as an event callback and added using `addEventListener`.
|
|
130
|
+
|
|
131
|
+
### Other attributes
|
|
132
|
+
|
|
133
|
+
1. If value is `true` then `setAttribute(attribute, "")` gets called.
|
|
134
|
+
2. If value is `false` or `null` then `removeAttribute(attribute)` gets called.
|
|
135
|
+
3. If value is a string then `setAttribute(attribute, value)` gets called.
|
|
136
|
+
4. if value is `undefined` the attribute is ingored and nothing happens
|
|
137
|
+
5. for all other values `setAttribute(attribute, value.toString())` gets called
|
|
138
|
+
|
|
139
|
+
## JSX special elements
|
|
140
|
+
|
|
141
|
+
### `<text>` element
|
|
142
|
+
|
|
143
|
+
The `<text>` element creates a `Text` node that can be used to bind a `Text` node to component `refs`.
|
|
144
|
+
|
|
145
|
+
### `<>` element (aka `<Fragment>`)
|
|
146
|
+
|
|
147
|
+
Same as in react, used to return a array of parents without a root. One thing to remember is that it **does not return a HTMLElement** and should never be used as an component root.
|
|
148
|
+
|
|
149
|
+
### Slots
|
|
150
|
+
|
|
151
|
+
Basic slot functionality, see example below:
|
|
152
|
+
|
|
153
|
+
```typescript
|
|
154
|
+
class Layout extends Component<{}, {children: StagnateNode}> {
|
|
155
|
+
render() {
|
|
156
|
+
const slots = Slot.extract<{foo: HTMLElement, bar: HTMLElement}>(this.props.children)
|
|
157
|
+
return <div>
|
|
158
|
+
<div>{slots.foo}</div>
|
|
159
|
+
<div>{slots.bar}</div>
|
|
160
|
+
</div>
|
|
161
|
+
}
|
|
162
|
+
}
|
|
163
|
+
|
|
164
|
+
// <Slot> elements have to be direct children to work
|
|
165
|
+
const example = <Layout>
|
|
166
|
+
<Slot name="foo">FOO</Slot>
|
|
167
|
+
<Slot name="bar">BAR</Slot>
|
|
168
|
+
</Layout>
|
|
169
|
+
```
|
|
170
|
+
|
|
171
|
+
Primary used to avoid passing nested JSX elements as props.
|
|
172
|
+
|
|
173
|
+
## Api reference
|
|
174
|
+
|
|
175
|
+
### Component class
|
|
176
|
+
```typescript
|
|
177
|
+
declare class Component<REFS = {}, PROPS = undefined, ROOT extends SVGElement | HTMLElement = SVGElement | HTMLElement> {
|
|
178
|
+
// props from JSX (set via constructor)
|
|
179
|
+
readonly props: PROPS extends undefined ? {} : PROPS
|
|
180
|
+
// HTML root element of this component (can be not set if not attached)
|
|
181
|
+
protected root: ROOT
|
|
182
|
+
// parent of this component (can be not set if not attached)
|
|
183
|
+
protected parent: Component<any, any>
|
|
184
|
+
// the refs object containing bound elements created during render
|
|
185
|
+
protected refs: REFS
|
|
186
|
+
// overcomplicated constructor signature made so props is optional only if component has no props defined
|
|
187
|
+
constructor(...props: PROPS extends undefined ? [] : [never])
|
|
188
|
+
// the render function, called to get the component root element, null can be returned if component
|
|
189
|
+
// has nothing to render but will result with exception if component is being created via create or replace
|
|
190
|
+
protected render(): Element | null
|
|
191
|
+
// the ref callback generation function with a overcomplicated signature, used to bind JSX elements to refs
|
|
192
|
+
protected ref<T extends keyof REFS | undefined = undefined>(key?: T): (x: REFS[NonNullable<T>] extends never ? any : REFS[NonNullable<T>]) => void
|
|
193
|
+
// create component and replace target element
|
|
194
|
+
replace(parent: Component<any, any>, target?: Element | Component<any, any> | null): void
|
|
195
|
+
// create component and insert to target
|
|
196
|
+
create(parent: Component<any, any>, target?: Element | Component<any, any> | null, before?: Element | Component<any, any> | number): void
|
|
197
|
+
// crate component as root (attached set on creation)
|
|
198
|
+
createOrphanized(target?: Element | null): void
|
|
199
|
+
// bind component to a already existing element (called internally on JSX ref binding)
|
|
200
|
+
bind(parent: Component<any, any>, target?: Element): void
|
|
201
|
+
// destroy component and it child components
|
|
202
|
+
destroy(): void
|
|
203
|
+
// check if component is attached
|
|
204
|
+
get attached(): boolean
|
|
205
|
+
// get the root element of this component
|
|
206
|
+
get htmlRoot(): ROOT;
|
|
207
|
+
// get and array of child components
|
|
208
|
+
protected get components(): Readonly<Component<any, any, any>[]>
|
|
209
|
+
// called before render is called
|
|
210
|
+
protected onBeforeRender(): void
|
|
211
|
+
// called after render is called
|
|
212
|
+
protected onRender(): void
|
|
213
|
+
// called when parent becomes attached (or on parent assignment if parent is attached)
|
|
214
|
+
protected onAttach(): void
|
|
215
|
+
// called when element is destroyed
|
|
216
|
+
protected onDetach(): void;
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
```
|
|
220
|
+
|
|
221
|
+
### Utility Types
|
|
222
|
+
|
|
223
|
+
```typescript
|
|
224
|
+
// get props of an JSX element or component function / class
|
|
225
|
+
type ComponentProps<IntrinsicElement | ClassElement | FunctionElement>
|
|
226
|
+
// anything that can be legally used in JSX
|
|
227
|
+
type StagnateNode
|
|
228
|
+
// the JSX element css class attribute
|
|
229
|
+
type ClassAttribute
|
|
230
|
+
```
|
|
231
|
+
|
|
232
|
+
### Other exports
|
|
233
|
+
|
|
234
|
+
* `Fragment` - the Fragment JSX component, `<>` can be used as an alias
|
|
235
|
+
* `Slot` - the Slots JSX component
|
|
236
|
+
* `Slot.extract` - function to extract slots from children (`props.children`)
|
|
237
|
+
* `createElement` - can be used if for some reason react-jsx can not be used
|
|
238
|
+
* `jsx / jsxs` - exports for react-jsx
|
package/lib/Slot.js
CHANGED
|
@@ -9,11 +9,17 @@ export function Slot(props) {
|
|
|
9
9
|
return new SlotArray(props.name, props.children);
|
|
10
10
|
}
|
|
11
11
|
Slot.extract = function (input, slots = {}) {
|
|
12
|
-
if (
|
|
12
|
+
if (input instanceof SlotArray && input.length) {
|
|
13
|
+
slots[input.name] = input[0];
|
|
14
|
+
input.pop();
|
|
15
|
+
}
|
|
16
|
+
else if (Array.isArray(input)) {
|
|
13
17
|
for (let i = 0; i < input.length; i += 1) {
|
|
14
18
|
const item = input[i];
|
|
15
19
|
if (item instanceof SlotArray) {
|
|
16
|
-
|
|
20
|
+
if (input.length) {
|
|
21
|
+
slots[item.name] = item[0];
|
|
22
|
+
}
|
|
17
23
|
input[i] = null;
|
|
18
24
|
}
|
|
19
25
|
else if (Array.isArray(item)) {
|
package/lib/Slot.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Slot.js","sourceRoot":"","sources":["../src/Slot.ts"],"names":[],"mappings":"AAEA,MAAM,SAAU,SAAQ,KAAmB;IAE1C,YAAa,IAAY,EAAE,QAAsB;QAChD,KAAK,EAAE,CAAA;QACP,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;QAChB,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;IACpB,CAAC;CACD;AAED,MAAM,UAAU,IAAI,CAAC,KAA6C;IACjE,OAAO,IAAI,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAQ,CAAA;AACxD,CAAC;AAED,IAAI,CAAC,OAAO,GAAG,UAAkC,KAAmB,EAAE,QAA6B,EAAE;IACpG,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;
|
|
1
|
+
{"version":3,"file":"Slot.js","sourceRoot":"","sources":["../src/Slot.ts"],"names":[],"mappings":"AAEA,MAAM,SAAU,SAAQ,KAAmB;IAE1C,YAAa,IAAY,EAAE,QAAsB;QAChD,KAAK,EAAE,CAAA;QACP,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;QAChB,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;IACpB,CAAC;CACD;AAED,MAAM,UAAU,IAAI,CAAC,KAA6C;IACjE,OAAO,IAAI,SAAS,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,QAAQ,CAAQ,CAAA;AACxD,CAAC;AAED,IAAI,CAAC,OAAO,GAAG,UAAkC,KAAmB,EAAE,QAA6B,EAAE;IACpG,IAAI,KAAK,YAAY,SAAS,IAAI,KAAK,CAAC,MAAM,EAAE;QAC/C,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,CAAA;QAC5B,KAAK,CAAC,GAAG,EAAE,CAAA;KACX;SAAM,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;QAChC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE;YACzC,MAAM,IAAI,GAAG,KAAK,CAAC,CAAC,CAAC,CAAA;YACrB,IAAI,IAAI,YAAY,SAAS,EAAE;gBAC9B,IAAI,KAAK,CAAC,MAAM,EAAE;oBACjB,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC,CAAC,CAAC,CAAA;iBAC1B;gBACD,KAAK,CAAC,CAAC,CAAC,GAAG,IAAI,CAAA;aACf;iBAAM,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBAC/B,IAAI,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,CAAC,CAAA;aACzB;SACD;KACD;IACD,OAAO,KAAU,CAAA;AAClB,CAAC,CAAA"}
|
package/lib/jsx-runtime.js
CHANGED
|
@@ -29,8 +29,10 @@ export function jsx(type, props) {
|
|
|
29
29
|
else if (typeof type == "string") {
|
|
30
30
|
const children = collect(props.children);
|
|
31
31
|
let element;
|
|
32
|
-
|
|
33
|
-
|
|
32
|
+
let isSvg = false;
|
|
33
|
+
if (type.startsWith("svg")) {
|
|
34
|
+
element = document.createElementNS("http://www.w3.org/2000/svg", type.length == 3 ? "svg" : type.slice(4));
|
|
35
|
+
isSvg = true;
|
|
34
36
|
}
|
|
35
37
|
else {
|
|
36
38
|
element = document.createElement(type);
|
|
@@ -57,7 +59,7 @@ export function jsx(type, props) {
|
|
|
57
59
|
}
|
|
58
60
|
else {
|
|
59
61
|
const value = props[key];
|
|
60
|
-
const attribute =
|
|
62
|
+
const attribute = isSvg ? key : key.toLowerCase();
|
|
61
63
|
if (value === true) {
|
|
62
64
|
element.setAttribute(attribute, "");
|
|
63
65
|
}
|
package/lib/jsx-runtime.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"jsx-runtime.js","sourceRoot":"","sources":["../src/jsx-runtime.ts"],"names":[],"mappings":"AAEA,SAAS,QAAQ,CAAI,IAAyB,EAAE,WAAgB;IAC/D,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,MAAM,EAAE,CAAC,IAAI,CAAC,EAAE;QACxC,MAAM,KAAK,GAAG,IAAI,CAAC,CAAC,CAAC,CAAA;QACrB,IAAI,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;YACzB,QAAQ,CAAC,KAAK,EAAE,WAAW,CAAC,CAAA;SAC5B;aAAM,IAAI,KAAK,EAAE;YACjB,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;SACvB;KACD;AACF,CAAC;AAED,SAAS,OAAO,CAAI,IAA6B;IAChD,IAAI,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;QACxB,MAAM,WAAW,GAAG,EAAS,CAAA;QAC5B,QAAQ,CAAC,IAAI,EAAE,WAAW,CAAC,CAAA;QAC5B,OAAO,WAAW,CAAA;KAClB;IACD,OAAO,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE,CAAA;AAC1B,CAAC;AAED,MAAM,UAAU,GAAG,CAAC,IAAS,EAAE,KAAU;IACxC,IAAI,IAAI,IAAI,MAAM,EAAE;QACnB,MAAM,QAAQ,GAAG,OAAO,CAAS,KAAK,CAAC,QAAQ,CAAC,CAAA;QAChD,MAAM,OAAO,GAAG,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,CAAA;QAChG,IAAI,KAAK,CAAC,GAAG,EAAE;YACd,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAA;SAClB;QACD,OAAO,OAAO,CAAA;KACd;SAAM,IAAI,OAAO,IAAI,IAAI,QAAQ,EAAE;QACnC,MAAM,QAAQ,GAAG,OAAO,CAAmB,KAAK,CAAC,QAAQ,CAAC,CAAA;QAC1D,IAAI,OAAgB,CAAA;QACpB,IAAI,
|
|
1
|
+
{"version":3,"file":"jsx-runtime.js","sourceRoot":"","sources":["../src/jsx-runtime.ts"],"names":[],"mappings":"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"}
|
package/lib/types.d.ts
CHANGED
|
@@ -148,10 +148,6 @@ export interface SvgElementAttributes extends GlobalAttributes<SVGElement> {
|
|
|
148
148
|
fill?: string;
|
|
149
149
|
children?: CollectableValue<JSX.Element | string>;
|
|
150
150
|
}
|
|
151
|
-
export interface SvgPathElementAttributes extends GlobalAttributes<SVGPathElement> {
|
|
152
|
-
fill?: string;
|
|
153
|
-
d?: string;
|
|
154
|
-
}
|
|
155
151
|
export declare namespace JSX {
|
|
156
152
|
interface IntrinsicElements {
|
|
157
153
|
text: TextElementAttributes;
|
|
@@ -165,7 +161,7 @@ export declare namespace JSX {
|
|
|
165
161
|
option: OptionElementAttributes;
|
|
166
162
|
iframe: IframeElementAttributes;
|
|
167
163
|
svg: SvgElementAttributes;
|
|
168
|
-
|
|
164
|
+
[key: `svg:${string}`]: GlobalAttributes<SVGElement> & Record<string, any>;
|
|
169
165
|
}
|
|
170
166
|
interface ElementChildrenAttribute {
|
|
171
167
|
children: {};
|