tinybase 8.5.0-beta.0 → 8.5.0-beta.1

package/ui-svelte-dom/index.js

@@ -32,13 +32,16 @@ const SLICE = 'Slice';
 const REMOTE_ROW_ID = 'Remote' + ROW + 'Id';
 const EXTRA = 'extra';
 
+const math = Math;
 const getIfNotFunction = (predicate) => (value, then, otherwise) =>
   predicate(value)
     ? /* istanbul ignore next */
       otherwise?.()
     : then(value);
 const GLOBAL = globalThis;
-const math = Math;
+const number = Number;
+const string = String;
+const boolean = Boolean;
 const mathMin = math.min;
 const isFiniteNumber = isFinite;
 const isNullish = (thing) => thing == null;
@@ -88,7 +91,7 @@ const objMap = (obj, cb) =>
 
 const TINYBASE_CONTEXT_KEY = TINYBASE + '_uisc';
 
-/* functions.svelte.ts generated by Svelte v5.55.5 */
+/* functions.svelte.ts generated by Svelte v5.56.0 */
 
 class ReactiveHandle {
   #get;
@@ -437,13 +440,11 @@ const getTypeCase = (
             ? arrayCase
             : null;
 
-var root_1$5 = $.from_html(`<button> </button>`);
-var root_2$4 = $.from_html(`<input/>`);
-var root_3$3 = $.from_html(`<input type="number"/>`);
-var root_4$4 = $.from_html(`<input type="checkbox"/>`);
-var root_5$3 = $.from_html(`<input/>`);
-var root_6$2 = $.from_html(`<input/>`);
-var root$5 = $.from_html(`<div><!><!></div>`);
+var root$5 = $.from_html(`<button> </button>`);
+var root_1$5 = $.from_html(`<input/>`);
+var root_2$4 = $.from_html(`<input type="number"/>`);
+var root_3$3 = $.from_html(`<input type="checkbox"/>`);
+var root_4$2 = $.from_html(`<div><!><!></div>`);
 
 function EditableThing($$anchor, $$props) {
   $.push($$props, true);
@@ -461,7 +462,7 @@ function EditableThing($$anchor, $$props) {
   let objectClassName = $.state(EMPTY_STRING);
   let arrayClassName = $.state(EMPTY_STRING);
   const getThingKey = (thing) =>
-    `${getCellOrValueType(thing)}:${isObject(thing) || isArray(thing) ? jsonString(thing) : String(thing)}`;
+    `${getCellOrValueType(thing)}:${(isObject(thing) || isArray(thing) ? jsonString : string)(thing)}`;
 
   $.user_effect(() => {
     const thingKey = getThingKey($$props.thing);
@@ -475,9 +476,9 @@ function EditableThing($$anchor, $$props) {
       } else if (isArray($$props.thing)) {
         $.set(arrayThing, jsonString($$props.thing), true);
       } else {
-        $.set(stringThing, String($$props.thing), true);
-        $.set(numberThing, Number($$props.thing) || 0, true);
-        $.set(booleanThing, Boolean($$props.thing), true);
+        $.set(stringThing, string($$props.thing), true);
+        $.set(numberThing, number($$props.thing) || 0, true);
+        $.set(booleanThing, boolean($$props.thing), true);
       }
     }
   });
@@ -537,12 +538,12 @@ function EditableThing($$anchor, $$props) {
   const hasWidget = $.derived(
     () => getTypeCase($.get(thingType), 1, 1, 1, 1, 1) == 1,
   );
-  var div = root$5();
+  var div = root_4$2();
   var node = $.child(div);
 
   {
     var consequent = ($$anchor) => {
-      var button = root_1$5();
+      var button = root$5();
       var text = $.child(button, true);
 
       $.reset(button);
@@ -566,12 +567,12 @@ function EditableThing($$anchor, $$props) {
 
   {
     var consequent_1 = ($$anchor) => {
-      var input = root_2$4();
+      var input = root_1$5();
 
       $.remove_input_defaults(input);
       $.template_effect(() => $.set_value(input, $.get(stringThing)));
       $.delegated('input', input, (event) =>
-        handleThingChange(String(event.currentTarget.value), (value) =>
+        handleThingChange(string(event.currentTarget.value), (value) =>
           $.set(stringThing, value, true),
         ),
       );
@@ -579,12 +580,12 @@ function EditableThing($$anchor, $$props) {
     };
 
     var consequent_2 = ($$anchor) => {
-      var input_1 = root_3$3();
+      var input_1 = root_2$4();
 
       $.remove_input_defaults(input_1);
       $.template_effect(() => $.set_value(input_1, $.get(numberThing)));
       $.delegated('input', input_1, (event) =>
-        handleThingChange(Number(event.currentTarget.value || 0), (value) =>
+        handleThingChange(number(event.currentTarget.value || 0), (value) =>
           $.set(numberThing, value, true),
         ),
       );
@@ -592,12 +593,12 @@ function EditableThing($$anchor, $$props) {
     };
 
     var consequent_3 = ($$anchor) => {
-      var input_2 = root_4$4();
+      var input_2 = root_3$3();
 
       $.remove_input_defaults(input_2);
       $.template_effect(() => $.set_checked(input_2, $.get(booleanThing)));
       $.delegated('change', input_2, (event) =>
-        handleThingChange(Boolean(event.currentTarget.checked), (value) =>
+        handleThingChange(boolean(event.currentTarget.checked), (value) =>
           $.set(booleanThing, value, true),
         ),
       );
@@ -605,7 +606,7 @@ function EditableThing($$anchor, $$props) {
     };
 
     var consequent_4 = ($$anchor) => {
-      var input_3 = root_5$3();
+      var input_3 = root_1$5();
 
       $.remove_input_defaults(input_3);
 
@@ -626,7 +627,7 @@ function EditableThing($$anchor, $$props) {
     };
 
     var consequent_5 = ($$anchor) => {
-      var input_4 = root_6$2();
+      var input_4 = root_1$5();
 
       $.remove_input_defaults(input_4);
 
@@ -776,11 +777,9 @@ function CellView($$anchor, $$props) {
   $.pop();
 }
 
-var root_1$4 = $.from_html(`<td><!></td>`);
-var root_2$3 = $.from_html(`<th> </th> <th> </th>`, 1);
-var root_4$3 = $.from_html(`<td><!></td>`);
-var root_5$2 = $.from_html(`<td><!></td>`);
-var root$4 = $.from_html(`<tr><!><!><!><!></tr>`);
+var root$4 = $.from_html(`<td><!></td>`);
+var root_1$4 = $.from_html(`<th> </th> <th> </th>`, 1);
+var root_2$3 = $.from_html(`<tr><!><!><!><!></tr>`);
 
 function RelationshipInHtmlRow($$anchor, $$props) {
   $.push($$props, true);
@@ -801,7 +800,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
     store: $$props.store,
   }));
 
-  var tr = root$4();
+  var tr = root_2$3();
   var node = $.child(tr);
 
   $.each(
@@ -811,7 +810,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
     (extraCell, index) => extraKey(index, 0),
     ($$anchor, extraCell) => {
       const ExtraCell = $.derived(() => $.get(extraCell).component);
-      var td = root_1$4();
+      var td = root$4();
       var node_1 = $.child(td);
 
       $.component(
@@ -835,7 +834,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
 
   {
     var consequent = ($$anchor) => {
-      var fragment = root_2$3();
+      var fragment = root_1$4();
       var th = $.first_child(fragment);
       var text = $.child(th, true);
 
@@ -894,7 +893,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
 
       {
         var consequent_1 = ($$anchor) => {
-          var td_1 = root_4$3();
+          var td_1 = root$4();
           var node_5 = $.child(td_1);
 
           {
@@ -958,7 +957,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
     (extraCell, index) => extraKey(index, 1),
     ($$anchor, extraCell) => {
       const ExtraCell = $.derived(() => $.get(extraCell).component);
-      var td_2 = root_5$2();
+      var td_2 = root$4();
       var node_7 = $.child(td_2);
 
       $.component(
@@ -983,12 +982,10 @@ function RelationshipInHtmlRow($$anchor, $$props) {
   $.pop();
 }
 
-var root_2$2 = $.from_html(`<th> </th>`);
-var root_3$2 = $.from_html(`<th> </th> <th> </th>`, 1);
-var root_4$2 = $.from_html(`<th> </th>`);
-var root_5$1 = $.from_html(`<th> </th>`);
-var root_1$3 = $.from_html(`<thead><tr><!><!><!><!></tr></thead>`);
-var root$3 = $.from_html(`<table><!><tbody></tbody></table>`);
+var root$3 = $.from_html(`<th> </th>`);
+var root_1$3 = $.from_html(`<th> </th> <th> </th>`, 1);
+var root_2$2 = $.from_html(`<thead><tr><!><!><!><!></tr></thead>`);
+var root_3$2 = $.from_html(`<table><!><tbody></tbody></table>`);
 
 function RelationshipInHtmlTable($$anchor, $$props) {
   $.push($$props, true);
@@ -1041,12 +1038,12 @@ function RelationshipInHtmlTable($$anchor, $$props) {
   const extraHeadersAfter = $.derived(() =>
     getExtraHeaders(extraCellsAfter(), 1),
   );
-  var table = root$3();
+  var table = root_3$2();
   var node = $.child(table);
 
   {
     var consequent_1 = ($$anchor) => {
-      var thead = root_1$3();
+      var thead = root_2$2();
       var tr = $.child(thead);
       var node_1 = $.child(tr);
 
@@ -1056,7 +1053,7 @@ function RelationshipInHtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersBefore),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th = root_2$2();
+          var th = root$3();
           var text = $.child(th, true);
 
           $.reset(th);
@@ -1074,7 +1071,7 @@ function RelationshipInHtmlTable($$anchor, $$props) {
 
       {
         var consequent = ($$anchor) => {
-          var fragment = root_3$2();
+          var fragment = root_1$3();
           var th_1 = $.first_child(fragment);
           var text_1 = $.child(th_1);
 
@@ -1108,7 +1105,7 @@ function RelationshipInHtmlTable($$anchor, $$props) {
         () => $.get(cellEntries),
         (entry) => entry[0],
         ($$anchor, entry) => {
-          var th_3 = root_4$2();
+          var th_3 = root$3();
           var text_3 = $.child(th_3, true);
 
           $.reset(th_3);
@@ -1125,7 +1122,7 @@ function RelationshipInHtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersAfter),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th_4 = root_5$1();
+          var th_4 = root$3();
           var text_4 = $.child(th_4, true);
 
           $.reset(th_4);
@@ -1232,18 +1229,14 @@ function ResultCellView($$anchor, $$props) {
   $.pop();
 }
 
-var root_1$2 = $.from_html(`<caption><!></caption>`);
-var root_3$1 = $.from_html(`<th> </th>`);
-var root_4$1 = $.from_html(`<th><!> Id</th>`);
-var root_6$1 = $.from_html(`<th><!> </th>`);
-var root_8$1 = $.from_html(`<th> </th>`);
-var root_2$1 = $.from_html(`<thead><tr><!><!><!><!></tr></thead>`);
-var root_10 = $.from_html(`<td><!></td>`);
-var root_11 = $.from_html(`<th> </th>`);
-var root_12 = $.from_html(`<td><!></td>`);
-var root_13 = $.from_html(`<td><!></td>`);
-var root_9 = $.from_html(`<tr><!><!><!><!></tr>`);
-var root$2 = $.from_html(`<table><!><!><tbody></tbody></table>`);
+var root$2 = $.from_html(`<caption><!></caption>`);
+var root_1$2 = $.from_html(`<th> </th>`);
+var root_2$1 = $.from_html(`<th><!> Id</th>`);
+var root_3$1 = $.from_html(`<th><!> </th>`);
+var root_4$1 = $.from_html(`<thead><tr><!><!><!><!></tr></thead>`);
+var root_5$1 = $.from_html(`<td><!></td>`);
+var root_6 = $.from_html(`<tr><!><!><!><!></tr>`);
+var root_7 = $.from_html(`<table><!><!><tbody></tbody></table>`);
 
 function HtmlTable($$anchor, $$props) {
   $.push($$props, true);
@@ -1260,12 +1253,12 @@ function HtmlTable($$anchor, $$props) {
   );
   const PaginatorComponent = $.derived(() => $$props.paginator?.component);
   const paginatorProps = $.derived(() => $$props.paginator?.props);
-  var table = root$2();
+  var table = root_7();
   var node = $.child(table);
 
   {
     var consequent = ($$anchor) => {
-      var caption = root_1$2();
+      var caption = root$2();
       var node_1 = $.child(caption);
 
       $.component(
@@ -1293,7 +1286,7 @@ function HtmlTable($$anchor, $$props) {
 
   {
     var consequent_4 = ($$anchor) => {
-      var thead = root_2$1();
+      var thead = root_4$1();
       var tr = $.child(thead);
       var node_3 = $.child(tr);
 
@@ -1303,7 +1296,7 @@ function HtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersBefore),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th = root_3$1();
+          var th = root_1$2();
           var text = $.child(th, true);
 
           $.reset(th);
@@ -1321,7 +1314,7 @@ function HtmlTable($$anchor, $$props) {
 
       {
         var consequent_2 = ($$anchor) => {
-          var th_1 = root_4$1();
+          var th_1 = root_2$1();
           var node_5 = $.child(th_1);
 
           {
@@ -1383,7 +1376,7 @@ function HtmlTable($$anchor, $$props) {
         ($$anchor, entry) => {
           const cellId = $.derived(() => $.get(entry)[0]);
           const cell = $.derived(() => $.get(entry)[1]);
-          var th_2 = root_6$1();
+          var th_2 = root_3$1();
           var node_7 = $.child(th_2);
 
           {
@@ -1443,7 +1436,7 @@ function HtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersAfter),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th_3 = root_8$1();
+          var th_3 = root_1$2();
           var text_4 = $.child(th_3, true);
 
           $.reset(th_3);
@@ -1479,7 +1472,7 @@ function HtmlTable($$anchor, $$props) {
         ...$$props.cellComponentProps,
         rowId,
       }));
-      var tr_1 = root_9();
+      var tr_1 = root_6();
       var node_9 = $.child(tr_1);
 
       $.each(
@@ -1489,7 +1482,7 @@ function HtmlTable($$anchor, $$props) {
         (extraCell, index) => extraKey(index, 0),
         ($$anchor, extraCell) => {
           const ExtraCell = $.derived(() => $.get(extraCell).component);
-          var td = root_10();
+          var td = root_5$1();
           var node_10 = $.child(td);
 
           $.component(
@@ -1513,7 +1506,7 @@ function HtmlTable($$anchor, $$props) {
 
       {
         var consequent_5 = ($$anchor) => {
-          var th_4 = root_11();
+          var th_4 = root_1$2();
           var text_5 = $.child(th_4, true);
 
           $.reset(th_4);
@@ -1544,7 +1537,7 @@ function HtmlTable($$anchor, $$props) {
           const cellId = $.derived(() => $.get(entry)[0]);
           const cell = $.derived(() => $.get(entry)[1]);
           const CellComponent = $.derived(() => $.get(cell).component);
-          var td_1 = root_12();
+          var td_1 = root_5$1();
           var node_13 = $.child(td_1);
 
           {
@@ -1586,7 +1579,7 @@ function HtmlTable($$anchor, $$props) {
         (extraCell, index) => extraKey(index, 1),
         ($$anchor, extraCell) => {
           const ExtraCell = $.derived(() => $.get(extraCell).component);
-          var td_2 = root_13();
+          var td_2 = root_5$1();
           var node_15 = $.child(td_2);
 
           $.component(
@@ -1620,15 +1613,16 @@ function HtmlTable($$anchor, $$props) {
 
 $.delegate(['click']);
 
-var root_1$1 = $.from_html(
+var rest_excludes$5 = new Set(['$$slots', '$$events', '$$legacy']);
+var root$1 = $.from_html(
   `<button class="previous"></button><button class="next"></button> `,
   1,
 );
-var root$1 = $.from_html(`<!> `, 1);
+var root_1$1 = $.from_html(`<!> `, 1);
 
 function SortedTablePaginator($$anchor, $$props) {
   $.push($$props, true);
-  $.rest_props($$props, ['$$slots', '$$events', '$$legacy']);
+  $.rest_props($$props, rest_excludes$5);
   const offset = $.derived(() =>
     $$props.offset == null ||
     $$props.offset > $$props.total ||
@@ -1654,12 +1648,12 @@ function SortedTablePaginator($$anchor, $$props) {
     }
   });
 
-  var fragment = root$1();
+  var fragment = root_1$1();
   var node = $.first_child(fragment);
 
   {
     var consequent = ($$anchor) => {
-      var fragment_1 = root_1$1();
+      var fragment_1 = root$1();
       var button = $.first_child(fragment_1);
 
       button.textContent = '←';
@@ -1699,7 +1693,7 @@ function SortedTablePaginator($$anchor, $$props) {
 
 $.delegate(['click']);
 
-/* sortingAndPagination.svelte.ts generated by Svelte v5.55.5 */
+/* sortingAndPagination.svelte.ts generated by Svelte v5.56.0 */
 
 const createSortingAndPagination = (
   getCellId,
@@ -1769,27 +1763,29 @@ const createSortingAndPagination = (
   };
 };
 
+var rest_excludes$4 = new Set([
+  '$$slots',
+  '$$events',
+  '$$legacy',
+  'queryId',
+  'cellId',
+  'descending',
+  'offset',
+  'limit',
+  'queries',
+  'sortOnClick',
+  'paginator',
+  'customCells',
+  'extraCellsBefore',
+  'extraCellsAfter',
+  'onChange',
+]);
+
 function ResultSortedTableInHtmlTable($$anchor, $$props) {
   $.push($$props, true);
 
   let paginator = $.prop($$props, 'paginator', 3, false),
-    props = $.rest_props($$props, [
-      '$$slots',
-      '$$events',
-      '$$legacy',
-      'queryId',
-      'cellId',
-      'descending',
-      'offset',
-      'limit',
-      'queries',
-      'sortOnClick',
-      'paginator',
-      'customCells',
-      'extraCellsBefore',
-      'extraCellsAfter',
-      'onChange',
-    ]);
+    props = $.rest_props($$props, rest_excludes$4);
 
   const defaultCellIds = getResultTableCellIds(
     () => $$props.queryId,
@@ -1865,20 +1861,21 @@ function ResultSortedTableInHtmlTable($$anchor, $$props) {
   $.pop();
 }
 
+var rest_excludes$3 = new Set([
+  '$$slots',
+  '$$events',
+  '$$legacy',
+  'queryId',
+  'queries',
+  'customCells',
+  'extraCellsBefore',
+  'extraCellsAfter',
+]);
+
 function ResultTableInHtmlTable($$anchor, $$props) {
   $.push($$props, true);
 
-  let props = $.rest_props($$props, [
-    '$$slots',
-    '$$events',
-    '$$legacy',
-    'queryId',
-    'queries',
-    'customCells',
-    'extraCellsBefore',
-    'extraCellsAfter',
-  ]);
-
+  let props = $.rest_props($$props, rest_excludes$3);
   const defaultCellIds = getResultTableCellIds(
     () => $$props.queryId,
     () => $$props.queries,
@@ -1923,22 +1920,23 @@ function ResultTableInHtmlTable($$anchor, $$props) {
   $.pop();
 }
 
+var rest_excludes$2 = new Set([
+  '$$slots',
+  '$$events',
+  '$$legacy',
+  'indexId',
+  'sliceId',
+  'indexes',
+  'editable',
+  'customCells',
+  'extraCellsBefore',
+  'extraCellsAfter',
+]);
+
 function SliceInHtmlTable($$anchor, $$props) {
   $.push($$props, true);
 
-  let props = $.rest_props($$props, [
-    '$$slots',
-    '$$events',
-    '$$legacy',
-    'indexId',
-    'sliceId',
-    'indexes',
-    'editable',
-    'customCells',
-    'extraCellsBefore',
-    'extraCellsAfter',
-  ]);
-
+  let props = $.rest_props($$props, rest_excludes$2);
   const index = getIndexStoreTableId(
     () => $$props.indexes,
     () => $$props.indexId,
@@ -1995,28 +1993,30 @@ function SliceInHtmlTable($$anchor, $$props) {
   $.pop();
 }
 
+var rest_excludes$1 = new Set([
+  '$$slots',
+  '$$events',
+  '$$legacy',
+  'tableId',
+  'cellId',
+  'descending',
+  'offset',
+  'limit',
+  'store',
+  'editable',
+  'sortOnClick',
+  'paginator',
+  'onChange',
+  'customCells',
+  'extraCellsBefore',
+  'extraCellsAfter',
+]);
+
 function SortedTableInHtmlTable($$anchor, $$props) {
   $.push($$props, true);
 
   let paginator = $.prop($$props, 'paginator', 3, false),
-    props = $.rest_props($$props, [
-      '$$slots',
-      '$$events',
-      '$$legacy',
-      'tableId',
-      'cellId',
-      'descending',
-      'offset',
-      'limit',
-      'store',
-      'editable',
-      'sortOnClick',
-      'paginator',
-      'onChange',
-      'customCells',
-      'extraCellsBefore',
-      'extraCellsAfter',
-    ]);
+    props = $.rest_props($$props, rest_excludes$1);
 
   const defaultCellIds = getTableCellIds(
     () => $$props.tableId,
@@ -2099,21 +2099,22 @@ function SortedTableInHtmlTable($$anchor, $$props) {
   $.pop();
 }
 
+var rest_excludes = new Set([
+  '$$slots',
+  '$$events',
+  '$$legacy',
+  'tableId',
+  'store',
+  'editable',
+  'customCells',
+  'extraCellsBefore',
+  'extraCellsAfter',
+]);
+
 function TableInHtmlTable($$anchor, $$props) {
   $.push($$props, true);
 
-  let props = $.rest_props($$props, [
-    '$$slots',
-    '$$events',
-    '$$legacy',
-    'tableId',
-    'store',
-    'editable',
-    'customCells',
-    'extraCellsBefore',
-    'extraCellsAfter',
-  ]);
-
+  let props = $.rest_props($$props, rest_excludes);
   const defaultCellIds = getTableCellIds(
     () => $$props.tableId,
     () => $$props.store,
@@ -2189,15 +2190,12 @@ function ValueView($$anchor, $$props) {
   $.pop();
 }
 
-var root_2 = $.from_html(`<th> </th>`);
-var root_3 = $.from_html(`<th>Id</th>`);
-var root_4 = $.from_html(`<th> </th>`);
-var root_1 = $.from_html(`<thead><tr><!><!><th> </th><!></tr></thead>`);
-var root_6 = $.from_html(`<td><!></td>`);
-var root_7 = $.from_html(`<th> </th>`);
-var root_8 = $.from_html(`<td><!></td>`);
-var root_5 = $.from_html(`<tr><!><!><td><!></td><!></tr>`);
-var root = $.from_html(`<table><!><tbody></tbody></table>`);
+var root = $.from_html(`<th> </th>`);
+var root_1 = $.from_html(`<th>Id</th>`);
+var root_2 = $.from_html(`<thead><tr><!><!><th> </th><!></tr></thead>`);
+var root_3 = $.from_html(`<td><!></td>`);
+var root_4 = $.from_html(`<tr><!><!><td><!></td><!></tr>`);
+var root_5 = $.from_html(`<table><!><tbody></tbody></table>`);
 
 function ValuesInHtmlTable($$anchor, $$props) {
   $.push($$props, true);
@@ -2217,12 +2215,12 @@ function ValuesInHtmlTable($$anchor, $$props) {
   const extraHeadersAfter = $.derived(() =>
     getExtraHeaders(extraCellsAfter(), 1),
   );
-  var table = root();
+  var table = root_5();
   var node = $.child(table);
 
   {
     var consequent_1 = ($$anchor) => {
-      var thead = root_1();
+      var thead = root_2();
       var tr = $.child(thead);
       var node_1 = $.child(tr);
 
@@ -2232,7 +2230,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersBefore),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th = root_2();
+          var th = root();
           var text = $.child(th, true);
 
           $.reset(th);
@@ -2250,7 +2248,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
 
       {
         var consequent = ($$anchor) => {
-          var th_1 = root_3();
+          var th_1 = root_1();
 
           $.append($$anchor, th_1);
         };
@@ -2273,7 +2271,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersAfter),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th_3 = root_4();
+          var th_3 = root();
           var text_2 = $.child(th_3, true);
 
           $.reset(th_3);
@@ -2307,7 +2305,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
     (valueId) => valueId,
     ($$anchor, valueId) => {
       const valueProps = $.derived(() => ({valueId, store: $$props.store}));
-      var tr_1 = root_5();
+      var tr_1 = root_4();
       var node_4 = $.child(tr_1);
 
       $.each(
@@ -2317,7 +2315,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
         (extraCell, index) => extraKey(index, 0),
         ($$anchor, extraCell) => {
           const ExtraCell = $.derived(() => $.get(extraCell).component);
-          var td = root_6();
+          var td = root_3();
           var node_5 = $.child(td);
 
           $.component(
@@ -2341,7 +2339,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
 
       {
         var consequent_2 = ($$anchor) => {
-          var th_4 = root_7();
+          var th_4 = root();
           var text_3 = $.child(th_4, true);
 
           $.reset(th_4);
@@ -2395,7 +2393,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
         (extraCell, index) => extraKey(index, 1),
         ($$anchor, extraCell) => {
           const ExtraCell = $.derived(() => $.get(extraCell).component);
-          var td_2 = root_8();
+          var td_2 = root_3();
           var node_9 = $.child(td_2);
 
           $.component(