@fluentui-copilot/react-editor-input 0.2.2 → 0.3.0

package/CHANGELOG.json

@@ -1,6 +1,21 @@
 {
   "name": "@fluentui-copilot/react-editor-input",
   "entries": [
+    {
+      "date": "Wed, 25 Sep 2024 19:49:21 GMT",
+      "tag": "@fluentui-copilot/react-editor-input_v0.3.0",
+      "version": "0.3.0",
+      "comments": {
+        "minor": [
+          {
+            "author": "estebanmu@microsoft.com",
+            "package": "@fluentui-copilot/react-editor-input",
+            "commit": "cf2200a2e3e936a797f057fd58ef492f97c07a8e",
+            "comment": "Revert \"feat(react-editor-input): Update Lexical versions and refactor Lexical initialization  (#2052)\""
+          }
+        ]
+      }
+    },
     {
       "date": "Wed, 04 Sep 2024 18:11:50 GMT",
       "tag": "@fluentui-copilot/react-editor-input_v0.2.0",

package/CHANGELOG.md

@@ -1,9 +1,18 @@
 # Change Log - @fluentui-copilot/react-editor-input
 
-This log was last generated on Wed, 04 Sep 2024 18:11:50 GMT and should not be manually modified.
+This log was last generated on Wed, 25 Sep 2024 19:49:21 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [0.3.0](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-editor-input_v0.3.0)
+
+Wed, 25 Sep 2024 19:49:21 GMT 
+[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-editor-input_v0.2.0..@fluentui-copilot/react-editor-input_v0.3.0)
+
+### Minor changes
+
+- Revert "feat(react-editor-input): Update Lexical versions and refactor Lexical initialization  (#2052)" ([PR #2202](https://github.com/microsoft/fluentai/pull/2202) by estebanmu@microsoft.com)
+
 ## [0.2.0](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-editor-input_v0.2.0)
 
 Wed, 04 Sep 2024 18:11:50 GMT 

package/dist/index.d.ts

@@ -4,7 +4,6 @@ import type { ComponentProps } from '@fluentui/react-components';
 import type { ComponentState } from '@fluentui/react-components';
 import type { ForwardRefComponent } from '@fluentui/react-components';
 import type { InitialConfigType } from '@fluentui-copilot/react-text-editor';
-import type { LexicalComposerContextWithEditor } from '@fluentui-copilot/react-text-editor';
 import type { LexicalEditor } from '@fluentui-copilot/react-text-editor';
 import type { LexicalPlainTextPlugin } from '@fluentui-copilot/react-text-editor';
 import * as React_2 from 'react';
@@ -15,10 +14,6 @@ export declare const EditorInput: ForwardRefComponent<EditorInputProps>;
 
 export declare const editorInputClassNames: SlotClassNames<EditorInputSlots>;
 
-export declare type EditorInputContextValues = {
-    lexicalComposer: LexicalComposerContextWithEditor;
-};
-
 /**
  * EditorInput Props
  */
@@ -69,10 +64,10 @@ export declare type EditorInputSlots = {
 /**
  * State used in rendering EditorInput
  */
-export declare type EditorInputState = ComponentState<EditorInputSlots> & Required<Pick<EditorInputProps, 'disabled' | 'textPlugin' | 'history' | 'trimWhiteSpace'>> & Partial<Pick<EditorInputProps, 'onPaste' | 'editorRef'>> & {
+export declare type EditorInputState = ComponentState<EditorInputSlots> & Required<Pick<EditorInputProps, 'disabled' | 'textPlugin' | 'history' | 'trimWhiteSpace' | 'editorRef'>> & Partial<Pick<EditorInputProps, 'onPaste'>> & {
     lexicalInitialConfig: InitialConfigType;
+    defaultValue?: string;
     handleOnChange: (value: string) => void;
-    lexicalEditor: LexicalEditor;
 };
 
 /**
@@ -85,7 +80,7 @@ export declare type EditorInputValueData = {
 /**
  * Render the final JSX of EditorInput
  */
-export declare const renderEditorInput_unstable: (state: EditorInputState, contextValues: EditorInputContextValues) => JSX.Element;
+export declare const renderEditorInput_unstable: (state: EditorInputState) => JSX.Element;
 
 /**
  * Create the state required to render EditorInput.
@@ -98,8 +93,6 @@ export declare const renderEditorInput_unstable: (state: EditorInputState, conte
  */
 export declare const useEditorInput_unstable: (props: EditorInputProps, ref: React_2.Ref<HTMLSpanElement>) => EditorInputState;
 
-export declare function useEditorInputContextValues(state: EditorInputState): EditorInputContextValues;
-
 /**
  * Apply styling to the EditorInput slots based on the state
  */

package/lib/components/EditorInput/EditorInput.js

@@ -2,12 +2,11 @@ import * as React from 'react';
 import { useEditorInput_unstable } from './useEditorInput';
 import { renderEditorInput_unstable } from './renderEditorInput';
 import { useEditorInputStyles_unstable } from './useEditorInputStyles.styles';
-import { useEditorInputContextValues } from './useEditorInputContextValues';
+// EditorInput component - TODO: add more docs
 export const EditorInput = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useEditorInput_unstable(props, ref);
-  const contextValues = useEditorInputContextValues(state);
   useEditorInputStyles_unstable(state);
-  return renderEditorInput_unstable(state, contextValues);
+  return renderEditorInput_unstable(state);
 });
 EditorInput.displayName = 'EditorInput';
 //# sourceMappingURL=EditorInput.js.map

package/lib/components/EditorInput/EditorInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["EditorInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useEditorInput_unstable } from './useEditorInput';\nimport { renderEditorInput_unstable } from './renderEditorInput';\nimport { useEditorInputStyles_unstable } from './useEditorInputStyles.styles';\nimport type { EditorInputProps } from './EditorInput.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useEditorInputContextValues } from './useEditorInputContextValues';\n\nexport const EditorInput: ForwardRefComponent<EditorInputProps> = React.forwardRef((props, ref) => {\n  const state = useEditorInput_unstable(props, ref);\n  const contextValues = useEditorInputContextValues(state);\n\n  useEditorInputStyles_unstable(state);\n\n  return renderEditorInput_unstable(state, contextValues);\n});\n\nEditorInput.displayName = 'EditorInput';\n"],"names":["React","useEditorInput_unstable","renderEditorInput_unstable","useEditorInputStyles_unstable","useEditorInputContextValues","EditorInput","forwardRef","props","ref","state","contextValues","displayName"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,gCAAgC;AAG9E,SAASC,2BAA2B,QAAQ,gCAAgC;AAE5E,OAAO,MAAMC,4BAAqDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAC7C,MAAME,gBAAgBN,4BAA4BK;IAElDN,8BAA8BM;IAE9B,OAAOP,2BAA2BO,OAAOC;AAC3C,GAAG;AAEHL,YAAYM,WAAW,GAAG"}
+{"version":3,"sources":["EditorInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useEditorInput_unstable } from './useEditorInput';\nimport { renderEditorInput_unstable } from './renderEditorInput';\nimport { useEditorInputStyles_unstable } from './useEditorInputStyles.styles';\nimport type { EditorInputProps } from './EditorInput.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n// EditorInput component - TODO: add more docs\nexport const EditorInput: ForwardRefComponent<EditorInputProps> = React.forwardRef((props, ref) => {\n  const state = useEditorInput_unstable(props, ref);\n\n  useEditorInputStyles_unstable(state);\n  return renderEditorInput_unstable(state);\n});\n\nEditorInput.displayName = 'EditorInput';\n"],"names":["React","useEditorInput_unstable","renderEditorInput_unstable","useEditorInputStyles_unstable","EditorInput","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,gCAAgC;AAI9E,8CAA8C;AAC9C,OAAO,MAAMC,4BAAqDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQP,wBAAwBK,OAAOC;IAE7CJ,8BAA8BK;IAC9B,OAAON,2BAA2BM;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}

package/lib/components/EditorInput/EditorInput.types.js

@@ -1,2 +1,4 @@
-export {};
+/**
+ * Data passed to the `onChange` callback when the chat input's value changes.
+ */export {};
 //# sourceMappingURL=EditorInput.types.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["EditorInput.types.ts"],"sourcesContent":["import type {\n  InitialConfigType,\n  LexicalComposerContextWithEditor,\n  LexicalEditor,\n  LexicalPlainTextPlugin,\n} from '@fluentui-copilot/react-text-editor';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type EditorInputSlots = {\n  root: NonNullable<Slot<'span'>>;\n  input: NonNullable<Slot<'span'>>;\n  placeholderValue?: Slot<'span'>;\n};\n\n/**\n * EditorInput Props\n */\nexport type EditorInputProps = Omit<\n  ComponentProps<Partial<EditorInputSlots>, 'input'>,\n  'onChange' | 'onPaste' | 'defaultValue' | 'onSubmit'\n> & {\n  disabled?: boolean;\n  /**\n   * If defaultValue is a string, it will be added to the input on first render.\n   * If defaultValue is a function, it can call lexical $ functions to imperatively set the initial content with more complex nodes.\n   */\n  defaultValue?: string | (() => void);\n  /**\n   * Callback for when the user changes the value.\n   * TODO: Add proper event type for callback\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  onChange?: (ev: any, data: EditorInputValueData) => void;\n  /**\n   * Callback for when content is pasted into the Editor.\n   */\n  onPaste?: (ev: ClipboardEvent) => void;\n  /**\n   * When true, the input will be cleared when only whitespace is remaining.\n   * @default false\n   */\n  trimWhiteSpace?: boolean;\n  /**\n   * Used to register any custom nodes used by plugins added. Can also be used to override the default nodes.\n   */\n  customNodes?: InitialConfigType['nodes'];\n  /**\n   * The plugin which is in charge of initializing Lexical and is given the `input` and `placeholder` slots\n   * @default LexicalPlainTextPlugin\n   */\n  textPlugin?: typeof LexicalPlainTextPlugin;\n  /**\n   * Controls whether history is tracked to provide undo and redo functionality\n   * @default true\n   */\n  history?: boolean;\n\n  editorRef?: React.RefObject<LexicalEditor>;\n};\n\n/**\n * State used in rendering EditorInput\n */\nexport type EditorInputState = ComponentState<EditorInputSlots> &\n  Required<Pick<EditorInputProps, 'disabled' | 'textPlugin' | 'history' | 'trimWhiteSpace'>> &\n  Partial<Pick<EditorInputProps, 'onPaste' | 'editorRef'>> & {\n    lexicalInitialConfig: InitialConfigType;\n    handleOnChange: (value: string) => void;\n    lexicalEditor: LexicalEditor;\n  };\n\n/**\n * Data passed to the `onChange` callback when the chat input's value changes.\n */\nexport type EditorInputValueData = {\n  value: string;\n};\n\nexport type EditorInputContextValues = {\n  lexicalComposer: LexicalComposerContextWithEditor;\n};\n"],"names":[],"rangeMappings":"","mappings":"AA8EA,WAEE"}
+{"version":3,"sources":["EditorInput.types.ts"],"sourcesContent":["import type { InitialConfigType, LexicalEditor, LexicalPlainTextPlugin } from '@fluentui-copilot/react-text-editor';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type EditorInputSlots = {\n  root: NonNullable<Slot<'span'>>;\n  input: NonNullable<Slot<'span'>>;\n  placeholderValue?: Slot<'span'>;\n};\n\n/**\n * EditorInput Props\n */\nexport type EditorInputProps = Omit<\n  ComponentProps<Partial<EditorInputSlots>, 'input'>,\n  'onChange' | 'onPaste' | 'defaultValue' | 'onSubmit'\n> & {\n  disabled?: boolean;\n  /**\n   * If defaultValue is a string, it will be added to the input on first render.\n   * If defaultValue is a function, it can call lexical $ functions to imperatively set the initial content with more complex nodes.\n   */\n  defaultValue?: string | (() => void);\n  /**\n   * Callback for when the user changes the value.\n   * TODO: Add proper event type for callback\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  onChange?: (ev: any, data: EditorInputValueData) => void;\n  /**\n   * Callback for when content is pasted into the Editor.\n   */\n  onPaste?: (ev: ClipboardEvent) => void;\n  /**\n   * When true, the input will be cleared when only whitespace is remaining.\n   * @default false\n   */\n  trimWhiteSpace?: boolean;\n  /**\n   * Used to register any custom nodes used by plugins added. Can also be used to override the default nodes.\n   */\n  customNodes?: InitialConfigType['nodes'];\n  /**\n   * The plugin which is in charge of initializing Lexical and is given the `input` and `placeholder` slots\n   * @default LexicalPlainTextPlugin\n   */\n  textPlugin?: typeof LexicalPlainTextPlugin;\n  /**\n   * Controls whether history is tracked to provide undo and redo functionality\n   * @default true\n   */\n  history?: boolean;\n\n  editorRef?: React.RefObject<LexicalEditor>;\n};\n\n/**\n * State used in rendering EditorInput\n */\nexport type EditorInputState = ComponentState<EditorInputSlots> &\n  Required<Pick<EditorInputProps, 'disabled' | 'textPlugin' | 'history' | 'trimWhiteSpace' | 'editorRef'>> &\n  Partial<Pick<EditorInputProps, 'onPaste'>> & {\n    lexicalInitialConfig: InitialConfigType;\n    defaultValue?: string;\n    handleOnChange: (value: string) => void;\n  };\n\n/**\n * Data passed to the `onChange` callback when the chat input's value changes.\n */\nexport type EditorInputValueData = {\n  value: string;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAkEA;;CAEC,GACD,WAEE"}

package/lib/components/EditorInput/index.js

@@ -3,5 +3,4 @@ export * from './EditorInput.types';
 export * from './renderEditorInput';
 export * from './useEditorInput';
 export * from './useEditorInputStyles.styles';
-export * from './useEditorInputContextValues';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './EditorInput';\nexport * from './EditorInput.types';\nexport * from './renderEditorInput';\nexport * from './useEditorInput';\nexport * from './useEditorInputStyles.styles';\nexport * from './useEditorInputContextValues';\n"],"names":[],"rangeMappings":";;;;;","mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,sBAAsB;AACpC,cAAc,sBAAsB;AACpC,cAAc,mBAAmB;AACjC,cAAc,gCAAgC;AAC9C,cAAc,gCAAgC"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './EditorInput';\nexport * from './EditorInput.types';\nexport * from './renderEditorInput';\nexport * from './useEditorInput';\nexport * from './useEditorInputStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,sBAAsB;AACpC,cAAc,sBAAsB;AACpC,cAAc,mBAAmB;AACjC,cAAc,gCAAgC"}

package/lib/components/EditorInput/renderEditorInput.js

@@ -1,26 +1,28 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-components';
-import { LexicalErrorBoundary, LexicalEditorRefPlugin, LexicalHistoryPlugin, LexicalComposerContext } from '@fluentui-copilot/react-text-editor';
+import { LexicalComposer, LexicalErrorBoundary, LexicalEditorRefPlugin, LexicalHistoryPlugin } from '@fluentui-copilot/react-text-editor';
 import { BasicFunctionalityPlugin } from '@fluentui-copilot/react-chat-input-plugins';
 /**
  * Render the final JSX of EditorInput
  */
-export const renderEditorInput_unstable = (state, contextValues) => {
+export const renderEditorInput_unstable = state => {
   assertSlots(state);
   return /*#__PURE__*/_jsx(state.root, {
-    children: /*#__PURE__*/_jsxs(LexicalComposerContext.Provider, {
-      value: contextValues.lexicalComposer,
+    children: /*#__PURE__*/_jsxs(LexicalComposer, {
+      initialConfig: state.lexicalInitialConfig,
       children: [/*#__PURE__*/_jsx(state.textPlugin, {
         contentEditable: /*#__PURE__*/_jsx(state.input, {}),
-        ErrorBoundary: LexicalErrorBoundary
+        ErrorBoundary: LexicalErrorBoundary,
+        placeholder: state.placeholderValue ? /*#__PURE__*/_jsx(state.placeholderValue, {}) : null
       }), /*#__PURE__*/_jsxs(_Fragment, {
-        children: [state.placeholderValue ? /*#__PURE__*/_jsx(state.placeholderValue, {}) : null, /*#__PURE__*/_jsx(BasicFunctionalityPlugin, {
+        children: [/*#__PURE__*/_jsx(BasicFunctionalityPlugin, {
           onContentChange: state.handleOnChange,
           onPaste: state.onPaste,
-          trimWhitespace: state.trimWhiteSpace
-        }), state.history && /*#__PURE__*/_jsx(LexicalHistoryPlugin, {}), state.editorRef && /*#__PURE__*/_jsx(LexicalEditorRefPlugin, {
-          editorRef: state.editorRef
-        })]
+          trimWhitespace: state.trimWhiteSpace,
+          defaultValue: state.defaultValue
+        }), state.history && /*#__PURE__*/_jsx(LexicalHistoryPlugin, {})]
+      }), /*#__PURE__*/_jsx(LexicalEditorRefPlugin, {
+        editorRef: state.editorRef
       })]
     })
   });

package/lib/components/EditorInput/renderEditorInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderEditorInput.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { EditorInputState, EditorInputSlots, EditorInputContextValues } from './EditorInput.types';\nimport {\n  LexicalErrorBoundary,\n  LexicalEditorRefPlugin,\n  LexicalHistoryPlugin,\n  LexicalComposerContext,\n} from '@fluentui-copilot/react-text-editor';\nimport { BasicFunctionalityPlugin } from '@fluentui-copilot/react-chat-input-plugins';\n\n/**\n * Render the final JSX of EditorInput\n */\nexport const renderEditorInput_unstable = (state: EditorInputState, contextValues: EditorInputContextValues) => {\n  assertSlots<EditorInputSlots>(state);\n\n  return (\n    <state.root>\n      <LexicalComposerContext.Provider value={contextValues.lexicalComposer}>\n        <state.textPlugin contentEditable={<state.input />} ErrorBoundary={LexicalErrorBoundary} />\n        <>\n          {state.placeholderValue ? <state.placeholderValue /> : null}\n          <BasicFunctionalityPlugin\n            onContentChange={state.handleOnChange}\n            onPaste={state.onPaste}\n            trimWhitespace={state.trimWhiteSpace}\n          />\n          {state.history && <LexicalHistoryPlugin />}\n          {state.editorRef && <LexicalEditorRefPlugin editorRef={state.editorRef} />}\n        </>\n      </LexicalComposerContext.Provider>\n    </state.root>\n  );\n};\n"],"names":["assertSlots","LexicalErrorBoundary","LexicalEditorRefPlugin","LexicalHistoryPlugin","LexicalComposerContext","BasicFunctionalityPlugin","renderEditorInput_unstable","state","contextValues","root","Provider","value","lexicalComposer","textPlugin","contentEditable","input","ErrorBoundary","placeholderValue","onContentChange","handleOnChange","onPaste","trimWhitespace","trimWhiteSpace","history","editorRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAEzD,SACEC,oBAAoB,EACpBC,sBAAsB,EACtBC,oBAAoB,EACpBC,sBAAsB,QACjB,sCAAsC;AAC7C,SAASC,wBAAwB,QAAQ,6CAA6C;AAEtF;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC,OAAyBC;IAClER,YAA8BO;IAE9B,qBACE,KAACA,MAAME,IAAI;kBACT,cAAA,MAACL,uBAAuBM,QAAQ;YAACC,OAAOH,cAAcI,eAAe;;8BACnE,KAACL,MAAMM,UAAU;oBAACC,+BAAiB,KAACP,MAAMQ,KAAK;oBAAKC,eAAef;;8BACnE;;wBACGM,MAAMU,gBAAgB,iBAAG,KAACV,MAAMU,gBAAgB,QAAM;sCACvD,KAACZ;4BACCa,iBAAiBX,MAAMY,cAAc;4BACrCC,SAASb,MAAMa,OAAO;4BACtBC,gBAAgBd,MAAMe,cAAc;;wBAErCf,MAAMgB,OAAO,kBAAI,KAACpB;wBAClBI,MAAMiB,SAAS,kBAAI,KAACtB;4BAAuBsB,WAAWjB,MAAMiB,SAAS;;;;;;;AAKhF,EAAE"}
+{"version":3,"sources":["renderEditorInput.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { EditorInputState, EditorInputSlots } from './EditorInput.types';\nimport {\n  LexicalComposer,\n  LexicalErrorBoundary,\n  LexicalEditorRefPlugin,\n  LexicalHistoryPlugin,\n} from '@fluentui-copilot/react-text-editor';\nimport { BasicFunctionalityPlugin } from '@fluentui-copilot/react-chat-input-plugins';\n\n/**\n * Render the final JSX of EditorInput\n */\nexport const renderEditorInput_unstable = (state: EditorInputState) => {\n  assertSlots<EditorInputSlots>(state);\n\n  return (\n    <state.root>\n      <LexicalComposer initialConfig={state.lexicalInitialConfig}>\n        <state.textPlugin\n          contentEditable={<state.input />}\n          ErrorBoundary={LexicalErrorBoundary}\n          placeholder={state.placeholderValue ? <state.placeholderValue /> : null}\n        />\n        <>\n          <BasicFunctionalityPlugin\n            onContentChange={state.handleOnChange}\n            onPaste={state.onPaste}\n            trimWhitespace={state.trimWhiteSpace}\n            defaultValue={state.defaultValue}\n          />\n          {state.history && <LexicalHistoryPlugin />}\n        </>\n        <LexicalEditorRefPlugin editorRef={state.editorRef} />\n      </LexicalComposer>\n    </state.root>\n  );\n};\n"],"names":["assertSlots","LexicalComposer","LexicalErrorBoundary","LexicalEditorRefPlugin","LexicalHistoryPlugin","BasicFunctionalityPlugin","renderEditorInput_unstable","state","root","initialConfig","lexicalInitialConfig","textPlugin","contentEditable","input","ErrorBoundary","placeholder","placeholderValue","onContentChange","handleOnChange","onPaste","trimWhitespace","trimWhiteSpace","defaultValue","history","editorRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAEzD,SACEC,eAAe,EACfC,oBAAoB,EACpBC,sBAAsB,EACtBC,oBAAoB,QACf,sCAAsC;AAC7C,SAASC,wBAAwB,QAAQ,6CAA6C;AAEtF;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzCP,YAA8BO;IAE9B,qBACE,KAACA,MAAMC,IAAI;kBACT,cAAA,MAACP;YAAgBQ,eAAeF,MAAMG,oBAAoB;;8BACxD,KAACH,MAAMI,UAAU;oBACfC,+BAAiB,KAACL,MAAMM,KAAK;oBAC7BC,eAAeZ;oBACfa,aAAaR,MAAMS,gBAAgB,iBAAG,KAACT,MAAMS,gBAAgB,QAAM;;8BAErE;;sCACE,KAACX;4BACCY,iBAAiBV,MAAMW,cAAc;4BACrCC,SAASZ,MAAMY,OAAO;4BACtBC,gBAAgBb,MAAMc,cAAc;4BACpCC,cAAcf,MAAMe,YAAY;;wBAEjCf,MAAMgB,OAAO,kBAAI,KAACnB;;;8BAErB,KAACD;oBAAuBqB,WAAWjB,MAAMiB,SAAS;;;;;AAI1D,EAAE"}

package/lib/components/EditorInput/useEditorInput.js

@@ -1,7 +1,8 @@
 import * as React from 'react';
-import { getPartitionedNativeProps, slot, useId, useMergedRefs } from '@fluentui/react-components';
-import { LexicalPlainTextPlugin } from '@fluentui-copilot/react-text-editor';
-import { useLexicalContentEditable } from '../../utilities/useLexicalContentEditable';
+import { getPartitionedNativeProps, slot, useId, useIsomorphicLayoutEffect, useMergedRefs } from '@fluentui/react-components';
+import { SentinelNode } from '@fluentui-copilot/chat-input-plugins';
+import { LexicalPlainTextPlugin, mergeRegister } from '@fluentui-copilot/react-text-editor';
+import { useControllableState } from '@fluentui/react-utilities';
 /**
  * Create the state required to render EditorInput.
  *
@@ -18,7 +19,7 @@ export const useEditorInput_unstable = (props, ref) => {
     trimWhiteSpace = false,
     textPlugin = LexicalPlainTextPlugin,
     history = true,
-    editorRef
+    editorRef: userEditorRef
   } = props;
   const {
     root,
@@ -28,26 +29,60 @@ export const useEditorInput_unstable = (props, ref) => {
     props,
     excludedPropNames: ['onChange', 'onPaste', 'defaultValue']
   });
-  const {
-    canShowPlaceholder,
-    spanRef,
-    disabled,
-    lexicalEditor,
-    lexicalInitialConfig
-  } = useLexicalContentEditable(props);
+  const editorRef = useMergedRefs(React.useRef(null), userEditorRef);
+  // The disabled state can also be changed by lexical (e.g. by a custom plugin) so
+  // we use `useControllableState` to coordinate
+  const [disabled, setDisabled] = useControllableState({
+    state: props.disabled,
+    initialState: false
+  });
+  const customNodes = props.customNodes ? [...props.customNodes, SentinelNode] : [SentinelNode];
+  const spanRef = React.useCallback(span => {
+    var
+    // Register the `input` span with lexical
+    _editorRef_current;
+    (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.setRootElement(span);
+  }, [editorRef]);
+  // Update lexical when disabled changes
+  useIsomorphicLayoutEffect(() => {
+    if (editorRef.current) {
+      var _editorRef_current;
+      (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.setEditable(!disabled);
+    }
+  }, [disabled]);
+  useIsomorphicLayoutEffect(() => {
+    if (editorRef.current) {
+      var _editorRef_current;
+      return mergeRegister(editorRef.current.registerEditableListener(isEditable => {
+        setDisabled(!isEditable);
+      }), (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.registerRootListener(root => {
+        if (!root) {
+          return;
+        }
+        // Remove lexical's inline style so we can apply our own
+        // Lexical needs the whitespace style to be either `pre` or `pre-wrap` to work correctly
+        root.style.whiteSpace = '';
+      }));
+    }
+  }, [editorRef]);
   const handleOnChange = React.useCallback(newValue => {
     onChange === null || onChange === void 0 ? void 0 : onChange({}, {
       value: newValue
     });
   }, [onChange]);
-  const placeholderValue = canShowPlaceholder ? slot.optional(props.placeholderValue, {
+  const [defaultString, defaultValueFunction] = (() => {
+    if (typeof props.defaultValue === 'function') {
+      return [undefined, props.defaultValue];
+    }
+    return [props.defaultValue, undefined];
+  })();
+  const placeholderValue = slot.optional(props.placeholderValue, {
     elementType: 'span'
-  }) : undefined;
+  });
   const placeholderId = useId('chat-input-placeholder', placeholderValue === null || placeholderValue === void 0 ? void 0 : placeholderValue.id);
   if (placeholderValue) {
     placeholderValue.id = placeholderId;
   }
-  const describedBy = primary['aria-describedby'] ? `${primary['aria-describedby']} ${placeholderId}` : placeholderId;
   return {
     components: {
       root: 'span',
@@ -70,20 +105,25 @@ export const useEditorInput_unstable = (props, ref) => {
         disabled,
         suppressContentEditableWarning: true,
         ...primary,
-        'aria-describedby': canShowPlaceholder ? describedBy : undefined
+        'aria-describedby': primary['aria-describedby'] ? `${primary['aria-describedby']} ${placeholderId}` : placeholderId
       },
       elementType: 'span'
     }),
     placeholderValue,
-    lexicalInitialConfig,
+    lexicalInitialConfig: {
+      namespace: 'fai-EditorInput',
+      onError: console.error,
+      nodes: customNodes,
+      editorState: defaultValueFunction
+    },
     editorRef,
     disabled,
     textPlugin,
     onPaste,
     handleOnChange,
+    defaultValue: defaultString,
     trimWhiteSpace,
-    history,
-    lexicalEditor
+    history
   };
 };
 //# sourceMappingURL=useEditorInput.js.map

package/lib/components/EditorInput/useEditorInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useEditorInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getPartitionedNativeProps, slot, useId, useMergedRefs } from '@fluentui/react-components';\nimport type { EditorInputProps, EditorInputState } from './EditorInput.types';\nimport { LexicalPlainTextPlugin } from '@fluentui-copilot/react-text-editor';\nimport { useLexicalContentEditable } from '../../utilities/useLexicalContentEditable';\n\n/**\n * Create the state required to render EditorInput.\n *\n * The returned state can be modified with hooks such as useEditorInputStyles_unstable,\n * before being passed to renderEditorInput_unstable.\n *\n * @param props - props from this instance of EditorInput\n * @param ref - reference to root HTMLElement of EditorInput\n */\nexport const useEditorInput_unstable = (props: EditorInputProps, ref: React.Ref<HTMLSpanElement>): EditorInputState => {\n  const {\n    onChange,\n    onPaste,\n    trimWhiteSpace = false,\n    textPlugin = LexicalPlainTextPlugin,\n    history = true,\n    editorRef,\n  } = props;\n  const { root, primary } = getPartitionedNativeProps({\n    primarySlotTagName: 'span',\n    props,\n    excludedPropNames: ['onChange', 'onPaste', 'defaultValue'],\n  });\n\n  const { canShowPlaceholder, spanRef, disabled, lexicalEditor, lexicalInitialConfig } =\n    useLexicalContentEditable(props);\n  const handleOnChange = React.useCallback(\n    (newValue: string) => {\n      onChange?.({}, { value: newValue });\n    },\n    [onChange],\n  );\n\n  const placeholderValue = canShowPlaceholder\n    ? slot.optional(props.placeholderValue, { elementType: 'span' })\n    : undefined;\n  const placeholderId = useId('chat-input-placeholder', placeholderValue?.id);\n  if (placeholderValue) {\n    placeholderValue.id = placeholderId;\n  }\n\n  const describedBy = primary['aria-describedby'] ? `${primary['aria-describedby']} ${placeholderId}` : placeholderId;\n\n  return {\n    components: {\n      root: 'span',\n      input: 'span',\n      placeholderValue: 'span',\n    },\n    root: slot.always(props.root, { defaultProps: { ...root }, elementType: 'span' }),\n    input: slot.always(props.input, {\n      defaultProps: {\n        ref: useMergedRefs(ref, spanRef),\n        role: 'textbox',\n        contentEditable: !disabled,\n        'aria-readonly': disabled ? true : undefined,\n        tabIndex: disabled ? -1 : 0,\n        disabled,\n        suppressContentEditableWarning: true,\n        ...primary,\n        'aria-describedby': canShowPlaceholder ? describedBy : undefined,\n      },\n      elementType: 'span',\n    }),\n    placeholderValue,\n    lexicalInitialConfig,\n    editorRef,\n    disabled,\n    textPlugin,\n    onPaste,\n    handleOnChange,\n    trimWhiteSpace,\n    history,\n    lexicalEditor,\n  };\n};\n"],"names":["React","getPartitionedNativeProps","slot","useId","useMergedRefs","LexicalPlainTextPlugin","useLexicalContentEditable","useEditorInput_unstable","props","ref","onChange","onPaste","trimWhiteSpace","textPlugin","history","editorRef","root","primary","primarySlotTagName","excludedPropNames","canShowPlaceholder","spanRef","disabled","lexicalEditor","lexicalInitialConfig","handleOnChange","useCallback","newValue","value","placeholderValue","optional","elementType","undefined","placeholderId","id","describedBy","components","input","always","defaultProps","role","contentEditable","tabIndex","suppressContentEditableWarning"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,EAAEC,IAAI,EAAEC,KAAK,EAAEC,aAAa,QAAQ,6BAA6B;AAEnG,SAASC,sBAAsB,QAAQ,sCAAsC;AAC7E,SAASC,yBAAyB,QAAQ,4CAA4C;AAEtF;;;;;;;;CAQC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAyBC;IAC/D,MAAM,EACJC,QAAQ,EACRC,OAAO,EACPC,iBAAiB,KAAK,EACtBC,aAAaR,sBAAsB,EACnCS,UAAU,IAAI,EACdC,SAAS,EACV,GAAGP;IACJ,MAAM,EAAEQ,IAAI,EAAEC,OAAO,EAAE,GAAGhB,0BAA0B;QAClDiB,oBAAoB;QACpBV;QACAW,mBAAmB;YAAC;YAAY;YAAW;SAAe;IAC5D;IAEA,MAAM,EAAEC,kBAAkB,EAAEC,OAAO,EAAEC,QAAQ,EAAEC,aAAa,EAAEC,oBAAoB,EAAE,GAClFlB,0BAA0BE;IAC5B,MAAMiB,iBAAiBzB,MAAM0B,WAAW,CACtC,CAACC;QACCjB,qBAAAA,+BAAAA,SAAW,CAAC,GAAG;YAAEkB,OAAOD;QAAS;IACnC,GACA;QAACjB;KAAS;IAGZ,MAAMmB,mBAAmBT,qBACrBlB,KAAK4B,QAAQ,CAACtB,MAAMqB,gBAAgB,EAAE;QAAEE,aAAa;IAAO,KAC5DC;IACJ,MAAMC,gBAAgB9B,MAAM,0BAA0B0B,6BAAAA,uCAAAA,iBAAkBK,EAAE;IAC1E,IAAIL,kBAAkB;QACpBA,iBAAiBK,EAAE,GAAGD;IACxB;IAEA,MAAME,cAAclB,OAAO,CAAC,mBAAmB,GAAG,CAAC,EAAEA,OAAO,CAAC,mBAAmB,CAAC,CAAC,EAAEgB,cAAc,CAAC,GAAGA;IAEtG,OAAO;QACLG,YAAY;YACVpB,MAAM;YACNqB,OAAO;YACPR,kBAAkB;QACpB;QACAb,MAAMd,KAAKoC,MAAM,CAAC9B,MAAMQ,IAAI,EAAE;YAAEuB,cAAc;gBAAE,GAAGvB,IAAI;YAAC;YAAGe,aAAa;QAAO;QAC/EM,OAAOnC,KAAKoC,MAAM,CAAC9B,MAAM6B,KAAK,EAAE;YAC9BE,cAAc;gBACZ9B,KAAKL,cAAcK,KAAKY;gBACxBmB,MAAM;gBACNC,iBAAiB,CAACnB;gBAClB,iBAAiBA,WAAW,OAAOU;gBACnCU,UAAUpB,WAAW,CAAC,IAAI;gBAC1BA;gBACAqB,gCAAgC;gBAChC,GAAG1B,OAAO;gBACV,oBAAoBG,qBAAqBe,cAAcH;YACzD;YACAD,aAAa;QACf;QACAF;QACAL;QACAT;QACAO;QACAT;QACAF;QACAc;QACAb;QACAE;QACAS;IACF;AACF,EAAE"}
+{"version":3,"sources":["useEditorInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  getPartitionedNativeProps,\n  slot,\n  useId,\n  useIsomorphicLayoutEffect,\n  useMergedRefs,\n} from '@fluentui/react-components';\nimport type { EditorInputProps, EditorInputState } from './EditorInput.types';\nimport { SentinelNode } from '@fluentui-copilot/chat-input-plugins';\nimport type { LexicalEditor } from '@fluentui-copilot/react-text-editor';\nimport { LexicalPlainTextPlugin, mergeRegister } from '@fluentui-copilot/react-text-editor';\nimport { useControllableState } from '@fluentui/react-utilities';\n\n/**\n * Create the state required to render EditorInput.\n *\n * The returned state can be modified with hooks such as useEditorInputStyles_unstable,\n * before being passed to renderEditorInput_unstable.\n *\n * @param props - props from this instance of EditorInput\n * @param ref - reference to root HTMLElement of EditorInput\n */\nexport const useEditorInput_unstable = (props: EditorInputProps, ref: React.Ref<HTMLSpanElement>): EditorInputState => {\n  const {\n    onChange,\n    onPaste,\n    trimWhiteSpace = false,\n    textPlugin = LexicalPlainTextPlugin,\n    history = true,\n    editorRef: userEditorRef,\n  } = props;\n  const { root, primary } = getPartitionedNativeProps({\n    primarySlotTagName: 'span',\n    props,\n    excludedPropNames: ['onChange', 'onPaste', 'defaultValue'],\n  });\n\n  const editorRef = useMergedRefs(React.useRef<LexicalEditor>(null), userEditorRef);\n  // The disabled state can also be changed by lexical (e.g. by a custom plugin) so\n  // we use `useControllableState` to coordinate\n  const [disabled, setDisabled] = useControllableState({\n    state: props.disabled,\n    initialState: false,\n  });\n\n  const customNodes = props.customNodes ? [...props.customNodes, SentinelNode] : [SentinelNode];\n\n  const spanRef = React.useCallback(\n    span => {\n      // Register the `input` span with lexical\n      editorRef.current?.setRootElement(span);\n    },\n    [editorRef],\n  );\n\n  // Update lexical when disabled changes\n  useIsomorphicLayoutEffect(() => {\n    if (editorRef.current) {\n      editorRef.current?.setEditable(!disabled);\n    }\n  }, [disabled]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (editorRef.current) {\n      return mergeRegister(\n        editorRef.current.registerEditableListener(isEditable => {\n          setDisabled(!isEditable);\n        }),\n        editorRef.current?.registerRootListener(root => {\n          if (!root) {\n            return;\n          }\n\n          // Remove lexical's inline style so we can apply our own\n          // Lexical needs the whitespace style to be either `pre` or `pre-wrap` to work correctly\n          root.style.whiteSpace = '';\n        }),\n      );\n    }\n  }, [editorRef]);\n\n  const handleOnChange = React.useCallback(\n    (newValue: string) => {\n      onChange?.({}, { value: newValue });\n    },\n    [onChange],\n  );\n\n  const [defaultString, defaultValueFunction] = (() => {\n    if (typeof props.defaultValue === 'function') {\n      return [undefined, props.defaultValue];\n    }\n    return [props.defaultValue, undefined];\n  })();\n\n  const placeholderValue = slot.optional(props.placeholderValue, { elementType: 'span' });\n  const placeholderId = useId('chat-input-placeholder', placeholderValue?.id);\n  if (placeholderValue) {\n    placeholderValue.id = placeholderId;\n  }\n\n  return {\n    components: {\n      root: 'span',\n      input: 'span',\n      placeholderValue: 'span',\n    },\n    root: slot.always(props.root, { defaultProps: { ...root }, elementType: 'span' }),\n    input: slot.always(props.input, {\n      defaultProps: {\n        ref: useMergedRefs(ref, spanRef),\n        role: 'textbox',\n        contentEditable: !disabled,\n        'aria-readonly': disabled ? true : undefined,\n        tabIndex: disabled ? -1 : 0,\n        disabled,\n        suppressContentEditableWarning: true,\n        ...primary,\n        'aria-describedby': primary['aria-describedby']\n          ? `${primary['aria-describedby']} ${placeholderId}`\n          : placeholderId,\n      },\n      elementType: 'span',\n    }),\n    placeholderValue,\n    lexicalInitialConfig: {\n      namespace: 'fai-EditorInput',\n      onError: console.error,\n      nodes: customNodes,\n      editorState: defaultValueFunction,\n    },\n    editorRef,\n    disabled,\n    textPlugin,\n    onPaste,\n    handleOnChange,\n    defaultValue: defaultString,\n    trimWhiteSpace,\n    history,\n  };\n};\n"],"names":["React","getPartitionedNativeProps","slot","useId","useIsomorphicLayoutEffect","useMergedRefs","SentinelNode","LexicalPlainTextPlugin","mergeRegister","useControllableState","useEditorInput_unstable","props","ref","onChange","onPaste","trimWhiteSpace","textPlugin","history","editorRef","userEditorRef","root","primary","primarySlotTagName","excludedPropNames","useRef","disabled","setDisabled","state","initialState","customNodes","spanRef","useCallback","span","current","setRootElement","setEditable","registerEditableListener","isEditable","registerRootListener","style","whiteSpace","handleOnChange","newValue","value","defaultString","defaultValueFunction","defaultValue","undefined","placeholderValue","optional","elementType","placeholderId","id","components","input","always","defaultProps","role","contentEditable","tabIndex","suppressContentEditableWarning","lexicalInitialConfig","namespace","onError","console","error","nodes","editorState"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,yBAAyB,EACzBC,IAAI,EACJC,KAAK,EACLC,yBAAyB,EACzBC,aAAa,QACR,6BAA6B;AAEpC,SAASC,YAAY,QAAQ,uCAAuC;AAEpE,SAASC,sBAAsB,EAAEC,aAAa,QAAQ,sCAAsC;AAC5F,SAASC,oBAAoB,QAAQ,4BAA4B;AAEjE;;;;;;;;CAQC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAyBC;IAC/D,MAAM,EACJC,QAAQ,EACRC,OAAO,EACPC,iBAAiB,KAAK,EACtBC,aAAaT,sBAAsB,EACnCU,UAAU,IAAI,EACdC,WAAWC,aAAa,EACzB,GAAGR;IACJ,MAAM,EAAES,IAAI,EAAEC,OAAO,EAAE,GAAGpB,0BAA0B;QAClDqB,oBAAoB;QACpBX;QACAY,mBAAmB;YAAC;YAAY;YAAW;SAAe;IAC5D;IAEA,MAAML,YAAYb,cAAcL,MAAMwB,MAAM,CAAgB,OAAOL;IACnE,iFAAiF;IACjF,8CAA8C;IAC9C,MAAM,CAACM,UAAUC,YAAY,GAAGjB,qBAAqB;QACnDkB,OAAOhB,MAAMc,QAAQ;QACrBG,cAAc;IAChB;IAEA,MAAMC,cAAclB,MAAMkB,WAAW,GAAG;WAAIlB,MAAMkB,WAAW;QAAEvB;KAAa,GAAG;QAACA;KAAa;IAE7F,MAAMwB,UAAU9B,MAAM+B,WAAW,CAC/BC,CAAAA;YACE,yCAAyC;QACzCd;SAAAA,qBAAAA,UAAUe,OAAO,cAAjBf,yCAAAA,mBAAmBgB,cAAc,CAACF;IACpC,GACA;QAACd;KAAU;IAGb,uCAAuC;IACvCd,0BAA0B;QACxB,IAAIc,UAAUe,OAAO,EAAE;gBACrBf;aAAAA,qBAAAA,UAAUe,OAAO,cAAjBf,yCAAAA,mBAAmBiB,WAAW,CAAC,CAACV;QAClC;IACF,GAAG;QAACA;KAAS;IAEbrB,0BAA0B;QACxB,IAAIc,UAAUe,OAAO,EAAE;gBAKnBf;YAJF,OAAOV,cACLU,UAAUe,OAAO,CAACG,wBAAwB,CAACC,CAAAA;gBACzCX,YAAY,CAACW;YACf,KACAnB,qBAAAA,UAAUe,OAAO,cAAjBf,yCAAAA,mBAAmBoB,oBAAoB,CAAClB,CAAAA;gBACtC,IAAI,CAACA,MAAM;oBACT;gBACF;gBAEA,wDAAwD;gBACxD,wFAAwF;gBACxFA,KAAKmB,KAAK,CAACC,UAAU,GAAG;YAC1B;QAEJ;IACF,GAAG;QAACtB;KAAU;IAEd,MAAMuB,iBAAiBzC,MAAM+B,WAAW,CACtC,CAACW;QACC7B,qBAAAA,+BAAAA,SAAW,CAAC,GAAG;YAAE8B,OAAOD;QAAS;IACnC,GACA;QAAC7B;KAAS;IAGZ,MAAM,CAAC+B,eAAeC,qBAAqB,GAAG,AAAC,CAAA;QAC7C,IAAI,OAAOlC,MAAMmC,YAAY,KAAK,YAAY;YAC5C,OAAO;gBAACC;gBAAWpC,MAAMmC,YAAY;aAAC;QACxC;QACA,OAAO;YAACnC,MAAMmC,YAAY;YAAEC;SAAU;IACxC,CAAA;IAEA,MAAMC,mBAAmB9C,KAAK+C,QAAQ,CAACtC,MAAMqC,gBAAgB,EAAE;QAAEE,aAAa;IAAO;IACrF,MAAMC,gBAAgBhD,MAAM,0BAA0B6C,6BAAAA,uCAAAA,iBAAkBI,EAAE;IAC1E,IAAIJ,kBAAkB;QACpBA,iBAAiBI,EAAE,GAAGD;IACxB;IAEA,OAAO;QACLE,YAAY;YACVjC,MAAM;YACNkC,OAAO;YACPN,kBAAkB;QACpB;QACA5B,MAAMlB,KAAKqD,MAAM,CAAC5C,MAAMS,IAAI,EAAE;YAAEoC,cAAc;gBAAE,GAAGpC,IAAI;YAAC;YAAG8B,aAAa;QAAO;QAC/EI,OAAOpD,KAAKqD,MAAM,CAAC5C,MAAM2C,KAAK,EAAE;YAC9BE,cAAc;gBACZ5C,KAAKP,cAAcO,KAAKkB;gBACxB2B,MAAM;gBACNC,iBAAiB,CAACjC;gBAClB,iBAAiBA,WAAW,OAAOsB;gBACnCY,UAAUlC,WAAW,CAAC,IAAI;gBAC1BA;gBACAmC,gCAAgC;gBAChC,GAAGvC,OAAO;gBACV,oBAAoBA,OAAO,CAAC,mBAAmB,GAC3C,CAAC,EAAEA,OAAO,CAAC,mBAAmB,CAAC,CAAC,EAAE8B,cAAc,CAAC,GACjDA;YACN;YACAD,aAAa;QACf;QACAF;QACAa,sBAAsB;YACpBC,WAAW;YACXC,SAASC,QAAQC,KAAK;YACtBC,OAAOrC;YACPsC,aAAatB;QACf;QACA3B;QACAO;QACAT;QACAF;QACA2B;QACAK,cAAcF;QACd7B;QACAE;IACF;AACF,EAAE"}

package/lib/components/EditorInput/useEditorInputStyles.styles.js

@@ -48,6 +48,13 @@ export const useEditorInputStyles_unstable = state => {
   const styles = useStyles();
   state.root.className = mergeClasses(editorInputClassNames.root, rootClassName, state.root.className);
   state.input.className = mergeClasses(editorInputClassNames.input, inputClassName, state.input.className);
+  state.lexicalInitialConfig = {
+    ...state.lexicalInitialConfig,
+    theme: {
+      ...useLexicalStyles(),
+      ...state.lexicalInitialConfig.theme
+    }
+  };
   if (state.placeholderValue) {
     state.placeholderValue.className = mergeClasses(editorInputClassNames.placeholderValue, placeholderClassName, disabled && styles.placeholderDisabled, state.placeholderValue.className);
   }

package/lib/components/EditorInput/useEditorInputStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useEditorInputStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, tokens, typographyStyles } from '@fluentui/react-components';\nimport type { SlotClassNames } from '@fluentui/react-components';\nimport type { EditorInputSlots, EditorInputState } from './EditorInput.types';\n\nexport const editorInputClassNames: SlotClassNames<EditorInputSlots> = {\n  root: 'fai-EditorInput',\n  input: 'fai-EditorInput__input',\n  placeholderValue: 'fai-EditorInput__placeholderValue',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootClassName = makeResetStyles({\n  display: 'inline-grid',\n  whiteSpace: 'pre-wrap',\n});\n\nexport const useLexicalStyles = makeStyles({\n  paragraph: {\n    margin: 0,\n  },\n});\n\nexport const usePlaceholderClassName = makeResetStyles({\n  zIndex: 0,\n  gridArea: '1 / 1 / 1 / 1',\n\n  color: tokens.colorNeutralForeground3,\n  ...typographyStyles.body1,\n\n  '@media (forced-colors: active)': {\n    color: 'GrayText',\n  },\n});\n\nexport const useInputClassName = makeResetStyles({\n  gridArea: '1 / 1 / 1 / 1',\n  zIndex: 1,\n  width: '100%',\n});\n\nconst useStyles = makeStyles({\n  placeholderDisabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n  },\n});\n/**\n * Apply styling to the EditorInput slots based on the state\n */\nexport const useEditorInputStyles_unstable = (state: EditorInputState): EditorInputState => {\n  'use no memo';\n\n  const { disabled } = state;\n  const placeholderClassName = usePlaceholderClassName();\n  const rootClassName = useRootClassName();\n  const inputClassName = useInputClassName();\n  const styles = useStyles();\n\n  state.root.className = mergeClasses(editorInputClassNames.root, rootClassName, state.root.className);\n\n  state.input.className = mergeClasses(editorInputClassNames.input, inputClassName, state.input.className);\n\n  if (state.placeholderValue) {\n    state.placeholderValue.className = mergeClasses(\n      editorInputClassNames.placeholderValue,\n      placeholderClassName,\n      disabled && styles.placeholderDisabled,\n      state.placeholderValue.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","tokens","typographyStyles","editorInputClassNames","root","input","placeholderValue","useRootClassName","display","whiteSpace","useLexicalStyles","paragraph","margin","usePlaceholderClassName","zIndex","gridArea","color","colorNeutralForeground3","body1","useInputClassName","width","useStyles","placeholderDisabled","colorNeutralForegroundDisabled","useEditorInputStyles_unstable","state","disabled","placeholderClassName","rootClassName","inputClassName","styles","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,EAAEC,UAAU,EAAEC,YAAY,EAAEC,MAAM,EAAEC,gBAAgB,QAAQ,6BAA6B;AAIjH,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;IACNC,OAAO;IACPC,kBAAkB;AACpB,EAAE;AAEF;;CAEC,GACD,MAAMC,mBAAmBT,gBAAgB;IACvCU,SAAS;IACTC,YAAY;AACd;AAEA,OAAO,MAAMC,mBAAmBX,WAAW;IACzCY,WAAW;QACTC,QAAQ;IACV;AACF,GAAG;AAEH,OAAO,MAAMC,0BAA0Bf,gBAAgB;IACrDgB,QAAQ;IACRC,UAAU;IAEVC,OAAOf,OAAOgB,uBAAuB;IACrC,GAAGf,iBAAiBgB,KAAK;IAEzB,kCAAkC;QAChCF,OAAO;IACT;AACF,GAAG;AAEH,OAAO,MAAMG,oBAAoBrB,gBAAgB;IAC/CiB,UAAU;IACVD,QAAQ;IACRM,OAAO;AACT,GAAG;AAEH,MAAMC,YAAYtB,WAAW;IAC3BuB,qBAAqB;QACnBN,OAAOf,OAAOsB,8BAA8B;IAC9C;AACF;AACA;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C;IAEA,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IACrB,MAAME,uBAAuBd;IAC7B,MAAMe,gBAAgBrB;IACtB,MAAMsB,iBAAiBV;IACvB,MAAMW,SAAST;IAEfI,MAAMrB,IAAI,CAAC2B,SAAS,GAAG/B,aAAaG,sBAAsBC,IAAI,EAAEwB,eAAeH,MAAMrB,IAAI,CAAC2B,SAAS;IAEnGN,MAAMpB,KAAK,CAAC0B,SAAS,GAAG/B,aAAaG,sBAAsBE,KAAK,EAAEwB,gBAAgBJ,MAAMpB,KAAK,CAAC0B,SAAS;IAEvG,IAAIN,MAAMnB,gBAAgB,EAAE;QAC1BmB,MAAMnB,gBAAgB,CAACyB,SAAS,GAAG/B,aACjCG,sBAAsBG,gBAAgB,EACtCqB,sBACAD,YAAYI,OAAOR,mBAAmB,EACtCG,MAAMnB,gBAAgB,CAACyB,SAAS;IAEpC;IAEA,OAAON;AACT,EAAE"}
+{"version":3,"sources":["useEditorInputStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, tokens, typographyStyles } from '@fluentui/react-components';\nimport type { SlotClassNames } from '@fluentui/react-components';\nimport type { EditorInputSlots, EditorInputState } from './EditorInput.types';\n\nexport const editorInputClassNames: SlotClassNames<EditorInputSlots> = {\n  root: 'fai-EditorInput',\n  input: 'fai-EditorInput__input',\n  placeholderValue: 'fai-EditorInput__placeholderValue',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootClassName = makeResetStyles({\n  display: 'inline-grid',\n  whiteSpace: 'pre-wrap',\n});\n\nexport const useLexicalStyles = makeStyles({\n  paragraph: {\n    margin: 0,\n  },\n});\n\nexport const usePlaceholderClassName = makeResetStyles({\n  zIndex: 0,\n  gridArea: '1 / 1 / 1 / 1',\n\n  color: tokens.colorNeutralForeground3,\n  ...typographyStyles.body1,\n\n  '@media (forced-colors: active)': {\n    color: 'GrayText',\n  },\n});\n\nexport const useInputClassName = makeResetStyles({\n  gridArea: '1 / 1 / 1 / 1',\n  zIndex: 1,\n  width: '100%',\n});\n\nconst useStyles = makeStyles({\n  placeholderDisabled: {\n    color: tokens.colorNeutralForegroundDisabled,\n  },\n});\n/**\n * Apply styling to the EditorInput slots based on the state\n */\nexport const useEditorInputStyles_unstable = (state: EditorInputState): EditorInputState => {\n  'use no memo';\n\n  const { disabled } = state;\n  const placeholderClassName = usePlaceholderClassName();\n  const rootClassName = useRootClassName();\n  const inputClassName = useInputClassName();\n  const styles = useStyles();\n\n  state.root.className = mergeClasses(editorInputClassNames.root, rootClassName, state.root.className);\n\n  state.input.className = mergeClasses(editorInputClassNames.input, inputClassName, state.input.className);\n\n  state.lexicalInitialConfig = {\n    ...state.lexicalInitialConfig,\n    theme: { ...useLexicalStyles(), ...state.lexicalInitialConfig.theme },\n  };\n\n  if (state.placeholderValue) {\n    state.placeholderValue.className = mergeClasses(\n      editorInputClassNames.placeholderValue,\n      placeholderClassName,\n      disabled && styles.placeholderDisabled,\n      state.placeholderValue.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","tokens","typographyStyles","editorInputClassNames","root","input","placeholderValue","useRootClassName","display","whiteSpace","useLexicalStyles","paragraph","margin","usePlaceholderClassName","zIndex","gridArea","color","colorNeutralForeground3","body1","useInputClassName","width","useStyles","placeholderDisabled","colorNeutralForegroundDisabled","useEditorInputStyles_unstable","state","disabled","placeholderClassName","rootClassName","inputClassName","styles","className","lexicalInitialConfig","theme"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,EAAEC,UAAU,EAAEC,YAAY,EAAEC,MAAM,EAAEC,gBAAgB,QAAQ,6BAA6B;AAIjH,OAAO,MAAMC,wBAA0D;IACrEC,MAAM;IACNC,OAAO;IACPC,kBAAkB;AACpB,EAAE;AAEF;;CAEC,GACD,MAAMC,mBAAmBT,gBAAgB;IACvCU,SAAS;IACTC,YAAY;AACd;AAEA,OAAO,MAAMC,mBAAmBX,WAAW;IACzCY,WAAW;QACTC,QAAQ;IACV;AACF,GAAG;AAEH,OAAO,MAAMC,0BAA0Bf,gBAAgB;IACrDgB,QAAQ;IACRC,UAAU;IAEVC,OAAOf,OAAOgB,uBAAuB;IACrC,GAAGf,iBAAiBgB,KAAK;IAEzB,kCAAkC;QAChCF,OAAO;IACT;AACF,GAAG;AAEH,OAAO,MAAMG,oBAAoBrB,gBAAgB;IAC/CiB,UAAU;IACVD,QAAQ;IACRM,OAAO;AACT,GAAG;AAEH,MAAMC,YAAYtB,WAAW;IAC3BuB,qBAAqB;QACnBN,OAAOf,OAAOsB,8BAA8B;IAC9C;AACF;AACA;;CAEC,GACD,OAAO,MAAMC,gCAAgC,CAACC;IAC5C;IAEA,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IACrB,MAAME,uBAAuBd;IAC7B,MAAMe,gBAAgBrB;IACtB,MAAMsB,iBAAiBV;IACvB,MAAMW,SAAST;IAEfI,MAAMrB,IAAI,CAAC2B,SAAS,GAAG/B,aAAaG,sBAAsBC,IAAI,EAAEwB,eAAeH,MAAMrB,IAAI,CAAC2B,SAAS;IAEnGN,MAAMpB,KAAK,CAAC0B,SAAS,GAAG/B,aAAaG,sBAAsBE,KAAK,EAAEwB,gBAAgBJ,MAAMpB,KAAK,CAAC0B,SAAS;IAEvGN,MAAMO,oBAAoB,GAAG;QAC3B,GAAGP,MAAMO,oBAAoB;QAC7BC,OAAO;YAAE,GAAGvB,kBAAkB;YAAE,GAAGe,MAAMO,oBAAoB,CAACC,KAAK;QAAC;IACtE;IAEA,IAAIR,MAAMnB,gBAAgB,EAAE;QAC1BmB,MAAMnB,gBAAgB,CAACyB,SAAS,GAAG/B,aACjCG,sBAAsBG,gBAAgB,EACtCqB,sBACAD,YAAYI,OAAOR,mBAAmB,EACtCG,MAAMnB,gBAAgB,CAACyB,SAAS;IAEpC;IAEA,OAAON;AACT,EAAE"}

package/lib/index.js

@@ -1,2 +1,2 @@
-export { EditorInput, editorInputClassNames, renderEditorInput_unstable, useEditorInputStyles_unstable, useEditorInput_unstable, useEditorInputContextValues } from './EditorInput';
+export { EditorInput, editorInputClassNames, renderEditorInput_unstable, useEditorInputStyles_unstable, useEditorInput_unstable } from './EditorInput';
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export type {\n  EditorInputProps,\n  EditorInputSlots,\n  EditorInputState,\n  EditorInputValueData,\n  EditorInputContextValues,\n} from './EditorInput';\nexport {\n  EditorInput,\n  editorInputClassNames,\n  renderEditorInput_unstable,\n  useEditorInputStyles_unstable,\n  useEditorInput_unstable,\n  useEditorInputContextValues,\n} from './EditorInput';\n"],"names":["EditorInput","editorInputClassNames","renderEditorInput_unstable","useEditorInputStyles_unstable","useEditorInput_unstable","useEditorInputContextValues"],"rangeMappings":"","mappings":"AAOA,SACEA,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,6BAA6B,EAC7BC,uBAAuB,EACvBC,2BAA2B,QACtB,gBAAgB"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export type { EditorInputProps, EditorInputSlots, EditorInputState, EditorInputValueData } from './EditorInput';\nexport {\n  EditorInput,\n  editorInputClassNames,\n  renderEditorInput_unstable,\n  useEditorInputStyles_unstable,\n  useEditorInput_unstable,\n} from './EditorInput';\n"],"names":["EditorInput","editorInputClassNames","renderEditorInput_unstable","useEditorInputStyles_unstable","useEditorInput_unstable"],"rangeMappings":"","mappings":"AACA,SACEA,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,6BAA6B,EAC7BC,uBAAuB,QAClB,gBAAgB"}

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

@@ -13,11 +13,9 @@ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
 const _useEditorInput = require("./useEditorInput");
 const _renderEditorInput = require("./renderEditorInput");
 const _useEditorInputStylesstyles = require("./useEditorInputStyles.styles");
-const _useEditorInputContextValues = require("./useEditorInputContextValues");
 const EditorInput = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useEditorInput.useEditorInput_unstable)(props, ref);
-    const contextValues = (0, _useEditorInputContextValues.useEditorInputContextValues)(state);
     (0, _useEditorInputStylesstyles.useEditorInputStyles_unstable)(state);
-    return (0, _renderEditorInput.renderEditorInput_unstable)(state, contextValues);
+    return (0, _renderEditorInput.renderEditorInput_unstable)(state);
 });
 EditorInput.displayName = 'EditorInput'; //# sourceMappingURL=EditorInput.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["EditorInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useEditorInput_unstable } from './useEditorInput';\nimport { renderEditorInput_unstable } from './renderEditorInput';\nimport { useEditorInputStyles_unstable } from './useEditorInputStyles.styles';\nimport type { EditorInputProps } from './EditorInput.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useEditorInputContextValues } from './useEditorInputContextValues';\n\nexport const EditorInput: ForwardRefComponent<EditorInputProps> = React.forwardRef((props, ref) => {\n  const state = useEditorInput_unstable(props, ref);\n  const contextValues = useEditorInputContextValues(state);\n\n  useEditorInputStyles_unstable(state);\n\n  return renderEditorInput_unstable(state, contextValues);\n});\n\nEditorInput.displayName = 'EditorInput';\n"],"names":["EditorInput","React","forwardRef","props","state","useEditorInput_unstable","contextValues","useEditorInputContextValues","useEditorInputStyles_unstable","renderEditorInput_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;gCACiB;mCACG;4CACG;6CAGF;AAErC,MAAMA,cAAAA,WAAAA,GAAAA,OAAqDC,UAAMC,CAAU,CAACC,OAACA;UAClFC,QAAMA,IAAAA,uCAAQC,EAAAA,OAAwBF;UACtCG,gBAAMA,IAAAA,wDAAgBC,EAAAA;iEAEtBC,EAAAA;WAEAC,IAAAA,6CAAOA,EAAAA,OAA2BL;AACpC;AAEAJ,YAAYU,WAAW,GAAG"}
+{"version":3,"sources":["EditorInput.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useEditorInput_unstable } from './useEditorInput';\nimport { renderEditorInput_unstable } from './renderEditorInput';\nimport { useEditorInputStyles_unstable } from './useEditorInputStyles.styles';\nimport type { EditorInputProps } from './EditorInput.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n// EditorInput component - TODO: add more docs\nexport const EditorInput: ForwardRefComponent<EditorInputProps> = React.forwardRef((props, ref) => {\n  const state = useEditorInput_unstable(props, ref);\n\n  useEditorInputStyles_unstable(state);\n  return renderEditorInput_unstable(state);\n});\n\nEditorInput.displayName = 'EditorInput';\n"],"names":["EditorInput","React","forwardRef","props","state","useEditorInput_unstable","useEditorInputStyles_unstable","renderEditorInput_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;gCACiB;mCACG;4CACG;AAKvC,MAAMA,cAAAA,WAAAA,GAAAA,OAAqDC,UAAMC,CAAU,CAACC,OAACA;UAClFC,QAAMA,IAAAA,uCAAQC,EAAAA,OAAwBF;iEAEtCG,EAAAA;WACAC,IAAAA,6CAAOA,EAAAA;AACT;AAEAP,YAAYQ,WAAW,GAAG"}

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

@@ -1,4 +1,6 @@
-"use strict";
+/**
+ * Data passed to the `onChange` callback when the chat input's value changes.
+ */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });

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

@@ -1 +1 @@
-{"version":3,"sources":["EditorInput.types.ts"],"sourcesContent":["import type {\n  InitialConfigType,\n  LexicalComposerContextWithEditor,\n  LexicalEditor,\n  LexicalPlainTextPlugin,\n} from '@fluentui-copilot/react-text-editor';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type EditorInputSlots = {\n  root: NonNullable<Slot<'span'>>;\n  input: NonNullable<Slot<'span'>>;\n  placeholderValue?: Slot<'span'>;\n};\n\n/**\n * EditorInput Props\n */\nexport type EditorInputProps = Omit<\n  ComponentProps<Partial<EditorInputSlots>, 'input'>,\n  'onChange' | 'onPaste' | 'defaultValue' | 'onSubmit'\n> & {\n  disabled?: boolean;\n  /**\n   * If defaultValue is a string, it will be added to the input on first render.\n   * If defaultValue is a function, it can call lexical $ functions to imperatively set the initial content with more complex nodes.\n   */\n  defaultValue?: string | (() => void);\n  /**\n   * Callback for when the user changes the value.\n   * TODO: Add proper event type for callback\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  onChange?: (ev: any, data: EditorInputValueData) => void;\n  /**\n   * Callback for when content is pasted into the Editor.\n   */\n  onPaste?: (ev: ClipboardEvent) => void;\n  /**\n   * When true, the input will be cleared when only whitespace is remaining.\n   * @default false\n   */\n  trimWhiteSpace?: boolean;\n  /**\n   * Used to register any custom nodes used by plugins added. Can also be used to override the default nodes.\n   */\n  customNodes?: InitialConfigType['nodes'];\n  /**\n   * The plugin which is in charge of initializing Lexical and is given the `input` and `placeholder` slots\n   * @default LexicalPlainTextPlugin\n   */\n  textPlugin?: typeof LexicalPlainTextPlugin;\n  /**\n   * Controls whether history is tracked to provide undo and redo functionality\n   * @default true\n   */\n  history?: boolean;\n\n  editorRef?: React.RefObject<LexicalEditor>;\n};\n\n/**\n * State used in rendering EditorInput\n */\nexport type EditorInputState = ComponentState<EditorInputSlots> &\n  Required<Pick<EditorInputProps, 'disabled' | 'textPlugin' | 'history' | 'trimWhiteSpace'>> &\n  Partial<Pick<EditorInputProps, 'onPaste' | 'editorRef'>> & {\n    lexicalInitialConfig: InitialConfigType;\n    handleOnChange: (value: string) => void;\n    lexicalEditor: LexicalEditor;\n  };\n\n/**\n * Data passed to the `onChange` callback when the chat input's value changes.\n */\nexport type EditorInputValueData = {\n  value: string;\n};\n\nexport type EditorInputContextValues = {\n  lexicalComposer: LexicalComposerContextWithEditor;\n};\n"],"names":[],"rangeMappings":"","mappings":""}
+{"version":3,"sources":["EditorInput.types.ts"],"sourcesContent":["import type { InitialConfigType, LexicalEditor, LexicalPlainTextPlugin } from '@fluentui-copilot/react-text-editor';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type EditorInputSlots = {\n  root: NonNullable<Slot<'span'>>;\n  input: NonNullable<Slot<'span'>>;\n  placeholderValue?: Slot<'span'>;\n};\n\n/**\n * EditorInput Props\n */\nexport type EditorInputProps = Omit<\n  ComponentProps<Partial<EditorInputSlots>, 'input'>,\n  'onChange' | 'onPaste' | 'defaultValue' | 'onSubmit'\n> & {\n  disabled?: boolean;\n  /**\n   * If defaultValue is a string, it will be added to the input on first render.\n   * If defaultValue is a function, it can call lexical $ functions to imperatively set the initial content with more complex nodes.\n   */\n  defaultValue?: string | (() => void);\n  /**\n   * Callback for when the user changes the value.\n   * TODO: Add proper event type for callback\n   */\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  onChange?: (ev: any, data: EditorInputValueData) => void;\n  /**\n   * Callback for when content is pasted into the Editor.\n   */\n  onPaste?: (ev: ClipboardEvent) => void;\n  /**\n   * When true, the input will be cleared when only whitespace is remaining.\n   * @default false\n   */\n  trimWhiteSpace?: boolean;\n  /**\n   * Used to register any custom nodes used by plugins added. Can also be used to override the default nodes.\n   */\n  customNodes?: InitialConfigType['nodes'];\n  /**\n   * The plugin which is in charge of initializing Lexical and is given the `input` and `placeholder` slots\n   * @default LexicalPlainTextPlugin\n   */\n  textPlugin?: typeof LexicalPlainTextPlugin;\n  /**\n   * Controls whether history is tracked to provide undo and redo functionality\n   * @default true\n   */\n  history?: boolean;\n\n  editorRef?: React.RefObject<LexicalEditor>;\n};\n\n/**\n * State used in rendering EditorInput\n */\nexport type EditorInputState = ComponentState<EditorInputSlots> &\n  Required<Pick<EditorInputProps, 'disabled' | 'textPlugin' | 'history' | 'trimWhiteSpace' | 'editorRef'>> &\n  Partial<Pick<EditorInputProps, 'onPaste'>> & {\n    lexicalInitialConfig: InitialConfigType;\n    defaultValue?: string;\n    handleOnChange: (value: string) => void;\n  };\n\n/**\n * Data passed to the `onChange` callback when the chat input's value changes.\n */\nexport type EditorInputValueData = {\n  value: string;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAkEA;;CAEC"}

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

@@ -8,5 +8,4 @@ _export_star._(require("./EditorInput.types"), exports);
 _export_star._(require("./renderEditorInput"), exports);
 _export_star._(require("./useEditorInput"), exports);
 _export_star._(require("./useEditorInputStyles.styles"), exports);
-_export_star._(require("./useEditorInputContextValues"), exports);
  //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './EditorInput';\nexport * from './EditorInput.types';\nexport * from './renderEditorInput';\nexport * from './useEditorInput';\nexport * from './useEditorInputStyles.styles';\nexport * from './useEditorInputContextValues';\n"],"names":[],"rangeMappings":";;;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA;uBACA"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './EditorInput';\nexport * from './EditorInput.types';\nexport * from './renderEditorInput';\nexport * from './useEditorInput';\nexport * from './useEditorInputStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}

package/lib-commonjs/components/EditorInput/renderEditorInput.js

@@ -12,29 +12,30 @@ const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
 const _reactcomponents = require("@fluentui/react-components");
 const _reacttexteditor = require("@fluentui-copilot/react-text-editor");
 const _reactchatinputplugins = require("@fluentui-copilot/react-chat-input-plugins");
-const renderEditorInput_unstable = (state, contextValues)=>{
+const renderEditorInput_unstable = (state)=>{
     (0, _reactcomponents.assertSlots)(state);
     return /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {
-        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_reacttexteditor.LexicalComposerContext.Provider, {
-            value: contextValues.lexicalComposer,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_reacttexteditor.LexicalComposer, {
+            initialConfig: state.lexicalInitialConfig,
             children: [
                 /*#__PURE__*/ (0, _jsxruntime.jsx)(state.textPlugin, {
                     contentEditable: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.input, {}),
-                    ErrorBoundary: _reacttexteditor.LexicalErrorBoundary
+                    ErrorBoundary: _reacttexteditor.LexicalErrorBoundary,
+                    placeholder: state.placeholderValue ? /*#__PURE__*/ (0, _jsxruntime.jsx)(state.placeholderValue, {}) : null
                 }),
                 /*#__PURE__*/ (0, _jsxruntime.jsxs)(_jsxruntime.Fragment, {
                     children: [
-                        state.placeholderValue ? /*#__PURE__*/ (0, _jsxruntime.jsx)(state.placeholderValue, {}) : null,
                         /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactchatinputplugins.BasicFunctionalityPlugin, {
                             onContentChange: state.handleOnChange,
                             onPaste: state.onPaste,
-                            trimWhitespace: state.trimWhiteSpace
+                            trimWhitespace: state.trimWhiteSpace,
+                            defaultValue: state.defaultValue
                         }),
-                        state.history && /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacttexteditor.LexicalHistoryPlugin, {}),
-                        state.editorRef && /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacttexteditor.LexicalEditorRefPlugin, {
-                            editorRef: state.editorRef
-                        })
+                        state.history && /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacttexteditor.LexicalHistoryPlugin, {})
                     ]
+                }),
+                /*#__PURE__*/ (0, _jsxruntime.jsx)(_reacttexteditor.LexicalEditorRefPlugin, {
+                    editorRef: state.editorRef
                 })
             ]
         })

package/lib-commonjs/components/EditorInput/renderEditorInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderEditorInput.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { EditorInputState, EditorInputSlots, EditorInputContextValues } from './EditorInput.types';\nimport {\n  LexicalErrorBoundary,\n  LexicalEditorRefPlugin,\n  LexicalHistoryPlugin,\n  LexicalComposerContext,\n} from '@fluentui-copilot/react-text-editor';\nimport { BasicFunctionalityPlugin } from '@fluentui-copilot/react-chat-input-plugins';\n\n/**\n * Render the final JSX of EditorInput\n */\nexport const renderEditorInput_unstable = (state: EditorInputState, contextValues: EditorInputContextValues) => {\n  assertSlots<EditorInputSlots>(state);\n\n  return (\n    <state.root>\n      <LexicalComposerContext.Provider value={contextValues.lexicalComposer}>\n        <state.textPlugin contentEditable={<state.input />} ErrorBoundary={LexicalErrorBoundary} />\n        <>\n          {state.placeholderValue ? <state.placeholderValue /> : null}\n          <BasicFunctionalityPlugin\n            onContentChange={state.handleOnChange}\n            onPaste={state.onPaste}\n            trimWhitespace={state.trimWhiteSpace}\n          />\n          {state.history && <LexicalHistoryPlugin />}\n          {state.editorRef && <LexicalEditorRefPlugin editorRef={state.editorRef} />}\n        </>\n      </LexicalComposerContext.Provider>\n    </state.root>\n  );\n};\n"],"names":["assertSlots","state","_jsx","root","LexicalComposerContext","value","contextValues","lexicalComposer","Provider","textPlugin","contentEditable","ErrorBoundary","LexicalErrorBoundary","placeholderValue","BasicFunctionalityPlugin","onContentChange","editorRef","LexicalEditorRefPlugin","onPaste"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAiBEA;;;eAAAA;;;4BAhBF;iCAE4B;iCAOrB;uCACkC;AAMvCA,MAAAA,6BAA8BC,CAAAA,OAAAA;oCAE9B,EAAAA;sBAEI,GAAAC,IAAAA,eAAA,EAAAD,MAAAE,IAAA,EAACC;kBAAgCC,WAAOC,GAAAA,IAAAA,gBAAAA,EAAcC,uCAAe,CAAAC,QAAA,EAAA;;;8BACnEN,IAAAA,eAAA,EAACD,MAAMQ,UAAU,EAAA;qCAACC,WAAAA,GAAAA,IAAAA,eAAAA,EAAAA,MAAAA,KAAiB,EAACT,CAAAA;mCAAgBU,qCAAeC;;;;8CACnE,GAAA,WAAA,GAAAV,IAAAA,eAAA,EAAAD,MAAAY,gBAAA,EAAA,CAAA,KAAA;wBAAA,WAAA,GAAAX,IAAAA,eAAA,EAAAY,+CAAA,EAAA;;2CACGb,OAAMY;gEACNC;;yCACCC,WAAAA,GAAAA,IAAAA,eAAiBd,EAAAA,qCAAoB,EAAA,CAAA;wBAAAA,MAAAe,SAAA,IAAA,WAAA,GAAAd,IAAAA,eAAA,EAAAe,uCAAA,EAAA;sDACrCC"}
+{"version":3,"sources":["renderEditorInput.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { EditorInputState, EditorInputSlots } from './EditorInput.types';\nimport {\n  LexicalComposer,\n  LexicalErrorBoundary,\n  LexicalEditorRefPlugin,\n  LexicalHistoryPlugin,\n} from '@fluentui-copilot/react-text-editor';\nimport { BasicFunctionalityPlugin } from '@fluentui-copilot/react-chat-input-plugins';\n\n/**\n * Render the final JSX of EditorInput\n */\nexport const renderEditorInput_unstable = (state: EditorInputState) => {\n  assertSlots<EditorInputSlots>(state);\n\n  return (\n    <state.root>\n      <LexicalComposer initialConfig={state.lexicalInitialConfig}>\n        <state.textPlugin\n          contentEditable={<state.input />}\n          ErrorBoundary={LexicalErrorBoundary}\n          placeholder={state.placeholderValue ? <state.placeholderValue /> : null}\n        />\n        <>\n          <BasicFunctionalityPlugin\n            onContentChange={state.handleOnChange}\n            onPaste={state.onPaste}\n            trimWhitespace={state.trimWhiteSpace}\n            defaultValue={state.defaultValue}\n          />\n          {state.history && <LexicalHistoryPlugin />}\n        </>\n        <LexicalEditorRefPlugin editorRef={state.editorRef} />\n      </LexicalComposer>\n    </state.root>\n  );\n};\n"],"names":["assertSlots","state","_jsx","root","LexicalComposer","initialConfig","lexicalInitialConfig","textPlugin","contentEditable","ErrorBoundary","LexicalErrorBoundary","placeholder","placeholderValue","BasicFunctionalityPlugin","onContentChange","onPaste","trimWhitespace","defaultValue","editorRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAiBEA;;;eAAAA;;;4BAhBF;iCAE4B;iCAOrB;uCACkC;AAMvCA,MAAAA,6BAA8BC,CAAAA;oCAE9B,EAAAA;sBAEI,GAAAC,IAAAA,eAAA,EAAAD,MAAAE,IAAA,EAACC;kBAAgBC,WAAAA,GAAeJ,IAAAA,gBAAAA,EAAMK,gCAAAA,EAAAA;;;8BACpCJ,IAAAA,eAAA,EAACD,MAAMM,UAAU,EAAA;qCACfC,WAAAA,GAAAA,IAAAA,eAAAA,EAAAA,MAAAA,KAAiB,EAACP,CAAAA;mCAClBQ,qCAAeC;iCACfC,MAAAA,gBAAmBC,GAAAA,WAAgB,GAAAV,IAAAA,eAAA,EAAAD,MAAAW,gBAAUA,EAAAA,CAAAA,KAAAA;;;;mCAE/C,GAAAV,IAAAA,eAAA,EAAAW,+CAAA,EAAA;;;kDAEIC,cAAiBb;gDACjBc,YAASd;;yCACTe,WAAAA,GAAAA,IAAAA,eAAgBf,EAAAA,qCAAoB,EAAA,CAAA;qBAAA;;mDACpCgB,uCAAoBA,EAAAA;;;;;;gDAIiBC"}