'use client'

import type { ComponentRenderProps } from '@json-render/react'

const alignMap: Record<string, string> = {
  left: 'justify-start',
  center: 'justify-center',
  right: 'justify-end',
}

export function ActionBar({ element, children }: ComponentRenderProps) {
  const { align = 'right' } = element.props as { align?: string }

  return (
    <div className={`flex gap-3 mt-5 ${alignMap[align] || alignMap.right}`}>
      {children}
    </div>
  )
}
