upsetjs import type { ISetLike } from '@upsetjs/model' ; import React , { PropsWithChildren } from 'react' ; import type { UpSetAddon , UpSetAddonProps } from '../interfaces' ; import CombinationSelectionChart from './CombinationSelectionChart' ; import type { UpSetDataInfo } from '../derive/deriveDataDependent' ; import type { UpSetSizeInfo } from '../derive/deriveSizeDependent' ; import type { UpSetStyleInfo } from '../derive/deriveStyleDependent' ; import LabelsSelection from './LabelsSelection' ; import SetSelectionChart from './SetSelectionChart' ; import UpSetSelectionChart from './UpSetSelectionChart' ; import { generateSelectionOverlap , elemElemOverlapOf , isSetLike , generateSelectionName } from '../utils' ; const EMPTY_ARRAY = [ ] ; export default function UpSetSelection < T > ( { size , data , style , selection , hasHover , } ) { const empty = style . emptySelection ; const selectionOverlap = generateSelectionOverlap ( selection , data . overlapGuesser , data . toElemKey ) ; const selectionName = generateSelectionName ( selection ) ; const someAddon = size . sets . addons . some ( ( s ) => s . renderSelection != null ) || size . cs . addons . some ( ( s ) => s . renderSelection != null ) ; const selectionElemOverlap = selection && typeof selection !== 'function' && someAddon ? elemElemOverlapOf ( Array . isArray ( selection ) ? selection : ( selection as ISetLike < T > ) . elems , data . toElemKey ) : null ; function wrapAddon < S extends ISetLike < T > > ( addon ) { return { ... addon , render : ( props ) => { const overlap = selectionElemOverlap ? selectionElemOverlap ( props . set ) : null ; return addon . renderSelection ? addon . renderSelection ( { selection , selectionColor : style . selectionColor || props . set . color || 'orange' , overlap , ... props , } ) : null ; } , } ; } return ( < g className = { hasHover ? `pnone-${ style . id }` : undefined } > { ( selection || empty ) && ( < CombinationSelectionChart data = { data } size = { size } style = { style } transform = { `translate(${ size . cs . x },${ size . cs . y })` } empty = { empty && ! selection } elemOverlap = { selectionOverlap } suffix = { `Selection-${ style . id }` } tooltip = { hasHover ? undefined : selectionName } combinationAddons = { size . cs . addons . length === 0 ? EMPTY_ARRAY : size . cs . addons . map ( wrapAddon ) } / > ) } { ( selection || empty ) && ( < SetSelectionChart data = { data } size = { size } style = { style } transform = { `translate(${ size . sets . x },${ size . sets . y })` } empty = { empty && ! selection } elemOverlap = { selectionOverlap } suffix = { `Selection-${ style . id }` } tooltip = { hasHover ? undefined : selectionName } setAddons = { size . sets . addons . length === 0 ? EMPTY_ARRAY : size . sets . addons . map ( wrapAddon ) } / > ) } < g transform = { `translate(${ size . labels . x },${ size . labels . y })` } > { isSetLike ( selection ) && < LabelsSelection data = { data } size = { size } style = { style } selection = { selection } / > } { isSetLike ( selection ) && < UpSetSelectionChart data = { data } size = { size } style = { style } selection = { selection } / > } < /g> < /g>); }