@shotleybuilder/svelte-table-kit 0.6.0 → 0.10.1

package/dist/stores/persistence.d.ts

@@ -1,7 +1,8 @@
 import type { VisibilityState, ColumnSizingState, ColumnFiltersState, ColumnOrderState, SortingState, PaginationState } from '@tanstack/svelte-table';
+import type { ColumnOrderMode } from '../types';
 /**
  * Check if we're in a browser environment
- * Note: In SvelteKit apps, import from '$app/environment'
+ * Uses cross-bundler compatible check instead of SvelteKit-specific imports
  */
 export declare const isBrowser: boolean;
 /**
@@ -52,6 +53,14 @@ export declare function loadPagination(storageKey: string, defaultPageSize?: num
  * Save pagination state to localStorage
  */
 export declare function savePagination(storageKey: string, state: PaginationState): void;
+/**
+ * Load filter column order mode from localStorage
+ */
+export declare function loadFilterColumnOrderMode(storageKey: string): ColumnOrderMode;
+/**
+ * Save filter column order mode to localStorage
+ */
+export declare function saveFilterColumnOrderMode(storageKey: string, mode: ColumnOrderMode): void;
 /**
  * Clear all table state from localStorage
  */

package/dist/stores/persistence.js

@@ -1,7 +1,7 @@
 // LocalStorage persistence utilities
 /**
  * Check if we're in a browser environment
- * Note: In SvelteKit apps, import from '$app/environment'
+ * Uses cross-bundler compatible check instead of SvelteKit-specific imports
  */
 export const isBrowser = typeof window !== 'undefined' && typeof localStorage !== 'undefined';
 /**
@@ -107,6 +107,18 @@ export function loadPagination(storageKey, defaultPageSize = 10) {
 export function savePagination(storageKey, state) {
     saveToStorage(`${storageKey}_pagination`, state);
 }
+/**
+ * Load filter column order mode from localStorage
+ */
+export function loadFilterColumnOrderMode(storageKey) {
+    return loadFromStorage(`${storageKey}_filter_column_order_mode`, 'definition');
+}
+/**
+ * Save filter column order mode to localStorage
+ */
+export function saveFilterColumnOrderMode(storageKey, mode) {
+    saveToStorage(`${storageKey}_filter_column_order_mode`, mode);
+}
 /**
  * Clear all table state from localStorage
  */
@@ -120,6 +132,7 @@ export function clearTableState(storageKey) {
         localStorage.removeItem(`${storageKey}_column_order`);
         localStorage.removeItem(`${storageKey}_sorting`);
         localStorage.removeItem(`${storageKey}_pagination`);
+        localStorage.removeItem(`${storageKey}_filter_column_order_mode`);
     }
     catch (error) {
         console.error('Failed to clear table state:', error);

package/dist/types.d.ts

@@ -54,6 +54,7 @@ export interface ViewPreset {
 }
 export type FilterOperator = 'equals' | 'not_equals' | 'contains' | 'not_contains' | 'starts_with' | 'ends_with' | 'is_empty' | 'is_not_empty' | 'greater_than' | 'less_than' | 'greater_or_equal' | 'less_or_equal' | 'is_before' | 'is_after';
 export type FilterLogic = 'and' | 'or';
+export type ColumnOrderMode = 'definition' | 'ui' | 'alphabetical';
 export interface FilterCondition {
     id: string;
     field: string;

package/dist/utils/fuzzy.d.ts

@@ -0,0 +1,47 @@
+/**
+ * Fuzzy search utilities for column/field picker
+ */
+export interface FuzzyMatch {
+    /** The original string that was matched */
+    text: string;
+    /** The match score (higher = better match) */
+    score: number;
+    /** Indices of characters that matched in the original string */
+    matchedIndices: number[];
+}
+/**
+ * Perform fuzzy matching of a search pattern against a target string.
+ * Returns null if no match, or a FuzzyMatch object with score and matched indices.
+ *
+ * Scoring:
+ * - Consecutive matches score higher
+ * - Matches at word boundaries score higher
+ * - Matches at the start of the string score higher
+ * - Case-insensitive matching
+ *
+ * @param pattern - The search pattern (e.g., "cdt" to find "Created Date")
+ * @param target - The target string to search in
+ * @returns FuzzyMatch object or null if no match
+ */
+export declare function fuzzyMatch(pattern: string, target: string): FuzzyMatch | null;
+/**
+ * Search through an array of strings and return matches sorted by score.
+ *
+ * @param pattern - The search pattern
+ * @param items - Array of strings to search
+ * @param limit - Maximum number of results to return (default: all)
+ * @returns Array of FuzzyMatch objects sorted by score (highest first)
+ */
+export declare function fuzzySearch(pattern: string, items: string[], limit?: number): FuzzyMatch[];
+/**
+ * Highlight matched characters in a string by wrapping them in a specified tag.
+ * Returns an array of segments with matched/unmatched flags for rendering.
+ *
+ * @param text - The original text
+ * @param matchedIndices - Array of indices that matched
+ * @returns Array of text segments with isMatch flag
+ */
+export declare function highlightMatches(text: string, matchedIndices: number[]): {
+    text: string;
+    isMatch: boolean;
+}[];

package/dist/utils/fuzzy.js

@@ -0,0 +1,142 @@
+/**
+ * Fuzzy search utilities for column/field picker
+ */
+/**
+ * Perform fuzzy matching of a search pattern against a target string.
+ * Returns null if no match, or a FuzzyMatch object with score and matched indices.
+ *
+ * Scoring:
+ * - Consecutive matches score higher
+ * - Matches at word boundaries score higher
+ * - Matches at the start of the string score higher
+ * - Case-insensitive matching
+ *
+ * @param pattern - The search pattern (e.g., "cdt" to find "Created Date")
+ * @param target - The target string to search in
+ * @returns FuzzyMatch object or null if no match
+ */
+export function fuzzyMatch(pattern, target) {
+    if (!pattern) {
+        return { text: target, score: 0, matchedIndices: [] };
+    }
+    const patternLower = pattern.toLowerCase();
+    const targetLower = target.toLowerCase();
+    // Quick check: all pattern characters must exist in target
+    let patternIdx = 0;
+    for (let i = 0; i < targetLower.length && patternIdx < patternLower.length; i++) {
+        if (targetLower[i] === patternLower[patternIdx]) {
+            patternIdx++;
+        }
+    }
+    if (patternIdx !== patternLower.length) {
+        return null; // Not all pattern characters found
+    }
+    // Find optimal match positions using greedy algorithm
+    const matchedIndices = [];
+    let score = 0;
+    patternIdx = 0;
+    let lastMatchIdx = -1;
+    let consecutiveCount = 0;
+    for (let i = 0; i < targetLower.length && patternIdx < patternLower.length; i++) {
+        if (targetLower[i] === patternLower[patternIdx]) {
+            matchedIndices.push(i);
+            // Base score for match
+            score += 1;
+            // Bonus for consecutive matches
+            if (lastMatchIdx === i - 1) {
+                consecutiveCount++;
+                score += consecutiveCount * 2;
+            }
+            else {
+                consecutiveCount = 0;
+            }
+            // Bonus for match at start of string
+            if (i === 0) {
+                score += 10;
+            }
+            // Bonus for match at word boundary (after space, underscore, or uppercase)
+            if (i > 0) {
+                const prevChar = target[i - 1];
+                const currChar = target[i];
+                if (prevChar === ' ' || prevChar === '_' || prevChar === '-') {
+                    score += 5;
+                }
+                else if (currChar === currChar.toUpperCase() && currChar !== currChar.toLowerCase()) {
+                    // CamelCase boundary
+                    score += 3;
+                }
+            }
+            lastMatchIdx = i;
+            patternIdx++;
+        }
+    }
+    // Bonus for shorter target strings (prefer more specific matches)
+    score += Math.max(0, 20 - target.length);
+    // Bonus if pattern matches significant portion of target
+    const coverageRatio = pattern.length / target.length;
+    score += Math.floor(coverageRatio * 10);
+    return {
+        text: target,
+        score,
+        matchedIndices
+    };
+}
+/**
+ * Search through an array of strings and return matches sorted by score.
+ *
+ * @param pattern - The search pattern
+ * @param items - Array of strings to search
+ * @param limit - Maximum number of results to return (default: all)
+ * @returns Array of FuzzyMatch objects sorted by score (highest first)
+ */
+export function fuzzySearch(pattern, items, limit) {
+    if (!pattern) {
+        // Return all items with zero score when no pattern
+        const results = items.map((text) => ({ text, score: 0, matchedIndices: [] }));
+        return limit ? results.slice(0, limit) : results;
+    }
+    const matches = [];
+    for (const item of items) {
+        const match = fuzzyMatch(pattern, item);
+        if (match) {
+            matches.push(match);
+        }
+    }
+    // Sort by score descending
+    matches.sort((a, b) => b.score - a.score);
+    return limit ? matches.slice(0, limit) : matches;
+}
+/**
+ * Highlight matched characters in a string by wrapping them in a specified tag.
+ * Returns an array of segments with matched/unmatched flags for rendering.
+ *
+ * @param text - The original text
+ * @param matchedIndices - Array of indices that matched
+ * @returns Array of text segments with isMatch flag
+ */
+export function highlightMatches(text, matchedIndices) {
+    if (!matchedIndices.length) {
+        return [{ text, isMatch: false }];
+    }
+    const matchSet = new Set(matchedIndices);
+    const segments = [];
+    let currentSegment = '';
+    let currentIsMatch = matchSet.has(0);
+    for (let i = 0; i < text.length; i++) {
+        const isMatch = matchSet.has(i);
+        if (isMatch === currentIsMatch) {
+            currentSegment += text[i];
+        }
+        else {
+            if (currentSegment) {
+                segments.push({ text: currentSegment, isMatch: currentIsMatch });
+            }
+            currentSegment = text[i];
+            currentIsMatch = isMatch;
+        }
+    }
+    if (currentSegment) {
+        segments.push({ text: currentSegment, isMatch: currentIsMatch });
+    }
+    return segments;
+}

package/package.json

@@ -1,78 +1,78 @@
 {
-  "name": "@shotleybuilder/svelte-table-kit",
-  "version": "0.6.0",
-  "description": "A comprehensive, AI-configurable data table component for Svelte and SvelteKit, built on TanStack Table v8",
-  "author": "Sertantai",
-  "license": "MIT",
-  "keywords": [
-    "svelte",
-    "sveltekit",
-    "table",
-    "datagrid",
-    "tanstack",
-    "data-table",
-    "airtable",
-    "headless",
-    "typescript"
-  ],
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/shotleybuilder/svelte-table-kit.git"
-  },
-  "bugs": {
-    "url": "https://github.com/shotleybuilder/svelte-table-kit/issues"
-  },
-  "homepage": "https://github.com/shotleybuilder/svelte-table-kit#readme",
-  "type": "module",
-  "svelte": "./dist/index.js",
-  "types": "./dist/index.d.ts",
-  "exports": {
-    ".": {
-      "types": "./dist/index.d.ts",
-      "svelte": "./dist/index.js"
-    },
-    "./styles": "./dist/styles/table-kit.css"
-  },
-  "files": [
-    "dist",
-    "!dist/**/*.test.*",
-    "!dist/**/*.spec.*"
-  ],
-  "scripts": {
-    "dev": "vite dev",
-    "build": "vite build && npm run package",
-    "package": "svelte-kit sync && svelte-package && publint",
-    "prepublishOnly": "npm run package",
-    "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
-    "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
-    "test": "vitest",
-    "test:ui": "vitest --ui",
-    "test:run": "vitest run",
-    "lint": "prettier --check . && eslint .",
-    "format": "prettier --write ."
-  },
-  "peerDependencies": {
-    "svelte": "^4.0.0 || ^5.0.0",
-    "@tanstack/svelte-table": "^8.0.0"
-  },
-  "devDependencies": {
-    "@sveltejs/adapter-auto": "^3.0.0",
-    "@sveltejs/kit": "^2.0.0",
-    "@sveltejs/package": "^2.0.0",
-    "@sveltejs/vite-plugin-svelte": "^3.0.0",
-    "@tanstack/svelte-table": "^8.21.3",
-    "@types/eslint": "^9.6.0",
-    "eslint": "^9.0.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-svelte": "^2.36.0",
-    "prettier": "^3.1.1",
-    "prettier-plugin-svelte": "^3.1.2",
-    "publint": "^0.1.9",
-    "svelte": "^4.2.7",
-    "svelte-check": "^3.6.0",
-    "tslib": "^2.4.1",
-    "typescript": "^5.0.0",
-    "vite": "^5.0.11",
-    "vitest": "^2.0.0"
-  }
+	"name": "@shotleybuilder/svelte-table-kit",
+	"version": "0.10.1",
+	"description": "A comprehensive, AI-configurable data table component for Svelte and SvelteKit, built on TanStack Table v8",
+	"author": "Sertantai",
+	"license": "MIT",
+	"keywords": [
+		"svelte",
+		"sveltekit",
+		"table",
+		"datagrid",
+		"tanstack",
+		"data-table",
+		"airtable",
+		"headless",
+		"typescript"
+	],
+	"repository": {
+		"type": "git",
+		"url": "git+https://github.com/shotleybuilder/svelte-table-kit.git"
+	},
+	"bugs": {
+		"url": "https://github.com/shotleybuilder/svelte-table-kit/issues"
+	},
+	"homepage": "https://github.com/shotleybuilder/svelte-table-kit#readme",
+	"type": "module",
+	"svelte": "./dist/index.js",
+	"types": "./dist/index.d.ts",
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"svelte": "./dist/index.js"
+		},
+		"./styles": "./dist/styles/table-kit.css"
+	},
+	"files": [
+		"dist",
+		"!dist/**/*.test.*",
+		"!dist/**/*.spec.*"
+	],
+	"scripts": {
+		"dev": "vite dev",
+		"build": "vite build && npm run package",
+		"package": "svelte-kit sync && svelte-package && publint",
+		"prepublishOnly": "npm run package",
+		"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
+		"check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+		"test": "vitest",
+		"test:ui": "vitest --ui",
+		"test:run": "vitest run",
+		"lint": "prettier --check . && eslint .",
+		"format": "prettier --write ."
+	},
+	"peerDependencies": {
+		"svelte": "^4.0.0 || ^5.0.0",
+		"@tanstack/svelte-table": "^8.0.0"
+	},
+	"devDependencies": {
+		"@sveltejs/adapter-auto": "^3.0.0",
+		"@sveltejs/kit": "^2.0.0",
+		"@sveltejs/package": "^2.0.0",
+		"@sveltejs/vite-plugin-svelte": "^3.0.0",
+		"@tanstack/svelte-table": "^8.21.3",
+		"@types/eslint": "^9.6.0",
+		"eslint": "^9.0.0",
+		"eslint-config-prettier": "^9.1.0",
+		"eslint-plugin-svelte": "^2.36.0",
+		"prettier": "^3.1.1",
+		"prettier-plugin-svelte": "^3.1.2",
+		"publint": "^0.1.9",
+		"svelte": "^4.2.7",
+		"svelte-check": "^3.6.0",
+		"tslib": "^2.4.1",
+		"typescript": "^5.0.0",
+		"vite": "^5.0.11",
+		"vitest": "^2.0.0"
+	}
 }