import React from 'react';
import { resolveViewStyleProps } from '../theme/resolve-style-props';
import { BrandQrNametag } from '../ui/brand-qr-code';
import type { SduiBlockRenderProps } from './SduiPrimitiveBlocks';

/**
 * Bloco wire do QR de marca — delega para o BrandQrNametag (componente único
 * de QR do produto, usado também fora do SDUI, ex.: convite de grupo no chat).
 * Wire: `value` = conteúdo do QR, `size` em px, `label` = texto sob o código.
 */
export function SduiQrCodeBlock({ block }: SduiBlockRenderProps) {
  const value = typeof block.props.value === 'string' ? block.props.value : '';
  if (!value) return null;

  const size = typeof block.props.size === 'number' ? block.props.size : 200;
  const label = typeof block.props.label === 'string' ? block.props.label : '';

  return (
    <BrandQrNametag
      value={value}
      size={size}
      label={label || undefined}
      style={resolveViewStyleProps(block.props.style as Record<string, unknown>)}
    />
  );
}