@fluentui-copilot/react-prompt-listbox 0.0.0-nightly-20240719-0406-ee8d99d6.1 → 0.0.0-nightly-20240722-0406-476bfcb7.1

package/CHANGELOG.json

@@ -2,9 +2,9 @@
   "name": "@fluentui-copilot/react-prompt-listbox",
   "entries": [
     {
-      "date": "Fri, 19 Jul 2024 04:13:27 GMT",
-      "tag": "@fluentui-copilot/react-prompt-listbox_v0.0.0-nightly-20240719-0406-ee8d99d6.1",
-      "version": "0.0.0-nightly-20240719-0406-ee8d99d6.1",
+      "date": "Mon, 22 Jul 2024 04:13:12 GMT",
+      "tag": "@fluentui-copilot/react-prompt-listbox_v0.0.0-nightly-20240722-0406-476bfcb7.1",
+      "version": "0.0.0-nightly-20240722-0406-476bfcb7.1",
       "comments": {
         "prerelease": [
           {
@@ -16,38 +16,38 @@
           {
             "author": "beachball",
             "package": "@fluentui-copilot/react-prompt-listbox",
-            "comment": "Bump @fluentui-copilot/chat-input-plugins to v0.0.0-nightly-20240719-0406-ee8d99d6.1",
-            "commit": "e568e817e90915ee691011151b826dc43e4c0778"
+            "comment": "Bump @fluentui-copilot/chat-input-plugins to v0.0.0-nightly-20240722-0406-476bfcb7.1",
+            "commit": "e8afe224d02de2aef9778bb216e4d3228442e02f"
           },
           {
             "author": "beachball",
             "package": "@fluentui-copilot/react-prompt-listbox",
-            "comment": "Bump @fluentui-copilot/react-chat-input-plugins to v0.0.0-nightly-20240719-0406-ee8d99d6.1",
-            "commit": "e568e817e90915ee691011151b826dc43e4c0778"
+            "comment": "Bump @fluentui-copilot/react-chat-input-plugins to v0.0.0-nightly-20240722-0406-476bfcb7.1",
+            "commit": "e8afe224d02de2aef9778bb216e4d3228442e02f"
           },
           {
             "author": "beachball",
             "package": "@fluentui-copilot/react-prompt-listbox",
-            "comment": "Bump @fluentui-copilot/react-editor-input to v0.0.0-nightly-20240719-0406-ee8d99d6.1",
-            "commit": "e568e817e90915ee691011151b826dc43e4c0778"
+            "comment": "Bump @fluentui-copilot/react-editor-input to v0.0.0-nightly-20240722-0406-476bfcb7.1",
+            "commit": "e8afe224d02de2aef9778bb216e4d3228442e02f"
           },
           {
             "author": "beachball",
             "package": "@fluentui-copilot/react-prompt-listbox",
-            "comment": "Bump @fluentui-copilot/react-provider to v0.0.0-nightly-20240719-0406-ee8d99d6.1",
-            "commit": "e568e817e90915ee691011151b826dc43e4c0778"
+            "comment": "Bump @fluentui-copilot/react-provider to v0.0.0-nightly-20240722-0406-476bfcb7.1",
+            "commit": "e8afe224d02de2aef9778bb216e4d3228442e02f"
           },
           {
             "author": "beachball",
             "package": "@fluentui-copilot/react-prompt-listbox",
-            "comment": "Bump @fluentui-copilot/react-text-editor to v0.0.0-nightly-20240719-0406-ee8d99d6.1",
-            "commit": "e568e817e90915ee691011151b826dc43e4c0778"
+            "comment": "Bump @fluentui-copilot/react-text-editor to v0.0.0-nightly-20240722-0406-476bfcb7.1",
+            "commit": "e8afe224d02de2aef9778bb216e4d3228442e02f"
           },
           {
             "author": "beachball",
             "package": "@fluentui-copilot/react-prompt-listbox",
-            "comment": "Bump @fluentui-copilot/text-editor to v0.0.0-nightly-20240719-0406-ee8d99d6.1",
-            "commit": "e568e817e90915ee691011151b826dc43e4c0778"
+            "comment": "Bump @fluentui-copilot/text-editor to v0.0.0-nightly-20240722-0406-476bfcb7.1",
+            "commit": "e8afe224d02de2aef9778bb216e4d3228442e02f"
           }
         ]
       }

package/CHANGELOG.md

@@ -1,19 +1,19 @@
 # Change Log - @fluentui-copilot/react-prompt-listbox
 
-This log was last generated on Fri, 19 Jul 2024 04:13:27 GMT and should not be manually modified.
+This log was last generated on Mon, 22 Jul 2024 04:13:12 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [0.0.0-nightly-20240719-0406-ee8d99d6.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-prompt-listbox_v0.0.0-nightly-20240719-0406-ee8d99d6.1)
+## [0.0.0-nightly-20240722-0406-476bfcb7.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-prompt-listbox_v0.0.0-nightly-20240722-0406-476bfcb7.1)
 
-Fri, 19 Jul 2024 04:13:27 GMT
+Mon, 22 Jul 2024 04:13:12 GMT
 
 ### Changes
 
 - Release nightly ([commit](https://github.com/microsoft/fluentai/commit/not available) by fluentui-internal@service.microsoft.com)
-- Bump @fluentui-copilot/chat-input-plugins to v0.0.0-nightly-20240719-0406-ee8d99d6.1 ([commit](https://github.com/microsoft/fluentai/commit/e568e817e90915ee691011151b826dc43e4c0778) by beachball)
-- Bump @fluentui-copilot/react-chat-input-plugins to v0.0.0-nightly-20240719-0406-ee8d99d6.1 ([commit](https://github.com/microsoft/fluentai/commit/e568e817e90915ee691011151b826dc43e4c0778) by beachball)
-- Bump @fluentui-copilot/react-editor-input to v0.0.0-nightly-20240719-0406-ee8d99d6.1 ([commit](https://github.com/microsoft/fluentai/commit/e568e817e90915ee691011151b826dc43e4c0778) by beachball)
-- Bump @fluentui-copilot/react-provider to v0.0.0-nightly-20240719-0406-ee8d99d6.1 ([commit](https://github.com/microsoft/fluentai/commit/e568e817e90915ee691011151b826dc43e4c0778) by beachball)
-- Bump @fluentui-copilot/react-text-editor to v0.0.0-nightly-20240719-0406-ee8d99d6.1 ([commit](https://github.com/microsoft/fluentai/commit/e568e817e90915ee691011151b826dc43e4c0778) by beachball)
-- Bump @fluentui-copilot/text-editor to v0.0.0-nightly-20240719-0406-ee8d99d6.1 ([commit](https://github.com/microsoft/fluentai/commit/e568e817e90915ee691011151b826dc43e4c0778) by beachball)
+- Bump @fluentui-copilot/chat-input-plugins to v0.0.0-nightly-20240722-0406-476bfcb7.1 ([commit](https://github.com/microsoft/fluentai/commit/e8afe224d02de2aef9778bb216e4d3228442e02f) by beachball)
+- Bump @fluentui-copilot/react-chat-input-plugins to v0.0.0-nightly-20240722-0406-476bfcb7.1 ([commit](https://github.com/microsoft/fluentai/commit/e8afe224d02de2aef9778bb216e4d3228442e02f) by beachball)
+- Bump @fluentui-copilot/react-editor-input to v0.0.0-nightly-20240722-0406-476bfcb7.1 ([commit](https://github.com/microsoft/fluentai/commit/e8afe224d02de2aef9778bb216e4d3228442e02f) by beachball)
+- Bump @fluentui-copilot/react-provider to v0.0.0-nightly-20240722-0406-476bfcb7.1 ([commit](https://github.com/microsoft/fluentai/commit/e8afe224d02de2aef9778bb216e4d3228442e02f) by beachball)
+- Bump @fluentui-copilot/react-text-editor to v0.0.0-nightly-20240722-0406-476bfcb7.1 ([commit](https://github.com/microsoft/fluentai/commit/e8afe224d02de2aef9778bb216e4d3228442e02f) by beachball)
+- Bump @fluentui-copilot/text-editor to v0.0.0-nightly-20240722-0406-476bfcb7.1 ([commit](https://github.com/microsoft/fluentai/commit/e8afe224d02de2aef9778bb216e4d3228442e02f) by beachball)

package/dist/index.d.ts

@@ -144,11 +144,34 @@ export declare type PromptListboxSlots = {
  */
 export declare type PromptListboxState = ComponentState<PromptListboxSlots> & PromptListboxContextState & Required<Pick<PromptListboxProps, 'open' | 'inlinePopup'>> & Pick<PromptListboxProps, 'mountNode'>;
 
+export declare const PromptOption: ForwardRefComponent<PromptOptionProps>;
+
+export declare const promptOptionClassNames: SlotClassNames<PromptOptionSlots>;
+
+/**
+ * PromptOption Props
+ */
+export declare type PromptOptionProps = ComponentProps<PromptOptionSlots> & {};
+
+export declare type PromptOptionSlots = {
+    root: Slot<'div'>;
+};
+
+/**
+ * State used in rendering PromptOption
+ */
+export declare type PromptOptionState = ComponentState<PromptOptionSlots>;
+
 /**
  * Render the final JSX of PromptListbox
  */
 export declare const renderPromptListbox_unstable: (state: PromptListboxState, contextValues: PromptListboxContextValues) => JSX.Element;
 
+/**
+ * Render the final JSX of PromptOption
+ */
+export declare const renderPromptOption_unstable: (state: PromptOptionState) => JSX.Element;
+
 /** Possible event types for onOptionSelect */
 declare type SelectionEvents = React_2.ChangeEvent<HTMLElement> | React_2.KeyboardEvent<HTMLElement> | React_2.MouseEvent<HTMLElement>;
 
@@ -197,10 +220,10 @@ export declare type UsePromptListboxFunctionality = {
      * will provide this prop to the PromptInput's EditorInput (since this is the root slot,
      * this is provided directly to the component and not the slot).
      *
-     * Note: If the targetRef is the same as the trigger, the ref provided in triggerProps needs
-     * to be merged with this one using `useMergedRefs(targetRef, triggerProps.ref);`
+     * Note: If the containerRef is the same as the trigger, the ref provided in triggerProps needs
+     * to be merged with this one using `useMergedRefs(containerRef, triggerProps.ref);`
      */
-    targetRef: React_3.MutableRefObject<any>;
+    containerRef: React_3.MutableRefObject<any>;
     /**
      * Plugin used to tell where the cursor is in the EditorInput, this is important for the
      * keyboard behavior. This should be passed as children in the PromptInput.
@@ -227,4 +250,20 @@ export declare type UsePromptListboxFunctionalityParams = {
  */
 export declare const usePromptListboxStyles_unstable: (state: PromptListboxState) => PromptListboxState;
 
+/**
+ * Create the state required to render PromptOption.
+ *
+ * The returned state can be modified with hooks such as usePromptOptionStyles_unstable,
+ * before being passed to renderPromptOption_unstable.
+ *
+ * @param props - props from this instance of PromptOption
+ * @param ref - reference to root HTMLElement of PromptOption
+ */
+export declare const usePromptOption_unstable: (props: PromptOptionProps, ref: React_2.Ref<HTMLDivElement>) => PromptOptionState;
+
+/**
+ * Apply styling to the PromptOption slots based on the state
+ */
+export declare const usePromptOptionStyles_unstable: (state: PromptOptionState) => PromptOptionState;
+
 export { }

package/lib/PromptOption.js

@@ -0,0 +1,2 @@
+export * from './components/PromptOption/index';
+//# sourceMappingURL=PromptOption.js.map

package/lib/PromptOption.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PromptOption.ts"],"sourcesContent":["export * from './components/PromptOption/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,kCAAkC"}

package/lib/components/PromptOption/PromptOption.js

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { usePromptOption_unstable } from './usePromptOption';
+import { renderPromptOption_unstable } from './renderPromptOption';
+import { usePromptOptionStyles_unstable } from './usePromptOptionStyles.styles';
+// PromptOption component - TODO: add more docs
+export const PromptOption = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = usePromptOption_unstable(props, ref);
+  usePromptOptionStyles_unstable(state);
+  return renderPromptOption_unstable(state);
+});
+PromptOption.displayName = 'PromptOption';
+//# sourceMappingURL=PromptOption.js.map

package/lib/components/PromptOption/PromptOption.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PromptOption.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePromptOption_unstable } from './usePromptOption';\nimport { renderPromptOption_unstable } from './renderPromptOption';\nimport { usePromptOptionStyles_unstable } from './usePromptOptionStyles.styles';\nimport type { PromptOptionProps } from './PromptOption.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n// PromptOption component - TODO: add more docs\nexport const PromptOption: ForwardRefComponent<PromptOptionProps> = React.forwardRef((props, ref) => {\n  const state = usePromptOption_unstable(props, ref);\n\n  usePromptOptionStyles_unstable(state);\n  return renderPromptOption_unstable(state);\n});\n\nPromptOption.displayName = 'PromptOption';\n"],"names":["React","usePromptOption_unstable","renderPromptOption_unstable","usePromptOptionStyles_unstable","PromptOption","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAIhF,+CAA+C;AAC/C,OAAO,MAAMC,6BAAuDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQP,yBAAyBK,OAAOC;IAE9CJ,+BAA+BK;IAC/B,OAAON,4BAA4BM;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

package/lib/components/PromptOption/PromptOption.types.js

@@ -0,0 +1,5 @@
+/**
+ * State used in rendering PromptOption
+ */export {}; // TODO: Remove semicolon from previous line, uncomment next line, and provide union of props to pick from PromptOptionProps.
+// & Required<Pick<PromptOptionProps, 'propName'>>
+//# sourceMappingURL=PromptOption.types.js.map

package/lib/components/PromptOption/PromptOption.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PromptOption.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type PromptOptionSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * PromptOption Props\n */\nexport type PromptOptionProps = ComponentProps<PromptOptionSlots> & {};\n\n/**\n * State used in rendering PromptOption\n */\nexport type PromptOptionState = ComponentState<PromptOptionSlots>;\n// TODO: Remove semicolon from previous line, uncomment next line, and provide union of props to pick from PromptOptionProps.\n// & Required<Pick<PromptOptionProps, 'propName'>>\n"],"names":[],"rangeMappings":";;;","mappings":"AAWA;;CAEC,GACD,WAAkE,CAClE,6HAA6H;CAC7H,kDAAkD"}

package/lib/components/PromptOption/index.js

@@ -0,0 +1,6 @@
+export * from './PromptOption';
+export * from './PromptOption.types';
+export * from './renderPromptOption';
+export * from './usePromptOption';
+export * from './usePromptOptionStyles.styles';
+//# sourceMappingURL=index.js.map

package/lib/components/PromptOption/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './PromptOption';\nexport * from './PromptOption.types';\nexport * from './renderPromptOption';\nexport * from './usePromptOption';\nexport * from './usePromptOptionStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,iBAAiB;AAC/B,cAAc,uBAAuB;AACrC,cAAc,uBAAuB;AACrC,cAAc,oBAAoB;AAClC,cAAc,iCAAiC"}

package/lib/components/PromptOption/renderPromptOption.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-components';
+/**
+ * Render the final JSX of PromptOption
+ */
+export const renderPromptOption_unstable = state => {
+  assertSlots(state);
+  // TODO Add additional slots in the appropriate place
+  return /*#__PURE__*/_jsx(state.root, {});
+};
+//# sourceMappingURL=renderPromptOption.js.map

package/lib/components/PromptOption/renderPromptOption.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderPromptOption.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { PromptOptionState, PromptOptionSlots } from './PromptOption.types';\n\n/**\n * Render the final JSX of PromptOption\n */\nexport const renderPromptOption_unstable = (state: PromptOptionState) => {\n  assertSlots<PromptOptionSlots>(state);\n\n  // TODO Add additional slots in the appropriate place\n  return <state.root />;\n};\n"],"names":["assertSlots","renderPromptOption_unstable","state","root"],"rangeMappings":";;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAGzD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1CF,YAA+BE;IAE/B,qDAAqD;IACrD,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

package/lib/components/PromptOption/usePromptOption.js

@@ -0,0 +1,29 @@
+import { getIntrinsicElementProps, slot } from '@fluentui/react-components';
+// If you add JSX to this file, be sure to change the file type to .tsx
+/**
+ * Create the state required to render PromptOption.
+ *
+ * The returned state can be modified with hooks such as usePromptOptionStyles_unstable,
+ * before being passed to renderPromptOption_unstable.
+ *
+ * @param props - props from this instance of PromptOption
+ * @param ref - reference to root HTMLElement of PromptOption
+ */
+export const usePromptOption_unstable = (props, ref) => {
+  return {
+    // TODO add appropriate props/defaults
+    components: {
+      // TODO add each slot's element type or component
+      root: 'div'
+    },
+    // TODO add appropriate slots, for example:
+    // mySlot: slot.optional(props.mySlot),
+    root: slot.always(getIntrinsicElementProps('div', {
+      ref,
+      ...props
+    }), {
+      elementType: 'div'
+    })
+  };
+};
+//# sourceMappingURL=usePromptOption.js.map

package/lib/components/PromptOption/usePromptOption.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePromptOption.ts"],"sourcesContent":["import type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-components';\nimport type { PromptOptionProps, PromptOptionState } from './PromptOption.types';\n\n// If you add JSX to this file, be sure to change the file type to .tsx\n\n/**\n * Create the state required to render PromptOption.\n *\n * The returned state can be modified with hooks such as usePromptOptionStyles_unstable,\n * before being passed to renderPromptOption_unstable.\n *\n * @param props - props from this instance of PromptOption\n * @param ref - reference to root HTMLElement of PromptOption\n */\nexport const usePromptOption_unstable = (\n  props: PromptOptionProps,\n  ref: React.Ref<HTMLDivElement>,\n): PromptOptionState => {\n  return {\n    // TODO add appropriate props/defaults\n    components: {\n      // TODO add each slot's element type or component\n      root: 'div',\n    },\n    // TODO add appropriate slots, for example:\n    // mySlot: slot.optional(props.mySlot),\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n"],"names":["getIntrinsicElementProps","slot","usePromptOption_unstable","props","ref","components","root","always","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AACA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,6BAA6B;AAG5E,uEAAuE;AAEvE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CACtCC,OACAC;IAEA,OAAO;QACL,sCAAsC;QACtCC,YAAY;YACV,iDAAiD;YACjDC,MAAM;QACR;QACA,2CAA2C;QAC3C,uCAAuC;QACvCA,MAAML,KAAKM,MAAM,CACfP,yBAAyB,OAAO;YAC9BI;YACA,GAAGD,KAAK;QACV,IACA;YAAEK,aAAa;QAAM;IAEzB;AACF,EAAE"}

package/lib/components/PromptOption/usePromptOptionStyles.styles.js

@@ -0,0 +1,23 @@
+import { __styles, mergeClasses } from '@fluentui/react-components';
+export const promptOptionClassNames = {
+  root: 'fai-PromptOption'
+};
+/**
+ * Styles for the root slot
+ */
+const useStyles = __styles({
+  root: {}
+}, {});
+/**
+ * Apply styling to the PromptOption slots based on the state
+ */
+export const usePromptOptionStyles_unstable = state => {
+  'use no memo';
+
+  const styles = useStyles();
+  state.root.className = mergeClasses(promptOptionClassNames.root, styles.root, state.root.className);
+  // TODO Add class names to slots, for example:
+  // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);
+  return state;
+};
+//# sourceMappingURL=usePromptOptionStyles.styles.js.map

package/lib/components/PromptOption/usePromptOptionStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePromptOptionStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@fluentui/react-components';\nimport type { PromptOptionSlots, PromptOptionState } from './PromptOption.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptOptionClassNames: SlotClassNames<PromptOptionSlots> = {\n  root: 'fai-PromptOption',\n  // TODO: add class names for all slots on PromptOptionSlots.\n  // Should be of the form `<slotName>: 'fai-PromptOption__<slotName>`\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    // TODO Add default styles for the root element\n  },\n\n  // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the PromptOption slots based on the state\n */\nexport const usePromptOptionStyles_unstable = (state: PromptOptionState): PromptOptionState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(promptOptionClassNames.root, styles.root, state.root.className);\n\n  // TODO Add class names to slots, for example:\n  // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","promptOptionClassNames","root","useStyles","usePromptOptionStyles_unstable","state","styles","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,QAAQ,6BAA6B;AAItE,OAAO,MAAMC,yBAA4D;IACvEC,MAAM;AAGR,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYJ,WAAW;IAC3BG,MAAM;IAEN;AAGF;AAEA;;CAEC,GACD,OAAO,MAAME,iCAAiC,CAACC;IAC7C;IAEA,MAAMC,SAASH;IACfE,MAAMH,IAAI,CAACK,SAAS,GAAGP,aAAaC,uBAAuBC,IAAI,EAAEI,OAAOJ,IAAI,EAAEG,MAAMH,IAAI,CAACK,SAAS;IAElG,8CAA8C;IAC9C,gFAAgF;IAEhF,OAAOF;AACT,EAAE"}

package/lib/components/utils/PromptListboxFunctionality.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PromptListboxFunctionality.types.ts"],"sourcesContent":["import type React from 'react';\nimport type { PromptListboxProps } from '../../components/PromptListbox';\nimport type { PositioningShorthand } from '@fluentui/react-components';\nimport type { EventData, EventHandler } from '@fluentui/react-utilities';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\n\n// Note: While we are removing multiselect, we are keeping the logic and disabling it\n// in case it's needed in the future.\nexport type ProcessedPromptListboxProps = Partial<\n  Omit<PromptListboxProps, 'activeDescendantController' | 'multiselect'>\n> & {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  ref?: React.MutableRefObject<any>;\n};\n\nexport type UsePromptListboxFunctionality = {\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   * 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 targetRef is the same as the trigger, the ref provided in triggerProps needs\n   * to be merged with this one using `useMergedRefs(targetRef, triggerProps.ref);`\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  targetRef: React.MutableRefObject<any>;\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 type UsePromptListboxFunctionalityParams = {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: EventHandler<OnOpenChangeData>;\n  onSelectionModeChange?: (isInSelectionMode: boolean) => void;\n  positioning?: PositioningShorthand;\n  /**\n   * Props to be passed to the ListboxComponent\n   */\n  listboxProps?: ProcessedPromptListboxProps;\n};\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"],"names":[],"rangeMappings":"","mappings":"AA4DA,WAME"}
+{"version":3,"sources":["PromptListboxFunctionality.types.ts"],"sourcesContent":["import type React from 'react';\nimport type { PromptListboxProps } from '../../components/PromptListbox';\nimport type { PositioningShorthand } from '@fluentui/react-components';\nimport type { EventData, EventHandler } from '@fluentui/react-utilities';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\n\n// Note: While we are removing multiselect, we are keeping the logic and disabling it\n// in case it's needed in the future.\nexport type ProcessedPromptListboxProps = Partial<\n  Omit<PromptListboxProps, 'activeDescendantController' | 'multiselect'>\n> & {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  ref?: React.MutableRefObject<any>;\n};\n\nexport type UsePromptListboxFunctionality = {\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   * 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  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  containerRef: React.MutableRefObject<any>;\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 type UsePromptListboxFunctionalityParams = {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: EventHandler<OnOpenChangeData>;\n  onSelectionModeChange?: (isInSelectionMode: boolean) => void;\n  positioning?: PositioningShorthand;\n  /**\n   * Props to be passed to the ListboxComponent\n   */\n  listboxProps?: ProcessedPromptListboxProps;\n};\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"],"names":[],"rangeMappings":"","mappings":"AA4DA,WAME"}

package/lib/components/utils/usePromptListboxFunctionality.js

@@ -136,7 +136,7 @@ export function usePromptListboxFunctionality(params) {
       onKeyDown: useEventCallback(mergeCallbacks(onKeyDown, onInputTriggerKeyDown)),
       isInSelectionMode
     },
-    targetRef: comboboxTargetRef,
+    containerRef: comboboxTargetRef,
     cursorPositionPlugin
   };
 }

package/lib/components/utils/usePromptListboxFunctionality.js.map

@@ -1 +1 @@
-{"version":3,"sources":["usePromptListboxFunctionality.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { optionClassNames } from '@fluentui/react-components';\nimport { mergeCallbacks, useControllableState, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from './dropdownKeyActions';\nimport { TextCursorPositionPlugin } from '../../plugins/TextCursorPositionPlugin';\nimport { useOptionCollection } from './useOptionCollection';\nimport { useSelection } from './useSelection';\nimport { ArrowDown, ArrowLeft, ArrowRight, ArrowUp } from '@fluentui/keyboard-keys';\nimport { useComboboxPositioning } from './useComboboxPositioning';\nimport { useTriggerKeydown } from './useTriggerKeyDown';\nimport { PromptListbox } from '../PromptListbox';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\nimport type {\n  UsePromptListboxFunctionalityParams,\n  UsePromptListboxFunctionality,\n} from './PromptListboxFunctionality.types';\n\nexport function usePromptListboxFunctionality(\n  params: UsePromptListboxFunctionalityParams,\n): UsePromptListboxFunctionality {\n  const { positioning, onOpenChange, onSelectionModeChange, listboxProps } = params;\n  const {\n    listboxRef: activeDescendantListboxRef,\n    activeParentRef,\n    controller: activeDescendantController,\n  } = useActiveDescendant<HTMLSpanElement, HTMLDivElement>({\n    matchOption: el => el.classList.contains(optionClassNames.root),\n  });\n  // useMergedRefs to normalize the ref into a React.RefObject type\n  const triggerRef = useMergedRefs(activeParentRef);\n  const selectionState = useSelection(listboxProps ?? {});\n  const { selectOption } = selectionState;\n  const optionCollection = useOptionCollection();\n  const { getOptionById } = optionCollection;\n  const [isInLastPosition, setIsInLastPosition] = React.useState(true);\n  const [isInSelectionMode, setIsInSelectionMode] = React.useState(false);\n  const [open, setOpen] = useControllableState({\n    state: params.open,\n    defaultState: params.defaultOpen,\n    initialState: false,\n  });\n\n  const onBlur = (event: React.FocusEvent<HTMLSpanElement>) => {\n    setOpen(false);\n    onOpenChange?.(event, { event, type: 'focus', open: false });\n  };\n\n  const onFocus = (event: React.FocusEvent<HTMLSpanElement>) => {\n    if (event.target === event.currentTarget) {\n      setOpen(true);\n      onOpenChange?.(event, { event, type: 'focus', open: true });\n    }\n  };\n\n  const cursorPositionPlugin = <TextCursorPositionPlugin setIsInLastPosition={setIsInLastPosition} />;\n\n  const onListboxBlur = React.useCallback(() => {\n    setIsInSelectionMode(false);\n    onSelectionModeChange?.(false);\n  }, [onSelectionModeChange]);\n\n  // handle combobox keyboard interaction\n  const onKeyDown = useTriggerKeydown({\n    ...optionCollection,\n    activeDescendantController,\n    getOptionById,\n    onBlur: onListboxBlur,\n    selectOption,\n    isInLastPosition,\n    open,\n    multiselect: false,\n  });\n\n  // NVDA and JAWS have bugs that suppress reading the input value text when aria-activedescendant is set\n  // To prevent this, we clear the HTML attribute (but save the state) when a user presses left/right arrows\n  // ref: https://github.com/microsoft/fluentui/issues/26359#issuecomment-1397759888\n  const [hideActiveDescendant, setHideActiveDescendant] = React.useState(false);\n\n  /**\n   * Freeform combobox should not select\n   */\n  const onInputTriggerKeyDown: EditorInputProps['onKeyDown'] = useEventCallback(event => {\n    // update typing state to true if the user is typing\n    const action = getDropdownActionFromKey(event, { open, multiselect: false, isInLastPosition });\n    if (\n      event.key === ArrowLeft ||\n      event.key === ArrowRight ||\n      (!isInLastPosition && (event.key === ArrowDown || event.key === ArrowUp)) ||\n      (action === 'Type' && isInLastPosition) ||\n      action === 'Type'\n    ) {\n      activeDescendantController.blur();\n      setHideActiveDescendant(true);\n      setIsInSelectionMode(false);\n      onSelectionModeChange?.(false);\n    } else if (\n      action === 'Next' ||\n      action === 'Previous' ||\n      action === 'First' ||\n      action === 'Last' ||\n      action === 'PageUp' ||\n      action === 'PageDown'\n    ) {\n      setHideActiveDescendant(false);\n      setIsInSelectionMode(true);\n      onSelectionModeChange?.(true);\n    }\n  });\n\n  React.useEffect(() => {\n    if (hideActiveDescendant) {\n      triggerRef.current?.removeAttribute('aria-activedescendant');\n    }\n    // We only want to run this when the hideActiveDescendant changes, if the triggerRef\n    // is undefined, there's no need to remove theAttribute and we shouldn't be adding\n    // refs as dependencies since it can blow up the number of runs.\n    // eslint-disable-next-line react-compiler/react-compiler\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [hideActiveDescendant]);\n\n  const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning({ positioning });\n\n  const listboxMergedRef = useMergedRefs(comboboxPopupRef, activeDescendantListboxRef, listboxProps?.ref);\n  const listbox = React.useMemo(() => {\n    return (\n      <PromptListbox\n        open={open}\n        {...listboxProps}\n        {...optionCollection}\n        {...selectionState}\n        ref={listboxMergedRef}\n        activeDescendantController={activeDescendantController}\n      />\n    );\n  }, [activeDescendantController, listboxMergedRef, listboxProps, open, optionCollection, selectionState]);\n\n  return {\n    promptListbox: listbox,\n    triggerProps: {\n      ref: triggerRef,\n      onBlur,\n      onFocus,\n      onKeyDown: useEventCallback(mergeCallbacks(onKeyDown, onInputTriggerKeyDown)),\n      isInSelectionMode,\n    },\n    targetRef: comboboxTargetRef,\n    cursorPositionPlugin,\n  };\n}\n"],"names":["React","useActiveDescendant","optionClassNames","mergeCallbacks","useControllableState","useEventCallback","useMergedRefs","getDropdownActionFromKey","TextCursorPositionPlugin","useOptionCollection","useSelection","ArrowDown","ArrowLeft","ArrowRight","ArrowUp","useComboboxPositioning","useTriggerKeydown","PromptListbox","usePromptListboxFunctionality","params","positioning","onOpenChange","onSelectionModeChange","listboxProps","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","el","classList","contains","root","triggerRef","selectionState","selectOption","optionCollection","getOptionById","isInLastPosition","setIsInLastPosition","useState","isInSelectionMode","setIsInSelectionMode","open","setOpen","state","defaultState","defaultOpen","initialState","onBlur","event","type","onFocus","target","currentTarget","cursorPositionPlugin","onListboxBlur","useCallback","onKeyDown","multiselect","hideActiveDescendant","setHideActiveDescendant","onInputTriggerKeyDown","action","key","blur","useEffect","current","removeAttribute","comboboxPopupRef","comboboxTargetRef","listboxMergedRef","ref","listbox","useMemo","promptListbox","triggerProps","targetRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["usePromptListboxFunctionality.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { optionClassNames } from '@fluentui/react-components';\nimport { mergeCallbacks, useControllableState, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from './dropdownKeyActions';\nimport { TextCursorPositionPlugin } from '../../plugins/TextCursorPositionPlugin';\nimport { useOptionCollection } from './useOptionCollection';\nimport { useSelection } from './useSelection';\nimport { ArrowDown, ArrowLeft, ArrowRight, ArrowUp } from '@fluentui/keyboard-keys';\nimport { useComboboxPositioning } from './useComboboxPositioning';\nimport { useTriggerKeydown } from './useTriggerKeyDown';\nimport { PromptListbox } from '../PromptListbox';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\nimport type {\n  UsePromptListboxFunctionalityParams,\n  UsePromptListboxFunctionality,\n} from './PromptListboxFunctionality.types';\n\nexport function usePromptListboxFunctionality(\n  params: UsePromptListboxFunctionalityParams,\n): UsePromptListboxFunctionality {\n  const { positioning, onOpenChange, onSelectionModeChange, listboxProps } = params;\n  const {\n    listboxRef: activeDescendantListboxRef,\n    activeParentRef,\n    controller: activeDescendantController,\n  } = useActiveDescendant<HTMLSpanElement, HTMLDivElement>({\n    matchOption: el => el.classList.contains(optionClassNames.root),\n  });\n  // useMergedRefs to normalize the ref into a React.RefObject type\n  const triggerRef = useMergedRefs(activeParentRef);\n  const selectionState = useSelection(listboxProps ?? {});\n  const { selectOption } = selectionState;\n  const optionCollection = useOptionCollection();\n  const { getOptionById } = optionCollection;\n  const [isInLastPosition, setIsInLastPosition] = React.useState(true);\n  const [isInSelectionMode, setIsInSelectionMode] = React.useState(false);\n  const [open, setOpen] = useControllableState({\n    state: params.open,\n    defaultState: params.defaultOpen,\n    initialState: false,\n  });\n\n  const onBlur = (event: React.FocusEvent<HTMLSpanElement>) => {\n    setOpen(false);\n    onOpenChange?.(event, { event, type: 'focus', open: false });\n  };\n\n  const onFocus = (event: React.FocusEvent<HTMLSpanElement>) => {\n    if (event.target === event.currentTarget) {\n      setOpen(true);\n      onOpenChange?.(event, { event, type: 'focus', open: true });\n    }\n  };\n\n  const cursorPositionPlugin = <TextCursorPositionPlugin setIsInLastPosition={setIsInLastPosition} />;\n\n  const onListboxBlur = React.useCallback(() => {\n    setIsInSelectionMode(false);\n    onSelectionModeChange?.(false);\n  }, [onSelectionModeChange]);\n\n  // handle combobox keyboard interaction\n  const onKeyDown = useTriggerKeydown({\n    ...optionCollection,\n    activeDescendantController,\n    getOptionById,\n    onBlur: onListboxBlur,\n    selectOption,\n    isInLastPosition,\n    open,\n    multiselect: false,\n  });\n\n  // NVDA and JAWS have bugs that suppress reading the input value text when aria-activedescendant is set\n  // To prevent this, we clear the HTML attribute (but save the state) when a user presses left/right arrows\n  // ref: https://github.com/microsoft/fluentui/issues/26359#issuecomment-1397759888\n  const [hideActiveDescendant, setHideActiveDescendant] = React.useState(false);\n\n  /**\n   * Freeform combobox should not select\n   */\n  const onInputTriggerKeyDown: EditorInputProps['onKeyDown'] = useEventCallback(event => {\n    // update typing state to true if the user is typing\n    const action = getDropdownActionFromKey(event, { open, multiselect: false, isInLastPosition });\n    if (\n      event.key === ArrowLeft ||\n      event.key === ArrowRight ||\n      (!isInLastPosition && (event.key === ArrowDown || event.key === ArrowUp)) ||\n      (action === 'Type' && isInLastPosition) ||\n      action === 'Type'\n    ) {\n      activeDescendantController.blur();\n      setHideActiveDescendant(true);\n      setIsInSelectionMode(false);\n      onSelectionModeChange?.(false);\n    } else if (\n      action === 'Next' ||\n      action === 'Previous' ||\n      action === 'First' ||\n      action === 'Last' ||\n      action === 'PageUp' ||\n      action === 'PageDown'\n    ) {\n      setHideActiveDescendant(false);\n      setIsInSelectionMode(true);\n      onSelectionModeChange?.(true);\n    }\n  });\n\n  React.useEffect(() => {\n    if (hideActiveDescendant) {\n      triggerRef.current?.removeAttribute('aria-activedescendant');\n    }\n    // We only want to run this when the hideActiveDescendant changes, if the triggerRef\n    // is undefined, there's no need to remove theAttribute and we shouldn't be adding\n    // refs as dependencies since it can blow up the number of runs.\n    // eslint-disable-next-line react-compiler/react-compiler\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [hideActiveDescendant]);\n\n  const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning({ positioning });\n\n  const listboxMergedRef = useMergedRefs(comboboxPopupRef, activeDescendantListboxRef, listboxProps?.ref);\n  const listbox = React.useMemo(() => {\n    return (\n      <PromptListbox\n        open={open}\n        {...listboxProps}\n        {...optionCollection}\n        {...selectionState}\n        ref={listboxMergedRef}\n        activeDescendantController={activeDescendantController}\n      />\n    );\n  }, [activeDescendantController, listboxMergedRef, listboxProps, open, optionCollection, selectionState]);\n\n  return {\n    promptListbox: listbox,\n    triggerProps: {\n      ref: triggerRef,\n      onBlur,\n      onFocus,\n      onKeyDown: useEventCallback(mergeCallbacks(onKeyDown, onInputTriggerKeyDown)),\n      isInSelectionMode,\n    },\n    containerRef: comboboxTargetRef,\n    cursorPositionPlugin,\n  };\n}\n"],"names":["React","useActiveDescendant","optionClassNames","mergeCallbacks","useControllableState","useEventCallback","useMergedRefs","getDropdownActionFromKey","TextCursorPositionPlugin","useOptionCollection","useSelection","ArrowDown","ArrowLeft","ArrowRight","ArrowUp","useComboboxPositioning","useTriggerKeydown","PromptListbox","usePromptListboxFunctionality","params","positioning","onOpenChange","onSelectionModeChange","listboxProps","listboxRef","activeDescendantListboxRef","activeParentRef","controller","activeDescendantController","matchOption","el","classList","contains","root","triggerRef","selectionState","selectOption","optionCollection","getOptionById","isInLastPosition","setIsInLastPosition","useState","isInSelectionMode","setIsInSelectionMode","open","setOpen","state","defaultState","defaultOpen","initialState","onBlur","event","type","onFocus","target","currentTarget","cursorPositionPlugin","onListboxBlur","useCallback","onKeyDown","multiselect","hideActiveDescendant","setHideActiveDescendant","onInputTriggerKeyDown","action","key","blur","useEffect","current","removeAttribute","comboboxPopupRef","comboboxTargetRef","listboxMergedRef","ref","listbox","useMemo","promptListbox","triggerProps","containerRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib/index.js

@@ -1,4 +1,5 @@
 export { PromptListbox, promptListboxClassNames, renderPromptListbox_unstable, usePromptListboxStyles_unstable, usePromptListbox_unstable } from './PromptListbox';
 export { usePromptListboxFunctionality } from './components/utils/usePromptListboxFunctionality';
 export { TextCursorPositionPlugin } from './plugins/TextCursorPositionPlugin';
+export { PromptOption, promptOptionClassNames, renderPromptOption_unstable, usePromptOptionStyles_unstable, usePromptOption_unstable } from './PromptOption';
 //# sourceMappingURL=index.js.map

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/usePromptListboxFunctionality';\nexport type {\n  OnOpenChangeData,\n  ProcessedPromptListboxProps,\n  UsePromptListboxFunctionality,\n  UsePromptListboxFunctionalityParams,\n} from './components/utils/PromptListboxFunctionality.types';\n\nexport type { TextCursorPositionPluginProps } from './plugins/TextCursorPositionPlugin';\nexport { TextCursorPositionPlugin } from './plugins/TextCursorPositionPlugin';\n"],"names":["PromptListbox","promptListboxClassNames","renderPromptListbox_unstable","usePromptListboxStyles_unstable","usePromptListbox_unstable","usePromptListboxFunctionality","TextCursorPositionPlugin"],"rangeMappings":";;","mappings":"AACA,SACEA,aAAa,EACbC,uBAAuB,EACvBC,4BAA4B,EAC5BC,+BAA+B,EAC/BC,yBAAyB,QACpB,kBAAkB;AAEzB,SAASC,6BAA6B,QAAQ,mDAAmD;AASjG,SAASC,wBAAwB,QAAQ,qCAAqC"}
+{"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/usePromptListboxFunctionality';\nexport type {\n  OnOpenChangeData,\n  ProcessedPromptListboxProps,\n  UsePromptListboxFunctionality,\n  UsePromptListboxFunctionalityParams,\n} from './components/utils/PromptListboxFunctionality.types';\n\nexport type { TextCursorPositionPluginProps } from './plugins/TextCursorPositionPlugin';\nexport { TextCursorPositionPlugin } from './plugins/TextCursorPositionPlugin';\n\nexport type { PromptOptionProps, PromptOptionSlots, PromptOptionState } from './PromptOption';\nexport { PromptOption, promptOptionClassNames, renderPromptOption_unstable, usePromptOptionStyles_unstable, usePromptOption_unstable } from './PromptOption';\n"],"names":["PromptListbox","promptListboxClassNames","renderPromptListbox_unstable","usePromptListboxStyles_unstable","usePromptListbox_unstable","usePromptListboxFunctionality","TextCursorPositionPlugin","PromptOption","promptOptionClassNames","renderPromptOption_unstable","usePromptOptionStyles_unstable","usePromptOption_unstable"],"rangeMappings":";;;","mappings":"AACA,SACEA,aAAa,EACbC,uBAAuB,EACvBC,4BAA4B,EAC5BC,+BAA+B,EAC/BC,yBAAyB,QACpB,kBAAkB;AAEzB,SAASC,6BAA6B,QAAQ,mDAAmD;AASjG,SAASC,wBAAwB,QAAQ,qCAAqC;AAG9E,SAASC,YAAY,EAAEC,sBAAsB,EAAEC,2BAA2B,EAAEC,8BAA8B,EAAEC,wBAAwB,QAAQ,iBAAiB"}

package/lib-commonjs/PromptOption.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/PromptOption/index"), exports);
+ //# sourceMappingURL=PromptOption.js.map

package/lib-commonjs/PromptOption.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PromptOption.ts"],"sourcesContent":["export * from './components/PromptOption/index';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}

package/lib-commonjs/components/PromptOption/PromptOption.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "PromptOption", {
+    enumerable: true,
+    get: function() {
+        return PromptOption;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _usePromptOption = require("./usePromptOption");
+const _renderPromptOption = require("./renderPromptOption");
+const _usePromptOptionStylesstyles = require("./usePromptOptionStyles.styles");
+const PromptOption = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _usePromptOption.usePromptOption_unstable)(props, ref);
+    (0, _usePromptOptionStylesstyles.usePromptOptionStyles_unstable)(state);
+    return (0, _renderPromptOption.renderPromptOption_unstable)(state);
+});
+PromptOption.displayName = 'PromptOption'; //# sourceMappingURL=PromptOption.js.map

package/lib-commonjs/components/PromptOption/PromptOption.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PromptOption.tsx"],"sourcesContent":["import * as React from 'react';\nimport { usePromptOption_unstable } from './usePromptOption';\nimport { renderPromptOption_unstable } from './renderPromptOption';\nimport { usePromptOptionStyles_unstable } from './usePromptOptionStyles.styles';\nimport type { PromptOptionProps } from './PromptOption.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n// PromptOption component - TODO: add more docs\nexport const PromptOption: ForwardRefComponent<PromptOptionProps> = React.forwardRef((props, ref) => {\n  const state = usePromptOption_unstable(props, ref);\n\n  usePromptOptionStyles_unstable(state);\n  return renderPromptOption_unstable(state);\n});\n\nPromptOption.displayName = 'PromptOption';\n"],"names":["PromptOption","React","forwardRef","props","state","usePromptOption_unstable","usePromptOptionStyles_unstable","renderPromptOption_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;iCACkB;oCACG;6CACG;AAKxC,MAAMA,eAAAA,WAAAA,GAAAA,OAAuDC,UAAMC,CAAU,CAACC,OAACA;UACpFC,QAAMA,IAAAA,yCAAQC,EAAAA,OAAyBF;mEAEvCG,EAAAA;WACAC,IAAAA,+CAAOA,EAAAA;AACT;AAEAP,aAAaQ,WAAW,GAAG"}

package/lib-commonjs/components/PromptOption/PromptOption.types.js

@@ -0,0 +1,9 @@
+/**
+ * State used in rendering PromptOption
+ */ "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+ // TODO: Remove semicolon from previous line, uncomment next line, and provide union of props to pick from PromptOptionProps.
+ // & Required<Pick<PromptOptionProps, 'propName'>>
+ //# sourceMappingURL=PromptOption.types.js.map

package/lib-commonjs/components/PromptOption/PromptOption.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["PromptOption.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type PromptOptionSlots = {\n  root: Slot<'div'>;\n};\n\n/**\n * PromptOption Props\n */\nexport type PromptOptionProps = ComponentProps<PromptOptionSlots> & {};\n\n/**\n * State used in rendering PromptOption\n */\nexport type PromptOptionState = ComponentState<PromptOptionSlots>;\n// TODO: Remove semicolon from previous line, uncomment next line, and provide union of props to pick from PromptOptionProps.\n// & Required<Pick<PromptOptionProps, 'propName'>>\n"],"names":[],"rangeMappings":";;;;;;;","mappings":"AAWA;;CAEC;;;;CACD,6HACA;mDACA"}

package/lib-commonjs/components/PromptOption/index.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./PromptOption"), exports);
+_export_star._(require("./PromptOption.types"), exports);
+_export_star._(require("./renderPromptOption"), exports);
+_export_star._(require("./usePromptOption"), exports);
+_export_star._(require("./usePromptOptionStyles.styles"), exports);
+ //# sourceMappingURL=index.js.map

package/lib-commonjs/components/PromptOption/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './PromptOption';\nexport * from './PromptOption.types';\nexport * from './renderPromptOption';\nexport * from './usePromptOption';\nexport * from './usePromptOptionStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}

package/lib-commonjs/components/PromptOption/renderPromptOption.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderPromptOption_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderPromptOption_unstable;
+    }
+});
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactcomponents = require("@fluentui/react-components");
+const renderPromptOption_unstable = (state)=>{
+    (0, _reactcomponents.assertSlots)(state);
+    // TODO Add additional slots in the appropriate place
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {});
+}; //# sourceMappingURL=renderPromptOption.js.map

package/lib-commonjs/components/PromptOption/renderPromptOption.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderPromptOption.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { PromptOptionState, PromptOptionSlots } from './PromptOption.types';\n\n/**\n * Render the final JSX of PromptOption\n */\nexport const renderPromptOption_unstable = (state: PromptOptionState) => {\n  assertSlots<PromptOptionSlots>(state);\n\n  // TODO Add additional slots in the appropriate place\n  return <state.root />;\n};\n"],"names":["assertSlots","state","_jsx","root"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":";;;;+BAUEA;;;eAAAA;;;4BAVwB;iCAGE;AAO1BA,MAAAA,8BAA+BC,CAAAA;oCAE/B,EAAAA;yDACkB;IAClB,OAAA,WAAA,GAAAC,IAAAA,eAAA,EAAAD,MAAAE,IAAA,EAAA,CAAA"}

package/lib-commonjs/components/PromptOption/usePromptOption.js

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "usePromptOption_unstable", {
+    enumerable: true,
+    get: function() {
+        return usePromptOption_unstable;
+    }
+});
+const _reactcomponents = require("@fluentui/react-components");
+const usePromptOption_unstable = (props, ref)=>{
+    return {
+        // TODO add appropriate props/defaults
+        components: {
+            // TODO add each slot's element type or component
+            root: 'div'
+        },
+        // TODO add appropriate slots, for example:
+        // mySlot: slot.optional(props.mySlot),
+        root: _reactcomponents.slot.always((0, _reactcomponents.getIntrinsicElementProps)('div', {
+            ref,
+            ...props
+        }), {
+            elementType: 'div'
+        })
+    };
+}; //# sourceMappingURL=usePromptOption.js.map

package/lib-commonjs/components/PromptOption/usePromptOption.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePromptOption.ts"],"sourcesContent":["import type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-components';\nimport type { PromptOptionProps, PromptOptionState } from './PromptOption.types';\n\n// If you add JSX to this file, be sure to change the file type to .tsx\n\n/**\n * Create the state required to render PromptOption.\n *\n * The returned state can be modified with hooks such as usePromptOptionStyles_unstable,\n * before being passed to renderPromptOption_unstable.\n *\n * @param props - props from this instance of PromptOption\n * @param ref - reference to root HTMLElement of PromptOption\n */\nexport const usePromptOption_unstable = (\n  props: PromptOptionProps,\n  ref: React.Ref<HTMLDivElement>,\n): PromptOptionState => {\n  return {\n    // TODO add appropriate props/defaults\n    components: {\n      // TODO add each slot's element type or component\n      root: 'div',\n    },\n    // TODO add appropriate slots, for example:\n    // mySlot: slot.optional(props.mySlot),\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n"],"names":["usePromptOption_unstable","props","ref","getIntrinsicElementProps"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAmBSA;;;eAAAA;;;iCAlBsC;AAkB7C,MAAOA,2BAAA,CAAAC,OAAAC;WACL;8CACY;oBACV;6DACM;kBACR;;mDAEuC;+CAErCC;mCACED,CAAAA,MAAAA,CAAAA,IAAAA,yCAAAA,EAAAA,OAAAA;;eAEFD,KACA;;yBAAqB;QAEzB;IACA"}

package/lib-commonjs/components/PromptOption/usePromptOptionStyles.styles.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    promptOptionClassNames: function() {
+        return promptOptionClassNames;
+    },
+    usePromptOptionStyles_unstable: function() {
+        return usePromptOptionStyles_unstable;
+    }
+});
+const _reactcomponents = require("@fluentui/react-components");
+const promptOptionClassNames = {
+    root: 'fai-PromptOption'
+};
+/**
+ * Styles for the root slot
+ */ const useStyles = (0, _reactcomponents.__styles)({
+    root: {}
+}, {});
+const usePromptOptionStyles_unstable = (state)=>{
+    'use no memo';
+    const styles = useStyles();
+    state.root.className = (0, _reactcomponents.mergeClasses)(promptOptionClassNames.root, styles.root, state.root.className);
+    // TODO Add class names to slots, for example:
+    // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);
+    return state;
+}; //# sourceMappingURL=usePromptOptionStyles.styles.js.map

package/lib-commonjs/components/PromptOption/usePromptOptionStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["usePromptOptionStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@fluentui/react-components';\nimport type { PromptOptionSlots, PromptOptionState } from './PromptOption.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptOptionClassNames: SlotClassNames<PromptOptionSlots> = {\n  root: 'fai-PromptOption',\n  // TODO: add class names for all slots on PromptOptionSlots.\n  // Should be of the form `<slotName>: 'fai-PromptOption__<slotName>`\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n  root: {\n    // TODO Add default styles for the root element\n  },\n\n  // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the PromptOption slots based on the state\n */\nexport const usePromptOptionStyles_unstable = (state: PromptOptionState): PromptOptionState => {\n  'use no memo';\n\n  const styles = useStyles();\n  state.root.className = mergeClasses(promptOptionClassNames.root, styles.root, state.root.className);\n\n  // TODO Add class names to slots, for example:\n  // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);\n\n  return state;\n};\n"],"names":["promptOptionClassNames","usePromptOptionStyles_unstable","root","__styles","state","styles","useStyles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,sBAAAA;eAAAA;;IAqBXC,8BAAA;eAAAA;;;iCAzB+B;AAI1B,MAAMD,yBAA4D;UACvEE;AAGF;AAEA;;CAEC,SAECA,YAAMC,IAAAA,yBAAA,EAAA;UAEN,CAAA;AAGF,GAAA,CAAA;AAME,MAAAF,iCAAAG,CAAAA;;UAKAC,SAAAC;UACAJ,IAAA,CAAAK,SAAA,GAAAC,IAAAA,6BAAA,EAAAR,uBAAAE,IAAA,EAAAG,OAAAH,IAAA,EAAAE,MAAgFF,IAAA,CAAAK,SAAA;kDAEzEH;IACP,gFAAA"}

package/lib-commonjs/components/utils/PromptListboxFunctionality.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PromptListboxFunctionality.types.ts"],"sourcesContent":["import type React from 'react';\nimport type { PromptListboxProps } from '../../components/PromptListbox';\nimport type { PositioningShorthand } from '@fluentui/react-components';\nimport type { EventData, EventHandler } from '@fluentui/react-utilities';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\n\n// Note: While we are removing multiselect, we are keeping the logic and disabling it\n// in case it's needed in the future.\nexport type ProcessedPromptListboxProps = Partial<\n  Omit<PromptListboxProps, 'activeDescendantController' | 'multiselect'>\n> & {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  ref?: React.MutableRefObject<any>;\n};\n\nexport type UsePromptListboxFunctionality = {\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   * 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 targetRef is the same as the trigger, the ref provided in triggerProps needs\n   * to be merged with this one using `useMergedRefs(targetRef, triggerProps.ref);`\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  targetRef: React.MutableRefObject<any>;\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 type UsePromptListboxFunctionalityParams = {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: EventHandler<OnOpenChangeData>;\n  onSelectionModeChange?: (isInSelectionMode: boolean) => void;\n  positioning?: PositioningShorthand;\n  /**\n   * Props to be passed to the ListboxComponent\n   */\n  listboxProps?: ProcessedPromptListboxProps;\n};\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"],"names":[],"rangeMappings":"","mappings":""}
+{"version":3,"sources":["PromptListboxFunctionality.types.ts"],"sourcesContent":["import type React from 'react';\nimport type { PromptListboxProps } from '../../components/PromptListbox';\nimport type { PositioningShorthand } from '@fluentui/react-components';\nimport type { EventData, EventHandler } from '@fluentui/react-utilities';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\n\n// Note: While we are removing multiselect, we are keeping the logic and disabling it\n// in case it's needed in the future.\nexport type ProcessedPromptListboxProps = Partial<\n  Omit<PromptListboxProps, 'activeDescendantController' | 'multiselect'>\n> & {\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  ref?: React.MutableRefObject<any>;\n};\n\nexport type UsePromptListboxFunctionality = {\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   * 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  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  containerRef: React.MutableRefObject<any>;\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 type UsePromptListboxFunctionalityParams = {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: EventHandler<OnOpenChangeData>;\n  onSelectionModeChange?: (isInSelectionMode: boolean) => void;\n  positioning?: PositioningShorthand;\n  /**\n   * Props to be passed to the ListboxComponent\n   */\n  listboxProps?: ProcessedPromptListboxProps;\n};\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"],"names":[],"rangeMappings":"","mappings":""}

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

@@ -144,7 +144,7 @@ function usePromptListboxFunctionality(params) {
             onKeyDown: (0, _reactutilities.useEventCallback)((0, _reactutilities.mergeCallbacks)(onKeyDown, onInputTriggerKeyDown)),
             isInSelectionMode
         },
-        targetRef: comboboxTargetRef,
+        containerRef: comboboxTargetRef,
         cursorPositionPlugin
     };
 } //# sourceMappingURL=usePromptListboxFunctionality.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["usePromptListboxFunctionality.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { optionClassNames } from '@fluentui/react-components';\nimport { mergeCallbacks, useControllableState, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from './dropdownKeyActions';\nimport { TextCursorPositionPlugin } from '../../plugins/TextCursorPositionPlugin';\nimport { useOptionCollection } from './useOptionCollection';\nimport { useSelection } from './useSelection';\nimport { ArrowDown, ArrowLeft, ArrowRight, ArrowUp } from '@fluentui/keyboard-keys';\nimport { useComboboxPositioning } from './useComboboxPositioning';\nimport { useTriggerKeydown } from './useTriggerKeyDown';\nimport { PromptListbox } from '../PromptListbox';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\nimport type {\n  UsePromptListboxFunctionalityParams,\n  UsePromptListboxFunctionality,\n} from './PromptListboxFunctionality.types';\n\nexport function usePromptListboxFunctionality(\n  params: UsePromptListboxFunctionalityParams,\n): UsePromptListboxFunctionality {\n  const { positioning, onOpenChange, onSelectionModeChange, listboxProps } = params;\n  const {\n    listboxRef: activeDescendantListboxRef,\n    activeParentRef,\n    controller: activeDescendantController,\n  } = useActiveDescendant<HTMLSpanElement, HTMLDivElement>({\n    matchOption: el => el.classList.contains(optionClassNames.root),\n  });\n  // useMergedRefs to normalize the ref into a React.RefObject type\n  const triggerRef = useMergedRefs(activeParentRef);\n  const selectionState = useSelection(listboxProps ?? {});\n  const { selectOption } = selectionState;\n  const optionCollection = useOptionCollection();\n  const { getOptionById } = optionCollection;\n  const [isInLastPosition, setIsInLastPosition] = React.useState(true);\n  const [isInSelectionMode, setIsInSelectionMode] = React.useState(false);\n  const [open, setOpen] = useControllableState({\n    state: params.open,\n    defaultState: params.defaultOpen,\n    initialState: false,\n  });\n\n  const onBlur = (event: React.FocusEvent<HTMLSpanElement>) => {\n    setOpen(false);\n    onOpenChange?.(event, { event, type: 'focus', open: false });\n  };\n\n  const onFocus = (event: React.FocusEvent<HTMLSpanElement>) => {\n    if (event.target === event.currentTarget) {\n      setOpen(true);\n      onOpenChange?.(event, { event, type: 'focus', open: true });\n    }\n  };\n\n  const cursorPositionPlugin = <TextCursorPositionPlugin setIsInLastPosition={setIsInLastPosition} />;\n\n  const onListboxBlur = React.useCallback(() => {\n    setIsInSelectionMode(false);\n    onSelectionModeChange?.(false);\n  }, [onSelectionModeChange]);\n\n  // handle combobox keyboard interaction\n  const onKeyDown = useTriggerKeydown({\n    ...optionCollection,\n    activeDescendantController,\n    getOptionById,\n    onBlur: onListboxBlur,\n    selectOption,\n    isInLastPosition,\n    open,\n    multiselect: false,\n  });\n\n  // NVDA and JAWS have bugs that suppress reading the input value text when aria-activedescendant is set\n  // To prevent this, we clear the HTML attribute (but save the state) when a user presses left/right arrows\n  // ref: https://github.com/microsoft/fluentui/issues/26359#issuecomment-1397759888\n  const [hideActiveDescendant, setHideActiveDescendant] = React.useState(false);\n\n  /**\n   * Freeform combobox should not select\n   */\n  const onInputTriggerKeyDown: EditorInputProps['onKeyDown'] = useEventCallback(event => {\n    // update typing state to true if the user is typing\n    const action = getDropdownActionFromKey(event, { open, multiselect: false, isInLastPosition });\n    if (\n      event.key === ArrowLeft ||\n      event.key === ArrowRight ||\n      (!isInLastPosition && (event.key === ArrowDown || event.key === ArrowUp)) ||\n      (action === 'Type' && isInLastPosition) ||\n      action === 'Type'\n    ) {\n      activeDescendantController.blur();\n      setHideActiveDescendant(true);\n      setIsInSelectionMode(false);\n      onSelectionModeChange?.(false);\n    } else if (\n      action === 'Next' ||\n      action === 'Previous' ||\n      action === 'First' ||\n      action === 'Last' ||\n      action === 'PageUp' ||\n      action === 'PageDown'\n    ) {\n      setHideActiveDescendant(false);\n      setIsInSelectionMode(true);\n      onSelectionModeChange?.(true);\n    }\n  });\n\n  React.useEffect(() => {\n    if (hideActiveDescendant) {\n      triggerRef.current?.removeAttribute('aria-activedescendant');\n    }\n    // We only want to run this when the hideActiveDescendant changes, if the triggerRef\n    // is undefined, there's no need to remove theAttribute and we shouldn't be adding\n    // refs as dependencies since it can blow up the number of runs.\n    // eslint-disable-next-line react-compiler/react-compiler\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [hideActiveDescendant]);\n\n  const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning({ positioning });\n\n  const listboxMergedRef = useMergedRefs(comboboxPopupRef, activeDescendantListboxRef, listboxProps?.ref);\n  const listbox = React.useMemo(() => {\n    return (\n      <PromptListbox\n        open={open}\n        {...listboxProps}\n        {...optionCollection}\n        {...selectionState}\n        ref={listboxMergedRef}\n        activeDescendantController={activeDescendantController}\n      />\n    );\n  }, [activeDescendantController, listboxMergedRef, listboxProps, open, optionCollection, selectionState]);\n\n  return {\n    promptListbox: listbox,\n    triggerProps: {\n      ref: triggerRef,\n      onBlur,\n      onFocus,\n      onKeyDown: useEventCallback(mergeCallbacks(onKeyDown, onInputTriggerKeyDown)),\n      isInSelectionMode,\n    },\n    targetRef: comboboxTargetRef,\n    cursorPositionPlugin,\n  };\n}\n"],"names":["usePromptListboxFunctionality","params","positioning","listboxRef","matchOption","onSelectionModeChange","listboxProps","selectOption","selectionState","activeParentRef","optionCollection","controller","getOptionById","useActiveDescendant","isInLastPosition","isInSelectionMode","setIsInSelectionMode","useState","defaultState","defaultOpen","initialState","useSelection","onBlur","onOpenChange","type","setIsInLastPosition","React","open","onFocus","event","target","setOpen","cursorPositionPlugin","onListboxBlur","currentTarget","onKeyDown","useTriggerKeydown","activeDescendantController","onInputTriggerKeyDown","useEventCallback","action","hideActiveDescendant","key","ArrowRight","ArrowDown","ArrowUp","triggerRef","setHideActiveDescendant","useEffect","comboboxTargetRef","_triggerRef_current","current","removeAttribute","PromptListbox","listboxMergedRef","useMergedRefs","comboboxPopupRef","activeDescendantListboxRef","ref","targetRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["usePromptListboxFunctionality.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useActiveDescendant } from '@fluentui/react-aria';\nimport { optionClassNames } from '@fluentui/react-components';\nimport { mergeCallbacks, useControllableState, useEventCallback, useMergedRefs } from '@fluentui/react-utilities';\nimport { getDropdownActionFromKey } from './dropdownKeyActions';\nimport { TextCursorPositionPlugin } from '../../plugins/TextCursorPositionPlugin';\nimport { useOptionCollection } from './useOptionCollection';\nimport { useSelection } from './useSelection';\nimport { ArrowDown, ArrowLeft, ArrowRight, ArrowUp } from '@fluentui/keyboard-keys';\nimport { useComboboxPositioning } from './useComboboxPositioning';\nimport { useTriggerKeydown } from './useTriggerKeyDown';\nimport { PromptListbox } from '../PromptListbox';\nimport type { EditorInputProps } from '@fluentui-copilot/react-editor-input';\nimport type {\n  UsePromptListboxFunctionalityParams,\n  UsePromptListboxFunctionality,\n} from './PromptListboxFunctionality.types';\n\nexport function usePromptListboxFunctionality(\n  params: UsePromptListboxFunctionalityParams,\n): UsePromptListboxFunctionality {\n  const { positioning, onOpenChange, onSelectionModeChange, listboxProps } = params;\n  const {\n    listboxRef: activeDescendantListboxRef,\n    activeParentRef,\n    controller: activeDescendantController,\n  } = useActiveDescendant<HTMLSpanElement, HTMLDivElement>({\n    matchOption: el => el.classList.contains(optionClassNames.root),\n  });\n  // useMergedRefs to normalize the ref into a React.RefObject type\n  const triggerRef = useMergedRefs(activeParentRef);\n  const selectionState = useSelection(listboxProps ?? {});\n  const { selectOption } = selectionState;\n  const optionCollection = useOptionCollection();\n  const { getOptionById } = optionCollection;\n  const [isInLastPosition, setIsInLastPosition] = React.useState(true);\n  const [isInSelectionMode, setIsInSelectionMode] = React.useState(false);\n  const [open, setOpen] = useControllableState({\n    state: params.open,\n    defaultState: params.defaultOpen,\n    initialState: false,\n  });\n\n  const onBlur = (event: React.FocusEvent<HTMLSpanElement>) => {\n    setOpen(false);\n    onOpenChange?.(event, { event, type: 'focus', open: false });\n  };\n\n  const onFocus = (event: React.FocusEvent<HTMLSpanElement>) => {\n    if (event.target === event.currentTarget) {\n      setOpen(true);\n      onOpenChange?.(event, { event, type: 'focus', open: true });\n    }\n  };\n\n  const cursorPositionPlugin = <TextCursorPositionPlugin setIsInLastPosition={setIsInLastPosition} />;\n\n  const onListboxBlur = React.useCallback(() => {\n    setIsInSelectionMode(false);\n    onSelectionModeChange?.(false);\n  }, [onSelectionModeChange]);\n\n  // handle combobox keyboard interaction\n  const onKeyDown = useTriggerKeydown({\n    ...optionCollection,\n    activeDescendantController,\n    getOptionById,\n    onBlur: onListboxBlur,\n    selectOption,\n    isInLastPosition,\n    open,\n    multiselect: false,\n  });\n\n  // NVDA and JAWS have bugs that suppress reading the input value text when aria-activedescendant is set\n  // To prevent this, we clear the HTML attribute (but save the state) when a user presses left/right arrows\n  // ref: https://github.com/microsoft/fluentui/issues/26359#issuecomment-1397759888\n  const [hideActiveDescendant, setHideActiveDescendant] = React.useState(false);\n\n  /**\n   * Freeform combobox should not select\n   */\n  const onInputTriggerKeyDown: EditorInputProps['onKeyDown'] = useEventCallback(event => {\n    // update typing state to true if the user is typing\n    const action = getDropdownActionFromKey(event, { open, multiselect: false, isInLastPosition });\n    if (\n      event.key === ArrowLeft ||\n      event.key === ArrowRight ||\n      (!isInLastPosition && (event.key === ArrowDown || event.key === ArrowUp)) ||\n      (action === 'Type' && isInLastPosition) ||\n      action === 'Type'\n    ) {\n      activeDescendantController.blur();\n      setHideActiveDescendant(true);\n      setIsInSelectionMode(false);\n      onSelectionModeChange?.(false);\n    } else if (\n      action === 'Next' ||\n      action === 'Previous' ||\n      action === 'First' ||\n      action === 'Last' ||\n      action === 'PageUp' ||\n      action === 'PageDown'\n    ) {\n      setHideActiveDescendant(false);\n      setIsInSelectionMode(true);\n      onSelectionModeChange?.(true);\n    }\n  });\n\n  React.useEffect(() => {\n    if (hideActiveDescendant) {\n      triggerRef.current?.removeAttribute('aria-activedescendant');\n    }\n    // We only want to run this when the hideActiveDescendant changes, if the triggerRef\n    // is undefined, there's no need to remove theAttribute and we shouldn't be adding\n    // refs as dependencies since it can blow up the number of runs.\n    // eslint-disable-next-line react-compiler/react-compiler\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [hideActiveDescendant]);\n\n  const [comboboxPopupRef, comboboxTargetRef] = useComboboxPositioning({ positioning });\n\n  const listboxMergedRef = useMergedRefs(comboboxPopupRef, activeDescendantListboxRef, listboxProps?.ref);\n  const listbox = React.useMemo(() => {\n    return (\n      <PromptListbox\n        open={open}\n        {...listboxProps}\n        {...optionCollection}\n        {...selectionState}\n        ref={listboxMergedRef}\n        activeDescendantController={activeDescendantController}\n      />\n    );\n  }, [activeDescendantController, listboxMergedRef, listboxProps, open, optionCollection, selectionState]);\n\n  return {\n    promptListbox: listbox,\n    triggerProps: {\n      ref: triggerRef,\n      onBlur,\n      onFocus,\n      onKeyDown: useEventCallback(mergeCallbacks(onKeyDown, onInputTriggerKeyDown)),\n      isInSelectionMode,\n    },\n    containerRef: comboboxTargetRef,\n    cursorPositionPlugin,\n  };\n}\n"],"names":["usePromptListboxFunctionality","params","positioning","listboxRef","matchOption","onSelectionModeChange","listboxProps","selectOption","selectionState","activeParentRef","optionCollection","controller","getOptionById","useActiveDescendant","isInLastPosition","isInSelectionMode","setIsInSelectionMode","useState","defaultState","defaultOpen","initialState","useSelection","onBlur","onOpenChange","type","setIsInLastPosition","React","open","onFocus","event","target","setOpen","cursorPositionPlugin","onListboxBlur","currentTarget","onKeyDown","useTriggerKeydown","activeDescendantController","onInputTriggerKeyDown","useEventCallback","action","hideActiveDescendant","key","ArrowRight","ArrowDown","ArrowUp","triggerRef","setHideActiveDescendant","useEffect","comboboxTargetRef","_triggerRef_current","current","removeAttribute","PromptListbox","listboxMergedRef","useMergedRefs","comboboxPopupRef","activeDescendantListboxRef","ref","containerRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/index.js

@@ -12,15 +12,24 @@ _export(exports, {
     PromptListbox: function() {
         return _PromptListbox.PromptListbox;
     },
+    PromptOption: function() {
+        return _PromptOption.PromptOption;
+    },
     TextCursorPositionPlugin: function() {
         return _TextCursorPositionPlugin.TextCursorPositionPlugin;
     },
     promptListboxClassNames: function() {
         return _PromptListbox.promptListboxClassNames;
     },
+    promptOptionClassNames: function() {
+        return _PromptOption.promptOptionClassNames;
+    },
     renderPromptListbox_unstable: function() {
         return _PromptListbox.renderPromptListbox_unstable;
     },
+    renderPromptOption_unstable: function() {
+        return _PromptOption.renderPromptOption_unstable;
+    },
     usePromptListboxFunctionality: function() {
         return _usePromptListboxFunctionality.usePromptListboxFunctionality;
     },
@@ -29,9 +38,16 @@ _export(exports, {
     },
     usePromptListbox_unstable: function() {
         return _PromptListbox.usePromptListbox_unstable;
+    },
+    usePromptOptionStyles_unstable: function() {
+        return _PromptOption.usePromptOptionStyles_unstable;
+    },
+    usePromptOption_unstable: function() {
+        return _PromptOption.usePromptOption_unstable;
     }
 });
 const _PromptListbox = require("./PromptListbox");
 const _usePromptListboxFunctionality = require("./components/utils/usePromptListboxFunctionality");
 const _TextCursorPositionPlugin = require("./plugins/TextCursorPositionPlugin");
+const _PromptOption = require("./PromptOption");
  //# sourceMappingURL=index.js.map

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/usePromptListboxFunctionality';\nexport type {\n  OnOpenChangeData,\n  ProcessedPromptListboxProps,\n  UsePromptListboxFunctionality,\n  UsePromptListboxFunctionalityParams,\n} from './components/utils/PromptListboxFunctionality.types';\n\nexport type { TextCursorPositionPluginProps } from './plugins/TextCursorPositionPlugin';\nexport { TextCursorPositionPlugin } from './plugins/TextCursorPositionPlugin';\n"],"names":["PromptListbox","TextCursorPositionPlugin","promptListboxClassNames","renderPromptListbox_unstable","usePromptListboxFunctionality","usePromptListboxStyles_unstable","usePromptListbox_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEEA,aAAa;eAAbA,4BAAa;;IAgBNC,wBAAwB;eAAxBA,kDAAwB;;IAf/BC,uBAAuB;eAAvBA,sCAAuB;;IACvBC,4BAA4B;eAA5BA,2CAA4B;;IAKrBC,6BAA6B;eAA7BA,4DAA6B;;IAJpCC,+BAA+B;eAA/BA,8CAA+B;;IAC/BC,yBAAyB;eAAzBA,wCAAyB;;;+BACpB;+CAEuC;0CASL"}
+{"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/usePromptListboxFunctionality';\nexport type {\n  OnOpenChangeData,\n  ProcessedPromptListboxProps,\n  UsePromptListboxFunctionality,\n  UsePromptListboxFunctionalityParams,\n} from './components/utils/PromptListboxFunctionality.types';\n\nexport type { TextCursorPositionPluginProps } from './plugins/TextCursorPositionPlugin';\nexport { TextCursorPositionPlugin } from './plugins/TextCursorPositionPlugin';\n\nexport type { PromptOptionProps, PromptOptionSlots, PromptOptionState } from './PromptOption';\nexport { PromptOption, promptOptionClassNames, renderPromptOption_unstable, usePromptOptionStyles_unstable, usePromptOption_unstable } from './PromptOption';\n"],"names":["PromptListbox","PromptOption","TextCursorPositionPlugin","promptListboxClassNames","promptOptionClassNames","renderPromptListbox_unstable","renderPromptOption_unstable","usePromptListboxFunctionality","usePromptListboxStyles_unstable","usePromptListbox_unstable","usePromptOptionStyles_unstable","usePromptOption_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAEEA,aAAa;eAAbA,4BAAa;;IAmBNC,YAAY;eAAZA,0BAAY;;IAHZC,wBAAwB;eAAxBA,kDAAwB;;IAf/BC,uBAAuB;eAAvBA,sCAAuB;;IAkBFC,sBAAsB;eAAtBA,oCAAsB;;IAjB3CC,4BAA4B;eAA5BA,2CAA4B;;IAiBiBC,2BAA2B;eAA3BA,yCAA2B;;IAZjEC,6BAA6B;eAA7BA,4DAA6B;;IAJpCC,+BAA+B;eAA/BA,8CAA+B;;IAC/BC,yBAAyB;eAAzBA,wCAAyB;;IAeiDC,8BAA8B;eAA9BA,4CAA8B;;IAAEC,wBAAwB;eAAxBA,sCAAwB;;;+BAd7H;+CAEuC;0CASL;8BAGmG"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui-copilot/react-prompt-listbox",
-  "version": "0.0.0-nightly-20240719-0406-ee8d99d6.1",
+  "version": "0.0.0-nightly-20240722-0406-476bfcb7.1",
   "description": "PromptListbox for input components using EditorInput.",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -12,12 +12,12 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@fluentui-copilot/chat-input-plugins": "0.0.0-nightly-20240719-0406-ee8d99d6.1",
-    "@fluentui-copilot/react-chat-input-plugins": "0.0.0-nightly-20240719-0406-ee8d99d6.1",
-    "@fluentui-copilot/react-editor-input": "0.0.0-nightly-20240719-0406-ee8d99d6.1",
-    "@fluentui-copilot/react-provider": "0.0.0-nightly-20240719-0406-ee8d99d6.1",
-    "@fluentui-copilot/react-text-editor": "0.0.0-nightly-20240719-0406-ee8d99d6.1",
-    "@fluentui-copilot/text-editor": "0.0.0-nightly-20240719-0406-ee8d99d6.1",
+    "@fluentui-copilot/chat-input-plugins": "0.0.0-nightly-20240722-0406-476bfcb7.1",
+    "@fluentui-copilot/react-chat-input-plugins": "0.0.0-nightly-20240722-0406-476bfcb7.1",
+    "@fluentui-copilot/react-editor-input": "0.0.0-nightly-20240722-0406-476bfcb7.1",
+    "@fluentui-copilot/react-provider": "0.0.0-nightly-20240722-0406-476bfcb7.1",
+    "@fluentui-copilot/react-text-editor": "0.0.0-nightly-20240722-0406-476bfcb7.1",
+    "@fluentui-copilot/text-editor": "0.0.0-nightly-20240722-0406-476bfcb7.1",
     "@swc/helpers": "^0.5.1"
   },
   "peerDependencies": {