@fluentui-copilot/react-reference 0.11.4 → 0.12.0

package/CHANGELOG.json

@@ -2,7 +2,38 @@
   "name": "@fluentui-copilot/react-reference",
   "entries": [
     {
-      "date": "Thu, 13 Jun 2024 21:00:14 GMT",
+      "date": "Thu, 20 Jun 2024 23:05:26 GMT",
+      "tag": "@fluentui-copilot/react-reference_v0.12.0",
+      "version": "0.12.0",
+      "comments": {
+        "none": [
+          {
+            "author": "tristan.watanabe@gmail.com",
+            "package": "@fluentui-copilot/react-reference",
+            "commit": "b8a46e43b66fa17ed3cbb98a57171f9805ca5801",
+            "comment": "fix: failing e2e tests after playwright/test dependency update to v1.44.0."
+          }
+        ],
+        "minor": [
+          {
+            "author": "Humberto.Morimoto@microsoft.com",
+            "package": "@fluentui-copilot/react-reference",
+            "commit": "fc6c01300d29e17aa4bd56305a0f4fd2d9f7b94c",
+            "comment": "chore: Deprecating Reference v1 pattern, and consolidating Citation, Reference v1 and Reference v2 docs."
+          }
+        ],
+        "patch": [
+          {
+            "author": "humbertomakotomorimoto@gmail.com",
+            "package": "@fluentui-copilot/react-reference",
+            "commit": "8556966a4bc720f393d1c00b6befb857cc757877",
+            "comment": "fix: Making some fit-and-finish styling changes to better match design specs."
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 13 Jun 2024 21:00:45 GMT",
       "tag": "@fluentui-copilot/react-reference_v0.11.4",
       "version": "0.11.4",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,25 @@
 # Change Log - @fluentui-copilot/react-reference
 
-This log was last generated on Thu, 13 Jun 2024 21:00:14 GMT and should not be manually modified.
+This log was last generated on Thu, 20 Jun 2024 23:05:26 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [0.12.0](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-reference_v0.12.0)
+
+Thu, 20 Jun 2024 23:05:26 GMT 
+[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-reference_v0.11.4..@fluentui-copilot/react-reference_v0.12.0)
+
+### Minor changes
+
+- chore: Deprecating Reference v1 pattern, and consolidating Citation, Reference v1 and Reference v2 docs. ([PR #1731](https://github.com/microsoft/fluentai/pull/1731) by Humberto.Morimoto@microsoft.com)
+
+### Patches
+
+- fix: Making some fit-and-finish styling changes to better match design specs. ([PR #1748](https://github.com/microsoft/fluentai/pull/1748) by humbertomakotomorimoto@gmail.com)
+
 ## [0.11.4](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-reference_v0.11.4)
 
-Thu, 13 Jun 2024 21:00:14 GMT 
+Thu, 13 Jun 2024 21:00:45 GMT 
 [Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-reference_v0.11.3..@fluentui-copilot/react-reference_v0.11.4)
 
 ### Patches

package/dist/index.d.ts

@@ -141,7 +141,7 @@ declare type PreviewMetadataSlots = {
 /**
  * Preview Props
  */
-declare type PreviewProps = PopoverProps;
+declare type PreviewProps = Omit<PopoverProps, 'mouseLeaveDelay' | 'openOnHover'>;
 
 declare const PreviewSurface: ForwardRefComponent<PreviewSurfaceProps>;
 
@@ -152,6 +152,7 @@ declare type PreviewSurfaceProps = ComponentProps<PreviewSurfaceSlots> & Popover
 
 declare type PreviewSurfaceSlots = PopoverSurfaceSlots & {};
 
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export declare const Reference: ForwardRefComponent<ReferenceProps>;
 
 /**
@@ -170,8 +171,10 @@ export declare type ReferenceCitationData = {
     sensitivityLabelProps?: SensitivityLabelProps;
 };
 
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export declare const referenceClassNames: SlotClassNames<ReferenceSlots>;
 
+/** deprecated The ReferenceGroup pattern is deprecated and will be removed in a future release. */
 export declare const ReferenceGroupToggle: ForwardRefComponent<ReferenceGroupToggleProps>;
 
 export declare const referenceGroupToggleClassNames: SlotClassNames<ReferenceGroupToggleSlots>;
@@ -193,8 +196,10 @@ export declare type ReferenceGroupToggleSlots = {
  */
 export declare type ReferenceGroupToggleState = ComponentState<ReferenceGroupToggleSlots> & Required<Pick<ReferenceGroupToggleProps, 'isOpen' | 'mode'>>;
 
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */
 export declare const ReferenceList: ForwardRefComponent<ReferenceListProps>;
 
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */
 export declare const referenceListClassNames: SlotClassNames<ReferenceListSlots>;
 
 export declare const ReferenceListContext: Context<ReferenceListContextValue>;
@@ -206,11 +211,10 @@ export declare const ReferenceListContextProvider: Provider<ReferenceListContext
  */
 export declare type ReferenceListContextValue = Pick<ReferenceListV2State, 'areReferencesExpanded' | 'maxVisibleReferences' | 'overflowButtonTriggeredViaKeyboard' | 'referenceListRef' | 'shouldUseOverflow' | 'totalReferencesCount'>;
 
-/**
- * ReferenceList Props
- */
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */
 export declare type ReferenceListProps = ComponentProps<ReferenceListSlots>;
 
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */
 export declare type ReferenceListSlots = {
     /**
      * The root slot.
@@ -218,9 +222,7 @@ export declare type ReferenceListSlots = {
     root: Slot<'ol'>;
 };
 
-/**
- * State used in rendering ReferenceList
- */
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */
 export declare type ReferenceListState = ComponentState<ReferenceListSlots>;
 
 export declare const ReferenceListV2: ForwardRefComponent<ReferenceListV2Props>;
@@ -286,9 +288,7 @@ export declare type ReferenceOverflowButtonState = ComponentState<ReferenceOverf
     shouldRenderOverflowButton: boolean;
 };
 
-/**
- * Reference Props
- */
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export declare type ReferenceProps = ComponentProps<Partial<ReferenceSlots>> & CopilotMode & {
     /**
      * Numeric index associated with `Citation`.
@@ -312,6 +312,7 @@ export declare type ReferenceProps = ComponentProps<Partial<ReferenceSlots>> & C
     layout?: 'inline' | 'popover';
 };
 
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export declare type ReferenceSlots = {
     /**
      * The root slot.
@@ -367,9 +368,7 @@ export declare type ReferenceSlots = {
     detailsButton: Slot<typeof Button>;
 };
 
-/**
- * State used in rendering Reference
- */
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export declare type ReferenceState = ComponentState<ReferenceSlots> & Required<Pick<ReferenceProps, 'mode' | 'layout' | 'index'>> & {
     /**
      * State used to renderer the `Reference` in an expanded state.
@@ -407,9 +406,7 @@ export declare type ReferenceV2State = ComponentState<ReferenceV2Slots> & Requir
  */
 export declare const renderCitation_unstable: (state: CitationState) => JSX.Element;
 
-/**
- * Render the final JSX of Reference
- */
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export declare const renderReference_unstable: (state: ReferenceState) => JSX.Element;
 
 /**
@@ -417,9 +414,7 @@ export declare const renderReference_unstable: (state: ReferenceState) => JSX.El
  */
 export declare const renderReferenceGroupToggle_unstable: (state: ReferenceGroupToggleState) => JSX.Element;
 
-/**
- * Render the final JSX of ReferenceList
- */
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */
 export declare const renderReferenceList_unstable: (state: ReferenceListState) => JSX.Element;
 
 /**
@@ -454,6 +449,10 @@ declare const SensitivityTooltip: ForwardRefComponent<SensitivityTooltipProps>;
  */
 declare type SensitivityTooltipProps = ComponentProps<SensitivityTooltipSlots> & {
     positioning?: PositioningShorthand;
+    /**
+     * Prop to display a backplate behind the tooltip
+     */
+    withBackplate?: boolean;
 };
 
 declare type SensitivityTooltipSlots = {
@@ -488,6 +487,8 @@ export declare const useCitationStyles_unstable: (state: CitationState) => Citat
  *
  * @param props - props from this instance of Reference
  * @param ref - reference to root HTMLElement of Reference
+ *
+ * deprecated Use ReferenceV2 component, hooks and types instead.
  */
 export declare const useReference_unstable: (props: ReferenceProps, ref: React_2.Ref<HTMLDivElement>) => ReferenceState;
 
@@ -567,6 +568,8 @@ export declare const useReferenceGroupToggleStyles_unstable: (state: ReferenceGr
  *
  * @param props - props from this instance of ReferenceList
  * @param ref - reference to root HTMLElement of ReferenceList
+ *
+ * deprecated Use ReferenceListV2 component, hooks and types instead.
  */
 export declare const useReferenceList_unstable: (props: ReferenceListProps, ref: React_2.Ref<HTMLOListElement>) => ReferenceListState;
 
@@ -574,14 +577,11 @@ export declare const useReferenceListContext_unstable: <T>(selector: ContextSele
 
 /**
  * Apply styling to the ReferenceList slots based on the state
+ *
+ * deprecated Use ReferenceListV2 component, hooks and types instead.
  */
 export declare const useReferenceListStyles_unstable: (state: ReferenceListState) => ReferenceListState;
 
-/**
- * Apply styling to the ReferenceList slots based on the state
- */
-export declare const useReferenceListStylesV2_unstable: (state: ReferenceListV2State) => ReferenceListV2State;
-
 /**
  * Create the state required to render ReferenceList.
  *
@@ -593,6 +593,11 @@ export declare const useReferenceListStylesV2_unstable: (state: ReferenceListV2S
  */
 export declare const useReferenceListV2_unstable: (props: ReferenceListV2Props, ref: React_2.Ref<HTMLDivElement>) => ReferenceListV2State;
 
+/**
+ * Apply styling to the ReferenceList slots based on the state
+ */
+export declare const useReferenceListV2Styles_unstable: (state: ReferenceListV2State) => ReferenceListV2State;
+
 /**
  * Create the state required to render ReferenceOverflowButton.
  *
@@ -611,14 +616,11 @@ export declare const useReferenceOverflowButtonStyles_unstable: (state: Referenc
 
 /**
  * Apply styling to the Reference slots based on the state
+ *
+ * deprecated Use ReferenceV2 component, hooks and types instead.
  */
 export declare const useReferenceStyles_unstable: (state: ReferenceState) => ReferenceState;
 
-/**
- * Apply styling to the Reference slots based on the state
- */
-export declare const useReferenceStylesV2_unstable: (state: ReferenceV2State) => ReferenceV2State;
-
 /**
  * Create the state required to render Reference.
  *
@@ -630,4 +632,9 @@ export declare const useReferenceStylesV2_unstable: (state: ReferenceV2State) =>
  */
 export declare const useReferenceV2_unstable: (props: ReferenceV2Props, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => ReferenceV2State;
 
+/**
+ * Apply styling to the Reference slots based on the state
+ */
+export declare const useReferenceV2Styles_unstable: (state: ReferenceV2State) => ReferenceV2State;
+
 export { }

package/lib/components/Reference/Reference.js

@@ -3,7 +3,7 @@ import { useReference_unstable } from './useReference';
 import { renderReference_unstable } from './renderReference';
 import { useReferenceStyles_unstable } from './useReferenceStyles.styles';
 import { useCustomStyleHook } from '@fluentui-copilot/react-provider';
-// Reference component - TODO: add more docs
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export const Reference = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useReference_unstable(props, ref);
   useReferenceStyles_unstable(state);

package/lib/components/Reference/Reference.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Reference.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReference_unstable } from './useReference';\nimport { renderReference_unstable } from './renderReference';\nimport { useReferenceStyles_unstable } from './useReferenceStyles.styles';\nimport type { ReferenceProps } from './Reference.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n// Reference component - TODO: add more docs\nexport const Reference: ForwardRefComponent<ReferenceProps> = React.forwardRef((props, ref) => {\n  const state = useReference_unstable(props, ref);\n\n  useReferenceStyles_unstable(state);\n  useCustomStyleHook('useReferenceStyles')(state);\n\n  return renderReference_unstable(state);\n});\n\nReference.displayName = 'Reference';\n"],"names":["React","useReference_unstable","renderReference_unstable","useReferenceStyles_unstable","useCustomStyleHook","Reference","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,8BAA8B;AAG1E,SAASC,kBAAkB,QAAQ,mCAAmC;AAEtE,4CAA4C;AAC5C,OAAO,MAAMC,0BAAiDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACrF,MAAMC,QAAQR,sBAAsBM,OAAOC;IAE3CL,4BAA4BM;IAC5BL,mBAAmB,sBAAsBK;IAEzC,OAAOP,yBAAyBO;AAClC,GAAG;AAEHJ,UAAUK,WAAW,GAAG"}
+{"version":3,"sources":["Reference.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReference_unstable } from './useReference';\nimport { renderReference_unstable } from './renderReference';\nimport { useReferenceStyles_unstable } from './useReferenceStyles.styles';\nimport type { ReferenceProps } from './Reference.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n/** deprecated Use ReferenceV2 component, hooks and types instead. */\nexport const Reference: ForwardRefComponent<ReferenceProps> = React.forwardRef((props, ref) => {\n  const state = useReference_unstable(props, ref);\n\n  useReferenceStyles_unstable(state);\n  useCustomStyleHook('useReferenceStyles')(state);\n\n  return renderReference_unstable(state);\n});\n\nReference.displayName = 'Reference';\n"],"names":["React","useReference_unstable","renderReference_unstable","useReferenceStyles_unstable","useCustomStyleHook","Reference","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,8BAA8B;AAG1E,SAASC,kBAAkB,QAAQ,mCAAmC;AAEtE,mEAAmE,GACnE,OAAO,MAAMC,0BAAiDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IACrF,MAAMC,QAAQR,sBAAsBM,OAAOC;IAE3CL,4BAA4BM;IAC5BL,mBAAmB,sBAAsBK;IAEzC,OAAOP,yBAAyBO;AAClC,GAAG;AAEHJ,UAAUK,WAAW,GAAG"}

package/lib/components/Reference/Reference.types.js

@@ -1,4 +1,2 @@
-/**
- * State used in rendering Reference
- */export {};
+/** deprecated Use ReferenceV2 component, hooks and types instead. */export {};
 //# sourceMappingURL=Reference.types.js.map

package/lib/components/Reference/Reference.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Reference.types.ts"],"sourcesContent":["import type { CopilotMode } from '@fluentui-copilot/react-provider';\nimport type { Button, ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type ReferenceSlots = {\n  /**\n   * The root slot.\n   */\n  root: NonNullable<Slot<'div'>>;\n\n  /**\n   * Citation slot. Displays a `Citation`. Set the `null` to hide the citation.\n   */\n  citation: Slot<'div'>;\n\n  /**\n   * Media slot. Used to display Avatars, Icons, etc.\n   */\n  media: Slot<'div'>;\n\n  /**\n   * Actions slot.\n   */\n  actions: Slot<'div'>;\n\n  /**\n   * Label slot. Primary description of the reference.\n   */\n  label: NonNullable<Slot<'div'>>;\n\n  /**\n   * Sensitivity slot. Used to display a `SensitivityLabel`.\n   */\n  sensitivity: Slot<'span'>;\n\n  /**\n   * Metadata slot. Container for `primaryText`, `secondaryText`, `tertiaryText` and `icon`.\n   */\n  metadata: NonNullable<Slot<'div'>>;\n\n  /**\n   * Primary text slot. First displayed metadata text.\n   */\n  primaryText: Slot<'span'>;\n\n  /**\n   * Secondary text slot. Second displayed metadata text.\n   */\n  secondaryText: Slot<'span'>;\n\n  /**\n   * Tertiary text slot. Third displayed metadata text.\n   */\n  tertiaryText: Slot<'span'>;\n\n  /**\n   * Icon slot. Icon displayed in metadata area.\n   */\n  icon: Slot<'span'>;\n\n  /**\n   * Content slot.\n   */\n  content: NonNullable<Slot<'div'>>;\n\n  /**\n   * Details button slot. Used to expand/collapse the reference.\n   */\n  detailsButton: Slot<typeof Button>;\n};\n\n/**\n * Reference Props\n */\nexport type ReferenceProps = ComponentProps<Partial<ReferenceSlots>> &\n  CopilotMode & {\n    /**\n     * Numeric index associated with `Citation`.\n     */\n    index: number;\n\n    /**\n     * HREF back to the `Citation` this `Reference` is associated with.\n     */\n    citationHref?: string;\n\n    /**\n     * Unique ID associated with this `Reference`.\n     */\n    referenceId?: string;\n\n    /**\n     * Text snippet from the reference source.\n     */\n    excerpt?: string;\n\n    /**\n     * @deprecated Inline layout is the only one that is available, use `Preview` component instead for an equivalent to a `Reference` with a popover layout inside of a `Popover`.\n     */\n    layout?: 'inline' | 'popover';\n  };\n\n/**\n * State used in rendering Reference\n */\nexport type ReferenceState = ComponentState<ReferenceSlots> &\n  Required<Pick<ReferenceProps, 'mode' | 'layout' | 'index'>> & {\n    /**\n     * State used to renderer the `Reference` in an expanded state.\n     */\n    isExpanded: boolean;\n  };\n"],"names":[],"rangeMappings":";;","mappings":"AAqGA;;CAEC,GACD,WAMI"}
+{"version":3,"sources":["Reference.types.ts"],"sourcesContent":["import type { CopilotMode } from '@fluentui-copilot/react-provider';\nimport type { Button, ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\n/** deprecated Use ReferenceV2 component, hooks and types instead. */\nexport type ReferenceSlots = {\n  /**\n   * The root slot.\n   */\n  root: NonNullable<Slot<'div'>>;\n\n  /**\n   * Citation slot. Displays a `Citation`. Set the `null` to hide the citation.\n   */\n  citation: Slot<'div'>;\n\n  /**\n   * Media slot. Used to display Avatars, Icons, etc.\n   */\n  media: Slot<'div'>;\n\n  /**\n   * Actions slot.\n   */\n  actions: Slot<'div'>;\n\n  /**\n   * Label slot. Primary description of the reference.\n   */\n  label: NonNullable<Slot<'div'>>;\n\n  /**\n   * Sensitivity slot. Used to display a `SensitivityLabel`.\n   */\n  sensitivity: Slot<'span'>;\n\n  /**\n   * Metadata slot. Container for `primaryText`, `secondaryText`, `tertiaryText` and `icon`.\n   */\n  metadata: NonNullable<Slot<'div'>>;\n\n  /**\n   * Primary text slot. First displayed metadata text.\n   */\n  primaryText: Slot<'span'>;\n\n  /**\n   * Secondary text slot. Second displayed metadata text.\n   */\n  secondaryText: Slot<'span'>;\n\n  /**\n   * Tertiary text slot. Third displayed metadata text.\n   */\n  tertiaryText: Slot<'span'>;\n\n  /**\n   * Icon slot. Icon displayed in metadata area.\n   */\n  icon: Slot<'span'>;\n\n  /**\n   * Content slot.\n   */\n  content: NonNullable<Slot<'div'>>;\n\n  /**\n   * Details button slot. Used to expand/collapse the reference.\n   */\n  detailsButton: Slot<typeof Button>;\n};\n\n/** deprecated Use ReferenceV2 component, hooks and types instead. */\nexport type ReferenceProps = ComponentProps<Partial<ReferenceSlots>> &\n  CopilotMode & {\n    /**\n     * Numeric index associated with `Citation`.\n     */\n    index: number;\n\n    /**\n     * HREF back to the `Citation` this `Reference` is associated with.\n     */\n    citationHref?: string;\n\n    /**\n     * Unique ID associated with this `Reference`.\n     */\n    referenceId?: string;\n\n    /**\n     * Text snippet from the reference source.\n     */\n    excerpt?: string;\n\n    /**\n     * @deprecated Inline layout is the only one that is available, use `Preview` component instead for an equivalent to a `Reference` with a popover layout inside of a `Popover`.\n     */\n    layout?: 'inline' | 'popover';\n  };\n\n/** deprecated Use ReferenceV2 component, hooks and types instead. */\nexport type ReferenceState = ComponentState<ReferenceSlots> &\n  Required<Pick<ReferenceProps, 'mode' | 'layout' | 'index'>> & {\n    /**\n     * State used to renderer the `Reference` in an expanded state.\n     */\n    isExpanded: boolean;\n  };\n"],"names":[],"rangeMappings":"","mappings":"AAoGA,mEAAmE,GACnE,WAMI"}

package/lib/components/Reference/renderReference.js

@@ -1,8 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-components';
-/**
- * Render the final JSX of Reference
- */
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export const renderReference_unstable = state => {
   assertSlots(state);
   return /*#__PURE__*/_jsxs(state.root, {

package/lib/components/Reference/renderReference.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderReference.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\n\nimport type { ReferenceState, ReferenceSlots } from './Reference.types';\n\n/**\n * Render the final JSX of Reference\n */\nexport const renderReference_unstable = (state: ReferenceState) => {\n  assertSlots<ReferenceSlots>(state);\n\n  return (\n    <state.root>\n      {state.citation && <state.citation />}\n      {state.media && <state.media />}\n      <state.label />\n      {state.actions && (\n        <state.actions>\n          {state.actions.children}\n          {state.detailsButton && <state.detailsButton />}\n        </state.actions>\n      )}\n      {state.sensitivity && <state.sensitivity />}\n      <state.metadata>\n        {state.primaryText && <state.primaryText />}\n        {state.secondaryText && <state.secondaryText />}\n        {state.tertiaryText && <state.tertiaryText />}\n        {state.icon && <state.icon />}\n        {state.metadata.children}\n      </state.metadata>\n      <state.content />\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderReference_unstable","state","root","citation","media","label","actions","children","detailsButton","sensitivity","metadata","primaryText","secondaryText","tertiaryText","icon","content"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAIzD;;CAEC,GACD,OAAO,MAAMC,2BAA2B,CAACC;IACvCF,YAA4BE;IAE5B,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAME,QAAQ,kBAAI,KAACF,MAAME,QAAQ;YACjCF,MAAMG,KAAK,kBAAI,KAACH,MAAMG,KAAK;0BAC5B,KAACH,MAAMI,KAAK;YACXJ,MAAMK,OAAO,kBACZ,MAACL,MAAMK,OAAO;;oBACXL,MAAMK,OAAO,CAACC,QAAQ;oBACtBN,MAAMO,aAAa,kBAAI,KAACP,MAAMO,aAAa;;;YAG/CP,MAAMQ,WAAW,kBAAI,KAACR,MAAMQ,WAAW;0BACxC,MAACR,MAAMS,QAAQ;;oBACZT,MAAMU,WAAW,kBAAI,KAACV,MAAMU,WAAW;oBACvCV,MAAMW,aAAa,kBAAI,KAACX,MAAMW,aAAa;oBAC3CX,MAAMY,YAAY,kBAAI,KAACZ,MAAMY,YAAY;oBACzCZ,MAAMa,IAAI,kBAAI,KAACb,MAAMa,IAAI;oBACzBb,MAAMS,QAAQ,CAACH,QAAQ;;;0BAE1B,KAACN,MAAMc,OAAO;;;AAGpB,EAAE"}
+{"version":3,"sources":["renderReference.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\n\nimport type { ReferenceState, ReferenceSlots } from './Reference.types';\n\n/** deprecated Use ReferenceV2 component, hooks and types instead. */\nexport const renderReference_unstable = (state: ReferenceState) => {\n  assertSlots<ReferenceSlots>(state);\n\n  return (\n    <state.root>\n      {state.citation && <state.citation />}\n      {state.media && <state.media />}\n      <state.label />\n      {state.actions && (\n        <state.actions>\n          {state.actions.children}\n          {state.detailsButton && <state.detailsButton />}\n        </state.actions>\n      )}\n      {state.sensitivity && <state.sensitivity />}\n      <state.metadata>\n        {state.primaryText && <state.primaryText />}\n        {state.secondaryText && <state.secondaryText />}\n        {state.tertiaryText && <state.tertiaryText />}\n        {state.icon && <state.icon />}\n        {state.metadata.children}\n      </state.metadata>\n      <state.content />\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderReference_unstable","state","root","citation","media","label","actions","children","detailsButton","sensitivity","metadata","primaryText","secondaryText","tertiaryText","icon","content"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAIzD,mEAAmE,GACnE,OAAO,MAAMC,2BAA2B,CAACC;IACvCF,YAA4BE;IAE5B,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAME,QAAQ,kBAAI,KAACF,MAAME,QAAQ;YACjCF,MAAMG,KAAK,kBAAI,KAACH,MAAMG,KAAK;0BAC5B,KAACH,MAAMI,KAAK;YACXJ,MAAMK,OAAO,kBACZ,MAACL,MAAMK,OAAO;;oBACXL,MAAMK,OAAO,CAACC,QAAQ;oBACtBN,MAAMO,aAAa,kBAAI,KAACP,MAAMO,aAAa;;;YAG/CP,MAAMQ,WAAW,kBAAI,KAACR,MAAMQ,WAAW;0BACxC,MAACR,MAAMS,QAAQ;;oBACZT,MAAMU,WAAW,kBAAI,KAACV,MAAMU,WAAW;oBACvCV,MAAMW,aAAa,kBAAI,KAACX,MAAMW,aAAa;oBAC3CX,MAAMY,YAAY,kBAAI,KAACZ,MAAMY,YAAY;oBACzCZ,MAAMa,IAAI,kBAAI,KAACb,MAAMa,IAAI;oBACzBb,MAAMS,QAAQ,CAACH,QAAQ;;;0BAE1B,KAACN,MAAMc,OAAO;;;AAGpB,EAAE"}

package/lib/components/Reference/useReference.js

@@ -13,6 +13,8 @@ import { useCopilotMode } from '@fluentui-copilot/react-provider';
  *
  * @param props - props from this instance of Reference
  * @param ref - reference to root HTMLElement of Reference
+ *
+ * deprecated Use ReferenceV2 component, hooks and types instead.
  */
 export const useReference_unstable = (props, ref) => {
   const {

package/lib/components/Reference/useReference.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useReference.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Button,\n  Caption1,\n  getIntrinsicElementProps,\n  mergeCallbacks,\n  mergeClasses,\n  slot,\n  useId,\n  usePopoverContext_unstable as usePopoverContext,\n} from '@fluentui/react-components';\nimport {\n  ChevronDown24Regular,\n  ChevronUp24Regular,\n  ChevronDown16Regular,\n  ChevronUp16Regular,\n} from '@fluentui/react-icons';\nimport { referenceExtraClassNames } from './useReferenceStyles.styles';\nimport { Citation } from '../Citation';\nimport type { ReferenceProps, ReferenceState } from './Reference.types';\nimport { useReferenceGroupSetOpen } from '../../contexts/ReferenceGroupContext';\nimport { useCopilotMode } from '@fluentui-copilot/react-provider';\n\n/**\n * Create the state required to render Reference.\n *\n * The returned state can be modified with hooks such as useReferenceStyles_unstable,\n * before being passed to renderReference_unstable.\n *\n * @param props - props from this instance of Reference\n * @param ref - reference to root HTMLElement of Reference\n */\nexport const useReference_unstable = (props: ReferenceProps, ref: React.Ref<HTMLDivElement>): ReferenceState => {\n  const { index, referenceId, citationHref, excerpt, layout = 'inline' } = props;\n\n  const mode = useCopilotMode(props.mode);\n\n  const labelId = useId();\n  const mediaId = useId();\n  const [isExpanded, setIsExpanded] = React.useState(layout === 'popover' ? true : false);\n\n  const setPopoverOpen = usePopoverContext(context => context.setOpen);\n\n  const onExpandClick: React.MouseEventHandler<HTMLButtonElement> = _e => {\n    setIsExpanded(!isExpanded);\n  };\n\n  const label = slot.always(props.label, {\n    defaultProps: { id: labelId },\n    elementType: 'div',\n  });\n  const media = slot.optional(props.media, { defaultProps: { id: mediaId }, elementType: 'div' });\n  if (media && React.isValidElement<HTMLElement>(media.children)) {\n    media.children = React.cloneElement(media.children, {\n      className: mergeClasses(media.children.props.className, referenceExtraClassNames.mediaChild),\n    });\n  }\n\n  if (media?.id) {\n    label['aria-describedby'] = label['aria-describedby']?.concat(media.id) ?? media.id;\n  }\n\n  const ariaLabelledByProp = props['aria-labelledby'];\n  const groupSemantics = React.useMemo(() => {\n    return layout === 'inline'\n      ? {\n          role: 'group',\n          'aria-labelledby': `${ariaLabelledByProp ?? ''} ${label.id}`,\n          tabIndex: -1,\n        }\n      : {};\n  }, [layout, ariaLabelledByProp, label.id]);\n\n  // Within a popup, a citation should function as a close button\n  const citationProps = React.useMemo(() => {\n    const onPopoverCloseClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n      setPopoverOpen(e, false);\n\n      // don't navigate\n      e.preventDefault();\n    };\n\n    return layout === 'popover'\n      ? {\n          referenceHref: '#',\n          tabIndex: -1,\n          'aria-label': `Reference ${index}, close`,\n          onClick: onPopoverCloseClick,\n        }\n      : {\n          referenceHref: citationHref,\n        };\n  }, [layout, citationHref, index, setPopoverOpen]);\n\n  const state: ReferenceState = {\n    isExpanded,\n    mode: layout === 'popover' ? 'sidecar' : mode,\n    layout,\n    index,\n    components: {\n      root: 'div',\n      citation: 'div',\n      media: 'div',\n      actions: 'div',\n      label: 'div',\n      sensitivity: 'span',\n      metadata: 'div',\n      content: 'div',\n      primaryText: 'span',\n      secondaryText: 'span',\n      tertiaryText: 'span',\n      icon: 'span',\n      detailsButton: Button,\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        id: referenceId,\n        ...groupSemantics,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    citation: slot.optional(props.citation, {\n      defaultProps: {\n        children: (\n          <Citation block {...citationProps}>\n            {index}\n          </Citation>\n        ),\n      },\n      renderByDefault: true,\n      elementType: 'div',\n    }),\n    media,\n    actions: slot.optional(layout === 'inline' ? props.actions : null, {\n      renderByDefault: true,\n      elementType: 'div',\n    }),\n    label,\n    sensitivity: slot.optional(props.sensitivity, { elementType: 'span' }),\n    metadata: slot.always(props.metadata, { elementType: 'div' }),\n    primaryText: slot.optional(props.primaryText, {\n      defaultProps: {\n        hidden: !isExpanded,\n      },\n      elementType: 'span',\n    }),\n    secondaryText: slot.optional(props.secondaryText, {\n      defaultProps: {\n        hidden: !isExpanded,\n      },\n      elementType: 'span',\n    }),\n    tertiaryText: slot.optional(props.tertiaryText, {\n      defaultProps: {\n        hidden: !isExpanded,\n      },\n      elementType: 'span',\n    }),\n    icon: slot.optional(props.icon, { elementType: 'span' }),\n    content: slot.always(props.content, {\n      defaultProps: {\n        children: excerpt && <Caption1>{excerpt}</Caption1>,\n      },\n      elementType: 'div',\n    }),\n    detailsButton: slot.optional(layout === 'inline' ? props.detailsButton : null, {\n      defaultProps: {\n        appearance: 'transparent',\n        'aria-expanded': isExpanded,\n        'aria-label': 'show details',\n        size: mode === 'sidecar' ? 'small' : 'medium',\n        icon: {\n          children: getIcon(isExpanded, mode),\n        },\n      },\n      renderByDefault: true,\n      elementType: Button,\n    }),\n  };\n\n  if (state.detailsButton) {\n    const onClick = state.detailsButton.onClick as React.MouseEventHandler<HTMLButtonElement>;\n    state.detailsButton.onClick = mergeCallbacks(onClick, onExpandClick);\n  }\n\n  const referenceGroupSetOpen = useReferenceGroupSetOpen();\n  const onTargettedByCitation = (e: React.FocusEvent<HTMLElement>) => {\n    const relatedTargetHash: string | undefined = (e.relatedTarget as HTMLAnchorElement)?.hash;\n    if (relatedTargetHash && relatedTargetHash.substring(1) === referenceId) {\n      referenceGroupSetOpen();\n      setIsExpanded(true);\n    }\n  };\n  state.root.onFocus = mergeCallbacks(state.root.onFocus, onTargettedByCitation);\n\n  return state;\n};\n\nconst getIcon = (isExpanded: boolean, mode: ReferenceProps['mode']): JSX.Element => {\n  if (mode === 'sidecar') {\n    return !isExpanded ? <ChevronDown16Regular /> : <ChevronUp16Regular />;\n  }\n\n  return !isExpanded ? <ChevronDown24Regular /> : <ChevronUp24Regular />;\n};\n"],"names":["React","Button","Caption1","getIntrinsicElementProps","mergeCallbacks","mergeClasses","slot","useId","usePopoverContext_unstable","usePopoverContext","ChevronDown24Regular","ChevronUp24Regular","ChevronDown16Regular","ChevronUp16Regular","referenceExtraClassNames","Citation","useReferenceGroupSetOpen","useCopilotMode","useReference_unstable","props","ref","index","referenceId","citationHref","excerpt","layout","mode","labelId","mediaId","isExpanded","setIsExpanded","useState","setPopoverOpen","context","setOpen","onExpandClick","_e","label","always","defaultProps","id","elementType","media","optional","isValidElement","children","cloneElement","className","mediaChild","concat","ariaLabelledByProp","groupSemantics","useMemo","role","tabIndex","citationProps","onPopoverCloseClick","e","preventDefault","referenceHref","onClick","state","components","root","citation","actions","sensitivity","metadata","content","primaryText","secondaryText","tertiaryText","icon","detailsButton","block","renderByDefault","hidden","appearance","size","getIcon","referenceGroupSetOpen","onTargettedByCitation","relatedTargetHash","relatedTarget","hash","substring","onFocus"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["useReference.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  Button,\n  Caption1,\n  getIntrinsicElementProps,\n  mergeCallbacks,\n  mergeClasses,\n  slot,\n  useId,\n  usePopoverContext_unstable as usePopoverContext,\n} from '@fluentui/react-components';\nimport {\n  ChevronDown24Regular,\n  ChevronUp24Regular,\n  ChevronDown16Regular,\n  ChevronUp16Regular,\n} from '@fluentui/react-icons';\nimport { referenceExtraClassNames } from './useReferenceStyles.styles';\nimport { Citation } from '../Citation';\nimport type { ReferenceProps, ReferenceState } from './Reference.types';\nimport { useReferenceGroupSetOpen } from '../../contexts/ReferenceGroupContext';\nimport { useCopilotMode } from '@fluentui-copilot/react-provider';\n\n/**\n * Create the state required to render Reference.\n *\n * The returned state can be modified with hooks such as useReferenceStyles_unstable,\n * before being passed to renderReference_unstable.\n *\n * @param props - props from this instance of Reference\n * @param ref - reference to root HTMLElement of Reference\n *\n * deprecated Use ReferenceV2 component, hooks and types instead.\n */\nexport const useReference_unstable = (props: ReferenceProps, ref: React.Ref<HTMLDivElement>): ReferenceState => {\n  const { index, referenceId, citationHref, excerpt, layout = 'inline' } = props;\n\n  const mode = useCopilotMode(props.mode);\n\n  const labelId = useId();\n  const mediaId = useId();\n  const [isExpanded, setIsExpanded] = React.useState(layout === 'popover' ? true : false);\n\n  const setPopoverOpen = usePopoverContext(context => context.setOpen);\n\n  const onExpandClick: React.MouseEventHandler<HTMLButtonElement> = _e => {\n    setIsExpanded(!isExpanded);\n  };\n\n  const label = slot.always(props.label, {\n    defaultProps: { id: labelId },\n    elementType: 'div',\n  });\n  const media = slot.optional(props.media, { defaultProps: { id: mediaId }, elementType: 'div' });\n  if (media && React.isValidElement<HTMLElement>(media.children)) {\n    media.children = React.cloneElement(media.children, {\n      className: mergeClasses(media.children.props.className, referenceExtraClassNames.mediaChild),\n    });\n  }\n\n  if (media?.id) {\n    label['aria-describedby'] = label['aria-describedby']?.concat(media.id) ?? media.id;\n  }\n\n  const ariaLabelledByProp = props['aria-labelledby'];\n  const groupSemantics = React.useMemo(() => {\n    return layout === 'inline'\n      ? {\n          role: 'group',\n          'aria-labelledby': `${ariaLabelledByProp ?? ''} ${label.id}`,\n          tabIndex: -1,\n        }\n      : {};\n  }, [layout, ariaLabelledByProp, label.id]);\n\n  // Within a popup, a citation should function as a close button\n  const citationProps = React.useMemo(() => {\n    const onPopoverCloseClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n      setPopoverOpen(e, false);\n\n      // don't navigate\n      e.preventDefault();\n    };\n\n    return layout === 'popover'\n      ? {\n          referenceHref: '#',\n          tabIndex: -1,\n          'aria-label': `Reference ${index}, close`,\n          onClick: onPopoverCloseClick,\n        }\n      : {\n          referenceHref: citationHref,\n        };\n  }, [layout, citationHref, index, setPopoverOpen]);\n\n  const state: ReferenceState = {\n    isExpanded,\n    mode: layout === 'popover' ? 'sidecar' : mode,\n    layout,\n    index,\n    components: {\n      root: 'div',\n      citation: 'div',\n      media: 'div',\n      actions: 'div',\n      label: 'div',\n      sensitivity: 'span',\n      metadata: 'div',\n      content: 'div',\n      primaryText: 'span',\n      secondaryText: 'span',\n      tertiaryText: 'span',\n      icon: 'span',\n      detailsButton: Button,\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        ref,\n        id: referenceId,\n        ...groupSemantics,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n    citation: slot.optional(props.citation, {\n      defaultProps: {\n        children: (\n          <Citation block {...citationProps}>\n            {index}\n          </Citation>\n        ),\n      },\n      renderByDefault: true,\n      elementType: 'div',\n    }),\n    media,\n    actions: slot.optional(layout === 'inline' ? props.actions : null, {\n      renderByDefault: true,\n      elementType: 'div',\n    }),\n    label,\n    sensitivity: slot.optional(props.sensitivity, { elementType: 'span' }),\n    metadata: slot.always(props.metadata, { elementType: 'div' }),\n    primaryText: slot.optional(props.primaryText, {\n      defaultProps: {\n        hidden: !isExpanded,\n      },\n      elementType: 'span',\n    }),\n    secondaryText: slot.optional(props.secondaryText, {\n      defaultProps: {\n        hidden: !isExpanded,\n      },\n      elementType: 'span',\n    }),\n    tertiaryText: slot.optional(props.tertiaryText, {\n      defaultProps: {\n        hidden: !isExpanded,\n      },\n      elementType: 'span',\n    }),\n    icon: slot.optional(props.icon, { elementType: 'span' }),\n    content: slot.always(props.content, {\n      defaultProps: {\n        children: excerpt && <Caption1>{excerpt}</Caption1>,\n      },\n      elementType: 'div',\n    }),\n    detailsButton: slot.optional(layout === 'inline' ? props.detailsButton : null, {\n      defaultProps: {\n        appearance: 'transparent',\n        'aria-expanded': isExpanded,\n        'aria-label': 'show details',\n        size: mode === 'sidecar' ? 'small' : 'medium',\n        icon: {\n          children: getIcon(isExpanded, mode),\n        },\n      },\n      renderByDefault: true,\n      elementType: Button,\n    }),\n  };\n\n  if (state.detailsButton) {\n    const onClick = state.detailsButton.onClick as React.MouseEventHandler<HTMLButtonElement>;\n    state.detailsButton.onClick = mergeCallbacks(onClick, onExpandClick);\n  }\n\n  const referenceGroupSetOpen = useReferenceGroupSetOpen();\n  const onTargettedByCitation = (e: React.FocusEvent<HTMLElement>) => {\n    const relatedTargetHash: string | undefined = (e.relatedTarget as HTMLAnchorElement)?.hash;\n    if (relatedTargetHash && relatedTargetHash.substring(1) === referenceId) {\n      referenceGroupSetOpen();\n      setIsExpanded(true);\n    }\n  };\n  state.root.onFocus = mergeCallbacks(state.root.onFocus, onTargettedByCitation);\n\n  return state;\n};\n\nconst getIcon = (isExpanded: boolean, mode: ReferenceProps['mode']): JSX.Element => {\n  if (mode === 'sidecar') {\n    return !isExpanded ? <ChevronDown16Regular /> : <ChevronUp16Regular />;\n  }\n\n  return !isExpanded ? <ChevronDown24Regular /> : <ChevronUp24Regular />;\n};\n"],"names":["React","Button","Caption1","getIntrinsicElementProps","mergeCallbacks","mergeClasses","slot","useId","usePopoverContext_unstable","usePopoverContext","ChevronDown24Regular","ChevronUp24Regular","ChevronDown16Regular","ChevronUp16Regular","referenceExtraClassNames","Citation","useReferenceGroupSetOpen","useCopilotMode","useReference_unstable","props","ref","index","referenceId","citationHref","excerpt","layout","mode","labelId","mediaId","isExpanded","setIsExpanded","useState","setPopoverOpen","context","setOpen","onExpandClick","_e","label","always","defaultProps","id","elementType","media","optional","isValidElement","children","cloneElement","className","mediaChild","concat","ariaLabelledByProp","groupSemantics","useMemo","role","tabIndex","citationProps","onPopoverCloseClick","e","preventDefault","referenceHref","onClick","state","components","root","citation","actions","sensitivity","metadata","content","primaryText","secondaryText","tertiaryText","icon","detailsButton","block","renderByDefault","hidden","appearance","size","getIcon","referenceGroupSetOpen","onTargettedByCitation","relatedTargetHash","relatedTarget","hash","substring","onFocus"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib/components/Reference/useReferenceStyles.styles.js

@@ -1,4 +1,5 @@
 import { buttonClassNames, __resetStyles, __styles, mergeClasses, shorthands, tokens, typographyStyles } from '@fluentui/react-components';
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export const referenceClassNames = {
   root: 'fai-Reference',
   citation: 'fai-Reference__citation',
@@ -14,6 +15,7 @@ export const referenceClassNames = {
   content: 'fai-Reference__content',
   detailsButton: 'fai-Reference__detailsButton'
 };
+/** deprecated Use ReferenceV2 component, hooks and types instead. */
 export const referenceExtraClassNames = {
   text: 'fai-Reference__text',
   mediaChild: 'fai-Reference__mediaChild'
@@ -166,6 +168,8 @@ const useLabelStyles = __styles({
 });
 /**
  * Apply styling to the Reference slots based on the state
+ *
+ * deprecated Use ReferenceV2 component, hooks and types instead.
  */
 export const useReferenceStyles_unstable = state => {
   'use no memo';

package/lib/components/Reference/useReferenceStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useReferenceStyles.styles.ts"],"sourcesContent":["import {\n  buttonClassNames,\n  makeResetStyles,\n  makeStyles,\n  mergeClasses,\n  shorthands,\n  tokens,\n  typographyStyles,\n} from '@fluentui/react-components';\nimport type { ReferenceSlots, ReferenceState } from './Reference.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const referenceClassNames: SlotClassNames<ReferenceSlots> = {\n  root: 'fai-Reference',\n  citation: 'fai-Reference__citation',\n  media: 'fai-Reference__media',\n  actions: 'fai-Reference__actions',\n  sensitivity: 'fai-Reference__sensitivity',\n  metadata: 'fai-Reference__metadata',\n  primaryText: 'fai-Reference__primaryText',\n  secondaryText: 'fai-Reference__secondaryText',\n  tertiaryText: 'fai-Reference__tertiaryText',\n  icon: 'fai-Reference__icon',\n  label: 'fai-Reference__label',\n  content: 'fai-Reference__content',\n  detailsButton: 'fai-Reference__detailsButton',\n};\n\nexport const referenceExtraClassNames = {\n  text: 'fai-Reference__text',\n  mediaChild: 'fai-Reference__mediaChild',\n};\n\nconst labelFontSize = typographyStyles.caption1Strong.fontSize;\nconst labelLineHeight = typographyStyles.caption1Strong.lineHeight;\n\nconst maxPopoverWidth = '256px';\n\nconst useReferenceClassName = makeResetStyles({\n  boxSizing: 'border-box',\n  width: '100%',\n  display: 'grid',\n  gridTemplateAreas: `\n      \"citation         media            title            actions\"\n      \".                .                title            .\"\n      \"sensitivityLabel sensitivityLabel sensitivityLabel sensitivityLabel\"\n      \"metadata         metadata         metadata         metadata\"\n      \"content          content          content          content\"\n    `,\n  gridTemplateColumns: 'min-content min-content 1fr min-content',\n  gridTemplateRows: '32px auto auto auto auto',\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n  borderRadius: tokens.borderRadiusMedium,\n  padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`,\n  boxShadow: 'none',\n  columnGap: tokens.spacingHorizontalXS,\n  alignItems: 'center',\n});\n\nconst useStyles = makeStyles({\n  canvas: {},\n  sidecar: {\n    gridTemplateRows: '24px auto auto auto',\n    ...shorthands.padding(tokens.spacingVerticalXS, tokens.spacingHorizontalS),\n  },\n  inline: {},\n  popover: {\n    ...shorthands.borderWidth('0px'),\n    width: `calc(${maxPopoverWidth} - (${tokens.spacingHorizontalM} * 2))`,\n    ...shorthands.padding('0px'),\n  },\n  closed: {\n    rowGap: 0,\n  },\n  citation: {\n    ...shorthands.gridArea('citation'),\n  },\n  media: {\n    ...shorthands.gridArea('media'),\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  mediaPopover: {\n    width: '16px',\n    height: '16px',\n\n    [`> .${referenceExtraClassNames.mediaChild}`]: {\n      width: '16px',\n      height: '16px',\n    },\n  },\n  actions: {\n    ...shorthands.gridArea('actions'),\n    justifySelf: 'end',\n    display: 'flex',\n    gridRowStart: 1,\n  },\n  detailsButton: {\n    [`> ${buttonClassNames.icon}`]: {\n      color: tokens.colorNeutralForeground3,\n    },\n  },\n  sensitivity: {\n    ...shorthands.gridArea('sensitivityLabel'),\n    justifySelf: 'start',\n  },\n  metadata: {\n    marginTop: tokens.spacingVerticalXS,\n\n    ...shorthands.gridArea('metadata'),\n    ...typographyStyles.caption2,\n  },\n  metadataSubsequentText: {\n    position: 'relative',\n    marginLeft: tokens.spacingHorizontalS,\n\n    '&::before': {\n      content: '\"\"',\n      display: 'block',\n      position: 'absolute',\n      left: `calc(${tokens.spacingHorizontalS} / -2)`,\n      top: `calc((${typographyStyles.caption2.lineHeight} - ${typographyStyles.caption2.fontSize}) / 2)`,\n      height: typographyStyles.caption2.fontSize,\n      ...shorthands.borderLeft(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n    },\n  },\n  icon: {\n    ...typographyStyles.caption2,\n    verticalAlign: 'middle',\n  },\n  content: {\n    marginTop: tokens.spacingVerticalXS,\n    ...shorthands.gridArea('content'),\n    display: 'flex',\n    flexDirection: 'column',\n    rowGap: tokens.spacingVerticalS,\n    color: tokens.colorNeutralForeground3,\n    wordBreak: 'break-word',\n  },\n  hidden: {\n    display: 'none',\n  },\n});\n\nconst useLabelStyles = makeStyles({\n  root: {\n    ...shorthands.gridArea('title'),\n    alignSelf: 'start',\n    ...typographyStyles.caption1Strong,\n    wordBreak: 'break-word',\n    '-webkit-box-orient': 'vertical',\n    '-webkit-line-clamp': '2',\n    display: '-webkit-box',\n    overflowY: 'hidden',\n  },\n\n  canvas: {\n    // 24px is the height of the tallest element within the reference\n    paddingTop: `calc((24px / 2 ) - (${labelLineHeight} - ${labelFontSize}))`,\n  },\n\n  sidecar: {\n    // 16px is the height of the tallest element within the reference\n    paddingTop: `calc((16px / 2 ) - (${labelLineHeight} - ${labelFontSize}))`,\n  },\n\n  closed: {\n    maxWidth: '100%',\n    '-webkit-line-clamp': '1',\n  },\n});\n\n/**\n * Apply styling to the Reference slots based on the state\n */\nexport const useReferenceStyles_unstable = (state: ReferenceState): ReferenceState => {\n  'use no memo';\n\n  const { isExpanded, mode, layout } = state;\n\n  const rootClassName = useReferenceClassName();\n  const styles = useStyles();\n  const labelStyles = useLabelStyles();\n  state.root.className = mergeClasses(\n    referenceClassNames.root,\n    rootClassName,\n    styles[mode],\n    styles[layout],\n    !isExpanded && styles.closed,\n    state.root.className,\n  );\n\n  if (state.citation) {\n    state.citation.className = mergeClasses(referenceClassNames.citation, styles.citation, state.citation.className);\n  }\n\n  if (state.media) {\n    state.media.className = mergeClasses(\n      referenceClassNames.media,\n      styles.media,\n      layout === 'popover' && styles.mediaPopover,\n      state.media.className,\n    );\n  }\n\n  if (state.actions) {\n    state.actions.className = mergeClasses(referenceClassNames.actions, styles.actions, state.actions.className);\n  }\n\n  state.label.className = mergeClasses(\n    referenceClassNames.label,\n    labelStyles.root,\n    labelStyles[mode],\n    !isExpanded && labelStyles.closed,\n    state.label.className,\n  );\n\n  if (state.sensitivity) {\n    state.sensitivity.className = mergeClasses(\n      referenceClassNames.sensitivity,\n      styles.sensitivity,\n      !isExpanded && styles.hidden,\n      state.sensitivity.className,\n    );\n  }\n\n  state.metadata.className = mergeClasses(\n    referenceClassNames.metadata,\n    styles.metadata,\n    !isExpanded && styles.hidden,\n    state.metadata.className,\n  );\n\n  let isSubsequentText = false;\n  if (state.primaryText) {\n    state.primaryText.className = mergeClasses(\n      referenceClassNames.primaryText,\n      referenceExtraClassNames.text,\n      isSubsequentText && styles.metadataSubsequentText,\n      state.primaryText.className,\n    );\n    isSubsequentText = true;\n  }\n\n  if (state.secondaryText) {\n    state.secondaryText.className = mergeClasses(\n      referenceClassNames.secondaryText,\n      referenceExtraClassNames.text,\n      isSubsequentText && styles.metadataSubsequentText,\n      state.secondaryText.className,\n    );\n    isSubsequentText = true;\n  }\n\n  if (state.tertiaryText) {\n    state.tertiaryText.className = mergeClasses(\n      referenceClassNames.tertiaryText,\n      referenceExtraClassNames.text,\n      isSubsequentText && styles.metadataSubsequentText,\n      state.tertiaryText.className,\n    );\n    isSubsequentText = true;\n  }\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(referenceClassNames.icon, styles.icon, state.icon.className);\n  }\n  state.content.className = mergeClasses(\n    referenceClassNames.content,\n    styles.content,\n    !isExpanded && styles.hidden,\n    state.content.className,\n  );\n\n  if (state.detailsButton) {\n    state.detailsButton.className = mergeClasses(\n      referenceClassNames.detailsButton,\n      styles.detailsButton,\n      state.detailsButton.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["buttonClassNames","makeResetStyles","makeStyles","mergeClasses","shorthands","tokens","typographyStyles","referenceClassNames","root","citation","media","actions","sensitivity","metadata","primaryText","secondaryText","tertiaryText","icon","label","content","detailsButton","referenceExtraClassNames","text","mediaChild","labelFontSize","caption1Strong","fontSize","labelLineHeight","lineHeight","maxPopoverWidth","useReferenceClassName","boxSizing","width","display","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","border","strokeWidthThin","colorNeutralStroke1","borderRadius","borderRadiusMedium","padding","spacingVerticalS","spacingHorizontalS","boxShadow","columnGap","spacingHorizontalXS","alignItems","useStyles","canvas","sidecar","spacingVerticalXS","inline","popover","borderWidth","spacingHorizontalM","closed","rowGap","gridArea","justifyContent","mediaPopover","height","justifySelf","gridRowStart","color","colorNeutralForeground3","marginTop","caption2","metadataSubsequentText","position","marginLeft","left","top","borderLeft","colorNeutralStroke2","verticalAlign","flexDirection","wordBreak","hidden","useLabelStyles","alignSelf","overflowY","paddingTop","maxWidth","useReferenceStyles_unstable","state","isExpanded","mode","layout","rootClassName","styles","labelStyles","className","isSubsequentText"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
+{"version":3,"sources":["useReferenceStyles.styles.ts"],"sourcesContent":["import {\n  buttonClassNames,\n  makeResetStyles,\n  makeStyles,\n  mergeClasses,\n  shorthands,\n  tokens,\n  typographyStyles,\n} from '@fluentui/react-components';\nimport type { ReferenceSlots, ReferenceState } from './Reference.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\n/** deprecated Use ReferenceV2 component, hooks and types instead. */\nexport const referenceClassNames: SlotClassNames<ReferenceSlots> = {\n  root: 'fai-Reference',\n  citation: 'fai-Reference__citation',\n  media: 'fai-Reference__media',\n  actions: 'fai-Reference__actions',\n  sensitivity: 'fai-Reference__sensitivity',\n  metadata: 'fai-Reference__metadata',\n  primaryText: 'fai-Reference__primaryText',\n  secondaryText: 'fai-Reference__secondaryText',\n  tertiaryText: 'fai-Reference__tertiaryText',\n  icon: 'fai-Reference__icon',\n  label: 'fai-Reference__label',\n  content: 'fai-Reference__content',\n  detailsButton: 'fai-Reference__detailsButton',\n};\n\n/** deprecated Use ReferenceV2 component, hooks and types instead. */\nexport const referenceExtraClassNames = {\n  text: 'fai-Reference__text',\n  mediaChild: 'fai-Reference__mediaChild',\n};\n\nconst labelFontSize = typographyStyles.caption1Strong.fontSize;\nconst labelLineHeight = typographyStyles.caption1Strong.lineHeight;\n\nconst maxPopoverWidth = '256px';\n\nconst useReferenceClassName = makeResetStyles({\n  boxSizing: 'border-box',\n  width: '100%',\n  display: 'grid',\n  gridTemplateAreas: `\n      \"citation         media            title            actions\"\n      \".                .                title            .\"\n      \"sensitivityLabel sensitivityLabel sensitivityLabel sensitivityLabel\"\n      \"metadata         metadata         metadata         metadata\"\n      \"content          content          content          content\"\n    `,\n  gridTemplateColumns: 'min-content min-content 1fr min-content',\n  gridTemplateRows: '32px auto auto auto auto',\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n  borderRadius: tokens.borderRadiusMedium,\n  padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`,\n  boxShadow: 'none',\n  columnGap: tokens.spacingHorizontalXS,\n  alignItems: 'center',\n});\n\nconst useStyles = makeStyles({\n  canvas: {},\n  sidecar: {\n    gridTemplateRows: '24px auto auto auto',\n    ...shorthands.padding(tokens.spacingVerticalXS, tokens.spacingHorizontalS),\n  },\n  inline: {},\n  popover: {\n    ...shorthands.borderWidth('0px'),\n    width: `calc(${maxPopoverWidth} - (${tokens.spacingHorizontalM} * 2))`,\n    ...shorthands.padding('0px'),\n  },\n  closed: {\n    rowGap: 0,\n  },\n  citation: {\n    ...shorthands.gridArea('citation'),\n  },\n  media: {\n    ...shorthands.gridArea('media'),\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  mediaPopover: {\n    width: '16px',\n    height: '16px',\n\n    [`> .${referenceExtraClassNames.mediaChild}`]: {\n      width: '16px',\n      height: '16px',\n    },\n  },\n  actions: {\n    ...shorthands.gridArea('actions'),\n    justifySelf: 'end',\n    display: 'flex',\n    gridRowStart: 1,\n  },\n  detailsButton: {\n    [`> ${buttonClassNames.icon}`]: {\n      color: tokens.colorNeutralForeground3,\n    },\n  },\n  sensitivity: {\n    ...shorthands.gridArea('sensitivityLabel'),\n    justifySelf: 'start',\n  },\n  metadata: {\n    marginTop: tokens.spacingVerticalXS,\n\n    ...shorthands.gridArea('metadata'),\n    ...typographyStyles.caption2,\n  },\n  metadataSubsequentText: {\n    position: 'relative',\n    marginLeft: tokens.spacingHorizontalS,\n\n    '&::before': {\n      content: '\"\"',\n      display: 'block',\n      position: 'absolute',\n      left: `calc(${tokens.spacingHorizontalS} / -2)`,\n      top: `calc((${typographyStyles.caption2.lineHeight} - ${typographyStyles.caption2.fontSize}) / 2)`,\n      height: typographyStyles.caption2.fontSize,\n      ...shorthands.borderLeft(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n    },\n  },\n  icon: {\n    ...typographyStyles.caption2,\n    verticalAlign: 'middle',\n  },\n  content: {\n    marginTop: tokens.spacingVerticalXS,\n    ...shorthands.gridArea('content'),\n    display: 'flex',\n    flexDirection: 'column',\n    rowGap: tokens.spacingVerticalS,\n    color: tokens.colorNeutralForeground3,\n    wordBreak: 'break-word',\n  },\n  hidden: {\n    display: 'none',\n  },\n});\n\nconst useLabelStyles = makeStyles({\n  root: {\n    ...shorthands.gridArea('title'),\n    alignSelf: 'start',\n    ...typographyStyles.caption1Strong,\n    wordBreak: 'break-word',\n    '-webkit-box-orient': 'vertical',\n    '-webkit-line-clamp': '2',\n    display: '-webkit-box',\n    overflowY: 'hidden',\n  },\n\n  canvas: {\n    // 24px is the height of the tallest element within the reference\n    paddingTop: `calc((24px / 2 ) - (${labelLineHeight} - ${labelFontSize}))`,\n  },\n\n  sidecar: {\n    // 16px is the height of the tallest element within the reference\n    paddingTop: `calc((16px / 2 ) - (${labelLineHeight} - ${labelFontSize}))`,\n  },\n\n  closed: {\n    maxWidth: '100%',\n    '-webkit-line-clamp': '1',\n  },\n});\n\n/**\n * Apply styling to the Reference slots based on the state\n *\n * deprecated Use ReferenceV2 component, hooks and types instead.\n */\nexport const useReferenceStyles_unstable = (state: ReferenceState): ReferenceState => {\n  'use no memo';\n\n  const { isExpanded, mode, layout } = state;\n\n  const rootClassName = useReferenceClassName();\n  const styles = useStyles();\n  const labelStyles = useLabelStyles();\n  state.root.className = mergeClasses(\n    referenceClassNames.root,\n    rootClassName,\n    styles[mode],\n    styles[layout],\n    !isExpanded && styles.closed,\n    state.root.className,\n  );\n\n  if (state.citation) {\n    state.citation.className = mergeClasses(referenceClassNames.citation, styles.citation, state.citation.className);\n  }\n\n  if (state.media) {\n    state.media.className = mergeClasses(\n      referenceClassNames.media,\n      styles.media,\n      layout === 'popover' && styles.mediaPopover,\n      state.media.className,\n    );\n  }\n\n  if (state.actions) {\n    state.actions.className = mergeClasses(referenceClassNames.actions, styles.actions, state.actions.className);\n  }\n\n  state.label.className = mergeClasses(\n    referenceClassNames.label,\n    labelStyles.root,\n    labelStyles[mode],\n    !isExpanded && labelStyles.closed,\n    state.label.className,\n  );\n\n  if (state.sensitivity) {\n    state.sensitivity.className = mergeClasses(\n      referenceClassNames.sensitivity,\n      styles.sensitivity,\n      !isExpanded && styles.hidden,\n      state.sensitivity.className,\n    );\n  }\n\n  state.metadata.className = mergeClasses(\n    referenceClassNames.metadata,\n    styles.metadata,\n    !isExpanded && styles.hidden,\n    state.metadata.className,\n  );\n\n  let isSubsequentText = false;\n  if (state.primaryText) {\n    state.primaryText.className = mergeClasses(\n      referenceClassNames.primaryText,\n      referenceExtraClassNames.text,\n      isSubsequentText && styles.metadataSubsequentText,\n      state.primaryText.className,\n    );\n    isSubsequentText = true;\n  }\n\n  if (state.secondaryText) {\n    state.secondaryText.className = mergeClasses(\n      referenceClassNames.secondaryText,\n      referenceExtraClassNames.text,\n      isSubsequentText && styles.metadataSubsequentText,\n      state.secondaryText.className,\n    );\n    isSubsequentText = true;\n  }\n\n  if (state.tertiaryText) {\n    state.tertiaryText.className = mergeClasses(\n      referenceClassNames.tertiaryText,\n      referenceExtraClassNames.text,\n      isSubsequentText && styles.metadataSubsequentText,\n      state.tertiaryText.className,\n    );\n    isSubsequentText = true;\n  }\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(referenceClassNames.icon, styles.icon, state.icon.className);\n  }\n  state.content.className = mergeClasses(\n    referenceClassNames.content,\n    styles.content,\n    !isExpanded && styles.hidden,\n    state.content.className,\n  );\n\n  if (state.detailsButton) {\n    state.detailsButton.className = mergeClasses(\n      referenceClassNames.detailsButton,\n      styles.detailsButton,\n      state.detailsButton.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["buttonClassNames","makeResetStyles","makeStyles","mergeClasses","shorthands","tokens","typographyStyles","referenceClassNames","root","citation","media","actions","sensitivity","metadata","primaryText","secondaryText","tertiaryText","icon","label","content","detailsButton","referenceExtraClassNames","text","mediaChild","labelFontSize","caption1Strong","fontSize","labelLineHeight","lineHeight","maxPopoverWidth","useReferenceClassName","boxSizing","width","display","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","border","strokeWidthThin","colorNeutralStroke1","borderRadius","borderRadiusMedium","padding","spacingVerticalS","spacingHorizontalS","boxShadow","columnGap","spacingHorizontalXS","alignItems","useStyles","canvas","sidecar","spacingVerticalXS","inline","popover","borderWidth","spacingHorizontalM","closed","rowGap","gridArea","justifyContent","mediaPopover","height","justifySelf","gridRowStart","color","colorNeutralForeground3","marginTop","caption2","metadataSubsequentText","position","marginLeft","left","top","borderLeft","colorNeutralStroke2","verticalAlign","flexDirection","wordBreak","hidden","useLabelStyles","alignSelf","overflowY","paddingTop","maxWidth","useReferenceStyles_unstable","state","isExpanded","mode","layout","rootClassName","styles","labelStyles","className","isSubsequentText"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib/components/ReferenceGroupToggle/ReferenceGroupToggle.js

@@ -2,7 +2,7 @@ import * as React from 'react';
 import { useReferenceGroupToggle_unstable } from './useReferenceGroupToggle';
 import { renderReferenceGroupToggle_unstable } from './renderReferenceGroupToggle';
 import { useReferenceGroupToggleStyles_unstable } from './useReferenceGroupToggleStyles.styles';
-// ReferenceGroupToggle component - TODO: add more docs
+/** deprecated The ReferenceGroup pattern is deprecated and will be removed in a future release. */
 export const ReferenceGroupToggle = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useReferenceGroupToggle_unstable(props, ref);
   useReferenceGroupToggleStyles_unstable(state);

package/lib/components/ReferenceGroupToggle/ReferenceGroupToggle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ReferenceGroupToggle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReferenceGroupToggle_unstable } from './useReferenceGroupToggle';\nimport { renderReferenceGroupToggle_unstable } from './renderReferenceGroupToggle';\nimport { useReferenceGroupToggleStyles_unstable } from './useReferenceGroupToggleStyles.styles';\nimport type { ReferenceGroupToggleProps } from './ReferenceGroupToggle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n// ReferenceGroupToggle component - TODO: add more docs\nexport const ReferenceGroupToggle: ForwardRefComponent<ReferenceGroupToggleProps> = React.forwardRef((props, ref) => {\n  const state = useReferenceGroupToggle_unstable(props, ref);\n\n  useReferenceGroupToggleStyles_unstable(state);\n  return renderReferenceGroupToggle_unstable(state);\n});\n\nReferenceGroupToggle.displayName = 'ReferenceGroupToggle';\n"],"names":["React","useReferenceGroupToggle_unstable","renderReferenceGroupToggle_unstable","useReferenceGroupToggleStyles_unstable","ReferenceGroupToggle","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gCAAgC,QAAQ,4BAA4B;AAC7E,SAASC,mCAAmC,QAAQ,+BAA+B;AACnF,SAASC,sCAAsC,QAAQ,yCAAyC;AAIhG,uDAAuD;AACvD,OAAO,MAAMC,qCAAuEJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IAC3G,MAAMC,QAAQP,iCAAiCK,OAAOC;IAEtDJ,uCAAuCK;IACvC,OAAON,oCAAoCM;AAC7C,GAAG;AAEHJ,qBAAqBK,WAAW,GAAG"}
+{"version":3,"sources":["ReferenceGroupToggle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReferenceGroupToggle_unstable } from './useReferenceGroupToggle';\nimport { renderReferenceGroupToggle_unstable } from './renderReferenceGroupToggle';\nimport { useReferenceGroupToggleStyles_unstable } from './useReferenceGroupToggleStyles.styles';\nimport type { ReferenceGroupToggleProps } from './ReferenceGroupToggle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n/** deprecated The ReferenceGroup pattern is deprecated and will be removed in a future release. */\nexport const ReferenceGroupToggle: ForwardRefComponent<ReferenceGroupToggleProps> = React.forwardRef((props, ref) => {\n  const state = useReferenceGroupToggle_unstable(props, ref);\n\n  useReferenceGroupToggleStyles_unstable(state);\n  return renderReferenceGroupToggle_unstable(state);\n});\n\nReferenceGroupToggle.displayName = 'ReferenceGroupToggle';\n"],"names":["React","useReferenceGroupToggle_unstable","renderReferenceGroupToggle_unstable","useReferenceGroupToggleStyles_unstable","ReferenceGroupToggle","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gCAAgC,QAAQ,4BAA4B;AAC7E,SAASC,mCAAmC,QAAQ,+BAA+B;AACnF,SAASC,sCAAsC,QAAQ,yCAAyC;AAIhG,iGAAiG,GACjG,OAAO,MAAMC,qCAAuEJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IAC3G,MAAMC,QAAQP,iCAAiCK,OAAOC;IAEtDJ,uCAAuCK;IACvC,OAAON,oCAAoCM;AAC7C,GAAG;AAEHJ,qBAAqBK,WAAW,GAAG"}

package/lib/components/ReferenceList/ReferenceList.js

@@ -3,7 +3,7 @@ import { useReferenceList_unstable } from './useReferenceList';
 import { renderReferenceList_unstable } from './renderReferenceList';
 import { useReferenceListStyles_unstable } from './useReferenceListStyles.styles';
 import { useCustomStyleHook } from '@fluentui-copilot/react-provider';
-//ReferenceList component - TODO: add more docs
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */
 export const ReferenceList = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useReferenceList_unstable(props, ref);
   useReferenceListStyles_unstable(state);

package/lib/components/ReferenceList/ReferenceList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ReferenceList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReferenceList_unstable } from './useReferenceList';\nimport { renderReferenceList_unstable } from './renderReferenceList';\nimport { useReferenceListStyles_unstable } from './useReferenceListStyles.styles';\nimport type { ReferenceListProps } from './ReferenceList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n//ReferenceList component - TODO: add more docs\nexport const ReferenceList: ForwardRefComponent<ReferenceListProps> = React.forwardRef((props, ref) => {\n  const state = useReferenceList_unstable(props, ref);\n\n  useReferenceListStyles_unstable(state);\n  useCustomStyleHook('useReferenceListStyles')(state);\n\n  return renderReferenceList_unstable(state);\n});\n\nReferenceList.displayName = 'ReferenceList';\n"],"names":["React","useReferenceList_unstable","renderReferenceList_unstable","useReferenceListStyles_unstable","useCustomStyleHook","ReferenceList","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,kCAAkC;AAGlF,SAASC,kBAAkB,QAAQ,mCAAmC;AAEtE,+CAA+C;AAC/C,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,0BAA0BM,OAAOC;IAE/CL,gCAAgCM;IAChCL,mBAAmB,0BAA0BK;IAE7C,OAAOP,6BAA6BO;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}
+{"version":3,"sources":["ReferenceList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReferenceList_unstable } from './useReferenceList';\nimport { renderReferenceList_unstable } from './renderReferenceList';\nimport { useReferenceListStyles_unstable } from './useReferenceListStyles.styles';\nimport type { ReferenceListProps } from './ReferenceList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n/** deprecated Use ReferenceListV2 component, hooks and types instead. */\nexport const ReferenceList: ForwardRefComponent<ReferenceListProps> = React.forwardRef((props, ref) => {\n  const state = useReferenceList_unstable(props, ref);\n\n  useReferenceListStyles_unstable(state);\n  useCustomStyleHook('useReferenceListStyles')(state);\n\n  return renderReferenceList_unstable(state);\n});\n\nReferenceList.displayName = 'ReferenceList';\n"],"names":["React","useReferenceList_unstable","renderReferenceList_unstable","useReferenceListStyles_unstable","useCustomStyleHook","ReferenceList","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,kCAAkC;AAGlF,SAASC,kBAAkB,QAAQ,mCAAmC;AAEtE,uEAAuE,GACvE,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,0BAA0BM,OAAOC;IAE/CL,gCAAgCM;IAChCL,mBAAmB,0BAA0BK;IAE7C,OAAOP,6BAA6BO;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}

package/lib/components/ReferenceList/ReferenceList.types.js

@@ -1,4 +1,2 @@
-/**
- * State used in rendering ReferenceList
- */export {};
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */export {};
 //# sourceMappingURL=ReferenceList.types.js.map

package/lib/components/ReferenceList/ReferenceList.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ReferenceList.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type ReferenceListSlots = {\n  /**\n   * The root slot.\n   */\n  root: Slot<'ol'>;\n};\n\n/**\n * ReferenceList Props\n */\nexport type ReferenceListProps = ComponentProps<ReferenceListSlots>;\n\n/**\n * State used in rendering ReferenceList\n */\nexport type ReferenceListState = ComponentState<ReferenceListSlots>;\n"],"names":[],"rangeMappings":";;","mappings":"AAcA;;CAEC,GACD,WAAoE"}
+{"version":3,"sources":["ReferenceList.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\n/** deprecated Use ReferenceListV2 component, hooks and types instead. */\nexport type ReferenceListSlots = {\n  /**\n   * The root slot.\n   */\n  root: Slot<'ol'>;\n};\n\n/** deprecated Use ReferenceListV2 component, hooks and types instead. */\nexport type ReferenceListProps = ComponentProps<ReferenceListSlots>;\n\n/** deprecated Use ReferenceListV2 component, hooks and types instead. */\nexport type ReferenceListState = ComponentState<ReferenceListSlots>;\n"],"names":[],"rangeMappings":"","mappings":"AAaA,uEAAuE,GACvE,WAAoE"}

package/lib/components/ReferenceList/renderReferenceList.js

@@ -1,8 +1,6 @@
 import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
 import { assertSlots } from '@fluentui/react-components';
-/**
- * Render the final JSX of ReferenceList
- */
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */
 export const renderReferenceList_unstable = state => {
   assertSlots(state);
   return /*#__PURE__*/_jsx(state.root, {});

package/lib/components/ReferenceList/renderReferenceList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderReferenceList.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { ReferenceListState, ReferenceListSlots } from './ReferenceList.types';\n\n/**\n * Render the final JSX of ReferenceList\n */\nexport const renderReferenceList_unstable = (state: ReferenceListState) => {\n  assertSlots<ReferenceListSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderReferenceList_unstable","state","root"],"rangeMappings":";;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAGzD;;CAEC,GACD,OAAO,MAAMC,+BAA+B,CAACC;IAC3CF,YAAgCE;IAEhC,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
+{"version":3,"sources":["renderReferenceList.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { ReferenceListState, ReferenceListSlots } from './ReferenceList.types';\n\n/** deprecated Use ReferenceListV2 component, hooks and types instead. */\nexport const renderReferenceList_unstable = (state: ReferenceListState) => {\n  assertSlots<ReferenceListSlots>(state);\n\n  return <state.root />;\n};\n"],"names":["assertSlots","renderReferenceList_unstable","state","root"],"rangeMappings":";;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAGzD,uEAAuE,GACvE,OAAO,MAAMC,+BAA+B,CAACC;IAC3CF,YAAgCE;IAEhC,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

package/lib/components/ReferenceList/useReferenceList.js

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { getIntrinsicElementProps, slot } from '@fluentui/react-components';
 import { referenceListItemClassName } from './useReferenceListStyles.styles';
-// If you add JSX to this file, be sure to change the file type to .tsx
 /**
  * Create the state required to render ReferenceList.
  *
@@ -10,6 +9,8 @@ import { referenceListItemClassName } from './useReferenceListStyles.styles';
  *
  * @param props - props from this instance of ReferenceList
  * @param ref - reference to root HTMLElement of ReferenceList
+ *
+ * deprecated Use ReferenceListV2 component, hooks and types instead.
  */
 export const useReferenceList_unstable = (props, ref) => {
   return {