Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add formatters: fullDateWithWeekday, weekday and weekdayShort #399

Closed
philipbulley opened this issue Jun 25, 2020 · 5 comments
Closed

Add formatters: fullDateWithWeekday, weekday and weekdayShort #399

philipbulley opened this issue Jun 25, 2020 · 5 comments
Assignees
Labels
good first issue Good for newcomers needs work 💪 Need some work

Comments

@philipbulley
Copy link
Contributor

I'd like to request a few additional formats to be added as follows:

/** Localized full date with weekday, useful for accessibility @example "Tuesday, January 1st, 2019" */
fullDateWithWeekday: TLibFormatToken;

/** Weekday format string @example "Wednesday" */
weekday: TLibFormatToken;

/** Short weekday format string @example "Wed" */
weekdayShort: TLibFormatToken;

Why?

I'm creating a Date Picker (for React Native) and feel its important for accessibility that the weekday, month, day, and year can be read out aloud by a screen reader.

Why not just pass a custom format string?

I don't want end-users of the date picker to have to pass in a custom formatter string to achieve this, simply because accessibility is often ignored and this issue will rarely be visible to developers. We really need to ship with a good default.

Why aren't the existing defaultFormats suitable?

  • fullDate outputs January 1st, 2019 and doesn't contain the weekday
  • normalDateWithWeekday outputs Wed, Jan 1st and as such is not suitable for screen readers due to the abbreviations of weekday and month
  • There are no defaultFormats that can output the weekday alone which would otherwise allow a suitable string to be built through multiple format() calls

@dmtrKovalenko, if you're fine with this addition, I'd be happy to submit a PR.

@dmtrKovalenko
Copy link
Owner

@philipbulley thanks for this issue! we definitely need it.

It will be really cool if you will open PR with functionality. Thanks ❤️

@philipbulley
Copy link
Contributor Author

@dmtrKovalenko I've also just noticed that the existing fullDate doesn't work as per the docs.

Given these docs:

/** Localized full date, useful for accessibility @example "January 1st, 2019" */
fullDate: TLibFormatToken;

The tests have assertions that don't match the example in the docs:

${"fullDate"} | ${"Feb 1, 2020"} | ${"1 февр. 2020 г."}

Making fullDate unsuitable for accessibility and screen readers as month abbreviations are used.

If you're not keen on making a breaking change here, would it be a good idea to introduce formatters named a11yFullDate and change the proposed fullDateWithWeekday to a11yFullDateWithWeekday? I'm happy to make the changes as part of #400, just let me know what you'd prefer.

@dmtrKovalenko
Copy link
Owner

There is keyboardDate that is suitable for keyboard input. But agree that it should be more default behavior

@philipbulley
Copy link
Contributor Author

philipbulley commented Jun 25, 2020

/** Localized keyboard input friendly date format @example "2019/01/01" */
keyboardDate: TLibFormatToken;

Yeah, I'm thinking more about text-to-speech, as such Tuesday, January 1st, 2019 would be more suitable than 2019/01/01.

I think the problem above can be resolved by improving the docs, which I've now done in the PR.

@dmtrKovalenko
Copy link
Owner

Already released

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
good first issue Good for newcomers needs work 💪 Need some work
Projects
None yet
Development

No branches or pull requests

2 participants