SegmentFilter Component Demo

El component SegmentFilter permet gestionar un segment individual amb opcions d'origen, destinació, data i hora, així com la possibilitat d'eliminar el segment.

Basic Usage

El component SegmentFilter permet gestionar un segment individual amb opcions d'origen, destinació, data i hora, així com la possibilitat d'eliminar el segment. Inclou el SegmentData per la selecció de dades.

1. From - To

{
  "id": 1,
  "origin": null,
  "destination": null,
  "date": null,
  "time": null
}

With Default Values

Exemple amb valors per defecte pre-seleccionats i botó d'eliminació desactivat.

2. Barcelona - Madrid

API Reference


interface SegmentFilterProps {
  index: number;
  segment: SegmentEntry;
  isDeleteButtonEnabled: boolean;
  dataTestId?: string;
  onGetOriginData?: (filter: string) => LegacyLocation[];
  onGetDestinationData?: (filter: string) => LegacyLocation[];
  onSegmentSelected?: (segment: SegmentEntry) => void;
  onDeleteSegment?: (id: number) => void;
  className?: string;
}

interface SegmentEntry {
  id: number;
  origin: LegacyLocation | null;
  destination: LegacyLocation | null;
  date: Date | null;
  time: Date | null;
}