@fluentui-copilot/react-suggestions 0.0.0-nightly-20251010-0406-7df7c6d1.1 → 0.0.0-nightly-20251014-0405-d8d3e89c.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 +30 -3
- package/CHANGELOG.md +15 -4
- package/dist/index.d.ts +78 -0
- package/lib/Suggestion.js +1 -0
- package/lib/Suggestion.js.map +1 -0
- package/lib/SuggestionList.js +1 -0
- package/lib/SuggestionList.js.map +1 -0
- package/lib/components/Suggestion/Suggestion.js +16 -0
- package/lib/components/Suggestion/Suggestion.js.map +1 -0
- package/lib/components/Suggestion/Suggestion.types.js +1 -0
- package/lib/components/Suggestion/Suggestion.types.js.map +1 -0
- package/lib/components/Suggestion/index.js +3 -0
- package/lib/components/Suggestion/index.js.map +1 -0
- package/lib/components/Suggestion/useSuggestion.js +12 -0
- package/lib/components/Suggestion/useSuggestion.js.map +1 -0
- package/lib/components/Suggestion/useSuggestionStyles.styles.js +162 -0
- package/lib/components/Suggestion/useSuggestionStyles.styles.js.map +1 -0
- package/lib/components/Suggestion/useSuggestionStyles.styles.raw.js +69 -0
- package/lib/components/Suggestion/useSuggestionStyles.styles.raw.js.map +1 -0
- package/lib/components/SuggestionList/SuggestionList.js +13 -0
- package/lib/components/SuggestionList/SuggestionList.js.map +1 -0
- package/lib/components/SuggestionList/SuggestionList.types.js +3 -0
- package/lib/components/SuggestionList/SuggestionList.types.js.map +1 -0
- package/lib/components/SuggestionList/index.js +4 -0
- package/lib/components/SuggestionList/index.js.map +1 -0
- package/lib/components/SuggestionList/renderSuggestionList.js +13 -0
- package/lib/components/SuggestionList/renderSuggestionList.js.map +1 -0
- package/lib/components/SuggestionList/useSuggestionList.js +35 -0
- package/lib/components/SuggestionList/useSuggestionList.js.map +1 -0
- package/lib/components/SuggestionList/useSuggestionListStyles.styles.js +54 -0
- package/lib/components/SuggestionList/useSuggestionListStyles.styles.js.map +1 -0
- package/lib/components/SuggestionList/useSuggestionListStyles.styles.raw.js +43 -0
- package/lib/components/SuggestionList/useSuggestionListStyles.styles.raw.js.map +1 -0
- package/lib/index.js +2 -0
- package/lib/index.js.map +1 -0
- package/lib-commonjs/Suggestion.js +25 -0
- package/lib-commonjs/Suggestion.js.map +1 -0
- package/lib-commonjs/SuggestionList.js +28 -0
- package/lib-commonjs/SuggestionList.js.map +1 -0
- package/lib-commonjs/components/Suggestion/Suggestion.js +26 -0
- package/lib-commonjs/components/Suggestion/Suggestion.js.map +1 -0
- package/lib-commonjs/components/Suggestion/Suggestion.types.js +4 -0
- package/lib-commonjs/components/Suggestion/Suggestion.types.js.map +1 -0
- package/lib-commonjs/components/Suggestion/index.js +27 -0
- package/lib-commonjs/components/Suggestion/index.js.map +1 -0
- package/lib-commonjs/components/Suggestion/useSuggestion.js +22 -0
- package/lib-commonjs/components/Suggestion/useSuggestion.js.map +1 -0
- package/lib-commonjs/components/Suggestion/useSuggestionStyles.styles.js +366 -0
- package/lib-commonjs/components/Suggestion/useSuggestionStyles.styles.js.map +1 -0
- package/lib-commonjs/components/Suggestion/useSuggestionStyles.styles.raw.js +87 -0
- package/lib-commonjs/components/Suggestion/useSuggestionStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/SuggestionList/SuggestionList.js +23 -0
- package/lib-commonjs/components/SuggestionList/SuggestionList.js.map +1 -0
- package/lib-commonjs/components/SuggestionList/SuggestionList.types.js +6 -0
- package/lib-commonjs/components/SuggestionList/SuggestionList.types.js.map +1 -0
- package/lib-commonjs/components/SuggestionList/index.js +31 -0
- package/lib-commonjs/components/SuggestionList/index.js.map +1 -0
- package/lib-commonjs/components/SuggestionList/renderSuggestionList.js +21 -0
- package/lib-commonjs/components/SuggestionList/renderSuggestionList.js.map +1 -0
- package/lib-commonjs/components/SuggestionList/useSuggestionList.js +36 -0
- package/lib-commonjs/components/SuggestionList/useSuggestionList.js.map +1 -0
- package/lib-commonjs/components/SuggestionList/useSuggestionListStyles.styles.js +88 -0
- package/lib-commonjs/components/SuggestionList/useSuggestionListStyles.styles.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/lib-commonjs/index.js +41 -0
- package/lib-commonjs/index.js.map +1 -0
- package/package.json +3 -3
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useSuggestionStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@fluentui/react-components';\nimport { tokens, typographyStyles } 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 ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n backgroundColor: tokens.colorSubtleBackground,\n },\n enabled: {\n '@media (forced-colors: none)': {\n ':hover': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover,\n },\n ':active:hover': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n color: tokens.colorNeutralForeground2Pressed,\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n },\n },\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 designVersion === 'next' && !state.disabled && nextStyles.enabled,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["suggestionClassNames","root","icon","useSuggestionStyles","makeStyles","typographyStyles","shorthands","borderRadius","padding","color","colorNeutralForeground2","textAlign","ibv6hh","enabled","tokens","colorBrandForeground2Hover","z8tnut","canvas","B9di4we","useNextStyles","paddingHorizontal","paddingVertical","spacingVerticalSNudge","fontSize","backgroundColor","Bptf8dt","B0ocmuz","state","p"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,oBAAAA;eAAAA;;;;;;iCALgC;AAKtC,MAAMA,uBAAoD;UAC/DC;UACAC;AACF;AAEA,MAAMC,sBAAsBC,IAAAA,yBAAAA,EAAAA;UAC1BH;iBACKI;iBACH;iBACGC;iBACHC;iBACAC;iBACAC;YAAAA;YAAcC;SAAAA;iBACdC;QAGFC,QAAA;YAAA;YAAA;SAAA;QACAC,QAAAA;gBACE;YAAA;YAAA;SAAA;gBACE;;;YACE;SAAkB;;;;YAEXC;SAAOC;;gBAEhB;YAAA;YAAA;SAAA;iBACA;iBACA;;;;;gBAKA;gBACF;QACFC,QAAA;QACAC,SAAQ;gBACHZ;gBACHG;;IAEJK,SAAA;QAEAK,SAAMC;QACJlB,SAAM;YAAA;YAAA;SAAA;eACJmB;iBACAC;YAAAA;YAAiBP;SAAOQ;gBACxBC;iBACGjB;gBACHkB;QACFC,SAAA;YAAA;YAAA;SAAA;QACAZ,OAAAA;gBACE;YAAA;YAAA;SAAA;gBACE;;;;iBAIA;iBACA;;;;gBAIA;gBACF;QACFG,QAAA;QACFU,SAAA;IAEA;;OAGE;QAAA;QAAgCC;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;QAAAA;YAAAA;YAAAA;gBAEhCC,GAAA,CAAA;;SACA;QAAA;YAAA;YAAmBT;gBACnBQ,GAAAA,CAAAA;;SAUA;QAAA;QAAOA;QAAAA;QAAAA;QAAAA;YAAAA;YAAAA;gBACPC,GAAA,CAAA"}
|
|
@@ -0,0 +1,87 @@
|
|
|
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
|
+
..._tokens.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
|
+
..._tokens.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
|
+
..._reactcomponents.shorthands.border(_tokens.tokens.strokeWidthThin, 'solid', _tokens.tokens.colorNeutralStroke2),
|
|
63
|
+
backgroundColor: _tokens.tokens.colorSubtleBackground
|
|
64
|
+
},
|
|
65
|
+
enabled: {
|
|
66
|
+
'@media (forced-colors: none)': {
|
|
67
|
+
':hover': {
|
|
68
|
+
..._reactcomponents.shorthands.borderColor(_tokens.tokens.colorNeutralStroke2),
|
|
69
|
+
color: _tokens.tokens.colorNeutralForeground2Hover,
|
|
70
|
+
backgroundColor: _tokens.tokens.colorSubtleBackgroundHover
|
|
71
|
+
},
|
|
72
|
+
':active:hover': {
|
|
73
|
+
..._reactcomponents.shorthands.borderColor(_tokens.tokens.colorNeutralStroke2),
|
|
74
|
+
color: _tokens.tokens.colorNeutralForeground2Pressed,
|
|
75
|
+
backgroundColor: _tokens.tokens.colorSubtleBackgroundPressed
|
|
76
|
+
}
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
});
|
|
80
|
+
const useSuggestionStyles_unstable = (state)=>{
|
|
81
|
+
'use no memo';
|
|
82
|
+
const { designVersion, mode } = state;
|
|
83
|
+
const styles = useSuggestionStyles();
|
|
84
|
+
const nextStyles = useNextStyles();
|
|
85
|
+
state.root.className = (0, _reactcomponents.mergeClasses)(suggestionClassNames.root, styles.root, mode === 'canvas' && styles.canvas, designVersion === 'next' && nextStyles.root, !state.disabled && styles.enabled, designVersion === 'next' && !state.disabled && nextStyles.enabled, state.root.className);
|
|
86
|
+
return state;
|
|
87
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useSuggestionStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@fluentui/react-components';\nimport { tokens, typographyStyles } 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 ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n backgroundColor: tokens.colorSubtleBackground,\n },\n enabled: {\n '@media (forced-colors: none)': {\n ':hover': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n color: tokens.colorNeutralForeground2Hover,\n backgroundColor: tokens.colorSubtleBackgroundHover,\n },\n ':active:hover': {\n ...shorthands.borderColor(tokens.colorNeutralStroke2),\n color: tokens.colorNeutralForeground2Pressed,\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n },\n },\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 designVersion === 'next' && !state.disabled && nextStyles.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","strokeWidthThin","colorNeutralStroke2","colorSubtleBackground","colorNeutralForeground2Hover","colorSubtleBackgroundHover","colorNeutralForeground2Pressed","colorSubtleBackgroundPressed","state","designVersion","mode","styles","nextStyles","className","mergeClasses","disabled"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,oBAAAA;eAAAA;;IAgEAC,4BAAAA;eAAAA;;;iCArEwC;wBACZ;AAIlC,MAAMD,uBAAoD;IAC/DE,MAAM;IACNC,MAAM;AACR;AAEA,MAAMC,sBAAsBC,IAAAA,2BAAAA,EAAW;IACrCH,MAAM;QACJ,GAAGI,wBAAAA,CAAiBC,QAAQ;QAC5B,kBAAkB;QAClB,GAAGC,2BAAAA,CAAWC,MAAM,CAAC,OAAO,SAASC,cAAAA,CAAOC,iBAAiB,CAAC;QAC9DC,cAAcF,cAAAA,CAAOG,kBAAkB;QACvCC,SAAS,CAAC,EAAEJ,cAAAA,CAAOK,iBAAiB,CAAC,CAAC,EAAEL,cAAAA,CAAOM,gBAAgB,CAAC,CAAC;QACjEC,OAAOP,cAAAA,CAAOQ,uBAAuB;QACrCC,WAAW;IAGb;IACAC,SAAS;QACP,gCAAgC;YAC9B,UAAU;gBACR,kBAAkB;gBAClB,GAAGZ,2BAAAA,CAAWa,WAAW,CAACX,cAAAA,CAAOY,sBAAsB,CAAC;gBACxDL,OAAOP,cAAAA,CAAOa,0BAA0B;gBACxCC,iBAAiBd,cAAAA,CAAOe,0BAA0B;YACpD;YACA,4CAA4C;YAC5C,iBAAiB;gBACf,kBAAkB;gBAClB,GAAGjB,2BAAAA,CAAWa,WAAW,CAACX,cAAAA,CAAOgB,wBAAwB,CAAC;gBAC1DT,OAAOP,cAAAA,CAAOiB,4BAA4B;gBAC1CH,iBAAiBd,cAAAA,CAAOkB,4BAA4B;YACtD;QACF;IACF;IACAC,QAAQ;QACN,GAAGvB,wBAAAA,CAAiBwB,KAAK;QACzBhB,SAAS,CAAC,EAAEJ,cAAAA,CAAOqB,qBAAqB,CAAC,CAAC,EAAErB,cAAAA,CAAOsB,kBAAkB,CAAC,CAAC;IACzE;AACF;AAEA,MAAMC,gBAAgB5B,IAAAA,2BAAAA,EAAW;IAC/BH,MAAM;QACJgC,mBAAmBxB,cAAAA,CAAOsB,kBAAkB;QAC5CG,iBAAiBzB,cAAAA,CAAOqB,qBAAqB;QAC7CK,UAAU1B,cAAAA,CAAO2B,eAAe;QAChC,GAAG7B,2BAAAA,CAAWC,MAAM,CAACC,cAAAA,CAAO4B,eAAe,EAAE,SAAS5B,cAAAA,CAAO6B,mBAAmB,CAAC;QACjFf,iBAAiBd,cAAAA,CAAO8B,qBAAqB;IAC/C;IACApB,SAAS;QACP,gCAAgC;YAC9B,UAAU;gBACR,GAAGZ,2BAAAA,CAAWa,WAAW,CAACX,cAAAA,CAAO6B,mBAAmB,CAAC;gBACrDtB,OAAOP,cAAAA,CAAO+B,4BAA4B;gBAC1CjB,iBAAiBd,cAAAA,CAAOgC,0BAA0B;YACpD;YACA,iBAAiB;gBACf,GAAGlC,2BAAAA,CAAWa,WAAW,CAACX,cAAAA,CAAO6B,mBAAmB,CAAC;gBACrDtB,OAAOP,cAAAA,CAAOiC,8BAA8B;gBAC5CnB,iBAAiBd,cAAAA,CAAOkC,4BAA4B;YACtD;QACF;IACF;AACF;AAEO,MAAM3C,+BAA+B,CAAC4C;IAC3C;IAEA,MAAM,EAAEC,aAAa,EAAEC,IAAI,EAAE,GAAGF;IAEhC,MAAMG,SAAS5C;IACf,MAAM6C,aAAahB;IACnBY,MAAM3C,IAAI,CAACgD,SAAS,GAAGC,IAAAA,6BAAAA,EACrBnD,qBAAqBE,IAAI,EACzB8C,OAAO9C,IAAI,EACX6C,SAAS,YAAYC,OAAOnB,MAAM,EAClCiB,kBAAkB,UAAUG,WAAW/C,IAAI,EAC3C,CAAC2C,MAAMO,QAAQ,IAAIJ,OAAO5B,OAAO,EACjC0B,kBAAkB,UAAU,CAACD,MAAMO,QAAQ,IAAIH,WAAW7B,OAAO,EACjEyB,MAAM3C,IAAI,CAACgD,SAAS;IAGtB,OAAOL;AACT"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "SuggestionList", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return SuggestionList;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
12
|
+
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
|
+
const _useSuggestionList = require("./useSuggestionList");
|
|
14
|
+
const _renderSuggestionList = require("./renderSuggestionList");
|
|
15
|
+
const _useSuggestionListStylesstyles = require("./useSuggestionListStyles.styles");
|
|
16
|
+
const _reactprovider = require("@fluentui-copilot/react-provider");
|
|
17
|
+
const SuggestionList = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
18
|
+
const state = (0, _useSuggestionList.useSuggestionList_unstable)(props, ref);
|
|
19
|
+
(0, _useSuggestionListStylesstyles.useSuggestionListStyles_unstable)(state);
|
|
20
|
+
(0, _reactprovider.useCustomStyleHook)('useSuggestionListStyles')(state);
|
|
21
|
+
return (0, _renderSuggestionList.renderSuggestionList_unstable)(state);
|
|
22
|
+
});
|
|
23
|
+
SuggestionList.displayName = 'SuggestionList';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["SuggestionList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSuggestionList_unstable } from './useSuggestionList';\nimport { renderSuggestionList_unstable } from './renderSuggestionList';\nimport { useSuggestionListStyles_unstable } from './useSuggestionListStyles.styles';\nimport type { SuggestionListProps } from './SuggestionList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n// SuggestionList component - TODO: add more docs\nexport const SuggestionList: ForwardRefComponent<SuggestionListProps> = React.forwardRef((props, ref) => {\n const state = useSuggestionList_unstable(props, ref);\n\n useSuggestionListStyles_unstable(state);\n useCustomStyleHook('useSuggestionListStyles')(state);\n\n return renderSuggestionList_unstable(state);\n});\n\nSuggestionList.displayName = 'SuggestionList';\n"],"names":["SuggestionList","React","forwardRef","props","ref","state","useSuggestionList_unstable","useSuggestionListStyles_unstable","useCustomStyleHook","renderSuggestionList_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;mCACoB;sCACG;+CACG;+BAGd;AAG5B,MAAMA,iBAAAA,WAAAA,GAA2DC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC/F,MAAMC,QAAQC,IAAAA,6CAAAA,EAA2BH,OAAOC;IAEhDG,IAAAA,+DAAAA,EAAiCF;IACjCG,IAAAA,iCAAAA,EAAmB,2BAA2BH;IAE9C,OAAOI,IAAAA,mDAAAA,EAA8BJ;AACvC;AAEAL,eAAeU,WAAW,GAAG"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["SuggestionList.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot, TooltipProps } from '@fluentui/react-components';\n\nexport type TooltipComponent = React.FunctionComponent<Partial<TooltipProps>>;\n\nexport type SuggestionListSlots = {\n root: Slot<'div'>;\n action?: Slot<'span'>;\n};\n\n/**\n * SuggestionList Props\n */\nexport type SuggestionListProps = ComponentProps<SuggestionListSlots> & {\n /**\n * The horizontal alignment of the SuggestionsList.\n * @default 'end'\n */\n horizontalAlignment?: 'start' | 'end';\n};\n\n/**\n * State used in rendering SuggestionList\n */\nexport type SuggestionListState = ComponentState<SuggestionListSlots> &\n Required<Pick<SuggestionListProps, 'horizontalAlignment'>>;\n"],"names":[],"rangeMappings":";;","mappings":"AAoBA;;CAEC"}
|
|
@@ -0,0 +1,31 @@
|
|
|
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
|
+
SuggestionList: function() {
|
|
13
|
+
return _SuggestionList.SuggestionList;
|
|
14
|
+
},
|
|
15
|
+
renderSuggestionList_unstable: function() {
|
|
16
|
+
return _renderSuggestionList.renderSuggestionList_unstable;
|
|
17
|
+
},
|
|
18
|
+
suggestionListClassNames: function() {
|
|
19
|
+
return _useSuggestionListStylesstyles.suggestionListClassNames;
|
|
20
|
+
},
|
|
21
|
+
useSuggestionListStyles_unstable: function() {
|
|
22
|
+
return _useSuggestionListStylesstyles.useSuggestionListStyles_unstable;
|
|
23
|
+
},
|
|
24
|
+
useSuggestionList_unstable: function() {
|
|
25
|
+
return _useSuggestionList.useSuggestionList_unstable;
|
|
26
|
+
}
|
|
27
|
+
});
|
|
28
|
+
const _SuggestionList = require("./SuggestionList");
|
|
29
|
+
const _renderSuggestionList = require("./renderSuggestionList");
|
|
30
|
+
const _useSuggestionList = require("./useSuggestionList");
|
|
31
|
+
const _useSuggestionListStylesstyles = require("./useSuggestionListStyles.styles");
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export { SuggestionList } from './SuggestionList';\nexport type { SuggestionListProps, SuggestionListSlots, SuggestionListState, TooltipComponent } from './SuggestionList.types';\nexport { renderSuggestionList_unstable } from './renderSuggestionList';\nexport { useSuggestionList_unstable } from './useSuggestionList';\nexport { suggestionListClassNames, useSuggestionListStyles_unstable } from './useSuggestionListStyles.styles';\n"],"names":["SuggestionList","renderSuggestionList_unstable","suggestionListClassNames","useSuggestionListStyles_unstable","useSuggestionList_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,cAAc;eAAdA,8BAAc;;IAEdC,6BAA6B;eAA7BA,mDAA6B;;IAE7BC,wBAAwB;eAAxBA,uDAAwB;;IAAEC,gCAAgC;eAAhCA,+DAAgC;;IAD1DC,0BAA0B;eAA1BA,6CAA0B;;;gCAHJ;sCAEe;mCACH;+CACgC"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "renderSuggestionList_unstable", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return renderSuggestionList_unstable;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
|
|
12
|
+
const _reactcomponents = require("@fluentui/react-components");
|
|
13
|
+
const renderSuggestionList_unstable = (state)=>{
|
|
14
|
+
(0, _reactcomponents.assertSlots)(state);
|
|
15
|
+
return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
|
|
16
|
+
children: [
|
|
17
|
+
state.root.children,
|
|
18
|
+
state.action && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.action, {})
|
|
19
|
+
]
|
|
20
|
+
});
|
|
21
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["renderSuggestionList.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { JSXElement } from '@fluentui/react-components';\nimport type { SuggestionListState, SuggestionListSlots } from './SuggestionList.types';\n\n/**\n * Render the final JSX of SuggestionList\n */\nexport const renderSuggestionList_unstable = (state: SuggestionListState): JSXElement => {\n assertSlots<SuggestionListSlots>(state);\n\n return (\n <state.root>\n {state.root.children}\n {state.action && <state.action />}\n </state.root>\n );\n};\n"],"names":["renderSuggestionList_unstable","state","assertSlots","_jsxs","root","children","action","_jsx"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUaA;;;eAAAA;;;4BATb;iCAE4B;AAOrB,MAAMA,gCAAgC,CAACC;IAC5CC,IAAAA,4BAAAA,EAAiCD;IAEjC,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACF,MAAMG,IAAI,EAAA;;YACRH,MAAMG,IAAI,CAACC,QAAQ;YACnBJ,MAAMK,MAAM,IAAA,WAAA,GAAIC,IAAAA,eAAA,EAACN,MAAMK,MAAM,EAAA,CAAA;;;AAGpC"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
Object.defineProperty(exports, "useSuggestionList_unstable", {
|
|
6
|
+
enumerable: true,
|
|
7
|
+
get: function() {
|
|
8
|
+
return useSuggestionList_unstable;
|
|
9
|
+
}
|
|
10
|
+
});
|
|
11
|
+
const _reactcomponents = require("@fluentui/react-components");
|
|
12
|
+
const useSuggestionList_unstable = (props, ref)=>{
|
|
13
|
+
const { action, horizontalAlignment = 'end' } = props;
|
|
14
|
+
return {
|
|
15
|
+
horizontalAlignment,
|
|
16
|
+
components: {
|
|
17
|
+
root: 'div',
|
|
18
|
+
action: 'span'
|
|
19
|
+
},
|
|
20
|
+
root: _reactcomponents.slot.always((0, _reactcomponents.getIntrinsicElementProps)('div', {
|
|
21
|
+
ref,
|
|
22
|
+
role: 'toolbar',
|
|
23
|
+
'aria-label': 'suggestions',
|
|
24
|
+
...props,
|
|
25
|
+
...(0, _reactcomponents.useArrowNavigationGroup)({
|
|
26
|
+
axis: 'both',
|
|
27
|
+
circular: true
|
|
28
|
+
})
|
|
29
|
+
}), {
|
|
30
|
+
elementType: 'div'
|
|
31
|
+
}),
|
|
32
|
+
action: _reactcomponents.slot.optional(action, {
|
|
33
|
+
elementType: 'span'
|
|
34
|
+
})
|
|
35
|
+
};
|
|
36
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useSuggestionList.tsx"],"sourcesContent":["import { getIntrinsicElementProps, slot, useArrowNavigationGroup } from '@fluentui/react-components';\nimport type { SuggestionListProps, SuggestionListState } from './SuggestionList.types';\n\n// If you add JSX to this file, be sure to change the file type to .tsx\n\n/**\n * Create the state required to render SuggestionList.\n *\n * The returned state can be modified with hooks such as useSuggestionListStyles_unstable,\n * before being passed to renderSuggestionList_unstable.\n *\n * @param props - props from this instance of SuggestionList\n * @param ref - reference to root HTMLElement of SuggestionList\n */\nexport const useSuggestionList_unstable = (\n props: SuggestionListProps,\n ref: React.Ref<HTMLDivElement>,\n): SuggestionListState => {\n const { action, horizontalAlignment = 'end' } = props;\n return {\n horizontalAlignment,\n components: {\n root: 'div',\n action: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role: 'toolbar',\n 'aria-label': 'suggestions',\n ...props,\n ...useArrowNavigationGroup({ axis: 'both', circular: true }),\n }),\n { elementType: 'div' },\n ),\n action: slot.optional(action, { elementType: 'span' }),\n };\n};\n"],"names":["useSuggestionList_unstable","props","ref","action","horizontalAlignment","components","root","slot","always","getIntrinsicElementProps","role","useArrowNavigationGroup","axis","circular","elementType","optional"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAcaA;;;eAAAA;;;iCAd2D;AAcjE,MAAMA,6BAA6B,CACxCC,OACAC;IAEA,MAAM,EAAEC,MAAM,EAAEC,sBAAsB,KAAK,EAAE,GAAGH;IAChD,OAAO;QACLG;QACAC,YAAY;YACVC,MAAM;YACNH,QAAQ;QACV;QACAG,MAAMC,qBAAAA,CAAKC,MAAM,CACfC,IAAAA,yCAAAA,EAAyB,OAAO;YAC9BP;YACAQ,MAAM;YACN,cAAc;YACd,GAAGT,KAAK;YACR,GAAGU,IAAAA,wCAAAA,EAAwB;gBAAEC,MAAM;gBAAQC,UAAU;YAAK,EAAE;QAC9D,IACA;YAAEC,aAAa;QAAM;QAEvBX,QAAQI,qBAAAA,CAAKQ,QAAQ,CAACZ,QAAQ;YAAEW,aAAa;QAAO;IACtD;AACF"}
|
|
@@ -0,0 +1,88 @@
|
|
|
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 suggestionListClassNames = {
|
|
21
|
+
root: 'fai-SuggestionList',
|
|
22
|
+
action: 'fai-SuggestionList__action'
|
|
23
|
+
};
|
|
24
|
+
/**
|
|
25
|
+
* Styles for the root slot
|
|
26
|
+
*/ const useStyles = (0, _reactcomponents.__styles)({
|
|
27
|
+
root: {
|
|
28
|
+
mc9l5x: "f22iagw",
|
|
29
|
+
Eh141a: "fni485r",
|
|
30
|
+
Brf1p80: "f9c4gz4",
|
|
31
|
+
i8kkvl: 0,
|
|
32
|
+
Belr9w4: 0,
|
|
33
|
+
rmohyg: "f1yhwmi5",
|
|
34
|
+
jrapky: 0,
|
|
35
|
+
Frg6f3: 0,
|
|
36
|
+
t21cq0: 0,
|
|
37
|
+
B6of3ja: 0,
|
|
38
|
+
B74szlk: [
|
|
39
|
+
"f4bgq6r",
|
|
40
|
+
"f83tq75"
|
|
41
|
+
],
|
|
42
|
+
Beptln2: "fr3gje9"
|
|
43
|
+
},
|
|
44
|
+
horizontalAlignmentStart: {
|
|
45
|
+
Brf1p80: "fbhxue7"
|
|
46
|
+
},
|
|
47
|
+
action: {
|
|
48
|
+
Bf4jedk: "f79feoa",
|
|
49
|
+
B2u0y6b: "f1cs043"
|
|
50
|
+
}
|
|
51
|
+
}, {
|
|
52
|
+
d: [
|
|
53
|
+
".f22iagw{display:flex;}",
|
|
54
|
+
".fni485r{flex-wrap:wrap;}",
|
|
55
|
+
".f9c4gz4{justify-content:flex-end;}",
|
|
56
|
+
[
|
|
57
|
+
".f1yhwmi5{gap:var(--spacingVerticalS);}",
|
|
58
|
+
{
|
|
59
|
+
p: -1
|
|
60
|
+
}
|
|
61
|
+
],
|
|
62
|
+
[
|
|
63
|
+
".f4bgq6r{margin:var(--spacingVerticalNone) var(--spacingHorizontalNone) var(--spacingVerticalS) var(--spacingHorizontalNone);}",
|
|
64
|
+
{
|
|
65
|
+
p: -1
|
|
66
|
+
}
|
|
67
|
+
],
|
|
68
|
+
[
|
|
69
|
+
".f83tq75{margin:var(--spacingVerticalNone) var(--spacingHorizontalNone) var(--spacingVerticalS) var(--spacingHorizontalNone);}",
|
|
70
|
+
{
|
|
71
|
+
p: -1
|
|
72
|
+
}
|
|
73
|
+
],
|
|
74
|
+
".fr3gje9>:nth-last-of-type(2){max-width:calc(100% - var(--spacingHorizontalXXL) - var(--spacingVerticalS));}",
|
|
75
|
+
".fbhxue7{justify-content:flex-start;}",
|
|
76
|
+
".f79feoa{min-width:var(--spacingHorizontalXXL);}",
|
|
77
|
+
".f1cs043{max-width:var(--spacingHorizontalXXL);}"
|
|
78
|
+
]
|
|
79
|
+
});
|
|
80
|
+
const useSuggestionListStyles_unstable = (state)=>{
|
|
81
|
+
'use no memo';
|
|
82
|
+
const styles = useStyles();
|
|
83
|
+
state.root.className = (0, _reactcomponents.mergeClasses)(suggestionListClassNames.root, styles.root, state.horizontalAlignment === 'start' && styles.horizontalAlignmentStart, state.root.className);
|
|
84
|
+
if (state.action) {
|
|
85
|
+
state.action.className = (0, _reactcomponents.mergeClasses)(suggestionListClassNames.action, styles.action, state.action.className);
|
|
86
|
+
}
|
|
87
|
+
return state;
|
|
88
|
+
}; //# sourceMappingURL=useSuggestionListStyles.styles.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","root","action","__styles","display","flexWrap","justifyContent","tokens","margin","t21cq0","maxWidth","horizontalAlignmentStart","minWidth","d","state","p","useStyles"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,wBAAAA;eAAAA;;;;;;iCALoB;AAK1B,MAAMA,2BAAgE;UAC3EC;YACAC;AACF;AAEA;;CAEC,SAECD,YAAME,IAAAA,yBAAA,EAAA;UACJC;gBACAC;gBACAC;iBACKC;gBACLC;iBACID;gBACAA;gBACAA;gBACAA;QACJE,QAAC;iBACD;iBACEC;YAAAA;YAAW;SAAY;iBACzB;;8BAEFC;iBACEL;;YAGFJ;iBACEU;iBACAF;;AAIJ,GAAA;IAEAG,GAAA;QAAA;QAAA;QAAA;QAAA;YAAA;YAAA;;YAEC;SACD;QAAA;YAAA;YAAiDC;gBAC/CC,GAAA,CAAA;;SAEA;QAAA;YAAA;YAAeC;gBACfF,GAAAA,CAAAA;;SAOA;QAAA;QAAkB;QAAA;QAAA;KAAA"}
|
|
@@ -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
|
+
};
|
|
@@ -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","useSuggestionListStyles_unstable","root","action","useStyles","makeStyles","display","flexWrap","justifyContent","gap","tokens","spacingVerticalS","margin","spacingVerticalNone","spacingHorizontalNone","maxWidth","spacingHorizontalXXL","horizontalAlignmentStart","minWidth","state","styles","className","mergeClasses","horizontalAlignment"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAKaA,wBAAAA;eAAAA;;IAuCAC,gCAAAA;eAAAA;;;iCA5C4B;wBAClB;AAIhB,MAAMD,2BAAgE;IAC3EE,MAAM;IACNC,QAAQ;AACV;AAEA;;CAEC,GACD,MAAMC,YAAYC,IAAAA,2BAAAA,EAAW;IAC3BH,MAAM;QACJI,SAAS;QACTC,UAAU;QACVC,gBAAgB;QAChBC,KAAKC,cAAAA,CAAOC,gBAAgB;QAC5BC,QAAQ,CAAC;MACP,EAAEF,cAAAA,CAAOG,mBAAmB,CAAC;MAC7B,EAAEH,cAAAA,CAAOI,qBAAqB,CAAC;MAC/B,EAAEJ,cAAAA,CAAOC,gBAAgB,CAAC;MAC1B,EAAED,cAAAA,CAAOI,qBAAqB,CAAC;IACjC,CAAC;QACD,0BAA0B;YACxBC,UAAU,CAAC,YAAY,EAAEL,cAAAA,CAAOM,oBAAoB,CAAC,GAAG,EAAEN,cAAAA,CAAOC,gBAAgB,CAAC,CAAC,CAAC;QACtF;IACF;IACAM,0BAA0B;QACxBT,gBAAgB;IAClB;IAEAL,QAAQ;QACNe,UAAUR,cAAAA,CAAOM,oBAAoB;QACrCD,UAAUL,cAAAA,CAAOM,oBAAoB;IACvC;AAGF;AAKO,MAAMf,mCAAmC,CAACkB;IAC/C;IAEA,MAAMC,SAAShB;IACfe,MAAMjB,IAAI,CAACmB,SAAS,GAAGC,IAAAA,6BAAAA,EACrBtB,yBAAyBE,IAAI,EAC7BkB,OAAOlB,IAAI,EACXiB,MAAMI,mBAAmB,KAAK,WAAWH,OAAOH,wBAAwB,EACxEE,MAAMjB,IAAI,CAACmB,SAAS;IAGtB,IAAIF,MAAMhB,MAAM,EAAE;QAChBgB,MAAMhB,MAAM,CAACkB,SAAS,GAAGC,IAAAA,6BAAAA,EAAatB,yBAAyBG,MAAM,EAAEiB,OAAOjB,MAAM,EAAEgB,MAAMhB,MAAM,CAACkB,SAAS;IAC9G;IAEA,OAAOF;AACT"}
|
|
@@ -0,0 +1,41 @@
|
|
|
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
|
+
Suggestion: function() {
|
|
13
|
+
return _Suggestion.Suggestion;
|
|
14
|
+
},
|
|
15
|
+
SuggestionList: function() {
|
|
16
|
+
return _SuggestionList.SuggestionList;
|
|
17
|
+
},
|
|
18
|
+
renderSuggestionList_unstable: function() {
|
|
19
|
+
return _SuggestionList.renderSuggestionList_unstable;
|
|
20
|
+
},
|
|
21
|
+
suggestionClassNames: function() {
|
|
22
|
+
return _Suggestion.suggestionClassNames;
|
|
23
|
+
},
|
|
24
|
+
suggestionListClassNames: function() {
|
|
25
|
+
return _SuggestionList.suggestionListClassNames;
|
|
26
|
+
},
|
|
27
|
+
useSuggestionListStyles_unstable: function() {
|
|
28
|
+
return _SuggestionList.useSuggestionListStyles_unstable;
|
|
29
|
+
},
|
|
30
|
+
useSuggestionList_unstable: function() {
|
|
31
|
+
return _SuggestionList.useSuggestionList_unstable;
|
|
32
|
+
},
|
|
33
|
+
useSuggestionStyles_unstable: function() {
|
|
34
|
+
return _Suggestion.useSuggestionStyles_unstable;
|
|
35
|
+
},
|
|
36
|
+
useSuggestion_unstable: function() {
|
|
37
|
+
return _Suggestion.useSuggestion_unstable;
|
|
38
|
+
}
|
|
39
|
+
});
|
|
40
|
+
const _Suggestion = require("./Suggestion");
|
|
41
|
+
const _SuggestionList = require("./SuggestionList");
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export type { SuggestionProps, SuggestionSlots, SuggestionState } from './Suggestion';\nexport { Suggestion, suggestionClassNames, useSuggestionStyles_unstable, useSuggestion_unstable } from './Suggestion';\nexport type { SuggestionListProps, SuggestionListSlots, SuggestionListState, TooltipComponent } from './SuggestionList';\nexport {\n SuggestionList,\n renderSuggestionList_unstable,\n suggestionListClassNames,\n useSuggestionListStyles_unstable,\n useSuggestionList_unstable,\n} from './SuggestionList';\n"],"names":["Suggestion","SuggestionList","renderSuggestionList_unstable","suggestionClassNames","suggestionListClassNames","useSuggestionListStyles_unstable","useSuggestionList_unstable","useSuggestionStyles_unstable","useSuggestion_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IACSA,UAAU;eAAVA,sBAAU;;IAGjBC,cAAc;eAAdA,8BAAc;;IACdC,6BAA6B;eAA7BA,6CAA6B;;IAJVC,oBAAoB;eAApBA,gCAAoB;;IAKvCC,wBAAwB;eAAxBA,wCAAwB;;IACxBC,gCAAgC;eAAhCA,gDAAgC;;IAChCC,0BAA0B;eAA1BA,0CAA0B;;IAPeC,4BAA4B;eAA5BA,wCAA4B;;IAAEC,sBAAsB;eAAtBA,kCAAsB;;;4BAAQ;gCAQhG"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui-copilot/react-suggestions",
|
|
3
|
-
"version": "0.0.0-nightly-
|
|
3
|
+
"version": "0.0.0-nightly-20251014-0405-d8d3e89c.1",
|
|
4
4
|
"description": "A Fluent AI package",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -12,8 +12,8 @@
|
|
|
12
12
|
},
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@fluentui-copilot/react-provider": "0.0.0-nightly-
|
|
16
|
-
"@fluentui-copilot/tokens": "0.0.0-nightly-
|
|
15
|
+
"@fluentui-copilot/react-provider": "0.0.0-nightly-20251014-0405-d8d3e89c.1",
|
|
16
|
+
"@fluentui-copilot/tokens": "0.0.0-nightly-20251014-0405-d8d3e89c.1",
|
|
17
17
|
"@swc/helpers": "^0.5.1"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|