Bug report

Describe the bug

When stitches utils name and component's variant have the same name, the defaultvariants can't work as normal, it's broken.

To Reproduce

I have a size util in stitches.config as below

export const { config, createTheme, css, getCssText, globalCss, keyframes, styled, theme } =
  createStitches({
    utils: {
      size: (value: PropertyValue<'width'>) => ({
        width: value,
        height: value,
      }),
  });

Also I have a size variant in one of my components, setting one value as defaultVariant.

export const SelectTrigger = styled(SelectPrimitive.Trigger, {
  'all': 'unset',
  'boxSizing': 'border-box',

  'variants': {
    size: {
      small: {
        height: '42px',
      },

      large: {
        height: '56px',
      },
    },
  },

  'defaultvariants': {
    size: 'small',
  },
});

When I use the component in the app, the default value of size can't take effect, but when I set size = small explicitly, it's OK. The typescript type refer is wrong in vscode, it should refer small | large value, but it show below screenshot.

Expected behavior

When variant name and util name are the same, the defaultVariant can work as normal.

Screenshots

System information

OS: macOS
Browser Chrome
Version of Stitches: v1.2.8
Version of Node.js: v18.7.0

stitchesjs / stitches

When stitches utils name is the same as component's variant name, defaultvariants will be broken #1085