@fluentui-copilot/react-editor-input 0.3.2 → 0.3.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.json CHANGED
@@ -1,6 +1,44 @@
1
1
  {
2
2
  "name": "@fluentui-copilot/react-editor-input",
3
3
  "entries": [
4
+ {
5
+ "date": "Wed, 18 Dec 2024 08:54:34 GMT",
6
+ "tag": "@fluentui-copilot/react-editor-input_v0.3.4",
7
+ "version": "0.3.4",
8
+ "comments": {
9
+ "patch": [
10
+ {
11
+ "author": "makotom@microsoft.com",
12
+ "package": "@fluentui-copilot/react-editor-input",
13
+ "commit": "cc179462507d13546b93c6330be325014286998c",
14
+ "comment": "chore: Banning * exports."
15
+ }
16
+ ]
17
+ }
18
+ },
19
+ {
20
+ "date": "Tue, 10 Dec 2024 20:22:06 GMT",
21
+ "tag": "@fluentui-copilot/react-editor-input_v0.3.3",
22
+ "version": "0.3.3",
23
+ "comments": {
24
+ "none": [
25
+ {
26
+ "author": "owcampbe@microsoft.com",
27
+ "package": "@fluentui-copilot/react-editor-input",
28
+ "commit": "c5ad8962a0e32fedd5d915d15107f0e1398b7aae",
29
+ "comment": "chore: Applying package updates."
30
+ }
31
+ ],
32
+ "patch": [
33
+ {
34
+ "author": "email not defined",
35
+ "package": "@fluentui-copilot/react-editor-input",
36
+ "commit": "cf3d5b9f774d9fddc2fd73e4bd88af7ac655071b",
37
+ "comment": "Patch: Enables support for rich text formatting when pasting formatted content"
38
+ }
39
+ ]
40
+ }
41
+ },
4
42
  {
5
43
  "date": "Thu, 31 Oct 2024 17:41:07 GMT",
6
44
  "tag": "@fluentui-copilot/react-editor-input_v0.3.1",
package/CHANGELOG.md CHANGED
@@ -1,9 +1,27 @@
1
1
  # Change Log - @fluentui-copilot/react-editor-input
2
2
 
3
- This log was last generated on Thu, 31 Oct 2024 17:41:07 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 18 Dec 2024 08:54:34 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [0.3.4](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-editor-input_v0.3.4)
8
+
9
+ Wed, 18 Dec 2024 08:54:34 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-editor-input_v0.3.3..@fluentui-copilot/react-editor-input_v0.3.4)
11
+
12
+ ### Patches
13
+
14
+ - chore: Banning * exports. ([PR #2477](https://github.com/microsoft/fluentai/pull/2477) by makotom@microsoft.com)
15
+
16
+ ## [0.3.3](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-editor-input_v0.3.3)
17
+
18
+ Tue, 10 Dec 2024 20:22:06 GMT
19
+ [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-editor-input_v0.3.1..@fluentui-copilot/react-editor-input_v0.3.3)
20
+
21
+ ### Patches
22
+
23
+ - Patch: Enables support for rich text formatting when pasting formatted content ([PR #2426](https://github.com/microsoft/fluentai/pull/2426) by email not defined)
24
+
7
25
  ## [0.3.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-editor-input_v0.3.1)
8
26
 
9
27
  Thu, 31 Oct 2024 17:41:07 GMT
package/dist/index.d.ts CHANGED
@@ -53,6 +53,10 @@ export declare type EditorInputProps = Omit<ComponentProps<Partial<EditorInputSl
53
53
  */
54
54
  history?: boolean;
55
55
  editorRef?: React.RefObject<LexicalEditor>;
56
+ /**
57
+ * Customize the default styles of elements inserted by Lexical in the editor.
58
+ */
59
+ customTheme?: InitialConfigType['theme'];
56
60
  };
57
61
 
58
62
  export declare type EditorInputSlots = {
@@ -1,2 +1,2 @@
1
- export * from './components/EditorInput/index';
1
+ export { EditorInput, editorInputClassNames, renderEditorInput_unstable, useEditorInputStyles_unstable, useEditorInput_unstable, useInputClassName, useLexicalStyles, usePlaceholderClassName } from './components/EditorInput/index';
2
2
  //# sourceMappingURL=EditorInput.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["EditorInput.ts"],"sourcesContent":["export * from './components/EditorInput/index';\n"],"names":[],"rangeMappings":"","mappings":"AAAA,cAAc,iCAAiC"}
1
+ {"version":3,"sources":["EditorInput.ts"],"sourcesContent":["export type { EditorInputProps, EditorInputSlots, EditorInputState, EditorInputValueData } from './components/EditorInput/index';\nexport { EditorInput, editorInputClassNames, renderEditorInput_unstable, useEditorInputStyles_unstable, useEditorInput_unstable, useInputClassName, useLexicalStyles, usePlaceholderClassName } from './components/EditorInput/index';\n"],"names":["EditorInput","editorInputClassNames","renderEditorInput_unstable","useEditorInputStyles_unstable","useEditorInput_unstable","useInputClassName","useLexicalStyles","usePlaceholderClassName"],"rangeMappings":"","mappings":"AACA,SAASA,WAAW,EAAEC,qBAAqB,EAAEC,0BAA0B,EAAEC,6BAA6B,EAAEC,uBAAuB,EAAEC,iBAAiB,EAAEC,gBAAgB,EAAEC,uBAAuB,QAAQ,iCAAiC"}
@@ -1 +1 @@
1
- {"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"}
1
+ {"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 * Customize the default styles of elements inserted by Lexical in the editor.\n */\n customTheme?: InitialConfigType['theme'];\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":"AAuEA;;CAEC,GACD,WAEE"}
@@ -1,6 +1,5 @@
1
- export * from './EditorInput';
2
- export * from './EditorInput.types';
3
- export * from './renderEditorInput';
4
- export * from './useEditorInput';
5
- export * from './useEditorInputStyles.styles';
1
+ export { EditorInput } from './EditorInput';
2
+ export { renderEditorInput_unstable } from './renderEditorInput';
3
+ export { useEditorInput_unstable } from './useEditorInput';
4
+ export { editorInputClassNames, useEditorInputStyles_unstable, useInputClassName, useLexicalStyles, usePlaceholderClassName } from './useEditorInputStyles.styles';
6
5
  //# sourceMappingURL=index.js.map
@@ -1 +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';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,sBAAsB;AACpC,cAAc,sBAAsB;AACpC,cAAc,mBAAmB;AACjC,cAAc,gCAAgC"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export { EditorInput } from './EditorInput';\nexport type { EditorInputProps, EditorInputSlots, EditorInputState, EditorInputValueData } from './EditorInput.types';\nexport { renderEditorInput_unstable } from './renderEditorInput';\nexport { useEditorInput_unstable } from './useEditorInput';\nexport { editorInputClassNames, useEditorInputStyles_unstable, useInputClassName, useLexicalStyles, usePlaceholderClassName } from './useEditorInputStyles.styles';\n"],"names":["EditorInput","renderEditorInput_unstable","useEditorInput_unstable","editorInputClassNames","useEditorInputStyles_unstable","useInputClassName","useLexicalStyles","usePlaceholderClassName"],"rangeMappings":";;;","mappings":"AAAA,SAASA,WAAW,QAAQ,gBAAgB;AAE5C,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,qBAAqB,EAAEC,6BAA6B,EAAEC,iBAAiB,EAAEC,gBAAgB,EAAEC,uBAAuB,QAAQ,gCAAgC"}
@@ -19,7 +19,8 @@ export const useEditorInput_unstable = (props, ref) => {
19
19
  trimWhiteSpace = false,
20
20
  textPlugin = LexicalPlainTextPlugin,
21
21
  history = true,
22
- editorRef: userEditorRef
22
+ editorRef: userEditorRef,
23
+ customTheme
23
24
  } = props;
24
25
  const {
25
26
  root,
@@ -114,7 +115,8 @@ export const useEditorInput_unstable = (props, ref) => {
114
115
  namespace: 'fai-EditorInput',
115
116
  onError: console.error,
116
117
  nodes: customNodes,
117
- editorState: defaultValueFunction
118
+ editorState: defaultValueFunction,
119
+ theme: customTheme
118
120
  },
119
121
  editorRef,
120
122
  disabled,
@@ -1 +1 @@
1
- {"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"}
1
+ {"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 customTheme,\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 theme: customTheme,\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","customTheme","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","theme"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -2,6 +2,37 @@
2
2
  Object.defineProperty(exports, "__esModule", {
3
3
  value: true
4
4
  });
5
- const _export_star = require("@swc/helpers/_/_export_star");
6
- _export_star._(require("./components/EditorInput/index"), exports);
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: all[name]
9
+ });
10
+ }
11
+ _export(exports, {
12
+ EditorInput: function() {
13
+ return _index.EditorInput;
14
+ },
15
+ editorInputClassNames: function() {
16
+ return _index.editorInputClassNames;
17
+ },
18
+ renderEditorInput_unstable: function() {
19
+ return _index.renderEditorInput_unstable;
20
+ },
21
+ useEditorInputStyles_unstable: function() {
22
+ return _index.useEditorInputStyles_unstable;
23
+ },
24
+ useEditorInput_unstable: function() {
25
+ return _index.useEditorInput_unstable;
26
+ },
27
+ useInputClassName: function() {
28
+ return _index.useInputClassName;
29
+ },
30
+ useLexicalStyles: function() {
31
+ return _index.useLexicalStyles;
32
+ },
33
+ usePlaceholderClassName: function() {
34
+ return _index.usePlaceholderClassName;
35
+ }
36
+ });
37
+ const _index = require("./components/EditorInput/index");
7
38
  //# sourceMappingURL=EditorInput.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["EditorInput.ts"],"sourcesContent":["export * from './components/EditorInput/index';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
1
+ {"version":3,"sources":["EditorInput.ts"],"sourcesContent":["export type { EditorInputProps, EditorInputSlots, EditorInputState, EditorInputValueData } from './components/EditorInput/index';\nexport { EditorInput, editorInputClassNames, renderEditorInput_unstable, useEditorInputStyles_unstable, useEditorInput_unstable, useInputClassName, useLexicalStyles, usePlaceholderClassName } from './components/EditorInput/index';\n"],"names":["EditorInput","editorInputClassNames","renderEditorInput_unstable","useEditorInputStyles_unstable","useEditorInput_unstable","useInputClassName","useLexicalStyles","usePlaceholderClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IACSA,WAAW;eAAXA,kBAAW;;IAAEC,qBAAqB;eAArBA,4BAAqB;;IAAEC,0BAA0B;eAA1BA,iCAA0B;;IAAEC,6BAA6B;eAA7BA,oCAA6B;;IAAEC,uBAAuB;eAAvBA,8BAAuB;;IAAEC,iBAAiB;eAAjBA,wBAAiB;;IAAEC,gBAAgB;eAAhBA,uBAAgB;;IAAEC,uBAAuB;eAAvBA,8BAAuB;;;uBAAQ"}
@@ -1 +1 @@
1
- {"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"}
1
+ {"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 * Customize the default styles of elements inserted by Lexical in the editor.\n */\n customTheme?: InitialConfigType['theme'];\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":"AAuEA;;CAEC"}
@@ -2,10 +2,40 @@
2
2
  Object.defineProperty(exports, "__esModule", {
3
3
  value: true
4
4
  });
5
- const _export_star = require("@swc/helpers/_/_export_star");
6
- _export_star._(require("./EditorInput"), exports);
7
- _export_star._(require("./EditorInput.types"), exports);
8
- _export_star._(require("./renderEditorInput"), exports);
9
- _export_star._(require("./useEditorInput"), exports);
10
- _export_star._(require("./useEditorInputStyles.styles"), exports);
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: all[name]
9
+ });
10
+ }
11
+ _export(exports, {
12
+ EditorInput: function() {
13
+ return _EditorInput.EditorInput;
14
+ },
15
+ editorInputClassNames: function() {
16
+ return _useEditorInputStylesstyles.editorInputClassNames;
17
+ },
18
+ renderEditorInput_unstable: function() {
19
+ return _renderEditorInput.renderEditorInput_unstable;
20
+ },
21
+ useEditorInputStyles_unstable: function() {
22
+ return _useEditorInputStylesstyles.useEditorInputStyles_unstable;
23
+ },
24
+ useEditorInput_unstable: function() {
25
+ return _useEditorInput.useEditorInput_unstable;
26
+ },
27
+ useInputClassName: function() {
28
+ return _useEditorInputStylesstyles.useInputClassName;
29
+ },
30
+ useLexicalStyles: function() {
31
+ return _useEditorInputStylesstyles.useLexicalStyles;
32
+ },
33
+ usePlaceholderClassName: function() {
34
+ return _useEditorInputStylesstyles.usePlaceholderClassName;
35
+ }
36
+ });
37
+ const _EditorInput = require("./EditorInput");
38
+ const _renderEditorInput = require("./renderEditorInput");
39
+ const _useEditorInput = require("./useEditorInput");
40
+ const _useEditorInputStylesstyles = require("./useEditorInputStyles.styles");
11
41
  //# sourceMappingURL=index.js.map
@@ -1 +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';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export { EditorInput } from './EditorInput';\nexport type { EditorInputProps, EditorInputSlots, EditorInputState, EditorInputValueData } from './EditorInput.types';\nexport { renderEditorInput_unstable } from './renderEditorInput';\nexport { useEditorInput_unstable } from './useEditorInput';\nexport { editorInputClassNames, useEditorInputStyles_unstable, useInputClassName, useLexicalStyles, usePlaceholderClassName } from './useEditorInputStyles.styles';\n"],"names":["EditorInput","editorInputClassNames","renderEditorInput_unstable","useEditorInputStyles_unstable","useEditorInput_unstable","useInputClassName","useLexicalStyles","usePlaceholderClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,WAAW;eAAXA,wBAAW;;IAIXC,qBAAqB;eAArBA,iDAAqB;;IAFrBC,0BAA0B;eAA1BA,6CAA0B;;IAEHC,6BAA6B;eAA7BA,yDAA6B;;IADpDC,uBAAuB;eAAvBA,uCAAuB;;IAC+BC,iBAAiB;eAAjBA,6CAAiB;;IAAEC,gBAAgB;eAAhBA,4CAAgB;;IAAEC,uBAAuB;eAAvBA,mDAAuB;;;6BAJ/F;mCAEe;gCACH;4CAC2F"}
@@ -15,7 +15,7 @@ const _chatinputplugins = require("@fluentui-copilot/chat-input-plugins");
15
15
  const _reacttexteditor = require("@fluentui-copilot/react-text-editor");
16
16
  const _reactutilities = require("@fluentui/react-utilities");
17
17
  const useEditorInput_unstable = (props, ref)=>{
18
- const { onChange, onPaste, trimWhiteSpace = false, textPlugin = _reacttexteditor.LexicalPlainTextPlugin, history = true, editorRef: userEditorRef } = props;
18
+ const { onChange, onPaste, trimWhiteSpace = false, textPlugin = _reacttexteditor.LexicalPlainTextPlugin, history = true, editorRef: userEditorRef, customTheme } = props;
19
19
  const { root, primary } = (0, _reactcomponents.getPartitionedNativeProps)({
20
20
  primarySlotTagName: 'span',
21
21
  props,
@@ -128,7 +128,8 @@ const useEditorInput_unstable = (props, ref)=>{
128
128
  namespace: 'fai-EditorInput',
129
129
  onError: console.error,
130
130
  nodes: customNodes,
131
- editorState: defaultValueFunction
131
+ editorState: defaultValueFunction,
132
+ theme: customTheme
132
133
  },
133
134
  editorRef,
134
135
  disabled,
@@ -1 +1 @@
1
- {"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":["onChange","trimWhiteSpace","primarySlotTagName","props","excludedPropNames","LexicalPlainTextPlugin","userEditorRef","root","primary","getPartitionedNativeProps","setDisabled","editorRef","customNodes","SentinelNode","disabled","useControllableState","_editorRef_current","current","setRootElement","span","setEditable","useIsomorphicLayoutEffect","mergeRegister","isEditable","whiteSpace","handleOnChange","React","useCallback","newValue","value","defaultValue","undefined","placeholderValue","id","placeholderId","input","slot","always","defaultProps","elementType","components","ref","spanRef","contentEditable","tabIndex","suppressContentEditableWarning","lexicalInitialConfig"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAyBIA;;;eAAAA;;;;iEAzBmB;iCAOhB;kCAEsB;iCAEyB;gCACjB;AAYnC,MACEA,0BAEAC,CAAAA,OAAAA;UAKF,UACEC,SACAC,mBACAC,KAAAA,eAAoBC,uCAAA,YAAY,IAAA,aAAWC,aAAA;UAC7C,EAEAC,IAAA,EACAC,OAAA,KACAC,IAAAA,0CAAA,EAAA;QACAP,oBAAiBQ;;2BAED;YAAA;YAAA;YAAA;SAAA;;UAGhBC,YAAMC,IAAAA,8BAAoBA,EAAAA,OAAAA,MAAc,CAAA,OAAAN;qFAAqB;kDAAEO;UAAgB,CAAAC,UAAAJ,YAAA,GAAAK,IAAAA,oCAAA,EAAA;eAACF,MAAAA,QAAAA;sBAAa;;wBAIzFV,MAAAS,WAAA,GAAA;WAAAT,MAAAS,WAAyC;QAAAC,8BAAA;KAAA,GAAA;QAAAA,8BAAA;KAAA;UACzCF,UAAAA,OAAAA,WAAAA,CAAAA,CAAAA;YACF,yCACA;;QAAWK,CAAAA,qBAAAL,UAAAM,OAAA,MAAA,QAAAD,uBAAA,KAAA,IAAA,KAAA,IAAAA,mBAAAE,cAAA,CAAAC;OAGb;QAAAR;KAAA;2CAC0B;kDACVM,EAAAA;sBACZN,OAAAA,EAAAA;;kCACFA,UAAAM,OAAA,MAAA,QAAAD,uBAAA,KAAA,IAAA,KAAA,IAAAA,mBAAAI,WAAA,CAAA,CAAAN;QACF;;;KAAIA;kDAAS,EAAA;QAEbO,IAAAA,UAAAA,OAAAA,EAAAA;gBACEL;qDAKIL,EAAAA,UAAAA,OAAAA,CAAAA,wBAAAA,CAAAA,CAAAA;4BAJKW,CAAAA;sCAEUC,UAAAA,OAAAA,MAAAA,QAAAA,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAAA,oBAAAA,CAAAA,CAAAA;oBACf,CAAAhB,MACAI;;;wEAGE;wGAEwD;0BACxD,CAAAa,UAAA,GAAA;;;;;KAIN;UACCC,iBAAAC,OAAAC,WAAA,CAAAC,CAAAA;qBAACjB,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAAA,CAAAA,GAAAA;YAAUkB,OAAAD;QAEd;;;KAEI5B;0BAAwB4B,qBAAAA,GAAAA,CAAAA;YAAS,OAAAzB,MAAA2B,YAAA,KAAA,YAAA;YACnC,OACA;gBAAAC;gBAAA5B,MAAA2B,YAAA;aAAA;;eAAU;YAAA3B,MAAA2B,YAAA;YAAAC;SAAA;;UAIVC,mBAAiBF,qBAAAA,CAAAA,QAAY,CAAA3B,MAAK6B,gBAAY,EAAA;qBAC5C;;0BAAyBF,IAAAA,sBAAAA,EAAAA,0BAAYE,qBAAA,QAAAA,qBAAA,KAAA,IAAA,KAAA,IAAAA,iBAAAC,EAAA;0BAAC;yBACxCA,EAAA,GAAAC;;;oBAC4BH;kBAAU;YACxCI,OAAA;YAEAH,kBAAMA;;QAA+EzB,MAAA6B,qBAAA,CAAAC,MAAA,CAAAlC,MAAAI,IAAA,EAAA;YACrF+B,cAAMJ;gBACFF,GAAAA,IAAAA;;YAEJO,aAAA;QAEA;eACEC,qBAAAA,CAAAA,MAAY,CAAArC,MAAAgC,KAAA,EAAA;0BACJ;qBACNA,IAAAA,8BAAO,EAAAM,KAAAC;sBACPV;gBACFW,iBAAA,CAAA7B;gBACAP,iBAAiBO,WAAW,OAAEiB;0BAAEO,WAAc,CAAA,IAAA;;gDAAU;0BAAGC;gBAAoB,oBAAA/B,OAAA,CAAA,mBAAA,GAAA,CAAA,EAAAA,OAAA,CAAA,mBAAA,CAAA,CAAA,EAAA0B,cAAA,CAAA,GAAAA;;yBAE7EI;;;8BAGEK;uBACA;6BACAC,KAAU9B;;yBAEV+B;;;;;;;sBASJC;;;;6CAKA"}
1
+ {"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 customTheme,\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 theme: customTheme,\n },\n editorRef,\n disabled,\n textPlugin,\n onPaste,\n handleOnChange,\n defaultValue: defaultString,\n trimWhiteSpace,\n history,\n };\n};\n"],"names":["onChange","trimWhiteSpace","primarySlotTagName","props","excludedPropNames","LexicalPlainTextPlugin","userEditorRef","root","primary","getPartitionedNativeProps","setDisabled","disabled","customNodes","React","useRef","SentinelNode","initialState","spanRef","editorRef","_editorRef_current","current","setRootElement","span","useIsomorphicLayoutEffect","setEditable","mergeRegister","registerEditableListener","registerRootListener","whiteSpace","value","handleOnChange","defaultString","defaultValueFunction","defaultValue","slot","optional","placeholderValue","undefined","useId","id","placeholderId","input","defaultProps","elementType","role","ref","tabIndex","onError"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui-copilot/react-editor-input",
3
- "version": "0.3.2",
3
+ "version": "0.3.4",
4
4
  "description": "a base rich editor input.",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -12,9 +12,9 @@
12
12
  },
13
13
  "license": "MIT",
14
14
  "dependencies": {
15
- "@fluentui-copilot/chat-input-plugins": "^0.3.2",
16
- "@fluentui-copilot/react-chat-input-plugins": "^0.3.2",
17
- "@fluentui-copilot/react-text-editor": "^0.3.1",
15
+ "@fluentui-copilot/chat-input-plugins": "^0.3.4",
16
+ "@fluentui-copilot/react-chat-input-plugins": "^0.3.4",
17
+ "@fluentui-copilot/react-text-editor": "^0.3.2",
18
18
  "@swc/helpers": "^0.5.1"
19
19
  },
20
20
  "peerDependencies": {