@fluentui-copilot/react-reference 0.11.4 → 0.12.1

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n  Citation,\n  citationClassNames,\n  renderCitation_unstable,\n  useCitation_unstable,\n  useCitationStyles_unstable,\n} from './Citation';\nexport {\n  Reference,\n  referenceClassNames,\n  renderReference_unstable,\n  useReference_unstable,\n  useReferenceStyles_unstable,\n} from './Reference';\nexport { useReferenceCitationPreview, useReferenceGroup } from './hooks';\nexport {\n  ReferenceList,\n  referenceListClassNames,\n  useReferenceList_unstable,\n  useReferenceListStyles_unstable,\n  renderReferenceList_unstable,\n} from './ReferenceList';\nexport {\n  ReferenceGroupToggle,\n  referenceGroupToggleClassNames,\n  renderReferenceGroupToggle_unstable,\n  useReferenceGroupToggleStyles_unstable,\n  useReferenceGroupToggle_unstable,\n} from './ReferenceGroupToggle';\n\n// Types\n\nexport type { CitationSlots, CitationProps, CitationState } from './Citation';\nexport type { ReferenceSlots, ReferenceProps, ReferenceState } from './Reference';\nexport type { ReferenceListSlots, ReferenceListProps, ReferenceListState } from './ReferenceList';\nexport type {\n  ReferenceGroupToggleSlots,\n  ReferenceGroupToggleProps,\n  ReferenceGroupToggleState,\n} from './ReferenceGroupToggle';\n\nexport type {\n  PackagedCitationProps,\n  PackagedCitation,\n  PackagedReferenceProps,\n  PackagedReference,\n  ReferenceCitationData,\n  UseReferenceCitationPreview,\n  UseReferenceGroup,\n  UseReferenceGroupProps,\n} from './hooks';\n\n// reference-v2 exports\nexport type {\n  ReferenceProps as ReferenceV2Props,\n  ReferenceSlots as ReferenceV2Slots,\n  ReferenceState as ReferenceV2State,\n} from './ReferenceV2';\nexport {\n  Reference as ReferenceV2,\n  referenceClassNames as referenceV2ClassNames,\n  referenceExtraClassNames as referenceV2ExtraClassNames,\n  renderReference_unstable as renderReferenceV2_unstable,\n  useReferenceStyles_unstable as useReferenceStylesV2_unstable,\n  useReference_unstable as useReferenceV2_unstable,\n} from './ReferenceV2';\n\nexport type {\n  ReferenceListContextValues as ReferenceListV2ContextValues,\n  ReferenceListProps as ReferenceListV2Props,\n  ReferenceListSlots as ReferenceListV2Slots,\n  ReferenceListState as ReferenceListV2State,\n} from './ReferenceListV2';\nexport {\n  ReferenceList as ReferenceListV2,\n  referenceListClassNames as referenceListV2ClassNames,\n  renderReferenceList_unstable as renderReferenceListV2_unstable,\n  useReferenceListStyles_unstable as useReferenceListStylesV2_unstable,\n  useReferenceList_unstable as useReferenceListV2_unstable,\n} from './ReferenceListV2';\n\nexport type {\n  ReferenceOverflowButtonProps,\n  ReferenceOverflowButtonSlots,\n  ReferenceOverflowButtonState,\n} from './ReferenceOverflowButton';\nexport {\n  ReferenceOverflowButton,\n  referenceOverflowButtonClassNames,\n  renderReferenceOverflowButton_unstable,\n  useReferenceOverflowButtonStyles_unstable,\n  useReferenceOverflowButton_unstable,\n} from './ReferenceOverflowButton';\n\nexport type { ReferenceListContextValue } from './contexts/reference-v2';\nexport {\n  ReferenceListContext,\n  ReferenceListContextProvider,\n  useReferenceListContext_unstable,\n} from './contexts/reference-v2';\n\nexport type {\n  PackagedCitation as PackagedCitationV2,\n  PackagedPreviewContentProps as PackagedPreviewContentV2Props,\n  PackagedReference as PackagedReferenceV2,\n  UseReferenceCitationPreview as UseReferenceCitationPreviewV2,\n  UseReferenceCitationPreviewProps as UseReferenceCitationPreviewV2Props,\n} from './hooks/reference-v2';\nexport { useReferenceCitationPreview as useReferenceCitationPreviewV2 } from './hooks/reference-v2';\n"],"names":["Citation","citationClassNames","renderCitation_unstable","useCitation_unstable","useCitationStyles_unstable","Reference","referenceClassNames","renderReference_unstable","useReference_unstable","useReferenceStyles_unstable","useReferenceCitationPreview","useReferenceGroup","ReferenceList","referenceListClassNames","useReferenceList_unstable","useReferenceListStyles_unstable","renderReferenceList_unstable","ReferenceGroupToggle","referenceGroupToggleClassNames","renderReferenceGroupToggle_unstable","useReferenceGroupToggleStyles_unstable","useReferenceGroupToggle_unstable","ReferenceV2","referenceV2ClassNames","referenceExtraClassNames","referenceV2ExtraClassNames","renderReferenceV2_unstable","useReferenceStylesV2_unstable","useReferenceV2_unstable","ReferenceListV2","referenceListV2ClassNames","renderReferenceListV2_unstable","useReferenceListStylesV2_unstable","useReferenceListV2_unstable","ReferenceOverflowButton","referenceOverflowButtonClassNames","renderReferenceOverflowButton_unstable","useReferenceOverflowButtonStyles_unstable","useReferenceOverflowButton_unstable","ReferenceListContext","ReferenceListContextProvider","useReferenceListContext_unstable","useReferenceCitationPreviewV2"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,SACEA,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,oBAAoB,EACpBC,0BAA0B,QACrB,aAAa;AACpB,SACEC,SAAS,EACTC,mBAAmB,EACnBC,wBAAwB,EACxBC,qBAAqB,EACrBC,2BAA2B,QACtB,cAAc;AACrB,SAASC,2BAA2B,EAAEC,iBAAiB,QAAQ,UAAU;AACzE,SACEC,aAAa,EACbC,uBAAuB,EACvBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,4BAA4B,QACvB,kBAAkB;AACzB,SACEC,oBAAoB,EACpBC,8BAA8B,EAC9BC,mCAAmC,EACnCC,sCAAsC,EACtCC,gCAAgC,QAC3B,yBAAyB;AA8BhC,SACEhB,aAAaiB,WAAW,EACxBhB,uBAAuBiB,qBAAqB,EAC5CC,4BAA4BC,0BAA0B,EACtDlB,4BAA4BmB,0BAA0B,EACtDjB,+BAA+BkB,6BAA6B,EAC5DnB,yBAAyBoB,uBAAuB,QAC3C,gBAAgB;AAQvB,SACEhB,iBAAiBiB,eAAe,EAChChB,2BAA2BiB,yBAAyB,EACpDd,gCAAgCe,8BAA8B,EAC9DhB,mCAAmCiB,iCAAiC,EACpElB,6BAA6BmB,2BAA2B,QACnD,oBAAoB;AAO3B,SACEC,uBAAuB,EACvBC,iCAAiC,EACjCC,sCAAsC,EACtCC,yCAAyC,EACzCC,mCAAmC,QAC9B,4BAA4B;AAGnC,SACEC,oBAAoB,EACpBC,4BAA4B,EAC5BC,gCAAgC,QAC3B,0BAA0B;AASjC,SAAS/B,+BAA+BgC,6BAA6B,QAAQ,uBAAuB"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n  Citation,\n  citationClassNames,\n  renderCitation_unstable,\n  useCitation_unstable,\n  useCitationStyles_unstable,\n} from './Citation';\nexport {\n  Reference,\n  referenceClassNames,\n  renderReference_unstable,\n  useReference_unstable,\n  useReferenceStyles_unstable,\n} from './Reference';\nexport { useReferenceCitationPreview, useReferenceGroup } from './utilities';\nexport {\n  ReferenceList,\n  referenceListClassNames,\n  useReferenceList_unstable,\n  useReferenceListStyles_unstable,\n  renderReferenceList_unstable,\n} from './ReferenceList';\nexport {\n  ReferenceGroupToggle,\n  referenceGroupToggleClassNames,\n  renderReferenceGroupToggle_unstable,\n  useReferenceGroupToggleStyles_unstable,\n  useReferenceGroupToggle_unstable,\n} from './ReferenceGroupToggle';\n\n// Types\n\nexport type { CitationSlots, CitationProps, CitationState } from './Citation';\nexport type { ReferenceSlots, ReferenceProps, ReferenceState } from './Reference';\nexport type { ReferenceListSlots, ReferenceListProps, ReferenceListState } from './ReferenceList';\nexport type {\n  ReferenceGroupToggleSlots,\n  ReferenceGroupToggleProps,\n  ReferenceGroupToggleState,\n} from './ReferenceGroupToggle';\n\nexport type {\n  PackagedCitationProps,\n  PackagedCitation,\n  PackagedReferenceProps,\n  PackagedReference,\n  ReferenceCitationData,\n  UseReferenceCitationPreview,\n  UseReferenceGroup,\n  UseReferenceGroupProps,\n} from './utilities';\n\n// reference-v2 exports\nexport type {\n  ReferenceProps as ReferenceV2Props,\n  ReferenceSlots as ReferenceV2Slots,\n  ReferenceState as ReferenceV2State,\n} from './ReferenceV2';\nexport {\n  Reference as ReferenceV2,\n  referenceClassNames as referenceV2ClassNames,\n  referenceExtraClassNames as referenceV2ExtraClassNames,\n  renderReference_unstable as renderReferenceV2_unstable,\n  useReferenceStyles_unstable as useReferenceV2Styles_unstable,\n  useReference_unstable as useReferenceV2_unstable,\n} from './ReferenceV2';\n\nexport type {\n  ReferenceListContextValues as ReferenceListV2ContextValues,\n  ReferenceListProps as ReferenceListV2Props,\n  ReferenceListSlots as ReferenceListV2Slots,\n  ReferenceListState as ReferenceListV2State,\n} from './ReferenceListV2';\nexport {\n  ReferenceList as ReferenceListV2,\n  referenceListClassNames as referenceListV2ClassNames,\n  renderReferenceList_unstable as renderReferenceListV2_unstable,\n  useReferenceListStyles_unstable as useReferenceListV2Styles_unstable,\n  useReferenceList_unstable as useReferenceListV2_unstable,\n} from './ReferenceListV2';\n\nexport type {\n  ReferenceOverflowButtonProps,\n  ReferenceOverflowButtonSlots,\n  ReferenceOverflowButtonState,\n} from './ReferenceOverflowButton';\nexport {\n  ReferenceOverflowButton,\n  referenceOverflowButtonClassNames,\n  renderReferenceOverflowButton_unstable,\n  useReferenceOverflowButtonStyles_unstable,\n  useReferenceOverflowButton_unstable,\n} from './ReferenceOverflowButton';\n\nexport type { ReferenceListContextValue } from './contexts/reference-v2';\nexport {\n  ReferenceListContext,\n  ReferenceListContextProvider,\n  useReferenceListContext_unstable,\n} from './contexts/reference-v2';\n\nexport type {\n  PackagedCitation as PackagedCitationV2,\n  PackagedPreviewContentProps as PackagedPreviewContentV2Props,\n  PackagedReference as PackagedReferenceV2,\n  ReferenceCitationPreviewGenerator,\n  ReferenceCitationPreviewGeneratorProps,\n  UseReferenceCitationPreview as UseReferenceCitationPreviewV2,\n  UseReferenceCitationPreviewProps as UseReferenceCitationPreviewV2Props,\n} from './utilities/reference-v2';\nexport {\n  generateReferenceCitationPreview,\n  useReferenceCitationPreview as useReferenceCitationPreviewV2,\n} from './utilities/reference-v2';\n"],"names":["Citation","citationClassNames","renderCitation_unstable","useCitation_unstable","useCitationStyles_unstable","Reference","referenceClassNames","renderReference_unstable","useReference_unstable","useReferenceStyles_unstable","useReferenceCitationPreview","useReferenceGroup","ReferenceList","referenceListClassNames","useReferenceList_unstable","useReferenceListStyles_unstable","renderReferenceList_unstable","ReferenceGroupToggle","referenceGroupToggleClassNames","renderReferenceGroupToggle_unstable","useReferenceGroupToggleStyles_unstable","useReferenceGroupToggle_unstable","ReferenceV2","referenceV2ClassNames","referenceExtraClassNames","referenceV2ExtraClassNames","renderReferenceV2_unstable","useReferenceV2Styles_unstable","useReferenceV2_unstable","ReferenceListV2","referenceListV2ClassNames","renderReferenceListV2_unstable","useReferenceListV2Styles_unstable","useReferenceListV2_unstable","ReferenceOverflowButton","referenceOverflowButtonClassNames","renderReferenceOverflowButton_unstable","useReferenceOverflowButtonStyles_unstable","useReferenceOverflowButton_unstable","ReferenceListContext","ReferenceListContextProvider","useReferenceListContext_unstable","generateReferenceCitationPreview","useReferenceCitationPreviewV2"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,SACEA,QAAQ,EACRC,kBAAkB,EAClBC,uBAAuB,EACvBC,oBAAoB,EACpBC,0BAA0B,QACrB,aAAa;AACpB,SACEC,SAAS,EACTC,mBAAmB,EACnBC,wBAAwB,EACxBC,qBAAqB,EACrBC,2BAA2B,QACtB,cAAc;AACrB,SAASC,2BAA2B,EAAEC,iBAAiB,QAAQ,cAAc;AAC7E,SACEC,aAAa,EACbC,uBAAuB,EACvBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,4BAA4B,QACvB,kBAAkB;AACzB,SACEC,oBAAoB,EACpBC,8BAA8B,EAC9BC,mCAAmC,EACnCC,sCAAsC,EACtCC,gCAAgC,QAC3B,yBAAyB;AA8BhC,SACEhB,aAAaiB,WAAW,EACxBhB,uBAAuBiB,qBAAqB,EAC5CC,4BAA4BC,0BAA0B,EACtDlB,4BAA4BmB,0BAA0B,EACtDjB,+BAA+BkB,6BAA6B,EAC5DnB,yBAAyBoB,uBAAuB,QAC3C,gBAAgB;AAQvB,SACEhB,iBAAiBiB,eAAe,EAChChB,2BAA2BiB,yBAAyB,EACpDd,gCAAgCe,8BAA8B,EAC9DhB,mCAAmCiB,iCAAiC,EACpElB,6BAA6BmB,2BAA2B,QACnD,oBAAoB;AAO3B,SACEC,uBAAuB,EACvBC,iCAAiC,EACjCC,sCAAsC,EACtCC,yCAAyC,EACzCC,mCAAmC,QAC9B,4BAA4B;AAGnC,SACEC,oBAAoB,EACpBC,4BAA4B,EAC5BC,gCAAgC,QAC3B,0BAA0B;AAWjC,SACEC,gCAAgC,EAChChC,+BAA+BiC,6BAA6B,QACvD,2BAA2B"}

package/lib/utilities/reference-v2/generateReferenceCitationPreview.js

@@ -0,0 +1,107 @@
+import * as React from 'react';
+import { mergeCallbacks, usePopoverContext_unstable } from '@fluentui/react-components';
+import { Preview, PreviewContent, PreviewHeader, PreviewMetadata, PreviewSurface, PreviewTrigger } from '@fluentui-copilot/react-preview';
+import { SensitivityLabel } from '@fluentui-copilot/react-sensitivity-label';
+import { Citation } from '../../Citation';
+import { Reference } from '../../ReferenceV2';
+// Abstract the citation that serves as the close button of the Preview into its own component so that we have access to the popover context.
+const CitationCloseButton = citationCloseButtonProps => {
+  const setPopoverOpen = usePopoverContext_unstable(context => context.setOpen);
+  const onPopoverCloseClick = React.useCallback(ev => {
+    setPopoverOpen(ev, false);
+    // Don't navigate
+    ev.preventDefault();
+  }, [setPopoverOpen]);
+  const onCitationCloseButtonClick = mergeCallbacks(onPopoverCloseClick, citationCloseButtonProps.onClick);
+  return /*#__PURE__*/React.createElement(Citation, {
+    ...citationCloseButtonProps,
+    onClick: onCitationCloseButtonClick
+  });
+};
+/**
+ * Function to generate a Citation - Reference pair with correctly wired props.
+ * Both the Citation and the Reference act as trigger components to Previews that are also correctly wired by the function.
+ * Props can either be passed in to the function or applied directly to the generated components in JSX.
+ *
+ * A `useReferenceCitationPreview` hook exists that calls this function and memoizes its return value based on the props.
+ * You should use the hook when the props used to generate the Citation - Reference pair can change dynamically.
+ * If they are static, or in case you wanted to generate multiple pairs within a cycle, you should call
+ * `generateReferenceCitationPreview` directly.
+ *
+ * @returns A Citation - Reference pair with correctly wired props.
+ */
+export const generateReferenceCitationPreview = props => {
+  const {
+    citationPreviewProps,
+    citationPreviewSurfaceProps,
+    citationProps,
+    index,
+    previewContentProps,
+    previewHeaderProps,
+    referencePreviewProps,
+    referencePreviewSurfaceProps,
+    referenceProps,
+    sensitivityLabelProps
+  } = props;
+  const CitationWithPreview = props => {
+    var _previewContentProps_content;
+    return /*#__PURE__*/React.createElement(Preview, {
+      closeOnScroll: true,
+      positioning: "below",
+      size: "small",
+      trapFocus: true,
+      withArrow: true,
+      ...citationPreviewProps
+    }, /*#__PURE__*/React.createElement(PreviewTrigger, null, /*#__PURE__*/React.createElement(Citation, {
+      ...citationProps,
+      ...props
+    }, index)), /*#__PURE__*/React.createElement(PreviewSurface, citationPreviewSurfaceProps, /*#__PURE__*/React.createElement(PreviewContent, null, /*#__PURE__*/React.createElement(PreviewHeader, {
+      citation: /*#__PURE__*/React.createElement(CitationCloseButton, {
+        "aria-label": `Reference ${index}, close`,
+        referenceHref: "#",
+        tabIndex: -1
+      }, index),
+      media: referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.graphic
+    }, referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.children), /*#__PURE__*/React.createElement(PreviewMetadata, {
+      icon: previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.icon,
+      primaryText: previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.primaryText,
+      secondaryText: previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.secondaryText,
+      tertiaryText: previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.tertiaryText
+    }), sensitivityLabelProps && /*#__PURE__*/React.createElement(SensitivityLabel, sensitivityLabelProps), (_previewContentProps_content = previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.content) !== null && _previewContentProps_content !== void 0 ? _previewContentProps_content : citationPreviewProps === null || citationPreviewProps === void 0 ? void 0 : citationPreviewProps.children)));
+  };
+  const ReferenceWithPreview = props => {
+    const mergedReferenceProps = {
+      citation: index,
+      ...referenceProps,
+      ...props
+    };
+    var _previewHeaderProps_children, _previewContentProps_content;
+    return /*#__PURE__*/React.createElement(Preview, {
+      closeOnScroll: true,
+      positioning: "below",
+      size: "small",
+      trapFocus: true,
+      withArrow: true,
+      ...referencePreviewProps
+    }, /*#__PURE__*/React.createElement(PreviewTrigger, null, /*#__PURE__*/React.createElement(Reference, mergedReferenceProps)), /*#__PURE__*/React.createElement(PreviewSurface, referencePreviewSurfaceProps, /*#__PURE__*/React.createElement(PreviewContent, null, /*#__PURE__*/React.createElement(PreviewHeader, {
+      citation: /*#__PURE__*/React.createElement(CitationCloseButton, {
+        "aria-label": `Reference ${index}, close`,
+        referenceHref: "#",
+        tabIndex: -1
+      }, index),
+      media: referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.graphic,
+      ...previewHeaderProps
+    }, (_previewHeaderProps_children = previewHeaderProps === null || previewHeaderProps === void 0 ? void 0 : previewHeaderProps.children) !== null && _previewHeaderProps_children !== void 0 ? _previewHeaderProps_children : referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.children), /*#__PURE__*/React.createElement(PreviewMetadata, {
+      icon: previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.icon,
+      primaryText: previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.primaryText,
+      secondaryText: previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.secondaryText,
+      tertiaryText: previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.tertiaryText
+    }), sensitivityLabelProps && /*#__PURE__*/React.createElement(SensitivityLabel, sensitivityLabelProps), (_previewContentProps_content = previewContentProps === null || previewContentProps === void 0 ? void 0 : previewContentProps.content) !== null && _previewContentProps_content !== void 0 ? _previewContentProps_content : referencePreviewProps === null || referencePreviewProps === void 0 ? void 0 : referencePreviewProps.children)));
+  };
+  const components = {
+    Citation: CitationWithPreview,
+    Reference: ReferenceWithPreview
+  };
+  return components;
+};
+//# sourceMappingURL=generateReferenceCitationPreview.js.map

package/lib/utilities/reference-v2/generateReferenceCitationPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["generateReferenceCitationPreview.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { mergeCallbacks, usePopoverContext_unstable } from '@fluentui/react-components';\n\nimport {\n  Preview,\n  PreviewContent,\n  PreviewHeader,\n  PreviewMetadata,\n  PreviewSurface,\n  PreviewTrigger,\n} from '@fluentui-copilot/react-preview';\nimport { SensitivityLabel } from '@fluentui-copilot/react-sensitivity-label';\nimport type {\n  PreviewHeaderProps,\n  PreviewMetadataProps,\n  PreviewProps,\n  PreviewSurfaceProps,\n} from '@fluentui-copilot/react-preview';\nimport type { SensitivityLabelProps } from '@fluentui-copilot/react-sensitivity-label';\n\nimport { Citation } from '../../Citation';\nimport { Reference } from '../../ReferenceV2';\nimport type { CitationProps } from '../../Citation';\nimport type { ReferenceProps } from '../../ReferenceV2';\n\nexport type PackagedCitation = React.FC<CitationProps>;\n\nexport type PackagedReference = React.FC<ReferenceProps>;\n\nexport type PackagedPreviewContentProps = Pick<\n  PreviewMetadataProps,\n  'icon' | 'primaryText' | 'secondaryText' | 'tertiaryText'\n> & {\n  content?: React.ReactNode;\n};\n\nexport type ReferenceCitationPreviewGeneratorProps = {\n  citationPreviewProps?: PreviewProps;\n  citationPreviewSurfaceProps?: PreviewSurfaceProps;\n  citationProps?: CitationProps;\n  index: number;\n  previewContentProps?: PackagedPreviewContentProps;\n  previewHeaderProps?: PreviewHeaderProps;\n  referencePreviewProps?: PreviewProps;\n  referencePreviewSurfaceProps?: PreviewSurfaceProps;\n  referenceProps?: ReferenceProps;\n  sensitivityLabelProps?: SensitivityLabelProps;\n};\n\nexport type ReferenceCitationPreviewGenerator = (props: ReferenceCitationPreviewGeneratorProps) => {\n  Citation: PackagedCitation;\n  Reference: PackagedReference;\n};\n\n// Abstract the citation that serves as the close button of the Preview into its own component so that we have access to the popover context.\nconst CitationCloseButton = (citationCloseButtonProps: CitationProps) => {\n  const setPopoverOpen = usePopoverContext_unstable(context => context.setOpen);\n\n  const onPopoverCloseClick = React.useCallback<NonNullable<CitationProps['onClick']>>(\n    ev => {\n      setPopoverOpen(ev, false);\n\n      // Don't navigate\n      ev.preventDefault();\n    },\n    [setPopoverOpen],\n  );\n\n  const onCitationCloseButtonClick = mergeCallbacks(onPopoverCloseClick, citationCloseButtonProps.onClick);\n\n  return <Citation {...citationCloseButtonProps} onClick={onCitationCloseButtonClick} />;\n};\n\n/**\n * Function to generate a Citation - Reference pair with correctly wired props.\n * Both the Citation and the Reference act as trigger components to Previews that are also correctly wired by the function.\n * Props can either be passed in to the function or applied directly to the generated components in JSX.\n *\n * A `useReferenceCitationPreview` hook exists that calls this function and memoizes its return value based on the props.\n * You should use the hook when the props used to generate the Citation - Reference pair can change dynamically.\n * If they are static, or in case you wanted to generate multiple pairs within a cycle, you should call\n * `generateReferenceCitationPreview` directly.\n *\n * @returns A Citation - Reference pair with correctly wired props.\n */\nexport const generateReferenceCitationPreview: ReferenceCitationPreviewGenerator = props => {\n  const {\n    citationPreviewProps,\n    citationPreviewSurfaceProps,\n    citationProps,\n    index,\n    previewContentProps,\n    previewHeaderProps,\n    referencePreviewProps,\n    referencePreviewSurfaceProps,\n    referenceProps,\n    sensitivityLabelProps,\n  } = props;\n\n  const CitationWithPreview: PackagedCitation = props => {\n    return (\n      <Preview closeOnScroll positioning=\"below\" size=\"small\" trapFocus withArrow {...citationPreviewProps}>\n        <PreviewTrigger>\n          <Citation {...citationProps} {...props}>\n            {index}\n          </Citation>\n        </PreviewTrigger>\n        <PreviewSurface {...citationPreviewSurfaceProps}>\n          <PreviewContent>\n            <PreviewHeader\n              citation={\n                <CitationCloseButton aria-label={`Reference ${index}, close`} referenceHref=\"#\" tabIndex={-1}>\n                  {index}\n                </CitationCloseButton>\n              }\n              media={referenceProps?.graphic as PreviewHeaderProps['media']}\n            >\n              {referenceProps?.children}\n            </PreviewHeader>\n            <PreviewMetadata\n              icon={previewContentProps?.icon}\n              primaryText={previewContentProps?.primaryText}\n              secondaryText={previewContentProps?.secondaryText}\n              tertiaryText={previewContentProps?.tertiaryText}\n            />\n            {sensitivityLabelProps && <SensitivityLabel {...sensitivityLabelProps} />}\n            {previewContentProps?.content ?? citationPreviewProps?.children}\n          </PreviewContent>\n        </PreviewSurface>\n      </Preview>\n    );\n  };\n\n  const ReferenceWithPreview: PackagedReference = props => {\n    const mergedReferenceProps = {\n      citation: index,\n      ...referenceProps,\n      ...props,\n    } as ReferenceProps;\n\n    return (\n      <Preview closeOnScroll positioning=\"below\" size=\"small\" trapFocus withArrow {...referencePreviewProps}>\n        <PreviewTrigger>\n          <Reference {...mergedReferenceProps} />\n        </PreviewTrigger>\n        <PreviewSurface {...referencePreviewSurfaceProps}>\n          <PreviewContent>\n            <PreviewHeader\n              citation={\n                <CitationCloseButton aria-label={`Reference ${index}, close`} referenceHref=\"#\" tabIndex={-1}>\n                  {index}\n                </CitationCloseButton>\n              }\n              media={referenceProps?.graphic as PreviewHeaderProps['media']}\n              {...previewHeaderProps}\n            >\n              {previewHeaderProps?.children ?? referenceProps?.children}\n            </PreviewHeader>\n            <PreviewMetadata\n              icon={previewContentProps?.icon}\n              primaryText={previewContentProps?.primaryText}\n              secondaryText={previewContentProps?.secondaryText}\n              tertiaryText={previewContentProps?.tertiaryText}\n            />\n            {sensitivityLabelProps && <SensitivityLabel {...sensitivityLabelProps} />}\n            {previewContentProps?.content ?? referencePreviewProps?.children}\n          </PreviewContent>\n        </PreviewSurface>\n      </Preview>\n    );\n  };\n\n  const components = {\n    Citation: CitationWithPreview,\n    Reference: ReferenceWithPreview,\n  };\n\n  return components;\n};\n"],"names":["React","mergeCallbacks","usePopoverContext_unstable","Preview","PreviewContent","PreviewHeader","PreviewMetadata","PreviewSurface","PreviewTrigger","SensitivityLabel","Citation","Reference","CitationCloseButton","citationCloseButtonProps","setPopoverOpen","context","setOpen","onPopoverCloseClick","useCallback","ev","preventDefault","onCitationCloseButtonClick","onClick","generateReferenceCitationPreview","props","citationPreviewProps","citationPreviewSurfaceProps","citationProps","index","previewContentProps","previewHeaderProps","referencePreviewProps","referencePreviewSurfaceProps","referenceProps","sensitivityLabelProps","CitationWithPreview","closeOnScroll","positioning","size","trapFocus","withArrow","citation","aria-label","referenceHref","tabIndex","media","graphic","children","icon","primaryText","secondaryText","tertiaryText","content","ReferenceWithPreview","mergedReferenceProps","components"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib/utilities/reference-v2/index.js

@@ -0,0 +1,3 @@
+export * from './generateReferenceCitationPreview';
+export * from './useReferenceCitationPreview';
+//# sourceMappingURL=index.js.map

package/lib/utilities/reference-v2/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './generateReferenceCitationPreview';\nexport * from './useReferenceCitationPreview';\n"],"names":[],"rangeMappings":";","mappings":"AAAA,cAAc,qCAAqC;AACnD,cAAc,gCAAgC"}

package/lib/utilities/reference-v2/useReferenceCitationPreview.js

@@ -0,0 +1,18 @@
+import * as React from 'react';
+import { generateReferenceCitationPreview } from './generateReferenceCitationPreview';
+/**
+ * Hook to generate a Citation - Reference pair with correctly wired props.
+ * Both the Citation and the Reference act as trigger components to Previews that are also correctly wired by the hook.
+ * Props can either be passed in to the hook or applied directly to the generated components in JSX.
+ *
+ * This hook internally calls the `generateReferenceCitationPreview` function and memoizes its return value based on the props.
+ * You should only use this hook when the props used to generate the Citation - Reference pair can change dynamically.
+ * If they are static, or in case you wanted to generate multiple pairs within a cycle, you should call
+ * `generateReferenceCitationPreview` directly.
+ *
+ * @returns A Citation - Reference pair with correctly wired props.
+ */
+export const useReferenceCitationPreview = props => {
+  return React.useMemo(() => generateReferenceCitationPreview(props), [props]);
+};
+//# sourceMappingURL=useReferenceCitationPreview.js.map

package/lib/utilities/reference-v2/useReferenceCitationPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useReferenceCitationPreview.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\n\nimport {\n  generateReferenceCitationPreview,\n  type ReferenceCitationPreviewGenerator,\n  type ReferenceCitationPreviewGeneratorProps,\n} from './generateReferenceCitationPreview';\n\nexport type UseReferenceCitationPreviewProps = ReferenceCitationPreviewGeneratorProps;\n\nexport type UseReferenceCitationPreview = ReferenceCitationPreviewGenerator;\n\n/**\n * Hook to generate a Citation - Reference pair with correctly wired props.\n * Both the Citation and the Reference act as trigger components to Previews that are also correctly wired by the hook.\n * Props can either be passed in to the hook or applied directly to the generated components in JSX.\n *\n * This hook internally calls the `generateReferenceCitationPreview` function and memoizes its return value based on the props.\n * You should only use this hook when the props used to generate the Citation - Reference pair can change dynamically.\n * If they are static, or in case you wanted to generate multiple pairs within a cycle, you should call\n * `generateReferenceCitationPreview` directly.\n *\n * @returns A Citation - Reference pair with correctly wired props.\n */\nexport const useReferenceCitationPreview: UseReferenceCitationPreview = props => {\n  return React.useMemo(() => generateReferenceCitationPreview(props), [props]);\n};\n"],"names":["React","generateReferenceCitationPreview","useReferenceCitationPreview","props","useMemo"],"rangeMappings":";;;;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD,GAEjD,YAAYA,WAAW,QAAQ;AAE/B,SACEC,gCAAgC,QAG3B,qCAAqC;AAM5C;;;;;;;;;;;CAWC,GACD,OAAO,MAAMC,8BAA2DC,CAAAA;IACtE,OAAOH,MAAMI,OAAO,CAAC,IAAMH,iCAAiCE,QAAQ;QAACA;KAAM;AAC7E,EAAE"}

package/lib-commonjs/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":["Reference","React","forwardRef","props","state","useReference_unstable","useReferenceStyles_unstable","useCustomStyleHook","renderReference_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;8BACe;iCACG;0CACG;+BAGT;AAG5B,MAAMA,YAAAA,WAAAA,GAAAA,OAAiDC,UAAMC,CAAU,CAACC,OAACA;UAC9EC,QAAMA,IAAAA,mCAAQC,EAAAA,OAAsBF;6DAEpCG,EAAAA;yCACAC,EAAAA,sBAAmBH;WAEnBI,IAAAA,yCAAOA,EAAAA;AACT;AAEAR,UAAUS,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":["state","useReference_unstable","props","ref","useReferenceStyles_unstable","renderReference_unstable","Reference"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUQA;;;eAAAA;;;;iEAVe;8BACe;iCACG;0CACG;+BAGT;AAIjC,MAAMA,YAAQC,WAAAA,GAAAA,OAAsBC,UAAOC,CAAAA,CAAAA,OAAAA;UAE3CC,QAAAA,IAAAA,mCAA4BJ,EAAAA,OAAAA;6DACT,EAAAA;yCAEZK,EAAAA,sBAAyBL;IAClC,OAAGK,IAAAA,yCAAA,EAAAL;AAEHM"}

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

@@ -1,6 +1,4 @@
-/**
- * State used in rendering Reference
- */ "use strict";
+/** deprecated Use ReferenceV2 component, hooks and types instead. */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });

package/lib-commonjs/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"}
+{"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"}

package/lib-commonjs/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","state","citation","_jsx","media","label","actions","_jsxs","children","detailsButton","sensitivity","metadata","primaryText","secondaryText","tertiaryText","icon"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWEA;;;eAAAA;;;4BAVF;iCAE4B;AAQ1BA,MAAAA,2BAA4BC,CAAAA;oCAE5B,EAAAA;;kBAEKA;YAAAA,MAAMC,QAAQ,IAAA,WAAI,GAAAC,IAAAA,eAACF,EAAAA,MAAMC,QAAQ,EAAA,CAAA;YAAAD,MAAAG,KAAA,IAAA,WAAA,GAAAD,IAAAA,eAAA,EAAAF,MAAAG,KAAA,EAAA,CAAA;YAAA,WAAA,GAAAD,IAAAA,eAAA,EAAAF,MAAAI,KAAA,EAAA,CAAA;YAAAJ,MAAAK,OAAA,IAAA,WAAA,GAAAC,IAAAA,gBAAA,EAAAN,MAAAK,OAAA,EAAA;0BACjCL;oBAAAA,MAAWK,OAAA,CAAAE,QAAA;oBAAIP,MAACA,aAAW,IAAA,WAAA,GAAAE,IAAAA,eAAA,EAAAF,MAAAQ,aAAA,EAAA,CAAA;iBAAA;;iCAC5B,WAAOJ,GAAKF,IAAAA,eAAA,EAAAF,MAAAS,WAAA,EAAA,CAAA;YAAA,WAAA,GAAAH,IAAAA,gBAAA,EAAAN,MAAAU,QAAA,EAAA;0BACXV;oBAAAA,MAAMK,WAAO,IAAA,WACXL,GAAAA,IAAAA,eAAMK,EAAAA,MAAOM,WAAA,EAAA,CAAA;oBAAAX,MAAAY,aAAA,IAAA,WAAA,GAAAV,IAAAA,eAAA,EAAAF,MAAAY,aAAA,EAAA,CAAA;oBAAAZ,MAAAa,YAAA,IAAA,WAAA,GAAAX,IAAAA,eAAA,EAAAF,MAAAa,YAAA,EAAA,CAAA;oBAAAb,MAAAc,IAAA,IAAA,WAAA,GAAAZ,IAAAA,eAAA,EAAAF,MAAAc,IAAA,EAAA,CAAA;oBAAAd,MAAAU,QAAA,CAAAH,QAAA;iBAAA"}
+{"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","state","citation","_jsx","media","label","actions","_jsxs","children","detailsButton","sensitivity","metadata","primaryText","secondaryText","tertiaryText","icon"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASEA;;;eAAAA;;;4BARF;iCAE4B;AAM1BA,MAAAA,2BAA4BC,CAAAA;oCAE5B,EAAAA;;kBAEKA;YAAAA,MAAMC,QAAQ,IAAA,WAAI,GAAAC,IAAAA,eAACF,EAAAA,MAAMC,QAAQ,EAAA,CAAA;YAAAD,MAAAG,KAAA,IAAA,WAAA,GAAAD,IAAAA,eAAA,EAAAF,MAAAG,KAAA,EAAA,CAAA;YAAA,WAAA,GAAAD,IAAAA,eAAA,EAAAF,MAAAI,KAAA,EAAA,CAAA;YAAAJ,MAAAK,OAAA,IAAA,WAAA,GAAAC,IAAAA,gBAAA,EAAAN,MAAAK,OAAA,EAAA;0BACjCL;oBAAAA,MAAWK,OAAA,CAAAE,QAAA;oBAAIP,MAACA,aAAW,IAAA,WAAA,GAAAE,IAAAA,eAAA,EAAAF,MAAAQ,aAAA,EAAA,CAAA;iBAAA;;iCAC5B,WAAOJ,GAAKF,IAAAA,eAAA,EAAAF,MAAAS,WAAA,EAAA,CAAA;YAAA,WAAA,GAAAH,IAAAA,gBAAA,EAAAN,MAAAU,QAAA,EAAA;0BACXV;oBAAAA,MAAMK,WAAO,IAAA,WACXL,GAAAA,IAAAA,eAAMK,EAAAA,MAAOM,WAAA,EAAA,CAAA;oBAAAX,MAAAY,aAAA,IAAA,WAAA,GAAAV,IAAAA,eAAA,EAAAF,MAAAY,aAAA,EAAA,CAAA;oBAAAZ,MAAAa,YAAA,IAAA,WAAA,GAAAX,IAAAA,eAAA,EAAAF,MAAAa,YAAA,EAAA,CAAA;oBAAAb,MAAAc,IAAA,IAAA,WAAA,GAAAZ,IAAAA,eAAA,EAAAF,MAAAc,IAAA,EAAA,CAAA;oBAAAd,MAAAU,QAAA,CAAAH,QAAA;iBAAA"}

package/lib-commonjs/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":["index","citationHref","ref","referenceId","mediaId","isExpanded","excerpt","setPopoverOpen","layout","onExpandClick","mode","useCopilotMode","props","labelId","slot","always","defaultProps","usePopoverContext","context","setOpen","elementType","_e","setIsExpanded","label","media","children","React","className","mergeClasses","referenceExtraClassNames","mediaChild","id","_label_ariadescribedby_concat","_label_ariadescribedby","concat","ariaLabelledByProp","tabIndex","onPopoverCloseClick","e","useMemo","referenceHref","state","components","root","citation","actions","sensitivity","metadata","primaryText","secondaryText","tertiaryText","detailsButton","Button","optional","Citation","hidden","icon","content","createElement","Caption1","appearance","size","onClick","mergeCallbacks","onTargettedByCitation","_e_relatedTarget","relatedTargetHash","onFocus","getIcon","ChevronDown24Regular","ChevronDown16Regular","ChevronUp24Regular","ChevronUp16Regular"],"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":["index","citationHref","ref","referenceId","mediaId","isExpanded","excerpt","setPopoverOpen","layout","onExpandClick","mode","useCopilotMode","props","labelId","slot","always","defaultProps","usePopoverContext","context","setOpen","elementType","_e","setIsExpanded","label","media","children","React","className","mergeClasses","referenceExtraClassNames","mediaChild","id","_label_ariadescribedby_concat","_label_ariadescribedby","concat","ariaLabelledByProp","tabIndex","onPopoverCloseClick","e","useMemo","referenceHref","state","components","root","citation","actions","sensitivity","metadata","primaryText","secondaryText","tertiaryText","detailsButton","Button","optional","Citation","hidden","icon","content","createElement","Caption1","appearance","size","onClick","mergeCallbacks","onTargettedByCitation","_e_relatedTarget","relatedTargetHash","onFocus","getIcon","ChevronDown24Regular","ChevronDown16Regular","ChevronUp24Regular","ChevronUp16Regular"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/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":["referenceClassNames","referenceExtraClassNames","state","mergeClasses","root","citation","media","actions","sensitivity","metadata","primaryText","secondaryText","tertiaryText","icon","label","content","detailsButton","text","mediaChild","labelFontSize","typographyStyles","caption1Strong","fontSize","labelLineHeight","lineHeight","maxPopoverWidth","useReferenceClassName","makeResetStyles","boxSizing","__styles","width","display","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","border","strokeWidthThin","borderRadius","padding","spacingVerticalS","boxShadow","columnGap","alignItems","Byoj8tv","uwmqm3","useStyles","makeStyles","sidecar","inline","popover","shorthands","closed","rowGap","nk6f5a","Bt984gj","justifyContent","psn4ub","mediaPopover","height","Bdqf98w","justifySelf","color","Ijaq50","marginTop","Be2twd7","metadataSubsequentText","position","left","top","uvfttm","flexDirection","wordBreak","hidden","Bw0ie65","mc9l5x","Beiy3e4","useLabelStyles","alignSelf","canvas","paddingTop","Br312pm","Bahqtrf","maxWidth","Biipf1f","Fd1uvx","Bh9c35c","Bmxbyg5","z8tnut","rootClassName","labelStyles","B2u0y6b","isSubsequentText","isExpanded","className","styles","mode","layout"],"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":["referenceClassNames","mediaChild","metadata","mergeClasses","root","citation","actions","sensitivity","primaryText","secondaryText","tertiaryText","label","content","detailsButton","text","labelFontSize","maxPopoverWidth","caption1Strong","fontSize","useReferenceClassName","makeResetStyles","lineHeight","boxSizing","width","__resetStyles","display","__styles","gridTemplateAreas","uwmqm3","gridTemplateRows","border","borderRadius","padding","spacingVerticalS","boxShadow","columnGap","spacingHorizontalXS","alignItems","z8tnut","z189sj","useStyles","makeStyles","canvas","sidecar","Belr9w4","popover","shorthands","Bw0ie65","rowGap","Ijaq50","media","justifyContent","a9b677","mediaPopover","height","nk6f5a","justifySelf","gridRowStart","D5xksd","buttonClassNames","color","marginTop","typographyStyles","metadataSubsequentText","position","marginLeft","left","spacingHorizontalS","top","Bciustq","icon","caption2","verticalAlign","Bm6vgfq","flexDirection","hidden","Br312pm","useLabelStyles","alignSelf","wordBreak","paddingTop","closed","maxWidth","Bhrd7zp","Bg96gwp","Biipf1f","Bmxbyg5","rootClassName","labelStyles","state","B2u0y6b","Bh9c35c","isSubsequentText","mode","layout","styles","referenceExtraClassNames","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}

package/lib-commonjs/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":["ReferenceGroupToggle","React","forwardRef","props","state","useReferenceGroupToggle_unstable","useReferenceGroupToggleStyles_unstable","renderReferenceGroupToggle_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;yCAC0B;4CACG;qDACG;AAKhD,MAAMA,uBAAAA,WAAAA,GAAAA,OAAuEC,UAAMC,CAAU,CAACC,OAACA;UACpGC,QAAMA,IAAAA,yDAAQC,EAAAA,OAAiCF;mFAE/CG,EAAAA;WACAC,IAAAA,+DAAOA,EAAAA;AACT;AAEAP,qBAAqBQ,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":["state","useReferenceGroupToggle_unstable","props","ref","useReferenceGroupToggleStyles_unstable","renderReferenceGroupToggle_unstable","ReferenceGroupToggle"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASQA;;;eAAAA;;;;iEATe;yCAC0B;4CACG;qDACG;AAMrD,MAAMA,uBAAQC,WAAAA,GAAAA,OAAiCC,UAAOC,CAAAA,CAAAA,OAAAA;UAEtDC,QAAAA,IAAAA,yDAAuCJ,EAAAA,OAAAA;mFAChCK,EAAAA;IACT,OAAGA,IAAAA,+DAAA,EAAAL;AAEHM"}

package/lib-commonjs/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":["ReferenceList","React","forwardRef","props","state","useReferenceList_unstable","useReferenceListStyles_unstable","useCustomStyleHook","renderReferenceList_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;kCACmB;qCACG;8CACG;+BAGb;AAG5B,MAAMA,gBAAAA,WAAAA,GAAAA,OAAyDC,UAAMC,CAAU,CAACC,OAACA;UACtFC,QAAMA,IAAAA,2CAAQC,EAAAA,OAA0BF;qEAExCG,EAAAA;yCACAC,EAAAA,0BAAmBH;WAEnBI,IAAAA,iDAAOA,EAAAA;AACT;AAEAR,cAAcS,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":["state","useReferenceList_unstable","props","ref","useReferenceListStyles_unstable","renderReferenceList_unstable","ReferenceList"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUQA;;;eAAAA;;;;iEAVe;kCACmB;qCACG;8CACG;+BAGb;AAIjC,MAAMA,gBAAQC,WAAAA,GAAAA,OAA0BC,UAAOC,CAAAA,CAAAA,OAAAA;UAE/CC,QAAAA,IAAAA,2CAAgCJ,EAAAA,OAAAA;qEACb,EAAAA;yCAEZK,EAAAA,0BAA6BL;IACtC,OAAGK,IAAAA,iDAAA,EAAAL;AAEHM"}

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

@@ -1,6 +1,4 @@
-/**
- * State used in rendering ReferenceList
- */ "use strict";
+/** deprecated Use ReferenceListV2 component, hooks and types instead. */ "use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });

package/lib-commonjs/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"}
+{"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"}

package/lib-commonjs/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","state","_jsx","root"],"rangeMappings":";;;;;;;;;;;;;;","mappings":";;;;+BAUEA;;;eAAAA;;;4BAVwB;iCAGE;AAO1BA,MAAAA,+BAAgCC,CAAAA;oCAEhC,EAAAA;IACA,OAAA,WAAA,GAAAC,IAAAA,eAAA,EAAAD,MAAAE,IAAA,EAAA,CAAA"}
+{"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","state","_jsx","root"],"rangeMappings":";;;;;;;;;;;;;;","mappings":";;;;+BAQEA;;;eAAAA;;;4BARwB;iCAGE;AAK1BA,MAAAA,+BAAgCC,CAAAA;oCAEhC,EAAAA;IACA,OAAA,WAAA,GAAAC,IAAAA,eAAA,EAAAD,MAAAE,IAAA,EAAA,CAAA"}

package/lib-commonjs/components/ReferenceList/useReferenceList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useReferenceList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-components';\nimport type { ReferenceListProps, ReferenceListState } from './ReferenceList.types';\nimport { referenceListItemClassName } from './useReferenceListStyles.styles';\n\n// If you add JSX to this file, be sure to change the file type to .tsx\n\n/**\n * Create the state required to render ReferenceList.\n *\n * The returned state can be modified with hooks such as useReferenceListStyles_unstable,\n * before being passed to renderReferenceList_unstable.\n *\n * @param props - props from this instance of ReferenceList\n * @param ref - reference to root HTMLElement of ReferenceList\n */\nexport const useReferenceList_unstable = (\n  props: ReferenceListProps,\n  ref: React.Ref<HTMLOListElement>,\n): ReferenceListState => {\n  return {\n    components: {\n      root: 'ol',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('ol', {\n        ref,\n        ...props,\n        children: React.Children.map(props.children, child => <li className={referenceListItemClassName}>{child}</li>),\n      }),\n      { elementType: 'ol' },\n    ),\n  };\n};\n"],"names":["useReferenceList_unstable","props","ref","components","root","children","className","referenceListItemClassName","child"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAoBSA;;;eAAAA;;;;iEApBc;iCACwB;8CAEJ;AAiBzC,MAAOA,4BAAA,CAAAC,OAAAC;WACLC;oBACEC;kBACF;;mCAGIF,CAAAA,MAAAA,CAAAA,IAAAA,yCAAAA,EAAAA,MAAAA;;oBAEAG;6BAA0DC,QAAAA,CAAWC,GAAAA,CAAAA,MAAAA,QAAAA,EAAAA,CAAAA,QAAAA,WAAAA,GAAAA,OAAAA,aAAAA,CAAAA,MAAAA;+BAA6BC,wDAAAA;mBACpGA;;yBACoB;QAExB;IACA"}
+{"version":3,"sources":["useReferenceList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-components';\nimport type { ReferenceListProps, ReferenceListState } from './ReferenceList.types';\nimport { referenceListItemClassName } from './useReferenceListStyles.styles';\n\n/**\n * Create the state required to render ReferenceList.\n *\n * The returned state can be modified with hooks such as useReferenceListStyles_unstable,\n * before being passed to renderReferenceList_unstable.\n *\n * @param props - props from this instance of ReferenceList\n * @param ref - reference to root HTMLElement of ReferenceList\n *\n * deprecated Use ReferenceListV2 component, hooks and types instead.\n */\nexport const useReferenceList_unstable = (\n  props: ReferenceListProps,\n  ref: React.Ref<HTMLOListElement>,\n): ReferenceListState => {\n  return {\n    components: {\n      root: 'ol',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('ol', {\n        ref,\n        ...props,\n        children: React.Children.map(props.children, child => <li className={referenceListItemClassName}>{child}</li>),\n      }),\n      { elementType: 'ol' },\n    ),\n  };\n};\n"],"names":["useReferenceList_unstable","props","ref","components","root","children","className","referenceListItemClassName","child"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAoBSA;;;eAAAA;;;;iEApBc;iCACwB;8CAEJ;AAiBzC,MAAOA,4BAAA,CAAAC,OAAAC;WACLC;oBACEC;kBACF;;mCAGIF,CAAAA,MAAAA,CAAAA,IAAAA,yCAAAA,EAAAA,MAAAA;;oBAEAG;6BAA0DC,QAAAA,CAAWC,GAAAA,CAAAA,MAAAA,QAAAA,EAAAA,CAAAA,QAAAA,WAAAA,GAAAA,OAAAA,aAAAA,CAAAA,MAAAA;+BAA6BC,wDAAAA;mBACpGA;;yBACoB;QAExB;IACA"}

package/lib-commonjs/components/ReferenceList/useReferenceListStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useReferenceListStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, tokens } from '@fluentui/react-components';\nimport type { ReferenceListSlots, ReferenceListState } from './ReferenceList.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const referenceListClassNames: SlotClassNames<ReferenceListSlots> = {\n  root: 'fai-ReferenceList',\n};\n\nexport const referenceListItemClassName = 'fai-ReferenceList__item';\n\n/**\n * Styles for the root slot\n */\nconst useRootClassName = makeResetStyles({\n  padding: 0,\n  margin: 0,\n  display: 'flex',\n  flexDirection: 'column',\n  gap: tokens.spacingVerticalS,\n\n  [`> .${referenceListItemClassName}`]: {\n    listStyleType: 'none',\n  },\n});\n\n/**\n * Apply styling to the ReferenceList slots based on the state\n */\nexport const useReferenceListStyles_unstable = (state: ReferenceListState): ReferenceListState => {\n  'use no memo';\n\n  state.root.className = mergeClasses(referenceListClassNames.root, useRootClassName(), state.root.className);\n\n  return state;\n};\n"],"names":["referenceListClassNames","referenceListItemClassName","tokens","root","padding","__resetStyles","gap","state","className","mergeClasses","useRootClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,uBAAAA;eAAAA;;IAIAC,0BAAAA;eAAAA;;IAUNC,+BAAuB;eAAvBA;;;iCAlBuC;AAIvC,MAAMF,0BAA8D;UACzEG;AACF;AAEO,MAAMF,6BAA6B;AAE1C;;CAEC,SAECG,mBAASC,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAAA;AAITC,MAAKJ,kCAAuBK,CAAAA;;UAI5BJ,IAAA,CAAAK,SAAA,GAAAC,IAAAA,6BAAA,EAAAT,wBAAAG,IAAA,EAAAO,oBAAAH,MAAAJ,IAAA,CAAAK,SAAA;IACF,OAAAD;AAEA"}
+{"version":3,"sources":["useReferenceListStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, tokens } from '@fluentui/react-components';\nimport type { ReferenceListSlots, ReferenceListState } from './ReferenceList.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\n/** deprecated Use ReferenceListV2 component, hooks and types instead. */\nexport const referenceListClassNames: SlotClassNames<ReferenceListSlots> = {\n  root: 'fai-ReferenceList',\n};\n\n/** deprecated Use ReferenceListV2 component, hooks and types instead. */\nexport const referenceListItemClassName = 'fai-ReferenceList__item';\n\n/**\n * Styles for the root slot\n */\nconst useRootClassName = makeResetStyles({\n  padding: 0,\n  margin: 0,\n  display: 'flex',\n  flexDirection: 'column',\n  gap: tokens.spacingVerticalS,\n\n  [`> .${referenceListItemClassName}`]: {\n    listStyleType: 'none',\n  },\n});\n\n/**\n * Apply styling to the ReferenceList slots based on the state\n *\n * deprecated Use ReferenceListV2 component, hooks and types instead.\n */\nexport const useReferenceListStyles_unstable = (state: ReferenceListState): ReferenceListState => {\n  'use no memo';\n\n  state.root.className = mergeClasses(referenceListClassNames.root, useRootClassName(), state.root.className);\n\n  return state;\n};\n"],"names":["referenceListClassNames","useReferenceListStyles_unstable","root","display","__resetStyles","state"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAMQA,uBAAA;eAAAA;;;;;IAmBRC,+BAAA;eAAAA;;;iCAzB8C;AAM5CC,MAAMF,0BAAA;IACNE,MAAA;AAEF;;;;UASEC,mBAASC,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAAA;AAOX,MAAAH,kCAAAI,CAAAA;IAEA;;;4DAME"}

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

@@ -42,7 +42,7 @@ const useReference_unstable = (props, ref)=>{
         id: referenceId,
         shouldUseOverflow,
         components: {
-            root: 'button',
+            root: elementType,
             citation: 'span',
             divider: 'span',
             graphic: 'span',

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

@@ -1 +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.styles';\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 = (\n  props: ReferenceProps,\n  ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ReferenceState => {\n  const { as, children, id } = props;\n\n  const shouldUseOverflow = useReferenceListContext_unstable(ctx => ctx.shouldUseOverflow);\n\n  const referenceId = useId('reference-', id);\n\n  const elementType = as || ((props as JSX.IntrinsicElements['a']).href ? 'a' : 'button');\n  const propsWithAssignedAs = {\n    type: elementType === 'button' ? 'button' : undefined,\n    ...props,\n    as: elementType,\n    id: referenceId,\n  } as ReferenceProps;\n\n  const citation = slot.optional(props.citation, { elementType: 'span' });\n  const graphic = slot.optional(props.graphic, { elementType: 'span' });\n  const content = slot.optional(props.content, {\n    elementType: 'span',\n    renderByDefault: graphic !== 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    id: referenceId,\n    shouldUseOverflow,\n\n    components: {\n      root: 'button',\n      citation: 'span',\n      divider: 'span',\n      graphic: 'span',\n      content: 'span',\n    },\n\n    root: slot.always(\n      getIntrinsicElementProps(elementType, {\n        ref,\n        ...propsWithAssignedAs,\n      }),\n      { elementType },\n    ),\n    citation,\n    divider,\n    content,\n    graphic,\n  };\n\n  if (state.graphic && React.isValidElement<HTMLElement>(state.graphic.children)) {\n    state.graphic.children = React.cloneElement(state.graphic.children, {\n      className: mergeClasses(state.graphic.children.props.className, referenceExtraClassNames.graphicChild),\n    });\n  }\n\n  return state;\n};\n"],"names":["as","props","children","elementType","id","shouldUseOverflow","useReferenceListContext_unstable","ctx","referenceId","propsWithAssignedAs","type","citation","optional","slot","content","renderByDefault","graphic","undefined","ref","always","getIntrinsicElementProps","divider","state","React","cloneElement"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAmBUA;;;eAAAA;;;;iEAnBa;iCAC6C;sCACnB;0CACR;AAgBvC,MAAQA,wBAAqBC,CAAAA,OAAAA;UAE7B,EAEAD,EAAA,EAEAE,QAAMC,EACNC,EAAA;UAEEC,oBAAQC,IAAAA,sDAAA,EAAAC,CAAAA,MAAAA,IAAAF,iBAAA;UACRL,cAAIG,IAAAA,sBAAAA,EAAAA,cAAAA;UACJC,cAAII,MAAAA,CAAAA,MAAAA,IAAAA,GAAAA,MAAAA,QAAAA;UACNC,sBAAA;QAEAC,MAAMC,gBAAgBC,WAASX,WAAMU;gBAAYR;QAAoBH,IAAAG;QACrEC,IAAAI;;UAAmEG,WAAAE,qBAAA,CAAAD,QAAA,CAAAX,MAAAU,QAAA,EAAA;QACnER,aAAMW;;UAEJC,UAAAA,qBAAAA,CAAAA,QAAiBC,CAAAA,MAAYC,OAAAA,EAAAA;QAC/Bd,aAAA;;UAEEA,UAAAA,qBAAa,CAAAS,QAAA,CAAAX,MAAAa,OAAA,EAAA;qBACbC;QACFA,iBAAAC,YAAAC,aAAA,CAAA,CAAAf;;UAGEE,UAAII,qBAAAA,CAAAA,QAAAA,CAAAA,MAAAA,OAAAA,EAAAA;qBACJH;yBAEYM,aAAAM,aAAAH,YAAAG;;kBAEVN;;;oBAGAG;kBACF;sBAEMD;qBAEFK;qBACGT;qBAEL;;cAAcI,qBAAA,CAAAM,MAAA,CAAAC,IAAAA,yCAAA,EAAAjB,aAAA;;eAGhBkB,mBAAAA;YACAP;;QAEF;QAEAH;;;;;QAMAW,MAAOA,OAAAA,kBAAAA,OAAAA,cAAAA,CAAAA,MAAAA,OAAAA,CAAAA,QAAAA,GAAAA;QACPA,MAAAN,OAAA,CAAAd,QAAA,iBAAAqB,OAAAC,YAAA,CAAAF,MAAAN,OAAA,CAAAd,QAAA,EAAA"}
+{"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.styles';\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 = (\n  props: ReferenceProps,\n  ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ReferenceState => {\n  const { as, children, id } = props;\n\n  const shouldUseOverflow = useReferenceListContext_unstable(ctx => ctx.shouldUseOverflow);\n\n  const referenceId = useId('reference-', id);\n\n  const elementType = as || ((props as JSX.IntrinsicElements['a']).href ? 'a' : 'button');\n  const propsWithAssignedAs = {\n    type: elementType === 'button' ? 'button' : undefined,\n    ...props,\n    as: elementType,\n    id: referenceId,\n  } as ReferenceProps;\n\n  const citation = slot.optional(props.citation, { elementType: 'span' });\n  const graphic = slot.optional(props.graphic, { elementType: 'span' });\n  const content = slot.optional(props.content, {\n    elementType: 'span',\n    renderByDefault: graphic !== 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    id: referenceId,\n    shouldUseOverflow,\n\n    components: {\n      root: elementType,\n      citation: 'span',\n      divider: 'span',\n      graphic: 'span',\n      content: 'span',\n    },\n\n    root: slot.always(\n      getIntrinsicElementProps(elementType, {\n        ref,\n        ...propsWithAssignedAs,\n      }),\n      { elementType },\n    ),\n    citation,\n    divider,\n    content,\n    graphic,\n  };\n\n  if (state.graphic && React.isValidElement<HTMLElement>(state.graphic.children)) {\n    state.graphic.children = React.cloneElement(state.graphic.children, {\n      className: mergeClasses(state.graphic.children.props.className, referenceExtraClassNames.graphicChild),\n    });\n  }\n\n  return state;\n};\n"],"names":["as","props","children","elementType","id","shouldUseOverflow","useReferenceListContext_unstable","ctx","referenceId","propsWithAssignedAs","type","citation","optional","slot","content","renderByDefault","graphic","undefined","ref","always","getIntrinsicElementProps","divider","state","React","cloneElement"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAmBUA;;;eAAAA;;;;iEAnBa;iCAC6C;sCACnB;0CACR;AAgBvC,MAAQA,wBAAqBC,CAAAA,OAAAA;UAE7B,EAEAD,EAAA,EAEAE,QAAMC,EACNC,EAAA;UAEEC,oBAAQC,IAAAA,sDAAA,EAAAC,CAAAA,MAAAA,IAAAF,iBAAA;UACRL,cAAIG,IAAAA,sBAAAA,EAAAA,cAAAA;UACJC,cAAII,MAAAA,CAAAA,MAAAA,IAAAA,GAAAA,MAAAA,QAAAA;UACNC,sBAAA;QAEAC,MAAMC,gBAAgBC,WAASX,WAAMU;gBAAYR;QAAoBH,IAAAG;QACrEC,IAAAI;;UAAmEG,WAAAE,qBAAA,CAAAD,QAAA,CAAAX,MAAAU,QAAA,EAAA;QACnER,aAAMW;;UAEJC,UAAAA,qBAAAA,CAAAA,QAAiBC,CAAAA,MAAYC,OAAAA,EAAAA;QAC/Bd,aAAA;;UAEEA,UAAAA,qBAAa,CAAAS,QAAA,CAAAX,MAAAa,OAAA,EAAA;qBACbC;QACFA,iBAAAC,YAAAC,aAAA,CAAA,CAAAf;;UAGEE,UAAII,qBAAAA,CAAAA,QAAAA,CAAAA,MAAAA,OAAAA,EAAAA;qBACJH;yBAEYM,aAAAM,aAAAH,YAAAG;;kBAEVN;;;oBAGAG;kBACFX;sBAEMU;qBAEFK;qBACGT;qBAEL;;cAAcI,qBAAA,CAAAM,MAAA,CAAAC,IAAAA,yCAAA,EAAAjB,aAAA;;eAGhBkB,mBAAAA;YACAP;;QAEF;QAEAH;;;;;QAMAW,MAAOA,OAAAA,kBAAAA,OAAAA,cAAAA,CAAAA,MAAAA,OAAAA,CAAAA,QAAAA,GAAAA;QACPA,MAAAN,OAAA,CAAAd,QAAA,iBAAAqB,OAAAC,YAAA,CAAAF,MAAAN,OAAA,CAAAd,QAAA,EAAA"}

package/lib-commonjs/components/reference-v2/Reference/useReferenceStyles.styles.js

@@ -34,19 +34,21 @@ const referenceExtraClassNames = {
     graphicChild: 'fai-Reference__graphicChild'
 };
 const GRAPHIC_SIZE = '16px';
-const useRootBaseClassName = (0, _reactcomponents.__resetStyles)("rtvjomn", null, [
-    ".rtvjomn{align-items:center;background-color:var(--colorNeutralBackground3);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadiusMedium);box-sizing:border-box;color:var(--colorNeutralForeground2);column-gap:var(--spacingHorizontalXXS);display:flex;flex-shrink:0;justify-content:center;max-width:max-content;padding:var(--spacingVerticalXXS) var(--spacingHorizontalS);text-decoration:none;}",
-    ".rtvjomn:hover{background-color:var(--colorNeutralBackground3Hover);border-color:var(--colorNeutralStroke1Hover);color:var(--colorNeutralForeground2Hover);}",
-    ".rtvjomn:hover .fai-Reference__divider{background-color:var(--colorNeutralStroke1Hover);}",
-    ".rtvjomn:hover:active{background-color:var(--colorNeutralBackground3Pressed);border-color:var(--colorNeutralStroke1Pressed);color:var(--colorNeutralForeground2Pressed);}",
-    ".rtvjomn:hover:active .fai-Reference__divider{background-color:var(--colorNeutralStroke1Pressed);}"
+const useRootBaseClassName = (0, _reactcomponents.__resetStyles)("r1rjhy11", null, [
+    ".r1rjhy11{align-items:center;background-color:var(--colorNeutralBackground3);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadiusMedium);box-sizing:border-box;color:var(--colorNeutralForeground2);column-gap:var(--spacingHorizontalXXS);display:flex;flex-shrink:0;justify-content:center;max-width:max-content;min-height:24px;padding:var(--spacingVerticalXXS) var(--spacingHorizontalS);text-decoration:none;}",
+    ".r1rjhy11:hover{background-color:var(--colorNeutralBackground3Hover);border-color:var(--colorNeutralStroke1Hover);color:var(--colorNeutralForeground2Hover);}",
+    ".r1rjhy11:hover .fai-Reference__divider{background-color:var(--colorNeutralStroke1Hover);}",
+    ".r1rjhy11:hover:active{background-color:var(--colorNeutralBackground3Pressed);border-color:var(--colorNeutralStroke1Pressed);color:var(--colorNeutralForeground2Pressed);}",
+    ".r1rjhy11:hover:active .fai-Reference__divider{background-color:var(--colorNeutralStroke1Pressed);}"
 ]);
 const useRootStyles = (0, _reactcomponents.__styles)({
     overflow: {
+        B2u0y6b: "f6dzj5z",
         a9b677: "fly5x3f"
     }
 }, {
     d: [
+        ".f6dzj5z{max-width:100%;}",
         ".fly5x3f{width:100%;}"
     ]
 });

package/lib-commonjs/components/reference-v2/Reference/useReferenceStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useReferenceStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, tokens, typographyStyles } 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  divider: 'fai-Reference__divider',\n  graphic: 'fai-Reference__graphic',\n  content: 'fai-Reference__content',\n};\n\nexport const referenceExtraClassNames = {\n  graphicChild: 'fai-Reference__graphicChild',\n};\n\nconst GRAPHIC_SIZE = '16px';\n\nconst useRootBaseClassName = makeResetStyles({\n  alignItems: 'center',\n  backgroundColor: tokens.colorNeutralBackground3,\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}`,\n  borderRadius: tokens.borderRadiusMedium,\n  boxSizing: 'border-box',\n  color: tokens.colorNeutralForeground2,\n  columnGap: tokens.spacingHorizontalXXS,\n  display: 'flex',\n  flexShrink: 0,\n  justifyContent: 'center',\n  maxWidth: 'max-content',\n  padding: `${tokens.spacingVerticalXXS} ${tokens.spacingHorizontalS}`,\n  textDecoration: 'none',\n\n  ':hover': {\n    backgroundColor: tokens.colorNeutralBackground3Hover,\n    borderColor: tokens.colorNeutralStroke1Hover,\n    color: tokens.colorNeutralForeground2Hover,\n\n    [`& .${referenceClassNames.divider}`]: {\n      backgroundColor: tokens.colorNeutralStroke1Hover,\n    },\n  },\n\n  ':hover:active': {\n    backgroundColor: tokens.colorNeutralBackground3Pressed,\n    borderColor: tokens.colorNeutralStroke1Pressed,\n    color: tokens.colorNeutralForeground2Pressed,\n\n    [`& .${referenceClassNames.divider}`]: {\n      backgroundColor: tokens.colorNeutralStroke1Pressed,\n    },\n  },\n});\n\nexport const useRootStyles = makeStyles({\n  overflow: {\n    width: '100%',\n  },\n});\n\nconst useCitationBaseClassName = makeResetStyles({\n  ...typographyStyles.caption2Strong,\n});\n\nconst useDividerBaseClassName = makeResetStyles({\n  backgroundColor: tokens.colorNeutralStroke2,\n  height: '16px',\n  margin: `${tokens.spacingVerticalNone} ${tokens.spacingHorizontalXS}`,\n  width: '1px',\n});\n\nconst useGraphicBaseClassName = makeResetStyles({\n  fontSize: GRAPHIC_SIZE,\n  height: GRAPHIC_SIZE,\n  lineHeight: GRAPHIC_SIZE,\n  width: GRAPHIC_SIZE,\n\n  [`> .${referenceExtraClassNames.graphicChild}`]: {\n    height: GRAPHIC_SIZE,\n    width: GRAPHIC_SIZE,\n  },\n});\n\nconst useContentBaseClassName = makeResetStyles({\n  columnGap: tokens.spacingHorizontalSNudge,\n  display: 'inline-flex',\n  ...typographyStyles.caption1,\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 rootBaseClassName = useRootBaseClassName();\n  const citationBaseClassName = useCitationBaseClassName();\n  const dividerBaseClassName = useDividerBaseClassName();\n  const contentBaseClassName = useContentBaseClassName();\n  const graphicBaseClassName = useGraphicBaseClassName();\n\n  state.root.className = mergeClasses(referenceClassNames.root, rootBaseClassName, state.root.className);\n\n  if (state.citation) {\n    state.citation.className = mergeClasses(\n      referenceClassNames.citation,\n      citationBaseClassName,\n      state.citation.className,\n    );\n  }\n\n  if (state.divider) {\n    state.divider.className = mergeClasses(referenceClassNames.divider, dividerBaseClassName, state.divider.className);\n  }\n\n  if (state.content) {\n    state.content.className = mergeClasses(referenceClassNames.content, contentBaseClassName, state.content.className);\n  }\n\n  if (state.graphic) {\n    state.graphic.className = mergeClasses(referenceClassNames.graphic, graphicBaseClassName, state.graphic.className);\n  }\n\n  return state;\n};\n"],"names":["referenceClassNames","referenceExtraClassNames","backgroundColor","colorNeutralBackground3Hover","alignItems","root","citation","divider","graphic","content","graphicChild","GRAPHIC_SIZE","useRootBaseClassName","makeResetStyles","__styles","border","color","colorNeutralForeground2","display","__resetStyles","flexShrink","justifyContent","maxWidth","rootBaseClassName","tokens","dividerBaseClassName","useDividerBaseClassName","contentBaseClassName","useContentBaseClassName","graphicBaseClassName","useGraphicBaseClassName","colorNeutralBackground3Pressed","state","className","borderColor","colorNeutralForeground2Pressed","citationBaseClassName","mergeClasses","useRootStyles","makeStyles","width","useCitationBaseClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,mBAAAA;eAAAA;;IAQAC,wBAAAA;eAAAA;;IAsBTC,2BAAwBC;eAAxBD;;IAfFE,aAAY;eAAZA;;;iCAnB0E;AAIrE,MAAMJ,sBAAsD;UACjEK;cACAC;aACAC;aACAC;aACAC;AACF;AAEO,MAAMR,2BAA2B;kBACtCS;AACF;AAEA,MAAMC,eAAe;AAErB,MAAMC,uBAAuBC,IAAAA,8BAAAA,EAAAA,WAAgB,MAAA;IAAA;IAAA;IAAA;IAAA;IAAA;CAAA;AAC3CT,MAAAA,gBAAYU,IAAAA,yBAAA,EAAA;cACZZ;QACAa,QAAQ;;;OAGRC;QAAAA;KAAcC;;MAEdC,2BAASC,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;CAAA;MACTC,0BAAYD,IAAAA,8BAAA,EAAA,YAAA,MAAA;IAAA;CAAA;MACZE,0BAAgBF,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAAA;MAChBG,0BAAUH,IAAAA,8BAAA,EAAA,YAAA,MAAA;IAAA;CAAA;MAKRjB,8BAAwBC,CAAAA;;UAIxBoB,oBAAOvB;kCACYwB;UACnBC,uBAAAC;UACFC,uBAAAC;UAEAC,uBAAiBC;UACf5B,IAAAA,CAAAA,SAAAA,GAAiBsB,IAAAA,6BAAOO,EAAAA,oBAAAA,IAA8B,EAAAR,mBAAAS,MAAA3B,IAAA,CAAA4B,SAAA;cACtDC,QAAAA,EAAaV;cACbR,QAAOQ,CAAAA,SAAOW,GAAAA,IAAAA,6BAAAA,EAAAA,oBAA8B7B,QAAA,EAAA8B,uBAAAJ,MAAA1B,QAAA,CAAA2B,SAAA;;cAG1C/B,OAAAA,EAAAA;cACFK,OAAA,CAAA0B,SAAA,GAAAI,IAAAA,6BAAA,EAAArC,oBAAAO,OAAA,EAAAkB,sBAAAO,MAAAzB,OAAA,CAAA0B,SAAA;;IAEJ,IAAAD,MAAAvB,OAAA,EAAA;QAEAuB,MAAOvB,OAAM6B,CAAAA,SAAAA,GAAgBC,IAAAA,6BAAW,EAAAvC,oBAAAS,OAAA,EAAAkB,sBAAAK,MAAAvB,OAAA,CAAAwB,SAAA;;cAEpCO,OAAO,EAAA;QACTR,MAAAxB,OAAA,CAAAyB,SAAA,GAAAI,IAAAA,6BAAA,EAAArC,oBAAAQ,OAAA,EAAAqB,sBAAAG,MAAAxB,OAAA,CAAAyB,SAAA;IACF;IAEA,OAAMQ;GAEN,qDAAA"}
+{"version":3,"sources":["useReferenceStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, tokens, typographyStyles } 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  divider: 'fai-Reference__divider',\n  graphic: 'fai-Reference__graphic',\n  content: 'fai-Reference__content',\n};\n\nexport const referenceExtraClassNames = {\n  graphicChild: 'fai-Reference__graphicChild',\n};\n\nconst GRAPHIC_SIZE = '16px';\n\nconst useRootBaseClassName = makeResetStyles({\n  alignItems: 'center',\n  backgroundColor: tokens.colorNeutralBackground3,\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}`,\n  borderRadius: tokens.borderRadiusMedium,\n  boxSizing: 'border-box',\n  color: tokens.colorNeutralForeground2,\n  columnGap: tokens.spacingHorizontalXXS,\n  display: 'flex',\n  flexShrink: 0,\n  justifyContent: 'center',\n  maxWidth: 'max-content',\n  minHeight: '24px',\n  padding: `${tokens.spacingVerticalXXS} ${tokens.spacingHorizontalS}`,\n  textDecoration: 'none',\n\n  ':hover': {\n    backgroundColor: tokens.colorNeutralBackground3Hover,\n    borderColor: tokens.colorNeutralStroke1Hover,\n    color: tokens.colorNeutralForeground2Hover,\n\n    [`& .${referenceClassNames.divider}`]: {\n      backgroundColor: tokens.colorNeutralStroke1Hover,\n    },\n  },\n\n  ':hover:active': {\n    backgroundColor: tokens.colorNeutralBackground3Pressed,\n    borderColor: tokens.colorNeutralStroke1Pressed,\n    color: tokens.colorNeutralForeground2Pressed,\n\n    [`& .${referenceClassNames.divider}`]: {\n      backgroundColor: tokens.colorNeutralStroke1Pressed,\n    },\n  },\n});\n\nexport const useRootStyles = makeStyles({\n  overflow: {\n    maxWidth: '100%',\n    width: '100%',\n  },\n});\n\nconst useCitationBaseClassName = makeResetStyles({\n  ...typographyStyles.caption2Strong,\n});\n\nconst useDividerBaseClassName = makeResetStyles({\n  backgroundColor: tokens.colorNeutralStroke2,\n  height: '16px',\n  margin: `${tokens.spacingVerticalNone} ${tokens.spacingHorizontalXS}`,\n  width: '1px',\n});\n\nconst useGraphicBaseClassName = makeResetStyles({\n  fontSize: GRAPHIC_SIZE,\n  height: GRAPHIC_SIZE,\n  lineHeight: GRAPHIC_SIZE,\n  width: GRAPHIC_SIZE,\n\n  [`> .${referenceExtraClassNames.graphicChild}`]: {\n    height: GRAPHIC_SIZE,\n    width: GRAPHIC_SIZE,\n  },\n});\n\nconst useContentBaseClassName = makeResetStyles({\n  columnGap: tokens.spacingHorizontalSNudge,\n  display: 'inline-flex',\n  ...typographyStyles.caption1,\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 rootBaseClassName = useRootBaseClassName();\n  const citationBaseClassName = useCitationBaseClassName();\n  const dividerBaseClassName = useDividerBaseClassName();\n  const contentBaseClassName = useContentBaseClassName();\n  const graphicBaseClassName = useGraphicBaseClassName();\n\n  state.root.className = mergeClasses(referenceClassNames.root, rootBaseClassName, state.root.className);\n\n  if (state.citation) {\n    state.citation.className = mergeClasses(\n      referenceClassNames.citation,\n      citationBaseClassName,\n      state.citation.className,\n    );\n  }\n\n  if (state.divider) {\n    state.divider.className = mergeClasses(referenceClassNames.divider, dividerBaseClassName, state.divider.className);\n  }\n\n  if (state.content) {\n    state.content.className = mergeClasses(referenceClassNames.content, contentBaseClassName, state.content.className);\n  }\n\n  if (state.graphic) {\n    state.graphic.className = mergeClasses(referenceClassNames.graphic, graphicBaseClassName, state.graphic.className);\n  }\n\n  return state;\n};\n"],"names":["referenceClassNames","referenceExtraClassNames","backgroundColor","colorNeutralBackground3Hover","alignItems","root","citation","divider","graphic","content","graphicChild","GRAPHIC_SIZE","useRootBaseClassName","makeResetStyles","__styles","border","borderRadius","columnGap","spacingHorizontalXXS","flexShrink","__resetStyles","justifyContent","maxWidth","minHeight","rootBaseClassName","tokens","dividerBaseClassName","useDividerBaseClassName","contentBaseClassName","useContentBaseClassName","graphicBaseClassName","useGraphicBaseClassName","colorNeutralBackground3Pressed","state","className","borderColor","color","colorNeutralForeground2Pressed","citationBaseClassName","mergeClasses","useRootStyles","makeStyles","width"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,mBAAAA;eAAAA;;IAQAC,wBAAAA;eAAAA;;IAuBTC,2BAAwBC;eAAxBD;;IAhBFE,aAAY;eAAZA;;;iCAnB0E;AAIrE,MAAMJ,sBAAsD;UACjEK;cACAC;aACAC;aACAC;aACAC;AACF;AAEO,MAAMR,2BAA2B;kBACtCS;AACF;AAEA,MAAMC,eAAe;AAErB,MAAMC,uBAAuBC,IAAAA,8BAAAA,EAAAA,YAAgB,MAAA;IAAA;IAAA;IAAA;IAAA;IAAA;CAAA;AAC3CT,MAAAA,gBAAYU,IAAAA,yBAAA,EAAA;cACZZ;QACAa,SAAS;QACTC,QAAAA;;;OAGAC;QAAAA;QAAkBC;KAAoB;;MAEtCC,2BAAYC,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;CAAA;MACZC,0BAAgBD,IAAAA,8BAAA,EAAA,YAAA,MAAA;IAAA;CAAA;MAChBE,0BAAUF,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAAA;MACVG,0BAAWH,IAAAA,8BAAA,EAAA,YAAA,MAAA;IAAA;CAAA;MAKTlB,8BAAwBC,CAAAA;;UAIxBqB,oBAAOxB;kCACYyB;UACnBC,uBAAAC;UACFC,uBAAAC;UAEAC,uBAAiBC;UACf7B,IAAAA,CAAAA,SAAAA,GAAiBuB,IAAAA,6BAAOO,EAAAA,oBAAAA,IAA8B,EAAAR,mBAAAS,MAAA5B,IAAA,CAAA6B,SAAA;cACtDC,QAAAA,EAAaV;cACbW,QAAOX,CAAAA,SAAOY,GAAAA,IAAAA,6BAAAA,EAAAA,oBAA8B/B,QAAA,EAAAgC,uBAAAL,MAAA3B,QAAA,CAAA4B,SAAA;;cAG1ChC,OAAAA,EAAAA;cACFK,OAAA,CAAA2B,SAAA,GAAAK,IAAAA,6BAAA,EAAAvC,oBAAAO,OAAA,EAAAmB,sBAAAO,MAAA1B,OAAA,CAAA2B,SAAA;;IAEJ,IAAAD,MAAAxB,OAAA,EAAA;QAEAwB,MAAOxB,OAAM+B,CAAAA,SAAAA,GAAgBC,IAAAA,6BAAW,EAAAzC,oBAAAS,OAAA,EAAAmB,sBAAAK,MAAAxB,OAAA,CAAAyB,SAAA;;cAEpCZ,OAAU,EAAA;cACVoB,OAAO,CAAAR,SAAA,GAAAK,IAAAA,6BAAA,EAAAvC,oBAAAQ,OAAA,EAAAsB,sBAAAG,MAAAzB,OAAA,CAAA0B,SAAA;;IAEX,OAAGD;AAEH,wDACoC"}