Describe the bug
Currently, timezone options are prefixed with "(UTC …)", which prevents effective
keyboard-based filtering because all options start with the same characters.
This affects users who rely on keyboard navigation or type-to-select behavior
in select components.
Example (current):
(UTC +05:30) India
(UTC +01:00) Germany
Suggested improvement:
India (UTC +05:30)
Germany (UTC +01:00)
This change improves accessibility and keyboard navigation without affecting
the underlying timezone values.
I am happy to submit a PR if this approach is acceptable.
Reproduction
Steps to reproduce: 1. Use the TimezoneSelect component from this library. 2. Open the timezone dropdown. 3. Focus the select input and start typing a location name (e.g., "I" for India or "G" for Germany). 4. Observe that type-to-select does not work as expected because all options begin with "(UTC …)". Expected behavior: Typing the first letter of a location should jump to the corresponding timezone. Actual behavior: Typing any letter does not meaningfully filter or jump because all labels share the same "(UTC …)" prefix.
System Info
OS: Any
Browser: Any
Node.js: Any
Affected version: All current versions of react-timezone-select
This issue is independent of environment and reproducible across systems,
as it relates to option label formatting.
Used Package Manager
npm
Validations
Describe the bug
Currently, timezone options are prefixed with "(UTC …)", which prevents effective
keyboard-based filtering because all options start with the same characters.
This affects users who rely on keyboard navigation or type-to-select behavior
in select components.
Example (current):
(UTC +05:30) India
(UTC +01:00) Germany
Suggested improvement:
India (UTC +05:30)
Germany (UTC +01:00)
This change improves accessibility and keyboard navigation without affecting
the underlying timezone values.
I am happy to submit a PR if this approach is acceptable.
Reproduction
Steps to reproduce: 1. Use the TimezoneSelect component from this library. 2. Open the timezone dropdown. 3. Focus the select input and start typing a location name (e.g., "I" for India or "G" for Germany). 4. Observe that type-to-select does not work as expected because all options begin with "(UTC …)". Expected behavior: Typing the first letter of a location should jump to the corresponding timezone. Actual behavior: Typing any letter does not meaningfully filter or jump because all labels share the same "(UTC …)" prefix.
System Info
Used Package Manager
npm
Validations