@neo4j-ndl/react 4.13.2 → 4.14.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (54) hide show
  1. package/lib/cjs/ai/response/Response.js +2 -2
  2. package/lib/cjs/ai/response/Response.js.map +1 -1
  3. package/lib/cjs/code-block/CodeBlock.js +68 -86
  4. package/lib/cjs/code-block/CodeBlock.js.map +1 -1
  5. package/lib/cjs/code-block/code-themes.js +23 -0
  6. package/lib/cjs/code-block/code-themes.js.map +1 -0
  7. package/lib/cjs/code-block/hooks/use-code-language.js +49 -0
  8. package/lib/cjs/code-block/hooks/use-code-language.js.map +1 -0
  9. package/lib/cjs/code-block/hooks/use-code-theme.js +62 -0
  10. package/lib/cjs/code-block/hooks/use-code-theme.js.map +1 -0
  11. package/lib/cjs/code-block/hooks/use-expandable.js +78 -0
  12. package/lib/cjs/code-block/hooks/use-expandable.js.map +1 -0
  13. package/lib/cjs/icons/generated/custom/GraphBuilder.js +30 -0
  14. package/lib/cjs/icons/generated/custom/GraphBuilder.js.map +1 -0
  15. package/lib/cjs/icons/generated/custom/index.js +5 -3
  16. package/lib/cjs/icons/generated/custom/index.js.map +1 -1
  17. package/lib/esm/ai/response/Response.js +2 -2
  18. package/lib/esm/ai/response/Response.js.map +1 -1
  19. package/lib/esm/code-block/CodeBlock.js +62 -80
  20. package/lib/esm/code-block/CodeBlock.js.map +1 -1
  21. package/lib/esm/code-block/code-themes.js +22 -0
  22. package/lib/esm/code-block/code-themes.js.map +1 -0
  23. package/lib/esm/code-block/hooks/use-code-language.js +45 -0
  24. package/lib/esm/code-block/hooks/use-code-language.js.map +1 -0
  25. package/lib/esm/code-block/hooks/use-code-theme.js +55 -0
  26. package/lib/esm/code-block/hooks/use-code-theme.js.map +1 -0
  27. package/lib/esm/code-block/hooks/use-expandable.js +74 -0
  28. package/lib/esm/code-block/hooks/use-expandable.js.map +1 -0
  29. package/lib/esm/icons/generated/custom/GraphBuilder.js +28 -0
  30. package/lib/esm/icons/generated/custom/GraphBuilder.js.map +1 -0
  31. package/lib/esm/icons/generated/custom/index.js +1 -0
  32. package/lib/esm/icons/generated/custom/index.js.map +1 -1
  33. package/lib/types/ai/response/Response.d.ts.map +1 -1
  34. package/lib/types/code-block/CodeBlock.d.ts +3 -1
  35. package/lib/types/code-block/CodeBlock.d.ts.map +1 -1
  36. package/lib/types/code-block/code-themes.d.ts +22 -0
  37. package/lib/types/code-block/code-themes.d.ts.map +1 -0
  38. package/lib/types/code-block/hooks/use-code-language.d.ts +27 -0
  39. package/lib/types/code-block/hooks/use-code-language.d.ts.map +1 -0
  40. package/lib/types/code-block/hooks/use-code-theme.d.ts +29 -0
  41. package/lib/types/code-block/hooks/use-code-theme.d.ts.map +1 -0
  42. package/lib/types/code-block/hooks/use-expandable.d.ts +34 -0
  43. package/lib/types/code-block/hooks/use-expandable.d.ts.map +1 -0
  44. package/lib/types/icons/generated/custom/GraphBuilder.d.ts +29 -0
  45. package/lib/types/icons/generated/custom/GraphBuilder.d.ts.map +1 -0
  46. package/lib/types/icons/generated/custom/index.d.ts +1 -0
  47. package/lib/types/icons/generated/custom/index.d.ts.map +1 -1
  48. package/package.json +5 -5
  49. package/lib/cjs/_common/CodeBlockWrapper.js +0 -105
  50. package/lib/cjs/_common/CodeBlockWrapper.js.map +0 -1
  51. package/lib/esm/_common/CodeBlockWrapper.js +0 -98
  52. package/lib/esm/_common/CodeBlockWrapper.js.map +0 -1
  53. package/lib/types/_common/CodeBlockWrapper.d.ts +0 -40
  54. package/lib/types/_common/CodeBlockWrapper.d.ts.map +0 -1
@@ -157,7 +157,7 @@ const Response = (0, react_2.memo)((_a) => {
157
157
  },
158
158
  code: (_a) => {
159
159
  var _b, _c, _d, _e;
160
- var { node, className, key, children: codeChildren } = _a, props = __rest(_a, ["node", "className", "key", "children"]);
160
+ var { node, className, children: codeChildren } = _a, props = __rest(_a, ["node", "className", "children"]);
161
161
  const isInline = ((_b = node === null || node === void 0 ? void 0 : node.position) === null || _b === void 0 ? void 0 : _b.start.line) === ((_c = node === null || node === void 0 ? void 0 : node.position) === null || _c === void 0 ? void 0 : _c.end.line);
162
162
  const nodeClassNamesRaw = (_d = node === null || node === void 0 ? void 0 : node.properties) === null || _d === void 0 ? void 0 : _d.className;
163
163
  const nodeClassNamesArray = [];
@@ -187,7 +187,7 @@ const Response = (0, react_2.memo)((_a) => {
187
187
  const hasUnclosedFence = fenceCount % 2 !== 0;
188
188
  // Show loading state when there's an unclosed fence (code block is streaming)
189
189
  const isCodeBlockLoading = hasUnclosedFence;
190
- return ((0, jsx_runtime_1.jsx)(code_preview_1.CodePreview, { code: codeChildren, isLoading: isCodeBlockLoading, language: language, className: className, htmlAttributes: Object.assign({}, props) }, key));
190
+ return ((0, jsx_runtime_1.jsx)(code_preview_1.CodePreview, { code: codeChildren, isLoading: isCodeBlockLoading, language: language, className: className, htmlAttributes: Object.assign({}, props) }, props.key));
191
191
  }
192
192
  else {
193
193
  return (0, jsx_runtime_1.jsx)("code", { className: className, children: codeChildren });
@@ -1 +1 @@
1
- {"version":3,"file":"Response.js","sourceRoot":"","sources":["../../../../src/ai/response/Response.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { Code, TextLink, Typography } from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { memo, useMemo, useRef } from 'react';\nimport { Streamdown } from 'streamdown';\n\nimport { type CommonProps } from '../../_common/types';\nimport { type LanguageProp, Languages } from '../../code-block/code-languages';\nimport { CodePreview } from '../code-preview';\n\ntype ResponseProps = {\n /** The response from the AI */\n children: string;\n /** Whether the response is animating */\n isAnimating?: React.ComponentProps<typeof Streamdown>['isAnimating'];\n};\n\n/**\n * The component is used to display the response from an LLM.\n * It handles markdown rendering and streaming.\n *\n * @alpha - Changes to this component may be breaking.\n */\nconst Response = memo(\n ({\n className,\n children,\n isAnimating = false,\n ref,\n style,\n htmlAttributes,\n ...restProps\n }: CommonProps<'div', ResponseProps>) => {\n // Use a ref to store the current markdown content so we can check for unclosed fences\n // without recreating the components object on every render\n const childrenRef = useRef(children);\n childrenRef.current = children;\n\n const components: React.ComponentProps<typeof Streamdown>['components'] =\n useMemo(\n () => ({\n // oxlint-disable-next-line no-unused-vars\n ol: ({ node, children, className, ...props }) => (\n <ol className={className} {...props}>\n {children}\n </ol>\n ),\n // oxlint-disable-next-line no-unused-vars\n ul: ({ node, children, className, ...props }) => (\n <ul className={classNames(className)} {...props}>\n {children}\n </ul>\n ),\n // oxlint-disable-next-line no-unused-vars\n li: ({ node, children, className, ...props }) => (\n <li className={className} {...props}>\n {children}\n </li>\n ),\n // oxlint-disable-next-line no-unused-vars\n hr: ({ node, className, ...props }) => (\n <hr className={classNames(className)} {...props} />\n ),\n // oxlint-disable-next-line no-unused-vars\n strong: ({ node, children, className, style, ...props }) => (\n <Typography\n as=\"strong\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontWeight: 'bold' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n em: ({ node, children, className, style, ...props }) => (\n <Typography\n as=\"em\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontStyle: 'italic' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n a: ({ node, children, className, href, ...props }) => (\n <TextLink\n type=\"internal-underline\"\n className={className}\n href={href}\n htmlAttributes={props}\n >\n {children}\n </TextLink>\n ),\n // oxlint-disable-next-line no-unused-vars\n h1: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h1\"\n variant=\"display\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h2: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h2\"\n variant=\"title-1\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h3: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h3\"\n variant=\"title-2\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h4: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h4\"\n variant=\"title-3\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h5: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h5\"\n variant=\"title-4\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h6: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h6\"\n variant=\"label\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n table: ({ node, children, className, ...props }) => (\n <div className=\"ndl-ai-response-table-wrapper\">\n <table className={className} {...props}>\n {children}\n </table>\n </div>\n ),\n // oxlint-disable-next-line no-unused-vars\n thead: ({ node, children, className, ...props }) => (\n <thead className={className} {...props}>\n {children}\n </thead>\n ),\n // oxlint-disable-next-line no-unused-vars\n tbody: ({ node, children, className, ...props }) => (\n <tbody className={className} {...props}>\n {children}\n </tbody>\n ),\n // oxlint-disable-next-line no-unused-vars\n tr: ({ node, children, className, ...props }) => (\n <tr className={className} {...props}>\n {children}\n </tr>\n ),\n // oxlint-disable-next-line no-unused-vars\n th: ({ node, children, className, ...props }) => (\n <th className={className} {...props}>\n {children}\n </th>\n ),\n // oxlint-disable-next-line no-unused-vars\n td: ({ node, children, className, ...props }) => (\n <td className={className} {...props}>\n {children}\n </td>\n ),\n // oxlint-disable-next-line no-unused-vars\n blockquote: ({ node, children, className, ...props }) => (\n <blockquote className={classNames(className)} {...props}>\n {children}\n </blockquote>\n ),\n code: ({\n node,\n className,\n key,\n children: codeChildren,\n ...props\n }) => {\n const isInline =\n node?.position?.start.line === node?.position?.end.line;\n\n const nodeClassNamesRaw = node?.properties?.className;\n const nodeClassNamesArray: string[] = [];\n\n if (typeof nodeClassNamesRaw === 'string') {\n nodeClassNamesArray.push.apply(\n nodeClassNamesArray,\n nodeClassNamesRaw.split(' '),\n );\n } else if (Array.isArray(nodeClassNamesRaw)) {\n nodeClassNamesArray.push.apply(\n nodeClassNamesArray,\n nodeClassNamesRaw as string[],\n );\n }\n\n let language: LanguageProp | 'text' = 'text';\n const rawLanguage = nodeClassNamesArray.find((string: string) =>\n string.startsWith('language-'),\n );\n if (rawLanguage !== undefined) {\n language =\n (rawLanguage.replace('language-', '') as LanguageProp) ??\n 'text';\n }\n language = (Languages as readonly string[]).includes(language)\n ? (language as LanguageProp)\n : 'text';\n if (isInline) {\n return (\n <Code\n isRunnable={false}\n className={className}\n htmlAttributes={props}\n >\n {codeChildren}\n </Code>\n );\n }\n if (typeof codeChildren === 'string') {\n // Check if code fences are balanced in the markdown\n // If there are an odd number of fences, it means there's an unclosed code block\n const fenceMatches = childrenRef.current.match(/```/g);\n const fenceCount = fenceMatches ? fenceMatches.length : 0;\n const hasUnclosedFence = fenceCount % 2 !== 0;\n\n // Show loading state when there's an unclosed fence (code block is streaming)\n const isCodeBlockLoading = hasUnclosedFence;\n return (\n <CodePreview\n key={key}\n code={codeChildren}\n isLoading={isCodeBlockLoading}\n language={language}\n className={className}\n htmlAttributes={{\n ...props,\n }}\n />\n );\n } else {\n return <code className={className}>{codeChildren}</code>;\n }\n },\n // oxlint-disable-next-line no-unused-vars\n pre: ({ node, className, children, ...props }) => {\n return (\n <pre className={className} {...props}>\n {children}\n </pre>\n );\n },\n // oxlint-disable-next-line no-unused-vars\n p: ({ node, children, className, ...props }) => (\n <Typography\n as=\"p\"\n variant=\"body-medium\"\n className={classNames(className)}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n img: ({ node, className, src, alt, ...props }) => (\n <img\n className={classNames(className)}\n src={src}\n alt={alt}\n {...props}\n />\n ),\n }),\n [],\n );\n\n return (\n <div\n ref={ref}\n style={style}\n className={classNames('ndl-ai-response', className)}\n {...restProps}\n {...htmlAttributes}\n >\n <Streamdown\n isAnimating={isAnimating}\n parseIncompleteMarkdown={isAnimating}\n components={components}\n >\n {children}\n </Streamdown>\n </div>\n );\n },\n (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n\nResponse.displayName = 'Response';\n\nexport { Response };\n"]}
1
+ {"version":3,"file":"Response.js","sourceRoot":"","sources":["../../../../src/ai/response/Response.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { Code, TextLink, Typography } from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { memo, useMemo, useRef } from 'react';\nimport { Streamdown } from 'streamdown';\n\nimport { type CommonProps } from '../../_common/types';\nimport { type LanguageProp, Languages } from '../../code-block/code-languages';\nimport { CodePreview } from '../code-preview';\n\ntype ResponseProps = {\n /** The response from the AI */\n children: string;\n /** Whether the response is animating */\n isAnimating?: React.ComponentProps<typeof Streamdown>['isAnimating'];\n};\n\n/**\n * The component is used to display the response from an LLM.\n * It handles markdown rendering and streaming.\n *\n * @alpha - Changes to this component may be breaking.\n */\nconst Response = memo(\n ({\n className,\n children,\n isAnimating = false,\n ref,\n style,\n htmlAttributes,\n ...restProps\n }: CommonProps<'div', ResponseProps>) => {\n // Use a ref to store the current markdown content so we can check for unclosed fences\n // without recreating the components object on every render\n const childrenRef = useRef(children);\n childrenRef.current = children;\n\n const components: React.ComponentProps<typeof Streamdown>['components'] =\n useMemo(\n () => ({\n // oxlint-disable-next-line no-unused-vars\n ol: ({ node, children, className, ...props }) => (\n <ol className={className} {...props}>\n {children}\n </ol>\n ),\n // oxlint-disable-next-line no-unused-vars\n ul: ({ node, children, className, ...props }) => (\n <ul className={classNames(className)} {...props}>\n {children}\n </ul>\n ),\n // oxlint-disable-next-line no-unused-vars\n li: ({ node, children, className, ...props }) => (\n <li className={className} {...props}>\n {children}\n </li>\n ),\n // oxlint-disable-next-line no-unused-vars\n hr: ({ node, className, ...props }) => (\n <hr className={classNames(className)} {...props} />\n ),\n // oxlint-disable-next-line no-unused-vars\n strong: ({ node, children, className, style, ...props }) => (\n <Typography\n as=\"strong\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontWeight: 'bold' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n em: ({ node, children, className, style, ...props }) => (\n <Typography\n as=\"em\"\n variant=\"body-medium\"\n className={className}\n style={{ ...style, fontStyle: 'italic' }}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n a: ({ node, children, className, href, ...props }) => (\n <TextLink\n type=\"internal-underline\"\n className={className}\n href={href}\n htmlAttributes={props}\n >\n {children}\n </TextLink>\n ),\n // oxlint-disable-next-line no-unused-vars\n h1: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h1\"\n variant=\"display\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h2: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h2\"\n variant=\"title-1\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h3: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h3\"\n variant=\"title-2\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h4: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h4\"\n variant=\"title-3\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h5: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h5\"\n variant=\"title-4\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n h6: ({ node, children, className, ...props }) => (\n <Typography\n as=\"h6\"\n variant=\"label\"\n className={className}\n htmlAttributes={{ ...props }}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n table: ({ node, children, className, ...props }) => (\n <div className=\"ndl-ai-response-table-wrapper\">\n <table className={className} {...props}>\n {children}\n </table>\n </div>\n ),\n // oxlint-disable-next-line no-unused-vars\n thead: ({ node, children, className, ...props }) => (\n <thead className={className} {...props}>\n {children}\n </thead>\n ),\n // oxlint-disable-next-line no-unused-vars\n tbody: ({ node, children, className, ...props }) => (\n <tbody className={className} {...props}>\n {children}\n </tbody>\n ),\n // oxlint-disable-next-line no-unused-vars\n tr: ({ node, children, className, ...props }) => (\n <tr className={className} {...props}>\n {children}\n </tr>\n ),\n // oxlint-disable-next-line no-unused-vars\n th: ({ node, children, className, ...props }) => (\n <th className={className} {...props}>\n {children}\n </th>\n ),\n // oxlint-disable-next-line no-unused-vars\n td: ({ node, children, className, ...props }) => (\n <td className={className} {...props}>\n {children}\n </td>\n ),\n // oxlint-disable-next-line no-unused-vars\n blockquote: ({ node, children, className, ...props }) => (\n <blockquote className={classNames(className)} {...props}>\n {children}\n </blockquote>\n ),\n code: ({ node, className, children: codeChildren, ...props }) => {\n const isInline =\n node?.position?.start.line === node?.position?.end.line;\n\n const nodeClassNamesRaw = node?.properties?.className;\n const nodeClassNamesArray: string[] = [];\n\n if (typeof nodeClassNamesRaw === 'string') {\n nodeClassNamesArray.push.apply(\n nodeClassNamesArray,\n nodeClassNamesRaw.split(' '),\n );\n } else if (Array.isArray(nodeClassNamesRaw)) {\n nodeClassNamesArray.push.apply(\n nodeClassNamesArray,\n nodeClassNamesRaw as string[],\n );\n }\n\n let language: LanguageProp | 'text' = 'text';\n const rawLanguage = nodeClassNamesArray.find((string: string) =>\n string.startsWith('language-'),\n );\n if (rawLanguage !== undefined) {\n language =\n (rawLanguage.replace('language-', '') as LanguageProp) ??\n 'text';\n }\n language = (Languages as readonly string[]).includes(language)\n ? (language as LanguageProp)\n : 'text';\n if (isInline) {\n return (\n <Code\n isRunnable={false}\n className={className}\n htmlAttributes={props}\n >\n {codeChildren}\n </Code>\n );\n }\n if (typeof codeChildren === 'string') {\n // Check if code fences are balanced in the markdown\n // If there are an odd number of fences, it means there's an unclosed code block\n const fenceMatches = childrenRef.current.match(/```/g);\n const fenceCount = fenceMatches ? fenceMatches.length : 0;\n const hasUnclosedFence = fenceCount % 2 !== 0;\n\n // Show loading state when there's an unclosed fence (code block is streaming)\n const isCodeBlockLoading = hasUnclosedFence;\n return (\n <CodePreview\n key={props.key}\n code={codeChildren}\n isLoading={isCodeBlockLoading}\n language={language}\n className={className}\n htmlAttributes={{\n ...props,\n }}\n />\n );\n } else {\n return <code className={className}>{codeChildren}</code>;\n }\n },\n // oxlint-disable-next-line no-unused-vars\n pre: ({ node, className, children, ...props }) => {\n return (\n <pre className={className} {...props}>\n {children}\n </pre>\n );\n },\n // oxlint-disable-next-line no-unused-vars\n p: ({ node, children, className, ...props }) => (\n <Typography\n as=\"p\"\n variant=\"body-medium\"\n className={classNames(className)}\n {...props}\n >\n {children}\n </Typography>\n ),\n // oxlint-disable-next-line no-unused-vars\n img: ({ node, className, src, alt, ...props }) => (\n <img\n className={classNames(className)}\n src={src}\n alt={alt}\n {...props}\n />\n ),\n }),\n [],\n );\n\n return (\n <div\n ref={ref}\n style={style}\n className={classNames('ndl-ai-response', className)}\n {...restProps}\n {...htmlAttributes}\n >\n <Streamdown\n isAnimating={isAnimating}\n parseIncompleteMarkdown={isAnimating}\n components={components}\n >\n {children}\n </Streamdown>\n </div>\n );\n },\n (prevProps, nextProps) => prevProps.children === nextProps.children,\n);\n\nResponse.displayName = 'Response';\n\nexport { Response };\n"]}
@@ -1,3 +1,21 @@
1
+ "use strict";
2
+ var __rest = (this && this.__rest) || function (s, e) {
3
+ var t = {};
4
+ for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
5
+ t[p] = s[p];
6
+ if (s != null && typeof Object.getOwnPropertySymbols === "function")
7
+ for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
8
+ if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
9
+ t[p[i]] = s[p[i]];
10
+ }
11
+ return t;
12
+ };
13
+ var __importDefault = (this && this.__importDefault) || function (mod) {
14
+ return (mod && mod.__esModule) ? mod : { "default": mod };
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ exports.CodeBlock = void 0;
18
+ const jsx_runtime_1 = require("react/jsx-runtime");
1
19
  /**
2
20
  *
3
21
  * Copyright (c) "Neo4j"
@@ -18,94 +36,58 @@
18
36
  * You should have received a copy of the GNU General Public License
19
37
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
20
38
  */
21
-
22
- "use strict";
23
- var __rest = (this && this.__rest) || function (s, e) {
24
- var t = {};
25
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
26
- t[p] = s[p];
27
- if (s != null && typeof Object.getOwnPropertySymbols === "function")
28
- for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
29
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
30
- t[p[i]] = s[p[i]];
31
- }
32
- return t;
33
- };
34
- var __importDefault = (this && this.__importDefault) || function (mod) {
35
- return (mod && mod.__esModule) ? mod : { "default": mod };
36
- };
37
- Object.defineProperty(exports, "__esModule", { value: true });
38
- exports.CodeBlock = void 0;
39
- const jsx_runtime_1 = require("react/jsx-runtime");
40
- const react_1 = require("react");
39
+ const classnames_1 = __importDefault(require("classnames"));
41
40
  const react_syntax_highlighter_1 = require("react-syntax-highlighter");
42
- const prism_1 = require("react-syntax-highlighter/dist/cjs/styles/prism");
43
- const CodeBlockWrapper_1 = require("../_common/CodeBlockWrapper");
44
- const theme_1 = require("../theme");
45
- const code_languages_1 = require("./code-languages");
46
- const ndl_code_dark_1 = __importDefault(require("./themes/ndl-code-dark"));
47
- const ndl_code_light_1 = __importDefault(require("./themes/ndl-code-light"));
41
+ const clean_icon_button_1 = require("../clean-icon-button");
42
+ const icons_1 = require("../icons");
43
+ const use_code_language_1 = require("./hooks/use-code-language");
44
+ const use_code_theme_1 = require("./hooks/use-code-theme");
45
+ const use_expandable_1 = require("./hooks/use-expandable");
46
+ const defaultElement = 'div';
48
47
  const CodeBlock = (_a) => {
49
- var { as, maxHeight, code, language, shouldShowLineNumbers, theme, heading, actions, isDisabled, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["as", "maxHeight", "code", "language", "shouldShowLineNumbers", "theme", "heading", "actions", "isDisabled", "className", "style", "htmlAttributes", "ref"]);
50
- const [shouldShowExpandButton, setShouldShowExpandButton] = (0, react_1.useState)(maxHeight !== undefined);
51
- const { theme: ndlTheme } = (0, theme_1.useNeedleTheme)();
52
- const [loadedLanguage, setLoadedLanguage] = (0, react_1.useState)(null);
53
- (0, react_1.useEffect)(() => {
54
- if (language === undefined || language === 'text') {
55
- setLoadedLanguage('text');
56
- return;
57
- }
58
- (0, code_languages_1.loadLanguage)(language)
59
- .then((module) => {
60
- react_syntax_highlighter_1.PrismLight.registerLanguage(language, module.default);
61
- setLoadedLanguage(language);
62
- })
63
- // TODO: add visual feedback for the user
64
- .catch((err) => console.error(err));
65
- }, [language]);
66
- const getTheme = () => {
67
- switch (theme) {
68
- case 'ndl-code-dark':
69
- return ndl_code_dark_1.default;
70
- case 'ndl-code-light':
71
- return ndl_code_light_1.default;
72
- case 'vs':
73
- return prism_1.vs;
74
- case 'base16-ateliersulphurpool.light':
75
- return prism_1.base16AteliersulphurpoolLight;
76
- case 'coy':
77
- return prism_1.coy;
78
- case 'duotone-light':
79
- return prism_1.duotoneLight;
80
- case 'ghcolors':
81
- return prism_1.ghcolors;
82
- case 'prism':
83
- return prism_1.prism;
84
- case 'solarizedlight':
85
- return prism_1.solarizedlight;
86
- default:
87
- return ndlTheme === 'light' ? ndl_code_light_1.default : ndl_code_dark_1.default;
88
- }
89
- };
90
- const calculateRightPadding = (() => {
91
- var _a;
92
- if (Boolean(heading) === false) {
93
- const expandButtonCount = shouldShowExpandButton ? 1 : 0;
94
- const actionCount = (_a = actions === null || actions === void 0 ? void 0 : actions.length) !== null && _a !== void 0 ? _a : 0;
95
- return Math.max(actionCount * 36, expandButtonCount * 36) + 8;
96
- }
97
- })();
98
- return ((0, jsx_runtime_1.jsx)(CodeBlockWrapper_1.CodeBlockWrapper, Object.assign({ as: as, className: className, style: style, ref: ref, maxHeight: maxHeight, code: code, heading: heading, isDisabled: isDisabled, actions: actions, shouldShowExpandButton: shouldShowExpandButton, setShouldShowExpandButton: setShouldShowExpandButton }, restProps, htmlAttributes, { children: (0, jsx_runtime_1.jsx)(react_syntax_highlighter_1.PrismLight, { language: loadedLanguage || 'text', style: Object.assign(Object.assign({}, getTheme()), { 'pre[class*="language-"]': {
99
- border: 0,
100
- color: 'var(--theme-color-neutral-text-default)',
101
- lineHeight: '1',
102
- padding: `0 ${calculateRightPadding !== null && calculateRightPadding !== void 0 ? calculateRightPadding : 0}px 0.75em 0.75em`,
103
- width: 'fit-content',
104
- } }),
105
- // Turn on 'shouldShowLineNumbers' & 'wrapLongLines' at the same time, the display is wrong
106
- // https://github.com/react-syntax-highlighter/react-syntax-highlighter/issues/402
107
- // wrapLongLines
108
- codeTagProps: { className: 'n-code' }, showLineNumbers: shouldShowLineNumbers, children: code }) })));
48
+ var _b, _c;
49
+ var { as, maxHeight, code, language, shouldShowLineNumbers, theme, heading, actions, isDisabled, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["as", "maxHeight", "code", "language", "shouldShowLineNumbers", "theme", "heading", "actions", "isDisabled", "className", "style", "htmlAttributes", "ref"])
50
+ // TODO: Should not be polymorphic (at least not defaulting to a button)
51
+ ;
52
+ const Component = as !== null && as !== void 0 ? as : defaultElement;
53
+ const { containerHeight, isExpanded, toggleExpand, hasOverflowingContent, ref: syntaxHighlighterWrapperRef, } = (0, use_expandable_1.useExpandable)(maxHeight, code);
54
+ const codeTheme = (0, use_code_theme_1.useCodeTheme)(theme);
55
+ const codeLanguage = (0, use_code_language_1.useCodeLanguage)(language);
56
+ const hasMaxHeight = maxHeight !== undefined;
57
+ const hasHeading = Boolean(heading);
58
+ const numberOfActions = (_b = actions === null || actions === void 0 ? void 0 : actions.length) !== null && _b !== void 0 ? _b : 0;
59
+ const shouldShowExpandButton = hasMaxHeight && hasOverflowingContent;
60
+ const rightPadding = hasHeading
61
+ ? 0
62
+ : Math.max(numberOfActions * 36, (shouldShowExpandButton ? 1 : 0) * 36) + 8;
63
+ return ((0, jsx_runtime_1.jsxs)(Component, Object.assign({ ref: ref, className: (0, classnames_1.default)('ndl-code-block-container', className), style: Object.assign({ height: containerHeight }, style) }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-h-full", children: [hasHeading && ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ndl-code-block-title', {
64
+ 'ndl-disabled': isDisabled,
65
+ }), style: {
66
+ maxWidth: `calc(100% - ${((_c = actions === null || actions === void 0 ? void 0 : actions.length) !== null && _c !== void 0 ? _c : 0) * 36 + 20}px)`,
67
+ }, "data-testid": "ndl-code-block-title", children: heading })), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ndl-code-content-container', {
68
+ 'ndl-disabled': isDisabled,
69
+ }), style: {
70
+ height: hasHeading ? 'calc(100% - 24px - 12px)' : '100%',
71
+ }, children: (0, jsx_runtime_1.jsx)("div", { ref: syntaxHighlighterWrapperRef, className: "ndl-highlight-wrapper", tabIndex: 0, role: "region", "aria-label": `Code content ${isDisabled ? '(disabled)' : ''}`, children: (0, jsx_runtime_1.jsx)(react_syntax_highlighter_1.PrismLight, { language: codeLanguage, style: Object.assign(Object.assign({}, codeTheme), { 'pre[class*="language-"]': {
72
+ border: 0,
73
+ color: 'var(--theme-color-neutral-text-default)',
74
+ lineHeight: '1',
75
+ padding: `0 ${rightPadding}px 0.75em 0.75em`,
76
+ width: 'fit-content',
77
+ } }), codeTagProps: { className: 'n-code' },
78
+ // Turn on 'shouldShowLineNumbers' & 'wrapLongLines' at the same time, the display is wrong
79
+ // https://github.com/react-syntax-highlighter/react-syntax-highlighter/issues/402
80
+ // wrapLongLines
81
+ showLineNumbers: shouldShowLineNumbers, children: code }) }) })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ndl-code-block-actions', {
82
+ 'ndl-disabled': isDisabled,
83
+ }), children: actions === null || actions === void 0 ? void 0 : actions.map((iconButtonProps, i) => {
84
+ var _a;
85
+ return ((0, jsx_runtime_1.jsx)(clean_icon_button_1.CleanIconButton, Object.assign({ isDisabled: isDisabled }, iconButtonProps, { description: `${(_a = iconButtonProps.description) !== null && _a !== void 0 ? _a : 'CodeBlock Action'}`, htmlAttributes: Object.assign({ 'data-testid': `ndl-action-button-${i}` }, iconButtonProps.htmlAttributes) }), i));
86
+ }) }), shouldShowExpandButton && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-code-block-expand-button", children: (0, jsx_runtime_1.jsx)(clean_icon_button_1.CleanIconButton, { description: isExpanded ? 'Collapse' : 'Expand', tooltipProps: {
87
+ root: {
88
+ shouldCloseOnReferenceClick: true,
89
+ },
90
+ }, onClick: toggleExpand, children: isExpanded ? (0, jsx_runtime_1.jsx)(icons_1.ChevronUpIconOutline, {}) : (0, jsx_runtime_1.jsx)(icons_1.ChevronDownIconOutline, {}) }) }))] })));
109
91
  };
110
92
  exports.CodeBlock = CodeBlock;
111
93
  //# sourceMappingURL=CodeBlock.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CodeBlock.js","sourceRoot":"","sources":["../../../src/code-block/CodeBlock.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 type React from 'react';\nimport { useEffect, useState } from 'react';\nimport { PrismLight as SyntaxHighlighter } from 'react-syntax-highlighter';\nimport {\n base16AteliersulphurpoolLight,\n coy,\n duotoneLight,\n ghcolors,\n prism,\n solarizedlight,\n vs,\n} from 'react-syntax-highlighter/dist/cjs/styles/prism';\n\nimport { CodeBlockWrapper } from '../_common/CodeBlockWrapper';\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { type IconButton } from '../icon-button';\nimport { useNeedleTheme } from '../theme';\nimport { type LanguageProp, loadLanguage } from './code-languages';\nimport ndlCodeDark from './themes/ndl-code-dark';\nimport ndlCodeLight from './themes/ndl-code-light';\n\ninterface CodeBlockProps {\n code: string;\n isDisabled?: boolean;\n maxHeight?: number;\n language: LanguageProp | 'text';\n shouldShowLineNumbers?: boolean;\n theme?:\n | 'vs'\n | 'base16-ateliersulphurpool.light'\n | 'coy'\n | 'duotone-light'\n | 'ghcolors'\n | 'prism'\n | 'solarizedlight'\n | 'ndl-code-dark'\n | 'ndl-code-light';\n heading?: React.ReactNode;\n actions?: React.ComponentProps<typeof IconButton<'button'>>[];\n}\n\nexport const CodeBlock = <T extends React.ElementType = 'button'>({\n as,\n maxHeight,\n code,\n language,\n shouldShowLineNumbers,\n theme,\n heading,\n actions,\n isDisabled,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, CodeBlockProps>) => {\n const [shouldShowExpandButton, setShouldShowExpandButton] = useState(\n maxHeight !== undefined,\n );\n\n const { theme: ndlTheme } = useNeedleTheme();\n const [loadedLanguage, setLoadedLanguage] = useState<\n LanguageProp | 'text' | null\n >(null);\n\n useEffect(() => {\n if (language === undefined || language === 'text') {\n setLoadedLanguage('text');\n return;\n }\n\n loadLanguage(language)\n .then((module) => {\n SyntaxHighlighter.registerLanguage(language, module.default);\n setLoadedLanguage(language);\n })\n // TODO: add visual feedback for the user\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 case 'vs':\n return vs;\n case 'base16-ateliersulphurpool.light':\n return base16AteliersulphurpoolLight;\n case 'coy':\n return coy;\n case 'duotone-light':\n return duotoneLight;\n case 'ghcolors':\n return ghcolors;\n case 'prism':\n return prism;\n case 'solarizedlight':\n return solarizedlight;\n default:\n return ndlTheme === 'light' ? ndlCodeLight : ndlCodeDark;\n }\n };\n const calculateRightPadding = (() => {\n if (Boolean(heading) === false) {\n const expandButtonCount = shouldShowExpandButton ? 1 : 0;\n const actionCount = actions?.length ?? 0;\n return Math.max(actionCount * 36, expandButtonCount * 36) + 8;\n }\n })();\n\n return (\n <CodeBlockWrapper\n as={as}\n className={className}\n style={style}\n ref={ref}\n maxHeight={maxHeight}\n code={code}\n heading={heading}\n isDisabled={isDisabled}\n actions={actions}\n shouldShowExpandButton={shouldShowExpandButton}\n setShouldShowExpandButton={setShouldShowExpandButton}\n {...restProps}\n {...htmlAttributes}\n >\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 padding: `0 ${calculateRightPadding ?? 0}px 0.75em 0.75em`,\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-code' }}\n showLineNumbers={shouldShowLineNumbers}\n >\n {code}\n </SyntaxHighlighter>\n </CodeBlockWrapper>\n );\n};\n"]}
1
+ {"version":3,"file":"CodeBlock.js","sourceRoot":"","sources":["../../../src/code-block/CodeBlock.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 classNames from 'classnames';\nimport type React from 'react';\nimport { PrismLight as SyntaxHighlighter } from 'react-syntax-highlighter';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { type IconButton } from '../icon-button';\nimport { ChevronDownIconOutline, ChevronUpIconOutline } from '../icons';\nimport { type LanguageProp } from './code-languages';\nimport { type CodeTheme } from './code-themes';\nimport { useCodeLanguage } from './hooks/use-code-language';\nimport { useCodeTheme } from './hooks/use-code-theme';\nimport { useExpandable } from './hooks/use-expandable';\n\ninterface CodeBlockProps {\n code: string;\n isDisabled?: boolean;\n maxHeight?: number;\n language: LanguageProp | 'text';\n shouldShowLineNumbers?: boolean;\n theme?: CodeTheme;\n heading?: React.ReactNode;\n actions?: React.ComponentProps<typeof IconButton<'button'>>[];\n}\n\nconst defaultElement = 'div';\n\nexport const CodeBlock = <T extends React.ElementType = 'button'>({\n as,\n maxHeight,\n code,\n language,\n shouldShowLineNumbers,\n theme,\n heading,\n actions,\n isDisabled,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n // TODO: Should not be polymorphic (at least not defaulting to a button)\n}: PolymorphicCommonProps<T, CodeBlockProps>) => {\n const Component: React.ElementType = as ?? defaultElement;\n\n const {\n containerHeight,\n isExpanded,\n toggleExpand,\n hasOverflowingContent,\n ref: syntaxHighlighterWrapperRef,\n } = useExpandable(maxHeight, code);\n const codeTheme = useCodeTheme(theme);\n const codeLanguage = useCodeLanguage(language);\n\n const hasMaxHeight = maxHeight !== undefined;\n const hasHeading = Boolean(heading);\n const numberOfActions = actions?.length ?? 0;\n\n const shouldShowExpandButton = hasMaxHeight && hasOverflowingContent;\n const rightPadding = hasHeading\n ? 0\n : Math.max(numberOfActions * 36, (shouldShowExpandButton ? 1 : 0) * 36) + 8;\n\n return (\n <Component\n ref={ref}\n className={classNames('ndl-code-block-container', className)}\n style={{ height: containerHeight, ...style }}\n {...restProps}\n {...htmlAttributes}\n >\n <div className=\"n-flex n-flex-col n-h-full\">\n {hasHeading && (\n <div\n className={classNames('ndl-code-block-title', {\n 'ndl-disabled': isDisabled,\n })}\n style={{\n maxWidth: `calc(100% - ${(actions?.length ?? 0) * 36 + 20}px)`,\n }}\n data-testid=\"ndl-code-block-title\"\n >\n {heading}\n </div>\n )}\n <div\n className={classNames('ndl-code-content-container', {\n 'ndl-disabled': isDisabled,\n })}\n style={{\n height: hasHeading ? 'calc(100% - 24px - 12px)' : '100%',\n }}\n >\n <div\n ref={syntaxHighlighterWrapperRef}\n className=\"ndl-highlight-wrapper\"\n tabIndex={0}\n role=\"region\"\n aria-label={`Code content ${isDisabled ? '(disabled)' : ''}`}\n >\n <SyntaxHighlighter\n language={codeLanguage}\n style={{\n ...codeTheme,\n 'pre[class*=\"language-\"]': {\n border: 0,\n color: 'var(--theme-color-neutral-text-default)',\n lineHeight: '1',\n padding: `0 ${rightPadding}px 0.75em 0.75em`,\n width: 'fit-content',\n },\n }}\n codeTagProps={{ className: 'n-code' }}\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 showLineNumbers={shouldShowLineNumbers}\n >\n {code}\n </SyntaxHighlighter>\n </div>\n </div>\n </div>\n <div\n className={classNames('ndl-code-block-actions', {\n 'ndl-disabled': isDisabled,\n })}\n >\n {actions?.map((iconButtonProps, i) => (\n <CleanIconButton\n key={i}\n isDisabled={isDisabled}\n {...iconButtonProps}\n description={`${iconButtonProps.description ?? 'CodeBlock Action'}`}\n htmlAttributes={{\n 'data-testid': `ndl-action-button-${i}`,\n ...iconButtonProps.htmlAttributes,\n }}\n />\n ))}\n </div>\n {shouldShowExpandButton && (\n <div className=\"ndl-code-block-expand-button\">\n <CleanIconButton\n description={isExpanded ? 'Collapse' : 'Expand'}\n tooltipProps={{\n root: {\n shouldCloseOnReferenceClick: true,\n },\n }}\n onClick={toggleExpand}\n >\n {isExpanded ? <ChevronUpIconOutline /> : <ChevronDownIconOutline />}\n </CleanIconButton>\n </div>\n )}\n </Component>\n );\n};\n"]}
@@ -0,0 +1,23 @@
1
+ "use strict";
2
+ /**
3
+ *
4
+ * Copyright (c) "Neo4j"
5
+ * Neo4j Sweden AB [http://neo4j.com]
6
+ *
7
+ * This file is part of Neo4j.
8
+ *
9
+ * Neo4j is free software: you can redistribute it and/or modify
10
+ * it under the terms of the GNU General Public License as published by
11
+ * the Free Software Foundation, either version 3 of the License, or
12
+ * (at your option) any later version.
13
+ *
14
+ * This program is distributed in the hope that it will be useful,
15
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
16
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
17
+ * GNU General Public License for more details.
18
+ *
19
+ * You should have received a copy of the GNU General Public License
20
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
21
+ */
22
+ Object.defineProperty(exports, "__esModule", { value: true });
23
+ //# sourceMappingURL=code-themes.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"code-themes.js","sourceRoot":"","sources":["../../../src/code-block/code-themes.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG","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 type CodeTheme =\n | 'vs'\n | 'base16-ateliersulphurpool.light'\n | 'coy'\n | 'duotone-light'\n | 'ghcolors'\n | 'prism'\n | 'solarizedlight'\n | 'ndl-code-dark'\n | 'ndl-code-light';\n"]}
@@ -0,0 +1,49 @@
1
+ "use strict";
2
+ /**
3
+ *
4
+ * Copyright (c) "Neo4j"
5
+ * Neo4j Sweden AB [http://neo4j.com]
6
+ *
7
+ * This file is part of Neo4j.
8
+ *
9
+ * Neo4j is free software: you can redistribute it and/or modify
10
+ * it under the terms of the GNU General Public License as published by
11
+ * the Free Software Foundation, either version 3 of the License, or
12
+ * (at your option) any later version.
13
+ *
14
+ * This program is distributed in the hope that it will be useful,
15
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
16
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
17
+ * GNU General Public License for more details.
18
+ *
19
+ * You should have received a copy of the GNU General Public License
20
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
21
+ */
22
+ Object.defineProperty(exports, "__esModule", { value: true });
23
+ exports.useCodeLanguage = void 0;
24
+ const react_1 = require("react");
25
+ const react_syntax_highlighter_1 = require("react-syntax-highlighter");
26
+ const code_languages_1 = require("../code-languages");
27
+ /**
28
+ * Load the code highlighting language for the given language.
29
+ * Defaults to 'text' if no language is provided.
30
+ */
31
+ const useCodeLanguage = (language) => {
32
+ const [loadedLanguage, setLoadedLanguage] = (0, react_1.useState)('text');
33
+ (0, react_1.useEffect)(() => {
34
+ if (language === undefined || language === 'text') {
35
+ setLoadedLanguage('text');
36
+ return;
37
+ }
38
+ (0, code_languages_1.loadLanguage)(language)
39
+ .then((module) => {
40
+ react_syntax_highlighter_1.PrismLight.registerLanguage(language, module.default);
41
+ setLoadedLanguage(language);
42
+ })
43
+ // TODO: add visual feedback for the user
44
+ .catch((err) => console.error(err));
45
+ }, [language]);
46
+ return loadedLanguage;
47
+ };
48
+ exports.useCodeLanguage = useCodeLanguage;
49
+ //# sourceMappingURL=use-code-language.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-code-language.js","sourceRoot":"","sources":["../../../../src/code-block/hooks/use-code-language.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAEH,iCAA4C;AAC5C,uEAA2E;AAE3E,sDAAoE;AAEpE;;;GAGG;AACI,MAAM,eAAe,GAAG,CAAC,QAAgC,EAAE,EAAE;IAClE,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,IAAA,gBAAQ,EAClD,MAAM,CACP,CAAC;IAEF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,QAAQ,KAAK,SAAS,IAAI,QAAQ,KAAK,MAAM,EAAE,CAAC;YAClD,iBAAiB,CAAC,MAAM,CAAC,CAAC;YAC1B,OAAO;QACT,CAAC;QAED,IAAA,6BAAY,EAAC,QAAQ,CAAC;aACnB,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE;YACf,qCAAiB,CAAC,gBAAgB,CAAC,QAAQ,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;YAC7D,iBAAiB,CAAC,QAAQ,CAAC,CAAC;QAC9B,CAAC,CAAC;YACF,yCAAyC;aACxC,KAAK,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC;IACxC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,OAAO,cAAc,CAAC;AACxB,CAAC,CAAC;AArBW,QAAA,eAAe,mBAqB1B","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 { useEffect, useState } from 'react';\nimport { PrismLight as SyntaxHighlighter } from 'react-syntax-highlighter';\n\nimport { type LanguageProp, loadLanguage } from '../code-languages';\n\n/**\n * Load the code highlighting language for the given language.\n * Defaults to 'text' if no language is provided.\n */\nexport const useCodeLanguage = (language?: LanguageProp | 'text') => {\n const [loadedLanguage, setLoadedLanguage] = useState<LanguageProp | 'text'>(\n 'text',\n );\n\n useEffect(() => {\n if (language === undefined || language === 'text') {\n setLoadedLanguage('text');\n return;\n }\n\n loadLanguage(language)\n .then((module) => {\n SyntaxHighlighter.registerLanguage(language, module.default);\n setLoadedLanguage(language);\n })\n // TODO: add visual feedback for the user\n .catch((err) => console.error(err));\n }, [language]);\n\n return loadedLanguage;\n};\n"]}
@@ -0,0 +1,62 @@
1
+ "use strict";
2
+ /**
3
+ *
4
+ * Copyright (c) "Neo4j"
5
+ * Neo4j Sweden AB [http://neo4j.com]
6
+ *
7
+ * This file is part of Neo4j.
8
+ *
9
+ * Neo4j is free software: you can redistribute it and/or modify
10
+ * it under the terms of the GNU General Public License as published by
11
+ * the Free Software Foundation, either version 3 of the License, or
12
+ * (at your option) any later version.
13
+ *
14
+ * This program is distributed in the hope that it will be useful,
15
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
16
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
17
+ * GNU General Public License for more details.
18
+ *
19
+ * You should have received a copy of the GNU General Public License
20
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
21
+ */
22
+ var __importDefault = (this && this.__importDefault) || function (mod) {
23
+ return (mod && mod.__esModule) ? mod : { "default": mod };
24
+ };
25
+ Object.defineProperty(exports, "__esModule", { value: true });
26
+ exports.useCodeTheme = void 0;
27
+ const prism_1 = require("react-syntax-highlighter/dist/cjs/styles/prism");
28
+ const theme_1 = require("../../theme");
29
+ const ndl_code_dark_1 = __importDefault(require("../themes/ndl-code-dark"));
30
+ const ndl_code_light_1 = __importDefault(require("../themes/ndl-code-light"));
31
+ /**
32
+ * The color themes that we support for the Prism code highlighting library.
33
+ */
34
+ const PRISM_CODE_THEMES = {
35
+ 'base16-ateliersulphurpool.light': prism_1.base16AteliersulphurpoolLight,
36
+ coy: prism_1.coy,
37
+ 'duotone-light': prism_1.duotoneLight,
38
+ ghcolors: prism_1.ghcolors,
39
+ 'ndl-code-dark': ndl_code_dark_1.default,
40
+ 'ndl-code-light': ndl_code_light_1.default,
41
+ prism: prism_1.prism,
42
+ solarizedlight: prism_1.solarizedlight,
43
+ vs: prism_1.vs,
44
+ };
45
+ /**
46
+ * Map the Needle theme to the corresponding Prism color theme.
47
+ */
48
+ const NEEDLE_CODE_THEMES = {
49
+ dark: ndl_code_dark_1.default,
50
+ light: ndl_code_light_1.default,
51
+ };
52
+ /**
53
+ * Get the Prism code color theme.
54
+ * Defaults to the appropriate Prism theme based on the Needle theme if no chosen theme is provided.
55
+ */
56
+ const useCodeTheme = (chosenTheme) => {
57
+ var _a;
58
+ const { theme: needleTheme } = (0, theme_1.useNeedleTheme)();
59
+ return ((_a = (chosenTheme && PRISM_CODE_THEMES[chosenTheme])) !== null && _a !== void 0 ? _a : NEEDLE_CODE_THEMES[needleTheme]);
60
+ };
61
+ exports.useCodeTheme = useCodeTheme;
62
+ //# sourceMappingURL=use-code-theme.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-code-theme.js","sourceRoot":"","sources":["../../../../src/code-block/hooks/use-code-theme.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAGH,0EAQwD;AAExD,uCAA6C;AAE7C,4EAAkD;AAClD,8EAAoD;AAIpD;;GAEG;AACH,MAAM,iBAAiB,GAAG;IACxB,iCAAiC,EAAE,qCAA6B;IAChE,GAAG,EAAH,WAAG;IACH,eAAe,EAAE,oBAAY;IAC7B,QAAQ,EAAR,gBAAQ;IACR,eAAe,EAAE,uBAAW;IAC5B,gBAAgB,EAAE,wBAAY;IAC9B,KAAK,EAAL,aAAK;IACL,cAAc,EAAd,sBAAc;IACd,EAAE,EAAF,UAAE;CACqC,CAAC;AAE1C;;GAEG;AACH,MAAM,kBAAkB,GAAG;IACzB,IAAI,EAAE,uBAAW;IACjB,KAAK,EAAE,wBAAY;CACX,CAAC;AAEX;;;GAGG;AACI,MAAM,YAAY,GAAG,CAAC,WAAkC,EAAE,EAAE;;IACjE,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,IAAA,sBAAc,GAAE,CAAC;IAChD,OAAO,CACL,MAAA,CAAC,WAAW,IAAI,iBAAiB,CAAC,WAAW,CAAC,CAAC,mCAC/C,kBAAkB,CAAC,WAAW,CAAC,CAChC,CAAC;AACJ,CAAC,CAAC;AANW,QAAA,YAAY,gBAMvB","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 { type SyntaxHighlighterProps } from 'react-syntax-highlighter';\nimport {\n base16AteliersulphurpoolLight,\n coy,\n duotoneLight,\n ghcolors,\n prism,\n solarizedlight,\n vs,\n} from 'react-syntax-highlighter/dist/cjs/styles/prism';\n\nimport { useNeedleTheme } from '../../theme';\nimport { type CodeTheme } from '../code-themes';\nimport ndlCodeDark from '../themes/ndl-code-dark';\nimport ndlCodeLight from '../themes/ndl-code-light';\n\ntype PrismTheme = SyntaxHighlighterProps['style'];\n\n/**\n * The color themes that we support for the Prism code highlighting library.\n */\nconst PRISM_CODE_THEMES = {\n 'base16-ateliersulphurpool.light': base16AteliersulphurpoolLight,\n coy,\n 'duotone-light': duotoneLight,\n ghcolors,\n 'ndl-code-dark': ndlCodeDark,\n 'ndl-code-light': ndlCodeLight,\n prism,\n solarizedlight,\n vs,\n} satisfies Record<CodeTheme, PrismTheme>;\n\n/**\n * Map the Needle theme to the corresponding Prism color theme.\n */\nconst NEEDLE_CODE_THEMES = {\n dark: ndlCodeDark,\n light: ndlCodeLight,\n} as const;\n\n/**\n * Get the Prism code color theme.\n * Defaults to the appropriate Prism theme based on the Needle theme if no chosen theme is provided.\n */\nexport const useCodeTheme = (chosenTheme: CodeTheme | undefined) => {\n const { theme: needleTheme } = useNeedleTheme();\n return (\n (chosenTheme && PRISM_CODE_THEMES[chosenTheme]) ??\n NEEDLE_CODE_THEMES[needleTheme]\n );\n};\n"]}
@@ -0,0 +1,78 @@
1
+ "use strict";
2
+ /**
3
+ *
4
+ * Copyright (c) "Neo4j"
5
+ * Neo4j Sweden AB [http://neo4j.com]
6
+ *
7
+ * This file is part of Neo4j.
8
+ *
9
+ * Neo4j is free software: you can redistribute it and/or modify
10
+ * it under the terms of the GNU General Public License as published by
11
+ * the Free Software Foundation, either version 3 of the License, or
12
+ * (at your option) any later version.
13
+ *
14
+ * This program is distributed in the hope that it will be useful,
15
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
16
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
17
+ * GNU General Public License for more details.
18
+ *
19
+ * You should have received a copy of the GNU General Public License
20
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
21
+ */
22
+ Object.defineProperty(exports, "__esModule", { value: true });
23
+ exports.useExpandable = void 0;
24
+ const react_1 = require("react");
25
+ /**
26
+ * A hook to manage the expandable state of a content container.
27
+ * @param maxHeight - The maximum height of the content container.
28
+ * @param dependency - A dependency to watch for changes.
29
+ * @returns An object containing the container height, whether the content is overflowing, and the expandable state.
30
+ */
31
+ const useExpandable = (maxHeight, dependency) => {
32
+ const ref = (0, react_1.useRef)(null);
33
+ const [containerHeight, setContainerHeight] = (0, react_1.useState)(`${maxHeight}px`);
34
+ const [isExpanded, setIsExpanded] = (0, react_1.useState)(maxHeight === undefined);
35
+ const [hasOverflowingContent, setHasOverflowingContent] = (0, react_1.useState)(false);
36
+ (0, react_1.useEffect)(() => {
37
+ var _a, _b, _c, _d;
38
+ if (((_b = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.scrollHeight) !== null && _b !== void 0 ? _b : 0) <= ((_d = (_c = ref.current) === null || _c === void 0 ? void 0 : _c.clientHeight) !== null && _d !== void 0 ? _d : 0)) {
39
+ setIsExpanded(true);
40
+ }
41
+ else {
42
+ setIsExpanded(false);
43
+ }
44
+ }, []);
45
+ (0, react_1.useLayoutEffect)(() => {
46
+ var _a, _b, _c, _d;
47
+ if (maxHeight === undefined) {
48
+ return;
49
+ }
50
+ if (((_b = (_a = ref.current) === null || _a === void 0 ? void 0 : _a.clientHeight) !== null && _b !== void 0 ? _b : 0) >= ((_d = (_c = ref.current) === null || _c === void 0 ? void 0 : _c.scrollHeight) !== null && _d !== void 0 ? _d : 0)) {
51
+ setContainerHeight(`fit-content`);
52
+ setHasOverflowingContent(false);
53
+ }
54
+ else {
55
+ setContainerHeight(`${maxHeight}px`);
56
+ setHasOverflowingContent(true);
57
+ }
58
+ }, [maxHeight, dependency]);
59
+ const toggleExpand = () => {
60
+ if (isExpanded) {
61
+ setContainerHeight(`${maxHeight}px`);
62
+ setIsExpanded(false);
63
+ }
64
+ else {
65
+ setContainerHeight(`fit-content`);
66
+ setIsExpanded(true);
67
+ }
68
+ };
69
+ return {
70
+ containerHeight,
71
+ hasOverflowingContent,
72
+ isExpanded,
73
+ ref,
74
+ toggleExpand,
75
+ };
76
+ };
77
+ exports.useExpandable = useExpandable;
78
+ //# sourceMappingURL=use-expandable.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-expandable.js","sourceRoot":"","sources":["../../../../src/code-block/hooks/use-expandable.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAEH,iCAAqE;AAErE;;;;;GAKG;AACI,MAAM,aAAa,GAAG,CAC3B,SAA6B,EAC7B,UAAmB,EACnB,EAAE;IACF,MAAM,GAAG,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IAEzC,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,IAAA,gBAAQ,EAAC,GAAG,SAAS,IAAI,CAAC,CAAC;IACzE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,gBAAQ,EAAC,SAAS,KAAK,SAAS,CAAC,CAAC;IACtE,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE1E,IAAA,iBAAS,EAAC,GAAG,EAAE;;QACb,IAAI,CAAC,MAAA,MAAA,GAAG,CAAC,OAAO,0CAAE,YAAY,mCAAI,CAAC,CAAC,IAAI,CAAC,MAAA,MAAA,GAAG,CAAC,OAAO,0CAAE,YAAY,mCAAI,CAAC,CAAC,EAAE,CAAC;YACzE,aAAa,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC;aAAM,CAAC;YACN,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,IAAA,uBAAe,EAAC,GAAG,EAAE;;QACnB,IAAI,SAAS,KAAK,SAAS,EAAE,CAAC;YAC5B,OAAO;QACT,CAAC;QAED,IAAI,CAAC,MAAA,MAAA,GAAG,CAAC,OAAO,0CAAE,YAAY,mCAAI,CAAC,CAAC,IAAI,CAAC,MAAA,MAAA,GAAG,CAAC,OAAO,0CAAE,YAAY,mCAAI,CAAC,CAAC,EAAE,CAAC;YACzE,kBAAkB,CAAC,aAAa,CAAC,CAAC;YAClC,wBAAwB,CAAC,KAAK,CAAC,CAAC;QAClC,CAAC;aAAM,CAAC;YACN,kBAAkB,CAAC,GAAG,SAAS,IAAI,CAAC,CAAC;YACrC,wBAAwB,CAAC,IAAI,CAAC,CAAC;QACjC,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IAE5B,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,IAAI,UAAU,EAAE,CAAC;YACf,kBAAkB,CAAC,GAAG,SAAS,IAAI,CAAC,CAAC;YACrC,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;aAAM,CAAC;YACN,kBAAkB,CAAC,aAAa,CAAC,CAAC;YAClC,aAAa,CAAC,IAAI,CAAC,CAAC;QACtB,CAAC;IACH,CAAC,CAAC;IAEF,OAAO;QACL,eAAe;QACf,qBAAqB;QACrB,UAAU;QACV,GAAG;QACH,YAAY;KACb,CAAC;AACJ,CAAC,CAAC;AAjDW,QAAA,aAAa,iBAiDxB","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 { useEffect, useLayoutEffect, useRef, useState } from 'react';\n\n/**\n * A hook to manage the expandable state of a content container.\n * @param maxHeight - The maximum height of the content container.\n * @param dependency - A dependency to watch for changes.\n * @returns An object containing the container height, whether the content is overflowing, and the expandable state.\n */\nexport const useExpandable = (\n maxHeight: number | undefined,\n dependency: unknown,\n) => {\n const ref = useRef<HTMLDivElement>(null);\n\n const [containerHeight, setContainerHeight] = useState(`${maxHeight}px`);\n const [isExpanded, setIsExpanded] = useState(maxHeight === undefined);\n const [hasOverflowingContent, setHasOverflowingContent] = useState(false);\n\n useEffect(() => {\n if ((ref.current?.scrollHeight ?? 0) <= (ref.current?.clientHeight ?? 0)) {\n setIsExpanded(true);\n } else {\n setIsExpanded(false);\n }\n }, []);\n\n useLayoutEffect(() => {\n if (maxHeight === undefined) {\n return;\n }\n\n if ((ref.current?.clientHeight ?? 0) >= (ref.current?.scrollHeight ?? 0)) {\n setContainerHeight(`fit-content`);\n setHasOverflowingContent(false);\n } else {\n setContainerHeight(`${maxHeight}px`);\n setHasOverflowingContent(true);\n }\n }, [maxHeight, dependency]);\n\n const toggleExpand = () => {\n if (isExpanded) {\n setContainerHeight(`${maxHeight}px`);\n setIsExpanded(false);\n } else {\n setContainerHeight(`fit-content`);\n setIsExpanded(true);\n }\n };\n\n return {\n containerHeight,\n hasOverflowingContent,\n isExpanded,\n ref,\n toggleExpand,\n };\n};\n"]}