@fluentui-copilot/react-reference 0.11.2 → 0.11.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +93 -1
- package/CHANGELOG.md +28 -2
- package/dist/index.d.ts +52 -26
- package/lib/ReferenceListV2.js +1 -1
- package/lib/ReferenceListV2.js.map +1 -1
- package/lib/ReferenceOverflowButton.js +1 -1
- package/lib/ReferenceOverflowButton.js.map +1 -1
- package/lib/ReferenceV2.js +1 -1
- package/lib/ReferenceV2.js.map +1 -1
- package/lib/components/Citation/Citation.js +1 -1
- package/lib/components/Citation/Citation.js.map +1 -1
- package/lib/components/Citation/index.js +1 -1
- package/lib/components/Citation/index.js.map +1 -1
- package/lib/components/Citation/{useCitationStyles.js → useCitationStyles.styles.js} +3 -1
- package/lib/components/Citation/useCitationStyles.styles.js.map +1 -0
- package/lib/components/Reference/Reference.js +1 -1
- package/lib/components/Reference/Reference.js.map +1 -1
- package/lib/components/Reference/index.js +1 -1
- package/lib/components/Reference/index.js.map +1 -1
- package/lib/components/Reference/useReference.js +1 -1
- package/lib/components/Reference/useReference.js.map +1 -1
- package/lib/components/Reference/{useReferenceStyles.js → useReferenceStyles.styles.js} +3 -1
- package/lib/components/Reference/useReferenceStyles.styles.js.map +1 -0
- package/lib/components/ReferenceGroupToggle/ReferenceGroupToggle.js +1 -1
- package/lib/components/ReferenceGroupToggle/ReferenceGroupToggle.js.map +1 -1
- package/lib/components/ReferenceGroupToggle/ReferenceGroupToggle.types.js.map +1 -1
- package/lib/components/ReferenceGroupToggle/index.js +1 -1
- package/lib/components/ReferenceGroupToggle/index.js.map +1 -1
- package/lib/components/ReferenceGroupToggle/useReferenceGroupToggle.js +3 -0
- package/lib/components/ReferenceGroupToggle/useReferenceGroupToggle.js.map +1 -1
- package/lib/components/ReferenceGroupToggle/{useReferenceGroupToggleStyles.js → useReferenceGroupToggleStyles.styles.js} +25 -3
- package/lib/components/ReferenceGroupToggle/useReferenceGroupToggleStyles.styles.js.map +1 -0
- package/lib/components/ReferenceList/ReferenceList.js +1 -1
- package/lib/components/ReferenceList/ReferenceList.js.map +1 -1
- package/lib/components/ReferenceList/index.js +1 -1
- package/lib/components/ReferenceList/index.js.map +1 -1
- package/lib/components/ReferenceList/useReferenceList.js +1 -1
- package/lib/components/ReferenceList/useReferenceList.js.map +1 -1
- package/lib/components/ReferenceList/{useReferenceListStyles.js → useReferenceListStyles.styles.js} +3 -1
- package/lib/components/ReferenceList/useReferenceListStyles.styles.js.map +1 -0
- package/lib/components/reference-v2/Reference/Reference.js +1 -1
- package/lib/components/reference-v2/Reference/Reference.js.map +1 -1
- package/lib/components/reference-v2/Reference/Reference.types.js.map +1 -1
- package/lib/components/reference-v2/Reference/index.js +1 -1
- package/lib/components/reference-v2/Reference/index.js.map +1 -1
- package/lib/components/reference-v2/Reference/renderReference.js +1 -1
- package/lib/components/reference-v2/Reference/renderReference.js.map +1 -1
- package/lib/components/reference-v2/Reference/useReference.js +20 -21
- package/lib/components/reference-v2/Reference/useReference.js.map +1 -1
- package/lib/components/reference-v2/Reference/useReferenceStyles.styles.js +51 -0
- package/lib/components/reference-v2/Reference/useReferenceStyles.styles.js.map +1 -0
- package/lib/components/reference-v2/ReferenceList/ReferenceList.js +1 -1
- package/lib/components/reference-v2/ReferenceList/ReferenceList.js.map +1 -1
- package/lib/components/reference-v2/ReferenceList/ReferenceList.types.js.map +1 -1
- package/lib/components/reference-v2/ReferenceList/index.js +1 -1
- package/lib/components/reference-v2/ReferenceList/index.js.map +1 -1
- package/lib/components/reference-v2/ReferenceList/useReferenceList.js +10 -10
- package/lib/components/reference-v2/ReferenceList/useReferenceList.js.map +1 -1
- package/lib/components/reference-v2/ReferenceList/useReferenceListContextValues.js +8 -6
- package/lib/components/reference-v2/ReferenceList/useReferenceListContextValues.js.map +1 -1
- package/lib/components/reference-v2/ReferenceList/{useReferenceListStyles.js → useReferenceListStyles.styles.js} +3 -1
- package/lib/components/reference-v2/ReferenceList/useReferenceListStyles.styles.js.map +1 -0
- package/lib/components/reference-v2/ReferenceOverflowButton/ReferenceOverflowButton.js +1 -1
- package/lib/components/reference-v2/ReferenceOverflowButton/ReferenceOverflowButton.js.map +1 -1
- package/lib/components/reference-v2/ReferenceOverflowButton/ReferenceOverflowButton.types.js.map +1 -1
- package/lib/components/reference-v2/ReferenceOverflowButton/index.js +1 -1
- package/lib/components/reference-v2/ReferenceOverflowButton/index.js.map +1 -1
- package/lib/components/reference-v2/ReferenceOverflowButton/useReferenceOverflowButton.js +23 -19
- package/lib/components/reference-v2/ReferenceOverflowButton/useReferenceOverflowButton.js.map +1 -1
- package/lib/components/reference-v2/ReferenceOverflowButton/{useReferenceOverflowButtonStyles.js → useReferenceOverflowButtonStyles.styles.js} +5 -21
- package/lib/components/reference-v2/ReferenceOverflowButton/useReferenceOverflowButtonStyles.styles.js.map +1 -0
- package/lib/contexts/reference-v2/referenceListContext.js +5 -4
- package/lib/contexts/reference-v2/referenceListContext.js.map +1 -1
- package/lib/hooks/reference-v2/useReferenceCitationPreview.js +17 -12
- package/lib/hooks/reference-v2/useReferenceCitationPreview.js.map +1 -1
- package/lib/hooks/useReferenceCitationPreview.js +6 -4
- package/lib/hooks/useReferenceCitationPreview.js.map +1 -1
- package/lib-commonjs/ReferenceListV2.js +1 -1
- package/lib-commonjs/ReferenceListV2.js.map +1 -1
- package/lib-commonjs/ReferenceOverflowButton.js +1 -1
- package/lib-commonjs/ReferenceOverflowButton.js.map +1 -1
- package/lib-commonjs/ReferenceV2.js +1 -1
- package/lib-commonjs/ReferenceV2.js.map +1 -1
- package/lib-commonjs/components/Citation/Citation.js +2 -2
- package/lib-commonjs/components/Citation/Citation.js.map +1 -1
- package/lib-commonjs/components/Citation/index.js +1 -1
- package/lib-commonjs/components/Citation/index.js.map +1 -1
- package/lib-commonjs/components/Citation/{useCitationStyles.js → useCitationStyles.styles.js} +2 -1
- package/lib-commonjs/components/Citation/useCitationStyles.styles.js.map +1 -0
- package/lib-commonjs/components/Reference/Reference.js +2 -2
- package/lib-commonjs/components/Reference/Reference.js.map +1 -1
- package/lib-commonjs/components/Reference/index.js +1 -1
- package/lib-commonjs/components/Reference/index.js.map +1 -1
- package/lib-commonjs/components/Reference/useReference.js +2 -2
- package/lib-commonjs/components/Reference/useReference.js.map +1 -1
- package/lib-commonjs/components/Reference/{useReferenceStyles.js → useReferenceStyles.styles.js} +2 -1
- package/lib-commonjs/components/Reference/useReferenceStyles.styles.js.map +1 -0
- package/lib-commonjs/components/ReferenceGroupToggle/ReferenceGroupToggle.js +2 -2
- package/lib-commonjs/components/ReferenceGroupToggle/ReferenceGroupToggle.js.map +1 -1
- package/lib-commonjs/components/ReferenceGroupToggle/ReferenceGroupToggle.types.js.map +1 -1
- package/lib-commonjs/components/ReferenceGroupToggle/index.js +1 -1
- package/lib-commonjs/components/ReferenceGroupToggle/index.js.map +1 -1
- package/lib-commonjs/components/ReferenceGroupToggle/useReferenceGroupToggle.js +3 -0
- package/lib-commonjs/components/ReferenceGroupToggle/useReferenceGroupToggle.js.map +1 -1
- package/lib-commonjs/components/ReferenceGroupToggle/{useReferenceGroupToggleStyles.js → useReferenceGroupToggleStyles.styles.js} +28 -2
- package/lib-commonjs/components/ReferenceGroupToggle/useReferenceGroupToggleStyles.styles.js.map +1 -0
- package/lib-commonjs/components/ReferenceList/ReferenceList.js +2 -2
- package/lib-commonjs/components/ReferenceList/ReferenceList.js.map +1 -1
- package/lib-commonjs/components/ReferenceList/index.js +1 -1
- package/lib-commonjs/components/ReferenceList/index.js.map +1 -1
- package/lib-commonjs/components/ReferenceList/useReferenceList.js +2 -2
- package/lib-commonjs/components/ReferenceList/useReferenceList.js.map +1 -1
- package/lib-commonjs/components/ReferenceList/{useReferenceListStyles.js → useReferenceListStyles.styles.js} +2 -1
- package/lib-commonjs/components/ReferenceList/useReferenceListStyles.styles.js.map +1 -0
- package/lib-commonjs/components/reference-v2/Reference/Reference.js +2 -2
- package/lib-commonjs/components/reference-v2/Reference/Reference.js.map +1 -1
- package/lib-commonjs/components/reference-v2/Reference/Reference.types.js.map +1 -1
- package/lib-commonjs/components/reference-v2/Reference/index.js +4 -4
- package/lib-commonjs/components/reference-v2/Reference/index.js.map +1 -1
- package/lib-commonjs/components/reference-v2/Reference/renderReference.js +1 -1
- package/lib-commonjs/components/reference-v2/Reference/renderReference.js.map +1 -1
- package/lib-commonjs/components/reference-v2/Reference/useReference.js +20 -19
- package/lib-commonjs/components/reference-v2/Reference/useReference.js.map +1 -1
- package/lib-commonjs/components/reference-v2/Reference/useReferenceStyles.styles.js +87 -0
- package/lib-commonjs/components/reference-v2/Reference/useReferenceStyles.styles.js.map +1 -0
- package/lib-commonjs/components/reference-v2/ReferenceList/ReferenceList.js +2 -2
- package/lib-commonjs/components/reference-v2/ReferenceList/ReferenceList.js.map +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceList/ReferenceList.types.js.map +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceList/index.js +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceList/index.js.map +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceList/useReferenceList.js +11 -9
- package/lib-commonjs/components/reference-v2/ReferenceList/useReferenceList.js.map +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceList/useReferenceListContextValues.js +5 -4
- package/lib-commonjs/components/reference-v2/ReferenceList/useReferenceListContextValues.js.map +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceList/{useReferenceListStyles.js → useReferenceListStyles.styles.js} +2 -1
- package/lib-commonjs/components/reference-v2/ReferenceList/useReferenceListStyles.styles.js.map +1 -0
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/ReferenceOverflowButton.js +2 -2
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/ReferenceOverflowButton.js.map +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/ReferenceOverflowButton.types.js.map +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/index.js +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/index.js.map +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/useReferenceOverflowButton.js +26 -17
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/useReferenceOverflowButton.js.map +1 -1
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/{useReferenceOverflowButtonStyles.js → useReferenceOverflowButtonStyles.styles.js} +3 -33
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/useReferenceOverflowButtonStyles.styles.js.map +1 -0
- package/lib-commonjs/contexts/reference-v2/referenceListContext.js +5 -4
- package/lib-commonjs/contexts/reference-v2/referenceListContext.js.map +1 -1
- package/lib-commonjs/hooks/reference-v2/useReferenceCitationPreview.js +17 -12
- package/lib-commonjs/hooks/reference-v2/useReferenceCitationPreview.js.map +1 -1
- package/lib-commonjs/hooks/useReferenceCitationPreview.js +6 -4
- package/lib-commonjs/hooks/useReferenceCitationPreview.js.map +1 -1
- package/package.json +10 -10
- package/lib/components/Citation/useCitationStyles.js.map +0 -1
- package/lib/components/Reference/useReferenceStyles.js.map +0 -1
- package/lib/components/ReferenceGroupToggle/useReferenceGroupToggleStyles.js.map +0 -1
- package/lib/components/ReferenceList/useReferenceListStyles.js.map +0 -1
- package/lib/components/reference-v2/Reference/useReferenceStyles.js +0 -71
- package/lib/components/reference-v2/Reference/useReferenceStyles.js.map +0 -1
- package/lib/components/reference-v2/ReferenceList/useReferenceListStyles.js.map +0 -1
- package/lib/components/reference-v2/ReferenceOverflowButton/useReferenceOverflowButtonStyles.js.map +0 -1
- package/lib-commonjs/components/Citation/useCitationStyles.js.map +0 -1
- package/lib-commonjs/components/Reference/useReferenceStyles.js.map +0 -1
- package/lib-commonjs/components/ReferenceGroupToggle/useReferenceGroupToggleStyles.js.map +0 -1
- package/lib-commonjs/components/ReferenceList/useReferenceListStyles.js.map +0 -1
- package/lib-commonjs/components/reference-v2/Reference/useReferenceStyles.js +0 -122
- package/lib-commonjs/components/reference-v2/Reference/useReferenceStyles.js.map +0 -1
- package/lib-commonjs/components/reference-v2/ReferenceList/useReferenceListStyles.js.map +0 -1
- package/lib-commonjs/components/reference-v2/ReferenceOverflowButton/useReferenceOverflowButtonStyles.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useReferenceCitationPreview.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\nimport {\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\nimport {\n Preview,\n PreviewContent,\n PreviewHeader,\n PreviewMetadata,\n PreviewSurface,\n PreviewTrigger,\n} from '@fluentui-copilot/react-preview';\nimport { SensitivityLabel } from '@fluentui-copilot/react-sensitivity-label';\nimport type { PreviewProps, PreviewSurfaceProps } from '@fluentui-copilot/react-preview';\nimport type { SensitivityLabelProps } from '@fluentui-copilot/react-sensitivity-label';\n\nimport { Citation } from '../Citation';\nimport { Reference } from '../Reference';\nimport type { CitationProps } from '../Citation';\nimport type { ReferenceProps } from '../Reference';\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, 'referenceHref'> &\n Partial<Pick<CitationProps, 'referenceHref'>>;\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 sensitivityLabelProps?: SensitivityLabelProps;\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 sensitivityLabelProps,\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 sensitivity and title here so that we can use the information from their children below.\n const sensitivity = slot.optional(referenceProps?.sensitivity, { 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} {...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 {sensitivity && (\n <SensitivityLabel description={sensitivityLabelProps?.description ?? ''}>\n {sensitivity.children}\n </SensitivityLabel>\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 }, [\n index,\n referenceId,\n citationId,\n referenceProps,\n citationProps,\n previewProps,\n previewSurfaceProps,\n sensitivityLabelProps,\n ]);\n\n return components;\n};\n"],"names":["React","Caption1","assertSlots","mergeCallbacks","slot","useId","usePopoverContext_unstable","Preview","PreviewContent","PreviewHeader","PreviewMetadata","PreviewSurface","PreviewTrigger","SensitivityLabel","Citation","Reference","CitationCloseButton","citationCloseButtonProps","setPopoverOpen","context","setOpen","onPopoverCloseClick","useCallback","ev","preventDefault","onCitationCloseButtonClick","onClick","useReferenceCitationPreview","index","referenceId","propsRefId","citationId","propsCiteId","citationProps","referenceProps","previewProps","previewSurfaceProps","sensitivityLabelProps","refId","citeId","components","useMemo","citationHref","PackagedReference","props","referenceIndex","CitationWithPreview","content","always","undefined","defaultProps","children","excerpt","elementType","citationWithPreviewState","sensitivity","optional","title","label","closeOnScroll","positioning","size","trapFocus","withArrow","id","citation","aria-label","referenceHref","tabIndex","media","icon","primaryText","secondaryText","tertiaryText","description"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["useReferenceCitationPreview.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport * as React from 'react';\nimport {\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\nimport {\n Preview,\n PreviewContent,\n PreviewHeader,\n PreviewMetadata,\n PreviewSurface,\n PreviewTrigger,\n} from '@fluentui-copilot/react-preview';\nimport { SensitivityLabel } from '@fluentui-copilot/react-sensitivity-label';\nimport type { PreviewHeaderProps, PreviewProps, PreviewSurfaceProps } from '@fluentui-copilot/react-preview';\nimport type { SensitivityLabelProps } from '@fluentui-copilot/react-sensitivity-label';\n\nimport { Citation } from '../Citation';\nimport { Reference } from '../Reference';\nimport type { CitationProps } from '../Citation';\nimport type { ReferenceProps } from '../Reference';\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, 'referenceHref'> &\n Partial<Pick<CitationProps, 'referenceHref'>>;\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 previewHeaderProps?: PreviewHeaderProps;\n previewProps?: PreviewProps;\n previewSurfaceProps?: PreviewSurfaceProps;\n sensitivityLabelProps?: SensitivityLabelProps;\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 previewHeaderProps,\n previewProps,\n previewSurfaceProps,\n sensitivityLabelProps,\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 sensitivity and title here so that we can use the information from their children below.\n const sensitivity = slot.optional(referenceProps?.sensitivity, { 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} {...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 {...previewHeaderProps}\n >\n {previewHeaderProps?.children ?? title?.children}\n </PreviewHeader>\n <PreviewMetadata\n icon={referenceProps?.icon}\n primaryText={referenceProps?.primaryText}\n secondaryText={referenceProps?.secondaryText}\n tertiaryText={referenceProps?.tertiaryText}\n />\n {sensitivity && (\n <SensitivityLabel description={sensitivityLabelProps?.description ?? ''}>\n {sensitivity.children}\n </SensitivityLabel>\n )}\n <citationWithPreviewState.content />\n {previewSurfaceProps?.children ?? previewProps?.children}\n </PreviewContent>\n </PreviewSurface>\n </Preview>\n );\n };\n\n return {\n Citation: CitationWithPreview,\n Reference: PackagedReference,\n };\n }, [\n index,\n referenceId,\n citationId,\n referenceProps,\n citationProps,\n previewHeaderProps,\n previewProps,\n previewSurfaceProps,\n sensitivityLabelProps,\n ]);\n\n return components;\n};\n"],"names":["React","Caption1","assertSlots","mergeCallbacks","slot","useId","usePopoverContext_unstable","Preview","PreviewContent","PreviewHeader","PreviewMetadata","PreviewSurface","PreviewTrigger","SensitivityLabel","Citation","Reference","CitationCloseButton","citationCloseButtonProps","setPopoverOpen","context","setOpen","onPopoverCloseClick","useCallback","ev","preventDefault","onCitationCloseButtonClick","onClick","useReferenceCitationPreview","index","referenceId","propsRefId","citationId","propsCiteId","citationProps","referenceProps","previewHeaderProps","previewProps","previewSurfaceProps","sensitivityLabelProps","refId","citeId","components","useMemo","citationHref","PackagedReference","props","referenceIndex","CitationWithPreview","content","always","undefined","defaultProps","children","excerpt","elementType","citationWithPreviewState","sensitivity","optional","title","label","closeOnScroll","positioning","size","trapFocus","withArrow","id","citation","aria-label","referenceHref","tabIndex","media","icon","primaryText","secondaryText","tertiaryText","description"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -3,5 +3,5 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
3
3
|
value: true
|
|
4
4
|
});
|
|
5
5
|
const _export_star = require("@swc/helpers/_/_export_star");
|
|
6
|
-
_export_star._(require("./components/reference-v2/ReferenceList"), exports);
|
|
6
|
+
_export_star._(require("./components/reference-v2/ReferenceList/index"), exports);
|
|
7
7
|
//# sourceMappingURL=ReferenceListV2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ReferenceListV2.ts"],"sourcesContent":["export * from './components/reference-v2/ReferenceList';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
|
|
1
|
+
{"version":3,"sources":["ReferenceListV2.ts"],"sourcesContent":["export * from './components/reference-v2/ReferenceList/index';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
|
|
@@ -3,5 +3,5 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
3
3
|
value: true
|
|
4
4
|
});
|
|
5
5
|
const _export_star = require("@swc/helpers/_/_export_star");
|
|
6
|
-
_export_star._(require("./components/reference-v2/ReferenceOverflowButton"), exports);
|
|
6
|
+
_export_star._(require("./components/reference-v2/ReferenceOverflowButton/index"), exports);
|
|
7
7
|
//# sourceMappingURL=ReferenceOverflowButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ReferenceOverflowButton.ts"],"sourcesContent":["export * from './components/reference-v2/ReferenceOverflowButton';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
|
|
1
|
+
{"version":3,"sources":["ReferenceOverflowButton.ts"],"sourcesContent":["export * from './components/reference-v2/ReferenceOverflowButton/index';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
|
|
@@ -3,5 +3,5 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
3
3
|
value: true
|
|
4
4
|
});
|
|
5
5
|
const _export_star = require("@swc/helpers/_/_export_star");
|
|
6
|
-
_export_star._(require("./components/reference-v2/Reference"), exports);
|
|
6
|
+
_export_star._(require("./components/reference-v2/Reference/index"), exports);
|
|
7
7
|
//# sourceMappingURL=ReferenceV2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ReferenceV2.ts"],"sourcesContent":["export * from './components/reference-v2/Reference';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
|
|
1
|
+
{"version":3,"sources":["ReferenceV2.ts"],"sourcesContent":["export * from './components/reference-v2/Reference/index';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
|
|
@@ -12,11 +12,11 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
|
|
|
12
12
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
13
|
const _useCitation = require("./useCitation");
|
|
14
14
|
const _renderCitation = require("./renderCitation");
|
|
15
|
-
const
|
|
15
|
+
const _useCitationStylesstyles = require("./useCitationStyles.styles");
|
|
16
16
|
const _reactprovider = require("@fluentui-copilot/react-provider");
|
|
17
17
|
const Citation = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
18
18
|
const state = (0, _useCitation.useCitation_unstable)(props, ref);
|
|
19
|
-
(0,
|
|
19
|
+
(0, _useCitationStylesstyles.useCitationStyles_unstable)(state);
|
|
20
20
|
(0, _reactprovider.useCustomStyleHook)('useCitationStyles')(state);
|
|
21
21
|
return (0, _renderCitation.renderCitation_unstable)(state);
|
|
22
22
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Citation.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCitation_unstable } from './useCitation';\nimport { renderCitation_unstable } from './renderCitation';\nimport { useCitationStyles_unstable } from './useCitationStyles';\nimport type { CitationProps } from './Citation.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n// Citation component - TODO: add more docs\nexport const Citation: ForwardRefComponent<CitationProps> = React.forwardRef((props, ref) => {\n const state = useCitation_unstable(props, ref);\n\n useCitationStyles_unstable(state);\n useCustomStyleHook('useCitationStyles')(state);\n\n return renderCitation_unstable(state);\n});\n\nCitation.displayName = 'Citation';\n"],"names":["Citation","React","forwardRef","props","state","useCitation_unstable","useCitationStyles_unstable","useCustomStyleHook","renderCitation_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;6BACc;gCACG;
|
|
1
|
+
{"version":3,"sources":["Citation.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useCitation_unstable } from './useCitation';\nimport { renderCitation_unstable } from './renderCitation';\nimport { useCitationStyles_unstable } from './useCitationStyles.styles';\nimport type { CitationProps } from './Citation.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n// Citation component - TODO: add more docs\nexport const Citation: ForwardRefComponent<CitationProps> = React.forwardRef((props, ref) => {\n const state = useCitation_unstable(props, ref);\n\n useCitationStyles_unstable(state);\n useCustomStyleHook('useCitationStyles')(state);\n\n return renderCitation_unstable(state);\n});\n\nCitation.displayName = 'Citation';\n"],"names":["Citation","React","forwardRef","props","state","useCitation_unstable","useCitationStyles_unstable","useCustomStyleHook","renderCitation_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;6BACc;gCACG;yCACG;+BAGR;AAG5B,MAAMA,WAAAA,WAAAA,GAAAA,OAA+CC,UAAMC,CAAU,CAACC,OAACA;UAC5EC,QAAMA,IAAAA,iCAAQC,EAAAA,OAAqBF;2DAEnCG,EAAAA;yCACAC,EAAAA,qBAAmBH;WAEnBI,IAAAA,uCAAOA,EAAAA;AACT;AAEAR,SAASS,WAAW,GAAG"}
|
|
@@ -7,5 +7,5 @@ _export_star._(require("./Citation"), exports);
|
|
|
7
7
|
_export_star._(require("./Citation.types"), exports);
|
|
8
8
|
_export_star._(require("./renderCitation"), exports);
|
|
9
9
|
_export_star._(require("./useCitation"), exports);
|
|
10
|
-
_export_star._(require("./useCitationStyles"), exports);
|
|
10
|
+
_export_star._(require("./useCitationStyles.styles"), exports);
|
|
11
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Citation';\nexport * from './Citation.types';\nexport * from './renderCitation';\nexport * from './useCitation';\nexport * from './useCitationStyles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Citation';\nexport * from './Citation.types';\nexport * from './renderCitation';\nexport * from './useCitation';\nexport * from './useCitationStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
|
package/lib-commonjs/components/Citation/{useCitationStyles.js → useCitationStyles.styles.js}
RENAMED
|
@@ -88,8 +88,9 @@ const useCitationRootStyles = (0, _reactcomponents.__styles)({
|
|
|
88
88
|
]
|
|
89
89
|
});
|
|
90
90
|
const useCitationStyles_unstable = (state)=>{
|
|
91
|
+
'use no memo';
|
|
91
92
|
const rootBaseClassName = useCitationBaseClassName();
|
|
92
93
|
const rootStyles = useCitationRootStyles();
|
|
93
94
|
state.root.className = (0, _reactcomponents.mergeClasses)(citationClassNames.root, state.isPopoverLocked && rootStyles.isPopoverLocked, state.block && rootStyles.isBlock, rootBaseClassName, state.root.className);
|
|
94
95
|
return state;
|
|
95
|
-
}; //# sourceMappingURL=useCitationStyles.js.map
|
|
96
|
+
}; //# sourceMappingURL=useCitationStyles.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useCitationStyles.styles.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};\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 'use no memo';\n\n const rootBaseClassName = useCitationBaseClassName();\n const rootStyles = useCitationRootStyles();\n\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\n return state;\n};\n"],"names":["citationClassNames","useCitationRootStyles","makeStyles","root","useCitationBaseClassName","makeResetStyles","display","__styles","justifyContent","boxSizing","alignItems","t21cq0","typographyStyles","caption2Strong","tokens","minWidth","height","verticalAlign","borderRadius","textDecoration","marginLeft","marginRight","Bgoe8wy","cursor","color","borderColor","colorBrandStroke2Hover","backgroundColor","state","className","mergeClasses","isPopoverLocked","rootStyles","block","isBlock","rootBaseClassName","colorBrandStroke2Pressed"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAWaA,kBAAAA;eAAAA;;IAwCPC,0BAAwBC;eAAxBD;;;iCA7CY;AAKX,MAAMD,qBAAoD;UAC/DG;AACF;AAEA,MAAMC,2BAA2BC,IAAAA,8BAAAA,EAAAA,WAAgB,YAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;CAAA;MAC/CC,wBAASC,IAAAA,yBAAA,EAAA;aACTC;QACAC,QAAAA;QACAC,QAAAA;YAAAA;YAAY;SAAA;QACZC,QAAGC;YAAAA;YAAiBC;SAAAA;;qBAGTC;QAEXC,QAAAA;QACAC,QAAQ;QACRC,QAAAA;YAAAA;YAAgB;SAAQL;QAExBM,SAAAA;QAEAC,QAAAA;YAAAA;YAAgB;SAAA;QAEhBC,QAAAA;QACAC,SAAAA;QAEAC,SAAA;iBACEC;YAAAA;YAAQ;SAAA;gBACRC;gBACAC;YAAAA;YAAaX;SAAOY;gBACpBC;;;;;QAIQ;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;QAAA;KAAA;;;QACkC;QAAA;QAAA;QAAA;QAAA;KAAA;;AAMxC1B,MAAAA,6BAAmC2B,CAAAA;;UAGrCR,oBAAYhB;UACZiB,aAAapB;UACfE,IAAA,CAAA0B,SAAA,GAAAC,IAAAA,6BAAA,EAAA9B,mBAAAG,IAAA,EAAAyB,MAAAG,eAAA,IAAAC,WAAAD,eAAA,EAAAH,MAAAK,KAAA,IAAAD,WAAAE,OAAA,EAAAC,mBAAAP,MAAAzB,IAAA,CAAA0B,SAAA;WACAE;uDAEmCK"}
|
|
@@ -12,11 +12,11 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
|
|
|
12
12
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
13
|
const _useReference = require("./useReference");
|
|
14
14
|
const _renderReference = require("./renderReference");
|
|
15
|
-
const
|
|
15
|
+
const _useReferenceStylesstyles = require("./useReferenceStyles.styles");
|
|
16
16
|
const _reactprovider = require("@fluentui-copilot/react-provider");
|
|
17
17
|
const Reference = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
18
18
|
const state = (0, _useReference.useReference_unstable)(props, ref);
|
|
19
|
-
(0,
|
|
19
|
+
(0, _useReferenceStylesstyles.useReferenceStyles_unstable)(state);
|
|
20
20
|
(0, _reactprovider.useCustomStyleHook)('useReferenceStyles')(state);
|
|
21
21
|
return (0, _renderReference.renderReference_unstable)(state);
|
|
22
22
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Reference.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReference_unstable } from './useReference';\nimport { renderReference_unstable } from './renderReference';\nimport { useReferenceStyles_unstable } from './useReferenceStyles';\nimport type { ReferenceProps } from './Reference.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n// Reference component - TODO: add more docs\nexport const Reference: ForwardRefComponent<ReferenceProps> = React.forwardRef((props, ref) => {\n const state = useReference_unstable(props, ref);\n\n useReferenceStyles_unstable(state);\n useCustomStyleHook('useReferenceStyles')(state);\n\n return renderReference_unstable(state);\n});\n\nReference.displayName = 'Reference';\n"],"names":["Reference","React","forwardRef","props","state","useReference_unstable","useReferenceStyles_unstable","useCustomStyleHook","renderReference_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;8BACe;iCACG;
|
|
1
|
+
{"version":3,"sources":["Reference.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReference_unstable } from './useReference';\nimport { renderReference_unstable } from './renderReference';\nimport { useReferenceStyles_unstable } from './useReferenceStyles.styles';\nimport type { ReferenceProps } from './Reference.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n// Reference component - TODO: add more docs\nexport const Reference: ForwardRefComponent<ReferenceProps> = React.forwardRef((props, ref) => {\n const state = useReference_unstable(props, ref);\n\n useReferenceStyles_unstable(state);\n useCustomStyleHook('useReferenceStyles')(state);\n\n return renderReference_unstable(state);\n});\n\nReference.displayName = 'Reference';\n"],"names":["Reference","React","forwardRef","props","state","useReference_unstable","useReferenceStyles_unstable","useCustomStyleHook","renderReference_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;8BACe;iCACG;0CACG;+BAGT;AAG5B,MAAMA,YAAAA,WAAAA,GAAAA,OAAiDC,UAAMC,CAAU,CAACC,OAACA;UAC9EC,QAAMA,IAAAA,mCAAQC,EAAAA,OAAsBF;6DAEpCG,EAAAA;yCACAC,EAAAA,sBAAmBH;WAEnBI,IAAAA,yCAAOA,EAAAA;AACT;AAEAR,UAAUS,WAAW,GAAG"}
|
|
@@ -7,5 +7,5 @@ _export_star._(require("./Reference"), exports);
|
|
|
7
7
|
_export_star._(require("./Reference.types"), exports);
|
|
8
8
|
_export_star._(require("./renderReference"), exports);
|
|
9
9
|
_export_star._(require("./useReference"), exports);
|
|
10
|
-
_export_star._(require("./useReferenceStyles"), exports);
|
|
10
|
+
_export_star._(require("./useReferenceStyles.styles"), exports);
|
|
11
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
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":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Reference';\nexport * from './Reference.types';\nexport * from './renderReference';\nexport * from './useReference';\nexport * from './useReferenceStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
|
|
@@ -12,7 +12,7 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
|
|
|
12
12
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
13
|
const _reactcomponents = require("@fluentui/react-components");
|
|
14
14
|
const _reacticons = require("@fluentui/react-icons");
|
|
15
|
-
const
|
|
15
|
+
const _useReferenceStylesstyles = require("./useReferenceStyles.styles");
|
|
16
16
|
const _Citation = require("../Citation");
|
|
17
17
|
const _ReferenceGroupContext = require("../../contexts/ReferenceGroupContext");
|
|
18
18
|
const _reactprovider = require("@fluentui-copilot/react-provider");
|
|
@@ -40,7 +40,7 @@ const useReference_unstable = (props, ref)=>{
|
|
|
40
40
|
});
|
|
41
41
|
if (media && /*#__PURE__*/ _react.isValidElement(media.children)) {
|
|
42
42
|
media.children = /*#__PURE__*/ _react.cloneElement(media.children, {
|
|
43
|
-
className: (0, _reactcomponents.mergeClasses)(media.children.props.className,
|
|
43
|
+
className: (0, _reactcomponents.mergeClasses)(media.children.props.className, _useReferenceStylesstyles.referenceExtraClassNames.mediaChild)
|
|
44
44
|
});
|
|
45
45
|
}
|
|
46
46
|
if (media === null || media === void 0 ? void 0 : media.id) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useReference.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Button,\n Caption1,\n getIntrinsicElementProps,\n mergeCallbacks,\n mergeClasses,\n slot,\n useId,\n usePopoverContext_unstable as usePopoverContext,\n} from '@fluentui/react-components';\nimport {\n ChevronDown24Regular,\n ChevronUp24Regular,\n ChevronDown16Regular,\n ChevronUp16Regular,\n} from '@fluentui/react-icons';\nimport { referenceExtraClassNames } from './useReferenceStyles';\nimport { Citation } from '../Citation';\nimport type { ReferenceProps, ReferenceState } from './Reference.types';\nimport { useReferenceGroupSetOpen } from '../../contexts/ReferenceGroupContext';\nimport { useCopilotMode } from '@fluentui-copilot/react-provider';\n\n/**\n * Create the state required to render Reference.\n *\n * The returned state can be modified with hooks such as useReferenceStyles_unstable,\n * before being passed to renderReference_unstable.\n *\n * @param props - props from this instance of Reference\n * @param ref - reference to root HTMLElement of Reference\n */\nexport const useReference_unstable = (props: ReferenceProps, ref: React.Ref<HTMLDivElement>): ReferenceState => {\n const { index, referenceId, citationHref, excerpt, layout = 'inline' } = props;\n\n const mode = useCopilotMode(props.mode);\n\n const labelId = useId();\n const mediaId = useId();\n const [isExpanded, setIsExpanded] = React.useState(layout === 'popover' ? true : false);\n\n const setPopoverOpen = usePopoverContext(context => context.setOpen);\n\n const onExpandClick: React.MouseEventHandler<HTMLButtonElement> = _e => {\n setIsExpanded(!isExpanded);\n };\n\n const label = slot.always(props.label, {\n defaultProps: { id: labelId },\n elementType: 'div',\n });\n const media = slot.optional(props.media, { defaultProps: { id: mediaId }, elementType: 'div' });\n if (media && React.isValidElement<HTMLElement>(media.children)) {\n media.children = React.cloneElement(media.children, {\n className: mergeClasses(media.children.props.className, referenceExtraClassNames.mediaChild),\n });\n }\n\n if (media?.id) {\n label['aria-describedby'] = label['aria-describedby']?.concat(media.id) ?? media.id;\n }\n\n const ariaLabelledByProp = props['aria-labelledby'];\n const groupSemantics = React.useMemo(() => {\n return layout === 'inline'\n ? {\n role: 'group',\n 'aria-labelledby': `${ariaLabelledByProp ?? ''} ${label.id}`,\n tabIndex: -1,\n }\n : {};\n }, [layout, ariaLabelledByProp, label.id]);\n\n // Within a popup, a citation should function as a close button\n const citationProps = React.useMemo(() => {\n const onPopoverCloseClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n setPopoverOpen(e, false);\n\n // don't navigate\n e.preventDefault();\n };\n\n return layout === 'popover'\n ? {\n referenceHref: '#',\n tabIndex: -1,\n 'aria-label': `Reference ${index}, close`,\n onClick: onPopoverCloseClick,\n }\n : {\n referenceHref: citationHref,\n };\n }, [layout, citationHref, index, setPopoverOpen]);\n\n const state: ReferenceState = {\n isExpanded,\n mode: layout === 'popover' ? 'sidecar' : mode,\n layout,\n index,\n components: {\n root: 'div',\n citation: 'div',\n media: 'div',\n actions: 'div',\n label: 'div',\n sensitivity: 'span',\n metadata: 'div',\n content: 'div',\n primaryText: 'span',\n secondaryText: 'span',\n tertiaryText: 'span',\n icon: 'span',\n detailsButton: Button,\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n id: referenceId,\n ...groupSemantics,\n ...props,\n }),\n { elementType: 'div' },\n ),\n citation: slot.optional(props.citation, {\n defaultProps: {\n children: (\n <Citation block {...citationProps}>\n {index}\n </Citation>\n ),\n },\n renderByDefault: true,\n elementType: 'div',\n }),\n media,\n actions: slot.optional(layout === 'inline' ? props.actions : null, {\n renderByDefault: true,\n elementType: 'div',\n }),\n label,\n sensitivity: slot.optional(props.sensitivity, { elementType: 'span' }),\n metadata: slot.always(props.metadata, { elementType: 'div' }),\n primaryText: slot.optional(props.primaryText, {\n defaultProps: {\n hidden: !isExpanded,\n },\n elementType: 'span',\n }),\n secondaryText: slot.optional(props.secondaryText, {\n defaultProps: {\n hidden: !isExpanded,\n },\n elementType: 'span',\n }),\n tertiaryText: slot.optional(props.tertiaryText, {\n defaultProps: {\n hidden: !isExpanded,\n },\n elementType: 'span',\n }),\n icon: slot.optional(props.icon, { elementType: 'span' }),\n content: slot.always(props.content, {\n defaultProps: {\n children: excerpt && <Caption1>{excerpt}</Caption1>,\n },\n elementType: 'div',\n }),\n detailsButton: slot.optional(layout === 'inline' ? props.detailsButton : null, {\n defaultProps: {\n appearance: 'transparent',\n 'aria-expanded': isExpanded,\n 'aria-label': 'show details',\n size: mode === 'sidecar' ? 'small' : 'medium',\n icon: {\n children: getIcon(isExpanded, mode),\n },\n },\n renderByDefault: true,\n elementType: Button,\n }),\n };\n\n if (state.detailsButton) {\n const onClick = state.detailsButton.onClick as React.MouseEventHandler<HTMLButtonElement>;\n state.detailsButton.onClick = mergeCallbacks(onClick, onExpandClick);\n }\n\n const referenceGroupSetOpen = useReferenceGroupSetOpen();\n const onTargettedByCitation = (e: React.FocusEvent<HTMLElement>) => {\n const relatedTargetHash: string | undefined = (e.relatedTarget as HTMLAnchorElement)?.hash;\n if (relatedTargetHash && relatedTargetHash.substring(1) === referenceId) {\n referenceGroupSetOpen();\n setIsExpanded(true);\n }\n };\n state.root.onFocus = mergeCallbacks(state.root.onFocus, onTargettedByCitation);\n\n return state;\n};\n\nconst getIcon = (isExpanded: boolean, mode: ReferenceProps['mode']): JSX.Element => {\n if (mode === 'sidecar') {\n return !isExpanded ? <ChevronDown16Regular /> : <ChevronUp16Regular />;\n }\n\n return !isExpanded ? <ChevronDown24Regular /> : <ChevronUp24Regular />;\n};\n"],"names":["index","citationHref","ref","referenceId","mediaId","isExpanded","excerpt","setPopoverOpen","layout","onExpandClick","mode","useCopilotMode","props","labelId","slot","always","defaultProps","usePopoverContext","context","setOpen","elementType","_e","setIsExpanded","label","media","children","React","className","mergeClasses","referenceExtraClassNames","mediaChild","id","_label_ariadescribedby_concat","_label_ariadescribedby","concat","ariaLabelledByProp","tabIndex","onPopoverCloseClick","e","useMemo","referenceHref","state","components","root","citation","actions","sensitivity","metadata","primaryText","secondaryText","tertiaryText","detailsButton","Button","optional","Citation","hidden","icon","content","createElement","Caption1","appearance","size","onClick","mergeCallbacks","onTargettedByCitation","_e_relatedTarget","relatedTargetHash","onFocus","getIcon","ChevronDown24Regular","ChevronDown16Regular","ChevronUp24Regular","ChevronUp16Regular"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["useReference.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n Button,\n Caption1,\n getIntrinsicElementProps,\n mergeCallbacks,\n mergeClasses,\n slot,\n useId,\n usePopoverContext_unstable as usePopoverContext,\n} from '@fluentui/react-components';\nimport {\n ChevronDown24Regular,\n ChevronUp24Regular,\n ChevronDown16Regular,\n ChevronUp16Regular,\n} from '@fluentui/react-icons';\nimport { referenceExtraClassNames } from './useReferenceStyles.styles';\nimport { Citation } from '../Citation';\nimport type { ReferenceProps, ReferenceState } from './Reference.types';\nimport { useReferenceGroupSetOpen } from '../../contexts/ReferenceGroupContext';\nimport { useCopilotMode } from '@fluentui-copilot/react-provider';\n\n/**\n * Create the state required to render Reference.\n *\n * The returned state can be modified with hooks such as useReferenceStyles_unstable,\n * before being passed to renderReference_unstable.\n *\n * @param props - props from this instance of Reference\n * @param ref - reference to root HTMLElement of Reference\n */\nexport const useReference_unstable = (props: ReferenceProps, ref: React.Ref<HTMLDivElement>): ReferenceState => {\n const { index, referenceId, citationHref, excerpt, layout = 'inline' } = props;\n\n const mode = useCopilotMode(props.mode);\n\n const labelId = useId();\n const mediaId = useId();\n const [isExpanded, setIsExpanded] = React.useState(layout === 'popover' ? true : false);\n\n const setPopoverOpen = usePopoverContext(context => context.setOpen);\n\n const onExpandClick: React.MouseEventHandler<HTMLButtonElement> = _e => {\n setIsExpanded(!isExpanded);\n };\n\n const label = slot.always(props.label, {\n defaultProps: { id: labelId },\n elementType: 'div',\n });\n const media = slot.optional(props.media, { defaultProps: { id: mediaId }, elementType: 'div' });\n if (media && React.isValidElement<HTMLElement>(media.children)) {\n media.children = React.cloneElement(media.children, {\n className: mergeClasses(media.children.props.className, referenceExtraClassNames.mediaChild),\n });\n }\n\n if (media?.id) {\n label['aria-describedby'] = label['aria-describedby']?.concat(media.id) ?? media.id;\n }\n\n const ariaLabelledByProp = props['aria-labelledby'];\n const groupSemantics = React.useMemo(() => {\n return layout === 'inline'\n ? {\n role: 'group',\n 'aria-labelledby': `${ariaLabelledByProp ?? ''} ${label.id}`,\n tabIndex: -1,\n }\n : {};\n }, [layout, ariaLabelledByProp, label.id]);\n\n // Within a popup, a citation should function as a close button\n const citationProps = React.useMemo(() => {\n const onPopoverCloseClick = (e: React.MouseEvent<HTMLAnchorElement>) => {\n setPopoverOpen(e, false);\n\n // don't navigate\n e.preventDefault();\n };\n\n return layout === 'popover'\n ? {\n referenceHref: '#',\n tabIndex: -1,\n 'aria-label': `Reference ${index}, close`,\n onClick: onPopoverCloseClick,\n }\n : {\n referenceHref: citationHref,\n };\n }, [layout, citationHref, index, setPopoverOpen]);\n\n const state: ReferenceState = {\n isExpanded,\n mode: layout === 'popover' ? 'sidecar' : mode,\n layout,\n index,\n components: {\n root: 'div',\n citation: 'div',\n media: 'div',\n actions: 'div',\n label: 'div',\n sensitivity: 'span',\n metadata: 'div',\n content: 'div',\n primaryText: 'span',\n secondaryText: 'span',\n tertiaryText: 'span',\n icon: 'span',\n detailsButton: Button,\n },\n root: slot.always(\n getIntrinsicElementProps('div', {\n ref,\n id: referenceId,\n ...groupSemantics,\n ...props,\n }),\n { elementType: 'div' },\n ),\n citation: slot.optional(props.citation, {\n defaultProps: {\n children: (\n <Citation block {...citationProps}>\n {index}\n </Citation>\n ),\n },\n renderByDefault: true,\n elementType: 'div',\n }),\n media,\n actions: slot.optional(layout === 'inline' ? props.actions : null, {\n renderByDefault: true,\n elementType: 'div',\n }),\n label,\n sensitivity: slot.optional(props.sensitivity, { elementType: 'span' }),\n metadata: slot.always(props.metadata, { elementType: 'div' }),\n primaryText: slot.optional(props.primaryText, {\n defaultProps: {\n hidden: !isExpanded,\n },\n elementType: 'span',\n }),\n secondaryText: slot.optional(props.secondaryText, {\n defaultProps: {\n hidden: !isExpanded,\n },\n elementType: 'span',\n }),\n tertiaryText: slot.optional(props.tertiaryText, {\n defaultProps: {\n hidden: !isExpanded,\n },\n elementType: 'span',\n }),\n icon: slot.optional(props.icon, { elementType: 'span' }),\n content: slot.always(props.content, {\n defaultProps: {\n children: excerpt && <Caption1>{excerpt}</Caption1>,\n },\n elementType: 'div',\n }),\n detailsButton: slot.optional(layout === 'inline' ? props.detailsButton : null, {\n defaultProps: {\n appearance: 'transparent',\n 'aria-expanded': isExpanded,\n 'aria-label': 'show details',\n size: mode === 'sidecar' ? 'small' : 'medium',\n icon: {\n children: getIcon(isExpanded, mode),\n },\n },\n renderByDefault: true,\n elementType: Button,\n }),\n };\n\n if (state.detailsButton) {\n const onClick = state.detailsButton.onClick as React.MouseEventHandler<HTMLButtonElement>;\n state.detailsButton.onClick = mergeCallbacks(onClick, onExpandClick);\n }\n\n const referenceGroupSetOpen = useReferenceGroupSetOpen();\n const onTargettedByCitation = (e: React.FocusEvent<HTMLElement>) => {\n const relatedTargetHash: string | undefined = (e.relatedTarget as HTMLAnchorElement)?.hash;\n if (relatedTargetHash && relatedTargetHash.substring(1) === referenceId) {\n referenceGroupSetOpen();\n setIsExpanded(true);\n }\n };\n state.root.onFocus = mergeCallbacks(state.root.onFocus, onTargettedByCitation);\n\n return state;\n};\n\nconst getIcon = (isExpanded: boolean, mode: ReferenceProps['mode']): JSX.Element => {\n if (mode === 'sidecar') {\n return !isExpanded ? <ChevronDown16Regular /> : <ChevronUp16Regular />;\n }\n\n return !isExpanded ? <ChevronDown24Regular /> : <ChevronUp24Regular />;\n};\n"],"names":["index","citationHref","ref","referenceId","mediaId","isExpanded","excerpt","setPopoverOpen","layout","onExpandClick","mode","useCopilotMode","props","labelId","slot","always","defaultProps","usePopoverContext","context","setOpen","elementType","_e","setIsExpanded","label","media","children","React","className","mergeClasses","referenceExtraClassNames","mediaChild","id","_label_ariadescribedby_concat","_label_ariadescribedby","concat","ariaLabelledByProp","tabIndex","onPopoverCloseClick","e","useMemo","referenceHref","state","components","root","citation","actions","sensitivity","metadata","primaryText","secondaryText","tertiaryText","detailsButton","Button","optional","Citation","hidden","icon","content","createElement","Caption1","appearance","size","onClick","mergeCallbacks","onTargettedByCitation","_e_relatedTarget","relatedTargetHash","onFocus","getIcon","ChevronDown24Regular","ChevronDown16Regular","ChevronUp24Regular","ChevronUp16Regular"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
package/lib-commonjs/components/Reference/{useReferenceStyles.js → useReferenceStyles.styles.js}
RENAMED
|
@@ -317,6 +317,7 @@ const useLabelStyles = (0, _reactcomponents.__styles)({
|
|
|
317
317
|
]
|
|
318
318
|
});
|
|
319
319
|
const useReferenceStyles_unstable = (state)=>{
|
|
320
|
+
'use no memo';
|
|
320
321
|
const { isExpanded, mode, layout } = state;
|
|
321
322
|
const rootClassName = useReferenceClassName();
|
|
322
323
|
const styles = useStyles();
|
|
@@ -357,4 +358,4 @@ const useReferenceStyles_unstable = (state)=>{
|
|
|
357
358
|
state.detailsButton.className = (0, _reactcomponents.mergeClasses)(referenceClassNames.detailsButton, styles.detailsButton, state.detailsButton.className);
|
|
358
359
|
}
|
|
359
360
|
return state;
|
|
360
|
-
}; //# sourceMappingURL=useReferenceStyles.js.map
|
|
361
|
+
}; //# sourceMappingURL=useReferenceStyles.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useReferenceStyles.styles.ts"],"sourcesContent":["import {\n buttonClassNames,\n makeResetStyles,\n makeStyles,\n mergeClasses,\n shorthands,\n tokens,\n typographyStyles,\n} from '@fluentui/react-components';\nimport type { ReferenceSlots, ReferenceState } from './Reference.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const referenceClassNames: SlotClassNames<ReferenceSlots> = {\n root: 'fai-Reference',\n citation: 'fai-Reference__citation',\n media: 'fai-Reference__media',\n actions: 'fai-Reference__actions',\n sensitivity: 'fai-Reference__sensitivity',\n metadata: 'fai-Reference__metadata',\n primaryText: 'fai-Reference__primaryText',\n secondaryText: 'fai-Reference__secondaryText',\n tertiaryText: 'fai-Reference__tertiaryText',\n icon: 'fai-Reference__icon',\n label: 'fai-Reference__label',\n content: 'fai-Reference__content',\n detailsButton: 'fai-Reference__detailsButton',\n};\n\nexport const referenceExtraClassNames = {\n text: 'fai-Reference__text',\n mediaChild: 'fai-Reference__mediaChild',\n};\n\nconst labelFontSize = typographyStyles.caption1Strong.fontSize;\nconst labelLineHeight = typographyStyles.caption1Strong.lineHeight;\n\nconst maxPopoverWidth = '256px';\n\nconst useReferenceClassName = makeResetStyles({\n boxSizing: 'border-box',\n width: '100%',\n display: 'grid',\n gridTemplateAreas: `\n \"citation media title actions\"\n \". . title .\"\n \"sensitivityLabel sensitivityLabel sensitivityLabel sensitivityLabel\"\n \"metadata metadata metadata metadata\"\n \"content content content content\"\n `,\n gridTemplateColumns: 'min-content min-content 1fr min-content',\n gridTemplateRows: '32px auto auto auto auto',\n border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n borderRadius: tokens.borderRadiusMedium,\n padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`,\n boxShadow: 'none',\n columnGap: tokens.spacingHorizontalXS,\n alignItems: 'center',\n});\n\nconst useStyles = makeStyles({\n canvas: {},\n sidecar: {\n gridTemplateRows: '24px auto auto auto',\n ...shorthands.padding(tokens.spacingVerticalXS, tokens.spacingHorizontalS),\n },\n inline: {},\n popover: {\n ...shorthands.borderWidth('0px'),\n width: `calc(${maxPopoverWidth} - (${tokens.spacingHorizontalM} * 2))`,\n ...shorthands.padding('0px'),\n },\n closed: {\n rowGap: 0,\n },\n citation: {\n ...shorthands.gridArea('citation'),\n },\n media: {\n ...shorthands.gridArea('media'),\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n mediaPopover: {\n width: '16px',\n height: '16px',\n\n [`> .${referenceExtraClassNames.mediaChild}`]: {\n width: '16px',\n height: '16px',\n },\n },\n actions: {\n ...shorthands.gridArea('actions'),\n justifySelf: 'end',\n display: 'flex',\n gridRowStart: 1,\n },\n detailsButton: {\n [`> ${buttonClassNames.icon}`]: {\n color: tokens.colorNeutralForeground3,\n },\n },\n sensitivity: {\n ...shorthands.gridArea('sensitivityLabel'),\n justifySelf: 'start',\n },\n metadata: {\n marginTop: tokens.spacingVerticalXS,\n\n ...shorthands.gridArea('metadata'),\n ...typographyStyles.caption2,\n },\n metadataSubsequentText: {\n position: 'relative',\n marginLeft: tokens.spacingHorizontalS,\n\n '&::before': {\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n left: `calc(${tokens.spacingHorizontalS} / -2)`,\n top: `calc((${typographyStyles.caption2.lineHeight} - ${typographyStyles.caption2.fontSize}) / 2)`,\n height: typographyStyles.caption2.fontSize,\n ...shorthands.borderLeft(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke2),\n },\n },\n icon: {\n ...typographyStyles.caption2,\n verticalAlign: 'middle',\n },\n content: {\n marginTop: tokens.spacingVerticalXS,\n ...shorthands.gridArea('content'),\n display: 'flex',\n flexDirection: 'column',\n rowGap: tokens.spacingVerticalS,\n color: tokens.colorNeutralForeground3,\n wordBreak: 'break-word',\n },\n hidden: {\n display: 'none',\n },\n});\n\nconst useLabelStyles = makeStyles({\n root: {\n ...shorthands.gridArea('title'),\n alignSelf: 'start',\n ...typographyStyles.caption1Strong,\n wordBreak: 'break-word',\n '-webkit-box-orient': 'vertical',\n '-webkit-line-clamp': '2',\n display: '-webkit-box',\n overflowY: 'hidden',\n },\n\n canvas: {\n // 24px is the height of the tallest element within the reference\n paddingTop: `calc((24px / 2 ) - (${labelLineHeight} - ${labelFontSize}))`,\n },\n\n sidecar: {\n // 16px is the height of the tallest element within the reference\n paddingTop: `calc((16px / 2 ) - (${labelLineHeight} - ${labelFontSize}))`,\n },\n\n closed: {\n maxWidth: '100%',\n '-webkit-line-clamp': '1',\n },\n});\n\n/**\n * Apply styling to the Reference slots based on the state\n */\nexport const useReferenceStyles_unstable = (state: ReferenceState): ReferenceState => {\n 'use no memo';\n\n const { isExpanded, mode, layout } = state;\n\n const rootClassName = useReferenceClassName();\n const styles = useStyles();\n const labelStyles = useLabelStyles();\n state.root.className = mergeClasses(\n referenceClassNames.root,\n rootClassName,\n styles[mode],\n styles[layout],\n !isExpanded && styles.closed,\n state.root.className,\n );\n\n if (state.citation) {\n state.citation.className = mergeClasses(referenceClassNames.citation, styles.citation, state.citation.className);\n }\n\n if (state.media) {\n state.media.className = mergeClasses(\n referenceClassNames.media,\n styles.media,\n layout === 'popover' && styles.mediaPopover,\n state.media.className,\n );\n }\n\n if (state.actions) {\n state.actions.className = mergeClasses(referenceClassNames.actions, styles.actions, state.actions.className);\n }\n\n state.label.className = mergeClasses(\n referenceClassNames.label,\n labelStyles.root,\n labelStyles[mode],\n !isExpanded && labelStyles.closed,\n state.label.className,\n );\n\n if (state.sensitivity) {\n state.sensitivity.className = mergeClasses(\n referenceClassNames.sensitivity,\n styles.sensitivity,\n !isExpanded && styles.hidden,\n state.sensitivity.className,\n );\n }\n\n state.metadata.className = mergeClasses(\n referenceClassNames.metadata,\n styles.metadata,\n !isExpanded && styles.hidden,\n state.metadata.className,\n );\n\n let isSubsequentText = false;\n if (state.primaryText) {\n state.primaryText.className = mergeClasses(\n referenceClassNames.primaryText,\n referenceExtraClassNames.text,\n isSubsequentText && styles.metadataSubsequentText,\n state.primaryText.className,\n );\n isSubsequentText = true;\n }\n\n if (state.secondaryText) {\n state.secondaryText.className = mergeClasses(\n referenceClassNames.secondaryText,\n referenceExtraClassNames.text,\n isSubsequentText && styles.metadataSubsequentText,\n state.secondaryText.className,\n );\n isSubsequentText = true;\n }\n\n if (state.tertiaryText) {\n state.tertiaryText.className = mergeClasses(\n referenceClassNames.tertiaryText,\n referenceExtraClassNames.text,\n isSubsequentText && styles.metadataSubsequentText,\n state.tertiaryText.className,\n );\n isSubsequentText = true;\n }\n\n if (state.icon) {\n state.icon.className = mergeClasses(referenceClassNames.icon, styles.icon, state.icon.className);\n }\n state.content.className = mergeClasses(\n referenceClassNames.content,\n styles.content,\n !isExpanded && styles.hidden,\n state.content.className,\n );\n\n if (state.detailsButton) {\n state.detailsButton.className = mergeClasses(\n referenceClassNames.detailsButton,\n styles.detailsButton,\n state.detailsButton.className,\n );\n }\n\n return state;\n};\n"],"names":["referenceClassNames","referenceExtraClassNames","state","mergeClasses","root","citation","media","actions","sensitivity","metadata","primaryText","secondaryText","tertiaryText","icon","label","content","detailsButton","text","mediaChild","labelFontSize","typographyStyles","caption1Strong","fontSize","labelLineHeight","lineHeight","maxPopoverWidth","useReferenceClassName","makeResetStyles","boxSizing","__styles","width","display","gridTemplateAreas","gridTemplateColumns","gridTemplateRows","border","strokeWidthThin","borderRadius","padding","spacingVerticalS","boxShadow","columnGap","alignItems","Byoj8tv","uwmqm3","useStyles","makeStyles","sidecar","inline","popover","shorthands","closed","rowGap","nk6f5a","Bt984gj","justifyContent","psn4ub","mediaPopover","height","Bdqf98w","justifySelf","color","Ijaq50","marginTop","Be2twd7","metadataSubsequentText","position","left","top","uvfttm","flexDirection","wordBreak","hidden","Bw0ie65","mc9l5x","Beiy3e4","useLabelStyles","alignSelf","canvas","paddingTop","Br312pm","Bahqtrf","maxWidth","Biipf1f","Fd1uvx","Bh9c35c","Bmxbyg5","z8tnut","rootClassName","labelStyles","B2u0y6b","isSubsequentText","isExpanded","className","styles","mode","layout"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
|
@@ -12,10 +12,10 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
|
|
|
12
12
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
13
|
const _useReferenceGroupToggle = require("./useReferenceGroupToggle");
|
|
14
14
|
const _renderReferenceGroupToggle = require("./renderReferenceGroupToggle");
|
|
15
|
-
const
|
|
15
|
+
const _useReferenceGroupToggleStylesstyles = require("./useReferenceGroupToggleStyles.styles");
|
|
16
16
|
const ReferenceGroupToggle = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
17
17
|
const state = (0, _useReferenceGroupToggle.useReferenceGroupToggle_unstable)(props, ref);
|
|
18
|
-
(0,
|
|
18
|
+
(0, _useReferenceGroupToggleStylesstyles.useReferenceGroupToggleStyles_unstable)(state);
|
|
19
19
|
return (0, _renderReferenceGroupToggle.renderReferenceGroupToggle_unstable)(state);
|
|
20
20
|
});
|
|
21
21
|
ReferenceGroupToggle.displayName = 'ReferenceGroupToggle'; //# sourceMappingURL=ReferenceGroupToggle.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ReferenceGroupToggle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReferenceGroupToggle_unstable } from './useReferenceGroupToggle';\nimport { renderReferenceGroupToggle_unstable } from './renderReferenceGroupToggle';\nimport { useReferenceGroupToggleStyles_unstable } from './useReferenceGroupToggleStyles';\nimport type { ReferenceGroupToggleProps } from './ReferenceGroupToggle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n// ReferenceGroupToggle component - TODO: add more docs\nexport const ReferenceGroupToggle: ForwardRefComponent<ReferenceGroupToggleProps> = React.forwardRef((props, ref) => {\n const state = useReferenceGroupToggle_unstable(props, ref);\n\n useReferenceGroupToggleStyles_unstable(state);\n return renderReferenceGroupToggle_unstable(state);\n});\n\nReferenceGroupToggle.displayName = 'ReferenceGroupToggle';\n"],"names":["ReferenceGroupToggle","React","forwardRef","props","state","useReferenceGroupToggle_unstable","useReferenceGroupToggleStyles_unstable","renderReferenceGroupToggle_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;yCAC0B;4CACG
|
|
1
|
+
{"version":3,"sources":["ReferenceGroupToggle.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReferenceGroupToggle_unstable } from './useReferenceGroupToggle';\nimport { renderReferenceGroupToggle_unstable } from './renderReferenceGroupToggle';\nimport { useReferenceGroupToggleStyles_unstable } from './useReferenceGroupToggleStyles.styles';\nimport type { ReferenceGroupToggleProps } from './ReferenceGroupToggle.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\n// ReferenceGroupToggle component - TODO: add more docs\nexport const ReferenceGroupToggle: ForwardRefComponent<ReferenceGroupToggleProps> = React.forwardRef((props, ref) => {\n const state = useReferenceGroupToggle_unstable(props, ref);\n\n useReferenceGroupToggleStyles_unstable(state);\n return renderReferenceGroupToggle_unstable(state);\n});\n\nReferenceGroupToggle.displayName = 'ReferenceGroupToggle';\n"],"names":["ReferenceGroupToggle","React","forwardRef","props","state","useReferenceGroupToggle_unstable","useReferenceGroupToggleStyles_unstable","renderReferenceGroupToggle_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;yCAC0B;4CACG;qDACG;AAKhD,MAAMA,uBAAAA,WAAAA,GAAAA,OAAuEC,UAAMC,CAAU,CAACC,OAACA;UACpGC,QAAMA,IAAAA,yDAAQC,EAAAA,OAAiCF;mFAE/CG,EAAAA;WACAC,IAAAA,+DAAOA,EAAAA;AACT;AAEAP,qBAAqBQ,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ReferenceGroupToggle.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type ReferenceGroupToggleSlots = {\n root: NonNullable<Slot<'button'>>;\n icon?: Slot<'span'>;\n};\n\n/**\n * ReferenceGroupToggle Props\n */\nexport type ReferenceGroupToggleProps = ComponentProps<ReferenceGroupToggleSlots> & {\n
|
|
1
|
+
{"version":3,"sources":["ReferenceGroupToggle.types.ts"],"sourcesContent":["import type { CopilotMode } from '@fluentui-copilot/react-provider';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-components';\n\nexport type ReferenceGroupToggleSlots = {\n root: NonNullable<Slot<'button'>>;\n icon?: Slot<'span'>;\n};\n\n/**\n * ReferenceGroupToggle Props\n */\nexport type ReferenceGroupToggleProps = ComponentProps<ReferenceGroupToggleSlots> &\n CopilotMode & {\n isOpen?: boolean;\n };\n\n/**\n * State used in rendering ReferenceGroupToggle\n */\nexport type ReferenceGroupToggleState = ComponentState<ReferenceGroupToggleSlots> &\n Required<Pick<ReferenceGroupToggleProps, 'isOpen' | 'mode'>>;\n"],"names":[],"rangeMappings":";;","mappings":"AAgBA;;CAEC"}
|
|
@@ -7,5 +7,5 @@ _export_star._(require("./ReferenceGroupToggle"), exports);
|
|
|
7
7
|
_export_star._(require("./ReferenceGroupToggle.types"), exports);
|
|
8
8
|
_export_star._(require("./renderReferenceGroupToggle"), exports);
|
|
9
9
|
_export_star._(require("./useReferenceGroupToggle"), exports);
|
|
10
|
-
_export_star._(require("./useReferenceGroupToggleStyles"), exports);
|
|
10
|
+
_export_star._(require("./useReferenceGroupToggleStyles.styles"), exports);
|
|
11
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './ReferenceGroupToggle';\nexport * from './ReferenceGroupToggle.types';\nexport * from './renderReferenceGroupToggle';\nexport * from './useReferenceGroupToggle';\nexport * from './useReferenceGroupToggleStyles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './ReferenceGroupToggle';\nexport * from './ReferenceGroupToggle.types';\nexport * from './renderReferenceGroupToggle';\nexport * from './useReferenceGroupToggle';\nexport * from './useReferenceGroupToggleStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
|
|
@@ -12,9 +12,12 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
|
|
|
12
12
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
13
|
const _reactcomponents = require("@fluentui/react-components");
|
|
14
14
|
const _reacticons = require("@fluentui/react-icons");
|
|
15
|
+
const _reactprovider = require("@fluentui-copilot/react-provider");
|
|
15
16
|
const useReferenceGroupToggle_unstable = (props, ref)=>{
|
|
16
17
|
const { isOpen = false } = props;
|
|
18
|
+
const mode = (0, _reactprovider.useCopilotMode)(props.mode);
|
|
17
19
|
return {
|
|
20
|
+
mode,
|
|
18
21
|
isOpen,
|
|
19
22
|
components: {
|
|
20
23
|
root: 'button',
|
|
@@ -1 +1 @@
|
|
|
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":["isOpen","props","root","ref","type","getIntrinsicElementProps","elementType","icon","defaultProps","optional","renderByDefault","React","createElement","ChevronUp16Regular","ChevronDown16Regular"],"rangeMappings":"
|
|
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';\nimport { useCopilotMode } from '@fluentui-copilot/react-provider';\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 const mode = useCopilotMode(props.mode);\n return {\n mode,\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":["isOpen","props","components","root","ref","type","getIntrinsicElementProps","elementType","icon","defaultProps","optional","renderByDefault","React","createElement","ChevronUp16Regular","ChevronDown16Regular"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAmBUA;;;eAAAA;;;;iEAnBa;iCACwB;4BACU;+BAE1B;AAe7B,MAAQA,mCAAmBC,CAAAA,OAAAA;UAE3B,EACAD,SAAO,KAAA;UAELA,OAAAA,IAAAA,6BAAAA,EAAAA,MAAAA,IAAAA;WACAE;;;oBAGA;kBACAC;kBAEIC;;mCAEAC,CAAAA,MAAM,CAAAC,IAAAA,yCAAA,EAAA,UAAA;;6BAGRN;kBAAEO;eAAsBN,KAAA;YAE1BO;yBACEC;;mCAEA,CAAAC,QAAA,CAAAT,MAAAO,IAAA,EAAA;0BACAG;0BACAJ,SAAa,WAAA,GAAAK,OAAAC,aAAA,CAAAC,8BAAA,EAAA,QAAA,WAAA,GAAAF,OAAAC,aAAA,CAAAE,gCAAA,EAAA;;YAEjBJ,iBAAA;YACAJ,aAAA"}
|
|
@@ -28,12 +28,38 @@ const useButtonBaseClassName = (0, _reactcomponents.__resetStyles)("rctdkan", "r
|
|
|
28
28
|
const useIconBaseClassName = (0, _reactcomponents.__resetStyles)("r18biwo", null, [
|
|
29
29
|
".r18biwo{display:inline-flex;align-items:center;}"
|
|
30
30
|
]);
|
|
31
|
+
const useStyles = (0, _reactcomponents.__styles)({
|
|
32
|
+
canvas: {
|
|
33
|
+
Bahqtrf: "fk6fouc",
|
|
34
|
+
Be2twd7: "fy9rknc",
|
|
35
|
+
Bhrd7zp: "figsok6",
|
|
36
|
+
Bg96gwp: "fwrc4pm"
|
|
37
|
+
},
|
|
38
|
+
sidecar: {
|
|
39
|
+
Bahqtrf: "fk6fouc",
|
|
40
|
+
Be2twd7: "f13mqy1h",
|
|
41
|
+
Bhrd7zp: "figsok6",
|
|
42
|
+
Bg96gwp: "fcpl73t"
|
|
43
|
+
}
|
|
44
|
+
}, {
|
|
45
|
+
d: [
|
|
46
|
+
".fk6fouc{font-family:var(--fontFamilyBase);}",
|
|
47
|
+
".fy9rknc{font-size:var(--fontSizeBase200);}",
|
|
48
|
+
".figsok6{font-weight:var(--fontWeightRegular);}",
|
|
49
|
+
".fwrc4pm{line-height:var(--lineHeightBase200);}",
|
|
50
|
+
".f13mqy1h{font-size:var(--fontSizeBase100);}",
|
|
51
|
+
".fcpl73t{line-height:var(--lineHeightBase100);}"
|
|
52
|
+
]
|
|
53
|
+
});
|
|
31
54
|
const useReferenceGroupToggleStyles_unstable = (state)=>{
|
|
55
|
+
'use no memo';
|
|
56
|
+
const { mode } = state;
|
|
57
|
+
const styles = useStyles();
|
|
32
58
|
const iconBaseClassName = useIconBaseClassName();
|
|
33
59
|
const buttonBaseClassName = useButtonBaseClassName();
|
|
34
|
-
state.root.className = (0, _reactcomponents.mergeClasses)(referenceGroupToggleClassNames.root, buttonBaseClassName, state.root.className);
|
|
60
|
+
state.root.className = (0, _reactcomponents.mergeClasses)(referenceGroupToggleClassNames.root, buttonBaseClassName, styles[mode], state.root.className);
|
|
35
61
|
if (state.icon) {
|
|
36
62
|
state.icon.className = (0, _reactcomponents.mergeClasses)(referenceGroupToggleClassNames.icon, iconBaseClassName, state.icon.className);
|
|
37
63
|
}
|
|
38
64
|
return state;
|
|
39
|
-
}; //# sourceMappingURL=useReferenceGroupToggleStyles.js.map
|
|
65
|
+
}; //# sourceMappingURL=useReferenceGroupToggleStyles.styles.js.map
|
package/lib-commonjs/components/ReferenceGroupToggle/useReferenceGroupToggleStyles.styles.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useReferenceGroupToggleStyles.styles.ts"],"sourcesContent":["import {\n makeResetStyles,\n makeStyles,\n mergeClasses,\n shorthands,\n tokens,\n typographyStyles,\n} 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\nconst useStyles = makeStyles({\n canvas: { ...typographyStyles.caption1 },\n sidecar: {\n ...typographyStyles.caption2,\n },\n});\n\n/**\n * Apply styling to the ReferenceGroupToggle slots based on the state\n */\nexport const useReferenceGroupToggleStyles_unstable = (state: ReferenceGroupToggleState): ReferenceGroupToggleState => {\n 'use no memo';\n\n const { mode } = state;\n const styles = useStyles();\n\n const iconBaseClassName = useIconBaseClassName();\n const buttonBaseClassName = useButtonBaseClassName();\n state.root.className = mergeClasses(\n referenceGroupToggleClassNames.root,\n buttonBaseClassName,\n styles[mode],\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(referenceGroupToggleClassNames.icon, iconBaseClassName, state.icon.className);\n }\n\n return state;\n};\n"],"names":["referenceGroupToggleClassNames","typographyStyles","root","icon","useButtonBaseClassName","makeResetStyles","display","__resetStyles","columnGap","tokens","spacingHorizontalSNudge","alignItems","Bahqtrf","border","backgroundColor","color","shorthands","Be2twd7","Bhrd7zp","useIconBaseClassName","d","useStyles","state","styles","iconBaseClassName","buttonBaseClassName","className","mergeClasses","mode"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAWaA,8BAAAA;eAAAA;;IA0BNC,sCAAyB;eAAzBA;;;iCA/BW;AAKX,MAAMD,iCAA4E;UACvFE;UACAC;AACF;AAEA,MAAMC,yBAAyBC,IAAAA,8BAAAA,EAAAA,WAAgB,WAAA;IAAA;IAAA;CAAA;MAC7CC,uBAASC,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;CAAA;MACTC,YAAWC,IAAAA,yBAAOC,EAAAA;YAClBC;QACAC,SAAGX;QACHY,SAAQ;QACRC,SAAAA;QACAC,SAAON;;aAEA;QACPG,SAAGI;QACLC,SAAA;QAEAC,SAAMC;QACJb,SAAS;;AAEX,GAAA;IAEAc,GAAA;QAAMC;QAAuB;QAAA;QAAA;QAAA;QAAA;KAAA;;MAGtBpB,yCAAyBqB,CAAAA;;IAIhC,MAAA,QAEC,GACDA;UACEC,SAAAF;UAEAG,oBAAiBF;UACjBG,sBAAeJ;UAEfnB,IAAMsB,CAAAA,SAAAA,GAAAA,IAAAA,6BAAoBL,EAAAA,+BAAAA,IAAAA,EAAAA,qBAAAA,MAAAA,CAAAA,KAAAA,EAAAA,MAAAA,IAAAA,CAAAA,SAAAA;QAC1BG,MAAMG,IAAAA,EAAAA;QACNH,MAAMpB,IAAI,CAACwB,SAAS,GAAGC,IAAAA,6BAAAA,EACrB3B,+BAA+BE,IAAI,EACnCuB,mBAAAA,MACAF,IAAOK,CAAAA,SACPN;;WAIAA;mEAGKA"}
|
|
@@ -12,11 +12,11 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
|
|
|
12
12
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
13
|
const _useReferenceList = require("./useReferenceList");
|
|
14
14
|
const _renderReferenceList = require("./renderReferenceList");
|
|
15
|
-
const
|
|
15
|
+
const _useReferenceListStylesstyles = require("./useReferenceListStyles.styles");
|
|
16
16
|
const _reactprovider = require("@fluentui-copilot/react-provider");
|
|
17
17
|
const ReferenceList = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
18
18
|
const state = (0, _useReferenceList.useReferenceList_unstable)(props, ref);
|
|
19
|
-
(0,
|
|
19
|
+
(0, _useReferenceListStylesstyles.useReferenceListStyles_unstable)(state);
|
|
20
20
|
(0, _reactprovider.useCustomStyleHook)('useReferenceListStyles')(state);
|
|
21
21
|
return (0, _renderReferenceList.renderReferenceList_unstable)(state);
|
|
22
22
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["ReferenceList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReferenceList_unstable } from './useReferenceList';\nimport { renderReferenceList_unstable } from './renderReferenceList';\nimport { useReferenceListStyles_unstable } from './useReferenceListStyles';\nimport type { ReferenceListProps } from './ReferenceList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n//ReferenceList component - TODO: add more docs\nexport const ReferenceList: ForwardRefComponent<ReferenceListProps> = React.forwardRef((props, ref) => {\n const state = useReferenceList_unstable(props, ref);\n\n useReferenceListStyles_unstable(state);\n useCustomStyleHook('useReferenceListStyles')(state);\n\n return renderReferenceList_unstable(state);\n});\n\nReferenceList.displayName = 'ReferenceList';\n"],"names":["ReferenceList","React","forwardRef","props","state","useReferenceList_unstable","useReferenceListStyles_unstable","useCustomStyleHook","renderReferenceList_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;kCACmB;qCACG;
|
|
1
|
+
{"version":3,"sources":["ReferenceList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useReferenceList_unstable } from './useReferenceList';\nimport { renderReferenceList_unstable } from './renderReferenceList';\nimport { useReferenceListStyles_unstable } from './useReferenceListStyles.styles';\nimport type { ReferenceListProps } from './ReferenceList.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n//ReferenceList component - TODO: add more docs\nexport const ReferenceList: ForwardRefComponent<ReferenceListProps> = React.forwardRef((props, ref) => {\n const state = useReferenceList_unstable(props, ref);\n\n useReferenceListStyles_unstable(state);\n useCustomStyleHook('useReferenceListStyles')(state);\n\n return renderReferenceList_unstable(state);\n});\n\nReferenceList.displayName = 'ReferenceList';\n"],"names":["ReferenceList","React","forwardRef","props","state","useReferenceList_unstable","useReferenceListStyles_unstable","useCustomStyleHook","renderReferenceList_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;;iEATU;kCACmB;qCACG;8CACG;+BAGb;AAG5B,MAAMA,gBAAAA,WAAAA,GAAAA,OAAyDC,UAAMC,CAAU,CAACC,OAACA;UACtFC,QAAMA,IAAAA,2CAAQC,EAAAA,OAA0BF;qEAExCG,EAAAA;yCACAC,EAAAA,0BAAmBH;WAEnBI,IAAAA,iDAAOA,EAAAA;AACT;AAEAR,cAAcS,WAAW,GAAG"}
|
|
@@ -7,5 +7,5 @@ _export_star._(require("./ReferenceList"), exports);
|
|
|
7
7
|
_export_star._(require("./ReferenceList.types"), exports);
|
|
8
8
|
_export_star._(require("./renderReferenceList"), exports);
|
|
9
9
|
_export_star._(require("./useReferenceList"), exports);
|
|
10
|
-
_export_star._(require("./useReferenceListStyles"), exports);
|
|
10
|
+
_export_star._(require("./useReferenceListStyles.styles"), exports);
|
|
11
11
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
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":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './ReferenceList';\nexport * from './ReferenceList.types';\nexport * from './renderReferenceList';\nexport * from './useReferenceList';\nexport * from './useReferenceListStyles.styles';\n"],"names":[],"rangeMappings":";;;;;;;;;","mappings":";;;;;uBAAc;uBACA;uBACA;uBACA;uBACA"}
|
|
@@ -11,7 +11,7 @@ Object.defineProperty(exports, "useReferenceList_unstable", {
|
|
|
11
11
|
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
12
12
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
13
|
const _reactcomponents = require("@fluentui/react-components");
|
|
14
|
-
const
|
|
14
|
+
const _useReferenceListStylesstyles = require("./useReferenceListStyles.styles");
|
|
15
15
|
const useReferenceList_unstable = (props, ref)=>{
|
|
16
16
|
return {
|
|
17
17
|
components: {
|
|
@@ -21,7 +21,7 @@ const useReferenceList_unstable = (props, ref)=>{
|
|
|
21
21
|
ref,
|
|
22
22
|
...props,
|
|
23
23
|
children: _react.Children.map(props.children, (child)=>/*#__PURE__*/ _react.createElement("li", {
|
|
24
|
-
className:
|
|
24
|
+
className: _useReferenceListStylesstyles.referenceListItemClassName
|
|
25
25
|
}, child))
|
|
26
26
|
}), {
|
|
27
27
|
elementType: 'ol'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useReferenceList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-components';\nimport type { ReferenceListProps, ReferenceListState } from './ReferenceList.types';\nimport { referenceListItemClassName } from './useReferenceListStyles';\n\n// If you add JSX to this file, be sure to change the file type to .tsx\n\n/**\n * Create the state required to render ReferenceList.\n *\n * The returned state can be modified with hooks such as useReferenceListStyles_unstable,\n * before being passed to renderReferenceList_unstable.\n *\n * @param props - props from this instance of ReferenceList\n * @param ref - reference to root HTMLElement of ReferenceList\n */\nexport const useReferenceList_unstable = (\n props: ReferenceListProps,\n ref: React.Ref<HTMLOListElement>,\n): ReferenceListState => {\n return {\n components: {\n root: 'ol',\n },\n root: slot.always(\n getIntrinsicElementProps('ol', {\n ref,\n ...props,\n children: React.Children.map(props.children, child => <li className={referenceListItemClassName}>{child}</li>),\n }),\n { elementType: 'ol' },\n ),\n };\n};\n"],"names":["useReferenceList_unstable","props","ref","components","root","children","className","referenceListItemClassName","child"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAoBSA;;;eAAAA;;;;iEApBc;iCACwB;
|
|
1
|
+
{"version":3,"sources":["useReferenceList.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-components';\nimport type { ReferenceListProps, ReferenceListState } from './ReferenceList.types';\nimport { referenceListItemClassName } from './useReferenceListStyles.styles';\n\n// If you add JSX to this file, be sure to change the file type to .tsx\n\n/**\n * Create the state required to render ReferenceList.\n *\n * The returned state can be modified with hooks such as useReferenceListStyles_unstable,\n * before being passed to renderReferenceList_unstable.\n *\n * @param props - props from this instance of ReferenceList\n * @param ref - reference to root HTMLElement of ReferenceList\n */\nexport const useReferenceList_unstable = (\n props: ReferenceListProps,\n ref: React.Ref<HTMLOListElement>,\n): ReferenceListState => {\n return {\n components: {\n root: 'ol',\n },\n root: slot.always(\n getIntrinsicElementProps('ol', {\n ref,\n ...props,\n children: React.Children.map(props.children, child => <li className={referenceListItemClassName}>{child}</li>),\n }),\n { elementType: 'ol' },\n ),\n };\n};\n"],"names":["useReferenceList_unstable","props","ref","components","root","children","className","referenceListItemClassName","child"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAoBSA;;;eAAAA;;;;iEApBc;iCACwB;8CAEJ;AAiBzC,MAAOA,4BAAA,CAAAC,OAAAC;WACLC;oBACEC;kBACF;;mCAGIF,CAAAA,MAAAA,CAAAA,IAAAA,yCAAAA,EAAAA,MAAAA;;oBAEAG;6BAA0DC,QAAAA,CAAWC,GAAAA,CAAAA,MAAAA,QAAAA,EAAAA,CAAAA,QAAAA,WAAAA,GAAAA,OAAAA,aAAAA,CAAAA,MAAAA;+BAA6BC,wDAAAA;mBACpGA;;yBACoB;QAExB;IACA"}
|
|
@@ -31,6 +31,7 @@ const referenceListItemClassName = 'fai-ReferenceList__item';
|
|
|
31
31
|
".rc0s888>.fai-ReferenceList__item{list-style-type:none;}"
|
|
32
32
|
]);
|
|
33
33
|
const useReferenceListStyles_unstable = (state)=>{
|
|
34
|
+
'use no memo';
|
|
34
35
|
state.root.className = (0, _reactcomponents.mergeClasses)(referenceListClassNames.root, useRootClassName(), state.root.className);
|
|
35
36
|
return state;
|
|
36
|
-
}; //# sourceMappingURL=useReferenceListStyles.js.map
|
|
37
|
+
}; //# sourceMappingURL=useReferenceListStyles.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useReferenceListStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, tokens } from '@fluentui/react-components';\nimport type { ReferenceListSlots, ReferenceListState } from './ReferenceList.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const referenceListClassNames: SlotClassNames<ReferenceListSlots> = {\n root: 'fai-ReferenceList',\n};\n\nexport const referenceListItemClassName = 'fai-ReferenceList__item';\n\n/**\n * Styles for the root slot\n */\nconst useRootClassName = makeResetStyles({\n padding: 0,\n margin: 0,\n display: 'flex',\n flexDirection: 'column',\n gap: tokens.spacingVerticalS,\n\n [`> .${referenceListItemClassName}`]: {\n listStyleType: 'none',\n },\n});\n\n/**\n * Apply styling to the ReferenceList slots based on the state\n */\nexport const useReferenceListStyles_unstable = (state: ReferenceListState): ReferenceListState => {\n 'use no memo';\n\n state.root.className = mergeClasses(referenceListClassNames.root, useRootClassName(), state.root.className);\n\n return state;\n};\n"],"names":["referenceListClassNames","referenceListItemClassName","tokens","root","padding","__resetStyles","gap","state","className","mergeClasses","useRootClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAIaA,uBAAAA;eAAAA;;IAIAC,0BAAAA;eAAAA;;IAUNC,+BAAuB;eAAvBA;;;iCAlBuC;AAIvC,MAAMF,0BAA8D;UACzEG;AACF;AAEO,MAAMF,6BAA6B;AAE1C;;CAEC,SAECG,mBAASC,IAAAA,8BAAA,EAAA,WAAA,MAAA;IAAA;IAAA;CAAA;AAITC,MAAKJ,kCAAuBK,CAAAA;;UAI5BJ,IAAA,CAAAK,SAAA,GAAAC,IAAAA,6BAAA,EAAAT,wBAAAG,IAAA,EAAAO,oBAAAH,MAAAJ,IAAA,CAAAK,SAAA;IACF,OAAAD;AAEA"}
|
|
@@ -12,10 +12,10 @@ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildc
|
|
|
12
12
|
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
13
13
|
const _useReference = require("./useReference");
|
|
14
14
|
const _renderReference = require("./renderReference");
|
|
15
|
-
const
|
|
15
|
+
const _useReferenceStylesstyles = require("./useReferenceStyles.styles");
|
|
16
16
|
const Reference = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
17
17
|
const state = (0, _useReference.useReference_unstable)(props, ref);
|
|
18
|
-
(0,
|
|
18
|
+
(0, _useReferenceStylesstyles.useReferenceStyles_unstable)(state);
|
|
19
19
|
return (0, _renderReference.renderReference_unstable)(state);
|
|
20
20
|
});
|
|
21
21
|
Reference.displayName = 'Reference'; //# sourceMappingURL=Reference.js.map
|