@neo4j-ndl/react 4.18.9 → 4.18.11

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,4CAAsD;AACtD,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,oBAAY,IACX,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,mBACL,MAAM,0BAGR,IACd,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 { FilledButton, 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      <FilledButton\n        onClick={() => setIsOpen(true)}\n        ref={anchorEl}\n        aria-haspopup=\"menu\"\n        aria-expanded={isOpen}\n      >\n        Open Menu\n      </FilledButton>\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,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"]}

package/lib/cjs/menu/stories/menu-with-keyboard-shortcuts.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: 'keyboard-shortcuts-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, {}), trailingContent: (0, jsx_runtime_1.jsx)(react_1.Kbd, { keys: ['A', ['B']] }), title: "Action 2", description: "Action 4 has a keyboard shortcut", onClick: () => alert('Action4') })] }), (0, jsx_runtime_1.jsx)(react_1.FilledButton, { onClick: () => setIsOpen(true), ref: anchorEl, "aria-haspopup": "menu", "aria-expanded": isOpen, children: "Open Menu" })] }));
+                }, htmlAttributes: { id: 'keyboard-shortcuts-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, {}), trailingContent: (0, jsx_runtime_1.jsx)(react_1.Kbd, { keys: ['A', ['B']] }), title: "Action 2", description: "Action 4 has a keyboard shortcut", 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-keyboard-shortcuts.story.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"menu-with-keyboard-shortcuts.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-with-keyboard-shortcuts.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA2D;AAC3D,kDAAyD;AACzD,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,yBAAyB,EAAE,aAEjD,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,eAAe,EAAE,uBAAC,WAAG,IAAC,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,CAAC,GAAI,EAC5C,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,kCAAkC,EAC9C,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,GAC/B,IACG,EACP,uBAAC,oBAAY,IACX,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,IAAI,CAAC,EAC9B,GAAG,EAAE,QAAQ,mBACC,MAAM,mBACL,MAAM,0BAGR,IACd,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 { FilledButton, Kbd, Menu } from '@neo4j-ndl/react';\nimport { 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: 'keyboard-shortcuts-menu' }}\n      >\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 1\"\n          onClick={() => alert('Action1')}\n        />\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          trailingContent={<Kbd keys={['A', ['B']]} />}\n          title=\"Action 2\"\n          description=\"Action 4 has a keyboard shortcut\"\n          onClick={() => alert('Action4')}\n        />\n      </Menu>\n      <FilledButton\n        onClick={() => setIsOpen(true)}\n        ref={anchorEl}\n        aria-haspopup=\"menu\"\n        aria-expanded={isOpen}\n      >\n        Open Menu\n      </FilledButton>\n    </>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"menu-with-keyboard-shortcuts.story.js","sourceRoot":"","sources":["../../../../src/menu/stories/menu-with-keyboard-shortcuts.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA6D;AAC7D,kDAAyD;AACzD,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,yBAAyB,EAAE,aAEjD,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,eAAe,EAAE,uBAAC,WAAG,IAAC,IAAI,EAAE,CAAC,GAAG,EAAE,CAAC,GAAG,CAAC,CAAC,GAAI,EAC5C,KAAK,EAAC,UAAU,EAChB,WAAW,EAAC,kCAAkC,EAC9C,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, Kbd, Menu } from '@neo4j-ndl/react';\nimport { 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: 'keyboard-shortcuts-menu' }}\n      >\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          title=\"Action 1\"\n          onClick={() => alert('Action1')}\n        />\n        <Menu.Item\n          leadingVisual={<PlusIconOutline />}\n          trailingContent={<Kbd keys={['A', ['B']]} />}\n          title=\"Action 2\"\n          description=\"Action 4 has a keyboard shortcut\"\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/esm/_common/TruncatedTextWithTooltip.js

@@ -0,0 +1,60 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ *
+ *  Copyright (c) "Neo4j"
+ *  Neo4j Sweden AB [http://neo4j.com]
+ *
+ *  This file is part of Neo4j.
+ *
+ *  Neo4j is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+import classNames from 'classnames';
+import { useEffect, useRef, useState } from 'react';
+import { Tooltip } from '../tooltip';
+const useIsTruncated = (text) => {
+    const ref = useRef(null);
+    const [isTruncated, setIsTruncated] = useState(false);
+    useEffect(() => {
+        const element = ref.current;
+        if (element === null) {
+            return;
+        }
+        // Reads inside the ResizeObserver callback are layout-synced and cheap;
+        // setState with an unchanged boolean does not trigger a re-render.
+        const check = () => setIsTruncated(element.scrollWidth > element.clientWidth);
+        check();
+        const observer = new ResizeObserver(check);
+        observer.observe(element);
+        return () => observer.disconnect();
+    }, [text]);
+    return [ref, isTruncated];
+};
+/**
+ * Internal component that renders single-line truncating text and, only while
+ * the text is actually clipped, shows a tooltip with the full text.
+ *
+ * Accessibility: the text element receives `tabIndex={0}` only while truncated,
+ * so sighted keyboard users can reveal the full text on focus without adding a
+ * dead tab stop otherwise. No button semantics are used since there is no
+ * action to perform. Screen readers always receive the full text from the
+ * element's own content, as CSS truncation is visual-only. The tooltip is
+ * dismissible with Escape and hoverable (WCAG 1.4.13).
+ *
+ * @internal - Not part of the public API.
+ */
+export const TruncatedTextWithTooltip = ({ text, className, tooltipPlacement = 'top-start', }) => {
+    const [textRef, isTruncated] = useIsTruncated(text);
+    return (_jsxs(Tooltip, { type: "simple", placement: tooltipPlacement, isDisabled: !isTruncated, children: [_jsx(Tooltip.Trigger, { hasButtonWrapper: true, children: _jsx("span", Object.assign({ ref: textRef, className: classNames('ndl-truncated-text', className) }, (isTruncated && { tabIndex: 0 }), { children: text })) }), _jsx(Tooltip.Content, { children: text })] }));
+};
+//# sourceMappingURL=TruncatedTextWithTooltip.js.map

package/lib/esm/_common/TruncatedTextWithTooltip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TruncatedTextWithTooltip.js","sourceRoot":"","sources":["../../../src/_common/TruncatedTextWithTooltip.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAkB,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,MAAM,cAAc,GAAG,CACrB,IAAY,EACkC,EAAE;IAChD,MAAM,GAAG,GAAG,MAAM,CAAkB,IAAI,CAAC,CAAC;IAC1C,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEtD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,CAAC;QAC5B,IAAI,OAAO,KAAK,IAAI,EAAE,CAAC;YACrB,OAAO;QACT,CAAC;QAED,wEAAwE;QACxE,mEAAmE;QACnE,MAAM,KAAK,GAAG,GAAG,EAAE,CACjB,cAAc,CAAC,OAAO,CAAC,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC,CAAC;QAE5D,KAAK,EAAE,CAAC;QACR,MAAM,QAAQ,GAAG,IAAI,cAAc,CAAC,KAAK,CAAC,CAAC;QAC3C,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;QAC1B,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;IACrC,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,OAAO,CAAC,GAAG,EAAE,WAAW,CAAC,CAAC;AAC5B,CAAC,CAAC;AAWF;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,CAAC,EACvC,IAAI,EACJ,SAAS,EACT,gBAAgB,GAAG,WAAW,GACA,EAAE,EAAE;IAClC,MAAM,CAAC,OAAO,EAAE,WAAW,CAAC,GAAG,cAAc,CAAC,IAAI,CAAC,CAAC;IAEpD,OAAO,CACL,MAAC,OAAO,IACN,IAAI,EAAC,QAAQ,EACb,SAAS,EAAE,gBAAgB,EAC3B,UAAU,EAAE,CAAC,WAAW,aAExB,KAAC,OAAO,CAAC,OAAO,IAAC,gBAAgB,kBAC/B,6BACE,GAAG,EAAE,OAAO,EACZ,SAAS,EAAE,UAAU,CAAC,oBAAoB,EAAE,SAAS,CAAC,IAClD,CAAC,WAAW,IAAI,EAAE,QAAQ,EAAE,CAAC,EAAE,CAAC,cAEnC,IAAI,IACA,GACS,EAClB,KAAC,OAAO,CAAC,OAAO,cAAE,IAAI,GAAmB,IACjC,CACX,CAAC;AACJ,CAAC,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 */\nimport classNames from 'classnames';\nimport { type RefObject, useEffect, useRef, useState } from 'react';\n\nimport { Tooltip } from '../tooltip';\n\nconst useIsTruncated = (\n  text: string,\n): [RefObject<HTMLSpanElement | null>, boolean] => {\n  const ref = useRef<HTMLSpanElement>(null);\n  const [isTruncated, setIsTruncated] = useState(false);\n\n  useEffect(() => {\n    const element = ref.current;\n    if (element === null) {\n      return;\n    }\n\n    // Reads inside the ResizeObserver callback are layout-synced and cheap;\n    // setState with an unchanged boolean does not trigger a re-render.\n    const check = () =>\n      setIsTruncated(element.scrollWidth > element.clientWidth);\n\n    check();\n    const observer = new ResizeObserver(check);\n    observer.observe(element);\n    return () => observer.disconnect();\n  }, [text]);\n\n  return [ref, isTruncated];\n};\n\ntype TruncatedTextWithTooltipProps = {\n  /** The text to display. Truncated with an ellipsis when space is limited. */\n  text: string;\n  /** Class name applied to the text element. Typography is inherited from the parent. */\n  className?: string;\n  /** Placement of the tooltip showing the full text. */\n  tooltipPlacement?: React.ComponentProps<typeof Tooltip>['placement'];\n};\n\n/**\n * Internal component that renders single-line truncating text and, only while\n * the text is actually clipped, shows a tooltip with the full text.\n *\n * Accessibility: the text element receives `tabIndex={0}` only while truncated,\n * so sighted keyboard users can reveal the full text on focus without adding a\n * dead tab stop otherwise. No button semantics are used since there is no\n * action to perform. Screen readers always receive the full text from the\n * element's own content, as CSS truncation is visual-only. The tooltip is\n * dismissible with Escape and hoverable (WCAG 1.4.13).\n *\n * @internal - Not part of the public API.\n */\nexport const TruncatedTextWithTooltip = ({\n  text,\n  className,\n  tooltipPlacement = 'top-start',\n}: TruncatedTextWithTooltipProps) => {\n  const [textRef, isTruncated] = useIsTruncated(text);\n\n  return (\n    <Tooltip\n      type=\"simple\"\n      placement={tooltipPlacement}\n      isDisabled={!isTruncated}\n    >\n      <Tooltip.Trigger hasButtonWrapper>\n        <span\n          ref={textRef}\n          className={classNames('ndl-truncated-text', className)}\n          {...(isTruncated && { tabIndex: 0 })}\n        >\n          {text}\n        </span>\n      </Tooltip.Trigger>\n      <Tooltip.Content>{text}</Tooltip.Content>\n    </Tooltip>\n  );\n};\n"]}

package/lib/esm/ai/preview/Preview.js

@@ -34,6 +34,7 @@ import { ClipboardButton, LoadingSpinner, StatusLabel, Typography, useNeedleThem
 import classNames from 'classnames';
 import { useEffect, useState } from 'react';
 import { PrismLight as SyntaxHighlighter } from 'react-syntax-highlighter';
+import { TruncatedTextWithTooltip } from '../../_common/TruncatedTextWithTooltip';
 import { Languages, loadLanguage, } from '../../code-block/code-languages';
 import ndlCodeDark from '../../code-block/themes/ndl-code-dark';
 import ndlCodeLight from '../../code-block/themes/ndl-code-light';
@@ -50,7 +51,7 @@ const PreviewComponent = (_a) => {
 };
 const PreviewHeader = (_a) => {
     var { children, actions, ref, style, className, htmlAttributes } = _a, restProps = __rest(_a, ["children", "actions", "ref", "style", "className", "htmlAttributes"]);
-    return (_jsxs("div", Object.assign({ ref: ref, style: style, className: classNames('ndl-ai-preview-header', className) }, restProps, htmlAttributes, { children: [_jsx(Typography, { variant: "code", as: "div", className: "ndl-ai-preview-header-leading-content", children: children }), actions && (_jsx("div", { className: "ndl-ai-preview-header-actions", children: actions }))] })));
+    return (_jsxs("div", Object.assign({ ref: ref, style: style, className: classNames('ndl-ai-preview-header', className) }, restProps, htmlAttributes, { children: [_jsx(Typography, { variant: "code", as: "div", className: "ndl-ai-preview-header-leading-content", children: typeof children === 'string' ? (_jsx(TruncatedTextWithTooltip, { text: children })) : (children) }), actions && (_jsx("div", { className: "ndl-ai-preview-header-actions", children: actions }))] })));
 };
 const PreviewConfirmation = (_a) => {
     var { children, actions, isFooter = false, status = 'pending', confirmedActionText = 'Action confirmed', rejectedActionText = 'Action rejected', ref, style, className, htmlAttributes } = _a, restProps = __rest(_a, ["children", "actions", "isFooter", "status", "confirmedActionText", "rejectedActionText", "ref", "style", "className", "htmlAttributes"]);
@@ -60,7 +61,7 @@ const PreviewConfirmation = (_a) => {
     return (_jsxs("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [!(isFooter && status !== 'pending') && (_jsx(Typography, { as: "div", variant: isFooter ? 'subheading-small' : 'body-medium', className: "ndl-ai-preview-confirmation-content", children: children })), _jsxs(Typography, { variant: "body-medium", as: "div", className: "ndl-ai-preview-confirmation-actions", children: [status === 'pending' && actions, status === 'confirmed' && (_jsxs("div", { className: "ndl-ai-preview-confirmation-confirm-reject", children: [_jsx(CheckIconOutline, { className: "ndl-ai-preview-confirmation-action-icon" }), confirmedActionText] })), status === 'rejected' && (_jsxs("div", { className: "ndl-ai-preview-confirmation-confirm-reject", children: [_jsx(XMarkIconOutline, { className: "ndl-ai-preview-confirmation-action-icon" }), rejectedActionText] }))] })] })));
 };
 const PreviewCode = (_a) => {
-    var { code, language, label, isLoading = false, headerActions, theme, ref, style, className, htmlAttributes } = _a, restProps = __rest(_a, ["code", "language", "label", "isLoading", "headerActions", "theme", "ref", "style", "className", "htmlAttributes"]);
+    var { code, language, label, isLoading = false, headerActions, theme, heading, ref, style, className, htmlAttributes } = _a, restProps = __rest(_a, ["code", "language", "label", "isLoading", "headerActions", "theme", "heading", "ref", "style", "className", "htmlAttributes"]);
     const [loadedLanguage, setLoadedLanguage] = useState(null);
     const { theme: ndlTheme } = useNeedleTheme();
     useEffect(() => {
@@ -85,7 +86,7 @@ const PreviewCode = (_a) => {
                 return ndlTheme === 'light' ? ndlCodeLight : ndlCodeDark;
         }
     };
-    return (_jsxs("div", Object.assign({ ref: ref, style: style, className: classNames('ndl-ai-preview-code', className) }, restProps, htmlAttributes, { children: [isLoading && (_jsxs("div", { className: "ndl-ai-preview-code-loading", children: [_jsx(LoadingSpinner, { size: "medium" }), _jsxs(Typography, { variant: "code", children: ["WRITING ", language.toUpperCase()] })] })), !isLoading && (_jsxs(_Fragment, { children: [_jsxs(PreviewHeader, { className: "ndl-ai-preview-code-header", actions: _jsxs(_Fragment, { children: [_jsx(ClipboardButton, { textToCopy: code, type: "clean-icon-button", size: "small" }), headerActions] }), children: [language, " ", language.toLowerCase() === 'cypher' ? 'QUERY' : '', label && (_jsx(StatusLabel, { variant: label === 'write' ? 'warning' : 'info', size: "small", fill: "semi-filled", children: label.toUpperCase() }))] }), _jsx("div", { className: "ndl-ai-preview-code-content", children: _jsx(SyntaxHighlighter, { language: loadedLanguage !== null && loadedLanguage !== void 0 ? loadedLanguage : 'text', style: Object.assign(Object.assign({}, getTheme()), { 'pre[class*="language-"]': {
+    return (_jsxs("div", Object.assign({ ref: ref, style: style, className: classNames('ndl-ai-preview-code', className) }, restProps, htmlAttributes, { children: [isLoading && (_jsxs("div", { className: "ndl-ai-preview-code-loading", children: [_jsx(LoadingSpinner, { size: "medium" }), _jsxs(Typography, { variant: "code", children: ["WRITING ", language.toUpperCase()] })] })), !isLoading && (_jsxs(_Fragment, { children: [_jsxs(PreviewHeader, { className: "ndl-ai-preview-code-header", actions: _jsxs(_Fragment, { children: [_jsx(ClipboardButton, { textToCopy: code, type: "clean-icon-button", size: "small" }), headerActions] }), children: [_jsx(TruncatedTextWithTooltip, { className: "ndl-ai-preview-code-header-heading", text: heading !== null && heading !== void 0 ? heading : `${language}${language.toLowerCase() === 'cypher' ? ' QUERY' : ''}` }), label && (_jsx(StatusLabel, { variant: label === 'write' ? 'warning' : 'info', size: "small", fill: "semi-filled", children: label.toUpperCase() }))] }), _jsx("div", { className: "ndl-ai-preview-code-content", children: _jsx(SyntaxHighlighter, { language: loadedLanguage !== null && loadedLanguage !== void 0 ? loadedLanguage : 'text', style: Object.assign(Object.assign({}, getTheme()), { 'pre[class*="language-"]': {
                                     border: 0,
                                     color: 'var(--theme-color-neutral-text-default)',
                                     lineHeight: '1',

package/lib/esm/ai/preview/Preview.js.map

@@ -1 +1 @@
-{"version":3,"file":"Preview.js","sourceRoot":"","sources":["../../../../src/ai/preview/Preview.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 */\nimport {\n  ClipboardButton,\n  type CodeBlock,\n  LoadingSpinner,\n  StatusLabel,\n  Typography,\n  useNeedleTheme,\n} from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { useEffect, useState } from 'react';\nimport { PrismLight as SyntaxHighlighter } from 'react-syntax-highlighter';\n\nimport { type CommonProps } from '../../_common/types';\nimport {\n  type LanguageProp,\n  Languages,\n  loadLanguage,\n} from '../../code-block/code-languages';\nimport ndlCodeDark from '../../code-block/themes/ndl-code-dark';\nimport ndlCodeLight from '../../code-block/themes/ndl-code-light';\nimport { CheckIconOutline } from '../../icons/generated/heroIcons/CheckIconOutline';\nimport { XMarkIconOutline } from '../../icons/generated/heroIcons/XMarkIconOutline';\n\ntype PreviewProps = {\n  children: React.ReactNode;\n};\n\n/**\n * Component to use for previewing certain content in AI chat applications.\n *\n * @alpha - Changes to this component may be breaking.\n */\nconst PreviewComponent = ({\n  children,\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewProps>) => {\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={classNames('ndl-ai-preview', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {children}\n    </div>\n  );\n};\n\ntype PreviewHeaderProps = {\n  children?: React.ReactNode;\n  actions?: React.ReactNode;\n};\n\nconst PreviewHeader = ({\n  children,\n  actions,\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewHeaderProps>) => {\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={classNames('ndl-ai-preview-header', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      <Typography\n        variant=\"code\"\n        as=\"div\"\n        className=\"ndl-ai-preview-header-leading-content\"\n      >\n        {children}\n      </Typography>\n\n      {actions && (\n        <div className=\"ndl-ai-preview-header-actions\">{actions}</div>\n      )}\n    </div>\n  );\n};\n\ntype PreviewConfirmationProps = {\n  /** The content to display in the confirmation */\n  children?: React.ReactNode;\n  /** The actions to display in the confirmation, usually two buttons; one for confirming and one for rejecting. */\n  actions: React.ReactNode;\n  /** Whether the confirmation is used as a footer */\n  isFooter?: boolean;\n  /** The status of the confirmation */\n  status?: 'pending' | 'confirmed' | 'rejected';\n  /** The text to display for the confirmed status */\n  confirmedActionText?: string;\n  /** The text to display for the rejected status */\n  rejectedActionText?: string;\n};\n\nconst PreviewConfirmation = ({\n  children,\n  actions,\n  isFooter = false,\n  status = 'pending',\n  confirmedActionText = 'Action confirmed',\n  rejectedActionText = 'Action rejected',\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewConfirmationProps>) => {\n  const classes = classNames('ndl-ai-preview-confirmation', className, {\n    'ndl-ai-preview-confirmation-footer': isFooter,\n  });\n\n  return (\n    <div\n      ref={ref}\n      className={classes}\n      style={style}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {!(isFooter && status !== 'pending') && (\n        <Typography\n          as=\"div\"\n          variant={isFooter ? 'subheading-small' : 'body-medium'}\n          className=\"ndl-ai-preview-confirmation-content\"\n        >\n          {children}\n        </Typography>\n      )}\n      <Typography\n        variant=\"body-medium\"\n        as=\"div\"\n        className=\"ndl-ai-preview-confirmation-actions\"\n      >\n        {status === 'pending' && actions}\n        {status === 'confirmed' && (\n          <div className=\"ndl-ai-preview-confirmation-confirm-reject\">\n            <CheckIconOutline className=\"ndl-ai-preview-confirmation-action-icon\" />\n            {confirmedActionText}\n          </div>\n        )}\n        {status === 'rejected' && (\n          <div className=\"ndl-ai-preview-confirmation-confirm-reject\">\n            <XMarkIconOutline className=\"ndl-ai-preview-confirmation-action-icon\" />\n            {rejectedActionText}\n          </div>\n        )}\n      </Typography>\n    </div>\n  );\n};\n\ntype PreviewCodeProps = {\n  /** The code content to display */\n  code: string;\n  /** The language of the code (e.g., 'cypher', 'python', 'javascript') */\n  language: React.ComponentProps<typeof CodeBlock>['language'];\n  /** The current state of the code block */\n  label?: 'read' | 'write';\n  /** Whether the code block is loading */\n  isLoading?: boolean;\n  /** The actions to display in the header. Should be small buttons or icon buttons only. */\n  headerActions?: React.ReactNode;\n  /** The theme of the code block */\n  theme?: 'ndl-code-dark' | 'ndl-code-light';\n};\n\nconst PreviewCode = ({\n  code,\n  language,\n  label,\n  isLoading = false,\n  headerActions,\n  theme,\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewCodeProps>) => {\n  const [loadedLanguage, setLoadedLanguage] = useState<\n    PreviewCodeProps['language'] | null\n  >(null);\n  const { theme: ndlTheme } = useNeedleTheme();\n\n  useEffect(() => {\n    if (!language || !(Languages as readonly string[]).includes(language)) {\n      setLoadedLanguage('text');\n      return;\n    }\n\n    loadLanguage(language as LanguageProp)\n      .then((module) => {\n        SyntaxHighlighter.registerLanguage(language, module.default);\n        setLoadedLanguage(language);\n      })\n      .catch((err) => console.error(err));\n  }, [language]);\n\n  const getTheme = () => {\n    switch (theme) {\n      case 'ndl-code-dark':\n        return ndlCodeDark;\n      case 'ndl-code-light':\n        return ndlCodeLight;\n      default:\n        return ndlTheme === 'light' ? ndlCodeLight : ndlCodeDark;\n    }\n  };\n\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={classNames('ndl-ai-preview-code', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {isLoading && (\n        <div className=\"ndl-ai-preview-code-loading\">\n          <LoadingSpinner size=\"medium\" />\n          <Typography variant=\"code\">\n            WRITING {language.toUpperCase()}\n          </Typography>\n        </div>\n      )}\n      {!isLoading && (\n        <>\n          <PreviewHeader\n            className=\"ndl-ai-preview-code-header\"\n            actions={\n              <>\n                <ClipboardButton\n                  textToCopy={code}\n                  type=\"clean-icon-button\"\n                  size=\"small\"\n                />\n                {headerActions}\n              </>\n            }\n          >\n            {language} {language.toLowerCase() === 'cypher' ? 'QUERY' : ''}\n            {label && (\n              <StatusLabel\n                variant={label === 'write' ? 'warning' : 'info'}\n                size=\"small\"\n                fill=\"semi-filled\"\n              >\n                {label.toUpperCase()}\n              </StatusLabel>\n            )}\n          </PreviewHeader>\n          <div className=\"ndl-ai-preview-code-content\">\n            <SyntaxHighlighter\n              language={loadedLanguage ?? 'text'}\n              style={{\n                ...getTheme(),\n                'pre[class*=\"language-\"]': {\n                  border: 0,\n                  color: 'var(--theme-color-neutral-text-default)',\n                  lineHeight: '1',\n                  overflowX: 'auto',\n                  padding: 'var(--space-12)',\n                  width: 'fit-content',\n                },\n              }}\n              // Turn on 'shouldShowLineNumbers' & 'wrapLongLines' at the same time, the display is wrong\n              // https://github.com/react-syntax-highlighter/react-syntax-highlighter/issues/402\n              // wrapLongLines\n              codeTagProps={{ className: 'n-ai-preview-code' }}\n              showLineNumbers={false}\n            >\n              {code}\n            </SyntaxHighlighter>\n          </div>\n        </>\n      )}\n    </div>\n  );\n};\n\ntype PreviewContentProps = {\n  children?: React.ReactNode;\n};\n\nconst PreviewContent = ({\n  children,\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewContentProps>) => {\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={classNames('ndl-ai-preview-content', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {children}\n    </div>\n  );\n};\n\nexport const Preview = Object.assign(PreviewComponent, {\n  Code: PreviewCode,\n  Confirmation: PreviewConfirmation,\n  Content: PreviewContent,\n  Header: PreviewHeader,\n});\n"]}
+{"version":3,"file":"Preview.js","sourceRoot":"","sources":["../../../../src/ai/preview/Preview.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 */\nimport {\n  ClipboardButton,\n  type CodeBlock,\n  LoadingSpinner,\n  StatusLabel,\n  Typography,\n  useNeedleTheme,\n} from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { useEffect, useState } from 'react';\nimport { PrismLight as SyntaxHighlighter } from 'react-syntax-highlighter';\n\nimport { TruncatedTextWithTooltip } from '../../_common/TruncatedTextWithTooltip';\nimport { type CommonProps } from '../../_common/types';\nimport {\n  type LanguageProp,\n  Languages,\n  loadLanguage,\n} from '../../code-block/code-languages';\nimport ndlCodeDark from '../../code-block/themes/ndl-code-dark';\nimport ndlCodeLight from '../../code-block/themes/ndl-code-light';\nimport { CheckIconOutline } from '../../icons/generated/heroIcons/CheckIconOutline';\nimport { XMarkIconOutline } from '../../icons/generated/heroIcons/XMarkIconOutline';\n\ntype PreviewProps = {\n  children: React.ReactNode;\n};\n\n/**\n * Component to use for previewing certain content in AI chat applications.\n *\n * @alpha - Changes to this component may be breaking.\n */\nconst PreviewComponent = ({\n  children,\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewProps>) => {\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={classNames('ndl-ai-preview', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {children}\n    </div>\n  );\n};\n\ntype PreviewHeaderProps = {\n  /** The content to display in the header. When a plain string is passed, it truncates with an ellipsis and shows a tooltip with the full text when space is limited. */\n  children?: React.ReactNode;\n  /** The actions to display in the header. Should be small buttons or icon buttons only. */\n  actions?: React.ReactNode;\n};\n\nconst PreviewHeader = ({\n  children,\n  actions,\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewHeaderProps>) => {\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={classNames('ndl-ai-preview-header', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      <Typography\n        variant=\"code\"\n        as=\"div\"\n        className=\"ndl-ai-preview-header-leading-content\"\n      >\n        {typeof children === 'string' ? (\n          <TruncatedTextWithTooltip text={children} />\n        ) : (\n          children\n        )}\n      </Typography>\n\n      {actions && (\n        <div className=\"ndl-ai-preview-header-actions\">{actions}</div>\n      )}\n    </div>\n  );\n};\n\ntype PreviewConfirmationProps = {\n  /** The content to display in the confirmation */\n  children?: React.ReactNode;\n  /** The actions to display in the confirmation, usually two buttons; one for confirming and one for rejecting. */\n  actions: React.ReactNode;\n  /** Whether the confirmation is used as a footer */\n  isFooter?: boolean;\n  /** The status of the confirmation */\n  status?: 'pending' | 'confirmed' | 'rejected';\n  /** The text to display for the confirmed status */\n  confirmedActionText?: string;\n  /** The text to display for the rejected status */\n  rejectedActionText?: string;\n};\n\nconst PreviewConfirmation = ({\n  children,\n  actions,\n  isFooter = false,\n  status = 'pending',\n  confirmedActionText = 'Action confirmed',\n  rejectedActionText = 'Action rejected',\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewConfirmationProps>) => {\n  const classes = classNames('ndl-ai-preview-confirmation', className, {\n    'ndl-ai-preview-confirmation-footer': isFooter,\n  });\n\n  return (\n    <div\n      ref={ref}\n      className={classes}\n      style={style}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {!(isFooter && status !== 'pending') && (\n        <Typography\n          as=\"div\"\n          variant={isFooter ? 'subheading-small' : 'body-medium'}\n          className=\"ndl-ai-preview-confirmation-content\"\n        >\n          {children}\n        </Typography>\n      )}\n      <Typography\n        variant=\"body-medium\"\n        as=\"div\"\n        className=\"ndl-ai-preview-confirmation-actions\"\n      >\n        {status === 'pending' && actions}\n        {status === 'confirmed' && (\n          <div className=\"ndl-ai-preview-confirmation-confirm-reject\">\n            <CheckIconOutline className=\"ndl-ai-preview-confirmation-action-icon\" />\n            {confirmedActionText}\n          </div>\n        )}\n        {status === 'rejected' && (\n          <div className=\"ndl-ai-preview-confirmation-confirm-reject\">\n            <XMarkIconOutline className=\"ndl-ai-preview-confirmation-action-icon\" />\n            {rejectedActionText}\n          </div>\n        )}\n      </Typography>\n    </div>\n  );\n};\n\ntype PreviewCodeProps = {\n  /** The code content to display */\n  code: string;\n  /** The language of the code (e.g., 'cypher', 'python', 'javascript') */\n  language: React.ComponentProps<typeof CodeBlock>['language'];\n  /** The current state of the code block\n   * @deprecated - The query should be described in the heading property instead.\n   */\n  label?: 'read' | 'write';\n  /** Whether the code block is loading */\n  isLoading?: boolean;\n  /** The actions to display in the header. Should be small buttons or icon buttons only. */\n  headerActions?: React.ReactNode;\n  /** The theme of the code block */\n  theme?: 'ndl-code-dark' | 'ndl-code-light';\n  /** The heading to display in the header. If not provided, the language will be displayed. Truncates with an ellipsis and shows a tooltip with the full text when space is limited. */\n  heading?: string;\n};\n\nconst PreviewCode = ({\n  code,\n  language,\n  label,\n  isLoading = false,\n  headerActions,\n  theme,\n  heading,\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewCodeProps>) => {\n  const [loadedLanguage, setLoadedLanguage] = useState<\n    PreviewCodeProps['language'] | null\n  >(null);\n  const { theme: ndlTheme } = useNeedleTheme();\n\n  useEffect(() => {\n    if (!language || !(Languages as readonly string[]).includes(language)) {\n      setLoadedLanguage('text');\n      return;\n    }\n\n    loadLanguage(language as LanguageProp)\n      .then((module) => {\n        SyntaxHighlighter.registerLanguage(language, module.default);\n        setLoadedLanguage(language);\n      })\n      .catch((err) => console.error(err));\n  }, [language]);\n\n  const getTheme = () => {\n    switch (theme) {\n      case 'ndl-code-dark':\n        return ndlCodeDark;\n      case 'ndl-code-light':\n        return ndlCodeLight;\n      default:\n        return ndlTheme === 'light' ? ndlCodeLight : ndlCodeDark;\n    }\n  };\n\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={classNames('ndl-ai-preview-code', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {isLoading && (\n        <div className=\"ndl-ai-preview-code-loading\">\n          <LoadingSpinner size=\"medium\" />\n          <Typography variant=\"code\">\n            WRITING {language.toUpperCase()}\n          </Typography>\n        </div>\n      )}\n      {!isLoading && (\n        <>\n          <PreviewHeader\n            className=\"ndl-ai-preview-code-header\"\n            actions={\n              <>\n                <ClipboardButton\n                  textToCopy={code}\n                  type=\"clean-icon-button\"\n                  size=\"small\"\n                />\n                {headerActions}\n              </>\n            }\n          >\n            <TruncatedTextWithTooltip\n              className=\"ndl-ai-preview-code-header-heading\"\n              text={\n                heading ??\n                `${language}${language.toLowerCase() === 'cypher' ? ' QUERY' : ''}`\n              }\n            />\n            {label && (\n              <StatusLabel\n                variant={label === 'write' ? 'warning' : 'info'}\n                size=\"small\"\n                fill=\"semi-filled\"\n              >\n                {label.toUpperCase()}\n              </StatusLabel>\n            )}\n          </PreviewHeader>\n          <div className=\"ndl-ai-preview-code-content\">\n            <SyntaxHighlighter\n              language={loadedLanguage ?? 'text'}\n              style={{\n                ...getTheme(),\n                'pre[class*=\"language-\"]': {\n                  border: 0,\n                  color: 'var(--theme-color-neutral-text-default)',\n                  lineHeight: '1',\n                  overflowX: 'auto',\n                  padding: 'var(--space-12)',\n                  width: 'fit-content',\n                },\n              }}\n              // Turn on 'shouldShowLineNumbers' & 'wrapLongLines' at the same time, the display is wrong\n              // https://github.com/react-syntax-highlighter/react-syntax-highlighter/issues/402\n              // wrapLongLines\n              codeTagProps={{ className: 'n-ai-preview-code' }}\n              showLineNumbers={false}\n            >\n              {code}\n            </SyntaxHighlighter>\n          </div>\n        </>\n      )}\n    </div>\n  );\n};\n\ntype PreviewContentProps = {\n  children?: React.ReactNode;\n};\n\nconst PreviewContent = ({\n  children,\n  ref,\n  style,\n  className,\n  htmlAttributes,\n  ...restProps\n}: CommonProps<'div', PreviewContentProps>) => {\n  return (\n    <div\n      ref={ref}\n      style={style}\n      className={classNames('ndl-ai-preview-content', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {children}\n    </div>\n  );\n};\n\nexport const Preview = Object.assign(PreviewComponent, {\n  Code: PreviewCode,\n  Confirmation: PreviewConfirmation,\n  Content: PreviewContent,\n  Header: PreviewHeader,\n});\n"]}

package/lib/esm/ai/preview/stories/index.js

@@ -22,17 +22,17 @@ export { default as PreviewDataGrid } from './preview-data-grid.story';
 export { default as PreviewConfirmationStandalone } from './preview-confirmation-standalone.story';
 export { default as PreviewCodeConfirmation } from './preview-code-confirmation.story';
 export { default as PreviewCodeLoading } from './preview-code-loading.story';
-export { default as PreviewCodeRead } from './preview-code-read.story';
-export { default as PreviewCodeWrite } from './preview-code-write.story';
 export { default as PreviewCodeLanguages } from './preview-code-languages.story';
 export { default as PreviewSimple } from './preview-simple.story';
 export { default as PreviewSimpleWithContent } from './preview-simple-with-content.story';
+export { default as PreviewCodeCypher } from './preview-code-cypher.story';
+export { default as PreviewCodeTruncation } from './preview-code-truncation.story';
 import { removeLicenseHeader } from '../../../_common/export-stories-utils';
 import PreviewCodeConfirmationSrcRaw from './preview-code-confirmation.story?raw';
+import PreviewCodeCypherSrcRaw from './preview-code-cypher.story?raw';
 import PreviewCodeLanguagesSrcRaw from './preview-code-languages.story?raw';
 import PreviewCodeLoadingSrcRaw from './preview-code-loading.story?raw';
-import PreviewCodeReadSrcRaw from './preview-code-read.story?raw';
-import PreviewCodeWriteSrcRaw from './preview-code-write.story?raw';
+import PreviewCodeTruncationSrcRaw from './preview-code-truncation.story?raw';
 import PreviewConfirmationStandaloneSrcRaw from './preview-confirmation-standalone.story?raw';
 import PreviewDataGridSrcRaw from './preview-data-grid.story?raw';
 import PreviewSimpleSrcRaw from './preview-simple.story?raw';
@@ -41,9 +41,9 @@ export const PreviewDataGridSrc = removeLicenseHeader(PreviewDataGridSrcRaw);
 export const PreviewConfirmationStandaloneSrc = removeLicenseHeader(PreviewConfirmationStandaloneSrcRaw);
 export const PreviewCodeConfirmationSrc = removeLicenseHeader(PreviewCodeConfirmationSrcRaw);
 export const PreviewCodeLoadingSrc = removeLicenseHeader(PreviewCodeLoadingSrcRaw);
-export const PreviewCodeReadSrc = removeLicenseHeader(PreviewCodeReadSrcRaw);
-export const PreviewCodeWriteSrc = removeLicenseHeader(PreviewCodeWriteSrcRaw);
 export const PreviewCodeLanguagesSrc = removeLicenseHeader(PreviewCodeLanguagesSrcRaw);
+export const PreviewCodeCypherSrc = removeLicenseHeader(PreviewCodeCypherSrcRaw);
+export const PreviewCodeTruncationSrc = removeLicenseHeader(PreviewCodeTruncationSrcRaw);
 export const PreviewSimpleSrc = removeLicenseHeader(PreviewSimpleSrcRaw);
 export const PreviewSimpleWithContentSrc = removeLicenseHeader(PreviewSimpleWithContentSrcRaw);
 //# sourceMappingURL=index.js.map

package/lib/esm/ai/preview/stories/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2BAA2B,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,6BAA6B,EAAE,MAAM,yCAAyC,CAAC;AACnG,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,MAAM,mCAAmC,CAAC;AACvF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2BAA2B,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AACzE,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACjF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,qCAAqC,CAAC;AAE1F,OAAO,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,6BAA6B,MAAM,uCAAuC,CAAC;AAClF,OAAO,0BAA0B,MAAM,oCAAoC,CAAC;AAC5E,OAAO,wBAAwB,MAAM,kCAAkC,CAAC;AACxE,OAAO,qBAAqB,MAAM,+BAA+B,CAAC;AAClE,OAAO,sBAAsB,MAAM,gCAAgC,CAAC;AACpE,OAAO,mCAAmC,MAAM,6CAA6C,CAAC;AAC9F,OAAO,qBAAqB,MAAM,+BAA+B,CAAC;AAClE,OAAO,mBAAmB,MAAM,4BAA4B,CAAC;AAC7D,OAAO,8BAA8B,MAAM,yCAAyC,CAAC;AAErF,MAAM,CAAC,MAAM,kBAAkB,GAAG,mBAAmB,CAAC,qBAAqB,CAAC,CAAC;AAC7E,MAAM,CAAC,MAAM,gCAAgC,GAAG,mBAAmB,CACjE,mCAAmC,CACpC,CAAC;AACF,MAAM,CAAC,MAAM,0BAA0B,GAAG,mBAAmB,CAC3D,6BAA6B,CAC9B,CAAC;AACF,MAAM,CAAC,MAAM,qBAAqB,GAAG,mBAAmB,CACtD,wBAAwB,CACzB,CAAC;AACF,MAAM,CAAC,MAAM,kBAAkB,GAAG,mBAAmB,CAAC,qBAAqB,CAAC,CAAC;AAC7E,MAAM,CAAC,MAAM,mBAAmB,GAAG,mBAAmB,CAAC,sBAAsB,CAAC,CAAC;AAC/E,MAAM,CAAC,MAAM,uBAAuB,GAAG,mBAAmB,CACxD,0BAA0B,CAC3B,CAAC;AACF,MAAM,CAAC,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,mBAAmB,CAAC,CAAC;AACzE,MAAM,CAAC,MAAM,2BAA2B,GAAG,mBAAmB,CAC5D,8BAA8B,CAC/B,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\nexport { default as PreviewDataGrid } from './preview-data-grid.story';\nexport { default as PreviewConfirmationStandalone } from './preview-confirmation-standalone.story';\nexport { default as PreviewCodeConfirmation } from './preview-code-confirmation.story';\nexport { default as PreviewCodeLoading } from './preview-code-loading.story';\nexport { default as PreviewCodeRead } from './preview-code-read.story';\nexport { default as PreviewCodeWrite } from './preview-code-write.story';\nexport { default as PreviewCodeLanguages } from './preview-code-languages.story';\nexport { default as PreviewSimple } from './preview-simple.story';\nexport { default as PreviewSimpleWithContent } from './preview-simple-with-content.story';\n\nimport { removeLicenseHeader } from '../../../_common/export-stories-utils';\nimport PreviewCodeConfirmationSrcRaw from './preview-code-confirmation.story?raw';\nimport PreviewCodeLanguagesSrcRaw from './preview-code-languages.story?raw';\nimport PreviewCodeLoadingSrcRaw from './preview-code-loading.story?raw';\nimport PreviewCodeReadSrcRaw from './preview-code-read.story?raw';\nimport PreviewCodeWriteSrcRaw from './preview-code-write.story?raw';\nimport PreviewConfirmationStandaloneSrcRaw from './preview-confirmation-standalone.story?raw';\nimport PreviewDataGridSrcRaw from './preview-data-grid.story?raw';\nimport PreviewSimpleSrcRaw from './preview-simple.story?raw';\nimport PreviewSimpleWithContentSrcRaw from './preview-simple-with-content.story?raw';\n\nexport const PreviewDataGridSrc = removeLicenseHeader(PreviewDataGridSrcRaw);\nexport const PreviewConfirmationStandaloneSrc = removeLicenseHeader(\n  PreviewConfirmationStandaloneSrcRaw,\n);\nexport const PreviewCodeConfirmationSrc = removeLicenseHeader(\n  PreviewCodeConfirmationSrcRaw,\n);\nexport const PreviewCodeLoadingSrc = removeLicenseHeader(\n  PreviewCodeLoadingSrcRaw,\n);\nexport const PreviewCodeReadSrc = removeLicenseHeader(PreviewCodeReadSrcRaw);\nexport const PreviewCodeWriteSrc = removeLicenseHeader(PreviewCodeWriteSrcRaw);\nexport const PreviewCodeLanguagesSrc = removeLicenseHeader(\n  PreviewCodeLanguagesSrcRaw,\n);\nexport const PreviewSimpleSrc = removeLicenseHeader(PreviewSimpleSrcRaw);\nexport const PreviewSimpleWithContentSrc = removeLicenseHeader(\n  PreviewSimpleWithContentSrcRaw,\n);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,2BAA2B,CAAC;AACvE,OAAO,EAAE,OAAO,IAAI,6BAA6B,EAAE,MAAM,yCAAyC,CAAC;AACnG,OAAO,EAAE,OAAO,IAAI,uBAAuB,EAAE,MAAM,mCAAmC,CAAC;AACvF,OAAO,EAAE,OAAO,IAAI,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAC7E,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACjF,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,wBAAwB,EAAE,MAAM,qCAAqC,CAAC;AAC1F,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,6BAA6B,CAAC;AAC3E,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AAEnF,OAAO,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,6BAA6B,MAAM,uCAAuC,CAAC;AAClF,OAAO,uBAAuB,MAAM,iCAAiC,CAAC;AACtE,OAAO,0BAA0B,MAAM,oCAAoC,CAAC;AAC5E,OAAO,wBAAwB,MAAM,kCAAkC,CAAC;AACxE,OAAO,2BAA2B,MAAM,qCAAqC,CAAC;AAC9E,OAAO,mCAAmC,MAAM,6CAA6C,CAAC;AAC9F,OAAO,qBAAqB,MAAM,+BAA+B,CAAC;AAClE,OAAO,mBAAmB,MAAM,4BAA4B,CAAC;AAC7D,OAAO,8BAA8B,MAAM,yCAAyC,CAAC;AAErF,MAAM,CAAC,MAAM,kBAAkB,GAAG,mBAAmB,CAAC,qBAAqB,CAAC,CAAC;AAC7E,MAAM,CAAC,MAAM,gCAAgC,GAAG,mBAAmB,CACjE,mCAAmC,CACpC,CAAC;AACF,MAAM,CAAC,MAAM,0BAA0B,GAAG,mBAAmB,CAC3D,6BAA6B,CAC9B,CAAC;AACF,MAAM,CAAC,MAAM,qBAAqB,GAAG,mBAAmB,CACtD,wBAAwB,CACzB,CAAC;AACF,MAAM,CAAC,MAAM,uBAAuB,GAAG,mBAAmB,CACxD,0BAA0B,CAC3B,CAAC;AACF,MAAM,CAAC,MAAM,oBAAoB,GAAG,mBAAmB,CACrD,uBAAuB,CACxB,CAAC;AACF,MAAM,CAAC,MAAM,wBAAwB,GAAG,mBAAmB,CACzD,2BAA2B,CAC5B,CAAC;AACF,MAAM,CAAC,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,mBAAmB,CAAC,CAAC;AACzE,MAAM,CAAC,MAAM,2BAA2B,GAAG,mBAAmB,CAC5D,8BAA8B,CAC/B,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\nexport { default as PreviewDataGrid } from './preview-data-grid.story';\nexport { default as PreviewConfirmationStandalone } from './preview-confirmation-standalone.story';\nexport { default as PreviewCodeConfirmation } from './preview-code-confirmation.story';\nexport { default as PreviewCodeLoading } from './preview-code-loading.story';\nexport { default as PreviewCodeLanguages } from './preview-code-languages.story';\nexport { default as PreviewSimple } from './preview-simple.story';\nexport { default as PreviewSimpleWithContent } from './preview-simple-with-content.story';\nexport { default as PreviewCodeCypher } from './preview-code-cypher.story';\nexport { default as PreviewCodeTruncation } from './preview-code-truncation.story';\n\nimport { removeLicenseHeader } from '../../../_common/export-stories-utils';\nimport PreviewCodeConfirmationSrcRaw from './preview-code-confirmation.story?raw';\nimport PreviewCodeCypherSrcRaw from './preview-code-cypher.story?raw';\nimport PreviewCodeLanguagesSrcRaw from './preview-code-languages.story?raw';\nimport PreviewCodeLoadingSrcRaw from './preview-code-loading.story?raw';\nimport PreviewCodeTruncationSrcRaw from './preview-code-truncation.story?raw';\nimport PreviewConfirmationStandaloneSrcRaw from './preview-confirmation-standalone.story?raw';\nimport PreviewDataGridSrcRaw from './preview-data-grid.story?raw';\nimport PreviewSimpleSrcRaw from './preview-simple.story?raw';\nimport PreviewSimpleWithContentSrcRaw from './preview-simple-with-content.story?raw';\n\nexport const PreviewDataGridSrc = removeLicenseHeader(PreviewDataGridSrcRaw);\nexport const PreviewConfirmationStandaloneSrc = removeLicenseHeader(\n  PreviewConfirmationStandaloneSrcRaw,\n);\nexport const PreviewCodeConfirmationSrc = removeLicenseHeader(\n  PreviewCodeConfirmationSrcRaw,\n);\nexport const PreviewCodeLoadingSrc = removeLicenseHeader(\n  PreviewCodeLoadingSrcRaw,\n);\nexport const PreviewCodeLanguagesSrc = removeLicenseHeader(\n  PreviewCodeLanguagesSrcRaw,\n);\nexport const PreviewCodeCypherSrc = removeLicenseHeader(\n  PreviewCodeCypherSrcRaw,\n);\nexport const PreviewCodeTruncationSrc = removeLicenseHeader(\n  PreviewCodeTruncationSrcRaw,\n);\nexport const PreviewSimpleSrc = removeLicenseHeader(PreviewSimpleSrcRaw);\nexport const PreviewSimpleWithContentSrc = removeLicenseHeader(\n  PreviewSimpleWithContentSrcRaw,\n);\n"]}

package/lib/esm/ai/preview/stories/preview-code-confirmation.story.js

@@ -28,7 +28,7 @@ username
 [YIELD { * | field[, ...] } [ORDER BY field ...`;
 const Component = () => {
     const [status, setStatus] = useState('pending');
-    return (_jsxs(Preview, { children: [_jsx(Preview.Code, { code: cypherCode, language: "cypher", label: "write", isLoading: false, headerActions: null }), _jsx(Preview.Confirmation, { status: status, isFooter: true, confirmedActionText: "Action confirmed", rejectedActionText: "Action rejected", actions: _jsxs(_Fragment, { children: [_jsx(OutlinedButton, { variant: "neutral", size: "small", onClick: () => setStatus('rejected'), children: "Skip" }), _jsx(FilledButton, { variant: "primary", size: "small", onClick: () => setStatus('confirmed'), children: "Run query" })] }), children: "Assistant wants to run this query" })] }));
+    return (_jsxs(Preview, { children: [_jsx(Preview.Code, { code: cypherCode, language: "cypher", heading: "Show functions executable by user", isLoading: false, headerActions: null }), _jsx(Preview.Confirmation, { status: status, isFooter: true, confirmedActionText: "Action confirmed", rejectedActionText: "Action rejected", actions: _jsxs(_Fragment, { children: [_jsx(OutlinedButton, { variant: "neutral", size: "small", onClick: () => setStatus('rejected'), children: "Skip" }), _jsx(FilledButton, { variant: "primary", size: "small", onClick: () => setStatus('confirmed'), children: "Run query" })] }), children: "Assistant wants to run this query" })] }));
 };
 export default Component;
 //# sourceMappingURL=preview-code-confirmation.story.js.map

package/lib/esm/ai/preview/stories/preview-code-confirmation.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"preview-code-confirmation.story.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/preview-code-confirmation.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,UAAU,GAAG;;gDAE6B,CAAC;AAEjD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GACvB,QAAQ,CACN,SAAS,CACV,CAAC;IAEJ,OAAO,CACL,MAAC,OAAO,eACN,KAAC,OAAO,CAAC,IAAI,IACX,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,QAAQ,EACjB,KAAK,EAAC,OAAO,EACb,SAAS,EAAE,KAAK,EAChB,aAAa,EAAE,IAAI,GACnB,EACF,KAAC,OAAO,CAAC,YAAY,IACnB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,EACd,mBAAmB,EAAC,kBAAkB,EACtC,kBAAkB,EAAC,iBAAiB,EACpC,OAAO,EACL,8BACE,KAAC,cAAc,IACb,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,qBAGrB,EACjB,KAAC,YAAY,IACX,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,WAAW,CAAC,0BAGxB,IACd,kDAIgB,IACf,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 { FilledButton, OutlinedButton } from '@neo4j-ndl/react';\nimport { Preview } from '@neo4j-ndl/react/ai';\nimport { useState } from 'react';\n\nconst cypherCode = `SHOW [ALL|BUILT IN|USER DEFINED] FUNCTION[S] EXECUTABLE BY\nusername\n[YIELD { * | field[, ...] } [ORDER BY field ...`;\n\nconst Component = () => {\n  const [status, setStatus] =\n    useState<React.ComponentProps<typeof Preview.Confirmation>['status']>(\n      'pending',\n    );\n\n  return (\n    <Preview>\n      <Preview.Code\n        code={cypherCode}\n        language=\"cypher\"\n        label=\"write\"\n        isLoading={false}\n        headerActions={null}\n      />\n      <Preview.Confirmation\n        status={status}\n        isFooter={true}\n        confirmedActionText=\"Action confirmed\"\n        rejectedActionText=\"Action rejected\"\n        actions={\n          <>\n            <OutlinedButton\n              variant=\"neutral\"\n              size=\"small\"\n              onClick={() => setStatus('rejected')}\n            >\n              Skip\n            </OutlinedButton>\n            <FilledButton\n              variant=\"primary\"\n              size=\"small\"\n              onClick={() => setStatus('confirmed')}\n            >\n              Run query\n            </FilledButton>\n          </>\n        }\n      >\n        Assistant wants to run this query\n      </Preview.Confirmation>\n    </Preview>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"preview-code-confirmation.story.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/preview-code-confirmation.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAChE,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,UAAU,GAAG;;gDAE6B,CAAC;AAEjD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GACvB,QAAQ,CACN,SAAS,CACV,CAAC;IAEJ,OAAO,CACL,MAAC,OAAO,eACN,KAAC,OAAO,CAAC,IAAI,IACX,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,mCAAmC,EAC3C,SAAS,EAAE,KAAK,EAChB,aAAa,EAAE,IAAI,GACnB,EACF,KAAC,OAAO,CAAC,YAAY,IACnB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,EACd,mBAAmB,EAAC,kBAAkB,EACtC,kBAAkB,EAAC,iBAAiB,EACpC,OAAO,EACL,8BACE,KAAC,cAAc,IACb,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,qBAGrB,EACjB,KAAC,YAAY,IACX,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,WAAW,CAAC,0BAGxB,IACd,kDAIgB,IACf,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 { FilledButton, OutlinedButton } from '@neo4j-ndl/react';\nimport { Preview } from '@neo4j-ndl/react/ai';\nimport { useState } from 'react';\n\nconst cypherCode = `SHOW [ALL|BUILT IN|USER DEFINED] FUNCTION[S] EXECUTABLE BY\nusername\n[YIELD { * | field[, ...] } [ORDER BY field ...`;\n\nconst Component = () => {\n  const [status, setStatus] =\n    useState<React.ComponentProps<typeof Preview.Confirmation>['status']>(\n      'pending',\n    );\n\n  return (\n    <Preview>\n      <Preview.Code\n        code={cypherCode}\n        language=\"cypher\"\n        heading=\"Show functions executable by user\"\n        isLoading={false}\n        headerActions={null}\n      />\n      <Preview.Confirmation\n        status={status}\n        isFooter={true}\n        confirmedActionText=\"Action confirmed\"\n        rejectedActionText=\"Action rejected\"\n        actions={\n          <>\n            <OutlinedButton\n              variant=\"neutral\"\n              size=\"small\"\n              onClick={() => setStatus('rejected')}\n            >\n              Skip\n            </OutlinedButton>\n            <FilledButton\n              variant=\"primary\"\n              size=\"small\"\n              onClick={() => setStatus('confirmed')}\n            >\n              Run query\n            </FilledButton>\n          </>\n        }\n      >\n        Assistant wants to run this query\n      </Preview.Confirmation>\n    </Preview>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/ai/preview/stories/{preview-code-read.story.js → preview-code-cypher.story.js}

@@ -27,7 +27,7 @@ const cypherCode = `SHOW [ALL|BUILT IN|USER DEFINED] FUNCTION[S] EXECUTABLE BY
 username
 [YIELD { * | field[, ...] } [ORDER BY field ...`;
 const Component = () => {
-    return (_jsx(Preview, { children: _jsx(Preview.Code, { code: cypherCode, language: "cypher", label: "read", headerActions: _jsx(OutlinedButton, { leadingVisual: _jsx(PencilSquareIconOutline, {}), variant: "neutral", size: "small", children: "Send to Query" }) }) }));
+    return (_jsx(Preview, { children: _jsx(Preview.Code, { code: cypherCode, language: "cypher", heading: "Show functions executable by user", headerActions: _jsx(OutlinedButton, { leadingVisual: _jsx(PencilSquareIconOutline, {}), variant: "neutral", size: "small", children: "Send to Query" }) }) }));
 };
 export default Component;
-//# sourceMappingURL=preview-code-read.story.js.map
+//# sourceMappingURL=preview-code-cypher.story.js.map

package/lib/esm/ai/preview/stories/preview-code-cypher.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-code-cypher.story.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/preview-code-cypher.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAEjE,MAAM,UAAU,GAAG;;gDAE6B,CAAC;AAEjD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,KAAC,OAAO,cACN,KAAC,OAAO,CAAC,IAAI,IACX,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,mCAAmC,EAC3C,aAAa,EACX,KAAC,cAAc,IACb,aAAa,EAAE,KAAC,uBAAuB,KAAG,EAC1C,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,8BAGG,GAEnB,GACM,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 { OutlinedButton } from '@neo4j-ndl/react';\nimport { Preview } from '@neo4j-ndl/react/ai';\nimport { PencilSquareIconOutline } from '@neo4j-ndl/react/icons';\n\nconst cypherCode = `SHOW [ALL|BUILT IN|USER DEFINED] FUNCTION[S] EXECUTABLE BY\nusername\n[YIELD { * | field[, ...] } [ORDER BY field ...`;\n\nconst Component = () => {\n  return (\n    <Preview>\n      <Preview.Code\n        code={cypherCode}\n        language=\"cypher\"\n        heading=\"Show functions executable by user\"\n        headerActions={\n          <OutlinedButton\n            leadingVisual={<PencilSquareIconOutline />}\n            variant=\"neutral\"\n            size=\"small\"\n          >\n            Send to Query\n          </OutlinedButton>\n        }\n      />\n    </Preview>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/ai/preview/stories/preview-code-languages.story.js

@@ -28,7 +28,7 @@ const pythonCode = `def show_functions(username, function_type='ALL'):
     query = f"SHOW {function_type} FUNCTIONS EXECUTABLE BY {username}"
     return query`;
 const Component = () => {
-    return (_jsx(Preview, { children: _jsx(Preview.Code, { code: pythonCode, language: "python" }) }));
+    return (_jsx(Preview, { children: _jsx(Preview.Code, { code: pythonCode, language: "python", heading: "Show functions executable by user" }) }));
 };
 export default Component;
 //# sourceMappingURL=preview-code-languages.story.js.map

package/lib/esm/ai/preview/stories/preview-code-languages.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"preview-code-languages.story.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/preview-code-languages.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C,MAAM,UAAU,GAAG;;;;;iBAKF,CAAC;AAElB,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,KAAC,OAAO,cACN,KAAC,OAAO,CAAC,IAAI,IAAC,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAC,QAAQ,GAAG,GAC5C,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 { Preview } from '@neo4j-ndl/react/ai';\n\nconst pythonCode = `def show_functions(username, function_type='ALL'):\n    \"\"\"\n    Show functions executable by user\n    \"\"\"\n    query = f\"SHOW {function_type} FUNCTIONS EXECUTABLE BY {username}\"\n    return query`;\n\nconst Component = () => {\n  return (\n    <Preview>\n      <Preview.Code code={pythonCode} language=\"python\" />\n    </Preview>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"preview-code-languages.story.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/preview-code-languages.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAE9C,MAAM,UAAU,GAAG;;;;;iBAKF,CAAC;AAElB,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,KAAC,OAAO,cACN,KAAC,OAAO,CAAC,IAAI,IACX,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,mCAAmC,GAC3C,GACM,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 { Preview } from '@neo4j-ndl/react/ai';\n\nconst pythonCode = `def show_functions(username, function_type='ALL'):\n    \"\"\"\n    Show functions executable by user\n    \"\"\"\n    query = f\"SHOW {function_type} FUNCTIONS EXECUTABLE BY {username}\"\n    return query`;\n\nconst Component = () => {\n  return (\n    <Preview>\n      <Preview.Code\n        code={pythonCode}\n        language=\"python\"\n        heading=\"Show functions executable by user\"\n      />\n    </Preview>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/ai/preview/stories/{preview-code-write.story.js → preview-code-truncation.story.js}

@@ -1,4 +1,4 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime";
 /**
  *
  *  Copyright (c) "Neo4j"
@@ -20,14 +20,14 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
-import { CleanIconButton } from '@neo4j-ndl/react';
+import { OutlinedButton } from '@neo4j-ndl/react';
 import { Preview } from '@neo4j-ndl/react/ai';
-import { PencilSquareIconOutline, PlayCircleIconOutline, } from '@neo4j-ndl/react/icons';
-const cypherCode = `SHOW [ALL|BUILT IN|USER DEFINED] FUNCTION[S] EXECUTABLE BY
-username
-[YIELD { * | field[, ...] } [ORDER BY field ...`;
+import { PencilSquareIconOutline } from '@neo4j-ndl/react/icons';
+const cypherCode = `MATCH (person:Person)-[:ACTED_IN]->(movie:Movie)
+WHERE movie.released > 2000
+RETURN person.name, movie.title`;
 const Component = () => {
-    return (_jsx(Preview, { children: _jsx(Preview.Code, { code: cypherCode, language: "cypher", label: "write", headerActions: _jsxs(_Fragment, { children: [_jsx(CleanIconButton, { variant: "neutral", description: "Send to Query", size: "small", children: _jsx(PencilSquareIconOutline, {}) }), _jsx(CleanIconButton, { variant: "neutral", description: "Run in Query", size: "small", children: _jsx(PlayCircleIconOutline, {}) })] }) }) }));
+    return (_jsx("div", { style: { maxWidth: 400 }, children: _jsx(Preview, { children: _jsx(Preview.Code, { code: cypherCode, language: "cypher", heading: "Find all people who acted in movies released after the year 2000", headerActions: _jsx(OutlinedButton, { leadingVisual: _jsx(PencilSquareIconOutline, {}), variant: "neutral", size: "small", children: "Send to Query" }) }) }) }));
 };
 export default Component;
-//# sourceMappingURL=preview-code-write.story.js.map
+//# sourceMappingURL=preview-code-truncation.story.js.map

package/lib/esm/ai/preview/stories/preview-code-truncation.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-code-truncation.story.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/preview-code-truncation.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAC;AAC9C,OAAO,EAAE,uBAAuB,EAAE,MAAM,wBAAwB,CAAC;AAEjE,MAAM,UAAU,GAAG;;gCAEa,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,cAAK,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,YAC3B,KAAC,OAAO,cACN,KAAC,OAAO,CAAC,IAAI,IACX,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,QAAQ,EACjB,OAAO,EAAC,kEAAkE,EAC1E,aAAa,EACX,KAAC,cAAc,IACb,aAAa,EAAE,KAAC,uBAAuB,KAAG,EAC1C,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,8BAGG,GAEnB,GACM,GACN,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,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 { OutlinedButton } from '@neo4j-ndl/react';\nimport { Preview } from '@neo4j-ndl/react/ai';\nimport { PencilSquareIconOutline } from '@neo4j-ndl/react/icons';\n\nconst cypherCode = `MATCH (person:Person)-[:ACTED_IN]->(movie:Movie)\nWHERE movie.released > 2000\nRETURN person.name, movie.title`;\n\nconst Component = () => {\n  return (\n    <div style={{ maxWidth: 400 }}>\n      <Preview>\n        <Preview.Code\n          code={cypherCode}\n          language=\"cypher\"\n          heading=\"Find all people who acted in movies released after the year 2000\"\n          headerActions={\n            <OutlinedButton\n              leadingVisual={<PencilSquareIconOutline />}\n              variant=\"neutral\"\n              size=\"small\"\n            >\n              Send to Query\n            </OutlinedButton>\n          }\n        />\n      </Preview>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/menu/Menu.js

@@ -32,7 +32,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  */
 import { autoUpdate, flip, FloatingFocusManager, FloatingList, FloatingNode, FloatingPortal, FloatingTree, offset, safePolygon, shift, useClick, useDismiss, useFloating, useFloatingNodeId, useFloatingParentNodeId, useFloatingTree, useHover, useInteractions, useListItem, useListNavigation, useMergeRefs, useRole, useTypeahead, } from '@floating-ui/react';
 import classNames from 'classnames';
-import { createContext, useCallback, useContext, useEffect, useId, useRef, useState, } from 'react';
+import { createContext, useCallback, useContext, useEffect, useId, useLayoutEffect, useRef, useState, } from 'react';
 import { ConditionalWrap } from '../conditional-wrap';
 import { useIsInsideDialog } from '../dialog/dialog-context';
 import { Divider } from '../divider';
@@ -84,6 +84,15 @@ const MenuComponent = ({ children, isOpen: controlledOpen, onClose, isRoot, anch
             setActiveIndex(0);
         }
     }, [isOpen]);
+    // Unmounting is deferred by one pre-paint commit so that anything an item's
+    // action focused (e.g. an autofocused input mounted by onClick) is already
+    // the active element when the focus manager cleans up. floating-ui then
+    // respects the moved focus instead of returning it to the trigger.
+    // See https://github.com/floating-ui/floating-ui/issues/2607
+    const [isMounted, setIsMounted] = useState(false);
+    useLayoutEffect(() => {
+        setIsMounted(isOpen);
+    }, [isOpen]);
     // A single interaction can reach us twice, since floating-ui's focus manager
     // reports a focus-out after a dismissal without checking whether the menu is
     // still open. Ignoring an already closed menu keeps `onClose` to one call.
@@ -241,7 +250,7 @@ const MenuComponent = ({ children, isOpen: controlledOpen, onClose, isRoot, anch
                     isOpen: isDisabled === true ? false : isOpen,
                     setActiveIndex,
                     setHasFocusInside,
-                }, children: _jsx(FloatingList, { elementsRef: elementsRef, labelsRef: labelsRef, children: isOpen && (_jsx(ConditionalWrap, { shouldWrap: isPortaled, wrap: (wrapChildren) => (_jsx(FloatingPortal, { root: portalTarget, children: wrapChildren })), children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: 0, returnFocus: !isNested, closeOnFocusOut: true, guards: true, children: _jsx(Component, Object.assign({ ref: refs.setFloating, className: menuClasses, style: Object.assign(Object.assign({ minWidth: minWidth !== undefined ? `${minWidth}px` : undefined }, floatingStyles), style) }, getFloatingProps({
+                }, children: _jsx(FloatingList, { elementsRef: elementsRef, labelsRef: labelsRef, children: (isOpen || isMounted) && (_jsx(ConditionalWrap, { shouldWrap: isPortaled, wrap: (wrapChildren) => (_jsx(FloatingPortal, { root: portalTarget, children: wrapChildren })), children: _jsx(FloatingFocusManager, { context: context, modal: false, initialFocus: 0, returnFocus: !isNested, closeOnFocusOut: true, guards: true, children: _jsx(Component, Object.assign({ ref: refs.setFloating, className: menuClasses, style: Object.assign(Object.assign({ minWidth: minWidth !== undefined ? `${minWidth}px` : undefined }, floatingStyles), style) }, getFloatingProps({
                                 onKeyDown: handleFloatingKeyDown,
                             }), { children: children })) }) })) }) })] }));
 };