@fluentui-copilot/react-suggestions 0.12.2 → 0.12.3-hotfix.2
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 +46 -1
- package/CHANGELOG.md +20 -2
- package/lib/components/Suggestion/useSuggestionStyles.styles.raw.js +58 -0
- package/lib/components/Suggestion/useSuggestionStyles.styles.raw.js.map +1 -0
- package/lib/components/SuggestionList/useSuggestionListStyles.styles.raw.js +47 -0
- package/lib/components/SuggestionList/useSuggestionListStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/Suggestion/useSuggestionStyles.styles.raw.js +71 -0
- package/lib-commonjs/components/Suggestion/useSuggestionStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/SuggestionList/useSuggestionListStyles.styles.raw.js +59 -0
- package/lib-commonjs/components/SuggestionList/useSuggestionListStyles.styles.raw.js.map +1 -0
- package/package.json +6 -10
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,52 @@
|
|
|
2
2
|
"name": "@fluentui-copilot/react-suggestions",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Fri, 19 Sep 2025 15:10:20 GMT",
|
|
6
|
+
"tag": "@fluentui-copilot/react-suggestions_v0.12.3-hotfix.2",
|
|
7
|
+
"version": "0.12.3-hotfix.2",
|
|
8
|
+
"comments": {
|
|
9
|
+
"prerelease": [
|
|
10
|
+
{
|
|
11
|
+
"author": "hochelmartin@gmail.com",
|
|
12
|
+
"package": "@fluentui-copilot/react-suggestions",
|
|
13
|
+
"commit": "3e4ebe676646c4c4346dbbab83511f963ffefd85",
|
|
14
|
+
"comment": "release: prepare hotfix 0.26.2-hotfix.2"
|
|
15
|
+
}
|
|
16
|
+
]
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
{
|
|
20
|
+
"date": "Mon, 19 May 2025 18:04:28 GMT",
|
|
21
|
+
"tag": "@fluentui-copilot/react-suggestions_v0.12.3",
|
|
22
|
+
"version": "0.12.3",
|
|
23
|
+
"comments": {
|
|
24
|
+
"none": [
|
|
25
|
+
{
|
|
26
|
+
"author": "hochelmartin@gmail.com",
|
|
27
|
+
"package": "@fluentui-copilot/react-suggestions",
|
|
28
|
+
"commit": "442954951d0eca92de20ecb0ff0fa9492431b62d",
|
|
29
|
+
"comment": "fix: exclude story files from production build"
|
|
30
|
+
}
|
|
31
|
+
]
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"date": "Sat, 03 May 2025 01:27:45 GMT",
|
|
36
|
+
"tag": "@fluentui-copilot/react-suggestions_v0.12.3",
|
|
37
|
+
"version": "0.12.3",
|
|
38
|
+
"comments": {
|
|
39
|
+
"patch": [
|
|
40
|
+
{
|
|
41
|
+
"author": "estebanmu@microsoft.com",
|
|
42
|
+
"package": "@fluentui-copilot/react-suggestions",
|
|
43
|
+
"commit": "3dc05bb66ec473691f198f65b5124cc24390f47c",
|
|
44
|
+
"comment": "chore: Bump @fluentui/react-components to 9.63.0."
|
|
45
|
+
}
|
|
46
|
+
]
|
|
47
|
+
}
|
|
48
|
+
},
|
|
49
|
+
{
|
|
50
|
+
"date": "Wed, 30 Apr 2025 01:47:50 GMT",
|
|
6
51
|
"tag": "@fluentui-copilot/react-suggestions_v0.12.2",
|
|
7
52
|
"version": "0.12.2",
|
|
8
53
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,30 @@
|
|
|
1
1
|
# Change Log - @fluentui-copilot/react-suggestions
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Fri, 19 Sep 2025 15:10:20 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [0.12.3-hotfix.2](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-suggestions_v0.12.3-hotfix.2)
|
|
8
|
+
|
|
9
|
+
Fri, 19 Sep 2025 15:10:20 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-suggestions_v0.12.3..@fluentui-copilot/react-suggestions_v0.12.3-hotfix.2)
|
|
11
|
+
|
|
12
|
+
### Changes
|
|
13
|
+
|
|
14
|
+
- release: prepare hotfix 0.26.2-hotfix.2 ([PR #3284](https://github.com/microsoft/fluentai/pull/3284) by hochelmartin@gmail.com)
|
|
15
|
+
|
|
16
|
+
## [0.12.3](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-suggestions_v0.12.3)
|
|
17
|
+
|
|
18
|
+
Sat, 03 May 2025 01:27:45 GMT
|
|
19
|
+
[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-suggestions_v0.12.2..@fluentui-copilot/react-suggestions_v0.12.3)
|
|
20
|
+
|
|
21
|
+
### Patches
|
|
22
|
+
|
|
23
|
+
- chore: Bump @fluentui/react-components to 9.63.0. ([PR #2917](https://github.com/microsoft/fluentai/pull/2917) by estebanmu@microsoft.com)
|
|
24
|
+
|
|
7
25
|
## [0.12.2](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-suggestions_v0.12.2)
|
|
8
26
|
|
|
9
|
-
Wed, 30 Apr 2025 01:
|
|
27
|
+
Wed, 30 Apr 2025 01:47:50 GMT
|
|
10
28
|
[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-suggestions_v0.11.0..@fluentui-copilot/react-suggestions_v0.12.2)
|
|
11
29
|
|
|
12
30
|
### Patches
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
import { makeStyles, mergeClasses, shorthands, typographyStyles } from '@fluentui/react-components';
|
|
2
|
+
import { tokens } from '@fluentui-copilot/tokens';
|
|
3
|
+
export const suggestionClassNames = {
|
|
4
|
+
root: 'fai-Suggestion',
|
|
5
|
+
icon: 'fai-Suggestion__icon'
|
|
6
|
+
};
|
|
7
|
+
const useSuggestionStyles = makeStyles({
|
|
8
|
+
root: {
|
|
9
|
+
...typographyStyles.caption1,
|
|
10
|
+
// Brand/M365/140
|
|
11
|
+
...shorthands.border('1px', 'solid', tokens.colorBrandStroke2),
|
|
12
|
+
borderRadius: tokens.borderRadiusXLarge,
|
|
13
|
+
padding: `${tokens.spacingVerticalXS} ${tokens.spacingVerticalS}`,
|
|
14
|
+
color: tokens.colorNeutralForeground2,
|
|
15
|
+
textAlign: 'start'
|
|
16
|
+
},
|
|
17
|
+
enabled: {
|
|
18
|
+
'@media (forced-colors: none)': {
|
|
19
|
+
':hover': {
|
|
20
|
+
// Brand/M365/120
|
|
21
|
+
...shorthands.borderColor(tokens.colorBrandStroke2Hover),
|
|
22
|
+
color: tokens.colorBrandForeground2Hover,
|
|
23
|
+
backgroundColor: tokens.colorBrandBackground2Hover
|
|
24
|
+
},
|
|
25
|
+
// Figma states 'on hover and pressed state'
|
|
26
|
+
':active:hover': {
|
|
27
|
+
// Brand/M365/120
|
|
28
|
+
...shorthands.borderColor(tokens.colorBrandStroke2Pressed),
|
|
29
|
+
color: tokens.colorBrandForeground2Pressed,
|
|
30
|
+
backgroundColor: tokens.colorBrandBackground2Pressed
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
},
|
|
34
|
+
canvas: {
|
|
35
|
+
...typographyStyles.body1,
|
|
36
|
+
padding: `${tokens.spacingVerticalSNudge} ${tokens.spacingHorizontalM}`
|
|
37
|
+
}
|
|
38
|
+
});
|
|
39
|
+
const useNextStyles = makeStyles({
|
|
40
|
+
root: {
|
|
41
|
+
paddingHorizontal: tokens.spacingHorizontalM,
|
|
42
|
+
paddingVertical: tokens.spacingVerticalSNudge,
|
|
43
|
+
fontSize: tokens.fontSizeBase200
|
|
44
|
+
}
|
|
45
|
+
});
|
|
46
|
+
export const useSuggestionStyles_unstable = state => {
|
|
47
|
+
'use no memo';
|
|
48
|
+
|
|
49
|
+
const {
|
|
50
|
+
designVersion,
|
|
51
|
+
mode
|
|
52
|
+
} = state;
|
|
53
|
+
const styles = useSuggestionStyles();
|
|
54
|
+
const nextStyles = useNextStyles();
|
|
55
|
+
state.root.className = mergeClasses(suggestionClassNames.root, styles.root, mode === 'canvas' && styles.canvas, designVersion === 'next' && nextStyles.root, !state.disabled && styles.enabled, state.root.className);
|
|
56
|
+
return state;
|
|
57
|
+
};
|
|
58
|
+
//# sourceMappingURL=useSuggestionStyles.styles.raw.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useSuggestionStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands, typographyStyles } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { SlotClassNames, ButtonSlots } from '@fluentui/react-components';\nimport type { SuggestionState } from './Suggestion.types';\n\nexport const suggestionClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fai-Suggestion',\n icon: 'fai-Suggestion__icon',\n};\n\nconst useSuggestionStyles = makeStyles({\n root: {\n ...typographyStyles.caption1,\n // Brand/M365/140\n ...shorthands.border('1px', 'solid', tokens.colorBrandStroke2),\n borderRadius: tokens.borderRadiusXLarge,\n padding: `${tokens.spacingVerticalXS} ${tokens.spacingVerticalS}`,\n color: tokens.colorNeutralForeground2,\n textAlign: 'start',\n // remove this MQ once https://github.com/microsoft/fluentui/issues/28552 is resolved\n // media queries have zero specificity\n },\n enabled: {\n '@media (forced-colors: none)': {\n ':hover': {\n // Brand/M365/120\n ...shorthands.borderColor(tokens.colorBrandStroke2Hover),\n color: tokens.colorBrandForeground2Hover,\n backgroundColor: tokens.colorBrandBackground2Hover,\n },\n // Figma states 'on hover and pressed state'\n ':active:hover': {\n // Brand/M365/120\n ...shorthands.borderColor(tokens.colorBrandStroke2Pressed),\n color: tokens.colorBrandForeground2Pressed,\n backgroundColor: tokens.colorBrandBackground2Pressed,\n },\n },\n },\n canvas: {\n ...typographyStyles.body1,\n padding: `${tokens.spacingVerticalSNudge} ${tokens.spacingHorizontalM}`,\n },\n});\n\nconst useNextStyles = makeStyles({\n root: {\n paddingHorizontal: tokens.spacingHorizontalM,\n paddingVertical: tokens.spacingVerticalSNudge,\n fontSize: tokens.fontSizeBase200,\n },\n});\n\nexport const useSuggestionStyles_unstable = (state: SuggestionState): SuggestionState => {\n 'use no memo';\n\n const { designVersion, mode } = state;\n\n const styles = useSuggestionStyles();\n const nextStyles = useNextStyles();\n state.root.className = mergeClasses(\n suggestionClassNames.root,\n styles.root,\n mode === 'canvas' && styles.canvas,\n designVersion === 'next' && nextStyles.root,\n !state.disabled && styles.enabled,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","shorthands","typographyStyles","tokens","suggestionClassNames","root","icon","useSuggestionStyles","caption1","border","colorBrandStroke2","borderRadius","borderRadiusXLarge","padding","spacingVerticalXS","spacingVerticalS","color","colorNeutralForeground2","textAlign","enabled","borderColor","colorBrandStroke2Hover","colorBrandForeground2Hover","backgroundColor","colorBrandBackground2Hover","colorBrandStroke2Pressed","colorBrandForeground2Pressed","colorBrandBackground2Pressed","canvas","body1","spacingVerticalSNudge","spacingHorizontalM","useNextStyles","paddingHorizontal","paddingVertical","fontSize","fontSizeBase200","useSuggestionStyles_unstable","state","designVersion","mode","styles","nextStyles","className","disabled"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,EAAEC,UAAU,EAAEC,gBAAgB,QAAQ,6BAA6B;AACpG,SAASC,MAAM,QAAQ,2BAA2B;AAIlD,OAAO,MAAMC,uBAAoD;IAC/DC,MAAM;IACNC,MAAM;AACR,EAAE;AAEF,MAAMC,sBAAsBR,WAAW;IACrCM,MAAM;QACJ,GAAGH,iBAAiBM,QAAQ;QAC5B,kBAAkB;QAClB,GAAGP,WAAWQ,MAAM,CAAC,OAAO,SAASN,OAAOO,iBAAiB,CAAC;QAC9DC,cAAcR,OAAOS,kBAAkB;QACvCC,SAAS,CAAC,EAAEV,OAAOW,iBAAiB,CAAC,CAAC,EAAEX,OAAOY,gBAAgB,CAAC,CAAC;QACjEC,OAAOb,OAAOc,uBAAuB;QACrCC,WAAW;IAGb;IACAC,SAAS;QACP,gCAAgC;YAC9B,UAAU;gBACR,kBAAkB;gBAClB,GAAGlB,WAAWmB,WAAW,CAACjB,OAAOkB,sBAAsB,CAAC;gBACxDL,OAAOb,OAAOmB,0BAA0B;gBACxCC,iBAAiBpB,OAAOqB,0BAA0B;YACpD;YACA,4CAA4C;YAC5C,iBAAiB;gBACf,kBAAkB;gBAClB,GAAGvB,WAAWmB,WAAW,CAACjB,OAAOsB,wBAAwB,CAAC;gBAC1DT,OAAOb,OAAOuB,4BAA4B;gBAC1CH,iBAAiBpB,OAAOwB,4BAA4B;YACtD;QACF;IACF;IACAC,QAAQ;QACN,GAAG1B,iBAAiB2B,KAAK;QACzBhB,SAAS,CAAC,EAAEV,OAAO2B,qBAAqB,CAAC,CAAC,EAAE3B,OAAO4B,kBAAkB,CAAC,CAAC;IACzE;AACF;AAEA,MAAMC,gBAAgBjC,WAAW;IAC/BM,MAAM;QACJ4B,mBAAmB9B,OAAO4B,kBAAkB;QAC5CG,iBAAiB/B,OAAO2B,qBAAqB;QAC7CK,UAAUhC,OAAOiC,eAAe;IAClC;AACF;AAEA,OAAO,MAAMC,+BAA+B,CAACC;IAC3C;IAEA,MAAM,EAAEC,aAAa,EAAEC,IAAI,EAAE,GAAGF;IAEhC,MAAMG,SAASlC;IACf,MAAMmC,aAAaV;IACnBM,MAAMjC,IAAI,CAACsC,SAAS,GAAG3C,aACrBI,qBAAqBC,IAAI,EACzBoC,OAAOpC,IAAI,EACXmC,SAAS,YAAYC,OAAOb,MAAM,EAClCW,kBAAkB,UAAUG,WAAWrC,IAAI,EAC3C,CAACiC,MAAMM,QAAQ,IAAIH,OAAOtB,OAAO,EACjCmB,MAAMjC,IAAI,CAACsC,SAAS;IAGtB,OAAOL;AACT,EAAE"}
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import { makeStyles, mergeClasses } from '@fluentui/react-components';
|
|
2
|
+
import { tokens } from '@fluentui-copilot/tokens';
|
|
3
|
+
export const suggestionListClassNames = {
|
|
4
|
+
root: 'fai-SuggestionList',
|
|
5
|
+
action: 'fai-SuggestionList__action'
|
|
6
|
+
};
|
|
7
|
+
/**
|
|
8
|
+
* Styles for the root slot
|
|
9
|
+
*/
|
|
10
|
+
const useStyles = makeStyles({
|
|
11
|
+
root: {
|
|
12
|
+
display: 'flex',
|
|
13
|
+
flexWrap: 'wrap',
|
|
14
|
+
justifyContent: 'flex-end',
|
|
15
|
+
gap: tokens.spacingVerticalS,
|
|
16
|
+
margin: `
|
|
17
|
+
${tokens.spacingVerticalNone}
|
|
18
|
+
${tokens.spacingHorizontalNone}
|
|
19
|
+
${tokens.spacingVerticalS}
|
|
20
|
+
${tokens.spacingHorizontalNone}
|
|
21
|
+
`,
|
|
22
|
+
'> :nth-last-of-type(2)': {
|
|
23
|
+
maxWidth: `calc(100% - ${tokens.spacingHorizontalXXL} - ${tokens.spacingVerticalS})`
|
|
24
|
+
}
|
|
25
|
+
},
|
|
26
|
+
horizontalAlignmentStart: {
|
|
27
|
+
justifyContent: 'flex-start'
|
|
28
|
+
},
|
|
29
|
+
action: {
|
|
30
|
+
minWidth: tokens.spacingHorizontalXXL,
|
|
31
|
+
maxWidth: tokens.spacingHorizontalXXL
|
|
32
|
+
}
|
|
33
|
+
});
|
|
34
|
+
/**
|
|
35
|
+
* Apply styling to the SuggestionList slots based on the state
|
|
36
|
+
*/
|
|
37
|
+
export const useSuggestionListStyles_unstable = state => {
|
|
38
|
+
'use no memo';
|
|
39
|
+
|
|
40
|
+
const styles = useStyles();
|
|
41
|
+
state.root.className = mergeClasses(suggestionListClassNames.root, styles.root, state.horizontalAlignment === 'start' && styles.horizontalAlignmentStart, state.root.className);
|
|
42
|
+
if (state.action) {
|
|
43
|
+
state.action.className = mergeClasses(suggestionListClassNames.action, styles.action, state.action.className);
|
|
44
|
+
}
|
|
45
|
+
return state;
|
|
46
|
+
};
|
|
47
|
+
//# sourceMappingURL=useSuggestionListStyles.styles.raw.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useSuggestionListStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { SuggestionListSlots, SuggestionListState } from './SuggestionList.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const suggestionListClassNames: SlotClassNames<SuggestionListSlots> = {\n root: 'fai-SuggestionList',\n action: 'fai-SuggestionList__action',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexWrap: 'wrap',\n justifyContent: 'flex-end',\n gap: tokens.spacingVerticalS,\n margin: `\n ${tokens.spacingVerticalNone}\n ${tokens.spacingHorizontalNone}\n ${tokens.spacingVerticalS}\n ${tokens.spacingHorizontalNone}\n `,\n '> :nth-last-of-type(2)': {\n maxWidth: `calc(100% - ${tokens.spacingHorizontalXXL} - ${tokens.spacingVerticalS})`,\n },\n },\n horizontalAlignmentStart: {\n justifyContent: 'flex-start',\n },\n\n action: {\n minWidth: tokens.spacingHorizontalXXL,\n maxWidth: tokens.spacingHorizontalXXL,\n },\n\n // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the SuggestionList slots based on the state\n */\nexport const useSuggestionListStyles_unstable = (state: SuggestionListState): SuggestionListState => {\n 'use no memo';\n\n const styles = useStyles();\n state.root.className = mergeClasses(\n suggestionListClassNames.root,\n styles.root,\n state.horizontalAlignment === 'start' && styles.horizontalAlignmentStart,\n state.root.className,\n );\n\n if (state.action) {\n state.action.className = mergeClasses(suggestionListClassNames.action, styles.action, state.action.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","suggestionListClassNames","root","action","useStyles","display","flexWrap","justifyContent","gap","spacingVerticalS","margin","spacingVerticalNone","spacingHorizontalNone","maxWidth","spacingHorizontalXXL","horizontalAlignmentStart","minWidth","useSuggestionListStyles_unstable","state","styles","className","horizontalAlignment"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,QAAQ,6BAA6B;AACtE,SAASC,MAAM,QAAQ,2BAA2B;AAIlD,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;IACNC,QAAQ;AACV,EAAE;AAEF;;CAEC,GACD,MAAMC,YAAYN,WAAW;IAC3BI,MAAM;QACJG,SAAS;QACTC,UAAU;QACVC,gBAAgB;QAChBC,KAAKR,OAAOS,gBAAgB;QAC5BC,QAAQ,CAAC;MACP,EAAEV,OAAOW,mBAAmB,CAAC;MAC7B,EAAEX,OAAOY,qBAAqB,CAAC;MAC/B,EAAEZ,OAAOS,gBAAgB,CAAC;MAC1B,EAAET,OAAOY,qBAAqB,CAAC;IACjC,CAAC;QACD,0BAA0B;YACxBC,UAAU,CAAC,YAAY,EAAEb,OAAOc,oBAAoB,CAAC,GAAG,EAAEd,OAAOS,gBAAgB,CAAC,CAAC,CAAC;QACtF;IACF;IACAM,0BAA0B;QACxBR,gBAAgB;IAClB;IAEAJ,QAAQ;QACNa,UAAUhB,OAAOc,oBAAoB;QACrCD,UAAUb,OAAOc,oBAAoB;IACvC;AAGF;AAEA;;CAEC,GACD,OAAO,MAAMG,mCAAmC,CAACC;IAC/C;IAEA,MAAMC,SAASf;IACfc,MAAMhB,IAAI,CAACkB,SAAS,GAAGrB,aACrBE,yBAAyBC,IAAI,EAC7BiB,OAAOjB,IAAI,EACXgB,MAAMG,mBAAmB,KAAK,WAAWF,OAAOJ,wBAAwB,EACxEG,MAAMhB,IAAI,CAACkB,SAAS;IAGtB,IAAIF,MAAMf,MAAM,EAAE;QAChBe,MAAMf,MAAM,CAACiB,SAAS,GAAGrB,aAAaE,yBAAyBE,MAAM,EAAEgB,OAAOhB,MAAM,EAAEe,MAAMf,MAAM,CAACiB,SAAS;IAC9G;IAEA,OAAOF;AACT,EAAE"}
|
|
@@ -0,0 +1,71 @@
|
|
|
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
|
+
suggestionClassNames: function() {
|
|
13
|
+
return suggestionClassNames;
|
|
14
|
+
},
|
|
15
|
+
useSuggestionStyles_unstable: function() {
|
|
16
|
+
return useSuggestionStyles_unstable;
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
const _reactcomponents = require("@fluentui/react-components");
|
|
20
|
+
const _tokens = require("@fluentui-copilot/tokens");
|
|
21
|
+
const suggestionClassNames = {
|
|
22
|
+
root: 'fai-Suggestion',
|
|
23
|
+
icon: 'fai-Suggestion__icon'
|
|
24
|
+
};
|
|
25
|
+
const useSuggestionStyles = (0, _reactcomponents.makeStyles)({
|
|
26
|
+
root: {
|
|
27
|
+
..._reactcomponents.typographyStyles.caption1,
|
|
28
|
+
// Brand/M365/140
|
|
29
|
+
..._reactcomponents.shorthands.border('1px', 'solid', _tokens.tokens.colorBrandStroke2),
|
|
30
|
+
borderRadius: _tokens.tokens.borderRadiusXLarge,
|
|
31
|
+
padding: `${_tokens.tokens.spacingVerticalXS} ${_tokens.tokens.spacingVerticalS}`,
|
|
32
|
+
color: _tokens.tokens.colorNeutralForeground2,
|
|
33
|
+
textAlign: 'start'
|
|
34
|
+
},
|
|
35
|
+
enabled: {
|
|
36
|
+
'@media (forced-colors: none)': {
|
|
37
|
+
':hover': {
|
|
38
|
+
// Brand/M365/120
|
|
39
|
+
..._reactcomponents.shorthands.borderColor(_tokens.tokens.colorBrandStroke2Hover),
|
|
40
|
+
color: _tokens.tokens.colorBrandForeground2Hover,
|
|
41
|
+
backgroundColor: _tokens.tokens.colorBrandBackground2Hover
|
|
42
|
+
},
|
|
43
|
+
// Figma states 'on hover and pressed state'
|
|
44
|
+
':active:hover': {
|
|
45
|
+
// Brand/M365/120
|
|
46
|
+
..._reactcomponents.shorthands.borderColor(_tokens.tokens.colorBrandStroke2Pressed),
|
|
47
|
+
color: _tokens.tokens.colorBrandForeground2Pressed,
|
|
48
|
+
backgroundColor: _tokens.tokens.colorBrandBackground2Pressed
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
},
|
|
52
|
+
canvas: {
|
|
53
|
+
..._reactcomponents.typographyStyles.body1,
|
|
54
|
+
padding: `${_tokens.tokens.spacingVerticalSNudge} ${_tokens.tokens.spacingHorizontalM}`
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
const useNextStyles = (0, _reactcomponents.makeStyles)({
|
|
58
|
+
root: {
|
|
59
|
+
paddingHorizontal: _tokens.tokens.spacingHorizontalM,
|
|
60
|
+
paddingVertical: _tokens.tokens.spacingVerticalSNudge,
|
|
61
|
+
fontSize: _tokens.tokens.fontSizeBase200
|
|
62
|
+
}
|
|
63
|
+
});
|
|
64
|
+
const useSuggestionStyles_unstable = (state)=>{
|
|
65
|
+
'use no memo';
|
|
66
|
+
const { designVersion, mode } = state;
|
|
67
|
+
const styles = useSuggestionStyles();
|
|
68
|
+
const nextStyles = useNextStyles();
|
|
69
|
+
state.root.className = (0, _reactcomponents.mergeClasses)(suggestionClassNames.root, styles.root, mode === 'canvas' && styles.canvas, designVersion === 'next' && nextStyles.root, !state.disabled && styles.enabled, state.root.className);
|
|
70
|
+
return state;
|
|
71
|
+
}; //# sourceMappingURL=useSuggestionStyles.styles.raw.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useSuggestionStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands, typographyStyles } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { SlotClassNames, ButtonSlots } from '@fluentui/react-components';\nimport type { SuggestionState } from './Suggestion.types';\n\nexport const suggestionClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fai-Suggestion',\n icon: 'fai-Suggestion__icon',\n};\n\nconst useSuggestionStyles = makeStyles({\n root: {\n ...typographyStyles.caption1,\n // Brand/M365/140\n ...shorthands.border('1px', 'solid', tokens.colorBrandStroke2),\n borderRadius: tokens.borderRadiusXLarge,\n padding: `${tokens.spacingVerticalXS} ${tokens.spacingVerticalS}`,\n color: tokens.colorNeutralForeground2,\n textAlign: 'start',\n // remove this MQ once https://github.com/microsoft/fluentui/issues/28552 is resolved\n // media queries have zero specificity\n },\n enabled: {\n '@media (forced-colors: none)': {\n ':hover': {\n // Brand/M365/120\n ...shorthands.borderColor(tokens.colorBrandStroke2Hover),\n color: tokens.colorBrandForeground2Hover,\n backgroundColor: tokens.colorBrandBackground2Hover,\n },\n // Figma states 'on hover and pressed state'\n ':active:hover': {\n // Brand/M365/120\n ...shorthands.borderColor(tokens.colorBrandStroke2Pressed),\n color: tokens.colorBrandForeground2Pressed,\n backgroundColor: tokens.colorBrandBackground2Pressed,\n },\n },\n },\n canvas: {\n ...typographyStyles.body1,\n padding: `${tokens.spacingVerticalSNudge} ${tokens.spacingHorizontalM}`,\n },\n});\n\nconst useNextStyles = makeStyles({\n root: {\n paddingHorizontal: tokens.spacingHorizontalM,\n paddingVertical: tokens.spacingVerticalSNudge,\n fontSize: tokens.fontSizeBase200,\n },\n});\n\nexport const useSuggestionStyles_unstable = (state: SuggestionState): SuggestionState => {\n 'use no memo';\n\n const { designVersion, mode } = state;\n\n const styles = useSuggestionStyles();\n const nextStyles = useNextStyles();\n state.root.className = mergeClasses(\n suggestionClassNames.root,\n styles.root,\n mode === 'canvas' && styles.canvas,\n designVersion === 'next' && nextStyles.root,\n !state.disabled && styles.enabled,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["suggestionClassNames","useSuggestionStyles_unstable","root","icon","useSuggestionStyles","makeStyles","typographyStyles","caption1","shorthands","border","tokens","colorBrandStroke2","borderRadius","borderRadiusXLarge","padding","spacingVerticalXS","spacingVerticalS","color","colorNeutralForeground2","textAlign","enabled","borderColor","colorBrandStroke2Hover","colorBrandForeground2Hover","backgroundColor","colorBrandBackground2Hover","colorBrandStroke2Pressed","colorBrandForeground2Pressed","colorBrandBackground2Pressed","canvas","body1","spacingVerticalSNudge","spacingHorizontalM","useNextStyles","paddingHorizontal","paddingVertical","fontSize","fontSizeBase200","state","designVersion","nextStyles","styles"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,oBAAAA;eAAAA;;IAgDAC,4BAAAA;eAAAA;;;iCArD0D;wBAChD;AAIhB,MAAMD,uBAAoD;UAC/DE;UACAC;AACF;AAEA,MAAMC,sBAAsBC,IAAAA,2BAAAA,EAAW;UACrCH;4CACKI,CAAAA,QAAiBC;0BACpB;sCACGC,CAAAA,MAAWC,CAAAA,OAAO,SAAOC,cAASA,CAAAA,iBAAOC,CAAAA;sBAC5CC,cAAcF,CAAAA,kBAAOG;iBACrBC,CAAAA,EAAAA,cAAYJ,CAAAA,iBAAOK,CAAAA,CAAAA,EAAiBL,cAAIA,CAAAA,gBAAOM,CAAAA,CAAAA;eAC/CC,cAAOP,CAAAA,uBAAOQ;mBACdC;;aAIFC;wCACE;sBACE;kCACE;8CACGZ,CAAAA,WAAWa,CAAAA,cAAAA,CAAWC,sBAAQA,CAAAA;qCACjCL,CAAAA,0BAAcM;iCACdC,cAAAA,CAAAA,0BAAwBC;;wDAE1B;6BACA;kCACE;8CACGjB,CAAAA,WAAWa,CAAAA,cAAAA,CAAWK,wBAAQA,CAAAA;qCACjCT,CAAAA,4BAAcU;iCACdH,cAAAA,CAAAA,4BAAwBI;;;;YAI9BC;4CACKvB,CAAAA,KAAiBwB;iBACpBhB,CAAAA,EAAAA,cAAYJ,CAAAA,qBAAOqB,CAAAA,CAAAA,EAAqBrB,cAAIA,CAAAA,kBAAOsB,CAAAA,CAAAA;;AAEvD;AAEA,MAAMC,gBAAgB5B,IAAAA,2BAAAA,EAAW;UAC/BH;2BACEgC,cAAmBxB,CAAAA,kBAAOsB;yBAC1BG,cAAiBzB,CAAAA,qBAAOqB;kBACxBK,cAAU1B,CAAAA,eAAO2B;;AAErB;AAEO,MAAMpC,+BAA+BqC,CAAAA;;UAK1C,EACAC,aAAMC,EACNF,IAAAA,KASAA;IACA,MAAAG,SAAArC"}
|
|
@@ -0,0 +1,59 @@
|
|
|
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
|
+
suggestionListClassNames: function() {
|
|
13
|
+
return suggestionListClassNames;
|
|
14
|
+
},
|
|
15
|
+
useSuggestionListStyles_unstable: function() {
|
|
16
|
+
return useSuggestionListStyles_unstable;
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
const _reactcomponents = require("@fluentui/react-components");
|
|
20
|
+
const _tokens = require("@fluentui-copilot/tokens");
|
|
21
|
+
const suggestionListClassNames = {
|
|
22
|
+
root: 'fai-SuggestionList',
|
|
23
|
+
action: 'fai-SuggestionList__action'
|
|
24
|
+
};
|
|
25
|
+
/**
|
|
26
|
+
* Styles for the root slot
|
|
27
|
+
*/ const useStyles = (0, _reactcomponents.makeStyles)({
|
|
28
|
+
root: {
|
|
29
|
+
display: 'flex',
|
|
30
|
+
flexWrap: 'wrap',
|
|
31
|
+
justifyContent: 'flex-end',
|
|
32
|
+
gap: _tokens.tokens.spacingVerticalS,
|
|
33
|
+
margin: `
|
|
34
|
+
${_tokens.tokens.spacingVerticalNone}
|
|
35
|
+
${_tokens.tokens.spacingHorizontalNone}
|
|
36
|
+
${_tokens.tokens.spacingVerticalS}
|
|
37
|
+
${_tokens.tokens.spacingHorizontalNone}
|
|
38
|
+
`,
|
|
39
|
+
'> :nth-last-of-type(2)': {
|
|
40
|
+
maxWidth: `calc(100% - ${_tokens.tokens.spacingHorizontalXXL} - ${_tokens.tokens.spacingVerticalS})`
|
|
41
|
+
}
|
|
42
|
+
},
|
|
43
|
+
horizontalAlignmentStart: {
|
|
44
|
+
justifyContent: 'flex-start'
|
|
45
|
+
},
|
|
46
|
+
action: {
|
|
47
|
+
minWidth: _tokens.tokens.spacingHorizontalXXL,
|
|
48
|
+
maxWidth: _tokens.tokens.spacingHorizontalXXL
|
|
49
|
+
}
|
|
50
|
+
});
|
|
51
|
+
const useSuggestionListStyles_unstable = (state)=>{
|
|
52
|
+
'use no memo';
|
|
53
|
+
const styles = useStyles();
|
|
54
|
+
state.root.className = (0, _reactcomponents.mergeClasses)(suggestionListClassNames.root, styles.root, state.horizontalAlignment === 'start' && styles.horizontalAlignmentStart, state.root.className);
|
|
55
|
+
if (state.action) {
|
|
56
|
+
state.action.className = (0, _reactcomponents.mergeClasses)(suggestionListClassNames.action, styles.action, state.action.className);
|
|
57
|
+
}
|
|
58
|
+
return state;
|
|
59
|
+
}; //# sourceMappingURL=useSuggestionListStyles.styles.raw.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useSuggestionListStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { SuggestionListSlots, SuggestionListState } from './SuggestionList.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const suggestionListClassNames: SlotClassNames<SuggestionListSlots> = {\n root: 'fai-SuggestionList',\n action: 'fai-SuggestionList__action',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'flex',\n flexWrap: 'wrap',\n justifyContent: 'flex-end',\n gap: tokens.spacingVerticalS,\n margin: `\n ${tokens.spacingVerticalNone}\n ${tokens.spacingHorizontalNone}\n ${tokens.spacingVerticalS}\n ${tokens.spacingHorizontalNone}\n `,\n '> :nth-last-of-type(2)': {\n maxWidth: `calc(100% - ${tokens.spacingHorizontalXXL} - ${tokens.spacingVerticalS})`,\n },\n },\n horizontalAlignmentStart: {\n justifyContent: 'flex-start',\n },\n\n action: {\n minWidth: tokens.spacingHorizontalXXL,\n maxWidth: tokens.spacingHorizontalXXL,\n },\n\n // TODO add additional classes for different states and/or slots\n});\n\n/**\n * Apply styling to the SuggestionList slots based on the state\n */\nexport const useSuggestionListStyles_unstable = (state: SuggestionListState): SuggestionListState => {\n 'use no memo';\n\n const styles = useStyles();\n state.root.className = mergeClasses(\n suggestionListClassNames.root,\n styles.root,\n state.horizontalAlignment === 'start' && styles.horizontalAlignmentStart,\n state.root.className,\n );\n\n if (state.action) {\n state.action.className = mergeClasses(suggestionListClassNames.action, styles.action, state.action.className);\n }\n\n return state;\n};\n"],"names":["suggestionListClassNames","styles","useStyles","root","action","makeStyles","display","flexWrap","justifyContent","spacingVerticalS","margin","tokens","spacingHorizontalNone","spacingHorizontalXXL","minWidth","maxWidth","state","className","mergeClasses","horizontalAlignment","horizontalAlignmentStart"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,wBAAAA;eAAAA;;IA0CLC,gCAASC;eAATD;;;iCA/CiC;wBAClB;AAIhB,MAAMD,2BAAgE;UAC3EG;YACAC;AACF;AAEA;;CAEC,SAECD,YAAME,IAAAA,2BAAA,EAAA;UACJC;iBACAC;kBACAC;wBACYC;aACZC,cAAAA,CAAQD,gBAAC;gBACLE,CAAAA;MACF,EAAEA,cAAAA,CAAOC,mBAAAA,CAAAA;MACT,EAAED,cAAAA,CAAOF,qBAAiB,CAAA;MAC1B,EAAEE,cAAAA,CAAOC,gBAAAA,CAAAA;MACV,EAAAD,cAAA,CAAAC,qBAAA,CAAA;;kCAEY;sBACb,CAAA,YAAA,EAAAD,cAAA,CAAAE,oBAAA,CAAA,GAAA,EAAAF,cAAA,CAAAF,gBAAA,CAAA,CAAA,CAAA;QACF;;8BAEkB;QAClBD,gBAAA;;YAGEM;kBACAC,cAAUJ,CAAAA,oBAAOE;QACnBE,UAAAJ,cAAA,CAAAE,oBAAA;IAGF;AAEA;AAME,MAAMZ,mCAASC,CAAAA;;UASbc,SAAMZ;UACRD,IAAA,CAAAc,SAAA,GAAAC,IAAAA,6BAAA,EAAAlB,yBAAAG,IAAA,EAAAF,OAAAE,IAAA,EAAAa,MAAAG,mBAAA,KAAA,WAAAlB,OAAAmB,wBAAA,EAAAJ,MAAAb,IAAA,CAAAc,SAAA;QAEAD,MAAOA,MAAAA,EAAAA;QACPA,MAAAZ,MAAA,CAAAa,SAAA,GAAAC,IAAAA,6BAAA,EAAAlB,yBAAAI,MAAA,EAAAH,OAAAG,MAAA,EAAAY,MAAAZ,MAAA,CAAAa,SAAA"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-copilot/react-suggestions",
|
|
3
|
-
"version": "0.12.2",
|
|
3
|
+
"version": "0.12.3-hotfix.2",
|
|
4
4
|
"description": "A Fluent AI package",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -12,15 +12,15 @@
|
|
|
12
12
|
},
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@fluentui-copilot/react-provider": "
|
|
16
|
-
"@fluentui-copilot/tokens": "
|
|
15
|
+
"@fluentui-copilot/react-provider": "0.11.3-hotfix.2",
|
|
16
|
+
"@fluentui-copilot/tokens": "0.3.11-hotfix.2",
|
|
17
17
|
"@swc/helpers": "^0.5.1"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
20
|
-
"@fluentui/react-components": ">=9.
|
|
20
|
+
"@fluentui/react-components": ">=9.63.0 <10.0.0",
|
|
21
21
|
"@fluentui/react-context-selector": ">=9.1.76 <10.0.0",
|
|
22
22
|
"@fluentui/react-icons": ">=2.0.260 <3.0.0",
|
|
23
|
-
"@fluentui/react-jsx-runtime": ">=9.0.
|
|
23
|
+
"@fluentui/react-jsx-runtime": ">=9.0.54 <10.0.0",
|
|
24
24
|
"@fluentui/react-shared-contexts": ">=9.23.1 <10.0.0",
|
|
25
25
|
"@fluentui/react-utilities": ">=9.19.0 <10.0.0",
|
|
26
26
|
"@types/react": ">=16.14.0 <19.0.0",
|
|
@@ -28,11 +28,7 @@
|
|
|
28
28
|
"react": ">=16.14.0 <19.0.0",
|
|
29
29
|
"react-dom": ">=16.14.0 <19.0.0"
|
|
30
30
|
},
|
|
31
|
-
"beachball": {
|
|
32
|
-
"disallowedChangeTypes": [
|
|
33
|
-
"major"
|
|
34
|
-
]
|
|
35
|
-
},
|
|
31
|
+
"beachball": {},
|
|
36
32
|
"exports": {
|
|
37
33
|
".": {
|
|
38
34
|
"types": "./dist/index.d.ts",
|