@fluentui-copilot/react-editor-input 0.4.8 → 0.4.9-hotfix.1

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
@@ -2,7 +2,45 @@
2
2
  "name": "@fluentui-copilot/react-editor-input",
3
3
  "entries": [
4
4
  {
5
- "date": "Sat, 19 Apr 2025 00:04:02 GMT",
5
+ "date": "Wed, 06 Aug 2025 16:01:29 GMT",
6
+ "tag": "@fluentui-copilot/react-editor-input_v0.4.9-hotfix.1",
7
+ "version": "0.4.9-hotfix.1",
8
+ "comments": {
9
+ "prerelease": [
10
+ {
11
+ "author": "hochelmartin@gmail.com",
12
+ "package": "@fluentui-copilot/react-editor-input",
13
+ "commit": "cb43a5bd5258c678c965fddff7e7d5a95f9d0396",
14
+ "comment": "release: prepare hotfix 0.25.3-hotfix.1"
15
+ }
16
+ ]
17
+ }
18
+ },
19
+ {
20
+ "date": "Wed, 30 Apr 2025 01:47:48 GMT",
21
+ "tag": "@fluentui-copilot/react-editor-input_v0.4.9",
22
+ "version": "0.4.9",
23
+ "comments": {
24
+ "none": [
25
+ {
26
+ "author": "tristan.watanabe@gmail.com",
27
+ "package": "@fluentui-copilot/react-editor-input",
28
+ "commit": "1391e0a7243d050db30fcc27547fd3e91df0162c",
29
+ "comment": "chore: update tsconfig to remove allowSyntheticDefaultImports to enforce named imports."
30
+ }
31
+ ],
32
+ "patch": [
33
+ {
34
+ "author": "owcampbe@microsoft.com",
35
+ "package": "@fluentui-copilot/react-editor-input",
36
+ "commit": "5a9efb11481fbe2c9bd25c8825ec4a9b991050ab",
37
+ "comment": "chore: Bump @fluentui/react-components to 9.58.3."
38
+ }
39
+ ]
40
+ }
41
+ },
42
+ {
43
+ "date": "Sat, 19 Apr 2025 00:05:39 GMT",
6
44
  "tag": "@fluentui-copilot/react-editor-input_v0.4.8",
7
45
  "version": "0.4.8",
8
46
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,30 @@
1
1
  # Change Log - @fluentui-copilot/react-editor-input
2
2
 
3
- This log was last generated on Sat, 19 Apr 2025 00:04:02 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 06 Aug 2025 16:01:29 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [0.4.9-hotfix.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-editor-input_v0.4.9-hotfix.1)
8
+
9
+ Wed, 06 Aug 2025 16:01:29 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-editor-input_v0.4.9..@fluentui-copilot/react-editor-input_v0.4.9-hotfix.1)
11
+
12
+ ### Changes
13
+
14
+ - release: prepare hotfix 0.25.3-hotfix.1 ([PR #3280](https://github.com/microsoft/fluentai/pull/3280) by hochelmartin@gmail.com)
15
+
16
+ ## [0.4.9](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-editor-input_v0.4.9)
17
+
18
+ Wed, 30 Apr 2025 01:47:48 GMT
19
+ [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-editor-input_v0.4.8..@fluentui-copilot/react-editor-input_v0.4.9)
20
+
21
+ ### Patches
22
+
23
+ - chore: Bump @fluentui/react-components to 9.58.3. ([PR #2963](https://github.com/microsoft/fluentai/pull/2963) by owcampbe@microsoft.com)
24
+
7
25
  ## [0.4.8](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-editor-input_v0.4.8)
8
26
 
9
- Sat, 19 Apr 2025 00:04:02 GMT
27
+ Sat, 19 Apr 2025 00:05:39 GMT
10
28
  [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-editor-input_v0.4.4..@fluentui-copilot/react-editor-input_v0.4.8)
11
29
 
12
30
  ### Patches
@@ -1,2 +1 @@
1
1
  export { EditorInput, editorInputClassNames, renderEditorInput_unstable, useEditorInputStyles_unstable, useEditorInput_unstable, useInputClassName, useLexicalStyles, usePlaceholderClassName } from './components/EditorInput/index';
2
- //# sourceMappingURL=EditorInput.js.map
@@ -3,10 +3,9 @@ import { useEditorInput_unstable } from './useEditorInput';
3
3
  import { renderEditorInput_unstable } from './renderEditorInput';
4
4
  import { useEditorInputStyles_unstable } from './useEditorInputStyles.styles';
5
5
  // EditorInput component - TODO: add more docs
6
- export const EditorInput = /*#__PURE__*/React.forwardRef((props, ref) => {
7
- const state = useEditorInput_unstable(props, ref);
8
- useEditorInputStyles_unstable(state);
9
- return renderEditorInput_unstable(state);
6
+ export const EditorInput = /*#__PURE__*/ React.forwardRef((props, ref)=>{
7
+ const state = useEditorInput_unstable(props, ref);
8
+ useEditorInputStyles_unstable(state);
9
+ return renderEditorInput_unstable(state);
10
10
  });
11
11
  EditorInput.displayName = 'EditorInput';
12
- //# sourceMappingURL=EditorInput.js.map
@@ -1,4 +1,3 @@
1
1
  /**
2
2
  * Data passed to the `onChange` callback when the chat input's value changes.
3
- */export {};
4
- //# sourceMappingURL=EditorInput.types.js.map
3
+ */ export { };
@@ -2,4 +2,3 @@ export { EditorInput } from './EditorInput';
2
2
  export { renderEditorInput_unstable } from './renderEditorInput';
3
3
  export { useEditorInput_unstable } from './useEditorInput';
4
4
  export { editorInputClassNames, useEditorInputStyles_unstable, useInputClassName, useLexicalStyles, usePlaceholderClassName } from './useEditorInputStyles.styles';
5
- //# sourceMappingURL=index.js.map
@@ -1,31 +1,36 @@
1
- import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@fluentui/react-jsx-runtime/jsx-runtime";
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@fluentui/react-jsx-runtime/jsx-runtime";
2
2
  import { assertSlots } from '@fluentui/react-components';
3
3
  import { LexicalComposer, LexicalErrorBoundary, LexicalEditorRefPlugin, LexicalHistoryPlugin } from '@fluentui-copilot/react-text-editor';
4
4
  import { BasicFunctionalityPlugin } from '@fluentui-copilot/react-chat-input-plugins';
5
5
  /**
6
6
  * Render the final JSX of EditorInput
7
- */
8
- export const renderEditorInput_unstable = state => {
9
- assertSlots(state);
10
- return /*#__PURE__*/_jsx(state.root, {
11
- children: /*#__PURE__*/_jsxs(LexicalComposer, {
12
- initialConfig: state.lexicalInitialConfig,
13
- children: [/*#__PURE__*/_jsx(state.textPlugin, {
14
- contentEditable: /*#__PURE__*/_jsx(state.input, {}),
15
- ErrorBoundary: LexicalErrorBoundary,
16
- placeholder: state.placeholderValue ? /*#__PURE__*/_jsx(state.placeholderValue, {}) : null
17
- }), /*#__PURE__*/_jsxs(_Fragment, {
18
- children: [/*#__PURE__*/_jsx(BasicFunctionalityPlugin, {
19
- onContentChange: state.handleOnChange,
20
- onPaste: state.onPaste,
21
- trimWhitespace: state.trimWhiteSpace,
22
- defaultValue: state.defaultValue,
23
- isSentinelNodeEnabled: state.isSentinelNodeEnabled
24
- }), state.history && /*#__PURE__*/_jsx(LexicalHistoryPlugin, {})]
25
- }), /*#__PURE__*/_jsx(LexicalEditorRefPlugin, {
26
- editorRef: state.editorRef
27
- })]
28
- })
29
- });
7
+ */ export const renderEditorInput_unstable = (state)=>{
8
+ assertSlots(state);
9
+ return /*#__PURE__*/ _jsx(state.root, {
10
+ children: /*#__PURE__*/ _jsxs(LexicalComposer, {
11
+ initialConfig: state.lexicalInitialConfig,
12
+ children: [
13
+ /*#__PURE__*/ _jsx(state.textPlugin, {
14
+ contentEditable: /*#__PURE__*/ _jsx(state.input, {}),
15
+ ErrorBoundary: LexicalErrorBoundary,
16
+ placeholder: state.placeholderValue ? /*#__PURE__*/ _jsx(state.placeholderValue, {}) : null
17
+ }),
18
+ /*#__PURE__*/ _jsxs(_Fragment, {
19
+ children: [
20
+ /*#__PURE__*/ _jsx(BasicFunctionalityPlugin, {
21
+ onContentChange: state.handleOnChange,
22
+ onPaste: state.onPaste,
23
+ trimWhitespace: state.trimWhiteSpace,
24
+ defaultValue: state.defaultValue,
25
+ isSentinelNodeEnabled: state.isSentinelNodeEnabled
26
+ }),
27
+ state.history && /*#__PURE__*/ _jsx(LexicalHistoryPlugin, {})
28
+ ]
29
+ }),
30
+ /*#__PURE__*/ _jsx(LexicalEditorRefPlugin, {
31
+ editorRef: state.editorRef
32
+ })
33
+ ]
34
+ })
35
+ });
30
36
  };
31
- //# sourceMappingURL=renderEditorInput.js.map
@@ -3,8 +3,8 @@ import { getPartitionedNativeProps, slot, useId, useIsomorphicLayoutEffect, useM
3
3
  import { SentinelNode } from '@fluentui-copilot/chat-input-plugins';
4
4
  import { LexicalPlainTextPlugin, mergeRegister } from '@fluentui-copilot/react-text-editor';
5
5
  import { useControllableState } from '@fluentui/react-utilities';
6
- export const createInitialEditorState = defaultValue => {
7
- return `{"root":{"type":"root","children":[{"children":[{"text":${JSON.stringify(defaultValue)},"type":"text"}],"type":"paragraph"}]}}`;
6
+ export const createInitialEditorState = (defaultValue)=>{
7
+ return `{"root":{"type":"root","children":[{"children":[{"text":${JSON.stringify(defaultValue)},"type":"text"}],"type":"paragraph"}]}}`;
8
8
  };
9
9
  /**
10
10
  * Create the state required to render EditorInput.
@@ -14,131 +14,144 @@ export const createInitialEditorState = defaultValue => {
14
14
  *
15
15
  * @param props - props from this instance of EditorInput
16
16
  * @param ref - reference to root HTMLElement of EditorInput
17
- */
18
- export const useEditorInput_unstable = (props, ref) => {
19
- const {
20
- onChange,
21
- onPaste,
22
- trimWhiteSpace = false,
23
- textPlugin = LexicalPlainTextPlugin,
24
- history = true,
25
- editorRef: userEditorRef,
26
- customTheme,
27
- isSentinelNodeEnabled = true,
28
- preventDefaultValueOnChange = false
29
- } = props;
30
- const {
31
- root,
32
- primary
33
- } = getPartitionedNativeProps({
34
- primarySlotTagName: 'span',
35
- props,
36
- excludedPropNames: ['onChange', 'onPaste', 'defaultValue']
37
- });
38
- const editorRef = useMergedRefs(React.useRef(null), userEditorRef);
39
- // The disabled state can also be changed by lexical (e.g. by a custom plugin) so
40
- // we use `useControllableState` to coordinate
41
- const [disabled, setDisabled] = useControllableState({
42
- state: props.disabled,
43
- initialState: false
44
- });
45
- const customNodes = props.customNodes ? [...props.customNodes, SentinelNode] : [SentinelNode];
46
- const spanRef = React.useCallback(span => {
47
- var
48
- // Register the `input` span with lexical
49
- _editorRef_current;
50
- (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.setRootElement(span);
51
- }, [editorRef]);
52
- // Update lexical when disabled changes
53
- useIsomorphicLayoutEffect(() => {
54
- if (editorRef.current) {
55
- var _editorRef_current;
56
- (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.setEditable(!disabled);
57
- }
58
- }, [disabled]);
59
- useIsomorphicLayoutEffect(() => {
60
- if (editorRef.current) {
61
- var _editorRef_current;
62
- return mergeRegister(editorRef.current.registerEditableListener(isEditable => {
63
- setDisabled(!isEditable);
64
- }), (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.registerRootListener(root => {
65
- if (!root) {
66
- return;
17
+ */ export const useEditorInput_unstable = (props, ref)=>{
18
+ const { onChange, onPaste, trimWhiteSpace = false, textPlugin = LexicalPlainTextPlugin, history = true, editorRef: userEditorRef, customTheme, isSentinelNodeEnabled = true, preventDefaultValueOnChange = false } = props;
19
+ const { root, primary } = getPartitionedNativeProps({
20
+ primarySlotTagName: 'span',
21
+ props,
22
+ excludedPropNames: [
23
+ 'onChange',
24
+ 'onPaste',
25
+ 'defaultValue'
26
+ ]
27
+ });
28
+ const editorRef = useMergedRefs(React.useRef(null), userEditorRef);
29
+ // The disabled state can also be changed by lexical (e.g. by a custom plugin) so
30
+ // we use `useControllableState` to coordinate
31
+ const [disabled, setDisabled] = useControllableState({
32
+ state: props.disabled,
33
+ initialState: false
34
+ });
35
+ const customNodes = props.customNodes ? [
36
+ ...props.customNodes,
37
+ SentinelNode
38
+ ] : [
39
+ SentinelNode
40
+ ];
41
+ const spanRef = React.useCallback((span)=>{
42
+ var // Register the `input` span with lexical
43
+ _editorRef_current;
44
+ (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.setRootElement(span);
45
+ }, [
46
+ editorRef
47
+ ]);
48
+ // Update lexical when disabled changes
49
+ useIsomorphicLayoutEffect(()=>{
50
+ if (editorRef.current) {
51
+ var _editorRef_current;
52
+ (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.setEditable(!disabled);
67
53
  }
68
- // Remove lexical's inline style so we can apply our own
69
- // Lexical needs the whitespace style to be either `pre` or `pre-wrap` to work correctly
70
- root.style.whiteSpace = '';
71
- }));
72
- }
73
- }, [editorRef]);
74
- const handleOnChange = React.useCallback(newValue => {
75
- onChange === null || onChange === void 0 ? void 0 : onChange({}, {
76
- value: newValue
54
+ }, [
55
+ disabled
56
+ ]);
57
+ useIsomorphicLayoutEffect(()=>{
58
+ if (editorRef.current) {
59
+ var _editorRef_current;
60
+ return mergeRegister(editorRef.current.registerEditableListener((isEditable)=>{
61
+ setDisabled(!isEditable);
62
+ }), (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.registerRootListener((root)=>{
63
+ if (!root) {
64
+ return;
65
+ }
66
+ // Remove lexical's inline style so we can apply our own
67
+ // Lexical needs the whitespace style to be either `pre` or `pre-wrap` to work correctly
68
+ root.style.whiteSpace = '';
69
+ }));
70
+ }
71
+ }, [
72
+ editorRef
73
+ ]);
74
+ const handleOnChange = React.useCallback((newValue)=>{
75
+ onChange === null || onChange === void 0 ? void 0 : onChange({}, {
76
+ value: newValue
77
+ });
78
+ }, [
79
+ onChange
80
+ ]);
81
+ const [defaultString, lexicalEditorStateDefaultValue] = React.useMemo(()=>{
82
+ if (typeof props.defaultValue === 'function') {
83
+ return [
84
+ undefined,
85
+ props.defaultValue
86
+ ];
87
+ }
88
+ if (preventDefaultValueOnChange && props.defaultValue !== undefined) {
89
+ // Any method of providing a default value to lexical which inserts it after initialization
90
+ // will trigger a text content change.
91
+ // Providing a default value as a stringified editorState will prevent calling onChange
92
+ const editorState = createInitialEditorState(props.defaultValue);
93
+ return [
94
+ undefined,
95
+ editorState
96
+ ];
97
+ }
98
+ return [
99
+ props.defaultValue,
100
+ undefined
101
+ ];
102
+ }, [
103
+ preventDefaultValueOnChange,
104
+ props.defaultValue
105
+ ]);
106
+ const placeholderValue = slot.optional(props.placeholderValue, {
107
+ elementType: 'span'
77
108
  });
78
- }, [onChange]);
79
- const [defaultString, lexicalEditorStateDefaultValue] = React.useMemo(() => {
80
- if (typeof props.defaultValue === 'function') {
81
- return [undefined, props.defaultValue];
82
- }
83
- if (preventDefaultValueOnChange && props.defaultValue !== undefined) {
84
- // Any method of providing a default value to lexical which inserts it after initialization
85
- // will trigger a text content change.
86
- // Providing a default value as a stringified editorState will prevent calling onChange
87
- const editorState = createInitialEditorState(props.defaultValue);
88
- return [undefined, editorState];
109
+ const placeholderId = useId('chat-input-placeholder', placeholderValue === null || placeholderValue === void 0 ? void 0 : placeholderValue.id);
110
+ if (placeholderValue) {
111
+ placeholderValue.id = placeholderId;
89
112
  }
90
- return [props.defaultValue, undefined];
91
- }, [preventDefaultValueOnChange, props.defaultValue]);
92
- const placeholderValue = slot.optional(props.placeholderValue, {
93
- elementType: 'span'
94
- });
95
- const placeholderId = useId('chat-input-placeholder', placeholderValue === null || placeholderValue === void 0 ? void 0 : placeholderValue.id);
96
- if (placeholderValue) {
97
- placeholderValue.id = placeholderId;
98
- }
99
- return {
100
- components: {
101
- root: 'span',
102
- input: 'span',
103
- placeholderValue: 'span'
104
- },
105
- root: slot.always(props.root, {
106
- defaultProps: {
107
- ...root
108
- },
109
- elementType: 'span'
110
- }),
111
- input: slot.always(props.input, {
112
- defaultProps: {
113
- ref: useMergedRefs(ref, spanRef),
114
- role: 'textbox',
115
- contentEditable: !disabled,
116
- 'aria-readonly': disabled ? true : undefined,
113
+ return {
114
+ components: {
115
+ root: 'span',
116
+ input: 'span',
117
+ placeholderValue: 'span'
118
+ },
119
+ root: slot.always(props.root, {
120
+ defaultProps: {
121
+ ...root
122
+ },
123
+ elementType: 'span'
124
+ }),
125
+ input: slot.always(props.input, {
126
+ defaultProps: {
127
+ ref: useMergedRefs(ref, spanRef),
128
+ role: 'textbox',
129
+ contentEditable: !disabled,
130
+ 'aria-readonly': disabled ? true : undefined,
131
+ disabled,
132
+ suppressContentEditableWarning: true,
133
+ tabIndex: disabled ? undefined : 0,
134
+ ...primary,
135
+ 'aria-describedby': primary['aria-describedby'] ? `${primary['aria-describedby']} ${placeholderId}` : placeholderId
136
+ },
137
+ elementType: 'span'
138
+ }),
139
+ placeholderValue,
140
+ lexicalInitialConfig: {
141
+ namespace: 'fai-EditorInput',
142
+ onError: console.error,
143
+ nodes: customNodes,
144
+ editorState: lexicalEditorStateDefaultValue,
145
+ theme: customTheme
146
+ },
147
+ editorRef,
117
148
  disabled,
118
- suppressContentEditableWarning: true,
119
- tabIndex: disabled ? undefined : 0,
120
- ...primary,
121
- 'aria-describedby': primary['aria-describedby'] ? `${primary['aria-describedby']} ${placeholderId}` : placeholderId
122
- },
123
- elementType: 'span'
124
- }),
125
- placeholderValue,
126
- lexicalInitialConfig: {
127
- namespace: 'fai-EditorInput',
128
- onError: console.error,
129
- nodes: customNodes,
130
- editorState: lexicalEditorStateDefaultValue,
131
- theme: customTheme
132
- },
133
- editorRef,
134
- disabled,
135
- textPlugin,
136
- onPaste,
137
- handleOnChange,
138
- defaultValue: defaultString,
139
- trimWhiteSpace,
140
- history,
141
- isSentinelNodeEnabled
142
- };
149
+ textPlugin,
150
+ onPaste,
151
+ handleOnChange,
152
+ defaultValue: defaultString,
153
+ trimWhiteSpace,
154
+ history,
155
+ isSentinelNodeEnabled
156
+ };
143
157
  };
144
- //# sourceMappingURL=useEditorInput.js.map
@@ -0,0 +1,61 @@
1
+ import { makeResetStyles, makeStyles, mergeClasses, typographyStyles } from '@fluentui/react-components';
2
+ import { tokens } from '@fluentui-copilot/tokens';
3
+ export const editorInputClassNames = {
4
+ root: 'fai-EditorInput',
5
+ input: 'fai-EditorInput__input',
6
+ placeholderValue: 'fai-EditorInput__placeholderValue'
7
+ };
8
+ /**
9
+ * Styles for the root slot
10
+ */ const useRootClassName = makeResetStyles({
11
+ display: 'inline-grid',
12
+ whiteSpace: 'pre-wrap'
13
+ });
14
+ export const useLexicalStyles = makeStyles({
15
+ paragraph: {
16
+ margin: 0,
17
+ textAlign: 'start'
18
+ }
19
+ });
20
+ export const usePlaceholderClassName = makeResetStyles({
21
+ zIndex: 0,
22
+ gridArea: '1 / 1 / 1 / 1',
23
+ color: tokens.colorNeutralForeground4,
24
+ ...typographyStyles.body1,
25
+ '@media (forced-colors: active)': {
26
+ color: 'GrayText'
27
+ }
28
+ });
29
+ export const useInputClassName = makeResetStyles({
30
+ gridArea: '1 / 1 / 1 / 1',
31
+ zIndex: 1,
32
+ width: '100%'
33
+ });
34
+ const useStyles = makeStyles({
35
+ placeholderDisabled: {
36
+ color: tokens.colorNeutralForegroundDisabled
37
+ }
38
+ });
39
+ /**
40
+ * Apply styling to the EditorInput slots based on the state
41
+ */ export const useEditorInputStyles_unstable = (state)=>{
42
+ 'use no memo';
43
+ const { disabled } = state;
44
+ const placeholderClassName = usePlaceholderClassName();
45
+ const rootClassName = useRootClassName();
46
+ const inputClassName = useInputClassName();
47
+ const styles = useStyles();
48
+ state.root.className = mergeClasses(editorInputClassNames.root, rootClassName, state.root.className);
49
+ state.input.className = mergeClasses(editorInputClassNames.input, inputClassName, state.input.className);
50
+ state.lexicalInitialConfig = {
51
+ ...state.lexicalInitialConfig,
52
+ theme: {
53
+ ...useLexicalStyles(),
54
+ ...state.lexicalInitialConfig.theme
55
+ }
56
+ };
57
+ if (state.placeholderValue) {
58
+ state.placeholderValue.className = mergeClasses(editorInputClassNames.placeholderValue, placeholderClassName, disabled && styles.placeholderDisabled, state.placeholderValue.className);
59
+ }
60
+ return state;
61
+ };
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["useEditorInputStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, typographyStyles } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\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 textAlign: 'start',\n },\n});\n\nexport const usePlaceholderClassName = makeResetStyles({\n zIndex: 0,\n gridArea: '1 / 1 / 1 / 1',\n\n color: tokens.colorNeutralForeground4,\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","typographyStyles","tokens","editorInputClassNames","root","input","placeholderValue","useRootClassName","display","whiteSpace","useLexicalStyles","paragraph","margin","textAlign","usePlaceholderClassName","zIndex","gridArea","color","colorNeutralForeground4","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,gBAAgB,QAAQ,6BAA6B;AACzG,SAASC,MAAM,QAAQ,2BAA2B;AAIlD,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;QACRC,WAAW;IACb;AACF,GAAG;AAEH,OAAO,MAAMC,0BAA0BhB,gBAAgB;IACrDiB,QAAQ;IACRC,UAAU;IAEVC,OAAOf,OAAOgB,uBAAuB;IACrC,GAAGjB,iBAAiBkB,KAAK;IAEzB,kCAAkC;QAChCF,OAAO;IACT;AACF,GAAG;AAEH,OAAO,MAAMG,oBAAoBtB,gBAAgB;IAC/CkB,UAAU;IACVD,QAAQ;IACRM,OAAO;AACT,GAAG;AAEH,MAAMC,YAAYvB,WAAW;IAC3BwB,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,gBAAgBtB;IACtB,MAAMuB,iBAAiBV;IACvB,MAAMW,SAAST;IAEfI,MAAMtB,IAAI,CAAC4B,SAAS,GAAGhC,aAAaG,sBAAsBC,IAAI,EAAEyB,eAAeH,MAAMtB,IAAI,CAAC4B,SAAS;IAEnGN,MAAMrB,KAAK,CAAC2B,SAAS,GAAGhC,aAAaG,sBAAsBE,KAAK,EAAEyB,gBAAgBJ,MAAMrB,KAAK,CAAC2B,SAAS;IAEvGN,MAAMO,oBAAoB,GAAG;QAC3B,GAAGP,MAAMO,oBAAoB;QAC7BC,OAAO;YAAE,GAAGxB,kBAAkB;YAAE,GAAGgB,MAAMO,oBAAoB,CAACC,KAAK;QAAC;IACtE;IAEA,IAAIR,MAAMpB,gBAAgB,EAAE;QAC1BoB,MAAMpB,gBAAgB,CAAC0B,SAAS,GAAGhC,aACjCG,sBAAsBG,gBAAgB,EACtCsB,sBACAD,YAAYI,OAAOR,mBAAmB,EACtCG,MAAMpB,gBAAgB,CAAC0B,SAAS;IAEpC;IAEA,OAAON;AACT,EAAE"}
package/lib/index.js CHANGED
@@ -1,2 +1 @@
1
1
  export { EditorInput, editorInputClassNames, renderEditorInput_unstable, useEditorInputStyles_unstable, useEditorInput_unstable } from './EditorInput';
2
- //# sourceMappingURL=index.js.map
@@ -35,4 +35,3 @@ _export(exports, {
35
35
  }
36
36
  });
37
37
  const _index = require("./components/EditorInput/index");
38
- //# sourceMappingURL=EditorInput.js.map
@@ -18,4 +18,4 @@ const EditorInput = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
18
18
  (0, _useEditorInputStylesstyles.useEditorInputStyles_unstable)(state);
19
19
  return (0, _renderEditorInput.renderEditorInput_unstable)(state);
20
20
  });
21
- EditorInput.displayName = 'EditorInput'; //# sourceMappingURL=EditorInput.js.map
21
+ EditorInput.displayName = 'EditorInput';
@@ -1 +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';\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"}
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';\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","ref","state","useEditorInput_unstable","useEditorInputStyles_unstable","renderEditorInput_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;gCACiB;mCACG;4CACG;AAKvC,MAAMA,cAAAA,WAAAA,GAAqDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQC,IAAAA,uCAAAA,EAAwBH,OAAOC;IAE7CG,IAAAA,yDAAAA,EAA8BF;IAC9B,OAAOG,IAAAA,6CAAAA,EAA2BH;AACpC;AAEAL,YAAYS,WAAW,GAAG"}
@@ -4,4 +4,3 @@
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- //# sourceMappingURL=EditorInput.types.js.map
@@ -38,4 +38,3 @@ const _EditorInput = require("./EditorInput");
38
38
  const _renderEditorInput = require("./renderEditorInput");
39
39
  const _useEditorInput = require("./useEditorInput");
40
40
  const _useEditorInputStylesstyles = require("./useEditorInputStyles.styles");
41
- //# sourceMappingURL=index.js.map
@@ -41,4 +41,4 @@ const renderEditorInput_unstable = (state)=>{
41
41
  ]
42
42
  })
43
43
  });
44
- }; //# sourceMappingURL=renderEditorInput.js.map
44
+ };
@@ -1 +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 } 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 isSentinelNodeEnabled={state.isSentinelNodeEnabled}\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","trimWhiteSpace","defaultValue","isSentinelNodeEnabled","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;mDACTe,MAAAA,qBAAsBC;;yCACtBC,WAAAA,GAAcjB,IAAAA,eAAAA,EAAAA,qCAAkB,EAAA,CAAA;qBAAA;;mDAChCkB,uCAAAA,EAAuBlB;;;;;;gDAIcmB"}
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 } 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 isSentinelNodeEnabled={state.isSentinelNodeEnabled}\n />\n {state.history && <LexicalHistoryPlugin />}\n </>\n <LexicalEditorRefPlugin editorRef={state.editorRef} />\n </LexicalComposer>\n </state.root>\n );\n};\n"],"names":["renderEditorInput_unstable","state","assertSlots","_jsx","root","_jsxs","LexicalComposer","initialConfig","lexicalInitialConfig","textPlugin","contentEditable","input","ErrorBoundary","LexicalErrorBoundary","placeholder","placeholderValue","_Fragment","BasicFunctionalityPlugin","onContentChange","handleOnChange","onPaste","trimWhitespace","trimWhiteSpace","defaultValue","isSentinelNodeEnabled","history","LexicalHistoryPlugin","LexicalEditorRefPlugin","editorRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAgBaA;;;eAAAA;;;4BAfb;iCAE4B;iCAOrB;uCACkC;AAKlC,MAAMA,6BAA6B,CAACC;IACzCC,IAAAA,4BAAAA,EAA8BD;IAE9B,OAAA,WAAA,GACEE,IAAAA,eAAA,EAACF,MAAMG,IAAI,EAAA;kBACT,WAAA,GAAAC,IAAAA,gBAAA,EAACC,gCAAAA,EAAAA;YAAgBC,eAAeN,MAAMO,oBAAoB;;8BACxDL,IAAAA,eAAA,EAACF,MAAMQ,UAAU,EAAA;oBACfC,iBAAAA,WAAAA,GAAiBP,IAAAA,eAAA,EAACF,MAAMU,KAAK,EAAA,CAAA;oBAC7BC,eAAeC,qCAAAA;oBACfC,aAAab,MAAMc,gBAAgB,GAAA,WAAA,GAAGZ,IAAAA,eAAA,EAACF,MAAMc,gBAAgB,EAAA,CAAA,KAAM;;8BAErEV,IAAAA,gBAAA,EAAAW,oBAAA,EAAA;;sCACEb,IAAAA,eAAA,EAACc,+CAAAA,EAAAA;4BACCC,iBAAiBjB,MAAMkB,cAAc;4BACrCC,SAASnB,MAAMmB,OAAO;4BACtBC,gBAAgBpB,MAAMqB,cAAc;4BACpCC,cAActB,MAAMsB,YAAY;4BAChCC,uBAAuBvB,MAAMuB,qBAAqB;;wBAEnDvB,MAAMwB,OAAO,IAAA,WAAA,GAAItB,IAAAA,eAAA,EAACuB,qCAAAA,EAAAA,CAAAA;;;8BAErBvB,IAAAA,eAAA,EAACwB,uCAAAA,EAAAA;oBAAuBC,WAAW3B,MAAM2B,SAAS;;;;;AAI1D"}
@@ -50,8 +50,7 @@ const useEditorInput_unstable = (props, ref)=>{
50
50
  _chatinputplugins.SentinelNode
51
51
  ];
52
52
  const spanRef = _react.useCallback((span)=>{
53
- var // Register the `input` span with lexical
54
- _editorRef_current;
53
+ var _editorRef_current;
55
54
  (_editorRef_current = editorRef.current) === null || _editorRef_current === void 0 ? void 0 : _editorRef_current.setRootElement(span);
56
55
  }, [
57
56
  editorRef
@@ -165,4 +164,4 @@ const useEditorInput_unstable = (props, ref)=>{
165
164
  history,
166
165
  isSentinelNodeEnabled
167
166
  };
168
- }; //# sourceMappingURL=useEditorInput.js.map
167
+ };
@@ -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\nexport const createInitialEditorState = (defaultValue: string) => {\n return `{\"root\":{\"type\":\"root\",\"children\":[{\"children\":[{\"text\":${JSON.stringify(\n defaultValue,\n )},\"type\":\"text\"}],\"type\":\"paragraph\"}]}}`;\n};\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 isSentinelNodeEnabled = true,\n preventDefaultValueOnChange = false,\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, lexicalEditorStateDefaultValue] = React.useMemo(() => {\n if (typeof props.defaultValue === 'function') {\n return [undefined, props.defaultValue];\n }\n\n if (preventDefaultValueOnChange && props.defaultValue !== undefined) {\n // Any method of providing a default value to lexical which inserts it after initialization\n // will trigger a text content change.\n // Providing a default value as a stringified editorState will prevent calling onChange\n const editorState = createInitialEditorState(props.defaultValue);\n return [undefined, editorState];\n }\n\n return [props.defaultValue, undefined];\n }, [preventDefaultValueOnChange, props.defaultValue]);\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 disabled,\n suppressContentEditableWarning: true,\n tabIndex: disabled ? undefined : 0,\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: lexicalEditorStateDefaultValue,\n theme: customTheme,\n },\n editorRef,\n disabled,\n textPlugin,\n onPaste,\n handleOnChange,\n defaultValue: defaultString,\n trimWhiteSpace,\n history,\n isSentinelNodeEnabled,\n };\n};\n"],"names":["createInitialEditorState","onChange","trimWhiteSpace","defaultValue","JSON","stringify","primarySlotTagName","props","excludedPropNames","LexicalPlainTextPlugin","userEditorRef","isSentinelNodeEnabled","preventDefaultValueOnChange","useMergedRefs","React","root","state","customNodes","editorRef","useRef","SentinelNode","disabled","spanRef","useCallback","span","useIsomorphicLayoutEffect","current","_editorRef_current","setRootElement","setEditable","mergeRegister","registerRootListener","style","whiteSpace","handleOnChange","value","defaultString","lexicalEditorStateDefaultValue","undefined","editorState","id","placeholderId","input","slot","always","defaultProps","placeholderValue","elementType","ref","components","suppressContentEditableWarning","primary","error"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
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\nexport const createInitialEditorState = (defaultValue: string) => {\n return `{\"root\":{\"type\":\"root\",\"children\":[{\"children\":[{\"text\":${JSON.stringify(\n defaultValue,\n )},\"type\":\"text\"}],\"type\":\"paragraph\"}]}}`;\n};\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 isSentinelNodeEnabled = true,\n preventDefaultValueOnChange = false,\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, lexicalEditorStateDefaultValue] = React.useMemo(() => {\n if (typeof props.defaultValue === 'function') {\n return [undefined, props.defaultValue];\n }\n\n if (preventDefaultValueOnChange && props.defaultValue !== undefined) {\n // Any method of providing a default value to lexical which inserts it after initialization\n // will trigger a text content change.\n // Providing a default value as a stringified editorState will prevent calling onChange\n const editorState = createInitialEditorState(props.defaultValue);\n return [undefined, editorState];\n }\n\n return [props.defaultValue, undefined];\n }, [preventDefaultValueOnChange, props.defaultValue]);\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 disabled,\n suppressContentEditableWarning: true,\n tabIndex: disabled ? undefined : 0,\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: lexicalEditorStateDefaultValue,\n theme: customTheme,\n },\n editorRef,\n disabled,\n textPlugin,\n onPaste,\n handleOnChange,\n defaultValue: defaultString,\n trimWhiteSpace,\n history,\n isSentinelNodeEnabled,\n };\n};\n"],"names":["createInitialEditorState","useEditorInput_unstable","defaultValue","JSON","stringify","props","ref","onChange","onPaste","trimWhiteSpace","textPlugin","LexicalPlainTextPlugin","history","editorRef","userEditorRef","customTheme","isSentinelNodeEnabled","preventDefaultValueOnChange","root","primary","getPartitionedNativeProps","primarySlotTagName","excludedPropNames","useMergedRefs","React","useRef","disabled","setDisabled","useControllableState","state","initialState","customNodes","SentinelNode","spanRef","useCallback","span","current","setRootElement","useIsomorphicLayoutEffect","setEditable","mergeRegister","registerEditableListener","isEditable","registerRootListener","style","whiteSpace","handleOnChange","newValue","value","defaultString","lexicalEditorStateDefaultValue","useMemo","undefined","editorState","placeholderValue","slot","optional","elementType","placeholderId","useId","id","components","input","always","defaultProps","role","contentEditable","suppressContentEditableWarning","tabIndex","lexicalInitialConfig","namespace","onError","console","error","nodes","theme"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAcaA,wBAAAA;eAAAA;;IAeAC,uBAAAA;eAAAA;;;;iEA7BU;iCAOhB;kCAEsB;iCAEyB;gCACjB;AAE9B,MAAMD,2BAA2B,CAACE;IACvC,OAAO,CAAC,wDAAwD,EAAEC,KAAKC,SAAS,CAC9EF,cACA,uCAAuC,CAAC;AAC5C;AAWO,MAAMD,0BAA0B,CAACI,OAAyBC;IAC/D,MAAM,EACJC,QAAQ,EACRC,OAAO,EACPC,iBAAiB,KAAK,EACtBC,aAAaC,uCAAsB,EACnCC,UAAU,IAAI,EACdC,WAAWC,aAAa,EACxBC,WAAW,EACXC,wBAAwB,IAAI,EAC5BC,8BAA8B,KAAK,EACpC,GAAGZ;IACJ,MAAM,EAAEa,IAAI,EAAEC,OAAO,EAAE,GAAGC,IAAAA,0CAAAA,EAA0B;QAClDC,oBAAoB;QACpBhB;QACAiB,mBAAmB;YAAC;YAAY;YAAW;SAAe;IAC5D;IAEA,MAAMT,YAAYU,IAAAA,8BAAAA,EAAcC,OAAMC,MAAM,CAAgB,OAAOX;IACnE,iFAAiF;IACjF,8CAA8C;IAC9C,MAAM,CAACY,UAAUC,YAAY,GAAGC,IAAAA,oCAAAA,EAAqB;QACnDC,OAAOxB,MAAMqB,QAAQ;QACrBI,cAAc;IAChB;IAEA,MAAMC,cAAc1B,MAAM0B,WAAW,GAAG;WAAI1B,MAAM0B,WAAW;QAAEC,8BAAAA;KAAa,GAAG;QAACA,8BAAAA;KAAa;IAE7F,MAAMC,UAAUT,OAAMU,WAAW,CAC/BC,CAAAA;YAEEtB;QAAAA,CAAAA,qBAAAA,UAAUuB,OAAO,AAAPA,MAAO,QAAjBvB,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAmBwB,cAAc,CAACF;IACpC,GACA;QAACtB;KAAU;IAGb,uCAAuC;IACvCyB,IAAAA,0CAAAA,EAA0B;QACxB,IAAIzB,UAAUuB,OAAO,EAAE;gBACrBvB;YAAAA,CAAAA,qBAAAA,UAAUuB,OAAO,AAAPA,MAAO,QAAjBvB,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAmB0B,WAAW,CAAC,CAACb;QAClC;IACF,GAAG;QAACA;KAAS;IAEbY,IAAAA,0CAAAA,EAA0B;QACxB,IAAIzB,UAAUuB,OAAO,EAAE;gBAKnBvB;YAJF,OAAO2B,IAAAA,8BAAAA,EACL3B,UAAUuB,OAAO,CAACK,wBAAwB,CAACC,CAAAA;gBACzCf,YAAY,CAACe;YACf,IAAA,AACA7B,CAAAA,qBAAAA,UAAUuB,OAAO,AAAPA,MAAO,QAAjBvB,uBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,mBAAmB8B,oBAAoB,CAACzB,CAAAA;gBACtC,IAAI,CAACA,MAAM;oBACT;gBACF;gBAEA,wDAAwD;gBACxD,wFAAwF;gBACxFA,KAAK0B,KAAK,CAACC,UAAU,GAAG;YAC1B;QAEJ;IACF,GAAG;QAAChC;KAAU;IAEd,MAAMiC,iBAAiBtB,OAAMU,WAAW,CACtC,CAACa;QACCxC,aAAAA,QAAAA,aAAAA,KAAAA,IAAAA,KAAAA,IAAAA,SAAW,CAAC,GAAG;YAAEyC,OAAOD;QAAS;IACnC,GACA;QAACxC;KAAS;IAGZ,MAAM,CAAC0C,eAAeC,+BAA+B,GAAG1B,OAAM2B,OAAO,CAAC;QACpE,IAAI,OAAO9C,MAAMH,YAAY,KAAK,YAAY;YAC5C,OAAO;gBAACkD;gBAAW/C,MAAMH,YAAY;aAAC;QACxC;QAEA,IAAIe,+BAA+BZ,MAAMH,YAAY,KAAKkD,WAAW;YACnE,2FAA2F;YAC3F,sCAAsC;YACtC,uFAAuF;YACvF,MAAMC,cAAcrD,yBAAyBK,MAAMH,YAAY;YAC/D,OAAO;gBAACkD;gBAAWC;aAAY;QACjC;QAEA,OAAO;YAAChD,MAAMH,YAAY;YAAEkD;SAAU;IACxC,GAAG;QAACnC;QAA6BZ,MAAMH,YAAY;KAAC;IAEpD,MAAMoD,mBAAmBC,qBAAAA,CAAKC,QAAQ,CAACnD,MAAMiD,gBAAgB,EAAE;QAAEG,aAAa;IAAO;IACrF,MAAMC,gBAAgBC,IAAAA,sBAAAA,EAAM,0BAA0BL,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,KAAAA,IAAAA,iBAAkBM,EAAE;IAC1E,IAAIN,kBAAkB;QACpBA,iBAAiBM,EAAE,GAAGF;IACxB;IAEA,OAAO;QACLG,YAAY;YACV3C,MAAM;YACN4C,OAAO;YACPR,kBAAkB;QACpB;QACApC,MAAMqC,qBAAAA,CAAKQ,MAAM,CAAC1D,MAAMa,IAAI,EAAE;YAAE8C,cAAc;gBAAE,GAAG9C,IAAI;YAAC;YAAGuC,aAAa;QAAO;QAC/EK,OAAOP,qBAAAA,CAAKQ,MAAM,CAAC1D,MAAMyD,KAAK,EAAE;YAC9BE,cAAc;gBACZ1D,KAAKiB,IAAAA,8BAAAA,EAAcjB,KAAK2B;gBACxBgC,MAAM;gBACNC,iBAAiB,CAACxC;gBAClB,iBAAiBA,WAAW,OAAO0B;gBACnC1B;gBACAyC,gCAAgC;gBAChCC,UAAU1C,WAAW0B,YAAY;gBACjC,GAAGjC,OAAO;gBACV,oBAAoBA,OAAO,CAAC,mBAAmB,GAC3C,CAAC,EAAEA,OAAO,CAAC,mBAAmB,CAAC,CAAC,EAAEuC,cAAc,CAAC,GACjDA;YACN;YACAD,aAAa;QACf;QACAH;QACAe,sBAAsB;YACpBC,WAAW;YACXC,SAASC,QAAQC,KAAK;YACtBC,OAAO3C;YACPsB,aAAaH;YACbyB,OAAO5D;QACT;QACAF;QACAa;QACAhB;QACAF;QACAsC;QACA5C,cAAc+C;QACdxC;QACAG;QACAI;IACF;AACF"}
@@ -0,0 +1,86 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
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
+ editorInputClassNames: function() {
13
+ return editorInputClassNames;
14
+ },
15
+ useEditorInputStyles_unstable: function() {
16
+ return useEditorInputStyles_unstable;
17
+ },
18
+ useInputClassName: function() {
19
+ return useInputClassName;
20
+ },
21
+ useLexicalStyles: function() {
22
+ return useLexicalStyles;
23
+ },
24
+ usePlaceholderClassName: function() {
25
+ return usePlaceholderClassName;
26
+ }
27
+ });
28
+ const _reactcomponents = require("@fluentui/react-components");
29
+ const _tokens = require("@fluentui-copilot/tokens");
30
+ const editorInputClassNames = {
31
+ root: 'fai-EditorInput',
32
+ input: 'fai-EditorInput__input',
33
+ placeholderValue: 'fai-EditorInput__placeholderValue'
34
+ };
35
+ /**
36
+ * Styles for the root slot
37
+ */ const useRootClassName = (0, _reactcomponents.makeResetStyles)({
38
+ display: 'inline-grid',
39
+ whiteSpace: 'pre-wrap'
40
+ });
41
+ const useLexicalStyles = (0, _reactcomponents.makeStyles)({
42
+ paragraph: {
43
+ margin: 0,
44
+ textAlign: 'start'
45
+ }
46
+ });
47
+ const usePlaceholderClassName = (0, _reactcomponents.makeResetStyles)({
48
+ zIndex: 0,
49
+ gridArea: '1 / 1 / 1 / 1',
50
+ color: _tokens.tokens.colorNeutralForeground4,
51
+ ..._reactcomponents.typographyStyles.body1,
52
+ '@media (forced-colors: active)': {
53
+ color: 'GrayText'
54
+ }
55
+ });
56
+ const useInputClassName = (0, _reactcomponents.makeResetStyles)({
57
+ gridArea: '1 / 1 / 1 / 1',
58
+ zIndex: 1,
59
+ width: '100%'
60
+ });
61
+ const useStyles = (0, _reactcomponents.makeStyles)({
62
+ placeholderDisabled: {
63
+ color: _tokens.tokens.colorNeutralForegroundDisabled
64
+ }
65
+ });
66
+ const useEditorInputStyles_unstable = (state)=>{
67
+ 'use no memo';
68
+ const { disabled } = state;
69
+ const placeholderClassName = usePlaceholderClassName();
70
+ const rootClassName = useRootClassName();
71
+ const inputClassName = useInputClassName();
72
+ const styles = useStyles();
73
+ state.root.className = (0, _reactcomponents.mergeClasses)(editorInputClassNames.root, rootClassName, state.root.className);
74
+ state.input.className = (0, _reactcomponents.mergeClasses)(editorInputClassNames.input, inputClassName, state.input.className);
75
+ state.lexicalInitialConfig = {
76
+ ...state.lexicalInitialConfig,
77
+ theme: {
78
+ ...useLexicalStyles(),
79
+ ...state.lexicalInitialConfig.theme
80
+ }
81
+ };
82
+ if (state.placeholderValue) {
83
+ state.placeholderValue.className = (0, _reactcomponents.mergeClasses)(editorInputClassNames.placeholderValue, placeholderClassName, disabled && styles.placeholderDisabled, state.placeholderValue.className);
84
+ }
85
+ return state;
86
+ };
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["useEditorInputStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, typographyStyles } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\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 textAlign: 'start',\n },\n});\n\nexport const usePlaceholderClassName = makeResetStyles({\n zIndex: 0,\n gridArea: '1 / 1 / 1 / 1',\n\n color: tokens.colorNeutralForeground4,\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":["editorInputClassNames","useEditorInputStyles_unstable","useInputClassName","useLexicalStyles","usePlaceholderClassName","root","input","placeholderValue","useRootClassName","makeResetStyles","display","whiteSpace","makeStyles","paragraph","margin","textAlign","zIndex","gridArea","color","tokens","colorNeutralForeground4","typographyStyles","body1","width","useStyles","placeholderDisabled","colorNeutralForegroundDisabled","state","disabled","placeholderClassName","rootClassName","inputClassName","styles","className","mergeClasses","lexicalInitialConfig","theme"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,qBAAAA;eAAAA;;IA+CAC,6BAAAA;eAAAA;;IAdAC,iBAAAA;eAAAA;;IAnBAC,gBAAAA;eAAAA;;IAOAC,uBAAAA;eAAAA;;;iCA1B+D;wBACrD;AAIhB,MAAMJ,wBAA0D;IACrEK,MAAM;IACNC,OAAO;IACPC,kBAAkB;AACpB;AAEA;;CAEC,GACD,MAAMC,mBAAmBC,IAAAA,gCAAAA,EAAgB;IACvCC,SAAS;IACTC,YAAY;AACd;AAEO,MAAMR,mBAAmBS,IAAAA,2BAAAA,EAAW;IACzCC,WAAW;QACTC,QAAQ;QACRC,WAAW;IACb;AACF;AAEO,MAAMX,0BAA0BK,IAAAA,gCAAAA,EAAgB;IACrDO,QAAQ;IACRC,UAAU;IAEVC,OAAOC,cAAAA,CAAOC,uBAAuB;IACrC,GAAGC,iCAAAA,CAAiBC,KAAK;IAEzB,kCAAkC;QAChCJ,OAAO;IACT;AACF;AAEO,MAAMhB,oBAAoBO,IAAAA,gCAAAA,EAAgB;IAC/CQ,UAAU;IACVD,QAAQ;IACRO,OAAO;AACT;AAEA,MAAMC,YAAYZ,IAAAA,2BAAAA,EAAW;IAC3Ba,qBAAqB;QACnBP,OAAOC,cAAAA,CAAOO,8BAA8B;IAC9C;AACF;AAIO,MAAMzB,gCAAgC,CAAC0B;IAC5C;IAEA,MAAM,EAAEC,QAAQ,EAAE,GAAGD;IACrB,MAAME,uBAAuBzB;IAC7B,MAAM0B,gBAAgBtB;IACtB,MAAMuB,iBAAiB7B;IACvB,MAAM8B,SAASR;IAEfG,MAAMtB,IAAI,CAAC4B,SAAS,GAAGC,IAAAA,6BAAAA,EAAalC,sBAAsBK,IAAI,EAAEyB,eAAeH,MAAMtB,IAAI,CAAC4B,SAAS;IAEnGN,MAAMrB,KAAK,CAAC2B,SAAS,GAAGC,IAAAA,6BAAAA,EAAalC,sBAAsBM,KAAK,EAAEyB,gBAAgBJ,MAAMrB,KAAK,CAAC2B,SAAS;IAEvGN,MAAMQ,oBAAoB,GAAG;QAC3B,GAAGR,MAAMQ,oBAAoB;QAC7BC,OAAO;YAAE,GAAGjC,kBAAkB;YAAE,GAAGwB,MAAMQ,oBAAoB,CAACC,KAAK;QAAC;IACtE;IAEA,IAAIT,MAAMpB,gBAAgB,EAAE;QAC1BoB,MAAMpB,gBAAgB,CAAC0B,SAAS,GAAGC,IAAAA,6BAAAA,EACjClC,sBAAsBO,gBAAgB,EACtCsB,sBACAD,YAAYI,OAAOP,mBAAmB,EACtCE,MAAMpB,gBAAgB,CAAC0B,SAAS;IAEpC;IAEA,OAAON;AACT"}
@@ -26,4 +26,3 @@ _export(exports, {
26
26
  }
27
27
  });
28
28
  const _EditorInput = require("./EditorInput");
29
- //# sourceMappingURL=index.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui-copilot/react-editor-input",
3
- "version": "0.4.8",
3
+ "version": "0.4.9-hotfix.1",
4
4
  "description": "a base rich editor input.",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -12,26 +12,22 @@
12
12
  },
13
13
  "license": "MIT",
14
14
  "dependencies": {
15
- "@fluentui-copilot/chat-input-plugins": "^0.4.2",
16
- "@fluentui-copilot/react-chat-input-plugins": "^0.4.7",
17
- "@fluentui-copilot/react-text-editor": "^0.4.1",
18
- "@fluentui-copilot/tokens": "^0.3.9",
15
+ "@fluentui-copilot/chat-input-plugins": "0.4.2-hotfix.1",
16
+ "@fluentui-copilot/react-chat-input-plugins": "0.4.8-hotfix.1",
17
+ "@fluentui-copilot/react-text-editor": "0.4.1-hotfix.1",
18
+ "@fluentui-copilot/tokens": "0.3.10-hotfix.1",
19
19
  "@swc/helpers": "^0.5.1"
20
20
  },
21
21
  "peerDependencies": {
22
- "@fluentui/react-components": ">=9.55.1 <10.0.0",
23
- "@fluentui/react-jsx-runtime": ">=9.0.45 <10.0.0",
24
- "@fluentui/react-utilities": ">=9.18.16 <10.0.0",
22
+ "@fluentui/react-components": ">=9.58.3 <10.0.0",
23
+ "@fluentui/react-jsx-runtime": ">=9.0.50 <10.0.0",
24
+ "@fluentui/react-utilities": ">=9.19.0 <10.0.0",
25
25
  "@types/react": ">=16.14.0 <19.0.0",
26
26
  "@types/react-dom": ">=16.9.8 <19.0.0",
27
27
  "react": ">=16.14.0 <19.0.0",
28
28
  "react-dom": ">=16.14.0 <19.0.0"
29
29
  },
30
- "beachball": {
31
- "disallowedChangeTypes": [
32
- "major"
33
- ]
34
- },
30
+ "beachball": {},
35
31
  "exports": {
36
32
  ".": {
37
33
  "types": "./dist/index.d.ts",