{"version":3,"file":"AccordionPanelContent.cjs","sources":["../../../src/components/AccordionPanel/AccordionPanelContent.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentPropsWithoutRef,\n  type FC,\n  type PropsWithChildren,\n  useContext,\n  useMemo,\n  useRef,\n} from 'react'\nimport { Transition } from 'react-transition-group'\nimport { tv } from 'tailwind-variants'\n\nimport { getIsInclude } from '../../libs/map'\n\nimport { AccordionPanelContext } from './AccordionPanel'\nimport { AccordionPanelItemContext } from './AccordionPanelItem'\n\ntype AbstractProps = PropsWithChildren\ntype Props = AbstractProps & Omit<ComponentPropsWithoutRef<'div'>, keyof AbstractProps>\n\nconst classNameGenerator = tv({\n  base: [\n    'smarthr-ui-AccordionPanel-content',\n    'shr-invisible shr-max-h-0 shr-opacity-0 shr-transition-[max-height,_visible,_opacity] shr-duration-150 shr-ease-in-out',\n    '[&.entered]:shr-visible [&.entered]:shr-max-h-[revert] [&.entered]:shr-opacity-100',\n    // HINT: flexなどで囲まれると、非表示だが内容分高さが出てしまい、スクロール領域が不自然に伸びてしまう現象が起きる場合がある\n    // 非表示の場合、visually hiddenを適用することで、内容としては残しつつ、高さを0にすることで回避する\n    'aria-[hidden]:shr-absolute aria-[hidden]:shr-h-px aria-[hidden]:shr-overflow-hidden',\n  ],\n})\n\nexport const AccordionPanelContent: FC<Props> = ({ className, ...rest }) => {\n  const { name } = useContext(AccordionPanelItemContext)\n  const { expandedItems } = useContext(AccordionPanelContext)\n  const visible = useMemo(() => getIsInclude(expandedItems, name), [expandedItems, name])\n  const wrapperRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(() => classNameGenerator({ className }), [className])\n\n  return (\n    <Transition in={visible} timeout={150} nodeRef={wrapperRef}>\n      {(status) => (\n        <div\n          {...rest}\n          ref={wrapperRef}\n          id={`${name}-content`}\n          aria-labelledby={`${name}-trigger`}\n          aria-hidden={visible ? undefined : true}\n          className={`${actualClassName} ${status}`}\n        />\n      )}\n    </Transition>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAqBA;AACE;;;;;;;AAOC;AACF;AAEM;;;;AAIL;AACA;AAEA;AAcF;;"}