Employment Period Fields

ProNew

A start and end month and year for a job or course with an I currently work here switch that removes the end and keeps the dates in order. Use this when a CV or profile asks for periods that only need a month and a year and may still be running.

Customize

Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.

today

Guide and examples

When to use it

Use it when a CV or profile asks for periods that only need a month and a year and may still be running.

Do not use it for exact dates; use date-range-field.

Installation

This item is part of tealmac UI Pro

The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.

Props

Prop	Type	Default	Description
value / defaultValue	`{ from: string \| null; to: string \| null \| "present" }`	empty	Months as `YYYY-MM`; `to` is `present` while current.
onValueChange	`(period) => void`	-	Called on every change.
today	string	today	Reference day; later months are refused.

Accessibility

Each side is a named group of month and year spinbuttons; the switch removes the end fields from the page; an end before the start is an alert.

Testing

The pattern ships with a Testing Library test (employment-period-fields.test.tsx) that covers the validation, present, and typing both ends.