@fluentui-copilot/react-preview 0.4.3 → 0.4.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.json CHANGED
@@ -2,7 +2,30 @@
2
2
  "name": "@fluentui-copilot/react-preview",
3
3
  "entries": [
4
4
  {
5
- "date": "Fri, 31 May 2024 18:42:05 GMT",
5
+ "date": "Thu, 13 Jun 2024 21:00:14 GMT",
6
+ "tag": "@fluentui-copilot/react-preview_v0.4.4",
7
+ "version": "0.4.4",
8
+ "comments": {
9
+ "none": [
10
+ {
11
+ "author": "estebanmu@microsoft.com",
12
+ "package": "@fluentui-copilot/react-preview",
13
+ "commit": "f17f78e440c2dc6b0cd7ac5ac998ccf7f5c475d0",
14
+ "comment": "chore: Disable typecheck for ssr-tests."
15
+ }
16
+ ],
17
+ "patch": [
18
+ {
19
+ "author": "Humberto.Morimoto@microsoft.com",
20
+ "package": "@fluentui-copilot/react-preview",
21
+ "commit": "c8d54cf5a0b9f000a1b90fd647c4559d76153f32",
22
+ "comment": "fix: Fixing PreviewHeader styles, taking previewSurfaceProps.children into account in hook, and improving docs."
23
+ }
24
+ ]
25
+ }
26
+ },
27
+ {
28
+ "date": "Fri, 31 May 2024 18:42:53 GMT",
6
29
  "tag": "@fluentui-copilot/react-preview_v0.4.3",
7
30
  "version": "0.4.3",
8
31
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,21 @@
1
1
  # Change Log - @fluentui-copilot/react-preview
2
2
 
3
- This log was last generated on Fri, 31 May 2024 18:42:05 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 13 Jun 2024 21:00:14 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [0.4.4](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-preview_v0.4.4)
8
+
9
+ Thu, 13 Jun 2024 21:00:14 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-preview_v0.4.3..@fluentui-copilot/react-preview_v0.4.4)
11
+
12
+ ### Patches
13
+
14
+ - fix: Fixing PreviewHeader styles, taking previewSurfaceProps.children into account in hook, and improving docs. ([PR #1702](https://github.com/microsoft/fluentai/pull/1702) by Humberto.Morimoto@microsoft.com)
15
+
7
16
  ## [0.4.3](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-preview_v0.4.3)
8
17
 
9
- Fri, 31 May 2024 18:42:05 GMT
18
+ Fri, 31 May 2024 18:42:53 GMT
10
19
  [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-preview_v0.4.2..@fluentui-copilot/react-preview_v0.4.3)
11
20
 
12
21
  ### Patches
@@ -15,7 +15,7 @@ const useActionsBaseClassName = __resetStyles("r1vsmujd", null, [".r1vsmujd{grid
15
15
  const useCitationBaseClassName = __resetStyles("r1ndcjgs", null, [".r1ndcjgs{grid-area:citation;}"]);
16
16
  const useLabelBaseClassName = __resetStyles("rctmm17", null, [".rctmm17{align-self:start;display:-webkit-box;grid-area:label;overflow-y:hidden;padding-top:calc((16px / 2) - (var(--lineHeightBase200) - var(--fontSizeBase200)));word-break:break-word;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase200);}"]);
17
17
  const useMediaBaseClassName = __resetStyles("rmteimt", null, [".rmteimt{grid-area:media;height:16px;line-height:0;width:16px;}", ".rmteimt>.fai-PreviewHeader__mediaChild{height:16px;width:16px;}"]);
18
- const useRootBaseClassName = __resetStyles("r1p46sa7", null, [".r1p46sa7{align-items:center;column-gap:var(--spacingHorizontalXS);display:grid;grid-template-areas:\"citation media label actions\" \". . label .\";grid-template-columns:min-content 16px 1fr min-content;grid-template-rows:24px auto;}"]);
18
+ const useRootBaseClassName = __resetStyles("r4h7o2l", null, [".r4h7o2l{align-items:center;column-gap:var(--spacingHorizontalXS);display:grid;grid-template-areas:\"citation media label actions\" \". . label .\";grid-template-columns:min-content min-content 1fr min-content;grid-template-rows:24px auto;}"]);
19
19
  /**
20
20
  * Apply styling to the PreviewHeader slots based on the state
21
21
  */
@@ -1 +1 @@
1
- {"version":3,"sources":["usePreviewHeaderStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, tokens, typographyStyles } from '@fluentui/react-components';\nimport type { PreviewHeaderSlots, PreviewHeaderState } from './PreviewHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const previewHeaderClassNames: SlotClassNames<PreviewHeaderSlots> = {\n root: 'fai-PreviewHeader',\n actions: 'fai-PreviewHeader__actions',\n citation: 'fai-PreviewHeader__citation',\n label: 'fai-PreviewHeader__label',\n media: 'fai-PreviewHeader__media',\n};\n\nexport const previewHeaderExtraClassNames = {\n mediaChild: 'fai-PreviewHeader__mediaChild',\n};\n\nconst labelFontSize = typographyStyles.caption1Strong.fontSize;\nconst labelLineHeight = typographyStyles.caption1Strong.lineHeight;\n\nconst useActionsBaseClassName = makeResetStyles({\n gridArea: 'actions',\n justifySelf: 'end',\n});\n\nconst useCitationBaseClassName = makeResetStyles({\n gridArea: 'citation',\n});\n\nconst useLabelBaseClassName = makeResetStyles({\n alignSelf: 'start',\n display: '-webkit-box',\n gridArea: 'label',\n overflowY: 'hidden',\n // 16px is the height of the tallest element within the preview header\n paddingTop: `calc((16px / 2) - (${labelLineHeight} - ${labelFontSize}))`,\n wordBreak: 'break-word',\n\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n\n ...typographyStyles.caption1Strong,\n});\n\nconst useMediaBaseClassName = makeResetStyles({\n gridArea: 'media',\n height: '16px',\n lineHeight: 0,\n width: '16px',\n\n [`> .${previewHeaderExtraClassNames.mediaChild}`]: {\n height: '16px',\n width: '16px',\n },\n});\n\nconst useRootBaseClassName = makeResetStyles({\n alignItems: 'center',\n columnGap: tokens.spacingHorizontalXS,\n display: 'grid',\n gridTemplateAreas: `\n \"citation media label actions\"\n \". . label .\"\n `,\n gridTemplateColumns: 'min-content 16px 1fr min-content',\n gridTemplateRows: '24px auto',\n});\n\n/**\n * Apply styling to the PreviewHeader slots based on the state\n */\nexport const usePreviewHeaderStyles_unstable = (state: PreviewHeaderState): PreviewHeaderState => {\n 'use no memo';\n\n const actionsBaseClassName = useActionsBaseClassName();\n const citationBaseClassName = useCitationBaseClassName();\n const labelBaseClassName = useLabelBaseClassName();\n const mediaBaseClassName = useMediaBaseClassName();\n const rootBaseClassName = useRootBaseClassName();\n\n state.root.className = mergeClasses(previewHeaderClassNames.root, rootBaseClassName, state.root.className);\n\n if (state.actions) {\n state.actions.className = mergeClasses(\n previewHeaderClassNames.actions,\n actionsBaseClassName,\n state.actions.className,\n );\n }\n\n if (state.citation) {\n state.citation.className = mergeClasses(\n previewHeaderClassNames.citation,\n citationBaseClassName,\n state.citation.className,\n );\n }\n\n state.label.className = mergeClasses(previewHeaderClassNames.label, labelBaseClassName, state.label.className);\n\n if (state.media) {\n state.media.className = mergeClasses(previewHeaderClassNames.media, mediaBaseClassName, state.media.className);\n }\n\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","tokens","typographyStyles","previewHeaderClassNames","root","actions","citation","label","media","previewHeaderExtraClassNames","mediaChild","labelFontSize","caption1Strong","fontSize","labelLineHeight","lineHeight","useActionsBaseClassName","gridArea","justifySelf","useCitationBaseClassName","useLabelBaseClassName","alignSelf","display","overflowY","paddingTop","wordBreak","useMediaBaseClassName","height","width","useRootBaseClassName","alignItems","columnGap","spacingHorizontalXS","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","usePreviewHeaderStyles_unstable","state","actionsBaseClassName","citationBaseClassName","labelBaseClassName","mediaBaseClassName","rootBaseClassName","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,EAAEC,MAAM,EAAEC,gBAAgB,QAAQ,6BAA6B;AAIrG,OAAO,MAAMC,0BAA8D;IACzEC,MAAM;IACNC,SAAS;IACTC,UAAU;IACVC,OAAO;IACPC,OAAO;AACT,EAAE;AAEF,OAAO,MAAMC,+BAA+B;IAC1CC,YAAY;AACd,EAAE;AAEF,MAAMC,gBAAgBT,iBAAiBU,cAAc,CAACC,QAAQ;AAC9D,MAAMC,kBAAkBZ,iBAAiBU,cAAc,CAACG,UAAU;AAElE,MAAMC,0BAA0BjB,gBAAgB;IAC9CkB,UAAU;IACVC,aAAa;AACf;AAEA,MAAMC,2BAA2BpB,gBAAgB;IAC/CkB,UAAU;AACZ;AAEA,MAAMG,wBAAwBrB,gBAAgB;IAC5CsB,WAAW;IACXC,SAAS;IACTL,UAAU;IACVM,WAAW;IACX,sEAAsE;IACtEC,YAAY,CAAC,mBAAmB,EAAEV,gBAAgB,GAAG,EAAEH,cAAc,EAAE,CAAC;IACxEc,WAAW;IAEX,sBAAsB;IACtB,sBAAsB;IAEtB,GAAGvB,iBAAiBU,cAAc;AACpC;AAEA,MAAMc,wBAAwB3B,gBAAgB;IAC5CkB,UAAU;IACVU,QAAQ;IACRZ,YAAY;IACZa,OAAO;IAEP,CAAC,CAAC,GAAG,EAAEnB,6BAA6BC,UAAU,CAAC,CAAC,CAAC,EAAE;QACjDiB,QAAQ;QACRC,OAAO;IACT;AACF;AAEA,MAAMC,uBAAuB9B,gBAAgB;IAC3C+B,YAAY;IACZC,WAAW9B,OAAO+B,mBAAmB;IACrCV,SAAS;IACTW,mBAAmB,CAAC;;;IAGlB,CAAC;IACHC,qBAAqB;IACrBC,kBAAkB;AACpB;AAEA;;CAEC,GACD,OAAO,MAAMC,kCAAkC,CAACC;IAC9C;IAEA,MAAMC,uBAAuBtB;IAC7B,MAAMuB,wBAAwBpB;IAC9B,MAAMqB,qBAAqBpB;IAC3B,MAAMqB,qBAAqBf;IAC3B,MAAMgB,oBAAoBb;IAE1BQ,MAAMjC,IAAI,CAACuC,SAAS,GAAG3C,aAAaG,wBAAwBC,IAAI,EAAEsC,mBAAmBL,MAAMjC,IAAI,CAACuC,SAAS;IAEzG,IAAIN,MAAMhC,OAAO,EAAE;QACjBgC,MAAMhC,OAAO,CAACsC,SAAS,GAAG3C,aACxBG,wBAAwBE,OAAO,EAC/BiC,sBACAD,MAAMhC,OAAO,CAACsC,SAAS;IAE3B;IAEA,IAAIN,MAAM/B,QAAQ,EAAE;QAClB+B,MAAM/B,QAAQ,CAACqC,SAAS,GAAG3C,aACzBG,wBAAwBG,QAAQ,EAChCiC,uBACAF,MAAM/B,QAAQ,CAACqC,SAAS;IAE5B;IAEAN,MAAM9B,KAAK,CAACoC,SAAS,GAAG3C,aAAaG,wBAAwBI,KAAK,EAAEiC,oBAAoBH,MAAM9B,KAAK,CAACoC,SAAS;IAE7G,IAAIN,MAAM7B,KAAK,EAAE;QACf6B,MAAM7B,KAAK,CAACmC,SAAS,GAAG3C,aAAaG,wBAAwBK,KAAK,EAAEiC,oBAAoBJ,MAAM7B,KAAK,CAACmC,SAAS;IAC/G;IAEA,OAAON;AACT,EAAE"}
1
+ {"version":3,"sources":["usePreviewHeaderStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, tokens, typographyStyles } from '@fluentui/react-components';\nimport type { PreviewHeaderSlots, PreviewHeaderState } from './PreviewHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const previewHeaderClassNames: SlotClassNames<PreviewHeaderSlots> = {\n root: 'fai-PreviewHeader',\n actions: 'fai-PreviewHeader__actions',\n citation: 'fai-PreviewHeader__citation',\n label: 'fai-PreviewHeader__label',\n media: 'fai-PreviewHeader__media',\n};\n\nexport const previewHeaderExtraClassNames = {\n mediaChild: 'fai-PreviewHeader__mediaChild',\n};\n\nconst labelFontSize = typographyStyles.caption1Strong.fontSize;\nconst labelLineHeight = typographyStyles.caption1Strong.lineHeight;\n\nconst useActionsBaseClassName = makeResetStyles({\n gridArea: 'actions',\n justifySelf: 'end',\n});\n\nconst useCitationBaseClassName = makeResetStyles({\n gridArea: 'citation',\n});\n\nconst useLabelBaseClassName = makeResetStyles({\n alignSelf: 'start',\n display: '-webkit-box',\n gridArea: 'label',\n overflowY: 'hidden',\n // 16px is the height of the tallest element within the preview header\n paddingTop: `calc((16px / 2) - (${labelLineHeight} - ${labelFontSize}))`,\n wordBreak: 'break-word',\n\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n\n ...typographyStyles.caption1Strong,\n});\n\nconst useMediaBaseClassName = makeResetStyles({\n gridArea: 'media',\n height: '16px',\n lineHeight: 0,\n width: '16px',\n\n [`> .${previewHeaderExtraClassNames.mediaChild}`]: {\n height: '16px',\n width: '16px',\n },\n});\n\nconst useRootBaseClassName = makeResetStyles({\n alignItems: 'center',\n columnGap: tokens.spacingHorizontalXS,\n display: 'grid',\n gridTemplateAreas: `\n \"citation media label actions\"\n \". . label .\"\n `,\n gridTemplateColumns: 'min-content min-content 1fr min-content',\n gridTemplateRows: '24px auto',\n});\n\n/**\n * Apply styling to the PreviewHeader slots based on the state\n */\nexport const usePreviewHeaderStyles_unstable = (state: PreviewHeaderState): PreviewHeaderState => {\n 'use no memo';\n\n const actionsBaseClassName = useActionsBaseClassName();\n const citationBaseClassName = useCitationBaseClassName();\n const labelBaseClassName = useLabelBaseClassName();\n const mediaBaseClassName = useMediaBaseClassName();\n const rootBaseClassName = useRootBaseClassName();\n\n state.root.className = mergeClasses(previewHeaderClassNames.root, rootBaseClassName, state.root.className);\n\n if (state.actions) {\n state.actions.className = mergeClasses(\n previewHeaderClassNames.actions,\n actionsBaseClassName,\n state.actions.className,\n );\n }\n\n if (state.citation) {\n state.citation.className = mergeClasses(\n previewHeaderClassNames.citation,\n citationBaseClassName,\n state.citation.className,\n );\n }\n\n state.label.className = mergeClasses(previewHeaderClassNames.label, labelBaseClassName, state.label.className);\n\n if (state.media) {\n state.media.className = mergeClasses(previewHeaderClassNames.media, mediaBaseClassName, state.media.className);\n }\n\n return state;\n};\n"],"names":["makeResetStyles","mergeClasses","tokens","typographyStyles","previewHeaderClassNames","root","actions","citation","label","media","previewHeaderExtraClassNames","mediaChild","labelFontSize","caption1Strong","fontSize","labelLineHeight","lineHeight","useActionsBaseClassName","gridArea","justifySelf","useCitationBaseClassName","useLabelBaseClassName","alignSelf","display","overflowY","paddingTop","wordBreak","useMediaBaseClassName","height","width","useRootBaseClassName","alignItems","columnGap","spacingHorizontalXS","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","usePreviewHeaderStyles_unstable","state","actionsBaseClassName","citationBaseClassName","labelBaseClassName","mediaBaseClassName","rootBaseClassName","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,EAAEC,MAAM,EAAEC,gBAAgB,QAAQ,6BAA6B;AAIrG,OAAO,MAAMC,0BAA8D;IACzEC,MAAM;IACNC,SAAS;IACTC,UAAU;IACVC,OAAO;IACPC,OAAO;AACT,EAAE;AAEF,OAAO,MAAMC,+BAA+B;IAC1CC,YAAY;AACd,EAAE;AAEF,MAAMC,gBAAgBT,iBAAiBU,cAAc,CAACC,QAAQ;AAC9D,MAAMC,kBAAkBZ,iBAAiBU,cAAc,CAACG,UAAU;AAElE,MAAMC,0BAA0BjB,gBAAgB;IAC9CkB,UAAU;IACVC,aAAa;AACf;AAEA,MAAMC,2BAA2BpB,gBAAgB;IAC/CkB,UAAU;AACZ;AAEA,MAAMG,wBAAwBrB,gBAAgB;IAC5CsB,WAAW;IACXC,SAAS;IACTL,UAAU;IACVM,WAAW;IACX,sEAAsE;IACtEC,YAAY,CAAC,mBAAmB,EAAEV,gBAAgB,GAAG,EAAEH,cAAc,EAAE,CAAC;IACxEc,WAAW;IAEX,sBAAsB;IACtB,sBAAsB;IAEtB,GAAGvB,iBAAiBU,cAAc;AACpC;AAEA,MAAMc,wBAAwB3B,gBAAgB;IAC5CkB,UAAU;IACVU,QAAQ;IACRZ,YAAY;IACZa,OAAO;IAEP,CAAC,CAAC,GAAG,EAAEnB,6BAA6BC,UAAU,CAAC,CAAC,CAAC,EAAE;QACjDiB,QAAQ;QACRC,OAAO;IACT;AACF;AAEA,MAAMC,uBAAuB9B,gBAAgB;IAC3C+B,YAAY;IACZC,WAAW9B,OAAO+B,mBAAmB;IACrCV,SAAS;IACTW,mBAAmB,CAAC;;;IAGlB,CAAC;IACHC,qBAAqB;IACrBC,kBAAkB;AACpB;AAEA;;CAEC,GACD,OAAO,MAAMC,kCAAkC,CAACC;IAC9C;IAEA,MAAMC,uBAAuBtB;IAC7B,MAAMuB,wBAAwBpB;IAC9B,MAAMqB,qBAAqBpB;IAC3B,MAAMqB,qBAAqBf;IAC3B,MAAMgB,oBAAoBb;IAE1BQ,MAAMjC,IAAI,CAACuC,SAAS,GAAG3C,aAAaG,wBAAwBC,IAAI,EAAEsC,mBAAmBL,MAAMjC,IAAI,CAACuC,SAAS;IAEzG,IAAIN,MAAMhC,OAAO,EAAE;QACjBgC,MAAMhC,OAAO,CAACsC,SAAS,GAAG3C,aACxBG,wBAAwBE,OAAO,EAC/BiC,sBACAD,MAAMhC,OAAO,CAACsC,SAAS;IAE3B;IAEA,IAAIN,MAAM/B,QAAQ,EAAE;QAClB+B,MAAM/B,QAAQ,CAACqC,SAAS,GAAG3C,aACzBG,wBAAwBG,QAAQ,EAChCiC,uBACAF,MAAM/B,QAAQ,CAACqC,SAAS;IAE5B;IAEAN,MAAM9B,KAAK,CAACoC,SAAS,GAAG3C,aAAaG,wBAAwBI,KAAK,EAAEiC,oBAAoBH,MAAM9B,KAAK,CAACoC,SAAS;IAE7G,IAAIN,MAAM7B,KAAK,EAAE;QACf6B,MAAM7B,KAAK,CAACmC,SAAS,GAAG3C,aAAaG,wBAAwBK,KAAK,EAAEiC,oBAAoBJ,MAAM7B,KAAK,CAACmC,SAAS;IAC/G;IAEA,OAAON;AACT,EAAE"}
@@ -45,8 +45,8 @@ const useMediaBaseClassName = (0, _reactcomponents.__resetStyles)("rmteimt", nul
45
45
  ".rmteimt{grid-area:media;height:16px;line-height:0;width:16px;}",
46
46
  ".rmteimt>.fai-PreviewHeader__mediaChild{height:16px;width:16px;}"
47
47
  ]);
48
- const useRootBaseClassName = (0, _reactcomponents.__resetStyles)("r1p46sa7", null, [
49
- ".r1p46sa7{align-items:center;column-gap:var(--spacingHorizontalXS);display:grid;grid-template-areas:\"citation media label actions\" \". . label .\";grid-template-columns:min-content 16px 1fr min-content;grid-template-rows:24px auto;}"
48
+ const useRootBaseClassName = (0, _reactcomponents.__resetStyles)("r4h7o2l", null, [
49
+ ".r4h7o2l{align-items:center;column-gap:var(--spacingHorizontalXS);display:grid;grid-template-areas:\"citation media label actions\" \". . label .\";grid-template-columns:min-content min-content 1fr min-content;grid-template-rows:24px auto;}"
50
50
  ]);
51
51
  const usePreviewHeaderStyles_unstable = (state)=>{
52
52
  'use no memo';
@@ -1 +1 @@
1
- {"version":3,"sources":["usePreviewHeaderStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, tokens, typographyStyles } from '@fluentui/react-components';\nimport type { PreviewHeaderSlots, PreviewHeaderState } from './PreviewHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const previewHeaderClassNames: SlotClassNames<PreviewHeaderSlots> = {\n root: 'fai-PreviewHeader',\n actions: 'fai-PreviewHeader__actions',\n citation: 'fai-PreviewHeader__citation',\n label: 'fai-PreviewHeader__label',\n media: 'fai-PreviewHeader__media',\n};\n\nexport const previewHeaderExtraClassNames = {\n mediaChild: 'fai-PreviewHeader__mediaChild',\n};\n\nconst labelFontSize = typographyStyles.caption1Strong.fontSize;\nconst labelLineHeight = typographyStyles.caption1Strong.lineHeight;\n\nconst useActionsBaseClassName = makeResetStyles({\n gridArea: 'actions',\n justifySelf: 'end',\n});\n\nconst useCitationBaseClassName = makeResetStyles({\n gridArea: 'citation',\n});\n\nconst useLabelBaseClassName = makeResetStyles({\n alignSelf: 'start',\n display: '-webkit-box',\n gridArea: 'label',\n overflowY: 'hidden',\n // 16px is the height of the tallest element within the preview header\n paddingTop: `calc((16px / 2) - (${labelLineHeight} - ${labelFontSize}))`,\n wordBreak: 'break-word',\n\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n\n ...typographyStyles.caption1Strong,\n});\n\nconst useMediaBaseClassName = makeResetStyles({\n gridArea: 'media',\n height: '16px',\n lineHeight: 0,\n width: '16px',\n\n [`> .${previewHeaderExtraClassNames.mediaChild}`]: {\n height: '16px',\n width: '16px',\n },\n});\n\nconst useRootBaseClassName = makeResetStyles({\n alignItems: 'center',\n columnGap: tokens.spacingHorizontalXS,\n display: 'grid',\n gridTemplateAreas: `\n \"citation media label actions\"\n \". . label .\"\n `,\n gridTemplateColumns: 'min-content 16px 1fr min-content',\n gridTemplateRows: '24px auto',\n});\n\n/**\n * Apply styling to the PreviewHeader slots based on the state\n */\nexport const usePreviewHeaderStyles_unstable = (state: PreviewHeaderState): PreviewHeaderState => {\n 'use no memo';\n\n const actionsBaseClassName = useActionsBaseClassName();\n const citationBaseClassName = useCitationBaseClassName();\n const labelBaseClassName = useLabelBaseClassName();\n const mediaBaseClassName = useMediaBaseClassName();\n const rootBaseClassName = useRootBaseClassName();\n\n state.root.className = mergeClasses(previewHeaderClassNames.root, rootBaseClassName, state.root.className);\n\n if (state.actions) {\n state.actions.className = mergeClasses(\n previewHeaderClassNames.actions,\n actionsBaseClassName,\n state.actions.className,\n );\n }\n\n if (state.citation) {\n state.citation.className = mergeClasses(\n previewHeaderClassNames.citation,\n citationBaseClassName,\n state.citation.className,\n );\n }\n\n state.label.className = mergeClasses(previewHeaderClassNames.label, labelBaseClassName, state.label.className);\n\n if (state.media) {\n state.media.className = mergeClasses(previewHeaderClassNames.media, mediaBaseClassName, state.media.className);\n }\n\n return state;\n};\n"],"names":["previewHeaderClassNames","previewHeaderExtraClassNames","alignSelf","root","actions","citation","label","media","mediaChild","labelFontSize","typographyStyles","caption1Strong","fontSize","labelLineHeight","lineHeight","useActionsBaseClassName","makeResetStyles","gridArea","__resetStyles","justifySelf","useMediaBaseClassName","useCitationBaseClassName","state","overflowY","citationBaseClassName","paddingTop","useLabelBaseClassName","wordBreak","rootBaseClassName","useRootBaseClassName","className","mergeClasses","actionsBaseClassName","height","width","labelBaseClassName","mediaBaseClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,uBAAAA;eAAAA;;IAQAC,4BAAAA;eAAAA;;IAiBXC,+BAAW;eAAXA;;;iCA7B8D;AAIzD,MAAMF,0BAA8D;UACzEG;aACAC;cACAC;WACAC;WACAC;AACF;AAEO,MAAMN,+BAA+B;gBAC1CO;AACF;AAEA,MAAMC,gBAAgBC,iCAAAA,CAAiBC,cAAc,CAACC,QAAQ;AAC9D,MAAMC,kBAAkBH,iCAAAA,CAAiBC,cAAc,CAACG,UAAU;AAElE,MAAMC,0BAA0BC,IAAAA,8BAAAA,EAAAA,YAAgB,MAAA;IAAA;CAAA;MAC9CC,2BAAUC,IAAAA,8BAAA,EAAA,YAAA,MAAA;IAAA;CAAA;MACVC,wBAAaD,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;CAAA;AACf,MAAAE,wBAAAF,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAAA;AAEA,MAAMG,uBAAAA,IAAAA,8BAA2BL,EAAAA,YAAgB,MAAA;IAAA;CAAA;AAK/Cd,MAAAA,kCAAWoB,CAAAA;;UAGXC,uBAAWR;UACXS,wBAAAH;UACAI,qBAAaC;UACbC,qBAAWP;UAEXQ,oBAAsBC;UACtB1B,IAAA,CAAA2B,SAAA,GAAAC,IAAAA,6BAAsB,EAAA/B,wBAAAG,IAAA,EAAAyB,mBAAAN,MAAAnB,IAAA,CAAA2B,SAAA;QAEtBR,MAAGZ,OAAAA,EAAAA;QACLY,MAAAlB,OAAA,CAAA0B,SAAA,GAAAC,IAAAA,6BAAA,EAAA/B,wBAAAI,OAAA,EAAA4B,sBAAAV,MAAAlB,OAAA,CAAA0B,SAAA;IAEA;QACEb,MAAAA,QAAU,EAAA;QACVgB,MAAAA,QAAQ,CAAAH,SAAA,GAAAC,IAAAA,6BAAA,EAAA/B,wBAAAK,QAAA,EAAAmB,uBAAAF,MAAAjB,QAAA,CAAAyB,SAAA;;UAERI,KAAO,CAAAJ,SAAA,GAAAC,IAAAA,6BAAA,EAAA/B,wBAAAM,KAAA,EAAA6B,oBAAAb,MAAAhB,KAAA,CAAAwB,SAAA;QAELR,MAAKrB,KAAAA,EAAAA;cACLgC,KAAAA,CAAQH,SAAA,GAAAC,IAAAA,6BAAA,EAAA/B,wBAAAO,KAAA,EAAA6B,oBAAAd,MAAAf,KAAA,CAAAuB,SAAA;;WAEVR;AACF,GAEA,yDAA6C"}
1
+ {"version":3,"sources":["usePreviewHeaderStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, tokens, typographyStyles } from '@fluentui/react-components';\nimport type { PreviewHeaderSlots, PreviewHeaderState } from './PreviewHeader.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const previewHeaderClassNames: SlotClassNames<PreviewHeaderSlots> = {\n root: 'fai-PreviewHeader',\n actions: 'fai-PreviewHeader__actions',\n citation: 'fai-PreviewHeader__citation',\n label: 'fai-PreviewHeader__label',\n media: 'fai-PreviewHeader__media',\n};\n\nexport const previewHeaderExtraClassNames = {\n mediaChild: 'fai-PreviewHeader__mediaChild',\n};\n\nconst labelFontSize = typographyStyles.caption1Strong.fontSize;\nconst labelLineHeight = typographyStyles.caption1Strong.lineHeight;\n\nconst useActionsBaseClassName = makeResetStyles({\n gridArea: 'actions',\n justifySelf: 'end',\n});\n\nconst useCitationBaseClassName = makeResetStyles({\n gridArea: 'citation',\n});\n\nconst useLabelBaseClassName = makeResetStyles({\n alignSelf: 'start',\n display: '-webkit-box',\n gridArea: 'label',\n overflowY: 'hidden',\n // 16px is the height of the tallest element within the preview header\n paddingTop: `calc((16px / 2) - (${labelLineHeight} - ${labelFontSize}))`,\n wordBreak: 'break-word',\n\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n\n ...typographyStyles.caption1Strong,\n});\n\nconst useMediaBaseClassName = makeResetStyles({\n gridArea: 'media',\n height: '16px',\n lineHeight: 0,\n width: '16px',\n\n [`> .${previewHeaderExtraClassNames.mediaChild}`]: {\n height: '16px',\n width: '16px',\n },\n});\n\nconst useRootBaseClassName = makeResetStyles({\n alignItems: 'center',\n columnGap: tokens.spacingHorizontalXS,\n display: 'grid',\n gridTemplateAreas: `\n \"citation media label actions\"\n \". . label .\"\n `,\n gridTemplateColumns: 'min-content min-content 1fr min-content',\n gridTemplateRows: '24px auto',\n});\n\n/**\n * Apply styling to the PreviewHeader slots based on the state\n */\nexport const usePreviewHeaderStyles_unstable = (state: PreviewHeaderState): PreviewHeaderState => {\n 'use no memo';\n\n const actionsBaseClassName = useActionsBaseClassName();\n const citationBaseClassName = useCitationBaseClassName();\n const labelBaseClassName = useLabelBaseClassName();\n const mediaBaseClassName = useMediaBaseClassName();\n const rootBaseClassName = useRootBaseClassName();\n\n state.root.className = mergeClasses(previewHeaderClassNames.root, rootBaseClassName, state.root.className);\n\n if (state.actions) {\n state.actions.className = mergeClasses(\n previewHeaderClassNames.actions,\n actionsBaseClassName,\n state.actions.className,\n );\n }\n\n if (state.citation) {\n state.citation.className = mergeClasses(\n previewHeaderClassNames.citation,\n citationBaseClassName,\n state.citation.className,\n );\n }\n\n state.label.className = mergeClasses(previewHeaderClassNames.label, labelBaseClassName, state.label.className);\n\n if (state.media) {\n state.media.className = mergeClasses(previewHeaderClassNames.media, mediaBaseClassName, state.media.className);\n }\n\n return state;\n};\n"],"names":["previewHeaderClassNames","previewHeaderExtraClassNames","alignSelf","root","actions","citation","label","media","mediaChild","labelFontSize","typographyStyles","caption1Strong","fontSize","labelLineHeight","lineHeight","useActionsBaseClassName","makeResetStyles","gridArea","__resetStyles","justifySelf","useMediaBaseClassName","useCitationBaseClassName","state","overflowY","citationBaseClassName","paddingTop","useLabelBaseClassName","wordBreak","rootBaseClassName","useRootBaseClassName","className","mergeClasses","actionsBaseClassName","height","width","labelBaseClassName","mediaBaseClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,uBAAAA;eAAAA;;IAQAC,4BAAAA;eAAAA;;IAiBXC,+BAAW;eAAXA;;;iCA7B8D;AAIzD,MAAMF,0BAA8D;UACzEG;aACAC;cACAC;WACAC;WACAC;AACF;AAEO,MAAMN,+BAA+B;gBAC1CO;AACF;AAEA,MAAMC,gBAAgBC,iCAAAA,CAAiBC,cAAc,CAACC,QAAQ;AAC9D,MAAMC,kBAAkBH,iCAAAA,CAAiBC,cAAc,CAACG,UAAU;AAElE,MAAMC,0BAA0BC,IAAAA,8BAAAA,EAAAA,YAAgB,MAAA;IAAA;CAAA;MAC9CC,2BAAUC,IAAAA,8BAAA,EAAA,YAAA,MAAA;IAAA;CAAA;MACVC,wBAAaD,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;CAAA;AACf,MAAAE,wBAAAF,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAAA;AAEA,MAAMG,uBAAAA,IAAAA,8BAA2BL,EAAAA,WAAgB,MAAA;IAAA;CAAA;AAK/Cd,MAAAA,kCAAWoB,CAAAA;;UAGXC,uBAAWR;UACXS,wBAAAH;UACAI,qBAAaC;UACbC,qBAAWP;UAEXQ,oBAAsBC;UACtB1B,IAAA,CAAA2B,SAAA,GAAAC,IAAAA,6BAAsB,EAAA/B,wBAAAG,IAAA,EAAAyB,mBAAAN,MAAAnB,IAAA,CAAA2B,SAAA;QAEtBR,MAAGZ,OAAAA,EAAAA;QACLY,MAAAlB,OAAA,CAAA0B,SAAA,GAAAC,IAAAA,6BAAA,EAAA/B,wBAAAI,OAAA,EAAA4B,sBAAAV,MAAAlB,OAAA,CAAA0B,SAAA;IAEA;QACEb,MAAAA,QAAU,EAAA;QACVgB,MAAAA,QAAQ,CAAAH,SAAA,GAAAC,IAAAA,6BAAA,EAAA/B,wBAAAK,QAAA,EAAAmB,uBAAAF,MAAAjB,QAAA,CAAAyB,SAAA;;UAERI,KAAO,CAAAJ,SAAA,GAAAC,IAAAA,6BAAA,EAAA/B,wBAAAM,KAAA,EAAA6B,oBAAAb,MAAAhB,KAAA,CAAAwB,SAAA;QAELR,MAAKrB,KAAAA,EAAAA;cACLgC,KAAAA,CAAQH,SAAA,GAAAC,IAAAA,6BAAA,EAAA/B,wBAAAO,KAAA,EAAA6B,oBAAAd,MAAAf,KAAA,CAAAuB,SAAA;;WAEVR;AACF,GAEA,yDAA6C"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui-copilot/react-preview",
3
- "version": "0.4.3",
3
+ "version": "0.4.4",
4
4
  "description": "Preview components.",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",