angular ag-grid doesn't work with storybook

Question

I want to create a storybook for my ag-grid component. I have tried the usual way that I follow for other angular components. But this doesn't seem to work.

const meta: Meta<AgGridAngular> ={
    title: 'GridCell',
    component: AgGridAngular,
    tags: ['autodocs'],
    decorators: [
        moduleMetadata({
          imports: [AgGridAngular, AgGridModule],
        }),
      ],
    render: (args) => ({
        props: {
            ...args,
        },
        template: `    
        <ag-grid-angular
            [rowHeight]=50
            [headerHeight]=44
            [suppressCellFocus]=true
            ${argsToTemplate(args)}
        >
        </ag-grid-angular>
        `
    }),
};

export default meta;
type Story = StoryObj<AgGridAngular>;
export const grid_cell: Story = {
    args: {
        rowData: [
            { make: "Tesla", model: "Model Y", price: 64950, electric: true },
            { make: "Ford", model: "F-Series", price: 33850, electric: false },
            { make: "Toyota", model: "Corolla", price: 29600, electric: false },
        ],
        columnDefs: [
            { field: "make" },
            { field: "model" },
            { field: "price" },
            { field: "electric" }
        ]
    }
};

This is just renders an empty div. I was not able to find many resources to integrate storybook with ag-grid in angular. What am i missing?