{"version":3,"file":"AccordionPanel.cjs","sources":["../../../src/components/AccordionPanel/AccordionPanel.tsx"],"sourcesContent":["'use client'\n\nimport {\n  type ComponentProps,\n  type FC,\n  type PropsWithChildren,\n  type RefObject,\n  createContext,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { type VariantProps, tv } from 'tailwind-variants'\n\nimport { flatArrayToMap } from '../../libs/map'\n\nimport { getNewExpandedItems } from './accordionPanelHelper'\n\ntype AbstractProps = PropsWithChildren<{\n  /** アイコンの左右位置 */\n  iconPosition?: 'left' | 'right'\n  /** 複数のパネルを同時に開くことを許容するかどうか */\n  expandableMultiply?: boolean\n  /** デフォルトで開いた状態にするアイテムの `name` の配列 */\n  defaultExpanded?: string[]\n  /** トリガのクリックイベントを処理するハンドラ */\n  onClick?: (expandedItems: string[]) => void\n}> &\n  VariantProps<typeof classNameGenerator>\ntype Props = AbstractProps & Omit<ComponentProps<'div'>, keyof AbstractProps>\n\nexport const AccordionPanelContext = createContext<{\n  iconPosition: 'left' | 'right'\n  expandedItems: Map<string, string>\n  expandableMultiply: boolean\n  parentRef: RefObject<HTMLDivElement> | null\n  onClickTrigger?: (itemName: string, isExpanded: boolean) => void\n  onClickProps?: (expandedItems: string[]) => void\n}>({\n  iconPosition: 'left',\n  expandedItems: new Map(),\n  expandableMultiply: true,\n  parentRef: null,\n})\n\nconst ROUNDED = {\n  t_l: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tl-l',\n  t_r: '[&>.smarthr-ui-AccordionPanel-item:first-child_.smarthr-ui-AccordionPanel-trigger]:shr-rounded-tr-l',\n  b_l: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-bl-l',\n  b_r: '[&>.smarthr-ui-AccordionPanel-item:last-child_.smarthr-ui-AccordionPanel-trigger:not([aria-expanded=\"true\"])]:shr-rounded-br-l',\n}\n\nconst ROUNDED_ALL = [ROUNDED.t_l, ROUNDED.t_r, ROUNDED.b_l, ROUNDED.b_r]\n\nconst classNameGenerator = tv({\n  base: 'smarthr-ui-AccordionPanel',\n  variants: {\n    rounded: {\n      true: ROUNDED_ALL,\n      false: '',\n      all: ROUNDED_ALL,\n      top: [ROUNDED.t_l, ROUNDED.t_r],\n      right: [ROUNDED.t_r, ROUNDED.b_r],\n      bottom: [ROUNDED.b_l, ROUNDED.b_r],\n      left: [ROUNDED.t_l, ROUNDED.b_l],\n    },\n  },\n  defaultVariants: {\n    rounded: false,\n  },\n})\n\nexport const AccordionPanel: FC<Props> = ({\n  iconPosition = 'left',\n  expandableMultiply = true,\n  defaultExpanded = [],\n  className,\n  onClick: onClickProps,\n  rounded,\n  ...rest\n}) => {\n  const [expandedItems, setExpanded] = useState(flatArrayToMap(defaultExpanded))\n  const parentRef = useRef<HTMLDivElement>(null)\n  const actualClassName = useMemo(\n    () => classNameGenerator({ className, rounded }),\n    [rounded, className],\n  )\n\n  const onClickTrigger = useCallback(\n    (itemName: string, isExpanded: boolean) => {\n      setExpanded(getNewExpandedItems(expandedItems, itemName, isExpanded, expandableMultiply))\n    },\n    [expandableMultiply, expandedItems],\n  )\n\n  useEffect(() => {\n    if (defaultExpanded.length > 0) setExpanded(flatArrayToMap(defaultExpanded))\n  }, [defaultExpanded])\n\n  return (\n    <AccordionPanelContext.Provider\n      value={{\n        onClickTrigger,\n        onClickProps,\n        expandedItems,\n        iconPosition,\n        expandableMultiply,\n        parentRef,\n      }}\n    >\n      <div {...rest} ref={parentRef} role=\"presentation\" className={actualClassName} />\n    </AccordionPanelContext.Provider>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;;AAiCO;AAQL;;AAEA;AACA;AACD;AAED;AACE;AACA;AACA;AACA;;AAGF;AAEA;AACE;AACA;AACE;AACE;AACA;AACA;;;;;AAKD;AACF;AACD;AACE;AACD;AACF;AAEM;AASL;AACA;;;AAQI;AACF;;AAKA;AAAgC;AAClC;AAEA;;;;;;;AASK;AAKP;;;"}