@fluentui-copilot/react-editor-input 0.0.0-nightly-20251002-0405-17b34fb7.1 → 0.0.0-nightly-20251010-0406-7df7c6d1.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 +3 -3
- package/CHANGELOG.md +4 -4
- package/package.json +9 -9
- package/dist/index.d.ts +0 -165
- package/lib/AnimatedPlaceholder.js +0 -1
- package/lib/AnimatedPlaceholder.js.map +0 -1
- package/lib/EditorInput.js +0 -1
- package/lib/EditorInput.js.map +0 -1
- package/lib/components/AnimatedPlaceholder/AnimatedPlaceholder.js +0 -10
- package/lib/components/AnimatedPlaceholder/AnimatedPlaceholder.js.map +0 -1
- package/lib/components/AnimatedPlaceholder/AnimatedPlaceholder.types.js +0 -3
- package/lib/components/AnimatedPlaceholder/AnimatedPlaceholder.types.js.map +0 -1
- package/lib/components/AnimatedPlaceholder/index.js +0 -4
- package/lib/components/AnimatedPlaceholder/index.js.map +0 -1
- package/lib/components/AnimatedPlaceholder/placeholderMotion.js +0 -46
- package/lib/components/AnimatedPlaceholder/placeholderMotion.js.map +0 -1
- package/lib/components/AnimatedPlaceholder/renderAnimatedPlaceholder.js +0 -12
- package/lib/components/AnimatedPlaceholder/renderAnimatedPlaceholder.js.map +0 -1
- package/lib/components/AnimatedPlaceholder/useAnimatedPlaceholder.js +0 -54
- package/lib/components/AnimatedPlaceholder/useAnimatedPlaceholder.js.map +0 -1
- package/lib/components/AnimatedPlaceholder/useAnimatedPlaceholderStyles.styles.js +0 -23
- package/lib/components/AnimatedPlaceholder/useAnimatedPlaceholderStyles.styles.js.map +0 -1
- package/lib/components/AnimatedPlaceholder/useAnimatedPlaceholderStyles.styles.raw.js +0 -21
- package/lib/components/AnimatedPlaceholder/useAnimatedPlaceholderStyles.styles.raw.js.map +0 -1
- package/lib/components/EditorInput/EditorInput.js +0 -11
- package/lib/components/EditorInput/EditorInput.js.map +0 -1
- package/lib/components/EditorInput/EditorInput.types.js +0 -3
- package/lib/components/EditorInput/EditorInput.types.js.map +0 -1
- package/lib/components/EditorInput/index.js +0 -4
- package/lib/components/EditorInput/index.js.map +0 -1
- package/lib/components/EditorInput/renderEditorInput.js +0 -35
- package/lib/components/EditorInput/renderEditorInput.js.map +0 -1
- package/lib/components/EditorInput/useEditorInput.js +0 -159
- package/lib/components/EditorInput/useEditorInput.js.map +0 -1
- package/lib/components/EditorInput/useEditorInputStyles.styles.js +0 -65
- package/lib/components/EditorInput/useEditorInputStyles.styles.js.map +0 -1
- package/lib/components/EditorInput/useEditorInputStyles.styles.raw.js +0 -61
- package/lib/components/EditorInput/useEditorInputStyles.styles.raw.js.map +0 -1
- package/lib/index.js +0 -2
- package/lib/index.js.map +0 -1
- package/lib-commonjs/AnimatedPlaceholder.js +0 -28
- package/lib-commonjs/AnimatedPlaceholder.js.map +0 -1
- package/lib-commonjs/EditorInput.js +0 -37
- package/lib-commonjs/EditorInput.js.map +0 -1
- package/lib-commonjs/components/AnimatedPlaceholder/AnimatedPlaceholder.js +0 -21
- package/lib-commonjs/components/AnimatedPlaceholder/AnimatedPlaceholder.js.map +0 -1
- package/lib-commonjs/components/AnimatedPlaceholder/AnimatedPlaceholder.types.js +0 -6
- package/lib-commonjs/components/AnimatedPlaceholder/AnimatedPlaceholder.types.js.map +0 -1
- package/lib-commonjs/components/AnimatedPlaceholder/index.js +0 -31
- package/lib-commonjs/components/AnimatedPlaceholder/index.js.map +0 -1
- package/lib-commonjs/components/AnimatedPlaceholder/placeholderMotion.js +0 -56
- package/lib-commonjs/components/AnimatedPlaceholder/placeholderMotion.js.map +0 -1
- package/lib-commonjs/components/AnimatedPlaceholder/renderAnimatedPlaceholder.js +0 -20
- package/lib-commonjs/components/AnimatedPlaceholder/renderAnimatedPlaceholder.js.map +0 -1
- package/lib-commonjs/components/AnimatedPlaceholder/useAnimatedPlaceholder.js +0 -57
- package/lib-commonjs/components/AnimatedPlaceholder/useAnimatedPlaceholder.js.map +0 -1
- package/lib-commonjs/components/AnimatedPlaceholder/useAnimatedPlaceholderStyles.styles.js +0 -37
- package/lib-commonjs/components/AnimatedPlaceholder/useAnimatedPlaceholderStyles.styles.js.map +0 -1
- package/lib-commonjs/components/AnimatedPlaceholder/useAnimatedPlaceholderStyles.styles.raw.js +0 -37
- package/lib-commonjs/components/AnimatedPlaceholder/useAnimatedPlaceholderStyles.styles.raw.js.map +0 -1
- package/lib-commonjs/components/EditorInput/EditorInput.js +0 -21
- package/lib-commonjs/components/EditorInput/EditorInput.js.map +0 -1
- package/lib-commonjs/components/EditorInput/EditorInput.types.js +0 -6
- package/lib-commonjs/components/EditorInput/EditorInput.types.js.map +0 -1
- package/lib-commonjs/components/EditorInput/index.js +0 -40
- package/lib-commonjs/components/EditorInput/index.js.map +0 -1
- package/lib-commonjs/components/EditorInput/renderEditorInput.js +0 -43
- package/lib-commonjs/components/EditorInput/renderEditorInput.js.map +0 -1
- package/lib-commonjs/components/EditorInput/useEditorInput.js +0 -159
- package/lib-commonjs/components/EditorInput/useEditorInput.js.map +0 -1
- package/lib-commonjs/components/EditorInput/useEditorInputStyles.styles.js +0 -99
- package/lib-commonjs/components/EditorInput/useEditorInputStyles.styles.js.map +0 -1
- package/lib-commonjs/components/EditorInput/useEditorInputStyles.styles.raw.js +0 -86
- package/lib-commonjs/components/EditorInput/useEditorInputStyles.styles.raw.js.map +0 -1
- package/lib-commonjs/index.js +0 -44
- package/lib-commonjs/index.js.map +0 -1
package/CHANGELOG.json
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
"name": "@fluentui-copilot/react-editor-input",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
6
|
-
"tag": "@fluentui-copilot/react-editor-input_v0.0.0-nightly-
|
|
7
|
-
"version": "0.0.0-nightly-
|
|
5
|
+
"date": "Fri, 10 Oct 2025 04:08:17 GMT",
|
|
6
|
+
"tag": "@fluentui-copilot/react-editor-input_v0.0.0-nightly-20251010-0406-7df7c6d1.1",
|
|
7
|
+
"version": "0.0.0-nightly-20251010-0406-7df7c6d1.1",
|
|
8
8
|
"comments": {
|
|
9
9
|
"prerelease": [
|
|
10
10
|
{
|
package/CHANGELOG.md
CHANGED
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
# Change Log - @fluentui-copilot/react-editor-input
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Fri, 10 Oct 2025 04:08:17 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
-
## [0.0.0-nightly-
|
|
7
|
+
## [0.0.0-nightly-20251010-0406-7df7c6d1.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-editor-input_v0.0.0-nightly-20251010-0406-7df7c6d1.1)
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-editor-input_v0.5.6..@fluentui-copilot/react-editor-input_v0.0.0-nightly-
|
|
9
|
+
Fri, 10 Oct 2025 04:08:17 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-editor-input_v0.5.6..@fluentui-copilot/react-editor-input_v0.0.0-nightly-20251010-0406-7df7c6d1.1)
|
|
11
11
|
|
|
12
12
|
### Changes
|
|
13
13
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-copilot/react-editor-input",
|
|
3
|
-
"version": "0.0.0-nightly-
|
|
3
|
+
"version": "0.0.0-nightly-20251010-0406-7df7c6d1.1",
|
|
4
4
|
"description": "a base rich editor input.",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -12,10 +12,10 @@
|
|
|
12
12
|
},
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@fluentui-copilot/chat-input-plugins": "0.0.0-nightly-
|
|
16
|
-
"@fluentui-copilot/react-chat-input-plugins": "0.0.0-nightly-
|
|
17
|
-
"@fluentui-copilot/react-text-editor": "0.0.0-nightly-
|
|
18
|
-
"@fluentui-copilot/tokens": "0.0.0-nightly-
|
|
15
|
+
"@fluentui-copilot/chat-input-plugins": "0.0.0-nightly-20251010-0406-7df7c6d1.1",
|
|
16
|
+
"@fluentui-copilot/react-chat-input-plugins": "0.0.0-nightly-20251010-0406-7df7c6d1.1",
|
|
17
|
+
"@fluentui-copilot/react-text-editor": "0.0.0-nightly-20251010-0406-7df7c6d1.1",
|
|
18
|
+
"@fluentui-copilot/tokens": "0.0.0-nightly-20251010-0406-7df7c6d1.1",
|
|
19
19
|
"@swc/helpers": "^0.5.1"
|
|
20
20
|
},
|
|
21
21
|
"peerDependencies": {
|
|
@@ -23,10 +23,10 @@
|
|
|
23
23
|
"@fluentui/react-jsx-runtime": ">=9.2.0 <10.0.0",
|
|
24
24
|
"@fluentui/react-motion": ">=9.10.4 <10.0.0",
|
|
25
25
|
"@fluentui/react-utilities": ">=9.24.1 <10.0.0",
|
|
26
|
-
"@types/react": ">=16.14.0 <
|
|
27
|
-
"@types/react-dom": ">=16.9.8 <
|
|
28
|
-
"react": ">=16.14.0 <
|
|
29
|
-
"react-dom": ">=16.14.0 <
|
|
26
|
+
"@types/react": ">=16.14.0 <20.0.0",
|
|
27
|
+
"@types/react-dom": ">=16.9.8 <20.0.0",
|
|
28
|
+
"react": ">=16.14.0 <20.0.0",
|
|
29
|
+
"react-dom": ">=16.14.0 <20.0.0"
|
|
30
30
|
},
|
|
31
31
|
"beachball": {},
|
|
32
32
|
"exports": {
|
package/dist/index.d.ts
DELETED
|
@@ -1,165 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
|
|
3
|
-
import type { ComponentProps } from '@fluentui/react-components';
|
|
4
|
-
import type { ComponentState } from '@fluentui/react-components';
|
|
5
|
-
import type { ForwardRefComponent } from '@fluentui/react-components';
|
|
6
|
-
import type { InitialConfigType } from '@fluentui-copilot/react-text-editor';
|
|
7
|
-
import { JSX as JSX_2 } from 'react/jsx-runtime';
|
|
8
|
-
import type { LexicalEditor } from '@fluentui-copilot/react-text-editor';
|
|
9
|
-
import type { LexicalPlainTextPlugin } from '@fluentui-copilot/react-text-editor';
|
|
10
|
-
import type { PresenceMotionSlotProps } from '@fluentui/react-motion';
|
|
11
|
-
import * as React_2 from 'react';
|
|
12
|
-
import type { Slot } from '@fluentui/react-components';
|
|
13
|
-
import type { SlotClassNames } from '@fluentui/react-components';
|
|
14
|
-
|
|
15
|
-
export declare const AnimatedPlaceholder: ForwardRefComponent<AnimatedPlaceholderProps>;
|
|
16
|
-
|
|
17
|
-
export declare const animatedPlaceholderClassNames: SlotClassNames<Omit<AnimatedPlaceholderSlots, 'motion'>>;
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* AnimatedPlaceholder Props
|
|
21
|
-
*/
|
|
22
|
-
export declare type AnimatedPlaceholderProps = ComponentProps<Partial<AnimatedPlaceholderSlots>> & {
|
|
23
|
-
/**
|
|
24
|
-
* The placeholder value to animate.
|
|
25
|
-
*/
|
|
26
|
-
placeholderValue: string;
|
|
27
|
-
};
|
|
28
|
-
|
|
29
|
-
export declare type AnimatedPlaceholderSlots = {
|
|
30
|
-
root: NonNullable<Slot<'div'>>;
|
|
31
|
-
motion: NonNullable<Slot<PresenceMotionSlotProps>>;
|
|
32
|
-
placeholder: NonNullable<Slot<'div'>>;
|
|
33
|
-
};
|
|
34
|
-
|
|
35
|
-
/**
|
|
36
|
-
* State used in rendering AnimatedPlaceholder
|
|
37
|
-
*/
|
|
38
|
-
export declare type AnimatedPlaceholderState = ComponentState<AnimatedPlaceholderSlots>;
|
|
39
|
-
|
|
40
|
-
export declare const EditorInput: ForwardRefComponent<EditorInputProps>;
|
|
41
|
-
|
|
42
|
-
export declare const editorInputClassNames: SlotClassNames<EditorInputSlots>;
|
|
43
|
-
|
|
44
|
-
/**
|
|
45
|
-
* EditorInput Props
|
|
46
|
-
*/
|
|
47
|
-
export declare type EditorInputProps = Omit<ComponentProps<Partial<EditorInputSlots>, 'input'>, 'onChange' | 'onPaste' | 'defaultValue' | 'onSubmit'> & {
|
|
48
|
-
disabled?: boolean;
|
|
49
|
-
/**
|
|
50
|
-
* If defaultValue is a string, it will be added to the input on first render.
|
|
51
|
-
* If defaultValue is a function, it can call lexical $ functions to imperatively set the initial content with more complex nodes.
|
|
52
|
-
*/
|
|
53
|
-
defaultValue?: string | (() => void);
|
|
54
|
-
/**
|
|
55
|
-
* Called when the default value is given to the editor.
|
|
56
|
-
* If `defaultValue` was a function, this will be called with the state of the editor after
|
|
57
|
-
* calling that function.
|
|
58
|
-
* If `defaultValue` was a string, this will be called with the same string.
|
|
59
|
-
*/
|
|
60
|
-
onDefaultValueSet?: (defaultValue: string) => void;
|
|
61
|
-
/**
|
|
62
|
-
* Callback for when the user changes the value.
|
|
63
|
-
* TODO: Add proper event type for callback
|
|
64
|
-
*/
|
|
65
|
-
onChange?: (ev: any, data: EditorInputValueData) => void;
|
|
66
|
-
/**
|
|
67
|
-
* Callback for when content is pasted into the Editor.
|
|
68
|
-
*/
|
|
69
|
-
onPaste?: (ev: ClipboardEvent) => void;
|
|
70
|
-
/**
|
|
71
|
-
* When true, the input will be cleared when only whitespace is remaining.
|
|
72
|
-
* @default false
|
|
73
|
-
*/
|
|
74
|
-
trimWhiteSpace?: boolean;
|
|
75
|
-
/**
|
|
76
|
-
* Used to register any custom nodes used by plugins added. Can also be used to override the default nodes.
|
|
77
|
-
*/
|
|
78
|
-
customNodes?: InitialConfigType['nodes'];
|
|
79
|
-
/**
|
|
80
|
-
* The plugin which is in charge of initializing Lexical and is given the `input` and `placeholder` slots
|
|
81
|
-
* @default LexicalPlainTextPlugin
|
|
82
|
-
*/
|
|
83
|
-
textPlugin?: typeof LexicalPlainTextPlugin;
|
|
84
|
-
/**
|
|
85
|
-
* Controls whether history is tracked to provide undo and redo functionality
|
|
86
|
-
* @default true
|
|
87
|
-
*/
|
|
88
|
-
history?: boolean;
|
|
89
|
-
editorRef?: React.RefObject<LexicalEditor | null>;
|
|
90
|
-
/**
|
|
91
|
-
* Customize the default styles of elements inserted by Lexical in the editor.
|
|
92
|
-
*/
|
|
93
|
-
customTheme?: InitialConfigType['theme'];
|
|
94
|
-
/**
|
|
95
|
-
* Whether or not to enable the sentinel node. The sentinel node is a node that is inserted at the end of the editor
|
|
96
|
-
* The SentinelNode fixes a Safari bug in lexical versions below 0.20.1
|
|
97
|
-
* @default true
|
|
98
|
-
*/
|
|
99
|
-
isSentinelNodeEnabled?: boolean;
|
|
100
|
-
};
|
|
101
|
-
|
|
102
|
-
export declare type EditorInputSlots = {
|
|
103
|
-
root: NonNullable<Slot<'span'>>;
|
|
104
|
-
input: NonNullable<Slot<'span'>>;
|
|
105
|
-
placeholderValue?: Slot<'span'>;
|
|
106
|
-
};
|
|
107
|
-
|
|
108
|
-
/**
|
|
109
|
-
* State used in rendering EditorInput
|
|
110
|
-
*/
|
|
111
|
-
export declare type EditorInputState = ComponentState<EditorInputSlots> & Required<Pick<EditorInputProps, 'disabled' | 'textPlugin' | 'history' | 'trimWhiteSpace' | 'editorRef' | 'isSentinelNodeEnabled'>> & Partial<Pick<EditorInputProps, 'onPaste'>> & {
|
|
112
|
-
lexicalInitialConfig: InitialConfigType;
|
|
113
|
-
handleOnChange: (value: string) => void;
|
|
114
|
-
};
|
|
115
|
-
|
|
116
|
-
/**
|
|
117
|
-
* Data passed to the `onChange` callback when the chat input's value changes.
|
|
118
|
-
*/
|
|
119
|
-
export declare type EditorInputValueData = {
|
|
120
|
-
value: string;
|
|
121
|
-
};
|
|
122
|
-
|
|
123
|
-
/**
|
|
124
|
-
* Render the final JSX of AnimatedPlaceholder
|
|
125
|
-
*/
|
|
126
|
-
export declare const renderAnimatedPlaceholder_unstable: (state: AnimatedPlaceholderState) => JSX_2.Element;
|
|
127
|
-
|
|
128
|
-
/**
|
|
129
|
-
* Render the final JSX of EditorInput
|
|
130
|
-
*/
|
|
131
|
-
export declare const renderEditorInput_unstable: (state: EditorInputState) => JSX_2.Element;
|
|
132
|
-
|
|
133
|
-
/**
|
|
134
|
-
* Create the state required to render AnimatedPlaceholder.
|
|
135
|
-
*
|
|
136
|
-
* The returned state can be modified with hooks such as useAnimatedPlaceholderStyles_unstable,
|
|
137
|
-
* before being passed to renderAnimatedPlaceholder_unstable.
|
|
138
|
-
*
|
|
139
|
-
* @param props - props from this instance of AnimatedPlaceholder
|
|
140
|
-
* @param ref - reference to root HTMLElement of AnimatedPlaceholder
|
|
141
|
-
*/
|
|
142
|
-
export declare const useAnimatedPlaceholder_unstable: (props: AnimatedPlaceholderProps, ref: React_2.Ref<HTMLDivElement>) => AnimatedPlaceholderState;
|
|
143
|
-
|
|
144
|
-
/**
|
|
145
|
-
* Apply styling to the AnimatedPlaceholder slots based on the state
|
|
146
|
-
*/
|
|
147
|
-
export declare const useAnimatedPlaceholderStyles_unstable: (state: AnimatedPlaceholderState) => AnimatedPlaceholderState;
|
|
148
|
-
|
|
149
|
-
/**
|
|
150
|
-
* Create the state required to render EditorInput.
|
|
151
|
-
*
|
|
152
|
-
* The returned state can be modified with hooks such as useEditorInputStyles_unstable,
|
|
153
|
-
* before being passed to renderEditorInput_unstable.
|
|
154
|
-
*
|
|
155
|
-
* @param props - props from this instance of EditorInput
|
|
156
|
-
* @param ref - reference to root HTMLElement of EditorInput
|
|
157
|
-
*/
|
|
158
|
-
export declare const useEditorInput_unstable: (props: EditorInputProps, ref: React_2.Ref<HTMLSpanElement>) => EditorInputState;
|
|
159
|
-
|
|
160
|
-
/**
|
|
161
|
-
* Apply styling to the EditorInput slots based on the state
|
|
162
|
-
*/
|
|
163
|
-
export declare const useEditorInputStyles_unstable: (state: EditorInputState) => EditorInputState;
|
|
164
|
-
|
|
165
|
-
export { }
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { AnimatedPlaceholder, renderAnimatedPlaceholder_unstable, useAnimatedPlaceholder_unstable, animatedPlaceholderClassNames, useAnimatedPlaceholderStyles_unstable } from './components/AnimatedPlaceholder/index';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["AnimatedPlaceholder.ts"],"sourcesContent":["export {\n AnimatedPlaceholder,\n renderAnimatedPlaceholder_unstable,\n useAnimatedPlaceholder_unstable,\n animatedPlaceholderClassNames,\n useAnimatedPlaceholderStyles_unstable,\n} from './components/AnimatedPlaceholder/index';\nexport type {\n AnimatedPlaceholderProps,\n AnimatedPlaceholderSlots,\n AnimatedPlaceholderState,\n} from './components/AnimatedPlaceholder/index';\n"],"names":["AnimatedPlaceholder","renderAnimatedPlaceholder_unstable","useAnimatedPlaceholder_unstable","animatedPlaceholderClassNames","useAnimatedPlaceholderStyles_unstable"],"rangeMappings":"","mappings":"AAAA,SACEA,mBAAmB,EACnBC,kCAAkC,EAClCC,+BAA+B,EAC/BC,6BAA6B,EAC7BC,qCAAqC,QAChC,yCAAyC"}
|
package/lib/EditorInput.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { EditorInput, editorInputClassNames, renderEditorInput_unstable, useEditorInputStyles_unstable, useEditorInput_unstable, useInputClassName, useLexicalStyles, usePlaceholderClassName } from './components/EditorInput/index';
|
package/lib/EditorInput.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
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,10 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { useAnimatedPlaceholder_unstable } from './useAnimatedPlaceholder';
|
|
3
|
-
import { renderAnimatedPlaceholder_unstable } from './renderAnimatedPlaceholder';
|
|
4
|
-
import { useAnimatedPlaceholderStyles_unstable } from './useAnimatedPlaceholderStyles.styles';
|
|
5
|
-
export const AnimatedPlaceholder = /*#__PURE__*/ React.forwardRef((props, ref)=>{
|
|
6
|
-
const state = useAnimatedPlaceholder_unstable(props, ref);
|
|
7
|
-
useAnimatedPlaceholderStyles_unstable(state);
|
|
8
|
-
return renderAnimatedPlaceholder_unstable(state);
|
|
9
|
-
});
|
|
10
|
-
AnimatedPlaceholder.displayName = 'AnimatedPlaceholder';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["AnimatedPlaceholder.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAnimatedPlaceholder_unstable } from './useAnimatedPlaceholder';\nimport { renderAnimatedPlaceholder_unstable } from './renderAnimatedPlaceholder';\nimport { useAnimatedPlaceholderStyles_unstable } from './useAnimatedPlaceholderStyles.styles';\nimport type { AnimatedPlaceholderProps } from './AnimatedPlaceholder.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\nexport const AnimatedPlaceholder: ForwardRefComponent<AnimatedPlaceholderProps> = React.forwardRef((props, ref) => {\n const state = useAnimatedPlaceholder_unstable(props, ref);\n\n useAnimatedPlaceholderStyles_unstable(state);\n return renderAnimatedPlaceholder_unstable(state);\n});\n\nAnimatedPlaceholder.displayName = 'AnimatedPlaceholder';\n"],"names":["React","useAnimatedPlaceholder_unstable","renderAnimatedPlaceholder_unstable","useAnimatedPlaceholderStyles_unstable","AnimatedPlaceholder","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SAASC,kCAAkC,QAAQ,8BAA8B;AACjF,SAASC,qCAAqC,QAAQ,wCAAwC;AAI9F,OAAO,MAAMC,oCAAqEJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IACzG,MAAMC,QAAQP,gCAAgCK,OAAOC;IAErDJ,sCAAsCK;IACtC,OAAON,mCAAmCM;AAC5C,GAAG;AAEHJ,oBAAoBK,WAAW,GAAG"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["AnimatedPlaceholder.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\nimport type { PresenceMotionSlotProps } from '@fluentui/react-motion';\n\nexport type AnimatedPlaceholderSlots = {\n root: NonNullable<Slot<'div'>>;\n motion: NonNullable<Slot<PresenceMotionSlotProps>>;\n placeholder: NonNullable<Slot<'div'>>;\n};\n\n/**\n * AnimatedPlaceholder Props\n */\nexport type AnimatedPlaceholderProps = ComponentProps<Partial<AnimatedPlaceholderSlots>> & {\n /**\n * The placeholder value to animate.\n */\n placeholderValue: string;\n};\n\n/**\n * State used in rendering AnimatedPlaceholder\n */\nexport type AnimatedPlaceholderState = ComponentState<AnimatedPlaceholderSlots>;\n"],"names":[],"rangeMappings":";;","mappings":"AAmBA;;CAEC,GACD,WAAgF"}
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
export { AnimatedPlaceholder } from './AnimatedPlaceholder';
|
|
2
|
-
export { renderAnimatedPlaceholder_unstable } from './renderAnimatedPlaceholder';
|
|
3
|
-
export { useAnimatedPlaceholder_unstable } from './useAnimatedPlaceholder';
|
|
4
|
-
export { animatedPlaceholderClassNames, useAnimatedPlaceholderStyles_unstable } from './useAnimatedPlaceholderStyles.styles';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"sourcesContent":["export { AnimatedPlaceholder } from './AnimatedPlaceholder';\nexport type {\n AnimatedPlaceholderProps,\n AnimatedPlaceholderSlots,\n AnimatedPlaceholderState,\n} from './AnimatedPlaceholder.types';\nexport { renderAnimatedPlaceholder_unstable } from './renderAnimatedPlaceholder';\nexport { useAnimatedPlaceholder_unstable } from './useAnimatedPlaceholder';\nexport {\n animatedPlaceholderClassNames,\n useAnimatedPlaceholderStyles_unstable,\n} from './useAnimatedPlaceholderStyles.styles';\n"],"names":["AnimatedPlaceholder","renderAnimatedPlaceholder_unstable","useAnimatedPlaceholder_unstable","animatedPlaceholderClassNames","useAnimatedPlaceholderStyles_unstable"],"rangeMappings":";;;","mappings":"AAAA,SAASA,mBAAmB,QAAQ,wBAAwB;AAM5D,SAASC,kCAAkC,QAAQ,8BAA8B;AACjF,SAASC,+BAA+B,QAAQ,2BAA2B;AAC3E,SACEC,6BAA6B,EAC7BC,qCAAqC,QAChC,wCAAwC"}
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import { createPresenceComponent, motionTokens } from '@fluentui/react-motion';
|
|
2
|
-
const placeholderMotion = ()=>{
|
|
3
|
-
const enterKeyframes = [
|
|
4
|
-
{
|
|
5
|
-
keyframes: [
|
|
6
|
-
{
|
|
7
|
-
opacity: 0
|
|
8
|
-
},
|
|
9
|
-
{
|
|
10
|
-
opacity: 1
|
|
11
|
-
}
|
|
12
|
-
],
|
|
13
|
-
duration: motionTokens.durationFaster,
|
|
14
|
-
easing: motionTokens.curveLinear
|
|
15
|
-
},
|
|
16
|
-
{
|
|
17
|
-
keyframes: [
|
|
18
|
-
{
|
|
19
|
-
transform: 'translateY(10px)'
|
|
20
|
-
},
|
|
21
|
-
{
|
|
22
|
-
transform: 'translateY(0)'
|
|
23
|
-
}
|
|
24
|
-
],
|
|
25
|
-
duration: motionTokens.durationNormal,
|
|
26
|
-
easing: motionTokens.curveDecelerateMid
|
|
27
|
-
}
|
|
28
|
-
];
|
|
29
|
-
const exitKeyframes = {
|
|
30
|
-
keyframes: [
|
|
31
|
-
{
|
|
32
|
-
opacity: 1
|
|
33
|
-
},
|
|
34
|
-
{
|
|
35
|
-
opacity: 0
|
|
36
|
-
}
|
|
37
|
-
],
|
|
38
|
-
duration: motionTokens.durationFaster,
|
|
39
|
-
easing: motionTokens.curveLinear
|
|
40
|
-
};
|
|
41
|
-
return {
|
|
42
|
-
enter: enterKeyframes,
|
|
43
|
-
exit: exitKeyframes
|
|
44
|
-
};
|
|
45
|
-
};
|
|
46
|
-
export const PlaceholderMotion = createPresenceComponent(placeholderMotion);
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["placeholderMotion.ts"],"sourcesContent":["import { type PresenceMotionFn, createPresenceComponent, motionTokens } from '@fluentui/react-motion';\n\nconst placeholderMotion: PresenceMotionFn = () => {\n const enterKeyframes = [\n {\n keyframes: [{ opacity: 0 }, { opacity: 1 }],\n duration: motionTokens.durationFaster,\n easing: motionTokens.curveLinear,\n },\n {\n keyframes: [{ transform: 'translateY(10px)' }, { transform: 'translateY(0)' }],\n duration: motionTokens.durationNormal,\n easing: motionTokens.curveDecelerateMid,\n },\n ];\n const exitKeyframes = {\n keyframes: [{ opacity: 1 }, { opacity: 0 }],\n duration: motionTokens.durationFaster,\n easing: motionTokens.curveLinear,\n };\n\n return {\n enter: enterKeyframes,\n exit: exitKeyframes,\n };\n};\n\nexport const PlaceholderMotion: ReturnType<typeof createPresenceComponent<{}>> =\n createPresenceComponent(placeholderMotion);\n"],"names":["createPresenceComponent","motionTokens","placeholderMotion","enterKeyframes","keyframes","opacity","duration","durationFaster","easing","curveLinear","transform","durationNormal","curveDecelerateMid","exitKeyframes","enter","exit","PlaceholderMotion"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAAgCA,uBAAuB,EAAEC,YAAY,QAAQ,yBAAyB;AAEtG,MAAMC,oBAAsC;IAC1C,MAAMC,iBAAiB;QACrB;YACEC,WAAW;gBAAC;oBAAEC,SAAS;gBAAE;gBAAG;oBAAEA,SAAS;gBAAE;aAAE;YAC3CC,UAAUL,aAAaM,cAAc;YACrCC,QAAQP,aAAaQ,WAAW;QAClC;QACA;YACEL,WAAW;gBAAC;oBAAEM,WAAW;gBAAmB;gBAAG;oBAAEA,WAAW;gBAAgB;aAAE;YAC9EJ,UAAUL,aAAaU,cAAc;YACrCH,QAAQP,aAAaW,kBAAkB;QACzC;KACD;IACD,MAAMC,gBAAgB;QACpBT,WAAW;YAAC;gBAAEC,SAAS;YAAE;YAAG;gBAAEA,SAAS;YAAE;SAAE;QAC3CC,UAAUL,aAAaM,cAAc;QACrCC,QAAQP,aAAaQ,WAAW;IAClC;IAEA,OAAO;QACLK,OAAOX;QACPY,MAAMF;IACR;AACF;AAEA,OAAO,MAAMG,oBACXhB,wBAAwBE,mBAAmB"}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
2
|
-
import { assertSlots } from '@fluentui/react-components';
|
|
3
|
-
/**
|
|
4
|
-
* Render the final JSX of AnimatedPlaceholder
|
|
5
|
-
*/ export const renderAnimatedPlaceholder_unstable = (state)=>{
|
|
6
|
-
assertSlots(state);
|
|
7
|
-
return /*#__PURE__*/ _jsx(state.root, {
|
|
8
|
-
children: /*#__PURE__*/ _jsx(state.motion, {
|
|
9
|
-
children: /*#__PURE__*/ _jsx(state.placeholder, {})
|
|
10
|
-
})
|
|
11
|
-
});
|
|
12
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["renderAnimatedPlaceholder.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { AnimatedPlaceholderState, AnimatedPlaceholderSlots } from './AnimatedPlaceholder.types';\n\n/**\n * Render the final JSX of AnimatedPlaceholder\n */\nexport const renderAnimatedPlaceholder_unstable = (state: AnimatedPlaceholderState) => {\n assertSlots<AnimatedPlaceholderSlots>(state);\n\n return (\n <state.root>\n <state.motion>\n <state.placeholder />\n </state.motion>\n </state.root>\n );\n};\n"],"names":["assertSlots","renderAnimatedPlaceholder_unstable","state","root","motion","placeholder"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAGzD;;CAEC,GACD,OAAO,MAAMC,qCAAqC,CAACC;IACjDF,YAAsCE;IAEtC,qBACE,KAACA,MAAMC,IAAI;kBACT,cAAA,KAACD,MAAME,MAAM;sBACX,cAAA,KAACF,MAAMG,WAAW;;;AAI1B,EAAE"}
|
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { getIntrinsicElementProps, slot } from '@fluentui/react-components';
|
|
3
|
-
import { PlaceholderMotion } from './placeholderMotion';
|
|
4
|
-
import { presenceMotionSlot } from '@fluentui/react-motion';
|
|
5
|
-
/**
|
|
6
|
-
* Create the state required to render AnimatedPlaceholder.
|
|
7
|
-
*
|
|
8
|
-
* The returned state can be modified with hooks such as useAnimatedPlaceholderStyles_unstable,
|
|
9
|
-
* before being passed to renderAnimatedPlaceholder_unstable.
|
|
10
|
-
*
|
|
11
|
-
* @param props - props from this instance of AnimatedPlaceholder
|
|
12
|
-
* @param ref - reference to root HTMLElement of AnimatedPlaceholder
|
|
13
|
-
*/ export const useAnimatedPlaceholder_unstable = (props, ref)=>{
|
|
14
|
-
const { placeholderValue } = props;
|
|
15
|
-
const [placeholder, setPlaceholder] = React.useState(placeholderValue);
|
|
16
|
-
const [visible, setVisible] = React.useState(true);
|
|
17
|
-
React.useEffect(()=>{
|
|
18
|
-
if (placeholderValue !== placeholder) {
|
|
19
|
-
setVisible(false);
|
|
20
|
-
}
|
|
21
|
-
}, [
|
|
22
|
-
placeholder,
|
|
23
|
-
placeholderValue
|
|
24
|
-
]);
|
|
25
|
-
const onMotionFinish = ()=>{
|
|
26
|
-
setPlaceholder(placeholderValue);
|
|
27
|
-
setVisible(true);
|
|
28
|
-
};
|
|
29
|
-
return {
|
|
30
|
-
components: {
|
|
31
|
-
root: 'div',
|
|
32
|
-
motion: PlaceholderMotion,
|
|
33
|
-
placeholder: 'div'
|
|
34
|
-
},
|
|
35
|
-
root: slot.always(getIntrinsicElementProps('div', {
|
|
36
|
-
ref,
|
|
37
|
-
...props
|
|
38
|
-
}), {
|
|
39
|
-
elementType: 'div'
|
|
40
|
-
}),
|
|
41
|
-
motion: presenceMotionSlot(props.motion, {
|
|
42
|
-
elementType: PlaceholderMotion,
|
|
43
|
-
defaultProps: {
|
|
44
|
-
visible: visible,
|
|
45
|
-
onMotionFinish: onMotionFinish
|
|
46
|
-
}
|
|
47
|
-
}),
|
|
48
|
-
placeholder: slot.always(getIntrinsicElementProps('div', {
|
|
49
|
-
children: placeholder
|
|
50
|
-
}), {
|
|
51
|
-
elementType: 'div'
|
|
52
|
-
})
|
|
53
|
-
};
|
|
54
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useAnimatedPlaceholder.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-components';\nimport type { AnimatedPlaceholderProps, AnimatedPlaceholderState } from './AnimatedPlaceholder.types';\nimport { PlaceholderMotion } from './placeholderMotion';\nimport { presenceMotionSlot } from '@fluentui/react-motion';\n\n/**\n * Create the state required to render AnimatedPlaceholder.\n *\n * The returned state can be modified with hooks such as useAnimatedPlaceholderStyles_unstable,\n * before being passed to renderAnimatedPlaceholder_unstable.\n *\n * @param props - props from this instance of AnimatedPlaceholder\n * @param ref - reference to root HTMLElement of AnimatedPlaceholder\n */\nexport const useAnimatedPlaceholder_unstable = (\n props: AnimatedPlaceholderProps,\n ref: React.Ref<HTMLDivElement>,\n): AnimatedPlaceholderState => {\n const { placeholderValue } = props;\n\n const [placeholder, setPlaceholder] = React.useState(placeholderValue);\n const [visible, setVisible] = React.useState(true);\n\n React.useEffect(() => {\n if (placeholderValue !== placeholder) {\n setVisible(false);\n }\n }, [placeholder, placeholderValue]);\n\n const onMotionFinish = () => {\n setPlaceholder(placeholderValue);\n setVisible(true);\n };\n\n return {\n components: {\n root: 'div',\n motion: PlaceholderMotion,\n placeholder: 'div',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n ...props,\n }),\n { elementType: 'div' },\n ),\n motion: presenceMotionSlot<{}>(props.motion, {\n elementType: PlaceholderMotion,\n defaultProps: {\n visible: visible,\n onMotionFinish: onMotionFinish,\n },\n }),\n placeholder: slot.always(\n getIntrinsicElementProps('div', {\n children: placeholder,\n }),\n { elementType: 'div' },\n ),\n };\n};\n"],"names":["React","getIntrinsicElementProps","slot","PlaceholderMotion","presenceMotionSlot","useAnimatedPlaceholder_unstable","props","ref","placeholderValue","placeholder","setPlaceholder","useState","visible","setVisible","useEffect","onMotionFinish","components","root","motion","always","elementType","defaultProps","children"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,6BAA6B;AAE5E,SAASC,iBAAiB,QAAQ,sBAAsB;AACxD,SAASC,kBAAkB,QAAQ,yBAAyB;AAE5D;;;;;;;;CAQC,GACD,OAAO,MAAMC,kCAAkC,CAC7CC,OACAC;IAEA,MAAM,EAAEC,gBAAgB,EAAE,GAAGF;IAE7B,MAAM,CAACG,aAAaC,eAAe,GAAGV,MAAMW,QAAQ,CAACH;IACrD,MAAM,CAACI,SAASC,WAAW,GAAGb,MAAMW,QAAQ,CAAC;IAE7CX,MAAMc,SAAS,CAAC;QACd,IAAIN,qBAAqBC,aAAa;YACpCI,WAAW;QACb;IACF,GAAG;QAACJ;QAAaD;KAAiB;IAElC,MAAMO,iBAAiB;QACrBL,eAAeF;QACfK,WAAW;IACb;IAEA,OAAO;QACLG,YAAY;YACVC,MAAM;YACNC,QAAQf;YACRM,aAAa;QACf;QACAQ,MAAMf,KAAKiB,MAAM,CACflB,yBAAyB,OAAO;YAC9BM;YACA,GAAGD,KAAK;QACV,IACA;YAAEc,aAAa;QAAM;QAEvBF,QAAQd,mBAAuBE,MAAMY,MAAM,EAAE;YAC3CE,aAAajB;YACbkB,cAAc;gBACZT,SAASA;gBACTG,gBAAgBA;YAClB;QACF;QACAN,aAAaP,KAAKiB,MAAM,CACtBlB,yBAAyB,OAAO;YAC9BqB,UAAUb;QACZ,IACA;YAAEW,aAAa;QAAM;IAEzB;AACF,EAAE"}
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import { __resetStyles, mergeClasses } from '@fluentui/react-components';
|
|
2
|
-
export const animatedPlaceholderClassNames = {
|
|
3
|
-
root: 'fai-AnimatedPlaceholder',
|
|
4
|
-
placeholder: 'fai-AnimatedPlaceholder__placeholder'
|
|
5
|
-
};
|
|
6
|
-
/**
|
|
7
|
-
* Styles for the root slot
|
|
8
|
-
*/
|
|
9
|
-
const useRootClassNames = __resetStyles("r7ukxtn", null, [".r7ukxtn{overflow:clip;}"]);
|
|
10
|
-
/**
|
|
11
|
-
* Apply styling to the AnimatedPlaceholder slots based on the state
|
|
12
|
-
*/
|
|
13
|
-
export const useAnimatedPlaceholderStyles_unstable = state => {
|
|
14
|
-
'use no memo';
|
|
15
|
-
|
|
16
|
-
const rootClassNames = useRootClassNames();
|
|
17
|
-
state.root.className = mergeClasses(animatedPlaceholderClassNames.root, rootClassNames, state.root.className);
|
|
18
|
-
if (state.placeholder) {
|
|
19
|
-
state.placeholder.className = mergeClasses(animatedPlaceholderClassNames.placeholder, state.placeholder.className);
|
|
20
|
-
}
|
|
21
|
-
return state;
|
|
22
|
-
};
|
|
23
|
-
//# sourceMappingURL=useAnimatedPlaceholderStyles.styles.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useAnimatedPlaceholderStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses } from '@fluentui/react-components';\nimport type { AnimatedPlaceholderSlots, AnimatedPlaceholderState } from './AnimatedPlaceholder.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const animatedPlaceholderClassNames: SlotClassNames<Omit<AnimatedPlaceholderSlots, 'motion'>> = {\n root: 'fai-AnimatedPlaceholder',\n placeholder: 'fai-AnimatedPlaceholder__placeholder',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootClassNames = makeResetStyles({\n overflow: 'clip',\n});\n\n/**\n * Apply styling to the AnimatedPlaceholder slots based on the state\n */\nexport const useAnimatedPlaceholderStyles_unstable = (state: AnimatedPlaceholderState): AnimatedPlaceholderState => {\n 'use no memo';\n\n const rootClassNames = useRootClassNames();\n state.root.className = mergeClasses(animatedPlaceholderClassNames.root, rootClassNames, state.root.className);\n\n if (state.placeholder) {\n state.placeholder.className = mergeClasses(animatedPlaceholderClassNames.placeholder, state.placeholder.className);\n }\n\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","animatedPlaceholderClassNames","root","placeholder","useRootClassNames","overflow","useAnimatedPlaceholderStyles_unstable","state","rootClassNames","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,QAAQ,6BAA6B;AAI3E,OAAO,MAAMC,gCAA0F;IACrGC,MAAM;IACNC,aAAa;AACf,EAAE;AAEF;;CAEC,GACD,MAAMC,oBAAoBL,gBAAgB;IACxCM,UAAU;AACZ;AAEA;;CAEC,GACD,OAAO,MAAMC,wCAAwC,CAACC;IACpD;IAEA,MAAMC,iBAAiBJ;IACvBG,MAAML,IAAI,CAACO,SAAS,GAAGT,aAAaC,8BAA8BC,IAAI,EAAEM,gBAAgBD,MAAML,IAAI,CAACO,SAAS;IAE5G,IAAIF,MAAMJ,WAAW,EAAE;QACrBI,MAAMJ,WAAW,CAACM,SAAS,GAAGT,aAAaC,8BAA8BE,WAAW,EAAEI,MAAMJ,WAAW,CAACM,SAAS;IACnH;IAEA,OAAOF;AACT,EAAE"}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { makeResetStyles, mergeClasses } from '@fluentui/react-components';
|
|
2
|
-
export const animatedPlaceholderClassNames = {
|
|
3
|
-
root: 'fai-AnimatedPlaceholder',
|
|
4
|
-
placeholder: 'fai-AnimatedPlaceholder__placeholder'
|
|
5
|
-
};
|
|
6
|
-
/**
|
|
7
|
-
* Styles for the root slot
|
|
8
|
-
*/ const useRootClassNames = makeResetStyles({
|
|
9
|
-
overflow: 'clip'
|
|
10
|
-
});
|
|
11
|
-
/**
|
|
12
|
-
* Apply styling to the AnimatedPlaceholder slots based on the state
|
|
13
|
-
*/ export const useAnimatedPlaceholderStyles_unstable = (state)=>{
|
|
14
|
-
'use no memo';
|
|
15
|
-
const rootClassNames = useRootClassNames();
|
|
16
|
-
state.root.className = mergeClasses(animatedPlaceholderClassNames.root, rootClassNames, state.root.className);
|
|
17
|
-
if (state.placeholder) {
|
|
18
|
-
state.placeholder.className = mergeClasses(animatedPlaceholderClassNames.placeholder, state.placeholder.className);
|
|
19
|
-
}
|
|
20
|
-
return state;
|
|
21
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useAnimatedPlaceholderStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses } from '@fluentui/react-components';\nimport type { AnimatedPlaceholderSlots, AnimatedPlaceholderState } from './AnimatedPlaceholder.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const animatedPlaceholderClassNames: SlotClassNames<Omit<AnimatedPlaceholderSlots, 'motion'>> = {\n root: 'fai-AnimatedPlaceholder',\n placeholder: 'fai-AnimatedPlaceholder__placeholder',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootClassNames = makeResetStyles({\n overflow: 'clip',\n});\n\n/**\n * Apply styling to the AnimatedPlaceholder slots based on the state\n */\nexport const useAnimatedPlaceholderStyles_unstable = (state: AnimatedPlaceholderState): AnimatedPlaceholderState => {\n 'use no memo';\n\n const rootClassNames = useRootClassNames();\n state.root.className = mergeClasses(animatedPlaceholderClassNames.root, rootClassNames, state.root.className);\n\n if (state.placeholder) {\n state.placeholder.className = mergeClasses(animatedPlaceholderClassNames.placeholder, state.placeholder.className);\n }\n\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","animatedPlaceholderClassNames","root","placeholder","useRootClassNames","overflow","useAnimatedPlaceholderStyles_unstable","state","rootClassNames","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,QAAQ,6BAA6B;AAI3E,OAAO,MAAMC,gCAA0F;IACrGC,MAAM;IACNC,aAAa;AACf,EAAE;AAEF;;CAEC,GACD,MAAMC,oBAAoBL,gBAAgB;IACxCM,UAAU;AACZ;AAEA;;CAEC,GACD,OAAO,MAAMC,wCAAwC,CAACC;IACpD;IAEA,MAAMC,iBAAiBJ;IACvBG,MAAML,IAAI,CAACO,SAAS,GAAGT,aAAaC,8BAA8BC,IAAI,EAAEM,gBAAgBD,MAAML,IAAI,CAACO,SAAS;IAE5G,IAAIF,MAAMJ,WAAW,EAAE;QACrBI,MAAMJ,WAAW,CAACM,SAAS,GAAGT,aAAaC,8BAA8BE,WAAW,EAAEI,MAAMJ,WAAW,CAACM,SAAS;IACnH;IAEA,OAAOF;AACT,EAAE"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { useEditorInput_unstable } from './useEditorInput';
|
|
3
|
-
import { renderEditorInput_unstable } from './renderEditorInput';
|
|
4
|
-
import { useEditorInputStyles_unstable } from './useEditorInputStyles.styles';
|
|
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);
|
|
10
|
-
});
|
|
11
|
-
EditorInput.displayName = 'EditorInput';
|
|
@@ -1 +0,0 @@
|
|
|
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":["React","useEditorInput_unstable","renderEditorInput_unstable","useEditorInputStyles_unstable","EditorInput","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,6BAA6B,QAAQ,gCAAgC;AAI9E,8CAA8C;AAC9C,OAAO,MAAMC,4BAAqDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQP,wBAAwBK,OAAOC;IAE7CJ,8BAA8BK;IAC9B,OAAON,2BAA2BM;AACpC,GAAG;AAEHJ,YAAYK,WAAW,GAAG"}
|
|
@@ -1 +0,0 @@
|
|
|
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 * Called when the default value is given to the editor.\n * If `defaultValue` was a function, this will be called with the state of the editor after\n * calling that function.\n * If `defaultValue` was a string, this will be called with the same string.\n */\n onDefaultValueSet?: (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 | null>;\n\n /**\n * Customize the default styles of elements inserted by Lexical in the editor.\n */\n customTheme?: InitialConfigType['theme'];\n\n /**\n * Whether or not to enable the sentinel node. The sentinel node is a node that is inserted at the end of the editor\n * The SentinelNode fixes a Safari bug in lexical versions below 0.20.1\n * @default true\n */\n isSentinelNodeEnabled?: boolean;\n};\n\n/**\n * State used in rendering EditorInput\n */\nexport type EditorInputState = ComponentState<EditorInputSlots> &\n Required<\n Pick<\n EditorInputProps,\n 'disabled' | 'textPlugin' | 'history' | 'trimWhiteSpace' | 'editorRef' | 'isSentinelNodeEnabled'\n >\n > &\n Partial<Pick<EditorInputProps, 'onPaste'>> & {\n lexicalInitialConfig: InitialConfigType;\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":"AAyFA;;CAEC,GACD,WAEE"}
|
|
@@ -1,4 +0,0 @@
|
|
|
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';
|
|
@@ -1 +0,0 @@
|
|
|
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"}
|
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
2
|
-
import { assertSlots } from '@fluentui/react-components';
|
|
3
|
-
import { LexicalComposer, LexicalErrorBoundary, LexicalEditorRefPlugin, LexicalHistoryPlugin } from '@fluentui-copilot/react-text-editor';
|
|
4
|
-
import { BasicFunctionalityPlugin } from '@fluentui-copilot/react-chat-input-plugins';
|
|
5
|
-
/**
|
|
6
|
-
* Render the final JSX of EditorInput
|
|
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
|
-
isSentinelNodeEnabled: state.isSentinelNodeEnabled
|
|
25
|
-
}),
|
|
26
|
-
state.history && /*#__PURE__*/ _jsx(LexicalHistoryPlugin, {})
|
|
27
|
-
]
|
|
28
|
-
}),
|
|
29
|
-
/*#__PURE__*/ _jsx(LexicalEditorRefPlugin, {
|
|
30
|
-
editorRef: state.editorRef
|
|
31
|
-
})
|
|
32
|
-
]
|
|
33
|
-
})
|
|
34
|
-
});
|
|
35
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
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 isSentinelNodeEnabled={state.isSentinelNodeEnabled}\n />\n {state.history && <LexicalHistoryPlugin />}\n </>\n <LexicalEditorRefPlugin editorRef={state.editorRef} />\n </LexicalComposer>\n </state.root>\n );\n};\n"],"names":["assertSlots","LexicalComposer","LexicalErrorBoundary","LexicalEditorRefPlugin","LexicalHistoryPlugin","BasicFunctionalityPlugin","renderEditorInput_unstable","state","root","initialConfig","lexicalInitialConfig","textPlugin","contentEditable","input","ErrorBoundary","placeholder","placeholderValue","onContentChange","handleOnChange","onPaste","trimWhitespace","trimWhiteSpace","isSentinelNodeEnabled","history","editorRef"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAEzD,SACEC,eAAe,EACfC,oBAAoB,EACpBC,sBAAsB,EACtBC,oBAAoB,QACf,sCAAsC;AAC7C,SAASC,wBAAwB,QAAQ,6CAA6C;AAEtF;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzCP,YAA8BO;IAE9B,qBACE,KAACA,MAAMC,IAAI;kBACT,cAAA,MAACP;YAAgBQ,eAAeF,MAAMG,oBAAoB;;8BACxD,KAACH,MAAMI,UAAU;oBACfC,+BAAiB,KAACL,MAAMM,KAAK;oBAC7BC,eAAeZ;oBACfa,aAAaR,MAAMS,gBAAgB,iBAAG,KAACT,MAAMS,gBAAgB,QAAM;;8BAErE;;sCACE,KAACX;4BACCY,iBAAiBV,MAAMW,cAAc;4BACrCC,SAASZ,MAAMY,OAAO;4BACtBC,gBAAgBb,MAAMc,cAAc;4BACpCC,uBAAuBf,MAAMe,qBAAqB;;wBAEnDf,MAAMgB,OAAO,kBAAI,KAACnB;;;8BAErB,KAACD;oBAAuBqB,WAAWjB,MAAMiB,SAAS;;;;;AAI1D,EAAE"}
|