tinybase 8.5.0-beta.0 → 8.5.0-beta.2

package/ui-svelte-inspector/with-schemas/index.js

@@ -47,6 +47,7 @@ const UNDEFINED = '\uFFFC';
 const JSON_PREFIX = '\uFFFD';
 const id = (key) => EMPTY_STRING + key;
 
+const math = Math;
 const getIfNotFunction = (predicate) => (value, then, otherwise) =>
   predicate(value)
     ? /* istanbul ignore next */
@@ -54,7 +55,9 @@ const getIfNotFunction = (predicate) => (value, then, otherwise) =>
     : then(value);
 const GLOBAL = globalThis;
 const WINDOW = GLOBAL.window;
-const math = Math;
+const number = Number;
+const string = String;
+const boolean = Boolean;
 const mathMin = math.min;
 const mathFloor = math.floor;
 const isFiniteNumber = isFinite;
@@ -97,6 +100,7 @@ const tryCatch = async (action, then1, then2) => {
 };
 
 const arrayHas = (array, value) => array.includes(value);
+const arrayIndexOf = (array, value) => array.indexOf(value);
 const arrayEvery = (array, cb) => array.every(cb);
 const arrayIsEqual = (array1, array2) =>
   size(array1) === size(array2) &&
@@ -215,7 +219,7 @@ const NO_PROVIDED_OBJECTS_MESSAGE =
 const INSPECTOR_ERROR_MESSAGE =
   'Inspector error: please see console for details.';
 const getInitialPosition = (position) => {
-  const index = POSITIONS.indexOf(position);
+  const index = arrayIndexOf(POSITIONS, position);
   return index == -1 ? 1 : index;
 };
 const getUniqueId = (...args) => jsonStringWithMap(args);
@@ -337,6 +341,7 @@ const TEXT_OVERFLOW = 'text-overflow';
 const ALIGN_ITEMS = 'align-items';
 const BACKDROP_FILTER = 'backdrop-filter';
 const MARGIN_RIGHT = MARGIN + '-' + RIGHT;
+const Z_INDEX = 'z-index';
 const FIXED = 'fixed';
 const REVERT = 'revert';
 const UNSET = 'unset';
@@ -360,8 +365,8 @@ const APP_STYLESHEET = arrayJoin(
         all: 'initial',
         [FONT_SIZE]: rem(0.75),
         [POSITION]: FIXED,
+        [Z_INDEX]: 999999,
         'font-family': 'inter,sans-serif',
-        'z-index': 999999,
         '--bg': oklch(20),
         '--bg2': oklch(15),
         '--bg3': oklch(25),
@@ -465,6 +470,7 @@ const APP_STYLESHEET = arrayJoin(
         [BACKGROUND]: oklch(30, '% 0.008 var(--hue) / .5'),
         [WIDTH]: 'calc(100% - .5rem)',
         [POSITION]: 'absolute',
+        [Z_INDEX]: 1,
         [BORDER + '-' + BOTTOM]: cssVar(BORDER),
         [ALIGN_ITEMS]: 'center',
         [BACKDROP_FILTER]: 'blur(4px)',
@@ -2873,7 +2879,7 @@ const createStore = () => {
 
 const TINYBASE_CONTEXT_KEY = TINYBASE + '_uisc';
 
-/* functions.svelte.ts generated by Svelte v5.55.5 */
+/* functions.svelte.ts generated by Svelte v5.56.3 */
 
 class ReactiveHandle {
   #get;
@@ -3323,7 +3329,7 @@ const getRelationshipsStoreTableIds = (relationshipsOrId, relationshipId) => {
   };
 };
 
-var root_1$e = $.from_html(`<img tabindex="0" alt=""/>`);
+var root$m = $.from_html(`<img tabindex="0" alt=""/>`);
 
 function Nub($$anchor, $$props) {
   $.push($$props, true);
@@ -3350,7 +3356,7 @@ function Nub($$anchor, $$props) {
 
   {
     var consequent = ($$anchor) => {
-      var img = root_1$e();
+      var img = root$m();
 
       $.template_effect(() => {
         $.set_attribute(img, 'title', TITLE);
@@ -3386,8 +3392,8 @@ const requestInspectorIdleCallback = (callback) =>
 const cancelInspectorIdleCallback = (id) =>
   globalThis.cancelIdleCallback?.(id) ?? clearTimeout(id);
 
-var root_1$d = $.from_html(`<img tabindex="0" alt=""/>`);
-var root$c = $.from_html(
+var root$l = $.from_html(`<img tabindex="0" alt=""/>`);
+var root_1$c = $.from_html(
   `<details><summary><span> </span> <!></summary> <div><!></div></details>`,
 );
 
@@ -3413,7 +3419,7 @@ function Details($$anchor, $$props) {
     }
   };
 
-  var details = root$c();
+  var details = root_1$c();
   var summary = $.child(details);
   var span = $.child(summary);
   var text = $.child(span, true);
@@ -3424,7 +3430,7 @@ function Details($$anchor, $$props) {
 
   {
     var consequent = ($$anchor) => {
-      var img = root_1$d();
+      var img = root$l();
 
       $.template_effect(() => {
         $.set_class(img, 1, $.clsx(editable() ? 'done' : 'edit'));
@@ -3465,13 +3471,11 @@ function Details($$anchor, $$props) {
 
 $.delegate(['click', 'keydown']);
 
-var root_1$c = $.from_html(`<button> </button>`);
-var root_2$9 = $.from_html(`<input/>`);
-var root_3$3 = $.from_html(`<input type="number"/>`);
-var root_4$5 = $.from_html(`<input type="checkbox"/>`);
-var root_5$5 = $.from_html(`<input/>`);
-var root_6$2 = $.from_html(`<input/>`);
-var root$b = $.from_html(`<div><!><!></div>`);
+var root$k = $.from_html(`<button> </button>`);
+var root_1$b = $.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);
@@ -3489,7 +3493,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);
@@ -3503,9 +3507,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);
       }
     }
   });
@@ -3565,12 +3569,12 @@ function EditableThing($$anchor, $$props) {
   const hasWidget = $.derived(
     () => getTypeCase($.get(thingType), 1, 1, 1, 1, 1) == 1,
   );
-  var div = root$b();
+  var div = root_4$2();
   var node = $.child(div);
 
   {
     var consequent = ($$anchor) => {
-      var button = root_1$c();
+      var button = root$k();
       var text = $.child(button, true);
 
       $.reset(button);
@@ -3594,12 +3598,12 @@ function EditableThing($$anchor, $$props) {
 
   {
     var consequent_1 = ($$anchor) => {
-      var input = root_2$9();
+      var input = root_1$b();
 
       $.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),
         ),
       );
@@ -3607,12 +3611,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),
         ),
       );
@@ -3620,12 +3624,12 @@ function EditableThing($$anchor, $$props) {
     };
 
     var consequent_3 = ($$anchor) => {
-      var input_2 = root_4$5();
+      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),
         ),
       );
@@ -3633,7 +3637,7 @@ function EditableThing($$anchor, $$props) {
     };
 
     var consequent_4 = ($$anchor) => {
-      var input_3 = root_5$5();
+      var input_3 = root_1$b();
 
       $.remove_input_defaults(input_3);
 
@@ -3654,7 +3658,7 @@ function EditableThing($$anchor, $$props) {
     };
 
     var consequent_5 = ($$anchor) => {
-      var input_4 = root_6$2();
+      var input_4 = root_1$b();
 
       $.remove_input_defaults(input_4);
 
@@ -3804,11 +3808,9 @@ function CellView($$anchor, $$props) {
   $.pop();
 }
 
-var root_1$b = $.from_html(`<td><!></td>`);
-var root_2$8 = $.from_html(`<th> </th> <th> </th>`, 1);
-var root_4$4 = $.from_html(`<td><!></td>`);
-var root_5$4 = $.from_html(`<td><!></td>`);
-var root$a = $.from_html(`<tr><!><!><!><!></tr>`);
+var root$j = $.from_html(`<td><!></td>`);
+var root_1$a = $.from_html(`<th> </th> <th> </th>`, 1);
+var root_2$3 = $.from_html(`<tr><!><!><!><!></tr>`);
 
 function RelationshipInHtmlRow($$anchor, $$props) {
   $.push($$props, true);
@@ -3829,7 +3831,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
     store: $$props.store,
   }));
 
-  var tr = root$a();
+  var tr = root_2$3();
   var node = $.child(tr);
 
   $.each(
@@ -3839,7 +3841,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
     (extraCell, index) => extraKey(index, 0),
     ($$anchor, extraCell) => {
       const ExtraCell = $.derived(() => $.get(extraCell).component);
-      var td = root_1$b();
+      var td = root$j();
       var node_1 = $.child(td);
 
       $.component(
@@ -3863,7 +3865,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
 
   {
     var consequent = ($$anchor) => {
-      var fragment = root_2$8();
+      var fragment = root_1$a();
       var th = $.first_child(fragment);
       var text = $.child(th, true);
 
@@ -3922,7 +3924,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
 
       {
         var consequent_1 = ($$anchor) => {
-          var td_1 = root_4$4();
+          var td_1 = root$j();
           var node_5 = $.child(td_1);
 
           {
@@ -3986,7 +3988,7 @@ function RelationshipInHtmlRow($$anchor, $$props) {
     (extraCell, index) => extraKey(index, 1),
     ($$anchor, extraCell) => {
       const ExtraCell = $.derived(() => $.get(extraCell).component);
-      var td_2 = root_5$4();
+      var td_2 = root$j();
       var node_7 = $.child(td_2);
 
       $.component(
@@ -4011,12 +4013,10 @@ function RelationshipInHtmlRow($$anchor, $$props) {
   $.pop();
 }
 
-var root_2$7 = $.from_html(`<th> </th>`);
-var root_3$2 = $.from_html(`<th> </th> <th> </th>`, 1);
-var root_4$3 = $.from_html(`<th> </th>`);
-var root_5$3 = $.from_html(`<th> </th>`);
-var root_1$a = $.from_html(`<thead><tr><!><!><!><!></tr></thead>`);
-var root$9 = $.from_html(`<table><!><tbody></tbody></table>`);
+var root$i = $.from_html(`<th> </th>`);
+var root_1$9 = $.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);
@@ -4069,12 +4069,12 @@ function RelationshipInHtmlTable($$anchor, $$props) {
   const extraHeadersAfter = $.derived(() =>
     getExtraHeaders(extraCellsAfter(), 1),
   );
-  var table = root$9();
+  var table = root_3$2();
   var node = $.child(table);
 
   {
     var consequent_1 = ($$anchor) => {
-      var thead = root_1$a();
+      var thead = root_2$2();
       var tr = $.child(thead);
       var node_1 = $.child(tr);
 
@@ -4084,7 +4084,7 @@ function RelationshipInHtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersBefore),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th = root_2$7();
+          var th = root$i();
           var text = $.child(th, true);
 
           $.reset(th);
@@ -4102,7 +4102,7 @@ function RelationshipInHtmlTable($$anchor, $$props) {
 
       {
         var consequent = ($$anchor) => {
-          var fragment = root_3$2();
+          var fragment = root_1$9();
           var th_1 = $.first_child(fragment);
           var text_1 = $.child(th_1);
 
@@ -4136,7 +4136,7 @@ function RelationshipInHtmlTable($$anchor, $$props) {
         () => $.get(cellEntries),
         (entry) => entry[0],
         ($$anchor, entry) => {
-          var th_3 = root_4$3();
+          var th_3 = root$i();
           var text_3 = $.child(th_3, true);
 
           $.reset(th_3);
@@ -4153,7 +4153,7 @@ function RelationshipInHtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersAfter),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th_4 = root_5$3();
+          var th_4 = root$i();
           var text_4 = $.child(th_4, true);
 
           $.reset(th_4);
@@ -4260,18 +4260,14 @@ function ResultCellView($$anchor, $$props) {
   $.pop();
 }
 
-var root_1$9 = $.from_html(`<caption><!></caption>`);
-var root_3$1 = $.from_html(`<th> </th>`);
-var root_4$2 = $.from_html(`<th><!> Id</th>`);
-var root_6$1 = $.from_html(`<th><!> </th>`);
-var root_8$1 = $.from_html(`<th> </th>`);
-var root_2$6 = $.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$8 = $.from_html(`<table><!><!><tbody></tbody></table>`);
+var root$h = $.from_html(`<caption><!></caption>`);
+var root_1$8 = $.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);
@@ -4288,12 +4284,12 @@ function HtmlTable($$anchor, $$props) {
   );
   const PaginatorComponent = $.derived(() => $$props.paginator?.component);
   const paginatorProps = $.derived(() => $$props.paginator?.props);
-  var table = root$8();
+  var table = root_7();
   var node = $.child(table);
 
   {
     var consequent = ($$anchor) => {
-      var caption = root_1$9();
+      var caption = root$h();
       var node_1 = $.child(caption);
 
       $.component(
@@ -4321,7 +4317,7 @@ function HtmlTable($$anchor, $$props) {
 
   {
     var consequent_4 = ($$anchor) => {
-      var thead = root_2$6();
+      var thead = root_4$1();
       var tr = $.child(thead);
       var node_3 = $.child(tr);
 
@@ -4331,7 +4327,7 @@ function HtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersBefore),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th = root_3$1();
+          var th = root_1$8();
           var text = $.child(th, true);
 
           $.reset(th);
@@ -4349,7 +4345,7 @@ function HtmlTable($$anchor, $$props) {
 
       {
         var consequent_2 = ($$anchor) => {
-          var th_1 = root_4$2();
+          var th_1 = root_2$1();
           var node_5 = $.child(th_1);
 
           {
@@ -4411,7 +4407,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);
 
           {
@@ -4471,7 +4467,7 @@ function HtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersAfter),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th_3 = root_8$1();
+          var th_3 = root_1$8();
           var text_4 = $.child(th_3, true);
 
           $.reset(th_3);
@@ -4507,7 +4503,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(
@@ -4517,7 +4513,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(
@@ -4541,7 +4537,7 @@ function HtmlTable($$anchor, $$props) {
 
       {
         var consequent_5 = ($$anchor) => {
-          var th_4 = root_11();
+          var th_4 = root_1$8();
           var text_5 = $.child(th_4, true);
 
           $.reset(th_4);
@@ -4572,7 +4568,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);
 
           {
@@ -4614,7 +4610,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(
@@ -4648,15 +4644,16 @@ function HtmlTable($$anchor, $$props) {
 
 $.delegate(['click']);
 
-var root_1$8 = $.from_html(
+var rest_excludes$3 = new Set(['$$slots', '$$events', '$$legacy']);
+var root$g = $.from_html(
   `<button class="previous"></button><button class="next"></button> `,
   1,
 );
-var root$7 = $.from_html(`<!> `, 1);
+var root_1$7 = $.from_html(`<!> `, 1);
 
 function SortedTablePaginator($$anchor, $$props) {
   $.push($$props, true);
-  $.rest_props($$props, ['$$slots', '$$events', '$$legacy']);
+  $.rest_props($$props, rest_excludes$3);
   const offset = $.derived(() =>
     $$props.offset == null ||
     $$props.offset > $$props.total ||
@@ -4682,12 +4679,12 @@ function SortedTablePaginator($$anchor, $$props) {
     }
   });
 
-  var fragment = root$7();
+  var fragment = root_1$7();
   var node = $.first_child(fragment);
 
   {
     var consequent = ($$anchor) => {
-      var fragment_1 = root_1$8();
+      var fragment_1 = root$g();
       var button = $.first_child(fragment_1);
 
       button.textContent = '←';
@@ -4727,7 +4724,7 @@ function SortedTablePaginator($$anchor, $$props) {
 
 $.delegate(['click']);
 
-/* sortingAndPagination.svelte.ts generated by Svelte v5.55.5 */
+/* sortingAndPagination.svelte.ts generated by Svelte v5.56.3 */
 
 const createSortingAndPagination = (
   getCellId,
@@ -4797,27 +4794,29 @@ const createSortingAndPagination = (
   };
 };
 
+var rest_excludes$2 = 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$2);
 
   const defaultCellIds = getResultTableCellIds(
     () => $$props.queryId,
@@ -4893,22 +4892,23 @@ function ResultSortedTableInHtmlTable($$anchor, $$props) {
   $.pop();
 }
 
+var rest_excludes$1 = 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$1);
   const index = getIndexStoreTableId(
     () => $$props.indexes,
     () => $$props.indexId,
@@ -4965,28 +4965,30 @@ function SliceInHtmlTable($$anchor, $$props) {
   $.pop();
 }
 
+var rest_excludes = 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);
 
   const defaultCellIds = getTableCellIds(
     () => $$props.tableId,
@@ -5093,15 +5095,12 @@ function ValueView($$anchor, $$props) {
   $.pop();
 }
 
-var root_2$5 = $.from_html(`<th> </th>`);
-var root_3 = $.from_html(`<th>Id</th>`);
-var root_4$1 = $.from_html(`<th> </th>`);
-var root_1$7 = $.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$2 = $.from_html(`<tr><!><!><td><!></td><!></tr>`);
-var root$6 = $.from_html(`<table><!><tbody></tbody></table>`);
+var root$f = $.from_html(`<th> </th>`);
+var root_1$6 = $.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);
@@ -5121,12 +5120,12 @@ function ValuesInHtmlTable($$anchor, $$props) {
   const extraHeadersAfter = $.derived(() =>
     getExtraHeaders(extraCellsAfter(), 1),
   );
-  var table = root$6();
+  var table = root_5();
   var node = $.child(table);
 
   {
     var consequent_1 = ($$anchor) => {
-      var thead = root_1$7();
+      var thead = root_2();
       var tr = $.child(thead);
       var node_1 = $.child(tr);
 
@@ -5136,7 +5135,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersBefore),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th = root_2$5();
+          var th = root$f();
           var text = $.child(th, true);
 
           $.reset(th);
@@ -5154,7 +5153,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
 
       {
         var consequent = ($$anchor) => {
-          var th_1 = root_3();
+          var th_1 = root_1$6();
 
           $.append($$anchor, th_1);
         };
@@ -5177,7 +5176,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
         () => $.get(extraHeadersAfter),
         (extraHeader) => extraHeader.key,
         ($$anchor, extraHeader) => {
-          var th_3 = root_4$1();
+          var th_3 = root$f();
           var text_2 = $.child(th_3, true);
 
           $.reset(th_3);
@@ -5211,7 +5210,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
     (valueId) => valueId,
     ($$anchor, valueId) => {
       const valueProps = $.derived(() => ({valueId, store: $$props.store}));
-      var tr_1 = root_5$2();
+      var tr_1 = root_4();
       var node_4 = $.child(tr_1);
 
       $.each(
@@ -5221,7 +5220,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(
@@ -5245,7 +5244,7 @@ function ValuesInHtmlTable($$anchor, $$props) {
 
       {
         var consequent_2 = ($$anchor) => {
-          var th_4 = root_7();
+          var th_4 = root$f();
           var text_3 = $.child(th_4, true);
 
           $.reset(th_4);
@@ -5299,7 +5298,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(
@@ -5598,8 +5597,8 @@ function MetricView($$anchor, $$props) {
   $.pop();
 }
 
-var root_5$1 = $.from_html(`<tr><th> </th><td> </td><td><!></td></tr>`);
-var root_4 = $.from_html(
+var root$e = $.from_html(`<tr><th> </th><td> </td><td><!></td></tr>`);
+var root_1$5 = $.from_html(
   `<table><thead><tr><th>Metric Id</th><th>Table Id</th><th>Metric</th></tr></thead><tbody></tbody></table>`,
 );
 
@@ -5644,7 +5643,7 @@ function MetricsView($$anchor, $$props) {
               var d = $.derived(() => arrayIsEmpty(metricIds.current));
 
               var alternate = ($$anchor) => {
-                var table = root_4();
+                var table = root_1$5();
                 var tbody = $.sibling($.child(table));
 
                 $.each(
@@ -5653,7 +5652,7 @@ function MetricsView($$anchor, $$props) {
                   () => metricIds.current,
                   (metricId) => metricId,
                   ($$anchor, metricId) => {
-                    var tr = root_5$1();
+                    var tr = root$e();
                     var th = $.child(tr);
                     var text_1 = $.child(th, true);
 
@@ -6045,12 +6044,12 @@ function RelationshipsView($$anchor, $$props) {
   $.pop();
 }
 
-var root$5 = $.from_html(
+var root$d = $.from_html(
   `<div class="actions"><div><!></div> <div><!></div></div>`,
 );
 
 function Actions($$anchor, $$props) {
-  var div = root$5();
+  var div = root$d();
   var div_1 = $.child(div);
   var node = $.child(div_1);
 
@@ -6066,7 +6065,7 @@ function Actions($$anchor, $$props) {
   $.append($$anchor, div);
 }
 
-var root$4 = $.from_html(` <img title="Confirm" class="ok" alt=""/>`, 1);
+var root$c = $.from_html(` <img title="Confirm" class="ok" alt=""/>`, 1);
 
 function Delete($$anchor, $$props) {
   $.push($$props, true);
@@ -6095,7 +6094,7 @@ function Delete($$anchor, $$props) {
 
   $.next();
 
-  var fragment = root$4();
+  var fragment = root$c();
   var text = $.first_child(fragment);
   var img = $.sibling(text);
 
@@ -6107,7 +6106,7 @@ function Delete($$anchor, $$props) {
 
 $.delegate(['click']);
 
-var root$3 = $.from_html(` <input type="text"/>  <img alt=""/>`, 1);
+var root$b = $.from_html(` <input type="text"/>  <img alt=""/>`, 1);
 
 function NewId($$anchor, $$props) {
   $.push($$props, true);
@@ -6156,7 +6155,7 @@ function NewId($$anchor, $$props) {
 
   $.next();
 
-  var fragment = root$3();
+  var fragment = root$b();
   var text = $.first_child(fragment);
   var input_1 = $.sibling(text);
 
@@ -6191,11 +6190,8 @@ $.delegate(['input', 'keydown', 'click']);
 
 const isNewIdAction = (action) => 'set' in action;
 
-var root_1$6 = $.from_html(
-  `<!>  <img title="Cancel" class="cancel" alt=""/>`,
-  1,
-);
-var root_5 = $.from_html(`<img alt=""/>`);
+var root$a = $.from_html(`<!>  <img title="Cancel" class="cancel" alt=""/>`, 1);
+var root_1$4 = $.from_html(`<img alt=""/>`);
 
 function ConfirmableActions($$anchor, $$props) {
   $.push($$props, true);
@@ -6227,7 +6223,7 @@ function ConfirmableActions($$anchor, $$props) {
   {
     var consequent_1 = ($$anchor) => {
       const action = $.derived(() => $$props.actions[$.get(confirming)]);
-      var fragment_1 = root_1$6();
+      var fragment_1 = root$a();
       var node_1 = $.first_child(fragment_1);
 
       {
@@ -6291,7 +6287,7 @@ function ConfirmableActions($$anchor, $$props) {
         () => $$props.actions,
         $.index,
         ($$anchor, action, index) => {
-          var img_1 = root_5();
+          var img_1 = root_1$4();
 
           $.template_effect(() => {
             $.set_attribute(img_1, 'title', $.get(action).title);
@@ -6564,7 +6560,7 @@ function CellActions($$anchor, $$props) {
   $.pop();
 }
 
-var root$2 = $.from_html(`<!> <!>`, 1);
+var root$9 = $.from_html(`<!> <!>`, 1);
 
 function EditableCellViewWithActions($$anchor, $$props) {
   $.push($$props, true);
@@ -6575,7 +6571,7 @@ function EditableCellViewWithActions($$anchor, $$props) {
     () => $$props.cellId,
     () => $$props.store,
   );
-  var fragment = root$2();
+  var fragment = root$9();
   var node = $.first_child(fragment);
 
   EditableCellView(node, {
@@ -6628,7 +6624,7 @@ function EditableCellViewWithActions($$anchor, $$props) {
   $.pop();
 }
 
-var root_1$5 = $.from_html(`<!> <!>`, 1);
+var root$8 = $.from_html(`<!> <!>`, 1);
 
 function TableView($$anchor, $$props) {
   $.push($$props, true);
@@ -6691,7 +6687,7 @@ function TableView($$anchor, $$props) {
     },
 
     children: ($$anchor, $$slotProps) => {
-      var fragment_1 = root_1$5();
+      var fragment_1 = root$8();
       var node = $.first_child(fragment_1);
 
       {
@@ -6781,8 +6777,8 @@ function TableView($$anchor, $$props) {
   $.pop();
 }
 
-var root_2$4 = $.from_html(`<p>No tables.</p>`);
-var root_1$4 = $.from_html(`<!> <!>`, 1);
+var root$7 = $.from_html(`<p>No tables.</p>`);
+var root_1$3 = $.from_html(`<!> <!>`, 1);
 
 function TablesView($$anchor, $$props) {
   $.push($$props, true);
@@ -6819,12 +6815,12 @@ function TablesView($$anchor, $$props) {
     },
 
     children: ($$anchor, $$slotProps) => {
-      var fragment_1 = root_1$4();
+      var fragment_1 = root_1$3();
       var node = $.first_child(fragment_1);
 
       {
         var consequent = ($$anchor) => {
-          var p = root_2$4();
+          var p = root$7();
 
           $.append($$anchor, p);
         };
@@ -7003,8 +6999,8 @@ function ValuesActions($$anchor, $$props) {
   $.pop();
 }
 
-var root_2$3 = $.from_html(`<p>No values.</p>`);
-var root_1$3 = $.from_html(`<!> <!>`, 1);
+var root$6 = $.from_html(`<p>No values.</p>`);
+var root_1$2 = $.from_html(`<!> <!>`, 1);
 
 function ValuesView($$anchor, $$props) {
   $.push($$props, true);
@@ -7039,12 +7035,12 @@ function ValuesView($$anchor, $$props) {
     },
 
     children: ($$anchor, $$slotProps) => {
-      var fragment_1 = root_1$3();
+      var fragment_1 = root_1$2();
       var node = $.first_child(fragment_1);
 
       {
         var consequent = ($$anchor) => {
-          var p = root_2$3();
+          var p = root$6();
 
           $.append($$anchor, p);
         };
@@ -7101,7 +7097,7 @@ function ValuesView($$anchor, $$props) {
   $.pop();
 }
 
-var root_2$2 = $.from_html(`<!> <!>`, 1);
+var root$5 = $.from_html(`<!> <!>`, 1);
 
 function StoreView($$anchor, $$props) {
   $.push($$props, true);
@@ -7135,7 +7131,7 @@ function StoreView($$anchor, $$props) {
           },
 
           children: ($$anchor, $$slotProps) => {
-            var fragment_2 = root_2$2();
+            var fragment_2 = root$5();
             var node_1 = $.first_child(fragment_2);
 
             ValuesView(node_1, {
@@ -7186,8 +7182,8 @@ function StoreView($$anchor, $$props) {
   $.pop();
 }
 
-var root_1$2 = $.from_html(`<span class="warn"> </span>`);
-var root_2$1 = $.from_html(
+var root$4 = $.from_html(`<span class="warn"> </span>`);
+var root_1$1 = $.from_html(
   `<article><!> <!> <!> <!> <!> <!> <!> <!> <!> <!></article>`,
 );
 
@@ -7217,11 +7213,11 @@ function Body($$anchor, $$props) {
       const observer = new MutationObserver(() => {
         if (
           articleElement.scrollWidth >=
-            mathFloor(Number(scrollLeft)) + articleElement.clientWidth &&
+            mathFloor(number(scrollLeft)) + articleElement.clientWidth &&
           articleElement.scrollHeight >=
-            mathFloor(Number(scrollTop)) + articleElement.clientHeight
+            mathFloor(number(scrollTop)) + articleElement.clientHeight
         ) {
-          articleElement.scrollTo(Number(scrollLeft), Number(scrollTop));
+          articleElement.scrollTo(number(scrollLeft), number(scrollTop));
         }
       });
 
@@ -7262,7 +7258,7 @@ function Body($$anchor, $$props) {
 
   {
     var consequent = ($$anchor) => {
-      var span = root_1$2();
+      var span = root$4();
       var text = $.child(span, true);
 
       $.reset(span);
@@ -7271,7 +7267,7 @@ function Body($$anchor, $$props) {
     };
 
     var alternate = ($$anchor) => {
-      var article_1 = root_2$1();
+      var article_1 = root_1$1();
       var node_1 = $.child(article_1);
 
       StoreView(node_1, {
@@ -7432,7 +7428,7 @@ function Body($$anchor, $$props) {
   $.pop();
 }
 
-var root_1$1 = $.from_html(`<span class="warn"> </span>`);
+var root$3 = $.from_html(`<span class="warn"> </span>`);
 
 function ErrorBoundary($$anchor, $$props) {
   const handleError = (
@@ -7446,7 +7442,7 @@ function ErrorBoundary($$anchor, $$props) {
 
   {
     const failed = ($$anchor, _error = $.noop, _reset = $.noop) => {
-      var span = root_1$1();
+      var span = root$3();
       var text = $.child(span, true);
 
       $.reset(span);
@@ -7466,8 +7462,8 @@ function ErrorBoundary($$anchor, $$props) {
   $.append($$anchor, fragment);
 }
 
-var root_2 = $.from_html(`<img tabindex="0" alt=""/>`);
-var root$1 = $.from_html(
+var root$2 = $.from_html(`<img tabindex="0" alt=""/>`);
+var root_1 = $.from_html(
   `<header><img class="flat" tabindex="0" alt=""/> <span> </span> <!>  <img class="flat" title="Close" tabindex="0" alt=""/></header>`,
 );
 
@@ -7481,7 +7477,7 @@ function Header($$anchor, $$props) {
   const handleClick = () => open('https://tinybase.org', '_blank');
   const handleClose = () => $$props.s.setValue(OPEN_VALUE, false);
   const handleDock = (event) =>
-    $$props.s.setValue(POSITION_VALUE, Number(event.currentTarget.dataset.id));
+    $$props.s.setValue(POSITION_VALUE, number(event.currentTarget.dataset.id));
 
   const onKeyDown = (event, handle) => {
     if (event.key == 'Enter' || event.key == ' ') {
@@ -7490,7 +7486,7 @@ function Header($$anchor, $$props) {
     }
   };
 
-  var header = root$1();
+  var header = root_1();
   var img = $.child(header);
   var span = $.sibling(img, 2);
   var text = $.child(span, true);
@@ -7510,7 +7506,7 @@ function Header($$anchor, $$props) {
 
       {
         var consequent = ($$anchor) => {
-          var img_1 = root_2();
+          var img_1 = root$2();
 
           $.set_attribute(img_1, 'data-id', p);
           $.template_effect(() =>
@@ -7551,7 +7547,7 @@ function Header($$anchor, $$props) {
 
 $.delegate(['click', 'keydown']);
 
-var root_1 = $.from_html(`<main><!> <!></main>`);
+var root$1 = $.from_html(`<main><!> <!></main>`);
 
 function Panel($$anchor, $$props) {
   $.push($$props, true);
@@ -7569,7 +7565,7 @@ function Panel($$anchor, $$props) {
 
   {
     var consequent = ($$anchor) => {
-      var main = root_1();
+      var main = root$1();
       var node_1 = $.child(main);
 
       Header(node_1, {