simplyflow 0.7.8 → 0.8.1

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.
@@ -13,7 +13,7 @@
13
13
  clockEffect: () => clockEffect,
14
14
  clone: () => clone,
15
15
  destroy: () => destroy,
16
- effect: () => effect2,
16
+ effect: () => effect,
17
17
  makeContext: () => makeContext,
18
18
  notifyGet: () => notifyGet,
19
19
  notifySet: () => notifySet,
@@ -23,7 +23,9 @@
23
23
  trace: () => trace,
24
24
  untracked: () => untracked
25
25
  });
26
- var iterate2 = Symbol("iterate");
26
+ if (!Symbol.iterate) {
27
+ Symbol.iterate = Symbol("iterate");
28
+ }
27
29
  if (!Symbol.xRay) {
28
30
  Symbol.xRay = Symbol("xRay");
29
31
  }
@@ -80,7 +82,8 @@
80
82
  notifySet(receiver, makeContext(property, { was: current, now: value }));
81
83
  }
82
84
  if (typeof current === "undefined") {
83
- notifySet(receiver, makeContext(iterate2, {}));
85
+ notifySet(receiver, makeContext(Symbol.iterate, {}));
86
+ notifySet(receiver, makeContext("length", {}));
84
87
  }
85
88
  return true;
86
89
  },
@@ -103,18 +106,21 @@
103
106
  defineProperty: (target, property, descriptor) => {
104
107
  if (typeof target[property] === "undefined") {
105
108
  let receiver = signals.get(target);
106
- notifySet(receiver, makeContext(iterate2, {}));
109
+ notifySet(receiver, makeContext(Symbol.iterate, {}));
107
110
  }
108
111
  return Object.defineProperty(target, property, descriptor);
109
112
  },
110
113
  ownKeys: (target) => {
111
114
  let receiver = signals.get(target);
112
- notifyGet(receiver, iterate2);
115
+ notifyGet(receiver, Symbol.iterate);
113
116
  return Reflect.ownKeys(target);
114
117
  }
115
118
  };
116
119
  var signals = /* @__PURE__ */ new WeakMap();
117
120
  function signal(v) {
121
+ if (!v) {
122
+ v = {};
123
+ }
118
124
  if (v[Symbol.Signal]) {
119
125
  return v;
120
126
  }
@@ -266,7 +272,7 @@
266
272
  var effectStack = [];
267
273
  var effectMap = /* @__PURE__ */ new WeakMap();
268
274
  var signalStack = [];
269
- function effect2(fn) {
275
+ function effect(fn) {
270
276
  if (effectStack.findIndex((f) => fn == f) !== -1) {
271
277
  throw new Error("Recursive update() call", { cause: fn });
272
278
  }
@@ -284,7 +290,7 @@
284
290
  }
285
291
  clearListeners(computeEffect2);
286
292
  computeEffect2.effectFunction = fn;
287
- computeEffect2.effectType = effect2;
293
+ computeEffect2.effectType = effect;
288
294
  computeStack.push(computeEffect2);
289
295
  signalStack.push(connectedSignal);
290
296
  let result;
@@ -558,18 +564,27 @@
558
564
  return Reflect.ownKeys(target);
559
565
  }
560
566
  };
561
- function signal2(el) {
567
+ function signal2(el, options) {
562
568
  if (el[Symbol.xRay]) {
563
569
  return el;
564
570
  }
565
571
  if (!signals.has(el)) {
566
572
  signals.set(el, new Proxy(el, domSignalHandler));
567
- domListen(el, signals.get(el));
573
+ domListen(el, signals.get(el), options);
568
574
  }
569
575
  return signals.get(el);
570
576
  }
571
577
  var observers = /* @__PURE__ */ new WeakMap();
572
- function domListen(el, signal3) {
578
+ function domListen(el, signal3, options) {
579
+ const defaultOptions = {
580
+ characterData: true,
581
+ subtree: true,
582
+ attributes: true,
583
+ attributesOldValue: true
584
+ };
585
+ if (!options) {
586
+ options = defaultOptions;
587
+ }
573
588
  let oldContentHTML = el.innerHTML;
574
589
  let oldContentText = el.innerText;
575
590
  if (!observers.has(el)) {
@@ -587,18 +602,22 @@
587
602
  changes.innerText = oldContentText;
588
603
  oldContentText = el.innerText;
589
604
  }
605
+ } else if (mutation.type === "childList") {
606
+ changes.children = {
607
+ //FIXME: overwrites changes in this list path if list is rendered multiple times
608
+ was: Array.from(el.children)
609
+ //FIXME; fill in 'now'
610
+ };
611
+ changes.length = -1;
612
+ } else {
613
+ console.log("nothing to do for", el, mutation.type);
590
614
  }
591
615
  }
592
616
  for (const prop in changes) {
593
617
  notifySet(signal3, makeContext(prop, { was: changes[prop], now: el[prop] }));
594
618
  }
595
619
  });
596
- observer.observe(el, {
597
- characterData: true,
598
- subtree: true,
599
- attributes: true,
600
- attributesOldValue: true
601
- });
620
+ observer.observe(el, options);
602
621
  observers.set(el, observer);
603
622
  if (el.matches("input, textarea, select")) {
604
623
  let prevValue = el.value;
@@ -627,12 +646,6 @@
627
646
  }
628
647
  } else if (this.options.renderers["*"]) {
629
648
  this.options.renderers["*"].call(this, context);
630
- if (this.options.twoway) {
631
- const s = signal2(context.element);
632
- effect(() => {
633
- setValueByPath(this.options.root, context.path, s.innerHTML);
634
- });
635
- }
636
649
  }
637
650
  return context;
638
651
  }
@@ -640,6 +653,7 @@
640
653
  if (!Array.isArray(context.value)) {
641
654
  context.value = [context.value];
642
655
  }
656
+ const length = context.value.length;
643
657
  if (!context.templates?.length) {
644
658
  console.error("No templates found in", context.element);
645
659
  } else {
@@ -657,33 +671,64 @@
657
671
  }
658
672
  return context;
659
673
  }
674
+ function isInt(s) {
675
+ if (parseInt(s) == s) {
676
+ return true;
677
+ }
678
+ }
660
679
  function setValueByPath(root, path, value) {
661
- let parts = path.split(".");
662
- let curr = root;
663
- let part;
664
- part = parts.shift();
665
- let prev = null;
666
- let prevPart = null;
667
- while (part && curr) {
668
- part = decodeURIComponent(part);
669
- if (part == "0" && !Array.isArray(curr)) {
670
- } else if (part == ":key") {
671
- throw new Error("setting key not yet supported");
672
- curr = prevPart;
673
- } else if (part == ":value") {
674
- } else if (Array.isArray(curr) && typeof curr[part] == "undefined") {
675
- prev = curr[0];
676
- curr = curr[0][part];
677
- } else {
678
- prev = curr;
679
- curr = curr[part];
680
- }
681
- prevPart = part;
680
+ batch(() => {
681
+ let parts = path.split(".");
682
+ let curr = root;
683
+ let part;
682
684
  part = parts.shift();
683
- }
684
- if (prev && prevPart && prev[prevPart] !== value) {
685
- prev[prevPart] = value;
686
- }
685
+ let prev = null;
686
+ let prevPart = null;
687
+ let prevCurr = curr;
688
+ while (part && curr) {
689
+ prevCurr = curr;
690
+ part = decodeURIComponent(part);
691
+ if (part == "0" && !Array.isArray(curr)) {
692
+ } else if (part == ":key") {
693
+ throw new Error("setting key not yet supported");
694
+ curr = prevPart;
695
+ } else if (part == ":value") {
696
+ } else if (Array.isArray(curr) && !isInt(part) && typeof curr[part] == "undefined") {
697
+ prev = curr[0];
698
+ curr = curr[0][part];
699
+ } else {
700
+ prev = curr;
701
+ curr = curr[part];
702
+ }
703
+ prevPart = part;
704
+ part = parts.shift();
705
+ if (part && !curr) {
706
+ const intKey = parseInt(part);
707
+ if (intKey >= 0 && part === "" + intKey) {
708
+ prevCurr[prevPart] = [];
709
+ } else {
710
+ prevCurr[prevPart] = {};
711
+ }
712
+ curr = prevCurr[prevPart];
713
+ }
714
+ }
715
+ if (prev && prevPart && prev[prevPart] !== value) {
716
+ if (value && typeof value == "object") {
717
+ curr = prev[prevPart];
718
+ if (!curr) {
719
+ prev[prevPart] = {};
720
+ curr = prev[prevPart];
721
+ }
722
+ for (const prop in value) {
723
+ if (curr[prop] !== value[prop]) {
724
+ curr[prop] = value[prop];
725
+ }
726
+ }
727
+ } else {
728
+ prev[prevPart] = value;
729
+ }
730
+ }
731
+ });
687
732
  }
688
733
  function arrayByTemplates(context) {
689
734
  const attribute = this.options.attribute;
@@ -743,6 +788,39 @@
743
788
  length++;
744
789
  }
745
790
  }
791
+ if (this.options.twoway) {
792
+ const s = signal2(context.element, {
793
+ childList: true
794
+ });
795
+ throttledEffect(() => {
796
+ const children = Array.from(s.children);
797
+ batch(() => {
798
+ untracked(() => {
799
+ let key = 0;
800
+ const currentList = context.value.slice();
801
+ for (const item of children) {
802
+ if (item.tagName === "TEMPLATE") {
803
+ continue;
804
+ }
805
+ if (item.dataset.flowKey) {
806
+ if (item.dataset.flowKey != key) {
807
+ setValueByPath(
808
+ this.options.root,
809
+ context.path + "." + key,
810
+ currentList[item.dataset.flowKey]
811
+ );
812
+ }
813
+ key++;
814
+ }
815
+ }
816
+ if (context.value.length > key) {
817
+ const source = getValueByPath(this.options.root, context.path);
818
+ source.length = key;
819
+ }
820
+ });
821
+ });
822
+ });
823
+ }
746
824
  }
747
825
  function objectByTemplates(context) {
748
826
  const attribute = this.options.attribute;
@@ -756,7 +834,7 @@
756
834
  context.element.appendChild(clone2);
757
835
  continue;
758
836
  }
759
- if (item.getAttribute[attribute + "-key"] != key) {
837
+ if (item.getAttribute(attribute + "-key") != key) {
760
838
  items.unshift(item);
761
839
  let outOfOrderItem = context.element.querySelector(":scope > [" + attribute + '-key="' + key + '"]');
762
840
  if (!outOfOrderItem) {
@@ -811,7 +889,7 @@
811
889
  function input(context) {
812
890
  const el = context.element;
813
891
  let value = context.value;
814
- element(context);
892
+ element.call(this, context);
815
893
  if (typeof value == "undefined") {
816
894
  value = "";
817
895
  }
@@ -826,8 +904,7 @@
826
904
  }
827
905
  }
828
906
  function button(context) {
829
- element(context);
830
- setProperties(context.element, context.value, "value");
907
+ element.call(this, context, "value");
831
908
  }
832
909
  function select(context) {
833
910
  const el = context.element;
@@ -888,29 +965,72 @@
888
965
  }
889
966
  }
890
967
  function anchor(context) {
891
- element(context);
892
- setProperties(context.element, context.value, "target", "href", "name", "newwindow", "nofollow");
968
+ element.call(this, context, "target", "href", "name", "newwindow", "nofollow");
969
+ if (this.options.twoway) {
970
+ batch(() => {
971
+ updateProperties.call(this, context, ["target", "href", "name", "newwindow", "nofollow"]);
972
+ });
973
+ }
893
974
  }
894
975
  function image(context) {
895
976
  setProperties(context.element, context.value, "title", "alt", "src", "id");
977
+ if (this.options.twoway) {
978
+ batch(() => {
979
+ updateProperties.call(this, context, ["title", "alt", "src", "id"]);
980
+ });
981
+ }
896
982
  }
897
983
  function iframe(context) {
898
984
  setProperties(context.element, context.value, "title", "src", "id");
985
+ if (this.options.twoway) {
986
+ batch(() => {
987
+ updateProperties.call(this, context, ["title", "src", "id"]);
988
+ });
989
+ }
899
990
  }
900
991
  function meta(context) {
901
992
  setProperties(context.element, context.value, "content", "id");
993
+ if (this.options.twoway) {
994
+ batch(() => {
995
+ updateProperties.call(this, context, ["content", "id"]);
996
+ });
997
+ }
902
998
  }
903
- function element(context) {
999
+ var domSignals = /* @__PURE__ */ new WeakMap();
1000
+ function element(context, ...extraprops) {
904
1001
  const el = context.element;
905
1002
  let value = context.value;
906
- if (typeof value == "undefined" || value == null) {
907
- value = "";
1003
+ let valueIsString = false;
1004
+ if (typeof value != "undefined" && value !== null) {
1005
+ let strValue = "" + value;
1006
+ if (typeof value != "object" || strValue.substring(0, 8) != "[object ") {
1007
+ value = { innerHTML: value };
1008
+ valueIsString = true;
1009
+ }
1010
+ }
1011
+ const props = ["innerHTML", "title", "id", "className"].concat(extraprops);
1012
+ setProperties(el, value, ...props);
1013
+ if (this.options.twoway) {
1014
+ batch(() => {
1015
+ updateProperties.call(this, context, props, valueIsString);
1016
+ });
908
1017
  }
909
- let strValue = "" + value;
910
- if (typeof value != "object" || strValue.substring(0, 8) != "[object ") {
911
- value = { innerHTML: value };
1018
+ }
1019
+ function updateProperties(context, props, valueIsString) {
1020
+ if (domSignals.has(context.element)) {
1021
+ return;
912
1022
  }
913
- setProperties(el, value, "innerHTML", "title", "id", "className");
1023
+ const s = signal2(context.element);
1024
+ domSignals.set(context.element, s);
1025
+ throttledEffect(() => {
1026
+ let updateValue = s.innerHTML;
1027
+ if (!valueIsString) {
1028
+ updateValue = getProperties(s, ...props);
1029
+ }
1030
+ untracked(() => {
1031
+ setValueByPath(this.options.root, context.path, updateValue);
1032
+ });
1033
+ });
914
1034
  }
915
1035
  function setProperties(el, data, ...properties) {
916
1036
  if (!data || typeof data !== "object") {
@@ -930,6 +1050,17 @@
930
1050
  }
931
1051
  }
932
1052
  }
1053
+ function getProperties(el, ...properties) {
1054
+ const result = {};
1055
+ for (const property of properties) {
1056
+ switch (property) {
1057
+ default:
1058
+ result[property] = el[property];
1059
+ break;
1060
+ }
1061
+ }
1062
+ return result;
1063
+ }
933
1064
  function matchValue(a, b) {
934
1065
  if (a == ":empty" && !b) {
935
1066
  return true;
@@ -981,7 +1112,8 @@
981
1112
  "META": meta,
982
1113
  "TEMPLATE": null,
983
1114
  "*": element
984
- }
1115
+ },
1116
+ twoway: false
985
1117
  };
986
1118
  if (!options?.root) {
987
1119
  throw new Error("bind needs at least options.root set");
@@ -1209,7 +1341,7 @@
1209
1341
  return t;
1210
1342
  }
1211
1343
  }
1212
- if (!matches && currentItem !== null && currentItem !== void 0) {
1344
+ if (!matches) {
1213
1345
  return t;
1214
1346
  }
1215
1347
  };
@@ -1269,7 +1401,7 @@
1269
1401
  } else if (part == ":key") {
1270
1402
  curr = prevPart;
1271
1403
  } else if (part == ":value") {
1272
- } else if (Array.isArray(curr) && typeof curr[part] == "undefined") {
1404
+ } else if (Array.isArray(curr) && typeof curr[part] == "undefined" && curr[0]) {
1273
1405
  curr = curr[0][part];
1274
1406
  } else {
1275
1407
  curr = curr[part];
@@ -1,2 +1,2 @@
1
- (()=>{var Te=Object.defineProperty;var $=(e,t)=>{for(var n in t)Te(e,n,{get:t[n],enumerable:!0})};var W={};$(W,{addTracer:()=>Ee,batch:()=>V,clockEffect:()=>re,clone:()=>Le,destroy:()=>R,effect:()=>ne,makeContext:()=>b,notifyGet:()=>E,notifySet:()=>w,signal:()=>S,signals:()=>c,throttledEffect:()=>T,trace:()=>Ae,untracked:()=>Me});var F=Symbol("iterate");Symbol.xRay||(Symbol.xRay=Symbol("xRay"));Symbol.Signal||(Symbol.Signal=Symbol("Signal"));var Se={get:(e,t,n)=>{if(t===Symbol.xRay)return e;if(t===Symbol.Signal)return!0;let r=e?.[t];return E(n,t),typeof r=="function"?Array.isArray(e)?(...i)=>{let s=e.length,l=r.apply(n,i);return s!=e.length&&w(n,b("length",{was:s,now:e.length})),l}:e instanceof Set||e instanceof Map?(...i)=>{let s=e.size,l=r.apply(e,i);return s!=e.size&&w(n,b("size",{was:s,now:e.size})),["set","add","clear","delete"].includes(t)&&w(n,b({entries:{},forEach:{},has:{},keys:{},values:{},[Symbol.iterator]:{}})),l}:e instanceof HTMLElement||e instanceof Number||e instanceof String||e instanceof Boolean?r.bind(e):r.bind(n):r&&typeof r=="object"?S(r):r},set:(e,t,n,r)=>{let i=e[t];return i!==n&&(e[t]=n,w(r,b(t,{was:i,now:n}))),typeof i>"u"&&w(r,b(F,{})),!0},has:(e,t)=>{let n=c.get(e);return n&&E(n,t),Object.hasOwn(e,t)},deleteProperty:(e,t)=>{if(typeof e[t]<"u"){let n=e[t];delete e[t];let r=c.get(e);w(r,b(t,{delete:!0,was:n}))}return!0},defineProperty:(e,t,n)=>{if(typeof e[t]>"u"){let r=c.get(e);w(r,b(F,{}))}return Object.defineProperty(e,t,n)},ownKeys:e=>{let t=c.get(e);return E(t,F),Reflect.ownKeys(e)}},c=new WeakMap;function S(e){return e[Symbol.Signal]?e:(c.has(e)||c.set(e,new Proxy(e,Se)),c.get(e))}var q=[],P=!1;function Ae(e,t){if(typeof e=="function")P=!0,e(),P=!1;else return te(e,t).map(r=>({effect:r.effectType,fn:r.effectFunction,signal:c.get(r.effectFunction)}))}function Ee(e){if(!e.get&&!e.set)throw new Error('simply.state: addTracer: missing "get" or "set" property in tracer',e);if(e.get&&typeof e.get!="function")throw new Error('simply.state: addTracer: "get" is not a function',e);if(e.set&&typeof e.set!="function")throw new Error('simply.state: addTracer: "set" is not a function',e);q.push(e)}function x(e,...t){for(let n of q)n[e]&&n[e](...t)}var H=new Set,k=0;function w(e,t={}){let n=[];if(t.forEach((r,i)=>{let s=te(e,i);if(s?.length){for(let l of s)ve(l,b(i,r));n=n.concat(s)}}),n=new Set(n.filter(Boolean)),n)if(k)H=H.union(n);else{let r=d[d.length-1];for(let i of Array.from(n))i!=r&&i?.needsUpdate&&(P&&q.length&&x("set",e,t,i),i()),ee(i)}}function b(e,t){let n=new Map;if(typeof e=="object")for(let r in e)n.set(r,e[r]);else n.set(e,t);return n}function ve(e,t){e.context?t.forEach((n,r)=>{e.context.set(r,n)}):e.context=t,e.needsUpdate=!0}function ee(e){delete e.context,delete e.needsUpdate}function E(e,t){let n=d[d.length-1];n&&(P&&q.length&&x("get",e,t),ke(e,t,n))}var L=new WeakMap,B=new WeakMap;function te(e,t){let n=L.get(e);return n?Array.from(n.get(t)||[]):[]}function ke(e,t,n){L.has(e)||L.set(e,new Map);let r=L.get(e);r.has(t)||r.set(t,new Set),r.get(t).add(n),B.has(n)||B.set(n,new Map);let i=B.get(n);i.has(t)||i.set(t,new Set),i.get(t).add(e)}function I(e){let t=B.get(e);t&&t.forEach(n=>{n.forEach(r=>{let i=L.get(r);i.has(n)&&i.get(n).delete(e)})})}var d=[],N=[],U=new WeakMap,A=[];function ne(e){if(N.findIndex(r=>e==r)!==-1)throw new Error("Recursive update() call",{cause:e});N.push(e);let t=c.get(e);t||(t=S({current:null}),c.set(e,t));let n=function r(){if(A.findIndex(s=>s==t)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});I(r),r.effectFunction=e,r.effectType=ne,d.push(r),A.push(t);let i;try{i=e(r,d,A)}finally{d.pop(),A.pop(),i instanceof Promise?i.then(s=>{t.current=s}):t.current=i}};return n.fn=e,U.set(t,n),n(),t}function R(e){let t=U.get(e)?.deref();if(!t)return;I(t);let n=t.fn;c.remove(n),U.delete(e)}function V(e){k++;let t;try{t=e()}finally{t instanceof Promise?t.then(()=>{k--,k||Z()}):(k--,k||Z())}return t}function Z(){let e=Array.from(H);H=new Set;let t=d[d.length-1];for(let n of e)n!=t&&n?.needsUpdate&&n(),ee(n)}function T(e,t){if(N.findIndex(l=>e==l)!==-1)throw new Error("Recursive update() call",{cause:e});N.push(e);let n=c.get(e);n||(n=S({current:null}),c.set(e,n));let r=!1,i=!0;return function l(){if(A.findIndex(f=>f==n)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});if(r&&r>Date.now()){i=!0;return}I(l),l.effectFunction=e,l.effectType=T,d.push(l),A.push(n);let o;try{o=e(l,d,A)}finally{i=!1,d.pop(),A.pop(),o instanceof Promise?o.then(f=>{n.current=f}):n.current=o}r=Date.now()+t,globalThis.setTimeout(()=>{i&&l()},t)}(),n}function re(e,t){let n=c.get(e);n||(n=S({current:null}),c.set(e,n));let r=-1,i=!0;return function l(){if(r<t.time)if(i){I(l),l.effectFunction=e,l.effectType=re,d.push(l),r=t.time;let o;try{o=e(l,d)}finally{d.pop(),o instanceof Promise?o.then(f=>{n.current=f}):n.current=o,i=!1}}else r=t.time;else i=!0}(),n}function Me(e){let t=d.length-1,n=d[t];d[t]=!1;try{return e()}finally{d[t]=n}}function Le(e,t=!1){let n=new Map,r=function(i){if(n.has(i))return n.get(i);switch(typeof i){case"object":if(!i)return i;if(Array.isArray(i)){let s=[];if(!t)return s=i.slice(),n.set(i,s),s;n.set(i,s);for(let l of i)s[l]=r(i[l])}else if(!i.constructor||i.constructor===Object){let s={};i.constructor||(s=Object.create(null)),n.set(i,s);for(let l in i)s[l]=t?r(i[l]):i[l];return s}else return i;break;default:return null}};return r(e)}function ie(e,t){let n=e.value?.innerHTML;typeof e.value=="string"&&(n=e.value,e.value={innerHTML:n}),n&&(n=n.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;"),e.value.innerHTML=n),t(e)}function se(e,t){typeof e.value=="string"?e.value={}:delete e.value?.innerHTML,t(e)}var K={};$(K,{signal:()=>D});var Oe={get:(e,t,n)=>{if(t===Symbol.xRay)return e;if(t===Symbol.Signal)return!0;let r=e?.[t];return E(n,t),typeof r=="function"?r.bind(e):r&&typeof r=="object"?S(r):r},has:(e,t)=>{let n=c.get(e);return n&&E(n,t),Object.hasOwn(e,t)},ownKeys:e=>{let t=c.get(e);return t&&E(t,iterate),Reflect.ownKeys(e)}};function D(e){return e[Symbol.xRay]?e:(c.has(e)||(c.set(e,new Proxy(e,Oe)),Ce(e,c.get(e))),c.get(e))}var le=new WeakMap;function Ce(e,t){let n=e.innerHTML,r=e.innerText;if(!le.has(e)){let i=new MutationObserver((s,l)=>{let o={};for(let f of s)f.type==="attributes"?o[f.attributeName]=f.attributeOldValue:(f.type==="subtree"||f.type==="characterData")&&(e.innerHTML!=n&&(o.innerHTML=n,n=e.innerHTML),e.innerText!=r&&(o.innerText=r,r=e.innerText));for(let f in o)w(t,b(f,{was:o[f],now:e[f]}))});if(i.observe(e,{characterData:!0,subtree:!0,attributes:!0,attributesOldValue:!0}),le.set(e,i),e.matches("input, textarea, select")){let s=e.value;e.addEventListener("change",l=>{w(t,b("value",{was:s,now:e.value})),s=e.value}),e.matches("input, textarea")&&e.addEventListener("input",l=>{w(t,b("value",{was:s,now:e.value})),s=e.value})}}}function ae(e){if(e.templates?.length)He.call(this,e);else if(Object.hasOwnProperty.call(this.options.renderers,e.element.tagName)){let t=this.options.renderers[e.element.tagName];t&&t.call(this,e)}else if(this.options.renderers["*"]&&(this.options.renderers["*"].call(this,e),this.options.twoway)){let t=D(e.element);effect(()=>{je(this.options.root,e.path,t.innerHTML)})}return e}function fe(e){return Array.isArray(e.value)||(e.value=[e.value]),e.templates?.length?Be.call(this,e):console.error("No templates found in",e.element),e}function ue(e){return typeof e.value!="object"||!e.value?console.error("Value is not an object.",e.element,e.path,e.value):e.templates?.length?Pe.call(this,e):console.error("No templates found in",e.element),e}function je(e,t,n){let r=t.split("."),i=e,s;s=r.shift();let l=null,o=null;for(;s&&i;){if(s=decodeURIComponent(s),!(s=="0"&&!Array.isArray(i))){if(s==":key")throw new Error("setting key not yet supported");s==":value"||(Array.isArray(i)&&typeof i[s]>"u"?(l=i[0],i=i[0][s]):(l=i,i=i[s]))}o=s,s=r.shift()}l&&o&&l[o]!==n&&(l[o]=n)}function Be(e){let t=this.options.attribute,n=e.element.querySelectorAll(":scope > ["+t+"-key]"),r=0,i=0;e.list=e.value;for(let l of n){let o=parseInt(l.getAttribute(t+"-key"));if(o>r)e.index=r,e.element.insertBefore(this.applyTemplate(e),l);else if(o<r)l.remove();else{let f=Array.from(l.querySelectorAll(`[${t}]`));l.matches(`[${t}]`)&&f.unshift(l);let p=f.find(h=>{let y=h.getAttribute(t);return y.substr(0,5)!==":root"&&y.substr(0,e.path.length)!==e.path});if(!p&&l[Symbol.bindTemplate]){let h=this.findTemplate(e.templates,e.list[r]);h!=l[Symbol.bindTemplate]&&(p=!0,h||i++)}p&&(e.index=r,e.element.replaceChild(this.applyTemplate(e),l))}if(r++,r>=e.value.length)break}n=e.element.querySelectorAll(":scope > ["+t+"-key]");let s=n.length+i;if(s>e.value.length)for(;s>e.value.length;)e.element.querySelectorAll(":scope > :not(template)")?.[s-1]?.remove(),s--;else if(s<e.value.length)for(;s<e.value.length;)e.index=s,e.element.appendChild(this.applyTemplate(e)),s++}function Pe(e){let t=this.options.attribute;e.list=e.value;let n=Array.from(e.element.querySelectorAll(":scope > ["+t+"-key]"));for(let r in e.list){e.index=r;let i=n.shift();if(!i){let l=this.applyTemplate(e);e.element.appendChild(l);continue}if(i.getAttribute[t+"-key"]!=r){n.unshift(i);let l=e.element.querySelector(":scope > ["+t+'-key="'+r+'"]');if(l)e.element.insertBefore(l,i),i=l,n=n.filter(o=>o!=l);else{let o=this.applyTemplate(e);e.element.insertBefore(o,i);continue}}if(this.findTemplate(e.templates,e.list[e.index])!=i[Symbol.bindTemplate]){let l=this.applyTemplate(e);e.element.replaceChild(l,i)}}for(;n.length;)n.shift().remove()}function He(e){let t=e.element.querySelector(":scope > :not(template)"),n=this.findTemplate(e.templates,e.value);if(e.parent=Ne(e.element),t)if(n){if(t?.[Symbol.bindTemplate]!=n){let r=this.applyTemplate(e);e.element.replaceChild(r,t)}}else e.element.removeChild(t);else if(n){let r=this.applyTemplate(e);e.element.appendChild(r)}}function Ne(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`)+".":""}function ce(e){let t=e.element,n=e.value;O(e),typeof n>"u"&&(n=""),t.type=="checkbox"||t.type=="radio"?z(t.value,n)?t.checked=!0:t.checked=!1:z(t.value,n)||(t.value=""+n)}function pe(e){O(e),v(e.element,e.value,"value")}function _(e){let t=e.element,n=e.value;if(n===null&&(n=""),typeof n!="object")if(t.multiple){if(Array.isArray(n))for(let r of t.options)n.indexOf(r.value)===!1?r.selected=!1:r.selected=!0}else{let r=t.options.find(i=>z(i.value,n));r&&(r.selected=!0,r.setAttribute("selected",!0))}else n.options&&qe(t,n.options),n.selected&&_(Object.asssign({},e,{value:n.selected})),v(t,n,"name","id","selectedIndex","className")}function oe(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 qe(e,t){if(e.innerHTML="",Array.isArray(t))for(let n of t)oe(e,n);else if(t&&typeof t=="object")for(let n in t)oe(e,{text:t[n],value:n})}function de(e){O(e),v(e.element,e.value,"target","href","name","newwindow","nofollow")}function he(e){v(e.element,e.value,"title","alt","src","id")}function me(e){v(e.element,e.value,"title","src","id")}function be(e){v(e.element,e.value,"content","id")}function O(e){let t=e.element,n=e.value;(typeof n>"u"||n==null)&&(n="");let r=""+n;(typeof n!="object"||r.substring(0,8)!="[object ")&&(n={innerHTML:n}),v(t,n,"innerHTML","title","id","className")}function v(e,t,...n){if(!(!t||typeof t!="object"))for(let r of n)typeof t[r]>"u"||z(e[r],t[r])||(t[r]===null?e[r]="":e[r]=""+t[r])}function z(e,t){return e==":empty"&&!t||t==":empty"&&!e||""+e==""+t}Symbol.bindTemplate||(Symbol.bindTemplate=Symbol("bindTemplate"));var J=class{constructor(t){this.bindings=new Map;let n={escape_html:ie,fixed_content:se},r={container:document.body,attribute:"data-flow",transformers:n,render:{field:[ae],list:[fe],map:[ue]},renderers:{INPUT:ce,BUTTON:pe,SELECT:_,A:de,IMG:he,IFRAME:me,META:be,TEMPLATE:null,"*":O}};if(!t?.root)throw new Error("bind needs at least options.root set");this.options=Object.assign({},r,t),t.transformers&&(this.options.transformers=Object.assign({},n,t?.transformers));let i=this.options.attribute,s=[i+"-field",i+"-list",i+"-map"],l=i+"-transform",o=a=>{let u=s.find(m=>a.hasAttribute(m));return u||console.error("No matching attribute found",a,s),u},f=a=>{this.bindings.set(a,T(()=>{if(!a.isConnected){ze(a,this.getBindingPath(a)),R(this.bindings.get(a));return}let u={templates:a.querySelectorAll(":scope > template"),attribute:o(a)};u.path=this.getBindingPath(a),u.value=G(this.options.root,u.path),u.element=a,Re(a,u),p(u)},50))},p=a=>{let u;switch(a.attribute){case this.options.attribute+"-field":u=Array.from(this.options.render.field);break;case this.options.attribute+"-list":u=Array.from(this.options.render.list);break;case this.options.attribute+"-map":u=Array.from(this.options.render.map);break;default:throw new Error("no valid context attribute specified",a)}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})});let m;for(let g of u)m=((M,ge)=>we=>ge.call(this,we,M))(m,g);m(a)},h=a=>{for(let u of a)this.bindings.get(u)||f(u)},y=a=>{let u=`[${i}-field],[${i}-list],[${i}-map]`;for(let m of a)if(m.type=="childList"&&m.addedNodes){for(let g of m.addedNodes)if(g instanceof HTMLElement){let M=Array.from(g.querySelectorAll(u));g.matches(u)&&M.unshift(g),M.length&&h(M)}}};this.observer=new MutationObserver(a=>{y(a)}),this.observer.observe(this.options.container,{subtree:!0,childList:!0});let j=this.options.container.querySelectorAll(":is(["+this.options.attribute+"-field],["+this.options.attribute+"-list],["+this.options.attribute+"-map]):not(template)");j.length&&h(j)}applyTemplate(t){let n=t.path,r=t.parent,i=t.templates,s=t.list,l=t.index,o=s?s[l]: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 h=this.options.attribute,y=[h+"-field",h+"-list",h+"-map"],j=p.querySelectorAll(`[${h}-field],[${h}-list],[${h}-map]`);for(let a of j){if(a.tagName=="TEMPLATE")continue;let u=y.find(g=>a.hasAttribute(g)),m=a.getAttribute(u);m=this.applyLinks(f.links,m),m.substring(0,6)==":root."?a.setAttribute(u,m.substring(6)):m==":value"&&l!=null?a.setAttribute(u,n+"."+l):l!=null?a.setAttribute(u,n+"."+l+"."+m):a.setAttribute(u,r+m)}return typeof l<"u"&&p.children[0].setAttribute(h+"-key",l),p.children[0][Symbol.bindTemplate]=f,p}parseLinks(t){let n={};t=t.split(";").map(r=>r.trim());for(let r of t)r=r.split("="),n[r[0].trim()]=r[1].trim();return n}applyLinks(t,n){for(let r in t){if(n.startsWith(r+"."))return t[r]+n.substr(r.length);if(n==r)return t[r]}return n}getBindingPath(t){let n=[this.options.attribute+"-field",this.options.attribute+"-list",this.options.attribute+"-map"];for(let r of n)if(t.hasAttribute(r))return t.getAttribute(r)}findTemplate(t,n){let r=o=>{let f=this.getBindingPath(o),p;f?f.substr(0,6)==":root."?p=G(this.options.root,f):p=G(n,f):p=n;let h=""+p,y=o.getAttribute(this.options.attribute+"-match");if(y){if(y===":empty"&&!p)return o;if(y===":notempty"&&p||h==y)return o}if(!y&&p!==null&&p!==void 0)return o},i=Array.from(t).find(r),s=null;i?.hasAttribute(this.options.attribute+"-link")&&(s=this.parseLinks(i.getAttribute(this.options.attribute+"-link")));let l=i?.getAttribute("rel");if(l){let o=document.querySelector("template#"+l);if(!o)throw new Error("Could not find template with id "+l);i=o}return i&&(i.links=s),i}destroy(){this.bindings.forEach(t=>{R(t)}),this.bindings=new Map,this.observer.disconnect()}};function ye(e){return new J(e)}var C=new Map;function Re(e,t){C.has(t.path)?C.get(t.path).push(t):C.set(t.path,[t])}function ze(e,t){let n=C.get(t);n&&(n=n.filter(r=>r.element==e),C.set(t,n))}function G(e,t){let n=t.split("."),r=e,i;i=n.shift();let s=null;for(;i&&r;)i=decodeURIComponent(i),i=="0"&&!Array.isArray(r)||(i==":key"?r=s:i==":value"||(Array.isArray(r)&&typeof r[i]>"u"?r=r[0][i]:r=r[i])),s=i,i=n.shift();return r}var X={};$(X,{columns:()=>We,filter:()=>Ve,model:()=>$e,paging:()=>Ue,scroll:()=>De,sort:()=>Fe});var Q=class{constructor(t){if(!t)throw new Error("no options set");(t.data==null||typeof t.data[Symbol.iterator]!="function")&&console.warn("SimplyFlowModel: options.data is not iterable"),this.state=S(t),this.state.options||(this.state.options={}),this.effects=[{current:this.state.data}],this.view={current:this.state.data}}addEffect(t){if(!t||typeof t!="function")throw new Error("addEffect requires an effect function as its parameter",{cause:t});let n=this.effects[this.effects.length-1],r=t.call(this,n);if(!r||!r[Symbol.Signal])throw new Error("addEffect function parameter must return a Signal",{cause:t});this.view=r,this.effects.push(this.view)}};function $e(e){return new Q(e)}function Fe(e={}){return function(t){return this.state.options.sort=Object.assign({direction:"asc",sortBy:null,sortFn:(n,r)=>{let i=this.state.options.sort,s=i.sortBy;if(!i.sortBy)return 0;let l=i.direction=="asc"?1:-1,o=i.direction=="asc"?-1:1;return typeof n?.[s]>"u"?typeof r?.[s]>"u"?0:l:typeof r?.[s]>"u"||n[s]<r[s]?o:n[s]>r[s]?l:0}},e),T(()=>{let n=this.state.options.sort;return n?.sortBy&&n?.direction?t.current.toSorted(n?.sortFn):t.current},50)}}function Ue(e={}){return function(t){return this.state.options.paging=Object.assign({page:1,pageSize:20,max:1},e),T(()=>V(()=>{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 r=(n.page-1)*n.pageSize,i=r+n.pageSize;return t.current.slice(r,i)}),50)}}function Ve(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,T(()=>this.state.options[e.name].enabled?t.current.filter(this.state.options[e.name].matches.bind(this)):t.current,50)}}function We(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,T(()=>t.current.map(n=>{let r={};for(let i of Object.keys(this.state.options.columns))this.state.options.columns[i]?.hidden||(r[i]=n[i]??null);return r}),50)}}function De(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,r=n.scrollbar||n.container?.querySelector("[data-flow-scrollbar]");return r&&(n.container&&n.container.addEventListener("scroll",i=>{n.offset=Math.floor(n.container.scrollTop/(n.rowHeight*n.itemsPerRow))}),T(()=>{n.size=t.current.length*n.rowHeight,r.style.height=n.size+"px"},50)),T(()=>{n.container&&(n.rowCount=Math.ceil(n.container.getBoundingClientRect().height/n.rowHeight)),n.data=t.current;let i=Math.min(n.offset,t.current.length-1),s=i+n.rowCount;return s>t.current.length&&(s=t.current.length,i=s-n.rowCount),t.current.slice(i,s)},50)}}var Y=class extends HTMLElement{constructor(){super()}connectedCallback(){let t=this.getAttribute("rel"),n=document.getElementById(t);if(n){let r=n.content.cloneNode(!0);for(let i of r.childNodes){let s=i.cloneNode(!0);if(s.nodeType==document.ELEMENT_NODE&&(s.querySelectorAll("template").forEach(function(l){l.setAttribute("simply-render","")}),this.attributes))for(let l of this.attributes)l.name!="rel"&&s.setAttribute(l.name,l.value);this.parentNode.insertBefore(s,this)}this.parentNode.removeChild(this)}else(()=>{let i=new MutationObserver(()=>{n=document.getElementById(t),n&&(i.disconnect(),this.replaceWith(this))});i.observe(globalThis.document,{subtree:!0,childList:!0})})()}};customElements.get("simply-render")||customElements.define("simply-render",Y);globalThis.simply||(globalThis.simply={});Object.assign(globalThis.simply,{bind:ye,flow:X,state:W,dom:K});var rt=globalThis.simply;})();
1
+ (()=>{var Ee=Object.defineProperty;var W=(e,t)=>{for(var n in t)Ee(e,n,{get:t[n],enumerable:!0})};var _={};W(_,{addTracer:()=>Me,batch:()=>T,clockEffect:()=>ie,clone:()=>Ce,destroy:()=>K,effect:()=>re,makeContext:()=>y,notifyGet:()=>v,notifySet:()=>g,signal:()=>A,signals:()=>h,throttledEffect:()=>b,trace:()=>ke,untracked:()=>V});Symbol.iterate||(Symbol.iterate=Symbol("iterate"));Symbol.xRay||(Symbol.xRay=Symbol("xRay"));Symbol.Signal||(Symbol.Signal=Symbol("Signal"));var ve={get:(e,t,n)=>{if(t===Symbol.xRay)return e;if(t===Symbol.Signal)return!0;let r=e?.[t];return v(n,t),typeof r=="function"?Array.isArray(e)?(...i)=>{let s=e.length,o=r.apply(n,i);return s!=e.length&&g(n,y("length",{was:s,now:e.length})),o}:e instanceof Set||e instanceof Map?(...i)=>{let s=e.size,o=r.apply(e,i);return s!=e.size&&g(n,y("size",{was:s,now:e.size})),["set","add","clear","delete"].includes(t)&&g(n,y({entries:{},forEach:{},has:{},keys:{},values:{},[Symbol.iterator]:{}})),o}:e instanceof HTMLElement||e instanceof Number||e instanceof String||e instanceof Boolean?r.bind(e):r.bind(n):r&&typeof r=="object"?A(r):r},set:(e,t,n,r)=>{let i=e[t];return i!==n&&(e[t]=n,g(r,y(t,{was:i,now:n}))),typeof i>"u"&&(g(r,y(Symbol.iterate,{})),g(r,y("length",{}))),!0},has:(e,t)=>{let n=h.get(e);return n&&v(n,t),Object.hasOwn(e,t)},deleteProperty:(e,t)=>{if(typeof e[t]<"u"){let n=e[t];delete e[t];let r=h.get(e);g(r,y(t,{delete:!0,was:n}))}return!0},defineProperty:(e,t,n)=>{if(typeof e[t]>"u"){let r=h.get(e);g(r,y(Symbol.iterate,{}))}return Object.defineProperty(e,t,n)},ownKeys:e=>{let t=h.get(e);return v(t,Symbol.iterate),Reflect.ownKeys(e)}},h=new WeakMap;function A(e){return e||(e={}),e[Symbol.Signal]?e:(h.has(e)||h.set(e,new Proxy(e,ve)),h.get(e))}var z=[],I=!1;function ke(e,t){if(typeof e=="function")I=!0,e(),I=!1;else return ne(e,t).map(r=>({effect:r.effectType,fn:r.effectFunction,signal:h.get(r.effectFunction)}))}function Me(e){if(!e.get&&!e.set)throw new Error('simply.state: addTracer: missing "get" or "set" property in tracer',e);if(e.get&&typeof e.get!="function")throw new Error('simply.state: addTracer: "get" is not a function',e);if(e.set&&typeof e.set!="function")throw new Error('simply.state: addTracer: "set" is not a function',e);z.push(e)}function ee(e,...t){for(let n of z)n[e]&&n[e](...t)}var q=new Set,k=0;function g(e,t={}){let n=[];if(t.forEach((r,i)=>{let s=ne(e,i);if(s?.length){for(let o of s)Le(o,y(i,r));n=n.concat(s)}}),n=new Set(n.filter(Boolean)),n)if(k)q=q.union(n);else{let r=d[d.length-1];for(let i of Array.from(n))i!=r&&i?.needsUpdate&&(I&&z.length&&ee("set",e,t,i),i()),te(i)}}function y(e,t){let n=new Map;if(typeof e=="object")for(let r in e)n.set(r,e[r]);else n.set(e,t);return n}function Le(e,t){e.context?t.forEach((n,r)=>{e.context.set(r,n)}):e.context=t,e.needsUpdate=!0}function te(e){delete e.context,delete e.needsUpdate}function v(e,t){let n=d[d.length-1];n&&(I&&z.length&&ee("get",e,t),Oe(e,t,n))}var L=new WeakMap,H=new WeakMap;function ne(e,t){let n=L.get(e);return n?Array.from(n.get(t)||[]):[]}function Oe(e,t,n){L.has(e)||L.set(e,new Map);let r=L.get(e);r.has(t)||r.set(t,new Set),r.get(t).add(n),H.has(n)||H.set(n,new Map);let i=H.get(n);i.has(t)||i.set(t,new Set),i.get(t).add(e)}function $(e){let t=H.get(e);t&&t.forEach(n=>{n.forEach(r=>{let i=L.get(r);i.has(n)&&i.get(n).delete(e)})})}var d=[],R=[],D=new WeakMap,E=[];function re(e){if(R.findIndex(r=>e==r)!==-1)throw new Error("Recursive update() call",{cause:e});R.push(e);let t=h.get(e);t||(t=A({current:null}),h.set(e,t));let n=function r(){if(E.findIndex(s=>s==t)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});$(r),r.effectFunction=e,r.effectType=re,d.push(r),E.push(t);let i;try{i=e(r,d,E)}finally{d.pop(),E.pop(),i instanceof Promise?i.then(s=>{t.current=s}):t.current=i}};return n.fn=e,D.set(t,n),n(),t}function K(e){let t=D.get(e)?.deref();if(!t)return;$(t);let n=t.fn;h.remove(n),D.delete(e)}function T(e){k++;let t;try{t=e()}finally{t instanceof Promise?t.then(()=>{k--,k||x()}):(k--,k||x())}return t}function x(){let e=Array.from(q);q=new Set;let t=d[d.length-1];for(let n of e)n!=t&&n?.needsUpdate&&n(),te(n)}function b(e,t){if(R.findIndex(o=>e==o)!==-1)throw new Error("Recursive update() call",{cause:e});R.push(e);let n=h.get(e);n||(n=A({current:null}),h.set(e,n));let r=!1,i=!0;return function o(){if(E.findIndex(c=>c==n)!==-1)throw new Error("Cyclical dependency in update() call",{cause:e});if(r&&r>Date.now()){i=!0;return}$(o),o.effectFunction=e,o.effectType=b,d.push(o),E.push(n);let l;try{l=e(o,d,E)}finally{i=!1,d.pop(),E.pop(),l instanceof Promise?l.then(c=>{n.current=c}):n.current=l}r=Date.now()+t,globalThis.setTimeout(()=>{i&&o()},t)}(),n}function ie(e,t){let n=h.get(e);n||(n=A({current:null}),h.set(e,n));let r=-1,i=!0;return function o(){if(r<t.time)if(i){$(o),o.effectFunction=e,o.effectType=ie,d.push(o),r=t.time;let l;try{l=e(o,d)}finally{d.pop(),l instanceof Promise?l.then(c=>{n.current=c}):n.current=l,i=!1}}else r=t.time;else i=!0}(),n}function V(e){let t=d.length-1,n=d[t];d[t]=!1;try{return e()}finally{d[t]=n}}function Ce(e,t=!1){let n=new Map,r=function(i){if(n.has(i))return n.get(i);switch(typeof i){case"object":if(!i)return i;if(Array.isArray(i)){let s=[];if(!t)return s=i.slice(),n.set(i,s),s;n.set(i,s);for(let o of i)s[o]=r(i[o])}else if(!i.constructor||i.constructor===Object){let s={};i.constructor||(s=Object.create(null)),n.set(i,s);for(let o in i)s[o]=t?r(i[o]):i[o];return s}else return i;break;default:return null}};return r(e)}function se(e,t){let n=e.value?.innerHTML;typeof e.value=="string"&&(n=e.value,e.value={innerHTML:n}),n&&(n=n.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;"),e.value.innerHTML=n),t(e)}function oe(e,t){typeof e.value=="string"?e.value={}:delete e.value?.innerHTML,t(e)}var G={};W(G,{signal:()=>F});var je={get:(e,t,n)=>{if(t===Symbol.xRay)return e;if(t===Symbol.Signal)return!0;let r=e?.[t];return v(n,t),typeof r=="function"?r.bind(e):r&&typeof r=="object"?A(r):r},has:(e,t)=>{let n=h.get(e);return n&&v(n,t),Object.hasOwn(e,t)},ownKeys:e=>{let t=h.get(e);return t&&v(t,iterate),Reflect.ownKeys(e)}};function F(e,t){return e[Symbol.xRay]?e:(h.has(e)||(h.set(e,new Proxy(e,je)),Be(e,h.get(e),t)),h.get(e))}var le=new WeakMap;function Be(e,t,n){n||(n={characterData:!0,subtree:!0,attributes:!0,attributesOldValue:!0});let i=e.innerHTML,s=e.innerText;if(!le.has(e)){let o=new MutationObserver((l,c)=>{let a={};for(let u of l)u.type==="attributes"?a[u.attributeName]=u.attributeOldValue:u.type==="subtree"||u.type==="characterData"?(e.innerHTML!=i&&(a.innerHTML=i,i=e.innerHTML),e.innerText!=s&&(a.innerText=s,s=e.innerText)):u.type==="childList"?(a.children={was:Array.from(e.children)},a.length=-1):console.log("nothing to do for",e,u.type);for(let u in a)g(t,y(u,{was:a[u],now:e[u]}))});if(o.observe(e,n),le.set(e,o),e.matches("input, textarea, select")){let l=e.value;e.addEventListener("change",c=>{g(t,y("value",{was:l,now:e.value})),l=e.value}),e.matches("input, textarea")&&e.addEventListener("input",c=>{g(t,y("value",{was:l,now:e.value})),l=e.value})}}}function ue(e){if(e.templates?.length)Ie.call(this,e);else if(Object.hasOwnProperty.call(this.options.renderers,e.element.tagName)){let t=this.options.renderers[e.element.tagName];t&&t.call(this,e)}else this.options.renderers["*"]&&this.options.renderers["*"].call(this,e);return e}function ce(e){Array.isArray(e.value)||(e.value=[e.value]);let t=e.value.length;return e.templates?.length?Ne.call(this,e):console.error("No templates found in",e.element),e}function pe(e){return typeof e.value!="object"||!e.value?console.error("Value is not an object.",e.element,e.path,e.value):e.templates?.length?He.call(this,e):console.error("No templates found in",e.element),e}function Pe(e){if(parseInt(e)==e)return!0}function he(e,t,n){T(()=>{let r=t.split("."),i=e,s;s=r.shift();let o=null,l=null,c=i;for(;s&&i;){if(c=i,s=decodeURIComponent(s),!(s=="0"&&!Array.isArray(i))){if(s==":key")throw new Error("setting key not yet supported");s==":value"||(Array.isArray(i)&&!Pe(s)&&typeof i[s]>"u"?(o=i[0],i=i[0][s]):(o=i,i=i[s]))}if(l=s,s=r.shift(),s&&!i){let a=parseInt(s);a>=0&&s===""+a?c[l]=[]:c[l]={},i=c[l]}}if(o&&l&&o[l]!==n)if(n&&typeof n=="object"){i=o[l],i||(o[l]={},i=o[l]);for(let a in n)i[a]!==n[a]&&(i[a]=n[a])}else o[l]=n})}function Ne(e){let t=this.options.attribute,n=e.element.querySelectorAll(":scope > ["+t+"-key]"),r=0,i=0;e.list=e.value;for(let o of n){let l=parseInt(o.getAttribute(t+"-key"));if(l>r)e.index=r,e.element.insertBefore(this.applyTemplate(e),o);else if(l<r)o.remove();else{let c=Array.from(o.querySelectorAll(`[${t}]`));o.matches(`[${t}]`)&&c.unshift(o);let a=c.find(u=>{let w=u.getAttribute(t);return w.substr(0,5)!==":root"&&w.substr(0,e.path.length)!==e.path});if(!a&&o[Symbol.bindTemplate]){let u=this.findTemplate(e.templates,e.list[r]);u!=o[Symbol.bindTemplate]&&(a=!0,u||i++)}a&&(e.index=r,e.element.replaceChild(this.applyTemplate(e),o))}if(r++,r>=e.value.length)break}n=e.element.querySelectorAll(":scope > ["+t+"-key]");let s=n.length+i;if(s>e.value.length)for(;s>e.value.length;)e.element.querySelectorAll(":scope > :not(template)")?.[s-1]?.remove(),s--;else if(s<e.value.length)for(;s<e.value.length;)e.index=s,e.element.appendChild(this.applyTemplate(e)),s++;if(this.options.twoway){let o=F(e.element,{childList:!0});b(()=>{let l=Array.from(o.children);T(()=>{V(()=>{let c=0,a=e.value.slice();for(let u of l)u.tagName!=="TEMPLATE"&&u.dataset.flowKey&&(u.dataset.flowKey!=c&&he(this.options.root,e.path+"."+c,a[u.dataset.flowKey]),c++);if(e.value.length>c){let u=B(this.options.root,e.path);u.length=c}})})})}}function He(e){let t=this.options.attribute;e.list=e.value;let n=Array.from(e.element.querySelectorAll(":scope > ["+t+"-key]"));for(let r in e.list){e.index=r;let i=n.shift();if(!i){let o=this.applyTemplate(e);e.element.appendChild(o);continue}if(i.getAttribute(t+"-key")!=r){n.unshift(i);let o=e.element.querySelector(":scope > ["+t+'-key="'+r+'"]');if(o)e.element.insertBefore(o,i),i=o,n=n.filter(l=>l!=o);else{let l=this.applyTemplate(e);e.element.insertBefore(l,i);continue}}if(this.findTemplate(e.templates,e.list[e.index])!=i[Symbol.bindTemplate]){let o=this.applyTemplate(e);e.element.replaceChild(o,i)}}for(;n.length;)n.shift().remove()}function Ie(e){let t=e.element.querySelector(":scope > :not(template)"),n=this.findTemplate(e.templates,e.value);if(e.parent=qe(e.element),t)if(n){if(t?.[Symbol.bindTemplate]!=n){let r=this.applyTemplate(e);e.element.replaceChild(r,t)}}else e.element.removeChild(t);else if(n){let r=this.applyTemplate(e);e.element.appendChild(r)}}function qe(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`)+".":""}function de(e){let t=e.element,n=e.value;O.call(this,e),typeof n>"u"&&(n=""),t.type=="checkbox"||t.type=="radio"?U(t.value,n)?t.checked=!0:t.checked=!1:U(t.value,n)||(t.value=""+n)}function me(e){O.call(this,e,"value")}function J(e){let t=e.element,n=e.value;if(n===null&&(n=""),typeof n!="object")if(t.multiple){if(Array.isArray(n))for(let r of t.options)n.indexOf(r.value)===!1?r.selected=!1:r.selected=!0}else{let r=t.options.find(i=>U(i.value,n));r&&(r.selected=!0,r.setAttribute("selected",!0))}else n.options&&Re(t,n.options),n.selected&&J(Object.asssign({},e,{value:n.selected})),j(t,n,"name","id","selectedIndex","className")}function ae(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 Re(e,t){if(e.innerHTML="",Array.isArray(t))for(let n of t)ae(e,n);else if(t&&typeof t=="object")for(let n in t)ae(e,{text:t[n],value:n})}function ye(e){O.call(this,e,"target","href","name","newwindow","nofollow"),this.options.twoway&&T(()=>{C.call(this,e,["target","href","name","newwindow","nofollow"])})}function be(e){j(e.element,e.value,"title","alt","src","id"),this.options.twoway&&T(()=>{C.call(this,e,["title","alt","src","id"])})}function ge(e){j(e.element,e.value,"title","src","id"),this.options.twoway&&T(()=>{C.call(this,e,["title","src","id"])})}function we(e){j(e.element,e.value,"content","id"),this.options.twoway&&T(()=>{C.call(this,e,["content","id"])})}var fe=new WeakMap;function O(e,...t){let n=e.element,r=e.value,i=!1;if(typeof r<"u"&&r!==null){let o=""+r;(typeof r!="object"||o.substring(0,8)!="[object ")&&(r={innerHTML:r},i=!0)}let s=["innerHTML","title","id","className"].concat(t);j(n,r,...s),this.options.twoway&&T(()=>{C.call(this,e,s,i)})}function C(e,t,n){if(fe.has(e.element))return;let r=F(e.element);fe.set(e.element,r),b(()=>{let i=r.innerHTML;n||(i=ze(r,...t)),V(()=>{he(this.options.root,e.path,i)})})}function j(e,t,...n){if(!(!t||typeof t!="object"))for(let r of n)typeof t[r]>"u"||U(e[r],t[r])||(t[r]===null?e[r]="":e[r]=""+t[r])}function ze(e,...t){let n={};for(let r of t)switch(r){default:n[r]=e[r];break}return n}function U(e,t){return e==":empty"&&!t||t==":empty"&&!e||""+e==""+t}Symbol.bindTemplate||(Symbol.bindTemplate=Symbol("bindTemplate"));var Q=class{constructor(t){this.bindings=new Map;let n={escape_html:se,fixed_content:oe},r={container:document.body,attribute:"data-flow",transformers:n,render:{field:[ue],list:[ce],map:[pe]},renderers:{INPUT:de,BUTTON:me,SELECT:J,A:ye,IMG:be,IFRAME:ge,META:we,TEMPLATE:null,"*":O},twoway:!1};if(!t?.root)throw new Error("bind needs at least options.root set");this.options=Object.assign({},r,t),t.transformers&&(this.options.transformers=Object.assign({},n,t?.transformers));let i=this.options.attribute,s=[i+"-field",i+"-list",i+"-map"],o=i+"-transform",l=f=>{let p=s.find(m=>f.hasAttribute(m));return p||console.error("No matching attribute found",f,s),p},c=f=>{this.bindings.set(f,b(()=>{if(!f.isConnected){Ve(f,this.getBindingPath(f)),K(this.bindings.get(f));return}let p={templates:f.querySelectorAll(":scope > template"),attribute:l(f)};p.path=this.getBindingPath(f),p.value=B(this.options.root,p.path),p.element=f,Ke(f,p),a(p)},50))},a=f=>{let p;switch(f.attribute){case this.options.attribute+"-field":p=Array.from(this.options.render.field);break;case this.options.attribute+"-list":p=Array.from(this.options.render.list);break;case this.options.attribute+"-map":p=Array.from(this.options.render.map);break;default:throw new Error("no valid context attribute specified",f)}f.element.hasAttribute(o)&&f.element.getAttribute(o).split(" ").filter(Boolean).forEach(S=>{this.options.transformers[S]?p.push(this.options.transformers[S]):console.warn("No transformer with name "+S+" configured",{cause:f.element})});let m;for(let S of p)m=((M,Te)=>Ae=>Te.call(this,Ae,M))(m,S);m(f)},u=f=>{for(let p of f)this.bindings.get(p)||c(p)},w=f=>{let p=`[${i}-field],[${i}-list],[${i}-map]`;for(let m of f)if(m.type=="childList"&&m.addedNodes){for(let S of m.addedNodes)if(S instanceof HTMLElement){let M=Array.from(S.querySelectorAll(p));S.matches(p)&&M.unshift(S),M.length&&u(M)}}};this.observer=new MutationObserver(f=>{w(f)}),this.observer.observe(this.options.container,{subtree:!0,childList:!0});let N=this.options.container.querySelectorAll(":is(["+this.options.attribute+"-field],["+this.options.attribute+"-list],["+this.options.attribute+"-map]):not(template)");N.length&&u(N)}applyTemplate(t){let n=t.path,r=t.parent,i=t.templates,s=t.list,o=t.index,l=s?s[o]:t.value,c=this.findTemplate(i,l);if(!c){let f=new DocumentFragment;return f.innerHTML="<!-- no matching template -->",f}let a=c.content.cloneNode(!0);if(!a.children?.length)return a;if(a.children.length>1)throw new Error("template must contain a single root node",{cause:c});let u=this.options.attribute,w=[u+"-field",u+"-list",u+"-map"],N=a.querySelectorAll(`[${u}-field],[${u}-list],[${u}-map]`);for(let f of N){if(f.tagName=="TEMPLATE")continue;let p=w.find(S=>f.hasAttribute(S)),m=f.getAttribute(p);m=this.applyLinks(c.links,m),m.substring(0,6)==":root."?f.setAttribute(p,m.substring(6)):m==":value"&&o!=null?f.setAttribute(p,n+"."+o):o!=null?f.setAttribute(p,n+"."+o+"."+m):f.setAttribute(p,r+m)}return typeof o<"u"&&a.children[0].setAttribute(u+"-key",o),a.children[0][Symbol.bindTemplate]=c,a}parseLinks(t){let n={};t=t.split(";").map(r=>r.trim());for(let r of t)r=r.split("="),n[r[0].trim()]=r[1].trim();return n}applyLinks(t,n){for(let r in t){if(n.startsWith(r+"."))return t[r]+n.substr(r.length);if(n==r)return t[r]}return n}getBindingPath(t){let n=[this.options.attribute+"-field",this.options.attribute+"-list",this.options.attribute+"-map"];for(let r of n)if(t.hasAttribute(r))return t.getAttribute(r)}findTemplate(t,n){let r=l=>{let c=this.getBindingPath(l),a;c?c.substr(0,6)==":root."?a=B(this.options.root,c):a=B(n,c):a=n;let u=""+a,w=l.getAttribute(this.options.attribute+"-match");if(w){if(w===":empty"&&!a)return l;if(w===":notempty"&&a||u==w)return l}if(!w)return l},i=Array.from(t).find(r),s=null;i?.hasAttribute(this.options.attribute+"-link")&&(s=this.parseLinks(i.getAttribute(this.options.attribute+"-link")));let o=i?.getAttribute("rel");if(o){let l=document.querySelector("template#"+o);if(!l)throw new Error("Could not find template with id "+o);i=l}return i&&(i.links=s),i}destroy(){this.bindings.forEach(t=>{K(t)}),this.bindings=new Map,this.observer.disconnect()}};function Se(e){return new Q(e)}var P=new Map;function Ke(e,t){P.has(t.path)?P.get(t.path).push(t):P.set(t.path,[t])}function Ve(e,t){let n=P.get(t);n&&(n=n.filter(r=>r.element==e),P.set(t,n))}function B(e,t){let n=t.split("."),r=e,i;i=n.shift();let s=null;for(;i&&r;)i=decodeURIComponent(i),i=="0"&&!Array.isArray(r)||(i==":key"?r=s:i==":value"||(Array.isArray(r)&&typeof r[i]>"u"&&r[0]?r=r[0][i]:r=r[i])),s=i,i=n.shift();return r}var Y={};W(Y,{columns:()=>_e,filter:()=>De,model:()=>Fe,paging:()=>We,scroll:()=>Ge,sort:()=>Ue});var X=class{constructor(t){if(!t)throw new Error("no options set");(t.data==null||typeof t.data[Symbol.iterator]!="function")&&console.warn("SimplyFlowModel: options.data is not iterable"),this.state=A(t),this.state.options||(this.state.options={}),this.effects=[{current:this.state.data}],this.view={current:this.state.data}}addEffect(t){if(!t||typeof t!="function")throw new Error("addEffect requires an effect function as its parameter",{cause:t});let n=this.effects[this.effects.length-1],r=t.call(this,n);if(!r||!r[Symbol.Signal])throw new Error("addEffect function parameter must return a Signal",{cause:t});this.view=r,this.effects.push(this.view)}};function Fe(e){return new X(e)}function Ue(e={}){return function(t){return this.state.options.sort=Object.assign({direction:"asc",sortBy:null,sortFn:(n,r)=>{let i=this.state.options.sort,s=i.sortBy;if(!i.sortBy)return 0;let o=i.direction=="asc"?1:-1,l=i.direction=="asc"?-1:1;return typeof n?.[s]>"u"?typeof r?.[s]>"u"?0:o:typeof r?.[s]>"u"||n[s]<r[s]?l:n[s]>r[s]?o:0}},e),b(()=>{let n=this.state.options.sort;return n?.sortBy&&n?.direction?t.current.toSorted(n?.sortFn):t.current},50)}}function We(e={}){return function(t){return this.state.options.paging=Object.assign({page:1,pageSize:20,max:1},e),b(()=>T(()=>{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 r=(n.page-1)*n.pageSize,i=r+n.pageSize;return t.current.slice(r,i)}),50)}}function De(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,b(()=>this.state.options[e.name].enabled?t.current.filter(this.state.options[e.name].matches.bind(this)):t.current,50)}}function _e(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,b(()=>t.current.map(n=>{let r={};for(let i of Object.keys(this.state.options.columns))this.state.options.columns[i]?.hidden||(r[i]=n[i]??null);return r}),50)}}function Ge(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,r=n.scrollbar||n.container?.querySelector("[data-flow-scrollbar]");return r&&(n.container&&n.container.addEventListener("scroll",i=>{n.offset=Math.floor(n.container.scrollTop/(n.rowHeight*n.itemsPerRow))}),b(()=>{n.size=t.current.length*n.rowHeight,r.style.height=n.size+"px"},50)),b(()=>{n.container&&(n.rowCount=Math.ceil(n.container.getBoundingClientRect().height/n.rowHeight)),n.data=t.current;let i=Math.min(n.offset,t.current.length-1),s=i+n.rowCount;return s>t.current.length&&(s=t.current.length,i=s-n.rowCount),t.current.slice(i,s)},50)}}var Z=class extends HTMLElement{constructor(){super()}connectedCallback(){let t=this.getAttribute("rel"),n=document.getElementById(t);if(n){let r=n.content.cloneNode(!0);for(let i of r.childNodes){let s=i.cloneNode(!0);if(s.nodeType==document.ELEMENT_NODE&&(s.querySelectorAll("template").forEach(function(o){o.setAttribute("simply-render","")}),this.attributes))for(let o of this.attributes)o.name!="rel"&&s.setAttribute(o.name,o.value);this.parentNode.insertBefore(s,this)}this.parentNode.removeChild(this)}else(()=>{let i=new MutationObserver(()=>{n=document.getElementById(t),n&&(i.disconnect(),this.replaceWith(this))});i.observe(globalThis.document,{subtree:!0,childList:!0})})()}};customElements.get("simply-render")||customElements.define("simply-render",Z);globalThis.simply||(globalThis.simply={});Object.assign(globalThis.simply,{bind:Se,flow:Y,state:_,dom:G});var ft=globalThis.simply;})();
2
2
  //# sourceMappingURL=simply.flow.min.js.map