Clojars Project npm cljdoc License: MIT
Nested MUI menus for Reagent/ClojureScript and React: a dropdown, a right-click context menu, per-item icons, custom labels and keyboard navigation. A ClojureScript port of mui-nested-menu by steviebuilds.
- No CSS to import. Pointer-events and the caret rotation ship inline.
- MUI v5 to v9. Subpath imports and inline
stylekeep it off any version-specific API. - Clojars and npm. One source builds the Reagent jar and the React package.
io.github.jramosg/reagent-mui-nested-menu {:mvn/version "0.1.0"}[io.github.jramosg/reagent-mui-nested-menu "0.1.0"]npm install reagent-mui-nested-menu
MUI and React are peers (you provide them). MUI v5 and v6 need Emotion; v7 and later make it optional.
{
"peerDependencies": {
"@mui/material": ">=5 <10",
"react": ">=17 <20",
"react-dom": ">=17 <20",
"@emotion/react": ">=11",
"@emotion/styled": ">=11"
}
}The library targets @mui/material (v5+). To use it in a project that only
has @material-ui/core (v4), install an npm alias so @mui/material
resolves to your existing v4 package:
npm install @mui/material@npm:@material-ui/core@^4 --legacy-peer-deps
This creates node_modules/@mui/material pointing at @material-ui/core,
with no duplicate code. Emotion is not required for v4.
(ns my.app (:require [reagent-mui-nested-menu.core :refer [nested-menu]])) [nested-menu {:button-props {:label "Open"} :items [{:label "New file" :callback (fn [_e _item] (prn "new"))} {:label "Export" :items [{:label "PDF" :callback (fn [_e _item] (prn "pdf"))} {:label "JSON" :callback (fn [_e _item] (prn "json"))}]}]}]
No CSS import needed.
The full guide and the API reference live on cljdoc:
- Menus from data: components, item maps, nesting, icons, selection and the context menu.
- React usage: the npm package and JSX examples.
- Styling: class hooks and per-item styles.
Public API: the single namespace reagent-mui-nested-menu.core.
Build, test, publish and demo instructions live in DEVELOPMENT.md.
Port of mui-nested-menu by steviebuilds.
MIT.