koval-ui/dist/src/lib/Navigation/NavPanel.cjs.map

React components collection with minimalistic design. Supports theming, layout, and input validation.

{"version":3,"file":"NavPanel.cjs","sources":["../../../../src/lib/Navigation/NavPanel.tsx"],"sourcesContent":["import type {ReactElement, ReactNode} from 'react';\nimport {Children, cloneElement, useMemo} from 'react';\nimport {forwardRef} from 'react';\nimport classNames from 'classnames';\n\nimport type {DataAttributes, LibraryProps} from '@/internal/LibraryAPI';\nimport {useIsOverflow} from '@/internal/hooks/useIsOverflow.ts';\nimport {useInternalRef} from '@/internal/hooks/useInternalRef.ts';\n\nimport classes from './Navigation.module.css';\nimport {NavBrand} from './NavBrand.tsx';\n\nexport type Props = DataAttributes &\n    LibraryProps & {\n        /**\n         * Provide a site/app name to render inside the panel on the left\n         */\n        name?: string;\n        children?: ReactNode;\n        /**\n         * Enable to make the panel sticky\n         */\n        sticky?: boolean;\n    };\n\nexport const NavPanel = forwardRef<HTMLDivElement, Props>(\n    ({children, className, name = 'Koval App', sticky, ...nativeProps}, ref) => {\n        const internalRef = useInternalRef(ref);\n        const {overflowX} = useIsOverflow(internalRef);\n        const childrenWithProps = useMemo(\n            () =>\n                Children.toArray(children).map(element =>\n                    cloneElement(element as ReactElement, {collapsed: overflowX})\n                ),\n            [children, overflowX]\n        );\n        return (\n            <div\n                {...nativeProps}\n                className={classNames(classes.navPanel, {[classes.sticky]: sticky}, className)}\n                ref={internalRef}>\n                {name && <NavBrand>{name}</NavBrand>}\n                {childrenWithProps}\n            </div>\n        );\n    }\n);\n\nNavPanel.displayName = 'NavPanel';\n"],"names":["NavPanel","forwardRef","children","className","name","sticky","nativeProps","ref","internalRef","useInternalRef","overflowX","useIsOverflow","childrenWithProps","useMemo","Children","cloneElement","element","jsxs","classNames","classes","jsx","NavBrand"],"mappings":"2VAyBaA,EAAWC,EAAAA,WACpB,CAAC,CAAC,SAAAC,EAAU,UAAAC,EAAW,KAAAC,EAAO,YAAa,OAAAC,EAAQ,GAAGC,CAAA,EAAcC,IAAQ,CACxE,MAAMC,EAAcC,EAAAA,eAAeF,CAAG,EAChC,CAAC,UAAAG,CAAA,EAAaC,EAAAA,cAAcH,CAAW,EACvCI,EAAoBC,EAAAA,QACtB,IACIC,WAAS,QAAQZ,CAAQ,EAAE,OACvBa,EAAAA,aAAaC,EAAyB,CAAC,UAAWN,EAAU,CAAA,EAEpE,CAACR,EAAUQ,CAAS,CAAA,EAExB,OACIO,EAAAA,KAAC,MAAA,CACI,GAAGX,EACJ,UAAWY,EAAWC,EAAAA,QAAQ,SAAU,CAAC,CAACA,EAAAA,QAAQ,MAAM,EAAGd,CAAA,EAASF,CAAS,EAC7E,IAAKK,EACJ,SAAA,CAAAJ,GAAQgB,EAAAA,IAACC,EAAAA,UAAU,SAAAjB,CAAA,CAAK,EACxBQ,CAAA,CAAA,CAAA,CAGb,CACJ,EAEAZ,EAAS,YAAc"}