How to build a npm lib with subfolders like MateriaUI using Rollup.js

Im trying to build my lib and export the components like MaterialUI way:

But, the only thing I can do, is that:

Im using rollup.js and typescript. I notice that d.ts and type.ts files have been exported in the component folder but the component itself is exported in main folder.

Can someone help me to fix it?

My rollup.js config:

import commonjs from '@rollup/plugin-commonjs'
import resolve from '@rollup/plugin-node-resolve'
import replace from '@rollup/plugin-replace'
import peerDepsExternal from 'rollup-plugin-peer-deps-external'
import typescript from 'rollup-plugin-typescript2'
import postcss from 'rollup-plugin-postcss'
import { terser } from 'rollup-plugin-terser'
import del from 'rollup-plugin-delete'
import includePaths from 'rollup-plugin-includepaths'

/* css imports */

import pkg from './package.json'

export default {
  input: ['./src/index.ts', './src/TestComponent/index.tsx'],
  output: [
    {
      dir: 'dist/esm',
      format: 'esm',
      sourcemap: true,
      exports: 'named',
      strict: false,
      plugins: [terser()]
    }
  ],
  plugins: [
    includePaths({ paths: ['./src'] }),
    typescript({

    }),
    peerDepsExternal(),
    resolve(),
    commonjs(),
    del({
      targets: ['dist/*']
    }),
    postcss({
      modules: true,
      extract: false,
      namedExports: true,
      writeDefinitions: true,
    }),
    replace({
      preventAssignment: true,
      ENV: JSON.stringify(process.env)
    }),
  ],
  external: Object.keys(pkg.peerDependencies)
}

My tsconfig.json file:

{
  "compilerOptions": {
    "declaration": true,
    "declarationDir": "dist",
    "outDir": "dist",
    "module": "esnext",
    "target": "es5",
    "lib": ["es6", "dom", "es2016", "es2017"],
    "sourceMap": true,
    "allowJs": false,
    "jsx": "react",
    "moduleResolution": "node",
    "forceConsistentCasingInFileNames": true,
    "noImplicitReturns": true,
    "noImplicitThis": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "suppressImplicitAnyIndexErrors": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "plugins": [{ "name": "typescript-plugin-css-modules" }]
   },
  "include": ["src/**/*"],
  "exclude": [
    "node_modules",
    "dist",
    "src/**/*.stories.tsx",
    "src/**/*.test.tsx"
  ]
 }

My folder's structure:

Ps: I'd like to export only the components to import like

import TestComponent from '@ind/package/esm/TestComponent'

and

import {TestComponent} from '@ind/package/esm'