fix(DateRangeField): Dialog reactivity and stepper offsets (#649)

* fix(DateRangeField): Reflect value changes (quick presets, stepper, etc) in dialog

* fix(DateRangeField): Fix stepper offsets

Author: techniq

.changeset/bright-sites-wonder.md

@@ -0,0 +1,5 @@
+---
+'svelte-ux': patch
+---
+
+fix(DateRangeField): Fix stepper offsets

.changeset/dry-peas-hear.md

@@ -0,0 +1,5 @@
+---
+'svelte-ux': patch
+---
+
+fix(DateRangeField): Reflect value changes (quick presets, stepper, etc) in dialog

packages/svelte-ux/src/lib/components/DateRangeField.svelte

@@ -60,7 +60,6 @@
 
   // Field props
   export let label: string | null = null;
-  // export let value = '';
   export let error = '';
   export let hint = '';
   export let disabled = false;
@@ -75,6 +74,9 @@
 
   let currentValue = value;
 
+  // Sync currentValue with value changes (quick preset changes)
+  $: currentValue = value;
+
   $: restProps = { ...defaults, ...$$restProps };
 </script>
 
@@ -105,7 +107,7 @@
               $localeSettings,
               value.periodType
             );
-            const offset = difference(value.from, value.to) - 1;
+            const offset = -difference(value.from, value.to) - 1;
             value = {
               from: start(add(value.from, offset)),
               to: end(add(value.to, offset)),
@@ -161,7 +163,7 @@
               $localeSettings,
               value.periodType
             );
-            const offset = difference(value.to, value.from) + 1;
+            const offset = difference(value.from, value.to) + 1;
             value = {
               from: start(add(value.from, offset)),
               to: end(add(value.to, offset)),