xote 6.1.1 → 6.2.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/src/Node.res.mjs CHANGED
@@ -1,555 +1,65 @@
1
1
  // Generated by ReScript, PLEASE EDIT WITH CARE
2
2
 
3
- import * as Effect$Xote from "./Effect.res.mjs";
4
- import * as Signal$Xote from "./Signal.res.mjs";
5
- import * as Stdlib_Dict from "@rescript/runtime/lib/es6/Stdlib_Dict.js";
6
- import * as Computed$Xote from "./Computed.res.mjs";
7
- import * as Stdlib_Option from "@rescript/runtime/lib/es6/Stdlib_Option.js";
8
- import * as Primitive_option from "@rescript/runtime/lib/es6/Primitive_option.js";
3
+ import * as View$Xote from "./View.res.mjs";
9
4
 
10
- let svgNamespace = "http://www.w3.org/2000/svg";
5
+ let DOM = View$Xote.DOM;
11
6
 
12
- let svgTags = [
13
- "svg",
14
- "path",
15
- "circle",
16
- "ellipse",
17
- "line",
18
- "polygon",
19
- "polyline",
20
- "rect",
21
- "g",
22
- "defs",
23
- "clipPath",
24
- "mask",
25
- "pattern",
26
- "marker",
27
- "symbol",
28
- "use",
29
- "text",
30
- "tspan",
31
- "image",
32
- "foreignObject",
33
- "linearGradient",
34
- "radialGradient",
35
- "stop",
36
- "filter",
37
- "feBlend",
38
- "feColorMatrix",
39
- "feComposite",
40
- "feFlood",
41
- "feGaussianBlur",
42
- "feMerge",
43
- "feMergeNode",
44
- "feOffset",
45
- "animate",
46
- "animateTransform",
47
- "desc",
48
- "title",
49
- "metadata"
50
- ];
7
+ let Reactivity = View$Xote.Reactivity;
51
8
 
52
- let d = {};
9
+ let Attributes = View$Xote.Attributes;
53
10
 
54
- svgTags.forEach(tag => {
55
- d[tag] = true;
56
- });
11
+ let attr = View$Xote.attr;
57
12
 
58
- function isSvgTag(tag) {
59
- return Stdlib_Option.isSome(d[tag]);
60
- }
61
-
62
- function setAttrOrProp(el, key, value) {
63
- switch (key) {
64
- case "checked" :
65
- el.checked = value === "true";
66
- return;
67
- case "disabled" :
68
- el.disabled = value === "true";
69
- return;
70
- case "aria-expanded" :
71
- case "aria-hidden" :
72
- case "aria-selected" :
73
- case "autofocus" :
74
- case "contenteditable" :
75
- case "draggable" :
76
- case "hidden" :
77
- case "multiple" :
78
- case "readonly" :
79
- case "required" :
80
- case "spellcheck" :
81
- break;
82
- case "value" :
83
- el.value = value;
84
- return;
85
- default:
86
- el.setAttribute(key, value);
87
- return;
88
- }
89
- if (value === "true") {
90
- el.setAttribute(key, "");
91
- } else {
92
- el.removeAttribute(key);
93
- }
94
- }
95
-
96
- let DOM = {
97
- setAttrOrProp: setAttrOrProp
98
- };
99
-
100
- let currentOwner = {
101
- contents: undefined
102
- };
103
-
104
- function createOwner() {
105
- return {
106
- disposers: [],
107
- computeds: []
108
- };
109
- }
110
-
111
- function runWithOwner(owner, fn) {
112
- let previousOwner = currentOwner.contents;
113
- currentOwner.contents = owner;
114
- let result = fn();
115
- currentOwner.contents = previousOwner;
116
- return result;
117
- }
118
-
119
- function addDisposer(owner, disposer) {
120
- owner.disposers.push(disposer);
121
- }
122
-
123
- function disposeOwner(owner) {
124
- owner.disposers.forEach(disposer => disposer.dispose());
125
- owner.computeds.forEach(Computed$Xote.dispose);
126
- }
127
-
128
- function setOwner(element, owner) {
129
- ((element["__xote_owner__"] = owner));
130
- }
131
-
132
- function getOwner(element) {
133
- return Primitive_option.fromNullable((element["__xote_owner__"]));
134
- }
135
-
136
- let Reactivity = {
137
- currentOwner: currentOwner,
138
- createOwner: createOwner,
139
- runWithOwner: runWithOwner,
140
- addDisposer: addDisposer,
141
- disposeOwner: disposeOwner,
142
- setOwner: setOwner,
143
- getOwner: getOwner
144
- };
145
-
146
- function $$static(key, value) {
147
- return [
148
- key,
149
- {
150
- TAG: "Static",
151
- _0: value
152
- }
153
- ];
154
- }
155
-
156
- function signal(key, signal$1) {
157
- return [
158
- key,
159
- {
160
- TAG: "SignalValue",
161
- _0: signal$1
162
- }
163
- ];
164
- }
13
+ let signalAttr = View$Xote.signalAttr;
165
14
 
166
- function computed(key, compute) {
167
- return [
168
- key,
169
- {
170
- TAG: "Compute",
171
- _0: compute
172
- }
173
- ];
174
- }
15
+ let computedAttr = View$Xote.computedAttr;
175
16
 
176
- let Attributes = {
177
- $$static: $$static,
178
- signal: signal,
179
- computed: computed
180
- };
17
+ let Attr = View$Xote.Attr;
181
18
 
182
- function disposeElement(el) {
183
- let owner = getOwner(el);
184
- if (owner !== undefined) {
185
- disposeOwner(owner);
186
- }
187
- let childNodes = (Array.from(el.childNodes || []));
188
- childNodes.forEach(disposeElement);
189
- }
19
+ let Render = View$Xote.Render;
190
20
 
191
- function render(node) {
192
- switch (node.TAG) {
193
- case "Element" :
194
- let children = node.children;
195
- let events = node.events;
196
- let attrs = node.attrs;
197
- let tag = node.tag;
198
- let el = Stdlib_Option.isSome(d[tag]) ? document.createElementNS(svgNamespace, tag) : document.createElement(tag);
199
- let owner = {
200
- disposers: [],
201
- computeds: []
202
- };
203
- setOwner(el, owner);
204
- runWithOwner(owner, () => {
205
- attrs.forEach(param => {
206
- let value = param[1];
207
- let key = param[0];
208
- switch (value.TAG) {
209
- case "Static" :
210
- return setAttrOrProp(el, key, value._0);
211
- case "SignalValue" :
212
- let signal = value._0;
213
- setAttrOrProp(el, key, Signal$Xote.peek(signal));
214
- let disposer = Effect$Xote.runWithDisposer(() => {
215
- setAttrOrProp(el, key, Signal$Xote.get(signal));
216
- }, undefined);
217
- return addDisposer(owner, disposer);
218
- case "Compute" :
219
- let compute = value._0;
220
- let disposer$1 = Effect$Xote.runWithDisposer(() => {
221
- setAttrOrProp(el, key, compute());
222
- }, undefined);
223
- return addDisposer(owner, disposer$1);
224
- }
225
- });
226
- events.forEach(param => {
227
- el.addEventListener(param[0], param[1]);
228
- });
229
- children.forEach(child => {
230
- let childEl = render(child);
231
- el.appendChild(childEl);
232
- });
233
- });
234
- return el;
235
- case "Text" :
236
- return document.createTextNode(node._0);
237
- case "SignalText" :
238
- let signal = node._0;
239
- let textNode = document.createTextNode(Signal$Xote.peek(signal));
240
- let owner$1 = {
241
- disposers: [],
242
- computeds: []
243
- };
244
- setOwner(textNode, owner$1);
245
- runWithOwner(owner$1, () => {
246
- let disposer = Effect$Xote.runWithDisposer(() => {
247
- textNode.textContent = Signal$Xote.get(signal);
248
- }, undefined);
249
- addDisposer(owner$1, disposer);
250
- });
251
- return textNode;
252
- case "Fragment" :
253
- let fragment = document.createDocumentFragment();
254
- node._0.forEach(child => {
255
- let childEl = render(child);
256
- fragment.appendChild(childEl);
257
- });
258
- return fragment;
259
- case "SignalFragment" :
260
- let signal$1 = node._0;
261
- let owner$2 = {
262
- disposers: [],
263
- computeds: []
264
- };
265
- let container = document.createElement("div");
266
- container.setAttribute("style", "display: contents");
267
- setOwner(container, owner$2);
268
- runWithOwner(owner$2, () => {
269
- let disposer = Effect$Xote.runWithDisposer(() => {
270
- let children = Signal$Xote.get(signal$1);
271
- let childNodes = (Array.from(container.childNodes || []));
272
- childNodes.forEach(disposeElement);
273
- ((container.innerHTML = ''));
274
- children.forEach(child => {
275
- let childEl = render(child);
276
- container.appendChild(childEl);
277
- });
278
- }, undefined);
279
- addDisposer(owner$2, disposer);
280
- });
281
- return container;
282
- case "LazyComponent" :
283
- let owner$3 = {
284
- disposers: [],
285
- computeds: []
286
- };
287
- let childNode = runWithOwner(owner$3, node._0);
288
- let el$1 = render(childNode);
289
- setOwner(el$1, owner$3);
290
- return el$1;
291
- case "KeyedList" :
292
- let renderItem = node.renderItem;
293
- let keyFn = node.keyFn;
294
- let signal$2 = node.signal;
295
- let owner$4 = {
296
- disposers: [],
297
- computeds: []
298
- };
299
- let startAnchor = document.createComment(" keyed-list-start ");
300
- let endAnchor = document.createComment(" keyed-list-end ");
301
- setOwner(startAnchor, owner$4);
302
- let keyedItems = {};
303
- let reconcile = () => {
304
- let parentOpt = endAnchor.parentNode;
305
- if (parentOpt == null) {
306
- return;
307
- }
308
- let newItems = Signal$Xote.get(signal$2);
309
- let newKeyMap = {};
310
- newItems.forEach(item => {
311
- newKeyMap[keyFn(item)] = item;
312
- });
313
- let keysToRemove = [];
314
- Object.keys(keyedItems).forEach(key => {
315
- let match = newKeyMap[key];
316
- if (match !== undefined) {
317
- return;
318
- } else {
319
- keysToRemove.push(key);
320
- return;
321
- }
322
- });
323
- keysToRemove.forEach(key => {
324
- let keyedItem = keyedItems[key];
325
- if (keyedItem !== undefined) {
326
- disposeElement(keyedItem.element);
327
- ((keyedItem.element.remove()));
328
- Stdlib_Dict.$$delete(keyedItems, key);
329
- return;
330
- }
331
- });
332
- let newOrder = [];
333
- let elementsToReplace = {};
334
- newItems.forEach(item => {
335
- let key = keyFn(item);
336
- let existing = keyedItems[key];
337
- if (existing !== undefined) {
338
- if (existing.item !== item) {
339
- elementsToReplace[key] = true;
340
- let node = renderItem(item);
341
- let element = render(node);
342
- let keyedItem = {
343
- key: key,
344
- item: item,
345
- element: element
346
- };
347
- newOrder.push(keyedItem);
348
- keyedItems[key] = keyedItem;
349
- return;
350
- }
351
- newOrder.push(existing);
352
- return;
353
- }
354
- let node$1 = renderItem(item);
355
- let element$1 = render(node$1);
356
- let keyedItem$1 = {
357
- key: key,
358
- item: item,
359
- element: element$1
360
- };
361
- newOrder.push(keyedItem$1);
362
- keyedItems[key] = keyedItem$1;
363
- });
364
- let marker = {
365
- contents: startAnchor.nextSibling
366
- };
367
- newOrder.forEach(keyedItem => {
368
- let currentElement = marker.contents;
369
- if (currentElement == null) {
370
- parentOpt.insertBefore(keyedItem.element, endAnchor);
371
- return;
372
- }
373
- if (currentElement === endAnchor) {
374
- parentOpt.insertBefore(keyedItem.element, endAnchor);
375
- return;
376
- }
377
- if (currentElement === keyedItem.element) {
378
- marker.contents = currentElement.nextSibling;
379
- return;
380
- }
381
- let needsReplacement = Stdlib_Option.getOr(elementsToReplace[keyedItem.key], false);
382
- if (needsReplacement) {
383
- disposeElement(currentElement);
384
- parentOpt.replaceChild(keyedItem.element, currentElement);
385
- marker.contents = keyedItem.element.nextSibling;
386
- } else {
387
- parentOpt.insertBefore(keyedItem.element, currentElement);
388
- marker.contents = keyedItem.element.nextSibling;
389
- }
390
- });
391
- };
392
- let fragment$1 = document.createDocumentFragment();
393
- fragment$1.appendChild(startAnchor);
394
- let initialItems = Signal$Xote.peek(signal$2);
395
- initialItems.forEach(item => {
396
- let key = keyFn(item);
397
- let node = renderItem(item);
398
- let element = render(node);
399
- let keyedItem = {
400
- key: key,
401
- item: item,
402
- element: element
403
- };
404
- keyedItems[key] = keyedItem;
405
- fragment$1.appendChild(element);
406
- });
407
- fragment$1.appendChild(endAnchor);
408
- runWithOwner(owner$4, () => {
409
- let disposer = Effect$Xote.runWithDisposer(() => {
410
- reconcile();
411
- }, undefined);
412
- addDisposer(owner$4, disposer);
413
- });
414
- return fragment$1;
415
- }
416
- }
21
+ let text = View$Xote.text;
417
22
 
418
- let Render = {
419
- disposeElement: disposeElement,
420
- render: render
421
- };
23
+ let signalText = View$Xote.signalText;
422
24
 
423
- function text(content) {
424
- return {
425
- TAG: "Text",
426
- _0: content
427
- };
428
- }
25
+ let signalInt = View$Xote.signalInt;
429
26
 
430
- function signalText(compute) {
431
- let signal = Computed$Xote.make(compute, undefined, undefined);
432
- return {
433
- TAG: "SignalText",
434
- _0: signal
435
- };
436
- }
27
+ let signalFloat = View$Xote.signalFloat;
437
28
 
438
- function signalInt(compute) {
439
- let signal = Computed$Xote.make(() => compute().toString(), undefined, undefined);
440
- return {
441
- TAG: "SignalText",
442
- _0: signal
443
- };
444
- }
29
+ let int = View$Xote.int;
445
30
 
446
- function signalFloat(compute) {
447
- let signal = Computed$Xote.make(() => compute().toString(), undefined, undefined);
448
- return {
449
- TAG: "SignalText",
450
- _0: signal
451
- };
452
- }
31
+ let float = View$Xote.float;
453
32
 
454
- function int(value) {
455
- return {
456
- TAG: "Text",
457
- _0: value.toString()
458
- };
459
- }
33
+ let fragment = View$Xote.fragment;
460
34
 
461
- function float(value) {
462
- return {
463
- TAG: "Text",
464
- _0: value.toString()
465
- };
466
- }
35
+ let signalFragment = View$Xote.signalFragment;
467
36
 
468
- function fragment(children) {
469
- return {
470
- TAG: "Fragment",
471
- _0: children
472
- };
473
- }
37
+ let each = View$Xote.each;
474
38
 
475
- function signalFragment(signal) {
476
- return {
477
- TAG: "SignalFragment",
478
- _0: signal
479
- };
480
- }
481
-
482
- function list(signal, renderItem) {
483
- let nodesSignal = Computed$Xote.make(() => Signal$Xote.get(signal).map(renderItem), undefined, undefined);
484
- return {
485
- TAG: "SignalFragment",
486
- _0: nodesSignal
487
- };
488
- }
489
-
490
- function keyedList(signal, keyFn, renderItem) {
491
- return {
492
- TAG: "KeyedList",
493
- signal: signal,
494
- keyFn: keyFn,
495
- renderItem: renderItem
496
- };
497
- }
39
+ let list = View$Xote.list;
498
40
 
499
- function element(tag, attrsOpt, eventsOpt, childrenOpt, param) {
500
- let attrs = attrsOpt !== undefined ? attrsOpt : [].map(x => x);
501
- let events = eventsOpt !== undefined ? eventsOpt : [].map(x => x);
502
- let children = childrenOpt !== undefined ? childrenOpt : [].map(x => x);
503
- return {
504
- TAG: "Element",
505
- tag: tag,
506
- attrs: attrs,
507
- events: events,
508
- children: children
509
- };
510
- }
41
+ let eachWithKey = View$Xote.eachWithKey;
511
42
 
512
- function $$null() {
513
- return {
514
- TAG: "Text",
515
- _0: ""
516
- };
517
- }
43
+ let keyedList = View$Xote.keyedList;
518
44
 
519
- function mount(node, container) {
520
- let el = render(node);
521
- container.appendChild(el);
522
- }
523
-
524
- function mountById(node, containerId) {
525
- let container = document.getElementById(containerId);
526
- if (container == null) {
527
- console.error("Container element not found: " + containerId);
528
- return;
529
- } else {
530
- return mount(node, container);
531
- }
532
- }
45
+ let element = View$Xote.element;
533
46
 
534
- let svgTagSet = d;
47
+ let $$null = View$Xote.$$null;
535
48
 
536
- let attr = $$static;
49
+ let empty = View$Xote.empty;
537
50
 
538
- let signalAttr = signal;
51
+ let mount = View$Xote.mount;
539
52
 
540
- let computedAttr = computed;
53
+ let mountById = View$Xote.mountById;
541
54
 
542
55
  export {
543
- svgNamespace,
544
- svgTags,
545
- svgTagSet,
546
- isSvgTag,
547
56
  DOM,
548
57
  Reactivity,
549
58
  Attributes,
550
59
  attr,
551
60
  signalAttr,
552
61
  computedAttr,
62
+ Attr,
553
63
  Render,
554
64
  text,
555
65
  signalText,
@@ -559,11 +69,14 @@ export {
559
69
  float,
560
70
  fragment,
561
71
  signalFragment,
72
+ each,
562
73
  list,
74
+ eachWithKey,
563
75
  keyedList,
564
76
  element,
565
77
  $$null,
78
+ empty,
566
79
  mount,
567
80
  mountById,
568
81
  }
569
- /* Not a pure module */
82
+ /* View-Xote Not a pure module */
package/src/Prop.res ADDED
@@ -0,0 +1,16 @@
1
+ /* Defines a property that can either be a signal (Reactive) or a static value
2
+ (Static) */
3
+ type t<'a> = Reactive(Signal.t<'a>) | Static('a)
4
+
5
+ let get = value =>
6
+ switch value {
7
+ | Reactive(signal) => Signal.get(signal)
8
+ | Static(value) => value
9
+ }
10
+
11
+ /* Helper functions for creating reactive props */
12
+ let static = value => Static(value)
13
+
14
+ let reactive = signal => Reactive(signal)
15
+
16
+ let signal = reactive
@@ -0,0 +1,35 @@
1
+ // Generated by ReScript, PLEASE EDIT WITH CARE
2
+
3
+ import * as Signal$Xote from "./Signal.res.mjs";
4
+
5
+ function get(value) {
6
+ if (value.TAG === "Reactive") {
7
+ return Signal$Xote.get(value._0);
8
+ } else {
9
+ return value._0;
10
+ }
11
+ }
12
+
13
+ function $$static(value) {
14
+ return {
15
+ TAG: "Static",
16
+ _0: value
17
+ };
18
+ }
19
+
20
+ function reactive(signal) {
21
+ return {
22
+ TAG: "Reactive",
23
+ _0: signal
24
+ };
25
+ }
26
+
27
+ let signal = reactive;
28
+
29
+ export {
30
+ get,
31
+ $$static,
32
+ reactive,
33
+ signal,
34
+ }
35
+ /* No side effect */
@@ -1,14 +1,2 @@
1
- /* Defines a property that can either be a signal (Reactive) or a static value
2
- (Static) */
3
- type t<'a> = Reactive(Signal.t<'a>) | Static('a)
4
-
5
- let get = value =>
6
- switch value {
7
- | Reactive(signal) => Signal.get(signal)
8
- | Static(value) => value
9
- }
10
-
11
- /* Helper functions for creating reactive props */
12
- let static = value => Static(value)
13
-
14
- let reactive = signal => Reactive(signal)
1
+ @deprecated("Use Prop instead. ReactiveProp is deprecated and will be removed in a future release.")
2
+ include Prop
@@ -1,32 +1,19 @@
1
1
  // Generated by ReScript, PLEASE EDIT WITH CARE
2
2
 
3
- import * as Signal$Xote from "./Signal.res.mjs";
3
+ import * as Prop$Xote from "./Prop.res.mjs";
4
4
 
5
- function get(value) {
6
- if (value.TAG === "Reactive") {
7
- return Signal$Xote.get(value._0);
8
- } else {
9
- return value._0;
10
- }
11
- }
5
+ let get = Prop$Xote.get;
12
6
 
13
- function $$static(value) {
14
- return {
15
- TAG: "Static",
16
- _0: value
17
- };
18
- }
7
+ let $$static = Prop$Xote.$$static;
19
8
 
20
- function reactive(signal) {
21
- return {
22
- TAG: "Reactive",
23
- _0: signal
24
- };
25
- }
9
+ let reactive = Prop$Xote.reactive;
10
+
11
+ let signal = Prop$Xote.signal;
26
12
 
27
13
  export {
28
14
  get,
29
15
  $$static,
30
16
  reactive,
17
+ signal,
31
18
  }
32
19
  /* No side effect */
package/src/Route.res CHANGED
@@ -60,3 +60,7 @@ let matchPath = (pattern: array<segment>, pathname: string): matchResult => {
60
60
  let match = (pattern: string, pathname: string): matchResult => {
61
61
  matchPath(parsePattern(pattern), pathname)
62
62
  }
63
+
64
+ let compile = parsePattern
65
+ let matchCompiled = matchPath
66
+ let matchPathname = match