{"version":3,"file":"Scroller.cjs","sources":["../../../src/components/Scroller/Scroller.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type ComponentType,\n  type PropsWithChildren,\n  forwardRef,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { debounce } from '../../libs/debounce'\nimport { useSectionWrapper } from '../SectioningContent'\n\ntype AbstractProps = PropsWithChildren<\n  VariantProps<typeof classNameGenerator> & {\n    as?: string | ComponentType<any>\n  }\n>\ntype Props = AbstractProps & Omit<ComponentPropsWithoutRef<'div'>, keyof AbstractProps | 'tabIndex'>\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-Scroller',\n  variants: {\n    direction: {\n      horizontal: '',\n      vertical: '',\n      both: '',\n    },\n    styleType: {\n      auto: '',\n      scroll: '',\n    },\n  },\n  compoundVariants: [\n    {\n      direction: 'vertical',\n      styleType: 'auto',\n      className: 'shr-overflow-y-auto shr-overflow-x-hidden',\n    },\n    {\n      direction: 'horizontal',\n      styleType: 'auto',\n      className: 'shr-overflow-x-auto shr-overflow-y-hidden',\n    },\n    {\n      direction: 'both',\n      styleType: 'auto',\n      className: 'shr-overflow-auto',\n    },\n    {\n      direction: 'vertical',\n      styleType: 'scroll',\n      className: 'shr-overflow-x-hidden shr-overflow-y-scroll',\n    },\n    {\n      direction: 'horizontal',\n      styleType: 'scroll',\n      className: 'shr-overflow-y-hidden shr-overflow-x-scroll',\n    },\n    {\n      direction: 'both',\n      styleType: 'scroll',\n      className: 'shr-overflow-scroll',\n    },\n  ],\n  defaultVariants: {\n    direction: 'vertical',\n    styleType: 'auto',\n  },\n})\n\nexport const Scroller = forwardRef<HTMLDivElement, Props>(\n  ({ as: Component = 'div', direction, styleType, className, children, ...rest }, ref) => {\n    const wrapperRef = useRef<HTMLDivElement>(null)\n\n    useImperativeHandle(ref, () => wrapperRef.current!)\n\n    const [tabIndex, setTabIndex] = useState<0 | undefined>(undefined)\n\n    const actualClassName = useMemo(\n      () =>\n        classNameGenerator({\n          direction,\n          styleType,\n          className,\n        }),\n      [direction, styleType, className],\n    )\n\n    const autoTabIndex = useCallback(() => {\n      let nextTabIndex: 0 | undefined = undefined\n      const refCurrent = wrapperRef.current\n\n      if (refCurrent) {\n        switch (direction) {\n          case 'vertical':\n            nextTabIndex = refCurrent.scrollHeight > refCurrent.clientHeight ? 0 : undefined\n            break\n          case 'horizontal':\n            nextTabIndex = refCurrent.scrollWidth > refCurrent.clientWidth ? 0 : undefined\n            break\n          case 'both':\n            nextTabIndex =\n              refCurrent.scrollHeight > refCurrent.clientHeight ||\n              refCurrent.scrollWidth > refCurrent.clientWidth\n                ? 0\n                : undefined\n            break\n        }\n      }\n\n      setTabIndex(nextTabIndex)\n    }, [direction])\n\n    useEffect(() => {\n      autoTabIndex()\n    }, [children, autoTabIndex])\n\n    useEffect(() => {\n      const debouncedAction = debounce(autoTabIndex, 100)\n\n      window.addEventListener('resize', debouncedAction)\n\n      return () => {\n        window.removeEventListener('resize', debouncedAction)\n      }\n    }, [autoTabIndex])\n\n    const Wrapper = useSectionWrapper(Component)\n    const body = (\n      <Component {...rest} ref={wrapperRef} className={actualClassName} tabIndex={tabIndex}>\n        {children}\n      </Component>\n    )\n\n    if (Wrapper) {\n      return <Wrapper>{body}</Wrapper>\n    }\n\n    return body\n  },\n)\n"],"names":[],"mappings":";;;;;;;;;;;AA0BA;AACE;AACA;AACE;AACE;AACA;AACA;AACD;AACD;AACE;AACA;AACD;AACF;AACD;AACE;AACE;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACD;AACD;AACE;AACA;AACA;AACD;AACF;AACD;AACE;AACA;AACD;AACF;AAEM;AAEH;;;;;;;;AAgBA;;AAEE;;;AAII;AACE;;AAEF;AACE;;AAEF;;AAEI;AACA;AACE;;;;;;AAOZ;;AAGE;AACF;;;AAKE;AAEA;AACE;AACF;AACF;AAEA;;;AAQE;;AAGF;AACF;;"}