Update docs

gpbl · Dec 25, 2024 · 42f722d · 42f722d
1 parent 52aae7b
commit 42f722d
Showing 1 changed file with 33 additions and 34 deletions.
diff --git a/website/docs/docs/localization.mdx b/website/docs/docs/localization.mdx
@@ -6,19 +6,22 @@ sidebar_position: 6
 
 DayPicker provides various options to customize the calendar for different languages and regions.
 
+- For time zone support, see the [Time Zone](../docs/time-zone.mdx) guide.
+
 | Prop Name               | Type                                          | Description                                                                              |
 | ----------------------- | --------------------------------------------- | ---------------------------------------------------------------------------------------- |
 | `locale`                | [`Locale`](https://date-fns.org/docs/I18n)    | Set the locale. Default is `en-US`.                                                      |
 | `weekStartsOn`          | `1` \| `2` \| `3` \| `4` \| `5` \| `6` \| `7` | Change the first day of the week.                                                        |
 | `firstWeekContainsDate` | `1` \| `4`                                    | Configure the first date in the first week of the year.                                  |
-| `timeZone`              | `string`                                      | The time zone (IANA or UTC offset) to use in the calendar.                               |
 | `ISOWeek`               | `boolean`                                     | Switch to [ISO Week Dates](https://en.wikipedia.org/wiki/ISO_week_date).                 |
 | `broadcastCalendar`     | `boolean`                                     | Switch to the [US Broadcast Calendar](https://en.wikipedia.org/wiki/Broadcast_calendar). |
 | `jalali`                | `boolean`                                     | Switch to the Jalali calendar.                                                           |
 
 ## Setting the Locale
 
-To change the default `en-US` to another locale, import a locale object from `react-day-picker/locale` and pass it to the`locale` prop.
+DayPicker supports all the locales included in the [date-fns](https://date-fns.org/docs/I18n) library.
+
+- To change the default `en-US` to another locale, import a locale object from `react-day-picker/locale` and pass it to the`locale` prop.
 
 ```tsx
 // import the locale object
@@ -53,38 +56,7 @@ import { DayPicker, defaultLocale } from "react-day-picker";
 
 :::
 
-## Changing the Time Zone {#time-zone}
-
-See [Time Zone docs](./time-zone.mdx) for more information.
-
-## Localization Options
-
-### First Date of the Week
-
-Use the `weekStartsOn` prop to set the first day of the week.
-
-```tsx
-<DayPicker weekStartsOn={0} /> // Start the week on Sunday
-```
-
-<BrowserWindow>
-  <Examples.WeekStartsOn />
-</BrowserWindow>
-
-### First Week Contains Date
-
-The `firstWeekContainsDate` prop sets the first day of the year's initial week, which is used to calculate week numbers. Acceptable values are `1` for Monday and `4` for Thursday.
-
-For more information, see [Week Numbering](https://en.wikipedia.org/wiki/Week#Numbering) on Wikipedia and the [getWeek function](https://date-fns.org/docs/getWeek) from `date-fns`.
-
-```tsx
-<DayPicker
-  showWeekNumber
-  firstWeekContainsDate={1} // First week must contain Monday
-/>
-```
-
-### ISO Week Dates
+## ISO 8601 Calendar
 
 Use the `ISOWeek` prop to switch to [ISO Week Dates](https://en.wikipedia.org/wiki/ISO_week_date) instead of the locale setting.
 
@@ -166,3 +138,30 @@ In the broadcast calendar, weeks start on Monday and end on Sunday. Each month h
 <BrowserWindow>
   <Examples.BroadcastCalendar />
 </BrowserWindow>
+
+## Advanced Localization Options
+
+### First Date of the Week
+
+Use the `weekStartsOn` prop to set the first day of the week.
+
+```tsx
+<DayPicker weekStartsOn={0} /> // Start the week on Sunday
+```
+
+<BrowserWindow>
+  <Examples.WeekStartsOn />
+</BrowserWindow>
+
+### First Week Contains Date
+
+The `firstWeekContainsDate` prop sets the first day of the year's initial week, which is used to calculate week numbers. Acceptable values are `1` for Monday and `4` for Thursday.
+
+For more information, see [Week Numbering](https://en.wikipedia.org/wiki/Week#Numbering) on Wikipedia and the [getWeek function](https://date-fns.org/docs/getWeek) from `date-fns`.
+
+```tsx
+<DayPicker
+  showWeekNumber
+  firstWeekContainsDate={1} // First week must contain Monday
+/>
+```