{"version":3,"file":"TimelineItem.cjs","sources":["../../../../src/components/Timeline/TimelineItem/TimelineItem.tsx"],"sourcesContent":["import {\n  Box,\n  BoxProps,\n  CompoundStylesApiProps,\n  ElementProps,\n  factory,\n  Factory,\n  getRadius,\n  getThemeColor,\n  RaikouColor,\n  RaikouRadius,\n  useProps,\n  useRaikouTheme,\n} from '../../../core';\nimport { useTimelineContext } from '../Timeline.context';\n\nexport type TimelineItemStylesNames =\n  | 'itemBody'\n  | 'itemContent'\n  | 'itemBullet'\n  | 'item'\n  | 'itemTitle';\n\nexport interface TimelineItemProps\n  extends BoxProps,\n    CompoundStylesApiProps<TimelineItemFactory>,\n    ElementProps<'div', 'title'> {\n  /** Determines whether the item should be highlighted, controlled by the parent `Timeline` component  */\n  __active?: boolean;\n\n  /** Determines whether the line of the item should be highlighted, controlled by the parent Timeline component */\n  __lineActive?: boolean;\n\n  /** Line and bullet position relative to item content, controlled by the parent Timeline component */\n  __align?: 'right' | 'left';\n\n  /** Item title, displayed next to the bullet */\n  title?: React.ReactNode;\n\n  /** Content displayed below the title */\n  children?: React.ReactNode;\n\n  /** React node that should be rendered inside the bullet – icon, image, avatar, etc. By default, large white dot is displayed. */\n  bullet?: React.ReactNode;\n\n  /** Key of `theme.radius` or any valid CSS value to set `border-radius`, numbers are converted to rem, `'xl'` by default */\n  radius?: RaikouRadius;\n\n  /** Key of `theme.colors` or any valid CSS color to control active item colors, `theme.primaryColor` by default */\n  color?: RaikouColor;\n\n  /** Controls line border style, `'solid'` by default */\n  lineVariant?: 'solid' | 'dashed' | 'dotted';\n}\n\nexport type TimelineItemFactory = Factory<{\n  props: TimelineItemProps;\n  ref: HTMLDivElement;\n  stylesNames: TimelineItemStylesNames;\n  compound: true;\n}>;\n\nconst defaultProps: Partial<TimelineItemProps> = {};\n\nexport const TimelineItem = factory<TimelineItemFactory>((_props, ref) => {\n  const props = useProps('TimelineItem', defaultProps, _props);\n  const {\n    classNames,\n    className,\n    style,\n    styles,\n    vars,\n    __active,\n    __align,\n    __lineActive,\n    __vars,\n    bullet,\n    radius,\n    color,\n    lineVariant,\n    children,\n    title,\n    mod,\n    ...others\n  } = props;\n\n  const ctx = useTimelineContext();\n  const theme = useRaikouTheme();\n\n  const stylesApiProps = { classNames, styles };\n\n  return (\n    <Box\n      {...ctx.getStyles('item', { ...stylesApiProps, className, style })}\n      mod={[{ 'line-active': __lineActive, active: __active }, mod]}\n      ref={ref}\n      __vars={{\n        '--tli-radius': radius ? getRadius(radius) : undefined,\n        '--tli-color': color ? getThemeColor(color, theme) : undefined,\n        '--tli-border-style': lineVariant || undefined,\n      }}\n      {...others}\n    >\n      <Box\n        {...ctx.getStyles('itemBullet', stylesApiProps)}\n        mod={{ 'with-child': !!bullet, align: __align, active: __active }}\n      >\n        {bullet}\n      </Box>\n\n      <div {...ctx.getStyles('itemBody', stylesApiProps)}>\n        {title && <div {...ctx.getStyles('itemTitle', stylesApiProps)}>{title}</div>}\n        <div {...ctx.getStyles('itemContent', stylesApiProps)}>{children}</div>\n      </div>\n    </Box>\n  );\n});\n\nTimelineItem.displayName = '@raikou/core/TimelineItem';\n"],"names":["factory","useProps","useTimelineContext","useRaikouTheme","jsxs","Box","getRadius","getThemeColor","jsx"],"mappings":";;;;;;;;;;;;;;;AA8DA,MAAM,eAA2C,EAAC;AAE3C,MAAM,YAAe,GAAAA,eAAA,CAA6B,CAAC,MAAA,EAAQ,GAAQ,KAAA;AACxE,EAAA,MAAM,KAAQ,GAAAC,iBAAA,CAAS,cAAgB,EAAA,YAAA,EAAc,MAAM,CAAA;AAC3D,EAAM,MAAA;AAAA,IACJ,UAAA;AAAA,IACA,SAAA;AAAA,IACA,KAAA;AAAA,IACA,MAAA;AAAA,IACA,IAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,YAAA;AAAA,IACA,MAAA;AAAA,IACA,MAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACA,WAAA;AAAA,IACA,QAAA;AAAA,IACA,KAAA;AAAA,IACA,GAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EAAA,MAAM,MAAMC,mCAAmB,EAAA;AAC/B,EAAA,MAAM,QAAQC,6BAAe,EAAA;AAE7B,EAAM,MAAA,cAAA,GAAiB,EAAE,UAAA,EAAY,MAAO,EAAA;AAE5C,EACE,uBAAAC,eAAA;AAAA,IAACC,OAAA;AAAA,IAAA;AAAA,MACE,GAAG,IAAI,SAAU,CAAA,MAAA,EAAQ,EAAE,GAAG,cAAA,EAAgB,SAAW,EAAA,KAAA,EAAO,CAAA;AAAA,MACjE,GAAA,EAAK,CAAC,EAAE,aAAA,EAAe,cAAc,MAAQ,EAAA,QAAA,IAAY,GAAG,CAAA;AAAA,MAC5D,GAAA;AAAA,MACA,MAAQ,EAAA;AAAA,QACN,cAAgB,EAAA,MAAA,GAASC,iBAAU,CAAA,MAAM,CAAI,GAAA,KAAA,CAAA;AAAA,QAC7C,aAAe,EAAA,KAAA,GAAQC,2BAAc,CAAA,KAAA,EAAO,KAAK,CAAI,GAAA,KAAA,CAAA;AAAA,QACrD,sBAAsB,WAAe,IAAA,KAAA;AAAA,OACvC;AAAA,MACC,GAAG,MAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAAC,cAAA;AAAA,UAACH,OAAA;AAAA,UAAA;AAAA,YACE,GAAG,GAAA,CAAI,SAAU,CAAA,YAAA,EAAc,cAAc,CAAA;AAAA,YAC9C,GAAA,EAAK,EAAE,YAAc,EAAA,CAAC,CAAC,MAAQ,EAAA,KAAA,EAAO,OAAS,EAAA,MAAA,EAAQ,QAAS,EAAA;AAAA,YAE/D,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,wCAEC,KAAK,EAAA,EAAA,GAAG,IAAI,SAAU,CAAA,UAAA,EAAY,cAAc,CAC9C,EAAA,QAAA,EAAA;AAAA,UAAS,KAAA,oBAAAG,cAAA,CAAC,SAAK,GAAG,GAAA,CAAI,UAAU,WAAa,EAAA,cAAc,GAAI,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,0BACtEA,cAAA,CAAC,SAAK,GAAG,GAAA,CAAI,UAAU,aAAe,EAAA,cAAc,GAAI,QAAS,EAAA;AAAA,SACnE,EAAA;AAAA;AAAA;AAAA,GACF;AAEJ,CAAC;AAED,YAAA,CAAa,WAAc,GAAA,2BAAA;;;;"}