@neo4j-ndl/react 4.5.10 → 4.6.0

package/lib/cjs/ai/code-preview/CodePreview.js

@@ -47,6 +47,7 @@ const ndl_code_light_1 = __importDefault(require("../../code-block/themes/ndl-co
  * The component is used to display code that is generated by an LLM.
  *
  * @alpha - Changes to this component may be breaking.
+ * @deprecated - Use <Preview /> with <Preview.Code /> instead.
  */
 const CodePreview = (_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"]);
@@ -74,7 +75,7 @@ const CodePreview = (_a) => {
                 return ndlTheme === 'light' ? ndl_code_light_1.default : ndl_code_dark_1.default;
         }
     };
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, style: style, className: (0, classnames_1.default)('ndl-ai-code-preview', className) }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-code-preview-header", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-code-preview-title", children: isLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.LoadingSpinner, { size: "medium" }), (0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "code", children: ["WRITING ", language.toUpperCase()] })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "code", children: [language.toUpperCase(), ' ', language.toLowerCase() === 'cypher' ? 'QUERY' : ''] }), label && ((0, jsx_runtime_1.jsx)(react_1.StatusLabel, { variant: label === 'write' ? 'warning' : 'info', size: "small", fill: "outlined", children: label }))] })) }), !isLoading && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-code-preview-actions", children: [(0, jsx_runtime_1.jsx)(react_1.ClipboardButton, { textToCopy: code, type: "clean-icon-button", size: "small" }), headerActions] }))] }), !isLoading && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-code-preview-content", children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-code-content-container", children: (0, jsx_runtime_1.jsx)(react_syntax_highlighter_1.PrismLight, { language: loadedLanguage !== null && loadedLanguage !== void 0 ? loadedLanguage : 'text', style: Object.assign(Object.assign({}, getTheme()), { 'pre[class*="language-"]': {
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, style: style, className: (0, classnames_1.default)('ndl-ai-code-preview', className) }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-code-preview-header", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-code-preview-title", children: isLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.LoadingSpinner, { size: "medium" }), (0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "code", children: ["WRITING ", language.toUpperCase()] })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "code", children: [language.toUpperCase(), ' ', language.toLowerCase() === 'cypher' ? 'QUERY' : ''] }), label && ((0, jsx_runtime_1.jsx)(react_1.StatusLabel, { variant: label === 'write' ? 'warning' : 'info', size: "small", fill: "semi-filled", children: label }))] })) }), !isLoading && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-code-preview-actions", children: [(0, jsx_runtime_1.jsx)(react_1.ClipboardButton, { textToCopy: code, type: "clean-icon-button", size: "small" }), headerActions] }))] }), !isLoading && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-code-preview-content", children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-code-content-container", children: (0, jsx_runtime_1.jsx)(react_syntax_highlighter_1.PrismLight, { 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/cjs/ai/code-preview/CodePreview.js.map

@@ -1 +1 @@
-{"version":3,"file":"CodePreview.js","sourceRoot":"","sources":["../../../../src/ai/code-preview/CodePreview.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';\n\ntype CodePreviewProps = {\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 CleanIconButton components. */\n  headerActions?: React.ReactNode;\n  /** The theme of the code block */\n  theme?: 'ndl-code-dark' | 'ndl-code-light';\n};\n\n/**\n * The component is used to display code that is generated by an LLM.\n *\n * @alpha - Changes to this component may be breaking.\n */\nexport const CodePreview = ({\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', CodePreviewProps>) => {\n  const [loadedLanguage, setLoadedLanguage] = useState<\n    CodePreviewProps['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-code-preview', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {/* Header */}\n      <div className=\"ndl-ai-code-preview-header\">\n        <div className=\"ndl-ai-code-preview-title\">\n          {isLoading ? (\n            <>\n              <LoadingSpinner size=\"medium\" />\n              <Typography variant=\"code\">\n                WRITING {language.toUpperCase()}\n              </Typography>\n            </>\n          ) : (\n            <>\n              <Typography variant=\"code\">\n                {language.toUpperCase()}{' '}\n                {language.toLowerCase() === 'cypher' ? 'QUERY' : ''}\n              </Typography>\n              {label && (\n                <StatusLabel\n                  variant={label === 'write' ? 'warning' : 'info'}\n                  size=\"small\"\n                  fill=\"outlined\"\n                >\n                  {label}\n                </StatusLabel>\n              )}\n            </>\n          )}\n        </div>\n\n        {!isLoading && (\n          <div className=\"ndl-ai-code-preview-actions\">\n            <ClipboardButton\n              textToCopy={code}\n              type=\"clean-icon-button\"\n              size=\"small\"\n            />\n            {headerActions}\n          </div>\n        )}\n      </div>\n\n      {!isLoading && (\n        <div className=\"ndl-ai-code-preview-content\">\n          <div className=\"ndl-code-content-container\">\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-code-preview' }}\n              showLineNumbers={false}\n            >\n              {code}\n            </SyntaxHighlighter>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"CodePreview.js","sourceRoot":"","sources":["../../../../src/ai/code-preview/CodePreview.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';\n\ntype CodePreviewProps = {\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 CleanIconButton components. */\n  headerActions?: React.ReactNode;\n  /** The theme of the code block */\n  theme?: 'ndl-code-dark' | 'ndl-code-light';\n};\n\n/**\n * The component is used to display code that is generated by an LLM.\n *\n * @alpha - Changes to this component may be breaking.\n * @deprecated - Use <Preview /> with <Preview.Code /> instead.\n */\nexport const CodePreview = ({\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', CodePreviewProps>) => {\n  const [loadedLanguage, setLoadedLanguage] = useState<\n    CodePreviewProps['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-code-preview', className)}\n      {...restProps}\n      {...htmlAttributes}\n    >\n      {/* Header */}\n      <div className=\"ndl-ai-code-preview-header\">\n        <div className=\"ndl-ai-code-preview-title\">\n          {isLoading ? (\n            <>\n              <LoadingSpinner size=\"medium\" />\n              <Typography variant=\"code\">\n                WRITING {language.toUpperCase()}\n              </Typography>\n            </>\n          ) : (\n            <>\n              <Typography variant=\"code\">\n                {language.toUpperCase()}{' '}\n                {language.toLowerCase() === 'cypher' ? 'QUERY' : ''}\n              </Typography>\n              {label && (\n                <StatusLabel\n                  variant={label === 'write' ? 'warning' : 'info'}\n                  size=\"small\"\n                  fill=\"semi-filled\"\n                >\n                  {label}\n                </StatusLabel>\n              )}\n            </>\n          )}\n        </div>\n\n        {!isLoading && (\n          <div className=\"ndl-ai-code-preview-actions\">\n            <ClipboardButton\n              textToCopy={code}\n              type=\"clean-icon-button\"\n              size=\"small\"\n            />\n            {headerActions}\n          </div>\n        )}\n      </div>\n\n      {!isLoading && (\n        <div className=\"ndl-ai-code-preview-content\">\n          <div className=\"ndl-code-content-container\">\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-code-preview' }}\n              showLineNumbers={false}\n            >\n              {code}\n            </SyntaxHighlighter>\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n"]}

package/lib/cjs/ai/index.js

@@ -20,7 +20,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CodePreview = exports.ToolCall = exports.Reasoning = exports.Thinking = exports.Suggestion = exports.Response = exports.ImageTag = exports.FileTag = exports.MoreFiles = exports.UserBubble = exports.Prompt = exports.Presence = void 0;
+exports.Preview = exports.CodePreview = exports.ToolCall = exports.Reasoning = exports.Thinking = exports.Suggestion = exports.Response = exports.ImageTag = exports.FileTag = exports.MoreFiles = exports.UserBubble = exports.Prompt = exports.Presence = void 0;
 var presence_1 = require("./presence");
 Object.defineProperty(exports, "Presence", { enumerable: true, get: function () { return presence_1.Presence; } });
 var prompt_1 = require("./prompt");
@@ -45,4 +45,6 @@ var tool_call_1 = require("./tool-call");
 Object.defineProperty(exports, "ToolCall", { enumerable: true, get: function () { return tool_call_1.ToolCall; } });
 var code_preview_1 = require("./code-preview");
 Object.defineProperty(exports, "CodePreview", { enumerable: true, get: function () { return code_preview_1.CodePreview; } });
+var preview_1 = require("./preview");
+Object.defineProperty(exports, "Preview", { enumerable: true, get: function () { return preview_1.Preview; } });
 //# sourceMappingURL=index.js.map

package/lib/cjs/ai/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ai/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAEH,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,mCAAkC;AAAzB,gGAAA,MAAM,OAAA;AACf,6CAA2C;AAAlC,yGAAA,UAAU,OAAA;AACnB,2CAAyC;AAAhC,uGAAA,SAAS,OAAA;AAClB,uCAAqC;AAA5B,mGAAA,OAAO,OAAA;AAChB,yCAAuC;AAA9B,qGAAA,QAAQ,OAAA;AACjB,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,2CAA0C;AAAjC,wGAAA,UAAU,OAAA;AACnB,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,yCAAwC;AAA/B,sGAAA,SAAS,OAAA;AAClB,yCAAuC;AAA9B,qGAAA,QAAQ,OAAA;AACjB,+CAA6C;AAApC,2GAAA,WAAW,OAAA","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 { Presence } from './presence';\nexport { Prompt } from './prompt';\nexport { UserBubble } from './user-bubble';\nexport { MoreFiles } from './more-files';\nexport { FileTag } from './file-tag';\nexport { ImageTag } from './image-tag';\nexport { Response } from './response';\nexport { Suggestion } from './suggestion';\nexport { Thinking } from './thinking';\nexport { Reasoning } from './reasoning';\nexport { ToolCall } from './tool-call';\nexport { CodePreview } from './code-preview';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/ai/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAEH,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,mCAAkC;AAAzB,gGAAA,MAAM,OAAA;AACf,6CAA2C;AAAlC,yGAAA,UAAU,OAAA;AACnB,2CAAyC;AAAhC,uGAAA,SAAS,OAAA;AAClB,uCAAqC;AAA5B,mGAAA,OAAO,OAAA;AAChB,yCAAuC;AAA9B,qGAAA,QAAQ,OAAA;AACjB,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,2CAA0C;AAAjC,wGAAA,UAAU,OAAA;AACnB,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,yCAAwC;AAA/B,sGAAA,SAAS,OAAA;AAClB,yCAAuC;AAA9B,qGAAA,QAAQ,OAAA;AACjB,+CAA6C;AAApC,2GAAA,WAAW,OAAA;AACpB,qCAAoC;AAA3B,kGAAA,OAAO,OAAA","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 { Presence } from './presence';\nexport { Prompt } from './prompt';\nexport { UserBubble } from './user-bubble';\nexport { MoreFiles } from './more-files';\nexport { FileTag } from './file-tag';\nexport { ImageTag } from './image-tag';\nexport { Response } from './response';\nexport { Suggestion } from './suggestion';\nexport { Thinking } from './thinking';\nexport { Reasoning } from './reasoning';\nexport { ToolCall } from './tool-call';\nexport { CodePreview } from './code-preview';\nexport { Preview } from './preview';\n"]}

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

@@ -0,0 +1,111 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Preview = void 0;
+const jsx_runtime_1 = require("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/>.
+ */
+const react_1 = require("@neo4j-ndl/react");
+const icons_1 = require("@neo4j-ndl/react/icons");
+const classnames_1 = __importDefault(require("classnames"));
+const react_2 = require("react");
+const react_syntax_highlighter_1 = require("react-syntax-highlighter");
+const code_languages_1 = require("../../code-block/code-languages");
+const ndl_code_dark_1 = __importDefault(require("../../code-block/themes/ndl-code-dark"));
+const ndl_code_light_1 = __importDefault(require("../../code-block/themes/ndl-code-light"));
+/**
+ * Component to use for previewing certain content in AI chat applications.
+ *
+ * @alpha - Changes to this component may be breaking.
+ */
+const PreviewComponent = (_a) => {
+    var { children, ref, style, className, htmlAttributes } = _a, restProps = __rest(_a, ["children", "ref", "style", "className", "htmlAttributes"]);
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, style: style, className: (0, classnames_1.default)('ndl-ai-preview', className) }, restProps, htmlAttributes, { children: children })));
+};
+const PreviewHeader = (_a) => {
+    var { children, actions, ref, style, className, htmlAttributes } = _a, restProps = __rest(_a, ["children", "actions", "ref", "style", "className", "htmlAttributes"]);
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, style: style, className: (0, classnames_1.default)('ndl-ai-preview-header', className) }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "code", as: "div", className: "ndl-ai-preview-header-leading-content", children: children }), actions && ((0, jsx_runtime_1.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"]);
+    const classes = (0, classnames_1.default)('ndl-ai-preview-confirmation', className, {
+        'ndl-ai-preview-confirmation-footer': isFooter,
+    });
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [!(isFooter && status !== 'pending') && ((0, jsx_runtime_1.jsx)(react_1.Typography, { as: "div", variant: isFooter ? 'subheading-small' : 'body-medium', className: "ndl-ai-preview-confirmation-content", children: children })), (0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "body-medium", as: "div", className: "ndl-ai-preview-confirmation-actions", children: [status === 'pending' && actions, status === 'confirmed' && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-preview-confirmation-confirm-reject", children: [(0, jsx_runtime_1.jsx)(icons_1.CheckIconOutline, { className: "ndl-ai-preview-confirmation-action-icon" }), confirmedActionText] })), status === 'rejected' && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-preview-confirmation-confirm-reject", children: [(0, jsx_runtime_1.jsx)(icons_1.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"]);
+    const [loadedLanguage, setLoadedLanguage] = (0, react_2.useState)(null);
+    const { theme: ndlTheme } = (0, react_1.useNeedleTheme)();
+    (0, react_2.useEffect)(() => {
+        if (!language || !code_languages_1.Languages.includes(language)) {
+            setLoadedLanguage('text');
+            return;
+        }
+        (0, code_languages_1.loadLanguage)(language)
+            .then((module) => {
+            react_syntax_highlighter_1.PrismLight.registerLanguage(language, module.default);
+            setLoadedLanguage(language);
+        })
+            .catch((err) => console.error(err));
+    }, [language]);
+    const getTheme = () => {
+        switch (theme) {
+            case 'ndl-code-dark':
+                return ndl_code_dark_1.default;
+            case 'ndl-code-light':
+                return ndl_code_light_1.default;
+            default:
+                return ndlTheme === 'light' ? ndl_code_light_1.default : ndl_code_dark_1.default;
+        }
+    };
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, style: style, className: (0, classnames_1.default)('ndl-ai-preview-code', className) }, restProps, htmlAttributes, { children: [isLoading && ((0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-preview-code-loading", children: [(0, jsx_runtime_1.jsx)(react_1.LoadingSpinner, { size: "medium" }), (0, jsx_runtime_1.jsxs)(react_1.Typography, { variant: "code", children: ["WRITING ", language.toUpperCase()] })] })), !isLoading && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(PreviewHeader, { className: "ndl-ai-preview-code-header", actions: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.ClipboardButton, { textToCopy: code, type: "clean-icon-button", size: "small" }), headerActions] }), children: [language, " ", language.toLowerCase() === 'cypher' ? 'QUERY' : '', label && ((0, jsx_runtime_1.jsx)(react_1.StatusLabel, { variant: label === 'write' ? 'warning' : 'info', size: "small", fill: "semi-filled", children: label.toUpperCase() }))] }), (0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-preview-code-content", children: (0, jsx_runtime_1.jsx)(react_syntax_highlighter_1.PrismLight, { 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',
+                                    overflowX: 'auto',
+                                    padding: 'var(--space-12)',
+                                    width: 'fit-content',
+                                } }), 
+                            // Turn on 'shouldShowLineNumbers' & 'wrapLongLines' at the same time, the display is wrong
+                            // https://github.com/react-syntax-highlighter/react-syntax-highlighter/issues/402
+                            // wrapLongLines
+                            codeTagProps: { className: 'n-ai-preview-code' }, showLineNumbers: false, children: code }) })] }))] })));
+};
+exports.Preview = Object.assign(PreviewComponent, {
+    Code: PreviewCode,
+    Confirmation: PreviewConfirmation,
+    Header: PreviewHeader,
+});
+//# sourceMappingURL=Preview.js.map

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

@@ -0,0 +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 { CheckIconOutline, XMarkIconOutline } from '@neo4j-ndl/react/icons';\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';\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\nexport const Preview = Object.assign(PreviewComponent, {\n  Code: PreviewCode,\n  Confirmation: PreviewConfirmation,\n  Header: PreviewHeader,\n});\n"]}

package/lib/cjs/ai/preview/index.js

@@ -0,0 +1,38 @@
+"use strict";
+/**
+ *
+ *  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/>.
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Preview"), exports);
+//# sourceMappingURL=index.js.map

package/lib/cjs/ai/preview/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/ai/preview/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;;;;;;;;;;;AAEH,4CAA0B","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 * from './Preview';\n"]}

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

@@ -0,0 +1,56 @@
+"use strict";
+/**
+ *
+ *  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/>.
+ */
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PreviewCodeLanguagesSrc = exports.PreviewCodeWriteSrc = exports.PreviewCodeReadSrc = exports.PreviewCodeLoadingSrc = exports.PreviewCodeConfirmationSrc = exports.PreviewConfirmationStandaloneSrc = exports.PreviewDataGridSrc = exports.PreviewCodeLanguages = exports.PreviewCodeWrite = exports.PreviewCodeRead = exports.PreviewCodeLoading = exports.PreviewCodeConfirmation = exports.PreviewConfirmationStandalone = exports.PreviewDataGrid = void 0;
+var preview_data_grid_story_1 = require("./preview-data-grid.story");
+Object.defineProperty(exports, "PreviewDataGrid", { enumerable: true, get: function () { return __importDefault(preview_data_grid_story_1).default; } });
+var preview_confirmation_standalone_story_1 = require("./preview-confirmation-standalone.story");
+Object.defineProperty(exports, "PreviewConfirmationStandalone", { enumerable: true, get: function () { return __importDefault(preview_confirmation_standalone_story_1).default; } });
+var preview_code_confirmation_story_1 = require("./preview-code-confirmation.story");
+Object.defineProperty(exports, "PreviewCodeConfirmation", { enumerable: true, get: function () { return __importDefault(preview_code_confirmation_story_1).default; } });
+var preview_code_loading_story_1 = require("./preview-code-loading.story");
+Object.defineProperty(exports, "PreviewCodeLoading", { enumerable: true, get: function () { return __importDefault(preview_code_loading_story_1).default; } });
+var preview_code_read_story_1 = require("./preview-code-read.story");
+Object.defineProperty(exports, "PreviewCodeRead", { enumerable: true, get: function () { return __importDefault(preview_code_read_story_1).default; } });
+var preview_code_write_story_1 = require("./preview-code-write.story");
+Object.defineProperty(exports, "PreviewCodeWrite", { enumerable: true, get: function () { return __importDefault(preview_code_write_story_1).default; } });
+var preview_code_languages_story_1 = require("./preview-code-languages.story");
+Object.defineProperty(exports, "PreviewCodeLanguages", { enumerable: true, get: function () { return __importDefault(preview_code_languages_story_1).default; } });
+const export_stories_utils_1 = require("../../../_common/export-stories-utils");
+const preview_code_confirmation_story_raw_1 = __importDefault(require("./preview-code-confirmation.story?raw"));
+const preview_code_languages_story_raw_1 = __importDefault(require("./preview-code-languages.story?raw"));
+const preview_code_loading_story_raw_1 = __importDefault(require("./preview-code-loading.story?raw"));
+const preview_code_read_story_raw_1 = __importDefault(require("./preview-code-read.story?raw"));
+const preview_code_write_story_raw_1 = __importDefault(require("./preview-code-write.story?raw"));
+const preview_confirmation_standalone_story_raw_1 = __importDefault(require("./preview-confirmation-standalone.story?raw"));
+const preview_data_grid_story_raw_1 = __importDefault(require("./preview-data-grid.story?raw"));
+exports.PreviewDataGridSrc = (0, export_stories_utils_1.removeLicenseHeader)(preview_data_grid_story_raw_1.default);
+exports.PreviewConfirmationStandaloneSrc = (0, export_stories_utils_1.removeLicenseHeader)(preview_confirmation_standalone_story_raw_1.default);
+exports.PreviewCodeConfirmationSrc = (0, export_stories_utils_1.removeLicenseHeader)(preview_code_confirmation_story_raw_1.default);
+exports.PreviewCodeLoadingSrc = (0, export_stories_utils_1.removeLicenseHeader)(preview_code_loading_story_raw_1.default);
+exports.PreviewCodeReadSrc = (0, export_stories_utils_1.removeLicenseHeader)(preview_code_read_story_raw_1.default);
+exports.PreviewCodeWriteSrc = (0, export_stories_utils_1.removeLicenseHeader)(preview_code_write_story_raw_1.default);
+exports.PreviewCodeLanguagesSrc = (0, export_stories_utils_1.removeLicenseHeader)(preview_code_languages_story_raw_1.default);
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAEH,qEAAuE;AAA9D,2IAAA,OAAO,OAAmB;AACnC,iGAAmG;AAA1F,uKAAA,OAAO,OAAiC;AACjD,qFAAuF;AAA9E,2JAAA,OAAO,OAA2B;AAC3C,2EAA6E;AAApE,iJAAA,OAAO,OAAsB;AACtC,qEAAuE;AAA9D,2IAAA,OAAO,OAAmB;AACnC,uEAAyE;AAAhE,6IAAA,OAAO,OAAoB;AACpC,+EAAiF;AAAxE,qJAAA,OAAO,OAAwB;AAExC,gFAA4E;AAC5E,gHAAkF;AAClF,0GAA4E;AAC5E,sGAAwE;AACxE,gGAAkE;AAClE,kGAAoE;AACpE,4HAA8F;AAC9F,gGAAkE;AAErD,QAAA,kBAAkB,GAAG,IAAA,0CAAmB,EAAC,qCAAqB,CAAC,CAAC;AAChE,QAAA,gCAAgC,GAAG,IAAA,0CAAmB,EACjE,mDAAmC,CACpC,CAAC;AACW,QAAA,0BAA0B,GAAG,IAAA,0CAAmB,EAC3D,6CAA6B,CAC9B,CAAC;AACW,QAAA,qBAAqB,GAAG,IAAA,0CAAmB,EACtD,wCAAwB,CACzB,CAAC;AACW,QAAA,kBAAkB,GAAG,IAAA,0CAAmB,EAAC,qCAAqB,CAAC,CAAC;AAChE,QAAA,mBAAmB,GAAG,IAAA,0CAAmB,EAAC,sCAAsB,CAAC,CAAC;AAClE,QAAA,uBAAuB,GAAG,IAAA,0CAAmB,EACxD,0CAA0B,CAC3B,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';\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';\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);\n"]}

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

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("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/>.
+ */
+require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
+const react_1 = require("@neo4j-ndl/react");
+const ai_1 = require("@neo4j-ndl/react/ai");
+const react_2 = require("react");
+const cypherCode = `SHOW [ALL|BUILT IN|USER DEFINED] FUNCTION[S] EXECUTABLE BY
+username
+[YIELD { * | field[, ...] } [ORDER BY field ...`;
+const Component = () => {
+    const [status, setStatus] = (0, react_2.useState)('pending');
+    return ((0, jsx_runtime_1.jsxs)(ai_1.Preview, { children: [(0, jsx_runtime_1.jsx)(ai_1.Preview.Code, { code: cypherCode, language: "cypher", label: "write", isLoading: false, headerActions: null }), (0, jsx_runtime_1.jsx)(ai_1.Preview.Confirmation, { status: status, isFooter: true, confirmedActionText: "Action confirmed", rejectedActionText: "Action rejected", actions: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.OutlinedButton, { variant: "neutral", size: "small", onClick: () => setStatus('rejected'), children: "Skip" }), (0, jsx_runtime_1.jsx)(react_1.FilledButton, { variant: "primary", size: "small", onClick: () => setStatus('confirmed'), children: "Run query" })] }), children: "Assistant wants to run this query" })] }));
+};
+exports.default = Component;
+//# sourceMappingURL=preview-code-confirmation.story.js.map

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

@@ -0,0 +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,mDAAiD;AAEjD,4CAAgE;AAChE,4CAA8C;AAC9C,iCAAiC;AAEjC,MAAM,UAAU,GAAG;;gDAE6B,CAAC;AAEjD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GACvB,IAAA,gBAAQ,EACN,SAAS,CACV,CAAC;IAEJ,OAAO,CACL,wBAAC,YAAO,eACN,uBAAC,YAAO,CAAC,IAAI,IACX,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,QAAQ,EACjB,KAAK,EAAC,OAAO,EACb,SAAS,EAAE,KAAK,EAChB,aAAa,EAAE,IAAI,GACnB,EACF,uBAAC,YAAO,CAAC,YAAY,IACnB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,IAAI,EACd,mBAAmB,EAAC,kBAAkB,EACtC,kBAAkB,EAAC,iBAAiB,EACpC,OAAO,EACL,6DACE,uBAAC,sBAAc,IACb,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,GAAG,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,qBAGrB,EACjB,uBAAC,oBAAY,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,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, 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"]}

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

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("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/>.
+ */
+require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
+const ai_1 = require("@neo4j-ndl/react/ai");
+const pythonCode = `def show_functions(username, function_type='ALL'):
+    """
+    Show functions executable by user
+    """
+    query = f"SHOW {function_type} FUNCTIONS EXECUTABLE BY {username}"
+    return query`;
+const Component = () => {
+    return ((0, jsx_runtime_1.jsx)(ai_1.Preview, { children: (0, jsx_runtime_1.jsx)(ai_1.Preview.Code, { code: pythonCode, language: "python" }) }));
+};
+exports.default = Component;
+//# sourceMappingURL=preview-code-languages.story.js.map

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

@@ -0,0 +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,mDAAiD;AAEjD,4CAA8C;AAE9C,MAAM,UAAU,GAAG;;;;;iBAKF,CAAC;AAElB,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,uBAAC,YAAO,cACN,uBAAC,YAAO,CAAC,IAAI,IAAC,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAC,QAAQ,GAAG,GAC5C,CACX,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 { 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"]}

package/lib/cjs/ai/preview/stories/preview-code-loading.story.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("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/>.
+ */
+require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
+const ai_1 = require("@neo4j-ndl/react/ai");
+const Component = () => {
+    return ((0, jsx_runtime_1.jsx)(ai_1.Preview, { children: (0, jsx_runtime_1.jsx)(ai_1.Preview.Code, { code: "", language: "cypher", isLoading: true }) }));
+};
+exports.default = Component;
+//# sourceMappingURL=preview-code-loading.story.js.map

package/lib/cjs/ai/preview/stories/preview-code-loading.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-code-loading.story.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/preview-code-loading.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA8C;AAE9C,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,uBAAC,YAAO,cACN,uBAAC,YAAO,CAAC,IAAI,IAAC,IAAI,EAAC,EAAE,EAAC,QAAQ,EAAC,QAAQ,EAAC,SAAS,EAAE,IAAI,GAAI,GACnD,CACX,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 { Preview } from '@neo4j-ndl/react/ai';\n\nconst Component = () => {\n  return (\n    <Preview>\n      <Preview.Code code=\"\" language=\"cypher\" isLoading={true} />\n    </Preview>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/ai/preview/stories/preview-code-read.story.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("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/>.
+ */
+require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
+const react_1 = require("@neo4j-ndl/react");
+const ai_1 = require("@neo4j-ndl/react/ai");
+const icons_1 = require("@neo4j-ndl/react/icons");
+const cypherCode = `SHOW [ALL|BUILT IN|USER DEFINED] FUNCTION[S] EXECUTABLE BY
+username
+[YIELD { * | field[, ...] } [ORDER BY field ...`;
+const Component = () => {
+    return ((0, jsx_runtime_1.jsx)(ai_1.Preview, { children: (0, jsx_runtime_1.jsx)(ai_1.Preview.Code, { code: cypherCode, language: "cypher", label: "read", headerActions: (0, jsx_runtime_1.jsx)(react_1.OutlinedButton, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PencilSquareIconOutline, {}), variant: "neutral", size: "small", children: "Send to Query" }) }) }));
+};
+exports.default = Component;
+//# sourceMappingURL=preview-code-read.story.js.map

package/lib/cjs/ai/preview/stories/preview-code-read.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-code-read.story.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/preview-code-read.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAkD;AAClD,4CAA8C;AAC9C,kDAAiE;AAEjE,MAAM,UAAU,GAAG;;gDAE6B,CAAC;AAEjD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,uBAAC,YAAO,cACN,uBAAC,YAAO,CAAC,IAAI,IACX,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,QAAQ,EACjB,KAAK,EAAC,MAAM,EACZ,aAAa,EACX,uBAAC,sBAAc,IACb,aAAa,EAAE,uBAAC,+BAAuB,KAAG,EAC1C,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,OAAO,8BAGG,GAEnB,GACM,CACX,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 { 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        label=\"read\"\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/cjs/ai/preview/stories/preview-code-write.story.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("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/>.
+ */
+require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
+const react_1 = require("@neo4j-ndl/react");
+const ai_1 = require("@neo4j-ndl/react/ai");
+const icons_1 = require("@neo4j-ndl/react/icons");
+const cypherCode = `SHOW [ALL|BUILT IN|USER DEFINED] FUNCTION[S] EXECUTABLE BY
+username
+[YIELD { * | field[, ...] } [ORDER BY field ...`;
+const Component = () => {
+    return ((0, jsx_runtime_1.jsx)(ai_1.Preview, { children: (0, jsx_runtime_1.jsx)(ai_1.Preview.Code, { code: cypherCode, language: "cypher", label: "write", headerActions: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { variant: "neutral", description: "Send to Query", size: "small", children: (0, jsx_runtime_1.jsx)(icons_1.PencilSquareIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { variant: "neutral", description: "Run in Query", size: "small", children: (0, jsx_runtime_1.jsx)(icons_1.PlayCircleIconOutline, {}) })] }) }) }));
+};
+exports.default = Component;
+//# sourceMappingURL=preview-code-write.story.js.map

package/lib/cjs/ai/preview/stories/preview-code-write.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"preview-code-write.story.js","sourceRoot":"","sources":["../../../../../src/ai/preview/stories/preview-code-write.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAmD;AACnD,4CAA8C;AAC9C,kDAGgC;AAEhC,MAAM,UAAU,GAAG;;gDAE6B,CAAC;AAEjD,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,uBAAC,YAAO,cACN,uBAAC,YAAO,CAAC,IAAI,IACX,IAAI,EAAE,UAAU,EAChB,QAAQ,EAAC,QAAQ,EACjB,KAAK,EAAC,OAAO,EACb,aAAa,EACX,6DACE,uBAAC,uBAAe,IACd,OAAO,EAAC,SAAS,EACjB,WAAW,EAAC,eAAe,EAC3B,IAAI,EAAC,OAAO,YAEZ,uBAAC,+BAAuB,KAAG,GACX,EAClB,uBAAC,uBAAe,IACd,OAAO,EAAC,SAAS,EACjB,WAAW,EAAC,cAAc,EAC1B,IAAI,EAAC,OAAO,YAEZ,uBAAC,6BAAqB,KAAG,GACT,IACjB,GAEL,GACM,CACX,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 { CleanIconButton } from '@neo4j-ndl/react';\nimport { Preview } from '@neo4j-ndl/react/ai';\nimport {\n  PencilSquareIconOutline,\n  PlayCircleIconOutline,\n} 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        label=\"write\"\n        headerActions={\n          <>\n            <CleanIconButton\n              variant=\"neutral\"\n              description=\"Send to Query\"\n              size=\"small\"\n            >\n              <PencilSquareIconOutline />\n            </CleanIconButton>\n            <CleanIconButton\n              variant=\"neutral\"\n              description=\"Run in Query\"\n              size=\"small\"\n            >\n              <PlayCircleIconOutline />\n            </CleanIconButton>\n          </>\n        }\n      />\n    </Preview>\n  );\n};\n\nexport default Component;\n"]}