export function ChooseShareWhere()

in blocks/multiplatform/choose-share/blocks/where/index.tsx [86:115]
27 lines of code
3 McCabe index (conditional complexity)

export function ChooseShareWhere({ className }: { className?: string }) {
    const textCn = useTextStyles();
    const isMS = useMS();
    const [activeIndex, setActiveIndex] = useState(0);

    const navigateToHash = useTabScroll(TABS_BLOCKS, 'choose-share-where-', setActiveIndex);

    return (
        <section className={cn(className, styles.wrap, 'ktl-layout', 'ktl-layout--center')}>
            <h2 className={cn(styles.title, textCn('rs-h2'))}>Choose where to share</h2>

            <div role="tablist">
                <ChipList
                    size={isMS ? 'm' : 'l'}
                    alignItems={'center'}
                    compact={true}
                    value={activeIndex}
                    onChange={v => setActiveIndex(v)}
                    className={cn(styles.tabs, 'rs-docs-offset-top-12')}
                    mode={'rock'}
                >
                    {TABS_BLOCKS.map(({ id, tab, Icon }, i) => (
                        <Chip key={id} icon={<Icon size={isMS ? 'm' : 'l'} />} href={`#choose-share-where-${id}`}
                              id={`choose-share-where-${id}-tab`} role="tab"
                              aria-controls={`choose-share-where-${id}-pane`}
                              className={styles.tab} aria-label={`Go to ${id} section`}
                              onClick={navigateToHash} {...(activeIndex === i && { 'aria-selected': true })}>
                            {tab}
                        </Chip>
                    ))}