Packages/Tools
COMET DXP Package Overview
A COMET DXP application, at a minimum, consists of the following packages:
- Admin: The user interface for managing the data and content of your application
- API: Stores the data of your application and provides APIs for Admin, Site, and potentially others
- Site: The frontend that renders the content of your application as a website
Admin
The Admin's user interface is built using MUI, react-final-form, react-router, and the @comet/admin
library, which provides commonly used components and tools for creating forms, UI, and data visualization.
@comet/admin
Documentation and usage examples of the individual components and tools from @comet/admin
and its accompanying packages can be found in our Storybook: Storybook
This is the core package that is used to build your Admin. Together with its accompanying packages @comet/admin-*
, it provides components and tools for creating and managing the Admin's UI, routing, forms, and more.
Components for use in forms generally have an accompanying component, optimized for use with react-final-form, indicated by the component's name being prefixed with "FinalForm".
Navigation and routing are managed by react-router.
@comet/admin-theme
Using the createCometTheme
function, you can create a theme that contains all the default styling for your admin. Custom options and styles can be added the same way as with MUI's createTheme function. The resulting theme can simply be used with MUI's ThemeProvider.
@comet/admin-icons
Provides a set of icon components, based on MUI's SvgIcon component. A complete list of the admin-icons can be found here: Storybook
@comet/admin-rte
Provides a customizable rich-text-editor component to allow advanced formatting of text.
@comet/admin-react-select
Provides a set of select components for use in forms, built with react-final-form.
@comet/admin-date-time
Provides components for selecting date and time or a range or combination of date and time.
@comet/admin-color-picker
Provides a component for selecting colors in forms, built with react-final-form.