@neo4j-ndl/react 4.25.7 → 5.0.0-alpha.0.3d763f7

package/lib/cjs/menu/stories/menu-custom-items.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-custom-items.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-custom-items.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAoE;AACpE,kDAAiE;AACjE,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,SAAS,EAAC,wBAAwB,EAClC,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,mBAAmB,EAAE,aAE3C,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EACH,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,wCAAqC,GAEpE,EACF,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,iBAAiB,EAAC,SAAS,EAAC,oBAAoB,GAAG,EACpE,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EAAC,iBAAiB,EACvB,SAAS,EAAC,oBAAoB,EAC9B,aAAa,EACX,uBAAC,+BAAuB,IAAC,SAAS,EAAC,oBAAoB,GAAG,GAE5D,EACF,wBAAC,YAAI,IAAC,KAAK,EAAC,cAAc,EAAC,WAAW,EAAC,yBAAyB,aAC9D,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EAAC,iBAAiB,EACvB,SAAS,EAAC,oBAAoB,EAC9B,UAAU,EAAE,IAAI,GAChB,EACF,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,iBAAiB,EAAC,SAAS,EAAC,oBAAoB,GAAG,IAC/D,IACF,EACP,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,sDAGL,IAChB,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Menu, Typography } from '@neo4j-ndl/react';\nimport { Square2StackIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        placement=\"bottom-start-top-start\"\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'custom-items-menu' }}\n      >\n        <Menu.Item\n          title={\n            <Typography variant=\"display\">This can be any element</Typography>\n          }\n        />\n        <Menu.Item title=\"Danger action 1\" className=\"n-text-danger-text\" />\n        <Menu.Item\n          title=\"Danger action 2\"\n          className=\"n-text-danger-text\"\n          leadingVisual={\n            <Square2StackIconOutline className=\"n-text-danger-icon\" />\n          }\n        />\n        <Menu title=\"More actions\" description=\"Some additional actions\">\n          <Menu.Item\n            title=\"Danger action 3\"\n            className=\"n-text-danger-text\"\n            isDisabled={true}\n          />\n          <Menu.Item title=\"Danger action 4\" className=\"n-text-danger-text\" />\n        </Menu>\n      </Menu>\n      <DropdownButton\n        isOpen={isOpen}\n        onClick={() => setIsOpen(true)}\n        ref={anchorEl}\n        aria-haspopup=\"menu\"\n      >\n        Open Menu (set with custom placement)\n      </DropdownButton>\n    </>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"menu-custom-items.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-custom-items.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAoE;AACpE,kDAAiE;AACjE,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,SAAS,EAAC,wBAAwB,EAClC,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,mBAAmB,EAAE,aAE3C,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EACH,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,wCAAqC,GAEpE,EACF,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,iBAAiB,EAAC,SAAS,EAAC,kBAAkB,GAAG,EAClE,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EAAC,iBAAiB,EACvB,SAAS,EAAC,kBAAkB,EAC5B,aAAa,EACX,uBAAC,+BAAuB,IAAC,SAAS,EAAC,kBAAkB,GAAG,GAE1D,EACF,wBAAC,YAAI,IAAC,KAAK,EAAC,cAAc,EAAC,WAAW,EAAC,yBAAyB,aAC9D,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EAAC,iBAAiB,EACvB,SAAS,EAAC,kBAAkB,EAC5B,UAAU,EAAE,IAAI,GAChB,EACF,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,iBAAiB,EAAC,SAAS,EAAC,kBAAkB,GAAG,IAC7D,IACF,EACP,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,sDAGL,IAChB,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Menu, Typography } from '@neo4j-ndl/react';\nimport { Square2StackIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        placement=\"bottom-start-top-start\"\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'custom-items-menu' }}\n      >\n        <Menu.Item\n          title={\n            <Typography variant=\"display\">This can be any element</Typography>\n          }\n        />\n        <Menu.Item title=\"Danger action 1\" className=\"text-danger-text\" />\n        <Menu.Item\n          title=\"Danger action 2\"\n          className=\"text-danger-text\"\n          leadingVisual={\n            <Square2StackIconOutline className=\"text-danger-icon\" />\n          }\n        />\n        <Menu title=\"More actions\" description=\"Some additional actions\">\n          <Menu.Item\n            title=\"Danger action 3\"\n            className=\"text-danger-text\"\n            isDisabled={true}\n          />\n          <Menu.Item title=\"Danger action 4\" className=\"text-danger-text\" />\n        </Menu>\n      </Menu>\n      <DropdownButton\n        isOpen={isOpen}\n        onClick={() => setIsOpen(true)}\n        ref={anchorEl}\n        aria-haspopup=\"menu\"\n      >\n        Open Menu (set with custom placement)\n      </DropdownButton>\n    </>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/menu/stories/menu-in-dialog.story.js

@@ -32,9 +32,9 @@ const Component = () => {
     const handleClick = () => setIsModalOpen((prev) => !prev);
     const handleClose = () => setIsModalOpen(false);
     const handleMenuClick = () => setIsOpen((prev) => !prev);
-    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "n-flex n-justify-center", children: (0, jsx_runtime_1.jsx)(react_1.FilledButton, { onClick: handleClick, children: "Open Dialog" }) }), (0, jsx_runtime_1.jsxs)(react_1.Dialog, { htmlAttributes: { id: 'modal-root' }, isOpen: isModalOpen, onClose: handleClose, children: [(0, jsx_runtime_1.jsx)(react_1.Dialog.Header, { children: "Menu in Dialog" }), (0, jsx_runtime_1.jsxs)(react_1.Dialog.Content, { children: [(0, jsx_runtime_1.jsx)("div", { className: "n-flex n-justify-center", children: (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: handleMenuClick, ref: anchorEl, "aria-haspopup": "menu", children: "Open Menu" }) }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { isOpen: isOpen, anchorRef: anchorEl, onClose: (_event, _data) => {
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "flex justify-center", children: (0, jsx_runtime_1.jsx)(react_1.FilledButton, { onClick: handleClick, children: "Open Dialog" }) }), (0, jsx_runtime_1.jsxs)(react_1.Dialog, { htmlAttributes: { id: 'modal-root' }, isOpen: isModalOpen, onClose: handleClose, children: [(0, jsx_runtime_1.jsx)(react_1.Dialog.Header, { children: "Menu in Dialog" }), (0, jsx_runtime_1.jsxs)(react_1.Dialog.Content, { children: [(0, jsx_runtime_1.jsx)("div", { className: "flex justify-center", children: (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: handleMenuClick, ref: anchorEl, "aria-haspopup": "menu", children: "Open Menu" }) }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { isOpen: isOpen, anchorRef: anchorEl, onClose: (_event, _data) => {
                                     setIsOpen(false);
-                                }, portalTarget: document.getElementById('modal-root'), htmlAttributes: { id: 'dialog-menu' }, children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Undo", onClick: () => alert('Undo') }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Redo", isDisabled: true }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Cut", description: "Copy and remove" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Copy as", description: "Copying as something", icon: (0, jsx_runtime_1.jsx)(icons_1.Square2StackIconOutline, {}), children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Text" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Video" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Image", children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".png" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".jpg" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".svg" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".gif" })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Audio" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Share", children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Mail" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Instagram" })] })] })] })] })] })] }));
+                                }, portalTarget: document.getElementById('modal-root'), htmlAttributes: { id: 'dialog-menu' }, children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Undo", onClick: () => alert('Undo') }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Redo", isDisabled: true }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Cut", description: "Copy and remove" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Copy as", description: "Copying as something", leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.Square2StackIconOutline, {}), children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Text" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Video" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Image", children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".png" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".jpg" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".svg" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".gif" })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Audio" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Share", children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Mail" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Instagram" })] })] })] })] })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=menu-in-dialog.story.js.map

package/lib/cjs/menu/stories/menu-in-dialog.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-in-dialog.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-in-dialog.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Dialog, DropdownButton, FilledButton, Menu } from '@neo4j-ndl/react';\nimport { Square2StackIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [isModalOpen, setIsModalOpen] = useState(false);\n\n  const handleClick = () => setIsModalOpen((prev) => !prev);\n  const handleClose = () => setIsModalOpen(false);\n  const handleMenuClick = () => setIsOpen((prev) => !prev);\n\n  return (\n    <>\n      <div className=\"n-flex n-justify-center\">\n        <FilledButton onClick={handleClick}>Open Dialog</FilledButton>\n      </div>\n      <Dialog\n        htmlAttributes={{ id: 'modal-root' }}\n        isOpen={isModalOpen}\n        onClose={handleClose}\n      >\n        <Dialog.Header>Menu in Dialog</Dialog.Header>\n        <Dialog.Content>\n          <div className=\"n-flex n-justify-center\">\n            <DropdownButton\n              isOpen={isOpen}\n              onClick={handleMenuClick}\n              ref={anchorEl}\n              aria-haspopup=\"menu\"\n            >\n              Open Menu\n            </DropdownButton>\n          </div>\n          <Menu\n            isOpen={isOpen}\n            anchorRef={anchorEl}\n            onClose={(_event, _data) => {\n              setIsOpen(false);\n            }}\n            portalTarget={document.getElementById('modal-root')}\n            htmlAttributes={{ id: 'dialog-menu' }}\n          >\n            <Menu.Item title=\"Undo\" onClick={() => alert('Undo')} />\n            <Menu.Item title=\"Redo\" isDisabled />\n            <Menu.Item title=\"Cut\" description=\"Copy and remove\" />\n            <Menu\n              title=\"Copy as\"\n              description=\"Copying as something\"\n              icon={<Square2StackIconOutline />}\n            >\n              <Menu.Item title=\"Text\" />\n              <Menu.Item title=\"Video\" />\n              <Menu title=\"Image\">\n                <Menu.Item title=\".png\" />\n                <Menu.Item title=\".jpg\" />\n                <Menu.Item title=\".svg\" />\n                <Menu.Item title=\".gif\" />\n              </Menu>\n              <Menu.Item title=\"Audio\" />\n              <Menu title=\"Share\">\n                <Menu.Item title=\"Mail\" />\n                <Menu.Item title=\"Instagram\" />\n              </Menu>\n            </Menu>\n          </Menu>\n        </Dialog.Content>\n      </Dialog>\n    </>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"menu-in-dialog.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-in-dialog.story.tsx"],"names":[],"mappings":"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","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Dialog, DropdownButton, FilledButton, Menu } from '@neo4j-ndl/react';\nimport { Square2StackIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [isModalOpen, setIsModalOpen] = useState(false);\n\n  const handleClick = () => setIsModalOpen((prev) => !prev);\n  const handleClose = () => setIsModalOpen(false);\n  const handleMenuClick = () => setIsOpen((prev) => !prev);\n\n  return (\n    <>\n      <div className=\"flex justify-center\">\n        <FilledButton onClick={handleClick}>Open Dialog</FilledButton>\n      </div>\n      <Dialog\n        htmlAttributes={{ id: 'modal-root' }}\n        isOpen={isModalOpen}\n        onClose={handleClose}\n      >\n        <Dialog.Header>Menu in Dialog</Dialog.Header>\n        <Dialog.Content>\n          <div className=\"flex justify-center\">\n            <DropdownButton\n              isOpen={isOpen}\n              onClick={handleMenuClick}\n              ref={anchorEl}\n              aria-haspopup=\"menu\"\n            >\n              Open Menu\n            </DropdownButton>\n          </div>\n          <Menu\n            isOpen={isOpen}\n            anchorRef={anchorEl}\n            onClose={(_event, _data) => {\n              setIsOpen(false);\n            }}\n            portalTarget={document.getElementById('modal-root')}\n            htmlAttributes={{ id: 'dialog-menu' }}\n          >\n            <Menu.Item title=\"Undo\" onClick={() => alert('Undo')} />\n            <Menu.Item title=\"Redo\" isDisabled />\n            <Menu.Item title=\"Cut\" description=\"Copy and remove\" />\n            <Menu\n              title=\"Copy as\"\n              description=\"Copying as something\"\n              leadingVisual={<Square2StackIconOutline />}\n            >\n              <Menu.Item title=\"Text\" />\n              <Menu.Item title=\"Video\" />\n              <Menu title=\"Image\">\n                <Menu.Item title=\".png\" />\n                <Menu.Item title=\".jpg\" />\n                <Menu.Item title=\".svg\" />\n                <Menu.Item title=\".gif\" />\n              </Menu>\n              <Menu.Item title=\"Audio\" />\n              <Menu title=\"Share\">\n                <Menu.Item title=\"Mail\" />\n                <Menu.Item title=\"Instagram\" />\n              </Menu>\n            </Menu>\n          </Menu>\n        </Dialog.Content>\n      </Dialog>\n    </>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/menu/stories/menu-nested.story.js

@@ -30,7 +30,7 @@ const Component = () => {
     const [isOpen, setIsOpen] = (0, react_2.useState)(false);
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(react_1.Menu, { isOpen: isOpen, anchorRef: anchorEl, onClose: (_event, _data) => {
                     setIsOpen(false);
-                }, htmlAttributes: { id: 'nested-menu' }, children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Undo", onClick: () => alert('Undo') }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Redo", isDisabled: true }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Cut", description: "Copy and remove" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Copy as", description: "Copying as something", icon: (0, jsx_runtime_1.jsx)(icons_1.Square2StackIconOutline, {}), children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Text" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Video" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Image", children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".png" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".jpg" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".svg" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".gif" })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Audio" })] }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Share", children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Mail" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Instagram" })] })] }), (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: () => setIsOpen(true), ref: anchorEl, "aria-haspopup": "menu", children: "Open Menu" })] }));
+                }, htmlAttributes: { id: 'nested-menu' }, children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Undo", onClick: () => alert('Undo') }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Redo", isDisabled: true }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Cut", description: "Copy and remove" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Copy as", description: "Copying as something", leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.Square2StackIconOutline, {}), children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Text" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Video" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Image", children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".png" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".jpg" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".svg" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".gif" })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Audio" })] }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Share", children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Mail" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Instagram" })] })] }), (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: () => setIsOpen(true), ref: anchorEl, "aria-haspopup": "menu", children: "Open Menu" })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=menu-nested.story.js.map

package/lib/cjs/menu/stories/menu-nested.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-nested.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-nested.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAwD;AACxD,kDAAiE;AACjE,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,aAAa,EAAE,aAErC,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,GAAI,EACxD,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,EAAC,UAAU,SAAG,EACrC,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,KAAK,EAAC,WAAW,EAAC,iBAAiB,GAAG,EACvD,wBAAC,YAAI,IACH,KAAK,EAAC,SAAS,EACf,WAAW,EAAC,sBAAsB,EAClC,IAAI,EAAE,uBAAC,+BAAuB,KAAG,aAEjC,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,GAAG,EAC3B,wBAAC,YAAI,IAAC,KAAK,EAAC,OAAO,aACjB,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,IACrB,EACP,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,GAAG,IACtB,EACP,wBAAC,YAAI,IAAC,KAAK,EAAC,OAAO,aACjB,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,WAAW,GAAG,IAC1B,IACF,EACP,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,0BAGL,IAChB,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Menu } from '@neo4j-ndl/react';\nimport { Square2StackIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'nested-menu' }}\n      >\n        <Menu.Item title=\"Undo\" onClick={() => alert('Undo')} />\n        <Menu.Item title=\"Redo\" isDisabled />\n        <Menu.Item title=\"Cut\" description=\"Copy and remove\" />\n        <Menu\n          title=\"Copy as\"\n          description=\"Copying as something\"\n          icon={<Square2StackIconOutline />}\n        >\n          <Menu.Item title=\"Text\" />\n          <Menu.Item title=\"Video\" />\n          <Menu title=\"Image\">\n            <Menu.Item title=\".png\" />\n            <Menu.Item title=\".jpg\" />\n            <Menu.Item title=\".svg\" />\n            <Menu.Item title=\".gif\" />\n          </Menu>\n          <Menu.Item title=\"Audio\" />\n        </Menu>\n        <Menu title=\"Share\">\n          <Menu.Item title=\"Mail\" />\n          <Menu.Item title=\"Instagram\" />\n        </Menu>\n      </Menu>\n      <DropdownButton\n        isOpen={isOpen}\n        onClick={() => setIsOpen(true)}\n        ref={anchorEl}\n        aria-haspopup=\"menu\"\n      >\n        Open Menu\n      </DropdownButton>\n    </>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"menu-nested.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-nested.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAwD;AACxD,kDAAiE;AACjE,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,aAAa,EAAE,aAErC,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC,GAAI,EACxD,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,EAAC,UAAU,SAAG,EACrC,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,KAAK,EAAC,WAAW,EAAC,iBAAiB,GAAG,EACvD,wBAAC,YAAI,IACH,KAAK,EAAC,SAAS,EACf,WAAW,EAAC,sBAAsB,EAClC,aAAa,EAAE,uBAAC,+BAAuB,KAAG,aAE1C,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,GAAG,EAC3B,wBAAC,YAAI,IAAC,KAAK,EAAC,OAAO,aACjB,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,IACrB,EACP,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,GAAG,IACtB,EACP,wBAAC,YAAI,IAAC,KAAK,EAAC,OAAO,aACjB,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,WAAW,GAAG,IAC1B,IACF,EACP,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,0BAGL,IAChB,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Menu } from '@neo4j-ndl/react';\nimport { Square2StackIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'nested-menu' }}\n      >\n        <Menu.Item title=\"Undo\" onClick={() => alert('Undo')} />\n        <Menu.Item title=\"Redo\" isDisabled />\n        <Menu.Item title=\"Cut\" description=\"Copy and remove\" />\n        <Menu\n          title=\"Copy as\"\n          description=\"Copying as something\"\n          leadingVisual={<Square2StackIconOutline />}\n        >\n          <Menu.Item title=\"Text\" />\n          <Menu.Item title=\"Video\" />\n          <Menu title=\"Image\">\n            <Menu.Item title=\".png\" />\n            <Menu.Item title=\".jpg\" />\n            <Menu.Item title=\".svg\" />\n            <Menu.Item title=\".gif\" />\n          </Menu>\n          <Menu.Item title=\"Audio\" />\n        </Menu>\n        <Menu title=\"Share\">\n          <Menu.Item title=\"Mail\" />\n          <Menu.Item title=\"Instagram\" />\n        </Menu>\n      </Menu>\n      <DropdownButton\n        isOpen={isOpen}\n        onClick={() => setIsOpen(true)}\n        ref={anchorEl}\n        aria-haspopup=\"menu\"\n      >\n        Open Menu\n      </DropdownButton>\n    </>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/menu/stories/menu-radio-and-normal.story.js

@@ -38,7 +38,7 @@ const Component = () => {
                                     alert('Action 1');
                                 } }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Action 2", onClick: () => {
                                     alert('Action 2');
-                                } })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-4 n-items-center", children: [(0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-medium", children: ["Selected option: ", (0, jsx_runtime_1.jsx)("strong", { children: selectedOption })] }), (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: () => setIsOpen(true), ref: anchorEl, "aria-haspopup": "menu", children: "Open menu" })] })] }));
+                                } })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-token-4 items-center", children: [(0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-medium", children: ["Selected option: ", (0, jsx_runtime_1.jsx)("strong", { children: selectedOption })] }), (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: () => setIsOpen(true), ref: anchorEl, "aria-haspopup": "menu", children: "Open menu" })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=menu-radio-and-normal.story.js.map

package/lib/cjs/menu/stories/menu-radio-and-normal.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-radio-and-normal.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-radio-and-normal.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAoE;AACpE,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAClD,UAAU,CACX,CAAC;IAEF,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,uBAAuB,EAAE,aAE/C,wBAAC,YAAI,CAAC,KAAK,eACT,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;oCACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;gCAChC,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;oCACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;gCAChC,CAAC,GACD,IACS,EACb,uBAAC,YAAI,CAAC,OAAO,KAAG,EAChB,wBAAC,YAAI,CAAC,KAAK,eACT,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE;oCACZ,KAAK,CAAC,UAAU,CAAC,CAAC;gCACpB,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE;oCACZ,KAAK,CAAC,UAAU,CAAC,CAAC;gCACpB,CAAC,GACD,IACS,IACR,EACP,iCAAK,SAAS,EAAC,gDAAgD,aAC7D,wBAAC,kBAAU,IAAC,OAAO,EAAC,aAAa,kCACd,6CAAS,cAAc,GAAU,IACvC,EACb,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,0BAGL,IACb,IACL,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Menu, Typography } from '@neo4j-ndl/react';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [selectedOption, setSelectedOption] = useState<string | null>(\n    'option-1',\n  );\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'radio-and-normal-menu' }}\n      >\n        <Menu.Group>\n          <Menu.RadioItem\n            title=\"Option 1\"\n            isChecked={selectedOption === 'option-1'}\n            onClick={() => {\n              setSelectedOption('option-1');\n            }}\n          />\n          <Menu.RadioItem\n            title=\"Option 2\"\n            isChecked={selectedOption === 'option-2'}\n            onClick={() => {\n              setSelectedOption('option-2');\n            }}\n          />\n        </Menu.Group>\n        <Menu.Divider />\n        <Menu.Group>\n          <Menu.Item\n            title=\"Action 1\"\n            onClick={() => {\n              alert('Action 1');\n            }}\n          />\n          <Menu.Item\n            title=\"Action 2\"\n            onClick={() => {\n              alert('Action 2');\n            }}\n          />\n        </Menu.Group>\n      </Menu>\n      <div className=\"n-flex n-flex-col n-gap-token-4 n-items-center\">\n        <Typography variant=\"body-medium\">\n          Selected option: <strong>{selectedOption}</strong>\n        </Typography>\n        <DropdownButton\n          isOpen={isOpen}\n          onClick={() => setIsOpen(true)}\n          ref={anchorEl}\n          aria-haspopup=\"menu\"\n        >\n          Open menu\n        </DropdownButton>\n      </div>\n    </>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"menu-radio-and-normal.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-radio-and-normal.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAoE;AACpE,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAClD,UAAU,CACX,CAAC;IAEF,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,uBAAuB,EAAE,aAE/C,wBAAC,YAAI,CAAC,KAAK,eACT,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;oCACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;gCAChC,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;oCACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;gCAChC,CAAC,GACD,IACS,EACb,uBAAC,YAAI,CAAC,OAAO,KAAG,EAChB,wBAAC,YAAI,CAAC,KAAK,eACT,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE;oCACZ,KAAK,CAAC,UAAU,CAAC,CAAC;gCACpB,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,IAAI,IACR,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE;oCACZ,KAAK,CAAC,UAAU,CAAC,CAAC;gCACpB,CAAC,GACD,IACS,IACR,EACP,iCAAK,SAAS,EAAC,wCAAwC,aACrD,wBAAC,kBAAU,IAAC,OAAO,EAAC,aAAa,kCACd,6CAAS,cAAc,GAAU,IACvC,EACb,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,0BAGL,IACb,IACL,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Menu, Typography } from '@neo4j-ndl/react';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [selectedOption, setSelectedOption] = useState<string | null>(\n    'option-1',\n  );\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'radio-and-normal-menu' }}\n      >\n        <Menu.Group>\n          <Menu.RadioItem\n            title=\"Option 1\"\n            isChecked={selectedOption === 'option-1'}\n            onClick={() => {\n              setSelectedOption('option-1');\n            }}\n          />\n          <Menu.RadioItem\n            title=\"Option 2\"\n            isChecked={selectedOption === 'option-2'}\n            onClick={() => {\n              setSelectedOption('option-2');\n            }}\n          />\n        </Menu.Group>\n        <Menu.Divider />\n        <Menu.Group>\n          <Menu.Item\n            title=\"Action 1\"\n            onClick={() => {\n              alert('Action 1');\n            }}\n          />\n          <Menu.Item\n            title=\"Action 2\"\n            onClick={() => {\n              alert('Action 2');\n            }}\n          />\n        </Menu.Group>\n      </Menu>\n      <div className=\"flex flex-col gap-token-4 items-center\">\n        <Typography variant=\"body-medium\">\n          Selected option: <strong>{selectedOption}</strong>\n        </Typography>\n        <DropdownButton\n          isOpen={isOpen}\n          onClick={() => setIsOpen(true)}\n          ref={anchorEl}\n          aria-haspopup=\"menu\"\n        >\n          Open menu\n        </DropdownButton>\n      </div>\n    </>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/menu/stories/menu-radio-items.story.js

@@ -39,7 +39,7 @@ const Component = () => {
                             setSelectedOption('option-3');
                         } }), (0, jsx_runtime_1.jsx)(react_1.Menu.RadioItem, { title: "Option 4", trailingContent: (0, jsx_runtime_1.jsx)(react_1.Kbd, { keys: ['A'] }), isChecked: selectedOption === 'option-4', onClick: () => {
                             setSelectedOption('option-4');
-                        } })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-4 n-items-center", children: [(0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-medium", children: ["Selected option: ", (0, jsx_runtime_1.jsx)("strong", { children: selectedOption })] }), (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: () => setIsOpen(true), ref: anchorEl, "aria-haspopup": "menu", children: "Open menu" })] })] }));
+                        } })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-token-4 items-center", children: [(0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-medium", children: ["Selected option: ", (0, jsx_runtime_1.jsx)("strong", { children: selectedOption })] }), (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: () => setIsOpen(true), ref: anchorEl, "aria-haspopup": "menu", children: "Open menu" })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=menu-radio-items.story.js.map

package/lib/cjs/menu/stories/menu-radio-items.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-radio-items.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-radio-items.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAyE;AACzE,kDAAyE;AACzE,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAClD,UAAU,CACX,CAAC;IAEF,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,kBAAkB,EAAE,aAE1C,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,aAAa,EAAE,uBAAC,sBAAc,KAAG,EACjC,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;wBAChC,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;wBAChC,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,4BAA4B,EACxC,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;wBAChC,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,eAAe,EAAE,uBAAC,WAAG,IAAC,IAAI,EAAE,CAAC,GAAG,CAAC,GAAI,EACrC,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;wBAChC,CAAC,GACD,IACG,EACP,iCAAK,SAAS,EAAC,gDAAgD,aAC7D,wBAAC,kBAAU,IAAC,OAAO,EAAC,aAAa,kCACd,6CAAS,cAAc,GAAU,IACvC,EACb,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,0BAGL,IACb,IACL,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Kbd, Menu, Typography } from '@neo4j-ndl/react';\nimport { MoonIconOutline, SunIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [selectedOption, setSelectedOption] = useState<string | null>(\n    'option-1',\n  );\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'radio-items-menu' }}\n      >\n        <Menu.RadioItem\n          title=\"Option 1\"\n          leadingVisual={<SunIconOutline />}\n          isChecked={selectedOption === 'option-1'}\n          onClick={() => {\n            setSelectedOption('option-1');\n          }}\n        />\n        <Menu.RadioItem\n          title=\"Option 2\"\n          leadingVisual={<MoonIconOutline />}\n          isChecked={selectedOption === 'option-2'}\n          onClick={() => {\n            setSelectedOption('option-2');\n          }}\n        />\n        <Menu.RadioItem\n          title=\"Option 3\"\n          description=\"Option 3 has a description\"\n          isChecked={selectedOption === 'option-3'}\n          onClick={() => {\n            setSelectedOption('option-3');\n          }}\n        />\n        <Menu.RadioItem\n          title=\"Option 4\"\n          trailingContent={<Kbd keys={['A']} />}\n          isChecked={selectedOption === 'option-4'}\n          onClick={() => {\n            setSelectedOption('option-4');\n          }}\n        />\n      </Menu>\n      <div className=\"n-flex n-flex-col n-gap-token-4 n-items-center\">\n        <Typography variant=\"body-medium\">\n          Selected option: <strong>{selectedOption}</strong>\n        </Typography>\n        <DropdownButton\n          isOpen={isOpen}\n          onClick={() => setIsOpen(true)}\n          ref={anchorEl}\n          aria-haspopup=\"menu\"\n        >\n          Open menu\n        </DropdownButton>\n      </div>\n    </>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"menu-radio-items.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-radio-items.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAyE;AACzE,kDAAyE;AACzE,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAClD,UAAU,CACX,CAAC;IAEF,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,kBAAkB,EAAE,aAE1C,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,aAAa,EAAE,uBAAC,sBAAc,KAAG,EACjC,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;wBAChC,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;wBAChC,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,4BAA4B,EACxC,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;wBAChC,CAAC,GACD,EACF,uBAAC,YAAI,CAAC,SAAS,IACb,KAAK,EAAC,UAAU,EAChB,eAAe,EAAE,uBAAC,WAAG,IAAC,IAAI,EAAE,CAAC,GAAG,CAAC,GAAI,EACrC,SAAS,EAAE,cAAc,KAAK,UAAU,EACxC,OAAO,EAAE,GAAG,EAAE;4BACZ,iBAAiB,CAAC,UAAU,CAAC,CAAC;wBAChC,CAAC,GACD,IACG,EACP,iCAAK,SAAS,EAAC,wCAAwC,aACrD,wBAAC,kBAAU,IAAC,OAAO,EAAC,aAAa,kCACd,6CAAS,cAAc,GAAU,IACvC,EACb,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,0BAGL,IACb,IACL,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Kbd, Menu, Typography } from '@neo4j-ndl/react';\nimport { MoonIconOutline, SunIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n  const [selectedOption, setSelectedOption] = useState<string | null>(\n    'option-1',\n  );\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'radio-items-menu' }}\n      >\n        <Menu.RadioItem\n          title=\"Option 1\"\n          leadingVisual={<SunIconOutline />}\n          isChecked={selectedOption === 'option-1'}\n          onClick={() => {\n            setSelectedOption('option-1');\n          }}\n        />\n        <Menu.RadioItem\n          title=\"Option 2\"\n          leadingVisual={<MoonIconOutline />}\n          isChecked={selectedOption === 'option-2'}\n          onClick={() => {\n            setSelectedOption('option-2');\n          }}\n        />\n        <Menu.RadioItem\n          title=\"Option 3\"\n          description=\"Option 3 has a description\"\n          isChecked={selectedOption === 'option-3'}\n          onClick={() => {\n            setSelectedOption('option-3');\n          }}\n        />\n        <Menu.RadioItem\n          title=\"Option 4\"\n          trailingContent={<Kbd keys={['A']} />}\n          isChecked={selectedOption === 'option-4'}\n          onClick={() => {\n            setSelectedOption('option-4');\n          }}\n        />\n      </Menu>\n      <div className=\"flex flex-col gap-token-4 items-center\">\n        <Typography variant=\"body-medium\">\n          Selected option: <strong>{selectedOption}</strong>\n        </Typography>\n        <DropdownButton\n          isOpen={isOpen}\n          onClick={() => setIsOpen(true)}\n          ref={anchorEl}\n          aria-haspopup=\"menu\"\n        >\n          Open menu\n        </DropdownButton>\n      </div>\n    </>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/menu/stories/menu-with-icon.story.js

@@ -30,7 +30,7 @@ const Component = () => {
     const [isOpen, setIsOpen] = (0, react_2.useState)(false);
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(react_1.Menu, { isOpen: isOpen, anchorRef: anchorEl, onClose: (_event, _data) => {
                     setIsOpen(false);
-                }, htmlAttributes: { id: 'icon-menu' }, children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), title: "Action 1", onClick: () => alert('Action1') }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), title: "Action 2", onClick: () => alert('Action2') }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), title: "Action 3", description: "Action 3 is disabled", isDisabled: true, onClick: () => alert('Action3') }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Action 3.1", description: "Action with sub menu", icon: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Text" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Video" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Image", icon: (0, jsx_runtime_1.jsx)(icons_1.PhotoIconOutline, {}), children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".png" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".jpg" })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Audio" })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), title: "Action 4", description: "Action 4 is awesome", onClick: () => alert('Action4') })] }), (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: () => setIsOpen(true), ref: anchorEl, "aria-haspopup": "menu", children: "Open Menu" })] }));
+                }, htmlAttributes: { id: 'icon-menu' }, children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), title: "Action 1", onClick: () => alert('Action1') }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), title: "Action 2", onClick: () => alert('Action2') }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), title: "Action 3", description: "Action 3 is disabled", isDisabled: true, onClick: () => alert('Action3') }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Action 3.1", description: "Action with sub menu", leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Text" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Video" }), (0, jsx_runtime_1.jsxs)(react_1.Menu, { title: "Image", leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PhotoIconOutline, {}), children: [(0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".png" }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: ".jpg" })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { title: "Audio" })] }), (0, jsx_runtime_1.jsx)(react_1.Menu.Item, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PlusIconOutline, {}), title: "Action 4", description: "Action 4 is awesome", onClick: () => alert('Action4') })] }), (0, jsx_runtime_1.jsx)(react_1.DropdownButton, { isOpen: isOpen, onClick: () => setIsOpen(true), ref: anchorEl, "aria-haspopup": "menu", children: "Open Menu" })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=menu-with-icon.story.js.map

package/lib/cjs/menu/stories/menu-with-icon.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"menu-with-icon.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-with-icon.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAwD;AACxD,kDAA2E;AAC3E,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,WAAW,EAAE,aAEnC,uBAAC,YAAI,CAAC,IAAI,IACR,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAC/B,EACF,uBAAC,YAAI,CAAC,IAAI,IACR,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAC/B,EACF,uBAAC,YAAI,CAAC,IAAI,IACR,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,sBAAsB,EAClC,UAAU,EAAE,IAAI,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAC/B,EACF,wBAAC,YAAI,IACH,KAAK,EAAC,YAAY,EAClB,WAAW,EAAC,sBAAsB,EAClC,IAAI,EAAE,uBAAC,uBAAe,KAAG,aAEzB,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,GAAG,EAC3B,wBAAC,YAAI,IAAC,KAAK,EAAC,OAAO,EAAC,IAAI,EAAE,uBAAC,wBAAgB,KAAG,aAC5C,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,IACrB,EACP,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,GAAG,IACtB,EACP,uBAAC,YAAI,CAAC,IAAI,IACR,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,qBAAqB,EACjC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAC/B,IACG,EACP,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,0BAGL,IAChB,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Menu } from '@neo4j-ndl/react';\nimport { PhotoIconOutline, PlusIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'icon-menu' }}\n      >\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 1\"\n          onClick={() => alert('Action1')}\n        />\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 2\"\n          onClick={() => alert('Action2')}\n        />\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 3\"\n          description=\"Action 3 is disabled\"\n          isDisabled={true}\n          onClick={() => alert('Action3')}\n        />\n        <Menu\n          title=\"Action 3.1\"\n          description=\"Action with sub menu\"\n          icon={<PlusIconOutline />}\n        >\n          <Menu.Item title=\"Text\" />\n          <Menu.Item title=\"Video\" />\n          <Menu title=\"Image\" icon={<PhotoIconOutline />}>\n            <Menu.Item title=\".png\" />\n            <Menu.Item title=\".jpg\" />\n          </Menu>\n          <Menu.Item title=\"Audio\" />\n        </Menu>\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 4\"\n          description=\"Action 4 is awesome\"\n          onClick={() => alert('Action4')}\n        />\n      </Menu>\n      <DropdownButton\n        isOpen={isOpen}\n        onClick={() => setIsOpen(true)}\n        ref={anchorEl}\n        aria-haspopup=\"menu\"\n      >\n        Open Menu\n      </DropdownButton>\n    </>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"menu-with-icon.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-with-icon.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAwD;AACxD,kDAA2E;AAC3E,iCAAyC;AAEzC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,QAAQ,GAAG,IAAA,cAAM,EAA2B,IAAI,CAAC,CAAC;IACxD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE5C,OAAO,CACL,6DACE,wBAAC,YAAI,IACH,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,QAAQ,EACnB,OAAO,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;oBACzB,SAAS,CAAC,KAAK,CAAC,CAAC;gBACnB,CAAC,EACD,cAAc,EAAE,EAAE,EAAE,EAAE,WAAW,EAAE,aAEnC,uBAAC,YAAI,CAAC,IAAI,IACR,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAC/B,EACF,uBAAC,YAAI,CAAC,IAAI,IACR,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,KAAK,EAAC,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAC/B,EACF,uBAAC,YAAI,CAAC,IAAI,IACR,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,sBAAsB,EAClC,UAAU,EAAE,IAAI,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAC/B,EACF,wBAAC,YAAI,IACH,KAAK,EAAC,YAAY,EAClB,WAAW,EAAC,sBAAsB,EAClC,aAAa,EAAE,uBAAC,uBAAe,KAAG,aAElC,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,GAAG,EAC3B,wBAAC,YAAI,IAAC,KAAK,EAAC,OAAO,EAAC,aAAa,EAAE,uBAAC,wBAAgB,KAAG,aACrD,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,EAC1B,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,MAAM,GAAG,IACrB,EACP,uBAAC,YAAI,CAAC,IAAI,IAAC,KAAK,EAAC,OAAO,GAAG,IACtB,EACP,uBAAC,YAAI,CAAC,IAAI,IACR,aAAa,EAAE,uBAAC,uBAAe,KAAG,EAClC,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,qBAAqB,EACjC,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAC/B,IACG,EACP,uBAAC,sBAAc,IACb,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,0BAGL,IAChB,CACJ,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["/*!\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { DropdownButton, Menu } from '@neo4j-ndl/react';\nimport { PhotoIconOutline, PlusIconOutline } from '@neo4j-ndl/react/icons';\nimport { useRef, useState } from 'react';\n\nconst Component = () => {\n  const anchorEl = useRef<HTMLButtonElement | null>(null);\n  const [isOpen, setIsOpen] = useState(false);\n\n  return (\n    <>\n      <Menu\n        isOpen={isOpen}\n        anchorRef={anchorEl}\n        onClose={(_event, _data) => {\n          setIsOpen(false);\n        }}\n        htmlAttributes={{ id: 'icon-menu' }}\n      >\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 1\"\n          onClick={() => alert('Action1')}\n        />\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 2\"\n          onClick={() => alert('Action2')}\n        />\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 3\"\n          description=\"Action 3 is disabled\"\n          isDisabled={true}\n          onClick={() => alert('Action3')}\n        />\n        <Menu\n          title=\"Action 3.1\"\n          description=\"Action with sub menu\"\n          leadingVisual={<PlusIconOutline />}\n        >\n          <Menu.Item title=\"Text\" />\n          <Menu.Item title=\"Video\" />\n          <Menu title=\"Image\" leadingVisual={<PhotoIconOutline />}>\n            <Menu.Item title=\".png\" />\n            <Menu.Item title=\".jpg\" />\n          </Menu>\n          <Menu.Item title=\"Audio\" />\n        </Menu>\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 4\"\n          description=\"Action 4 is awesome\"\n          onClick={() => alert('Action4')}\n        />\n      </Menu>\n      <DropdownButton\n        isOpen={isOpen}\n        onClick={() => setIsOpen(true)}\n        ref={anchorEl}\n        aria-haspopup=\"menu\"\n      >\n        Open Menu\n      </DropdownButton>\n    </>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/next/tree-view/TreeView.js

@@ -561,7 +561,7 @@ const Root = (_a) => {
  * The `title` prop provides the item's label content. Nesting `TreeView.Item`
  * elements as `children` creates a hierarchical tree structure.
  *
- * Supports both controlled (`isExpanded`) and uncontrolled (`defaultExpanded`)
+ * Supports both controlled (`isExpanded`) and uncontrolled (`isDefaultExpanded`)
  * expansion, as well as lazy loading via `hasChildren` + `isLoading`.
  *
  * @example
@@ -578,7 +578,7 @@ const Root = (_a) => {
  */
 const Item = (_a) => {
     var _b;
-    var { actionMenuItems, children, defaultExpanded = false, hasChildren: hasChildrenProp, id: idProp, isDisabled, isExpanded: isExpandedProp, isIndeterminate, isLoading, isSelectable: isSelectableProp, isSelected: isSelectedProp, leadingVisual, title, tooltipContent, tooltipProps, trailingContent, onExpandedChange, onSelectedChange, actionMenuProps, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["actionMenuItems", "children", "defaultExpanded", "hasChildren", "id", "isDisabled", "isExpanded", "isIndeterminate", "isLoading", "isSelectable", "isSelected", "leadingVisual", "title", "tooltipContent", "tooltipProps", "trailingContent", "onExpandedChange", "onSelectedChange", "actionMenuProps", "className", "style", "htmlAttributes", "ref"]);
+    var { actionMenuItems, children, isDefaultExpanded = false, hasChildren: hasChildrenProp, id: idProp, isDisabled, isExpanded: isExpandedProp, isIndeterminate, isLoading, isSelectable: isSelectableProp, isSelected: isSelectedProp, leadingVisual, title, tooltipContent, tooltipProps, trailingContent, onExpandedChange, onSelectedChange, actionMenuProps, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["actionMenuItems", "children", "isDefaultExpanded", "hasChildren", "id", "isDisabled", "isExpanded", "isIndeterminate", "isLoading", "isSelectable", "isSelected", "leadingVisual", "title", "tooltipContent", "tooltipProps", "trailingContent", "onExpandedChange", "onSelectedChange", "actionMenuProps", "className", "style", "htmlAttributes", "ref"]);
     const generatedId = (0, react_2.useId)();
     const itemId = (_b = idProp !== null && idProp !== void 0 ? idProp : htmlAttributes === null || htmlAttributes === void 0 ? void 0 : htmlAttributes.id) !== null && _b !== void 0 ? _b : `ndl-treeitem-${generatedId}`;
     const titleId = `ndl-treeitem-title-${generatedId}`;
@@ -598,7 +598,7 @@ const Item = (_a) => {
     const [isExpanded, setIsExpanded] = (0, use_semi_controlled_state_1.useSemicontrolledState)({
         isControlled: isControlledExpansion,
         onChange: onExpandedChange,
-        state: isExpandedProp !== null && isExpandedProp !== void 0 ? isExpandedProp : defaultExpanded,
+        state: isExpandedProp !== null && isExpandedProp !== void 0 ? isExpandedProp : isDefaultExpanded,
     });
     const hasChildren = hasChildrenProp !== null && hasChildrenProp !== void 0 ? hasChildrenProp : react_2.Children.count(children) > 0;
     const isSelectable = isRootManaged