Chat Message Metadata

Vista previa

Chat Message Metadata muestra marcas de tiempo, confirmaciones de lectura e información del remitente para mensajes de chat. Proporciona metadatos estructurados con elementos time semánticos e indicadores del estado de entrega.

#Uso

Compón Root, Timestamp, Sender y Status.

import * as ChatMessageMetadata from "@solidiom/chat-message-metadata"

function Metadata() {
  return (
    <ChatMessageMetadata.Root>
      <ChatMessageMetadata.Sender>Ada</ChatMessageMetadata.Sender>
      <ChatMessageMetadata.Timestamp>10:42 AM</ChatMessageMetadata.Timestamp>
      <ChatMessageMetadata.Status>Leído</ChatMessageMetadata.Status>
    </ChatMessageMetadata.Root>
  )
}

#Instalación

Instala el paquete con pnpm add @solidiom/chat-message-metadata. El paquete requiere dependencias pares compatibles de solid-js y @solidjs/web.

#Partes

chat-message-metadata expone 4 partes:

• Root — data-part="root". Contenedor de los metadatos estructurados.
• Timestamp — data-part="timestamp". Renderiza un elemento time semántico para la hora del mensaje.
• Sender — data-part="sender". Muestra la información del remitente.
• Status — data-part="status". Indicador del estado de entrega.

#Estilos

chat-message-metadata incluye los atributos data-scope="chat-message-metadata" y data-part en cada parte para seleccionar estilos CSS o recetas.

#Teclado y comportamiento

Este primitivo no tiene interacción de teclado propia.

#Composición

Chat Message Metadata se compone dentro de primitivos de mensajes de chat para anotar mensajes individuales con información temporal y de entrega.

#SSR e hidratación

Chat Message Metadata renderiza HTML estático y no necesita hidratación, ya que es un primitivo estructural y visual.

solidiom add chat-message-metadata