@fluentui-copilot/react-prompt-starter 0.10.3 → 0.10.5

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.
Files changed (24) hide show
  1. package/CHANGELOG.json +31 -1
  2. package/CHANGELOG.md +20 -2
  3. package/dist/index.d.ts +2 -2
  4. package/lib/components/PromptStarterV2/PromptStarter/PromptStarter.types.js.map +1 -1
  5. package/lib/components/PromptStarterV2/PromptStarter/renderPromptStarter.js +1 -1
  6. package/lib/components/PromptStarterV2/PromptStarter/renderPromptStarter.js.map +1 -1
  7. package/lib/components/PromptStarterV2/PromptStarter/usePromptStarter.js +8 -7
  8. package/lib/components/PromptStarterV2/PromptStarter/usePromptStarter.js.map +1 -1
  9. package/lib/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.js +81 -9
  10. package/lib/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.js.map +1 -1
  11. package/lib/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.raw.js +20 -8
  12. package/lib/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.raw.js.map +1 -1
  13. package/lib/components/PromptStarterV2/PromptStarterList/PromptStarterList.types.js.map +1 -1
  14. package/lib-commonjs/components/PromptStarterV2/PromptStarter/PromptStarter.types.js.map +1 -1
  15. package/lib-commonjs/components/PromptStarterV2/PromptStarter/renderPromptStarter.js +1 -1
  16. package/lib-commonjs/components/PromptStarterV2/PromptStarter/renderPromptStarter.js.map +1 -1
  17. package/lib-commonjs/components/PromptStarterV2/PromptStarter/usePromptStarter.js +8 -7
  18. package/lib-commonjs/components/PromptStarterV2/PromptStarter/usePromptStarter.js.map +1 -1
  19. package/lib-commonjs/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.js +145 -10
  20. package/lib-commonjs/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.js.map +1 -1
  21. package/lib-commonjs/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.raw.js +20 -8
  22. package/lib-commonjs/components/PromptStarterV2/PromptStarter/usePromptStarterStyles.styles.raw.js.map +1 -1
  23. package/lib-commonjs/components/PromptStarterV2/PromptStarterList/PromptStarterList.types.js.map +1 -1
  24. package/package.json +3 -3
package/CHANGELOG.json CHANGED
@@ -2,7 +2,37 @@
2
2
  "name": "@fluentui-copilot/react-prompt-starter",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 17 Jul 2025 17:47:34 GMT",
5
+ "date": "Wed, 27 Aug 2025 23:19:12 GMT",
6
+ "tag": "@fluentui-copilot/react-prompt-starter_v0.10.5",
7
+ "version": "0.10.5",
8
+ "comments": {
9
+ "patch": [
10
+ {
11
+ "author": "mgodbolt@microsoft.com",
12
+ "package": "@fluentui-copilot/react-prompt-starter",
13
+ "commit": "26048a5eb0b6a61f14c26ab223f9b7a2fdcb58c4",
14
+ "comment": "fix typing error where slot was required"
15
+ }
16
+ ]
17
+ }
18
+ },
19
+ {
20
+ "date": "Thu, 07 Aug 2025 18:08:38 GMT",
21
+ "tag": "@fluentui-copilot/react-prompt-starter_v0.10.4",
22
+ "version": "0.10.4",
23
+ "comments": {
24
+ "patch": [
25
+ {
26
+ "author": "jiangemma@microsoft.com",
27
+ "package": "@fluentui-copilot/react-prompt-starter",
28
+ "commit": "2259c75214cb43a528c1b731d00a4d5466a75ce2",
29
+ "comment": "fix: Update PromptStarterV2 single column appearance, make icon slot optional"
30
+ }
31
+ ]
32
+ }
33
+ },
34
+ {
35
+ "date": "Thu, 17 Jul 2025 17:49:25 GMT",
6
36
  "tag": "@fluentui-copilot/react-prompt-starter_v0.10.3",
7
37
  "version": "0.10.3",
8
38
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,30 @@
1
1
  # Change Log - @fluentui-copilot/react-prompt-starter
2
2
 
3
- This log was last generated on Thu, 17 Jul 2025 17:47:34 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 27 Aug 2025 23:19:12 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [0.10.5](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-prompt-starter_v0.10.5)
8
+
9
+ Wed, 27 Aug 2025 23:19:12 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-prompt-starter_v0.10.4..@fluentui-copilot/react-prompt-starter_v0.10.5)
11
+
12
+ ### Patches
13
+
14
+ - fix typing error where slot was required ([PR #3298](https://github.com/microsoft/fluentai/pull/3298) by mgodbolt@microsoft.com)
15
+
16
+ ## [0.10.4](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-prompt-starter_v0.10.4)
17
+
18
+ Thu, 07 Aug 2025 18:08:38 GMT
19
+ [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-prompt-starter_v0.10.3..@fluentui-copilot/react-prompt-starter_v0.10.4)
20
+
21
+ ### Patches
22
+
23
+ - fix: Update PromptStarterV2 single column appearance, make icon slot optional ([PR #3272](https://github.com/microsoft/fluentai/pull/3272) by jiangemma@microsoft.com)
24
+
7
25
  ## [0.10.3](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-prompt-starter_v0.10.3)
8
26
 
9
- Thu, 17 Jul 2025 17:47:34 GMT
27
+ Thu, 17 Jul 2025 17:49:25 GMT
10
28
  [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-prompt-starter_v0.10.2..@fluentui-copilot/react-prompt-starter_v0.10.3)
11
29
 
12
30
  ### Patches
package/dist/index.d.ts CHANGED
@@ -22,7 +22,7 @@ declare type PromptStarterListContextValue = Pick<PromptStarterListState, 'numbe
22
22
  /**
23
23
  * PromptStarterList Props
24
24
  */
25
- export declare type PromptStarterListProps = ComponentProps<PromptStarterListSlots> & DesignVersion & {
25
+ export declare type PromptStarterListProps = ComponentProps<Partial<PromptStarterListSlots>, 'gridWrapper'> & DesignVersion & {
26
26
  /**
27
27
  * Text for the expand button when the list is collapsed.
28
28
  *
@@ -88,7 +88,7 @@ export declare type PromptStarterV2Props = Omit<ComponentProps<PromptStarterV2Sl
88
88
  export declare type PromptStarterV2Slots = {
89
89
  root: NonNullable<Slot<'div'>>;
90
90
  primaryAction: NonNullable<Slot<'button'>>;
91
- icon: NonNullable<Slot<'span'>>;
91
+ icon?: Slot<'span'>;
92
92
  prompt: NonNullable<Slot<'span'>>;
93
93
  reasonMarker?: Slot<'span'>;
94
94
  actions?: Slot<'span'>;
@@ -1 +1 @@
1
- {"version":3,"sources":["PromptStarter.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type PromptStarterSlots = {\n root: NonNullable<Slot<'div'>>;\n primaryAction: NonNullable<Slot<'button'>>;\n icon: NonNullable<Slot<'span'>>;\n prompt: NonNullable<Slot<'span'>>;\n reasonMarker?: Slot<'span'>;\n actions?: Slot<'span'>;\n};\n\n/**\n * PromptStarter Props\n */\nexport type PromptStarterProps = Omit<ComponentProps<PromptStarterSlots>, 'disabled'>;\n\n/**\n * State used in rendering PromptStarter\n */\nexport type PromptStarterState = ComponentState<PromptStarterSlots> & {\n isSingleColumn?: boolean;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAgBA;;CAEC,GACD,WAEE"}
1
+ {"version":3,"sources":["PromptStarter.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type PromptStarterSlots = {\n root: NonNullable<Slot<'div'>>;\n primaryAction: NonNullable<Slot<'button'>>;\n icon?: Slot<'span'>;\n prompt: NonNullable<Slot<'span'>>;\n reasonMarker?: Slot<'span'>;\n actions?: Slot<'span'>;\n};\n\n/**\n * PromptStarter Props\n */\nexport type PromptStarterProps = Omit<ComponentProps<PromptStarterSlots>, 'disabled'>;\n\n/**\n * State used in rendering PromptStarter\n */\nexport type PromptStarterState = ComponentState<PromptStarterSlots> & {\n isSingleColumn?: boolean;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAgBA;;CAEC,GACD,WAEE"}
@@ -6,7 +6,7 @@ export const renderPromptStarter_unstable = (state)=>{
6
6
  children: [
7
7
  /*#__PURE__*/ _jsxs(state.primaryAction, {
8
8
  children: [
9
- /*#__PURE__*/ _jsx(state.icon, {}),
9
+ state.icon && /*#__PURE__*/ _jsx(state.icon, {}),
10
10
  /*#__PURE__*/ _jsx(state.prompt, {}),
11
11
  state.reasonMarker && /*#__PURE__*/ _jsx(state.reasonMarker, {})
12
12
  ]
@@ -1 +1 @@
1
- {"version":3,"sources":["renderPromptStarter.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { PromptStarterState, PromptStarterSlots } from './PromptStarter.types';\n\nexport const renderPromptStarter_unstable = (state: PromptStarterState) => {\n assertSlots<PromptStarterSlots>(state);\n\n return (\n <state.root>\n <state.primaryAction>\n <state.icon />\n <state.prompt />\n {state.reasonMarker && <state.reasonMarker />}\n </state.primaryAction>\n {state.actions && <state.actions />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderPromptStarter_unstable","state","root","primaryAction","icon","prompt","reasonMarker","actions"],"rangeMappings":";;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAGzD,OAAO,MAAMC,+BAA+B,CAACC;IAC3CF,YAAgCE;IAEhC,qBACE,MAACA,MAAMC,IAAI;;0BACT,MAACD,MAAME,aAAa;;kCAClB,KAACF,MAAMG,IAAI;kCACX,KAACH,MAAMI,MAAM;oBACZJ,MAAMK,YAAY,kBAAI,KAACL,MAAMK,YAAY;;;YAE3CL,MAAMM,OAAO,kBAAI,KAACN,MAAMM,OAAO;;;AAGtC,EAAE"}
1
+ {"version":3,"sources":["renderPromptStarter.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { PromptStarterState, PromptStarterSlots } from './PromptStarter.types';\n\nexport const renderPromptStarter_unstable = (state: PromptStarterState) => {\n assertSlots<PromptStarterSlots>(state);\n\n return (\n <state.root>\n <state.primaryAction>\n {state.icon && <state.icon />}\n <state.prompt />\n {state.reasonMarker && <state.reasonMarker />}\n </state.primaryAction>\n {state.actions && <state.actions />}\n </state.root>\n );\n};\n"],"names":["assertSlots","renderPromptStarter_unstable","state","root","primaryAction","icon","prompt","reasonMarker","actions"],"rangeMappings":";;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAGzD,OAAO,MAAMC,+BAA+B,CAACC;IAC3CF,YAAgCE;IAEhC,qBACE,MAACA,MAAMC,IAAI;;0BACT,MAACD,MAAME,aAAa;;oBACjBF,MAAMG,IAAI,kBAAI,KAACH,MAAMG,IAAI;kCAC1B,KAACH,MAAMI,MAAM;oBACZJ,MAAMK,YAAY,kBAAI,KAACL,MAAMK,YAAY;;;YAE3CL,MAAMM,OAAO,kBAAI,KAACN,MAAMM,OAAO;;;AAGtC,EAAE"}
@@ -12,8 +12,9 @@ import { usePromptStarterListContext } from '../../../contexts/PromptStarterList
12
12
  const id = useId('prompt-starter');
13
13
  const focusAttrs = useFocusableGroup();
14
14
  const numberOfColumns = usePromptStarterListContext((ctx)=>ctx.numberOfColumns);
15
+ const isSingleColumn = numberOfColumns === 1;
15
16
  const state = {
16
- isSingleColumn: numberOfColumns === 1,
17
+ isSingleColumn,
17
18
  components: {
18
19
  root: 'div',
19
20
  primaryAction: 'button',
@@ -34,27 +35,27 @@ import { usePromptStarterListContext } from '../../../contexts/PromptStarterList
34
35
  primaryAction: slot.always(props.primaryAction, {
35
36
  elementType: 'button'
36
37
  }),
37
- icon: slot.always(props.icon, {
38
+ icon: !isSingleColumn ? slot.optional(props.icon, {
38
39
  defaultProps: {
39
40
  id: `${id}-icon`
40
41
  },
41
42
  elementType: 'span'
42
- }),
43
+ }) : undefined,
43
44
  prompt: slot.always(props.prompt, {
44
45
  defaultProps: {
45
46
  id: `${id}-prompt`
46
47
  },
47
48
  elementType: 'span'
48
49
  }),
49
- reasonMarker: slot.optional(props.reasonMarker, {
50
+ reasonMarker: !isSingleColumn ? slot.optional(props.reasonMarker, {
50
51
  defaultProps: {
51
52
  id: `${id}-reasonMarker`
52
53
  },
53
54
  elementType: 'span'
54
- }),
55
- actions: slot.optional(props.actions, {
55
+ }) : undefined,
56
+ actions: !isSingleColumn ? slot.optional(props.actions, {
56
57
  elementType: 'span'
57
- })
58
+ }) : undefined
58
59
  };
59
60
  return state;
60
61
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["usePromptStarter.ts"],"sourcesContent":["import { getIntrinsicElementProps, slot, useFocusableGroup, useId } from '@fluentui/react-components';\nimport { usePromptStarterListContext } from '../../../contexts/PromptStarterListContext';\nimport type { PromptStarterProps, PromptStarterState } from './PromptStarter.types';\n\n/**\n * Create the state required to render PromptStarter.\n *\n * The returned state can be modified with hooks such as usePromptStarterStyles_unstable,\n * before being passed to renderPromptStarter_unstable.\n *\n * @param props - props from this instance of PromptStarter\n * @param ref - reference to root HTMLElement of PromptStarter\n */\nexport const usePromptStarter_unstable = (\n props: PromptStarterProps,\n ref: React.Ref<HTMLDivElement>,\n): PromptStarterState => {\n const id = useId('prompt-starter');\n const focusAttrs = useFocusableGroup();\n\n const numberOfColumns = usePromptStarterListContext(ctx => ctx.numberOfColumns);\n\n const state: PromptStarterState = {\n isSingleColumn: numberOfColumns === 1,\n components: {\n root: 'div',\n primaryAction: 'button',\n icon: 'span',\n prompt: 'span',\n reasonMarker: 'span',\n actions: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n 'aria-labelledby': `${id}-prompt`,\n 'aria-describedby': `${id}-icon, ${id}-reasonMarker`,\n ...focusAttrs,\n ...props,\n }),\n { elementType: 'div' },\n ),\n primaryAction: slot.always(props.primaryAction, {\n elementType: 'button',\n }),\n icon: slot.always(props.icon, {\n defaultProps: { id: `${id}-icon` },\n elementType: 'span',\n }),\n prompt: slot.always(props.prompt, {\n defaultProps: { id: `${id}-prompt` },\n elementType: 'span',\n }),\n reasonMarker: slot.optional(props.reasonMarker, {\n defaultProps: { id: `${id}-reasonMarker` },\n elementType: 'span',\n }),\n actions: slot.optional(props.actions, { elementType: 'span' }),\n };\n\n return state;\n};\n"],"names":["getIntrinsicElementProps","slot","useFocusableGroup","useId","usePromptStarterListContext","usePromptStarter_unstable","props","ref","id","focusAttrs","numberOfColumns","ctx","state","isSingleColumn","components","root","primaryAction","icon","prompt","reasonMarker","actions","always","elementType","defaultProps","optional"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,wBAAwB,EAAEC,IAAI,EAAEC,iBAAiB,EAAEC,KAAK,QAAQ,6BAA6B;AACtG,SAASC,2BAA2B,QAAQ,6CAA6C;AAGzF;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC,OACAC;IAEA,MAAMC,KAAKL,MAAM;IACjB,MAAMM,aAAaP;IAEnB,MAAMQ,kBAAkBN,4BAA4BO,CAAAA,MAAOA,IAAID,eAAe;IAE9E,MAAME,QAA4B;QAChCC,gBAAgBH,oBAAoB;QACpCI,YAAY;YACVC,MAAM;YACNC,eAAe;YACfC,MAAM;YACNC,QAAQ;YACRC,cAAc;YACdC,SAAS;QACX;QACAL,MAAMd,KAAKoB,MAAM,CACfrB,yBAAyB,OAAO;YAC9BO;YACA,mBAAmB,CAAC,EAAEC,GAAG,OAAO,CAAC;YACjC,oBAAoB,CAAC,EAAEA,GAAG,OAAO,EAAEA,GAAG,aAAa,CAAC;YACpD,GAAGC,UAAU;YACb,GAAGH,KAAK;QACV,IACA;YAAEgB,aAAa;QAAM;QAEvBN,eAAef,KAAKoB,MAAM,CAACf,MAAMU,aAAa,EAAE;YAC9CM,aAAa;QACf;QACAL,MAAMhB,KAAKoB,MAAM,CAACf,MAAMW,IAAI,EAAE;YAC5BM,cAAc;gBAAEf,IAAI,CAAC,EAAEA,GAAG,KAAK,CAAC;YAAC;YACjCc,aAAa;QACf;QACAJ,QAAQjB,KAAKoB,MAAM,CAACf,MAAMY,MAAM,EAAE;YAChCK,cAAc;gBAAEf,IAAI,CAAC,EAAEA,GAAG,OAAO,CAAC;YAAC;YACnCc,aAAa;QACf;QACAH,cAAclB,KAAKuB,QAAQ,CAAClB,MAAMa,YAAY,EAAE;YAC9CI,cAAc;gBAAEf,IAAI,CAAC,EAAEA,GAAG,aAAa,CAAC;YAAC;YACzCc,aAAa;QACf;QACAF,SAASnB,KAAKuB,QAAQ,CAAClB,MAAMc,OAAO,EAAE;YAAEE,aAAa;QAAO;IAC9D;IAEA,OAAOV;AACT,EAAE"}
1
+ {"version":3,"sources":["usePromptStarter.ts"],"sourcesContent":["import { getIntrinsicElementProps, slot, useFocusableGroup, useId } from '@fluentui/react-components';\nimport { usePromptStarterListContext } from '../../../contexts/PromptStarterListContext';\nimport type { PromptStarterProps, PromptStarterState } from './PromptStarter.types';\n\n/**\n * Create the state required to render PromptStarter.\n *\n * The returned state can be modified with hooks such as usePromptStarterStyles_unstable,\n * before being passed to renderPromptStarter_unstable.\n *\n * @param props - props from this instance of PromptStarter\n * @param ref - reference to root HTMLElement of PromptStarter\n */\nexport const usePromptStarter_unstable = (\n props: PromptStarterProps,\n ref: React.Ref<HTMLDivElement>,\n): PromptStarterState => {\n const id = useId('prompt-starter');\n const focusAttrs = useFocusableGroup();\n\n const numberOfColumns = usePromptStarterListContext(ctx => ctx.numberOfColumns);\n\n const isSingleColumn = numberOfColumns === 1;\n\n const state: PromptStarterState = {\n isSingleColumn,\n components: {\n root: 'div',\n primaryAction: 'button',\n icon: 'span',\n prompt: 'span',\n reasonMarker: 'span',\n actions: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n 'aria-labelledby': `${id}-prompt`,\n 'aria-describedby': `${id}-icon, ${id}-reasonMarker`,\n ...focusAttrs,\n ...props,\n }),\n { elementType: 'div' },\n ),\n primaryAction: slot.always(props.primaryAction, {\n elementType: 'button',\n }),\n icon: !isSingleColumn\n ? slot.optional(props.icon, {\n defaultProps: { id: `${id}-icon` },\n elementType: 'span',\n })\n : undefined,\n prompt: slot.always(props.prompt, {\n defaultProps: { id: `${id}-prompt` },\n elementType: 'span',\n }),\n reasonMarker: !isSingleColumn\n ? slot.optional(props.reasonMarker, {\n defaultProps: { id: `${id}-reasonMarker` },\n elementType: 'span',\n })\n : undefined,\n actions: !isSingleColumn ? slot.optional(props.actions, { elementType: 'span' }) : undefined,\n };\n\n return state;\n};\n"],"names":["getIntrinsicElementProps","slot","useFocusableGroup","useId","usePromptStarterListContext","usePromptStarter_unstable","props","ref","id","focusAttrs","numberOfColumns","ctx","isSingleColumn","state","components","root","primaryAction","icon","prompt","reasonMarker","actions","always","elementType","optional","defaultProps","undefined"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,wBAAwB,EAAEC,IAAI,EAAEC,iBAAiB,EAAEC,KAAK,QAAQ,6BAA6B;AACtG,SAASC,2BAA2B,QAAQ,6CAA6C;AAGzF;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC,OACAC;IAEA,MAAMC,KAAKL,MAAM;IACjB,MAAMM,aAAaP;IAEnB,MAAMQ,kBAAkBN,4BAA4BO,CAAAA,MAAOA,IAAID,eAAe;IAE9E,MAAME,iBAAiBF,oBAAoB;IAE3C,MAAMG,QAA4B;QAChCD;QACAE,YAAY;YACVC,MAAM;YACNC,eAAe;YACfC,MAAM;YACNC,QAAQ;YACRC,cAAc;YACdC,SAAS;QACX;QACAL,MAAMd,KAAKoB,MAAM,CACfrB,yBAAyB,OAAO;YAC9BO;YACA,mBAAmB,CAAC,EAAEC,GAAG,OAAO,CAAC;YACjC,oBAAoB,CAAC,EAAEA,GAAG,OAAO,EAAEA,GAAG,aAAa,CAAC;YACpD,GAAGC,UAAU;YACb,GAAGH,KAAK;QACV,IACA;YAAEgB,aAAa;QAAM;QAEvBN,eAAef,KAAKoB,MAAM,CAACf,MAAMU,aAAa,EAAE;YAC9CM,aAAa;QACf;QACAL,MAAM,CAACL,iBACHX,KAAKsB,QAAQ,CAACjB,MAAMW,IAAI,EAAE;YACxBO,cAAc;gBAAEhB,IAAI,CAAC,EAAEA,GAAG,KAAK,CAAC;YAAC;YACjCc,aAAa;QACf,KACAG;QACJP,QAAQjB,KAAKoB,MAAM,CAACf,MAAMY,MAAM,EAAE;YAChCM,cAAc;gBAAEhB,IAAI,CAAC,EAAEA,GAAG,OAAO,CAAC;YAAC;YACnCc,aAAa;QACf;QACAH,cAAc,CAACP,iBACXX,KAAKsB,QAAQ,CAACjB,MAAMa,YAAY,EAAE;YAChCK,cAAc;gBAAEhB,IAAI,CAAC,EAAEA,GAAG,aAAa,CAAC;YAAC;YACzCc,aAAa;QACf,KACAG;QACJL,SAAS,CAACR,iBAAiBX,KAAKsB,QAAQ,CAACjB,MAAMc,OAAO,EAAE;YAAEE,aAAa;QAAO,KAAKG;IACrF;IAEA,OAAOZ;AACT,EAAE"}
@@ -141,9 +141,6 @@ const useStyles = __styles({
141
141
  Be2twd7: "f13mqy1h",
142
142
  Bhrd7zp: "figsok6",
143
143
  Bg96gwp: "fcpl73t"
144
- },
145
- singleColumnStyles: {
146
- mc9l5x: "fjseox"
147
144
  }
148
145
  }, {
149
146
  d: [[".fcdwmbt{grid-row:1/3;}", {
@@ -170,7 +167,79 @@ const useStyles = __styles({
170
167
  p: -1
171
168
  }], ".f5p0z4x{opacity:1;}", [".f1964ud6{transition:opacity var(--durationFast) var(--curveLinear);}", {
172
169
  p: -1
173
- }], ".fkhj508{font-size:var(--fontSizeBase300);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f1rvi9lw{display:-webkit-box;}", ".fpfc2by{-webkit-box-orient:vertical;}", ".f1lvsx7g{-webkit-line-clamp:2;}", ".f1sil6mw{overflow-y:hidden;}", ".f13mqy1h{font-size:var(--fontSizeBase100);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fcpl73t{line-height:var(--lineHeightBase100);}", ".fjseox{display:none;}"],
170
+ }], ".fkhj508{font-size:var(--fontSizeBase300);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".f1rvi9lw{display:-webkit-box;}", ".fpfc2by{-webkit-box-orient:vertical;}", ".f1lvsx7g{-webkit-line-clamp:2;}", ".f1sil6mw{overflow-y:hidden;}", ".f13mqy1h{font-size:var(--fontSizeBase100);}", ".figsok6{font-weight:var(--fontWeightRegular);}", ".fcpl73t{line-height:var(--lineHeightBase100);}"],
171
+ f: [".ftqa4ok:focus{outline-style:none;}"],
172
+ i: [".f2hkw1w:focus-visible{outline-style:none;}"],
173
+ m: [["@media (forced-colors: active){.f1j6vpng[data-fui-focus-visible]::after{border-top-color:Highlight;}}", {
174
+ m: "(forced-colors: active)"
175
+ }], ["@media (forced-colors: active){.f1ffjurs[data-fui-focus-visible]::after{border-left-color:Highlight;}.f1pniga2[data-fui-focus-visible]::after{border-right-color:Highlight;}}", {
176
+ m: "(forced-colors: active)"
177
+ }], ["@media (forced-colors: active){.f987i1v[data-fui-focus-visible]::after{border-bottom-color:Highlight;}}", {
178
+ m: "(forced-colors: active)"
179
+ }]]
180
+ });
181
+ const useSingleColumnStyles = __styles({
182
+ primaryAction: {
183
+ Beyfa6y: 0,
184
+ Bbmb7ep: 0,
185
+ Btl43ni: 0,
186
+ B7oj6ja: 0,
187
+ Dimara: "f1jxijnj",
188
+ Brovlpu: "ftqa4ok",
189
+ B486eqv: "f2hkw1w",
190
+ B8q5s1w: "f8hki3x",
191
+ Bci5o5g: ["f1d2448m", "ffh67wi"],
192
+ n8qw10: "f1bjia2o",
193
+ Bdrgwmp: ["ffh67wi", "f1d2448m"],
194
+ Bqhya38: "f1j6vpng",
195
+ Bwxa6fj: ["f1pniga2", "f1ffjurs"],
196
+ Bdhvstf: "f987i1v",
197
+ B7zbvrb: ["f1ffjurs", "f1pniga2"],
198
+ Bm4h7ae: "f15bsgw9",
199
+ B7ys5i9: "f14e48fq",
200
+ Busjfv9: "f18yb2kv",
201
+ Bhk32uz: "fd6o370",
202
+ f6g5ot: 0,
203
+ Boxcth7: 0,
204
+ Bhdgwq3: 0,
205
+ hgwjuy: 0,
206
+ Bshpdp8: 0,
207
+ Bsom6fd: 0,
208
+ Blkhhs4: 0,
209
+ Bonggc9: 0,
210
+ Ddfuxk: 0,
211
+ i03rao: 0,
212
+ kclons: 0,
213
+ clg4pj: 0,
214
+ Bpqj9nj: 0,
215
+ B6dhp37: 0,
216
+ Bf4ptjt: 0,
217
+ Bqtpl0w: 0,
218
+ i4rwgc: "ffwy5si",
219
+ Dah5zi: 0,
220
+ B1tsrr9: 0,
221
+ qqdqy8: 0,
222
+ Bkh64rk: 0,
223
+ e3fwne: "f178id4l",
224
+ J0r882: "f57olzd",
225
+ Bule8hv: ["f4stah7", "fs1por5"],
226
+ Bjwuhne: "f480a47",
227
+ Ghsupd: ["fs1por5", "f4stah7"]
228
+ },
229
+ prompt: {
230
+ Bahqtrf: "fk6fouc",
231
+ Be2twd7: "fy9rknc",
232
+ Bhrd7zp: "fl43uef",
233
+ Bg96gwp: "fwrc4pm"
234
+ }
235
+ }, {
236
+ d: [[".f1jxijnj{border-radius:var(--borderRadius2XL);}", {
237
+ p: -1
238
+ }], ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}", ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}", ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}", ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}", ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}", ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}", ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}", ".fd6o370[data-fui-focus-visible]::after{z-index:1;}", [".ffwy5si[data-fui-focus-visible]::after{border:2px solid var(--colorStrokeFocus2);}", {
239
+ p: -2
240
+ }], [".f178id4l[data-fui-focus-visible]::after{border-radius:var(--borderRadius2XL);}", {
241
+ p: -1
242
+ }], ".f57olzd[data-fui-focus-visible]::after{top:calc(2px * -1);}", ".f4stah7[data-fui-focus-visible]::after{right:calc(2px * -1);}", ".fs1por5[data-fui-focus-visible]::after{left:calc(2px * -1);}", ".f480a47[data-fui-focus-visible]::after{bottom:calc(2px * -1);}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}"],
174
243
  f: [".ftqa4ok:focus{outline-style:none;}"],
175
244
  i: [".f2hkw1w:focus-visible{outline-style:none;}"],
176
245
  m: [["@media (forced-colors: active){.f1j6vpng[data-fui-focus-visible]::after{border-top-color:Highlight;}}", {
@@ -189,15 +258,18 @@ export const usePromptStarterStyles_unstable = state => {
189
258
  } = state;
190
259
  const styles = useStyles();
191
260
  const rootResetStyles = useRootResetStyles();
261
+ const singleColumnStyles = useSingleColumnStyles();
192
262
  state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);
193
- state.primaryAction.className = mergeClasses(promptStarterClassNames.primaryAction, styles.primaryAction, state.primaryAction.className);
194
- state.icon.className = mergeClasses(promptStarterClassNames.icon, styles.icon, isSingleColumn && styles.singleColumnStyles, state.icon.className);
195
- state.prompt.className = mergeClasses(promptStarterClassNames.prompt, styles.prompt, state.prompt.className);
263
+ state.primaryAction.className = mergeClasses(promptStarterClassNames.primaryAction, styles.primaryAction, isSingleColumn && singleColumnStyles.primaryAction, state.primaryAction.className);
264
+ if (state.icon) {
265
+ state.icon.className = mergeClasses(promptStarterClassNames.icon, styles.icon, state.icon.className);
266
+ }
267
+ state.prompt.className = mergeClasses(promptStarterClassNames.prompt, styles.prompt, isSingleColumn && singleColumnStyles.prompt, state.prompt.className);
196
268
  if (state.reasonMarker) {
197
- state.reasonMarker.className = mergeClasses(promptStarterClassNames.reasonMarker, styles.reasonMarker, isSingleColumn && styles.singleColumnStyles, state.reasonMarker.className);
269
+ state.reasonMarker.className = mergeClasses(promptStarterClassNames.reasonMarker, styles.reasonMarker, state.reasonMarker.className);
198
270
  }
199
271
  if (state.actions) {
200
- state.actions.className = mergeClasses(promptStarterClassNames.actions, styles.actions, isSingleColumn && styles.singleColumnStyles, state.actions.className);
272
+ state.actions.className = mergeClasses(promptStarterClassNames.actions, styles.actions, state.actions.className);
201
273
  }
202
274
  return state;
203
275
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["usePromptStarterStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n makeResetStyles,\n mergeClasses,\n shorthands,\n typographyStyles,\n createFocusOutlineStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { PromptStarterSlots, PromptStarterState } from './PromptStarter.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptStarterClassNames: SlotClassNames<PromptStarterSlots> = {\n root: 'fai-PromptStarter',\n primaryAction: 'fai-PromptStarter__primaryAction',\n icon: 'fai-PromptStarter__icon',\n prompt: 'fai-PromptStarter__prompt',\n reasonMarker: 'fai-PromptStarter__reasonMarker',\n actions: 'fai-PromptStarter__actions',\n};\n\nconst useRootResetStyles = makeResetStyles({\n display: 'grid',\n gridTemplateColumns: '1fr auto',\n gridTemplateRows: 'max-content auto',\n minWidth: '214px',\n\n // Apply styles to the primary action on hover / active states\n '&:hover': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n '&:active': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow8,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n\n // Hide actions when not focused or hovered\n ':not(:focus-within):not(:hover)': {\n [`& .${promptStarterClassNames.actions}`]: {\n clip: 'rect(0px, 0px, 0px, 0px)',\n height: '1px',\n margin: '-1px',\n overflow: 'hidden',\n padding: '0px',\n width: '1px',\n position: 'absolute',\n opacity: 0,\n },\n },\n});\n\nconst useStyles = makeStyles({\n primaryAction: {\n gridRow: '1 / 3',\n gridColumn: '1 / 3',\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n borderRadius: '28px',\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground2,\n fontFamily: tokens.fontFamilyBase,\n cursor: 'pointer',\n outlineStyle: 'none',\n textAlign: 'left',\n rowGap: tokens.spacingHorizontalS,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,\n ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n ...createFocusOutlineStyle({ style: { outlineRadius: '28px' } }),\n },\n\n primaryActionHovered: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n minHeight: tokens.spacingVerticalXXL,\n },\n actions: {\n margin: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}\n ${tokens.spacingVerticalNone} ${tokens.spacingHorizontalNone}`,\n position: 'relative',\n gridRow: '1 / 2',\n gridColumn: '2 / 3',\n\n opacity: 1,\n transition: `opacity ${tokens.durationFast} ${tokens.curveLinear}`,\n },\n prompt: {\n ...typographyStyles.body1Strong,\n\n // Truncate text after two lines.\n display: '-webkit-box',\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n overflowY: 'hidden',\n },\n reasonMarker: {\n ...typographyStyles.caption2,\n },\n\n // Hide icon, actions, and reason marker in single column appearance\n singleColumnStyles: {\n display: 'none',\n },\n});\n\nexport const usePromptStarterStyles_unstable = (state: PromptStarterState): PromptStarterState => {\n 'use no memo';\n\n const { isSingleColumn } = state;\n\n const styles = useStyles();\n const rootResetStyles = useRootResetStyles();\n state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);\n state.primaryAction.className = mergeClasses(\n promptStarterClassNames.primaryAction,\n styles.primaryAction,\n state.primaryAction.className,\n );\n state.icon.className = mergeClasses(\n promptStarterClassNames.icon,\n styles.icon,\n isSingleColumn && styles.singleColumnStyles,\n state.icon.className,\n );\n state.prompt.className = mergeClasses(promptStarterClassNames.prompt, styles.prompt, state.prompt.className);\n if (state.reasonMarker) {\n state.reasonMarker.className = mergeClasses(\n promptStarterClassNames.reasonMarker,\n styles.reasonMarker,\n isSingleColumn && styles.singleColumnStyles,\n state.reasonMarker.className,\n );\n }\n if (state.actions) {\n state.actions.className = mergeClasses(\n promptStarterClassNames.actions,\n styles.actions,\n isSingleColumn && styles.singleColumnStyles,\n state.actions.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","shorthands","typographyStyles","createFocusOutlineStyle","tokens","promptStarterClassNames","root","primaryAction","icon","prompt","reasonMarker","actions","useRootResetStyles","display","gridTemplateColumns","gridTemplateRows","minWidth","boxShadow","shadow16","transform","transition","durationNormal","curveDecelerateMin","shadow8","clip","height","margin","overflow","padding","width","position","opacity","useStyles","gridRow","gridColumn","flexDirection","borderRadius","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground2","fontFamily","fontFamilyBase","cursor","outlineStyle","textAlign","rowGap","spacingHorizontalS","spacingVerticalL","spacingHorizontalL","border","strokeWidthThin","colorNeutralStroke2","style","outlineRadius","primaryActionHovered","alignItems","minHeight","spacingVerticalXXL","spacingVerticalNone","spacingHorizontalNone","durationFast","curveLinear","body1Strong","overflowY","caption2","singleColumnStyles","usePromptStarterStyles_unstable","state","isSingleColumn","styles","rootResetStyles","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["usePromptStarterStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n makeResetStyles,\n mergeClasses,\n shorthands,\n typographyStyles,\n createFocusOutlineStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { PromptStarterSlots, PromptStarterState } from './PromptStarter.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptStarterClassNames: SlotClassNames<PromptStarterSlots> = {\n root: 'fai-PromptStarter',\n primaryAction: 'fai-PromptStarter__primaryAction',\n icon: 'fai-PromptStarter__icon',\n prompt: 'fai-PromptStarter__prompt',\n reasonMarker: 'fai-PromptStarter__reasonMarker',\n actions: 'fai-PromptStarter__actions',\n};\n\nconst useRootResetStyles = makeResetStyles({\n display: 'grid',\n gridTemplateColumns: '1fr auto',\n gridTemplateRows: 'max-content auto',\n minWidth: '214px',\n\n // Apply styles to the primary action on hover / active states\n '&:hover': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n '&:active': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow8,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n\n // Hide actions when not focused or hovered\n ':not(:focus-within):not(:hover)': {\n [`& .${promptStarterClassNames.actions}`]: {\n clip: 'rect(0px, 0px, 0px, 0px)',\n height: '1px',\n margin: '-1px',\n overflow: 'hidden',\n padding: '0px',\n width: '1px',\n position: 'absolute',\n opacity: 0,\n },\n },\n});\n\nconst useStyles = makeStyles({\n primaryAction: {\n gridRow: '1 / 3',\n gridColumn: '1 / 3',\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n borderRadius: '28px',\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground2,\n fontFamily: tokens.fontFamilyBase,\n cursor: 'pointer',\n outlineStyle: 'none',\n textAlign: 'left',\n rowGap: tokens.spacingHorizontalS,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,\n ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n ...createFocusOutlineStyle({ style: { outlineRadius: '28px' } }),\n },\n\n primaryActionHovered: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n minHeight: tokens.spacingVerticalXXL,\n },\n actions: {\n margin: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}\n ${tokens.spacingVerticalNone} ${tokens.spacingHorizontalNone}`,\n position: 'relative',\n gridRow: '1 / 2',\n gridColumn: '2 / 3',\n\n opacity: 1,\n transition: `opacity ${tokens.durationFast} ${tokens.curveLinear}`,\n },\n prompt: {\n ...typographyStyles.body1Strong,\n\n // Truncate text after two lines.\n display: '-webkit-box',\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n overflowY: 'hidden',\n },\n reasonMarker: {\n ...typographyStyles.caption2,\n },\n});\n\nconst useSingleColumnStyles = makeStyles({\n primaryAction: {\n borderRadius: tokens.borderRadius2XL,\n ...createFocusOutlineStyle({ style: { outlineRadius: tokens.borderRadius2XL } }),\n },\n prompt: {\n ...typographyStyles.caption1Strong,\n },\n});\n\nexport const usePromptStarterStyles_unstable = (state: PromptStarterState): PromptStarterState => {\n 'use no memo';\n\n const { isSingleColumn } = state;\n\n const styles = useStyles();\n const rootResetStyles = useRootResetStyles();\n const singleColumnStyles = useSingleColumnStyles();\n state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);\n state.primaryAction.className = mergeClasses(\n promptStarterClassNames.primaryAction,\n styles.primaryAction,\n isSingleColumn && singleColumnStyles.primaryAction,\n state.primaryAction.className,\n );\n if (state.icon) {\n state.icon.className = mergeClasses(promptStarterClassNames.icon, styles.icon, state.icon.className);\n }\n state.prompt.className = mergeClasses(\n promptStarterClassNames.prompt,\n styles.prompt,\n isSingleColumn && singleColumnStyles.prompt,\n state.prompt.className,\n );\n if (state.reasonMarker) {\n state.reasonMarker.className = mergeClasses(\n promptStarterClassNames.reasonMarker,\n styles.reasonMarker,\n state.reasonMarker.className,\n );\n }\n if (state.actions) {\n state.actions.className = mergeClasses(promptStarterClassNames.actions, styles.actions, state.actions.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","shorthands","typographyStyles","createFocusOutlineStyle","tokens","promptStarterClassNames","root","primaryAction","icon","prompt","reasonMarker","actions","useRootResetStyles","display","gridTemplateColumns","gridTemplateRows","minWidth","boxShadow","shadow16","transform","transition","durationNormal","curveDecelerateMin","shadow8","clip","height","margin","overflow","padding","width","position","opacity","useStyles","gridRow","gridColumn","flexDirection","borderRadius","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground2","fontFamily","fontFamilyBase","cursor","outlineStyle","textAlign","rowGap","spacingHorizontalS","spacingVerticalL","spacingHorizontalL","border","strokeWidthThin","colorNeutralStroke2","style","outlineRadius","primaryActionHovered","alignItems","minHeight","spacingVerticalXXL","spacingVerticalNone","spacingHorizontalNone","durationFast","curveLinear","body1Strong","overflowY","caption2","useSingleColumnStyles","borderRadius2XL","caption1Strong","usePromptStarterStyles_unstable","state","isSingleColumn","styles","rootResetStyles","singleColumnStyles","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -94,10 +94,19 @@ const useStyles = makeStyles({
94
94
  },
95
95
  reasonMarker: {
96
96
  ...typographyStyles.caption2
97
+ }
98
+ });
99
+ const useSingleColumnStyles = makeStyles({
100
+ primaryAction: {
101
+ borderRadius: tokens.borderRadius2XL,
102
+ ...createFocusOutlineStyle({
103
+ style: {
104
+ outlineRadius: tokens.borderRadius2XL
105
+ }
106
+ })
97
107
  },
98
- // Hide icon, actions, and reason marker in single column appearance
99
- singleColumnStyles: {
100
- display: 'none'
108
+ prompt: {
109
+ ...typographyStyles.caption1Strong
101
110
  }
102
111
  });
103
112
  export const usePromptStarterStyles_unstable = (state)=>{
@@ -105,15 +114,18 @@ export const usePromptStarterStyles_unstable = (state)=>{
105
114
  const { isSingleColumn } = state;
106
115
  const styles = useStyles();
107
116
  const rootResetStyles = useRootResetStyles();
117
+ const singleColumnStyles = useSingleColumnStyles();
108
118
  state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);
109
- state.primaryAction.className = mergeClasses(promptStarterClassNames.primaryAction, styles.primaryAction, state.primaryAction.className);
110
- state.icon.className = mergeClasses(promptStarterClassNames.icon, styles.icon, isSingleColumn && styles.singleColumnStyles, state.icon.className);
111
- state.prompt.className = mergeClasses(promptStarterClassNames.prompt, styles.prompt, state.prompt.className);
119
+ state.primaryAction.className = mergeClasses(promptStarterClassNames.primaryAction, styles.primaryAction, isSingleColumn && singleColumnStyles.primaryAction, state.primaryAction.className);
120
+ if (state.icon) {
121
+ state.icon.className = mergeClasses(promptStarterClassNames.icon, styles.icon, state.icon.className);
122
+ }
123
+ state.prompt.className = mergeClasses(promptStarterClassNames.prompt, styles.prompt, isSingleColumn && singleColumnStyles.prompt, state.prompt.className);
112
124
  if (state.reasonMarker) {
113
- state.reasonMarker.className = mergeClasses(promptStarterClassNames.reasonMarker, styles.reasonMarker, isSingleColumn && styles.singleColumnStyles, state.reasonMarker.className);
125
+ state.reasonMarker.className = mergeClasses(promptStarterClassNames.reasonMarker, styles.reasonMarker, state.reasonMarker.className);
114
126
  }
115
127
  if (state.actions) {
116
- state.actions.className = mergeClasses(promptStarterClassNames.actions, styles.actions, isSingleColumn && styles.singleColumnStyles, state.actions.className);
128
+ state.actions.className = mergeClasses(promptStarterClassNames.actions, styles.actions, state.actions.className);
117
129
  }
118
130
  return state;
119
131
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["usePromptStarterStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n makeResetStyles,\n mergeClasses,\n shorthands,\n typographyStyles,\n createFocusOutlineStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { PromptStarterSlots, PromptStarterState } from './PromptStarter.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptStarterClassNames: SlotClassNames<PromptStarterSlots> = {\n root: 'fai-PromptStarter',\n primaryAction: 'fai-PromptStarter__primaryAction',\n icon: 'fai-PromptStarter__icon',\n prompt: 'fai-PromptStarter__prompt',\n reasonMarker: 'fai-PromptStarter__reasonMarker',\n actions: 'fai-PromptStarter__actions',\n};\n\nconst useRootResetStyles = makeResetStyles({\n display: 'grid',\n gridTemplateColumns: '1fr auto',\n gridTemplateRows: 'max-content auto',\n minWidth: '214px',\n\n // Apply styles to the primary action on hover / active states\n '&:hover': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n '&:active': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow8,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n\n // Hide actions when not focused or hovered\n ':not(:focus-within):not(:hover)': {\n [`& .${promptStarterClassNames.actions}`]: {\n clip: 'rect(0px, 0px, 0px, 0px)',\n height: '1px',\n margin: '-1px',\n overflow: 'hidden',\n padding: '0px',\n width: '1px',\n position: 'absolute',\n opacity: 0,\n },\n },\n});\n\nconst useStyles = makeStyles({\n primaryAction: {\n gridRow: '1 / 3',\n gridColumn: '1 / 3',\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n borderRadius: '28px',\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground2,\n fontFamily: tokens.fontFamilyBase,\n cursor: 'pointer',\n outlineStyle: 'none',\n textAlign: 'left',\n rowGap: tokens.spacingHorizontalS,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,\n ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n ...createFocusOutlineStyle({ style: { outlineRadius: '28px' } }),\n },\n\n primaryActionHovered: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n minHeight: tokens.spacingVerticalXXL,\n },\n actions: {\n margin: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}\n ${tokens.spacingVerticalNone} ${tokens.spacingHorizontalNone}`,\n position: 'relative',\n gridRow: '1 / 2',\n gridColumn: '2 / 3',\n\n opacity: 1,\n transition: `opacity ${tokens.durationFast} ${tokens.curveLinear}`,\n },\n prompt: {\n ...typographyStyles.body1Strong,\n\n // Truncate text after two lines.\n display: '-webkit-box',\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n overflowY: 'hidden',\n },\n reasonMarker: {\n ...typographyStyles.caption2,\n },\n\n // Hide icon, actions, and reason marker in single column appearance\n singleColumnStyles: {\n display: 'none',\n },\n});\n\nexport const usePromptStarterStyles_unstable = (state: PromptStarterState): PromptStarterState => {\n 'use no memo';\n\n const { isSingleColumn } = state;\n\n const styles = useStyles();\n const rootResetStyles = useRootResetStyles();\n state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);\n state.primaryAction.className = mergeClasses(\n promptStarterClassNames.primaryAction,\n styles.primaryAction,\n state.primaryAction.className,\n );\n state.icon.className = mergeClasses(\n promptStarterClassNames.icon,\n styles.icon,\n isSingleColumn && styles.singleColumnStyles,\n state.icon.className,\n );\n state.prompt.className = mergeClasses(promptStarterClassNames.prompt, styles.prompt, state.prompt.className);\n if (state.reasonMarker) {\n state.reasonMarker.className = mergeClasses(\n promptStarterClassNames.reasonMarker,\n styles.reasonMarker,\n isSingleColumn && styles.singleColumnStyles,\n state.reasonMarker.className,\n );\n }\n if (state.actions) {\n state.actions.className = mergeClasses(\n promptStarterClassNames.actions,\n styles.actions,\n isSingleColumn && styles.singleColumnStyles,\n state.actions.className,\n );\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","shorthands","typographyStyles","createFocusOutlineStyle","tokens","promptStarterClassNames","root","primaryAction","icon","prompt","reasonMarker","actions","useRootResetStyles","display","gridTemplateColumns","gridTemplateRows","minWidth","boxShadow","shadow16","transform","transition","durationNormal","curveDecelerateMin","shadow8","clip","height","margin","overflow","padding","width","position","opacity","useStyles","gridRow","gridColumn","flexDirection","borderRadius","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground2","fontFamily","fontFamilyBase","cursor","outlineStyle","textAlign","rowGap","spacingHorizontalS","spacingVerticalL","spacingHorizontalL","border","strokeWidthThin","colorNeutralStroke2","style","outlineRadius","primaryActionHovered","alignItems","minHeight","spacingVerticalXXL","spacingVerticalNone","spacingHorizontalNone","durationFast","curveLinear","body1Strong","overflowY","caption2","singleColumnStyles","usePromptStarterStyles_unstable","state","isSingleColumn","styles","rootResetStyles","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["usePromptStarterStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n makeResetStyles,\n mergeClasses,\n shorthands,\n typographyStyles,\n createFocusOutlineStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { PromptStarterSlots, PromptStarterState } from './PromptStarter.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptStarterClassNames: SlotClassNames<PromptStarterSlots> = {\n root: 'fai-PromptStarter',\n primaryAction: 'fai-PromptStarter__primaryAction',\n icon: 'fai-PromptStarter__icon',\n prompt: 'fai-PromptStarter__prompt',\n reasonMarker: 'fai-PromptStarter__reasonMarker',\n actions: 'fai-PromptStarter__actions',\n};\n\nconst useRootResetStyles = makeResetStyles({\n display: 'grid',\n gridTemplateColumns: '1fr auto',\n gridTemplateRows: 'max-content auto',\n minWidth: '214px',\n\n // Apply styles to the primary action on hover / active states\n '&:hover': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n '&:active': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow8,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n\n // Hide actions when not focused or hovered\n ':not(:focus-within):not(:hover)': {\n [`& .${promptStarterClassNames.actions}`]: {\n clip: 'rect(0px, 0px, 0px, 0px)',\n height: '1px',\n margin: '-1px',\n overflow: 'hidden',\n padding: '0px',\n width: '1px',\n position: 'absolute',\n opacity: 0,\n },\n },\n});\n\nconst useStyles = makeStyles({\n primaryAction: {\n gridRow: '1 / 3',\n gridColumn: '1 / 3',\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n borderRadius: '28px',\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground2,\n fontFamily: tokens.fontFamilyBase,\n cursor: 'pointer',\n outlineStyle: 'none',\n textAlign: 'left',\n rowGap: tokens.spacingHorizontalS,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,\n ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n ...createFocusOutlineStyle({ style: { outlineRadius: '28px' } }),\n },\n\n primaryActionHovered: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n minHeight: tokens.spacingVerticalXXL,\n },\n actions: {\n margin: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}\n ${tokens.spacingVerticalNone} ${tokens.spacingHorizontalNone}`,\n position: 'relative',\n gridRow: '1 / 2',\n gridColumn: '2 / 3',\n\n opacity: 1,\n transition: `opacity ${tokens.durationFast} ${tokens.curveLinear}`,\n },\n prompt: {\n ...typographyStyles.body1Strong,\n\n // Truncate text after two lines.\n display: '-webkit-box',\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n overflowY: 'hidden',\n },\n reasonMarker: {\n ...typographyStyles.caption2,\n },\n});\n\nconst useSingleColumnStyles = makeStyles({\n primaryAction: {\n borderRadius: tokens.borderRadius2XL,\n ...createFocusOutlineStyle({ style: { outlineRadius: tokens.borderRadius2XL } }),\n },\n prompt: {\n ...typographyStyles.caption1Strong,\n },\n});\n\nexport const usePromptStarterStyles_unstable = (state: PromptStarterState): PromptStarterState => {\n 'use no memo';\n\n const { isSingleColumn } = state;\n\n const styles = useStyles();\n const rootResetStyles = useRootResetStyles();\n const singleColumnStyles = useSingleColumnStyles();\n state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);\n state.primaryAction.className = mergeClasses(\n promptStarterClassNames.primaryAction,\n styles.primaryAction,\n isSingleColumn && singleColumnStyles.primaryAction,\n state.primaryAction.className,\n );\n if (state.icon) {\n state.icon.className = mergeClasses(promptStarterClassNames.icon, styles.icon, state.icon.className);\n }\n state.prompt.className = mergeClasses(\n promptStarterClassNames.prompt,\n styles.prompt,\n isSingleColumn && singleColumnStyles.prompt,\n state.prompt.className,\n );\n if (state.reasonMarker) {\n state.reasonMarker.className = mergeClasses(\n promptStarterClassNames.reasonMarker,\n styles.reasonMarker,\n state.reasonMarker.className,\n );\n }\n if (state.actions) {\n state.actions.className = mergeClasses(promptStarterClassNames.actions, styles.actions, state.actions.className);\n }\n\n return state;\n};\n"],"names":["makeStyles","makeResetStyles","mergeClasses","shorthands","typographyStyles","createFocusOutlineStyle","tokens","promptStarterClassNames","root","primaryAction","icon","prompt","reasonMarker","actions","useRootResetStyles","display","gridTemplateColumns","gridTemplateRows","minWidth","boxShadow","shadow16","transform","transition","durationNormal","curveDecelerateMin","shadow8","clip","height","margin","overflow","padding","width","position","opacity","useStyles","gridRow","gridColumn","flexDirection","borderRadius","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground2","fontFamily","fontFamilyBase","cursor","outlineStyle","textAlign","rowGap","spacingHorizontalS","spacingVerticalL","spacingHorizontalL","border","strokeWidthThin","colorNeutralStroke2","style","outlineRadius","primaryActionHovered","alignItems","minHeight","spacingVerticalXXL","spacingVerticalNone","spacingHorizontalNone","durationFast","curveLinear","body1Strong","overflowY","caption2","useSingleColumnStyles","borderRadius2XL","caption1Strong","usePromptStarterStyles_unstable","state","isSingleColumn","styles","rootResetStyles","singleColumnStyles","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SACEA,UAAU,EACVC,eAAe,EACfC,YAAY,EACZC,UAAU,EACVC,gBAAgB,EAChBC,uBAAuB,QAClB,6BAA6B;AACpC,SAASC,MAAM,QAAQ,2BAA2B;AAIlD,OAAO,MAAMC,0BAA8D;IACzEC,MAAM;IACNC,eAAe;IACfC,MAAM;IACNC,QAAQ;IACRC,cAAc;IACdC,SAAS;AACX,EAAE;AAEF,MAAMC,qBAAqBb,gBAAgB;IACzCc,SAAS;IACTC,qBAAqB;IACrBC,kBAAkB;IAClBC,UAAU;IAEV,8DAA8D;IAC9D,WAAW;QACT,CAAC,CAAC,GAAG,EAAEX,wBAAwBE,aAAa,CAAC,CAAC,CAAC,EAAE;YAC/CU,WAAWb,OAAOc,QAAQ;YAC1BC,WAAW;YACXC,YAAY,CAAC,UAAU,EAAEhB,OAAOiB,cAAc,CAAC,CAAC,EAAEjB,OAAOkB,kBAAkB,CAAC,CAAC;QAC/E;IACF;IACA,YAAY;QACV,CAAC,CAAC,GAAG,EAAEjB,wBAAwBE,aAAa,CAAC,CAAC,CAAC,EAAE;YAC/CU,WAAWb,OAAOmB,OAAO;YACzBJ,WAAW;YACXC,YAAY,CAAC,UAAU,EAAEhB,OAAOiB,cAAc,CAAC,CAAC,EAAEjB,OAAOkB,kBAAkB,CAAC,CAAC;QAC/E;IACF;IAEA,2CAA2C;IAC3C,mCAAmC;QACjC,CAAC,CAAC,GAAG,EAAEjB,wBAAwBM,OAAO,CAAC,CAAC,CAAC,EAAE;YACzCa,MAAM;YACNC,QAAQ;YACRC,QAAQ;YACRC,UAAU;YACVC,SAAS;YACTC,OAAO;YACPC,UAAU;YACVC,SAAS;QACX;IACF;AACF;AAEA,MAAMC,YAAYlC,WAAW;IAC3BS,eAAe;QACb0B,SAAS;QACTC,YAAY;QACZrB,SAAS;QACTsB,eAAe;QACfL,UAAU;QACVM,cAAc;QACdC,iBAAiBjC,OAAOkC,uBAAuB;QAC/CC,OAAOnC,OAAOoC,uBAAuB;QACrCC,YAAYrC,OAAOsC,cAAc;QACjCC,QAAQ;QACRC,cAAc;QACdC,WAAW;QACXC,QAAQ1C,OAAO2C,kBAAkB;QACjCnB,SAAS,CAAC,EAAExB,OAAO4C,gBAAgB,CAAC,CAAC,EAAE5C,OAAO6C,kBAAkB,CAAC,CAAC;QAClE,GAAGhD,WAAWiD,MAAM,CAAC9C,OAAO+C,eAAe,EAAE,SAAS/C,OAAOgD,mBAAmB,CAAC;QACjF,GAAGjD,wBAAwB;YAAEkD,OAAO;gBAAEC,eAAe;YAAO;QAAE,EAAE;IAClE;IAEAC,sBAAsB;QACpBtC,WAAWb,OAAOc,QAAQ;QAC1BC,WAAW;QACXC,YAAY,CAAC,UAAU,EAAEhB,OAAOiB,cAAc,CAAC,CAAC,EAAEjB,OAAOkB,kBAAkB,CAAC,CAAC;IAC/E;IAEAd,MAAM;QACJK,SAAS;QACT2C,YAAY;QACZC,WAAWrD,OAAOsD,kBAAkB;IACtC;IACA/C,SAAS;QACPe,QAAQ,CAAC,EAAEtB,OAAO4C,gBAAgB,CAAC,CAAC,EAAE5C,OAAO6C,kBAAkB,CAAC;aACvD,EAAE7C,OAAOuD,mBAAmB,CAAC,CAAC,EAAEvD,OAAOwD,qBAAqB,CAAC,CAAC;QACvE9B,UAAU;QACVG,SAAS;QACTC,YAAY;QAEZH,SAAS;QACTX,YAAY,CAAC,QAAQ,EAAEhB,OAAOyD,YAAY,CAAC,CAAC,EAAEzD,OAAO0D,WAAW,CAAC,CAAC;IACpE;IACArD,QAAQ;QACN,GAAGP,iBAAiB6D,WAAW;QAE/B,iCAAiC;QACjClD,SAAS;QACT,sBAAsB;QACtB,sBAAsB;QACtBmD,WAAW;IACb;IACAtD,cAAc;QACZ,GAAGR,iBAAiB+D,QAAQ;IAC9B;AACF;AAEA,MAAMC,wBAAwBpE,WAAW;IACvCS,eAAe;QACb6B,cAAchC,OAAO+D,eAAe;QACpC,GAAGhE,wBAAwB;YAAEkD,OAAO;gBAAEC,eAAelD,OAAO+D,eAAe;YAAC;QAAE,EAAE;IAClF;IACA1D,QAAQ;QACN,GAAGP,iBAAiBkE,cAAc;IACpC;AACF;AAEA,OAAO,MAAMC,kCAAkC,CAACC;IAC9C;IAEA,MAAM,EAAEC,cAAc,EAAE,GAAGD;IAE3B,MAAME,SAASxC;IACf,MAAMyC,kBAAkB7D;IACxB,MAAM8D,qBAAqBR;IAC3BI,MAAMhE,IAAI,CAACqE,SAAS,GAAG3E,aAAaK,wBAAwBC,IAAI,EAAEmE,iBAAiBH,MAAMhE,IAAI,CAACqE,SAAS;IACvGL,MAAM/D,aAAa,CAACoE,SAAS,GAAG3E,aAC9BK,wBAAwBE,aAAa,EACrCiE,OAAOjE,aAAa,EACpBgE,kBAAkBG,mBAAmBnE,aAAa,EAClD+D,MAAM/D,aAAa,CAACoE,SAAS;IAE/B,IAAIL,MAAM9D,IAAI,EAAE;QACd8D,MAAM9D,IAAI,CAACmE,SAAS,GAAG3E,aAAaK,wBAAwBG,IAAI,EAAEgE,OAAOhE,IAAI,EAAE8D,MAAM9D,IAAI,CAACmE,SAAS;IACrG;IACAL,MAAM7D,MAAM,CAACkE,SAAS,GAAG3E,aACvBK,wBAAwBI,MAAM,EAC9B+D,OAAO/D,MAAM,EACb8D,kBAAkBG,mBAAmBjE,MAAM,EAC3C6D,MAAM7D,MAAM,CAACkE,SAAS;IAExB,IAAIL,MAAM5D,YAAY,EAAE;QACtB4D,MAAM5D,YAAY,CAACiE,SAAS,GAAG3E,aAC7BK,wBAAwBK,YAAY,EACpC8D,OAAO9D,YAAY,EACnB4D,MAAM5D,YAAY,CAACiE,SAAS;IAEhC;IACA,IAAIL,MAAM3D,OAAO,EAAE;QACjB2D,MAAM3D,OAAO,CAACgE,SAAS,GAAG3E,aAAaK,wBAAwBM,OAAO,EAAE6D,OAAO7D,OAAO,EAAE2D,MAAM3D,OAAO,CAACgE,SAAS;IACjH;IAEA,OAAOL;AACT,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["PromptStarterList.types.ts"],"sourcesContent":["import type { DesignVersion } from '@fluentui-copilot/react-provider';\nimport type {\n ComponentProps,\n ComponentState,\n Slot,\n Button,\n UseArrowNavigationGroupOptions,\n} from '@fluentui/react-components';\n\nexport type PromptStarterListSlots = {\n root: NonNullable<Slot<'div'>>;\n gridWrapper: NonNullable<Slot<'div'>>;\n expandButton?: Slot<typeof Button>;\n};\n\n/**\n * PromptStarterList Props\n */\nexport type PromptStarterListProps = ComponentProps<PromptStarterListSlots> &\n DesignVersion & {\n /**\n * Text for the expand button when the list is collapsed.\n *\n * default: \"Show more\"\n */\n expandButtonLabel?: string;\n /**\n * Text for the expand button when the list is expanded.\n *\n * default: \"Show less\"\n */\n collapseButtonLabel?: string;\n /**\n * Arrow navigation options. This can be used to customize Tabster's direction,\n * tab behavior, and memoization options.\n *\n * default: { axis: 'horizontal', memorizeCurrent: true }\n */\n arrowNavigationOptions?: UseArrowNavigationGroupOptions;\n };\n\n/**\n * State used in rendering PromptStarterList\n */\nexport type PromptStarterListState = ComponentState<PromptStarterListSlots> &\n Required<Pick<PromptStarterListProps, 'designVersion'>> & {\n numberOfColumns: number;\n isExpanded?: boolean;\n };\n\nexport type PromptStarterListContextValue = Pick<PromptStarterListState, 'numberOfColumns' | 'isExpanded'>;\n"],"names":[],"rangeMappings":"","mappings":"AAkDA,WAA2G"}
1
+ {"version":3,"sources":["PromptStarterList.types.ts"],"sourcesContent":["import type { DesignVersion } from '@fluentui-copilot/react-provider';\nimport type {\n ComponentProps,\n ComponentState,\n Slot,\n Button,\n UseArrowNavigationGroupOptions,\n} from '@fluentui/react-components';\n\nexport type PromptStarterListSlots = {\n root: NonNullable<Slot<'div'>>;\n gridWrapper: NonNullable<Slot<'div'>>;\n expandButton?: Slot<typeof Button>;\n};\n\n/**\n * PromptStarterList Props\n */\nexport type PromptStarterListProps = ComponentProps<Partial<PromptStarterListSlots>, 'gridWrapper'> &\n DesignVersion & {\n /**\n * Text for the expand button when the list is collapsed.\n *\n * default: \"Show more\"\n */\n expandButtonLabel?: string;\n /**\n * Text for the expand button when the list is expanded.\n *\n * default: \"Show less\"\n */\n collapseButtonLabel?: string;\n /**\n * Arrow navigation options. This can be used to customize Tabster's direction,\n * tab behavior, and memoization options.\n *\n * default: { axis: 'horizontal', memorizeCurrent: true }\n */\n arrowNavigationOptions?: UseArrowNavigationGroupOptions;\n };\n\n/**\n * State used in rendering PromptStarterList\n */\nexport type PromptStarterListState = ComponentState<PromptStarterListSlots> &\n Required<Pick<PromptStarterListProps, 'designVersion'>> & {\n numberOfColumns: number;\n isExpanded?: boolean;\n };\n\nexport type PromptStarterListContextValue = Pick<PromptStarterListState, 'numberOfColumns' | 'isExpanded'>;\n"],"names":[],"rangeMappings":"","mappings":"AAkDA,WAA2G"}
@@ -1 +1 @@
1
- {"version":3,"sources":["PromptStarter.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type PromptStarterSlots = {\n root: NonNullable<Slot<'div'>>;\n primaryAction: NonNullable<Slot<'button'>>;\n icon: NonNullable<Slot<'span'>>;\n prompt: NonNullable<Slot<'span'>>;\n reasonMarker?: Slot<'span'>;\n actions?: Slot<'span'>;\n};\n\n/**\n * PromptStarter Props\n */\nexport type PromptStarterProps = Omit<ComponentProps<PromptStarterSlots>, 'disabled'>;\n\n/**\n * State used in rendering PromptStarter\n */\nexport type PromptStarterState = ComponentState<PromptStarterSlots> & {\n isSingleColumn?: boolean;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAgBA;;CAEC"}
1
+ {"version":3,"sources":["PromptStarter.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type PromptStarterSlots = {\n root: NonNullable<Slot<'div'>>;\n primaryAction: NonNullable<Slot<'button'>>;\n icon?: Slot<'span'>;\n prompt: NonNullable<Slot<'span'>>;\n reasonMarker?: Slot<'span'>;\n actions?: Slot<'span'>;\n};\n\n/**\n * PromptStarter Props\n */\nexport type PromptStarterProps = Omit<ComponentProps<PromptStarterSlots>, 'disabled'>;\n\n/**\n * State used in rendering PromptStarter\n */\nexport type PromptStarterState = ComponentState<PromptStarterSlots> & {\n isSingleColumn?: boolean;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAgBA;;CAEC"}
@@ -16,7 +16,7 @@ const renderPromptStarter_unstable = (state)=>{
16
16
  children: [
17
17
  /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.primaryAction, {
18
18
  children: [
19
- /*#__PURE__*/ (0, _jsxruntime.jsx)(state.icon, {}),
19
+ state.icon && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.icon, {}),
20
20
  /*#__PURE__*/ (0, _jsxruntime.jsx)(state.prompt, {}),
21
21
  state.reasonMarker && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.reasonMarker, {})
22
22
  ]
@@ -1 +1 @@
1
- {"version":3,"sources":["renderPromptStarter.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { PromptStarterState, PromptStarterSlots } from './PromptStarter.types';\n\nexport const renderPromptStarter_unstable = (state: PromptStarterState) => {\n assertSlots<PromptStarterSlots>(state);\n\n return (\n <state.root>\n <state.primaryAction>\n <state.icon />\n <state.prompt />\n {state.reasonMarker && <state.reasonMarker />}\n </state.primaryAction>\n {state.actions && <state.actions />}\n </state.root>\n );\n};\n"],"names":["renderPromptStarter_unstable","state","assertSlots","_jsxs","root","primaryAction","_jsx","icon","prompt","reasonMarker","actions"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAMaA;;;eAAAA;;;4BALb;iCAE4B;AAGrB,MAAMA,+BAA+B,CAACC;IAC3CC,IAAAA,4BAAAA,EAAgCD;IAEhC,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACF,MAAMG,IAAI,EAAA;;0BACTD,IAAAA,gBAAA,EAACF,MAAMI,aAAa,EAAA;;kCAClBC,IAAAA,eAAA,EAACL,MAAMM,IAAI,EAAA,CAAA;kCACXD,IAAAA,eAAA,EAACL,MAAMO,MAAM,EAAA,CAAA;oBACZP,MAAMQ,YAAY,IAAA,WAAA,GAAIH,IAAAA,eAAA,EAACL,MAAMQ,YAAY,EAAA,CAAA;;;YAE3CR,MAAMS,OAAO,IAAA,WAAA,GAAIJ,IAAAA,eAAA,EAACL,MAAMS,OAAO,EAAA,CAAA;;;AAGtC"}
1
+ {"version":3,"sources":["renderPromptStarter.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { PromptStarterState, PromptStarterSlots } from './PromptStarter.types';\n\nexport const renderPromptStarter_unstable = (state: PromptStarterState) => {\n assertSlots<PromptStarterSlots>(state);\n\n return (\n <state.root>\n <state.primaryAction>\n {state.icon && <state.icon />}\n <state.prompt />\n {state.reasonMarker && <state.reasonMarker />}\n </state.primaryAction>\n {state.actions && <state.actions />}\n </state.root>\n );\n};\n"],"names":["renderPromptStarter_unstable","state","assertSlots","_jsxs","root","primaryAction","icon","_jsx","prompt","reasonMarker","actions"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAMaA;;;eAAAA;;;4BALb;iCAE4B;AAGrB,MAAMA,+BAA+B,CAACC;IAC3CC,IAAAA,4BAAAA,EAAgCD;IAEhC,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACF,MAAMG,IAAI,EAAA;;0BACTD,IAAAA,gBAAA,EAACF,MAAMI,aAAa,EAAA;;oBACjBJ,MAAMK,IAAI,IAAA,WAAA,GAAIC,IAAAA,eAAA,EAACN,MAAMK,IAAI,EAAA,CAAA;kCAC1BC,IAAAA,eAAA,EAACN,MAAMO,MAAM,EAAA,CAAA;oBACZP,MAAMQ,YAAY,IAAA,WAAA,GAAIF,IAAAA,eAAA,EAACN,MAAMQ,YAAY,EAAA,CAAA;;;YAE3CR,MAAMS,OAAO,IAAA,WAAA,GAAIH,IAAAA,eAAA,EAACN,MAAMS,OAAO,EAAA,CAAA;;;AAGtC"}
@@ -14,8 +14,9 @@ const usePromptStarter_unstable = (props, ref)=>{
14
14
  const id = (0, _reactcomponents.useId)('prompt-starter');
15
15
  const focusAttrs = (0, _reactcomponents.useFocusableGroup)();
16
16
  const numberOfColumns = (0, _PromptStarterListContext.usePromptStarterListContext)((ctx)=>ctx.numberOfColumns);
17
+ const isSingleColumn = numberOfColumns === 1;
17
18
  const state = {
18
- isSingleColumn: numberOfColumns === 1,
19
+ isSingleColumn,
19
20
  components: {
20
21
  root: 'div',
21
22
  primaryAction: 'button',
@@ -36,27 +37,27 @@ const usePromptStarter_unstable = (props, ref)=>{
36
37
  primaryAction: _reactcomponents.slot.always(props.primaryAction, {
37
38
  elementType: 'button'
38
39
  }),
39
- icon: _reactcomponents.slot.always(props.icon, {
40
+ icon: !isSingleColumn ? _reactcomponents.slot.optional(props.icon, {
40
41
  defaultProps: {
41
42
  id: `${id}-icon`
42
43
  },
43
44
  elementType: 'span'
44
- }),
45
+ }) : undefined,
45
46
  prompt: _reactcomponents.slot.always(props.prompt, {
46
47
  defaultProps: {
47
48
  id: `${id}-prompt`
48
49
  },
49
50
  elementType: 'span'
50
51
  }),
51
- reasonMarker: _reactcomponents.slot.optional(props.reasonMarker, {
52
+ reasonMarker: !isSingleColumn ? _reactcomponents.slot.optional(props.reasonMarker, {
52
53
  defaultProps: {
53
54
  id: `${id}-reasonMarker`
54
55
  },
55
56
  elementType: 'span'
56
- }),
57
- actions: _reactcomponents.slot.optional(props.actions, {
57
+ }) : undefined,
58
+ actions: !isSingleColumn ? _reactcomponents.slot.optional(props.actions, {
58
59
  elementType: 'span'
59
- })
60
+ }) : undefined
60
61
  };
61
62
  return state;
62
63
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["usePromptStarter.ts"],"sourcesContent":["import { getIntrinsicElementProps, slot, useFocusableGroup, useId } from '@fluentui/react-components';\nimport { usePromptStarterListContext } from '../../../contexts/PromptStarterListContext';\nimport type { PromptStarterProps, PromptStarterState } from './PromptStarter.types';\n\n/**\n * Create the state required to render PromptStarter.\n *\n * The returned state can be modified with hooks such as usePromptStarterStyles_unstable,\n * before being passed to renderPromptStarter_unstable.\n *\n * @param props - props from this instance of PromptStarter\n * @param ref - reference to root HTMLElement of PromptStarter\n */\nexport const usePromptStarter_unstable = (\n props: PromptStarterProps,\n ref: React.Ref<HTMLDivElement>,\n): PromptStarterState => {\n const id = useId('prompt-starter');\n const focusAttrs = useFocusableGroup();\n\n const numberOfColumns = usePromptStarterListContext(ctx => ctx.numberOfColumns);\n\n const state: PromptStarterState = {\n isSingleColumn: numberOfColumns === 1,\n components: {\n root: 'div',\n primaryAction: 'button',\n icon: 'span',\n prompt: 'span',\n reasonMarker: 'span',\n actions: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n 'aria-labelledby': `${id}-prompt`,\n 'aria-describedby': `${id}-icon, ${id}-reasonMarker`,\n ...focusAttrs,\n ...props,\n }),\n { elementType: 'div' },\n ),\n primaryAction: slot.always(props.primaryAction, {\n elementType: 'button',\n }),\n icon: slot.always(props.icon, {\n defaultProps: { id: `${id}-icon` },\n elementType: 'span',\n }),\n prompt: slot.always(props.prompt, {\n defaultProps: { id: `${id}-prompt` },\n elementType: 'span',\n }),\n reasonMarker: slot.optional(props.reasonMarker, {\n defaultProps: { id: `${id}-reasonMarker` },\n elementType: 'span',\n }),\n actions: slot.optional(props.actions, { elementType: 'span' }),\n };\n\n return state;\n};\n"],"names":["usePromptStarter_unstable","props","ref","id","useId","focusAttrs","useFocusableGroup","numberOfColumns","usePromptStarterListContext","ctx","state","isSingleColumn","components","root","primaryAction","icon","prompt","reasonMarker","actions","slot","always","getIntrinsicElementProps","elementType","defaultProps","optional"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAaaA;;;eAAAA;;;iCAb4D;0CAC7B;AAYrC,MAAMA,4BAA4B,CACvCC,OACAC;IAEA,MAAMC,KAAKC,IAAAA,sBAAAA,EAAM;IACjB,MAAMC,aAAaC,IAAAA,kCAAAA;IAEnB,MAAMC,kBAAkBC,IAAAA,qDAAAA,EAA4BC,CAAAA,MAAOA,IAAIF,eAAe;IAE9E,MAAMG,QAA4B;QAChCC,gBAAgBJ,oBAAoB;QACpCK,YAAY;YACVC,MAAM;YACNC,eAAe;YACfC,MAAM;YACNC,QAAQ;YACRC,cAAc;YACdC,SAAS;QACX;QACAL,MAAMM,qBAAAA,CAAKC,MAAM,CACfC,IAAAA,yCAAAA,EAAyB,OAAO;YAC9BnB;YACA,mBAAmB,CAAC,EAAEC,GAAG,OAAO,CAAC;YACjC,oBAAoB,CAAC,EAAEA,GAAG,OAAO,EAAEA,GAAG,aAAa,CAAC;YACpD,GAAGE,UAAU;YACb,GAAGJ,KAAK;QACV,IACA;YAAEqB,aAAa;QAAM;QAEvBR,eAAeK,qBAAAA,CAAKC,MAAM,CAACnB,MAAMa,aAAa,EAAE;YAC9CQ,aAAa;QACf;QACAP,MAAMI,qBAAAA,CAAKC,MAAM,CAACnB,MAAMc,IAAI,EAAE;YAC5BQ,cAAc;gBAAEpB,IAAI,CAAC,EAAEA,GAAG,KAAK,CAAC;YAAC;YACjCmB,aAAa;QACf;QACAN,QAAQG,qBAAAA,CAAKC,MAAM,CAACnB,MAAMe,MAAM,EAAE;YAChCO,cAAc;gBAAEpB,IAAI,CAAC,EAAEA,GAAG,OAAO,CAAC;YAAC;YACnCmB,aAAa;QACf;QACAL,cAAcE,qBAAAA,CAAKK,QAAQ,CAACvB,MAAMgB,YAAY,EAAE;YAC9CM,cAAc;gBAAEpB,IAAI,CAAC,EAAEA,GAAG,aAAa,CAAC;YAAC;YACzCmB,aAAa;QACf;QACAJ,SAASC,qBAAAA,CAAKK,QAAQ,CAACvB,MAAMiB,OAAO,EAAE;YAAEI,aAAa;QAAO;IAC9D;IAEA,OAAOZ;AACT"}
1
+ {"version":3,"sources":["usePromptStarter.ts"],"sourcesContent":["import { getIntrinsicElementProps, slot, useFocusableGroup, useId } from '@fluentui/react-components';\nimport { usePromptStarterListContext } from '../../../contexts/PromptStarterListContext';\nimport type { PromptStarterProps, PromptStarterState } from './PromptStarter.types';\n\n/**\n * Create the state required to render PromptStarter.\n *\n * The returned state can be modified with hooks such as usePromptStarterStyles_unstable,\n * before being passed to renderPromptStarter_unstable.\n *\n * @param props - props from this instance of PromptStarter\n * @param ref - reference to root HTMLElement of PromptStarter\n */\nexport const usePromptStarter_unstable = (\n props: PromptStarterProps,\n ref: React.Ref<HTMLDivElement>,\n): PromptStarterState => {\n const id = useId('prompt-starter');\n const focusAttrs = useFocusableGroup();\n\n const numberOfColumns = usePromptStarterListContext(ctx => ctx.numberOfColumns);\n\n const isSingleColumn = numberOfColumns === 1;\n\n const state: PromptStarterState = {\n isSingleColumn,\n components: {\n root: 'div',\n primaryAction: 'button',\n icon: 'span',\n prompt: 'span',\n reasonMarker: 'span',\n actions: 'span',\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n 'aria-labelledby': `${id}-prompt`,\n 'aria-describedby': `${id}-icon, ${id}-reasonMarker`,\n ...focusAttrs,\n ...props,\n }),\n { elementType: 'div' },\n ),\n primaryAction: slot.always(props.primaryAction, {\n elementType: 'button',\n }),\n icon: !isSingleColumn\n ? slot.optional(props.icon, {\n defaultProps: { id: `${id}-icon` },\n elementType: 'span',\n })\n : undefined,\n prompt: slot.always(props.prompt, {\n defaultProps: { id: `${id}-prompt` },\n elementType: 'span',\n }),\n reasonMarker: !isSingleColumn\n ? slot.optional(props.reasonMarker, {\n defaultProps: { id: `${id}-reasonMarker` },\n elementType: 'span',\n })\n : undefined,\n actions: !isSingleColumn ? slot.optional(props.actions, { elementType: 'span' }) : undefined,\n };\n\n return state;\n};\n"],"names":["usePromptStarter_unstable","props","ref","id","useId","focusAttrs","useFocusableGroup","numberOfColumns","usePromptStarterListContext","ctx","isSingleColumn","state","components","root","primaryAction","icon","prompt","reasonMarker","actions","slot","always","getIntrinsicElementProps","elementType","optional","defaultProps","undefined"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAaaA;;;eAAAA;;;iCAb4D;0CAC7B;AAYrC,MAAMA,4BAA4B,CACvCC,OACAC;IAEA,MAAMC,KAAKC,IAAAA,sBAAAA,EAAM;IACjB,MAAMC,aAAaC,IAAAA,kCAAAA;IAEnB,MAAMC,kBAAkBC,IAAAA,qDAAAA,EAA4BC,CAAAA,MAAOA,IAAIF,eAAe;IAE9E,MAAMG,iBAAiBH,oBAAoB;IAE3C,MAAMI,QAA4B;QAChCD;QACAE,YAAY;YACVC,MAAM;YACNC,eAAe;YACfC,MAAM;YACNC,QAAQ;YACRC,cAAc;YACdC,SAAS;QACX;QACAL,MAAMM,qBAAAA,CAAKC,MAAM,CACfC,IAAAA,yCAAAA,EAAyB,OAAO;YAC9BnB;YACA,mBAAmB,CAAC,EAAEC,GAAG,OAAO,CAAC;YACjC,oBAAoB,CAAC,EAAEA,GAAG,OAAO,EAAEA,GAAG,aAAa,CAAC;YACpD,GAAGE,UAAU;YACb,GAAGJ,KAAK;QACV,IACA;YAAEqB,aAAa;QAAM;QAEvBR,eAAeK,qBAAAA,CAAKC,MAAM,CAACnB,MAAMa,aAAa,EAAE;YAC9CQ,aAAa;QACf;QACAP,MAAM,CAACL,iBACHS,qBAAAA,CAAKI,QAAQ,CAACtB,MAAMc,IAAI,EAAE;YACxBS,cAAc;gBAAErB,IAAI,CAAC,EAAEA,GAAG,KAAK,CAAC;YAAC;YACjCmB,aAAa;QACf,KACAG;QACJT,QAAQG,qBAAAA,CAAKC,MAAM,CAACnB,MAAMe,MAAM,EAAE;YAChCQ,cAAc;gBAAErB,IAAI,CAAC,EAAEA,GAAG,OAAO,CAAC;YAAC;YACnCmB,aAAa;QACf;QACAL,cAAc,CAACP,iBACXS,qBAAAA,CAAKI,QAAQ,CAACtB,MAAMgB,YAAY,EAAE;YAChCO,cAAc;gBAAErB,IAAI,CAAC,EAAEA,GAAG,aAAa,CAAC;YAAC;YACzCmB,aAAa;QACf,KACAG;QACJP,SAAS,CAACR,iBAAiBS,qBAAAA,CAAKI,QAAQ,CAACtB,MAAMiB,OAAO,EAAE;YAAEI,aAAa;QAAO,KAAKG;IACrF;IAEA,OAAOd;AACT"}
@@ -205,9 +205,6 @@ const useStyles = (0, _reactcomponents.__styles)({
205
205
  Be2twd7: "f13mqy1h",
206
206
  Bhrd7zp: "figsok6",
207
207
  Bg96gwp: "fcpl73t"
208
- },
209
- singleColumnStyles: {
210
- mc9l5x: "fjseox"
211
208
  }
212
209
  }, {
213
210
  d: [
@@ -332,8 +329,143 @@ const useStyles = (0, _reactcomponents.__styles)({
332
329
  ".f1sil6mw{overflow-y:hidden;}",
333
330
  ".f13mqy1h{font-size:var(--fontSizeBase100);}",
334
331
  ".figsok6{font-weight:var(--fontWeightRegular);}",
335
- ".fcpl73t{line-height:var(--lineHeightBase100);}",
336
- ".fjseox{display:none;}"
332
+ ".fcpl73t{line-height:var(--lineHeightBase100);}"
333
+ ],
334
+ f: [
335
+ ".ftqa4ok:focus{outline-style:none;}"
336
+ ],
337
+ i: [
338
+ ".f2hkw1w:focus-visible{outline-style:none;}"
339
+ ],
340
+ m: [
341
+ [
342
+ "@media (forced-colors: active){.f1j6vpng[data-fui-focus-visible]::after{border-top-color:Highlight;}}",
343
+ {
344
+ m: "(forced-colors: active)"
345
+ }
346
+ ],
347
+ [
348
+ "@media (forced-colors: active){.f1ffjurs[data-fui-focus-visible]::after{border-left-color:Highlight;}.f1pniga2[data-fui-focus-visible]::after{border-right-color:Highlight;}}",
349
+ {
350
+ m: "(forced-colors: active)"
351
+ }
352
+ ],
353
+ [
354
+ "@media (forced-colors: active){.f987i1v[data-fui-focus-visible]::after{border-bottom-color:Highlight;}}",
355
+ {
356
+ m: "(forced-colors: active)"
357
+ }
358
+ ]
359
+ ]
360
+ });
361
+ const useSingleColumnStyles = (0, _reactcomponents.__styles)({
362
+ primaryAction: {
363
+ Beyfa6y: 0,
364
+ Bbmb7ep: 0,
365
+ Btl43ni: 0,
366
+ B7oj6ja: 0,
367
+ Dimara: "f1jxijnj",
368
+ Brovlpu: "ftqa4ok",
369
+ B486eqv: "f2hkw1w",
370
+ B8q5s1w: "f8hki3x",
371
+ Bci5o5g: [
372
+ "f1d2448m",
373
+ "ffh67wi"
374
+ ],
375
+ n8qw10: "f1bjia2o",
376
+ Bdrgwmp: [
377
+ "ffh67wi",
378
+ "f1d2448m"
379
+ ],
380
+ Bqhya38: "f1j6vpng",
381
+ Bwxa6fj: [
382
+ "f1pniga2",
383
+ "f1ffjurs"
384
+ ],
385
+ Bdhvstf: "f987i1v",
386
+ B7zbvrb: [
387
+ "f1ffjurs",
388
+ "f1pniga2"
389
+ ],
390
+ Bm4h7ae: "f15bsgw9",
391
+ B7ys5i9: "f14e48fq",
392
+ Busjfv9: "f18yb2kv",
393
+ Bhk32uz: "fd6o370",
394
+ f6g5ot: 0,
395
+ Boxcth7: 0,
396
+ Bhdgwq3: 0,
397
+ hgwjuy: 0,
398
+ Bshpdp8: 0,
399
+ Bsom6fd: 0,
400
+ Blkhhs4: 0,
401
+ Bonggc9: 0,
402
+ Ddfuxk: 0,
403
+ i03rao: 0,
404
+ kclons: 0,
405
+ clg4pj: 0,
406
+ Bpqj9nj: 0,
407
+ B6dhp37: 0,
408
+ Bf4ptjt: 0,
409
+ Bqtpl0w: 0,
410
+ i4rwgc: "ffwy5si",
411
+ Dah5zi: 0,
412
+ B1tsrr9: 0,
413
+ qqdqy8: 0,
414
+ Bkh64rk: 0,
415
+ e3fwne: "f178id4l",
416
+ J0r882: "f57olzd",
417
+ Bule8hv: [
418
+ "f4stah7",
419
+ "fs1por5"
420
+ ],
421
+ Bjwuhne: "f480a47",
422
+ Ghsupd: [
423
+ "fs1por5",
424
+ "f4stah7"
425
+ ]
426
+ },
427
+ prompt: {
428
+ Bahqtrf: "fk6fouc",
429
+ Be2twd7: "fy9rknc",
430
+ Bhrd7zp: "fl43uef",
431
+ Bg96gwp: "fwrc4pm"
432
+ }
433
+ }, {
434
+ d: [
435
+ [
436
+ ".f1jxijnj{border-radius:var(--borderRadius2XL);}",
437
+ {
438
+ p: -1
439
+ }
440
+ ],
441
+ ".f8hki3x[data-fui-focus-visible]{border-top-color:transparent;}",
442
+ ".f1d2448m[data-fui-focus-visible]{border-right-color:transparent;}",
443
+ ".ffh67wi[data-fui-focus-visible]{border-left-color:transparent;}",
444
+ ".f1bjia2o[data-fui-focus-visible]{border-bottom-color:transparent;}",
445
+ ".f15bsgw9[data-fui-focus-visible]::after{content:\"\";}",
446
+ ".f14e48fq[data-fui-focus-visible]::after{position:absolute;}",
447
+ ".f18yb2kv[data-fui-focus-visible]::after{pointer-events:none;}",
448
+ ".fd6o370[data-fui-focus-visible]::after{z-index:1;}",
449
+ [
450
+ ".ffwy5si[data-fui-focus-visible]::after{border:2px solid var(--colorStrokeFocus2);}",
451
+ {
452
+ p: -2
453
+ }
454
+ ],
455
+ [
456
+ ".f178id4l[data-fui-focus-visible]::after{border-radius:var(--borderRadius2XL);}",
457
+ {
458
+ p: -1
459
+ }
460
+ ],
461
+ ".f57olzd[data-fui-focus-visible]::after{top:calc(2px * -1);}",
462
+ ".f4stah7[data-fui-focus-visible]::after{right:calc(2px * -1);}",
463
+ ".fs1por5[data-fui-focus-visible]::after{left:calc(2px * -1);}",
464
+ ".f480a47[data-fui-focus-visible]::after{bottom:calc(2px * -1);}",
465
+ ".fk6fouc{font-family:var(--fontFamilyBase);}",
466
+ ".fy9rknc{font-size:var(--fontSizeBase200);}",
467
+ ".fl43uef{font-weight:var(--fontWeightSemibold);}",
468
+ ".fwrc4pm{line-height:var(--lineHeightBase200);}"
337
469
  ],
338
470
  f: [
339
471
  ".ftqa4ok:focus{outline-style:none;}"
@@ -367,15 +499,18 @@ const usePromptStarterStyles_unstable = (state)=>{
367
499
  const { isSingleColumn } = state;
368
500
  const styles = useStyles();
369
501
  const rootResetStyles = useRootResetStyles();
502
+ const singleColumnStyles = useSingleColumnStyles();
370
503
  state.root.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.root, rootResetStyles, state.root.className);
371
- state.primaryAction.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.primaryAction, styles.primaryAction, state.primaryAction.className);
372
- state.icon.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.icon, styles.icon, isSingleColumn && styles.singleColumnStyles, state.icon.className);
373
- state.prompt.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.prompt, styles.prompt, state.prompt.className);
504
+ state.primaryAction.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.primaryAction, styles.primaryAction, isSingleColumn && singleColumnStyles.primaryAction, state.primaryAction.className);
505
+ if (state.icon) {
506
+ state.icon.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.icon, styles.icon, state.icon.className);
507
+ }
508
+ state.prompt.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.prompt, styles.prompt, isSingleColumn && singleColumnStyles.prompt, state.prompt.className);
374
509
  if (state.reasonMarker) {
375
- state.reasonMarker.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.reasonMarker, styles.reasonMarker, isSingleColumn && styles.singleColumnStyles, state.reasonMarker.className);
510
+ state.reasonMarker.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.reasonMarker, styles.reasonMarker, state.reasonMarker.className);
376
511
  }
377
512
  if (state.actions) {
378
- state.actions.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.actions, styles.actions, isSingleColumn && styles.singleColumnStyles, state.actions.className);
513
+ state.actions.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.actions, styles.actions, state.actions.className);
379
514
  }
380
515
  return state;
381
516
  }; //# sourceMappingURL=usePromptStarterStyles.styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["usePromptStarterStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n makeResetStyles,\n mergeClasses,\n shorthands,\n typographyStyles,\n createFocusOutlineStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { PromptStarterSlots, PromptStarterState } from './PromptStarter.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptStarterClassNames: SlotClassNames<PromptStarterSlots> = {\n root: 'fai-PromptStarter',\n primaryAction: 'fai-PromptStarter__primaryAction',\n icon: 'fai-PromptStarter__icon',\n prompt: 'fai-PromptStarter__prompt',\n reasonMarker: 'fai-PromptStarter__reasonMarker',\n actions: 'fai-PromptStarter__actions',\n};\n\nconst useRootResetStyles = makeResetStyles({\n display: 'grid',\n gridTemplateColumns: '1fr auto',\n gridTemplateRows: 'max-content auto',\n minWidth: '214px',\n\n // Apply styles to the primary action on hover / active states\n '&:hover': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n '&:active': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow8,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n\n // Hide actions when not focused or hovered\n ':not(:focus-within):not(:hover)': {\n [`& .${promptStarterClassNames.actions}`]: {\n clip: 'rect(0px, 0px, 0px, 0px)',\n height: '1px',\n margin: '-1px',\n overflow: 'hidden',\n padding: '0px',\n width: '1px',\n position: 'absolute',\n opacity: 0,\n },\n },\n});\n\nconst useStyles = makeStyles({\n primaryAction: {\n gridRow: '1 / 3',\n gridColumn: '1 / 3',\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n borderRadius: '28px',\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground2,\n fontFamily: tokens.fontFamilyBase,\n cursor: 'pointer',\n outlineStyle: 'none',\n textAlign: 'left',\n rowGap: tokens.spacingHorizontalS,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,\n ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n ...createFocusOutlineStyle({ style: { outlineRadius: '28px' } }),\n },\n\n primaryActionHovered: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n minHeight: tokens.spacingVerticalXXL,\n },\n actions: {\n margin: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}\n ${tokens.spacingVerticalNone} ${tokens.spacingHorizontalNone}`,\n position: 'relative',\n gridRow: '1 / 2',\n gridColumn: '2 / 3',\n\n opacity: 1,\n transition: `opacity ${tokens.durationFast} ${tokens.curveLinear}`,\n },\n prompt: {\n ...typographyStyles.body1Strong,\n\n // Truncate text after two lines.\n display: '-webkit-box',\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n overflowY: 'hidden',\n },\n reasonMarker: {\n ...typographyStyles.caption2,\n },\n\n // Hide icon, actions, and reason marker in single column appearance\n singleColumnStyles: {\n display: 'none',\n },\n});\n\nexport const usePromptStarterStyles_unstable = (state: PromptStarterState): PromptStarterState => {\n 'use no memo';\n\n const { isSingleColumn } = state;\n\n const styles = useStyles();\n const rootResetStyles = useRootResetStyles();\n state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);\n state.primaryAction.className = mergeClasses(\n promptStarterClassNames.primaryAction,\n styles.primaryAction,\n state.primaryAction.className,\n );\n state.icon.className = mergeClasses(\n promptStarterClassNames.icon,\n styles.icon,\n isSingleColumn && styles.singleColumnStyles,\n state.icon.className,\n );\n state.prompt.className = mergeClasses(promptStarterClassNames.prompt, styles.prompt, state.prompt.className);\n if (state.reasonMarker) {\n state.reasonMarker.className = mergeClasses(\n promptStarterClassNames.reasonMarker,\n styles.reasonMarker,\n isSingleColumn && styles.singleColumnStyles,\n state.reasonMarker.className,\n );\n }\n if (state.actions) {\n state.actions.className = mergeClasses(\n promptStarterClassNames.actions,\n styles.actions,\n isSingleColumn && styles.singleColumnStyles,\n state.actions.className,\n );\n }\n\n return state;\n};\n"],"names":["promptStarterClassNames","root","primaryAction","icon","prompt","reasonMarker","actions","useRootResetStyles","makeResetStyles","display","__styles","gridTemplateColumns","gridTemplateRows","minWidth","h3tjnc","Bw0ie65","boxShadow","transform","transition","Beyfa6y","Bbmb7ep","Bahqtrf","Bceei9c","oeaueh","clip","height","margin","overflow","padding","width","position","opacity","ibv6hh","icvyot","vrafjx","useStyles","makeStyles","gridRow","gridColumn","flexDirection","borderRadius","backgroundColor","color","fontFamily","tokens","fontFamilyBase","cursor","outlineStyle","textAlign","rowGap","spacingHorizontalS","shorthands","border","strokeWidthThin","createFocusOutlineStyle","style","Boxcth7","primaryActionHovered","Blkhhs4","alignItems","minHeight","clg4pj","Bkh64rk","typographyStyles","E5pizo","Cwk7ip","B3o57yi","singleColumnStyles","Bi2q7bf","mc9l5x","Bt984gj","isSingleColumn","sshi5w","styles","state","B6of3ja","className","qhf8xq","nk6f5a","Br312pm"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAYaA,uBAAAA;eAAAA;;;;;;iCANY;AAMlB,MAAMA,0BAA8D;UACzEC;mBACAC;UACAC;YACAC;kBACAC;aACAC;AACF;AAEA,MAAMC,qBAAqBC,IAAAA,8BAAAA,EAAAA,YAAgB,MAAA;IAAA;IAAA;IAAA;IAAA;CAAA;MACzCC,YAASC,IAAAA,yBAAA,EAAA;mBACTC;QACAC,QAAAA;QACAC,QAAAA;QAEAC,QAAA;QACAC,SAAA;iBACO;iBACHC;gBACAC;iBACAC;gBACF;QACFC,SAAA;QACAC,SAAA;iBACO;iBACHJ;gBACAC;gBACAC;gBACF;QACFG,SAAA;QAEAC,SAAA;QACAC,QAAA;gBACI;YAAG;YAAEvB;SAAAA;iBACLwB;iBACAC;gBACAC;gBACAC;gBACAC;iBACAC;iBACAC;iBACAC;YAAAA;YAAS;SAAA;iBACX;QACFC,QAAA;YAAA;YAAA;SAAA;QACFC,QAAA;QAEAC,QAAMC;YAAAA;YAAYC;SAAW;QAC3BlC,QAAAA;gBACEmC;YAAAA;YAAS;SAAA;gBACTC;gBACA7B;YAAAA;YAAS;SAAA;iBACT8B;gBACAT;YAAAA;YAAU;SAAA;iBACVU;iBACAC;iBACAC;iBACAC;YAAAA;YAAYC;SAAOC;gBACnBC;iBACAC;YAAAA;YAAc;SAAA;iBACdC;iBACAC;YAAAA;YAAeC;SAAAA;iBACftB;iBACGuB;YAAAA;YAAWC;SAAcC;iBACzBC;iBAA0BC;;iBAA+B;gBAAI;QAClEC,SAAA;QAEAC,SAAAA;gBACEzC;iBACAC;iBACAC;QACFwC,SAAA;QAEAvD,SAAM;gBACJM;gBACAkD;gBACAC;QACFC,QAAA;QACAvD,SAAS;iBACPoB;iBACS;iBACTI;gBACAO;gBACAC;iBAEAP;gBACAb;QACF4C,SAAA;QACA1D,QAAQ;gBACH2D;iBAEH;YAAA;YAAA;SAAA;iBACAtD;gBACA;YAAA;YAAA;SAAsB;;0BAEX;QACbuD,QAAA;QACA3D,SAAAA;iBACK0D;QACLE,QAAA;QAEAC,SAAA;QACAC,SAAAA;iBACE1D;QACF2D,SAAA;IACF;IAEAjE,MAAO;QACLkE,QAAA;QAEAC,SAAQC;QAERC,QAAMC;;aAEAxE;QACNyE,QAAMxE;QAKNwE,QAAMvE;QAMNuE,QAAMtE;QACNuE,SAAID;iBACFA;YAAMrE;YAAAA;SAAauE;QAMrBC,QAAA;QACAC,QAAIJ;gBACFA;QAMF5D,QAAA;QAEAC,SAAO2D;QACPK,SAAA"}
1
+ {"version":3,"sources":["usePromptStarterStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n makeResetStyles,\n mergeClasses,\n shorthands,\n typographyStyles,\n createFocusOutlineStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { PromptStarterSlots, PromptStarterState } from './PromptStarter.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptStarterClassNames: SlotClassNames<PromptStarterSlots> = {\n root: 'fai-PromptStarter',\n primaryAction: 'fai-PromptStarter__primaryAction',\n icon: 'fai-PromptStarter__icon',\n prompt: 'fai-PromptStarter__prompt',\n reasonMarker: 'fai-PromptStarter__reasonMarker',\n actions: 'fai-PromptStarter__actions',\n};\n\nconst useRootResetStyles = makeResetStyles({\n display: 'grid',\n gridTemplateColumns: '1fr auto',\n gridTemplateRows: 'max-content auto',\n minWidth: '214px',\n\n // Apply styles to the primary action on hover / active states\n '&:hover': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n '&:active': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow8,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n\n // Hide actions when not focused or hovered\n ':not(:focus-within):not(:hover)': {\n [`& .${promptStarterClassNames.actions}`]: {\n clip: 'rect(0px, 0px, 0px, 0px)',\n height: '1px',\n margin: '-1px',\n overflow: 'hidden',\n padding: '0px',\n width: '1px',\n position: 'absolute',\n opacity: 0,\n },\n },\n});\n\nconst useStyles = makeStyles({\n primaryAction: {\n gridRow: '1 / 3',\n gridColumn: '1 / 3',\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n borderRadius: '28px',\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground2,\n fontFamily: tokens.fontFamilyBase,\n cursor: 'pointer',\n outlineStyle: 'none',\n textAlign: 'left',\n rowGap: tokens.spacingHorizontalS,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,\n ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n ...createFocusOutlineStyle({ style: { outlineRadius: '28px' } }),\n },\n\n primaryActionHovered: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n minHeight: tokens.spacingVerticalXXL,\n },\n actions: {\n margin: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}\n ${tokens.spacingVerticalNone} ${tokens.spacingHorizontalNone}`,\n position: 'relative',\n gridRow: '1 / 2',\n gridColumn: '2 / 3',\n\n opacity: 1,\n transition: `opacity ${tokens.durationFast} ${tokens.curveLinear}`,\n },\n prompt: {\n ...typographyStyles.body1Strong,\n\n // Truncate text after two lines.\n display: '-webkit-box',\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n overflowY: 'hidden',\n },\n reasonMarker: {\n ...typographyStyles.caption2,\n },\n});\n\nconst useSingleColumnStyles = makeStyles({\n primaryAction: {\n borderRadius: tokens.borderRadius2XL,\n ...createFocusOutlineStyle({ style: { outlineRadius: tokens.borderRadius2XL } }),\n },\n prompt: {\n ...typographyStyles.caption1Strong,\n },\n});\n\nexport const usePromptStarterStyles_unstable = (state: PromptStarterState): PromptStarterState => {\n 'use no memo';\n\n const { isSingleColumn } = state;\n\n const styles = useStyles();\n const rootResetStyles = useRootResetStyles();\n const singleColumnStyles = useSingleColumnStyles();\n state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);\n state.primaryAction.className = mergeClasses(\n promptStarterClassNames.primaryAction,\n styles.primaryAction,\n isSingleColumn && singleColumnStyles.primaryAction,\n state.primaryAction.className,\n );\n if (state.icon) {\n state.icon.className = mergeClasses(promptStarterClassNames.icon, styles.icon, state.icon.className);\n }\n state.prompt.className = mergeClasses(\n promptStarterClassNames.prompt,\n styles.prompt,\n isSingleColumn && singleColumnStyles.prompt,\n state.prompt.className,\n );\n if (state.reasonMarker) {\n state.reasonMarker.className = mergeClasses(\n promptStarterClassNames.reasonMarker,\n styles.reasonMarker,\n state.reasonMarker.className,\n );\n }\n if (state.actions) {\n state.actions.className = mergeClasses(promptStarterClassNames.actions, styles.actions, state.actions.className);\n }\n\n return state;\n};\n"],"names":["promptStarterClassNames","root","primaryAction","icon","prompt","reasonMarker","actions","useRootResetStyles","makeResetStyles","display","__styles","gridTemplateColumns","gridTemplateRows","minWidth","h3tjnc","Bw0ie65","boxShadow","transform","transition","Beyfa6y","Bbmb7ep","Bahqtrf","Bceei9c","oeaueh","clip","height","margin","overflow","padding","width","position","opacity","ibv6hh","icvyot","vrafjx","useStyles","makeStyles","gridRow","gridColumn","flexDirection","borderRadius","backgroundColor","color","fontFamily","tokens","fontFamilyBase","cursor","outlineStyle","textAlign","rowGap","spacingHorizontalS","shorthands","border","strokeWidthThin","createFocusOutlineStyle","style","Boxcth7","primaryActionHovered","Blkhhs4","alignItems","minHeight","clg4pj","Bkh64rk","typographyStyles","E5pizo","Cwk7ip","B3o57yi","Bmy1vo4","useSingleColumnStyles","Frg6f3","t21cq0","B6of3ja","usePromptStarterStyles_unstable","B74szlk","qhf8xq","isSingleColumn","nk6f5a","styles","Ijaq50","rootResetStyles","singleColumnStyles","state","Beweih1","Bn62ygk","Bkqvd7p","Bi2q7bf","Be2twd7"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAYaA,uBAAAA;eAAAA;;;;;;iCANY;AAMlB,MAAMA,0BAA8D;UACzEC;mBACAC;UACAC;YACAC;kBACAC;aACAC;AACF;AAEA,MAAMC,qBAAqBC,IAAAA,8BAAAA,EAAAA,YAAgB,MAAA;IAAA;IAAA;IAAA;IAAA;CAAA;MACzCC,YAASC,IAAAA,yBAAA,EAAA;mBACTC;QACAC,QAAAA;QACAC,QAAAA;QAEAC,QAAA;QACAC,SAAA;iBACO;iBACHC;gBACAC;iBACAC;gBACF;QACFC,SAAA;QACAC,SAAA;iBACO;iBACHJ;gBACAC;gBACAC;gBACF;QACFG,SAAA;QAEAC,SAAA;QACAC,QAAA;gBACI;YAAG;YAAEvB;SAAAA;iBACLwB;iBACAC;gBACAC;gBACAC;gBACAC;iBACAC;iBACAC;iBACAC;YAAAA;YAAS;SAAA;iBACX;QACFC,QAAA;YAAA;YAAA;SAAA;QACFC,QAAA;QAEAC,QAAMC;YAAAA;YAAYC;SAAW;QAC3BlC,QAAAA;gBACEmC;YAAAA;YAAS;SAAA;gBACTC;gBACA7B;YAAAA;YAAS;SAAA;iBACT8B;gBACAT;YAAAA;YAAU;SAAA;iBACVU;iBACAC;iBACAC;iBACAC;YAAAA;YAAYC;SAAOC;gBACnBC;iBACAC;YAAAA;YAAc;SAAA;iBACdC;iBACAC;YAAAA;YAAeC;SAAAA;iBACftB;iBACGuB;YAAAA;YAAWC;SAAcC;iBACzBC;iBAA0BC;;iBAA+B;gBAAI;QAClEC,SAAA;QAEAC,SAAAA;gBACEzC;iBACAC;iBACAC;QACFwC,SAAA;QAEAvD,SAAM;gBACJM;gBACAkD;gBACAC;QACFC,QAAA;QACAvD,SAAS;iBACPoB;iBACS;iBACTI;gBACAO;gBACAC;iBAEAP;gBACAb;QACF4C,SAAA;QACA1D,QAAQ;gBACH2D;iBAEH;YAAA;YAAA;SAAA;iBACAtD;gBACA;YAAA;YAAA;SAAsB;;0BAEX;QACbuD,QAAA;QACA3D,SAAAA;iBACK0D;QACLE,QAAA;QACFC,SAAA;QAEAC,SAAMC;QACJlE,SAAAA;iBACEsC;;;;iBAC4E;gBAAI;;aAElFpC;gBACK2D;QACLM,QAAA;QACFC,QAAA;QAEAC,SAAaC;QACXC,SAAA;YAAA;YAAA;SAAA;QAEAC,QAAQC;QAERC,QAAMC;QACNC,QAAMC;QACNjE,QAAMkE;QACNC,SAAMhF;QACNgF,SAAM/E;QAMNgF,SAAID;gBACFA;QACFE,SAAA;QACAF,QAAM7E;QAMN8D,SAAIe;iBACFA;QAKFG,SAAA;QACAC,SAAIJ;;YAEJ;QAEA5D,SAAO4D;QACPK,SAAA"}
@@ -112,10 +112,19 @@ const useStyles = (0, _reactcomponents.makeStyles)({
112
112
  },
113
113
  reasonMarker: {
114
114
  ..._reactcomponents.typographyStyles.caption2
115
+ }
116
+ });
117
+ const useSingleColumnStyles = (0, _reactcomponents.makeStyles)({
118
+ primaryAction: {
119
+ borderRadius: _tokens.tokens.borderRadius2XL,
120
+ ...(0, _reactcomponents.createFocusOutlineStyle)({
121
+ style: {
122
+ outlineRadius: _tokens.tokens.borderRadius2XL
123
+ }
124
+ })
115
125
  },
116
- // Hide icon, actions, and reason marker in single column appearance
117
- singleColumnStyles: {
118
- display: 'none'
126
+ prompt: {
127
+ ..._reactcomponents.typographyStyles.caption1Strong
119
128
  }
120
129
  });
121
130
  const usePromptStarterStyles_unstable = (state)=>{
@@ -123,15 +132,18 @@ const usePromptStarterStyles_unstable = (state)=>{
123
132
  const { isSingleColumn } = state;
124
133
  const styles = useStyles();
125
134
  const rootResetStyles = useRootResetStyles();
135
+ const singleColumnStyles = useSingleColumnStyles();
126
136
  state.root.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.root, rootResetStyles, state.root.className);
127
- state.primaryAction.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.primaryAction, styles.primaryAction, state.primaryAction.className);
128
- state.icon.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.icon, styles.icon, isSingleColumn && styles.singleColumnStyles, state.icon.className);
129
- state.prompt.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.prompt, styles.prompt, state.prompt.className);
137
+ state.primaryAction.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.primaryAction, styles.primaryAction, isSingleColumn && singleColumnStyles.primaryAction, state.primaryAction.className);
138
+ if (state.icon) {
139
+ state.icon.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.icon, styles.icon, state.icon.className);
140
+ }
141
+ state.prompt.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.prompt, styles.prompt, isSingleColumn && singleColumnStyles.prompt, state.prompt.className);
130
142
  if (state.reasonMarker) {
131
- state.reasonMarker.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.reasonMarker, styles.reasonMarker, isSingleColumn && styles.singleColumnStyles, state.reasonMarker.className);
143
+ state.reasonMarker.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.reasonMarker, styles.reasonMarker, state.reasonMarker.className);
132
144
  }
133
145
  if (state.actions) {
134
- state.actions.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.actions, styles.actions, isSingleColumn && styles.singleColumnStyles, state.actions.className);
146
+ state.actions.className = (0, _reactcomponents.mergeClasses)(promptStarterClassNames.actions, styles.actions, state.actions.className);
135
147
  }
136
148
  return state;
137
149
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["usePromptStarterStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n makeResetStyles,\n mergeClasses,\n shorthands,\n typographyStyles,\n createFocusOutlineStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { PromptStarterSlots, PromptStarterState } from './PromptStarter.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptStarterClassNames: SlotClassNames<PromptStarterSlots> = {\n root: 'fai-PromptStarter',\n primaryAction: 'fai-PromptStarter__primaryAction',\n icon: 'fai-PromptStarter__icon',\n prompt: 'fai-PromptStarter__prompt',\n reasonMarker: 'fai-PromptStarter__reasonMarker',\n actions: 'fai-PromptStarter__actions',\n};\n\nconst useRootResetStyles = makeResetStyles({\n display: 'grid',\n gridTemplateColumns: '1fr auto',\n gridTemplateRows: 'max-content auto',\n minWidth: '214px',\n\n // Apply styles to the primary action on hover / active states\n '&:hover': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n '&:active': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow8,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n\n // Hide actions when not focused or hovered\n ':not(:focus-within):not(:hover)': {\n [`& .${promptStarterClassNames.actions}`]: {\n clip: 'rect(0px, 0px, 0px, 0px)',\n height: '1px',\n margin: '-1px',\n overflow: 'hidden',\n padding: '0px',\n width: '1px',\n position: 'absolute',\n opacity: 0,\n },\n },\n});\n\nconst useStyles = makeStyles({\n primaryAction: {\n gridRow: '1 / 3',\n gridColumn: '1 / 3',\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n borderRadius: '28px',\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground2,\n fontFamily: tokens.fontFamilyBase,\n cursor: 'pointer',\n outlineStyle: 'none',\n textAlign: 'left',\n rowGap: tokens.spacingHorizontalS,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,\n ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n ...createFocusOutlineStyle({ style: { outlineRadius: '28px' } }),\n },\n\n primaryActionHovered: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n minHeight: tokens.spacingVerticalXXL,\n },\n actions: {\n margin: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}\n ${tokens.spacingVerticalNone} ${tokens.spacingHorizontalNone}`,\n position: 'relative',\n gridRow: '1 / 2',\n gridColumn: '2 / 3',\n\n opacity: 1,\n transition: `opacity ${tokens.durationFast} ${tokens.curveLinear}`,\n },\n prompt: {\n ...typographyStyles.body1Strong,\n\n // Truncate text after two lines.\n display: '-webkit-box',\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n overflowY: 'hidden',\n },\n reasonMarker: {\n ...typographyStyles.caption2,\n },\n\n // Hide icon, actions, and reason marker in single column appearance\n singleColumnStyles: {\n display: 'none',\n },\n});\n\nexport const usePromptStarterStyles_unstable = (state: PromptStarterState): PromptStarterState => {\n 'use no memo';\n\n const { isSingleColumn } = state;\n\n const styles = useStyles();\n const rootResetStyles = useRootResetStyles();\n state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);\n state.primaryAction.className = mergeClasses(\n promptStarterClassNames.primaryAction,\n styles.primaryAction,\n state.primaryAction.className,\n );\n state.icon.className = mergeClasses(\n promptStarterClassNames.icon,\n styles.icon,\n isSingleColumn && styles.singleColumnStyles,\n state.icon.className,\n );\n state.prompt.className = mergeClasses(promptStarterClassNames.prompt, styles.prompt, state.prompt.className);\n if (state.reasonMarker) {\n state.reasonMarker.className = mergeClasses(\n promptStarterClassNames.reasonMarker,\n styles.reasonMarker,\n isSingleColumn && styles.singleColumnStyles,\n state.reasonMarker.className,\n );\n }\n if (state.actions) {\n state.actions.className = mergeClasses(\n promptStarterClassNames.actions,\n styles.actions,\n isSingleColumn && styles.singleColumnStyles,\n state.actions.className,\n );\n }\n\n return state;\n};\n"],"names":["promptStarterClassNames","usePromptStarterStyles_unstable","root","primaryAction","icon","prompt","reasonMarker","actions","useRootResetStyles","makeResetStyles","display","gridTemplateColumns","gridTemplateRows","minWidth","boxShadow","tokens","shadow16","transform","transition","durationNormal","curveDecelerateMin","shadow8","clip","height","margin","overflow","padding","width","position","opacity","useStyles","makeStyles","gridRow","gridColumn","flexDirection","borderRadius","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground2","fontFamily","fontFamilyBase","cursor","outlineStyle","textAlign","rowGap","spacingHorizontalS","spacingVerticalL","spacingHorizontalL","shorthands","border","strokeWidthThin","colorNeutralStroke2","createFocusOutlineStyle","style","outlineRadius","primaryActionHovered","alignItems","minHeight","spacingVerticalXXL","spacingVerticalNone","spacingHorizontalNone","durationFast","curveLinear","typographyStyles","body1Strong","overflowY","caption2","singleColumnStyles","state","isSingleColumn","styles","rootResetStyles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["usePromptStarterStyles.styles.ts"],"sourcesContent":["import {\n makeStyles,\n makeResetStyles,\n mergeClasses,\n shorthands,\n typographyStyles,\n createFocusOutlineStyle,\n} from '@fluentui/react-components';\nimport { tokens } from '@fluentui-copilot/tokens';\nimport type { PromptStarterSlots, PromptStarterState } from './PromptStarter.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const promptStarterClassNames: SlotClassNames<PromptStarterSlots> = {\n root: 'fai-PromptStarter',\n primaryAction: 'fai-PromptStarter__primaryAction',\n icon: 'fai-PromptStarter__icon',\n prompt: 'fai-PromptStarter__prompt',\n reasonMarker: 'fai-PromptStarter__reasonMarker',\n actions: 'fai-PromptStarter__actions',\n};\n\nconst useRootResetStyles = makeResetStyles({\n display: 'grid',\n gridTemplateColumns: '1fr auto',\n gridTemplateRows: 'max-content auto',\n minWidth: '214px',\n\n // Apply styles to the primary action on hover / active states\n '&:hover': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n '&:active': {\n [`& .${promptStarterClassNames.primaryAction}`]: {\n boxShadow: tokens.shadow8,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n },\n\n // Hide actions when not focused or hovered\n ':not(:focus-within):not(:hover)': {\n [`& .${promptStarterClassNames.actions}`]: {\n clip: 'rect(0px, 0px, 0px, 0px)',\n height: '1px',\n margin: '-1px',\n overflow: 'hidden',\n padding: '0px',\n width: '1px',\n position: 'absolute',\n opacity: 0,\n },\n },\n});\n\nconst useStyles = makeStyles({\n primaryAction: {\n gridRow: '1 / 3',\n gridColumn: '1 / 3',\n display: 'flex',\n flexDirection: 'column',\n position: 'relative',\n borderRadius: '28px',\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground2,\n fontFamily: tokens.fontFamilyBase,\n cursor: 'pointer',\n outlineStyle: 'none',\n textAlign: 'left',\n rowGap: tokens.spacingHorizontalS,\n padding: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}`,\n ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n ...createFocusOutlineStyle({ style: { outlineRadius: '28px' } }),\n },\n\n primaryActionHovered: {\n boxShadow: tokens.shadow16,\n transform: 'scale(1.03)',\n transition: `transform ${tokens.durationNormal} ${tokens.curveDecelerateMin}`,\n },\n\n icon: {\n display: 'flex',\n alignItems: 'center',\n minHeight: tokens.spacingVerticalXXL,\n },\n actions: {\n margin: `${tokens.spacingVerticalL} ${tokens.spacingHorizontalL}\n ${tokens.spacingVerticalNone} ${tokens.spacingHorizontalNone}`,\n position: 'relative',\n gridRow: '1 / 2',\n gridColumn: '2 / 3',\n\n opacity: 1,\n transition: `opacity ${tokens.durationFast} ${tokens.curveLinear}`,\n },\n prompt: {\n ...typographyStyles.body1Strong,\n\n // Truncate text after two lines.\n display: '-webkit-box',\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n overflowY: 'hidden',\n },\n reasonMarker: {\n ...typographyStyles.caption2,\n },\n});\n\nconst useSingleColumnStyles = makeStyles({\n primaryAction: {\n borderRadius: tokens.borderRadius2XL,\n ...createFocusOutlineStyle({ style: { outlineRadius: tokens.borderRadius2XL } }),\n },\n prompt: {\n ...typographyStyles.caption1Strong,\n },\n});\n\nexport const usePromptStarterStyles_unstable = (state: PromptStarterState): PromptStarterState => {\n 'use no memo';\n\n const { isSingleColumn } = state;\n\n const styles = useStyles();\n const rootResetStyles = useRootResetStyles();\n const singleColumnStyles = useSingleColumnStyles();\n state.root.className = mergeClasses(promptStarterClassNames.root, rootResetStyles, state.root.className);\n state.primaryAction.className = mergeClasses(\n promptStarterClassNames.primaryAction,\n styles.primaryAction,\n isSingleColumn && singleColumnStyles.primaryAction,\n state.primaryAction.className,\n );\n if (state.icon) {\n state.icon.className = mergeClasses(promptStarterClassNames.icon, styles.icon, state.icon.className);\n }\n state.prompt.className = mergeClasses(\n promptStarterClassNames.prompt,\n styles.prompt,\n isSingleColumn && singleColumnStyles.prompt,\n state.prompt.className,\n );\n if (state.reasonMarker) {\n state.reasonMarker.className = mergeClasses(\n promptStarterClassNames.reasonMarker,\n styles.reasonMarker,\n state.reasonMarker.className,\n );\n }\n if (state.actions) {\n state.actions.className = mergeClasses(promptStarterClassNames.actions, styles.actions, state.actions.className);\n }\n\n return state;\n};\n"],"names":["promptStarterClassNames","usePromptStarterStyles_unstable","root","primaryAction","icon","prompt","reasonMarker","actions","useRootResetStyles","makeResetStyles","display","gridTemplateColumns","gridTemplateRows","minWidth","boxShadow","tokens","shadow16","transform","transition","durationNormal","curveDecelerateMin","shadow8","clip","height","margin","overflow","padding","width","position","opacity","useStyles","makeStyles","gridRow","gridColumn","flexDirection","borderRadius","backgroundColor","colorNeutralBackground1","color","colorNeutralForeground2","fontFamily","fontFamilyBase","cursor","outlineStyle","textAlign","rowGap","spacingHorizontalS","spacingVerticalL","spacingHorizontalL","shorthands","border","strokeWidthThin","colorNeutralStroke2","createFocusOutlineStyle","style","outlineRadius","primaryActionHovered","alignItems","minHeight","spacingVerticalXXL","spacingVerticalNone","spacingHorizontalNone","durationFast","curveLinear","typographyStyles","body1Strong","overflowY","caption2","useSingleColumnStyles","borderRadius2XL","caption1Strong","state","isSingleColumn","styles","rootResetStyles","singleColumnStyles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAYaA,uBAAAA;eAAAA;;IA+GAC,+BAAAA;eAAAA;;;iCApHN;wBACgB;AAIhB,MAAMD,0BAA8D;IACzEE,MAAM;IACNC,eAAe;IACfC,MAAM;IACNC,QAAQ;IACRC,cAAc;IACdC,SAAS;AACX;AAEA,MAAMC,qBAAqBC,IAAAA,gCAAAA,EAAgB;IACzCC,SAAS;IACTC,qBAAqB;IACrBC,kBAAkB;IAClBC,UAAU;IAEV,8DAA8D;IAC9D,WAAW;QACT,CAAC,CAAC,GAAG,EAAEb,wBAAwBG,aAAa,CAAC,CAAC,CAAC,EAAE;YAC/CW,WAAWC,cAAAA,CAAOC,QAAQ;YAC1BC,WAAW;YACXC,YAAY,CAAC,UAAU,EAAEH,cAAAA,CAAOI,cAAc,CAAC,CAAC,EAAEJ,cAAAA,CAAOK,kBAAkB,CAAC,CAAC;QAC/E;IACF;IACA,YAAY;QACV,CAAC,CAAC,GAAG,EAAEpB,wBAAwBG,aAAa,CAAC,CAAC,CAAC,EAAE;YAC/CW,WAAWC,cAAAA,CAAOM,OAAO;YACzBJ,WAAW;YACXC,YAAY,CAAC,UAAU,EAAEH,cAAAA,CAAOI,cAAc,CAAC,CAAC,EAAEJ,cAAAA,CAAOK,kBAAkB,CAAC,CAAC;QAC/E;IACF;IAEA,2CAA2C;IAC3C,mCAAmC;QACjC,CAAC,CAAC,GAAG,EAAEpB,wBAAwBO,OAAO,CAAC,CAAC,CAAC,EAAE;YACzCe,MAAM;YACNC,QAAQ;YACRC,QAAQ;YACRC,UAAU;YACVC,SAAS;YACTC,OAAO;YACPC,UAAU;YACVC,SAAS;QACX;IACF;AACF;AAEA,MAAMC,YAAYC,IAAAA,2BAAAA,EAAW;IAC3B5B,eAAe;QACb6B,SAAS;QACTC,YAAY;QACZvB,SAAS;QACTwB,eAAe;QACfN,UAAU;QACVO,cAAc;QACdC,iBAAiBrB,cAAAA,CAAOsB,uBAAuB;QAC/CC,OAAOvB,cAAAA,CAAOwB,uBAAuB;QACrCC,YAAYzB,cAAAA,CAAO0B,cAAc;QACjCC,QAAQ;QACRC,cAAc;QACdC,WAAW;QACXC,QAAQ9B,cAAAA,CAAO+B,kBAAkB;QACjCpB,SAAS,CAAC,EAAEX,cAAAA,CAAOgC,gBAAgB,CAAC,CAAC,EAAEhC,cAAAA,CAAOiC,kBAAkB,CAAC,CAAC;QAClE,GAAGC,2BAAAA,CAAWC,MAAM,CAACnC,cAAAA,CAAOoC,eAAe,EAAE,SAASpC,cAAAA,CAAOqC,mBAAmB,CAAC;QACjF,GAAGC,IAAAA,wCAAAA,EAAwB;YAAEC,OAAO;gBAAEC,eAAe;YAAO;QAAE,EAAE;IAClE;IAEAC,sBAAsB;QACpB1C,WAAWC,cAAAA,CAAOC,QAAQ;QAC1BC,WAAW;QACXC,YAAY,CAAC,UAAU,EAAEH,cAAAA,CAAOI,cAAc,CAAC,CAAC,EAAEJ,cAAAA,CAAOK,kBAAkB,CAAC,CAAC;IAC/E;IAEAhB,MAAM;QACJM,SAAS;QACT+C,YAAY;QACZC,WAAW3C,cAAAA,CAAO4C,kBAAkB;IACtC;IACApD,SAAS;QACPiB,QAAQ,CAAC,EAAET,cAAAA,CAAOgC,gBAAgB,CAAC,CAAC,EAAEhC,cAAAA,CAAOiC,kBAAkB,CAAC;aACvD,EAAEjC,cAAAA,CAAO6C,mBAAmB,CAAC,CAAC,EAAE7C,cAAAA,CAAO8C,qBAAqB,CAAC,CAAC;QACvEjC,UAAU;QACVI,SAAS;QACTC,YAAY;QAEZJ,SAAS;QACTX,YAAY,CAAC,QAAQ,EAAEH,cAAAA,CAAO+C,YAAY,CAAC,CAAC,EAAE/C,cAAAA,CAAOgD,WAAW,CAAC,CAAC;IACpE;IACA1D,QAAQ;QACN,GAAG2D,iCAAAA,CAAiBC,WAAW;QAE/B,iCAAiC;QACjCvD,SAAS;QACT,sBAAsB;QACtB,sBAAsB;QACtBwD,WAAW;IACb;IACA5D,cAAc;QACZ,GAAG0D,iCAAAA,CAAiBG,QAAQ;IAC9B;AACF;AAEA,MAAMC,wBAAwBrC,IAAAA,2BAAAA,EAAW;IACvC5B,eAAe;QACbgC,cAAcpB,cAAAA,CAAOsD,eAAe;QACpC,GAAGhB,IAAAA,wCAAAA,EAAwB;YAAEC,OAAO;gBAAEC,eAAexC,cAAAA,CAAOsD,eAAe;YAAC;QAAE,EAAE;IAClF;IACAhE,QAAQ;QACN,GAAG2D,iCAAAA,CAAiBM,cAAc;IACpC;AACF;AAEO,MAAMrE,kCAAkC,CAACsE;IAC9C;IAEA,MAAM,EAAEC,cAAc,EAAE,GAAGD;IAE3B,MAAME,SAAS3C;IACf,MAAM4C,kBAAkBlE;IACxB,MAAMmE,qBAAqBP;IAC3BG,MAAMrE,IAAI,CAAC0E,SAAS,GAAGC,IAAAA,6BAAAA,EAAa7E,wBAAwBE,IAAI,EAAEwE,iBAAiBH,MAAMrE,IAAI,CAAC0E,SAAS;IACvGL,MAAMpE,aAAa,CAACyE,SAAS,GAAGC,IAAAA,6BAAAA,EAC9B7E,wBAAwBG,aAAa,EACrCsE,OAAOtE,aAAa,EACpBqE,kBAAkBG,mBAAmBxE,aAAa,EAClDoE,MAAMpE,aAAa,CAACyE,SAAS;IAE/B,IAAIL,MAAMnE,IAAI,EAAE;QACdmE,MAAMnE,IAAI,CAACwE,SAAS,GAAGC,IAAAA,6BAAAA,EAAa7E,wBAAwBI,IAAI,EAAEqE,OAAOrE,IAAI,EAAEmE,MAAMnE,IAAI,CAACwE,SAAS;IACrG;IACAL,MAAMlE,MAAM,CAACuE,SAAS,GAAGC,IAAAA,6BAAAA,EACvB7E,wBAAwBK,MAAM,EAC9BoE,OAAOpE,MAAM,EACbmE,kBAAkBG,mBAAmBtE,MAAM,EAC3CkE,MAAMlE,MAAM,CAACuE,SAAS;IAExB,IAAIL,MAAMjE,YAAY,EAAE;QACtBiE,MAAMjE,YAAY,CAACsE,SAAS,GAAGC,IAAAA,6BAAAA,EAC7B7E,wBAAwBM,YAAY,EACpCmE,OAAOnE,YAAY,EACnBiE,MAAMjE,YAAY,CAACsE,SAAS;IAEhC;IACA,IAAIL,MAAMhE,OAAO,EAAE;QACjBgE,MAAMhE,OAAO,CAACqE,SAAS,GAAGC,IAAAA,6BAAAA,EAAa7E,wBAAwBO,OAAO,EAAEkE,OAAOlE,OAAO,EAAEgE,MAAMhE,OAAO,CAACqE,SAAS;IACjH;IAEA,OAAOL;AACT"}
@@ -1 +1 @@
1
- {"version":3,"sources":["PromptStarterList.types.ts"],"sourcesContent":["import type { DesignVersion } from '@fluentui-copilot/react-provider';\nimport type {\n ComponentProps,\n ComponentState,\n Slot,\n Button,\n UseArrowNavigationGroupOptions,\n} from '@fluentui/react-components';\n\nexport type PromptStarterListSlots = {\n root: NonNullable<Slot<'div'>>;\n gridWrapper: NonNullable<Slot<'div'>>;\n expandButton?: Slot<typeof Button>;\n};\n\n/**\n * PromptStarterList Props\n */\nexport type PromptStarterListProps = ComponentProps<PromptStarterListSlots> &\n DesignVersion & {\n /**\n * Text for the expand button when the list is collapsed.\n *\n * default: \"Show more\"\n */\n expandButtonLabel?: string;\n /**\n * Text for the expand button when the list is expanded.\n *\n * default: \"Show less\"\n */\n collapseButtonLabel?: string;\n /**\n * Arrow navigation options. This can be used to customize Tabster's direction,\n * tab behavior, and memoization options.\n *\n * default: { axis: 'horizontal', memorizeCurrent: true }\n */\n arrowNavigationOptions?: UseArrowNavigationGroupOptions;\n };\n\n/**\n * State used in rendering PromptStarterList\n */\nexport type PromptStarterListState = ComponentState<PromptStarterListSlots> &\n Required<Pick<PromptStarterListProps, 'designVersion'>> & {\n numberOfColumns: number;\n isExpanded?: boolean;\n };\n\nexport type PromptStarterListContextValue = Pick<PromptStarterListState, 'numberOfColumns' | 'isExpanded'>;\n"],"names":[],"rangeMappings":"","mappings":""}
1
+ {"version":3,"sources":["PromptStarterList.types.ts"],"sourcesContent":["import type { DesignVersion } from '@fluentui-copilot/react-provider';\nimport type {\n ComponentProps,\n ComponentState,\n Slot,\n Button,\n UseArrowNavigationGroupOptions,\n} from '@fluentui/react-components';\n\nexport type PromptStarterListSlots = {\n root: NonNullable<Slot<'div'>>;\n gridWrapper: NonNullable<Slot<'div'>>;\n expandButton?: Slot<typeof Button>;\n};\n\n/**\n * PromptStarterList Props\n */\nexport type PromptStarterListProps = ComponentProps<Partial<PromptStarterListSlots>, 'gridWrapper'> &\n DesignVersion & {\n /**\n * Text for the expand button when the list is collapsed.\n *\n * default: \"Show more\"\n */\n expandButtonLabel?: string;\n /**\n * Text for the expand button when the list is expanded.\n *\n * default: \"Show less\"\n */\n collapseButtonLabel?: string;\n /**\n * Arrow navigation options. This can be used to customize Tabster's direction,\n * tab behavior, and memoization options.\n *\n * default: { axis: 'horizontal', memorizeCurrent: true }\n */\n arrowNavigationOptions?: UseArrowNavigationGroupOptions;\n };\n\n/**\n * State used in rendering PromptStarterList\n */\nexport type PromptStarterListState = ComponentState<PromptStarterListSlots> &\n Required<Pick<PromptStarterListProps, 'designVersion'>> & {\n numberOfColumns: number;\n isExpanded?: boolean;\n };\n\nexport type PromptStarterListContextValue = Pick<PromptStarterListState, 'numberOfColumns' | 'isExpanded'>;\n"],"names":[],"rangeMappings":"","mappings":""}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui-copilot/react-prompt-starter",
3
- "version": "0.10.3",
3
+ "version": "0.10.5",
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.12.3",
16
- "@fluentui-copilot/tokens": "^0.3.12",
15
+ "@fluentui-copilot/react-provider": "^0.12.4",
16
+ "@fluentui-copilot/tokens": "^0.3.13",
17
17
  "@swc/helpers": "^0.5.1"
18
18
  },
19
19
  "peerDependencies": {