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

package/lib/components/ReferenceGroupToggle/renderReferenceGroupToggle.js

@@ -0,0 +1,12 @@
+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 ReferenceGroupToggle
+ */
+export const renderReferenceGroupToggle_unstable = state => {
+  assertSlots(state);
+  return /*#__PURE__*/_jsxs(state.root, {
+    children: [state.root.children, state.icon && /*#__PURE__*/_jsx(state.icon, {})]
+  });
+};
+//# sourceMappingURL=renderReferenceGroupToggle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["renderReferenceGroupToggle.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-components';\nimport type { ReferenceGroupToggleState, ReferenceGroupToggleSlots } from './ReferenceGroupToggle.types';\n\n/**\n * Render the final JSX of ReferenceGroupToggle\n */\nexport const renderReferenceGroupToggle_unstable = (state: ReferenceGroupToggleState) => {\n  assertSlots<ReferenceGroupToggleSlots>(state);\n\n  return (\n    <state.root>\n      {state.root.children}\n      {state.icon && <state.icon />}\n    </state.root>\n  );\n};\n"],"names":["assertSlots","renderReferenceGroupToggle_unstable","state","root","children","icon"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,6BAA6B;AAGzD;;CAEC,GACD,OAAO,MAAMC,sCAAsC,CAACC;IAClDF,YAAuCE;IAEvC,qBACE,MAACA,MAAMC,IAAI;;YACRD,MAAMC,IAAI,CAACC,QAAQ;YACnBF,MAAMG,IAAI,kBAAI,KAACH,MAAMG,IAAI;;;AAGhC,EAAE"}

package/lib/components/ReferenceGroupToggle/useReferenceGroupToggle.js

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { getIntrinsicElementProps, slot } from '@fluentui/react-components';
+import { ChevronDown16Regular, ChevronUp16Regular } from '@fluentui/react-icons';
+/**
+ * Create the state required to render ReferenceGroupToggle.
+ *
+ * The returned state can be modified with hooks such as useReferenceGroupToggleStyles_unstable,
+ * before being passed to renderReferenceGroupToggle_unstable.
+ *
+ * @param props - props from this instance of ReferenceGroupToggle
+ * @param ref - reference to root HTMLElement of ReferenceGroupToggle
+ */
+export const useReferenceGroupToggle_unstable = (props, ref) => {
+  const {
+    isOpen = false
+  } = props;
+  return {
+    isOpen,
+    components: {
+      root: 'button',
+      icon: 'span'
+    },
+    root: slot.always(getIntrinsicElementProps('button', {
+      ref,
+      'aria-expanded': isOpen,
+      type: 'button',
+      ...props
+    }), {
+      elementType: 'button'
+    }),
+    icon: slot.optional(props.icon, {
+      defaultProps: {
+        children: isOpen ? /*#__PURE__*/React.createElement(ChevronUp16Regular, null) : /*#__PURE__*/React.createElement(ChevronDown16Regular, null)
+      },
+      renderByDefault: true,
+      elementType: 'span'
+    })
+  };
+};
+//# sourceMappingURL=useReferenceGroupToggle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["useReferenceGroupToggle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-components';\nimport { ChevronDown16Regular, ChevronUp16Regular } from '@fluentui/react-icons';\nimport type { ReferenceGroupToggleProps, ReferenceGroupToggleState } from './ReferenceGroupToggle.types';\n\n/**\n * Create the state required to render ReferenceGroupToggle.\n *\n * The returned state can be modified with hooks such as useReferenceGroupToggleStyles_unstable,\n * before being passed to renderReferenceGroupToggle_unstable.\n *\n * @param props - props from this instance of ReferenceGroupToggle\n * @param ref - reference to root HTMLElement of ReferenceGroupToggle\n */\nexport const useReferenceGroupToggle_unstable = (\n  props: ReferenceGroupToggleProps,\n  ref: React.Ref<HTMLButtonElement>,\n): ReferenceGroupToggleState => {\n  const { isOpen = false } = props;\n\n  return {\n    isOpen,\n    components: {\n      root: 'button',\n      icon: 'span',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('button', {\n        ref,\n        'aria-expanded': isOpen,\n        type: 'button',\n        ...props,\n      }),\n      { elementType: 'button' },\n    ),\n    icon: slot.optional(props.icon, {\n      defaultProps: {\n        children: isOpen ? <ChevronUp16Regular /> : <ChevronDown16Regular />,\n      },\n      renderByDefault: true,\n      elementType: 'span',\n    }),\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","ChevronDown16Regular","ChevronUp16Regular","useReferenceGroupToggle_unstable","props","ref","isOpen","components","root","icon","always","type","elementType","optional","defaultProps","children","renderByDefault"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,6BAA6B;AAC5E,SAASC,oBAAoB,EAAEC,kBAAkB,QAAQ,wBAAwB;AAGjF;;;;;;;;CAQC,GACD,OAAO,MAAMC,mCAAmC,CAC9CC,OACAC;IAEA,MAAM,EAAEC,SAAS,KAAK,EAAE,GAAGF;IAE3B,OAAO;QACLE;QACAC,YAAY;YACVC,MAAM;YACNC,MAAM;QACR;QACAD,MAAMR,KAAKU,MAAM,CACfX,yBAAyB,UAAU;YACjCM;YACA,iBAAiBC;YACjBK,MAAM;YACN,GAAGP,KAAK;QACV,IACA;YAAEQ,aAAa;QAAS;QAE1BH,MAAMT,KAAKa,QAAQ,CAACT,MAAMK,IAAI,EAAE;YAC9BK,cAAc;gBACZC,UAAUT,uBAAS,oBAACJ,0CAAwB,oBAACD;YAC/C;YACAe,iBAAiB;YACjBJ,aAAa;QACf;IACF;AACF,EAAE"}

package/lib/components/ReferenceGroupToggle/useReferenceGroupToggleStyles.js

@@ -0,0 +1,20 @@
+import { __resetStyles, mergeClasses, shorthands, tokens, typographyStyles } from '@fluentui/react-components';
+export const referenceGroupToggleClassNames = {
+  root: 'fai-ReferenceGroupToggle',
+  icon: 'fai-ReferenceGroupToggle__icon'
+};
+const useButtonBaseClassName = __resetStyles("rctdkan", "rfdmif3", [".rctdkan{display:inline-flex;column-gap:var(--spacingHorizontalSNudge);align-items:center;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);border:0;background-color:var(--colorTransparentBackground);color:var(--colorNeutralForeground3);cursor:pointer;width:max-content;padding-top:var(--spacingVerticalXS);padding-right:0;padding-bottom:var(--spacingVerticalXS);padding-left:0;}", ".rfdmif3{display:inline-flex;column-gap:var(--spacingHorizontalSNudge);align-items:center;font-family:var(--fontFamilyBase);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightRegular);line-height:var(--lineHeightBase200);border:0;background-color:var(--colorTransparentBackground);color:var(--colorNeutralForeground3);cursor:pointer;width:max-content;padding-top:var(--spacingVerticalXS);padding-left:0;padding-bottom:var(--spacingVerticalXS);padding-right:0;}"]);
+const useIconBaseClassName = __resetStyles("r18biwo", null, [".r18biwo{display:inline-flex;align-items:center;}"]);
+/**
+ * Apply styling to the ReferenceGroupToggle slots based on the state
+ */
+export const useReferenceGroupToggleStyles_unstable = state => {
+  const iconBaseClassName = useIconBaseClassName();
+  const buttonBaseClassName = useButtonBaseClassName();
+  state.root.className = mergeClasses(referenceGroupToggleClassNames.root, buttonBaseClassName, state.root.className);
+  if (state.icon) {
+    state.icon.className = mergeClasses(referenceGroupToggleClassNames.icon, iconBaseClassName, state.icon.className);
+  }
+  return state;
+};
+//# sourceMappingURL=useReferenceGroupToggleStyles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["useReferenceGroupToggleStyles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, shorthands, tokens, typographyStyles } from '@fluentui/react-components';\nimport type { ReferenceGroupToggleSlots, ReferenceGroupToggleState } from './ReferenceGroupToggle.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const referenceGroupToggleClassNames: SlotClassNames<ReferenceGroupToggleSlots> = {\n  root: 'fai-ReferenceGroupToggle',\n  icon: 'fai-ReferenceGroupToggle__icon',\n};\n\nconst useButtonBaseClassName = makeResetStyles({\n  display: 'inline-flex',\n  columnGap: tokens.spacingHorizontalSNudge,\n  alignItems: 'center',\n  ...typographyStyles.caption1,\n  border: 0,\n  backgroundColor: tokens.colorTransparentBackground,\n  color: tokens.colorNeutralForeground3,\n  cursor: 'pointer',\n  width: 'max-content',\n  ...shorthands.padding(tokens.spacingVerticalXS, 0),\n});\n\nconst useIconBaseClassName = makeResetStyles({\n  display: 'inline-flex',\n  alignItems: 'center',\n});\n\n/**\n * Apply styling to the ReferenceGroupToggle slots based on the state\n */\nexport const useReferenceGroupToggleStyles_unstable = (state: ReferenceGroupToggleState): ReferenceGroupToggleState => {\n  const iconBaseClassName = useIconBaseClassName();\n  const buttonBaseClassName = useButtonBaseClassName();\n  state.root.className = mergeClasses(referenceGroupToggleClassNames.root, buttonBaseClassName, state.root.className);\n\n  if (state.icon) {\n    state.icon.className = mergeClasses(referenceGroupToggleClassNames.icon, iconBaseClassName, state.icon.className);\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","mergeClasses","shorthands","tokens","typographyStyles","referenceGroupToggleClassNames","root","icon","useButtonBaseClassName","display","columnGap","spacingHorizontalSNudge","alignItems","caption1","border","backgroundColor","colorTransparentBackground","color","colorNeutralForeground3","cursor","width","padding","spacingVerticalXS","useIconBaseClassName","useReferenceGroupToggleStyles_unstable","state","iconBaseClassName","buttonBaseClassName","className"],"mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,EAAEC,UAAU,EAAEC,MAAM,EAAEC,gBAAgB,QAAQ,6BAA6B;AAIjH,OAAO,MAAMC,iCAA4E;IACvFC,MAAM;IACNC,MAAM;AACR,EAAE;AAEF,MAAMC,yBAAyBR,gBAAgB;IAC7CS,SAAS;IACTC,WAAWP,OAAOQ,uBAAuB;IACzCC,YAAY;IACZ,GAAGR,iBAAiBS,QAAQ;IAC5BC,QAAQ;IACRC,iBAAiBZ,OAAOa,0BAA0B;IAClDC,OAAOd,OAAOe,uBAAuB;IACrCC,QAAQ;IACRC,OAAO;IACP,GAAGlB,WAAWmB,OAAO,CAAClB,OAAOmB,iBAAiB,EAAE,EAAE;AACpD;AAEA,MAAMC,uBAAuBvB,gBAAgB;IAC3CS,SAAS;IACTG,YAAY;AACd;AAEA;;CAEC,GACD,OAAO,MAAMY,yCAAyC,CAACC;IACrD,MAAMC,oBAAoBH;IAC1B,MAAMI,sBAAsBnB;IAC5BiB,MAAMnB,IAAI,CAACsB,SAAS,GAAG3B,aAAaI,+BAA+BC,IAAI,EAAEqB,qBAAqBF,MAAMnB,IAAI,CAACsB,SAAS;IAElH,IAAIH,MAAMlB,IAAI,EAAE;QACdkB,MAAMlB,IAAI,CAACqB,SAAS,GAAG3B,aAAaI,+BAA+BE,IAAI,EAAEmB,mBAAmBD,MAAMlB,IAAI,CAACqB,SAAS;IAClH;IAEA,OAAOH;AACT,EAAE"}

package/lib/components/ReferenceList/ReferenceList.js

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import { useReferenceList_unstable } from './useReferenceList';
+import { renderReferenceList_unstable } from './renderReferenceList';
+import { useReferenceListStyles_unstable } from './useReferenceListStyles';
+import { useCustomStyleHook } from '@fluentui-copilot/react-provider';
+//ReferenceList component - TODO: add more docs
+export const ReferenceList = /*#__PURE__*/React.forwardRef((props, ref) => {
+  const state = useReferenceList_unstable(props, ref);
+  useReferenceListStyles_unstable(state);
+  useCustomStyleHook('useReferenceListStyles')(state);
+  return renderReferenceList_unstable(state);
+});
+ReferenceList.displayName = 'ReferenceList';
+//# sourceMappingURL=ReferenceList.js.map

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

@@ -0,0 +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';\nimport type { ReferenceListProps } from './ReferenceList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n//ReferenceList component - TODO: add more docs\nexport const ReferenceList: ForwardRefComponent<ReferenceListProps> = React.forwardRef((props, ref) => {\n  const state = useReferenceList_unstable(props, ref);\n\n  useReferenceListStyles_unstable(state);\n  useCustomStyleHook('useReferenceListStyles')(state);\n\n  return renderReferenceList_unstable(state);\n});\n\nReferenceList.displayName = 'ReferenceList';\n"],"names":["React","useReferenceList_unstable","renderReferenceList_unstable","useReferenceListStyles_unstable","useCustomStyleHook","ReferenceList","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,2BAA2B;AAG3E,SAASC,kBAAkB,QAAQ,mCAAmC;AAEtE,+CAA+C;AAC/C,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,0BAA0BM,OAAOC;IAE/CL,gCAAgCM;IAChCL,mBAAmB,0BAA0BK;IAE7C,OAAOP,6BAA6BO;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}

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

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

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

@@ -0,0 +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":[],"mappings":"AAAA,WAiBoE"}

package/lib/components/ReferenceList/index.js

@@ -0,0 +1,6 @@
+export * from './ReferenceList';
+export * from './ReferenceList.types';
+export * from './renderReferenceList';
+export * from './useReferenceList';
+export * from './useReferenceListStyles';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './ReferenceList';\nexport * from './ReferenceList.types';\nexport * from './renderReferenceList';\nexport * from './useReferenceList';\nexport * from './useReferenceListStyles';\n"],"names":[],"mappings":"AAAA,cAAc,kBAAkB;AAChC,cAAc,wBAAwB;AACtC,cAAc,wBAAwB;AACtC,cAAc,qBAAqB;AACnC,cAAc,2BAA2B"}

package/lib/components/ReferenceList/renderReferenceList.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import { assertSlots } from '@fluentui/react-components';
+/**
+ * Render the final JSX of ReferenceList
+ */
+export const renderReferenceList_unstable = state => {
+  assertSlots(state);
+  return /*#__PURE__*/_jsx(state.root, {});
+};
+//# sourceMappingURL=renderReferenceList.js.map

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

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

package/lib/components/ReferenceList/useReferenceList.js

@@ -0,0 +1,30 @@
+import * as React from 'react';
+import { getNativeElementProps, slot } from '@fluentui/react-components';
+import { referenceListItemClassName } from './useReferenceListStyles';
+// If you add JSX to this file, be sure to change the file type to .tsx
+/**
+ * Create the state required to render ReferenceList.
+ *
+ * The returned state can be modified with hooks such as useReferenceListStyles_unstable,
+ * before being passed to renderReferenceList_unstable.
+ *
+ * @param props - props from this instance of ReferenceList
+ * @param ref - reference to root HTMLElement of ReferenceList
+ */
+export const useReferenceList_unstable = (props, ref) => {
+  return {
+    components: {
+      root: 'ol'
+    },
+    root: slot.always(getNativeElementProps('ol', {
+      ref,
+      ...props,
+      children: React.Children.map(props.children, child => /*#__PURE__*/React.createElement("li", {
+        className: referenceListItemClassName
+      }, child))
+    }), {
+      elementType: 'ol'
+    })
+  };
+};
+//# sourceMappingURL=useReferenceList.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["useReferenceList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, slot } from '@fluentui/react-components';\nimport type { ReferenceListProps, ReferenceListState } from './ReferenceList.types';\nimport { referenceListItemClassName } from './useReferenceListStyles';\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<HTMLElement>,\n): ReferenceListState => {\n  return {\n    components: {\n      root: 'ol',\n    },\n    root: slot.always(\n      getNativeElementProps('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":["React","getNativeElementProps","slot","referenceListItemClassName","useReferenceList_unstable","props","ref","components","root","always","children","Children","map","child","li","className","elementType"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,IAAI,QAAQ,6BAA6B;AAEzE,SAASC,0BAA0B,QAAQ,2BAA2B;AAEtE,uEAAuE;AAEvE;;;;;;;;CAQC,GACD,OAAO,MAAMC,4BAA4B,CACvCC,OACAC;IAEA,OAAO;QACLC,YAAY;YACVC,MAAM;QACR;QACAA,MAAMN,KAAKO,MAAM,CACfR,sBAAsB,MAAM;YAC1BK;YACA,GAAGD,KAAK;YACRK,UAAUV,MAAMW,QAAQ,CAACC,GAAG,CAACP,MAAMK,QAAQ,EAAEG,CAAAA,sBAAS,oBAACC;oBAAGC,WAAWZ;mBAA6BU;QACpG,IACA;YAAEG,aAAa;QAAK;IAExB;AACF,EAAE"}

package/lib/components/ReferenceList/useReferenceListStyles.js

@@ -0,0 +1,17 @@
+import { __resetStyles, mergeClasses, tokens } from '@fluentui/react-components';
+export const referenceListClassNames = {
+  root: 'fai-ReferenceList'
+};
+export const referenceListItemClassName = 'fai-ReferenceList__item';
+/**
+ * Styles for the root slot
+ */
+const useRootClassName = __resetStyles("rc0s888", null, [".rc0s888{padding:0;margin:0;display:flex;flex-direction:column;gap:var(--spacingVerticalS);}", ".rc0s888>.fai-ReferenceList__item{list-style-type:none;}"]);
+/**
+ * Apply styling to the ReferenceList slots based on the state
+ */
+export const useReferenceListStyles_unstable = state => {
+  state.root.className = mergeClasses(referenceListClassNames.root, useRootClassName(), state.root.className);
+  return state;
+};
+//# sourceMappingURL=useReferenceListStyles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["useReferenceListStyles.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  state.root.className = mergeClasses(referenceListClassNames.root, useRootClassName(), state.root.className);\n\n  return state;\n};\n"],"names":["makeResetStyles","mergeClasses","tokens","referenceListClassNames","root","referenceListItemClassName","useRootClassName","padding","margin","display","flexDirection","gap","spacingVerticalS","listStyleType","useReferenceListStyles_unstable","state","className"],"mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,EAAEC,MAAM,QAAQ,6BAA6B;AAInF,OAAO,MAAMC,0BAA8D;IACzEC,MAAM;AACR,EAAE;AAEF,OAAO,MAAMC,6BAA6B,0BAA0B;AAEpE;;CAEC,GACD,MAAMC,mBAAmBN,gBAAgB;IACvCO,SAAS;IACTC,QAAQ;IACRC,SAAS;IACTC,eAAe;IACfC,KAAKT,OAAOU,gBAAgB;IAE5B,CAAC,CAAC,GAAG,EAAEP,2BAA2B,CAAC,CAAC,EAAE;QACpCQ,eAAe;IACjB;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,kCAAkC,CAACC;IAC9CA,MAAMX,IAAI,CAACY,SAAS,GAAGf,aAAaE,wBAAwBC,IAAI,EAAEE,oBAAoBS,MAAMX,IAAI,CAACY,SAAS;IAE1G,OAAOD;AACT,EAAE"}

package/lib/context/ReferenceGroupContext.js

@@ -0,0 +1,11 @@
+import * as React from 'react';
+// eslint-disable-next-line @typescript-eslint/no-empty-function
+const noop = () => {};
+const ReferenceGroupContext = React.createContext(undefined);
+export const ReferenceGroupProvider = ReferenceGroupContext.Provider;
+export const useReferenceGroupSetOpen = () => {
+  const context = React.useContext(ReferenceGroupContext);
+  var _context_setOpen;
+  return (_context_setOpen = context === null || context === void 0 ? void 0 : context.setOpen) !== null && _context_setOpen !== void 0 ? _context_setOpen : noop;
+};
+//# sourceMappingURL=ReferenceGroupContext.js.map

package/lib/context/ReferenceGroupContext.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ReferenceGroupContext.ts"],"sourcesContent":["import * as React from 'react';\n\n// eslint-disable-next-line @typescript-eslint/no-empty-function\nconst noop = () => {};\n\nexport type ReferenceGroupContext = {\n  open?: boolean;\n  setOpen: () => void;\n};\n\nconst ReferenceGroupContext = React.createContext<ReferenceGroupContext | undefined>(undefined);\n\nexport const ReferenceGroupProvider = ReferenceGroupContext.Provider;\n\nexport const useReferenceGroupSetOpen = (): (() => void) => {\n  const context = React.useContext(ReferenceGroupContext);\n  return context?.setOpen ?? noop;\n};\n"],"names":["React","noop","ReferenceGroupContext","createContext","undefined","ReferenceGroupProvider","Provider","useReferenceGroupSetOpen","context","useContext","setOpen"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,gEAAgE;AAChE,MAAMC,OAAO,KAAO;AAOpB,MAAMC,wBAAwBF,MAAMG,aAAa,CAAoCC;AAErF,OAAO,MAAMC,yBAAyBH,sBAAsBI,QAAQ,CAAC;AAErE,OAAO,MAAMC,2BAA2B;IACtC,MAAMC,UAAUR,MAAMS,UAAU,CAACP;QAC1BM;IAAP,OAAOA,CAAAA,mBAAAA,oBAAAA,8BAAAA,QAASE,OAAO,cAAhBF,8BAAAA,mBAAoBP;AAC7B,EAAE"}

package/lib/hooks/index.js

@@ -0,0 +1,4 @@
+export * from './useReferenceCitation';
+export { useReferenceCitationPreview } from './useReferenceCitationPreview';
+export * from './useReferenceGroup';
+//# sourceMappingURL=index.js.map

package/lib/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './useReferenceCitation';\nexport { useReferenceCitationPreview, type UseReferenceCitationPreview } from './useReferenceCitationPreview';\nexport * from './useReferenceGroup';\n"],"names":["useReferenceCitationPreview"],"mappings":"AAAA,cAAc,yBAAyB;AACvC,SAASA,2BAA2B,QAA0C,gCAAgC;AAC9G,cAAc,sBAAsB"}

package/lib/hooks/useReferenceCitation.js

@@ -0,0 +1,77 @@
+import * as React from 'react';
+import { resolveShorthand, useId } from '@fluentui/react-components';
+import { Citation } from '../Citation';
+import { Reference } from '../Reference';
+/**
+ * Hook to package a `Citation` and `Reference` together in an
+ * accessibly by default manner.
+ *
+ * When using citations and references, prefer using them via this
+ * hook to ensure props are wired up correctly.
+ *
+ * @deprecated Use `useReferenceCitationPreview` hook instead.
+ */
+export const useReferenceCitation = ({
+  index,
+  referenceId: propsRefId,
+  citationId: propsCiteId,
+  citationProps,
+  referenceProps,
+  popoverProps
+}) => {
+  const refId = useId();
+  const citeId = useId();
+  const referenceId = propsRefId !== null && propsRefId !== void 0 ? propsRefId : refId;
+  const citationId = propsCiteId !== null && propsCiteId !== void 0 ? propsCiteId : citeId;
+  const components = React.useMemo(() => {
+    const citationHref = `#${citationId}`;
+    const PackagedCitation = props => {
+      return /*#__PURE__*/React.createElement(Citation, {
+        ...citationProps,
+        id: citationId,
+        referenceId: referenceId,
+        ...props
+      }, index);
+    };
+    const PackagedReference = props => {
+      return /*#__PURE__*/React.createElement(Reference, {
+        ...referenceProps,
+        index: index,
+        referenceId: referenceId,
+        citationHref: citationHref,
+        ...props
+      });
+    };
+    const PackagedCitationPopover = props => {
+      const referenceLabel = referenceProps ? resolveShorthand(referenceProps.label, {
+        required: true
+      }) : {};
+      const popoverLabel = popoverProps ? resolveShorthand(popoverProps.label, {
+        required: true
+      }) : {};
+      const label = resolveShorthand(props.label, {
+        required: true
+      });
+      const labelProps = {
+        ...referenceLabel,
+        ...popoverLabel,
+        ...label
+      };
+      return /*#__PURE__*/React.createElement(Reference, {
+        ...referenceProps,
+        ...popoverProps,
+        index: index,
+        ...props,
+        label: labelProps,
+        layout: "popover"
+      });
+    };
+    return {
+      Citation: PackagedCitation,
+      Reference: PackagedReference,
+      Popover: PackagedCitationPopover
+    };
+  }, [index, referenceId, citationId, referenceProps, citationProps, popoverProps]);
+  return components;
+};
+//# sourceMappingURL=useReferenceCitation.js.map

package/lib/hooks/useReferenceCitation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useReferenceCitation.tsx"],"sourcesContent":["import * as React from 'react';\nimport { resolveShorthand, useId } from '@fluentui/react-components';\n\nimport { Citation } from '../Citation';\nimport { Reference } from '../Reference';\nimport type { CitationProps } from '../Citation';\nimport type { ReferenceProps } from '../Reference';\n\ntype PartialCitationProps = 'referenceHref' | 'referenceId';\n\n/**\n * Props for a \"packaged Citation\". A packaged Citation is a `Citation` that is\n * pre-packaged with props set by the `useReferenceCitation` hook.\n *\n * @deprecated Use `useReferenceCitationPreview` hook instead.\n */\nexport type PackagedCitationProps = Omit<CitationProps, PartialCitationProps> &\n  Partial<Pick<CitationProps, PartialCitationProps>>;\n\n/**\n * A \"packaged Citation\". A packaged Citation is a `Citation` that is\n * pre-packaged with props set by the `useReferenceCitation` hook.\n *\n * @deprecated Use `useReferenceCitationPreview` hook instead.\n */\nexport type PackagedCitation = React.FC<PackagedCitationProps>;\n\ntype PartialReferenceProps = 'citationHref' | 'index' | 'referenceId';\n\n/**\n * Props for a \"packaged Reference\". A packaged Reference is a `Reference` that is\n * pre-packaged with props set by the `useReferenceCitation` hook.\n *\n * @deprecated Use `useReferenceCitationPreview` hook instead.\n */\nexport type PackagedReferenceProps = Omit<ReferenceProps, PartialReferenceProps> &\n  Partial<Pick<ReferenceProps, PartialReferenceProps>>;\n\n/**\n * A \"packaged Reference\". A packaged Reference is a `Reference` that is\n * pre-packaged with props set by the `useReferenceCitation` hook.\n *\n * @deprecated Use `useReferenceCitationPreview` hook instead.\n */\nexport type PackagedReference = React.FC<PackagedReferenceProps>;\n\n/**\n * @deprecated Use `useReferenceCitationPreview` hook instead.\n */\nexport type PackagedCitationPopoverProps = Omit<PackagedReferenceProps, 'layout'>;\n/**\n * @deprecated Use `useReferenceCitationPreview` hook instead.\n */\nexport type PackagedCitationPopover = React.FC<PackagedCitationPopoverProps>;\n\n/**\n * Data used to package a `Citation` and `Reference` together with\n * the `useReferenceCitation` hook.\n *\n * @deprecated Use `useReferenceCitationPreview` hook instead.\n */\nexport type ReferenceCitationData = {\n  index: number;\n  referenceId?: string;\n  citationId?: string;\n  citationProps?: PackagedCitationProps;\n  referenceProps?: PackagedReferenceProps;\n  popoverProps?: PackagedCitationPopoverProps;\n};\n\n/**\n * @deprecated Use `useReferenceCitationPreview` hook instead.\n */\nexport type UseReferenceCitation = (data: ReferenceCitationData) => {\n  Citation: PackagedCitation;\n  Reference: PackagedReference;\n  Popover: PackagedCitationPopover;\n};\n\n/**\n * Hook to package a `Citation` and `Reference` together in an\n * accessibly by default manner.\n *\n * When using citations and references, prefer using them via this\n * hook to ensure props are wired up correctly.\n *\n * @deprecated Use `useReferenceCitationPreview` hook instead.\n */\nexport const useReferenceCitation: UseReferenceCitation = ({\n  index,\n  referenceId: propsRefId,\n  citationId: propsCiteId,\n  citationProps,\n  referenceProps,\n  popoverProps,\n}) => {\n  const refId = useId();\n  const citeId = useId();\n\n  const referenceId = propsRefId ?? refId;\n  const citationId = propsCiteId ?? citeId;\n\n  const components = React.useMemo(() => {\n    const citationHref = `#${citationId}`;\n\n    const PackagedCitation: PackagedCitation = props => {\n      return (\n        <Citation {...citationProps} id={citationId} referenceId={referenceId} {...props}>\n          {index}\n        </Citation>\n      );\n    };\n\n    const PackagedReference: PackagedReference = props => {\n      return (\n        <Reference {...referenceProps} index={index} referenceId={referenceId} citationHref={citationHref} {...props} />\n      );\n    };\n\n    const PackagedCitationPopover: PackagedCitationPopover = props => {\n      const referenceLabel = referenceProps ? resolveShorthand(referenceProps.label, { required: true }) : {};\n      const popoverLabel = popoverProps ? resolveShorthand(popoverProps.label, { required: true }) : {};\n      const label = resolveShorthand(props.label, { required: true });\n      const labelProps = {\n        ...referenceLabel,\n        ...popoverLabel,\n        ...label,\n      };\n\n      return (\n        <Reference {...referenceProps} {...popoverProps} index={index} {...props} label={labelProps} layout=\"popover\" />\n      );\n    };\n\n    return {\n      Citation: PackagedCitation,\n      Reference: PackagedReference,\n      Popover: PackagedCitationPopover,\n    };\n  }, [index, referenceId, citationId, referenceProps, citationProps, popoverProps]);\n\n  return components;\n};\n"],"names":["React","resolveShorthand","useId","Citation","Reference","useReferenceCitation","index","referenceId","propsRefId","citationId","propsCiteId","citationProps","referenceProps","popoverProps","refId","citeId","components","useMemo","citationHref","PackagedCitation","props","id","PackagedReference","PackagedCitationPopover","referenceLabel","label","required","popoverLabel","labelProps","layout","Popover"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,EAAEC,KAAK,QAAQ,6BAA6B;AAErE,SAASC,QAAQ,QAAQ,cAAc;AACvC,SAASC,SAAS,QAAQ,eAAe;AA2EzC;;;;;;;;CAQC,GACD,OAAO,MAAMC,uBAA6C,CAAC,EACzDC,KAAK,EACLC,aAAaC,UAAU,EACvBC,YAAYC,WAAW,EACvBC,aAAa,EACbC,cAAc,EACdC,YAAY,EACb;IACC,MAAMC,QAAQZ;IACd,MAAMa,SAASb;IAEf,MAAMK,cAAcC,uBAAAA,wBAAAA,aAAcM;IAClC,MAAML,aAAaC,wBAAAA,yBAAAA,cAAeK;IAElC,MAAMC,aAAahB,MAAMiB,OAAO,CAAC;QAC/B,MAAMC,eAAe,CAAC,CAAC,EAAET,WAAW,CAAC;QAErC,MAAMU,mBAAqCC,CAAAA;YACzC,qBACE,oBAACjB;gBAAU,GAAGQ,aAAa;gBAAEU,IAAIZ;gBAAYF,aAAaA;gBAAc,GAAGa,KAAK;eAC7Ed;QAGP;QAEA,MAAMgB,oBAAuCF,CAAAA;YAC3C,qBACE,oBAAChB;gBAAW,GAAGQ,cAAc;gBAAEN,OAAOA;gBAAOC,aAAaA;gBAAaW,cAAcA;gBAAe,GAAGE,KAAK;;QAEhH;QAEA,MAAMG,0BAAmDH,CAAAA;YACvD,MAAMI,iBAAiBZ,iBAAiBX,iBAAiBW,eAAea,KAAK,EAAE;gBAAEC,UAAU;YAAK,KAAK,CAAC;YACtG,MAAMC,eAAed,eAAeZ,iBAAiBY,aAAaY,KAAK,EAAE;gBAAEC,UAAU;YAAK,KAAK,CAAC;YAChG,MAAMD,QAAQxB,iBAAiBmB,MAAMK,KAAK,EAAE;gBAAEC,UAAU;YAAK;YAC7D,MAAME,aAAa;gBACjB,GAAGJ,cAAc;gBACjB,GAAGG,YAAY;gBACf,GAAGF,KAAK;YACV;YAEA,qBACE,oBAACrB;gBAAW,GAAGQ,cAAc;gBAAG,GAAGC,YAAY;gBAAEP,OAAOA;gBAAQ,GAAGc,KAAK;gBAAEK,OAAOG;gBAAYC,QAAO;;QAExG;QAEA,OAAO;YACL1B,UAAUgB;YACVf,WAAWkB;YACXQ,SAASP;QACX;IACF,GAAG;QAACjB;QAAOC;QAAaE;QAAYG;QAAgBD;QAAeE;KAAa;IAEhF,OAAOG;AACT,EAAE"}

package/lib/hooks/useReferenceCitationPreview.js

@@ -0,0 +1,128 @@
+import { jsx as _jsx, jsxs as _jsxs } from "@fluentui/react-jsx-runtime/jsx-runtime";
+import * as React from 'react';
+import { Badge, Caption1, assertSlots, mergeCallbacks, slot, useId, usePopoverContext_unstable } from '@fluentui/react-components';
+// eslint-disable-next-line @nx/enforce-module-boundaries
+import { Preview, PreviewContent, PreviewHeader, PreviewMetadata, PreviewSurface, PreviewTrigger } from '@fluentui-copilot/react-preview';
+import { Citation } from '../Citation';
+import { Reference } from '../Reference';
+// 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__*/_jsx(Citation, {
+    ...citationCloseButtonProps,
+    onClick: onCitationCloseButtonClick
+  });
+};
+/**
+ * Hook to package a `Citation` and `Reference` together in an
+ * accessibly by default manner.
+ *
+ * When using citations and references, prefer using them via this
+ * hook to ensure props are wired up correctly.
+ */
+export const useReferenceCitationPreview = ({
+  index,
+  referenceId: propsRefId,
+  citationId: propsCiteId,
+  citationProps,
+  referenceProps,
+  previewProps,
+  previewSurfaceProps
+}) => {
+  const refId = useId();
+  const citeId = useId();
+  const referenceId = propsRefId !== null && propsRefId !== void 0 ? propsRefId : refId;
+  const citationId = propsCiteId !== null && propsCiteId !== void 0 ? propsCiteId : citeId;
+  const components = React.useMemo(() => {
+    const citationHref = `#${citationId}`;
+    const PackagedReference = props => {
+      var _props_index, _ref;
+      const referenceIndex = (_ref = (_props_index = props.index) !== null && _props_index !== void 0 ? _props_index : referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.index) !== null && _ref !== void 0 ? _ref : index;
+      return /*#__PURE__*/_jsx(Reference, {
+        ...referenceProps,
+        index: referenceIndex,
+        referenceId: referenceId,
+        citationHref: citationHref,
+        ...props
+      });
+    };
+    const CitationWithPreview = props => {
+      // We assert content as a slot to use it with its resolved props object and the correct defaults below.
+      const content = slot.always(referenceProps ? referenceProps.content : undefined, {
+        defaultProps: {
+          children: (referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.excerpt) && /*#__PURE__*/_jsx(Caption1, {
+            children: referenceProps.excerpt
+          })
+        },
+        elementType: 'div'
+      });
+      const citationWithPreviewState = {
+        components: {
+          content: 'div'
+        },
+        content
+      };
+      assertSlots(citationWithPreviewState);
+      // We resolve the slots' objects for sensitivityLabel and title here so that we can use the information from their children below.
+      const sensitivityLabel = slot.optional(referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.sensitivityLabel, {
+        elementType: 'span'
+      });
+      const title = slot.optional(referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.label, {
+        elementType: 'div'
+      });
+      return /*#__PURE__*/_jsxs(Preview, {
+        closeOnScroll: true,
+        positioning: "below",
+        size: "small",
+        trapFocus: true,
+        withArrow: true,
+        ...previewProps,
+        children: [/*#__PURE__*/_jsx(PreviewTrigger, {
+          children: /*#__PURE__*/_jsx(Citation, {
+            ...citationProps,
+            id: citationId,
+            referenceId: referenceId,
+            ...props,
+            children: index
+          })
+        }), /*#__PURE__*/_jsx(PreviewSurface, {
+          ...previewSurfaceProps,
+          children: /*#__PURE__*/_jsxs(PreviewContent, {
+            children: [/*#__PURE__*/_jsx(PreviewHeader, {
+              citation: /*#__PURE__*/_jsx(CitationCloseButton, {
+                "aria-label": `Reference ${index}, close`,
+                referenceHref: "#",
+                tabIndex: -1,
+                children: index
+              }),
+              media: referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.media,
+              children: title === null || title === void 0 ? void 0 : title.children
+            }), /*#__PURE__*/_jsx(PreviewMetadata, {
+              icon: referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.icon,
+              primaryText: referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.primaryText,
+              secondaryText: referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.secondaryText,
+              tertiaryText: referenceProps === null || referenceProps === void 0 ? void 0 : referenceProps.tertiaryText
+            }), sensitivityLabel && /*#__PURE__*/_jsx(Badge, {
+              color: "informative",
+              shape: "rounded",
+              size: "small",
+              children: sensitivityLabel.children
+            }), /*#__PURE__*/_jsx(citationWithPreviewState.content, {}), previewProps === null || previewProps === void 0 ? void 0 : previewProps.children]
+          })
+        })]
+      });
+    };
+    return {
+      Citation: CitationWithPreview,
+      Reference: PackagedReference
+    };
+  }, [index, referenceId, citationId, referenceProps, citationProps, previewProps, previewSurfaceProps]);
+  return components;
+};
+//# sourceMappingURL=useReferenceCitationPreview.js.map

package/lib/hooks/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';\nimport {\n  Badge,\n  Caption1,\n  assertSlots,\n  mergeCallbacks,\n  slot,\n  useId,\n  usePopoverContext_unstable,\n} from '@fluentui/react-components';\nimport type { Slot } from '@fluentui/react-components';\n\n// eslint-disable-next-line @nx/enforce-module-boundaries\nimport {\n  Preview,\n  PreviewContent,\n  PreviewHeader,\n  PreviewMetadata,\n  PreviewSurface,\n  PreviewTrigger,\n} from '@fluentui-copilot/react-preview';\n// eslint-disable-next-line @nx/enforce-module-boundaries\nimport type { PreviewProps, PreviewSurfaceProps } from '@fluentui-copilot/react-preview';\n\nimport { Citation } from '../Citation';\nimport { Reference } from '../Reference';\nimport type { CitationProps } from '../Citation';\nimport type { ReferenceProps } from '../Reference';\n\ntype PartialCitationProps = 'referenceHref' | 'referenceId';\n\n/**\n * Props for a \"packaged Citation\". A packaged Citation is a `Citation` that is\n * pre-packaged with props set by the `useReferenceCitation` hook.\n */\nexport type PackagedCitationProps = Omit<CitationProps, PartialCitationProps | 'popover' | 'popoverSurface'> &\n  Partial<Pick<CitationProps, PartialCitationProps>>;\n\n/**\n * A \"packaged Citation\". A packaged Citation is a `Citation` that is\n * pre-packaged with props set by the `useReferenceCitation` hook.\n */\nexport type PackagedCitation = React.FC<PackagedCitationProps>;\n\ntype PartialReferenceProps = 'citationHref' | 'index' | 'referenceId';\n\n/**\n * Props for a \"packaged Reference\". A packaged Reference is a `Reference` that is\n * pre-packaged with props set by the `useReferenceCitation` hook.\n */\nexport type PackagedReferenceProps = Omit<ReferenceProps, PartialReferenceProps> &\n  Partial<Pick<ReferenceProps, PartialReferenceProps>>;\n\n/**\n * A \"packaged Reference\". A packaged Reference is a `Reference` that is\n * pre-packaged with props set by the `useReferenceCitation` hook.\n */\nexport type PackagedReference = React.FC<PackagedReferenceProps>;\n\n/**\n * Data used to package a `Citation` and `Reference` together with\n * the `useReferenceCitation` hook.\n */\nexport type ReferenceCitationData = {\n  index: number;\n  referenceId?: string;\n  citationId?: string;\n  citationProps?: PackagedCitationProps;\n  referenceProps?: PackagedReferenceProps;\n  previewProps?: PreviewProps;\n  previewSurfaceProps?: PreviewSurfaceProps;\n};\n\nexport type UseReferenceCitationPreview = (data: ReferenceCitationData) => {\n  Citation: PackagedCitation;\n  Reference: PackagedReference;\n};\n\ntype PreviewExtraSlots = {\n  content: Slot<'div'>;\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 * Hook to package a `Citation` and `Reference` together in an\n * accessibly by default manner.\n *\n * When using citations and references, prefer using them via this\n * hook to ensure props are wired up correctly.\n */\nexport const useReferenceCitationPreview: UseReferenceCitationPreview = ({\n  index,\n  referenceId: propsRefId,\n  citationId: propsCiteId,\n  citationProps,\n  referenceProps,\n  previewProps,\n  previewSurfaceProps,\n}) => {\n  const refId = useId();\n  const citeId = useId();\n\n  const referenceId = propsRefId ?? refId;\n  const citationId = propsCiteId ?? citeId;\n\n  const components = React.useMemo(() => {\n    const citationHref = `#${citationId}`;\n\n    const PackagedReference: PackagedReference = props => {\n      const referenceIndex = props.index ?? referenceProps?.index ?? index;\n\n      return (\n        <Reference\n          {...referenceProps}\n          index={referenceIndex}\n          referenceId={referenceId}\n          citationHref={citationHref}\n          {...props}\n        />\n      );\n    };\n\n    const CitationWithPreview: PackagedCitation = props => {\n      // We assert content as a slot to use it with its resolved props object and the correct defaults below.\n      const content = slot.always(referenceProps ? referenceProps.content : undefined, {\n        defaultProps: {\n          children: referenceProps?.excerpt && <Caption1>{referenceProps.excerpt}</Caption1>,\n        },\n        elementType: 'div',\n      });\n      const citationWithPreviewState = {\n        components: {\n          content: 'div',\n        },\n        content,\n      };\n      assertSlots<PreviewExtraSlots>(citationWithPreviewState);\n\n      // We resolve the slots' objects for sensitivityLabel and title here so that we can use the information from their children below.\n      const sensitivityLabel = slot.optional(referenceProps?.sensitivityLabel, { elementType: 'span' });\n      const title = slot.optional(referenceProps?.label, { elementType: 'div' });\n\n      return (\n        <Preview closeOnScroll positioning=\"below\" size=\"small\" trapFocus withArrow {...previewProps}>\n          <PreviewTrigger>\n            <Citation {...citationProps} id={citationId} referenceId={referenceId} {...props}>\n              {index}\n            </Citation>\n          </PreviewTrigger>\n          <PreviewSurface {...previewSurfaceProps}>\n            <PreviewContent>\n              <PreviewHeader\n                citation={\n                  <CitationCloseButton aria-label={`Reference ${index}, close`} referenceHref=\"#\" tabIndex={-1}>\n                    {index}\n                  </CitationCloseButton>\n                }\n                media={referenceProps?.media}\n              >\n                {title?.children}\n              </PreviewHeader>\n              <PreviewMetadata\n                icon={referenceProps?.icon}\n                primaryText={referenceProps?.primaryText}\n                secondaryText={referenceProps?.secondaryText}\n                tertiaryText={referenceProps?.tertiaryText}\n              />\n              {sensitivityLabel && (\n                <Badge color=\"informative\" shape=\"rounded\" size=\"small\">\n                  {sensitivityLabel.children}\n                </Badge>\n              )}\n              <citationWithPreviewState.content />\n              {previewProps?.children}\n            </PreviewContent>\n          </PreviewSurface>\n        </Preview>\n      );\n    };\n\n    return {\n      Citation: CitationWithPreview,\n      Reference: PackagedReference,\n    };\n  }, [index, referenceId, citationId, referenceProps, citationProps, previewProps, previewSurfaceProps]);\n\n  return components;\n};\n"],"names":["React","Badge","Caption1","assertSlots","mergeCallbacks","slot","useId","usePopoverContext_unstable","Preview","PreviewContent","PreviewHeader","PreviewMetadata","PreviewSurface","PreviewTrigger","Citation","Reference","CitationCloseButton","citationCloseButtonProps","setPopoverOpen","context","setOpen","onPopoverCloseClick","useCallback","ev","preventDefault","onCitationCloseButtonClick","onClick","useReferenceCitationPreview","index","referenceId","propsRefId","citationId","propsCiteId","citationProps","referenceProps","previewProps","previewSurfaceProps","refId","citeId","components","useMemo","citationHref","PackagedReference","props","referenceIndex","CitationWithPreview","content","always","undefined","defaultProps","children","excerpt","elementType","citationWithPreviewState","sensitivityLabel","optional","title","label","closeOnScroll","positioning","size","trapFocus","withArrow","id","citation","aria-label","referenceHref","tabIndex","media","icon","primaryText","secondaryText","tertiaryText","color","shape"],"mappings":"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"}

package/lib/hooks/useReferenceGroup.js

@@ -0,0 +1,40 @@
+import * as React from 'react';
+import { __styles, useId } from '@fluentui/react-components';
+const useStyles = __styles({
+  hidden: {
+    mc9l5x: "fjseox"
+  }
+}, {
+  d: [".fjseox{display:none;}"]
+});
+/**
+ * Hook to package a `ReferenceGroupToggle` and `ReferenceList` together and
+ * maintain their `isOpen` state.
+ *
+ * When rendering a group of references, prefer to use this hook
+ * hook to ensure state is maintained correctly
+ */
+export const useReferenceGroup = props => {
+  const [isOpen, setIsOpen] = React.useState(false);
+  const styles = useStyles();
+  const referenceListId = useId('reference-list', props.referenceListId);
+  return React.useMemo(() => {
+    const handleClick = () => {
+      setIsOpen(isOpen => !isOpen);
+    };
+    const referenceGroupToggleProps = {
+      'aria-controls': referenceListId,
+      isOpen,
+      onClick: handleClick
+    };
+    const referenceListProps = {
+      className: isOpen ? undefined : styles.hidden,
+      id: referenceListId
+    };
+    return {
+      referenceGroupToggleProps,
+      referenceListProps
+    };
+  }, [isOpen, referenceListId, styles.hidden]);
+};
+//# sourceMappingURL=useReferenceGroup.js.map

package/lib/hooks/useReferenceGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useReferenceGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { makeStyles, useId } from '@fluentui/react-components';\nimport type { ReferenceListProps } from '../ReferenceList';\nimport type { ReferenceGroupToggleProps } from '../ReferenceGroupToggle';\n\nexport type UseReferenceGroupProps = { referenceListId?: string };\nexport type UseReferenceGroup = (props: UseReferenceGroupProps) => {\n  referenceGroupToggleProps: ReferenceGroupToggleProps;\n  referenceListProps: ReferenceListProps;\n};\n\nconst useStyles = makeStyles({\n  hidden: {\n    display: 'none',\n  },\n});\n\n/**\n * Hook to package a `ReferenceGroupToggle` and `ReferenceList` together and\n * maintain their `isOpen` state.\n *\n * When rendering a group of references, prefer to use this hook\n * hook to ensure state is maintained correctly\n */\nexport const useReferenceGroup: UseReferenceGroup = props => {\n  const [isOpen, setIsOpen] = React.useState(false);\n  const styles = useStyles();\n  const referenceListId = useId('reference-list', props.referenceListId);\n\n  return React.useMemo(() => {\n    const handleClick = () => {\n      setIsOpen(isOpen => !isOpen);\n    };\n\n    const referenceGroupToggleProps = {\n      'aria-controls': referenceListId,\n      isOpen,\n      onClick: handleClick,\n    };\n\n    const referenceListProps = {\n      className: isOpen ? undefined : styles.hidden,\n      id: referenceListId,\n    };\n\n    return { referenceGroupToggleProps, referenceListProps };\n  }, [isOpen, referenceListId, styles.hidden]);\n};\n"],"names":["React","makeStyles","useId","useStyles","hidden","display","useReferenceGroup","props","isOpen","setIsOpen","useState","styles","referenceListId","useMemo","handleClick","referenceGroupToggleProps","onClick","referenceListProps","className","undefined","id"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,UAAU,EAAEC,KAAK,QAAQ,6BAA6B;AAU/D,MAAMC,YAAYF,WAAW;IAC3BG,QAAQ;QACNC,SAAS;IACX;AACF;AAEA;;;;;;CAMC,GACD,OAAO,MAAMC,oBAAuCC,CAAAA;IAClD,MAAM,CAACC,QAAQC,UAAU,GAAGT,MAAMU,QAAQ,CAAC;IAC3C,MAAMC,SAASR;IACf,MAAMS,kBAAkBV,MAAM,kBAAkBK,MAAMK,eAAe;IAErE,OAAOZ,MAAMa,OAAO,CAAC;QACnB,MAAMC,cAAc;YAClBL,UAAUD,CAAAA,SAAU,CAACA;QACvB;QAEA,MAAMO,4BAA4B;YAChC,iBAAiBH;YACjBJ;YACAQ,SAASF;QACX;QAEA,MAAMG,qBAAqB;YACzBC,WAAWV,SAASW,YAAYR,OAAOP,MAAM;YAC7CgB,IAAIR;QACN;QAEA,OAAO;YAAEG;YAA2BE;QAAmB;IACzD,GAAG;QAACT;QAAQI;QAAiBD,OAAOP,MAAM;KAAC;AAC7C,EAAE"}

package/lib/index.js

@@ -0,0 +1,7 @@
+export { Citation, citationClassNames, renderCitation_unstable, useCitation_unstable, useCitationStyles_unstable } from './Citation';
+export { Reference, referenceClassNames, renderReference_unstable, useReference_unstable, useReferenceStyles_unstable } from './Reference';
+export { useReferenceCitation, useReferenceCitationPreview, useReferenceGroup } from './hooks';
+export { ReferenceList, referenceListClassNames, useReferenceList_unstable, useReferenceListStyles_unstable, renderReferenceList_unstable } from './ReferenceList';
+export { ReferenceGroup, referenceGroupClassNames, renderReferenceGroup_unstable, useReferenceGroup_unstable, useReferenceGroupStyles_unstable } from './ReferenceGroup';
+export { ReferenceGroupToggle, referenceGroupToggleClassNames, renderReferenceGroupToggle_unstable, useReferenceGroupToggleStyles_unstable, useReferenceGroupToggle_unstable } from './ReferenceGroupToggle';
+//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -0,0 +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 { useReferenceCitation, useReferenceCitationPreview, useReferenceGroup } from './hooks';\nexport {\n  ReferenceList,\n  referenceListClassNames,\n  useReferenceList_unstable,\n  useReferenceListStyles_unstable,\n  renderReferenceList_unstable,\n} from './ReferenceList';\nexport {\n  ReferenceGroup,\n  referenceGroupClassNames,\n  renderReferenceGroup_unstable,\n  useReferenceGroup_unstable,\n  useReferenceGroupStyles_unstable,\n} from './ReferenceGroup';\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 { ReferenceGroupSlots, ReferenceGroupProps, ReferenceGroupState } from './ReferenceGroup';\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  UseReferenceCitation,\n  UseReferenceCitationPreview,\n  UseReferenceGroup,\n  UseReferenceGroupProps,\n} from './hooks';\n"],"names":["Citation","citationClassNames","renderCitation_unstable","useCitation_unstable","useCitationStyles_unstable","Reference","referenceClassNames","renderReference_unstable","useReference_unstable","useReferenceStyles_unstable","useReferenceCitation","useReferenceCitationPreview","useReferenceGroup","ReferenceList","referenceListClassNames","useReferenceList_unstable","useReferenceListStyles_unstable","renderReferenceList_unstable","ReferenceGroup","referenceGroupClassNames","renderReferenceGroup_unstable","useReferenceGroup_unstable","useReferenceGroupStyles_unstable","ReferenceGroupToggle","referenceGroupToggleClassNames","renderReferenceGroupToggle_unstable","useReferenceGroupToggleStyles_unstable","useReferenceGroupToggle_unstable"],"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,oBAAoB,EAAEC,2BAA2B,EAAEC,iBAAiB,QAAQ,UAAU;AAC/F,SACEC,aAAa,EACbC,uBAAuB,EACvBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,4BAA4B,QACvB,kBAAkB;AACzB,SACEC,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,0BAA0B,EAC1BC,gCAAgC,QAC3B,mBAAmB;AAC1B,SACEC,oBAAoB,EACpBC,8BAA8B,EAC9BC,mCAAmC,EACnCC,sCAAsC,EACtCC,gCAAgC,QAC3B,yBAAyB"}

package/lib-commonjs/Citation.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/Citation/index"), exports);
+ //# sourceMappingURL=Citation.js.map

package/lib-commonjs/Citation.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Citation.js"],"sourcesContent":["export * from './components/Citation/index';\n//# sourceMappingURL=Citation.js.map"],"names":[],"mappings":";;;;;uBAAc;CACd,oCAAoC"}

package/lib-commonjs/Reference.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/Reference/index"), exports);
+ //# sourceMappingURL=Reference.js.map

package/lib-commonjs/Reference.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["Reference.js"],"sourcesContent":["export * from './components/Reference/index';\n//# sourceMappingURL=Reference.js.map"],"names":[],"mappings":";;;;;uBAAc;CACd,qCAAqC"}

package/lib-commonjs/ReferenceGroup.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/ReferenceGroup/index"), exports);
+ //# sourceMappingURL=ReferenceGroup.js.map

package/lib-commonjs/ReferenceGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["ReferenceGroup.js"],"sourcesContent":["export * from './components/ReferenceGroup/index';\n//# sourceMappingURL=ReferenceGroup.js.map"],"names":[],"mappings":";;;;;uBAAc;CACd,0CAA0C"}

package/lib-commonjs/ReferenceGroupToggle.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _export_star = require("@swc/helpers/_/_export_star");
+_export_star._(require("./components/ReferenceGroupToggle/index"), exports);
+ //# sourceMappingURL=ReferenceGroupToggle.js.map