@neo4j-ndl/react 4.5.2 → 4.5.4

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

@@ -40,6 +40,7 @@ const react_1 = require("@neo4j-ndl/react");
 const icons_1 = require("@neo4j-ndl/react/icons");
 const classnames_1 = __importDefault(require("classnames"));
 const react_2 = require("react");
+const use_semi_controlled_state_1 = require("../../_common/use-semi-controlled-state");
 const presence_1 = require("../presence");
 const thinking_duration_formatter_1 = require("../thinking/thinking-duration-formatter");
 /**
@@ -61,14 +62,19 @@ const ReasoningComponent = (_a) => {
                 }), inert: !shouldShowChildren, children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-content-inner", children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-content-inner-2", children: children }) }) })] })));
 };
 const Section = (_a) => {
-    var { heading, leadingVisual, children, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["heading", "leadingVisual", "children", "className", "style", "htmlAttributes", "ref"]);
+    var _b;
+    var { heading, leadingVisual, children, className, style, htmlAttributes, ref, isExpanded, isDefaultExpanded, 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);
-    const [isExpanded, setIsExpanded] = (0, react_2.useState)(false);
-    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.jsx)(react_1.CleanIconButton, { description: isExpanded ? 'Collapse' : 'Expand', size: "small", variant: "neutral", className: (0, classnames_1.default)('ndl-ai-reasoning-expand-button', {
-                            'ndl-expanded': isExpanded,
-                        }), onClick: () => setIsExpanded(!isExpanded), children: (0, jsx_runtime_1.jsx)(icons_1.ChevronDownIconOutline, {}) })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ndl-ai-reasoning-section-content', {
-                    'ndl-expanded': isExpanded,
-                }), inert: !isExpanded, children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-content-inner", children: (0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-reasoning-section-content-inner-2", 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 [isExpandedState, setIsExpandedState] = (0, use_semi_controlled_state_1.useSemicontrolledState)({
+        isControlled: isExpanded !== undefined,
+        onChange: onExpandChange,
+        state: (_b = isExpanded !== null && isExpanded !== void 0 ? isExpanded : isDefaultExpanded) !== null && _b !== void 0 ? _b : false,
+    });
+    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.jsx)(react_1.CleanIconButton, { description: isExpandedState ? 'Collapse' : 'Expand', size: "small", variant: "neutral", className: (0, classnames_1.default)('ndl-ai-reasoning-expand-button', {
+                            'ndl-expanded': isExpandedState,
+                        }), onClick: () => setIsExpandedState((prev) => !prev), children: (0, jsx_runtime_1.jsx)(icons_1.ChevronDownIconOutline, {}) })] }), (0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)('ndl-ai-reasoning-section-content', {
+                    'ndl-expanded': isExpandedState,
+                }), inert: !isExpandedState, children: (0, jsx_runtime_1.jsx)("div", { className: "ndl-ai-reasoning-section-content-inner", children: (0, jsx_runtime_1.jsxs)("div", { className: "ndl-ai-reasoning-section-content-inner-2", 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 Reasoning = Object.assign(ReasoningComponent, {
     Section,

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

@@ -1 +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 { CleanIconButton, Typography } from '@neo4j-ndl/react';\nimport { ChevronDownIconOutline } from '@neo4j-ndl/react/icons';\nimport classNames from 'classnames';\nimport { useState } from 'react';\n\nimport { type CommonProps } from '../../_common/types';\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\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 variant=\"label\" className=\"ndl-ai-reasoning-header\">\n        {isThinking === true ? (\n          <>\n            <Presence isThinking={isThinking} className=\"n-size-token-24\" />\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            <CleanIconButton\n              size=\"small\"\n              variant=\"neutral\"\n              onClick={() => setIsExpanded(!isExpanded)}\n              description={isExpanded ? 'Collapse' : 'Expand'}\n              className={classNames('ndl-ai-reasoning-expand-button', {\n                'ndl-expanded': isExpanded,\n              })}\n            >\n              <ChevronDownIconOutline />\n            </CleanIconButton>\n          </>\n        )}\n      </Typography>\n      <div\n        className={classNames('ndl-ai-reasoning-content', {\n          'ndl-expanded': shouldShowChildren,\n        })}\n        inert={!shouldShowChildren}\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};\n\nconst Section = ({\n  heading,\n  leadingVisual,\n  children,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: CommonProps<'div', SectionProps>) => {\n  const classes = classNames('ndl-ai-reasoning-section', className);\n  const [isExpanded, setIsExpanded] = useState(false);\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        <CleanIconButton\n          description={isExpanded ? 'Collapse' : 'Expand'}\n          size=\"small\"\n          variant=\"neutral\"\n          className={classNames('ndl-ai-reasoning-expand-button', {\n            'ndl-expanded': isExpanded,\n          })}\n          onClick={() => setIsExpanded(!isExpanded)}\n        >\n          <ChevronDownIconOutline />\n        </CleanIconButton>\n      </div>\n      <div\n        className={classNames('ndl-ai-reasoning-section-content', {\n          'ndl-expanded': isExpanded,\n        })}\n        inert={!isExpanded}\n      >\n        <div className=\"ndl-ai-reasoning-section-content-inner\">\n          <div className=\"ndl-ai-reasoning-section-content-inner-2\">\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      </div>\n    </div>\n  );\n};\n\nconst Reasoning = Object.assign(ReasoningComponent, {\n  Section,\n});\n\nexport { Reasoning };\n"]}
+{"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 { CleanIconButton, Typography } from '@neo4j-ndl/react';\nimport { ChevronDownIconOutline } from '@neo4j-ndl/react/icons';\nimport classNames from 'classnames';\nimport { useState } from 'react';\n\nimport { type CommonProps } from '../../_common/types';\nimport { useSemicontrolledState } from '../../_common/use-semi-controlled-state';\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\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 variant=\"label\" className=\"ndl-ai-reasoning-header\">\n        {isThinking === true ? (\n          <>\n            <Presence isThinking={isThinking} className=\"n-size-token-24\" />\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            <CleanIconButton\n              size=\"small\"\n              variant=\"neutral\"\n              onClick={() => setIsExpanded(!isExpanded)}\n              description={isExpanded ? 'Collapse' : 'Expand'}\n              className={classNames('ndl-ai-reasoning-expand-button', {\n                'ndl-expanded': isExpanded,\n              })}\n            >\n              <ChevronDownIconOutline />\n            </CleanIconButton>\n          </>\n        )}\n      </Typography>\n      <div\n        className={classNames('ndl-ai-reasoning-content', {\n          'ndl-expanded': shouldShowChildren,\n        })}\n        inert={!shouldShowChildren}\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  /** Whether the section is expanded */\n  isExpanded?: boolean;\n  /** The default value of the section is expanded */\n  isDefaultExpanded?: boolean;\n  /** Callback function triggered when the section is expanded */\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,\n  isDefaultExpanded,\n  onExpandChange,\n  ...restProps\n}: CommonProps<'div', SectionProps>) => {\n  const classes = classNames('ndl-ai-reasoning-section', className);\n  const [isExpandedState, setIsExpandedState] = useSemicontrolledState({\n    isControlled: isExpanded !== undefined,\n    onChange: onExpandChange,\n    state: isExpanded ?? isDefaultExpanded ?? false,\n  });\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        <CleanIconButton\n          description={isExpandedState ? 'Collapse' : 'Expand'}\n          size=\"small\"\n          variant=\"neutral\"\n          className={classNames('ndl-ai-reasoning-expand-button', {\n            'ndl-expanded': isExpandedState,\n          })}\n          onClick={() => setIsExpandedState((prev) => !prev)}\n        >\n          <ChevronDownIconOutline />\n        </CleanIconButton>\n      </div>\n      <div\n        className={classNames('ndl-ai-reasoning-section-content', {\n          'ndl-expanded': isExpandedState,\n        })}\n        inert={!isExpandedState}\n      >\n        <div className=\"ndl-ai-reasoning-section-content-inner\">\n          <div className=\"ndl-ai-reasoning-section-content-inner-2\">\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      </div>\n    </div>\n  );\n};\n\nconst Reasoning = Object.assign(ReasoningComponent, {\n  Section,\n});\n\nexport { Reasoning };\n"]}

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

@@ -23,10 +23,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.ReasoningFullSrc = exports.ReasoningFull = void 0;
+exports.ReasoningControlledSrc = exports.ReasoningFullSrc = exports.ReasoningControlled = exports.ReasoningFull = void 0;
 var reasoning_full_story_1 = require("./reasoning-full.story");
 Object.defineProperty(exports, "ReasoningFull", { enumerable: true, get: function () { return __importDefault(reasoning_full_story_1).default; } });
+var reasoning_controlled_story_1 = require("./reasoning-controlled.story");
+Object.defineProperty(exports, "ReasoningControlled", { enumerable: true, get: function () { return __importDefault(reasoning_controlled_story_1).default; } });
 const export_stories_utils_1 = require("../../../_common/export-stories-utils");
+const reasoning_controlled_story_raw_1 = __importDefault(require("./reasoning-controlled.story?raw"));
 const reasoning_full_story_raw_1 = __importDefault(require("./reasoning-full.story?raw"));
 exports.ReasoningFullSrc = (0, export_stories_utils_1.removeLicenseHeader)(reasoning_full_story_raw_1.default);
+exports.ReasoningControlledSrc = (0, export_stories_utils_1.removeLicenseHeader)(reasoning_controlled_story_raw_1.default);
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAEH,+DAAkE;AAAzD,sIAAA,OAAO,OAAiB;AAEjC,gFAA4E;AAC5E,0FAA6D;AAEhD,QAAA,gBAAgB,GAAG,IAAA,0CAAmB,EAAC,kCAAmB,CAAC,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as ReasoningFull } from './reasoning-full.story';\n\nimport { removeLicenseHeader } from '../../../_common/export-stories-utils';\nimport ReasoningFullSrcRaw from './reasoning-full.story?raw';\n\nexport const ReasoningFullSrc = removeLicenseHeader(ReasoningFullSrcRaw);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;;;;AAEH,+DAAkE;AAAzD,sIAAA,OAAO,OAAiB;AACjC,2EAA8E;AAArE,kJAAA,OAAO,OAAuB;AAEvC,gFAA4E;AAC5E,sGAAyE;AACzE,0FAA6D;AAEhD,QAAA,gBAAgB,GAAG,IAAA,0CAAmB,EAAC,kCAAmB,CAAC,CAAC;AAC5D,QAAA,sBAAsB,GAAG,IAAA,0CAAmB,EACvD,wCAAyB,CAC1B,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as ReasoningFull } from './reasoning-full.story';\nexport { default as ReasoningControlled } from './reasoning-controlled.story';\n\nimport { removeLicenseHeader } from '../../../_common/export-stories-utils';\nimport ReasoningControlledSrcRaw from './reasoning-controlled.story?raw';\nimport ReasoningFullSrcRaw from './reasoning-full.story?raw';\n\nexport const ReasoningFullSrc = removeLicenseHeader(ReasoningFullSrcRaw);\nexport const ReasoningControlledSrc = removeLicenseHeader(\n  ReasoningControlledSrcRaw,\n);\n"]}

package/lib/cjs/ai/reasoning/stories/reasoning-controlled.story.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+/**
+ *
+ *  Copyright (c) "Neo4j"
+ *  Neo4j Sweden AB [http://neo4j.com]
+ *
+ *  This file is part of Neo4j.
+ *
+ *  Neo4j is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+require("@neo4j-ndl/base/lib/neo4j-ds-styles.css");
+const ai_1 = require("@neo4j-ndl/react/ai");
+const icons_1 = require("@neo4j-ndl/react/icons");
+const react_1 = require("react");
+const Component = () => {
+    const [isFirstSectionExpanded, setIsFirstSectionExpanded] = (0, react_1.useState)(false);
+    const [isSecondSectionExpanded, setIsSecondSectionExpanded] = (0, react_1.useState)(false);
+    return ((0, jsx_runtime_1.jsxs)(ai_1.Reasoning, { isThinking: false, thinkingMs: 1400, children: [(0, jsx_runtime_1.jsx)(ai_1.Reasoning.Section, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PencilSquareIconOutline, {}), heading: "Creating an action plan", isExpanded: isFirstSectionExpanded, onExpandChange: (isExpanded) => setIsFirstSectionExpanded(isExpanded), children: "Step 1 content" }), (0, jsx_runtime_1.jsx)(ai_1.Reasoning.Section, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.WrenchIconOutline, {}), heading: "Applying agent tools", isExpanded: isSecondSectionExpanded, onExpandChange: (isExpanded) => setIsSecondSectionExpanded(isExpanded), children: "Step 2 content" })] }));
+};
+exports.default = Component;
+//# sourceMappingURL=reasoning-controlled.story.js.map

package/lib/cjs/ai/reasoning/stories/reasoning-controlled.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reasoning-controlled.story.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning-controlled.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAgD;AAChD,kDAGgC;AAChC,iCAAiC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC5E,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAE9E,OAAO,CACL,wBAAC,cAAS,IAAC,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,IAAI,aAC5C,uBAAC,cAAS,CAAC,OAAO,IAChB,aAAa,EAAE,uBAAC,+BAAuB,KAAG,EAC1C,OAAO,EAAC,yBAAyB,EACjC,UAAU,EAAE,sBAAsB,EAClC,cAAc,EAAE,CAAC,UAAU,EAAE,EAAE,CAAC,yBAAyB,CAAC,UAAU,CAAC,+BAGnD,EACpB,uBAAC,cAAS,CAAC,OAAO,IAChB,aAAa,EAAE,uBAAC,yBAAiB,KAAG,EACpC,OAAO,EAAC,sBAAsB,EAC9B,UAAU,EAAE,uBAAuB,EACnC,cAAc,EAAE,CAAC,UAAU,EAAE,EAAE,CAAC,0BAA0B,CAAC,UAAU,CAAC,+BAGpD,IACV,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 { Reasoning } from '@neo4j-ndl/react/ai';\nimport {\n  PencilSquareIconOutline,\n  WrenchIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [isFirstSectionExpanded, setIsFirstSectionExpanded] = useState(false);\n  const [isSecondSectionExpanded, setIsSecondSectionExpanded] = useState(false);\n\n  return (\n    <Reasoning isThinking={false} thinkingMs={1400}>\n      <Reasoning.Section\n        leadingVisual={<PencilSquareIconOutline />}\n        heading=\"Creating an action plan\"\n        isExpanded={isFirstSectionExpanded}\n        onExpandChange={(isExpanded) => setIsFirstSectionExpanded(isExpanded)}\n      >\n        Step 1 content\n      </Reasoning.Section>\n      <Reasoning.Section\n        leadingVisual={<WrenchIconOutline />}\n        heading=\"Applying agent tools\"\n        isExpanded={isSecondSectionExpanded}\n        onExpandChange={(isExpanded) => setIsSecondSectionExpanded(isExpanded)}\n      >\n        Step 2 content\n      </Reasoning.Section>\n    </Reasoning>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/ai/reasoning/stories/reasoning-full.story.js

@@ -28,7 +28,7 @@ const icons_1 = require("@neo4j-ndl/react/icons");
 const react_2 = require("react");
 const Component = () => {
     const [isThinking, setThinking] = (0, react_2.useState)(true);
-    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-12", children: [(0, jsx_runtime_1.jsx)(react_1.FilledButton, { onClick: () => setThinking(!isThinking), children: isThinking ? 'Stop Thinking' : 'Start Thinking' }), (0, jsx_runtime_1.jsxs)(ai_1.Reasoning, { isThinking: isThinking, thinkingMs: 1400, currentAction: "Creating an action plan", children: [(0, jsx_runtime_1.jsx)(ai_1.Reasoning.Section, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PencilSquareIconOutline, {}), heading: "Creating an action plan", children: "Step 1 content" }), (0, jsx_runtime_1.jsx)(ai_1.Reasoning.Section, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.WrenchIconOutline, {}), heading: "Applying agent tools", children: "Step 2 content" })] })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "n-flex n-flex-col n-gap-token-12", children: [(0, jsx_runtime_1.jsx)(react_1.FilledButton, { onClick: () => setThinking(!isThinking), children: isThinking ? 'Stop Thinking' : 'Start Thinking' }), (0, jsx_runtime_1.jsxs)(ai_1.Reasoning, { isThinking: isThinking, thinkingMs: 1400, currentAction: "Creating an action plan", children: [(0, jsx_runtime_1.jsx)(ai_1.Reasoning.Section, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.PencilSquareIconOutline, {}), heading: "Creating an action plan", isDefaultExpanded: true, children: "Step 1 content" }), (0, jsx_runtime_1.jsx)(ai_1.Reasoning.Section, { leadingVisual: (0, jsx_runtime_1.jsx)(icons_1.WrenchIconOutline, {}), heading: "Applying agent tools", children: "Step 2 content" })] })] }));
 };
 exports.default = Component;
 //# sourceMappingURL=reasoning-full.story.js.map

package/lib/cjs/ai/reasoning/stories/reasoning-full.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"reasoning-full.story.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning-full.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAgD;AAChD,4CAAgD;AAChD,kDAGgC;AAChC,iCAAiC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,UAAU,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IAEjD,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,uBAAC,oBAAY,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,UAAU,CAAC,YAClD,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,GACnC,EACf,wBAAC,cAAS,IACR,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,IAAI,EAChB,aAAa,EAAC,yBAAyB,aAEvC,uBAAC,cAAS,CAAC,OAAO,IAChB,aAAa,EAAE,uBAAC,+BAAuB,KAAG,EAC1C,OAAO,EAAC,yBAAyB,+BAGf,EACpB,uBAAC,cAAS,CAAC,OAAO,IAChB,aAAa,EAAE,uBAAC,yBAAiB,KAAG,EACpC,OAAO,EAAC,sBAAsB,+BAGZ,IACV,IACR,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 { FilledButton } from '@neo4j-ndl/react';\nimport { Reasoning } from '@neo4j-ndl/react/ai';\nimport {\n  PencilSquareIconOutline,\n  WrenchIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [isThinking, setThinking] = useState(true);\n\n  return (\n    <div className=\"n-flex n-flex-col n-gap-token-12\">\n      <FilledButton onClick={() => setThinking(!isThinking)}>\n        {isThinking ? 'Stop Thinking' : 'Start Thinking'}\n      </FilledButton>\n      <Reasoning\n        isThinking={isThinking}\n        thinkingMs={1400}\n        currentAction=\"Creating an action plan\"\n      >\n        <Reasoning.Section\n          leadingVisual={<PencilSquareIconOutline />}\n          heading=\"Creating an action plan\"\n        >\n          Step 1 content\n        </Reasoning.Section>\n        <Reasoning.Section\n          leadingVisual={<WrenchIconOutline />}\n          heading=\"Applying agent tools\"\n        >\n          Step 2 content\n        </Reasoning.Section>\n      </Reasoning>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"reasoning-full.story.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning-full.story.tsx"],"names":[],"mappings":";;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,mDAAiD;AAEjD,4CAAgD;AAChD,4CAAgD;AAChD,kDAGgC;AAChC,iCAAiC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,UAAU,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAAC,IAAI,CAAC,CAAC;IAEjD,OAAO,CACL,iCAAK,SAAS,EAAC,kCAAkC,aAC/C,uBAAC,oBAAY,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,UAAU,CAAC,YAClD,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,GACnC,EACf,wBAAC,cAAS,IACR,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,IAAI,EAChB,aAAa,EAAC,yBAAyB,aAEvC,uBAAC,cAAS,CAAC,OAAO,IAChB,aAAa,EAAE,uBAAC,+BAAuB,KAAG,EAC1C,OAAO,EAAC,yBAAyB,EACjC,iBAAiB,EAAE,IAAI,+BAGL,EACpB,uBAAC,cAAS,CAAC,OAAO,IAChB,aAAa,EAAE,uBAAC,yBAAiB,KAAG,EACpC,OAAO,EAAC,sBAAsB,+BAGZ,IACV,IACR,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 { FilledButton } from '@neo4j-ndl/react';\nimport { Reasoning } from '@neo4j-ndl/react/ai';\nimport {\n  PencilSquareIconOutline,\n  WrenchIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [isThinking, setThinking] = useState(true);\n\n  return (\n    <div className=\"n-flex n-flex-col n-gap-token-12\">\n      <FilledButton onClick={() => setThinking(!isThinking)}>\n        {isThinking ? 'Stop Thinking' : 'Start Thinking'}\n      </FilledButton>\n      <Reasoning\n        isThinking={isThinking}\n        thinkingMs={1400}\n        currentAction=\"Creating an action plan\"\n      >\n        <Reasoning.Section\n          leadingVisual={<PencilSquareIconOutline />}\n          heading=\"Creating an action plan\"\n          isDefaultExpanded={true}\n        >\n          Step 1 content\n        </Reasoning.Section>\n        <Reasoning.Section\n          leadingVisual={<WrenchIconOutline />}\n          heading=\"Applying agent tools\"\n        >\n          Step 2 content\n        </Reasoning.Section>\n      </Reasoning>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/cjs/ai/reasoning/stories/reasoning.stories.js

@@ -21,7 +21,7 @@
 
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.Full = void 0;
+exports.Controlled = exports.Full = void 0;
 const Reasoning_1 = require("../Reasoning");
 const _1 = require(".");
 const componentMeta = {
@@ -47,4 +47,17 @@ exports.Full = {
     },
     render: _1.ReasoningFull,
 };
+exports.Controlled = {
+    args: {},
+    parameters: {
+        docs: {
+            source: {
+                code: _1.ReasoningControlledSrc,
+                language: 'tsx',
+                type: 'code',
+            },
+        },
+    },
+    render: _1.ReasoningControlled,
+};
 //# sourceMappingURL=reasoning.stories.js.map

package/lib/cjs/ai/reasoning/stories/reasoning.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"reasoning.stories.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning.stories.tsx"],"names":[],"mappings":";;;AAsBA,4CAAyC;AACzC,wBAAoD;AAEpD,MAAM,aAAa,GAA2B;IAC5C,SAAS,EAAE,qBAAS;IACpB,EAAE,EAAE,yBAAyB;IAC7B,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,KAAK,EAAE,yBAAyB;CACjC,CAAC;AAEF,kBAAe,aAAa,CAAC;AAIhB,QAAA,IAAI,GAAU;IACzB,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,mBAAgB;gBACtB,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,gBAAa;CACtB,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { type Meta, type StoryObj } from '@storybook/react-vite';\n\nimport { Reasoning } from '../Reasoning';\nimport { ReasoningFull, ReasoningFullSrc } from '.';\n\nconst componentMeta: Meta<typeof Reasoning> = {\n  component: Reasoning,\n  id: 'components-ai-reasoning',\n  parameters: {\n    controls: { disable: true },\n  },\n  tags: ['docsPage'],\n  title: 'Components/AI/Reasoning',\n};\n\nexport default componentMeta;\n\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Full: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: ReasoningFullSrc,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: ReasoningFull,\n};\n"]}
+{"version":3,"file":"reasoning.stories.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning.stories.tsx"],"names":[],"mappings":";;;AAsBA,4CAAyC;AACzC,wBAKW;AAEX,MAAM,aAAa,GAA2B;IAC5C,SAAS,EAAE,qBAAS;IACpB,EAAE,EAAE,yBAAyB;IAC7B,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,KAAK,EAAE,yBAAyB;CACjC,CAAC;AAEF,kBAAe,aAAa,CAAC;AAIhB,QAAA,IAAI,GAAU;IACzB,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,mBAAgB;gBACtB,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,gBAAa;CACtB,CAAC;AAEW,QAAA,UAAU,GAAU;IAC/B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,yBAAsB;gBAC5B,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,sBAAmB;CAC5B,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { type Meta, type StoryObj } from '@storybook/react-vite';\n\nimport { Reasoning } from '../Reasoning';\nimport {\n  ReasoningControlled,\n  ReasoningControlledSrc,\n  ReasoningFull,\n  ReasoningFullSrc,\n} from '.';\n\nconst componentMeta: Meta<typeof Reasoning> = {\n  component: Reasoning,\n  id: 'components-ai-reasoning',\n  parameters: {\n    controls: { disable: true },\n  },\n  tags: ['docsPage'],\n  title: 'Components/AI/Reasoning',\n};\n\nexport default componentMeta;\n\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Full: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: ReasoningFullSrc,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: ReasoningFull,\n};\n\nexport const Controlled: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: ReasoningControlledSrc,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: ReasoningControlled,\n};\n"]}

package/lib/esm/ai/reasoning/Reasoning.js

@@ -34,6 +34,7 @@ import { CleanIconButton, Typography } from '@neo4j-ndl/react';
 import { ChevronDownIconOutline } from '@neo4j-ndl/react/icons';
 import classNames from 'classnames';
 import { useState } from 'react';
+import { useSemicontrolledState } from '../../_common/use-semi-controlled-state';
 import { Presence } from '../presence';
 import { formatThinkingDuration } from '../thinking/thinking-duration-formatter';
 /**
@@ -55,14 +56,19 @@ const ReasoningComponent = (_a) => {
                 }), inert: !shouldShowChildren, children: _jsx("div", { className: "ndl-ai-reasoning-content-inner", children: _jsx("div", { className: "ndl-ai-reasoning-content-inner-2", children: children }) }) })] })));
 };
 const Section = (_a) => {
-    var { heading, leadingVisual, children, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["heading", "leadingVisual", "children", "className", "style", "htmlAttributes", "ref"]);
+    var _b;
+    var { heading, leadingVisual, children, className, style, htmlAttributes, ref, isExpanded, isDefaultExpanded, onExpandChange } = _a, restProps = __rest(_a, ["heading", "leadingVisual", "children", "className", "style", "htmlAttributes", "ref", "isExpanded", "isDefaultExpanded", "onExpandChange"]);
     const classes = classNames('ndl-ai-reasoning-section', className);
-    const [isExpanded, setIsExpanded] = useState(false);
-    return (_jsxs("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [_jsxs("div", { className: "ndl-ai-reasoning-section-header", children: [_jsx("div", { className: "ndl-ai-reasoning-section-leading", children: leadingVisual }), _jsx(Typography, { variant: "subheading-small", children: heading }), _jsx(CleanIconButton, { description: isExpanded ? 'Collapse' : 'Expand', size: "small", variant: "neutral", className: classNames('ndl-ai-reasoning-expand-button', {
-                            'ndl-expanded': isExpanded,
-                        }), onClick: () => setIsExpanded(!isExpanded), children: _jsx(ChevronDownIconOutline, {}) })] }), _jsx("div", { className: classNames('ndl-ai-reasoning-section-content', {
-                    'ndl-expanded': isExpanded,
-                }), inert: !isExpanded, children: _jsx("div", { className: "ndl-ai-reasoning-section-content-inner", children: _jsxs("div", { className: "ndl-ai-reasoning-section-content-inner-2", children: [_jsx("div", { className: "ndl-ai-reasoning-section-content-line-container", children: _jsx("div", { className: "ndl-ai-reasoning-section-content-line" }) }), _jsx("div", { className: "ndl-ai-reasoning-section-content-children", children: children })] }) }) })] })));
+    const [isExpandedState, setIsExpandedState] = useSemicontrolledState({
+        isControlled: isExpanded !== undefined,
+        onChange: onExpandChange,
+        state: (_b = isExpanded !== null && isExpanded !== void 0 ? isExpanded : isDefaultExpanded) !== null && _b !== void 0 ? _b : false,
+    });
+    return (_jsxs("div", Object.assign({ ref: ref, className: classes, style: style }, restProps, htmlAttributes, { children: [_jsxs("div", { className: "ndl-ai-reasoning-section-header", children: [_jsx("div", { className: "ndl-ai-reasoning-section-leading", children: leadingVisual }), _jsx(Typography, { variant: "subheading-small", children: heading }), _jsx(CleanIconButton, { description: isExpandedState ? 'Collapse' : 'Expand', size: "small", variant: "neutral", className: classNames('ndl-ai-reasoning-expand-button', {
+                            'ndl-expanded': isExpandedState,
+                        }), onClick: () => setIsExpandedState((prev) => !prev), children: _jsx(ChevronDownIconOutline, {}) })] }), _jsx("div", { className: classNames('ndl-ai-reasoning-section-content', {
+                    'ndl-expanded': isExpandedState,
+                }), inert: !isExpandedState, children: _jsx("div", { className: "ndl-ai-reasoning-section-content-inner", children: _jsxs("div", { className: "ndl-ai-reasoning-section-content-inner-2", children: [_jsx("div", { className: "ndl-ai-reasoning-section-content-line-container", children: _jsx("div", { className: "ndl-ai-reasoning-section-content-line" }) }), _jsx("div", { className: "ndl-ai-reasoning-section-content-children", children: children })] }) }) })] })));
 };
 const Reasoning = Object.assign(ReasoningComponent, {
     Section,

package/lib/esm/ai/reasoning/Reasoning.js.map

@@ -1 +1 @@
-{"version":3,"file":"Reasoning.js","sourceRoot":"","sources":["../../../../src/ai/reasoning/Reasoning.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC/D,OAAO,EAAE,sBAAsB,EAAE,MAAM,wBAAwB,CAAC;AAChE,OAAO,UAAU,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGjC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,EAAE,sBAAsB,EAAE,MAAM,yCAAyC,CAAC;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,UAAU,CAAC,kBAAkB,EAAE,SAAS,CAAC,CAAC;IAC1D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpD,MAAM,kBAAkB,GAAG,UAAU,IAAI,UAAU,KAAK,KAAK,CAAC;IAE9D,MAAM,EAAE,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,GAAG,sBAAsB,CAAC,UAAU,CAAC,CAAC;IAE7E,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,eAElB,KAAC,UAAU,IAAC,OAAO,EAAC,OAAO,EAAC,SAAS,EAAC,yBAAyB,YAC5D,UAAU,KAAK,IAAI,CAAC,CAAC,CAAC,CACrB,8BACE,KAAC,QAAQ,IAAC,UAAU,EAAE,UAAU,EAAE,SAAS,EAAC,iBAAiB,GAAG,EAChE,gBAAM,SAAS,EAAC,8BAA8B,aAC3C,aAAa,WACT,IACN,CACJ,CAAC,CAAC,CAAC,CACF,8BACE,2CACe,gBAAgB,OAAG,IAAI,IAC/B,EACP,KAAC,eAAe,IACd,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,SAAS,EACjB,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC,EACzC,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,EAC/C,SAAS,EAAE,UAAU,CAAC,gCAAgC,EAAE;gCACtD,cAAc,EAAE,UAAU;6BAC3B,CAAC,YAEF,KAAC,sBAAsB,KAAG,GACV,IACjB,CACJ,GACU,EACb,cACE,SAAS,EAAE,UAAU,CAAC,0BAA0B,EAAE;oBAChD,cAAc,EAAE,kBAAkB;iBACnC,CAAC,EACF,KAAK,EAAE,CAAC,kBAAkB,YAE1B,cAAK,SAAS,EAAC,gCAAgC,YAC7C,cAAK,SAAS,EAAC,kCAAkC,YAAE,QAAQ,GAAO,GAC9D,GACF,KACF,CACP,CAAC;AACJ,CAAC,CAAC;AAWF,MAAM,OAAO,GAAG,CAAC,EASkB,EAAE,EAAE;QATtB,EACf,OAAO,EACP,aAAa,EACb,QAAQ,EACR,SAAS,EACT,KAAK,EACL,cAAc,EACd,GAAG,OAE8B,EAD9B,SAAS,cARG,uFAShB,CADa;IAEZ,MAAM,OAAO,GAAG,UAAU,CAAC,0BAA0B,EAAE,SAAS,CAAC,CAAC;IAClE,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAEpD,OAAO,CACL,6BACE,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,OAAO,EAClB,KAAK,EAAE,KAAK,IACR,SAAS,EACT,cAAc,eAElB,eAAK,SAAS,EAAC,iCAAiC,aAC9C,cAAK,SAAS,EAAC,kCAAkC,YAAE,aAAa,GAAO,EACvE,KAAC,UAAU,IAAC,OAAO,EAAC,kBAAkB,YAAE,OAAO,GAAc,EAC7D,KAAC,eAAe,IACd,WAAW,EAAE,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,QAAQ,EAC/C,IAAI,EAAC,OAAO,EACZ,OAAO,EAAC,SAAS,EACjB,SAAS,EAAE,UAAU,CAAC,gCAAgC,EAAE;4BACtD,cAAc,EAAE,UAAU;yBAC3B,CAAC,EACF,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,CAAC,UAAU,CAAC,YAEzC,KAAC,sBAAsB,KAAG,GACV,IACd,EACN,cACE,SAAS,EAAE,UAAU,CAAC,kCAAkC,EAAE;oBACxD,cAAc,EAAE,UAAU;iBAC3B,CAAC,EACF,KAAK,EAAE,CAAC,UAAU,YAElB,cAAK,SAAS,EAAC,wCAAwC,YACrD,eAAK,SAAS,EAAC,0CAA0C,aACvD,cAAK,SAAS,EAAC,iDAAiD,YAC9D,cAAK,SAAS,EAAC,uCAAuC,GAAG,GACrD,EACN,cAAK,SAAS,EAAC,2CAA2C,YACvD,QAAQ,GACL,IACF,GACF,GACF,KACF,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,CAAC,kBAAkB,EAAE;IAClD,OAAO;CACR,CAAC,CAAC;AAEH,OAAO,EAAE,SAAS,EAAE,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 { CleanIconButton, Typography } from '@neo4j-ndl/react';\nimport { ChevronDownIconOutline } from '@neo4j-ndl/react/icons';\nimport classNames from 'classnames';\nimport { useState } from 'react';\n\nimport { type CommonProps } from '../../_common/types';\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\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 variant=\"label\" className=\"ndl-ai-reasoning-header\">\n        {isThinking === true ? (\n          <>\n            <Presence isThinking={isThinking} className=\"n-size-token-24\" />\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            <CleanIconButton\n              size=\"small\"\n              variant=\"neutral\"\n              onClick={() => setIsExpanded(!isExpanded)}\n              description={isExpanded ? 'Collapse' : 'Expand'}\n              className={classNames('ndl-ai-reasoning-expand-button', {\n                'ndl-expanded': isExpanded,\n              })}\n            >\n              <ChevronDownIconOutline />\n            </CleanIconButton>\n          </>\n        )}\n      </Typography>\n      <div\n        className={classNames('ndl-ai-reasoning-content', {\n          'ndl-expanded': shouldShowChildren,\n        })}\n        inert={!shouldShowChildren}\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};\n\nconst Section = ({\n  heading,\n  leadingVisual,\n  children,\n  className,\n  style,\n  htmlAttributes,\n  ref,\n  ...restProps\n}: CommonProps<'div', SectionProps>) => {\n  const classes = classNames('ndl-ai-reasoning-section', className);\n  const [isExpanded, setIsExpanded] = useState(false);\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        <CleanIconButton\n          description={isExpanded ? 'Collapse' : 'Expand'}\n          size=\"small\"\n          variant=\"neutral\"\n          className={classNames('ndl-ai-reasoning-expand-button', {\n            'ndl-expanded': isExpanded,\n          })}\n          onClick={() => setIsExpanded(!isExpanded)}\n        >\n          <ChevronDownIconOutline />\n        </CleanIconButton>\n      </div>\n      <div\n        className={classNames('ndl-ai-reasoning-section-content', {\n          'ndl-expanded': isExpanded,\n        })}\n        inert={!isExpanded}\n      >\n        <div className=\"ndl-ai-reasoning-section-content-inner\">\n          <div className=\"ndl-ai-reasoning-section-content-inner-2\">\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      </div>\n    </div>\n  );\n};\n\nconst Reasoning = Object.assign(ReasoningComponent, {\n  Section,\n});\n\nexport { Reasoning };\n"]}
+{"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 { CleanIconButton, Typography } from '@neo4j-ndl/react';\nimport { ChevronDownIconOutline } from '@neo4j-ndl/react/icons';\nimport classNames from 'classnames';\nimport { useState } from 'react';\n\nimport { type CommonProps } from '../../_common/types';\nimport { useSemicontrolledState } from '../../_common/use-semi-controlled-state';\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\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 variant=\"label\" className=\"ndl-ai-reasoning-header\">\n        {isThinking === true ? (\n          <>\n            <Presence isThinking={isThinking} className=\"n-size-token-24\" />\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            <CleanIconButton\n              size=\"small\"\n              variant=\"neutral\"\n              onClick={() => setIsExpanded(!isExpanded)}\n              description={isExpanded ? 'Collapse' : 'Expand'}\n              className={classNames('ndl-ai-reasoning-expand-button', {\n                'ndl-expanded': isExpanded,\n              })}\n            >\n              <ChevronDownIconOutline />\n            </CleanIconButton>\n          </>\n        )}\n      </Typography>\n      <div\n        className={classNames('ndl-ai-reasoning-content', {\n          'ndl-expanded': shouldShowChildren,\n        })}\n        inert={!shouldShowChildren}\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  /** Whether the section is expanded */\n  isExpanded?: boolean;\n  /** The default value of the section is expanded */\n  isDefaultExpanded?: boolean;\n  /** Callback function triggered when the section is expanded */\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,\n  isDefaultExpanded,\n  onExpandChange,\n  ...restProps\n}: CommonProps<'div', SectionProps>) => {\n  const classes = classNames('ndl-ai-reasoning-section', className);\n  const [isExpandedState, setIsExpandedState] = useSemicontrolledState({\n    isControlled: isExpanded !== undefined,\n    onChange: onExpandChange,\n    state: isExpanded ?? isDefaultExpanded ?? false,\n  });\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        <CleanIconButton\n          description={isExpandedState ? 'Collapse' : 'Expand'}\n          size=\"small\"\n          variant=\"neutral\"\n          className={classNames('ndl-ai-reasoning-expand-button', {\n            'ndl-expanded': isExpandedState,\n          })}\n          onClick={() => setIsExpandedState((prev) => !prev)}\n        >\n          <ChevronDownIconOutline />\n        </CleanIconButton>\n      </div>\n      <div\n        className={classNames('ndl-ai-reasoning-section-content', {\n          'ndl-expanded': isExpandedState,\n        })}\n        inert={!isExpandedState}\n      >\n        <div className=\"ndl-ai-reasoning-section-content-inner\">\n          <div className=\"ndl-ai-reasoning-section-content-inner-2\">\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      </div>\n    </div>\n  );\n};\n\nconst Reasoning = Object.assign(ReasoningComponent, {\n  Section,\n});\n\nexport { Reasoning };\n"]}

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

@@ -19,7 +19,10 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 export { default as ReasoningFull } from './reasoning-full.story';
+export { default as ReasoningControlled } from './reasoning-controlled.story';
 import { removeLicenseHeader } from '../../../_common/export-stories-utils';
+import ReasoningControlledSrcRaw from './reasoning-controlled.story?raw';
 import ReasoningFullSrcRaw from './reasoning-full.story?raw';
 export const ReasoningFullSrc = removeLicenseHeader(ReasoningFullSrcRaw);
+export const ReasoningControlledSrc = removeLicenseHeader(ReasoningControlledSrcRaw);
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAElE,OAAO,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,mBAAmB,MAAM,4BAA4B,CAAC;AAE7D,MAAM,CAAC,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,mBAAmB,CAAC,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as ReasoningFull } from './reasoning-full.story';\n\nimport { removeLicenseHeader } from '../../../_common/export-stories-utils';\nimport ReasoningFullSrcRaw from './reasoning-full.story?raw';\n\nexport const ReasoningFullSrc = removeLicenseHeader(ReasoningFullSrcRaw);\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAE9E,OAAO,EAAE,mBAAmB,EAAE,MAAM,uCAAuC,CAAC;AAC5E,OAAO,yBAAyB,MAAM,kCAAkC,CAAC;AACzE,OAAO,mBAAmB,MAAM,4BAA4B,CAAC;AAE7D,MAAM,CAAC,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,mBAAmB,CAAC,CAAC;AACzE,MAAM,CAAC,MAAM,sBAAsB,GAAG,mBAAmB,CACvD,yBAAyB,CAC1B,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { default as ReasoningFull } from './reasoning-full.story';\nexport { default as ReasoningControlled } from './reasoning-controlled.story';\n\nimport { removeLicenseHeader } from '../../../_common/export-stories-utils';\nimport ReasoningControlledSrcRaw from './reasoning-controlled.story?raw';\nimport ReasoningFullSrcRaw from './reasoning-full.story?raw';\n\nexport const ReasoningFullSrc = removeLicenseHeader(ReasoningFullSrcRaw);\nexport const ReasoningControlledSrc = removeLicenseHeader(\n  ReasoningControlledSrcRaw,\n);\n"]}

package/lib/esm/ai/reasoning/stories/reasoning-controlled.story.js

@@ -0,0 +1,32 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ *
+ *  Copyright (c) "Neo4j"
+ *  Neo4j Sweden AB [http://neo4j.com]
+ *
+ *  This file is part of Neo4j.
+ *
+ *  Neo4j is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
+import { Reasoning } from '@neo4j-ndl/react/ai';
+import { PencilSquareIconOutline, WrenchIconOutline, } from '@neo4j-ndl/react/icons';
+import { useState } from 'react';
+const Component = () => {
+    const [isFirstSectionExpanded, setIsFirstSectionExpanded] = useState(false);
+    const [isSecondSectionExpanded, setIsSecondSectionExpanded] = useState(false);
+    return (_jsxs(Reasoning, { isThinking: false, thinkingMs: 1400, children: [_jsx(Reasoning.Section, { leadingVisual: _jsx(PencilSquareIconOutline, {}), heading: "Creating an action plan", isExpanded: isFirstSectionExpanded, onExpandChange: (isExpanded) => setIsFirstSectionExpanded(isExpanded), children: "Step 1 content" }), _jsx(Reasoning.Section, { leadingVisual: _jsx(WrenchIconOutline, {}), heading: "Applying agent tools", isExpanded: isSecondSectionExpanded, onExpandChange: (isExpanded) => setIsSecondSectionExpanded(isExpanded), children: "Step 2 content" })] }));
+};
+export default Component;
+//# sourceMappingURL=reasoning-controlled.story.js.map

package/lib/esm/ai/reasoning/stories/reasoning-controlled.story.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"reasoning-controlled.story.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning-controlled.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EACL,uBAAuB,EACvB,iBAAiB,GAClB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,sBAAsB,EAAE,yBAAyB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5E,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9E,OAAO,CACL,MAAC,SAAS,IAAC,UAAU,EAAE,KAAK,EAAE,UAAU,EAAE,IAAI,aAC5C,KAAC,SAAS,CAAC,OAAO,IAChB,aAAa,EAAE,KAAC,uBAAuB,KAAG,EAC1C,OAAO,EAAC,yBAAyB,EACjC,UAAU,EAAE,sBAAsB,EAClC,cAAc,EAAE,CAAC,UAAU,EAAE,EAAE,CAAC,yBAAyB,CAAC,UAAU,CAAC,+BAGnD,EACpB,KAAC,SAAS,CAAC,OAAO,IAChB,aAAa,EAAE,KAAC,iBAAiB,KAAG,EACpC,OAAO,EAAC,sBAAsB,EAC9B,UAAU,EAAE,uBAAuB,EACnC,cAAc,EAAE,CAAC,UAAU,EAAE,EAAE,CAAC,0BAA0B,CAAC,UAAU,CAAC,+BAGpD,IACV,CACb,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { Reasoning } from '@neo4j-ndl/react/ai';\nimport {\n  PencilSquareIconOutline,\n  WrenchIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [isFirstSectionExpanded, setIsFirstSectionExpanded] = useState(false);\n  const [isSecondSectionExpanded, setIsSecondSectionExpanded] = useState(false);\n\n  return (\n    <Reasoning isThinking={false} thinkingMs={1400}>\n      <Reasoning.Section\n        leadingVisual={<PencilSquareIconOutline />}\n        heading=\"Creating an action plan\"\n        isExpanded={isFirstSectionExpanded}\n        onExpandChange={(isExpanded) => setIsFirstSectionExpanded(isExpanded)}\n      >\n        Step 1 content\n      </Reasoning.Section>\n      <Reasoning.Section\n        leadingVisual={<WrenchIconOutline />}\n        heading=\"Applying agent tools\"\n        isExpanded={isSecondSectionExpanded}\n        onExpandChange={(isExpanded) => setIsSecondSectionExpanded(isExpanded)}\n      >\n        Step 2 content\n      </Reasoning.Section>\n    </Reasoning>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/ai/reasoning/stories/reasoning-full.story.js

@@ -26,7 +26,7 @@ import { PencilSquareIconOutline, WrenchIconOutline, } from '@neo4j-ndl/react/ic
 import { useState } from 'react';
 const Component = () => {
     const [isThinking, setThinking] = useState(true);
-    return (_jsxs("div", { className: "n-flex n-flex-col n-gap-token-12", children: [_jsx(FilledButton, { onClick: () => setThinking(!isThinking), children: isThinking ? 'Stop Thinking' : 'Start Thinking' }), _jsxs(Reasoning, { isThinking: isThinking, thinkingMs: 1400, currentAction: "Creating an action plan", children: [_jsx(Reasoning.Section, { leadingVisual: _jsx(PencilSquareIconOutline, {}), heading: "Creating an action plan", children: "Step 1 content" }), _jsx(Reasoning.Section, { leadingVisual: _jsx(WrenchIconOutline, {}), heading: "Applying agent tools", children: "Step 2 content" })] })] }));
+    return (_jsxs("div", { className: "n-flex n-flex-col n-gap-token-12", children: [_jsx(FilledButton, { onClick: () => setThinking(!isThinking), children: isThinking ? 'Stop Thinking' : 'Start Thinking' }), _jsxs(Reasoning, { isThinking: isThinking, thinkingMs: 1400, currentAction: "Creating an action plan", children: [_jsx(Reasoning.Section, { leadingVisual: _jsx(PencilSquareIconOutline, {}), heading: "Creating an action plan", isDefaultExpanded: true, children: "Step 1 content" }), _jsx(Reasoning.Section, { leadingVisual: _jsx(WrenchIconOutline, {}), heading: "Applying agent tools", children: "Step 2 content" })] })] }));
 };
 export default Component;
 //# sourceMappingURL=reasoning-full.story.js.map

package/lib/esm/ai/reasoning/stories/reasoning-full.story.js.map

@@ -1 +1 @@
-{"version":3,"file":"reasoning-full.story.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning-full.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EACL,uBAAuB,EACvB,iBAAiB,GAClB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,UAAU,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAEjD,OAAO,CACL,eAAK,SAAS,EAAC,kCAAkC,aAC/C,KAAC,YAAY,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,UAAU,CAAC,YAClD,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,GACnC,EACf,MAAC,SAAS,IACR,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,IAAI,EAChB,aAAa,EAAC,yBAAyB,aAEvC,KAAC,SAAS,CAAC,OAAO,IAChB,aAAa,EAAE,KAAC,uBAAuB,KAAG,EAC1C,OAAO,EAAC,yBAAyB,+BAGf,EACpB,KAAC,SAAS,CAAC,OAAO,IAChB,aAAa,EAAE,KAAC,iBAAiB,KAAG,EACpC,OAAO,EAAC,sBAAsB,+BAGZ,IACV,IACR,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { FilledButton } from '@neo4j-ndl/react';\nimport { Reasoning } from '@neo4j-ndl/react/ai';\nimport {\n  PencilSquareIconOutline,\n  WrenchIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [isThinking, setThinking] = useState(true);\n\n  return (\n    <div className=\"n-flex n-flex-col n-gap-token-12\">\n      <FilledButton onClick={() => setThinking(!isThinking)}>\n        {isThinking ? 'Stop Thinking' : 'Start Thinking'}\n      </FilledButton>\n      <Reasoning\n        isThinking={isThinking}\n        thinkingMs={1400}\n        currentAction=\"Creating an action plan\"\n      >\n        <Reasoning.Section\n          leadingVisual={<PencilSquareIconOutline />}\n          heading=\"Creating an action plan\"\n        >\n          Step 1 content\n        </Reasoning.Section>\n        <Reasoning.Section\n          leadingVisual={<WrenchIconOutline />}\n          heading=\"Applying agent tools\"\n        >\n          Step 2 content\n        </Reasoning.Section>\n      </Reasoning>\n    </div>\n  );\n};\n\nexport default Component;\n"]}
+{"version":3,"file":"reasoning-full.story.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning-full.story.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAEjD,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAChD,OAAO,EACL,uBAAuB,EACvB,iBAAiB,GAClB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAEjC,MAAM,SAAS,GAAG,GAAG,EAAE;IACrB,MAAM,CAAC,UAAU,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAC;IAEjD,OAAO,CACL,eAAK,SAAS,EAAC,kCAAkC,aAC/C,KAAC,YAAY,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,CAAC,UAAU,CAAC,YAClD,UAAU,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,gBAAgB,GACnC,EACf,MAAC,SAAS,IACR,UAAU,EAAE,UAAU,EACtB,UAAU,EAAE,IAAI,EAChB,aAAa,EAAC,yBAAyB,aAEvC,KAAC,SAAS,CAAC,OAAO,IAChB,aAAa,EAAE,KAAC,uBAAuB,KAAG,EAC1C,OAAO,EAAC,yBAAyB,EACjC,iBAAiB,EAAE,IAAI,+BAGL,EACpB,KAAC,SAAS,CAAC,OAAO,IAChB,aAAa,EAAE,KAAC,iBAAiB,KAAG,EACpC,OAAO,EAAC,sBAAsB,+BAGZ,IACV,IACR,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport '@neo4j-ndl/base/lib/neo4j-ds-styles.css';\n\nimport { FilledButton } from '@neo4j-ndl/react';\nimport { Reasoning } from '@neo4j-ndl/react/ai';\nimport {\n  PencilSquareIconOutline,\n  WrenchIconOutline,\n} from '@neo4j-ndl/react/icons';\nimport { useState } from 'react';\n\nconst Component = () => {\n  const [isThinking, setThinking] = useState(true);\n\n  return (\n    <div className=\"n-flex n-flex-col n-gap-token-12\">\n      <FilledButton onClick={() => setThinking(!isThinking)}>\n        {isThinking ? 'Stop Thinking' : 'Start Thinking'}\n      </FilledButton>\n      <Reasoning\n        isThinking={isThinking}\n        thinkingMs={1400}\n        currentAction=\"Creating an action plan\"\n      >\n        <Reasoning.Section\n          leadingVisual={<PencilSquareIconOutline />}\n          heading=\"Creating an action plan\"\n          isDefaultExpanded={true}\n        >\n          Step 1 content\n        </Reasoning.Section>\n        <Reasoning.Section\n          leadingVisual={<WrenchIconOutline />}\n          heading=\"Applying agent tools\"\n        >\n          Step 2 content\n        </Reasoning.Section>\n      </Reasoning>\n    </div>\n  );\n};\n\nexport default Component;\n"]}

package/lib/esm/ai/reasoning/stories/reasoning.stories.js

@@ -20,7 +20,7 @@
  */
 
 import { Reasoning } from '../Reasoning';
-import { ReasoningFull, ReasoningFullSrc } from '.';
+import { ReasoningControlled, ReasoningControlledSrc, ReasoningFull, ReasoningFullSrc, } from '.';
 const componentMeta = {
     component: Reasoning,
     id: 'components-ai-reasoning',
@@ -44,4 +44,17 @@ export const Full = {
     },
     render: ReasoningFull,
 };
+export const Controlled = {
+    args: {},
+    parameters: {
+        docs: {
+            source: {
+                code: ReasoningControlledSrc,
+                language: 'tsx',
+                type: 'code',
+            },
+        },
+    },
+    render: ReasoningControlled,
+};
 //# sourceMappingURL=reasoning.stories.js.map

package/lib/esm/ai/reasoning/stories/reasoning.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"reasoning.stories.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning.stories.tsx"],"names":[],"mappings":"AAsBA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,GAAG,CAAC;AAEpD,MAAM,aAAa,GAA2B;IAC5C,SAAS,EAAE,SAAS;IACpB,EAAE,EAAE,yBAAyB;IAC7B,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,KAAK,EAAE,yBAAyB;CACjC,CAAC;AAEF,eAAe,aAAa,CAAC;AAI7B,MAAM,CAAC,MAAM,IAAI,GAAU;IACzB,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,gBAAgB;gBACtB,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,aAAa;CACtB,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { type Meta, type StoryObj } from '@storybook/react-vite';\n\nimport { Reasoning } from '../Reasoning';\nimport { ReasoningFull, ReasoningFullSrc } from '.';\n\nconst componentMeta: Meta<typeof Reasoning> = {\n  component: Reasoning,\n  id: 'components-ai-reasoning',\n  parameters: {\n    controls: { disable: true },\n  },\n  tags: ['docsPage'],\n  title: 'Components/AI/Reasoning',\n};\n\nexport default componentMeta;\n\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Full: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: ReasoningFullSrc,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: ReasoningFull,\n};\n"]}
+{"version":3,"file":"reasoning.stories.js","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning.stories.tsx"],"names":[],"mappings":"AAsBA,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzC,OAAO,EACL,mBAAmB,EACnB,sBAAsB,EACtB,aAAa,EACb,gBAAgB,GACjB,MAAM,GAAG,CAAC;AAEX,MAAM,aAAa,GAA2B;IAC5C,SAAS,EAAE,SAAS;IACpB,EAAE,EAAE,yBAAyB;IAC7B,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;KAC5B;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,KAAK,EAAE,yBAAyB;CACjC,CAAC;AAEF,eAAe,aAAa,CAAC;AAI7B,MAAM,CAAC,MAAM,IAAI,GAAU;IACzB,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,gBAAgB;gBACtB,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,aAAa;CACtB,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAU;IAC/B,IAAI,EAAE,EAAE;IACR,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,MAAM,EAAE;gBACN,IAAI,EAAE,sBAAsB;gBAC5B,QAAQ,EAAE,KAAK;gBACf,IAAI,EAAE,MAAM;aACb;SACF;KACF;IACD,MAAM,EAAE,mBAAmB;CAC5B,CAAC","sourcesContent":["/**\n *\n *  Copyright (c) \"Neo4j\"\n *  Neo4j Sweden AB [http://neo4j.com]\n *\n *  This file is part of Neo4j.\n *\n *  Neo4j is free software: you can redistribute it and/or modify\n *  it under the terms of the GNU General Public License as published by\n *  the Free Software Foundation, either version 3 of the License, or\n *  (at your option) any later version.\n *\n *  This program is distributed in the hope that it will be useful,\n *  but WITHOUT ANY WARRANTY; without even the implied warranty of\n *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the\n *  GNU General Public License for more details.\n *\n *  You should have received a copy of the GNU General Public License\n *  along with this program.  If not, see <http://www.gnu.org/licenses/>.\n */\nimport { type Meta, type StoryObj } from '@storybook/react-vite';\n\nimport { Reasoning } from '../Reasoning';\nimport {\n  ReasoningControlled,\n  ReasoningControlledSrc,\n  ReasoningFull,\n  ReasoningFullSrc,\n} from '.';\n\nconst componentMeta: Meta<typeof Reasoning> = {\n  component: Reasoning,\n  id: 'components-ai-reasoning',\n  parameters: {\n    controls: { disable: true },\n  },\n  tags: ['docsPage'],\n  title: 'Components/AI/Reasoning',\n};\n\nexport default componentMeta;\n\ntype Story = StoryObj<typeof componentMeta>;\n\nexport const Full: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: ReasoningFullSrc,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: ReasoningFull,\n};\n\nexport const Controlled: Story = {\n  args: {},\n  parameters: {\n    docs: {\n      source: {\n        code: ReasoningControlledSrc,\n        language: 'tsx',\n        type: 'code',\n      },\n    },\n  },\n  render: ReasoningControlled,\n};\n"]}

package/lib/types/ai/reasoning/Reasoning.d.ts

@@ -36,9 +36,15 @@ type SectionProps = {
     children?: React.ReactNode;
     /** The visual leading the section */
     leadingVisual?: React.ReactNode;
+    /** Whether the section is expanded */
+    isExpanded?: boolean;
+    /** The default value of the section is expanded */
+    isDefaultExpanded?: boolean;
+    /** Callback function triggered when the section is expanded */
+    onExpandChange?: (isExpanded: boolean) => void;
 };
 declare const Reasoning: (({ isThinking, thinkingMs, currentAction, children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", ReasoningProps>) => import("react/jsx-runtime").JSX.Element) & {
-    Section: ({ heading, leadingVisual, children, className, style, htmlAttributes, ref, ...restProps }: CommonProps<"div", SectionProps>) => import("react/jsx-runtime").JSX.Element;
+    Section: ({ heading, leadingVisual, children, className, style, htmlAttributes, ref, isExpanded, isDefaultExpanded, onExpandChange, ...restProps }: CommonProps<"div", SectionProps>) => import("react/jsx-runtime").JSX.Element;
 };
 export { Reasoning };
 //# sourceMappingURL=Reasoning.d.ts.map

package/lib/types/ai/reasoning/Reasoning.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Reasoning.d.ts","sourceRoot":"","sources":["../../../../src/ai/reasoning/Reasoning.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAOH,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAIvD,KAAK,cAAc,GAAG;IACpB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iCAAiC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mDAAmD;IACnD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,8CAA8C;IAC9C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AA0EF,KAAK,YAAY,GAAG;IAClB,iCAAiC;IACjC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,kCAAkC;IAClC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,qCAAqC;IACrC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CACjC,CAAC;AA2DF,QAAA,MAAM,SAAS,8GA1HZ,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC;yGA0ElC,WAAW,CAAC,KAAK,EAAE,YAAY,CAAC;CAkDjC,CAAC;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC"}
+{"version":3,"file":"Reasoning.d.ts","sourceRoot":"","sources":["../../../../src/ai/reasoning/Reasoning.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAOH,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAKvD,KAAK,cAAc,GAAG;IACpB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,iCAAiC;IACjC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mDAAmD;IACnD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,8CAA8C;IAC9C,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB,CAAC;AA0EF,KAAK,YAAY,GAAG;IAClB,iCAAiC;IACjC,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,kCAAkC;IAClC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,qCAAqC;IACrC,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,sCAAsC;IACtC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,mDAAmD;IACnD,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,+DAA+D;IAC/D,cAAc,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,KAAK,IAAI,CAAC;CAChD,CAAC;AAkEF,QAAA,MAAM,SAAS,8GAvIZ,WAAW,CAAC,KAAK,EAAE,cAAc,CAAC;wJAmFlC,WAAW,CAAC,KAAK,EAAE,YAAY,CAAC;CAsDjC,CAAC;AAEH,OAAO,EAAE,SAAS,EAAE,CAAC"}

package/lib/types/ai/reasoning/stories/index.d.ts

@@ -19,5 +19,7 @@
  *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
  */
 export { default as ReasoningFull } from './reasoning-full.story';
+export { default as ReasoningControlled } from './reasoning-controlled.story';
 export declare const ReasoningFullSrc: string;
+export declare const ReasoningControlledSrc: string;
 //# sourceMappingURL=index.d.ts.map

package/lib/types/ai/reasoning/stories/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAKlE,eAAO,MAAM,gBAAgB,QAA2C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAClE,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,8BAA8B,CAAC;AAM9E,eAAO,MAAM,gBAAgB,QAA2C,CAAC;AACzE,eAAO,MAAM,sBAAsB,QAElC,CAAC"}

package/lib/types/ai/reasoning/stories/reasoning-controlled.story.d.ts

@@ -0,0 +1,24 @@
+/**
+ *
+ *  Copyright (c) "Neo4j"
+ *  Neo4j Sweden AB [http://neo4j.com]
+ *
+ *  This file is part of Neo4j.
+ *
+ *  Neo4j is free software: you can redistribute it and/or modify
+ *  it under the terms of the GNU General Public License as published by
+ *  the Free Software Foundation, either version 3 of the License, or
+ *  (at your option) any later version.
+ *
+ *  This program is distributed in the hope that it will be useful,
+ *  but WITHOUT ANY WARRANTY; without even the implied warranty of
+ *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+ *  GNU General Public License for more details.
+ *
+ *  You should have received a copy of the GNU General Public License
+ *  along with this program.  If not, see <http://www.gnu.org/licenses/>.
+ */
+import '@neo4j-ndl/base/lib/neo4j-ds-styles.css';
+declare const Component: () => import("react/jsx-runtime").JSX.Element;
+export default Component;
+//# sourceMappingURL=reasoning-controlled.story.d.ts.map

package/lib/types/ai/reasoning/stories/reasoning-controlled.story.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"reasoning-controlled.story.d.ts","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning-controlled.story.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AASjD,QAAA,MAAM,SAAS,+CAwBd,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/types/ai/reasoning/stories/reasoning-full.story.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reasoning-full.story.d.ts","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning-full.story.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAUjD,QAAA,MAAM,SAAS,+CA4Bd,CAAC;AAEF,eAAe,SAAS,CAAC"}
+{"version":3,"file":"reasoning-full.story.d.ts","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning-full.story.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,yCAAyC,CAAC;AAUjD,QAAA,MAAM,SAAS,+CA6Bd,CAAC;AAEF,eAAe,SAAS,CAAC"}

package/lib/types/ai/reasoning/stories/reasoning.stories.d.ts

@@ -24,4 +24,5 @@ declare const componentMeta: Meta<typeof Reasoning>;
 export default componentMeta;
 type Story = StoryObj<typeof componentMeta>;
 export declare const Full: Story;
+export declare const Controlled: Story;
 //# sourceMappingURL=reasoning.stories.d.ts.map

package/lib/types/ai/reasoning/stories/reasoning.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"reasoning.stories.d.ts","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning.stories.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAGzC,QAAA,MAAM,aAAa,EAAE,IAAI,CAAC,OAAO,SAAS,CAQzC,CAAC;AAEF,eAAe,aAAa,CAAC;AAE7B,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAC;AAE5C,eAAO,MAAM,IAAI,EAAE,KAYlB,CAAC"}
+{"version":3,"file":"reasoning.stories.d.ts","sourceRoot":"","sources":["../../../../../src/ai/reasoning/stories/reasoning.stories.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEjE,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAQzC,QAAA,MAAM,aAAa,EAAE,IAAI,CAAC,OAAO,SAAS,CAQzC,CAAC;AAEF,eAAe,aAAa,CAAC;AAE7B,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,aAAa,CAAC,CAAC;AAE5C,eAAO,MAAM,IAAI,EAAE,KAYlB,CAAC;AAEF,eAAO,MAAM,UAAU,EAAE,KAYxB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neo4j-ndl/react",
-  "version": "4.5.2",
+  "version": "4.5.4",
   "sideEffects": false,
   "description": "React implementation of Neo4j Design System",
   "keywords": [
@@ -85,7 +85,7 @@
     "@tanstack/react-table": "8.21.3",
     "react": ">=19.0.0",
     "react-dom": ">=19.0.0",
-    "@neo4j-ndl/base": "^4.5.1"
+    "@neo4j-ndl/base": "^4.5.2"
   },
   "dependencies": {
     "@dnd-kit/core": "6.3.1",