@fluentui-copilot/react-prompt-listbox 0.5.0 → 0.5.1

package/CHANGELOG.json

@@ -2,7 +2,28 @@
   "name": "@fluentui-copilot/react-prompt-listbox",
   "entries": [
     {
-      "date": "Wed, 29 Jan 2025 01:36:32 GMT",
+      "date": "Fri, 07 Feb 2025 02:01:25 GMT",
+      "tag": "@fluentui-copilot/react-prompt-listbox_v0.5.1",
+      "version": "0.5.1",
+      "comments": {
+        "patch": [
+          {
+            "author": "owcampbe@microsoft.com",
+            "package": "@fluentui-copilot/react-prompt-listbox",
+            "commit": "70796f91c6f172c0a1de2dd0989cec7eb8e1f803",
+            "comment": "chore: Use InputListbox's isInSelectionMode state."
+          },
+          {
+            "author": "estebanmu@microsoft.com",
+            "package": "@fluentui-copilot/react-prompt-listbox",
+            "commit": "4d2e21f84ca14afa287a9b81387169da3e26664a",
+            "comment": "feat: Add onActiveOptionChange to InputListbox."
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 29 Jan 2025 01:37:03 GMT",
       "tag": "@fluentui-copilot/react-prompt-listbox_v0.5.0",
       "version": "0.5.0",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,22 @@
 # Change Log - @fluentui-copilot/react-prompt-listbox
 
-This log was last generated on Wed, 29 Jan 2025 01:36:32 GMT and should not be manually modified.
+This log was last generated on Fri, 07 Feb 2025 02:01:25 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [0.5.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-prompt-listbox_v0.5.1)
+
+Fri, 07 Feb 2025 02:01:25 GMT 
+[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-prompt-listbox_v0.5.0..@fluentui-copilot/react-prompt-listbox_v0.5.1)
+
+### Patches
+
+- chore: Use InputListbox's isInSelectionMode state. ([PR #2625](https://github.com/microsoft/fluentai/pull/2625) by owcampbe@microsoft.com)
+- feat: Add onActiveOptionChange to InputListbox. ([PR #2639](https://github.com/microsoft/fluentai/pull/2639) by estebanmu@microsoft.com)
+
 ## [0.5.0](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-prompt-listbox_v0.5.0)
 
-Wed, 29 Jan 2025 01:36:32 GMT 
+Wed, 29 Jan 2025 01:37:03 GMT 
 [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-prompt-listbox_v0.4.0..@fluentui-copilot/react-prompt-listbox_v0.5.0)
 
 ### Minor changes

package/dist/index.d.ts

@@ -1,6 +1,7 @@
 /// <reference types="react" />
 
 import type { ActiveDescendantContextValue } from '@fluentui/react-aria';
+import { ActiveOptionChangeData } from '@fluentui-copilot/react-input-listbox';
 import type { ComboboxBaseState } from '@fluentui/react-combobox';
 import type { ComboboxProps } from '@fluentui/react-components';
 import type { ComboboxState } from '@fluentui/react-combobox';
@@ -38,6 +39,8 @@ import type { UseInputListboxFunctionalityParams } from '@fluentui-copilot/react
 import { useOption_unstable } from '@fluentui-copilot/react-input-listbox';
 import { useOptionStyles_unstable } from '@fluentui-copilot/react-input-listbox';
 
+export { ActiveOptionChangeData }
+
 export declare type OnOpenChangeData = (EventData<'click', React_2.MouseEvent<HTMLSpanElement>> | EventData<'focus', React_2.FocusEvent<HTMLSpanElement>> | EventData<'keyboard', React_2.KeyboardEvent<HTMLSpanElement>>) & {
     open: boolean;
 };

package/lib/components/utils/usePromptListboxFunctionalityV2.js

@@ -9,7 +9,8 @@ export function usePromptListboxFunctionality(params) {
   var _params_listboxProps, _params_listboxProps1;
   const {
     fluid = false,
-    allowArrowUpNavigation = false
+    allowArrowUpNavigation = false,
+    onSelectionModeChange
   } = params;
   const [open, setOpen] = useControllableState({
     state: params.open,
@@ -17,7 +18,6 @@ export function usePromptListboxFunctionality(params) {
     initialState: false
   });
   const [cursorPosition, setCursorPosition] = React.useState('end');
-  const [isInSelectionMode, setIsInSelectionMode] = React.useState(false);
   const overrideActionHandler = (e, {
     activeOption,
     action,
@@ -71,9 +71,6 @@ export function usePromptListboxFunctionality(params) {
       ...userOverrides
     };
   };
-  const onSelectionModeChange = mergeCallbacks(params.onSelectionModeChange, newSelectionMode => {
-    setIsInSelectionMode(newSelectionMode);
-  });
   const baseListboxFunctionality = useInputListboxFunctionality({
     ...params,
     onSelectionModeChange,
@@ -82,7 +79,8 @@ export function usePromptListboxFunctionality(params) {
   const {
     onBlur: baseOnBlur,
     onKeyDown: baseOnKeyDown,
-    ref: triggerRef
+    ref: triggerRef,
+    isInSelectionMode
   } = baseListboxFunctionality.triggerProps;
   const onFocus = event => {
     if (event.target === event.currentTarget) {

package/lib/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 } = 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  const [isInSelectionMode, setIsInSelectionMode] = React.useState(false);\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 onSelectionModeChange = mergeCallbacks(params.onSelectionModeChange, newSelectionMode => {\n    setIsInSelectionMode(newSelectionMode);\n  });\n  const baseListboxFunctionality = useInputListboxFunctionality<TriggerElementType>({\n    ...params,\n    onSelectionModeChange,\n    overrideActionHandler,\n  });\n  const { onBlur: baseOnBlur, onKeyDown: baseOnKeyDown, ref: triggerRef } = 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":["React","InputListbox","useInputListboxFunctionality","PromptListboxMotion","mergeCallbacks","useControllableState","useEventCallback","useId","useMergedRefs","CursorPositionPlugin","useListboxPositioning","Portal","usePromptListboxFunctionality","params","fluid","allowArrowUpNavigation","open","setOpen","state","defaultState","defaultOpen","initialState","cursorPosition","setCursorPosition","useState","isInSelectionMode","setIsInSelectionMode","overrideActionHandler","e","activeOption","action","activeDescendantController","atStart","atEnd","newAction","undefined","newIsInSelection","firstOption","first","passive","id","preventDefault","userOverrides","onSelectionModeChange","newSelectionMode","baseListboxFunctionality","onBlur","baseOnBlur","onKeyDown","baseOnKeyDown","ref","triggerRef","triggerProps","onFocus","event","target","currentTarget","onOpenChange","type","listboxRef","anchorRef","positioning","listboxId","listboxProps","cursorPositionPlugin","innerListbox","inputListboxProps","listbox","visible","span","aria-owns","inline","mountNode","promptListbox","containerRef"],"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":["React","InputListbox","useInputListboxFunctionality","PromptListboxMotion","mergeCallbacks","useControllableState","useEventCallback","useId","useMergedRefs","CursorPositionPlugin","useListboxPositioning","Portal","usePromptListboxFunctionality","params","fluid","allowArrowUpNavigation","onSelectionModeChange","open","setOpen","state","defaultState","defaultOpen","initialState","cursorPosition","setCursorPosition","useState","overrideActionHandler","e","activeOption","action","activeDescendantController","isInSelectionMode","atStart","atEnd","newAction","undefined","newIsInSelection","firstOption","first","passive","id","preventDefault","userOverrides","baseListboxFunctionality","onBlur","baseOnBlur","onKeyDown","baseOnKeyDown","ref","triggerRef","triggerProps","onFocus","event","target","currentTarget","onOpenChange","type","listboxRef","anchorRef","positioning","listboxId","listboxProps","cursorPositionPlugin","innerListbox","inputListboxProps","listbox","visible","span","aria-owns","inline","mountNode","promptListbox","containerRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export type { PromptListboxProps, PromptListboxSlots, PromptListboxState } from './PromptListbox';\nexport {\n  PromptListbox,\n  promptListboxClassNames,\n  renderPromptListbox_unstable,\n  usePromptListboxStyles_unstable,\n  usePromptListbox_unstable,\n} from './PromptListbox';\n\nexport { usePromptListboxFunctionality } from './components/utils/usePromptListboxFunctionalityV2';\nexport type {\n  OnOpenChangeData,\n  UsePromptListboxFunctionalityParams,\n  UsePromptListboxFunctionality,\n} from './components/utils/usePromptListboxFunctionalityV2';\n\nexport { usePromptListboxFunctionality as usePromptListboxFunctionalityDeprecated } from './components/utils/usePromptListboxFunctionality';\nexport type {\n  OnOpenChangeData as OnOpenChangeDataDeprecated,\n  ProcessedPromptListboxProps as ProcessedPromptListboxPropsDeprecated,\n  UsePromptListboxFunctionality as UsePromptListboxFunctionalityDeprecated,\n  UsePromptListboxFunctionalityParams as UsePromptListboxFunctionalityParamsDeprecated,\n} from './components/utils/PromptListboxFunctionality.types';\n\nexport type { PromptOptionProps, PromptOptionSlots, PromptOptionState } from './PromptOption';\nexport {\n  PromptOption,\n  promptOptionClassNames,\n  renderPromptOption_unstable,\n  usePromptOptionStyles_unstable,\n  usePromptOption_unstable,\n} from './PromptOption';\n\nexport type {\n  OptionProps,\n  OptionSlots,\n  OptionState,\n  OptionValue,\n  OptionOnSelectData,\n  OverrideActionHandler,\n  OverrideActionHandlerOptions,\n  OverrideActionHandlerResult,\n} from '@fluentui-copilot/react-input-listbox';\nexport {\n  Option,\n  optionClassNames,\n  renderOption_unstable,\n  useOption_unstable,\n  useOptionStyles_unstable,\n} from '@fluentui-copilot/react-input-listbox';\n"],"names":["PromptListbox","promptListboxClassNames","renderPromptListbox_unstable","usePromptListboxStyles_unstable","usePromptListbox_unstable","usePromptListboxFunctionality","usePromptListboxFunctionalityDeprecated","PromptOption","promptOptionClassNames","renderPromptOption_unstable","usePromptOptionStyles_unstable","usePromptOption_unstable","Option","optionClassNames","renderOption_unstable","useOption_unstable","useOptionStyles_unstable"],"rangeMappings":";;;;","mappings":"AACA,SACEA,aAAa,EACbC,uBAAuB,EACvBC,4BAA4B,EAC5BC,+BAA+B,EAC/BC,yBAAyB,QACpB,kBAAkB;AAEzB,SAASC,6BAA6B,QAAQ,qDAAqD;AAOnG,SAASA,iCAAiCC,uCAAuC,QAAQ,mDAAmD;AAS5I,SACEC,YAAY,EACZC,sBAAsB,EACtBC,2BAA2B,EAC3BC,8BAA8B,EAC9BC,wBAAwB,QACnB,iBAAiB;AAYxB,SACEC,MAAM,EACNC,gBAAgB,EAChBC,qBAAqB,EACrBC,kBAAkB,EAClBC,wBAAwB,QACnB,wCAAwC"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export type { PromptListboxProps, PromptListboxSlots, PromptListboxState } from './PromptListbox';\nexport {\n  PromptListbox,\n  promptListboxClassNames,\n  renderPromptListbox_unstable,\n  usePromptListboxStyles_unstable,\n  usePromptListbox_unstable,\n} from './PromptListbox';\n\nexport { usePromptListboxFunctionality } from './components/utils/usePromptListboxFunctionalityV2';\nexport type {\n  OnOpenChangeData,\n  UsePromptListboxFunctionalityParams,\n  UsePromptListboxFunctionality,\n} from './components/utils/usePromptListboxFunctionalityV2';\n\nexport { usePromptListboxFunctionality as usePromptListboxFunctionalityDeprecated } from './components/utils/usePromptListboxFunctionality';\nexport type {\n  OnOpenChangeData as OnOpenChangeDataDeprecated,\n  ProcessedPromptListboxProps as ProcessedPromptListboxPropsDeprecated,\n  UsePromptListboxFunctionality as UsePromptListboxFunctionalityDeprecated,\n  UsePromptListboxFunctionalityParams as UsePromptListboxFunctionalityParamsDeprecated,\n} from './components/utils/PromptListboxFunctionality.types';\n\nexport type { PromptOptionProps, PromptOptionSlots, PromptOptionState } from './PromptOption';\nexport {\n  PromptOption,\n  promptOptionClassNames,\n  renderPromptOption_unstable,\n  usePromptOptionStyles_unstable,\n  usePromptOption_unstable,\n} from './PromptOption';\n\nexport type {\n  ActiveOptionChangeData,\n  OptionProps,\n  OptionSlots,\n  OptionState,\n  OptionValue,\n  OptionOnSelectData,\n  OverrideActionHandler,\n  OverrideActionHandlerOptions,\n  OverrideActionHandlerResult,\n} from '@fluentui-copilot/react-input-listbox';\nexport {\n  Option,\n  optionClassNames,\n  renderOption_unstable,\n  useOption_unstable,\n  useOptionStyles_unstable,\n} from '@fluentui-copilot/react-input-listbox';\n"],"names":["PromptListbox","promptListboxClassNames","renderPromptListbox_unstable","usePromptListboxStyles_unstable","usePromptListbox_unstable","usePromptListboxFunctionality","usePromptListboxFunctionalityDeprecated","PromptOption","promptOptionClassNames","renderPromptOption_unstable","usePromptOptionStyles_unstable","usePromptOption_unstable","Option","optionClassNames","renderOption_unstable","useOption_unstable","useOptionStyles_unstable"],"rangeMappings":";;;;","mappings":"AACA,SACEA,aAAa,EACbC,uBAAuB,EACvBC,4BAA4B,EAC5BC,+BAA+B,EAC/BC,yBAAyB,QACpB,kBAAkB;AAEzB,SAASC,6BAA6B,QAAQ,qDAAqD;AAOnG,SAASA,iCAAiCC,uCAAuC,QAAQ,mDAAmD;AAS5I,SACEC,YAAY,EACZC,sBAAsB,EACtBC,2BAA2B,EAC3BC,8BAA8B,EAC9BC,wBAAwB,QACnB,iBAAiB;AAaxB,SACEC,MAAM,EACNC,gBAAgB,EAChBC,qBAAqB,EACrBC,kBAAkB,EAClBC,wBAAwB,QACnB,wCAAwC"}

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

@@ -18,14 +18,13 @@ const _useListboxPositioning = require("./useListboxPositioning");
 const _reactcomponents = require("@fluentui/react-components");
 function usePromptListboxFunctionality(params) {
     var _params_listboxProps, _params_listboxProps1;
-    const { fluid = false, allowArrowUpNavigation = false } = params;
+    const { fluid = false, allowArrowUpNavigation = false, onSelectionModeChange } = params;
     const [open, setOpen] = (0, _reactutilities.useControllableState)({
         state: params.open,
         defaultState: params.defaultOpen,
         initialState: false
     });
     const [cursorPosition, setCursorPosition] = _react.useState('end');
-    const [isInSelectionMode, setIsInSelectionMode] = _react.useState(false);
     const overrideActionHandler = (e, { activeOption, action, activeDescendantController, isInSelectionMode })=>{
         var _params_overrideActionHandler;
         const atStart = allowArrowUpNavigation && (cursorPosition === 'start' || cursorPosition === 'start-end');
@@ -74,15 +73,12 @@ function usePromptListboxFunctionality(params) {
             ...userOverrides
         };
     };
-    const onSelectionModeChange = (0, _reactutilities.mergeCallbacks)(params.onSelectionModeChange, (newSelectionMode)=>{
-        setIsInSelectionMode(newSelectionMode);
-    });
     const baseListboxFunctionality = (0, _reactinputlistbox.useInputListboxFunctionality)({
         ...params,
         onSelectionModeChange,
         overrideActionHandler
     });
-    const { onBlur: baseOnBlur, onKeyDown: baseOnKeyDown, ref: triggerRef } = baseListboxFunctionality.triggerProps;
+    const { onBlur: baseOnBlur, onKeyDown: baseOnKeyDown, ref: triggerRef, isInSelectionMode } = baseListboxFunctionality.triggerProps;
     const onFocus = (event)=>{
         if (event.target === event.currentTarget) {
             var _params_onOpenChange;

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 } = 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  const [isInSelectionMode, setIsInSelectionMode] = React.useState(false);\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 onSelectionModeChange = mergeCallbacks(params.onSelectionModeChange, newSelectionMode => {\n    setIsInSelectionMode(newSelectionMode);\n  });\n  const baseListboxFunctionality = useInputListboxFunctionality<TriggerElementType>({\n    ...params,\n    onSelectionModeChange,\n    overrideActionHandler,\n  });\n  const { onBlur: baseOnBlur, onKeyDown: baseOnKeyDown, ref: triggerRef } = 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","initialState","useControllableState","state","defaultState","cursorPosition","setCursorPosition","isInSelectionMode","allowArrowUpNavigation","overrideActionHandler","newAction","activeDescendantController","_params_overrideActionHandler","atEnd","newIsInSelection","first","atStart","activeOption","undefined","id","firstOption","action","baseListboxFunctionality","onSelectionModeChange","onKeyDown","baseOnKeyDown","newSelectionMode","setIsInSelectionMode","event","baseOnBlur","ref","triggerRef","useEventCallback","mergeCallbacks","currentTarget","onOpenChange","_params_onOpenChange","call","type","onBlur","e","cursorPositionPlugin","innerListbox","useMergedRefs","inputListboxProps","positioning","listbox","span","aria-owns","listboxId","inline","React","createElement","InputListbox","listboxProps","triggerProps","listboxRef","_params_listboxProps1","onFocus","Portal","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","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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"}

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export type { PromptListboxProps, PromptListboxSlots, PromptListboxState } from './PromptListbox';\nexport {\n  PromptListbox,\n  promptListboxClassNames,\n  renderPromptListbox_unstable,\n  usePromptListboxStyles_unstable,\n  usePromptListbox_unstable,\n} from './PromptListbox';\n\nexport { usePromptListboxFunctionality } from './components/utils/usePromptListboxFunctionalityV2';\nexport type {\n  OnOpenChangeData,\n  UsePromptListboxFunctionalityParams,\n  UsePromptListboxFunctionality,\n} from './components/utils/usePromptListboxFunctionalityV2';\n\nexport { usePromptListboxFunctionality as usePromptListboxFunctionalityDeprecated } from './components/utils/usePromptListboxFunctionality';\nexport type {\n  OnOpenChangeData as OnOpenChangeDataDeprecated,\n  ProcessedPromptListboxProps as ProcessedPromptListboxPropsDeprecated,\n  UsePromptListboxFunctionality as UsePromptListboxFunctionalityDeprecated,\n  UsePromptListboxFunctionalityParams as UsePromptListboxFunctionalityParamsDeprecated,\n} from './components/utils/PromptListboxFunctionality.types';\n\nexport type { PromptOptionProps, PromptOptionSlots, PromptOptionState } from './PromptOption';\nexport {\n  PromptOption,\n  promptOptionClassNames,\n  renderPromptOption_unstable,\n  usePromptOptionStyles_unstable,\n  usePromptOption_unstable,\n} from './PromptOption';\n\nexport type {\n  OptionProps,\n  OptionSlots,\n  OptionState,\n  OptionValue,\n  OptionOnSelectData,\n  OverrideActionHandler,\n  OverrideActionHandlerOptions,\n  OverrideActionHandlerResult,\n} from '@fluentui-copilot/react-input-listbox';\nexport {\n  Option,\n  optionClassNames,\n  renderOption_unstable,\n  useOption_unstable,\n  useOptionStyles_unstable,\n} from '@fluentui-copilot/react-input-listbox';\n"],"names":["Option","PromptListbox","PromptOption","optionClassNames","promptListboxClassNames","promptOptionClassNames","renderOption_unstable","renderPromptListbox_unstable","renderPromptOption_unstable","useOptionStyles_unstable","useOption_unstable","usePromptListboxFunctionality","usePromptListboxFunctionalityDeprecated","usePromptListboxStyles_unstable","usePromptListbox_unstable","usePromptOptionStyles_unstable","usePromptOption_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA4CEA,MAAM;eAANA,yBAAM;;IA1CNC,aAAa;eAAbA,4BAAa;;IAwBbC,YAAY;eAAZA,0BAAY;;IAmBZC,gBAAgB;eAAhBA,mCAAgB;;IA1ChBC,uBAAuB;eAAvBA,sCAAuB;;IAwBvBC,sBAAsB;eAAtBA,oCAAsB;;IAmBtBC,qBAAqB;eAArBA,wCAAqB;;IA1CrBC,4BAA4B;eAA5BA,2CAA4B;;IAwB5BC,2BAA2B;eAA3BA,yCAA2B;;IAoB3BC,wBAAwB;eAAxBA,2CAAwB;;IADxBC,kBAAkB;eAAlBA,qCAAkB;;IAtCXC,6BAA6B;eAA7BA,8DAA6B;;IAOIC,uCAAuC;eAAxED,4DAAAA;;IAXPE,+BAA+B;eAA/BA,8CAA+B;;IAC/BC,yBAAyB;eAAzBA,wCAAyB;;IAuBzBC,8BAA8B;eAA9BA,4CAA8B;;IAC9BC,wBAAwB;eAAxBA,sCAAwB;;;+BAvBnB;iDAEuC;+CAO2C;8BAelF;mCAkBA"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export type { PromptListboxProps, PromptListboxSlots, PromptListboxState } from './PromptListbox';\nexport {\n  PromptListbox,\n  promptListboxClassNames,\n  renderPromptListbox_unstable,\n  usePromptListboxStyles_unstable,\n  usePromptListbox_unstable,\n} from './PromptListbox';\n\nexport { usePromptListboxFunctionality } from './components/utils/usePromptListboxFunctionalityV2';\nexport type {\n  OnOpenChangeData,\n  UsePromptListboxFunctionalityParams,\n  UsePromptListboxFunctionality,\n} from './components/utils/usePromptListboxFunctionalityV2';\n\nexport { usePromptListboxFunctionality as usePromptListboxFunctionalityDeprecated } from './components/utils/usePromptListboxFunctionality';\nexport type {\n  OnOpenChangeData as OnOpenChangeDataDeprecated,\n  ProcessedPromptListboxProps as ProcessedPromptListboxPropsDeprecated,\n  UsePromptListboxFunctionality as UsePromptListboxFunctionalityDeprecated,\n  UsePromptListboxFunctionalityParams as UsePromptListboxFunctionalityParamsDeprecated,\n} from './components/utils/PromptListboxFunctionality.types';\n\nexport type { PromptOptionProps, PromptOptionSlots, PromptOptionState } from './PromptOption';\nexport {\n  PromptOption,\n  promptOptionClassNames,\n  renderPromptOption_unstable,\n  usePromptOptionStyles_unstable,\n  usePromptOption_unstable,\n} from './PromptOption';\n\nexport type {\n  ActiveOptionChangeData,\n  OptionProps,\n  OptionSlots,\n  OptionState,\n  OptionValue,\n  OptionOnSelectData,\n  OverrideActionHandler,\n  OverrideActionHandlerOptions,\n  OverrideActionHandlerResult,\n} from '@fluentui-copilot/react-input-listbox';\nexport {\n  Option,\n  optionClassNames,\n  renderOption_unstable,\n  useOption_unstable,\n  useOptionStyles_unstable,\n} from '@fluentui-copilot/react-input-listbox';\n"],"names":["Option","PromptListbox","PromptOption","optionClassNames","promptListboxClassNames","promptOptionClassNames","renderOption_unstable","renderPromptListbox_unstable","renderPromptOption_unstable","useOptionStyles_unstable","useOption_unstable","usePromptListboxFunctionality","usePromptListboxFunctionalityDeprecated","usePromptListboxStyles_unstable","usePromptListbox_unstable","usePromptOptionStyles_unstable","usePromptOption_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA6CEA,MAAM;eAANA,yBAAM;;IA3CNC,aAAa;eAAbA,4BAAa;;IAwBbC,YAAY;eAAZA,0BAAY;;IAoBZC,gBAAgB;eAAhBA,mCAAgB;;IA3ChBC,uBAAuB;eAAvBA,sCAAuB;;IAwBvBC,sBAAsB;eAAtBA,oCAAsB;;IAoBtBC,qBAAqB;eAArBA,wCAAqB;;IA3CrBC,4BAA4B;eAA5BA,2CAA4B;;IAwB5BC,2BAA2B;eAA3BA,yCAA2B;;IAqB3BC,wBAAwB;eAAxBA,2CAAwB;;IADxBC,kBAAkB;eAAlBA,qCAAkB;;IAvCXC,6BAA6B;eAA7BA,8DAA6B;;IAOIC,uCAAuC;eAAxED,4DAAAA;;IAXPE,+BAA+B;eAA/BA,8CAA+B;;IAC/BC,yBAAyB;eAAzBA,wCAAyB;;IAuBzBC,8BAA8B;eAA9BA,4CAA8B;;IAC9BC,wBAAwB;eAAxBA,sCAAwB;;;+BAvBnB;iDAEuC;+CAO2C;8BAelF;mCAmBA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-copilot/react-prompt-listbox",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "description": "PromptListbox for input components using EditorInput.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -12,11 +12,11 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@fluentui-copilot/chat-input-plugins": "^0.4.1",
-    "@fluentui-copilot/react-chat-input-plugins": "^0.4.1",
-    "@fluentui-copilot/react-editor-input": "^0.4.2",
-    "@fluentui-copilot/react-input-listbox": "^0.1.1",
-    "@fluentui-copilot/react-prompt-input": "^0.5.2",
+    "@fluentui-copilot/chat-input-plugins": "^0.4.2",
+    "@fluentui-copilot/react-chat-input-plugins": "^0.4.2",
+    "@fluentui-copilot/react-editor-input": "^0.4.3",
+    "@fluentui-copilot/react-input-listbox": "^0.1.2",
+    "@fluentui-copilot/react-prompt-input": "^0.5.3",
     "@fluentui-copilot/react-provider": "^0.9.3",
     "@fluentui-copilot/react-text-editor": "^0.4.1",
     "@fluentui-copilot/text-editor": "^0.3.1",