simplyflow 0.2.3 → 0.3.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/dist/simply.flow.js +191 -64
- package/dist/simply.flow.min.js +1 -1
- package/dist/simply.flow.min.js.map +3 -3
- package/package.json +1 -1
- package/src/bind.mjs +244 -73
- package/src/model.mjs +13 -13
- package/src/state.mjs +13 -1
package/dist/simply.flow.js
CHANGED
|
@@ -20,11 +20,17 @@
|
|
|
20
20
|
if (!Symbol.xRay) {
|
|
21
21
|
Symbol.xRay = Symbol("xRay");
|
|
22
22
|
}
|
|
23
|
+
if (!Symbol.Signal) {
|
|
24
|
+
Symbol.Signal = Symbol("Signal");
|
|
25
|
+
}
|
|
23
26
|
var signalHandler = {
|
|
24
27
|
get: (target, property, receiver) => {
|
|
25
28
|
if (property === Symbol.xRay) {
|
|
26
29
|
return target;
|
|
27
30
|
}
|
|
31
|
+
if (property === Symbol.Signal) {
|
|
32
|
+
return true;
|
|
33
|
+
}
|
|
28
34
|
const value = target?.[property];
|
|
29
35
|
notifyGet(receiver, property);
|
|
30
36
|
if (typeof value === "function") {
|
|
@@ -103,7 +109,13 @@
|
|
|
103
109
|
};
|
|
104
110
|
var signals = /* @__PURE__ */ new WeakMap();
|
|
105
111
|
function signal(v) {
|
|
106
|
-
if (
|
|
112
|
+
if (v[Symbol.Signal]) {
|
|
113
|
+
let target = v[Symbol.xRay];
|
|
114
|
+
if (!signals.has(target)) {
|
|
115
|
+
signals.set(target, v);
|
|
116
|
+
}
|
|
117
|
+
v = target;
|
|
118
|
+
} else if (!signals.has(v)) {
|
|
107
119
|
signals.set(v, new Proxy(v, signalHandler));
|
|
108
120
|
}
|
|
109
121
|
return signals.get(v);
|
|
@@ -392,12 +404,20 @@
|
|
|
392
404
|
|
|
393
405
|
// src/bind.mjs
|
|
394
406
|
var SimplyBind = class {
|
|
407
|
+
/**
|
|
408
|
+
* @param Object options - a set of options for this instance, options may include:
|
|
409
|
+
* - root (signal) (required) - the root data object that contains al signals that can be bound
|
|
410
|
+
* - container (HTMLElement) - the dom element to use as the root for all bindings
|
|
411
|
+
* - attribute (string) - the prefix for the field, list and map attributes, e.g. 'data-bind'
|
|
412
|
+
* - transformers (object name:function) - a map of transformer names and functions
|
|
413
|
+
* - defaultTransformers (object with field, list and map properties)
|
|
414
|
+
*/
|
|
395
415
|
constructor(options) {
|
|
396
416
|
this.bindings = /* @__PURE__ */ new Map();
|
|
397
417
|
const defaultOptions = {
|
|
398
418
|
container: document.body,
|
|
399
419
|
attribute: "data-bind",
|
|
400
|
-
transformers:
|
|
420
|
+
transformers: {},
|
|
401
421
|
defaultTransformers: {
|
|
402
422
|
field: [defaultFieldTransformer],
|
|
403
423
|
list: [defaultListTransformer],
|
|
@@ -411,15 +431,20 @@
|
|
|
411
431
|
const attribute = this.options.attribute;
|
|
412
432
|
const bindAttributes = [attribute + "-field", attribute + "-list", attribute + "-map"];
|
|
413
433
|
const bindSelector = `[${attribute}-field],[${attribute}-list],[${attribute}-map]`;
|
|
434
|
+
const transformAttribute = attribute + "-transform";
|
|
414
435
|
const getBindingAttribute = (el) => {
|
|
415
|
-
const foundAttribute = bindAttributes.find((
|
|
436
|
+
const foundAttribute = bindAttributes.find((attr2) => el.hasAttribute(attr2));
|
|
416
437
|
if (!foundAttribute) {
|
|
417
|
-
console.error("No matching attribute found", el);
|
|
438
|
+
console.error("No matching attribute found", el, attr);
|
|
418
439
|
}
|
|
419
440
|
return foundAttribute;
|
|
420
441
|
};
|
|
421
442
|
const render = (el) => {
|
|
422
443
|
this.bindings.set(el, throttledEffect(() => {
|
|
444
|
+
if (!el.isConnected) {
|
|
445
|
+
destroy(this.bindings.get(el));
|
|
446
|
+
return;
|
|
447
|
+
}
|
|
423
448
|
const context = {
|
|
424
449
|
templates: el.querySelectorAll(":scope > template"),
|
|
425
450
|
attribute: getBindingAttribute(el)
|
|
@@ -428,7 +453,7 @@
|
|
|
428
453
|
context.value = getValueByPath(this.options.root, context.path);
|
|
429
454
|
context.element = el;
|
|
430
455
|
runTransformers(context);
|
|
431
|
-
},
|
|
456
|
+
}, 50));
|
|
432
457
|
};
|
|
433
458
|
const runTransformers = (context) => {
|
|
434
459
|
let transformers;
|
|
@@ -443,14 +468,16 @@
|
|
|
443
468
|
transformers = this.options.defaultTransformers.map || [];
|
|
444
469
|
break;
|
|
445
470
|
}
|
|
446
|
-
if (context.element.
|
|
447
|
-
context.element.
|
|
471
|
+
if (context.element.hasAttribute(transformAttribute)) {
|
|
472
|
+
context.element.getAttribute(transformAttribute).split(" ").filter(Boolean).forEach((t) => {
|
|
448
473
|
if (this.options.transformers[t]) {
|
|
449
474
|
transformers.push(this.options.transformers[t]);
|
|
450
475
|
} else {
|
|
451
476
|
console.warn("No transformer with name " + t + " configured", { cause: context.element });
|
|
452
477
|
}
|
|
453
478
|
});
|
|
479
|
+
} else {
|
|
480
|
+
console.log(context.element.outerHTML);
|
|
454
481
|
}
|
|
455
482
|
let next;
|
|
456
483
|
for (let transformer of transformers) {
|
|
@@ -464,7 +491,9 @@
|
|
|
464
491
|
};
|
|
465
492
|
const applyBindings = (bindings2) => {
|
|
466
493
|
for (let bindingEl of bindings2) {
|
|
467
|
-
|
|
494
|
+
if (!this.bindings.get(bindingEl)) {
|
|
495
|
+
render(bindingEl);
|
|
496
|
+
}
|
|
468
497
|
}
|
|
469
498
|
};
|
|
470
499
|
const updateBindings = (changes) => {
|
|
@@ -488,7 +517,7 @@
|
|
|
488
517
|
this.observer = new MutationObserver((changes) => {
|
|
489
518
|
updateBindings(changes);
|
|
490
519
|
});
|
|
491
|
-
this.observer.observe(options.container, {
|
|
520
|
+
this.observer.observe(this.options.container, {
|
|
492
521
|
subtree: true,
|
|
493
522
|
childList: true
|
|
494
523
|
});
|
|
@@ -502,6 +531,8 @@
|
|
|
502
531
|
/**
|
|
503
532
|
* Finds the first matching template and creates a new DocumentFragment
|
|
504
533
|
* with the correct data bind attributes in it (prepends the current path)
|
|
534
|
+
* @param Context context
|
|
535
|
+
* @return DocumentFragment
|
|
505
536
|
*/
|
|
506
537
|
applyTemplate(context) {
|
|
507
538
|
const path = context.path;
|
|
@@ -527,33 +558,47 @@
|
|
|
527
558
|
const attributes = [attribute + "-field", attribute + "-list", attribute + "-map"];
|
|
528
559
|
const bindings = clone.querySelectorAll(`[${attribute}-field],[${attribute}-list],[${attribute}-map]`);
|
|
529
560
|
for (let binding of bindings) {
|
|
530
|
-
const
|
|
531
|
-
const bind2 = binding.getAttribute(
|
|
561
|
+
const attr2 = attributes.find((attr3) => binding.hasAttribute(attr3));
|
|
562
|
+
const bind2 = binding.getAttribute(attr2);
|
|
532
563
|
if (bind2.substring(0, ":root.".length) == ":root.") {
|
|
533
|
-
binding.setAttribute(
|
|
564
|
+
binding.setAttribute(attr2, bind2.substring(":root.".length));
|
|
534
565
|
} else if (bind2 == ":value" && index != null) {
|
|
535
|
-
binding.setAttribute(
|
|
566
|
+
binding.setAttribute(attr2, path + "." + index);
|
|
536
567
|
} else if (index != null) {
|
|
537
|
-
binding.setAttribute(
|
|
568
|
+
binding.setAttribute(attr2, path + "." + index + "." + bind2);
|
|
538
569
|
} else {
|
|
539
|
-
binding.setAttribute(
|
|
570
|
+
binding.setAttribute(attr2, parent + "." + bind2);
|
|
540
571
|
}
|
|
541
572
|
}
|
|
542
573
|
if (typeof index !== "undefined") {
|
|
543
574
|
clone.children[0].setAttribute(attribute + "-key", index);
|
|
544
575
|
}
|
|
545
|
-
|
|
576
|
+
Object.defineProperty(
|
|
577
|
+
clone.children[0],
|
|
578
|
+
"$bindTemplate",
|
|
579
|
+
{
|
|
580
|
+
value: template,
|
|
581
|
+
enumerable: false,
|
|
582
|
+
writable: true,
|
|
583
|
+
configurable: true
|
|
584
|
+
}
|
|
585
|
+
);
|
|
546
586
|
return clone;
|
|
547
587
|
}
|
|
588
|
+
/**
|
|
589
|
+
* Returns the path referenced in either the field, list or map attribute
|
|
590
|
+
* @param HTMLElement el
|
|
591
|
+
* @return string The path referenced, or void
|
|
592
|
+
*/
|
|
548
593
|
getBindingPath(el) {
|
|
549
594
|
const attributes = [
|
|
550
595
|
this.options.attribute + "-field",
|
|
551
596
|
this.options.attribute + "-list",
|
|
552
597
|
this.options.attribute + "-map"
|
|
553
598
|
];
|
|
554
|
-
for (let
|
|
555
|
-
if (el.hasAttribute(
|
|
556
|
-
return el.getAttribute(
|
|
599
|
+
for (let attr2 of attributes) {
|
|
600
|
+
if (el.hasAttribute(attr2)) {
|
|
601
|
+
return el.getAttribute(attr2);
|
|
557
602
|
}
|
|
558
603
|
}
|
|
559
604
|
}
|
|
@@ -667,6 +712,15 @@
|
|
|
667
712
|
case "A":
|
|
668
713
|
transformAnchor.call(this, context);
|
|
669
714
|
break;
|
|
715
|
+
case "IMG":
|
|
716
|
+
transformImage.call(this, contet);
|
|
717
|
+
break;
|
|
718
|
+
case "IFRAME":
|
|
719
|
+
transformIframe.call(this, context);
|
|
720
|
+
break;
|
|
721
|
+
case "META":
|
|
722
|
+
transformMeta.call(this, context);
|
|
723
|
+
break;
|
|
670
724
|
case "TEMPLATE":
|
|
671
725
|
break;
|
|
672
726
|
default:
|
|
@@ -684,7 +738,7 @@
|
|
|
684
738
|
const value = context.value;
|
|
685
739
|
const attribute = this.options.attribute;
|
|
686
740
|
if (!Array.isArray(value)) {
|
|
687
|
-
console.error("Value is not an array.", el, value);
|
|
741
|
+
console.error("Value is not an array.", el, path, value);
|
|
688
742
|
} else if (!templates?.length) {
|
|
689
743
|
console.error("No templates found in", el);
|
|
690
744
|
} else {
|
|
@@ -700,7 +754,7 @@
|
|
|
700
754
|
const value = context.value;
|
|
701
755
|
const attribute = this.options.attribute;
|
|
702
756
|
if (typeof value != "object") {
|
|
703
|
-
console.error("Value is not an object.", el, value);
|
|
757
|
+
console.error("Value is not an object.", el, path, value);
|
|
704
758
|
} else if (!templates?.length) {
|
|
705
759
|
console.error("No templates found in", el);
|
|
706
760
|
} else {
|
|
@@ -847,7 +901,11 @@
|
|
|
847
901
|
}
|
|
848
902
|
function transformInput(context) {
|
|
849
903
|
const el = context.element;
|
|
850
|
-
|
|
904
|
+
let value = context.value;
|
|
905
|
+
transformElement(context);
|
|
906
|
+
if (typeof value == "undefined") {
|
|
907
|
+
value = "";
|
|
908
|
+
}
|
|
851
909
|
if (el.type == "checkbox" || el.type == "radio") {
|
|
852
910
|
if (matchValue(el.value, value)) {
|
|
853
911
|
el.checked = true;
|
|
@@ -861,48 +919,116 @@
|
|
|
861
919
|
function transformButton(context) {
|
|
862
920
|
const el = context.element;
|
|
863
921
|
const value = context.value;
|
|
864
|
-
|
|
865
|
-
|
|
866
|
-
}
|
|
922
|
+
transformElement(context);
|
|
923
|
+
setProperties(el, value, "value");
|
|
867
924
|
}
|
|
868
925
|
function transformSelect(context) {
|
|
869
926
|
const el = context.element;
|
|
870
|
-
|
|
871
|
-
if (
|
|
872
|
-
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
927
|
+
let value = context.value;
|
|
928
|
+
if (value === null) {
|
|
929
|
+
value = "";
|
|
930
|
+
}
|
|
931
|
+
if (typeof value != "object") {
|
|
932
|
+
if (el.multiple) {
|
|
933
|
+
if (Array.isArray(value)) {
|
|
934
|
+
for (let option of el.options) {
|
|
935
|
+
if (value.indexOf(option.value) === false) {
|
|
936
|
+
option.selected = false;
|
|
937
|
+
} else {
|
|
938
|
+
option.selected = true;
|
|
939
|
+
}
|
|
878
940
|
}
|
|
879
941
|
}
|
|
942
|
+
} else {
|
|
943
|
+
let option = el.options.find((o) => matchValue(o.value, value));
|
|
944
|
+
if (option) {
|
|
945
|
+
option.selected = true;
|
|
946
|
+
option.setAttribute("selected", true);
|
|
947
|
+
}
|
|
880
948
|
}
|
|
881
949
|
} else {
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
950
|
+
if (value.options) {
|
|
951
|
+
setSelectOptions(el, value.options);
|
|
952
|
+
}
|
|
953
|
+
if (value.selected) {
|
|
954
|
+
transformSelect(Object.asssign({}, context, { value: value.selected }));
|
|
955
|
+
}
|
|
956
|
+
setProperties(el, value, "name", "id", "selectedIndex", "className");
|
|
957
|
+
}
|
|
958
|
+
}
|
|
959
|
+
function addOption(select, option) {
|
|
960
|
+
if (!option) {
|
|
961
|
+
return;
|
|
962
|
+
}
|
|
963
|
+
if (typeof option !== "object") {
|
|
964
|
+
select.options.add(new Option("" + option));
|
|
965
|
+
} else if (option.text) {
|
|
966
|
+
select.options.add(new Option(option.text, option.value, option.defaultSelected, option.selected));
|
|
967
|
+
} else if (typeof option.value != "undefined") {
|
|
968
|
+
select.options.add(new Option("" + option.value, option.value, option.defaultSelected, option.selected));
|
|
969
|
+
}
|
|
970
|
+
}
|
|
971
|
+
function setSelectOptions(select, options) {
|
|
972
|
+
select.innerHTML = "";
|
|
973
|
+
if (Array.isArray(options)) {
|
|
974
|
+
for (const option of options) {
|
|
975
|
+
addOption(select, option);
|
|
976
|
+
}
|
|
977
|
+
} else if (options && typeof options == "object") {
|
|
978
|
+
for (const option in options) {
|
|
979
|
+
addOption(select, { text: options[option], value: option });
|
|
885
980
|
}
|
|
886
981
|
}
|
|
887
982
|
}
|
|
888
983
|
function transformAnchor(context) {
|
|
889
984
|
const el = context.element;
|
|
890
985
|
const value = context.value;
|
|
891
|
-
|
|
892
|
-
|
|
893
|
-
}
|
|
894
|
-
if (value?.href && !matchValue(el.href, value.href)) {
|
|
895
|
-
el.href = "" + value.href;
|
|
896
|
-
}
|
|
986
|
+
transformElement(context);
|
|
987
|
+
setProperties(el, value, "title", "target", "href", "name", "newwindow", "nofollow");
|
|
897
988
|
}
|
|
898
|
-
function
|
|
989
|
+
function transformImage(context) {
|
|
899
990
|
const el = context.element;
|
|
900
991
|
const value = context.value;
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
992
|
+
transformElement(context);
|
|
993
|
+
setProperties(el, value, "title", "alt", "src");
|
|
994
|
+
}
|
|
995
|
+
function transformIframe(context) {
|
|
996
|
+
const el = context.element;
|
|
997
|
+
const value = context.value;
|
|
998
|
+
transformElement(context);
|
|
999
|
+
setProperties(el, value, "title", "src");
|
|
1000
|
+
}
|
|
1001
|
+
function transformMeta(context) {
|
|
1002
|
+
const el = context.element;
|
|
1003
|
+
const value = context.value;
|
|
1004
|
+
transformElement(context);
|
|
1005
|
+
setProperties(el, value, "content");
|
|
1006
|
+
}
|
|
1007
|
+
function transformElement(context) {
|
|
1008
|
+
const el = context.element;
|
|
1009
|
+
let value = context.value;
|
|
1010
|
+
if (typeof value == "undefined" || value == null) {
|
|
1011
|
+
value = "";
|
|
1012
|
+
}
|
|
1013
|
+
if (typeof value == "string") {
|
|
1014
|
+
el.innerHTML = "" + value;
|
|
1015
|
+
return;
|
|
1016
|
+
}
|
|
1017
|
+
setProperties(el, value, "innerHTML", "title", "id", "className");
|
|
1018
|
+
}
|
|
1019
|
+
function setProperties(el, data, ...properties) {
|
|
1020
|
+
if (!data || typeof data !== "object") {
|
|
1021
|
+
return;
|
|
1022
|
+
}
|
|
1023
|
+
for (const property of properties) {
|
|
1024
|
+
if (typeof data[property] !== "undefined") {
|
|
1025
|
+
if (!matchValue(el[property], data[property])) {
|
|
1026
|
+
if (data[property] === null) {
|
|
1027
|
+
el[property] = "";
|
|
1028
|
+
} else {
|
|
1029
|
+
el[property] = "" + data[property];
|
|
1030
|
+
}
|
|
1031
|
+
}
|
|
906
1032
|
}
|
|
907
1033
|
}
|
|
908
1034
|
}
|
|
@@ -980,13 +1106,13 @@
|
|
|
980
1106
|
}
|
|
981
1107
|
}
|
|
982
1108
|
}, options);
|
|
983
|
-
return
|
|
1109
|
+
return throttledEffect(() => {
|
|
984
1110
|
const sort2 = this.state.options.sort;
|
|
985
1111
|
if (sort2?.sortBy && sort2?.direction) {
|
|
986
1112
|
return data.current.toSorted(sort2?.sortFn);
|
|
987
1113
|
}
|
|
988
1114
|
return data.current;
|
|
989
|
-
});
|
|
1115
|
+
}, 50);
|
|
990
1116
|
};
|
|
991
1117
|
}
|
|
992
1118
|
function paging(options = {}) {
|
|
@@ -996,7 +1122,7 @@
|
|
|
996
1122
|
pageSize: 20,
|
|
997
1123
|
max: 1
|
|
998
1124
|
}, options);
|
|
999
|
-
return
|
|
1125
|
+
return throttledEffect(() => {
|
|
1000
1126
|
return batch(() => {
|
|
1001
1127
|
const paging2 = this.state.options.paging;
|
|
1002
1128
|
if (!paging2.pageSize) {
|
|
@@ -1008,26 +1134,27 @@
|
|
|
1008
1134
|
const end = start + paging2.pageSize;
|
|
1009
1135
|
return data.current.slice(start, end);
|
|
1010
1136
|
});
|
|
1011
|
-
});
|
|
1137
|
+
}, 50);
|
|
1012
1138
|
};
|
|
1013
1139
|
}
|
|
1014
1140
|
function filter(options) {
|
|
1015
1141
|
if (!options?.name || typeof options.name !== "string") {
|
|
1016
1142
|
throw new Error("filter requires options.name to be a string");
|
|
1017
1143
|
}
|
|
1018
|
-
if (this.state.options[options.name]) {
|
|
1019
|
-
throw new Error("a filter with this name already exists on this model");
|
|
1020
|
-
}
|
|
1021
1144
|
if (!options.matches || typeof options.matches !== "function") {
|
|
1022
1145
|
throw new Error("filter requires options.matches to be a function");
|
|
1023
1146
|
}
|
|
1024
1147
|
return function(data) {
|
|
1148
|
+
if (this.state.options[options.name]) {
|
|
1149
|
+
throw new Error("a filter with this name already exists on this model");
|
|
1150
|
+
}
|
|
1025
1151
|
this.state.options[options.name] = options;
|
|
1026
|
-
return
|
|
1152
|
+
return throttledEffect(() => {
|
|
1027
1153
|
if (this.state.options[options.name].enabled) {
|
|
1028
|
-
return data.filter(this.state.options[options.name].matches);
|
|
1154
|
+
return data.current.filter(this.state.options[options.name].matches.bind(this));
|
|
1029
1155
|
}
|
|
1030
|
-
|
|
1156
|
+
return data.current;
|
|
1157
|
+
}, 50);
|
|
1031
1158
|
};
|
|
1032
1159
|
}
|
|
1033
1160
|
function columns(options = {}) {
|
|
@@ -1036,7 +1163,7 @@
|
|
|
1036
1163
|
}
|
|
1037
1164
|
return function(data) {
|
|
1038
1165
|
this.state.options.columns = options;
|
|
1039
|
-
return
|
|
1166
|
+
return throttledEffect(() => {
|
|
1040
1167
|
return data.current.map((input) => {
|
|
1041
1168
|
let result = {};
|
|
1042
1169
|
for (let key of Object.keys(this.state.options.columns)) {
|
|
@@ -1046,7 +1173,7 @@
|
|
|
1046
1173
|
}
|
|
1047
1174
|
return result;
|
|
1048
1175
|
});
|
|
1049
|
-
});
|
|
1176
|
+
}, 50);
|
|
1050
1177
|
};
|
|
1051
1178
|
}
|
|
1052
1179
|
function scroll(options) {
|
|
@@ -1068,12 +1195,12 @@
|
|
|
1068
1195
|
);
|
|
1069
1196
|
});
|
|
1070
1197
|
}
|
|
1071
|
-
|
|
1198
|
+
throttledEffect(() => {
|
|
1072
1199
|
scrollOptions.size = data.current.length * scrollOptions.rowHeight;
|
|
1073
1200
|
scrollbar.style.height = scrollOptions.size + "px";
|
|
1074
|
-
});
|
|
1201
|
+
}, 50);
|
|
1075
1202
|
}
|
|
1076
|
-
return
|
|
1203
|
+
return throttledEffect(() => {
|
|
1077
1204
|
if (scrollOptions.container) {
|
|
1078
1205
|
scrollOptions.rowCount = Math.ceil(
|
|
1079
1206
|
scrollOptions.container.getBoundingClientRect().height / scrollOptions.rowHeight
|
|
@@ -1087,7 +1214,7 @@
|
|
|
1087
1214
|
start = end - scrollOptions.rowCount;
|
|
1088
1215
|
}
|
|
1089
1216
|
return data.current.slice(start, end);
|
|
1090
|
-
});
|
|
1217
|
+
}, 50);
|
|
1091
1218
|
};
|
|
1092
1219
|
}
|
|
1093
1220
|
|
package/dist/simply.flow.min.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(()=>{var J=Object.defineProperty;var V=(e,t)=>{for(var n in t)J(e,n,{get:t[n],enumerable:!0})};var R={};V(R,{batch:()=>H,clockEffect:()=>_,destroy:()=>q,effect:()=>E,signal:()=>A,throttledEffect:()=>z,untracked:()=>ee});var P=Symbol("iterate");Symbol.xRay||(Symbol.xRay=Symbol("xRay"));var Q={get:(e,t,n)=>{if(t===Symbol.xRay)return e;let i=e?.[t];return O(n,t),typeof i=="function"?Array.isArray(e)?(...r)=>{let s=e.length,l=i.apply(n,r);return s!=e.length&&S(n,w("length",{was:s,now:e.length})),l}:e instanceof Set||e instanceof Map?(...r)=>{let s=e.size,l=i.apply(e,r);return s!=e.size&&S(n,w("size",{was:s,now:e.size})),["set","add","clear","delete"].includes(t)&&S(n,w({entries:{},forEach:{},has:{},keys:{},values:{},[Symbol.iterator]:{}})),l}:e instanceof HTMLElement||e instanceof Number||e instanceof String||e instanceof Boolean?i.bind(e):i.bind(n):i&&typeof i=="object"?A(i):i},set:(e,t,n,i)=>{n=n?.[Symbol.xRay]||n;let r=e[t];return r!==n&&(e[t]=n,S(i,w(t,{was:r,now:n}))),typeof r>"u"&&S(i,w(P,{})),!0},has:(e,t)=>{let n=g.get(e);return n&&O(n,t),Object.hasOwn(e,t)},deleteProperty:(e,t)=>{if(typeof e[t]<"u"){let n=e[t];delete e[t];let i=g.get(e);S(i,w(t,{delete:!0,was:n}))}return!0},defineProperty:(e,t,n)=>{if(typeof e[t]>"u"){let i=g.get(e);S(i,w(P,{}))}return Object.defineProperty(e,t,n)},ownKeys:e=>{let t=g.get(e);return O(t,P),Reflect.ownKeys(e)}},g=new WeakMap;function A(e){return g.has(e)||g.set(e,new Proxy(e,Q)),g.get(e)}var B=new Set,k=0;function S(e,t={}){let n=[];if(t.forEach((i,r)=>{let s=Y(e,r);if(s?.length){for(let l of s)X(l,w(r,i));n=n.concat(s)}}),n=new Set(n.filter(Boolean)),n)if(k)B=B.union(n);else{let i=b[b.length-1];for(let r of Array.from(n))r!=i&&r?.needsUpdate&&r(),x(r)}}function w(e,t){let n=new Map;if(typeof e=="object")for(let i in e)n.set(i,e[i]);else n.set(e,t);return n}function X(e,t){e.context?t.forEach((n,i)=>{e.context.set(i,n)}):e.context=t,e.needsUpdate=!0}function x(e){delete e.context,delete e.needsUpdate}function O(e,t){let n=b[b.length-1];n&&Z(e,t,n)}var M=new WeakMap,C=new WeakMap;function Y(e,t){let n=M.get(e);return n?Array.from(n.get(t)||[]):[]}function Z(e,t,n){M.has(e)||M.set(e,new Map);let i=M.get(e);i.has(t)||i.set(t,new Set),i.get(t).add(n),C.has(n)||C.set(n,new Map);let r=C.get(n);r.has(t)||r.set(t,new Set),r.get(t).add(e)}function $(e){let t=C.get(e);t&&t.forEach(n=>{n.forEach(i=>{let r=M.get(i);r.has(n)&&r.get(n).delete(e)})})}var b=[],L=[],j=new WeakMap,T=[];function E(e){if(L.findIndex(i=>e==i)!==-1)throw new Error("Recursive update() call",{cause:e});L.push(e);let t=g.get(e);t||(t=A({current:null}),g.set(e,t));let n=function i(){if(T.findIndex(s=>s==t)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});$(i),b.push(i),T.push(t);let r;try{r=e(i,b,T)}finally{b.pop(),T.pop(),r instanceof Promise?r.then(s=>{t.current=s}):t.current=r}};return n.fn=e,j.set(t,n),n(),t}function q(e){let t=j.get(e)?.deref();if(!t)return;$(t);let n=t.fn;g.remove(n),j.delete(e)}function H(e){k++;let t;try{t=e()}finally{t instanceof Promise?t.then(()=>{k--,k||W()}):(k--,k||W())}return t}function W(){let e=Array.from(B);B=new Set;let t=b[b.length-1];for(let n of e)n!=t&&n?.needsUpdate&&n(),x(n)}function z(e,t){if(L.findIndex(l=>e==l)!==-1)throw new Error("Recursive update() call",{cause:e});L.push(e);let n=g.get(e);n||(n=A({current:null}),g.set(e,n));let i=!1,r=!0;return function l(){if(T.findIndex(a=>a==n)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});if(i&&i>Date.now()){r=!0;return}$(l),b.push(l),T.push(n);let o;try{o=e(l,b,T)}finally{r=!1,b.pop(),T.pop(),o instanceof Promise?o.then(a=>{n.current=a}):n.current=o}i=Date.now()+t,globalThis.setTimeout(()=>{r&&l()},t)}(),n}function _(e,t){let n=g.get(e);n||(n=A({current:null}),g.set(e,n));let i=-1,r=!0;return function l(){if(i<t.time)if(r){$(l),b.push(l),i=t.time;let o;try{o=e(l,b)}finally{b.pop(),o instanceof Promise?o.then(a=>{n.current=a}):n.current=o,r=!1}}else i=t.time;else r=!0}(),n}function ee(e){let t=b.slice();b=[];try{return e()}finally{b=t}}var N=class{constructor(t){this.bindings=new Map;let n={container:document.body,attribute:"data-bind",transformers:[],defaultTransformers:{field:[te],list:[ne],map:[ie]}};if(!t?.root)throw new Error("bind needs at least options.root set");this.options=Object.assign({},n,t);let i=this.options.attribute,r=[i+"-field",i+"-list",i+"-map"],s=`[${i}-field],[${i}-list],[${i}-map]`,l=u=>{let f=r.find(m=>u.hasAttribute(m));return f||console.error("No matching attribute found",u),f},o=u=>{this.bindings.set(u,z(()=>{let f={templates:u.querySelectorAll(":scope > template"),attribute:l(u)};f.path=this.getBindingPath(u),f.value=I(this.options.root,f.path),f.element=u,a(f)},100))},a=u=>{let f;switch(u.attribute){case this.options.attribute+"-field":f=this.options.defaultTransformers.field||[];break;case this.options.attribute+"-list":f=this.options.defaultTransformers.list||[];break;case this.options.attribute+"-map":f=this.options.defaultTransformers.map||[];break}u.element.dataset.transform&&u.element.dataset.transform.split(" ").filter(Boolean).forEach(d=>{this.options.transformers[d]?f.push(this.options.transformers[d]):console.warn("No transformer with name "+d+" configured",{cause:u.element})});let m;for(let d of f)m=((y,F)=>G=>F.call(this,G,y))(m,d);m(u)},p=u=>{for(let f of u)o(f)},c=u=>{let f=`[${i}-field],[${i}-list],[${i}-map]`;for(let m of u)if(m.type=="childList"&&m.addedNodes){for(let d of m.addedNodes)if(d instanceof HTMLElement){let y=Array.from(d.querySelectorAll(f));d.matches(f)&&y.unshift(d),y.length&&p(y)}}};this.observer=new MutationObserver(u=>{c(u)}),this.observer.observe(t.container,{subtree:!0,childList:!0});let h=this.options.container.querySelectorAll(":is(["+this.options.attribute+"-field],["+this.options.attribute+"-list],["+this.options.attribute+"-map]):not(template)");h.length&&p(h)}applyTemplate(t){let n=t.path,i=t.templates,r=t.list,s=t.index,l=t.parent,o=r?r[s]:t.value,a=this.findTemplate(i,o);if(!a){let f=new DocumentFragment;return f.innerHTML="<!-- no matching template -->",f}let p=a.content.cloneNode(!0);if(!p.children?.length)return p;if(p.children.length>1)throw new Error("template must contain a single root node",{cause:a});let c=this.options.attribute,h=[c+"-field",c+"-list",c+"-map"],u=p.querySelectorAll(`[${c}-field],[${c}-list],[${c}-map]`);for(let f of u){let m=h.find(y=>f.hasAttribute(y)),d=f.getAttribute(m);d.substring(0,6)==":root."?f.setAttribute(m,d.substring(6)):d==":value"&&s!=null?f.setAttribute(m,n+"."+s):s!=null?f.setAttribute(m,n+"."+s+"."+d):f.setAttribute(m,l+"."+d)}return typeof s<"u"&&p.children[0].setAttribute(c+"-key",s),p.children[0].$bindTemplate=a,p}getBindingPath(t){let n=[this.options.attribute+"-field",this.options.attribute+"-list",this.options.attribute+"-map"];for(let i of n)if(t.hasAttribute(i))return t.getAttribute(i)}findTemplate(t,n){let i=l=>{let o=this.getBindingPath(l),a;o?o.substr(0,6)==":root."?a=I(this.options.root,o):a=I(n,o):a=n;let p=""+a,c=l.getAttribute(this.options.attribute+"-match");if(c){if(c===":empty"&&!a)return l;if(c===":notempty"&&a||p.match(c))return l}if(!c&&a!==null&&a!==void 0)return l},r=Array.from(t).find(i),s=r?.getAttribute("rel");if(s){let l=document.querySelector("template#"+s);if(!l)throw new Error("Could not find template with id "+s);r=l}return r}destroy(){this.bindings.forEach(t=>{q(t)}),this.bindings=new Map,this.observer.disconnect()}};function D(e){return new N(e)}function v(e,t){return e==":empty"&&!t||t==":empty"&&!e||""+e==""+t}function I(e,t){let n=t.split("."),i=e,r,s;for(;n.length&&i;){if(r=n.shift(),r==":key")return s;if(r==":value")return i;r==":root"?i=e:(r=decodeURIComponent(r),i=i[r],s=r)}return i}function te(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;if(n?.length)oe.call(this,e);else switch(t.tagName){case"INPUT":ae.call(this,e);break;case"BUTTON":fe.call(this,e);break;case"SELECT":ue.call(this,e);break;case"A":ce.call(this,e);break;case"TEMPLATE":break;default:pe.call(this,e);break}return e}function ne(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;return Array.isArray(s)?n?.length?re.call(this,e):console.error("No templates found in",t):console.error("Value is not an array.",t,s),e}function ie(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;return typeof s!="object"?console.error("Value is not an object.",t,s):n?.length?se.call(this,e):console.error("No templates found in",t),e}function re(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute,o=t.querySelectorAll(":scope > ["+l+"-key]"),a=0,p=0;e.list=s;for(let h of o){let u=parseInt(h.getAttribute(l+"-key"));if(u>a)e.index=a,t.insertBefore(this.applyTemplate(e),h);else if(u<a)h.remove();else{let f=Array.from(h.querySelectorAll(`[${l}]`));h.matches(`[${l}]`)&&f.unshift(h);let m=f.find(d=>{let y=d.getAttribute(l);return y.substr(0,5)!==":root"&&y.substr(0,r.length)!==r});if(!m&&h.$bindTemplate){let d=this.findTemplate(n,s[a]);d!=h.$bindTemplate&&(m=!0,d||p++)}m&&(e.index=a,t.replaceChild(this.applyTemplate(e),h))}if(a++,a>=s.length)break}o=t.querySelectorAll(":scope > ["+l+"-key]");let c=o.length+p;if(c>s.length)for(;c>s.length;)t.querySelectorAll(":scope > :not(template)")?.[c-1]?.remove(),c--;else if(c<s.length)for(;c<s.length;)e.index=c,t.appendChild(this.applyTemplate(e)),c++}function se(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;e.list=s;let o=Array.from(t.querySelectorAll(":scope > ["+l+"-key]"));for(let a in e.list){e.index=a;let p=o.shift();if(!p){let h=this.applyTemplate(e);t.appendChild(h);continue}if(p.getAttribute[l+"-key"]!=a){o.unshift(p);let h=t.querySelector(":scope > ["+l+'-key="'+a+'"]');if(h)t.insertBefore(h,p),p=h,o=o.filter(u=>u!=h);else{let u=this.applyTemplate(e);t.insertBefore(u,p);continue}}if(this.findTemplate(n,s[a])!=p.$bindTemplate){let h=this.applyTemplate(e);t.replaceChild(h,p)}}for(;o.length;)o.shift().remove()}function le(e,t){let n=e.parentElement?.closest(`[${t}-list],[${t}-map]`);return n?n.hasAttribute(`${t}-list`)?n.getAttribute(`${t}-list`):n.getAttribute(`${t}-map`):":root"}function oe(e){let t=e.element,n=e.templates,i=e.value,r=this.options.attribute,s=t.querySelector(":scope > :not(template)"),l=this.findTemplate(n,i);if(e.parent=le(t,r),s)if(l){if(s?.$bindTemplate!=l){let o=this.applyTemplate(e);t.replaceChild(o,s)}}else t.removeChild(s);else if(l){let o=this.applyTemplate(e);t.appendChild(o)}}function ae(e){let t=e.element,n=e.value;t.type=="checkbox"||t.type=="radio"?v(t.value,n)?t.checked=!0:t.checked=!1:v(t.value,n)||(t.value=""+n)}function fe(e){let t=e.element,n=e.value;v(t.value,n)||(t.value=""+n)}function ue(e){let t=e.element,n=e.value;if(t.multiple){if(Array.isArray(n))for(let i of t.options)n.indexOf(i.value)===!1?i.selected=!1:i.selected=!0}else{let i=t.options.find(r=>v(r.value,n));i&&(i.selected=!0)}}function ce(e){let t=e.element,n=e.value;n?.innerHTML&&!v(t.innerHTML,n.innerHTML)&&(t.innerHTML=""+n.innerHTML),n?.href&&!v(t.href,n.href)&&(t.href=""+n.href)}function pe(e){let t=e.element,n=e.value;v(t.innerHTML,n)||(typeof n>"u"||n==null?t.innerHTML="":t.innerHTML=""+n)}var K={};V(K,{columns:()=>ge,filter:()=>be,model:()=>he,paging:()=>me,scroll:()=>ye,sort:()=>de});var U=class{constructor(t){this.state=A(t),this.state.options||(this.state.options={}),this.effects=[{current:t.data}],this.view=A(t.data)}addEffect(t){let n=this.effects[this.effects.length-1];this.view=t.call(this,n),this.effects.push(this.view)}};function he(e){return new U(e)}function de(e={}){return function(t){return this.state.options.sort=Object.assign({direction:"asc",sortBy:null,sortFn:(n,i)=>{let r=this.state.options.sort,s=r.sortBy;if(!r.sortBy)return 0;let l=r.direction=="asc"?1:-1,o=r.direction=="asc"?-1:1;return typeof n?.[s]>"u"?typeof i?.[s]>"u"?0:l:typeof i?.[s]>"u"||n[s]<i[s]?o:n[s]>i[s]?l:0}},e),E(()=>{let n=this.state.options.sort;return n?.sortBy&&n?.direction?t.current.toSorted(n?.sortFn):t.current})}}function me(e={}){return function(t){return this.state.options.paging=Object.assign({page:1,pageSize:20,max:1},e),E(()=>H(()=>{let n=this.state.options.paging;n.pageSize||(n.pageSize=20),n.max=Math.ceil(this.state.data.length/n.pageSize),n.page=Math.max(1,Math.min(n.max,n.page));let i=(n.page-1)*n.pageSize,r=i+n.pageSize;return t.current.slice(i,r)}))}}function be(e){if(!e?.name||typeof e.name!="string")throw new Error("filter requires options.name to be a string");if(this.state.options[e.name])throw new Error("a filter with this name already exists on this model");if(!e.matches||typeof e.matches!="function")throw new Error("filter requires options.matches to be a function");return function(t){return this.state.options[e.name]=e,E(()=>{if(this.state.options[e.name].enabled)return t.filter(this.state.options[e.name].matches)})}}function ge(e={}){if(!e||typeof e!="object"||Object.keys(e).length===0)throw new Error("columns requires options to be an object with at least one property");return function(t){return this.state.options.columns=e,E(()=>t.current.map(n=>{let i={};for(let r of Object.keys(this.state.options.columns))this.state.options.columns[r]?.hidden||(i[r]=n[r]);return i}))}}function ye(e){return function(t){this.state.options.scroll=Object.assign({offset:0,rowHeight:26,rowCount:20,itemsPerRow:1,size:t.current.length},e);let n=this.state.options.scroll,i=n.scrollbar||n.container?.querySelector("[data-flow-scrollbar]");return i&&(n.container&&n.container.addEventListener("scroll",r=>{n.offset=Math.floor(n.container.scrollTop/(n.rowHeight*n.itemsPerRow))}),E(()=>{n.size=t.current.length*n.rowHeight,i.style.height=n.size+"px"})),E(()=>{n.container&&(n.rowCount=Math.ceil(n.container.getBoundingClientRect().height/n.rowHeight)),n.data=t.current;let r=Math.min(n.offset,t.current.length-1),s=r+n.rowCount;return s>t.current.length&&(s=t.current.length,r=s-n.rowCount),t.current.slice(r,s)})}}window.simply||(window.simply={});Object.assign(window.simply,{bind:D,flow:K,state:R});var ve=window.simply;})();
|
|
1
|
+
(()=>{var Z=Object.defineProperty;var W=(e,t)=>{for(var n in t)Z(e,n,{get:t[n],enumerable:!0})};var H={};W(H,{batch:()=>N,clockEffect:()=>re,destroy:()=>$,effect:()=>ie,signal:()=>v,throttledEffect:()=>w,untracked:()=>se});var I=Symbol("iterate");Symbol.xRay||(Symbol.xRay=Symbol("xRay"));Symbol.Signal||(Symbol.Signal=Symbol("Signal"));var _={get:(e,t,n)=>{if(t===Symbol.xRay)return e;if(t===Symbol.Signal)return!0;let i=e?.[t];return R(n,t),typeof i=="function"?Array.isArray(e)?(...r)=>{let s=e.length,l=i.apply(n,r);return s!=e.length&&T(n,S("length",{was:s,now:e.length})),l}:e instanceof Set||e instanceof Map?(...r)=>{let s=e.size,l=i.apply(e,r);return s!=e.size&&T(n,S("size",{was:s,now:e.size})),["set","add","clear","delete"].includes(t)&&T(n,S({entries:{},forEach:{},has:{},keys:{},values:{},[Symbol.iterator]:{}})),l}:e instanceof HTMLElement||e instanceof Number||e instanceof String||e instanceof Boolean?i.bind(e):i.bind(n):i&&typeof i=="object"?v(i):i},set:(e,t,n,i)=>{n=n?.[Symbol.xRay]||n;let r=e[t];return r!==n&&(e[t]=n,T(i,S(t,{was:r,now:n}))),typeof r>"u"&&T(i,S(I,{})),!0},has:(e,t)=>{let n=b.get(e);return n&&R(n,t),Object.hasOwn(e,t)},deleteProperty:(e,t)=>{if(typeof e[t]<"u"){let n=e[t];delete e[t];let i=b.get(e);T(i,S(t,{delete:!0,was:n}))}return!0},defineProperty:(e,t,n)=>{if(typeof e[t]>"u"){let i=b.get(e);T(i,S(I,{}))}return Object.defineProperty(e,t,n)},ownKeys:e=>{let t=b.get(e);return R(t,I),Reflect.ownKeys(e)}},b=new WeakMap;function v(e){if(e[Symbol.Signal]){let t=e[Symbol.xRay];b.has(t)||b.set(t,e),e=t}else b.has(e)||b.set(e,new Proxy(e,_));return b.get(e)}var j=new Set,M=0;function T(e,t={}){let n=[];if(t.forEach((i,r)=>{let s=te(e,r);if(s?.length){for(let l of s)ee(l,S(r,i));n=n.concat(s)}}),n=new Set(n.filter(Boolean)),n)if(M)j=j.union(n);else{let i=m[m.length-1];for(let r of Array.from(n))r!=i&&r?.needsUpdate&&r(),G(r)}}function S(e,t){let n=new Map;if(typeof e=="object")for(let i in e)n.set(i,e[i]);else n.set(e,t);return n}function ee(e,t){e.context?t.forEach((n,i)=>{e.context.set(i,n)}):e.context=t,e.needsUpdate=!0}function G(e){delete e.context,delete e.needsUpdate}function R(e,t){let n=m[m.length-1];n&&ne(e,t,n)}var B=new WeakMap,O=new WeakMap;function te(e,t){let n=B.get(e);return n?Array.from(n.get(t)||[]):[]}function ne(e,t,n){B.has(e)||B.set(e,new Map);let i=B.get(e);i.has(t)||i.set(t,new Set),i.get(t).add(n),O.has(n)||O.set(n,new Map);let r=O.get(n);r.has(t)||r.set(t,new Set),r.get(t).add(e)}function P(e){let t=O.get(e);t&&t.forEach(n=>{n.forEach(i=>{let r=B.get(i);r.has(n)&&r.get(n).delete(e)})})}var m=[],L=[],z=new WeakMap,A=[];function ie(e){if(L.findIndex(i=>e==i)!==-1)throw new Error("Recursive update() call",{cause:e});L.push(e);let t=b.get(e);t||(t=v({current:null}),b.set(e,t));let n=function i(){if(A.findIndex(s=>s==t)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});P(i),m.push(i),A.push(t);let r;try{r=e(i,m,A)}finally{m.pop(),A.pop(),r instanceof Promise?r.then(s=>{t.current=s}):t.current=r}};return n.fn=e,z.set(t,n),n(),t}function $(e){let t=z.get(e)?.deref();if(!t)return;P(t);let n=t.fn;b.remove(n),z.delete(e)}function N(e){M++;let t;try{t=e()}finally{t instanceof Promise?t.then(()=>{M--,M||D()}):(M--,M||D())}return t}function D(){let e=Array.from(j);j=new Set;let t=m[m.length-1];for(let n of e)n!=t&&n?.needsUpdate&&n(),G(n)}function w(e,t){if(L.findIndex(l=>e==l)!==-1)throw new Error("Recursive update() call",{cause:e});L.push(e);let n=b.get(e);n||(n=v({current:null}),b.set(e,n));let i=!1,r=!0;return function l(){if(A.findIndex(f=>f==n)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});if(i&&i>Date.now()){r=!0;return}P(l),m.push(l),A.push(n);let o;try{o=e(l,m,A)}finally{r=!1,m.pop(),A.pop(),o instanceof Promise?o.then(f=>{n.current=f}):n.current=o}i=Date.now()+t,globalThis.setTimeout(()=>{r&&l()},t)}(),n}function re(e,t){let n=b.get(e);n||(n=v({current:null}),b.set(e,n));let i=-1,r=!0;return function l(){if(i<t.time)if(r){P(l),m.push(l),i=t.time;let o;try{o=e(l,m)}finally{m.pop(),o instanceof Promise?o.then(f=>{n.current=f}):n.current=o,r=!1}}else i=t.time;else r=!0}(),n}function se(e){let t=m.slice();m=[];try{return e()}finally{m=t}}var F=class{constructor(t){this.bindings=new Map;let n={container:document.body,attribute:"data-bind",transformers:{},defaultTransformers:{field:[le],list:[oe],map:[ae]}};if(!t?.root)throw new Error("bind needs at least options.root set");this.options=Object.assign({},n,t);let i=this.options.attribute,r=[i+"-field",i+"-list",i+"-map"],s=`[${i}-field],[${i}-list],[${i}-map]`,l=i+"-transform",o=a=>{let u=r.find(d=>a.hasAttribute(d));return u||console.error("No matching attribute found",a,attr),u},f=a=>{this.bindings.set(a,w(()=>{if(!a.isConnected){$(this.bindings.get(a));return}let u={templates:a.querySelectorAll(":scope > template"),attribute:o(a)};u.path=this.getBindingPath(a),u.value=U(this.options.root,u.path),u.element=a,p(u)},50))},p=a=>{let u;switch(a.attribute){case this.options.attribute+"-field":u=this.options.defaultTransformers.field||[];break;case this.options.attribute+"-list":u=this.options.defaultTransformers.list||[];break;case this.options.attribute+"-map":u=this.options.defaultTransformers.map||[];break}a.element.hasAttribute(l)?a.element.getAttribute(l).split(" ").filter(Boolean).forEach(g=>{this.options.transformers[g]?u.push(this.options.transformers[g]):console.warn("No transformer with name "+g+" configured",{cause:a.element})}):console.log(a.element.outerHTML);let d;for(let g of u)d=((C,X)=>Y=>X.call(this,Y,C))(d,g);d(a)},c=a=>{for(let u of a)this.bindings.get(u)||f(u)},h=a=>{let u=`[${i}-field],[${i}-list],[${i}-map]`;for(let d of a)if(d.type=="childList"&&d.addedNodes){for(let g of d.addedNodes)if(g instanceof HTMLElement){let C=Array.from(g.querySelectorAll(u));g.matches(u)&&C.unshift(g),C.length&&c(C)}}};this.observer=new MutationObserver(a=>{h(a)}),this.observer.observe(this.options.container,{subtree:!0,childList:!0});let y=this.options.container.querySelectorAll(":is(["+this.options.attribute+"-field],["+this.options.attribute+"-list],["+this.options.attribute+"-map]):not(template)");y.length&&c(y)}applyTemplate(t){let n=t.path,i=t.templates,r=t.list,s=t.index,l=t.parent,o=r?r[s]:t.value,f=this.findTemplate(i,o);if(!f){let a=new DocumentFragment;return a.innerHTML="<!-- no matching template -->",a}let p=f.content.cloneNode(!0);if(!p.children?.length)return p;if(p.children.length>1)throw new Error("template must contain a single root node",{cause:f});let c=this.options.attribute,h=[c+"-field",c+"-list",c+"-map"],y=p.querySelectorAll(`[${c}-field],[${c}-list],[${c}-map]`);for(let a of y){let u=h.find(g=>a.hasAttribute(g)),d=a.getAttribute(u);d.substring(0,6)==":root."?a.setAttribute(u,d.substring(6)):d==":value"&&s!=null?a.setAttribute(u,n+"."+s):s!=null?a.setAttribute(u,n+"."+s+"."+d):a.setAttribute(u,l+"."+d)}return typeof s<"u"&&p.children[0].setAttribute(c+"-key",s),Object.defineProperty(p.children[0],"$bindTemplate",{value:f,enumerable:!1,writable:!0,configurable:!0}),p}getBindingPath(t){let n=[this.options.attribute+"-field",this.options.attribute+"-list",this.options.attribute+"-map"];for(let i of n)if(t.hasAttribute(i))return t.getAttribute(i)}findTemplate(t,n){let i=l=>{let o=this.getBindingPath(l),f;o?o.substr(0,6)==":root."?f=U(this.options.root,o):f=U(n,o):f=n;let p=""+f,c=l.getAttribute(this.options.attribute+"-match");if(c){if(c===":empty"&&!f)return l;if(c===":notempty"&&f||p.match(c))return l}if(!c&&f!==null&&f!==void 0)return l},r=Array.from(t).find(i),s=r?.getAttribute("rel");if(s){let l=document.querySelector("template#"+s);if(!l)throw new Error("Could not find template with id "+s);r=l}return r}destroy(){this.bindings.forEach(t=>{$(t)}),this.bindings=new Map,this.observer.disconnect()}};function J(e){return new F(e)}function q(e,t){return e==":empty"&&!t||t==":empty"&&!e||""+e==""+t}function U(e,t){let n=t.split("."),i=e,r,s;for(;n.length&&i;){if(r=n.shift(),r==":key")return s;if(r==":value")return i;r==":root"?i=e:(r=decodeURIComponent(r),i=i[r],s=r)}return i}function le(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;if(n?.length)pe.call(this,e);else switch(t.tagName){case"INPUT":he.call(this,e);break;case"BUTTON":de.call(this,e);break;case"SELECT":Q.call(this,e);break;case"A":be.call(this,e);break;case"IMG":ge.call(this,contet);break;case"IFRAME":ye.call(this,e);break;case"META":we.call(this,e);break;case"TEMPLATE":break;default:E.call(this,e);break}return e}function oe(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;return Array.isArray(s)?n?.length?fe.call(this,e):console.error("No templates found in",t):console.error("Value is not an array.",t,r,s),e}function ae(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;return typeof s!="object"?console.error("Value is not an object.",t,r,s):n?.length?ue.call(this,e):console.error("No templates found in",t),e}function fe(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute,o=t.querySelectorAll(":scope > ["+l+"-key]"),f=0,p=0;e.list=s;for(let h of o){let y=parseInt(h.getAttribute(l+"-key"));if(y>f)e.index=f,t.insertBefore(this.applyTemplate(e),h);else if(y<f)h.remove();else{let a=Array.from(h.querySelectorAll(`[${l}]`));h.matches(`[${l}]`)&&a.unshift(h);let u=a.find(d=>{let g=d.getAttribute(l);return g.substr(0,5)!==":root"&&g.substr(0,r.length)!==r});if(!u&&h.$bindTemplate){let d=this.findTemplate(n,s[f]);d!=h.$bindTemplate&&(u=!0,d||p++)}u&&(e.index=f,t.replaceChild(this.applyTemplate(e),h))}if(f++,f>=s.length)break}o=t.querySelectorAll(":scope > ["+l+"-key]");let c=o.length+p;if(c>s.length)for(;c>s.length;)t.querySelectorAll(":scope > :not(template)")?.[c-1]?.remove(),c--;else if(c<s.length)for(;c<s.length;)e.index=c,t.appendChild(this.applyTemplate(e)),c++}function ue(e){let t=e.element,n=e.templates,i=n.length,r=e.path,s=e.value,l=this.options.attribute;e.list=s;let o=Array.from(t.querySelectorAll(":scope > ["+l+"-key]"));for(let f in e.list){e.index=f;let p=o.shift();if(!p){let h=this.applyTemplate(e);t.appendChild(h);continue}if(p.getAttribute[l+"-key"]!=f){o.unshift(p);let h=t.querySelector(":scope > ["+l+'-key="'+f+'"]');if(h)t.insertBefore(h,p),p=h,o=o.filter(y=>y!=h);else{let y=this.applyTemplate(e);t.insertBefore(y,p);continue}}if(this.findTemplate(n,s[f])!=p.$bindTemplate){let h=this.applyTemplate(e);t.replaceChild(h,p)}}for(;o.length;)o.shift().remove()}function ce(e,t){let n=e.parentElement?.closest(`[${t}-list],[${t}-map]`);return n?n.hasAttribute(`${t}-list`)?n.getAttribute(`${t}-list`):n.getAttribute(`${t}-map`):":root"}function pe(e){let t=e.element,n=e.templates,i=e.value,r=this.options.attribute,s=t.querySelector(":scope > :not(template)"),l=this.findTemplate(n,i);if(e.parent=ce(t,r),s)if(l){if(s?.$bindTemplate!=l){let o=this.applyTemplate(e);t.replaceChild(o,s)}}else t.removeChild(s);else if(l){let o=this.applyTemplate(e);t.appendChild(o)}}function he(e){let t=e.element,n=e.value;E(e),typeof n>"u"&&(n=""),t.type=="checkbox"||t.type=="radio"?q(t.value,n)?t.checked=!0:t.checked=!1:q(t.value,n)||(t.value=""+n)}function de(e){let t=e.element,n=e.value;E(e),k(t,n,"value")}function Q(e){let t=e.element,n=e.value;if(n===null&&(n=""),typeof n!="object")if(t.multiple){if(Array.isArray(n))for(let i of t.options)n.indexOf(i.value)===!1?i.selected=!1:i.selected=!0}else{let i=t.options.find(r=>q(r.value,n));i&&(i.selected=!0,i.setAttribute("selected",!0))}else n.options&&me(t,n.options),n.selected&&Q(Object.asssign({},e,{value:n.selected})),k(t,n,"name","id","selectedIndex","className")}function x(e,t){t&&(typeof t!="object"?e.options.add(new Option(""+t)):t.text?e.options.add(new Option(t.text,t.value,t.defaultSelected,t.selected)):typeof t.value<"u"&&e.options.add(new Option(""+t.value,t.value,t.defaultSelected,t.selected)))}function me(e,t){if(e.innerHTML="",Array.isArray(t))for(let n of t)x(e,n);else if(t&&typeof t=="object")for(let n in t)x(e,{text:t[n],value:n})}function be(e){let t=e.element,n=e.value;E(e),k(t,n,"title","target","href","name","newwindow","nofollow")}function ge(e){let t=e.element,n=e.value;E(e),k(t,n,"title","alt","src")}function ye(e){let t=e.element,n=e.value;E(e),k(t,n,"title","src")}function we(e){let t=e.element,n=e.value;E(e),k(t,n,"content")}function E(e){let t=e.element,n=e.value;if((typeof n>"u"||n==null)&&(n=""),typeof n=="string"){t.innerHTML=""+n;return}k(t,n,"innerHTML","title","id","className")}function k(e,t,...n){if(!(!t||typeof t!="object"))for(let i of n)typeof t[i]<"u"&&(q(e[i],t[i])||(t[i]===null?e[i]="":e[i]=""+t[i]))}var V={};W(V,{columns:()=>Ee,filter:()=>Te,model:()=>Se,paging:()=>ve,scroll:()=>ke,sort:()=>Ae});var K=class{constructor(t){this.state=v(t),this.state.options||(this.state.options={}),this.effects=[{current:t.data}],this.view=v(t.data)}addEffect(t){let n=this.effects[this.effects.length-1];this.view=t.call(this,n),this.effects.push(this.view)}};function Se(e){return new K(e)}function Ae(e={}){return function(t){return this.state.options.sort=Object.assign({direction:"asc",sortBy:null,sortFn:(n,i)=>{let r=this.state.options.sort,s=r.sortBy;if(!r.sortBy)return 0;let l=r.direction=="asc"?1:-1,o=r.direction=="asc"?-1:1;return typeof n?.[s]>"u"?typeof i?.[s]>"u"?0:l:typeof i?.[s]>"u"||n[s]<i[s]?o:n[s]>i[s]?l:0}},e),w(()=>{let n=this.state.options.sort;return n?.sortBy&&n?.direction?t.current.toSorted(n?.sortFn):t.current},50)}}function ve(e={}){return function(t){return this.state.options.paging=Object.assign({page:1,pageSize:20,max:1},e),w(()=>N(()=>{let n=this.state.options.paging;n.pageSize||(n.pageSize=20),n.max=Math.ceil(this.state.data.length/n.pageSize),n.page=Math.max(1,Math.min(n.max,n.page));let i=(n.page-1)*n.pageSize,r=i+n.pageSize;return t.current.slice(i,r)}),50)}}function Te(e){if(!e?.name||typeof e.name!="string")throw new Error("filter requires options.name to be a string");if(!e.matches||typeof e.matches!="function")throw new Error("filter requires options.matches to be a function");return function(t){if(this.state.options[e.name])throw new Error("a filter with this name already exists on this model");return this.state.options[e.name]=e,w(()=>this.state.options[e.name].enabled?t.current.filter(this.state.options[e.name].matches.bind(this)):t.current,50)}}function Ee(e={}){if(!e||typeof e!="object"||Object.keys(e).length===0)throw new Error("columns requires options to be an object with at least one property");return function(t){return this.state.options.columns=e,w(()=>t.current.map(n=>{let i={};for(let r of Object.keys(this.state.options.columns))this.state.options.columns[r]?.hidden||(i[r]=n[r]);return i}),50)}}function ke(e){return function(t){this.state.options.scroll=Object.assign({offset:0,rowHeight:26,rowCount:20,itemsPerRow:1,size:t.current.length},e);let n=this.state.options.scroll,i=n.scrollbar||n.container?.querySelector("[data-flow-scrollbar]");return i&&(n.container&&n.container.addEventListener("scroll",r=>{n.offset=Math.floor(n.container.scrollTop/(n.rowHeight*n.itemsPerRow))}),w(()=>{n.size=t.current.length*n.rowHeight,i.style.height=n.size+"px"},50)),w(()=>{n.container&&(n.rowCount=Math.ceil(n.container.getBoundingClientRect().height/n.rowHeight)),n.data=t.current;let r=Math.min(n.offset,t.current.length-1),s=r+n.rowCount;return s>t.current.length&&(s=t.current.length,r=s-n.rowCount),t.current.slice(r,s)},50)}}window.simply||(window.simply={});Object.assign(window.simply,{bind:J,flow:V,state:H});var Pe=window.simply;})();
|
|
2
2
|
//# sourceMappingURL=simply.flow.min.js.map
|