ReadOnlyYearField

ReadOnlyYearField renders a year value as non-editable output. It is used in detail and view screens for attributes that represent a year only, such as a founding year, model year, or fiscal year.

Props

| Prop | Type | Required | Default | Description | |------|------|----------|---------|-------------| | value | string \| number | No | — | The year to display (e.g. 2024 or "2024"). Displays "-" when absent. | | label | string | No | — | Label shown above the field. | | description | string | No | — | Helper text shown below the field in italic. | | containerStyle | React.CSSProperties | No | — | Style overrides for the outer wrapper div. | | labelStyle | React.CSSProperties | No | — | Style overrides for the label element. | | descriptionStyle | React.CSSProperties | No | — | Style overrides for the description text. |

Usage

Basic

import ReadOnlyYearField from '@/components/read-only-fields/ReadOnlyYearField';

<ReadOnlyYearField
  label="Founded"
  value={2018}
/>

With description

<ReadOnlyYearField
  label="Model Year"
  value={vehicle.year}
  description="The manufacturing year of the vehicle."
/>