@crudx/mui

Material UI + Emotion implementation of the @crudx/core CRUD surface. Drop CrudPanelView into a page and you get list, detail, create, update, delete, filtering, paging, and bulk actions out of the box — all driven by whatever transport adapter you wire into the schema.

API-compatible with @crudx/shadcn; swap the import to switch UI stacks.

Installation

yarn add @crudx/mui @crudx/core @crudx/common \
  react react-dom \
  axios currency-symbol-map dayjs lodash numeral \
  @mui/material @mui/icons-material @emotion/react @emotion/styled \
  classnames react-hot-toast

# plus a transport adapter — choose one:
yarn add @crudx/graphql-apollo-adapter @apollo/client graphql
# or:
yarn add @crudx/rest-tanstack-adapter @tanstack/react-query

Everything in the first command is a peer dependency. The first row is the @crudx/* packages; the second row covers @crudx/{core,common}'s helpers (date / currency / numeric formatters, axios, lodash); the third is the MUI + Emotion stack; the fourth is the small utilities this package uses directly. Yarn 1 doesn't auto-install peer deps, so install them explicitly.

@crudx/mui no longer pulls in next/link directly — to keep client-side routing under Next.js, React Router, etc. wrap your app once with <LinkProvider Link={...} /> from @crudx/common. See @crudx/common for usage.

The transport choice only affects the schema slots fed into CrudPanelView; the component surface itself is transport-neutral.

See the main README for end-to-end live demos.

Core Component

| Name | Link | | --------------------- | --------------------------------------------------- | | CrudPanelView | link | | CrudFilterView | link | | CrudPageHeaderView | link | | CrudTableView | link | | CrudContentView | link | | CrudRowItemActions | link | | CrudContentHeaderView | link |

General Component

| Name | Link | | ---------------- | --------------------------------------------------- | | BreadcrumbView | link | | ButtonDropdown | link | | Dialog | link | | NumberFormatView | link | | RenderFlexView | link | | RenderNodeView | link | | TabView | link | | TooltipView | link |

Table Component

| Name | Link | | --------------------------- | -------------------------------------------------------------- | | Table | link | | TableSelectedBulkOptions | link | | TableSettingsDensityOptions | link | | TableSettingsOptions | link | | TableSettingsSortingOptions | link |