@fluentui-copilot/react-reference 0.0.0-nightly-20240424-0405-f2067016.1 → 0.0.0-nightly-20240429-0406-78118c43.1

package/CHANGELOG.json

@@ -2,9 +2,9 @@
   "name": "@fluentui-copilot/react-reference",
   "entries": [
     {
-      "date": "Wed, 24 Apr 2024 04:10:33 GMT",
-      "tag": "@fluentui-copilot/react-reference_v0.0.0-nightly-20240424-0405-f2067016.1",
-      "version": "0.0.0-nightly-20240424-0405-f2067016.1",
+      "date": "Mon, 29 Apr 2024 04:12:20 GMT",
+      "tag": "@fluentui-copilot/react-reference_v0.0.0-nightly-20240429-0406-78118c43.1",
+      "version": "0.0.0-nightly-20240429-0406-78118c43.1",
       "comments": {
         "prerelease": [
           {
@@ -16,20 +16,20 @@
           {
             "author": "beachball",
             "package": "@fluentui-copilot/react-reference",
-            "comment": "Bump @fluentui-copilot/react-preview to v0.0.0-nightly-20240424-0405-f2067016.1",
-            "commit": "6d777f0fe019d3253f818ecb52b3d31e7b0196b3"
+            "comment": "Bump @fluentui-copilot/react-preview to v0.0.0-nightly-20240429-0406-78118c43.1",
+            "commit": "e5e3b8d8f83b7fa417d3de863cd522b0f61ec6f6"
           },
           {
             "author": "beachball",
             "package": "@fluentui-copilot/react-reference",
-            "comment": "Bump @fluentui-copilot/react-provider to v0.0.0-nightly-20240424-0405-f2067016.1",
-            "commit": "6d777f0fe019d3253f818ecb52b3d31e7b0196b3"
+            "comment": "Bump @fluentui-copilot/react-provider to v0.0.0-nightly-20240429-0406-78118c43.1",
+            "commit": "e5e3b8d8f83b7fa417d3de863cd522b0f61ec6f6"
           },
           {
             "author": "beachball",
             "package": "@fluentui-copilot/react-reference",
-            "comment": "Bump @fluentui-copilot/react-sensitivity-label to v0.0.0-nightly-20240424-0405-f2067016.1",
-            "commit": "6d777f0fe019d3253f818ecb52b3d31e7b0196b3"
+            "comment": "Bump @fluentui-copilot/react-sensitivity-label to v0.0.0-nightly-20240429-0406-78118c43.1",
+            "commit": "e5e3b8d8f83b7fa417d3de863cd522b0f61ec6f6"
           }
         ]
       }

package/CHANGELOG.md

@@ -1,20 +1,20 @@
 # Change Log - @fluentui-copilot/react-reference
 
-This log was last generated on Wed, 24 Apr 2024 04:10:33 GMT and should not be manually modified.
+This log was last generated on Mon, 29 Apr 2024 04:12:20 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [0.0.0-nightly-20240424-0405-f2067016.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-reference_v0.0.0-nightly-20240424-0405-f2067016.1)
+## [0.0.0-nightly-20240429-0406-78118c43.1](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-reference_v0.0.0-nightly-20240429-0406-78118c43.1)
 
-Wed, 24 Apr 2024 04:10:33 GMT 
-[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-reference_v0.11.0..@fluentui-copilot/react-reference_v0.0.0-nightly-20240424-0405-f2067016.1)
+Mon, 29 Apr 2024 04:12:20 GMT 
+[Compare changes](https://github.com/microsoft/fluentai/compare/@fluentui-copilot/react-reference_v0.11.0..@fluentui-copilot/react-reference_v0.0.0-nightly-20240429-0406-78118c43.1)
 
 ### Changes
 
 - Release nightly ([commit](https://github.com/microsoft/fluentai/commit/not available) by fluentui-internal@service.microsoft.com)
-- Bump @fluentui-copilot/react-preview to v0.0.0-nightly-20240424-0405-f2067016.1 ([commit](https://github.com/microsoft/fluentai/commit/6d777f0fe019d3253f818ecb52b3d31e7b0196b3) by beachball)
-- Bump @fluentui-copilot/react-provider to v0.0.0-nightly-20240424-0405-f2067016.1 ([commit](https://github.com/microsoft/fluentai/commit/6d777f0fe019d3253f818ecb52b3d31e7b0196b3) by beachball)
-- Bump @fluentui-copilot/react-sensitivity-label to v0.0.0-nightly-20240424-0405-f2067016.1 ([commit](https://github.com/microsoft/fluentai/commit/6d777f0fe019d3253f818ecb52b3d31e7b0196b3) by beachball)
+- Bump @fluentui-copilot/react-preview to v0.0.0-nightly-20240429-0406-78118c43.1 ([commit](https://github.com/microsoft/fluentai/commit/e5e3b8d8f83b7fa417d3de863cd522b0f61ec6f6) by beachball)
+- Bump @fluentui-copilot/react-provider to v0.0.0-nightly-20240429-0406-78118c43.1 ([commit](https://github.com/microsoft/fluentai/commit/e5e3b8d8f83b7fa417d3de863cd522b0f61ec6f6) by beachball)
+- Bump @fluentui-copilot/react-sensitivity-label to v0.0.0-nightly-20240429-0406-78118c43.1 ([commit](https://github.com/microsoft/fluentai/commit/e5e3b8d8f83b7fa417d3de863cd522b0f61ec6f6) by beachball)
 
 ## [0.11.0](https://github.com/microsoft/fluentai/tree/@fluentui-copilot/react-reference_v0.11.0)
 

package/dist/index.d.ts

@@ -1,11 +1,18 @@
+/// <reference types="react" />
+
 import type { Button } from '@fluentui/react-components';
 import type { ComponentProps } from '@fluentui/react-components';
 import type { ComponentState } from '@fluentui/react-components';
+import type { Context } from '@fluentui/react-context-selector';
+import type { ContextSelector } from '@fluentui/react-context-selector';
+import { FC } from 'react';
 import type { ForwardRefComponent } from '@fluentui/react-components';
 import type { PopoverProps } from '@fluentui/react-components';
 import type { PopoverSurfaceProps } from '@fluentui/react-components';
 import type { PopoverSurfaceSlots } from '@fluentui/react-components';
 import type { PositioningShorthand } from '@fluentui/react-components';
+import { Provider } from 'react';
+import { ProviderProps } from 'react';
 import * as React_2 from 'react';
 import type { Slot } from '@fluentui/react-components';
 import type { SlotClassNames } from '@fluentui/react-components';
@@ -59,6 +66,12 @@ export declare type PackagedCitation = React_2.FC<PackagedCitationProps>;
  */
 export declare type PackagedCitationProps = Omit<CitationProps, 'referenceHref'> & Partial<Pick<CitationProps, 'referenceHref'>>;
 
+export declare type PackagedCitationV2 = React_2.FC<CitationProps>;
+
+export declare type PackagedPreviewContentV2Props = Pick<PreviewMetadataProps, 'icon' | 'primaryText' | 'secondaryText' | 'tertiaryText'> & {
+    content?: React_2.ReactNode;
+};
+
 /**
  * A "packaged Reference". A packaged Reference is a `Reference` that is
  * pre-packaged with props set by the `useReferenceCitation` hook.
@@ -71,8 +84,35 @@ export declare type PackagedReference = React_2.FC<PackagedReferenceProps>;
  */
 export declare type PackagedReferenceProps = Omit<ReferenceProps, PartialReferenceProps> & Partial<Pick<ReferenceProps, PartialReferenceProps>>;
 
+export declare type PackagedReferenceV2 = React_2.FC<ReferenceV2Props>;
+
 declare type PartialReferenceProps = 'citationHref' | 'index' | 'referenceId';
 
+/**
+ * PreviewMetadata Props
+ */
+declare type PreviewMetadataProps = ComponentProps<Partial<PreviewMetadataSlots>>;
+
+declare type PreviewMetadataSlots = {
+    root: Slot<'div'>;
+    /**
+     * Icon slot in the metadata displayed after all text.
+     */
+    icon: Slot<'span'>;
+    /**
+     * First text displayed in the metadata.
+     */
+    primaryText: Slot<'span'>;
+    /**
+     * Second text displayed in the metadata.
+     */
+    secondaryText: Slot<'span'>;
+    /**
+     * Third text displayed in the metadata.
+     */
+    tertiaryText: Slot<'span'>;
+};
+
 /**
  * Preview Props
  */
@@ -131,6 +171,15 @@ export declare const ReferenceList: ForwardRefComponent<ReferenceListProps>;
 
 export declare const referenceListClassNames: SlotClassNames<ReferenceListSlots>;
 
+export declare const ReferenceListContext: Context<ReferenceListContextValue>;
+
+export declare const ReferenceListContextProvider: Provider<ReferenceListContextValue> & FC<ProviderProps<ReferenceListContextValue>>;
+
+/**
+ * Context shared between ReferenceList and its children components
+ */
+export declare type ReferenceListContextValue = Pick<ReferenceListV2State, 'appearance' | 'areReferencesExpanded' | 'overflowButtonTriggeredViaKeyboard' | 'previousOverflowCount' | 'shouldUseOverflow'>;
+
 /**
  * ReferenceList Props
  */
@@ -148,6 +197,69 @@ export declare type ReferenceListSlots = {
  */
 export declare type ReferenceListState = ComponentState<ReferenceListSlots>;
 
+export declare const ReferenceListV2: ForwardRefComponent<ReferenceListV2Props>;
+
+export declare const referenceListV2ClassNames: SlotClassNames<ReferenceListV2Slots>;
+
+export declare type ReferenceListV2ContextValues = {
+    referenceList: ReferenceListContextValue;
+};
+
+export declare type ReferenceListV2Props = ComponentProps<ReferenceListV2Slots> & {
+    /**
+     * The appearance of the reference.
+     * @default 'lighter'
+     */
+    appearance?: 'lighter' | 'darker';
+    /**
+     * The maximum number of references to display before the overflow button is shown even if there is
+     * enough space available to show more.
+     * If not set, the overflow functionality will be disabled.
+     * @default undefined
+     */
+    maxVisibleReferences?: number;
+};
+
+export declare type ReferenceListV2Slots = {
+    root: NonNullable<Slot<'div'>>;
+    showMoreButton?: Slot<'span'>;
+    showLessButton?: Slot<'span'>;
+};
+
+export declare type ReferenceListV2State = ComponentState<ReferenceListV2Slots> & Required<Pick<ReferenceListV2Props, 'appearance'>> & {
+    areReferencesExpanded: boolean;
+    overflowButtonTriggeredViaKeyboard: React.MutableRefObject<boolean>;
+    previousOverflowCount: React.MutableRefObject<number>;
+    shouldUseOverflow: boolean;
+};
+
+export declare const ReferenceOverflowButton: ForwardRefComponent<ReferenceOverflowButtonProps>;
+
+export declare const referenceOverflowButtonClassNames: SlotClassNames<ReferenceOverflowButtonSlots>;
+
+/**
+ * ReferenceOverflowButton Props
+ */
+export declare type ReferenceOverflowButtonProps = ComponentProps<ReferenceOverflowButtonSlots> & {
+    /**
+     * The appearance of the reference.
+     * @default 'lighter'
+     */
+    appearance?: 'lighter' | 'darker';
+    text?: string | ((overflowCount: number) => React.ReactNode);
+};
+
+export declare type ReferenceOverflowButtonSlots = {
+    root: Slot<'button'>;
+};
+
+/**
+ * State used in rendering ReferenceOverflowButton
+ */
+export declare type ReferenceOverflowButtonState = ComponentState<ReferenceOverflowButtonSlots> & Required<Pick<ReferenceOverflowButtonProps, 'appearance'>> & {
+    shouldRenderOverflowButton: boolean;
+};
+
 /**
  * Reference Props
  */
@@ -239,6 +351,32 @@ export declare type ReferenceState = ComponentState<ReferenceSlots> & Required<P
     isExpanded: boolean;
 };
 
+export declare const ReferenceV2: ForwardRefComponent<ReferenceV2Props>;
+
+export declare const referenceV2ClassNames: SlotClassNames<ReferenceV2Slots>;
+
+export declare const referenceV2ExtraClassNames: {
+    mediaChild: string;
+};
+
+export declare type ReferenceV2Props = ComponentProps<Partial<ReferenceV2Slots>> & {
+    /**
+     * The appearance of the reference.
+     * @default 'lighter'
+     */
+    appearance?: 'lighter' | 'darker';
+};
+
+export declare type ReferenceV2Slots = {
+    root: NonNullable<Slot<'button'>>;
+    citation?: Slot<'span'>;
+    divider?: Slot<'span'>;
+    content?: Slot<'span'>;
+    media?: Slot<'span'>;
+};
+
+export declare type ReferenceV2State = ComponentState<ReferenceV2Slots> & Required<Pick<ReferenceV2Props, 'appearance' | 'id'>> & Pick<ReferenceListV2State, 'shouldUseOverflow'>;
+
 /**
  * Render the final JSX of Citation
  */
@@ -259,6 +397,18 @@ export declare const renderReferenceGroupToggle_unstable: (state: ReferenceGroup
  */
 export declare const renderReferenceList_unstable: (state: ReferenceListState) => JSX.Element;
 
+/**
+ * Render the final JSX of ReferenceList
+ */
+export declare const renderReferenceListV2_unstable: (state: ReferenceListV2State, contextValues: ReferenceListV2ContextValues) => JSX.Element;
+
+/**
+ * Render the final JSX of ReferenceOverflowButton
+ */
+export declare const renderReferenceOverflowButton_unstable: (state: ReferenceOverflowButtonState) => JSX.Element | null;
+
+export declare const renderReferenceV2_unstable: (state: ReferenceV2State) => JSX.Element;
+
 /**
  * SensitivityLabel Props
  */
@@ -330,6 +480,25 @@ export declare type UseReferenceCitationPreview = (data: ReferenceCitationData)
  */
 export declare const useReferenceCitationPreview: UseReferenceCitationPreview;
 
+export declare type UseReferenceCitationPreviewV2 = (props: UseReferenceCitationPreviewV2Props) => {
+    Citation: PackagedCitationV2;
+    Reference: PackagedReferenceV2;
+};
+
+export declare const useReferenceCitationPreviewV2: UseReferenceCitationPreviewV2;
+
+export declare type UseReferenceCitationPreviewV2Props = {
+    citationPreviewProps?: PreviewProps;
+    citationPreviewSurfaceProps?: PreviewSurfaceProps;
+    citationProps?: CitationProps;
+    index: number;
+    previewContentProps?: PackagedPreviewContentV2Props;
+    referencePreviewProps?: PreviewProps;
+    referencePreviewSurfaceProps?: PreviewSurfaceProps;
+    referenceProps?: ReferenceV2Props;
+    sensitivityLabelProps?: SensitivityLabelProps;
+};
+
 export declare type UseReferenceGroup = (props: UseReferenceGroupProps) => {
     referenceGroupToggleProps: ReferenceGroupToggleProps;
     referenceListProps: ReferenceListProps;
@@ -375,14 +544,64 @@ export declare const useReferenceGroupToggleStyles_unstable: (state: ReferenceGr
  */
 export declare const useReferenceList_unstable: (props: ReferenceListProps, ref: React_2.Ref<HTMLOListElement>) => ReferenceListState;
 
+export declare const useReferenceListContext_unstable: <T>(selector: ContextSelector<ReferenceListContextValue, T>) => T;
+
 /**
  * Apply styling to the ReferenceList slots based on the state
  */
 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.
+ *
+ * The returned state can be modified with hooks such as useReferenceListStyles_unstable,
+ * before being passed to renderReferenceList_unstable.
+ *
+ * @param props - props from this instance of ReferenceList
+ * @param ref - reference to root HTMLElement of ReferenceList
+ */
+export declare const useReferenceListV2_unstable: (props: ReferenceListV2Props, ref: React_2.Ref<HTMLDivElement>) => ReferenceListV2State;
+
+/**
+ * Create the state required to render ReferenceOverflowButton.
+ *
+ * The returned state can be modified with hooks such as useReferenceOverflowButtonStyles_unstable,
+ * before being passed to renderReferenceOverflowButton_unstable.
+ *
+ * @param props - props from this instance of ReferenceOverflowButton
+ * @param ref - reference to root HTMLElement of ReferenceOverflowButton
+ */
+export declare const useReferenceOverflowButton_unstable: (props: ReferenceOverflowButtonProps, ref: React_2.Ref<HTMLButtonElement>) => ReferenceOverflowButtonState;
+
+/**
+ * Apply styling to the ReferenceOverflowButton slots based on the state
+ */
+export declare const useReferenceOverflowButtonStyles_unstable: (state: ReferenceOverflowButtonState) => ReferenceOverflowButtonState;
+
 /**
  * Apply styling to the Reference slots based on the state
  */
 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.
+ *
+ * The returned state can be modified with hooks such as useReferenceStyles_unstable,
+ * before being passed to renderReference_unstable.
+ *
+ * @param props - props from this instance of Reference
+ * @param ref - reference to root HTMLElement of Reference
+ */
+export declare const useReferenceV2_unstable: (props: ReferenceV2Props, ref: React_2.Ref<HTMLButtonElement>) => ReferenceV2State;
+
 export { }

package/lib/ReferenceListV2.js

@@ -0,0 +1,2 @@
+export * from './components/reference-v2/ReferenceList';
+//# sourceMappingURL=ReferenceListV2.js.map

package/lib/ReferenceListV2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ReferenceListV2.ts"],"sourcesContent":["export * from './components/reference-v2/ReferenceList';\n"],"names":[],"mappings":"AAAA,cAAc,0CAA0C"}

package/lib/ReferenceOverflowButton.js

@@ -0,0 +1,2 @@
+export * from './components/reference-v2/ReferenceOverflowButton';
+//# sourceMappingURL=ReferenceOverflowButton.js.map

package/lib/ReferenceOverflowButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ReferenceOverflowButton.ts"],"sourcesContent":["export * from './components/reference-v2/ReferenceOverflowButton';\n"],"names":[],"mappings":"AAAA,cAAc,oDAAoD"}

package/lib/ReferenceV2.js

@@ -0,0 +1,2 @@
+export * from './components/reference-v2/Reference';
+//# sourceMappingURL=ReferenceV2.js.map

package/lib/ReferenceV2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ReferenceV2.ts"],"sourcesContent":["export * from './components/reference-v2/Reference';\n"],"names":[],"mappings":"AAAA,cAAc,sCAAsC"}

package/lib/components/Reference/useReference.js

@@ -3,7 +3,7 @@ import { Button, Caption1, getIntrinsicElementProps, mergeCallbacks, mergeClasse
 import { ChevronDown24Regular, ChevronUp24Regular, ChevronDown16Regular, ChevronUp16Regular } from '@fluentui/react-icons';
 import { referenceExtraClassNames } from './useReferenceStyles';
 import { Citation } from '../Citation';
-import { useReferenceGroupSetOpen } from '../../context/ReferenceGroupContext';
+import { useReferenceGroupSetOpen } from '../../contexts/ReferenceGroupContext';
 import { useCopilotMode } from '@fluentui-copilot/react-provider';
 /**
  * Create the state required to render Reference.

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';\nimport { Citation } from '../Citation';\nimport type { ReferenceProps, ReferenceState } from './Reference.types';\nimport { useReferenceGroupSetOpen } from '../../context/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"],"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';\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"],"mappings":"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"}

package/lib/components/reference-v2/Reference/Reference.js

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import { useReference_unstable } from './useReference';
+import { renderReference_unstable } from './renderReference';
+import { useReferenceStyles_unstable } from './useReferenceStyles';
+export const Reference = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useReference_unstable(props, ref);
+  useReferenceStyles_unstable(state);
+  return renderReference_unstable(state);
+});
+Reference.displayName = 'Reference';
+//# sourceMappingURL=Reference.js.map

package/lib/components/reference-v2/Reference/Reference.js.map

@@ -0,0 +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';\nimport type { ReferenceProps } from './Reference.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\nexport const Reference: ForwardRefComponent<ReferenceProps> = React.forwardRef((props, ref) => {\n  const state = useReference_unstable(props, ref);\n\n  useReferenceStyles_unstable(state);\n  return renderReference_unstable(state);\n});\n\nReference.displayName = 'Reference';\n"],"names":["React","useReference_unstable","renderReference_unstable","useReferenceStyles_unstable","Reference","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AAInE,OAAO,MAAMC,0BAAiDJ,MAAMK,UAAU,CAAC,CAACC,OAAOC;IACrF,MAAMC,QAAQP,sBAAsBK,OAAOC;IAE3CJ,4BAA4BK;IAC5B,OAAON,yBAAyBM;AAClC,GAAG;AAEHJ,UAAUK,WAAW,GAAG"}

package/lib/components/reference-v2/Reference/Reference.types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Reference.types.js.map

package/lib/components/reference-v2/Reference/Reference.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Reference.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\nimport type { ReferenceListState } from '../ReferenceList';\n\nexport type ReferenceSlots = {\n  root: NonNullable<Slot<'button'>>;\n  citation?: Slot<'span'>;\n  divider?: Slot<'span'>;\n  content?: Slot<'span'>;\n  media?: Slot<'span'>;\n};\n\nexport type ReferenceProps = ComponentProps<Partial<ReferenceSlots>> & {\n  /**\n   * The appearance of the reference.\n   * @default 'lighter'\n   */\n  appearance?: 'lighter' | 'darker';\n};\n\nexport type ReferenceState = ComponentState<ReferenceSlots> &\n  Required<Pick<ReferenceProps, 'appearance' | 'id'>> &\n  Pick<ReferenceListState, 'shouldUseOverflow'>;\n"],"names":[],"mappings":"AAAA,WAqBgD"}

package/lib/components/reference-v2/Reference/index.js

@@ -0,0 +1,6 @@
+export * from './Reference';
+export * from './Reference.types';
+export * from './renderReference';
+export * from './useReference';
+export { referenceClassNames, referenceExtraClassNames, useReferenceStyles_unstable } from './useReferenceStyles';
+//# sourceMappingURL=index.js.map

package/lib/components/reference-v2/Reference/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Reference';\nexport * from './Reference.types';\nexport * from './renderReference';\nexport * from './useReference';\nexport { referenceClassNames, referenceExtraClassNames, useReferenceStyles_unstable } from './useReferenceStyles';\n"],"names":["referenceClassNames","referenceExtraClassNames","useReferenceStyles_unstable"],"mappings":"AAAA,cAAc,cAAc;AAC5B,cAAc,oBAAoB;AAClC,cAAc,oBAAoB;AAClC,cAAc,iBAAiB;AAC/B,SAASA,mBAAmB,EAAEC,wBAAwB,EAAEC,2BAA2B,QAAQ,uBAAuB"}

package/lib/components/reference-v2/Reference/renderReference.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { OverflowItem, assertSlots } from '@fluentui/react-components';
+export const renderReference_unstable = state => {
+  assertSlots(state);
+  const {
+    id,
+    shouldUseOverflow
+  } = state;
+  const reference = /*#__PURE__*/_jsxs(state.root, {
+    children: [state.citation && /*#__PURE__*/_jsx(state.citation, {}), state.divider && /*#__PURE__*/_jsx(state.divider, {}), state.content && /*#__PURE__*/_jsxs(state.content, {
+      children: [state.media && /*#__PURE__*/_jsx(state.media, {}), state.root.children]
+    })]
+  });
+  return shouldUseOverflow ? /*#__PURE__*/_jsx(OverflowItem, {
+    id: id,
+    children: reference
+  }, id) : reference;
+};
+//# sourceMappingURL=renderReference.js.map

package/lib/components/reference-v2/Reference/renderReference.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["renderReference.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { OverflowItem, assertSlots } from '@fluentui/react-components';\nimport type { ReferenceState, ReferenceSlots } from './Reference.types';\n\nexport const renderReference_unstable = (state: ReferenceState) => {\n  assertSlots<ReferenceSlots>(state);\n\n  const { id, shouldUseOverflow } = state;\n\n  const reference = (\n    <state.root>\n      {state.citation && <state.citation />}\n      {state.divider && <state.divider />}\n      {state.content && (\n        <state.content>\n          {state.media && <state.media />}\n          {state.root.children}\n        </state.content>\n      )}\n    </state.root>\n  );\n\n  return shouldUseOverflow ? (\n    <OverflowItem key={id} id={id}>\n      {reference}\n    </OverflowItem>\n  ) : (\n    reference\n  );\n};\n"],"names":["OverflowItem","assertSlots","renderReference_unstable","state","id","shouldUseOverflow","reference","root","citation","divider","content","media","children"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,YAAY,EAAEC,WAAW,QAAQ,6BAA6B;AAGvE,OAAO,MAAMC,2BAA2B,CAACC;IACvCF,YAA4BE;IAE5B,MAAM,EAAEC,EAAE,EAAEC,iBAAiB,EAAE,GAAGF;IAElC,MAAMG,0BACJ,MAACH,MAAMI,IAAI;;YACRJ,MAAMK,QAAQ,kBAAI,KAACL,MAAMK,QAAQ;YACjCL,MAAMM,OAAO,kBAAI,KAACN,MAAMM,OAAO;YAC/BN,MAAMO,OAAO,kBACZ,MAACP,MAAMO,OAAO;;oBACXP,MAAMQ,KAAK,kBAAI,KAACR,MAAMQ,KAAK;oBAC3BR,MAAMI,IAAI,CAACK,QAAQ;;;;;IAM5B,OAAOP,kCACL,KAACL;QAAsBI,IAAIA;kBACxBE;OADgBF,MAInBE;AAEJ,EAAE"}

package/lib/components/reference-v2/Reference/useReference.js

@@ -0,0 +1,72 @@
+import * as React from 'react';
+import { getIntrinsicElementProps, mergeClasses, slot, useId } from '@fluentui/react-components';
+import { useReferenceListContext_unstable } from '../../../contexts/reference-v2/referenceListContext';
+import { referenceExtraClassNames } from './useReferenceStyles';
+/**
+ * Create the state required to render Reference.
+ *
+ * The returned state can be modified with hooks such as useReferenceStyles_unstable,
+ * before being passed to renderReference_unstable.
+ *
+ * @param props - props from this instance of Reference
+ * @param ref - reference to root HTMLElement of Reference
+ */
+export const useReference_unstable = (props, ref) => {
+  const {
+    children,
+    id
+  } = props;
+  const {
+    ctxAppearance,
+    shouldUseOverflow
+  } = useReferenceListContext_unstable(ctx => ({
+    ctxAppearance: ctx.appearance,
+    shouldUseOverflow: ctx.shouldUseOverflow
+  }));
+  const appearance = props.appearance || ctxAppearance;
+  const referenceId = useId('reference-', id);
+  const citation = slot.optional(props.citation, {
+    elementType: 'span'
+  });
+  const media = slot.optional(props.media, {
+    elementType: 'span'
+  });
+  const content = slot.optional(props.content, {
+    elementType: 'span',
+    renderByDefault: media !== undefined || !!children
+  });
+  const divider = slot.optional(props.divider, {
+    elementType: 'span',
+    renderByDefault: citation !== undefined && content !== undefined
+  });
+  const state = {
+    appearance,
+    id: referenceId,
+    shouldUseOverflow,
+    components: {
+      root: 'button',
+      citation: 'span',
+      divider: 'span',
+      media: 'span',
+      content: 'span'
+    },
+    root: slot.always(getIntrinsicElementProps('button', {
+      ref,
+      ...props,
+      id: referenceId
+    }), {
+      elementType: 'button'
+    }),
+    citation,
+    divider,
+    content,
+    media
+  };
+  if (state.media && React.isValidElement(state.media.children)) {
+    state.media.children = React.cloneElement(state.media.children, {
+      className: mergeClasses(state.media.children.props.className, referenceExtraClassNames.mediaChild)
+    });
+  }
+  return state;
+};
+//# sourceMappingURL=useReference.js.map

package/lib/components/reference-v2/Reference/useReference.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useReference.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, mergeClasses, slot, useId } from '@fluentui/react-components';\nimport { useReferenceListContext_unstable } from '../../../contexts/reference-v2/referenceListContext';\nimport { referenceExtraClassNames } from './useReferenceStyles';\nimport type { ReferenceProps, ReferenceState } from './Reference.types';\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<HTMLButtonElement>): ReferenceState => {\n  const { children, id } = props;\n\n  const { ctxAppearance, shouldUseOverflow } = useReferenceListContext_unstable(ctx => ({\n    ctxAppearance: ctx.appearance,\n    shouldUseOverflow: ctx.shouldUseOverflow,\n  }));\n  const appearance = props.appearance || ctxAppearance;\n\n  const referenceId = useId('reference-', id);\n\n  const citation = slot.optional(props.citation, { elementType: 'span' });\n  const media = slot.optional(props.media, { elementType: 'span' });\n  const content = slot.optional(props.content, {\n    elementType: 'span',\n    renderByDefault: media !== undefined || !!children,\n  });\n  const divider = slot.optional(props.divider, {\n    elementType: 'span',\n    renderByDefault: citation !== undefined && content !== undefined,\n  });\n\n  const state: ReferenceState = {\n    appearance,\n    id: referenceId,\n    shouldUseOverflow,\n\n    components: {\n      root: 'button',\n      citation: 'span',\n      divider: 'span',\n      media: 'span',\n      content: 'span',\n    },\n\n    root: slot.always(\n      getIntrinsicElementProps('button', {\n        ref,\n        ...props,\n        id: referenceId,\n      }),\n      { elementType: 'button' },\n    ),\n    citation,\n    divider,\n    content,\n    media,\n  };\n\n  if (state.media && React.isValidElement<HTMLElement>(state.media.children)) {\n    state.media.children = React.cloneElement(state.media.children, {\n      className: mergeClasses(state.media.children.props.className, referenceExtraClassNames.mediaChild),\n    });\n  }\n\n  return state;\n};\n"],"names":["React","getIntrinsicElementProps","mergeClasses","slot","useId","useReferenceListContext_unstable","referenceExtraClassNames","useReference_unstable","props","ref","children","id","ctxAppearance","shouldUseOverflow","ctx","appearance","referenceId","citation","optional","elementType","media","content","renderByDefault","undefined","divider","state","components","root","always","isValidElement","cloneElement","className","mediaChild"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,YAAY,EAAEC,IAAI,EAAEC,KAAK,QAAQ,6BAA6B;AACjG,SAASC,gCAAgC,QAAQ,sDAAsD;AACvG,SAASC,wBAAwB,QAAQ,uBAAuB;AAGhE;;;;;;;;CAQC,GACD,OAAO,MAAMC,wBAAwB,CAACC,OAAuBC;IAC3D,MAAM,EAAEC,QAAQ,EAAEC,EAAE,EAAE,GAAGH;IAEzB,MAAM,EAAEI,aAAa,EAAEC,iBAAiB,EAAE,GAAGR,iCAAiCS,CAAAA,MAAQ,CAAA;YACpFF,eAAeE,IAAIC,UAAU;YAC7BF,mBAAmBC,IAAID,iBAAiB;QAC1C,CAAA;IACA,MAAME,aAAaP,MAAMO,UAAU,IAAIH;IAEvC,MAAMI,cAAcZ,MAAM,cAAcO;IAExC,MAAMM,WAAWd,KAAKe,QAAQ,CAACV,MAAMS,QAAQ,EAAE;QAAEE,aAAa;IAAO;IACrE,MAAMC,QAAQjB,KAAKe,QAAQ,CAACV,MAAMY,KAAK,EAAE;QAAED,aAAa;IAAO;IAC/D,MAAME,UAAUlB,KAAKe,QAAQ,CAACV,MAAMa,OAAO,EAAE;QAC3CF,aAAa;QACbG,iBAAiBF,UAAUG,aAAa,CAAC,CAACb;IAC5C;IACA,MAAMc,UAAUrB,KAAKe,QAAQ,CAACV,MAAMgB,OAAO,EAAE;QAC3CL,aAAa;QACbG,iBAAiBL,aAAaM,aAAaF,YAAYE;IACzD;IAEA,MAAME,QAAwB;QAC5BV;QACAJ,IAAIK;QACJH;QAEAa,YAAY;YACVC,MAAM;YACNV,UAAU;YACVO,SAAS;YACTJ,OAAO;YACPC,SAAS;QACX;QAEAM,MAAMxB,KAAKyB,MAAM,CACf3B,yBAAyB,UAAU;YACjCQ;YACA,GAAGD,KAAK;YACRG,IAAIK;QACN,IACA;YAAEG,aAAa;QAAS;QAE1BF;QACAO;QACAH;QACAD;IACF;IAEA,IAAIK,MAAML,KAAK,IAAIpB,MAAM6B,cAAc,CAAcJ,MAAML,KAAK,CAACV,QAAQ,GAAG;QAC1Ee,MAAML,KAAK,CAACV,QAAQ,GAAGV,MAAM8B,YAAY,CAACL,MAAML,KAAK,CAACV,QAAQ,EAAE;YAC9DqB,WAAW7B,aAAauB,MAAML,KAAK,CAACV,QAAQ,CAACF,KAAK,CAACuB,SAAS,EAAEzB,yBAAyB0B,UAAU;QACnG;IACF;IAEA,OAAOP;AACT,EAAE"}