message: Add simple example using a compatibility package
diff: @@ -13,3 +13,25 @@ Official components compatible with several popular style libraries are availabl
  - [MUI](https://mui.com/) ([@react-querybuilder/material](https://www.npmjs.com/package/@react-querybuilder/material))
  You can see each alternate component package in action by selecting different options in the "Style" dropdown list on the [demo page](https://react-querybuilder.js.org/react-querybuilder/).
  +
  +Each compatibility package exports a `*ControlElements` object that can be used as the [`controlElements` prop](./api/querybuilder#controlelements) in `<QueryBuilder />`. Some packages also export a `*ControlClassnames` object for use as the [`controlClassnames` prop](./api/querybuilder#controlclassnames). For example:
  +
  +```tsx
  +import QueryBuilder from 'react-querybuilder';
  +import {
  + bootstrapControlClassnames,
  + bootstrapControlElements,
  +} from '@react-querybuilder/bootstrap';
  +import { defaultQuery, fields } from './constants';
  +
  +export function App() {
  + return (
  + <QueryBuilder
  + fields={fields}
  + defaultQuery={defaultQuery}
  + controlElements={bootstrapControlElements}
  + controlClassnames={bootstrapControlClassnames}
  + />
  + );
  +}
  +```
  