{"version":3,"file":"NavTabs.cjs","sources":["../../../../src/components/tabs/NavTabs.tsx"],"sourcesContent":["import clsx from \"clsx\";\nimport React, { useEffect, useRef, useState } from \"react\";\nimport type { NavTabsProps } from \"./types.js\";\n\nexport const NavTabs = ({\n    \"aria-label\": ariaLabel,\n    children,\n    className,\n    ...rest\n}: NavTabsProps) => {\n    const [tabsRect, setTabsRect] = useState<DOMRect>();\n    const [activeRect, setActiveRect] = useState<DOMRect>();\n\n    const scrollRef = useRef<HTMLDivElement>(null);\n    const tablistRef = useRef<HTMLDivElement>(null);\n    const activeRef = useRef<HTMLElement>(null);\n\n    const selectedIndex = React.Children.toArray(children).findIndex(\n        (navTab) => {\n            if (!React.isValidElement(navTab)) {\n                return false;\n            }\n            return navTab.props[\"aria-selected\"] === true;\n        },\n    );\n\n    // biome-ignore lint/correctness/useExhaustiveDependencies:\n    useEffect(() => {\n        if (tablistRef.current) {\n            setTabsRect(tablistRef.current.getBoundingClientRect());\n        }\n        if (activeRef.current) {\n            setActiveRect(activeRef.current.getBoundingClientRect());\n        }\n    }, [selectedIndex]);\n\n    return (\n        <div {...rest} className={clsx(\"jkl-tabs\", className)} ref={scrollRef}>\n            <div\n                role=\"tablist\"\n                aria-label={ariaLabel}\n                ref={tablistRef}\n                className=\"jkl-tablist\"\n            >\n                {React.Children.map(children, (child, index) => {\n                    return React.isValidElement(child)\n                        ? React.cloneElement<any>(child, {\n                              ref:\n                                  selectedIndex === index\n                                      ? activeRef\n                                      : undefined,\n                          })\n                        : null;\n                })}\n                <span\n                    className=\"jkl-tablist__indicator\"\n                    style={{\n                        left:\n                            (activeRect?.left || 0) -\n                            (tabsRect?.left || 0) +\n                            (scrollRef.current?.scrollLeft || 0),\n                        bottom: -1,\n                        width:\n                            (activeRect?.width || 0) -\n                            (Number.parseFloat(\n                                getComputedStyle(\n                                    document.documentElement,\n                                ).getPropertyValue(\"--jkl-unit-50\"),\n                            ) || 40),\n                    }}\n                />\n            </div>\n        </div>\n    );\n};\n"],"names":["ariaLabel","children","className","rest","tabsRect","setTabsRect","useState","activeRect","setActiveRect","scrollRef","useRef","tablistRef","activeRef","selectedIndex","React","Children","toArray","findIndex","navTab","isValidElement","props","useEffect","current","getBoundingClientRect","jsx","clsx","ref","jsxs","role","map","child","index","cloneElement","style","left","scrollLeft","bottom","width","Number","parseFloat","getComputedStyle","document","documentElement","getPropertyValue"],"mappings":"gMAIuB,EACnB,aAAcA,EACdC,SAAAA,EACAC,UAAAA,KACGC,MAEH,MAAOC,EAAUC,GAAeC,cACzBC,EAAYC,GAAiBF,aAE9BG,EAAYC,EAAAA,OAAuB,MACnCC,EAAaD,EAAAA,OAAuB,MACpCE,EAAYF,EAAAA,OAAoB,MAEhCG,EAAgBC,EAAMC,SAASC,QAAQf,GAAUgB,UAClDC,KACQJ,EAAMK,eAAeD,KAGe,IAAlCA,EAAOE,MAAM,kBAK5BC,OAAAA,EAAAA,UAAU,KACFV,EAAWW,SACXjB,EAAYM,EAAWW,QAAQC,yBAE/BX,EAAUU,SACVd,EAAcI,EAAUU,QAAQC,0BAErC,CAACV,IAGAW,EAAAA,IAAC,MAAA,IAAQrB,EAAMD,UAAWuB,EAAAA,KAAK,WAAYvB,GAAYwB,IAAKjB,EACxDR,SAAA0B,EAAAA,KAAC,MAAA,CACGC,KAAK,UACL,aAAY5B,EACZ0B,IAAKf,EACLT,UAAU,cAETD,SAAA,CAAAa,EAAMC,SAASc,IAAI5B,EAAU,CAAC6B,EAAOC,IAC3BjB,EAAMK,eAAeW,GACtBhB,EAAMkB,aAAkBF,EAAO,CAC3BJ,IACIb,IAAkBkB,EACZnB,OACA,IAEd,MAEVY,EAAAA,IAAC,OAAA,CACGtB,UAAU,yBACV+B,MAAO,CACHC,MACK3B,GAAY2B,MAAQ,IACpB9B,GAAU8B,MAAQ,IAClBzB,EAAUa,SAASa,YAAc,GACtCC,QAAQ,EACRC,OACK9B,GAAY8B,OAAS,IACrBC,OAAOC,WACJC,iBACIC,SAASC,iBACXC,iBAAiB,mBAClB"}