@finsweet/webflow-apps-utils 1.0.3 → 1.0.5

package/dist/providers/configuratorUtils.d.ts

@@ -1,18 +1,23 @@
+import { type DiffMap, type DiffResult } from '../utils/diff-mapper';
 import type { ConfiguratorState, ConfiguratorWatchOptions } from './types';
 /**
  * Create default configurator state
  */
 export declare function createDefaultConfiguratorState<T = Record<string, any>>(): ConfiguratorState<T>;
 /**
- * Deep compare two objects with performance optimizations
+ * Use deepDiffMapper to compare objects and determine if there are any changes
  */
-export declare function deepCompare<T>(obj1: T, obj2: T): boolean;
+export declare function hasChangesViaDiff<T>(current: T, updated: T): boolean;
 /**
- * Compare specific keys of two objects with optimization
+ * Get detailed diff information using deepDiffMapper
  */
-export declare function compareKeys<T extends Record<string, any>>(obj1: T | null, obj2: T | null, keys: string[]): boolean;
+export declare function getDetailedDiff<T>(current: T, updated: T): DiffResult | DiffMap;
 /**
- * Determine if configurator has changed with performance optimization
+ * Compare specific keys of two objects with optimization using deepDiffMapper
+ */
+export declare function compareKeys<T extends Record<string, any>>(current: T | null, updated: T | null, keys: string[]): boolean;
+/**
+ * Determine if configurator has changed with performance optimization using deepDiffMapper
  */
 export declare function hasConfiguratorChanged<T extends Record<string, any>>(configurator: T | null, configuratorCache: T | null, watchOptions: ConfiguratorWatchOptions): boolean;
 /**
@@ -22,16 +27,8 @@ export declare function createDebouncedUpdate<T extends (...args: any[]) => void
 /**
  * Extract specific keys from an object
  */
-export declare function extractKeys<T extends Record<string, any>>(obj: T | null, keys: string[]): Partial<T> | null;
-/**
- * Get all keys from an object (for watchAll mode)
- */
-export declare function getAllKeys<T extends Record<string, any>>(obj: T | null): string[];
+export declare function extractKeys<T extends Record<string, any>>(current: T | null, keys: string[]): Partial<T> | null;
 /**
  * Validate watch options
  */
 export declare function validateWatchOptions(options: ConfiguratorWatchOptions): ConfiguratorWatchOptions;
-/**
- * Create a snapshot of configurator state for comparison
- */
-export declare function createConfiguratorSnapshot<T extends Record<string, any>>(configurator: T | null, watchOptions: ConfiguratorWatchOptions): T | Partial<T> | null;

package/dist/providers/configuratorUtils.js

@@ -1,3 +1,5 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+import { deepDiffMapper, DiffType } from '../utils/diff-mapper';
 /**
  * Create default configurator state
  */
@@ -13,118 +15,88 @@ export function createDefaultConfiguratorState() {
         }
     };
 }
-// Cache for deep comparison results to avoid repeated expensive operations
-const comparisonCache = new Map();
+// Cache for diff comparison results to avoid repeated expensive operations
+const diffCache = new Map();
 const CACHE_TTL = 1000;
 /**
- * Optimized deep compare with caching and early returns
+ * Use deepDiffMapper to compare objects and determine if there are any changes
  */
-function deepEqual(obj1, obj2, maxDepth = 10) {
-    if (obj1 === obj2)
-        return true;
-    if (maxDepth <= 0)
-        return obj1 === obj2;
-    if (obj1 == null || obj2 == null)
-        return obj1 === obj2;
-    const type1 = typeof obj1;
-    const type2 = typeof obj2;
-    if (type1 !== type2)
-        return false;
-    if (type1 !== 'object')
-        return obj1 === obj2;
-    const isArray1 = Array.isArray(obj1);
-    const isArray2 = Array.isArray(obj2);
-    if (isArray1 !== isArray2)
-        return false;
-    if (isArray1) {
-        if (obj1.length !== obj2.length)
-            return false;
-        for (let i = 0; i < obj1.length; i++) {
-            if (!deepEqual(obj1[i], obj2[i], maxDepth - 1))
-                return false;
-        }
-        return true;
-    }
-    const keys1 = Object.keys(obj1);
-    const keys2 = Object.keys(obj2);
-    if (keys1.length !== keys2.length)
+export function hasChangesViaDiff(current, updated) {
+    if (current === updated)
         return false;
-    keys1.sort();
-    keys2.sort();
-    for (let i = 0; i < keys1.length; i++) {
-        if (keys1[i] !== keys2[i])
-            return false;
+    const cacheKey = JSON.stringify([current, updated]);
+    const cached = diffCache.get(cacheKey);
+    let diff;
+    if (cached && Date.now() - cached.timestamp < CACHE_TTL) {
+        diff = cached.result;
     }
-    for (const key of keys1) {
-        if (!deepEqual(obj1[key], obj2[key], maxDepth - 1))
-            return false;
+    else {
+        diff = deepDiffMapper.compare(current, updated);
+        diffCache.set(cacheKey, { result: diff, timestamp: Date.now() });
+        // Clean old cache entries periodically
+        if (diffCache.size > 100) {
+            const now = Date.now();
+            for (const [key, value] of diffCache.entries()) {
+                if (now - value.timestamp > CACHE_TTL) {
+                    diffCache.delete(key);
+                }
+            }
+        }
     }
-    return true;
+    // Check if there are any meaningful changes
+    return hasAnyChanges(diff);
 }
 /**
- * Fast shallow comparison for primitive values and first-level objects
+ * Recursively check if a diff result contains any actual changes
  */
-function shallowCompare(obj1, obj2) {
-    if (obj1 === obj2)
-        return true;
-    if (obj1 == null || obj2 == null)
-        return obj1 === obj2;
-    if (typeof obj1 !== 'object' || typeof obj2 !== 'object')
-        return obj1 === obj2;
-    const keys1 = Object.keys(obj1);
-    const keys2 = Object.keys(obj2);
-    if (keys1.length !== keys2.length)
-        return false;
-    for (const key of keys1) {
-        if (obj1[key] !== obj2[key])
-            return false;
+function hasAnyChanges(diff) {
+    // If it's a DiffResult, check if it's not UNCHANGED
+    if (diff && typeof diff === 'object' && 'type' in diff && 'data' in diff) {
+        return diff.type !== DiffType.UNCHANGED;
     }
-    return true;
+    // If it's a DiffMap, check all properties recursively
+    if (diff && typeof diff === 'object') {
+        for (const key in diff) {
+            if (hasAnyChanges(diff[key])) {
+                return true;
+            }
+        }
+    }
+    return false;
 }
 /**
- * Deep compare two objects with performance optimizations
+ * Get detailed diff information using deepDiffMapper
  */
-export function deepCompare(obj1, obj2) {
-    if (shallowCompare(obj1, obj2))
-        return true;
-    const cacheKey = JSON.stringify([obj1, obj2]);
-    const cached = comparisonCache.get(cacheKey);
+export function getDetailedDiff(current, updated) {
+    const cacheKey = JSON.stringify([current, updated]);
+    const cached = diffCache.get(cacheKey);
     if (cached && Date.now() - cached.timestamp < CACHE_TTL) {
         return cached.result;
     }
-    const result = deepEqual(obj1, obj2, 5);
-    comparisonCache.set(cacheKey, { result, timestamp: Date.now() });
-    // Clean old cache entries periodically
-    if (comparisonCache.size > 100) {
-        const now = Date.now();
-        for (const [key, value] of comparisonCache.entries()) {
-            if (now - value.timestamp > CACHE_TTL) {
-                comparisonCache.delete(key);
-            }
-        }
-    }
-    return result;
+    const diff = deepDiffMapper.compare(current, updated);
+    diffCache.set(cacheKey, { result: diff, timestamp: Date.now() });
+    return diff;
 }
 /**
- * Compare specific keys of two objects with optimization
+ * Compare specific keys of two objects with optimization using deepDiffMapper
  */
-export function compareKeys(obj1, obj2, keys) {
-    if (!obj1 && !obj2)
+export function compareKeys(current, updated, keys) {
+    if (!current && !updated)
         return true;
-    if (!obj1 || !obj2)
+    if (!current || !updated)
         return false;
     if (keys.length === 0)
         return true;
     if (keys.length === 1) {
         const key = keys[0];
-        return obj1[key] === obj2[key] || deepCompare(obj1[key], obj2[key]);
+        return !hasChangesViaDiff(current[key], updated[key]);
     }
     for (const key of keys) {
-        const val1 = obj1[key];
-        const val2 = obj2[key];
+        const val1 = current[key];
+        const val2 = updated[key];
         if (val1 === val2)
             continue;
-        if (!deepCompare(val1, val2)) {
+        if (hasChangesViaDiff(val1, val2)) {
             return false;
         }
     }
@@ -133,7 +105,7 @@ export function compareKeys(obj1, obj2, keys) {
 // Debounce storage
 const debounceTimers = new Map();
 /**
- * Determine if configurator has changed with performance optimization
+ * Determine if configurator has changed with performance optimization using deepDiffMapper
  */
 export function hasConfiguratorChanged(configurator, configuratorCache, watchOptions) {
     if (!configurator && !configuratorCache)
@@ -141,14 +113,17 @@ export function hasConfiguratorChanged(configurator, configuratorCache, watchOpt
     if (!configurator || !configuratorCache)
         return true;
     if (watchOptions.watchAll) {
-        if (shallowCompare(configurator, configuratorCache))
-            return false;
-        return !deepCompare(configurator, configuratorCache);
+        // Use deepDiffMapper for comprehensive comparison with type coercion and better edge case handling
+        return hasChangesViaDiff(configurator, configuratorCache);
     }
     if (watchOptions.watchKeys && watchOptions.watchKeys.length > 0) {
-        return !compareKeys(configurator, configuratorCache, watchOptions.watchKeys);
+        // Extract only the watched keys and compare them
+        const extracted1 = extractKeys(configurator, watchOptions.watchKeys);
+        const extracted2 = extractKeys(configuratorCache, watchOptions.watchKeys);
+        return hasChangesViaDiff(extracted1, extracted2);
     }
-    return !shallowCompare(configurator, configuratorCache);
+    // For minimal watch (no specific keys), fallback to full comparison with diff mapper
+    return hasChangesViaDiff(configurator, configuratorCache);
 }
 /**
  * Create a debounced function for configurator updates
@@ -170,25 +145,17 @@ export function createDebouncedUpdate(fn, delay) {
 /**
  * Extract specific keys from an object
  */
-export function extractKeys(obj, keys) {
-    if (!obj || keys.length === 0)
+export function extractKeys(current, keys) {
+    if (!current || keys.length === 0)
         return null;
     const result = {};
     for (const key of keys) {
-        if (key in obj) {
-            result[key] = obj[key];
+        if (key in current) {
+            result[key] = current[key];
         }
     }
     return result;
 }
-/**
- * Get all keys from an object (for watchAll mode)
- */
-export function getAllKeys(obj) {
-    if (!obj)
-        return [];
-    return Object.keys(obj);
-}
 /**
  * Validate watch options
  */
@@ -203,17 +170,3 @@ export function validateWatchOptions(options) {
     }
     return validated;
 }
-/**
- * Create a snapshot of configurator state for comparison
- */
-export function createConfiguratorSnapshot(configurator, watchOptions) {
-    if (!configurator)
-        return null;
-    if (watchOptions.watchAll) {
-        return { ...configurator };
-    }
-    if (watchOptions.watchKeys && watchOptions.watchKeys.length > 0) {
-        return extractKeys(configurator, watchOptions.watchKeys);
-    }
-    return { ...configurator };
-}

package/dist/providers/index.d.ts

@@ -2,4 +2,4 @@ export { default as GlobalProvider } from './GlobalProvider.svelte';
 export { createGlobalContext, setGlobalContext, getGlobalContext, useContext, useFormContext, useAppContext, useDataContext, useConfiguratorContext } from './globalContext.svelte.js';
 export type { FormContextState, AppContextState, DataContextState, ContextState, GlobalContextState, ContextOperations, GlobalContextOperations, GlobalProviderProps, ContextEvent, GlobalContextEvent, ContextKey, ContextId, ConfiguratorWatchOptions, ConfiguratorState, AppContextData, FormContextData, DataContextData } from './types.js';
 export { CONTEXT_KEYS } from './types.js';
-export { deepCompare, compareKeys, hasConfiguratorChanged, createDebouncedUpdate, extractKeys, getAllKeys, validateWatchOptions, createConfiguratorSnapshot, createDefaultConfiguratorState } from './configuratorUtils';
+export { hasChangesViaDiff, getDetailedDiff, compareKeys, hasConfiguratorChanged, createDebouncedUpdate, extractKeys, validateWatchOptions, createDefaultConfiguratorState } from './configuratorUtils';

package/dist/providers/index.js

@@ -4,4 +4,4 @@ export { default as GlobalProvider } from './GlobalProvider.svelte';
 export { createGlobalContext, setGlobalContext, getGlobalContext, useContext, useFormContext, useAppContext, useDataContext, useConfiguratorContext } from './globalContext.svelte.js';
 export { CONTEXT_KEYS } from './types.js';
 // Configurator utilities
-export { deepCompare, compareKeys, hasConfiguratorChanged, createDebouncedUpdate, extractKeys, getAllKeys, validateWatchOptions, createConfiguratorSnapshot, createDefaultConfiguratorState } from './configuratorUtils';
+export { hasChangesViaDiff, getDetailedDiff, compareKeys, hasConfiguratorChanged, createDebouncedUpdate, extractKeys, validateWatchOptions, createDefaultConfiguratorState } from './configuratorUtils';

package/dist/router/Router.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/sveltekit';
+import RouterExample from './examples/RouterExample.svelte';
+declare const meta: Meta<typeof RouterExample>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const CompleteExample: Story;