@fluentui-copilot/react-attachments 0.0.0-nightly-20250716-0405-895dbbbf.1 → 0.0.0-nightly-20250717-0405-eecbae35.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/lib/AgentTag.js +0 -1
- package/lib/Attachment.js +0 -1
- package/lib/AttachmentList.js +0 -1
- package/lib/AttachmentOverflowMenu.js +0 -1
- package/lib/AttachmentOverflowMenuButton.js +0 -1
- package/lib/AttachmentOverflowMenuItem.js +0 -1
- package/lib/components/AgentTag/AgentTag.js +4 -5
- package/lib/components/AgentTag/AgentTag.types.js +1 -2
- package/lib/components/AgentTag/index.js +0 -1
- package/lib/components/AgentTag/renderAgentTag.js +3 -5
- package/lib/components/AgentTag/useAgentTag.js +7 -9
- package/lib/components/Attachment/Attachment.js +5 -6
- package/lib/components/Attachment/Attachment.types.js +1 -2
- package/lib/components/Attachment/index.js +0 -1
- package/lib/components/Attachment/renderAttachment.js +36 -31
- package/lib/components/Attachment/useAttachment.js +85 -95
- package/lib/components/AttachmentList/AttachmentList.js +6 -7
- package/lib/components/AttachmentList/AttachmentList.types.js +1 -2
- package/lib/components/AttachmentList/index.js +0 -1
- package/lib/components/AttachmentList/renderAttachmentList.js +25 -25
- package/lib/components/AttachmentList/useAttachmentList.js +113 -124
- package/lib/components/AttachmentList/useAttachmentListContextValues.js +10 -15
- package/lib/components/AttachmentOverflowMenu/AttachmentOverflowMenu.js +8 -9
- package/lib/components/AttachmentOverflowMenu/AttachmentOverflowMenu.types.js +1 -2
- package/lib/components/AttachmentOverflowMenu/index.js +0 -1
- package/lib/components/AttachmentOverflowMenu/renderAttachmentOverflowMenu.js +8 -13
- package/lib/components/AttachmentOverflowMenu/useAttachmentOverflowMenu.js +9 -15
- package/lib/components/AttachmentOverflowMenu/useAttachmentOverflowMenuContextValues.js +10 -15
- package/lib/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js +5 -6
- package/lib/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.types.js +1 -2
- package/lib/components/AttachmentOverflowMenuButton/index.js +0 -1
- package/lib/components/AttachmentOverflowMenuButton/renderAttachmentOverflowMenuButton.js +11 -10
- package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js +51 -59
- package/lib/components/AttachmentOverflowMenuItem/AttachmentOverflowMenuItem.js +4 -5
- package/lib/components/AttachmentOverflowMenuItem/AttachmentOverflowMenuItem.types.js +1 -2
- package/lib/components/AttachmentOverflowMenuItem/index.js +0 -1
- package/lib/components/AttachmentOverflowMenuItem/renderAttachmentOverflowMenuItem.js +9 -8
- package/lib/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItem.js +41 -49
- package/lib/components/index.js +0 -1
- package/lib/contexts/attachmentListContext.js +4 -5
- package/lib/contexts/attachmentOverflowMenuContext.js +4 -5
- package/lib/index.js +0 -1
- package/lib-commonjs/AgentTag.js +0 -1
- package/lib-commonjs/Attachment.js +0 -1
- package/lib-commonjs/AttachmentList.js +0 -1
- package/lib-commonjs/AttachmentOverflowMenu.js +0 -1
- package/lib-commonjs/AttachmentOverflowMenuButton.js +0 -1
- package/lib-commonjs/AttachmentOverflowMenuItem.js +0 -1
- package/lib-commonjs/components/AgentTag/AgentTag.js +1 -1
- package/lib-commonjs/components/AgentTag/AgentTag.js.map +1 -1
- package/lib-commonjs/components/AgentTag/AgentTag.types.js +0 -1
- package/lib-commonjs/components/AgentTag/index.js +0 -1
- package/lib-commonjs/components/AgentTag/renderAgentTag.js +1 -1
- package/lib-commonjs/components/AgentTag/renderAgentTag.js.map +1 -1
- package/lib-commonjs/components/AgentTag/useAgentTag.js +1 -1
- package/lib-commonjs/components/AgentTag/useAgentTag.js.map +1 -1
- package/lib-commonjs/components/Attachment/Attachment.js +1 -1
- package/lib-commonjs/components/Attachment/Attachment.js.map +1 -1
- package/lib-commonjs/components/Attachment/Attachment.types.js +0 -1
- package/lib-commonjs/components/Attachment/index.js +0 -1
- package/lib-commonjs/components/Attachment/renderAttachment.js +1 -1
- package/lib-commonjs/components/Attachment/renderAttachment.js.map +1 -1
- package/lib-commonjs/components/Attachment/useAttachment.js +1 -1
- package/lib-commonjs/components/Attachment/useAttachment.js.map +1 -1
- package/lib-commonjs/components/AttachmentList/AttachmentList.js +1 -1
- package/lib-commonjs/components/AttachmentList/AttachmentList.js.map +1 -1
- package/lib-commonjs/components/AttachmentList/AttachmentList.types.js +0 -1
- package/lib-commonjs/components/AttachmentList/index.js +0 -1
- package/lib-commonjs/components/AttachmentList/renderAttachmentList.js +1 -1
- package/lib-commonjs/components/AttachmentList/renderAttachmentList.js.map +1 -1
- package/lib-commonjs/components/AttachmentList/useAttachmentList.js +1 -1
- package/lib-commonjs/components/AttachmentList/useAttachmentList.js.map +1 -1
- package/lib-commonjs/components/AttachmentList/useAttachmentListContextValues.js +1 -1
- package/lib-commonjs/components/AttachmentList/useAttachmentListContextValues.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/AttachmentOverflowMenu.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/AttachmentOverflowMenu.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/AttachmentOverflowMenu.types.js +0 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/index.js +0 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/renderAttachmentOverflowMenu.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/renderAttachmentOverflowMenu.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/useAttachmentOverflowMenu.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/useAttachmentOverflowMenu.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/useAttachmentOverflowMenuContextValues.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenu/useAttachmentOverflowMenuContextValues.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.types.js +0 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/index.js +0 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/renderAttachmentOverflowMenuButton.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/renderAttachmentOverflowMenuButton.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuItem/AttachmentOverflowMenuItem.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuItem/AttachmentOverflowMenuItem.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuItem/AttachmentOverflowMenuItem.types.js +0 -1
- package/lib-commonjs/components/AttachmentOverflowMenuItem/index.js +0 -1
- package/lib-commonjs/components/AttachmentOverflowMenuItem/renderAttachmentOverflowMenuItem.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuItem/renderAttachmentOverflowMenuItem.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItem.js +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItem.js.map +1 -1
- package/lib-commonjs/components/index.js +0 -1
- package/lib-commonjs/contexts/attachmentListContext.js +1 -1
- package/lib-commonjs/contexts/attachmentListContext.js.map +1 -1
- package/lib-commonjs/contexts/attachmentOverflowMenuContext.js +1 -1
- package/lib-commonjs/contexts/attachmentOverflowMenuContext.js.map +1 -1
- package/lib-commonjs/index.js +0 -1
- package/package.json +4 -4
|
@@ -16,130 +16,119 @@ import { useDesignVersion } from '@fluentui-copilot/react-provider';
|
|
|
16
16
|
*
|
|
17
17
|
* @param props - props from this instance of AttachmentList
|
|
18
18
|
* @param ref - reference to root HTMLElement of AttachmentList
|
|
19
|
-
*/
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
var _findLastFocusable;
|
|
57
|
-
(_findLastFocusable = findLastFocusable(innerRef.current)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();
|
|
58
|
-
}, 0);
|
|
19
|
+
*/ export const useAttachmentList_unstable = (props, ref)=>{
|
|
20
|
+
const { children, maxVisibleAttachments, onAttachmentDismiss, overflowMenuProps } = props;
|
|
21
|
+
const innerRef = React.useRef(null);
|
|
22
|
+
const [setTimeout] = useTimeout();
|
|
23
|
+
const { targetDocument } = useFluent();
|
|
24
|
+
const designVersion = useDesignVersion(props.designVersion);
|
|
25
|
+
const { findNextFocusable, findPrevFocusable, findLastFocusable } = useFocusFinders();
|
|
26
|
+
const handleAttachmentDismiss = useEventCallback((e, data)=>{
|
|
27
|
+
var _innerRef_current;
|
|
28
|
+
if (!onAttachmentDismiss) {
|
|
29
|
+
return;
|
|
30
|
+
}
|
|
31
|
+
onAttachmentDismiss(e, data);
|
|
32
|
+
// set focus after attachment dismiss
|
|
33
|
+
const activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;
|
|
34
|
+
if ((_innerRef_current = innerRef.current) === null || _innerRef_current === void 0 ? void 0 : _innerRef_current.contains(activeElement)) {
|
|
35
|
+
// focus on next attachment only if the active element is within the current attachment list
|
|
36
|
+
const next = findNextFocusable(activeElement, {
|
|
37
|
+
container: innerRef.current
|
|
38
|
+
});
|
|
39
|
+
if (next) {
|
|
40
|
+
// focus on the overflow button if the next focusable element is the overflow button.
|
|
41
|
+
// if overflow button is removed from the DOM, focus on the last focusable element in the attachment list.
|
|
42
|
+
if (next.classList.contains(attachmentOverflowMenuButtonClassNames.root)) {
|
|
43
|
+
setTimeout(()=>{
|
|
44
|
+
var _findLastFocusable;
|
|
45
|
+
(_findLastFocusable = findLastFocusable(innerRef.current)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();
|
|
46
|
+
}, 0);
|
|
47
|
+
} else {
|
|
48
|
+
next.focus();
|
|
49
|
+
}
|
|
50
|
+
} else {
|
|
51
|
+
const prev = findPrevFocusable(activeElement === null || activeElement === void 0 ? void 0 : activeElement.parentElement, {
|
|
52
|
+
container: innerRef.current
|
|
53
|
+
});
|
|
54
|
+
prev === null || prev === void 0 ? void 0 : prev.focus();
|
|
55
|
+
}
|
|
59
56
|
} else {
|
|
60
|
-
|
|
57
|
+
// Handles keyboard focus when attachment removed is in the overflow menu. Also handles focus when the overflow button is removed from the DOM.
|
|
58
|
+
setTimeout(()=>{
|
|
59
|
+
var _findLastFocusable;
|
|
60
|
+
(_findLastFocusable = findLastFocusable(innerRef.current)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();
|
|
61
|
+
}, 0);
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
const styles = useOverflowStyles();
|
|
65
|
+
const resolvedChildren = useOverflowMaxVisibleItems({
|
|
66
|
+
children,
|
|
67
|
+
maxVisibleItems: maxVisibleAttachments,
|
|
68
|
+
overflowClassName: styles.overflow
|
|
69
|
+
});
|
|
70
|
+
const attachmentOverflowMenuItems = React.useMemo(()=>{
|
|
71
|
+
if (resolvedChildren && Array.isArray(resolvedChildren)) {
|
|
72
|
+
return resolvedChildren.filter((child)=>/*#__PURE__*/ React.isValidElement(child)).map((child)=>child.props).map((attachment)=>{
|
|
73
|
+
const dismissButton = slot.optional(attachment.dismissButton, {
|
|
74
|
+
elementType: 'button'
|
|
75
|
+
});
|
|
76
|
+
return /*#__PURE__*/ React.createElement(AttachmentOverflowMenuItem, {
|
|
77
|
+
...attachment,
|
|
78
|
+
key: attachment.id,
|
|
79
|
+
onClick: dismissButton === null || dismissButton === void 0 ? void 0 : dismissButton.onClick
|
|
80
|
+
});
|
|
81
|
+
});
|
|
61
82
|
}
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
overflowMenuButton: 'span'
|
|
114
|
-
},
|
|
115
|
-
root: slot.always(getIntrinsicElementProps('div', {
|
|
116
|
-
'aria-label': 'Attachments',
|
|
117
|
-
ref: useMergedRefs(ref, innerRef),
|
|
118
|
-
role: 'toolbar',
|
|
119
|
-
...arrowNavigationProps,
|
|
120
|
-
...props,
|
|
121
|
-
children: resolvedChildren
|
|
122
|
-
}), {
|
|
123
|
-
elementType: 'div'
|
|
124
|
-
}),
|
|
125
|
-
menuList: slot.optional(props.menuList, {
|
|
126
|
-
defaultProps: {
|
|
127
|
-
children: attachmentOverflowMenuItems
|
|
128
|
-
},
|
|
129
|
-
elementType: MenuList,
|
|
130
|
-
renderByDefault: true
|
|
131
|
-
}),
|
|
132
|
-
menuPopover: slot.optional(props.menuPopover, {
|
|
133
|
-
elementType: MenuPopover,
|
|
134
|
-
renderByDefault: true
|
|
135
|
-
}),
|
|
136
|
-
overflowMenuButton: slot.optional(props.overflowMenuButton, {
|
|
137
|
-
defaultProps: {
|
|
138
|
-
children: /*#__PURE__*/React.createElement(AttachmentOverflowMenuButton, null)
|
|
139
|
-
},
|
|
140
|
-
elementType: 'span',
|
|
141
|
-
renderByDefault: true
|
|
142
|
-
})
|
|
143
|
-
};
|
|
83
|
+
return [];
|
|
84
|
+
}, [
|
|
85
|
+
resolvedChildren
|
|
86
|
+
]);
|
|
87
|
+
const arrowNavigationProps = useArrowNavigationGroup({
|
|
88
|
+
circular: true,
|
|
89
|
+
axis: 'both',
|
|
90
|
+
memorizeCurrent: true
|
|
91
|
+
});
|
|
92
|
+
const shouldUseOverflow = maxVisibleAttachments !== undefined;
|
|
93
|
+
return {
|
|
94
|
+
designVersion,
|
|
95
|
+
onAttachmentDismiss: handleAttachmentDismiss,
|
|
96
|
+
shouldUseOverflow,
|
|
97
|
+
numberOfAttachments: resolvedChildren.length,
|
|
98
|
+
overflowMenuProps,
|
|
99
|
+
components: {
|
|
100
|
+
root: 'div',
|
|
101
|
+
menuList: MenuList,
|
|
102
|
+
menuPopover: MenuPopover,
|
|
103
|
+
overflowMenuButton: 'span'
|
|
104
|
+
},
|
|
105
|
+
root: slot.always(getIntrinsicElementProps('div', {
|
|
106
|
+
'aria-label': 'Attachments',
|
|
107
|
+
ref: useMergedRefs(ref, innerRef),
|
|
108
|
+
role: 'toolbar',
|
|
109
|
+
...arrowNavigationProps,
|
|
110
|
+
...props,
|
|
111
|
+
children: resolvedChildren
|
|
112
|
+
}), {
|
|
113
|
+
elementType: 'div'
|
|
114
|
+
}),
|
|
115
|
+
menuList: slot.optional(props.menuList, {
|
|
116
|
+
defaultProps: {
|
|
117
|
+
children: attachmentOverflowMenuItems
|
|
118
|
+
},
|
|
119
|
+
elementType: MenuList,
|
|
120
|
+
renderByDefault: true
|
|
121
|
+
}),
|
|
122
|
+
menuPopover: slot.optional(props.menuPopover, {
|
|
123
|
+
elementType: MenuPopover,
|
|
124
|
+
renderByDefault: true
|
|
125
|
+
}),
|
|
126
|
+
overflowMenuButton: slot.optional(props.overflowMenuButton, {
|
|
127
|
+
defaultProps: {
|
|
128
|
+
children: /*#__PURE__*/ React.createElement(AttachmentOverflowMenuButton, null)
|
|
129
|
+
},
|
|
130
|
+
elementType: 'span',
|
|
131
|
+
renderByDefault: true
|
|
132
|
+
})
|
|
133
|
+
};
|
|
144
134
|
};
|
|
145
|
-
//# sourceMappingURL=useAttachmentList.js.map
|
|
@@ -1,17 +1,12 @@
|
|
|
1
1
|
export function useAttachmentListContextValues_unstable(state) {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
};
|
|
13
|
-
return {
|
|
14
|
-
attachmentList
|
|
15
|
-
};
|
|
2
|
+
const { numberOfAttachments, onAttachmentDismiss, shouldUseOverflow } = state;
|
|
3
|
+
// This context is created with "@fluentui/react-context-selector", there is no sense to memoize it
|
|
4
|
+
const attachmentList = {
|
|
5
|
+
numberOfAttachments,
|
|
6
|
+
onAttachmentDismiss,
|
|
7
|
+
shouldUseOverflow
|
|
8
|
+
};
|
|
9
|
+
return {
|
|
10
|
+
attachmentList
|
|
11
|
+
};
|
|
16
12
|
}
|
|
17
|
-
//# sourceMappingURL=useAttachmentListContextValues.js.map
|
|
@@ -2,14 +2,13 @@ import { useAttachmentOverflowMenu_unstable } from './useAttachmentOverflowMenu'
|
|
|
2
2
|
import { renderAttachmentOverflowMenu_unstable } from './renderAttachmentOverflowMenu';
|
|
3
3
|
import { useAttachmentOverflowMenuContextValues_unstable } from './useAttachmentOverflowMenuContextValues';
|
|
4
4
|
import { useMenuContextValues_unstable } from '@fluentui/react-components';
|
|
5
|
-
export const AttachmentOverflowMenu = props
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
5
|
+
export const AttachmentOverflowMenu = (props)=>{
|
|
6
|
+
const state = useAttachmentOverflowMenu_unstable(props);
|
|
7
|
+
const menuContextValues = useMenuContextValues_unstable(state);
|
|
8
|
+
const attachmentOverflowMenuContextValues = useAttachmentOverflowMenuContextValues_unstable(state);
|
|
9
|
+
return renderAttachmentOverflowMenu_unstable(state, {
|
|
10
|
+
menuContextValues,
|
|
11
|
+
attachmentOverflowMenuContextValues
|
|
12
|
+
});
|
|
13
13
|
};
|
|
14
14
|
AttachmentOverflowMenu.displayName = 'AttachmentOverflowMenu';
|
|
15
|
-
//# sourceMappingURL=AttachmentOverflowMenu.js.map
|
|
@@ -1,2 +1 @@
|
|
|
1
|
-
export {};
|
|
2
|
-
//# sourceMappingURL=AttachmentOverflowMenu.types.js.map
|
|
1
|
+
export { };
|
|
@@ -2,4 +2,3 @@ export { AttachmentOverflowMenu } from './AttachmentOverflowMenu';
|
|
|
2
2
|
export { renderAttachmentOverflowMenu_unstable } from './renderAttachmentOverflowMenu';
|
|
3
3
|
export { useAttachmentOverflowMenu_unstable } from './useAttachmentOverflowMenu';
|
|
4
4
|
export { useAttachmentOverflowMenuContextValues_unstable } from './useAttachmentOverflowMenuContextValues';
|
|
5
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1,18 +1,13 @@
|
|
|
1
|
-
import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
2
2
|
import { assertSlots, renderMenu_unstable } from '@fluentui/react-components';
|
|
3
3
|
import { AttachmentOverflowMenuProvider } from '../../contexts/attachmentOverflowMenuContext';
|
|
4
4
|
/**
|
|
5
5
|
* Render the final JSX of AttachmentOverflowMenu
|
|
6
|
-
*/
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
return state.isOverflowing ? /*#__PURE__*/_jsx(AttachmentOverflowMenuProvider, {
|
|
14
|
-
value: attachmentOverflowMenuContextValues.attachmentOverflowMenu,
|
|
15
|
-
children: renderMenu_unstable(state, menuContextValues)
|
|
16
|
-
}) : null;
|
|
6
|
+
*/ export const renderAttachmentOverflowMenu_unstable = (state, contextValues)=>{
|
|
7
|
+
const { menuContextValues, attachmentOverflowMenuContextValues } = contextValues;
|
|
8
|
+
assertSlots(state);
|
|
9
|
+
return state.isOverflowing ? /*#__PURE__*/ _jsx(AttachmentOverflowMenuProvider, {
|
|
10
|
+
value: attachmentOverflowMenuContextValues.attachmentOverflowMenu,
|
|
11
|
+
children: renderMenu_unstable(state, menuContextValues)
|
|
12
|
+
}) : null;
|
|
17
13
|
};
|
|
18
|
-
//# sourceMappingURL=renderAttachmentOverflowMenu.js.map
|
|
@@ -6,19 +6,13 @@ import { useMenu_unstable, useOverflowMenu } from '@fluentui/react-components';
|
|
|
6
6
|
* before being passed to renderAttachmentOverflowMenu_unstable.
|
|
7
7
|
*
|
|
8
8
|
* @param props - props from this instance of AttachmentOverflowMenu
|
|
9
|
-
*/
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
...menuState,
|
|
19
|
-
isOverflowing,
|
|
20
|
-
overflowButtonRef,
|
|
21
|
-
overflowCount
|
|
22
|
-
};
|
|
9
|
+
*/ export const useAttachmentOverflowMenu_unstable = (props)=>{
|
|
10
|
+
const menuState = useMenu_unstable(props);
|
|
11
|
+
const { isOverflowing, ref: overflowButtonRef, overflowCount } = useOverflowMenu();
|
|
12
|
+
return {
|
|
13
|
+
...menuState,
|
|
14
|
+
isOverflowing,
|
|
15
|
+
overflowButtonRef,
|
|
16
|
+
overflowCount
|
|
17
|
+
};
|
|
23
18
|
};
|
|
24
|
-
//# sourceMappingURL=useAttachmentOverflowMenu.js.map
|
|
@@ -1,17 +1,12 @@
|
|
|
1
1
|
export function useAttachmentOverflowMenuContextValues_unstable(state) {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
};
|
|
13
|
-
return {
|
|
14
|
-
attachmentOverflowMenu
|
|
15
|
-
};
|
|
2
|
+
const { isOverflowing, overflowButtonRef, overflowCount } = state;
|
|
3
|
+
// This context is created with "@fluentui/react-context-selector", there is no sense to memoize it
|
|
4
|
+
const attachmentOverflowMenu = {
|
|
5
|
+
isOverflowing,
|
|
6
|
+
overflowButtonRef,
|
|
7
|
+
overflowCount
|
|
8
|
+
};
|
|
9
|
+
return {
|
|
10
|
+
attachmentOverflowMenu
|
|
11
|
+
};
|
|
16
12
|
}
|
|
17
|
-
//# sourceMappingURL=useAttachmentOverflowMenuContextValues.js.map
|
|
@@ -3,11 +3,10 @@ import { useAttachmentOverflowMenuButton_unstable } from './useAttachmentOverflo
|
|
|
3
3
|
import { renderAttachmentOverflowMenuButton_unstable } from './renderAttachmentOverflowMenuButton';
|
|
4
4
|
import { useAttachmentOverflowMenuButtonStyles_unstable } from './useAttachmentOverflowMenuButtonStyles.styles';
|
|
5
5
|
import { useCustomStyleHook } from '@fluentui-copilot/react-provider';
|
|
6
|
-
export const AttachmentOverflowMenuButton = /*#__PURE__*/React.forwardRef((props, ref)
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
6
|
+
export const AttachmentOverflowMenuButton = /*#__PURE__*/ React.forwardRef((props, ref)=>{
|
|
7
|
+
const state = useAttachmentOverflowMenuButton_unstable(props, ref);
|
|
8
|
+
useAttachmentOverflowMenuButtonStyles_unstable(state);
|
|
9
|
+
useCustomStyleHook('useAttachmentOverflowMenuButtonStyles')(state);
|
|
10
|
+
return renderAttachmentOverflowMenuButton_unstable(state);
|
|
11
11
|
});
|
|
12
12
|
AttachmentOverflowMenuButton.displayName = 'AttachmentOverflowMenuButton';
|
|
13
|
-
//# sourceMappingURL=AttachmentOverflowMenuButton.js.map
|
|
@@ -2,4 +2,3 @@ export { AttachmentOverflowMenuButton } from './AttachmentOverflowMenuButton';
|
|
|
2
2
|
export { renderAttachmentOverflowMenuButton_unstable } from './renderAttachmentOverflowMenuButton';
|
|
3
3
|
export { useAttachmentOverflowMenuButton_unstable } from './useAttachmentOverflowMenuButton';
|
|
4
4
|
export { attachmentOverflowMenuButtonClassNames, useAttachmentOverflowMenuButtonStyles_unstable } from './useAttachmentOverflowMenuButtonStyles.styles';
|
|
5
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1,14 +1,15 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
2
2
|
import { MenuTrigger, assertSlots } from '@fluentui/react-components';
|
|
3
3
|
/**
|
|
4
4
|
* Render the final JSX of AttachmentOverflowMenuButton
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
5
|
+
*/ export const renderAttachmentOverflowMenuButton_unstable = (state)=>{
|
|
6
|
+
assertSlots(state);
|
|
7
|
+
return state.isOverflowing ? /*#__PURE__*/ _jsx(MenuTrigger, {
|
|
8
|
+
children: /*#__PURE__*/ _jsxs(state.root, {
|
|
9
|
+
children: [
|
|
10
|
+
state.root.children,
|
|
11
|
+
state.isLoading && /*#__PURE__*/ _jsx(state.progress, {})
|
|
12
|
+
]
|
|
13
|
+
})
|
|
14
|
+
}) : null;
|
|
13
15
|
};
|
|
14
|
-
//# sourceMappingURL=renderAttachmentOverflowMenuButton.js.map
|
|
@@ -12,66 +12,58 @@ import { useAttachmentListContext_unstable } from '../../contexts/attachmentList
|
|
|
12
12
|
*
|
|
13
13
|
* @param props - props from this instance of AttachmentOverflowMenuButton
|
|
14
14
|
* @param ref - reference to root HTMLElement of AttachmentOverflowMenuButton
|
|
15
|
-
*/
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
}
|
|
53
|
-
fullyOverflowed,
|
|
54
|
-
isOverflowing,
|
|
55
|
-
overflowCount,
|
|
56
|
-
isLoading,
|
|
57
|
-
designVersion,
|
|
58
|
-
mode
|
|
59
|
-
};
|
|
15
|
+
*/ export const useAttachmentOverflowMenuButton_unstable = (props, ref)=>{
|
|
16
|
+
const { isOverflowing, overflowCount, overflowButtonRef } = useAttachmentOverflowMenuContext_unstable((context)=>context);
|
|
17
|
+
const { numberOfAttachments } = useAttachmentListContext_unstable((context)=>context);
|
|
18
|
+
const fullyOverflowed = overflowCount >= numberOfAttachments;
|
|
19
|
+
const isLoading = !!props.isLoading;
|
|
20
|
+
const designVersion = useDesignVersion(props.designVersion);
|
|
21
|
+
const mode = useCopilotMode(props.mode);
|
|
22
|
+
const buttonText = defaultButtonText(props, overflowCount, designVersion, mode, fullyOverflowed);
|
|
23
|
+
return {
|
|
24
|
+
components: {
|
|
25
|
+
root: 'button',
|
|
26
|
+
progress: ProgressBar
|
|
27
|
+
},
|
|
28
|
+
root: slot.always(getIntrinsicElementProps('button', {
|
|
29
|
+
ref: useMergedRefs(ref, overflowButtonRef),
|
|
30
|
+
...props
|
|
31
|
+
}), {
|
|
32
|
+
defaultProps: {
|
|
33
|
+
children: buttonText
|
|
34
|
+
},
|
|
35
|
+
elementType: 'button'
|
|
36
|
+
}),
|
|
37
|
+
progress: slot.always(props.progress, {
|
|
38
|
+
defaultProps: {
|
|
39
|
+
value: undefined,
|
|
40
|
+
shape: 'square',
|
|
41
|
+
thickness: 'large',
|
|
42
|
+
'aria-label': 'Loading'
|
|
43
|
+
},
|
|
44
|
+
elementType: ProgressBar
|
|
45
|
+
}),
|
|
46
|
+
fullyOverflowed,
|
|
47
|
+
isOverflowing,
|
|
48
|
+
overflowCount,
|
|
49
|
+
isLoading,
|
|
50
|
+
designVersion,
|
|
51
|
+
mode
|
|
52
|
+
};
|
|
60
53
|
};
|
|
61
54
|
function defaultButtonText(props, overflowCount, designVersion, copilotMode, fullyOverflowed) {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
}
|
|
65
|
-
if (props.text) {
|
|
66
|
-
if (typeof props.text === 'function') {
|
|
67
|
-
return props.text(overflowCount);
|
|
68
|
-
} else {
|
|
69
|
-
return props.text;
|
|
55
|
+
if (props.children) {
|
|
56
|
+
return props.children;
|
|
70
57
|
}
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
58
|
+
if (props.text) {
|
|
59
|
+
if (typeof props.text === 'function') {
|
|
60
|
+
return props.text(overflowCount);
|
|
61
|
+
} else {
|
|
62
|
+
return props.text;
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
if (designVersion === 'next' && fullyOverflowed) {
|
|
66
|
+
return /*#__PURE__*/ React.createElement(React.Fragment, null, copilotMode === 'canvas' ? /*#__PURE__*/ React.createElement(Attach24Regular, null) : /*#__PURE__*/ React.createElement(Attach20Regular, null), overflowCount);
|
|
67
|
+
}
|
|
68
|
+
return `+${overflowCount}`;
|
|
76
69
|
}
|
|
77
|
-
//# sourceMappingURL=useAttachmentOverflowMenuButton.js.map
|
|
@@ -2,10 +2,9 @@ import * as React from 'react';
|
|
|
2
2
|
import { useAttachmentOverflowMenuItem_unstable } from './useAttachmentOverflowMenuItem';
|
|
3
3
|
import { renderAttachmentOverflowMenuItem_unstable } from './renderAttachmentOverflowMenuItem';
|
|
4
4
|
import { useAttachmentOverflowMenuItemStyles_unstable } from './useAttachmentOverflowMenuItemStyles.styles';
|
|
5
|
-
export const AttachmentOverflowMenuItem = /*#__PURE__*/React.forwardRef((props, ref)
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
5
|
+
export const AttachmentOverflowMenuItem = /*#__PURE__*/ React.forwardRef((props, ref)=>{
|
|
6
|
+
const state = useAttachmentOverflowMenuItem_unstable(props, ref);
|
|
7
|
+
useAttachmentOverflowMenuItemStyles_unstable(state);
|
|
8
|
+
return renderAttachmentOverflowMenuItem_unstable(state);
|
|
9
9
|
});
|
|
10
10
|
AttachmentOverflowMenuItem.displayName = 'AttachmentOverflowMenuItem';
|
|
11
|
-
//# sourceMappingURL=AttachmentOverflowMenuItem.js.map
|
|
@@ -2,4 +2,3 @@ export { AttachmentOverflowMenuItem } from './AttachmentOverflowMenuItem';
|
|
|
2
2
|
export { renderAttachmentOverflowMenuItem_unstable } from './renderAttachmentOverflowMenuItem';
|
|
3
3
|
export { useAttachmentOverflowMenuItem_unstable } from './useAttachmentOverflowMenuItem';
|
|
4
4
|
export { attachmentOverflowMenuItemClassNames, useAttachmentOverflowMenuItemStyles_unstable } from './useAttachmentOverflowMenuItemStyles.styles';
|
|
5
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1,12 +1,13 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
|
|
2
2
|
import { assertSlots } from '@fluentui/react-components';
|
|
3
3
|
/**
|
|
4
4
|
* Render the final JSX of AttachmentOverflowMenuItem
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
5
|
+
*/ export const renderAttachmentOverflowMenuItem_unstable = (state)=>{
|
|
6
|
+
assertSlots(state);
|
|
7
|
+
return !state.isVisible ? /*#__PURE__*/ _jsxs(state.root, {
|
|
8
|
+
children: [
|
|
9
|
+
state.root.children,
|
|
10
|
+
state.progress && /*#__PURE__*/ _jsx(state.progress, {})
|
|
11
|
+
]
|
|
12
|
+
}) : null;
|
|
11
13
|
};
|
|
12
|
-
//# sourceMappingURL=renderAttachmentOverflowMenuItem.js.map
|