Storybook complains about google font

Question

I get the following error when running storybook tests locally: error: TypeError: (0 , next_font_google__WEBPACK_IMPORTED_MODULE_0__.Mukta) is not a function. What is the solution to this problem? The following is the .storybook/main.js file:

/** @type { import('@storybook/react-webpack5').StorybookConfig } */
const config = {
  stories: [
    // '../stories/**/*.mdx',
    // '../stories/**/*.stories.@(js|jsx|ts|tsx)',
    '../**/*.stories.@(js|jsx|ts|tsx)',
  ],
  addons: [
    '@storybook/addon-links',
    '@storybook/addon-essentials',
    '@storybook/addon-interactions',
    {
      name: 'storybook-addon-swc',
      options: {
        enable: true,
        enableSwcLoader: true,
        enableSwcMinify: true,
        swcLoaderOptions: {},
        swcMinifyOptions: {},
      },
    },
  ],
  framework: {
    name: '@storybook/nextjs',
    options: {
      
    },
  },
  docs: {
    autodocs: 'tag',
  },
};
export default config; 

And Mukta-font is used like this:

import { Mukta } from 'next/font/google';

const mukta = Mukta({
  subsets: ['latin'],
  weight: ['400', '600', '700'],
});