@tanstack/svelte-table 8.0.0-alpha.74 → 8.0.0-alpha.78

package/build/esm/index.js

@@ -2689,8 +2689,10 @@ const Headers = {
       },
       // Header Groups
       getHeaderGroups: memo(() => [instance.getAllColumns(), instance.getVisibleLeafColumns(), instance.getState().columnPinning.left, instance.getState().columnPinning.right], (allColumns, leafColumns, left, right) => {
-        const leftColumns = leafColumns.filter(column => left == null ? void 0 : left.includes(column.id));
-        const rightColumns = leafColumns.filter(column => right == null ? void 0 : right.includes(column.id));
+        var _left$map$filter, _right$map$filter;
+
+        const leftColumns = (_left$map$filter = left == null ? void 0 : left.map(columnId => leafColumns.find(d => d.id === columnId)).filter(Boolean)) != null ? _left$map$filter : [];
+        const rightColumns = (_right$map$filter = right == null ? void 0 : right.map(columnId => leafColumns.find(d => d.id === columnId)).filter(Boolean)) != null ? _right$map$filter : [];
         const centerColumns = leafColumns.filter(column => !(left != null && left.includes(column.id)) && !(right != null && right.includes(column.id)));
         const headerGroups = buildHeaderGroups(allColumns, [...leftColumns, ...centerColumns, ...rightColumns], instance);
         return headerGroups;
@@ -2714,8 +2716,10 @@ const Headers = {
         }
       }),
       getLeftHeaderGroups: memo(() => [instance.getAllColumns(), instance.getVisibleLeafColumns(), instance.getState().columnPinning.left], (allColumns, leafColumns, left) => {
-        leafColumns = leafColumns.filter(column => left == null ? void 0 : left.includes(column.id));
-        return buildHeaderGroups(allColumns, leafColumns, instance, 'left');
+        var _left$map$filter2;
+
+        const orderedLeafColumns = (_left$map$filter2 = left == null ? void 0 : left.map(columnId => leafColumns.find(d => d.id === columnId)).filter(Boolean)) != null ? _left$map$filter2 : [];
+        return buildHeaderGroups(allColumns, orderedLeafColumns, instance, 'left');
       }, {
         key: process.env.NODE_ENV === 'development' && 'getLeftHeaderGroups',
         debug: () => {
@@ -2725,8 +2729,10 @@ const Headers = {
         }
       }),
       getRightHeaderGroups: memo(() => [instance.getAllColumns(), instance.getVisibleLeafColumns(), instance.getState().columnPinning.right], (allColumns, leafColumns, right) => {
-        leafColumns = leafColumns.filter(column => right == null ? void 0 : right.includes(column.id));
-        return buildHeaderGroups(allColumns, leafColumns, instance, 'right');
+        var _right$map$filter2;
+
+        const orderedLeafColumns = (_right$map$filter2 = right == null ? void 0 : right.map(columnId => leafColumns.find(d => d.id === columnId)).filter(Boolean)) != null ? _right$map$filter2 : [];
+        return buildHeaderGroups(allColumns, orderedLeafColumns, instance, 'right');
       }, {
         key: process.env.NODE_ENV === 'development' && 'getRightHeaderGroups',
         debug: () => {
@@ -4002,18 +4008,46 @@ function renderServer(Comp, props) {
 
 const renderComponent = typeof window === 'undefined' ? renderServer : renderClient;
 
-function render(Comp, props) {
-  if (!Comp) return null;
+function isSvelteServerComponent(component) {
+  return typeof component === 'object' && typeof component.$$render === 'function' && typeof component.render === 'function';
+}
+
+function isSvelteClientComponent(component) {
+  return component.prototype instanceof SvelteComponent;
+}
 
-  if (Comp instanceof Function) {
-    let res = Comp(props);
-    return res;
+function isSvelteComponent(component) {
+  if (typeof document === 'undefined') {
+    return isSvelteServerComponent(component);
   } else {
-    return renderComponent(Placeholder, {
-      content: Comp
-    });
-  } // return Comp
+    return isSvelteClientComponent(component);
+  }
+}
+
+function wrapInPlaceholder(content) {
+  return renderComponent(Placeholder, {
+    content
+  });
+}
+
+function render(component, props) {
+  if (!component) return null;
+
+  if (isSvelteComponent(component)) {
+    return renderComponent(component, props);
+  }
+
+  if (typeof component === 'function') {
+    const result = component(props);
+
+    if (isSvelteComponent(result)) {
+      return result;
+    }
+
+    return wrapInPlaceholder(result);
+  }
 
+  return wrapInPlaceholder(component);
 }
 const createTable = createTableFactory({
   render