Skip to content

Calendar.vue: week-starts-on Prop - unexpected Behavior depending on locale #5343

@snakysnake

Description

@snakysnake

Environment

On the latest Version

"@nuxt/ui": "^4.1.0"

Is this bug related to Nuxt or Vue?

Nuxt

Package

v3.x

Version

v4.1.0

Reproduction

// app.vue
<template>
	<UApp :locale="chosenLocale">
		<NuxtLayout>
			<NuxtPage />
		</NuxtLayout>
	</UApp>
</template>

<script setup lang="ts">
import { de, en } from '@nuxt/ui/locale';

let locale = 'de';

const chosenLocale = computed(() => {
	if (locale.value == 'de') {
		return de;
	}
	return en;
});
</script>
// TestCalendar.vue
<template>
	<UCalendar
	     :week-starts-on="0"
	/>
</template>

### Description

Depending on the loaded locale, UCalendar decides to choose a different date-layout.
The "week-starts-on" prop leads to different behaviour depending on the locale, which I feel is surely not to be expected.

### Additional context

I'd expect the behavior the be dependent on locale, but if week-starts-on prop is set, then I think it should be treated as the single source of truth in this case.

... because now if I want to have the week layout to look the same in en and de then I would need to decide which number of days to add depending on the locale, which I feel is super weird. I know Date Objects are generally weird, but this just adds to that.

### Logs

```shell-script

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't workingtriageAwaiting initial review and prioritizationv3#1289

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions