# AUR0152

## Error Message

`AUR0152: No value converter definition found for type <TypeName>`

Where `<TypeName>` is the name of the class associated with the value converter.

## Description

This error occurs when Aurelia attempts to resolve a value converter resource (e.g., used in a binding expression like `myProp | myConverter`) but cannot find the associated definition metadata for the specified type (class). Value converter definitions are typically created using the `@valueConverter('converter-name')` decorator or by following naming conventions recognized by Aurelia (like `MyConverterValueConverter`).

## Cause

Common causes for this error include:

1. **Missing Decorator or Convention:** The class intended to be a value converter is missing the `@valueConverter('converter-name')` decorator, and it doesn't follow a recognized naming convention (like `MyConverterValueConverter`).
2. **Incorrect Registration:** The value converter class was defined but not correctly registered with the Aurelia container, either globally (`Aurelia.register(...)`) or locally within a component's `dependencies` array.
3. **Build/Packaging Issues:** The build process might not be correctly including or processing the value converter file, or there might be issues with module resolution.
4. **Typo in Class Name:** The class name provided during registration or inferred by convention might have a typo.

## Solution

1. **Add Decorator/Follow Convention:** Ensure your value converter class has the `@valueConverter('converter-name')` decorator applied, or that it follows the `*ValueConverter` naming convention.
2. **Register the Converter:** Verify that the value converter is registered correctly.
   * **Global Registration:** Use `Aurelia.register(MyValueConverter)` in your main application setup (`main.ts` or similar).
   * **Local Registration:** Add the value converter class to the `dependencies` array of the component definition where it's used: `@customElement({ name: 'my-component', template, dependencies: [MyValueConverter] })`.
3. **Check Build Configuration:** Ensure your build setup (e.g., Webpack, Vite) is configured to correctly process and bundle Aurelia resources, including decorators and conventions. Verify module imports and exports.
4. **Verify Class Name:** Double-check the spelling of the value converter class name in its definition and registration.

## Example

```typescript
// date-format-value-converter.ts
import { valueConverter } from 'aurelia';

// Correct: Using the decorator
@valueConverter('dateFormat')
export class DateFormatValueConverter {
  toView(value: Date | string | number, format: string = 'yyyy-MM-dd'): string {
    // Basic example, consider using a date library for robust formatting
    try {
      const date = new Date(value);
      // Super simple example format
      if (format === 'yyyy-MM-dd') {
        return date.toISOString().split('T')[0];
      }
      return date.toLocaleString();
    } catch {
      return 'Invalid Date';
    }
  }
}

// Incorrect: Missing decorator and doesn't follow convention
// export class DateFormat { /* ... */ } // This would likely cause AUR0152 if used

// --- main.ts or component definition ---
import { Aurelia } from 'aurelia';
import { DateFormatValueConverter } from './date-format-value-converter';
// import { MyComponent } from './my-component'; // If registering locally

// Global Registration:
// Aurelia.register(DateFormatValueConverter) /* ... */;

// Local Registration (in my-component.ts):
// @customElement({
//   name: 'my-component',
//   template: `<p>Today: ${today | dateFormat}</p>`,
//   dependencies: [DateFormatValueConverter] // Register locally
// })
// export class MyComponent { today = new Date(); }
```

## Debugging Tips

* Verify the exact name (`<TypeName>`) mentioned in the error message matches the intended class name.
* Search your codebase for the value converter's class name and decorator (`@valueConverter`) to ensure it's defined correctly.
* Check your `main.ts` (or equivalent startup file) for global registrations.
* Check the `dependencies` array of the component(s) where the value converter is used.
* Inspect the build output or use browser developer tools to see if the value converter module is loaded correctly.
