@fluentui-copilot/react-prompt-listbox 0.10.2 → 0.10.3

package/CHANGELOG.json

@@ -2,7 +2,22 @@
   "name": "@fluentui-copilot/react-prompt-listbox",
   "entries": [
     {
-      "date": "Tue, 01 Jul 2025 14:43:47 GMT",
+      "date": "Thu, 17 Jul 2025 17:47:34 GMT",
+      "tag": "@fluentui-copilot/react-prompt-listbox_v0.10.3",
+      "version": "0.10.3",
+      "comments": {
+        "patch": [
+          {
+            "author": "hochelmartin@gmail.com",
+            "package": "@fluentui-copilot/react-prompt-listbox",
+            "commit": "fef5160c07333e8d9996952a305b34e357604919",
+            "comment": "feat: enable griffel raw styles"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Tue, 01 Jul 2025 14:45:29 GMT",
       "tag": "@fluentui-copilot/react-prompt-listbox_v0.10.2",
       "version": "0.10.2",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,21 @@
 # Change Log - @fluentui-copilot/react-prompt-listbox
 
-This log was last generated on Tue, 01 Jul 2025 14:43:47 GMT and should not be manually modified.
+This log was last generated on Thu, 17 Jul 2025 17:47:34 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [0.10.3](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-prompt-listbox_v0.10.3)
+
+Thu, 17 Jul 2025 17:47:34 GMT 
+[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-prompt-listbox_v0.10.2..@fluentui-copilot/react-prompt-listbox_v0.10.3)
+
+### Patches
+
+- feat: enable griffel raw styles ([PR #3227](https://github.com/microsoft/fluentai/pull/3227) by hochelmartin@gmail.com)
+
 ## [0.10.2](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-prompt-listbox_v0.10.2)
 
-Tue, 01 Jul 2025 14:43:47 GMT 
+Tue, 01 Jul 2025 14:45:29 GMT 
 [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-prompt-listbox_v0.10.0..@fluentui-copilot/react-prompt-listbox_v0.10.2)
 
 ### Patches

package/lib/components/motion/PromptListboxMotion.js

@@ -1,53 +1,55 @@
 import { createPresenceComponent, motionTokens } from '@fluentui/react-components';
-const collapseMotion = ({
-  element
-}) => {
-  const fromOpacity = 0;
-  const toOpacity = 1;
-  const fromHeight = '0';
-  const toHeight = `${element.scrollHeight}px`;
-  const overflow = 'hidden';
-  const duration = motionTokens.durationNormal;
-  const easing = motionTokens.curveEasyEaseMax;
-  const enterKeyframes = [{
-    opacity: fromOpacity,
-    maxHeight: fromHeight,
-    overflow
-  },
-  // Transition to the height of the content, at 99.99% of the duration.
-  {
-    opacity: toOpacity,
-    maxHeight: toHeight,
-    offset: 0.9999,
-    overflow
-  },
-  // On completion, remove the maxHeight because the content might need to expand later.
-  {
-    opacity: toOpacity,
-    maxHeight: 'unset',
-    overflow
-  }];
-  const exitKeyframes = [{
-    opacity: toOpacity,
-    maxHeight: toHeight,
-    overflow
-  }, {
-    opacity: fromOpacity,
-    maxHeight: fromHeight,
-    overflow
-  }];
-  return {
-    enter: {
-      duration,
-      easing,
-      keyframes: enterKeyframes
-    },
-    exit: {
-      duration,
-      easing,
-      keyframes: exitKeyframes
-    }
-  };
+const collapseMotion = ({ element })=>{
+    const fromOpacity = 0;
+    const toOpacity = 1;
+    const fromHeight = '0';
+    const toHeight = `${element.scrollHeight}px`;
+    const overflow = 'hidden';
+    const duration = motionTokens.durationNormal;
+    const easing = motionTokens.curveEasyEaseMax;
+    const enterKeyframes = [
+        {
+            opacity: fromOpacity,
+            maxHeight: fromHeight,
+            overflow
+        },
+        // Transition to the height of the content, at 99.99% of the duration.
+        {
+            opacity: toOpacity,
+            maxHeight: toHeight,
+            offset: 0.9999,
+            overflow
+        },
+        // On completion, remove the maxHeight because the content might need to expand later.
+        {
+            opacity: toOpacity,
+            maxHeight: 'unset',
+            overflow
+        }
+    ];
+    const exitKeyframes = [
+        {
+            opacity: toOpacity,
+            maxHeight: toHeight,
+            overflow
+        },
+        {
+            opacity: fromOpacity,
+            maxHeight: fromHeight,
+            overflow
+        }
+    ];
+    return {
+        enter: {
+            duration,
+            easing,
+            keyframes: enterKeyframes
+        },
+        exit: {
+            duration,
+            easing,
+            keyframes: exitKeyframes
+        }
+    };
 };
 export const PromptListboxMotion = createPresenceComponent(collapseMotion);
-//# sourceMappingURL=PromptListboxMotion.js.map

package/lib/components/utils/useListboxPositioning.js

@@ -1,28 +1,26 @@
 // Brought from Fluent UI
 import { resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';
 export function useListboxPositioning(props) {
-  const {
-    positioning,
-    fluid
-  } = props;
-  const fallbackPositions = ['below'];
-  // popper options
-  const popperOptions = {
-    position: 'below',
-    align: 'start',
-    offset: {
-      crossAxis: 0,
-      mainAxis: 2
-    },
-    fallbackPositions: fallbackPositions,
-    matchTargetSize: fluid ? 'width' : undefined,
-    autoSize: true,
-    ...resolvePositioningShorthand(positioning)
-  };
-  const {
-    containerRef: listboxRef,
-    targetRef: anchorRef
-  } = usePositioning(popperOptions);
-  return [listboxRef, anchorRef];
+    const { positioning, fluid } = props;
+    const fallbackPositions = [
+        'below'
+    ];
+    // popper options
+    const popperOptions = {
+        position: 'below',
+        align: 'start',
+        offset: {
+            crossAxis: 0,
+            mainAxis: 2
+        },
+        fallbackPositions: fallbackPositions,
+        matchTargetSize: fluid ? 'width' : undefined,
+        autoSize: true,
+        ...resolvePositioningShorthand(positioning)
+    };
+    const { containerRef: listboxRef, targetRef: anchorRef } = usePositioning(popperOptions);
+    return [
+        listboxRef,
+        anchorRef
+    ];
 }
-//# sourceMappingURL=useListboxPositioning.js.map

package/lib/components/utils/usePromptListboxFunctionalityV2.js

@@ -6,134 +6,119 @@ import { CursorPositionPlugin } from '../../plugins/CursorPositionPlugin';
 import { useListboxPositioning } from './useListboxPositioning';
 import { Portal } from '@fluentui/react-components';
 export function usePromptListboxFunctionality(params) {
-  var _params_listboxProps, _params_listboxProps1;
-  const {
-    fluid = false,
-    allowArrowUpNavigation = false,
-    onSelectionModeChange
-  } = params;
-  const [open, setOpen] = useControllableState({
-    state: params.open,
-    defaultState: params.defaultOpen,
-    initialState: false
-  });
-  const [cursorPosition, setCursorPosition] = React.useState('end');
-  const overrideActionHandler = (e, {
-    activeOption,
-    action,
-    activeDescendantController,
-    isInSelectionMode
-  }) => {
-    var _params_overrideActionHandler;
-    const atStart = allowArrowUpNavigation && (cursorPosition === 'start' || cursorPosition === 'start-end');
-    const atEnd = cursorPosition === 'end' || cursorPosition === 'start-end';
-    let newAction = undefined;
-    let newIsInSelection = undefined;
-    const firstOption = activeDescendantController.first({
-      passive: true
+    var _params_listboxProps, _params_listboxProps1;
+    const { fluid = false, allowArrowUpNavigation = false, onSelectionModeChange } = params;
+    const [open, setOpen] = useControllableState({
+        state: params.open,
+        defaultState: params.defaultOpen,
+        initialState: false
     });
-    switch (action) {
-      case 'Next':
-        if (!isInSelectionMode && !atEnd) {
-          newAction = 'Type';
-          newIsInSelection = false;
+    const [cursorPosition, setCursorPosition] = React.useState('end');
+    const overrideActionHandler = (e, { activeOption, action, activeDescendantController, isInSelectionMode })=>{
+        var _params_overrideActionHandler;
+        const atStart = allowArrowUpNavigation && (cursorPosition === 'start' || cursorPosition === 'start-end');
+        const atEnd = cursorPosition === 'end' || cursorPosition === 'start-end';
+        let newAction = undefined;
+        let newIsInSelection = undefined;
+        const firstOption = activeDescendantController.first({
+            passive: true
+        });
+        switch(action){
+            case 'Next':
+                if (!isInSelectionMode && !atEnd) {
+                    newAction = 'Type';
+                    newIsInSelection = false;
+                }
+                break;
+            case 'Previous':
+                if (!isInSelectionMode && !atStart) {
+                    newAction = 'Type';
+                    newIsInSelection = false;
+                } else if (isInSelectionMode && !allowArrowUpNavigation && atEnd && activeOption !== undefined && activeOption.id === firstOption) {
+                    newAction = 'Type';
+                    newIsInSelection = false;
+                    e.preventDefault();
+                }
+                break;
+            case 'First':
+            case 'Last':
+            case 'PageDown':
+            case 'PageUp':
+                if (!isInSelectionMode) {
+                    newAction = 'Type';
+                    newIsInSelection = false;
+                }
+                break;
         }
-        break;
-      case 'Previous':
-        if (!isInSelectionMode && !atStart) {
-          newAction = 'Type';
-          newIsInSelection = false;
-        } else if (isInSelectionMode && !allowArrowUpNavigation && atEnd && activeOption !== undefined && activeOption.id === firstOption) {
-          newAction = 'Type';
-          newIsInSelection = false;
-          e.preventDefault();
-        }
-        break;
-      case 'First':
-      case 'Last':
-      case 'PageDown':
-      case 'PageUp':
-        if (!isInSelectionMode) {
-          newAction = 'Type';
-          newIsInSelection = false;
+        const userOverrides = (_params_overrideActionHandler = params.overrideActionHandler) === null || _params_overrideActionHandler === void 0 ? void 0 : _params_overrideActionHandler.call(params, e, {
+            activeOption,
+            action,
+            activeDescendantController,
+            isInSelectionMode
+        });
+        return {
+            action: newAction,
+            isInSelectionMode: newIsInSelection,
+            ...userOverrides
+        };
+    };
+    const baseListboxFunctionality = useInputListboxFunctionality({
+        ...params,
+        onSelectionModeChange,
+        overrideActionHandler
+    });
+    const { onBlur: baseOnBlur, onKeyDown: baseOnKeyDown, ref: triggerRef, isInSelectionMode } = baseListboxFunctionality.triggerProps;
+    const onFocus = (event)=>{
+        if (event.target === event.currentTarget) {
+            var _params_onOpenChange;
+            setOpen(true);
+            (_params_onOpenChange = params.onOpenChange) === null || _params_onOpenChange === void 0 ? void 0 : _params_onOpenChange.call(params, event, {
+                event,
+                type: 'focus',
+                open: true
+            });
         }
-        break;
-    }
-    const userOverrides = (_params_overrideActionHandler = params.overrideActionHandler) === null || _params_overrideActionHandler === void 0 ? void 0 : _params_overrideActionHandler.call(params, e, {
-      activeOption,
-      action,
-      activeDescendantController,
-      isInSelectionMode
+    };
+    const onBlur = useEventCallback(mergeCallbacks(baseOnBlur, (e)=>{
+        var _params_onOpenChange;
+        setOpen(false);
+        (_params_onOpenChange = params.onOpenChange) === null || _params_onOpenChange === void 0 ? void 0 : _params_onOpenChange.call(params, e, {
+            event: e,
+            type: 'focus',
+            open: false
+        });
+    }));
+    const [listboxRef, anchorRef] = useListboxPositioning({
+        fluid,
+        positioning: params.positioning
     });
+    const listboxId = useId('prompt-listbox', (_params_listboxProps = params.listboxProps) === null || _params_listboxProps === void 0 ? void 0 : _params_listboxProps.id);
+    const cursorPositionPlugin = /*#__PURE__*/ React.createElement(CursorPositionPlugin, {
+        setCursorPosition: setCursorPosition
+    });
+    const innerListbox = /*#__PURE__*/ React.createElement(InputListbox, {
+        ...params.listboxProps,
+        ...baseListboxFunctionality.inputListboxProps,
+        id: listboxId,
+        ref: useMergedRefs(baseListboxFunctionality.inputListboxProps.ref, listboxRef, (_params_listboxProps1 = params.listboxProps) === null || _params_listboxProps1 === void 0 ? void 0 : _params_listboxProps1.ref)
+    });
+    const listbox = /*#__PURE__*/ React.createElement(PromptListboxMotion, {
+        visible: open
+    }, /*#__PURE__*/ React.createElement("span", {
+        "aria-owns": open ? listboxId : undefined
+    }, open && (params.inline ? innerListbox : /*#__PURE__*/ React.createElement(Portal, {
+        mountNode: params.mountNode
+    }, innerListbox))));
     return {
-      action: newAction,
-      isInSelectionMode: newIsInSelection,
-      ...userOverrides
+        promptListbox: listbox,
+        cursorPositionPlugin,
+        triggerProps: {
+            ref: triggerRef,
+            isInSelectionMode,
+            onFocus,
+            onKeyDown: baseOnKeyDown,
+            onBlur
+        },
+        containerRef: anchorRef
     };
-  };
-  const baseListboxFunctionality = useInputListboxFunctionality({
-    ...params,
-    onSelectionModeChange,
-    overrideActionHandler
-  });
-  const {
-    onBlur: baseOnBlur,
-    onKeyDown: baseOnKeyDown,
-    ref: triggerRef,
-    isInSelectionMode
-  } = baseListboxFunctionality.triggerProps;
-  const onFocus = event => {
-    if (event.target === event.currentTarget) {
-      var _params_onOpenChange;
-      setOpen(true);
-      (_params_onOpenChange = params.onOpenChange) === null || _params_onOpenChange === void 0 ? void 0 : _params_onOpenChange.call(params, event, {
-        event,
-        type: 'focus',
-        open: true
-      });
-    }
-  };
-  const onBlur = useEventCallback(mergeCallbacks(baseOnBlur, e => {
-    var _params_onOpenChange;
-    setOpen(false);
-    (_params_onOpenChange = params.onOpenChange) === null || _params_onOpenChange === void 0 ? void 0 : _params_onOpenChange.call(params, e, {
-      event: e,
-      type: 'focus',
-      open: false
-    });
-  }));
-  const [listboxRef, anchorRef] = useListboxPositioning({
-    fluid,
-    positioning: params.positioning
-  });
-  const listboxId = useId('prompt-listbox', (_params_listboxProps = params.listboxProps) === null || _params_listboxProps === void 0 ? void 0 : _params_listboxProps.id);
-  const cursorPositionPlugin = /*#__PURE__*/React.createElement(CursorPositionPlugin, {
-    setCursorPosition: setCursorPosition
-  });
-  const innerListbox = /*#__PURE__*/React.createElement(InputListbox, {
-    ...params.listboxProps,
-    ...baseListboxFunctionality.inputListboxProps,
-    id: listboxId,
-    ref: useMergedRefs(baseListboxFunctionality.inputListboxProps.ref, listboxRef, (_params_listboxProps1 = params.listboxProps) === null || _params_listboxProps1 === void 0 ? void 0 : _params_listboxProps1.ref)
-  });
-  const listbox = /*#__PURE__*/React.createElement(PromptListboxMotion, {
-    visible: open
-  }, /*#__PURE__*/React.createElement("span", {
-    "aria-owns": open ? listboxId : undefined
-  }, open && (params.inline ? innerListbox : /*#__PURE__*/React.createElement(Portal, {
-    mountNode: params.mountNode
-  }, innerListbox))));
-  return {
-    promptListbox: listbox,
-    cursorPositionPlugin,
-    triggerProps: {
-      ref: triggerRef,
-      isInSelectionMode,
-      onFocus,
-      onKeyDown: baseOnKeyDown,
-      onBlur
-    },
-    containerRef: anchorRef
-  };
 }
-//# sourceMappingURL=usePromptListboxFunctionalityV2.js.map

package/lib/index.js

@@ -1,3 +1,2 @@
 export { usePromptListboxFunctionality } from './components/utils/usePromptListboxFunctionalityV2';
 export { Option, optionClassNames, renderOption_unstable, useOption_unstable, useInputListboxOptionStyles_unstable } from '@fluentui-copilot/react-input-listbox';
-//# sourceMappingURL=index.js.map

package/lib/plugins/CursorPositionPlugin.js

@@ -1,43 +1,43 @@
 import { $isSentinelNode } from '@fluentui-copilot/chat-input-plugins';
 import { SELECTION_CHANGE_COMMAND, $getSelection, useLexicalComposerContext, $isRangeSelection, $isElementNode, COMMAND_PRIORITY_HIGH } from '@fluentui-copilot/react-text-editor';
 import * as React from 'react';
-export const CursorPositionPlugin = ({
-  setCursorPosition
-}) => {
-  const [editor] = useLexicalComposerContext();
-  React.useEffect(() => {
-    const $selectionChangeHandler = () => {
-      const selection = $getSelection();
-      // If selection is null, the cursor is not active in the editor and we should just noop
-      if (selection === null || !$isRangeSelection(selection) || !selection.isCollapsed()) {
-        setCursorPosition('between-text');
-        return false;
-      }
-      // Should only be one node in the selection because the selection is collapsed
-      const selectedNode = selection.getNodes().at(0);
-      // If there's no selected node, focus isn't in the editor
-      if (!selectedNode) {
-        return false;
-      }
-      // If there are no leaf nodes, the paragraph node will be selected
-      if ($isElementNode(selectedNode)) {
-        setCursorPosition('start-end');
-        return false;
-      } else if ($isSentinelNode(selectedNode) && !selectedNode.getNextSibling()) {
-        setCursorPosition('end');
-        return false;
-      } else if ($isSentinelNode(selectedNode.getNextSibling()) && selection.focus.offset === selectedNode.getTextContentSize()) {
-        setCursorPosition('end');
-        return false;
-      } else if (selectedNode.getPreviousSibling() === null && selection.focus.offset === 0) {
-        setCursorPosition('start');
-        return false;
-      }
-      setCursorPosition('between-text');
-      return false;
-    };
-    return editor.registerCommand(SELECTION_CHANGE_COMMAND, $selectionChangeHandler, COMMAND_PRIORITY_HIGH);
-  }, [editor, setCursorPosition]);
-  return null;
+export const CursorPositionPlugin = ({ setCursorPosition })=>{
+    const [editor] = useLexicalComposerContext();
+    React.useEffect(()=>{
+        const $selectionChangeHandler = ()=>{
+            const selection = $getSelection();
+            // If selection is null, the cursor is not active in the editor and we should just noop
+            if (selection === null || !$isRangeSelection(selection) || !selection.isCollapsed()) {
+                setCursorPosition('between-text');
+                return false;
+            }
+            // Should only be one node in the selection because the selection is collapsed
+            const selectedNode = selection.getNodes().at(0);
+            // If there's no selected node, focus isn't in the editor
+            if (!selectedNode) {
+                return false;
+            }
+            // If there are no leaf nodes, the paragraph node will be selected
+            if ($isElementNode(selectedNode)) {
+                setCursorPosition('start-end');
+                return false;
+            } else if ($isSentinelNode(selectedNode) && !selectedNode.getNextSibling()) {
+                setCursorPosition('end');
+                return false;
+            } else if ($isSentinelNode(selectedNode.getNextSibling()) && selection.focus.offset === selectedNode.getTextContentSize()) {
+                setCursorPosition('end');
+                return false;
+            } else if (selectedNode.getPreviousSibling() === null && selection.focus.offset === 0) {
+                setCursorPosition('start');
+                return false;
+            }
+            setCursorPosition('between-text');
+            return false;
+        };
+        return editor.registerCommand(SELECTION_CHANGE_COMMAND, $selectionChangeHandler, COMMAND_PRIORITY_HIGH);
+    }, [
+        editor,
+        setCursorPosition
+    ]);
+    return null;
 };
-//# sourceMappingURL=CursorPositionPlugin.js.map

package/lib-commonjs/components/motion/PromptListboxMotion.js

@@ -62,4 +62,4 @@ const collapseMotion = ({ element })=>{
         }
     };
 };
-const PromptListboxMotion = (0, _reactcomponents.createPresenceComponent)(collapseMotion); //# sourceMappingURL=PromptListboxMotion.js.map
+const PromptListboxMotion = (0, _reactcomponents.createPresenceComponent)(collapseMotion);

package/lib-commonjs/components/motion/PromptListboxMotion.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PromptListboxMotion.ts"],"sourcesContent":["import { createPresenceComponent, motionTokens } from '@fluentui/react-components';\nimport type { PresenceMotionFn } from '@fluentui/react-components';\n\nconst collapseMotion: PresenceMotionFn = ({ element }) => {\n  const fromOpacity = 0;\n  const toOpacity = 1;\n  const fromHeight = '0';\n  const toHeight = `${element.scrollHeight}px`;\n  const overflow = 'hidden';\n\n  const duration = motionTokens.durationNormal;\n  const easing = motionTokens.curveEasyEaseMax;\n\n  const enterKeyframes = [\n    { opacity: fromOpacity, maxHeight: fromHeight, overflow },\n    // Transition to the height of the content, at 99.99% of the duration.\n    { opacity: toOpacity, maxHeight: toHeight, offset: 0.9999, overflow },\n    // On completion, remove the maxHeight because the content might need to expand later.\n    { opacity: toOpacity, maxHeight: 'unset', overflow },\n  ];\n\n  const exitKeyframes = [\n    { opacity: toOpacity, maxHeight: toHeight, overflow },\n    { opacity: fromOpacity, maxHeight: fromHeight, overflow },\n  ];\n\n  return {\n    enter: { duration, easing, keyframes: enterKeyframes },\n    exit: { duration, easing, keyframes: exitKeyframes },\n  };\n};\n\nexport const PromptListboxMotion: ReturnType<typeof createPresenceComponent<{}>> =\n  createPresenceComponent(collapseMotion);\n"],"names":["PromptListboxMotion","collapseMotion","fromOpacity","fromHeight","toOpacity","toHeight","duration","motionTokens","durationNormal","overflow","enterKeyframes","easing","curveEasyEaseMax","maxHeight","offset","exitKeyframes","opacity","createPresenceComponent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BA4BuDA;;;eAAAA;;;iCA5BD;AAGtD,MAAMC,iBAAmC,CAAC,SACxC;UAEAC,cAAMC;UACNC,YAAMC;UACNF,aAAiB;UAEjBE,WAAMC,CAAAA,EAAWC,QAAAA,YAAaC,CAAAA,EAAAA,CAAAA;UAC9BC,WAAeF;UAEfD,WAAMI,6BAAiB,CAAAF,cAAA;UACrBG,SAAAJ,6BAAA,CAAAK,gBAAA;2BAAWV;QAAAA;qBAAaW;uBAAuBJ;;;8EAE/C;;qBAAsBI;uBAAqBC;oBAAgBL;;;8FAE3D;;qBAAsBI;uBAAoBJ;;;;UAG5CM,gBAAMA;QAAAA;qBACJX;uBAAEY;;;;qBAAkDd;uBACpDC;;;;;eAAwD;YACzDG;YAEDK;uBACSD;;;;;uBACDK;;;;MAA6Cf,sBAAAiB,IAAAA,wCAAA,EAAAhB,gEACrD"}
+{"version":3,"sources":["PromptListboxMotion.ts"],"sourcesContent":["import { createPresenceComponent, motionTokens } from '@fluentui/react-components';\nimport type { PresenceMotionFn } from '@fluentui/react-components';\n\nconst collapseMotion: PresenceMotionFn = ({ element }) => {\n  const fromOpacity = 0;\n  const toOpacity = 1;\n  const fromHeight = '0';\n  const toHeight = `${element.scrollHeight}px`;\n  const overflow = 'hidden';\n\n  const duration = motionTokens.durationNormal;\n  const easing = motionTokens.curveEasyEaseMax;\n\n  const enterKeyframes = [\n    { opacity: fromOpacity, maxHeight: fromHeight, overflow },\n    // Transition to the height of the content, at 99.99% of the duration.\n    { opacity: toOpacity, maxHeight: toHeight, offset: 0.9999, overflow },\n    // On completion, remove the maxHeight because the content might need to expand later.\n    { opacity: toOpacity, maxHeight: 'unset', overflow },\n  ];\n\n  const exitKeyframes = [\n    { opacity: toOpacity, maxHeight: toHeight, overflow },\n    { opacity: fromOpacity, maxHeight: fromHeight, overflow },\n  ];\n\n  return {\n    enter: { duration, easing, keyframes: enterKeyframes },\n    exit: { duration, easing, keyframes: exitKeyframes },\n  };\n};\n\nexport const PromptListboxMotion: ReturnType<typeof createPresenceComponent<{}>> =\n  createPresenceComponent(collapseMotion);\n"],"names":["PromptListboxMotion","collapseMotion","element","fromOpacity","toOpacity","fromHeight","toHeight","scrollHeight","overflow","duration","motionTokens","durationNormal","easing","curveEasyEaseMax","enterKeyframes","opacity","maxHeight","offset","exitKeyframes","enter","keyframes","exit","createPresenceComponent"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAgCaA;;;eAAAA;;;iCAhCyC;AAGtD,MAAMC,iBAAmC,CAAC,EAAEC,OAAO,EAAE;IACnD,MAAMC,cAAc;IACpB,MAAMC,YAAY;IAClB,MAAMC,aAAa;IACnB,MAAMC,WAAW,CAAC,EAAEJ,QAAQK,YAAY,CAAC,EAAE,CAAC;IAC5C,MAAMC,WAAW;IAEjB,MAAMC,WAAWC,6BAAAA,CAAaC,cAAc;IAC5C,MAAMC,SAASF,6BAAAA,CAAaG,gBAAgB;IAE5C,MAAMC,iBAAiB;QACrB;YAAEC,SAASZ;YAAaa,WAAWX;YAAYG;QAAS;QACxD,sEAAsE;QACtE;YAAEO,SAASX;YAAWY,WAAWV;YAAUW,QAAQ;YAAQT;QAAS;QACpE,sFAAsF;QACtF;YAAEO,SAASX;YAAWY,WAAW;YAASR;QAAS;KACpD;IAED,MAAMU,gBAAgB;QACpB;YAAEH,SAASX;YAAWY,WAAWV;YAAUE;QAAS;QACpD;YAAEO,SAASZ;YAAaa,WAAWX;YAAYG;QAAS;KACzD;IAED,OAAO;QACLW,OAAO;YAAEV;YAAUG;YAAQQ,WAAWN;QAAe;QACrDO,MAAM;YAAEZ;YAAUG;YAAQQ,WAAWF;QAAc;IACrD;AACF;AAEO,MAAMlB,sBACXsB,IAAAA,wCAAAA,EAAwBrB"}

package/lib-commonjs/components/utils/useListboxPositioning.js

@@ -33,4 +33,4 @@ function useListboxPositioning(props) {
         listboxRef,
         anchorRef
     ];
-} //# sourceMappingURL=useListboxPositioning.js.map
+}

package/lib-commonjs/components/utils/useListboxPositioning.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useListboxPositioning.ts"],"sourcesContent":["// Brought from Fluent UI\n\nimport { resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport type * as React from 'react';\nimport type { UsePromptListboxFunctionalityParams } from './usePromptListboxFunctionalityV2';\nimport type { PositioningShorthandValue } from '@fluentui/react-positioning';\n\nexport function useListboxPositioning<AnchorElementType extends HTMLElement = HTMLSpanElement>(\n  props: Pick<UsePromptListboxFunctionalityParams, 'fluid' | 'positioning'>,\n): [listboxRef: React.RefObject<HTMLSpanElement>, anchorRef: React.RefObject<AnchorElementType>] {\n  const { positioning, fluid } = props;\n\n  const fallbackPositions: PositioningShorthandValue[] = ['below'];\n\n  // popper options\n  const popperOptions = {\n    position: 'below' as const,\n    align: 'start' as const,\n    offset: { crossAxis: 0, mainAxis: 2 },\n    fallbackPositions: fallbackPositions,\n    matchTargetSize: fluid ? ('width' as const) : undefined,\n    autoSize: true,\n    ...resolvePositioningShorthand(positioning),\n  };\n\n  const { containerRef: listboxRef, targetRef: anchorRef } = usePositioning(popperOptions);\n\n  return [listboxRef, anchorRef];\n}\n"],"names":["useListboxPositioning","props","positioning","fallbackPositions","popperOptions","position","align","offset","crossAxis","mainAxis","matchTargetSize","fluid","undefined","resolvePositioningShorthand","listboxRef","anchorRef","usePositioning"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,yBAAyB;;;;;+BAOTA;;;eAAAA;;;kCAL4C;AAKrD,SAASA,sBACdC,KAAyE;UAEzE,EAEAC,WAAMC,OAAkD,KAAQF;UAEhEE,oBAAiB;QAAA;KAAA;qBACXC;UACJC,gBAAU;kBACVC;eACAC;gBAAUC;uBAAcC;sBAAY;;2BAEpCC;yBACUC,QAAA,UAAAC;kBACPC;QACL,GAAAA,IAAAA,6CAAA,EAAAX,YAAA;;UAIA,gBAAQY,UAAAA,aAAYC,SAAAA,KAAUC,IAAAA,gCAAA,EAAAZ;IAChC,OAAA;QAAAU;QAAAC;KAAA"}
+{"version":3,"sources":["useListboxPositioning.ts"],"sourcesContent":["// Brought from Fluent UI\n\nimport { resolvePositioningShorthand, usePositioning } from '@fluentui/react-positioning';\nimport type * as React from 'react';\nimport type { UsePromptListboxFunctionalityParams } from './usePromptListboxFunctionalityV2';\nimport type { PositioningShorthandValue } from '@fluentui/react-positioning';\n\nexport function useListboxPositioning<AnchorElementType extends HTMLElement = HTMLSpanElement>(\n  props: Pick<UsePromptListboxFunctionalityParams, 'fluid' | 'positioning'>,\n): [listboxRef: React.RefObject<HTMLSpanElement>, anchorRef: React.RefObject<AnchorElementType>] {\n  const { positioning, fluid } = props;\n\n  const fallbackPositions: PositioningShorthandValue[] = ['below'];\n\n  // popper options\n  const popperOptions = {\n    position: 'below' as const,\n    align: 'start' as const,\n    offset: { crossAxis: 0, mainAxis: 2 },\n    fallbackPositions: fallbackPositions,\n    matchTargetSize: fluid ? ('width' as const) : undefined,\n    autoSize: true,\n    ...resolvePositioningShorthand(positioning),\n  };\n\n  const { containerRef: listboxRef, targetRef: anchorRef } = usePositioning(popperOptions);\n\n  return [listboxRef, anchorRef];\n}\n"],"names":["useListboxPositioning","props","positioning","fluid","fallbackPositions","popperOptions","position","align","offset","crossAxis","mainAxis","matchTargetSize","undefined","autoSize","resolvePositioningShorthand","containerRef","listboxRef","targetRef","anchorRef","usePositioning"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,yBAAyB;;;;;+BAOTA;;;eAAAA;;;kCAL4C;AAKrD,SAASA,sBACdC,KAAyE;IAEzE,MAAM,EAAEC,WAAW,EAAEC,KAAK,EAAE,GAAGF;IAE/B,MAAMG,oBAAiD;QAAC;KAAQ;IAEhE,iBAAiB;IACjB,MAAMC,gBAAgB;QACpBC,UAAU;QACVC,OAAO;QACPC,QAAQ;YAAEC,WAAW;YAAGC,UAAU;QAAE;QACpCN,mBAAmBA;QACnBO,iBAAiBR,QAAS,UAAoBS;QAC9CC,UAAU;QACV,GAAGC,IAAAA,6CAAAA,EAA4BZ,YAAY;IAC7C;IAEA,MAAM,EAAEa,cAAcC,UAAU,EAAEC,WAAWC,SAAS,EAAE,GAAGC,IAAAA,gCAAAA,EAAed;IAE1E,OAAO;QAACW;QAAYE;KAAU;AAChC"}

package/lib-commonjs/components/utils/usePromptListboxFunctionalityV2.js

@@ -132,4 +132,4 @@ function usePromptListboxFunctionality(params) {
         },
         containerRef: anchorRef
     };
-} //# sourceMappingURL=usePromptListboxFunctionalityV2.js.map
+}

package/lib-commonjs/components/utils/usePromptListboxFunctionalityV2.js.map

@@ -1 +1 @@
-{"version":3,"sources":["usePromptListboxFunctionalityV2.tsx"],"sourcesContent":["import * as React from 'react';\nimport { InputListbox, useInputListboxFunctionality } from '@fluentui-copilot/react-input-listbox';\nimport { PromptListboxMotion } from '../motion/PromptListboxMotion';\nimport {\n  mergeCallbacks,\n  useControllableState,\n  useEventCallback,\n  useId,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport { CursorPositionPlugin } from '../../plugins/CursorPositionPlugin';\nimport { useListboxPositioning } from './useListboxPositioning';\nimport { Portal } from '@fluentui/react-components';\nimport type { EventData, EventHandler } from '@fluentui/react-utilities';\nimport type {\n  InputListboxAction,\n  InputListboxProps,\n  UseInputListboxFunctionalityParams,\n  OverrideActionHandler,\n} from '@fluentui-copilot/react-input-listbox';\nimport type { PortalProps } from '@fluentui/react-components';\nimport type { CursorPosition } from '../../plugins/CursorPositionPlugin';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\nimport type { PositioningShorthand } from '@fluentui/react-positioning';\n\nexport type OnOpenChangeData = (\n  | EventData<'click', React.MouseEvent<HTMLSpanElement>>\n  | EventData<'focus', React.FocusEvent<HTMLSpanElement>>\n  | EventData<'keyboard', React.KeyboardEvent<HTMLSpanElement>>\n) & {\n  open: boolean;\n};\n\nexport type UsePromptListboxFunctionalityParams = UseInputListboxFunctionalityParams & {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: EventHandler<OnOpenChangeData>;\n  positioning?: PositioningShorthand;\n\n  /**\n   * Whether the listbox's width should take all the available space or only\n   * the required space.\n   *\n   * @default false\n   */\n  fluid?: boolean;\n\n  /**\n   * Props to be passed to the InputListbox component\n   */\n  listboxProps?: Partial<InputListboxProps> & {\n    ref?: React.RefObject<HTMLDivElement>;\n  };\n\n  /**\n   * Whether to allow reaching the listbox options by arrowing up at the start of the input.\n   * Note, this prop is meant to be used with the following positioning props:\n   * ```ts\n   *  usePromptListboxFunctionality({\n   *    positioning: {\n   *      position: 'above',\n   *      fallbackPositions: ['above']\n   *    }\n   *  });\n   * ```\n   * This is useful when using PromptListbox with other components such as ChatInput since\n   * the input will always stay at the bottom therefore the listbox would always get cut.\n   *\n   * @default false\n   */\n  allowArrowUpNavigation?: boolean;\n\n  /**\n   * Whether to render the listbox inline or use a portal.\n   */\n  inline?: boolean;\n} & Pick<PortalProps, 'mountNode'>;\n\nexport type UsePromptListboxFunctionality<ContainerElementType extends HTMLElement> = {\n  /**\n   * Component to be rendered in the Input component. This should be passed to the listbox prop.\n   */\n  promptListbox: JSX.Element;\n  /**\n   * Props to be spread in the PromptInput, these props are needed for the keyboard behavior to\n   * work correctly.\n   */\n  triggerProps: {\n    ref: React.RefObject<HTMLSpanElement>;\n    /**\n     * Whether the listbox is being used to go through options or the user is currently typing.\n     */\n    isInSelectionMode: boolean;\n  } & Required<Pick<EditorInputProps, 'onBlur' | 'onFocus' | 'onKeyDown'>>;\n\n  /**\n   * Ref used to point which element the listbox should be anchored to. Most use cases\n   * will provide this prop to the PromptInput's EditorInput (since this is the root slot,\n   * this is provided directly to the component and not the slot).\n   *\n   * Note: If the containerRef is the same as the trigger, the ref provided in triggerProps needs\n   * to be merged with this one using `useMergedRefs(containerRef, triggerProps.ref);`\n   */\n  containerRef: React.RefObject<ContainerElementType>;\n  /**\n   * Plugin used to tell where the cursor is in the EditorInput, this is important for the\n   * keyboard behavior. This should be passed as children in the PromptInput.\n   */\n  cursorPositionPlugin: JSX.Element;\n};\n\nexport function usePromptListboxFunctionality<\n  TriggerElementType extends HTMLElement = HTMLSpanElement,\n  ContainerElementType extends HTMLElement = HTMLDivElement,\n>(params: UsePromptListboxFunctionalityParams): UsePromptListboxFunctionality<ContainerElementType> {\n  const { fluid = false, allowArrowUpNavigation = false, onSelectionModeChange } = params;\n  const [open, setOpen] = useControllableState({\n    state: params.open,\n    defaultState: params.defaultOpen,\n    initialState: false,\n  });\n  const [cursorPosition, setCursorPosition] = React.useState<CursorPosition>('end');\n\n  const overrideActionHandler: OverrideActionHandler = (\n    e,\n    { activeOption, action, activeDescendantController, isInSelectionMode },\n  ) => {\n    const atStart = allowArrowUpNavigation && (cursorPosition === 'start' || cursorPosition === 'start-end');\n    const atEnd = cursorPosition === 'end' || cursorPosition === 'start-end';\n    let newAction: InputListboxAction | undefined = undefined;\n    let newIsInSelection: boolean | undefined = undefined;\n    const firstOption = activeDescendantController.first({ passive: true });\n\n    switch (action) {\n      case 'Next':\n        if (!isInSelectionMode && !atEnd) {\n          newAction = 'Type';\n          newIsInSelection = false;\n        }\n        break;\n      case 'Previous':\n        if (!isInSelectionMode && !atStart) {\n          newAction = 'Type';\n          newIsInSelection = false;\n        } else if (\n          isInSelectionMode &&\n          !allowArrowUpNavigation &&\n          atEnd &&\n          activeOption !== undefined &&\n          activeOption.id === firstOption\n        ) {\n          newAction = 'Type';\n          newIsInSelection = false;\n          e.preventDefault();\n        }\n        break;\n      case 'First':\n      case 'Last':\n      case 'PageDown':\n      case 'PageUp':\n        if (!isInSelectionMode) {\n          newAction = 'Type';\n          newIsInSelection = false;\n        }\n        break;\n    }\n\n    const userOverrides = params.overrideActionHandler?.(e, {\n      activeOption,\n      action,\n      activeDescendantController,\n      isInSelectionMode,\n    });\n\n    return { action: newAction, isInSelectionMode: newIsInSelection, ...userOverrides };\n  };\n\n  const baseListboxFunctionality = useInputListboxFunctionality<TriggerElementType>({\n    ...params,\n    onSelectionModeChange,\n    overrideActionHandler,\n  });\n  const {\n    onBlur: baseOnBlur,\n    onKeyDown: baseOnKeyDown,\n    ref: triggerRef,\n    isInSelectionMode,\n  } = baseListboxFunctionality.triggerProps;\n\n  const onFocus = (event: React.FocusEvent<HTMLSpanElement>) => {\n    if (event.target === event.currentTarget) {\n      setOpen(true);\n      params.onOpenChange?.(event, { event, type: 'focus', open: true });\n    }\n  };\n\n  const onBlur = useEventCallback(\n    mergeCallbacks(baseOnBlur, (e: React.FocusEvent<TriggerElementType>) => {\n      setOpen(false);\n      params.onOpenChange?.(e, { event: e, type: 'focus', open: false });\n    }),\n  );\n\n  const [listboxRef, anchorRef] = useListboxPositioning<ContainerElementType>({\n    fluid,\n    positioning: params.positioning,\n  });\n\n  const listboxId = useId('prompt-listbox', params.listboxProps?.id);\n  const cursorPositionPlugin = <CursorPositionPlugin setCursorPosition={setCursorPosition} />;\n  const innerListbox = (\n    <InputListbox\n      {...params.listboxProps}\n      {...baseListboxFunctionality.inputListboxProps}\n      id={listboxId}\n      ref={useMergedRefs(baseListboxFunctionality.inputListboxProps.ref, listboxRef, params.listboxProps?.ref)}\n    />\n  );\n  const listbox = (\n    <PromptListboxMotion visible={open}>\n      <span aria-owns={open ? listboxId : undefined}>\n        {open && (params.inline ? innerListbox : <Portal mountNode={params.mountNode}>{innerListbox}</Portal>)}\n      </span>\n    </PromptListboxMotion>\n  );\n\n  return {\n    promptListbox: listbox,\n    cursorPositionPlugin,\n    triggerProps: {\n      ref: triggerRef,\n      isInSelectionMode,\n      onFocus,\n      onKeyDown: baseOnKeyDown,\n      onBlur,\n    },\n    containerRef: anchorRef,\n  };\n}\n"],"names":["usePromptListboxFunctionality","params","fluid","open","setOpen","useControllableState","state","cursorPosition","defaultState","overrideActionHandler","e","React","undefined","newIsInSelection","allowArrowUpNavigation","atEnd","activeDescendantController","first","isInSelectionMode","newAction","atStart","activeOption","id","firstOption","userOverrides","_params_overrideActionHandler","call","action","baseOnBlur","event","useInputListboxFunctionality","onKeyDown","baseOnKeyDown","ref","triggerRef","useEventCallback","triggerProps","onOpenChange","_params_onOpenChange","type","listboxRef","onBlur","cursorPositionPlugin","setCursorPosition","innerListbox","InputListbox","baseListboxFunctionality","listboxId","listbox","useListboxPositioning","PromptListboxMotion","positioning","inline","listboxProps","Portal","mountNode","createElement","CursorPositionPlugin","promptListbox","inputListboxProps","containerRef","anchorRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["usePromptListboxFunctionalityV2.tsx"],"sourcesContent":["import * as React from 'react';\nimport { InputListbox, useInputListboxFunctionality } from '@fluentui-copilot/react-input-listbox';\nimport { PromptListboxMotion } from '../motion/PromptListboxMotion';\nimport {\n  mergeCallbacks,\n  useControllableState,\n  useEventCallback,\n  useId,\n  useMergedRefs,\n} from '@fluentui/react-utilities';\nimport { CursorPositionPlugin } from '../../plugins/CursorPositionPlugin';\nimport { useListboxPositioning } from './useListboxPositioning';\nimport { Portal } from '@fluentui/react-components';\nimport type { EventData, EventHandler } from '@fluentui/react-utilities';\nimport type {\n  InputListboxAction,\n  InputListboxProps,\n  UseInputListboxFunctionalityParams,\n  OverrideActionHandler,\n} from '@fluentui-copilot/react-input-listbox';\nimport type { PortalProps } from '@fluentui/react-components';\nimport type { CursorPosition } from '../../plugins/CursorPositionPlugin';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\nimport type { PositioningShorthand } from '@fluentui/react-positioning';\n\nexport type OnOpenChangeData = (\n  | EventData<'click', React.MouseEvent<HTMLSpanElement>>\n  | EventData<'focus', React.FocusEvent<HTMLSpanElement>>\n  | EventData<'keyboard', React.KeyboardEvent<HTMLSpanElement>>\n) & {\n  open: boolean;\n};\n\nexport type UsePromptListboxFunctionalityParams = UseInputListboxFunctionalityParams & {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: EventHandler<OnOpenChangeData>;\n  positioning?: PositioningShorthand;\n\n  /**\n   * Whether the listbox's width should take all the available space or only\n   * the required space.\n   *\n   * @default false\n   */\n  fluid?: boolean;\n\n  /**\n   * Props to be passed to the InputListbox component\n   */\n  listboxProps?: Partial<InputListboxProps> & {\n    ref?: React.RefObject<HTMLDivElement>;\n  };\n\n  /**\n   * Whether to allow reaching the listbox options by arrowing up at the start of the input.\n   * Note, this prop is meant to be used with the following positioning props:\n   * ```ts\n   *  usePromptListboxFunctionality({\n   *    positioning: {\n   *      position: 'above',\n   *      fallbackPositions: ['above']\n   *    }\n   *  });\n   * ```\n   * This is useful when using PromptListbox with other components such as ChatInput since\n   * the input will always stay at the bottom therefore the listbox would always get cut.\n   *\n   * @default false\n   */\n  allowArrowUpNavigation?: boolean;\n\n  /**\n   * Whether to render the listbox inline or use a portal.\n   */\n  inline?: boolean;\n} & Pick<PortalProps, 'mountNode'>;\n\nexport type UsePromptListboxFunctionality<ContainerElementType extends HTMLElement> = {\n  /**\n   * Component to be rendered in the Input component. This should be passed to the listbox prop.\n   */\n  promptListbox: JSX.Element;\n  /**\n   * Props to be spread in the PromptInput, these props are needed for the keyboard behavior to\n   * work correctly.\n   */\n  triggerProps: {\n    ref: React.RefObject<HTMLSpanElement>;\n    /**\n     * Whether the listbox is being used to go through options or the user is currently typing.\n     */\n    isInSelectionMode: boolean;\n  } & Required<Pick<EditorInputProps, 'onBlur' | 'onFocus' | 'onKeyDown'>>;\n\n  /**\n   * Ref used to point which element the listbox should be anchored to. Most use cases\n   * will provide this prop to the PromptInput's EditorInput (since this is the root slot,\n   * this is provided directly to the component and not the slot).\n   *\n   * Note: If the containerRef is the same as the trigger, the ref provided in triggerProps needs\n   * to be merged with this one using `useMergedRefs(containerRef, triggerProps.ref);`\n   */\n  containerRef: React.RefObject<ContainerElementType>;\n  /**\n   * Plugin used to tell where the cursor is in the EditorInput, this is important for the\n   * keyboard behavior. This should be passed as children in the PromptInput.\n   */\n  cursorPositionPlugin: JSX.Element;\n};\n\nexport function usePromptListboxFunctionality<\n  TriggerElementType extends HTMLElement = HTMLSpanElement,\n  ContainerElementType extends HTMLElement = HTMLDivElement,\n>(params: UsePromptListboxFunctionalityParams): UsePromptListboxFunctionality<ContainerElementType> {\n  const { fluid = false, allowArrowUpNavigation = false, onSelectionModeChange } = params;\n  const [open, setOpen] = useControllableState({\n    state: params.open,\n    defaultState: params.defaultOpen,\n    initialState: false,\n  });\n  const [cursorPosition, setCursorPosition] = React.useState<CursorPosition>('end');\n\n  const overrideActionHandler: OverrideActionHandler = (\n    e,\n    { activeOption, action, activeDescendantController, isInSelectionMode },\n  ) => {\n    const atStart = allowArrowUpNavigation && (cursorPosition === 'start' || cursorPosition === 'start-end');\n    const atEnd = cursorPosition === 'end' || cursorPosition === 'start-end';\n    let newAction: InputListboxAction | undefined = undefined;\n    let newIsInSelection: boolean | undefined = undefined;\n    const firstOption = activeDescendantController.first({ passive: true });\n\n    switch (action) {\n      case 'Next':\n        if (!isInSelectionMode && !atEnd) {\n          newAction = 'Type';\n          newIsInSelection = false;\n        }\n        break;\n      case 'Previous':\n        if (!isInSelectionMode && !atStart) {\n          newAction = 'Type';\n          newIsInSelection = false;\n        } else if (\n          isInSelectionMode &&\n          !allowArrowUpNavigation &&\n          atEnd &&\n          activeOption !== undefined &&\n          activeOption.id === firstOption\n        ) {\n          newAction = 'Type';\n          newIsInSelection = false;\n          e.preventDefault();\n        }\n        break;\n      case 'First':\n      case 'Last':\n      case 'PageDown':\n      case 'PageUp':\n        if (!isInSelectionMode) {\n          newAction = 'Type';\n          newIsInSelection = false;\n        }\n        break;\n    }\n\n    const userOverrides = params.overrideActionHandler?.(e, {\n      activeOption,\n      action,\n      activeDescendantController,\n      isInSelectionMode,\n    });\n\n    return { action: newAction, isInSelectionMode: newIsInSelection, ...userOverrides };\n  };\n\n  const baseListboxFunctionality = useInputListboxFunctionality<TriggerElementType>({\n    ...params,\n    onSelectionModeChange,\n    overrideActionHandler,\n  });\n  const {\n    onBlur: baseOnBlur,\n    onKeyDown: baseOnKeyDown,\n    ref: triggerRef,\n    isInSelectionMode,\n  } = baseListboxFunctionality.triggerProps;\n\n  const onFocus = (event: React.FocusEvent<HTMLSpanElement>) => {\n    if (event.target === event.currentTarget) {\n      setOpen(true);\n      params.onOpenChange?.(event, { event, type: 'focus', open: true });\n    }\n  };\n\n  const onBlur = useEventCallback(\n    mergeCallbacks(baseOnBlur, (e: React.FocusEvent<TriggerElementType>) => {\n      setOpen(false);\n      params.onOpenChange?.(e, { event: e, type: 'focus', open: false });\n    }),\n  );\n\n  const [listboxRef, anchorRef] = useListboxPositioning<ContainerElementType>({\n    fluid,\n    positioning: params.positioning,\n  });\n\n  const listboxId = useId('prompt-listbox', params.listboxProps?.id);\n  const cursorPositionPlugin = <CursorPositionPlugin setCursorPosition={setCursorPosition} />;\n  const innerListbox = (\n    <InputListbox\n      {...params.listboxProps}\n      {...baseListboxFunctionality.inputListboxProps}\n      id={listboxId}\n      ref={useMergedRefs(baseListboxFunctionality.inputListboxProps.ref, listboxRef, params.listboxProps?.ref)}\n    />\n  );\n  const listbox = (\n    <PromptListboxMotion visible={open}>\n      <span aria-owns={open ? listboxId : undefined}>\n        {open && (params.inline ? innerListbox : <Portal mountNode={params.mountNode}>{innerListbox}</Portal>)}\n      </span>\n    </PromptListboxMotion>\n  );\n\n  return {\n    promptListbox: listbox,\n    cursorPositionPlugin,\n    triggerProps: {\n      ref: triggerRef,\n      isInSelectionMode,\n      onFocus,\n      onKeyDown: baseOnKeyDown,\n      onBlur,\n    },\n    containerRef: anchorRef,\n  };\n}\n"],"names":["usePromptListboxFunctionality","params","fluid","allowArrowUpNavigation","onSelectionModeChange","open","setOpen","useControllableState","state","defaultState","defaultOpen","initialState","cursorPosition","setCursorPosition","React","useState","overrideActionHandler","e","activeOption","action","activeDescendantController","isInSelectionMode","atStart","atEnd","newAction","undefined","newIsInSelection","firstOption","first","passive","id","preventDefault","userOverrides","baseListboxFunctionality","useInputListboxFunctionality","onBlur","baseOnBlur","onKeyDown","baseOnKeyDown","ref","triggerRef","triggerProps","onFocus","event","target","currentTarget","onOpenChange","type","useEventCallback","mergeCallbacks","listboxRef","anchorRef","useListboxPositioning","positioning","listboxId","useId","listboxProps","cursorPositionPlugin","createElement","CursorPositionPlugin","innerListbox","InputListbox","inputListboxProps","useMergedRefs","listbox","PromptListboxMotion","visible","span","aria-owns","inline","Portal","mountNode","promptListbox","containerRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/index.js

@@ -30,4 +30,3 @@ _export(exports, {
 });
 const _usePromptListboxFunctionalityV2 = require("./components/utils/usePromptListboxFunctionalityV2");
 const _reactinputlistbox = require("@fluentui-copilot/react-input-listbox");
- //# sourceMappingURL=index.js.map

package/lib-commonjs/plugins/CursorPositionPlugin.js

@@ -51,4 +51,4 @@ const CursorPositionPlugin = ({ setCursorPosition })=>{
         setCursorPosition
     ]);
     return null;
-}; //# sourceMappingURL=CursorPositionPlugin.js.map
+};

package/lib-commonjs/plugins/CursorPositionPlugin.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CursorPositionPlugin.ts"],"sourcesContent":["import { $isSentinelNode } from '@fluentui-copilot/chat-input-plugins';\nimport {\n  SELECTION_CHANGE_COMMAND,\n  $getSelection,\n  useLexicalComposerContext,\n  $isRangeSelection,\n  $isElementNode,\n  COMMAND_PRIORITY_HIGH,\n} from '@fluentui-copilot/react-text-editor';\nimport * as React from 'react';\n\n/**\n * Position the cursor is in based on it's content. The goal\n * is to track whether the cursor is at the end of the input\n * or between text.\n */\nexport type CursorPosition = 'start' | 'between-text' | 'end' | 'start-end';\n\nexport type CursorPositionPluginProps = {\n  setCursorPosition: (position: CursorPosition) => void;\n};\n\nexport const CursorPositionPlugin: React.FunctionComponent<CursorPositionPluginProps> = ({ setCursorPosition }) => {\n  const [editor] = useLexicalComposerContext();\n\n  React.useEffect(() => {\n    const $selectionChangeHandler = () => {\n      const selection = $getSelection();\n      // If selection is null, the cursor is not active in the editor and we should just noop\n      if (selection === null || !$isRangeSelection(selection) || !selection.isCollapsed()) {\n        setCursorPosition('between-text');\n        return false;\n      }\n\n      // Should only be one node in the selection because the selection is collapsed\n      const selectedNode = selection.getNodes().at(0);\n      // If there's no selected node, focus isn't in the editor\n      if (!selectedNode) {\n        return false;\n      }\n\n      // If there are no leaf nodes, the paragraph node will be selected\n      if ($isElementNode(selectedNode)) {\n        setCursorPosition('start-end');\n        return false;\n      }\n\n      // if the selection node is a sentinel and it matches the sentinel at the end\n      else if ($isSentinelNode(selectedNode) && !selectedNode.getNextSibling()) {\n        setCursorPosition('end');\n        return false;\n      }\n\n      // else if the selection node is not a sentinel, check that the next sibling node is a sentinel\n      // and check if the focus offset is in the last position of the node.\n      else if (\n        $isSentinelNode(selectedNode.getNextSibling()) &&\n        selection.focus.offset === selectedNode.getTextContentSize()\n      ) {\n        setCursorPosition('end');\n        return false;\n      }\n\n      // else if the selection node is not at the end and is not a sentinel, check if there's a previous\n      // sibling and that we are at the start. If that's the case we are at the start.\n      else if (selectedNode.getPreviousSibling() === null && selection.focus.offset === 0) {\n        setCursorPosition('start');\n        return false;\n      }\n\n      setCursorPosition('between-text');\n      return false;\n    };\n\n    return editor.registerCommand(SELECTION_CHANGE_COMMAND, $selectionChangeHandler, COMMAND_PRIORITY_HIGH);\n  }, [editor, setCursorPosition]);\n\n  return null;\n};\n"],"names":["CursorPositionPlugin","editor","$selectionChangeHandler","selection","$isRangeSelection","isCollapsed","selectedNode","getNodes","at","$isSentinelNode","getNextSibling","focus","offset","getTextContentSize","getPreviousSibling","setCursorPosition"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAsBaA;;;eAAAA;;;;kCAtBmB;iCAQzB;iEACgB;AAahB,MAAMA,uBAA2E,CAAC,mBACzE;UAGZ,CAAAC,OAAMC,GAAAA,IAAAA,0CAA0B;oBAC9B,CAAMC;wCACN;kBACAA,YAAIA,IAAAA,8BAAc;mGACE;8BACX,QAAA,CAAAC,IAAAA,kCAAA,EAAAD,cAAA,CAAAA,UAAAE,WAAA,IAAA;kCACT;uBAEA;;0FAEyD;kBACzDC,eAAKA,UAAcC,QAAA,GAAAC,EAAA,CAAA;qEACV;+BACT;uBAEA;;8EAEoB;mDACX,EAAAF,eAAA;kCAIAG;;uBAEPA,IAAAA,iCAAO,EAAAH,iBAAA,CAAAA,aAAAI,cAAA,IAAA;kCAMPD;;uBAIAA,IAAAA,iCAAO,EAAAH,aAAAI,cAAA,OAAAP,UAAAQ,KAAA,CAAAC,MAAA,KAAAN,aAAAO,kBAAA,IAAA;kCAKAP;;uBAEPA,aAAOQ,kBAAA,OAAA,QAAAX,UAAAQ,KAAA,CAAAC,MAAA,KAAA,GAAA;kCACT;uBAEAG;;8BAEF;mBAEA;QACF;eAAId,OAAAA,eAAAA,CAAAA,yCAAAA,EAAAA,yBAAAA,sCAAAA;;;QAAQc;KAAAA;WAAkB;GAGhC,gDAAE"}
+{"version":3,"sources":["CursorPositionPlugin.ts"],"sourcesContent":["import { $isSentinelNode } from '@fluentui-copilot/chat-input-plugins';\nimport {\n  SELECTION_CHANGE_COMMAND,\n  $getSelection,\n  useLexicalComposerContext,\n  $isRangeSelection,\n  $isElementNode,\n  COMMAND_PRIORITY_HIGH,\n} from '@fluentui-copilot/react-text-editor';\nimport * as React from 'react';\n\n/**\n * Position the cursor is in based on it's content. The goal\n * is to track whether the cursor is at the end of the input\n * or between text.\n */\nexport type CursorPosition = 'start' | 'between-text' | 'end' | 'start-end';\n\nexport type CursorPositionPluginProps = {\n  setCursorPosition: (position: CursorPosition) => void;\n};\n\nexport const CursorPositionPlugin: React.FunctionComponent<CursorPositionPluginProps> = ({ setCursorPosition }) => {\n  const [editor] = useLexicalComposerContext();\n\n  React.useEffect(() => {\n    const $selectionChangeHandler = () => {\n      const selection = $getSelection();\n      // If selection is null, the cursor is not active in the editor and we should just noop\n      if (selection === null || !$isRangeSelection(selection) || !selection.isCollapsed()) {\n        setCursorPosition('between-text');\n        return false;\n      }\n\n      // Should only be one node in the selection because the selection is collapsed\n      const selectedNode = selection.getNodes().at(0);\n      // If there's no selected node, focus isn't in the editor\n      if (!selectedNode) {\n        return false;\n      }\n\n      // If there are no leaf nodes, the paragraph node will be selected\n      if ($isElementNode(selectedNode)) {\n        setCursorPosition('start-end');\n        return false;\n      }\n\n      // if the selection node is a sentinel and it matches the sentinel at the end\n      else if ($isSentinelNode(selectedNode) && !selectedNode.getNextSibling()) {\n        setCursorPosition('end');\n        return false;\n      }\n\n      // else if the selection node is not a sentinel, check that the next sibling node is a sentinel\n      // and check if the focus offset is in the last position of the node.\n      else if (\n        $isSentinelNode(selectedNode.getNextSibling()) &&\n        selection.focus.offset === selectedNode.getTextContentSize()\n      ) {\n        setCursorPosition('end');\n        return false;\n      }\n\n      // else if the selection node is not at the end and is not a sentinel, check if there's a previous\n      // sibling and that we are at the start. If that's the case we are at the start.\n      else if (selectedNode.getPreviousSibling() === null && selection.focus.offset === 0) {\n        setCursorPosition('start');\n        return false;\n      }\n\n      setCursorPosition('between-text');\n      return false;\n    };\n\n    return editor.registerCommand(SELECTION_CHANGE_COMMAND, $selectionChangeHandler, COMMAND_PRIORITY_HIGH);\n  }, [editor, setCursorPosition]);\n\n  return null;\n};\n"],"names":["CursorPositionPlugin","setCursorPosition","editor","useLexicalComposerContext","React","useEffect","$selectionChangeHandler","selection","$getSelection","$isRangeSelection","isCollapsed","selectedNode","getNodes","at","$isElementNode","$isSentinelNode","getNextSibling","focus","offset","getTextContentSize","getPreviousSibling","registerCommand","SELECTION_CHANGE_COMMAND","COMMAND_PRIORITY_HIGH"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAsBaA;;;eAAAA;;;;kCAtBmB;iCAQzB;iEACgB;AAahB,MAAMA,uBAA2E,CAAC,EAAEC,iBAAiB,EAAE;IAC5G,MAAM,CAACC,OAAO,GAAGC,IAAAA,0CAAAA;IAEjBC,OAAMC,SAAS,CAAC;QACd,MAAMC,0BAA0B;YAC9B,MAAMC,YAAYC,IAAAA,8BAAAA;YAClB,uFAAuF;YACvF,IAAID,cAAc,QAAQ,CAACE,IAAAA,kCAAAA,EAAkBF,cAAc,CAACA,UAAUG,WAAW,IAAI;gBACnFT,kBAAkB;gBAClB,OAAO;YACT;YAEA,8EAA8E;YAC9E,MAAMU,eAAeJ,UAAUK,QAAQ,GAAGC,EAAE,CAAC;YAC7C,yDAAyD;YACzD,IAAI,CAACF,cAAc;gBACjB,OAAO;YACT;YAEA,kEAAkE;YAClE,IAAIG,IAAAA,+BAAAA,EAAeH,eAAe;gBAChCV,kBAAkB;gBAClB,OAAO;YACT,OAGK,IAAIc,IAAAA,iCAAAA,EAAgBJ,iBAAiB,CAACA,aAAaK,cAAc,IAAI;gBACxEf,kBAAkB;gBAClB,OAAO;YACT,OAIK,IACHc,IAAAA,iCAAAA,EAAgBJ,aAAaK,cAAc,OAC3CT,UAAUU,KAAK,CAACC,MAAM,KAAKP,aAAaQ,kBAAkB,IAC1D;gBACAlB,kBAAkB;gBAClB,OAAO;YACT,OAIK,IAAIU,aAAaS,kBAAkB,OAAO,QAAQb,UAAUU,KAAK,CAACC,MAAM,KAAK,GAAG;gBACnFjB,kBAAkB;gBAClB,OAAO;YACT;YAEAA,kBAAkB;YAClB,OAAO;QACT;QAEA,OAAOC,OAAOmB,eAAe,CAACC,yCAAAA,EAA0BhB,yBAAyBiB,sCAAAA;IACnF,GAAG;QAACrB;QAAQD;KAAkB;IAE9B,OAAO;AACT"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-copilot/react-prompt-listbox",
-  "version": "0.10.2",
+  "version": "0.10.3",
   "description": "PromptListbox for input components using EditorInput.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -12,15 +12,15 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@fluentui-copilot/chat-input-plugins": "^0.5.0",
-    "@fluentui-copilot/react-chat-input-plugins": "^0.5.2",
-    "@fluentui-copilot/react-editor-input": "^0.5.2",
-    "@fluentui-copilot/react-input-listbox": "^0.4.2",
-    "@fluentui-copilot/react-prompt-input": "^0.10.2",
-    "@fluentui-copilot/react-provider": "^0.12.2",
-    "@fluentui-copilot/react-text-editor": "^0.4.1",
-    "@fluentui-copilot/text-editor": "^0.3.1",
-    "@fluentui-copilot/tokens": "^0.3.11",
+    "@fluentui-copilot/chat-input-plugins": "^0.5.1",
+    "@fluentui-copilot/react-chat-input-plugins": "^0.5.3",
+    "@fluentui-copilot/react-editor-input": "^0.5.3",
+    "@fluentui-copilot/react-input-listbox": "^0.4.3",
+    "@fluentui-copilot/react-prompt-input": "^0.10.3",
+    "@fluentui-copilot/react-provider": "^0.12.3",
+    "@fluentui-copilot/react-text-editor": "^0.4.2",
+    "@fluentui-copilot/text-editor": "^0.3.2",
+    "@fluentui-copilot/tokens": "^0.3.12",
     "@swc/helpers": "^0.5.1"
   },
   "peerDependencies": {