Overview

CDK Validator

The LmnValidators class provides a collection of static methods that return custom Angular ValidatorFn functions. These validators are designed to integrate seamlessly with Angular's Reactive Forms module, offering specialized validation logic for common scenarios, particularly involving LmnDate objects.

Importing

To use these validators, you'll typically import the LmnValidators class:

import { LmnValidators } from '@elemental/ui';

Validators

date

This validator function checks if a form control's string value represents a valid LmnDate.

Returns: ValidatorFn

Returns null if the control value is a valid date according to the specified parameters or if it's not required and empty.
Returns { date: true } if the validation fails.

Usage Example:

import { FormControl } from '@angular/forms';
import { LmnValidators } from '@elemental/ui';

// Example: Date must be in 'YYYY-MM-DD' format and is required
const dateControl = new FormControl('', [LmnValidators.date('YYYY-MM-DD')]);

dateControl.setValue('2023-10-26'); // Valid
dateControl.setValue('26/10/2023'); // Invalid (if strict or wrong format)
dateControl.setValue(''); // Invalid (since required is true by default)

// Example: Date must be in 'DD/MM/YYYY' format, not required, strict parsing
const optionalDateControl = new FormControl('', [LmnValidators.date('DD/MM/YYYY', false, true)]);

optionalDateControl.setValue(''); // Valid (since required is false)

lmnDate

This validator function checks if a form control's value is an actual, valid LmnDate object instance.

Returns: { lmnDate: boolean } | null

Returns null if the control value is a valid LmnDate object or if the control value is falsy (e.g., null, undefined).
Returns { lmnDate: true } if the control value is not a valid LmnDate object.

Usage Example:

import { FormControl } from '@angular/forms';
import { LmnValidators } from '@elemental/ui';
import { LmnDate } from '@elemental/common'; // Assuming LmnDate class

const lmnDateControl = new FormControl(null, [LmnValidators.lmnDate]);

lmnDateControl.setValue(new LmnDate('2023-10-26')); // Valid
console.log(lmnDateControl.errors); // null

lmnDateControl.setValue(new LmnDate('invalid-date-string')); // Invalid LmnDate object
console.log(lmnDateControl.errors); // { lmnDate: true }

lmnDateControl.setValue('2023-10-26'); // Invalid - not an LmnDate object instance
console.log(lmnDateControl.errors); // { lmnDate: true } (assuming string is not a valid LmnDate by its own check)

lmnDateControl.setValue(null); // Valid (passes the validator as control.value is falsy)
console.log(lmnDateControl.errors); // null

dateOrderValidator

This validator function is designed for a FormGroup and checks if a "second" date is chronologically after a "first" date. Both dates are expected to be LmnDate objects.

Returns: ValidatorFn

When validation fails (second date is not after the first, or first date is invalid while second is valid):
- The FormGroup receives the error: { dateOrder: 'There is an error to the date order' }.
- The secondDateControl receives the error: { dateOrder: 'The date does not respect the order' }.
Returns {} (empty object, signifying no error at the group level for this specific validator) if:
- The date order is valid.
- Either of the specified form controls doesn't exist.
- Both date values are falsy (e.g., null or undefined).
If the secondDateControl previously had a dateOrder error and is now valid, this validator attempts to clear that specific error.

Usage Example:

import { FormGroup, FormControl, Validators } from '@angular/forms';
import { LmnValidators } from '@elemental/ui';
import { LmnDate } from '@elemental/common';

const formGroup = new FormGroup(
  {
    startDate: new FormControl(new LmnDate('2023-10-26'), [Validators.required, LmnValidators.lmnDate]),
    endDate: new FormControl(
      new LmnDate('2023-10-25'), // Intentionally wrong order for demo
      [Validators.required, LmnValidators.lmnDate],
    ),
  },
  {
    validators: LmnValidators.dateOrderValidator('startDate', 'endDate'),
  },
);

formGroup.updateValueAndValidity();

console.log(formGroup.errors); // { dateOrder: 'There is an error to the date order' }
console.log(formGroup.get('endDate')?.errors); // { dateOrder: 'The date does not respect the order', ...other errors if any }

// Correcting the date
formGroup.get('endDate')?.setValue(new LmnDate('2023-10-27'));
formGroup.updateValueAndValidity();

console.log(formGroup.errors); // {} or null (if no other group errors)
console.log(formGroup.get('endDate')?.errors); // null (if lmnDate and required are met)

requiredAtLeastTrue

This validator checks if a FormGroup (or a FormControl whose value is an object) has at least a specified number of its property values set to true.

Returns: ValidatorFn

Returns null if the control's value (or the values of its properties if it's a group) meets the numberOfTrue requirement.
Returns { requiredAtLeastTrue: true } if the validation fails.

Usage Example:

Applied to a FormGroup:

import { FormGroup, FormControl } from '@angular/forms';
import { LmnValidators } from '@elemental/ui';

const preferencesForm = new FormGroup(
  {
    likesNotifications: new FormControl(true),
    agreesToTerms: new FormControl(false),
    subscribedToNewsletter: new FormControl(false),
  },
  {
    validators: LmnValidators.requiredAtLeastTrue(2), // At least 2 options must be true
  },
);

preferencesForm.updateValueAndValidity();
console.log(preferencesForm.errors); // { requiredAtLeastTrue: true }

preferencesForm.get('agreesToTerms')?.setValue(true);
preferencesForm.updateValueAndValidity();
console.log(preferencesForm.errors); // null (now 2 are true)

Applied to a FormControl whose value is an object:

import { FormControl } from '@angular/forms';
import { LmnValidators } from '@elemental/ui';

const permissionsControl = new FormControl(
  { read: true, write: false, execute: false },
  [LmnValidators.requiredAtLeastTrue(1)], // At least 1 permission must be true
);

permissionsControl.updateValueAndValidity();
console.log(permissionsControl.errors); // null

permissionsControl.setValue({ read: false, write: false, execute: false });
permissionsControl.updateValueAndValidity();
console.log(permissionsControl.errors); // { requiredAtLeastTrue: true }