Repository: dcastil/tailwind-merge (ts)

Issue:
Incorrectly identifies `via-(length:...)` as a color
### Describe the bug

Incorrectly identifies `via-(length:--some-variable)` as a color.

### To Reproduce

```
// prints "via-(length:--mobile-header-gradient-height)"
console.log(
    twMerge(
      "via-background via-(length:--mobile-header-gradient-height)",
    ),
  );
```

### Expected behavior

```
// prints "via-background via-(length:--mobile-header-gradient-height)"
console.log(
    twMerge(
      "via-background via-(length:--mobile-header-gradient-height)",
    ),
  );
```

### Environment

<!-- Add any relevant environment info -->

-   tailwind-merge version: 3.0.2

### Additional context

I managed to workaround the issue by adding this to the `classGroups` of my tailwind merge config:
`"gradient-via-pos": [{ via: [(str: string) => str.startsWith("(length:")] }]`


Pull request:
Fix length variable in `via-(length:*)` class being merged with `via-<color>` classes accidentally
Closes #557

Patch:
diff --git a/src/lib/default-config.ts b/src/lib/default-config.ts
index c8d375f..b332426 100644
--- a/src/lib/default-config.ts
+++ b/src/lib/default-config.ts
@@ -112,7 +112,8 @@ export const getDefaultConfig = () => {
             ...scaleUnambiguousSpacing(),
         ] as const
     const scaleColor = () => [themeColor, isArbitraryVariable, isArbitraryValue] as const
-    const scaleGradientStopPosition = () => [isPercent, isArbitraryLength] as const
+    const scaleGradientStopPosition = () =>
+        [isPercent, isArbitraryVariableLength, isArbitraryLength] as const
     const scaleRadius = () =>
         [
             // Deprecated since Tailwind CSS v4.0.0


Test patch:
diff --git a/tests/tailwind-css-versions.test.ts b/tests/tailwind-css-versions.test.ts
index c8588ec..9c47b4d 100644
--- a/tests/tailwind-css-versions.test.ts
+++ b/tests/tailwind-css-versions.test.ts
@@ -80,4 +80,10 @@ test('supports Tailwind CSS v4.0 features', () => {
         'font-stretch-50%',
     )
     expect(twMerge('col-span-full col-2 row-span-3 row-4')).toBe('col-2 row-4')
+    expect(twMerge('via-red-500 via-(--mobile-header-gradient)')).toBe(
+        'via-(--mobile-header-gradient)',
+    )
+    expect(twMerge('via-red-500 via-(length:--mobile-header-gradient)')).toBe(
+        'via-red-500 via-(length:--mobile-header-gradient)',
+    )
 })