How to use the catalog.pageLoader function in catalog

export default {
  path: "/bottomSheet",
  title: "Bottom Sheet",
  imports: {
    BottomSheet,
    Backdrop,
    Section,
    SectionItem,
    sections,
    ListRowOverflow,
    TransitionGroup,
    CSSTransition,
    MAX_COLUMNS
  },
  content: pageLoader(() => import("./index.md"))
};

Section,
    SectionItem,
    Button,
    listItems,
    sections,
    pureListItems,
    ThumbnailCircleImage,
    ResponsiveHeader,
    onOverflowButtonClick,
    MAX_COLUMNS,
    Container,
    Row,
    Column,
    Text
  },
  content: pageLoader(() => import("./index.md"))
};

/>
      
    );
  }
}

export default {
  path: "/banner",
  title: "Banner",
  imports: {
    Banner,
    ClearIcon,
    Spacing,
    FunctionalBannerDemo
  },
  content: pageLoader(() => import("./index.md"))
};

import { Link, LinkCta, Text } from "../../../src/components/Text";

export default {
  path: "/links",
  title: "Links",
  imports: {
    Link,
    LinkCta,
    Text,
    ThemeProvider,
    Container,
    Row,
    Column,
    Spacing
  },
  content: pageLoader(() => import("./index.md"))
};

import React from 'react'
import ReactDOM from 'react-dom'
import { Catalog, pageLoader } from 'catalog'

import Panel from 'components/lib/Panel'
import Button from 'components/lib/Button'

ReactDOM.render(
  ,
  document.getElementById('root')
)

export default rootPath => ({
  title: 'Data',
  pages: [
    {
      path: `${rootPath}/resolving`,
      title: 'Resolving',
      content: pageLoader(() => import('table-resolver/README.md'))
    },
    {
      path: `${rootPath}/inline-editing`,
      title: 'Inline Editing',
      content: pageLoader(() => import('./inline-editing.md'))
    },
    {
      path: `${rootPath}/sorting`,
      title: 'Sorting',
      content: pageLoader(() => import('sortabular/README.md'))
    },
    {
      path: `${rootPath}/pagination`,
      title: 'Pagination',
      content: pageLoader(() => import('./pagination.md'))
    },
    {
      path: `${rootPath}/tree`,
      title: 'Tree',
      content: pageLoader(() => import('treetabular/README.md'))
    }

Column,
    Container,
    Row,

    iconStyle,
    iconLabelStyle,
    PlusIcon,
    CreateNewIcon,
    FraudulentActivityIcon,
    PrintIcon,
    FavoriteIcon,
    LaunchIcon,
    PlayCircularIcon
  },
  content: pageLoader(() => import("./index.md"))
};

import { pageLoader } from "catalog";

import StatusBadgeDemo from "./StatusBadgeDemo";
import { Spacing, themes } from "../../../src";
import {StatusBadge} from "../../../src/components/StatusBadge";

export default {
  path: "/status_badge",
  title: "Status Badge",
  imports: {
    StatusBadgeDemo,
    Spacing,
    StatusBadge,
    themes
  },
  content: pageLoader(() => import("./index.md"))
};

}
            ]
    }))
    .reduce((acc, cur) => ({ ...acc, ...cur }), {});

const imports = {
  ...getImports("global", global),
  ...getImports("tm", tm),
  ...getImports("lne", lne)
};

export default {
  path: "/colors",
  title: "Colors",
  imports,
  content: pageLoader(() => import("./index.md"))
};

export default {
  path: "/nav_bar",
  title: "Nav Bar",
  imports: {
    NavBar,
    Header,
    Button,
    Spacing,
    Container,
    Column,
    Row,
    DeviceSizeProvider,
    DisplayFor,
    DrawerProvider
  },
  content: pageLoader(() => import("./index.md"))
};