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

JP和暦の表記に対応してほしい #90

Open
araera111 opened this issue Feb 22, 2023 · 0 comments
Open

JP和暦の表記に対応してほしい #90

araera111 opened this issue Feb 22, 2023 · 0 comments

Comments

@araera111
Copy link

araera111 commented Feb 22, 2023

有用なライブラリとしてありがたく使用させていただきました。
クライアントから西暦+和暦の表記を希望されております。
とりあえず急ぎだったのでフォークして使用いたしました。

ひとまず下記のような実装にしてみましたが……。

export interface UseDateSelectOptions {
  firstYear?: number;
  lastYear?: number;
  defaultYear?: number | "now";
  defaultMonth?: number | "now";
  defaultDay?: number | "now";
  locale?: Locale;
  yearFormat?: string;
  monthFormat?: string;
  dayFormat?: string;
  isJpEra?: boolean; //->追加した
}
  const labelToYearFormatJPEra = (
    yearFormat: string | undefined,
    isJpEra: boolean | undefined,
    i: number
  ) => {
    if (isJpEra) {
      const formatter = new Intl.DateTimeFormat("ja-JP-u-ca-japanese", {
        year: "numeric",
      });
      const date = new Date(i, 0, 1);
      const result = formatter.format(date);
      return yearFormat
        ? formatDate(date, yearFormat, { locale }) + `(${result})`
        : i.toString() + `(${result})`;
    }

    return yearFormat
      ? formatDate(new Date(i, 0, 1), yearFormat, { locale })
      : i.toString();
  };

  const rawYearOptions = useMemo(() => {
    const firstYear =
      opts.firstYear != null ? opts.firstYear : DEFAULT_FIRST_YEAR;
    const lastYear =
      opts.lastYear != null ? opts.lastYear : new Date().getFullYear();
    return range(firstYear, lastYear).map((i) => {
      const label = labelToYearFormatJPEra(yearFormat, opts.isJpEra, i);
      return { value: convertToSelectValue(i), label };
    });
  }, [opts.firstYear, opts.lastYear, locale, yearFormat]);

date-fnsで和暦対応する方法がわからず、Intl.Datetimeで対応しました。
この実装ではなくても良いので、西暦と和暦の併記などに対応していただけると嬉しいです。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant