@fluentui-copilot/react-attachments 0.10.7 → 0.11.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 +29 -0
- package/CHANGELOG.md +15 -1
- package/dist/index.d.ts +10 -5
- package/lib/components/Attachment/Attachment.js +2 -0
- package/lib/components/Attachment/Attachment.js.map +1 -1
- package/lib/components/Attachment/Attachment.types.js.map +1 -1
- package/lib/components/Attachment/useAttachment.js +6 -1
- package/lib/components/Attachment/useAttachment.js.map +1 -1
- package/lib/components/Attachment/useAttachmentStyles.styles.js +51 -4
- package/lib/components/Attachment/useAttachmentStyles.styles.js.map +1 -1
- package/lib/components/AttachmentList/AttachmentList.js +2 -0
- package/lib/components/AttachmentList/AttachmentList.js.map +1 -1
- package/lib/components/AttachmentList/AttachmentList.types.js.map +1 -1
- package/lib/components/AttachmentList/renderAttachmentList.js +4 -14
- package/lib/components/AttachmentList/renderAttachmentList.js.map +1 -1
- package/lib/components/AttachmentList/useAttachmentList.js +23 -5
- package/lib/components/AttachmentList/useAttachmentList.js.map +1 -1
- package/lib/components/AttachmentList/useAttachmentListStyles.styles.js +10 -1
- package/lib/components/AttachmentList/useAttachmentListStyles.styles.js.map +1 -1
- package/lib/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js +2 -0
- package/lib/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js.map +1 -1
- package/lib/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.types.js.map +1 -1
- package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js +6 -1
- package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js.map +1 -1
- package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles.js +39 -2
- package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles.js.map +1 -1
- package/lib/components/AttachmentTag/useAttachmentTagStyles.styles.js +2 -1
- package/lib/components/AttachmentTag/useAttachmentTagStyles.styles.js.map +1 -1
- package/lib/components/AttachmentTagItem/useAttachmentTagItemStyles.styles.js +2 -1
- package/lib/components/AttachmentTagItem/useAttachmentTagItemStyles.styles.js.map +1 -1
- package/lib/components/AttachmentTagList/useAttachmentTagListStyles.styles.js +2 -1
- package/lib/components/AttachmentTagList/useAttachmentTagListStyles.styles.js.map +1 -1
- package/lib/components/utils/useProgressBarStyles.styles.js +5 -5
- package/lib/components/utils/useProgressBarStyles.styles.js.map +1 -1
- package/lib-commonjs/components/Attachment/Attachment.js +2 -0
- package/lib-commonjs/components/Attachment/Attachment.js.map +1 -1
- package/lib-commonjs/components/Attachment/Attachment.types.js.map +1 -1
- package/lib-commonjs/components/Attachment/useAttachment.js +6 -1
- package/lib-commonjs/components/Attachment/useAttachment.js.map +1 -1
- package/lib-commonjs/components/Attachment/useAttachmentStyles.styles.js +88 -9
- package/lib-commonjs/components/Attachment/useAttachmentStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AttachmentList/AttachmentList.js +2 -0
- package/lib-commonjs/components/AttachmentList/AttachmentList.js.map +1 -1
- package/lib-commonjs/components/AttachmentList/AttachmentList.types.js.map +1 -1
- package/lib-commonjs/components/AttachmentList/renderAttachmentList.js +4 -13
- package/lib-commonjs/components/AttachmentList/renderAttachmentList.js.map +1 -1
- package/lib-commonjs/components/AttachmentList/useAttachmentList.js +22 -4
- package/lib-commonjs/components/AttachmentList/useAttachmentList.js.map +1 -1
- package/lib-commonjs/components/AttachmentList/useAttachmentListStyles.styles.js +8 -0
- package/lib-commonjs/components/AttachmentList/useAttachmentListStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js +2 -0
- package/lib-commonjs/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.types.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js +6 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js.map +1 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles.js +47 -1
- package/lib-commonjs/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AttachmentTag/useAttachmentTagStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AttachmentTagItem/useAttachmentTagItemStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AttachmentTagList/useAttachmentTagListStyles.styles.js.map +1 -1
- package/lib-commonjs/components/utils/useProgressBarStyles.styles.js +4 -4
- package/lib-commonjs/components/utils/useProgressBarStyles.styles.js.map +1 -1
- package/package.json +3 -3
|
@@ -32,11 +32,57 @@ const useRootBaseClassName = (0, _reactcomponents.__resetStyles)("r1o7ejxu", nul
|
|
|
32
32
|
"@media (forced-colors: active){.r1o7ejxu:hover{background-color:HighlightText;}.r1o7ejxu:active{background-color:HighlightText;}}"
|
|
33
33
|
]
|
|
34
34
|
});
|
|
35
|
+
const useNextStyles = (0, _reactcomponents.__styles)({
|
|
36
|
+
root: {
|
|
37
|
+
Beyfa6y: 0,
|
|
38
|
+
Bbmb7ep: 0,
|
|
39
|
+
Btl43ni: 0,
|
|
40
|
+
B7oj6ja: 0,
|
|
41
|
+
Dimara: "f1kijzfu"
|
|
42
|
+
},
|
|
43
|
+
canvas: {
|
|
44
|
+
Byoj8tv: 0,
|
|
45
|
+
uwmqm3: 0,
|
|
46
|
+
z189sj: 0,
|
|
47
|
+
z8tnut: 0,
|
|
48
|
+
B0ocmuz: "fg7z1me"
|
|
49
|
+
},
|
|
50
|
+
sidecar: {
|
|
51
|
+
Byoj8tv: 0,
|
|
52
|
+
uwmqm3: 0,
|
|
53
|
+
z189sj: 0,
|
|
54
|
+
z8tnut: 0,
|
|
55
|
+
B0ocmuz: "f1s87h8p"
|
|
56
|
+
}
|
|
57
|
+
}, {
|
|
58
|
+
d: [
|
|
59
|
+
[
|
|
60
|
+
".f1kijzfu{border-radius:var(--borderRadiusXLarge);}",
|
|
61
|
+
{
|
|
62
|
+
p: -1
|
|
63
|
+
}
|
|
64
|
+
],
|
|
65
|
+
[
|
|
66
|
+
".fg7z1me{padding:calc(var(--spacingVerticalS) - var(--strokeWidthThin)) var(--spacingHorizontalS);}",
|
|
67
|
+
{
|
|
68
|
+
p: -1
|
|
69
|
+
}
|
|
70
|
+
],
|
|
71
|
+
[
|
|
72
|
+
".f1s87h8p{padding:calc(var(--spacingVerticalXS) - var(--strokeWidthThin)) var(--spacingHorizontalS);}",
|
|
73
|
+
{
|
|
74
|
+
p: -1
|
|
75
|
+
}
|
|
76
|
+
]
|
|
77
|
+
]
|
|
78
|
+
});
|
|
35
79
|
const useAttachmentOverflowMenuButtonStyles_unstable = (state)=>{
|
|
36
80
|
'use no memo';
|
|
81
|
+
const { designVersion, mode } = state;
|
|
37
82
|
const rootBaseClassName = useRootBaseClassName();
|
|
38
83
|
const progressBarStyles = (0, _useProgressBarStylesstyles.useProgressBarStyles)();
|
|
39
|
-
|
|
84
|
+
const nextStyles = useNextStyles();
|
|
85
|
+
state.root.className = (0, _reactcomponents.mergeClasses)(attachmentOverflowMenuButtonClassNames.root, rootBaseClassName, designVersion === 'next' && nextStyles.root, designVersion === 'next' && nextStyles[mode], state.root.className);
|
|
40
86
|
if (state.progress) {
|
|
41
87
|
state.progress.className = (0, _reactcomponents.mergeClasses)(attachmentOverflowMenuButtonClassNames.progress, progressBarStyles.progress, state.progress.className);
|
|
42
88
|
const bar = _reactcomponents.slot.optional(state.progress.bar, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useAttachmentOverflowMenuButtonStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, slot,
|
|
1
|
+
{"version":3,"sources":["useAttachmentOverflowMenuButtonStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, slot, typographyStyles } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport { useProgressBarStyles } from '../utils/useProgressBarStyles.styles';\nimport type {\n AttachmentOverflowMenuButtonSlots,\n AttachmentOverflowMenuButtonState,\n} from './AttachmentOverflowMenuButton.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentOverflowMenuButtonClassNames: SlotClassNames<AttachmentOverflowMenuButtonSlots> = {\n root: 'fai-AttachmentOverflowMenuButton',\n progress: 'fai-AttachmentOverflowMenuButton__progress',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n color: tokens.colorNeutralForeground1,\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 cursor: 'pointer',\n display: 'inline-flex',\n flexWrap: 'nowrap',\n fontFamily: typographyStyles.body1.fontFamily,\n fontSize: typographyStyles.body1.fontSize,\n fontWeight: typographyStyles.body1.fontWeight,\n justifyContent: 'center',\n padding: `${tokens.spacingVerticalXS} ${tokens.spacingHorizontalS}`,\n verticalAlign: 'middle',\n position: 'relative',\n\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\nconst useNextStyles = makeStyles({\n root: { borderRadius: tokens.borderRadiusXLarge },\n canvas: {\n padding: `calc(${tokens.spacingVerticalS} - ${tokens.strokeWidthThin}) ${tokens.spacingHorizontalS}`,\n },\n sidecar: {\n padding: `calc(${tokens.spacingVerticalXS} - ${tokens.strokeWidthThin}) ${tokens.spacingHorizontalS}`,\n },\n});\n\n/**\n * Apply styling to the AttachmentOverflowMenuButton slots based on the state\n */\nexport const useAttachmentOverflowMenuButtonStyles_unstable = (\n state: AttachmentOverflowMenuButtonState,\n): AttachmentOverflowMenuButtonState => {\n 'use no memo';\n\n const { designVersion, mode } = state;\n\n const rootBaseClassName = useRootBaseClassName();\n const progressBarStyles = useProgressBarStyles();\n const nextStyles = useNextStyles();\n\n state.root.className = mergeClasses(\n attachmentOverflowMenuButtonClassNames.root,\n rootBaseClassName,\n designVersion === 'next' && nextStyles.root,\n designVersion === 'next' && nextStyles[mode],\n state.root.className,\n );\n\n if (state.progress) {\n state.progress.className = mergeClasses(\n attachmentOverflowMenuButtonClassNames.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":["attachmentOverflowMenuButtonClassNames","borderRadius","root","progress","useRootBaseClassName","makeResetStyles","color","alignItems","border","strokeWidthThin","boxSizing","columnGap","cursor","display","flexWrap","fontSize","fontWeight","justifyContent","padding","verticalAlign","position","backgroundColor","z189sj","z8tnut","state","designVersion","sidecar","rootBaseClassName","progressBarStyles","useProgressBarStyles","nextStyles","useNextStyles","useAttachmentOverflowMenuButtonStyles_unstable","className","mergeClasses","bar","mode","elementType","renderByDefault","value","undefined","regularProgressBar"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IASaA,sCAAAA;eAAAA;;IA4CHC,8CAAuC;eAAvCA;;;iCArDgE;4CAErC;AAO9B,MAAMD,yCAA4F;UACvGE;cACAC;AACF;AAEA,MAAMC,uBAAuBC,IAAAA,8BAAAA,EAAAA,YAAgB,MAAA;OAC3CC;QAAAA;QAAqC;QAAA;KAAA;OACrCC;QAAAA;KAAY;;MAEZC,gBAAkBC,IAAAA,yBAAAA,EAAAA;UAClBR;QACAS,SAAAA;QACAC,SAAAA;QACAC,SAAQ;QACRC,SAAS;QACTC,QAAAA;;YAEAC;QACAC,SAAAA;QACAC,QAAAA;QACAC,QAAAA;QACAC,QAAAA;QACAC,SAAAA;;aAGER;iBACAS;gBACAf;QACFgB,QAAA;QACAC,QAAA;iBACEF;;;OAGF;QAAA;YAAA;YAAkC;oBAChC;;;;;YACmB;oBACnB;;;;;YACW;;;;;;MAOLpB,iDAAuCuB,CAAAA;;UAE7CN,EACFO,aAAA,EACAC,IAAAA;UAEAC,oBAAAvB;IACF,MAAAwB,oBAAAC,IAAAA,gDAAA;IAEA,MAAAC,aAAAC;;IAEC,IACDP,MAAOrB,QAAM6B,EAAAA;QAGXR,MAAArB,QAAA,CAAA8B,SAAA,GAAAC,IAAAA,6BAAA,EAAAlC,uCAAAG,QAAA,EAAAyB,kBAAAzB,QAAA,EAAAqB,MAAArB,QAAA,CAAA8B,SAAA;QAEA,MAAME,MAAEV,qBAAAA,CAAAA,QAAeW,CAAAA,MAASZ,QAAAA,CAAAA,GAAAA,EAAAA;YAEhCa,aAAMV;YACNW,iBAAMV;QACN;QAEAJ,IAAAA,KAAMtB;YAQN,IAAIsB,MAAMrB,QAAU,CAAAoC,KAAA,KAAAC,WAAA;gBAClBhB,IAAAA,SAAMrB,GAAS8B,IAAAA,6BAAYC,EAAAA,kBACzBlC,wBAAAA,EAAAA,IAAAA,SAAuCG;mBAKzC;oBAAgDkC,SAAAA,GAAAA,IAAAA,6BAAa,EAAAT,kBAAAa,kBAAA,EAAAN,IAAAF,SAAA;;kBAA6B9B,QAAA,CAAAgC,GAAA,GAAAA;;;;2EAKvCM"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useAttachmentTagStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses,
|
|
1
|
+
{"version":3,"sources":["useAttachmentTagStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, typographyStyles } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { AttachmentTagSlots, AttachmentTagState } from './AttachmentTag.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentTagClassNames: SlotClassNames<AttachmentTagSlots> = {\n root: 'fai-AttachmentTag',\n media: 'fai-AttachmentTag__media',\n content: 'fai-AttachmentTag__content',\n icon: 'fai-AttachmentTag__icon',\n};\n\n/**\n * @internal\n */\nexport const ATTACHMENTTAG_MAXWIDTH = '180px';\nconst ATTACHMENTTAG_SIZE = '20px';\n\nconst useRootBaseClassName = makeResetStyles({\n color: tokens.colorNeutralForeground1,\n alignItems: 'center',\n backgroundColor: tokens.colorNeutralBackground1,\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n borderRadius: tokens.borderRadiusMedium,\n boxSizing: 'border-box',\n columnGap: tokens.spacingHorizontalSNudge,\n cursor: 'pointer',\n display: 'inline-flex',\n flexWrap: 'nowrap',\n justifyContent: 'center',\n maxWidth: ATTACHMENTTAG_MAXWIDTH,\n padding: `${tokens.spacingVerticalXS} ${tokens.spacingHorizontalXS} ${tokens.spacingVerticalXS} ${tokens.spacingHorizontalS}`,\n verticalAlign: 'middle',\n\n ':hover': {\n borderColor: tokens.colorNeutralStroke1Hover,\n\n [`& .${attachmentTagClassNames.icon}`]: {\n color: tokens.colorBrandForegroundLinkHover,\n },\n },\n\n ':hover:active': {\n borderColor: tokens.colorNeutralStroke1Pressed,\n\n [`& .${attachmentTagClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n\n ':focus': {\n [`& .${attachmentTagClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2BrandHover,\n },\n },\n\n ':focus:active': {\n [`& .${attachmentTagClassNames.icon}`]: {\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n});\n\n/**\n * @internal\n */\nexport const useMediaBaseClassName = makeResetStyles({\n fontSize: ATTACHMENTTAG_SIZE,\n height: ATTACHMENTTAG_SIZE,\n lineHeight: ATTACHMENTTAG_SIZE,\n width: ATTACHMENTTAG_SIZE,\n});\n\n/**\n * @internal\n */\nexport const useContentBaseClassName = makeResetStyles({\n overflowX: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n ...typographyStyles.body1,\n});\n\n/**\n * @internal\n */\nexport const useIconBaseClassName = 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: ATTACHMENTTAG_SIZE,\n height: `calc(${ATTACHMENTTAG_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingVerticalXXS})`,\n justifyContent: 'center',\n maxWidth: `calc(${ATTACHMENTTAG_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS})`,\n minWidth: `calc(${ATTACHMENTTAG_SIZE} + ${tokens.strokeWidthThin} * 2 + ${tokens.spacingHorizontalXXS})`,\n padding: `calc(${tokens.spacingVerticalXXS} / 2) calc(${tokens.spacingHorizontalXXS} / 2)`,\n});\n\n/**\n * Apply styling to the AttachmentTag slots based on the state\n */\nexport const useAttachmentTagStyles_unstable = (state: AttachmentTagState): AttachmentTagState => {\n 'use no memo';\n\n const rootBaseClassName = useRootBaseClassName();\n const mediaBaseClassName = useMediaBaseClassName();\n const contentBaseClassName = useContentBaseClassName();\n const iconBaseClassName = useIconBaseClassName();\n\n state.root.className = mergeClasses(attachmentTagClassNames.root, rootBaseClassName, state.root.className);\n\n if (state.media) {\n state.media.className = mergeClasses(attachmentTagClassNames.media, mediaBaseClassName, state.media.className);\n }\n\n state.content.className = mergeClasses(\n attachmentTagClassNames.content,\n contentBaseClassName,\n state.content.className,\n );\n\n state.icon.className = mergeClasses(attachmentTagClassNames.icon, iconBaseClassName, state.icon.className);\n\n return state;\n};\n"],"names":["ATTACHMENTTAG_SIZE","attachmentTagClassNames","useAttachmentTagStyles_unstable","useContentBaseClassName","useIconBaseClassName","spacingVerticalXS","borderRadius","borderRadiusMedium","root","media","content","icon","useRootBaseClassName","color","colorNeutralForeground1","display","__resetStyles","padding","tokens","spacingHorizontalXS","state","rootBaseClassName","mediaBaseClassName","useMediaBaseClassName","borderColor","colorNeutralStroke1Pressed","iconBaseClassName","colorNeutralForeground2BrandPressed","className","mergeClasses","contentBaseClassName","colorNeutralForeground2BrandHover"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAgBMA,sBAAqB;eAArBA;;IAXOC,uBAAAA;eAAAA;;IAgCJC,+BAA+B;eAA/BA;;IAVEC,uBAAA;eAAAA;;IAIAC,oBAAUC;eAAVD;;IARTE,qBAAqBC;eAArBD;;;iCAvBsD;AAKjD,MAAML,0BAA8D;UACzEO;WACAC;aACAC;UACAC;AACF;AAMMX,MAAAA,yBAAqB;AAE3B,MAAMY,qBAAAA;MACJC,uBAAcC,IAAAA,8BAAuB,EAAA,YAAA,WAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;CAAA;AAIrCR,MAAAA,wBAAqBC,IAAAA,8BAAkB,EAAA,YAAA,MAAA;IAAA;CAAA;AAIvCQ,MAASZ,0BAAAa,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;CAAA;AAITC,MAASb,uBAAUC,IAAAA,8BAAqBa,EAAAA,YAAOC,MAAAA;IAAAA;CAA8E;MAMtHjB,kCAAiCkB,CAAAA;;UAGxCC,oBAAAT;UAEAU,qBAAiBC;UACfC,uBAAoBC;UAEpBC,oBAAOzB;cACLY,CAAAA,SAAOK,GAAAA,IAAAA,6BAAOS,EAAAA,wBAAmCnB,IAAA,EAAAa,mBAAAD,MAAAZ,IAAA,CAAAoB,SAAA;cACnDnB,KAAA,EAAA;QACFW,MAAAX,KAAA,CAAAmB,SAAA,GAAAC,IAAAA,6BAAA,EAAA5B,wBAAAQ,KAAA,EAAAa,oBAAAF,MAAAX,KAAA,CAAAmB,SAAA;;UAGElB,OAAOT,CAAAA,SAAAA,GAAAA,IAAAA,6BAAwBU,EAAAA,wBAASD,OAAA,EAAAoB,sBAAAV,MAAAV,OAAA,CAAAkB,SAAA;cACtCf,CAAAA,SAAOK,GAAAA,IAAAA,6BAAOa,EAAAA,wBAAiCpB,IAAA,EAAAe,mBAAAN,MAAAT,IAAA,CAAAiB,SAAA;WACjDR;4DAGe"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useAttachmentTagItemStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses
|
|
1
|
+
{"version":3,"sources":["useAttachmentTagItemStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport {\n ATTACHMENTTAG_MAXWIDTH,\n useContentBaseClassName,\n useIconBaseClassName,\n useMediaBaseClassName,\n} from '../AttachmentTag/useAttachmentTagStyles.styles';\nimport type { AttachmentTagItemSlots, AttachmentTagItemState } from './AttachmentTagItem.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentTagItemClassNames: SlotClassNames<AttachmentTagItemSlots> = {\n root: 'fai-AttachmentTagItem',\n media: 'fai-AttachmentTagItem__media',\n content: 'fai-AttachmentTagItem__content',\n icon: 'fai-AttachmentTagItem__icon',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootBaseClassName = makeResetStyles({\n display: 'inline-flex',\n flexWrap: 'nowrap',\n columnGap: tokens.spacingHorizontalSNudge,\n maxWidth: ATTACHMENTTAG_MAXWIDTH,\n alignItems: 'center',\n});\n\n/**\n * Apply styling to the AttachmentTagItem slots based on the state\n */\nexport const useAttachmentTagItemStyles_unstable = (state: AttachmentTagItemState): AttachmentTagItemState => {\n 'use no memo';\n\n const rootBaseClassName = useRootBaseClassName();\n const mediaBaseClassName = useMediaBaseClassName();\n const contentBaseClassName = useContentBaseClassName();\n const iconBaseClassName = useIconBaseClassName();\n\n state.root.className = mergeClasses(attachmentTagItemClassNames.root, rootBaseClassName, state.root.className);\n\n if (state.media) {\n state.media.className = mergeClasses(attachmentTagItemClassNames.media, mediaBaseClassName, state.media.className);\n }\n\n state.content.className = mergeClasses(\n attachmentTagItemClassNames.content,\n contentBaseClassName,\n state.content.className,\n );\n\n state.icon.className = mergeClasses(attachmentTagItemClassNames.icon, iconBaseClassName, state.icon.className);\n\n return state;\n};\n"],"names":["attachmentTagItemClassNames","alignItems","root","media","content","icon","display","__resetStyles","state","mediaBaseClassName","useAttachmentTagItemStyles_unstable","contentBaseClassName","useContentBaseClassName","iconBaseClassName","rootBaseClassName","useRootBaseClassName","useMediaBaseClassName","useIconBaseClassName","mergeClasses","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAWaA,2BAAAA;eAAAA;;IAeXC,mCAAY;eAAZA;;;iCA1BoC;8CAO/B;AAIA,MAAMD,8BAAsE;UACjFE;WACAC;aACAC;UACAC;AACF;AAEA;;CAEC,SAECC,uBAASC,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;CAAA;AAITN,MAAAA,sCAAYO,CAAAA;IACd;;IAIC,MACDC,qBAAaC,IAAAA,mDAAAA;UACXC,uBAAAC,IAAAA,qDAAA;UAEAC,oBAAMC,IAAAA,kDAAoBC;UAC1Bb,IAAMO,CAAAA,SAAAA,GAAAA,IAAAA,6BAAqBO,EAAAA,4BAAAA,IAAAA,EAAAA,mBAAAA,MAAAA,IAAAA,CAAAA,SAAAA;QAC3BR,MAAMG,KAAAA,EAAAA;QACNH,MAAMK,KAAAA,CAAAA,SAAAA,GAAAA,IAAAA,6BAAoBI,EAAAA,4BAAAA,KAAAA,EAAAA,oBAAAA,MAAAA,KAAAA,CAAAA,SAAAA;;UAItBT,OAAML,CAAAA,SAAO,GAAAe,IAAAA,6BAAA,EAAAlB,4BAAAI,OAAA,EAAAO,sBAAAH,MAAAJ,OAAA,CAAAe,SAAA;UACfX,IAAAA,CAAAA,SAAYW,GAAAA,IAAAA,6BAAYD,EAAAA,4BAAalB,IAAAA,EAAAA,mBAAmCS,MAAAA,IAAoBD,CAAAA,SAAW;WACzGA;gEAQoCR"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useAttachmentTagListStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses
|
|
1
|
+
{"version":3,"sources":["useAttachmentTagListStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { AttachmentTagListSlots, AttachmentTagListState } from './AttachmentTagList.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentTagListClassNames: SlotClassNames<AttachmentTagListSlots> = {\n root: 'fai-AttachmentTagList',\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\n/**\n * Apply styling to the AttachmentTagList slots based on the state\n */\nexport const useAttachmentTagListStyles_unstable = (state: AttachmentTagListState): AttachmentTagListState => {\n 'use no memo';\n\n const rootBaseClassName = useRootBaseClassName();\n state.root.className = mergeClasses(attachmentTagListClassNames.root, rootBaseClassName, state.root.className);\n\n return state;\n};\n"],"names":["attachmentTagListClassNames","flexShrink","root","useRootBaseClassName","makeResetStyles","state","rootBaseClassName","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,2BAAAA;eAAAA;;IAQXC,mCAAY;eAAZA;;;iCAboC;AAK/B,MAAMD,8BAAsE;UACjFE;AACF;AAEA,MAAMC,uBAAuBC,IAAAA,8BAAAA,EAAAA,YAAgB,MAAA;IAAA;CAAA;AAI3CH,MAAAA,sCAAYI,CAAAA;;IAGd,MAAAC,oBAAAH;IAEAE,MAAAH,IAAA,CAAAK,SAAA,GAAAC,IAAAA,6BAAA,EAAAR,4BAAAE,IAAA,EAAAI,mBAAAD,MAAAH,IAAA,CAAAK,SAAA;;gEAIE"}
|
|
@@ -45,12 +45,12 @@ const useProgressBarStyles = (0, _reactcomponents.__styles)({
|
|
|
45
45
|
},
|
|
46
46
|
regularProgressBar: {
|
|
47
47
|
Bqenvij: "f1l02sjl",
|
|
48
|
-
Bcmaq0h: "
|
|
48
|
+
Bcmaq0h: "ffso0f9"
|
|
49
49
|
},
|
|
50
50
|
indeterminateProgressBar: {
|
|
51
51
|
Bqenvij: "f1l02sjl",
|
|
52
52
|
De3pzq: "f1c21dwh",
|
|
53
|
-
Bcmaq0h: "
|
|
53
|
+
Bcmaq0h: "fc9jjzv",
|
|
54
54
|
jpy9cc: "f3z2g5w",
|
|
55
55
|
Bqo2lbl: "fz5izi4",
|
|
56
56
|
B6plc1d: "fv40pdu",
|
|
@@ -67,9 +67,9 @@ const useProgressBarStyles = (0, _reactcomponents.__styles)({
|
|
|
67
67
|
".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}",
|
|
68
68
|
".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}",
|
|
69
69
|
".f1l02sjl{height:100%;}",
|
|
70
|
-
".
|
|
70
|
+
".ffso0f9{background-image:linear-gradient(90deg, var(--colorBrandFlair1) 35%, var(--colorBrandFlair2) 70%, var(--colorBrandFlair3) 92%);}",
|
|
71
71
|
".f1c21dwh{background-color:var(--colorTransparentBackground);}",
|
|
72
|
-
".
|
|
72
|
+
".fc9jjzv{background-image:linear-gradient(90deg, rgba(0,0,0,0) 0%, var(--colorBrandFlair1) 35%, var(--colorBrandFlair2) 70%, var(--colorBrandFlair3) 92%, rgba(0,0,0,0));}"
|
|
73
73
|
],
|
|
74
74
|
m: [
|
|
75
75
|
[
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useProgressBarStyles.styles.ts"],"sourcesContent":["import { makeStyles
|
|
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":["progress","indeterminateProgressBarReducedMotion","opacity","__styles","width","position","bottom","left","right","height","borderBottomLeftRadius","borderBottomRightRadius","tokens","Bbmb7ep","backgroundImage","Bcmaq0h","backgroundColor","maxWidth","animationIterationCount","animationDuration","animationName","d"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAmBEA;;;eAAAA;;;iCAnBiB;AAGnB,MAAMC,wCAAwC;UAC5C;iBACEC;;WAEF;iBACEA;;YAEF;iBACEA;;AAEJ;AAMEF,MAAAA,uBAAUG,IAAAA,yBAAA,EAAA;cACRC;gBACAC;gBACAC;iBACAC;gBACAC;YAAAA;YAAO;SAAA;gBACPC;YAAAA;YAAQ;SAAA;iBACRC;iBACAC;YAAAA;YAAAA;SAAyBC;QAC3BC,SAAA;YAAA;YAAA;SAAA;;wBAEU;iBACRC;QACFC,SAAA;;8BAEU;iBACRC;gBACAF;iBACA;gBACEG;iBACAC;iBACAC;gBACAC;;;IAGNC,GAAG;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-copilot/react-attachments",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.11.1",
|
|
4
4
|
"description": "A set of components related to attaching files in Copilot experiences.",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -12,9 +12,9 @@
|
|
|
12
12
|
},
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@fluentui-copilot/react-provider": "^0.
|
|
15
|
+
"@fluentui-copilot/react-provider": "^0.10.1",
|
|
16
16
|
"@fluentui-copilot/react-utilities": "^0.0.5",
|
|
17
|
-
"@fluentui-copilot/tokens": "^0.3.
|
|
17
|
+
"@fluentui-copilot/tokens": "^0.3.6",
|
|
18
18
|
"@swc/helpers": "^0.5.1"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|