npm - @neo4j-ndl/react - Versions diffs - 4.21.1-alpha.b78fc61 → 4.21.2-alpha.585cb7c.16.1 - Mend

@neo4j-ndl/react 4.21.1-alpha.b78fc61 → 4.21.2-alpha.585cb7c.16.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 (141) hide show

package/lib/cjs/accordion/stories/accordion-full.story.js CHANGED Viewed

@@ -31,7 +31,7 @@ const Component = () => {
     ]);
     const onChange = (expandedItemIds) => setExpandedItemIds(expandedItemIds);
     const onExpandedChange = (hasExpanded) => console.info(`Expanded change: ${hasExpanded}`);
-    return ((0, jsx_runtime_1.jsxs)(react_1.Accordion, { expandedItemIds: expandedItemIds, isMultiple: true, onChange: onChange, children: [(0, jsx_runtime_1.jsx)(react_1.Accordion.CleanItem, { itemId: itemIds[0], title: `Accordion ${itemIds[0]}`, children: itemIds[0] }), (0, jsx_runtime_1.jsx)(react_1.Accordion.CleanItem, { arrowPosition: "trailing", isDisabled: false, itemId: itemIds[1], onExpandedChange: onExpandedChange, trailingContent: (0, jsx_runtime_1.jsx)(react_1.Checkbox, { label: "Right content" }), title: `Accordion ${itemIds[1]}`, titleTypographyVariant: "title-4", children: itemIds[1] }), (0, jsx_runtime_1.jsx)(react_1.Accordion.CleanItem, { itemId: itemIds[2], title: `Accordion ${itemIds[2]}`, children: itemIds[2] }), (0, jsx_runtime_1.jsx)(react_1.Accordion.CleanItem, { itemId: itemIds[3], title: `Accordion ${itemIds[3]}`, children: itemIds[3] })] }));
+    return ((0, jsx_runtime_1.jsxs)(react_1.Accordion, { expandedItemIds: expandedItemIds, isMultiple: true, onChange: onChange, children: [(0, jsx_runtime_1.jsx)(react_1.Accordion.CleanItem, { itemId: itemIds[0], title: `Accordion ${itemIds[0]}`, children: itemIds[0] }), (0, jsx_runtime_1.jsx)(react_1.Accordion.CleanItem, { arrowPosition: "trailing", isDisabled: false, itemId: itemIds[1], onExpandedChange: onExpandedChange, trailingContent: (0, jsx_runtime_1.jsx)(react_1.Checkbox, { label: "Right content" }), title: `Accordion ${itemIds[1]}`, titleTypographyVariant: "title-3", children: itemIds[1] }), (0, jsx_runtime_1.jsx)(react_1.Accordion.CleanItem, { itemId: itemIds[2], title: `Accordion ${itemIds[2]}`, children: itemIds[2] }), (0, jsx_runtime_1.jsx)(react_1.Accordion.CleanItem, { itemId: itemIds[3], title: `Accordion ${itemIds[3]}`, children: itemIds[3] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=accordion-full.story.js.map

package/lib/cjs/accordion/stories/accordion-full.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"accordion-full.story.js","sourceRoot":"","sources":["../../../../src/accordion/stories/accordion-full.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAuD;AACvD,iCAAiC;AAMjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,OAAO,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAEzD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,IAAA,gBAAQ,EAAoB;QACxE,OAAO,CAAC,CAAC,CAAC;KACX,CAAC,CAAC;IAEH,MAAM,QAAQ,GAAG,CAAC,eAAkC,EAAE,EAAE,CACtD,kBAAkB,CAAC,eAAe,CAAC,CAAC;IAEtC,MAAM,gBAAgB,GAAG,CAAC,WAAoB,EAAE,EAAE,CAChD,OAAO,CAAC,IAAI,CAAC,oBAAoB,WAAW,EAAE,CAAC,CAAC;IAElD,OAAO,CACL,wBAAC,iBAAS,IACR,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,IAAI,EAChB,QAAQ,EAAE,QAAQ,aAElB,uBAAC,iBAAS,CAAC,SAAS,IAClB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,EAClB,KAAK,EAAE,aAAa,OAAO,CAAC,CAAC,CAAC,EAAE,YAE/B,OAAO,CAAC,CAAC,CAAC,GACS,EACtB,uBAAC,iBAAS,CAAC,SAAS,IAClB,aAAa,EAAC,UAAU,EACxB,UAAU,EAAE,KAAK,EACjB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,EAClB,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,uBAAC,gBAAQ,IAAC,KAAK,EAAC,eAAe,GAAG,EACnD,KAAK,EAAE,aAAa,OAAO,CAAC,CAAC,CAAC,EAAE,EAChC,sBAAsB,EAAC,SAAS,YAE/B,OAAO,CAAC,CAAC,CAAC,GACS,EACtB,uBAAC,iBAAS,CAAC,SAAS,IAClB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,EAClB,KAAK,EAAE,aAAa,OAAO,CAAC,CAAC,CAAC,EAAE,YAE/B,OAAO,CAAC,CAAC,CAAC,GACS,EACtB,uBAAC,iBAAS,CAAC,SAAS,IAClB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,EAClB,KAAK,EAAE,aAAa,OAAO,CAAC,CAAC,CAAC,EAAE,YAE/B,OAAO,CAAC,CAAC,CAAC,GACS,IACZ,CACb,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 { Accordion, Checkbox } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\ntype AccordionItemId = React.ComponentProps<\n typeof Accordion.CleanItem\n>['itemId'];\n\nconst Component = () => {\n const itemIds = ['item-1', 'item-2', 'item-3', 'item-4'];\n\n const [expandedItemIds, setExpandedItemIds] = useState<AccordionItemId[]>([\n itemIds[1],\n ]);\n\n const onChange = (expandedItemIds: AccordionItemId[]) =>\n setExpandedItemIds(expandedItemIds);\n\n const onExpandedChange = (hasExpanded: boolean) =>\n console.info(`Expanded change: ${hasExpanded}`);\n\n return (\n <Accordion\n expandedItemIds={expandedItemIds}\n isMultiple={true}\n onChange={onChange}\n >\n <Accordion.CleanItem\n itemId={itemIds[0]}\n title={`Accordion ${itemIds[0]}`}\n >\n {itemIds[0]}\n </Accordion.CleanItem>\n <Accordion.CleanItem\n arrowPosition=\"trailing\"\n isDisabled={false}\n itemId={itemIds[1]}\n onExpandedChange={onExpandedChange}\n trailingContent={<Checkbox label=\"Right content\" />}\n title={`Accordion ${itemIds[1]}`}\n titleTypographyVariant=\"title-4\"\n >\n {itemIds[1]}\n </Accordion.CleanItem>\n <Accordion.CleanItem\n itemId={itemIds[2]}\n title={`Accordion ${itemIds[2]}`}\n >\n {itemIds[2]}\n </Accordion.CleanItem>\n <Accordion.CleanItem\n itemId={itemIds[3]}\n title={`Accordion ${itemIds[3]}`}\n >\n {itemIds[3]}\n </Accordion.CleanItem>\n </Accordion>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"accordion-full.story.js","sourceRoot":"","sources":["../../../../src/accordion/stories/accordion-full.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAuD;AACvD,iCAAiC;AAMjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,OAAO,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAEzD,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,IAAA,gBAAQ,EAAoB;QACxE,OAAO,CAAC,CAAC,CAAC;KACX,CAAC,CAAC;IAEH,MAAM,QAAQ,GAAG,CAAC,eAAkC,EAAE,EAAE,CACtD,kBAAkB,CAAC,eAAe,CAAC,CAAC;IAEtC,MAAM,gBAAgB,GAAG,CAAC,WAAoB,EAAE,EAAE,CAChD,OAAO,CAAC,IAAI,CAAC,oBAAoB,WAAW,EAAE,CAAC,CAAC;IAElD,OAAO,CACL,wBAAC,iBAAS,IACR,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,IAAI,EAChB,QAAQ,EAAE,QAAQ,aAElB,uBAAC,iBAAS,CAAC,SAAS,IAClB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,EAClB,KAAK,EAAE,aAAa,OAAO,CAAC,CAAC,CAAC,EAAE,YAE/B,OAAO,CAAC,CAAC,CAAC,GACS,EACtB,uBAAC,iBAAS,CAAC,SAAS,IAClB,aAAa,EAAC,UAAU,EACxB,UAAU,EAAE,KAAK,EACjB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,EAClB,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,uBAAC,gBAAQ,IAAC,KAAK,EAAC,eAAe,GAAG,EACnD,KAAK,EAAE,aAAa,OAAO,CAAC,CAAC,CAAC,EAAE,EAChC,sBAAsB,EAAC,SAAS,YAE/B,OAAO,CAAC,CAAC,CAAC,GACS,EACtB,uBAAC,iBAAS,CAAC,SAAS,IAClB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,EAClB,KAAK,EAAE,aAAa,OAAO,CAAC,CAAC,CAAC,EAAE,YAE/B,OAAO,CAAC,CAAC,CAAC,GACS,EACtB,uBAAC,iBAAS,CAAC,SAAS,IAClB,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC,EAClB,KAAK,EAAE,aAAa,OAAO,CAAC,CAAC,CAAC,EAAE,YAE/B,OAAO,CAAC,CAAC,CAAC,GACS,IACZ,CACb,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 { Accordion, Checkbox } from '@neo4j-ndl/react';\nimport { useState } from 'react';\n\ntype AccordionItemId = React.ComponentProps<\n typeof Accordion.CleanItem\n>['itemId'];\n\nconst Component = () => {\n const itemIds = ['item-1', 'item-2', 'item-3', 'item-4'];\n\n const [expandedItemIds, setExpandedItemIds] = useState<AccordionItemId[]>([\n itemIds[1],\n ]);\n\n const onChange = (expandedItemIds: AccordionItemId[]) =>\n setExpandedItemIds(expandedItemIds);\n\n const onExpandedChange = (hasExpanded: boolean) =>\n console.info(`Expanded change: ${hasExpanded}`);\n\n return (\n <Accordion\n expandedItemIds={expandedItemIds}\n isMultiple={true}\n onChange={onChange}\n >\n <Accordion.CleanItem\n itemId={itemIds[0]}\n title={`Accordion ${itemIds[0]}`}\n >\n {itemIds[0]}\n </Accordion.CleanItem>\n <Accordion.CleanItem\n arrowPosition=\"trailing\"\n isDisabled={false}\n itemId={itemIds[1]}\n onExpandedChange={onExpandedChange}\n trailingContent={<Checkbox label=\"Right content\" />}\n title={`Accordion ${itemIds[1]}`}\n titleTypographyVariant=\"title-3\"\n >\n {itemIds[1]}\n </Accordion.CleanItem>\n <Accordion.CleanItem\n itemId={itemIds[2]}\n title={`Accordion ${itemIds[2]}`}\n >\n {itemIds[2]}\n </Accordion.CleanItem>\n <Accordion.CleanItem\n itemId={itemIds[3]}\n title={`Accordion ${itemIds[3]}`}\n >\n {itemIds[3]}\n </Accordion.CleanItem>\n </Accordion>\n );\n};\n\nexport default Component;\n"]}

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

@@ -64,7 +64,7 @@ const PreviewConfirmation = (_a) => {
     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)(CheckIconOutline_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)(XMarkIconOutline_1.XMarkIconOutline, { className: "ndl-ai-preview-confirmation-action-icon" }), rejectedActionText] }))] })] })));
+    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-medium' : '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)(CheckIconOutline_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)(XMarkIconOutline_1.XMarkIconOutline, { className: "ndl-ai-preview-confirmation-action-icon" }), rejectedActionText] }))] })] })));
 };
 const PreviewCode = (_a) => {
     var { code, language, label, isLoading = false, headerActions, theme, heading, ref, style, className, htmlAttributes } = _a, restProps = __rest(_a, ["code", "language", "label", "isLoading", "headerActions", "theme", "heading", "ref", "style", "className", "htmlAttributes"]);

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

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

package/lib/cjs/ai/reasoning/Reasoning.js CHANGED Viewed

@@ -56,7 +56,7 @@ const ReasoningComponent = (_a) => {
     const buttonId = (0, react_2.useId)();
     const panelId = (0, react_2.useId)();
     const { value: thinkingDuration, unit } = (0, thinking_duration_formatter_1.formatThinkingDuration)(thinkingMs);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsx)(react_1.Typography, Object.assign({ variant: "title-4", className: (0, classnames_1.default)('ndl-ai-reasoning-header', {
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsx)(react_1.Typography, Object.assign({ variant: "title-3", className: (0, classnames_1.default)('ndl-ai-reasoning-header', {
                     'ndl-expanded': isExpanded,
                 }) }, (!isThinking
                 ? {
@@ -78,7 +78,7 @@ const ReasoningComponent = (_a) => {
 const Section = (_a) => {
     var { heading, leadingVisual, children, className, style, htmlAttributes, ref, isExpanded: _isExpanded, isDefaultExpanded: _isDefaultExpanded, onExpandChange: _onExpandChange } = _a, restProps = __rest(_a, ["heading", "leadingVisual", "children", "className", "style", "htmlAttributes", "ref", "isExpanded", "isDefaultExpanded", "onExpandChange"]);
     const classes = (0, classnames_1.default)('ndl-ai-reasoning-section', className);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-reasoning-section-header", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-leading", children: leadingVisual }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "subheading-small", children: heading })] }), (0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-reasoning-section-content", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-content-line-container", children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-content-line" }) }), (0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-content-children", children: children })] })] })));
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-reasoning-section-header", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-leading", children: leadingVisual }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "subheading-medium", children: heading })] }), (0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-reasoning-section-content", children: [(0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-content-line-container", children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-content-line" }) }), (0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-content-children", children: children })] })] })));
 };
 const Footer = (_a) => {
     var { children, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["children", "className", "style", "htmlAttributes", "ref"]);

package/lib/cjs/ai/reasoning/Reasoning.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Reasoning.js","sourceRoot":"","sources":["../../../../src/ai/reasoning/Reasoning.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,4CAA8C;AAC9C,4DAAoC;AACpC,iCAAwC;AAGxC,mGAAgG;AAChG,0CAAuC;AACvC,yFAAiF;AAajF;;;;;GAKG;AACH,MAAM,kBAAkB,GAAG,CAAC,EAUS,EAAE,EAAE;QAVb,EAC1B,UAAU,GAAG,IAAI,EACjB,UAAU,GAAG,IAAI,EACjB,aAAa,GAAG,UAAU,EAC1B,QAAQ,EACR,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,OAEgC,EADhC,SAAS,cATc,wGAU3B,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,kBAAkB,EAAE,SAAS,CAAC,CAAC;IAC1D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IACpD,MAAM,kBAAkB,GAAG,UAAU,IAAI,UAAU,KAAK,KAAK,CAAC;IAC9D,MAAM,QAAQ,GAAG,IAAA,aAAK,GAAE,CAAC;IACzB,MAAM,OAAO,GAAG,IAAA,aAAK,GAAE,CAAC;IAExB,MAAM,EAAE,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,GAAG,IAAA,oDAAsB,EAAC,UAAU,CAAC,CAAC;IAE7E,OAAO,CACL,+CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,eAElB,uBAAC,kBAAU,kBACT,OAAO,EAAC,SAAS,EACjB,SAAS,EAAE,IAAA,oBAAU,EAAC,yBAAyB,EAAE;oBAC/C,cAAc,EAAE,UAAU;iBAC3B,CAAC,IACE,CAAC,CAAC,UAAU;gBACd,CAAC,CAAC;oBACE,EAAE,EAAE,QAAQ;oBACZ,cAAc,EAAE;wBACd,eAAe,EAAE,OAAO;wBACxB,eAAe,EAAE,UAAU;wBAC3B,EAAE,EAAE,QAAQ;wBACZ,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC;wBACzC,IAAI,EAAE,QAAQ;qBACf;iBACF;gBACH,CAAC,CAAC,EAAE,EAAE,EAAE,KAAK,EAAE,cAAc,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,CAAC,cAEnD,UAAU,KAAK,IAAI,CAAC,CAAC,CAAC,CACrB,6DACE,uBAAC,mBAAQ,IACP,UAAU,EAAE,UAAU,EACtB,SAAS,EAAC,2BAA2B,GACrC,EACF,kCAAM,SAAS,EAAC,8BAA8B,aAC3C,aAAa,WACT,IACN,CACJ,CAAC,CAAC,CAAC,CACF,6DACE,6DACe,gBAAgB,OAAG,IAAI,IAC/B,EACP,uBAAC,+CAAsB,IACrB,SAAS,EAAE,IAAA,oBAAU,EAAC,0BAA0B,EAAE;gCAChD,cAAc,EAAE,UAAU;6BAC3B,CAAC,GACF,IACD,CACJ,IACU,EACb,gCACE,SAAS,EAAE,IAAA,oBAAU,EAAC,0BAA0B,EAAE;oBAChD,cAAc,EAAE,kBAAkB;iBACnC,CAAC,EACF,KAAK,EAAE,CAAC,kBAAkB,iBACb,CAAC,kBAAkB,qBACf,QAAQ,EACzB,IAAI,EAAC,QAAQ,EACb,EAAE,EAAE,OAAO,YAEX,gCAAK,SAAS,EAAC,gCAAgC,YAC7C,gCAAK,SAAS,EAAC,kCAAkC,YAAE,QAAQ,GAAO,GAC9D,GACF,KACF,CACP,CAAC;AACJ,CAAC,CAAC;AAuBF,MAAM,OAAO,GAAG,CAAC,EAYkB,EAAE,EAAE;QAZtB,EACf,OAAO,EACP,aAAa,EACb,QAAQ,EACR,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,EACH,UAAU,EAAE,WAAW,EACvB,iBAAiB,EAAE,kBAAkB,EACrC,cAAc,EAAE,eAAe,OAEE,EAD9B,SAAS,cAXG,4IAYhB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,0BAA0B,EAAE,SAAS,CAAC,CAAC;IAElE,OAAO,CACL,+CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,eAElB,iCAAK,SAAS,EAAC,iCAAiC,aAC9C,gCAAK,SAAS,EAAC,kCAAkC,YAAE,aAAa,GAAO,EACvE,uBAAC,kBAAU,IAAC,OAAO,EAAC,~~kBAAkB~~,YAAE,OAAO,GAAc,~~IACzD~~,EACN,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,gCAAK,SAAS,EAAC,iDAAiD,YAC9D,gCAAK,SAAS,EAAC,uCAAuC,GAAG,GACrD,EACN,gCAAK,SAAS,EAAC,2CAA2C,YACvD,QAAQ,GACL,IACF,KACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,CAAC,EAOoC,EAAE,EAAE;QAPxC,EACd,QAAQ,EACR,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,OAE+C,EAD/C,SAAS,cANE,2DAOf,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,yBAAyB,EAAE,SAAS,CAAC,CAAC;IACjE,OAAO,CACL,uBAAC,kBAAU,kBACT,EAAE,EAAC,KAAK,EACR,OAAO,EAAC,YAAY,EACpB,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,IACJ,SAAS,EACT,cAAc,cAEjB,QAAQ,IACE,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,CAAC,kBAAkB,EAAE;IAClD,MAAM;IACN,OAAO;CACR,CAAC,CAAC;AAEM,8BAAS","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 { Typography } from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { useId, useState } from 'react';\n\nimport { type CommonProps } from '../../_common/types';\nimport { ChevronDownIconOutline } from '../../icons/generated/heroIcons/ChevronDownIconOutline';\nimport { Presence } from '../presence';\nimport { formatThinkingDuration } from '../thinking/thinking-duration-formatter';\n\ntype ReasoningProps = {\n /* What should be displayed inside the reasoning component. /\n children?: React.ReactNode;\n /* Whether the AI is thinking /\n isThinking?: boolean;\n /* The duration of the thinking in milliseconds /\n thinkingMs?: number;\n /* The current action the AI is performing /\n currentAction?: string;\n};\n\n/\n The component is used to display the reasoning state of an LLM.\n * It has an accordion like behavior to show the reasoning steps.\n \n @alpha - Changes to this component may be breaking.\n /\nconst ReasoningComponent = ({\n isThinking = true,\n thinkingMs = 1000,\n currentAction = 'Thinking',\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', ReasoningProps>) => {\n const classes = classNames('ndl-ai-reasoning', className);\n const [isExpanded, setIsExpanded] = useState(false);\n const shouldShowChildren = isExpanded && isThinking === false;\n const buttonId = useId();\n const panelId = useId();\n\n const { value: thinkingDuration, unit } = formatThinkingDuration(thinkingMs);\n\n return (\n <div\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n <Typography\n variant=\"title-4\"\n className={classNames('ndl-ai-reasoning-header', {\n 'ndl-expanded': isExpanded,\n })}\n {...(!isThinking\n ? {\n as: 'button',\n htmlAttributes: {\n 'aria-controls': panelId,\n 'aria-expanded': isExpanded,\n id: buttonId,\n onClick: () => setIsExpanded(!isExpanded),\n type: 'button',\n },\n }\n : { as: 'div', htmlAttributes: { id: buttonId } })}\n >\n {isThinking === true ? (\n <>\n <Presence\n isThinking={isThinking}\n className=\"ndl-ai-reasoning-presence\"\n />\n <span className=\"ndl-ai-reasoning-header-text\">\n {currentAction}...\n </span>\n </>\n ) : (\n <>\n <span>\n Thought for {thinkingDuration} {unit}\n </span>\n <ChevronDownIconOutline\n className={classNames('ndl-ai-reasoning-chevron', {\n 'ndl-expanded': isExpanded,\n })}\n />\n </>\n )}\n </Typography>\n <div\n className={classNames('ndl-ai-reasoning-content', {\n 'ndl-expanded': shouldShowChildren,\n })}\n inert={!shouldShowChildren}\n aria-hidden={!shouldShowChildren}\n aria-labelledby={buttonId}\n role=\"region\"\n id={panelId}\n >\n <div className=\"ndl-ai-reasoning-content-inner\">\n <div className=\"ndl-ai-reasoning-content-inner-2\">{children}</div>\n </div>\n </div>\n </div>\n );\n};\n\ntype SectionProps = {\n /* The heading of the section /\n heading?: React.ReactNode;\n /* The children of the section /\n children?: React.ReactNode;\n /* The visual leading the section /\n leadingVisual?: React.ReactNode;\n // TODO v5: remove this prop\n /* Whether the section is expanded.\n * @deprecated - Does nothing, will be removed in v5 /\n isExpanded?: boolean;\n // TODO v5: remove this prop\n /* The default value of the section is expanded.\n * @deprecated - Does nothing, will be removed in v5 /\n isDefaultExpanded?: boolean;\n // TODO v5: remove this prop\n /* Callback function triggered when the section is expanded.\n * @deprecated - Does nothing, will be removed in v5 */\n onExpandChange?: (isExpanded: boolean) => void;\n};\n\nconst Section = ({\n heading,\n leadingVisual,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n isExpanded: _isExpanded,\n isDefaultExpanded: _isDefaultExpanded,\n onExpandChange: _onExpandChange,\n ...restProps\n}: CommonProps<'div', SectionProps>) => {\n const classes = classNames('ndl-ai-reasoning-section', className);\n\n return (\n <div\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n <div className=\"ndl-ai-reasoning-section-header\">\n <div className=\"ndl-ai-reasoning-section-leading\">{leadingVisual}</div>\n <Typography variant=\"subheading-~~small~~\">{heading}</Typography>\n </div>\n <div className=\"ndl-ai-reasoning-section-content\">\n <div className=\"ndl-ai-reasoning-section-content-line-container\">\n <div className=\"ndl-ai-reasoning-section-content-line\" />\n </div>\n <div className=\"ndl-ai-reasoning-section-content-children\">\n {children}\n </div>\n </div>\n </div>\n );\n};\n\nconst Footer = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-ai-reasoning-footer', className);\n return (\n <Typography\n as=\"div\"\n variant=\"body-small\"\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Typography>\n );\n};\n\nconst Reasoning = Object.assign(ReasoningComponent, {\n Footer,\n Section,\n});\n\nexport { Reasoning };\n"]}
1	+ {"version":3,"file":"Reasoning.js","sourceRoot":"","sources":["../../../../src/ai/reasoning/Reasoning.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 { Typography } from '@neo4j-ndl/react';\nimport classNames from 'classnames';\nimport { useId, useState } from 'react';\n\nimport { type CommonProps } from '../../_common/types';\nimport { ChevronDownIconOutline } from '../../icons/generated/heroIcons/ChevronDownIconOutline';\nimport { Presence } from '../presence';\nimport { formatThinkingDuration } from '../thinking/thinking-duration-formatter';\n\ntype ReasoningProps = {\n /* What should be displayed inside the reasoning component. /\n children?: React.ReactNode;\n /* Whether the AI is thinking /\n isThinking?: boolean;\n /* The duration of the thinking in milliseconds /\n thinkingMs?: number;\n /* The current action the AI is performing /\n currentAction?: string;\n};\n\n/\n The component is used to display the reasoning state of an LLM.\n * It has an accordion like behavior to show the reasoning steps.\n \n @alpha - Changes to this component may be breaking.\n /\nconst ReasoningComponent = ({\n isThinking = true,\n thinkingMs = 1000,\n currentAction = 'Thinking',\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', ReasoningProps>) => {\n const classes = classNames('ndl-ai-reasoning', className);\n const [isExpanded, setIsExpanded] = useState(false);\n const shouldShowChildren = isExpanded && isThinking === false;\n const buttonId = useId();\n const panelId = useId();\n\n const { value: thinkingDuration, unit } = formatThinkingDuration(thinkingMs);\n\n return (\n <div\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n <Typography\n variant=\"title-3\"\n className={classNames('ndl-ai-reasoning-header', {\n 'ndl-expanded': isExpanded,\n })}\n {...(!isThinking\n ? {\n as: 'button',\n htmlAttributes: {\n 'aria-controls': panelId,\n 'aria-expanded': isExpanded,\n id: buttonId,\n onClick: () => setIsExpanded(!isExpanded),\n type: 'button',\n },\n }\n : { as: 'div', htmlAttributes: { id: buttonId } })}\n >\n {isThinking === true ? (\n <>\n <Presence\n isThinking={isThinking}\n className=\"ndl-ai-reasoning-presence\"\n />\n <span className=\"ndl-ai-reasoning-header-text\">\n {currentAction}...\n </span>\n </>\n ) : (\n <>\n <span>\n Thought for {thinkingDuration} {unit}\n </span>\n <ChevronDownIconOutline\n className={classNames('ndl-ai-reasoning-chevron', {\n 'ndl-expanded': isExpanded,\n })}\n />\n </>\n )}\n </Typography>\n <div\n className={classNames('ndl-ai-reasoning-content', {\n 'ndl-expanded': shouldShowChildren,\n })}\n inert={!shouldShowChildren}\n aria-hidden={!shouldShowChildren}\n aria-labelledby={buttonId}\n role=\"region\"\n id={panelId}\n >\n <div className=\"ndl-ai-reasoning-content-inner\">\n <div className=\"ndl-ai-reasoning-content-inner-2\">{children}</div>\n </div>\n </div>\n </div>\n );\n};\n\ntype SectionProps = {\n /* The heading of the section /\n heading?: React.ReactNode;\n /* The children of the section /\n children?: React.ReactNode;\n /* The visual leading the section /\n leadingVisual?: React.ReactNode;\n // TODO v5: remove this prop\n /* Whether the section is expanded.\n * @deprecated - Does nothing, will be removed in v5 /\n isExpanded?: boolean;\n // TODO v5: remove this prop\n /* The default value of the section is expanded.\n * @deprecated - Does nothing, will be removed in v5 /\n isDefaultExpanded?: boolean;\n // TODO v5: remove this prop\n /* Callback function triggered when the section is expanded.\n * @deprecated - Does nothing, will be removed in v5 */\n onExpandChange?: (isExpanded: boolean) => void;\n};\n\nconst Section = ({\n heading,\n leadingVisual,\n children,\n className,\n style,\n htmlAttributes,\n ref,\n isExpanded: _isExpanded,\n isDefaultExpanded: _isDefaultExpanded,\n onExpandChange: _onExpandChange,\n ...restProps\n}: CommonProps<'div', SectionProps>) => {\n const classes = classNames('ndl-ai-reasoning-section', className);\n\n return (\n <div\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n <div className=\"ndl-ai-reasoning-section-header\">\n <div className=\"ndl-ai-reasoning-section-leading\">{leadingVisual}</div>\n <Typography variant=\"subheading-medium\">{heading}</Typography>\n </div>\n <div className=\"ndl-ai-reasoning-section-content\">\n <div className=\"ndl-ai-reasoning-section-content-line-container\">\n <div className=\"ndl-ai-reasoning-section-content-line\" />\n </div>\n <div className=\"ndl-ai-reasoning-section-content-children\">\n {children}\n </div>\n </div>\n </div>\n );\n};\n\nconst Footer = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-ai-reasoning-footer', className);\n return (\n <Typography\n as=\"div\"\n variant=\"body-small\"\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Typography>\n );\n};\n\nconst Reasoning = Object.assign(ReasoningComponent, {\n Footer,\n Section,\n});\n\nexport { Reasoning };\n"]}

package/lib/cjs/ai/thinking/Thinking.js CHANGED Viewed

@@ -50,7 +50,7 @@ const Thinking = (_a) => {
     var { className, isThinking = true, style, htmlAttributes, ref, thinkingMs = 1000 } = _a, restProps = __rest(_a, ["className", "isThinking", "style", "htmlAttributes", "ref", "thinkingMs"]);
     const classes = (0, classnames_1.default)('n-flex n-flex-col n-items-start n-gap-token-12', className);
     const { value: thinkingDuration, unit } = (0, thinking_duration_formatter_1.formatThinkingDuration)(thinkingMs);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: isThinking === true ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(presence_1.Presence, { isThinking: isThinking, className: "n-size-token-32" }), (0, jsx_runtime_1.jsx)("span", { className: "n-subheading-small n-text-neutral-text-default", children: "Thinking" })] })) : ((0, jsx_runtime_1.jsxs)("span", { className: "n-subheading-small n-text-neutral-text-weak", children: ["Thought", ' ', (0, jsx_runtime_1.jsxs)("span", { className: "n-font-normal", children: ["for ", thinkingDuration, " ", unit] })] })) })));
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: isThinking === true ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(presence_1.Presence, { isThinking: isThinking, className: "n-size-token-32" }), (0, jsx_runtime_1.jsx)("span", { className: "n-subheading-medium n-text-neutral-text-default", children: "Thinking" })] })) : ((0, jsx_runtime_1.jsxs)("span", { className: "n-subheading-medium n-text-neutral-text-weak", children: ["Thought", ' ', (0, jsx_runtime_1.jsxs)("span", { className: "n-font-normal", children: ["for ", thinkingDuration, " ", unit] })] })) })));
 };
 exports.Thinking = Thinking;
 //# sourceMappingURL=Thinking.js.map

package/lib/cjs/ai/thinking/Thinking.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Thinking.js","sourceRoot":"","sources":["../../../../src/ai/thinking/Thinking.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,4DAAoC;AAGpC,0CAAuC;AACvC,+EAAuE;AAYvE;;;;;;GAMG;AACH,MAAM,QAAQ,GAAG,CAAC,EAQkB,EAAE,EAAE;QARtB,EAChB,SAAS,EACT,UAAU,GAAG,IAAI,EACjB,KAAK,EACL,cAAc,EACd,GAAG,EACH,UAAU,GAAG,IAAI,OAEiB,EAD/B,SAAS,cAPI,2EAQjB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EACxB,gDAAgD,EAChD,SAAS,CACV,CAAC;IAEF,MAAM,EAAE,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,GAAG,IAAA,oDAAsB,EAAC,UAAU,CAAC,CAAC;IAE7E,OAAO,CACL,8CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,cAEjB,UAAU,KAAK,IAAI,CAAC,CAAC,CAAC,CACrB,6DACE,uBAAC,mBAAQ,IAAC,UAAU,EAAE,UAAU,EAAE,SAAS,EAAC,iBAAiB,GAAG,EAChE,iCAAM,SAAS,EAAC,~~gDAAgD~~,~~yBAEzD~~,IACN,CACJ,CAAC,CAAC,CAAC,CACF,kCAAM,SAAS,EAAC,~~6CAA6C~~,~~wBACnD~~,GAAG,EACX,kCAAM,SAAS,EAAC,eAAe,qBACxB,gBAAgB,OAAG,IAAI,IACvB,IACF,CACR,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEO,4BAAQ","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 classNames from 'classnames';\n\nimport type { CommonProps } from '../../_common/types';\nimport { Presence } from '../presence';\nimport { formatThinkingDuration } from './thinking-duration-formatter';\n\ntype ThinkingProps = {\n /* Whether the AI is thinking.\n * If true, will render a thinking presence icon and the text \"Thinking\".\n * If false, will render the duration of the thinking.\n /\n isThinking?: boolean;\n /* The duration of the thinking in milliseconds /\n thinkingMs?: number;\n};\n\n/\n The component is used to display the thinking state of an LLM.\n * If the `isThinking` prop is true, it will render a thinking presence icon and the text \"Thinking\".\n * If the `isThinking` prop is false, it will render the duration of the thinking.\n \n @alpha - Changes to this component may be breaking.\n */\nconst Thinking = ({\n className,\n isThinking = true,\n style,\n htmlAttributes,\n ref,\n thinkingMs = 1000,\n ...restProps\n}: CommonProps<'div', ThinkingProps>) => {\n const classes = classNames(\n 'n-flex n-flex-col n-items-start n-gap-token-12',\n className,\n );\n\n const { value: thinkingDuration, unit } = formatThinkingDuration(thinkingMs);\n\n return (\n <div\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n {isThinking === true ? (\n <>\n <Presence isThinking={isThinking} className=\"n-size-token-32\" />\n <span className=\"n-subheading-~~small~~ n-text-neutral-text-default\">\n Thinking\n </span>\n </>\n ) : (\n <span className=\"n-subheading-~~small~~ n-text-neutral-text-weak\">\n Thought{' '}\n <span className=\"n-font-normal\">\n for {thinkingDuration} {unit}\n </span>\n </span>\n )}\n </div>\n );\n};\n\nexport { Thinking };\n"]}
1	+ {"version":3,"file":"Thinking.js","sourceRoot":"","sources":["../../../../src/ai/thinking/Thinking.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,4DAAoC;AAGpC,0CAAuC;AACvC,+EAAuE;AAYvE;;;;;;GAMG;AACH,MAAM,QAAQ,GAAG,CAAC,EAQkB,EAAE,EAAE;QARtB,EAChB,SAAS,EACT,UAAU,GAAG,IAAI,EACjB,KAAK,EACL,cAAc,EACd,GAAG,EACH,UAAU,GAAG,IAAI,OAEiB,EAD/B,SAAS,cAPI,2EAQjB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EACxB,gDAAgD,EAChD,SAAS,CACV,CAAC;IAEF,MAAM,EAAE,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,GAAG,IAAA,oDAAsB,EAAC,UAAU,CAAC,CAAC;IAE7E,OAAO,CACL,8CACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,cAEjB,UAAU,KAAK,IAAI,CAAC,CAAC,CAAC,CACrB,6DACE,uBAAC,mBAAQ,IAAC,UAAU,EAAE,UAAU,EAAE,SAAS,EAAC,iBAAiB,GAAG,EAChE,iCAAM,SAAS,EAAC,iDAAiD,yBAE1D,IACN,CACJ,CAAC,CAAC,CAAC,CACF,kCAAM,SAAS,EAAC,8CAA8C,wBACpD,GAAG,EACX,kCAAM,SAAS,EAAC,eAAe,qBACxB,gBAAgB,OAAG,IAAI,IACvB,IACF,CACR,IACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEO,4BAAQ","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 classNames from 'classnames';\n\nimport type { CommonProps } from '../../_common/types';\nimport { Presence } from '../presence';\nimport { formatThinkingDuration } from './thinking-duration-formatter';\n\ntype ThinkingProps = {\n /* Whether the AI is thinking.\n * If true, will render a thinking presence icon and the text \"Thinking\".\n * If false, will render the duration of the thinking.\n /\n isThinking?: boolean;\n /* The duration of the thinking in milliseconds /\n thinkingMs?: number;\n};\n\n/\n The component is used to display the thinking state of an LLM.\n * If the `isThinking` prop is true, it will render a thinking presence icon and the text \"Thinking\".\n * If the `isThinking` prop is false, it will render the duration of the thinking.\n \n @alpha - Changes to this component may be breaking.\n */\nconst Thinking = ({\n className,\n isThinking = true,\n style,\n htmlAttributes,\n ref,\n thinkingMs = 1000,\n ...restProps\n}: CommonProps<'div', ThinkingProps>) => {\n const classes = classNames(\n 'n-flex n-flex-col n-items-start n-gap-token-12',\n className,\n );\n\n const { value: thinkingDuration, unit } = formatThinkingDuration(thinkingMs);\n\n return (\n <div\n ref={ref}\n className={classes}\n style={style}\n {...restProps}\n {...htmlAttributes}\n >\n {isThinking === true ? (\n <>\n <Presence isThinking={isThinking} className=\"n-size-token-32\" />\n <span className=\"n-subheading-medium n-text-neutral-text-default\">\n Thinking\n </span>\n </>\n ) : (\n <span className=\"n-subheading-medium n-text-neutral-text-weak\">\n Thought{' '}\n <span className=\"n-font-normal\">\n for {thinkingDuration} {unit}\n </span>\n </span>\n )}\n </div>\n );\n};\n\nexport { Thinking };\n"]}

package/lib/cjs/avatar/Avatar.js CHANGED Viewed

@@ -92,7 +92,7 @@ const Avatar = (_a) => {
     const renderImageType = () => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("img", { "data-testid": "ndl-avatar-image", src: source, alt: name }), (0, jsx_runtime_1.jsx)("div", { "data-testid": "ndl-avatar-image-overlay", className: `${shapeClasses} ndl-avatar-image-overlay` })] }));
     const renderIconType = () => (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: icon !== null && icon !== void 0 ? icon : (0, jsx_runtime_1.jsx)(UserIconOutline_1.UserIconOutline, {}) });
     const renderLettersType = () => {
-        return ((0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: "subheading-small", className: "ndl-avatar-typography", children: getLettersDisplay(name !== null && name !== void 0 ? name : '') }));
+        return ((0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: "subheading-medium", className: "ndl-avatar-typography", children: getLettersDisplay(name !== null && name !== void 0 ? name : '') }));
     };
     const TypeComponent = type === 'image'
         ? renderImageType()

package/lib/cjs/avatar/Avatar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/avatar/Avatar.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';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { UserIconOutline } from '../icons/generated/heroIcons/UserIconOutline';\nimport { Typography } from '../typography';\n\ntype SizeType = AvatarProps['size'];\ntype StatusType = NonNullable<AvatarProps['status']>;\n\ninterface CircleProperties {\n /* Center coordinates of the circles /\n cxAndCy: number;\n /* Diameter of the circles /\n diameter: number;\n /* Radius of the inner circle /\n rInner: number;\n /* Radius of the outer circle /\n rOuter: number;\n}\n\nfunction circleSizeFactory(size: SizeType): CircleProperties {\n switch (size) {\n case 'x-small':\n case 'small':\n case 'medium':\n return {\n cxAndCy: 4.5,\n diameter: 9,\n rInner: 3,\n rOuter: 4.5,\n };\n case 'large':\n case 'x-large':\n default:\n return {\n cxAndCy: 6,\n diameter: 12,\n rInner: 4,\n rOuter: 6,\n };\n }\n}\n\nfunction StatusIndicator({\n size,\n status,\n}: {\n size: SizeType;\n status: StatusType;\n}) {\n const { cxAndCy, diameter, rInner, rOuter } = circleSizeFactory(size);\n const statusClasses = `ndl-avatar-status ndl-avatar-status-${status}`;\n\n return (\n <div\n className={statusClasses}\n title={status.charAt(0).toUpperCase() + status.slice(1)}\n role=\"presentation\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height={diameter}\n width={diameter}\n viewBox={`0 0 ${diameter} ${diameter}`}\n fill=\"none\"\n >\n <circle\n cx={cxAndCy}\n cy={cxAndCy}\n r={rOuter}\n className=\"ndl-avatar-status-circle-outer\"\n />\n <circle\n cx={cxAndCy}\n cy={cxAndCy}\n r={status === 'unknown' ? rInner - 1 : rInner}\n className=\"ndl-avatar-status-circle-inner\"\n />\n </svg>\n </div>\n );\n}\n\ntype AvatarProps = {\n /* Whether to display a status indicator /\n hasStatus?: boolean;\n /* Whether the avatar is disabled. When disabled, status indicators are hidden and `onClick` handlers are disabled when cast as a button /\n isDisabled?: boolean;\n /* The name associated with the avatar. Used for alt text and aria-label. For letters type, this text is displayed /\n name?: string;\n /* The shape of the avatar /\n shape?: 'circle' \| 'square';\n /* The size of the avatar /\n size?: 'x-small' \| 'small' \| 'medium' \| 'large' \| 'x-large';\n /* Source URI for the image. When provided with `type=\"image`\", displays the image /\n source?: string;\n /* The status to display. Only shown when `hasStatus` is `true` and component is not disabled /\n status?: 'offline' \| 'online' \| 'unknown';\n /* The type of avatar content. If `type=\"image\"` and no source is provided, automatically falls back to `icon` /\n type?: 'icon' \| 'image' \| 'letters';\n /* Custom icon to display when `type` is `\"icon\"`. Defaults to `UserIconOutline` */\n icon?: React.ReactNode;\n} & (\n \| {\n as: 'button';\n onClick: () => void;\n }\n \| {\n as?: React.ElementType;\n }\n);\n\nconst getLettersDisplay = (displayName: string) => {\n const words = displayName.trim().split(/\\s+/).filter(Boolean);\n if (words.length <= 1) {\n return displayName.trim();\n }\n return words\n .map((word) => word.charAt(0))\n .join('')\n .toUpperCase();\n};\n\nexport const Avatar = <T extends React.ElementType = 'div'>({\n as,\n hasStatus = false,\n icon,\n isDisabled = false,\n name,\n shape = 'circle',\n size = 'medium',\n source,\n status,\n type: initialType = 'image',\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, AvatarProps>) => {\n // If source is not provided, fallback to icon\n const type =\n initialType === 'image' && (source === undefined \|\| source === '')\n ? 'icon'\n : initialType;\n\n const Component: React.ElementType = as ?? 'div';\n const isButton = Component === 'button';\n const classes = classNames(\n `ndl-avatar ndl-avatar-${shape} ndl-avatar-${size}`,\n className,\n );\n const shapeClasses = classNames(\n `ndl-avatar-shape ndl-avatar-${shape} ndl-avatar-${shape}-${size}`,\n {\n 'ndl-avatar-disabled': isDisabled,\n },\n );\n\n const typeClass = `ndl-avatar-${type}`;\n\n const renderImageType = () => (\n <>\n <img data-testid=\"ndl-avatar-image\" src={source} alt={name} />\n <div\n data-testid=\"ndl-avatar-image-overlay\"\n className={`${shapeClasses} ndl-avatar-image-overlay`}\n />\n </>\n );\n\n const renderIconType = () => <>{icon ?? <UserIconOutline />}</>;\n\n const renderLettersType = () => {\n return (\n <Typography variant=\"subheading-small\" className=\"ndl-avatar-typography\">\n {getLettersDisplay(name ?? '')}\n </Typography>\n );\n };\n\n const TypeComponent =\n type === 'image'\n ? renderImageType()\n : type === 'icon'\n ? renderIconType()\n : type === 'letters' && Boolean(name)\n ? renderLettersType()\n : null;\n\n const isStatusIndicatorVisible =\n hasStatus && !isDisabled && status !== undefined;\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n aria-hidden={!isButton}\n {...(isButton && {\n disabled: isDisabled,\n })}\n aria-label={`Avatar ${name}`}\n {...restProps}\n {...htmlAttributes}\n >\n <div className={classNames(shapeClasses, typeClass)}>{TypeComponent}</div>\n {isStatusIndicatorVisible && (\n <StatusIndicator size={size} status={status} />\n )}\n </Component>\n );\n};\n"]}
1	+ {"version":3,"file":"Avatar.js","sourceRoot":"","sources":["../../../src/avatar/Avatar.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';\n\nimport { type PolymorphicCommonProps } from '../_common/types';\nimport { UserIconOutline } from '../icons/generated/heroIcons/UserIconOutline';\nimport { Typography } from '../typography';\n\ntype SizeType = AvatarProps['size'];\ntype StatusType = NonNullable<AvatarProps['status']>;\n\ninterface CircleProperties {\n /* Center coordinates of the circles /\n cxAndCy: number;\n /* Diameter of the circles /\n diameter: number;\n /* Radius of the inner circle /\n rInner: number;\n /* Radius of the outer circle /\n rOuter: number;\n}\n\nfunction circleSizeFactory(size: SizeType): CircleProperties {\n switch (size) {\n case 'x-small':\n case 'small':\n case 'medium':\n return {\n cxAndCy: 4.5,\n diameter: 9,\n rInner: 3,\n rOuter: 4.5,\n };\n case 'large':\n case 'x-large':\n default:\n return {\n cxAndCy: 6,\n diameter: 12,\n rInner: 4,\n rOuter: 6,\n };\n }\n}\n\nfunction StatusIndicator({\n size,\n status,\n}: {\n size: SizeType;\n status: StatusType;\n}) {\n const { cxAndCy, diameter, rInner, rOuter } = circleSizeFactory(size);\n const statusClasses = `ndl-avatar-status ndl-avatar-status-${status}`;\n\n return (\n <div\n className={statusClasses}\n title={status.charAt(0).toUpperCase() + status.slice(1)}\n role=\"presentation\"\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height={diameter}\n width={diameter}\n viewBox={`0 0 ${diameter} ${diameter}`}\n fill=\"none\"\n >\n <circle\n cx={cxAndCy}\n cy={cxAndCy}\n r={rOuter}\n className=\"ndl-avatar-status-circle-outer\"\n />\n <circle\n cx={cxAndCy}\n cy={cxAndCy}\n r={status === 'unknown' ? rInner - 1 : rInner}\n className=\"ndl-avatar-status-circle-inner\"\n />\n </svg>\n </div>\n );\n}\n\ntype AvatarProps = {\n /* Whether to display a status indicator /\n hasStatus?: boolean;\n /* Whether the avatar is disabled. When disabled, status indicators are hidden and `onClick` handlers are disabled when cast as a button /\n isDisabled?: boolean;\n /* The name associated with the avatar. Used for alt text and aria-label. For letters type, this text is displayed /\n name?: string;\n /* The shape of the avatar /\n shape?: 'circle' \| 'square';\n /* The size of the avatar /\n size?: 'x-small' \| 'small' \| 'medium' \| 'large' \| 'x-large';\n /* Source URI for the image. When provided with `type=\"image`\", displays the image /\n source?: string;\n /* The status to display. Only shown when `hasStatus` is `true` and component is not disabled /\n status?: 'offline' \| 'online' \| 'unknown';\n /* The type of avatar content. If `type=\"image\"` and no source is provided, automatically falls back to `icon` /\n type?: 'icon' \| 'image' \| 'letters';\n /* Custom icon to display when `type` is `\"icon\"`. Defaults to `UserIconOutline` */\n icon?: React.ReactNode;\n} & (\n \| {\n as: 'button';\n onClick: () => void;\n }\n \| {\n as?: React.ElementType;\n }\n);\n\nconst getLettersDisplay = (displayName: string) => {\n const words = displayName.trim().split(/\\s+/).filter(Boolean);\n if (words.length <= 1) {\n return displayName.trim();\n }\n return words\n .map((word) => word.charAt(0))\n .join('')\n .toUpperCase();\n};\n\nexport const Avatar = <T extends React.ElementType = 'div'>({\n as,\n hasStatus = false,\n icon,\n isDisabled = false,\n name,\n shape = 'circle',\n size = 'medium',\n source,\n status,\n type: initialType = 'image',\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, AvatarProps>) => {\n // If source is not provided, fallback to icon\n const type =\n initialType === 'image' && (source === undefined \|\| source === '')\n ? 'icon'\n : initialType;\n\n const Component: React.ElementType = as ?? 'div';\n const isButton = Component === 'button';\n const classes = classNames(\n `ndl-avatar ndl-avatar-${shape} ndl-avatar-${size}`,\n className,\n );\n const shapeClasses = classNames(\n `ndl-avatar-shape ndl-avatar-${shape} ndl-avatar-${shape}-${size}`,\n {\n 'ndl-avatar-disabled': isDisabled,\n },\n );\n\n const typeClass = `ndl-avatar-${type}`;\n\n const renderImageType = () => (\n <>\n <img data-testid=\"ndl-avatar-image\" src={source} alt={name} />\n <div\n data-testid=\"ndl-avatar-image-overlay\"\n className={`${shapeClasses} ndl-avatar-image-overlay`}\n />\n </>\n );\n\n const renderIconType = () => <>{icon ?? <UserIconOutline />}</>;\n\n const renderLettersType = () => {\n return (\n <Typography variant=\"subheading-medium\" className=\"ndl-avatar-typography\">\n {getLettersDisplay(name ?? '')}\n </Typography>\n );\n };\n\n const TypeComponent =\n type === 'image'\n ? renderImageType()\n : type === 'icon'\n ? renderIconType()\n : type === 'letters' && Boolean(name)\n ? renderLettersType()\n : null;\n\n const isStatusIndicatorVisible =\n hasStatus && !isDisabled && status !== undefined;\n\n return (\n <Component\n ref={ref}\n className={classes}\n style={style}\n aria-hidden={!isButton}\n {...(isButton && {\n disabled: isDisabled,\n })}\n aria-label={`Avatar ${name}`}\n {...restProps}\n {...htmlAttributes}\n >\n <div className={classNames(shapeClasses, typeClass)}>{TypeComponent}</div>\n {isStatusIndicatorVisible && (\n <StatusIndicator size={size} status={status} />\n )}\n </Component>\n );\n};\n"]}

package/lib/cjs/banner/Banner.js CHANGED Viewed

@@ -67,7 +67,7 @@ const StatusIcon = ({ variant }) => {
 const BannerHeader = (_a) => {
     var { children, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["children", "className", "style", "htmlAttributes", "ref"]);
     const classes = (0, classnames_1.default)('ndl-banner-header', className);
-    return ((0, jsx_runtime_1.jsx)(typography_1.Typography, Object.assign({ as: "span", variant: "title-4", className: classes, style: style, ref: ref, htmlAttributes: htmlAttributes }, restProps, { children: children })));
+    return ((0, jsx_runtime_1.jsx)(typography_1.Typography, Object.assign({ as: "span", variant: "title-3", className: classes, style: style, ref: ref, htmlAttributes: htmlAttributes }, restProps, { children: children })));
 };
 const BannerDescription = (_a) => {
     var { children, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["children", "className", "style", "htmlAttributes", "ref"]);

package/lib/cjs/banner/Banner.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/banner/Banner.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,4DAAoC;AAOpC,4DAAuD;AACvD,kFAA+E;AAC/E,4FAAyF;AACzF,wGAAqG;AACrG,4GAAyG;AACzG,wGAAqG;AACrG,oFAAiF;AACjF,8CAA2C;AA8C3C,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,EAA8B,EAAE,EAAE;IAC7D,MAAM,aAAa,GAAG,CAAC,GAAG,EAAE;QAC1B,QAAQ,OAAO,EAAE,CAAC;YAChB,KAAK,SAAS;gBACZ,OAAO,uBAAC,2CAAoB,KAAG,CAAC;YAClC,KAAK,SAAS;gBACZ,OAAO,uBAAC,2DAA4B,KAAG,CAAC;YAC1C,KAAK,QAAQ;gBACX,OAAO,uBAAC,uDAA0B,KAAG,CAAC;YACxC,KAAK,MAAM;gBACT,OAAO,uBAAC,uDAA0B,KAAG,CAAC;YACxC,KAAK,SAAS;gBACZ,OAAO,uBAAC,iCAAe,KAAG,CAAC;YAC7B;gBACE,OAAO,IAAI,CAAC;QAChB,CAAC;IACH,CAAC,CAAC,EAAE,CAAC;IAEL,OAAO,gCAAK,SAAS,EAAC,wBAAwB,YAAE,aAAa,GAAO,CAAC;AACvE,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EAO+B,EAAE,EAAE;QAPnC,EACpB,QAAQ,EACR,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,OAEgD,EADhD,SAAS,cANQ,2DAOrB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,mBAAmB,EAAE,SAAS,CAAC,CAAC;IAC3D,OAAO,CACL,uBAAC,uBAAU,kBACT,EAAE,EAAC,MAAM,EACT,OAAO,EAAC,SAAS,EACjB,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,cAAc,EAAE,cAAc,IAC1B,SAAS,cAEZ,QAAQ,IACE,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,iBAAiB,GAAG,CAAC,EAOyB,EAAE,EAAE;QAP7B,EACzB,QAAQ,EACR,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,OAE+C,EAD/C,SAAS,cANa,2DAO1B,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,wBAAwB,EAAE,SAAS,CAAC,CAAC;IAChE,OAAO,CACL,uBAAC,uBAAU,kBACT,EAAE,EAAC,KAAK,EACR,OAAO,EAAC,aAAa,EACrB,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,IACJ,SAAS,EACT,cAAc,cAEjB,QAAQ,IACE,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,EAO6B,EAAE,EAAE;QAPjC,EACrB,QAAQ,EACR,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,OAE+C,EAD/C,SAAS,cANS,2DAOtB,CADa;IAEZ,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,oBAAoB,EAAE,SAAS,CAAC,CAAC;IAC5D,OAAO,CACL,8CACE,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,IACJ,SAAS,EACT,cAAc,cAEjB,QAAQ,IACL,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,eAAe,GAAG,CAA0C,EAazB,EAAE,EAAE;QAbqB,EAChE,EAAE,EACF,OAAO,GAAG,MAAM,EAChB,OAAO,GAAG,KAAK,EACf,OAAO,EACP,SAAS,EACT,QAAQ,EACR,WAAW,GAAG,KAAK,EACnB,KAAK,GAAG,QAAQ,EAChB,cAAc,EACd,OAAO,GAAG,KAAK,EACf,GAAG,OAEoC,EADpC,SAAS,cAZoD,4HAajE,CADa;IAEZ,MAAM,OAAO,GAAsB,EAAE,aAAF,EAAE,cAAF,EAAE,GAAI,SAAS,CAAC;IAEnD,MAAM,OAAO,GAAG,IAAA,oBAAU,EAAC,YAAY,EAAE,SAAS,EAAE;QAClD,YAAY,EAAE,OAAO,KAAK,QAAQ;QAClC,YAAY,EAAE,KAAK,KAAK,QAAQ;QAChC,UAAU,EAAE,OAAO,KAAK,MAAM;QAC9B,YAAY,EAAE,KAAK,KAAK,QAAQ;QAChC,aAAa,EAAE,OAAO,KAAK,SAAS;QACpC,aAAa,EAAE,OAAO,KAAK,SAAS;QACpC,aAAa,EAAE,OAAO,KAAK,SAAS;KACrC,CAAC,CAAC;IAEH,MAAM,WAAW,GAAG,CAClB,KAEoC,EACpC,EAAE;QACF,IAAI,OAAO,IAAI,OAAO,OAAO,KAAK,UAAU,EAAE,CAAC;YAC7C,OAAO,CAAC,KAAK,CAAC,CAAC;QACjB,CAAC;IACH,CAAC,CAAC;IAEF,OAAO,CACL,wBAAC,OAAO,kBACN,SAAS,EAAE,OAAO,EAClB,IAAI,EAAE,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EACnC,GAAG,EAAE,GAAG,IACJ,SAAS,EACT,cAAc,eAEjB,OAAO,IAAI,uBAAC,UAAU,IAAC,OAAO,EAAE,OAAO,GAAI,EAC5C,gCAAK,SAAS,EAAC,oBAAoB,YAAE,QAAQ,GAAO,EACnD,WAAW,IAAI,CACd,uBAAC,mCAAe,IACd,IAAI,EAAC,OAAO,EACZ,OAAO,EAAE,WAAW,EACpB,WAAW,EAAE,IAAI,EACjB,cAAc,EAAE,EAAE,YAAY,EAAE,OAAO,EAAE,YAEzC,uBAAC,mCAAgB,KAAG,GACJ,CACnB,KACO,CACX,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,eAAe,EAAE;IAC5C,OAAO,EAAE,aAAa;IACtB,WAAW,EAAE,iBAAiB;IAC9B,MAAM,EAAE,YAAY;CACrB,CAAC,CAAC;AAEM,wBAAM","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';\n\nimport {\n type CommonProps,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { BoltIconOutline } from '../icons/generated/heroIcons/BoltIconOutline';\nimport { CheckCircleIconSolid } from '../icons/generated/heroIcons/CheckCircleIconSolid';\nimport { ExclamationCircleIconSolid } from '../icons/generated/heroIcons/ExclamationCircleIconSolid';\nimport { ExclamationTriangleIconSolid } from '../icons/generated/heroIcons/ExclamationTriangleIconSolid';\nimport { InformationCircleIconSolid } from '../icons/generated/heroIcons/InformationCircleIconSolid';\nimport { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';\nimport { Typography } from '../typography';\n/\n \n \n Types\n \n \n /\n\ntype BannerCommonProps = {\n /* Shows a status icon. The icon is based on the value of the `variant` prop /\n hasIcon?: boolean;\n\n /* Content to be shown in the banner. /\n children?: React.ReactNode;\n\n /* Sets the role to alert /\n isAlert?: boolean;\n\n /* How the banner is used. /\n usage?: 'inline' \| 'global';\n\n /* The variant of the banner /\n variant?: BannerVariant;\n};\n\ntype CloseableBannerProps = {\n /* If the banner is closeable. Renders an icon button in the top right corner /\n isCloseable: true;\n\n /* Event handler for when the close icon is clicked */\n onClose: (\n event?: React.MouseEvent<HTMLElement> \| React.KeyboardEvent<HTMLElement>,\n ) => void;\n};\n\ntype NonCloseableBannerProps = {\n isCloseable?: false;\n onClose?: never;\n};\n\ntype BannerCloseProps = CloseableBannerProps \| NonCloseableBannerProps;\n\ntype BannerProps = BannerCommonProps & BannerCloseProps;\ntype BannerVariant = 'info' \| 'success' \| 'warning' \| 'danger' \| 'neutral';\n\nconst StatusIcon = ({ variant }: { variant: BannerVariant }) => {\n const iconComponent = (() => {\n switch (variant) {\n case 'success':\n return <CheckCircleIconSolid />;\n case 'warning':\n return <ExclamationTriangleIconSolid />;\n case 'danger':\n return <ExclamationCircleIconSolid />;\n case 'info':\n return <InformationCircleIconSolid />;\n case 'neutral':\n return <BoltIconOutline />;\n default:\n return null;\n }\n })();\n\n return <div className=\"ndl-banner-status-icon\">{iconComponent}</div>;\n};\n\nconst BannerHeader = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'span', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-banner-header', className);\n return (\n <Typography\n as=\"span\"\n variant=\"title-4\"\n className={classes}\n style={style}\n ref={ref}\n htmlAttributes={htmlAttributes}\n {...restProps}\n >\n {children}\n </Typography>\n );\n};\n\nconst BannerDescription = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-banner-description', className);\n return (\n <Typography\n as=\"div\"\n variant=\"body-medium\"\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Typography>\n );\n};\n\nconst BannerActions = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-banner-actions', className);\n return (\n <div\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </div>\n );\n};\n\nconst BannerComponent = <T extends React.ElementType = 'section'>({\n as,\n variant = 'info',\n hasIcon = false,\n onClose,\n className,\n children,\n isCloseable = false,\n usage = 'inline',\n htmlAttributes,\n isAlert = false,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, BannerProps>) => {\n const Element: React.ElementType = as ?? 'section';\n\n const classes = classNames('ndl-banner', className, {\n 'ndl-danger': variant === 'danger',\n 'ndl-global': usage === 'global',\n 'ndl-info': variant === 'info',\n 'ndl-inline': usage === 'inline',\n 'ndl-neutral': variant === 'neutral',\n 'ndl-success': variant === 'success',\n 'ndl-warning': variant === 'warning',\n });\n\n const handleClose = (\n event:\n \| React.MouseEvent<HTMLElement, MouseEvent>\n \| React.KeyboardEvent<HTMLElement>,\n ) => {\n if (onClose && typeof onClose === 'function') {\n onClose(event);\n }\n };\n\n return (\n <Element\n className={classes}\n role={isAlert ? 'alert' : undefined}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {hasIcon && <StatusIcon variant={variant} />}\n <div className=\"ndl-banner-content\">{children}</div>\n {isCloseable && (\n <CleanIconButton\n size=\"small\"\n onClick={handleClose}\n description={null}\n htmlAttributes={{ 'aria-label': 'Close' }}\n >\n <XMarkIconOutline />\n </CleanIconButton>\n )}\n </Element>\n );\n};\n\nconst Banner = Object.assign(BannerComponent, {\n Actions: BannerActions,\n Description: BannerDescription,\n Header: BannerHeader,\n});\n\nexport { Banner };\n"]}
1	+ {"version":3,"file":"Banner.js","sourceRoot":"","sources":["../../../src/banner/Banner.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';\n\nimport {\n type CommonProps,\n type PolymorphicCommonProps,\n} from '../_common/types';\nimport { CleanIconButton } from '../clean-icon-button';\nimport { BoltIconOutline } from '../icons/generated/heroIcons/BoltIconOutline';\nimport { CheckCircleIconSolid } from '../icons/generated/heroIcons/CheckCircleIconSolid';\nimport { ExclamationCircleIconSolid } from '../icons/generated/heroIcons/ExclamationCircleIconSolid';\nimport { ExclamationTriangleIconSolid } from '../icons/generated/heroIcons/ExclamationTriangleIconSolid';\nimport { InformationCircleIconSolid } from '../icons/generated/heroIcons/InformationCircleIconSolid';\nimport { XMarkIconOutline } from '../icons/generated/heroIcons/XMarkIconOutline';\nimport { Typography } from '../typography';\n/\n \n \n Types\n \n \n /\n\ntype BannerCommonProps = {\n /* Shows a status icon. The icon is based on the value of the `variant` prop /\n hasIcon?: boolean;\n\n /* Content to be shown in the banner. /\n children?: React.ReactNode;\n\n /* Sets the role to alert /\n isAlert?: boolean;\n\n /* How the banner is used. /\n usage?: 'inline' \| 'global';\n\n /* The variant of the banner /\n variant?: BannerVariant;\n};\n\ntype CloseableBannerProps = {\n /* If the banner is closeable. Renders an icon button in the top right corner /\n isCloseable: true;\n\n /* Event handler for when the close icon is clicked */\n onClose: (\n event?: React.MouseEvent<HTMLElement> \| React.KeyboardEvent<HTMLElement>,\n ) => void;\n};\n\ntype NonCloseableBannerProps = {\n isCloseable?: false;\n onClose?: never;\n};\n\ntype BannerCloseProps = CloseableBannerProps \| NonCloseableBannerProps;\n\ntype BannerProps = BannerCommonProps & BannerCloseProps;\ntype BannerVariant = 'info' \| 'success' \| 'warning' \| 'danger' \| 'neutral';\n\nconst StatusIcon = ({ variant }: { variant: BannerVariant }) => {\n const iconComponent = (() => {\n switch (variant) {\n case 'success':\n return <CheckCircleIconSolid />;\n case 'warning':\n return <ExclamationTriangleIconSolid />;\n case 'danger':\n return <ExclamationCircleIconSolid />;\n case 'info':\n return <InformationCircleIconSolid />;\n case 'neutral':\n return <BoltIconOutline />;\n default:\n return null;\n }\n })();\n\n return <div className=\"ndl-banner-status-icon\">{iconComponent}</div>;\n};\n\nconst BannerHeader = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'span', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-banner-header', className);\n return (\n <Typography\n as=\"span\"\n variant=\"title-3\"\n className={classes}\n style={style}\n ref={ref}\n htmlAttributes={htmlAttributes}\n {...restProps}\n >\n {children}\n </Typography>\n );\n};\n\nconst BannerDescription = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-banner-description', className);\n return (\n <Typography\n as=\"div\"\n variant=\"body-medium\"\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </Typography>\n );\n};\n\nconst BannerActions = ({\n children,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', { children: React.ReactNode }>) => {\n const classes = classNames('ndl-banner-actions', className);\n return (\n <div\n className={classes}\n style={style}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {children}\n </div>\n );\n};\n\nconst BannerComponent = <T extends React.ElementType = 'section'>({\n as,\n variant = 'info',\n hasIcon = false,\n onClose,\n className,\n children,\n isCloseable = false,\n usage = 'inline',\n htmlAttributes,\n isAlert = false,\n ref,\n ...restProps\n}: PolymorphicCommonProps<T, BannerProps>) => {\n const Element: React.ElementType = as ?? 'section';\n\n const classes = classNames('ndl-banner', className, {\n 'ndl-danger': variant === 'danger',\n 'ndl-global': usage === 'global',\n 'ndl-info': variant === 'info',\n 'ndl-inline': usage === 'inline',\n 'ndl-neutral': variant === 'neutral',\n 'ndl-success': variant === 'success',\n 'ndl-warning': variant === 'warning',\n });\n\n const handleClose = (\n event:\n \| React.MouseEvent<HTMLElement, MouseEvent>\n \| React.KeyboardEvent<HTMLElement>,\n ) => {\n if (onClose && typeof onClose === 'function') {\n onClose(event);\n }\n };\n\n return (\n <Element\n className={classes}\n role={isAlert ? 'alert' : undefined}\n ref={ref}\n {...restProps}\n {...htmlAttributes}\n >\n {hasIcon && <StatusIcon variant={variant} />}\n <div className=\"ndl-banner-content\">{children}</div>\n {isCloseable && (\n <CleanIconButton\n size=\"small\"\n onClick={handleClose}\n description={null}\n htmlAttributes={{ 'aria-label': 'Close' }}\n >\n <XMarkIconOutline />\n </CleanIconButton>\n )}\n </Element>\n );\n};\n\nconst Banner = Object.assign(BannerComponent, {\n Actions: BannerActions,\n Description: BannerDescription,\n Header: BannerHeader,\n});\n\nexport { Banner };\n"]}

package/lib/cjs/clean-icon-button/stories/clean-icon-button-sizes.story.js CHANGED Viewed

@@ -25,7 +25,7 @@ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const icons_1 = require("@neo4j-ndl/react/icons");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "small", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-4", children: " Small" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "medium", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-4", children: " Medium" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "large", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-4", children: " Large" })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "small", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-3", children: " Small" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "medium", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-3", children: " Medium" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", size: "large", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-3", children: " Large" })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=clean-icon-button-sizes.story.js.map

package/lib/cjs/clean-icon-button/stories/clean-icon-button-sizes.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"clean-icon-button-sizes.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+D;AAC/D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAChD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,uBAAoB,IAC7C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,YACjD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,wBAAqB,IAC9C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAChD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,uBAAoB,IAC7C,IACF,CACP,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, Typography } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" size=\"small\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-4\"> Small</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" size=\"medium\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-4\"> Medium</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" size=\"large\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-4\"> Large</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"clean-icon-button-sizes.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-sizes.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+D;AAC/D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAChD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,uBAAoB,IAC7C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,YACjD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,wBAAqB,IAC9C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,IAAI,EAAC,OAAO,YAChD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,uBAAoB,IAC7C,IACF,CACP,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, Typography } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" size=\"small\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-3\"> Small</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" size=\"medium\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-3\"> Medium</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" size=\"large\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-3\"> Large</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/clean-icon-button/stories/clean-icon-button-tone.story.js CHANGED Viewed

@@ -25,7 +25,7 @@ require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
 const react_1 = require("@neo4j-ndl/react");
 const icons_1 = require("@neo4j-ndl/react/icons");
 const Component = () => {
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", variant: "neutral", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-4", children: "Default" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", variant: "danger", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-4", children: "Danger" })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-16", children: [(0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", variant: "neutral", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-3", children: "Default" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-row n-gap-token-16 n-items-center", children: [(0, jsx_runtime_1.jsx)(react_1.CleanIconButton, { description: "Search", variant: "danger", children: (0, jsx_runtime_1.jsx)(icons_1.MagnifyingGlassIconOutline, {}) }), (0, jsx_runtime_1.jsx)(react_1.Typography, { variant: "title-3", children: "Danger" })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=clean-icon-button-tone.story.js.map

package/lib/cjs/clean-icon-button/stories/clean-icon-button-tone.story.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"clean-icon-button-tone.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-tone.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+D;AAC/D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,YACrD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,wBAAqB,IAC9C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,QAAQ,YACpD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,uBAAoB,IAC7C,IACF,CACP,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, Typography } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" variant=\"neutral\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-4\">Default</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" variant=\"danger\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-4\">Danger</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}
1	+ {"version":3,"file":"clean-icon-button-tone.story.js","sourceRoot":"","sources":["../../../../src/clean-icon-button/stories/clean-icon-button-tone.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAA+D;AAC/D,kDAAoE;AAEpE,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,SAAS,YACrD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,wBAAqB,IAC9C,EACN,iCAAK,SAAS,EAAC,iDAAiD,aAC9D,uBAAC,uBAAe,IAAC,WAAW,EAAC,QAAQ,EAAC,OAAO,EAAC,QAAQ,YACpD,uBAAC,kCAA0B,KAAG,GACd,EAClB,uBAAC,kBAAU,IAAC,OAAO,EAAC,SAAS,uBAAoB,IAC7C,IACF,CACP,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, Typography } from '@neo4j-ndl/react';\nimport { MagnifyingGlassIconOutline } from '@neo4j-ndl/react/icons';\n\nconst Component = () => {\n return (\n <div className=\"n-flex n-flex-col n-gap-token-16\">\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" variant=\"neutral\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-3\">Default</Typography>\n </div>\n <div className=\"n-flex n-flex-row n-gap-token-16 n-items-center\">\n <CleanIconButton description=\"Search\" variant=\"danger\">\n <MagnifyingGlassIconOutline />\n </CleanIconButton>\n <Typography variant=\"title-3\">Danger</Typography>\n </div>\n </div>\n );\n};\n\nexport default Component;\n"]}

package/lib/cjs/data-grid/Components.js CHANGED Viewed

@@ -421,7 +421,7 @@ const LoadingPlaceholder = (_a) => {
 exports.LoadingPlaceholder = LoadingPlaceholder;
 const NoDataPlaceholder = (_a) => {
     var { children, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["children", "className", "style", "htmlAttributes", "ref"]);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, style: style, className: (0, classnames_1.default)('nld-table-placeholder-wrapper', className), role: "row" }, restProps, htmlAttributes, { children: children || ((0, jsx_runtime_1.jsxs)(exports.NoDataPlaceholderContentWrapper, { children: [(0, jsx_runtime_1.jsx)(NoDataIcon, {}), (0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: "subheading-small", children: "No data available" })] })) })));
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, style: style, className: (0, classnames_1.default)('nld-table-placeholder-wrapper', className), role: "row" }, restProps, htmlAttributes, { children: children || ((0, jsx_runtime_1.jsxs)(exports.NoDataPlaceholderContentWrapper, { children: [(0, jsx_runtime_1.jsx)(NoDataIcon, {}), (0, jsx_runtime_1.jsx)(typography_1.Typography, { variant: "subheading-medium", children: "No data available" })] })) })));
 };
 exports.NoDataPlaceholder = NoDataPlaceholder;
 const NoDataPlaceholderContentWrapper = (_a) => {