@fluentui-copilot/react-reference 0.0.0-nightly-20240313-0404-8abc883d.1

package/lib/components/Citation/useCitation.js

@@ -0,0 +1,191 @@
+import * as React from 'react';
+import { getNativeElementProps, PopoverSurface, mergeCallbacks, slot, useFluent, useId, useIsomorphicLayoutEffect } from '@fluentui/react-components';
+import { Enter, Escape } from '@fluentui/keyboard-keys';
+import { useTimeout } from '@fluentui/react-utilities';
+import { usePreviewContext_unstable } from '@fluentui-copilot/react-preview';
+const POPOVER_MOUSE_HIDE_DELAY = 500;
+const POPOVER_KEYBOARD_HIDE_DELAY = 0;
+const getDelay = type => {
+  if (type === 'focus' || type === 'blur') {
+    return POPOVER_KEYBOARD_HIDE_DELAY;
+  }
+  return POPOVER_MOUSE_HIDE_DELAY;
+};
+/**
+ * Create the state required to render Citation.
+ *
+ * The returned state can be modified with hooks such as useCitationStyles_unstable,
+ * before being passed to renderCitation_unstable.
+ *
+ * @param props - props from this instance of Citation
+ * @param ref - reference to root HTMLElement of Citation
+ */
+export const useCitation_unstable = (props, ref) => {
+  const {
+    popover,
+    popoverSurface,
+    referenceHref,
+    block = false,
+    ...otherProps
+  } = props;
+  const {
+    targetDocument
+  } = useFluent();
+  const [setTimeout, clearTimeout] = useTimeout();
+  const popoverId = useId('citation-popover-');
+  const [disableAutoFocus, setDisableAutoFocus] = React.useState(true);
+  const {
+    current: citationInternalState
+  } = React.useRef({
+    openByClick: false,
+    openByHoverOverCitation: false,
+    openByHoverOverPopover: false,
+    openByKeyboard: false
+  });
+  const isOpen = () => {
+    return citationInternalState.openByClick || citationInternalState.openByHoverOverCitation || citationInternalState.openByHoverOverPopover || citationInternalState.openByKeyboard;
+  };
+  const [isPopoverOpen, setIsPopoverOpen] = React.useState(false);
+  const preventDefaultClose = React.useRef(false);
+  const handleCitationTargetEnter = e => {
+    citationInternalState.openByHoverOverCitation = true;
+    // We want to disable auto focus only if the popover is being opened by hovering over the citation
+    if (!citationInternalState.openByClick && !citationInternalState.openByKeyboard) {
+      setDisableAutoFocus(true);
+    }
+    setIsPopoverOpen(isOpen());
+  };
+  const handleCitationTargetLeave = e => {
+    citationInternalState.openByHoverOverCitation = false;
+    setTimeout(() => {
+      setIsPopoverOpen(isOpen());
+    }, getDelay(e.type));
+  };
+  const handleCitationClick = e => {
+    // Setting preventDefaultClose so that onPopoverOpenChange does not apply its logic when click is on the citation as we want to control that behavior.
+    preventDefaultClose.current = true;
+    // We set disableAutoFocus to false so that interactive elements within popover can be focused when it opens via click.
+    setDisableAutoFocus(false);
+    // If openByKeyboard is true, then the popover was already opened via keyboard and we always want to close it.
+    citationInternalState.openByClick = citationInternalState.openByKeyboard ? false : !citationInternalState.openByClick;
+    citationInternalState.openByHoverOverCitation = false;
+    citationInternalState.openByHoverOverPopover = false;
+    citationInternalState.openByKeyboard = false;
+    setIsPopoverOpen(isOpen());
+  };
+  const handleCitationKeyDown = e => {
+    if (e.key === Enter) {
+      clearTimeout();
+      // Setting default prevented so the enter key does not trigger a click event or onPopoverOpenChange.
+      e.preventDefault();
+      // We set disableAutoFocus to false so that interactive elements within popover can be focused when it opens via keyboard.
+      setDisableAutoFocus(false);
+      // If openByClick is true, then the popover was already opened via click and we always want to close it.
+      citationInternalState.openByKeyboard = citationInternalState.openByClick ? false : !citationInternalState.openByKeyboard;
+      citationInternalState.openByClick = false;
+      citationInternalState.openByHoverOverCitation = false;
+      citationInternalState.openByHoverOverPopover = false;
+      setIsPopoverOpen(isOpen());
+    }
+  };
+  const handlePopoverTargetEnter = e => {
+    citationInternalState.openByHoverOverPopover = true;
+    setIsPopoverOpen(isOpen());
+  };
+  const handlePopoverTargetLeave = e => {
+    citationInternalState.openByHoverOverPopover = false;
+    setTimeout(() => {
+      setIsPopoverOpen(isOpen());
+    }, getDelay(e.type));
+  };
+  const onPopoverOpenChange = (e, data) => {
+    if (!data.open) {
+      // We set all open state to false if preventDefaultClose was not set to true
+      if (!preventDefaultClose.current) {
+        clearTimeout();
+        citationInternalState.openByClick = false;
+        citationInternalState.openByHoverOverCitation = false;
+        citationInternalState.openByHoverOverPopover = false;
+        citationInternalState.openByKeyboard = false;
+        // use isOpen if managing owned popover, otherwise use data.open
+        const open = popover ? isOpen() : data.open;
+        setIsPopoverOpen(open);
+      }
+    }
+    preventDefaultClose.current = false;
+  };
+  // hitting escape should close the popover if it was opened by hover
+  // this is necessary to attach to the document because focus is likely not within the citation or popover
+  useIsomorphicLayoutEffect(() => {
+    if (isPopoverOpen) {
+      const onDocumentKeyDown = e => {
+        const openedByHover = !citationInternalState.openByClick && !citationInternalState.openByKeyboard;
+        if (openedByHover && e.key === Escape) {
+          clearTimeout();
+          // We set state back to its default if the Escape key has been pressed
+          setDisableAutoFocus(true);
+          citationInternalState.openByClick = false;
+          citationInternalState.openByHoverOverCitation = false;
+          citationInternalState.openByHoverOverPopover = false;
+          citationInternalState.openByKeyboard = false;
+          setIsPopoverOpen(isOpen());
+          e.stopPropagation();
+        }
+      };
+      targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.addEventListener('keydown', onDocumentKeyDown, {
+        capture: true
+      });
+      return () => {
+        targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.removeEventListener('keydown', onDocumentKeyDown, {
+          capture: true
+        });
+      };
+    }
+  }, [targetDocument, isPopoverOpen]);
+  const isPopoverLocked = usePreviewContext_unstable(ctx => ctx.isPreviewLocked) && props['aria-expanded'] || citationInternalState.openByClick || citationInternalState.openByKeyboard;
+  const state = {
+    block,
+    disableAutoFocus,
+    isPopoverOpen,
+    isPopoverLocked,
+    onPopoverOpenChange,
+    components: {
+      root: 'a',
+      popover: 'div',
+      popoverSurface: PopoverSurface
+    },
+    root: slot.always(getNativeElementProps('a', {
+      ref,
+      href: referenceHref,
+      role: null,
+      'aria-expanded': null,
+      ...otherProps
+    }), {
+      elementType: 'a'
+    }),
+    popover: slot.optional(popover, {
+      elementType: 'div'
+    }),
+    popoverSurface: slot.optional(popoverSurface, {
+      defaultProps: {
+        id: popoverId,
+        'aria-labelledby': popoverId
+      },
+      elementType: PopoverSurface,
+      renderByDefault: true
+    })
+  };
+  // attach popover handling events only if a popover is present
+  if (state.popover) {
+    state.root.onMouseEnter = mergeCallbacks(state.root.onMouseEnter, handleCitationTargetEnter);
+    state.root.onMouseLeave = mergeCallbacks(state.root.onMouseLeave, handleCitationTargetLeave);
+    state.root.onBlur = mergeCallbacks(state.root.onBlur, handleCitationTargetLeave);
+    state.root.onClick = mergeCallbacks(state.root.onClick, handleCitationClick);
+    state.root.onKeyDown = mergeCallbacks(state.root.onKeyDown, handleCitationKeyDown);
+    state.popover.onMouseEnter = mergeCallbacks(state.popover.onMouseEnter, handlePopoverTargetEnter);
+    state.popover.onMouseLeave = mergeCallbacks(state.popover.onMouseLeave, handlePopoverTargetLeave);
+    state.popover.onFocus = mergeCallbacks(state.popover.onFocus, handlePopoverTargetEnter);
+  }
+  return state;
+};
+//# sourceMappingURL=useCitation.js.map

package/lib/components/Citation/useCitation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useCitation.ts"],"sourcesContent":["import * as React from 'react';\nimport {\n  getNativeElementProps,\n  PopoverSurface,\n  mergeCallbacks,\n  slot,\n  useFluent,\n  useId,\n  useIsomorphicLayoutEffect,\n} from '@fluentui/react-components';\nimport { Enter, Escape } from '@fluentui/keyboard-keys';\nimport { useTimeout } from '@fluentui/react-utilities';\nimport type { OnOpenChangeData, OpenPopoverEvents } from '@fluentui/react-components';\nimport type { CitationProps, CitationState } from './Citation.types';\nimport { usePreviewContext_unstable } from '@fluentui-copilot/react-preview';\n\ntype CitationInternalState = {\n  openByClick: boolean;\n  openByHoverOverCitation: boolean;\n  openByHoverOverPopover: boolean;\n  openByKeyboard: boolean;\n};\n\nconst POPOVER_MOUSE_HIDE_DELAY = 500;\nconst POPOVER_KEYBOARD_HIDE_DELAY = 0;\n\nconst getDelay = (type: string): number => {\n  if (type === 'focus' || type === 'blur') {\n    return POPOVER_KEYBOARD_HIDE_DELAY;\n  }\n\n  return POPOVER_MOUSE_HIDE_DELAY;\n};\n\ntype TargetEvent<T> = React.MouseEvent<T> | React.FocusEvent<T>;\n\n/**\n * Create the state required to render Citation.\n *\n * The returned state can be modified with hooks such as useCitationStyles_unstable,\n * before being passed to renderCitation_unstable.\n *\n * @param props - props from this instance of Citation\n * @param ref - reference to root HTMLElement of Citation\n */\nexport const useCitation_unstable = (props: CitationProps, ref: React.Ref<HTMLElement>): CitationState => {\n  const { popover, popoverSurface, referenceHref, block = false, ...otherProps } = props;\n\n  const { targetDocument } = useFluent();\n  const [setTimeout, clearTimeout] = useTimeout();\n  const popoverId = useId('citation-popover-');\n\n  const [disableAutoFocus, setDisableAutoFocus] = React.useState(true);\n\n  const { current: citationInternalState } = React.useRef<CitationInternalState>({\n    openByClick: false,\n    openByHoverOverCitation: false,\n    openByHoverOverPopover: false,\n    openByKeyboard: false,\n  });\n\n  const isOpen = () => {\n    return (\n      citationInternalState.openByClick ||\n      citationInternalState.openByHoverOverCitation ||\n      citationInternalState.openByHoverOverPopover ||\n      citationInternalState.openByKeyboard\n    );\n  };\n\n  const [isPopoverOpen, setIsPopoverOpen] = React.useState(false);\n  const preventDefaultClose = React.useRef(false);\n\n  const handleCitationTargetEnter = (e: TargetEvent<HTMLSpanElement>): void => {\n    citationInternalState.openByHoverOverCitation = true;\n\n    // We want to disable auto focus only if the popover is being opened by hovering over the citation\n    if (!citationInternalState.openByClick && !citationInternalState.openByKeyboard) {\n      setDisableAutoFocus(true);\n    }\n\n    setIsPopoverOpen(isOpen());\n  };\n\n  const handleCitationTargetLeave = (e: TargetEvent<HTMLSpanElement>): void => {\n    citationInternalState.openByHoverOverCitation = false;\n    setTimeout(() => {\n      setIsPopoverOpen(isOpen());\n    }, getDelay(e.type));\n  };\n\n  const handleCitationClick = (e: TargetEvent<HTMLSpanElement>): void => {\n    // Setting preventDefaultClose so that onPopoverOpenChange does not apply its logic when click is on the citation as we want to control that behavior.\n    preventDefaultClose.current = true;\n\n    // We set disableAutoFocus to false so that interactive elements within popover can be focused when it opens via click.\n    setDisableAutoFocus(false);\n\n    // If openByKeyboard is true, then the popover was already opened via keyboard and we always want to close it.\n    citationInternalState.openByClick = citationInternalState.openByKeyboard\n      ? false\n      : !citationInternalState.openByClick;\n    citationInternalState.openByHoverOverCitation = false;\n    citationInternalState.openByHoverOverPopover = false;\n    citationInternalState.openByKeyboard = false;\n\n    setIsPopoverOpen(isOpen());\n  };\n\n  const handleCitationKeyDown = (e: React.KeyboardEvent<HTMLSpanElement>): void => {\n    if (e.key === Enter) {\n      clearTimeout();\n\n      // Setting default prevented so the enter key does not trigger a click event or onPopoverOpenChange.\n      e.preventDefault();\n\n      // We set disableAutoFocus to false so that interactive elements within popover can be focused when it opens via keyboard.\n      setDisableAutoFocus(false);\n\n      // If openByClick is true, then the popover was already opened via click and we always want to close it.\n      citationInternalState.openByKeyboard = citationInternalState.openByClick\n        ? false\n        : !citationInternalState.openByKeyboard;\n      citationInternalState.openByClick = false;\n      citationInternalState.openByHoverOverCitation = false;\n      citationInternalState.openByHoverOverPopover = false;\n\n      setIsPopoverOpen(isOpen());\n    }\n  };\n\n  const handlePopoverTargetEnter = (e: TargetEvent<HTMLDivElement>): void => {\n    citationInternalState.openByHoverOverPopover = true;\n    setIsPopoverOpen(isOpen());\n  };\n\n  const handlePopoverTargetLeave = (e: TargetEvent<HTMLDivElement>): void => {\n    citationInternalState.openByHoverOverPopover = false;\n    setTimeout(() => {\n      setIsPopoverOpen(isOpen());\n    }, getDelay(e.type));\n  };\n\n  const onPopoverOpenChange = (e: OpenPopoverEvents, data: OnOpenChangeData): void => {\n    if (!data.open) {\n      // We set all open state to false if preventDefaultClose was not set to true\n      if (!preventDefaultClose.current) {\n        clearTimeout();\n        citationInternalState.openByClick = false;\n        citationInternalState.openByHoverOverCitation = false;\n        citationInternalState.openByHoverOverPopover = false;\n        citationInternalState.openByKeyboard = false;\n\n        // use isOpen if managing owned popover, otherwise use data.open\n        const open = popover ? isOpen() : data.open;\n        setIsPopoverOpen(open);\n      }\n    }\n\n    preventDefaultClose.current = false;\n  };\n\n  // hitting escape should close the popover if it was opened by hover\n  // this is necessary to attach to the document because focus is likely not within the citation or popover\n  useIsomorphicLayoutEffect(() => {\n    if (isPopoverOpen) {\n      const onDocumentKeyDown = (e: KeyboardEvent) => {\n        const openedByHover = !citationInternalState.openByClick && !citationInternalState.openByKeyboard;\n        if (openedByHover && e.key === Escape) {\n          clearTimeout();\n\n          // We set state back to its default if the Escape key has been pressed\n          setDisableAutoFocus(true);\n          citationInternalState.openByClick = false;\n          citationInternalState.openByHoverOverCitation = false;\n          citationInternalState.openByHoverOverPopover = false;\n          citationInternalState.openByKeyboard = false;\n\n          setIsPopoverOpen(isOpen());\n\n          e.stopPropagation();\n        }\n      };\n\n      targetDocument?.addEventListener('keydown', onDocumentKeyDown, { capture: true });\n\n      return () => {\n        targetDocument?.removeEventListener('keydown', onDocumentKeyDown, { capture: true });\n      };\n    }\n  }, [targetDocument, isPopoverOpen]);\n\n  const isPopoverLocked =\n    (usePreviewContext_unstable(ctx => ctx.isPreviewLocked) && (props['aria-expanded'] as boolean)) ||\n    citationInternalState.openByClick ||\n    citationInternalState.openByKeyboard;\n\n  const state: CitationState = {\n    block,\n    disableAutoFocus,\n    isPopoverOpen,\n    isPopoverLocked,\n    onPopoverOpenChange,\n    components: {\n      root: 'a',\n      popover: 'div',\n      popoverSurface: PopoverSurface,\n    },\n    root: slot.always(\n      getNativeElementProps('a', {\n        ref,\n        href: referenceHref,\n        role: null,\n        'aria-expanded': null,\n        ...otherProps,\n      }),\n      { elementType: 'a' },\n    ),\n    popover: slot.optional(popover, { elementType: 'div' }),\n    popoverSurface: slot.optional(popoverSurface, {\n      defaultProps: {\n        id: popoverId,\n        'aria-labelledby': popoverId,\n      },\n      elementType: PopoverSurface,\n      renderByDefault: true,\n    }),\n  };\n\n  // attach popover handling events only if a popover is present\n\n  if (state.popover) {\n    state.root.onMouseEnter = mergeCallbacks(state.root.onMouseEnter, handleCitationTargetEnter);\n    state.root.onMouseLeave = mergeCallbacks(state.root.onMouseLeave, handleCitationTargetLeave);\n    state.root.onBlur = mergeCallbacks(state.root.onBlur, handleCitationTargetLeave);\n    state.root.onClick = mergeCallbacks(state.root.onClick, handleCitationClick);\n    state.root.onKeyDown = mergeCallbacks(state.root.onKeyDown, handleCitationKeyDown);\n    state.popover.onMouseEnter = mergeCallbacks(state.popover.onMouseEnter, handlePopoverTargetEnter);\n    state.popover.onMouseLeave = mergeCallbacks(state.popover.onMouseLeave, handlePopoverTargetLeave);\n    state.popover.onFocus = mergeCallbacks(state.popover.onFocus, handlePopoverTargetEnter);\n  }\n\n  return state;\n};\n"],"names":["React","getNativeElementProps","PopoverSurface","mergeCallbacks","slot","useFluent","useId","useIsomorphicLayoutEffect","Enter","Escape","useTimeout","usePreviewContext_unstable","POPOVER_MOUSE_HIDE_DELAY","POPOVER_KEYBOARD_HIDE_DELAY","getDelay","type","useCitation_unstable","props","ref","popover","popoverSurface","referenceHref","block","otherProps","targetDocument","setTimeout","clearTimeout","popoverId","disableAutoFocus","setDisableAutoFocus","useState","current","citationInternalState","useRef","openByClick","openByHoverOverCitation","openByHoverOverPopover","openByKeyboard","isOpen","isPopoverOpen","setIsPopoverOpen","preventDefaultClose","handleCitationTargetEnter","e","handleCitationTargetLeave","handleCitationClick","handleCitationKeyDown","key","preventDefault","handlePopoverTargetEnter","handlePopoverTargetLeave","onPopoverOpenChange","data","open","onDocumentKeyDown","openedByHover","stopPropagation","addEventListener","capture","removeEventListener","isPopoverLocked","ctx","isPreviewLocked","state","components","root","always","href","role","elementType","optional","defaultProps","id","renderByDefault","onMouseEnter","onMouseLeave","onBlur","onClick","onKeyDown","onFocus"],"mappings":"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"}

package/lib/components/Citation/useCitationStyles.js

@@ -0,0 +1,44 @@
+import { __resetStyles, __styles, mergeClasses, shorthands, tokens, typographyStyles } from '@fluentui/react-components';
+export const citationClassNames = {
+  root: 'fai-Citation',
+  popover: 'fai-Citation__popover',
+  popoverSurface: 'fai-Citation__popoverSurface'
+};
+const useCitationBaseClassName = __resetStyles("rad2akz", "r1hx2d32", [".rad2akz{display:inline-flex;justify-content:center;box-sizing:border-box;align-items:center;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase100);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase100);color:var(--colorNeutralForeground2);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);min-width:14px;height:14px;vertical-align:calc((var(--lineHeightBase100) - var(--fontSizeBase100)) / 2);border-radius:var(--borderRadiusMedium);text-decoration:none;margin-left:var(--spacingHorizontalXXS);margin-right:var(--spacingHorizontalXXS);}", ".rad2akz:hover{cursor:pointer;color:var(--colorBrandForeground2Hover);border-color:var(--colorBrandStroke2Hover);background-color:var(--colorBrandBackground2Hover);}", ".rad2akz:hover:active{cursor:pointer;color:var(--colorBrandForeground2Pressed);border-color:var(--colorBrandStroke2Pressed);background-color:var(--colorBrandBackground2Pressed);}", ".r1hx2d32{display:inline-flex;justify-content:center;box-sizing:border-box;align-items:center;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase100);font-weight:var(--fontWeightSemibold);line-height:var(--lineHeightBase100);color:var(--colorNeutralForeground2);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);min-width:14px;height:14px;vertical-align:calc((var(--lineHeightBase100) - var(--fontSizeBase100)) / 2);border-radius:var(--borderRadiusMedium);text-decoration:none;margin-right:var(--spacingHorizontalXXS);margin-left:var(--spacingHorizontalXXS);}", ".r1hx2d32:hover{cursor:pointer;color:var(--colorBrandForeground2Hover);border-color:var(--colorBrandStroke2Hover);background-color:var(--colorBrandBackground2Hover);}", ".r1hx2d32:hover:active{cursor:pointer;color:var(--colorBrandForeground2Pressed);border-color:var(--colorBrandStroke2Pressed);background-color:var(--colorBrandBackground2Pressed);}"]);
+const useCitationRootStyles = __styles({
+  isBlock: {
+    mc9l5x: "f22iagw",
+    Frg6f3: ["f1tyq0we", "f11qmguv"],
+    t21cq0: ["f11qmguv", "f1tyq0we"]
+  },
+  isPopoverLocked: {
+    sj55zd: "fkjhhq2",
+    g2u3we: "f1nbqb3e",
+    h3c5rm: ["fah3j9v", "f56crja"],
+    B9xav0g: "fef4ti1",
+    zhjwy3: ["f56crja", "fah3j9v"],
+    De3pzq: "f16xkysk",
+    Bi91k9c: "fbszb7v",
+    Bgoe8wy: "ftxwbyd",
+    Bwzppfd: ["f1p7dilp", "f15x2k42"],
+    oetu4i: "fegdlwn",
+    gg5e9n: ["f15x2k42", "f1p7dilp"],
+    Jwef8y: "f121v1wq"
+  }
+}, {
+  d: [".f22iagw{display:flex;}", ".f1tyq0we{margin-left:0;}", ".f11qmguv{margin-right:0;}", ".fkjhhq2{color:var(--colorBrandForeground2Pressed);}", ".f1nbqb3e{border-top-color:var(--colorBrandStroke2Pressed);}", ".fah3j9v{border-right-color:var(--colorBrandStroke2Pressed);}", ".f56crja{border-left-color:var(--colorBrandStroke2Pressed);}", ".fef4ti1{border-bottom-color:var(--colorBrandStroke2Pressed);}", ".f16xkysk{background-color:var(--colorBrandBackground2);}"],
+  h: [".fbszb7v:hover{color:var(--colorBrandForeground2Pressed);}", ".ftxwbyd:hover{border-top-color:var(--colorBrandStroke2Pressed);}", ".f1p7dilp:hover{border-right-color:var(--colorBrandStroke2Pressed);}", ".f15x2k42:hover{border-left-color:var(--colorBrandStroke2Pressed);}", ".fegdlwn:hover{border-bottom-color:var(--colorBrandStroke2Pressed);}", ".f121v1wq:hover{background-color:var(--colorBrandBackground2);}"]
+});
+/**
+ * Apply styling to the Citation slots based on the state
+ */
+export const useCitationStyles_unstable = state => {
+  const rootBaseClassName = useCitationBaseClassName();
+  const rootStyles = useCitationRootStyles();
+  state.root.className = mergeClasses(citationClassNames.root, state.isPopoverLocked && rootStyles.isPopoverLocked, state.block && rootStyles.isBlock, rootBaseClassName, state.root.className);
+  if (state.popover) {
+    state.popover.className = mergeClasses(citationClassNames.popover, state.popover.className);
+  }
+  return state;
+};
+//# sourceMappingURL=useCitationStyles.js.map

package/lib/components/Citation/useCitationStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useCitationStyles.ts"],"sourcesContent":["import {\n  makeResetStyles,\n  makeStyles,\n  mergeClasses,\n  shorthands,\n  tokens,\n  typographyStyles,\n} from '@fluentui/react-components';\nimport type { CitationSlots, CitationState } from './Citation.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const citationClassNames: SlotClassNames<CitationSlots> = {\n  root: 'fai-Citation',\n  popover: 'fai-Citation__popover',\n  popoverSurface: 'fai-Citation__popoverSurface',\n};\n\nconst useCitationBaseClassName = makeResetStyles({\n  display: 'inline-flex',\n  justifyContent: 'center',\n  boxSizing: 'border-box',\n  alignItems: 'center',\n  ...typographyStyles.caption2Strong,\n\n  color: tokens.colorNeutralForeground2,\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke2}`,\n\n  minWidth: '14px',\n  height: '14px',\n  verticalAlign: `calc((${typographyStyles.caption2Strong.lineHeight} - ${typographyStyles.caption2Strong.fontSize}) / 2)`,\n\n  borderRadius: tokens.borderRadiusMedium,\n\n  textDecoration: 'none',\n\n  marginLeft: tokens.spacingHorizontalXXS,\n  marginRight: tokens.spacingHorizontalXXS,\n\n  ':hover': {\n    cursor: 'pointer',\n    color: tokens.colorBrandForeground2Hover,\n    borderColor: tokens.colorBrandStroke2Hover,\n    backgroundColor: tokens.colorBrandBackground2Hover,\n  },\n\n  ':hover:active': {\n    cursor: 'pointer',\n    color: tokens.colorBrandForeground2Pressed,\n    borderColor: tokens.colorBrandStroke2Pressed,\n    backgroundColor: tokens.colorBrandBackground2Pressed,\n  },\n});\n\nconst useCitationRootStyles = makeStyles({\n  isBlock: {\n    display: 'flex',\n    marginLeft: 0,\n    marginRight: 0,\n  },\n  isPopoverLocked: {\n    color: tokens.colorBrandForeground2Pressed,\n    ...shorthands.borderColor(tokens.colorBrandStroke2Pressed),\n    backgroundColor: tokens.colorBrandBackground2,\n    ':hover': {\n      color: tokens.colorBrandForeground2Pressed,\n      ...shorthands.borderColor(tokens.colorBrandStroke2Pressed),\n      backgroundColor: tokens.colorBrandBackground2,\n    },\n  },\n});\n\n/**\n * Apply styling to the Citation slots based on the state\n */\nexport const useCitationStyles_unstable = (state: CitationState): CitationState => {\n  const rootBaseClassName = useCitationBaseClassName();\n  const rootStyles = useCitationRootStyles();\n  state.root.className = mergeClasses(\n    citationClassNames.root,\n    state.isPopoverLocked && rootStyles.isPopoverLocked,\n    state.block && rootStyles.isBlock,\n    rootBaseClassName,\n    state.root.className,\n  );\n  if (state.popover) {\n    state.popover.className = mergeClasses(citationClassNames.popover, state.popover.className);\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","makeStyles","mergeClasses","shorthands","tokens","typographyStyles","citationClassNames","root","popover","popoverSurface","useCitationBaseClassName","display","justifyContent","boxSizing","alignItems","caption2Strong","color","colorNeutralForeground2","border","strokeWidthThin","colorNeutralStroke2","minWidth","height","verticalAlign","lineHeight","fontSize","borderRadius","borderRadiusMedium","textDecoration","marginLeft","spacingHorizontalXXS","marginRight","cursor","colorBrandForeground2Hover","borderColor","colorBrandStroke2Hover","backgroundColor","colorBrandBackground2Hover","colorBrandForeground2Pressed","colorBrandStroke2Pressed","colorBrandBackground2Pressed","useCitationRootStyles","isBlock","isPopoverLocked","colorBrandBackground2","useCitationStyles_unstable","state","rootBaseClassName","rootStyles","className","block"],"mappings":"AAAA,SACEA,eAAe,EACfC,UAAU,EACVC,YAAY,EACZC,UAAU,EACVC,MAAM,EACNC,gBAAgB,QACX,6BAA6B;AAIpC,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;IACNC,SAAS;IACTC,gBAAgB;AAClB,EAAE;AAEF,MAAMC,2BAA2BV,gBAAgB;IAC/CW,SAAS;IACTC,gBAAgB;IAChBC,WAAW;IACXC,YAAY;IACZ,GAAGT,iBAAiBU,cAAc;IAElCC,OAAOZ,OAAOa,uBAAuB;IACrCC,QAAQ,CAAC,EAAEd,OAAOe,eAAe,CAAC,OAAO,EAAEf,OAAOgB,mBAAmB,CAAC,CAAC;IAEvEC,UAAU;IACVC,QAAQ;IACRC,eAAe,CAAC,MAAM,EAAElB,iBAAiBU,cAAc,CAACS,UAAU,CAAC,GAAG,EAAEnB,iBAAiBU,cAAc,CAACU,QAAQ,CAAC,MAAM,CAAC;IAExHC,cAActB,OAAOuB,kBAAkB;IAEvCC,gBAAgB;IAEhBC,YAAYzB,OAAO0B,oBAAoB;IACvCC,aAAa3B,OAAO0B,oBAAoB;IAExC,UAAU;QACRE,QAAQ;QACRhB,OAAOZ,OAAO6B,0BAA0B;QACxCC,aAAa9B,OAAO+B,sBAAsB;QAC1CC,iBAAiBhC,OAAOiC,0BAA0B;IACpD;IAEA,iBAAiB;QACfL,QAAQ;QACRhB,OAAOZ,OAAOkC,4BAA4B;QAC1CJ,aAAa9B,OAAOmC,wBAAwB;QAC5CH,iBAAiBhC,OAAOoC,4BAA4B;IACtD;AACF;AAEA,MAAMC,wBAAwBxC,WAAW;IACvCyC,SAAS;QACP/B,SAAS;QACTkB,YAAY;QACZE,aAAa;IACf;IACAY,iBAAiB;QACf3B,OAAOZ,OAAOkC,4BAA4B;QAC1C,GAAGnC,WAAW+B,WAAW,CAAC9B,OAAOmC,wBAAwB,CAAC;QAC1DH,iBAAiBhC,OAAOwC,qBAAqB;QAC7C,UAAU;YACR5B,OAAOZ,OAAOkC,4BAA4B;YAC1C,GAAGnC,WAAW+B,WAAW,CAAC9B,OAAOmC,wBAAwB,CAAC;YAC1DH,iBAAiBhC,OAAOwC,qBAAqB;QAC/C;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC,MAAMC,oBAAoBrC;IAC1B,MAAMsC,aAAaP;IACnBK,MAAMvC,IAAI,CAAC0C,SAAS,GAAG/C,aACrBI,mBAAmBC,IAAI,EACvBuC,MAAMH,eAAe,IAAIK,WAAWL,eAAe,EACnDG,MAAMI,KAAK,IAAIF,WAAWN,OAAO,EACjCK,mBACAD,MAAMvC,IAAI,CAAC0C,SAAS;IAEtB,IAAIH,MAAMtC,OAAO,EAAE;QACjBsC,MAAMtC,OAAO,CAACyC,SAAS,GAAG/C,aAAaI,mBAAmBE,OAAO,EAAEsC,MAAMtC,OAAO,CAACyC,SAAS;IAC5F;IAEA,OAAOH;AACT,EAAE"}

package/lib/components/Reference/Reference.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { useReference_unstable } from './useReference';
+import { renderReference_unstable } from './renderReference';
+import { useReferenceStyles_unstable } from './useReferenceStyles';
+import { useCustomStyleHook } from '@fluentui-copilot/react-provider';
+// Reference component - TODO: add more docs
+export const Reference = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useReference_unstable(props, ref);
+  useReferenceStyles_unstable(state);
+  useCustomStyleHook('useReferenceStyles')(state);
+  return renderReference_unstable(state);
+});
+Reference.displayName = 'Reference';
+//# sourceMappingURL=Reference.js.map

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

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

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

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

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

@@ -0,0 +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   * @deprecated Use `sensitivity` instead.\n   * Sensitivity label slot. Displays a label indicating how sensitive the information displayed in the reference is.\n   */\n  sensitivityLabel: 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    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":[],"mappings":"AAAA,WAiHI"}

package/lib/components/Reference/index.js

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

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

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

package/lib/components/Reference/renderReference.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-components';
+/**
+ * Render the final JSX of Reference
+ */
+export const renderReference_unstable = state => {
+  assertSlots(state);
+  return /*#__PURE__*/_jsxs(state.root, {
+    children: [state.citation && /*#__PURE__*/_jsx(state.citation, {}), state.media && /*#__PURE__*/_jsx(state.media, {}), /*#__PURE__*/_jsx(state.label, {}), state.actions && /*#__PURE__*/_jsxs(state.actions, {
+      children: [state.actions.children, state.detailsButton && /*#__PURE__*/_jsx(state.detailsButton, {})]
+    }), state.sensitivityLabel && /*#__PURE__*/_jsx(state.sensitivityLabel, {}), state.sensitivity && /*#__PURE__*/_jsx(state.sensitivity, {}), /*#__PURE__*/_jsxs(state.metadata, {
+      children: [state.primaryText && /*#__PURE__*/_jsx(state.primaryText, {}), state.secondaryText && /*#__PURE__*/_jsx(state.secondaryText, {}), state.tertiaryText && /*#__PURE__*/_jsx(state.tertiaryText, {}), state.icon && /*#__PURE__*/_jsx(state.icon, {}), state.metadata.children]
+    }), /*#__PURE__*/_jsx(state.content, {})]
+  });
+};
+//# sourceMappingURL=renderReference.js.map

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

@@ -0,0 +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.sensitivityLabel && <state.sensitivityLabel />}\n      {state.sensitivity && <state.sensitivity />}\n      <state.metadata>\n        {state.primaryText && <state.primaryText />}\n        {state.secondaryText && <state.secondaryText />}\n        {state.tertiaryText && <state.tertiaryText />}\n        {state.icon && <state.icon />}\n        {state.metadata.children}\n      </state.metadata>\n      <state.content />\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderReference_unstable","state","root","citation","media","label","actions","children","detailsButton","sensitivityLabel","sensitivity","metadata","primaryText","secondaryText","tertiaryText","icon","content"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAIzD;;CAEC,GACD,OAAO,MAAMC,2BAA2B,CAACC;IACvCF,YAA4BE;IAE5B,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAME,QAAQ,kBAAI,KAACF,MAAME,QAAQ;YACjCF,MAAMG,KAAK,kBAAI,KAACH,MAAMG,KAAK;0BAC5B,KAACH,MAAMI,KAAK;YACXJ,MAAMK,OAAO,kBACZ,MAACL,MAAMK,OAAO;;oBACXL,MAAMK,OAAO,CAACC,QAAQ;oBACtBN,MAAMO,aAAa,kBAAI,KAACP,MAAMO,aAAa;;;YAG/CP,MAAMQ,gBAAgB,kBAAI,KAACR,MAAMQ,gBAAgB;YACjDR,MAAMS,WAAW,kBAAI,KAACT,MAAMS,WAAW;0BACxC,MAACT,MAAMU,QAAQ;;oBACZV,MAAMW,WAAW,kBAAI,KAACX,MAAMW,WAAW;oBACvCX,MAAMY,aAAa,kBAAI,KAACZ,MAAMY,aAAa;oBAC3CZ,MAAMa,YAAY,kBAAI,KAACb,MAAMa,YAAY;oBACzCb,MAAMc,IAAI,kBAAI,KAACd,MAAMc,IAAI;oBACzBd,MAAMU,QAAQ,CAACJ,QAAQ;;;0BAE1B,KAACN,MAAMe,OAAO;;;AAGpB,EAAE"}

package/lib/components/Reference/useReference.js

@@ -0,0 +1,197 @@
+import * as React from 'react';
+import { Button, Caption1, getNativeElementProps, mergeCallbacks, mergeClasses, slot, useId, usePopoverContext_unstable as usePopoverContext } from '@fluentui/react-components';
+import { ChevronDown24Regular, ChevronUp24Regular, ChevronDown16Regular, ChevronUp16Regular } from '@fluentui/react-icons';
+import { referenceExtraClassNames } from './useReferenceStyles';
+import { Citation } from '../Citation';
+import { useReferenceGroupSetOpen } from '../../context/ReferenceGroupContext';
+import { useCopilotMode } from '@fluentui-copilot/react-provider';
+/**
+ * Create the state required to render Reference.
+ *
+ * The returned state can be modified with hooks such as useReferenceStyles_unstable,
+ * before being passed to renderReference_unstable.
+ *
+ * @param props - props from this instance of Reference
+ * @param ref - reference to root HTMLElement of Reference
+ */
+export const useReference_unstable = (props, ref) => {
+  const {
+    index,
+    referenceId,
+    citationHref,
+    excerpt,
+    layout = 'inline'
+  } = props;
+  const mode = useCopilotMode(props.mode);
+  const labelId = useId();
+  const mediaId = useId();
+  const [isExpanded, setIsExpanded] = React.useState(layout === 'popover' ? true : false);
+  const setPopoverOpen = usePopoverContext(context => context.setOpen);
+  const onExpandClick = _e => {
+    setIsExpanded(!isExpanded);
+  };
+  const label = slot.always(props.label, {
+    defaultProps: {
+      id: labelId
+    },
+    elementType: 'div'
+  });
+  const media = slot.optional(props.media, {
+    defaultProps: {
+      id: mediaId
+    },
+    elementType: 'div'
+  });
+  if (media && /*#__PURE__*/React.isValidElement(media.children)) {
+    media.children = /*#__PURE__*/React.cloneElement(media.children, {
+      className: mergeClasses(media.children.props.className, referenceExtraClassNames.mediaChild)
+    });
+  }
+  if (media === null || media === void 0 ? void 0 : media.id) {
+    var _label_ariadescribedby;
+    var _label_ariadescribedby_concat;
+    label['aria-describedby'] = (_label_ariadescribedby_concat = (_label_ariadescribedby = label['aria-describedby']) === null || _label_ariadescribedby === void 0 ? void 0 : _label_ariadescribedby.concat(media.id)) !== null && _label_ariadescribedby_concat !== void 0 ? _label_ariadescribedby_concat : media.id;
+  }
+  const ariaLabelledByProp = props['aria-labelledby'];
+  const groupSemantics = React.useMemo(() => {
+    return layout === 'inline' ? {
+      role: 'group',
+      'aria-labelledby': `${ariaLabelledByProp !== null && ariaLabelledByProp !== void 0 ? ariaLabelledByProp : ''} ${label.id}`,
+      tabIndex: -1
+    } : {};
+  }, [layout, ariaLabelledByProp, label.id]);
+  // Within a popup, a citation should function as a close button
+  const citationProps = React.useMemo(() => {
+    const onPopoverCloseClick = e => {
+      setPopoverOpen(e, false);
+      // don't navigate
+      e.preventDefault();
+    };
+    return layout === 'popover' ? {
+      referenceHref: '#',
+      tabIndex: -1,
+      'aria-label': `Reference ${index}, close`,
+      onClick: onPopoverCloseClick
+    } : {
+      referenceHref: citationHref
+    };
+  }, [layout, citationHref, index, setPopoverOpen]);
+  const state = {
+    isExpanded,
+    mode: layout === 'popover' ? 'sidecar' : mode,
+    layout,
+    index,
+    components: {
+      root: 'div',
+      citation: 'div',
+      media: 'div',
+      actions: 'div',
+      label: 'div',
+      sensitivity: 'span',
+      sensitivityLabel: 'span',
+      metadata: 'div',
+      content: 'div',
+      primaryText: 'span',
+      secondaryText: 'span',
+      tertiaryText: 'span',
+      icon: 'span',
+      detailsButton: Button
+    },
+    root: slot.always(getNativeElementProps('div', {
+      ref,
+      id: referenceId,
+      ...groupSemantics,
+      ...props
+    }), {
+      elementType: 'div'
+    }),
+    citation: slot.optional(props.citation, {
+      defaultProps: {
+        children: /*#__PURE__*/React.createElement(Citation, {
+          block: true,
+          referenceId: referenceId,
+          ...citationProps
+        }, index)
+      },
+      renderByDefault: true,
+      elementType: 'div'
+    }),
+    media,
+    actions: slot.optional(layout === 'inline' ? props.actions : null, {
+      renderByDefault: true,
+      elementType: 'div'
+    }),
+    label,
+    sensitivity: slot.optional(props.sensitivity, {
+      elementType: 'span'
+    }),
+    sensitivityLabel: slot.optional(props.sensitivityLabel, {
+      elementType: 'span'
+    }),
+    metadata: slot.always(props.metadata, {
+      elementType: 'div'
+    }),
+    primaryText: slot.optional(props.primaryText, {
+      defaultProps: {
+        hidden: !isExpanded
+      },
+      elementType: 'span'
+    }),
+    secondaryText: slot.optional(props.secondaryText, {
+      defaultProps: {
+        hidden: !isExpanded
+      },
+      elementType: 'span'
+    }),
+    tertiaryText: slot.optional(props.tertiaryText, {
+      defaultProps: {
+        hidden: !isExpanded
+      },
+      elementType: 'span'
+    }),
+    icon: slot.optional(props.icon, {
+      elementType: 'span'
+    }),
+    content: slot.always(props.content, {
+      defaultProps: {
+        children: excerpt && /*#__PURE__*/React.createElement(Caption1, null, excerpt)
+      },
+      elementType: 'div'
+    }),
+    detailsButton: slot.optional(layout === 'inline' ? props.detailsButton : null, {
+      defaultProps: {
+        appearance: 'transparent',
+        'aria-expanded': isExpanded,
+        'aria-label': 'show details',
+        size: mode === 'sidecar' ? 'small' : 'medium',
+        icon: {
+          children: getIcon(isExpanded, mode)
+        }
+      },
+      renderByDefault: true,
+      elementType: Button
+    })
+  };
+  if (state.detailsButton) {
+    const onClick = state.detailsButton.onClick;
+    state.detailsButton.onClick = mergeCallbacks(onClick, onExpandClick);
+  }
+  const referenceGroupSetOpen = useReferenceGroupSetOpen();
+  const onTargettedByCitation = e => {
+    var _e_relatedTarget;
+    const relatedTargetHash = (_e_relatedTarget = e.relatedTarget) === null || _e_relatedTarget === void 0 ? void 0 : _e_relatedTarget.hash;
+    if (relatedTargetHash && relatedTargetHash.substring(1) === referenceId) {
+      referenceGroupSetOpen();
+      setIsExpanded(true);
+    }
+  };
+  state.root.onFocus = mergeCallbacks(state.root.onFocus, onTargettedByCitation);
+  return state;
+};
+const getIcon = (isExpanded, mode) => {
+  if (mode === 'sidecar') {
+    return !isExpanded ? /*#__PURE__*/React.createElement(ChevronDown16Regular, null) : /*#__PURE__*/React.createElement(ChevronUp16Regular, null);
+  }
+  return !isExpanded ? /*#__PURE__*/React.createElement(ChevronDown24Regular, null) : /*#__PURE__*/React.createElement(ChevronUp24Regular, null);
+};
+//# sourceMappingURL=useReference.js.map

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

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