@fluentui-copilot/react-attachments 0.0.0-nightly-20250708-1433-52f2b6b1.1 → 0.0.0-nightly-20250709-0404-150e065c.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 +1 -0
- package/lib/Attachment.js +1 -0
- package/lib/AttachmentList.js +1 -0
- package/lib/AttachmentOverflowMenu.js +1 -0
- package/lib/AttachmentOverflowMenuButton.js +1 -0
- package/lib/AttachmentOverflowMenuItem.js +1 -0
- package/lib/components/AgentTag/AgentTag.js +5 -4
- package/lib/components/AgentTag/AgentTag.types.js +2 -1
- package/lib/components/AgentTag/index.js +1 -0
- package/lib/components/AgentTag/renderAgentTag.js +5 -3
- package/lib/components/AgentTag/useAgentTag.js +9 -7
- package/lib/components/Attachment/Attachment.js +6 -5
- package/lib/components/Attachment/Attachment.types.js +2 -1
- package/lib/components/Attachment/index.js +1 -0
- package/lib/components/Attachment/renderAttachment.js +31 -36
- package/lib/components/Attachment/useAttachment.js +95 -85
- package/lib/components/AttachmentList/AttachmentList.js +7 -6
- package/lib/components/AttachmentList/AttachmentList.types.js +2 -1
- package/lib/components/AttachmentList/index.js +1 -0
- package/lib/components/AttachmentList/renderAttachmentList.js +25 -25
- package/lib/components/AttachmentList/useAttachmentList.js +124 -113
- package/lib/components/AttachmentList/useAttachmentListContextValues.js +15 -10
- package/lib/components/AttachmentOverflowMenu/AttachmentOverflowMenu.js +9 -8
- package/lib/components/AttachmentOverflowMenu/AttachmentOverflowMenu.types.js +2 -1
- package/lib/components/AttachmentOverflowMenu/index.js +1 -0
- package/lib/components/AttachmentOverflowMenu/renderAttachmentOverflowMenu.js +13 -8
- package/lib/components/AttachmentOverflowMenu/useAttachmentOverflowMenu.js +15 -9
- package/lib/components/AttachmentOverflowMenu/useAttachmentOverflowMenuContextValues.js +15 -10
- package/lib/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js +6 -5
- package/lib/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.types.js +2 -1
- package/lib/components/AttachmentOverflowMenuButton/index.js +1 -0
- package/lib/components/AttachmentOverflowMenuButton/renderAttachmentOverflowMenuButton.js +10 -11
- package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js +59 -51
- package/lib/components/AttachmentOverflowMenuItem/AttachmentOverflowMenuItem.js +5 -4
- package/lib/components/AttachmentOverflowMenuItem/AttachmentOverflowMenuItem.types.js +2 -1
- package/lib/components/AttachmentOverflowMenuItem/index.js +1 -0
- package/lib/components/AttachmentOverflowMenuItem/renderAttachmentOverflowMenuItem.js +8 -9
- package/lib/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItem.js +49 -41
- package/lib/components/index.js +1 -0
- package/lib/contexts/attachmentListContext.js +5 -4
- package/lib/contexts/attachmentOverflowMenuContext.js +5 -4
- package/lib/index.js +1 -0
- package/lib-commonjs/AgentTag.js +1 -0
- package/lib-commonjs/Attachment.js +1 -0
- package/lib-commonjs/AttachmentList.js +1 -0
- package/lib-commonjs/AttachmentOverflowMenu.js +1 -0
- package/lib-commonjs/AttachmentOverflowMenuButton.js +1 -0
- package/lib-commonjs/AttachmentOverflowMenuItem.js +1 -0
- 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 +1 -0
- package/lib-commonjs/components/AgentTag/index.js +1 -0
- 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 +1 -0
- package/lib-commonjs/components/Attachment/index.js +1 -0
- 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 +1 -0
- package/lib-commonjs/components/AttachmentList/index.js +1 -0
- 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 +1 -0
- package/lib-commonjs/components/AttachmentOverflowMenu/index.js +1 -0
- 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 +1 -0
- package/lib-commonjs/components/AttachmentOverflowMenuButton/index.js +1 -0
- 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 +1 -0
- package/lib-commonjs/components/AttachmentOverflowMenuItem/index.js +1 -0
- 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 +1 -0
- 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 +1 -0
- package/package.json +4 -4
- package/lib/components/AgentTag/useAgentTagStyles.styles.raw.js +0 -66
- package/lib/components/AgentTag/useAgentTagStyles.styles.raw.js.map +0 -1
- package/lib/components/Attachment/useAttachmentStyles.styles.raw.js +0 -317
- package/lib/components/Attachment/useAttachmentStyles.styles.raw.js.map +0 -1
- package/lib/components/AttachmentList/useAttachmentListStyles.styles.raw.js +0 -44
- package/lib/components/AttachmentList/useAttachmentListStyles.styles.raw.js.map +0 -1
- package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles.raw.js +0 -102
- package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles.raw.js.map +0 -1
- package/lib/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItemStyles.styles.raw.js +0 -57
- package/lib/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItemStyles.styles.raw.js.map +0 -1
- package/lib/components/utils/useProgressBarStyles.styles.raw.js +0 -42
- package/lib/components/utils/useProgressBarStyles.styles.raw.js.map +0 -1
- package/lib-commonjs/components/AgentTag/useAgentTagStyles.styles.raw.js +0 -82
- package/lib-commonjs/components/AgentTag/useAgentTagStyles.styles.raw.js.map +0 -1
- package/lib-commonjs/components/Attachment/useAttachmentStyles.styles.raw.js +0 -336
- package/lib-commonjs/components/Attachment/useAttachmentStyles.styles.raw.js.map +0 -1
- package/lib-commonjs/components/AttachmentList/useAttachmentListStyles.styles.raw.js +0 -60
- package/lib-commonjs/components/AttachmentList/useAttachmentListStyles.styles.raw.js.map +0 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles.raw.js +0 -118
- package/lib-commonjs/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles.raw.js.map +0 -1
- package/lib-commonjs/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItemStyles.styles.raw.js +0 -73
- package/lib-commonjs/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItemStyles.styles.raw.js.map +0 -1
- package/lib-commonjs/components/utils/useProgressBarStyles.styles.raw.js +0 -50
- package/lib-commonjs/components/utils/useProgressBarStyles.styles.raw.js.map +0 -1
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
import { makeStyles } from '@fluentui/react-components';
|
|
2
|
-
import { tokens } from '@fluentui-copilot/tokens';
|
|
3
|
-
const indeterminateProgressBarReducedMotion = {
|
|
4
|
-
'0%': {
|
|
5
|
-
opacity: '.2'
|
|
6
|
-
},
|
|
7
|
-
'50%': {
|
|
8
|
-
opacity: '1'
|
|
9
|
-
},
|
|
10
|
-
'100%': {
|
|
11
|
-
opacity: '.2'
|
|
12
|
-
}
|
|
13
|
-
};
|
|
14
|
-
/**
|
|
15
|
-
* @internal
|
|
16
|
-
*/ export const useProgressBarStyles = makeStyles({
|
|
17
|
-
progress: {
|
|
18
|
-
width: '100%',
|
|
19
|
-
position: 'absolute',
|
|
20
|
-
bottom: 0,
|
|
21
|
-
left: 0,
|
|
22
|
-
right: 0,
|
|
23
|
-
height: '4px',
|
|
24
|
-
borderBottomLeftRadius: tokens.borderRadiusMedium,
|
|
25
|
-
borderBottomRightRadius: tokens.borderRadiusMedium
|
|
26
|
-
},
|
|
27
|
-
regularProgressBar: {
|
|
28
|
-
height: '100%',
|
|
29
|
-
backgroundImage: `linear-gradient(90deg, ${tokens.colorBrandFlair1} 35%, ${tokens.colorBrandFlair2} 70%, ${tokens.colorBrandFlair3} 92%)`
|
|
30
|
-
},
|
|
31
|
-
indeterminateProgressBar: {
|
|
32
|
-
height: '100%',
|
|
33
|
-
backgroundColor: tokens.colorTransparentBackground,
|
|
34
|
-
backgroundImage: `linear-gradient(90deg, rgba(0,0,0,0) 0%, ${tokens.colorBrandFlair1} 35%, ${tokens.colorBrandFlair2} 70%, ${tokens.colorBrandFlair3} 92%, rgba(0,0,0,0))`,
|
|
35
|
-
'@media screen and (prefers-reduced-motion: reduce)': {
|
|
36
|
-
maxWidth: '100%',
|
|
37
|
-
animationIterationCount: 'infinite',
|
|
38
|
-
animationDuration: '3s',
|
|
39
|
-
animationName: indeterminateProgressBarReducedMotion
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
});
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useProgressBarStyles.styles.ts"],"sourcesContent":["import { makeStyles } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\n\nconst indeterminateProgressBarReducedMotion = {\n '0%': {\n opacity: '.2', // matches indeterminate bar width\n },\n '50%': {\n opacity: '1',\n },\n '100%': {\n opacity: '.2',\n },\n};\n\n/**\n * @internal\n */\nexport const useProgressBarStyles = makeStyles({\n progress: {\n width: '100%',\n position: 'absolute',\n bottom: 0,\n left: 0,\n right: 0,\n height: '4px',\n borderBottomLeftRadius: tokens.borderRadiusMedium,\n borderBottomRightRadius: tokens.borderRadiusMedium,\n },\n regularProgressBar: {\n height: '100%',\n backgroundImage: `linear-gradient(90deg, ${tokens.colorBrandFlair1} 35%, ${tokens.colorBrandFlair2} 70%, ${tokens.colorBrandFlair3} 92%)`,\n },\n indeterminateProgressBar: {\n height: '100%',\n backgroundColor: tokens.colorTransparentBackground,\n backgroundImage: `linear-gradient(90deg, rgba(0,0,0,0) 0%, ${tokens.colorBrandFlair1} 35%, ${tokens.colorBrandFlair2} 70%, ${tokens.colorBrandFlair3} 92%, rgba(0,0,0,0))`,\n '@media screen and (prefers-reduced-motion: reduce)': {\n maxWidth: '100%',\n animationIterationCount: 'infinite',\n animationDuration: '3s',\n animationName: indeterminateProgressBarReducedMotion,\n },\n },\n});\n"],"names":["makeStyles","tokens","indeterminateProgressBarReducedMotion","opacity","useProgressBarStyles","progress","width","position","bottom","left","right","height","borderBottomLeftRadius","borderRadiusMedium","borderBottomRightRadius","regularProgressBar","backgroundImage","colorBrandFlair1","colorBrandFlair2","colorBrandFlair3","indeterminateProgressBar","backgroundColor","colorTransparentBackground","maxWidth","animationIterationCount","animationDuration","animationName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,QAAQ,6BAA6B;AACxD,SAASC,MAAM,QAAQ,2BAA2B;AAElD,MAAMC,wCAAwC;IAC5C,MAAM;QACJC,SAAS;IACX;IACA,OAAO;QACLA,SAAS;IACX;IACA,QAAQ;QACNA,SAAS;IACX;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,uBAAuBJ,WAAW;IAC7CK,UAAU;QACRC,OAAO;QACPC,UAAU;QACVC,QAAQ;QACRC,MAAM;QACNC,OAAO;QACPC,QAAQ;QACRC,wBAAwBX,OAAOY,kBAAkB;QACjDC,yBAAyBb,OAAOY,kBAAkB;IACpD;IACAE,oBAAoB;QAClBJ,QAAQ;QACRK,iBAAiB,CAAC,uBAAuB,EAAEf,OAAOgB,gBAAgB,CAAC,MAAM,EAAEhB,OAAOiB,gBAAgB,CAAC,MAAM,EAAEjB,OAAOkB,gBAAgB,CAAC,KAAK,CAAC;IAC3I;IACAC,0BAA0B;QACxBT,QAAQ;QACRU,iBAAiBpB,OAAOqB,0BAA0B;QAClDN,iBAAiB,CAAC,yCAAyC,EAAEf,OAAOgB,gBAAgB,CAAC,MAAM,EAAEhB,OAAOiB,gBAAgB,CAAC,MAAM,EAAEjB,OAAOkB,gBAAgB,CAAC,qBAAqB,CAAC;QAC3K,sDAAsD;YACpDI,UAAU;YACVC,yBAAyB;YACzBC,mBAAmB;YACnBC,eAAexB;QACjB;IACF;AACF,GAAG"}
|
|
@@ -1,82 +0,0 @@
|
|
|
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
|
-
agentTagClassNames: function() {
|
|
13
|
-
return agentTagClassNames;
|
|
14
|
-
},
|
|
15
|
-
useAgentTagStyles_unstable: function() {
|
|
16
|
-
return useAgentTagStyles_unstable;
|
|
17
|
-
}
|
|
18
|
-
});
|
|
19
|
-
const _reactcomponents = require("@fluentui/react-components");
|
|
20
|
-
const _ = require("..");
|
|
21
|
-
const _tokens = require("@fluentui-copilot/tokens");
|
|
22
|
-
const agentTagClassNames = {
|
|
23
|
-
root: 'fai-AgentTag',
|
|
24
|
-
primaryAction: 'fai-AgentTag__primaryAction',
|
|
25
|
-
dismissIcon: 'fai-AgentTag__dismissIcon',
|
|
26
|
-
dismissButton: 'fai-AgentTag__dismissButton',
|
|
27
|
-
media: 'fai-AgentTag__media',
|
|
28
|
-
content: 'fai-AgentTag__content',
|
|
29
|
-
progress: 'fai-AgentTag__progress'
|
|
30
|
-
};
|
|
31
|
-
const useMediaStyles = (0, _reactcomponents.makeStyles)({
|
|
32
|
-
canvas: {
|
|
33
|
-
width: '24px',
|
|
34
|
-
height: '24px'
|
|
35
|
-
},
|
|
36
|
-
sidecar: {
|
|
37
|
-
width: '20px',
|
|
38
|
-
height: '20px'
|
|
39
|
-
}
|
|
40
|
-
});
|
|
41
|
-
const useContentStyles = (0, _reactcomponents.makeStyles)({
|
|
42
|
-
canvas: {
|
|
43
|
-
..._tokens.typographyStyles.subtitle2,
|
|
44
|
-
color: _tokens.tokens.colorNeutralForeground2
|
|
45
|
-
},
|
|
46
|
-
sidecar: {
|
|
47
|
-
..._tokens.typographyStyles.body1Strong,
|
|
48
|
-
color: _tokens.tokens.colorNeutralForeground2
|
|
49
|
-
}
|
|
50
|
-
});
|
|
51
|
-
const useDismissButtonStyles = (0, _reactcomponents.makeStyles)({
|
|
52
|
-
canvas: {
|
|
53
|
-
borderRadius: _tokens.tokens.borderRadius2XL,
|
|
54
|
-
paddingLeft: _tokens.tokens.spacingHorizontalL,
|
|
55
|
-
paddingRight: _tokens.tokens.spacingHorizontalM
|
|
56
|
-
},
|
|
57
|
-
sidecar: {
|
|
58
|
-
paddingLeft: _tokens.tokens.spacingHorizontalM,
|
|
59
|
-
paddingRight: _tokens.tokens.spacingHorizontalS,
|
|
60
|
-
borderRadius: _tokens.tokens.borderRadiusXLarge
|
|
61
|
-
}
|
|
62
|
-
});
|
|
63
|
-
const useAgentTagStyles_unstable = (state)=>{
|
|
64
|
-
'use no memo';
|
|
65
|
-
const { mode } = state;
|
|
66
|
-
const contentStyles = useContentStyles();
|
|
67
|
-
const dismissButtonStyles = useDismissButtonStyles();
|
|
68
|
-
const mediaStyles = useMediaStyles();
|
|
69
|
-
state.root.className = (0, _reactcomponents.mergeClasses)(agentTagClassNames.root, state.root.className);
|
|
70
|
-
state.primaryAction.className = (0, _reactcomponents.mergeClasses)(agentTagClassNames.primaryAction, state.primaryAction.className);
|
|
71
|
-
state.dismissIcon.className = (0, _reactcomponents.mergeClasses)(agentTagClassNames.dismissIcon, state.dismissIcon.className);
|
|
72
|
-
state.dismissButton.className = (0, _reactcomponents.mergeClasses)(agentTagClassNames.dismissButton, dismissButtonStyles[mode], state.dismissButton.className);
|
|
73
|
-
if (state.media) {
|
|
74
|
-
state.media.className = (0, _reactcomponents.mergeClasses)(agentTagClassNames.media, mediaStyles[mode], state.media.className);
|
|
75
|
-
}
|
|
76
|
-
state.content.className = (0, _reactcomponents.mergeClasses)(agentTagClassNames.content, contentStyles[mode], state.content.className);
|
|
77
|
-
if (state.progress) {
|
|
78
|
-
state.progress.className = (0, _reactcomponents.mergeClasses)(agentTagClassNames.progress, state.progress.className);
|
|
79
|
-
}
|
|
80
|
-
(0, _.useAttachmentStyles_unstable)(state);
|
|
81
|
-
return state;
|
|
82
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useAgentTagStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@fluentui/react-components';\nimport type { AgentTagSlots, AgentTagState } from './AgentTag.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\nimport { useAttachmentStyles_unstable } from '..';\nimport { tokens, typographyStyles } from '@fluentui-copilot/tokens';\n\nexport const agentTagClassNames: SlotClassNames<AgentTagSlots> = {\n root: 'fai-AgentTag',\n primaryAction: 'fai-AgentTag__primaryAction',\n dismissIcon: 'fai-AgentTag__dismissIcon',\n dismissButton: 'fai-AgentTag__dismissButton',\n media: 'fai-AgentTag__media',\n content: 'fai-AgentTag__content',\n progress: 'fai-AgentTag__progress',\n};\n\nconst useMediaStyles = makeStyles({\n canvas: {\n width: '24px',\n height: '24px',\n },\n sidecar: { width: '20px', height: '20px' },\n});\n\nconst useContentStyles = makeStyles({\n canvas: {\n ...typographyStyles.subtitle2,\n color: tokens.colorNeutralForeground2,\n },\n sidecar: {\n ...typographyStyles.body1Strong,\n color: tokens.colorNeutralForeground2,\n },\n});\n\nconst useDismissButtonStyles = makeStyles({\n canvas: {\n borderRadius: tokens.borderRadius2XL,\n paddingLeft: tokens.spacingHorizontalL,\n paddingRight: tokens.spacingHorizontalM,\n },\n sidecar: {\n paddingLeft: tokens.spacingHorizontalM,\n paddingRight: tokens.spacingHorizontalS,\n borderRadius: tokens.borderRadiusXLarge,\n },\n});\n\n/**\n * Apply styling to the AgentTag slots based on the state\n */\nexport const useAgentTagStyles_unstable = (state: AgentTagState): AgentTagState => {\n 'use no memo';\n\n const { mode } = state;\n\n const contentStyles = useContentStyles();\n const dismissButtonStyles = useDismissButtonStyles();\n const mediaStyles = useMediaStyles();\n\n state.root.className = mergeClasses(agentTagClassNames.root, state.root.className);\n\n state.primaryAction.className = mergeClasses(agentTagClassNames.primaryAction, state.primaryAction.className);\n\n state.dismissIcon.className = mergeClasses(agentTagClassNames.dismissIcon, state.dismissIcon.className);\n\n state.dismissButton.className = mergeClasses(\n agentTagClassNames.dismissButton,\n dismissButtonStyles[mode],\n state.dismissButton.className,\n );\n\n if (state.media) {\n state.media.className = mergeClasses(agentTagClassNames.media, mediaStyles[mode], state.media.className);\n }\n\n state.content.className = mergeClasses(agentTagClassNames.content, contentStyles[mode], state.content.className);\n\n if (state.progress) {\n state.progress.className = mergeClasses(agentTagClassNames.progress, state.progress.className);\n }\n\n useAttachmentStyles_unstable(state);\n\n return state;\n};\n"],"names":["agentTagClassNames","useAgentTagStyles_unstable","root","primaryAction","dismissIcon","dismissButton","media","content","progress","useMediaStyles","makeStyles","canvas","width","height","sidecar","useContentStyles","typographyStyles","subtitle2","color","tokens","colorNeutralForeground2","body1Strong","useDismissButtonStyles","borderRadius","borderRadius2XL","paddingLeft","spacingHorizontalL","paddingRight","spacingHorizontalM","spacingHorizontalS","borderRadiusXLarge","state","mode","contentStyles","dismissButtonStyles","mediaStyles","className","mergeClasses","useAttachmentStyles_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAMaA,kBAAAA;eAAAA;;IA6CAC,0BAAAA;eAAAA;;;iCAnD4B;kBAGI;wBACJ;AAElC,MAAMD,qBAAoD;IAC/DE,MAAM;IACNC,eAAe;IACfC,aAAa;IACbC,eAAe;IACfC,OAAO;IACPC,SAAS;IACTC,UAAU;AACZ;AAEA,MAAMC,iBAAiBC,IAAAA,2BAAAA,EAAW;IAChCC,QAAQ;QACNC,OAAO;QACPC,QAAQ;IACV;IACAC,SAAS;QAAEF,OAAO;QAAQC,QAAQ;IAAO;AAC3C;AAEA,MAAME,mBAAmBL,IAAAA,2BAAAA,EAAW;IAClCC,QAAQ;QACN,GAAGK,wBAAAA,CAAiBC,SAAS;QAC7BC,OAAOC,cAAAA,CAAOC,uBAAuB;IACvC;IACAN,SAAS;QACP,GAAGE,wBAAAA,CAAiBK,WAAW;QAC/BH,OAAOC,cAAAA,CAAOC,uBAAuB;IACvC;AACF;AAEA,MAAME,yBAAyBZ,IAAAA,2BAAAA,EAAW;IACxCC,QAAQ;QACNY,cAAcJ,cAAAA,CAAOK,eAAe;QACpCC,aAAaN,cAAAA,CAAOO,kBAAkB;QACtCC,cAAcR,cAAAA,CAAOS,kBAAkB;IACzC;IACAd,SAAS;QACPW,aAAaN,cAAAA,CAAOS,kBAAkB;QACtCD,cAAcR,cAAAA,CAAOU,kBAAkB;QACvCN,cAAcJ,cAAAA,CAAOW,kBAAkB;IACzC;AACF;AAKO,MAAM7B,6BAA6B,CAAC8B;IACzC;IAEA,MAAM,EAAEC,IAAI,EAAE,GAAGD;IAEjB,MAAME,gBAAgBlB;IACtB,MAAMmB,sBAAsBZ;IAC5B,MAAMa,cAAc1B;IAEpBsB,MAAM7B,IAAI,CAACkC,SAAS,GAAGC,IAAAA,6BAAAA,EAAarC,mBAAmBE,IAAI,EAAE6B,MAAM7B,IAAI,CAACkC,SAAS;IAEjFL,MAAM5B,aAAa,CAACiC,SAAS,GAAGC,IAAAA,6BAAAA,EAAarC,mBAAmBG,aAAa,EAAE4B,MAAM5B,aAAa,CAACiC,SAAS;IAE5GL,MAAM3B,WAAW,CAACgC,SAAS,GAAGC,IAAAA,6BAAAA,EAAarC,mBAAmBI,WAAW,EAAE2B,MAAM3B,WAAW,CAACgC,SAAS;IAEtGL,MAAM1B,aAAa,CAAC+B,SAAS,GAAGC,IAAAA,6BAAAA,EAC9BrC,mBAAmBK,aAAa,EAChC6B,mBAAmB,CAACF,KAAK,EACzBD,MAAM1B,aAAa,CAAC+B,SAAS;IAG/B,IAAIL,MAAMzB,KAAK,EAAE;QACfyB,MAAMzB,KAAK,CAAC8B,SAAS,GAAGC,IAAAA,6BAAAA,EAAarC,mBAAmBM,KAAK,EAAE6B,WAAW,CAACH,KAAK,EAAED,MAAMzB,KAAK,CAAC8B,SAAS;IACzG;IAEAL,MAAMxB,OAAO,CAAC6B,SAAS,GAAGC,IAAAA,6BAAAA,EAAarC,mBAAmBO,OAAO,EAAE0B,aAAa,CAACD,KAAK,EAAED,MAAMxB,OAAO,CAAC6B,SAAS;IAE/G,IAAIL,MAAMvB,QAAQ,EAAE;QAClBuB,MAAMvB,QAAQ,CAAC4B,SAAS,GAAGC,IAAAA,6BAAAA,EAAarC,mBAAmBQ,QAAQ,EAAEuB,MAAMvB,QAAQ,CAAC4B,SAAS;IAC/F;IAEAE,IAAAA,8BAAAA,EAA6BP;IAE7B,OAAOA;AACT"}
|
|
@@ -1,336 +0,0 @@
|
|
|
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
|
-
attachmentClassNames: function() {
|
|
13
|
-
return attachmentClassNames;
|
|
14
|
-
},
|
|
15
|
-
useAttachmentStyles_unstable: function() {
|
|
16
|
-
return useAttachmentStyles_unstable;
|
|
17
|
-
},
|
|
18
|
-
useOverflowStyles: function() {
|
|
19
|
-
return useOverflowStyles;
|
|
20
|
-
}
|
|
21
|
-
});
|
|
22
|
-
const _reactcomponents = require("@fluentui/react-components");
|
|
23
|
-
const _tokens = require("@fluentui-copilot/tokens");
|
|
24
|
-
const _useProgressBarStylesstyles = require("../utils/useProgressBarStyles.styles");
|
|
25
|
-
const attachmentClassNames = {
|
|
26
|
-
root: 'fai-Attachment',
|
|
27
|
-
primaryAction: 'fai-Attachment__primaryAction',
|
|
28
|
-
dismissButton: 'fai-Attachment__dismissButton',
|
|
29
|
-
media: 'fai-Attachment__media',
|
|
30
|
-
content: 'fai-Attachment__content',
|
|
31
|
-
dismissIcon: 'fai-Attachment__dismissIcon',
|
|
32
|
-
progress: 'fai-Attachment__progress'
|
|
33
|
-
};
|
|
34
|
-
const ATTACHMENT_MAXWIDTH = '180px';
|
|
35
|
-
const SMALL_ATTACHMENT_SIZE = '16px';
|
|
36
|
-
const ATTACHMENT_SIZE = '20px';
|
|
37
|
-
const useRootBaseClassName = (0, _reactcomponents.makeResetStyles)({
|
|
38
|
-
display: 'inline-flex',
|
|
39
|
-
flexWrap: 'nowrap',
|
|
40
|
-
verticalAlign: 'middle',
|
|
41
|
-
boxSizing: 'border-box',
|
|
42
|
-
width: 'fit-content',
|
|
43
|
-
alignSelf: 'end',
|
|
44
|
-
position: 'relative'
|
|
45
|
-
});
|
|
46
|
-
const buttonBaseStyles = {
|
|
47
|
-
alignItems: 'center',
|
|
48
|
-
backgroundColor: _tokens.tokens.colorSubtleBackground,
|
|
49
|
-
border: `${_tokens.tokens.strokeWidthThin} solid ${_tokens.tokens.colorNeutralStroke1}`,
|
|
50
|
-
borderRadius: _tokens.tokens.borderRadiusMedium,
|
|
51
|
-
boxSizing: 'border-box',
|
|
52
|
-
columnGap: _tokens.tokens.spacingHorizontalSNudge,
|
|
53
|
-
color: _tokens.tokens.colorNeutralForeground1,
|
|
54
|
-
cursor: 'pointer',
|
|
55
|
-
display: 'inline-flex',
|
|
56
|
-
flexWrap: 'nowrap',
|
|
57
|
-
justifyContent: 'center',
|
|
58
|
-
...(0, _reactcomponents.createCustomFocusIndicatorStyle)({
|
|
59
|
-
outline: `${_tokens.tokens.strokeWidthThick} solid ${_tokens.tokens.colorStrokeFocus2}`,
|
|
60
|
-
zIndex: 1
|
|
61
|
-
}),
|
|
62
|
-
verticalAlign: 'middle'
|
|
63
|
-
};
|
|
64
|
-
const usePrimaryActionBaseClassName = (0, _reactcomponents.makeResetStyles)({
|
|
65
|
-
...buttonBaseStyles,
|
|
66
|
-
borderTopRightRadius: _tokens.tokens.borderRadiusNone,
|
|
67
|
-
borderBottomRightRadius: _tokens.tokens.borderRadiusNone,
|
|
68
|
-
borderRightStyle: 'none',
|
|
69
|
-
maxWidth: `calc(${ATTACHMENT_MAXWIDTH} - ${ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS} - ${_tokens.tokens.spacingHorizontalXS})`,
|
|
70
|
-
padding: `${_tokens.tokens.spacingVerticalXS} ${_tokens.tokens.spacingHorizontalS} ${_tokens.tokens.spacingVerticalXS} ${_tokens.tokens.spacingHorizontalS}`
|
|
71
|
-
});
|
|
72
|
-
const usePrimaryActionStyles = (0, _reactcomponents.makeStyles)({
|
|
73
|
-
button: {
|
|
74
|
-
':hover': {
|
|
75
|
-
cursor: 'pointer',
|
|
76
|
-
backgroundColor: _tokens.tokens.colorSubtleBackgroundHover,
|
|
77
|
-
color: _tokens.tokens.colorNeutralForeground2Hover
|
|
78
|
-
},
|
|
79
|
-
':active': {
|
|
80
|
-
backgroundColor: _tokens.tokens.colorSubtleBackgroundPressed,
|
|
81
|
-
color: _tokens.tokens.colorNeutralForeground2Pressed
|
|
82
|
-
},
|
|
83
|
-
'@media (forced-colors: active)': {
|
|
84
|
-
':hover': {
|
|
85
|
-
backgroundColor: 'HighlightText'
|
|
86
|
-
},
|
|
87
|
-
':active': {
|
|
88
|
-
backgroundColor: 'HighlightText'
|
|
89
|
-
}
|
|
90
|
-
}
|
|
91
|
-
}
|
|
92
|
-
});
|
|
93
|
-
const useDismissButtonBaseClassName = (0, _reactcomponents.makeResetStyles)({
|
|
94
|
-
...buttonBaseStyles,
|
|
95
|
-
padding: `${_tokens.tokens.spacingVerticalXS} ${_tokens.tokens.spacingHorizontalXS} ${_tokens.tokens.spacingVerticalXS} ${_tokens.tokens.spacingHorizontalXS}`,
|
|
96
|
-
maxWidth: `calc(${ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS}) + ${_tokens.tokens.spacingHorizontalXS}`,
|
|
97
|
-
minWidth: `calc(${ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS}) + ${_tokens.tokens.spacingHorizontalXS}`,
|
|
98
|
-
// divider:
|
|
99
|
-
borderLeftColor: _tokens.tokens.colorNeutralStroke1,
|
|
100
|
-
borderTopLeftRadius: _tokens.tokens.borderRadiusNone,
|
|
101
|
-
borderBottomLeftRadius: _tokens.tokens.borderRadiusNone,
|
|
102
|
-
borderTopRightRadius: _tokens.tokens.borderRadiusMedium,
|
|
103
|
-
borderBottomRightRadius: _tokens.tokens.borderRadiusMedium,
|
|
104
|
-
':hover': {
|
|
105
|
-
cursor: 'pointer',
|
|
106
|
-
backgroundColor: _tokens.tokens.colorSubtleBackgroundHover,
|
|
107
|
-
color: _tokens.tokens.colorNeutralForeground2BrandHover
|
|
108
|
-
},
|
|
109
|
-
':active': {
|
|
110
|
-
backgroundColor: _tokens.tokens.colorSubtleBackgroundPressed,
|
|
111
|
-
color: _tokens.tokens.colorNeutralForeground2BrandPressed
|
|
112
|
-
},
|
|
113
|
-
'@media (forced-colors: active)': {
|
|
114
|
-
':hover': {
|
|
115
|
-
backgroundColor: 'HighlightText'
|
|
116
|
-
},
|
|
117
|
-
':active': {
|
|
118
|
-
backgroundColor: 'HighlightText'
|
|
119
|
-
}
|
|
120
|
-
}
|
|
121
|
-
});
|
|
122
|
-
const useDismissButtonCurrentStyles = (0, _reactcomponents.makeStyles)({
|
|
123
|
-
root: {
|
|
124
|
-
':hover': {
|
|
125
|
-
[`& .${attachmentClassNames.dismissIcon}`]: {
|
|
126
|
-
color: _tokens.tokens.colorBrandForegroundLinkHover
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
}
|
|
130
|
-
});
|
|
131
|
-
const useMediaBaseClassName = (0, _reactcomponents.makeResetStyles)({
|
|
132
|
-
alignItems: 'center',
|
|
133
|
-
display: 'inline-flex',
|
|
134
|
-
fontSize: ATTACHMENT_SIZE,
|
|
135
|
-
height: ATTACHMENT_SIZE,
|
|
136
|
-
lineHeight: ATTACHMENT_SIZE,
|
|
137
|
-
width: ATTACHMENT_SIZE
|
|
138
|
-
});
|
|
139
|
-
const useContentBaseClassName = (0, _reactcomponents.makeResetStyles)({
|
|
140
|
-
overflowX: 'hidden',
|
|
141
|
-
textOverflow: 'ellipsis',
|
|
142
|
-
whiteSpace: 'nowrap',
|
|
143
|
-
..._reactcomponents.typographyStyles.body1
|
|
144
|
-
});
|
|
145
|
-
const useDismissIconBaseClassName = (0, _reactcomponents.makeResetStyles)({
|
|
146
|
-
alignItems: 'center',
|
|
147
|
-
borderRadius: _tokens.tokens.borderRadiusCircular,
|
|
148
|
-
border: `${_tokens.tokens.strokeWidthThin} solid ${_tokens.tokens.colorTransparentStroke}`,
|
|
149
|
-
boxSizing: 'border-box',
|
|
150
|
-
color: _tokens.tokens.colorNeutralForeground1,
|
|
151
|
-
display: 'inline-flex',
|
|
152
|
-
fontSize: ATTACHMENT_SIZE,
|
|
153
|
-
height: `calc(${ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingVerticalXXS})`,
|
|
154
|
-
justifyContent: 'center',
|
|
155
|
-
maxWidth: `calc(${ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS})`,
|
|
156
|
-
minWidth: `calc(${ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS})`,
|
|
157
|
-
padding: `calc(${_tokens.tokens.spacingVerticalXXS} / 2) calc(${_tokens.tokens.spacingHorizontalXXS} / 2)`
|
|
158
|
-
});
|
|
159
|
-
const useDismissIconNextStyles = (0, _reactcomponents.makeStyles)({
|
|
160
|
-
dismissOnly: {
|
|
161
|
-
':hover': {
|
|
162
|
-
color: _tokens.tokens.colorNeutralForeground2BrandHover
|
|
163
|
-
},
|
|
164
|
-
':active': {
|
|
165
|
-
color: _tokens.tokens.colorNeutralForeground2BrandPressed
|
|
166
|
-
}
|
|
167
|
-
}
|
|
168
|
-
});
|
|
169
|
-
const useImageOnlyStyles = (0, _reactcomponents.makeStyles)({
|
|
170
|
-
primaryAction: {
|
|
171
|
-
padding: 0
|
|
172
|
-
},
|
|
173
|
-
content: {
|
|
174
|
-
lineHeight: 0
|
|
175
|
-
}
|
|
176
|
-
});
|
|
177
|
-
const useOverflowStyles = (0, _reactcomponents.makeStyles)({
|
|
178
|
-
overflow: {
|
|
179
|
-
maxWidth: '100%',
|
|
180
|
-
width: '100%'
|
|
181
|
-
}
|
|
182
|
-
});
|
|
183
|
-
const useSmallStyles = (0, _reactcomponents.makeStyles)({
|
|
184
|
-
primaryAction: {
|
|
185
|
-
maxWidth: `calc(${ATTACHMENT_MAXWIDTH} - ${SMALL_ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS} - ${_tokens.tokens.spacingHorizontalXS})`,
|
|
186
|
-
padding: `${_tokens.tokens.spacingVerticalXXS} ${_tokens.tokens.spacingHorizontalSNudge} ${_tokens.tokens.spacingVerticalXXS} ${_tokens.tokens.spacingHorizontalSNudge}`
|
|
187
|
-
},
|
|
188
|
-
media: {
|
|
189
|
-
fontSize: SMALL_ATTACHMENT_SIZE,
|
|
190
|
-
height: SMALL_ATTACHMENT_SIZE,
|
|
191
|
-
lineHeight: SMALL_ATTACHMENT_SIZE,
|
|
192
|
-
width: SMALL_ATTACHMENT_SIZE
|
|
193
|
-
},
|
|
194
|
-
content: {
|
|
195
|
-
..._reactcomponents.typographyStyles.caption1
|
|
196
|
-
},
|
|
197
|
-
dismissButton: {
|
|
198
|
-
padding: `${_tokens.tokens.spacingVerticalXXS} ${_tokens.tokens.spacingHorizontalXXS}`,
|
|
199
|
-
maxWidth: `calc(${SMALL_ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS}) + ${_tokens.tokens.spacingHorizontalXS}`,
|
|
200
|
-
minWidth: `calc(${SMALL_ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS}) + ${_tokens.tokens.spacingHorizontalXS}`
|
|
201
|
-
},
|
|
202
|
-
dismissIcon: {
|
|
203
|
-
fontSize: SMALL_ATTACHMENT_SIZE,
|
|
204
|
-
height: `calc(${SMALL_ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingVerticalXXS})`,
|
|
205
|
-
maxWidth: `calc(${SMALL_ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS})`,
|
|
206
|
-
minWidth: `calc(${SMALL_ATTACHMENT_SIZE} + ${_tokens.tokens.strokeWidthThin} * 2 + ${_tokens.tokens.spacingHorizontalXXS})`
|
|
207
|
-
}
|
|
208
|
-
});
|
|
209
|
-
const usePrimaryActionNextStyles = (0, _reactcomponents.makeStyles)({
|
|
210
|
-
root: {
|
|
211
|
-
borderTopLeftRadius: _tokens.tokens.borderRadiusXLarge,
|
|
212
|
-
borderBottomLeftRadius: _tokens.tokens.borderRadiusXLarge
|
|
213
|
-
},
|
|
214
|
-
canvas: {
|
|
215
|
-
padding: `${_tokens.tokens.spacingVerticalNone} ${_tokens.tokens.spacingHorizontalS}`,
|
|
216
|
-
minHeight: '40px'
|
|
217
|
-
},
|
|
218
|
-
sidecar: {
|
|
219
|
-
padding: `${_tokens.tokens.spacingVerticalNone} ${_tokens.tokens.spacingHorizontalS}`,
|
|
220
|
-
minHeight: '32px'
|
|
221
|
-
}
|
|
222
|
-
});
|
|
223
|
-
const useDismissButtonNextStyles = (0, _reactcomponents.makeStyles)({
|
|
224
|
-
root: {
|
|
225
|
-
borderTopRightRadius: _tokens.tokens.borderRadiusXLarge,
|
|
226
|
-
borderBottomRightRadius: _tokens.tokens.borderRadiusXLarge,
|
|
227
|
-
':hover': {
|
|
228
|
-
color: _tokens.tokens.colorNeutralForeground2
|
|
229
|
-
},
|
|
230
|
-
':active': {
|
|
231
|
-
color: _tokens.tokens.colorNeutralForeground2Pressed
|
|
232
|
-
},
|
|
233
|
-
borderLeftColor: _tokens.tokens.colorNeutralStroke1,
|
|
234
|
-
borderLeftWidth: _tokens.tokens.strokeWidthThin,
|
|
235
|
-
borderLeftStyle: 'solid'
|
|
236
|
-
},
|
|
237
|
-
withPrimary: {
|
|
238
|
-
':hover': {
|
|
239
|
-
[`& .${attachmentClassNames.dismissIcon}`]: {
|
|
240
|
-
color: _tokens.tokens.colorNeutralForeground2
|
|
241
|
-
}
|
|
242
|
-
},
|
|
243
|
-
':active': {
|
|
244
|
-
[`& .${attachmentClassNames.dismissIcon}`]: {
|
|
245
|
-
color: _tokens.tokens.colorNeutralForeground2Pressed
|
|
246
|
-
}
|
|
247
|
-
}
|
|
248
|
-
},
|
|
249
|
-
canvas: {
|
|
250
|
-
padding: `${_tokens.tokens.spacingVerticalNone} ${_tokens.tokens.spacingHorizontalS}`,
|
|
251
|
-
minHeight: '40px',
|
|
252
|
-
width: '40px'
|
|
253
|
-
},
|
|
254
|
-
sidecar: {
|
|
255
|
-
padding: `${_tokens.tokens.spacingVerticalNone} ${_tokens.tokens.spacingHorizontalMNudge}`,
|
|
256
|
-
minHeight: '32px',
|
|
257
|
-
width: '32px'
|
|
258
|
-
},
|
|
259
|
-
dismissOnly: {
|
|
260
|
-
borderRadius: _tokens.tokens.borderRadiusXLarge,
|
|
261
|
-
width: 'unset',
|
|
262
|
-
borderLeftColor: _tokens.tokens.colorTransparentStroke,
|
|
263
|
-
backgroundColor: _tokens.tokens.colorNeutralBackground3,
|
|
264
|
-
':hover': {
|
|
265
|
-
backgroundColor: _tokens.tokens.colorNeutralBackground3
|
|
266
|
-
},
|
|
267
|
-
':active': {
|
|
268
|
-
backgroundColor: _tokens.tokens.colorNeutralBackground3
|
|
269
|
-
}
|
|
270
|
-
}
|
|
271
|
-
});
|
|
272
|
-
const usePrimaryDismissNextStyles = (0, _reactcomponents.makeStyles)({
|
|
273
|
-
sharedStyles: {
|
|
274
|
-
border: 'none',
|
|
275
|
-
backgroundColor: _tokens.tokens.colorNeutralBackground3,
|
|
276
|
-
':hover': {
|
|
277
|
-
backgroundColor: _tokens.tokens.colorNeutralBackground3Hover
|
|
278
|
-
},
|
|
279
|
-
':active': {
|
|
280
|
-
backgroundColor: _tokens.tokens.colorNeutralBackground3Pressed
|
|
281
|
-
},
|
|
282
|
-
':focus-visible': {
|
|
283
|
-
borderRadius: _tokens.tokens.borderRadiusLarge
|
|
284
|
-
}
|
|
285
|
-
}
|
|
286
|
-
});
|
|
287
|
-
const useRootNextStyles = (0, _reactcomponents.makeStyles)({
|
|
288
|
-
root: {
|
|
289
|
-
outline: `${_tokens.tokens.strokeWidthThin} solid ${_tokens.tokens.colorTransparentStroke}`,
|
|
290
|
-
borderRadius: _tokens.tokens.borderRadiusXLarge
|
|
291
|
-
}
|
|
292
|
-
});
|
|
293
|
-
const useAttachmentStyles_unstable = (state)=>{
|
|
294
|
-
'use no memo';
|
|
295
|
-
const rootBaseClassName = useRootBaseClassName();
|
|
296
|
-
const primaryActionBaseClassName = usePrimaryActionBaseClassName();
|
|
297
|
-
const dismissButtonBaseClassName = useDismissButtonBaseClassName();
|
|
298
|
-
const dismissButtonCurrentStyles = useDismissButtonCurrentStyles();
|
|
299
|
-
const mediaBaseClassName = useMediaBaseClassName();
|
|
300
|
-
const contentBaseClassName = useContentBaseClassName();
|
|
301
|
-
const dismissIconBaseClassName = useDismissIconBaseClassName();
|
|
302
|
-
const dismissIconNextStyles = useDismissIconNextStyles();
|
|
303
|
-
const progressBarStyles = (0, _useProgressBarStylesstyles.useProgressBarStyles)();
|
|
304
|
-
const primaryActionStyles = usePrimaryActionStyles();
|
|
305
|
-
const imageOnlyStyles = useImageOnlyStyles();
|
|
306
|
-
const smallStyles = useSmallStyles();
|
|
307
|
-
const primaryActionNextStyles = usePrimaryActionNextStyles();
|
|
308
|
-
const dismissButtonNextStyles = useDismissButtonNextStyles();
|
|
309
|
-
const primaryDismissNextStyles = usePrimaryDismissNextStyles();
|
|
310
|
-
const rootNextStyles = useRootNextStyles();
|
|
311
|
-
const { imageOnly, primaryAction, size, mode, designVersion, dismissOnly } = state;
|
|
312
|
-
state.root.className = (0, _reactcomponents.mergeClasses)(attachmentClassNames.root, rootBaseClassName, designVersion === 'next' && rootNextStyles.root, state.root.className);
|
|
313
|
-
state.primaryAction.className = (0, _reactcomponents.mergeClasses)(attachmentClassNames.primaryAction, primaryActionBaseClassName, size === 'small' && smallStyles.primaryAction, primaryAction.as !== 'span' && !state.isLoading && primaryActionStyles.button, imageOnly && imageOnlyStyles.primaryAction, designVersion === 'next' && primaryDismissNextStyles.sharedStyles, designVersion === 'next' && primaryActionNextStyles.root, designVersion === 'next' && primaryActionNextStyles[mode], state.primaryAction.className);
|
|
314
|
-
state.dismissButton.className = (0, _reactcomponents.mergeClasses)(attachmentClassNames.dismissButton, dismissButtonBaseClassName, designVersion === 'current' && dismissButtonCurrentStyles.root, size === 'small' && smallStyles.dismissButton, designVersion === 'next' && primaryDismissNextStyles.sharedStyles, designVersion === 'next' && dismissButtonNextStyles.root, designVersion === 'next' && dismissButtonNextStyles[mode], designVersion === 'next' && dismissOnly && dismissButtonNextStyles.dismissOnly, designVersion === 'next' && !dismissOnly && dismissButtonNextStyles.withPrimary, state.dismissButton.className);
|
|
315
|
-
if (state.media) {
|
|
316
|
-
state.media.className = (0, _reactcomponents.mergeClasses)(attachmentClassNames.media, mediaBaseClassName, size === 'small' && smallStyles.media, state.media.className);
|
|
317
|
-
}
|
|
318
|
-
state.content.className = (0, _reactcomponents.mergeClasses)(attachmentClassNames.content, contentBaseClassName, size === 'small' && smallStyles.content, imageOnly && imageOnlyStyles.content, state.content.className);
|
|
319
|
-
state.dismissIcon.className = (0, _reactcomponents.mergeClasses)(attachmentClassNames.dismissIcon, dismissIconBaseClassName, size === 'small' && smallStyles.dismissIcon, designVersion === 'next' && dismissOnly && dismissIconNextStyles.dismissOnly, state.dismissIcon.className);
|
|
320
|
-
if (state.progress) {
|
|
321
|
-
state.progress.className = (0, _reactcomponents.mergeClasses)(attachmentClassNames.progress, progressBarStyles.progress, state.progress.className);
|
|
322
|
-
const bar = _reactcomponents.slot.optional(state.progress.bar, {
|
|
323
|
-
elementType: 'div',
|
|
324
|
-
renderByDefault: true
|
|
325
|
-
});
|
|
326
|
-
if (bar) {
|
|
327
|
-
if (state.progress.value === undefined) {
|
|
328
|
-
bar.className = (0, _reactcomponents.mergeClasses)(progressBarStyles.indeterminateProgressBar, bar.className);
|
|
329
|
-
} else {
|
|
330
|
-
bar.className = (0, _reactcomponents.mergeClasses)(progressBarStyles.regularProgressBar, bar.className);
|
|
331
|
-
}
|
|
332
|
-
state.progress.bar = bar;
|
|
333
|
-
}
|
|
334
|
-
}
|
|
335
|
-
return state;
|
|
336
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useAttachmentStyles.styles.ts"],"sourcesContent":["import {\n createCustomFocusIndicatorStyle,\n makeResetStyles,\n makeStyles,\n mergeClasses,\n slot,\n typographyStyles,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport { useProgressBarStyles } from '../utils/useProgressBarStyles.styles';\nimport type { AttachmentSlots, AttachmentState } from './Attachment.types';\nimport type { GriffelResetStyle, SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentClassNames: SlotClassNames<AttachmentSlots> = {\n root: 'fai-Attachment',\n primaryAction: 'fai-Attachment__primaryAction',\n dismissButton: 'fai-Attachment__dismissButton',\n media: 'fai-Attachment__media',\n content: 'fai-Attachment__content',\n dismissIcon: 'fai-Attachment__dismissIcon',\n progress: 'fai-Attachment__progress',\n};\n\nconst ATTACHMENT_MAXWIDTH = '180px';\nconst SMALL_ATTACHMENT_SIZE = '16px';\nconst ATTACHMENT_SIZE = '20px';\n\nconst useRootBaseClassName = makeResetStyles({\n display: 'inline-flex',\n flexWrap: 'nowrap',\n verticalAlign: 'middle',\n boxSizing: 'border-box',\n width: 'fit-content',\n alignSelf: 'end',\n position: 'relative',\n});\n\nconst buttonBaseStyles: GriffelResetStyle = {\n alignItems: 'center',\n backgroundColor: tokens.colorSubtleBackground,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n borderRadius: tokens.borderRadiusMedium,\n boxSizing: 'border-box',\n columnGap: tokens.spacingHorizontalSNudge,\n color: tokens.colorNeutralForeground1,\n cursor: 'pointer',\n display: 'inline-flex',\n flexWrap: 'nowrap',\n justifyContent: 'center',\n ...createCustomFocusIndicatorStyle({\n outline: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n zIndex: 1,\n }),\n verticalAlign: 'middle',\n};\n\nconst usePrimaryActionBaseClassName = makeResetStyles({\n ...buttonBaseStyles,\n borderTopRightRadius: tokens.borderRadiusNone,\n borderBottomRightRadius: tokens.borderRadiusNone,\n borderRightStyle: 'none',\n maxWidth: `calc(${ATTACHMENT_MAXWIDTH} - ${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS} - ${tokens.spacingHorizontalXS})`,\n padding: `${tokens.spacingVerticalXS} ${tokens.spacingHorizontalS} ${tokens.spacingVerticalXS} ${tokens.spacingHorizontalS}`,\n});\n\nconst usePrimaryActionStyles = makeStyles({\n button: {\n ':hover': {\n cursor: 'pointer',\n backgroundColor: tokens.colorSubtleBackgroundHover,\n color: tokens.colorNeutralForeground2Hover,\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n color: tokens.colorNeutralForeground2Pressed,\n },\n '@media (forced-colors: active)': {\n ':hover': {\n backgroundColor: 'HighlightText',\n },\n ':active': {\n backgroundColor: 'HighlightText',\n },\n },\n },\n});\n\nconst useDismissButtonBaseClassName = makeResetStyles({\n ...buttonBaseStyles,\n\n padding: `${tokens.spacingVerticalXS} ${tokens.spacingHorizontalXS} ${tokens.spacingVerticalXS} ${tokens.spacingHorizontalXS}`,\n maxWidth: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS}) + ${tokens.spacingHorizontalXS}`,\n minWidth: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS}) + ${tokens.spacingHorizontalXS}`,\n\n // divider:\n borderLeftColor: tokens.colorNeutralStroke1,\n borderTopLeftRadius: tokens.borderRadiusNone,\n borderBottomLeftRadius: tokens.borderRadiusNone,\n\n borderTopRightRadius: tokens.borderRadiusMedium,\n borderBottomRightRadius: tokens.borderRadiusMedium,\n\n ':hover': {\n cursor: 'pointer',\n backgroundColor: tokens.colorSubtleBackgroundHover,\n color: tokens.colorNeutralForeground2BrandHover,\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n '@media (forced-colors: active)': {\n ':hover': {\n backgroundColor: 'HighlightText',\n },\n ':active': {\n backgroundColor: 'HighlightText',\n },\n },\n});\n\nconst useDismissButtonCurrentStyles = makeStyles({\n root: {\n ':hover': {\n [`& .${attachmentClassNames.dismissIcon}`]: {\n color: tokens.colorBrandForegroundLinkHover,\n },\n },\n },\n});\n\nconst useMediaBaseClassName = makeResetStyles({\n alignItems: 'center',\n display: 'inline-flex',\n fontSize: ATTACHMENT_SIZE,\n height: ATTACHMENT_SIZE,\n lineHeight: ATTACHMENT_SIZE,\n width: ATTACHMENT_SIZE,\n});\n\nconst useContentBaseClassName = makeResetStyles({\n overflowX: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n ...typographyStyles.body1,\n});\n\nconst useDismissIconBaseClassName = makeResetStyles({\n alignItems: 'center',\n borderRadius: tokens.borderRadiusCircular,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`,\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground1,\n display: 'inline-flex',\n fontSize: ATTACHMENT_SIZE,\n height: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingVerticalXXS})`,\n justifyContent: 'center',\n maxWidth: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS})`,\n minWidth: `calc(${ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS})`,\n padding: `calc(${tokens.spacingVerticalXXS} / 2) calc(${tokens.spacingHorizontalXXS} / 2)`,\n});\n\nconst useDismissIconNextStyles = makeStyles({\n dismissOnly: {\n ':hover': {\n color: tokens.colorNeutralForeground2BrandHover,\n },\n ':active': {\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n});\n\nconst useImageOnlyStyles = makeStyles({\n primaryAction: {\n padding: 0,\n },\n content: {\n lineHeight: 0,\n },\n});\n\nexport const useOverflowStyles = makeStyles({\n overflow: {\n maxWidth: '100%',\n width: '100%',\n },\n});\n\nconst useSmallStyles = makeStyles({\n primaryAction: {\n maxWidth: `calc(${ATTACHMENT_MAXWIDTH} - ${SMALL_ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS} - ${tokens.spacingHorizontalXS})`,\n padding: `${tokens.spacingVerticalXXS} ${tokens.spacingHorizontalSNudge} ${tokens.spacingVerticalXXS} ${tokens.spacingHorizontalSNudge}`,\n },\n media: {\n fontSize: SMALL_ATTACHMENT_SIZE,\n height: SMALL_ATTACHMENT_SIZE,\n lineHeight: SMALL_ATTACHMENT_SIZE,\n width: SMALL_ATTACHMENT_SIZE,\n },\n content: {\n ...typographyStyles.caption1,\n },\n dismissButton: {\n padding: `${tokens.spacingVerticalXXS} ${tokens.spacingHorizontalXXS}`,\n maxWidth: `calc(${SMALL_ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS}) + ${tokens.spacingHorizontalXS}`,\n minWidth: `calc(${SMALL_ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS}) + ${tokens.spacingHorizontalXS}`,\n },\n dismissIcon: {\n fontSize: SMALL_ATTACHMENT_SIZE,\n height: `calc(${SMALL_ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingVerticalXXS})`,\n maxWidth: `calc(${SMALL_ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS})`,\n minWidth: `calc(${SMALL_ATTACHMENT_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS})`,\n },\n});\n\nconst usePrimaryActionNextStyles = makeStyles({\n root: {\n borderTopLeftRadius: tokens.borderRadiusXLarge,\n borderBottomLeftRadius: tokens.borderRadiusXLarge,\n },\n canvas: {\n padding: `${tokens.spacingVerticalNone} ${tokens.spacingHorizontalS}`,\n minHeight: '40px',\n },\n\n sidecar: {\n padding: `${tokens.spacingVerticalNone} ${tokens.spacingHorizontalS}`,\n minHeight: '32px',\n },\n});\n\nconst useDismissButtonNextStyles = makeStyles({\n root: {\n borderTopRightRadius: tokens.borderRadiusXLarge,\n borderBottomRightRadius: tokens.borderRadiusXLarge,\n ':hover': {\n color: tokens.colorNeutralForeground2,\n },\n ':active': {\n color: tokens.colorNeutralForeground2Pressed,\n },\n\n borderLeftColor: tokens.colorNeutralStroke1,\n borderLeftWidth: tokens.strokeWidthThin,\n borderLeftStyle: 'solid',\n },\n withPrimary: {\n ':hover': {\n [`& .${attachmentClassNames.dismissIcon}`]: {\n color: tokens.colorNeutralForeground2,\n },\n },\n ':active': {\n [`& .${attachmentClassNames.dismissIcon}`]: {\n color: tokens.colorNeutralForeground2Pressed,\n },\n },\n },\n canvas: {\n padding: `${tokens.spacingVerticalNone} ${tokens.spacingHorizontalS}`,\n minHeight: '40px',\n width: '40px',\n },\n sidecar: {\n padding: `${tokens.spacingVerticalNone} ${tokens.spacingHorizontalMNudge}`,\n minHeight: '32px',\n width: '32px',\n },\n dismissOnly: {\n borderRadius: tokens.borderRadiusXLarge,\n width: 'unset',\n borderLeftColor: tokens.colorTransparentStroke,\n backgroundColor: tokens.colorNeutralBackground3,\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground3,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground3,\n },\n },\n});\n\nconst usePrimaryDismissNextStyles = makeStyles({\n sharedStyles: {\n border: 'none',\n backgroundColor: tokens.colorNeutralBackground3,\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground3Hover,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground3Pressed,\n },\n ':focus-visible': {\n borderRadius: tokens.borderRadiusLarge,\n },\n },\n});\n\nconst useRootNextStyles = makeStyles({\n root: {\n outline: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`,\n borderRadius: tokens.borderRadiusXLarge,\n },\n});\n\n/**\n * Apply styling to the Attachment slots based on the state\n */\nexport const useAttachmentStyles_unstable = (state: AttachmentState): AttachmentState => {\n 'use no memo';\n\n const rootBaseClassName = useRootBaseClassName();\n const primaryActionBaseClassName = usePrimaryActionBaseClassName();\n const dismissButtonBaseClassName = useDismissButtonBaseClassName();\n const dismissButtonCurrentStyles = useDismissButtonCurrentStyles();\n const mediaBaseClassName = useMediaBaseClassName();\n const contentBaseClassName = useContentBaseClassName();\n const dismissIconBaseClassName = useDismissIconBaseClassName();\n const dismissIconNextStyles = useDismissIconNextStyles();\n const progressBarStyles = useProgressBarStyles();\n const primaryActionStyles = usePrimaryActionStyles();\n const imageOnlyStyles = useImageOnlyStyles();\n const smallStyles = useSmallStyles();\n const primaryActionNextStyles = usePrimaryActionNextStyles();\n const dismissButtonNextStyles = useDismissButtonNextStyles();\n const primaryDismissNextStyles = usePrimaryDismissNextStyles();\n const rootNextStyles = useRootNextStyles();\n const { imageOnly, primaryAction, size, mode, designVersion, dismissOnly } = state;\n\n state.root.className = mergeClasses(\n attachmentClassNames.root,\n rootBaseClassName,\n designVersion === 'next' && rootNextStyles.root,\n state.root.className,\n );\n state.primaryAction.className = mergeClasses(\n attachmentClassNames.primaryAction,\n primaryActionBaseClassName,\n size === 'small' && smallStyles.primaryAction,\n primaryAction.as !== 'span' && !state.isLoading && primaryActionStyles.button,\n imageOnly && imageOnlyStyles.primaryAction,\n designVersion === 'next' && primaryDismissNextStyles.sharedStyles,\n designVersion === 'next' && primaryActionNextStyles.root,\n designVersion === 'next' && primaryActionNextStyles[mode],\n state.primaryAction.className,\n );\n state.dismissButton.className = mergeClasses(\n attachmentClassNames.dismissButton,\n dismissButtonBaseClassName,\n designVersion === 'current' && dismissButtonCurrentStyles.root,\n size === 'small' && smallStyles.dismissButton,\n designVersion === 'next' && primaryDismissNextStyles.sharedStyles,\n designVersion === 'next' && dismissButtonNextStyles.root,\n designVersion === 'next' && dismissButtonNextStyles[mode],\n designVersion === 'next' && dismissOnly && dismissButtonNextStyles.dismissOnly,\n designVersion === 'next' && !dismissOnly && dismissButtonNextStyles.withPrimary,\n state.dismissButton.className,\n );\n if (state.media) {\n state.media.className = mergeClasses(\n attachmentClassNames.media,\n mediaBaseClassName,\n size === 'small' && smallStyles.media,\n state.media.className,\n );\n }\n state.content.className = mergeClasses(\n attachmentClassNames.content,\n contentBaseClassName,\n size === 'small' && smallStyles.content,\n imageOnly && imageOnlyStyles.content,\n state.content.className,\n );\n state.dismissIcon.className = mergeClasses(\n attachmentClassNames.dismissIcon,\n dismissIconBaseClassName,\n size === 'small' && smallStyles.dismissIcon,\n designVersion === 'next' && dismissOnly && dismissIconNextStyles.dismissOnly,\n state.dismissIcon.className,\n );\n\n if (state.progress) {\n state.progress.className = mergeClasses(\n attachmentClassNames.progress,\n progressBarStyles.progress,\n state.progress.className,\n );\n\n const bar = slot.optional(state.progress.bar, { elementType: 'div', renderByDefault: true });\n if (bar) {\n if (state.progress.value === undefined) {\n bar.className = mergeClasses(progressBarStyles.indeterminateProgressBar, bar.className);\n } else {\n bar.className = mergeClasses(progressBarStyles.regularProgressBar, bar.className);\n }\n state.progress.bar = bar;\n }\n }\n\n return state;\n};\n"],"names":["attachmentClassNames","useAttachmentStyles_unstable","useOverflowStyles","root","primaryAction","dismissButton","media","content","dismissIcon","progress","ATTACHMENT_MAXWIDTH","SMALL_ATTACHMENT_SIZE","ATTACHMENT_SIZE","useRootBaseClassName","makeResetStyles","display","flexWrap","verticalAlign","boxSizing","width","alignSelf","position","buttonBaseStyles","alignItems","backgroundColor","tokens","colorSubtleBackground","border","strokeWidthThin","colorNeutralStroke1","borderRadius","borderRadiusMedium","columnGap","spacingHorizontalSNudge","color","colorNeutralForeground1","cursor","justifyContent","createCustomFocusIndicatorStyle","outline","strokeWidthThick","colorStrokeFocus2","zIndex","usePrimaryActionBaseClassName","borderTopRightRadius","borderRadiusNone","borderBottomRightRadius","borderRightStyle","maxWidth","spacingHorizontalXXS","spacingHorizontalXS","padding","spacingVerticalXS","spacingHorizontalS","usePrimaryActionStyles","makeStyles","button","colorSubtleBackgroundHover","colorNeutralForeground2Hover","colorSubtleBackgroundPressed","colorNeutralForeground2Pressed","useDismissButtonBaseClassName","minWidth","borderLeftColor","borderTopLeftRadius","borderBottomLeftRadius","colorNeutralForeground2BrandHover","colorNeutralForeground2BrandPressed","useDismissButtonCurrentStyles","colorBrandForegroundLinkHover","useMediaBaseClassName","fontSize","height","lineHeight","useContentBaseClassName","overflowX","textOverflow","whiteSpace","typographyStyles","body1","useDismissIconBaseClassName","borderRadiusCircular","colorTransparentStroke","spacingVerticalXXS","useDismissIconNextStyles","dismissOnly","useImageOnlyStyles","overflow","useSmallStyles","caption1","usePrimaryActionNextStyles","borderRadiusXLarge","canvas","spacingVerticalNone","minHeight","sidecar","useDismissButtonNextStyles","colorNeutralForeground2","borderLeftWidth","borderLeftStyle","withPrimary","spacingHorizontalMNudge","colorNeutralBackground3","usePrimaryDismissNextStyles","sharedStyles","colorNeutralBackground3Hover","colorNeutralBackground3Pressed","borderRadiusLarge","useRootNextStyles","state","rootBaseClassName","primaryActionBaseClassName","dismissButtonBaseClassName","dismissButtonCurrentStyles","mediaBaseClassName","contentBaseClassName","dismissIconBaseClassName","dismissIconNextStyles","progressBarStyles","useProgressBarStyles","primaryActionStyles","imageOnlyStyles","smallStyles","primaryActionNextStyles","dismissButtonNextStyles","primaryDismissNextStyles","rootNextStyles","imageOnly","size","mode","designVersion","className","mergeClasses","as","isLoading","bar","slot","optional","elementType","renderByDefault","value","undefined","indeterminateProgressBar","regularProgressBar"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -1,60 +0,0 @@
|
|
|
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
|
-
attachmentListClassNames: function() {
|
|
13
|
-
return attachmentListClassNames;
|
|
14
|
-
},
|
|
15
|
-
useAttachmentListStyles_unstable: function() {
|
|
16
|
-
return useAttachmentListStyles_unstable;
|
|
17
|
-
}
|
|
18
|
-
});
|
|
19
|
-
const _reactcomponents = require("@fluentui/react-components");
|
|
20
|
-
const _tokens = require("@fluentui-copilot/tokens");
|
|
21
|
-
const attachmentListClassNames = {
|
|
22
|
-
root: 'fai-AttachmentList',
|
|
23
|
-
menuList: 'fai-AttachmentList__menuList',
|
|
24
|
-
menuPopover: 'fai-AttachmentList__menuPopover',
|
|
25
|
-
overflowMenuButton: 'fai-AttachmentList__overflowMenuButton'
|
|
26
|
-
};
|
|
27
|
-
const useRootBaseClassName = (0, _reactcomponents.makeResetStyles)({
|
|
28
|
-
columnGap: _tokens.tokens.spacingHorizontalSNudge,
|
|
29
|
-
display: 'flex',
|
|
30
|
-
flexDirection: 'row',
|
|
31
|
-
flexShrink: 0,
|
|
32
|
-
flexWrap: 'wrap',
|
|
33
|
-
rowGap: _tokens.tokens.spacingVerticalXS
|
|
34
|
-
});
|
|
35
|
-
const useOverflowMenuButtonBaseClassName = (0, _reactcomponents.makeResetStyles)({
|
|
36
|
-
display: 'inline-flex'
|
|
37
|
-
});
|
|
38
|
-
const useOverflowMenuPopoverNextStyles = (0, _reactcomponents.makeStyles)({
|
|
39
|
-
borderRadius: {
|
|
40
|
-
borderRadius: _tokens.tokens.borderRadius4XL
|
|
41
|
-
}
|
|
42
|
-
});
|
|
43
|
-
const useAttachmentListStyles_unstable = (state)=>{
|
|
44
|
-
'use no memo';
|
|
45
|
-
const rootBaseClassName = useRootBaseClassName();
|
|
46
|
-
const overflowMenuButtonClassName = useOverflowMenuButtonBaseClassName();
|
|
47
|
-
const overflowMenuPopoverNextStyles = useOverflowMenuPopoverNextStyles();
|
|
48
|
-
const { designVersion } = state;
|
|
49
|
-
state.root.className = (0, _reactcomponents.mergeClasses)(attachmentListClassNames.root, rootBaseClassName, state.root.className);
|
|
50
|
-
if (state.menuList) {
|
|
51
|
-
state.menuList.className = (0, _reactcomponents.mergeClasses)(attachmentListClassNames.menuList, state.menuList.className);
|
|
52
|
-
}
|
|
53
|
-
if (state.menuPopover) {
|
|
54
|
-
state.menuPopover.className = (0, _reactcomponents.mergeClasses)(attachmentListClassNames.menuPopover, designVersion === 'next' && overflowMenuPopoverNextStyles.borderRadius, state.menuPopover.className);
|
|
55
|
-
}
|
|
56
|
-
if (state.overflowMenuButton) {
|
|
57
|
-
state.overflowMenuButton.className = (0, _reactcomponents.mergeClasses)(attachmentListClassNames.overflowMenuButton, overflowMenuButtonClassName, state.overflowMenuButton.className);
|
|
58
|
-
}
|
|
59
|
-
return state;
|
|
60
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["useAttachmentListStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { AttachmentListSlots, AttachmentListState } from './AttachmentList.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentListClassNames: SlotClassNames<AttachmentListSlots> = {\n root: 'fai-AttachmentList',\n menuList: 'fai-AttachmentList__menuList',\n menuPopover: 'fai-AttachmentList__menuPopover',\n overflowMenuButton: 'fai-AttachmentList__overflowMenuButton',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n columnGap: tokens.spacingHorizontalSNudge,\n display: 'flex',\n flexDirection: 'row',\n flexShrink: 0,\n flexWrap: 'wrap',\n rowGap: tokens.spacingVerticalXS,\n});\n\nconst useOverflowMenuButtonBaseClassName = makeResetStyles({\n display: 'inline-flex',\n});\n\nconst useOverflowMenuPopoverNextStyles = makeStyles({\n borderRadius: {\n borderRadius: tokens.borderRadius4XL,\n },\n});\n\n/**\n * Apply styling to the AttachmentList slots based on the state\n */\nexport const useAttachmentListStyles_unstable = (state: AttachmentListState): AttachmentListState => {\n 'use no memo';\n\n const rootBaseClassName = useRootBaseClassName();\n const overflowMenuButtonClassName = useOverflowMenuButtonBaseClassName();\n const overflowMenuPopoverNextStyles = useOverflowMenuPopoverNextStyles();\n const { designVersion } = state;\n\n state.root.className = mergeClasses(attachmentListClassNames.root, rootBaseClassName, state.root.className);\n\n if (state.menuList) {\n state.menuList.className = mergeClasses(attachmentListClassNames.menuList, state.menuList.className);\n }\n if (state.menuPopover) {\n state.menuPopover.className = mergeClasses(\n attachmentListClassNames.menuPopover,\n designVersion === 'next' && overflowMenuPopoverNextStyles.borderRadius,\n state.menuPopover.className,\n );\n }\n\n if (state.overflowMenuButton) {\n state.overflowMenuButton.className = mergeClasses(\n attachmentListClassNames.overflowMenuButton,\n overflowMenuButtonClassName,\n state.overflowMenuButton.className,\n );\n }\n\n return state;\n};\n"],"names":["attachmentListClassNames","useAttachmentListStyles_unstable","root","menuList","menuPopover","overflowMenuButton","useRootBaseClassName","makeResetStyles","columnGap","tokens","spacingHorizontalSNudge","display","flexDirection","flexShrink","flexWrap","rowGap","spacingVerticalXS","useOverflowMenuButtonBaseClassName","useOverflowMenuPopoverNextStyles","makeStyles","borderRadius","borderRadius4XL","state","rootBaseClassName","overflowMenuButtonClassName","overflowMenuPopoverNextStyles","designVersion","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,wBAAAA;eAAAA;;IA6BAC,gCAAAA;eAAAA;;;iCAlC6C;wBACnC;AAIhB,MAAMD,2BAAgE;IAC3EE,MAAM;IACNC,UAAU;IACVC,aAAa;IACbC,oBAAoB;AACtB;AAEA,MAAMC,uBAAuBC,IAAAA,gCAAAA,EAAgB;IAC3CC,WAAWC,cAAAA,CAAOC,uBAAuB;IACzCC,SAAS;IACTC,eAAe;IACfC,YAAY;IACZC,UAAU;IACVC,QAAQN,cAAAA,CAAOO,iBAAiB;AAClC;AAEA,MAAMC,qCAAqCV,IAAAA,gCAAAA,EAAgB;IACzDI,SAAS;AACX;AAEA,MAAMO,mCAAmCC,IAAAA,2BAAAA,EAAW;IAClDC,cAAc;QACZA,cAAcX,cAAAA,CAAOY,eAAe;IACtC;AACF;AAKO,MAAMpB,mCAAmC,CAACqB;IAC/C;IAEA,MAAMC,oBAAoBjB;IAC1B,MAAMkB,8BAA8BP;IACpC,MAAMQ,gCAAgCP;IACtC,MAAM,EAAEQ,aAAa,EAAE,GAAGJ;IAE1BA,MAAMpB,IAAI,CAACyB,SAAS,GAAGC,IAAAA,6BAAAA,EAAa5B,yBAAyBE,IAAI,EAAEqB,mBAAmBD,MAAMpB,IAAI,CAACyB,SAAS;IAE1G,IAAIL,MAAMnB,QAAQ,EAAE;QAClBmB,MAAMnB,QAAQ,CAACwB,SAAS,GAAGC,IAAAA,6BAAAA,EAAa5B,yBAAyBG,QAAQ,EAAEmB,MAAMnB,QAAQ,CAACwB,SAAS;IACrG;IACA,IAAIL,MAAMlB,WAAW,EAAE;QACrBkB,MAAMlB,WAAW,CAACuB,SAAS,GAAGC,IAAAA,6BAAAA,EAC5B5B,yBAAyBI,WAAW,EACpCsB,kBAAkB,UAAUD,8BAA8BL,YAAY,EACtEE,MAAMlB,WAAW,CAACuB,SAAS;IAE/B;IAEA,IAAIL,MAAMjB,kBAAkB,EAAE;QAC5BiB,MAAMjB,kBAAkB,CAACsB,SAAS,GAAGC,IAAAA,6BAAAA,EACnC5B,yBAAyBK,kBAAkB,EAC3CmB,6BACAF,MAAMjB,kBAAkB,CAACsB,SAAS;IAEtC;IAEA,OAAOL;AACT"}
|