[joy-ui] FormLabel won't accept specific variant

Duplicates

• I have searched the existing issues

Latest version

• I have tested the latest version

Steps to reproduce 🕹

I'm trying to create a new variant to some elements in a form, and I achieved it with Sheet and Input, but I had no luck with FormLabel since it won't accept the attribute variant

Current behavior 😯

What I did for Sheet was

<Sheet variant="coordinates">
...
</Sheet>

and then

declare module '@mui/joy/Sheet' {
    interface SheetPropsVariantOverrides {
        coordinates: true
    }
}
...
extendTheme({
        components: {
           JoySheet: {
                styleOverrides: {
                    root: ({ownerState}) => ({
                        ...(
                            ownerState.variant === 'coordinates' && {
                                ...

Then I replicated the same using @mui/joy/Input and JoyInput instead of @mui/joy/Sheet and JoySheet

Expected behavior 🤔

I'd expect to do the same using

declare module '@mui/joy/FormLabel' {
    interface FormLabelPropsVariantOverrides {
        coordinates: true
    }
}
...
extendTheme({
        components: {
         JoyFormLabel: {
                styleOverrides: {
                    root: ({ownerState}) => ({
                        ...(
                            ownerState.variant === 'coordinates' && {
                                width: '100%',
                                justifyContent: 'center',
                            }),
                    }),
                },
            },

Context 🔦

I want to have declared the variant in all the components needed and be able to change it to some other later

Maybe I'm getting it wrong and It has to be done other way.

Your environment 🌎

npx @mui/envinfo

  System:
    OS: macOS 12.4
  Binaries:
    Node: 14.16.1 - ~/.nvm/versions/node/v14.16.1/bin/node
    Yarn: Not Found
    npm: 8.6.0 - ~/.nvm/versions/node/v14.16.1/bin/npm
  Browsers:
    Chrome: 112.0.5615.137
    Edge: Not Found
    Firefox: Not Found
    Safari: 15.5
  npmPackages:
    @emotion/react: ^11.10.6 => 11.10.6 
    @emotion/styled: ^11.10.6 => 11.10.6 
    @mui/base:  5.0.0-alpha.125 
    @mui/core-downloads-tracker:  5.12.1 
    @mui/icons-material: ^5.11.16 => 5.11.16 
    @mui/joy: ^5.0.0-alpha.75 => 5.0.0-alpha.75 
    @mui/material: ^5.12.1 => 5.12.1 
    @mui/private-theming:  5.12.0 
    @mui/styled-engine:  5.12.0 
    @mui/system:  5.12.1 
    @mui/types:  7.2.4 
    @mui/utils:  5.12.0 
    @types/react: ^18.0.35 => 18.0.35 
    react: ^18.2.0 => 18.2.0 
    react-dom: ^18.2.0 => 18.2.0 
    typescript: ^4.9.5 => 4.9.5 

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx"
  },
  "include": [
    "src"
  ]
}