Propiedades Opcionales - Omniloy Documentation

Estas propiedades te permiten personalizar el comportamiento y apariencia del componente SofIA SDK para adaptarse a las necesidades específicas de tu implementación.

Propiedades Activas

Control de Interfaz

Propiedad	Tipo	Valor por Defecto	Descripción
isopen	`boolean`	`true`	Estado de visibilidad del componente, permite control bidireccional del estado abierto/cerrado. Cuando no se proporciona, el componente se inicia abierto por defecto

Callbacks

Propiedad	Tipo	Descripción
handleReport	`function`	Función callback que recibe el reporte clínico estructurado generado por SofIA. También disponible como atributo `handle-report`. Puede referenciarse como nombre de función global
setIsOpen	`function`	Función callback para manejar cambios de visibilidad solicitados por el componente
setGetLastReport	`function`	Un callback que recibe una función para recuperar el último reporte generado

Firmas de Callbacks

handleReport

handleReport: (report: Record<string, unknown>) => void

Se invoca cuando el usuario activa la generación de reportes. El objeto report coincide con la estructura definida en tu JSON Schema template. Ejemplo de payload:

{
  "diagnosis": "Diabetes Mellitus Tipo 2",
  "treatment_plan": "Metformina 500mg dos veces al día"
}

setIsOpen

setIsOpen: (isOpen: boolean) => void

Se invoca cuando el SDK solicita un cambio de visibilidad (ej.: el usuario hace clic en el botón de cerrar). setGetLastReport

setGetLastReport: (getter: () => Promise<Record<string, unknown> | undefined>) => void

Se invoca una vez durante la inicialización. Proporciona una función que puedes almacenar y llamar posteriormente para recuperar el último reporte generado para la sesión actual de paciente/usuario.

Datos Contextuales

Propiedad	Tipo	Valor por Defecto	Descripción
patientdata	`string` (JSON) \| `object`	`undefined`	Información contextual del paciente (antecedentes, notas previas, referencias) para enriquecer el procesamiento clínico

Indicador de Consentimiento

Propiedad	Tipo	Valor por Defecto	Descripción
showconsentindicator	`boolean`	`false`	Muestra el indicador de estado de consentimiento en el encabezado. Funciona con el campo `signedConsent` en `patientdata`

Localización

Propiedad	Tipo	Valor por Defecto	Descripción
language	`string`	`"es"`	Idioma de la interfaz. Valores soportados: `"es"` (Español), `"en"` (Inglés)

El idioma por defecto es "es" (Español). Si tu aplicación está dirigida a usuarios de habla inglesa, establece language="en" explícitamente.

Depuración

Propiedad	Tipo	Valor por Defecto	Descripción
debug	`boolean`	`false`	Habilita logging detallado para propósitos de depuración

Personalización CSS

SofIA SDK se renderiza como un Web Component con Shadow DOM. Esto evita conflictos con los estilos de la aplicación host, pero también significa que el CSS global de la aplicación no afecta directamente a los elementos internos del SDK. Si necesita ajustar estilos internos concretos, inyecte una etiqueta <style> dentro del shadowRoot del componente una vez que el Web Component esté definido y montado:

async function setupSofIACustomStyles(selector = '#sofia') {
  await customElements.whenDefined('sofia-sdk');
  const sofia = await waitForSofiaComponent(selector);

  const customStyles = `
    :host {
      --sofia-custom-spacing: 12px;
    }

    .omniscribe_chat-view-stick-to-bottom-content {
      font-size: 14px;
    }
  `;

  const existingStyle = sofia.shadowRoot.querySelector('style[data-sofia-custom]');
  const styleTag = existingStyle || document.createElement('style');

  styleTag.setAttribute('data-sofia-custom', 'true');
  styleTag.textContent = customStyles;

  if (!existingStyle) {
    sofia.shadowRoot.appendChild(styleTag);
  }
}

function waitForSofiaComponent(selector) {
  return new Promise((resolve, reject) => {
    let attempts = 0;
    const maxAttempts = 40;

    function check() {
      const sofia = document.querySelector(selector);

      if (sofia?.shadowRoot) {
        resolve(sofia);
        return;
      }

      attempts += 1;
      if (attempts >= maxAttempts) {
        reject(new Error('SofIA no está montada o no tiene shadowRoot disponible'));
        return;
      }

      setTimeout(check, 100);
    }

    check();
  });
}

setupSofIACustomStyles('#sofia').catch((error) => {
  console.warn('No se pudieron aplicar los estilos personalizados de SofIA:', error);
});

Use el selector que corresponda a su componente, por ejemplo #sofia o #sofia-component. En Angular, ejecute esta lógica en ngAfterViewInit. En AngularJS, puede llamarla después de configurar los atributos y callbacks del componente. Si el componente se crea de forma condicional, vuelva a ejecutar la función después de montarlo.

Los selectores de clases internas pueden cambiar entre versiones del SDK. El selector anterior corresponde a @omniloy/sofia-sdk 1.0.4. Mantenga estos estilos centralizados, pruebe la interfaz al actualizar @omniloy/sofia-sdk y prefiera propiedades documentadas del componente cuando estén disponibles.

Recuperación Manual de Reportes

Además de recibir el reporte automáticamente, puedes solicitarlo bajo demanda desde tu aplicación. La propiedad set-get-last-report ejecuta un callback que te proporciona una función asíncrona. Debes almacenar esta referencia para usarla cuando necesites recuperar el último reporte generado.

let getLastReportFn = null;

// Callback asignado a: set-get-last-report
function registerGetter(fn) {
  getLastReportFn = fn;
}

// Ejemplo de uso en un botón externo
async function handleSaveClick() {
  if (getLastReportFn) {
    const report = await getLastReportFn();
    console.log("Reporte recuperado:", report);
  }
}

Ejemplos de Uso

Configuración básica con datos del paciente

<sofia-sdk
  patientdata='{"age": 45, "history": "Hipertensión arterial"}'
  language="es"
  baseurl="https://api.example.com/v1"
  wssurl="wss://ws.example.com"
  apikey="sk-your-api-key-here"
  userid="user_12345"
  patientid="patient_67890"
  template='{"type": "object"}'
  templateid="soap-general-v1"
  isopen="true"
  handleReport="handleReport"
  setIsOpen="setIsOpen"
>
</sofia-sdk>

Modo solo chat (sin generación de reportes)

Para usar SofIA en modo solo chat, simplemente omita las propiedades template y templateid. El botón de generar no aparecerá.

<sofia-sdk
  baseurl="https://api.example.com/v1"
  wssurl="wss://ws.example.com"
  apikey="sk-your-api-key-here"
  userid="user_12345"
  patientid="patient_67890"
  language="es"
>
</sofia-sdk>

Configuración avanzada con callbacks

<sofia-sdk
  setGetLastReport="setGetReportFunction"
  handleReport="handleReport"
  debug="true"
  baseurl="https://api.example.com/v1"
  wssurl="wss://ws.example.com"
  apikey="sk-your-api-key-here"
  userid="user_12345"
  patientid="patient_67890"
>
</sofia-sdk>

Convención de nombres para callbacks: Al asignar callbacks vía JavaScript, use camelCase (ej.: element.handleReport = fn). En atributos HTML, handle-report también funciona como alias. Las propiedades simples como isopen, patientdata y debug usan el mismo nombre en minúsculas tanto en HTML como en JS.

Atributo HTML	Propiedad JS	Notas
`handle-report` o `handleReport`	`handleReport`	Ambas formas funcionan como atributo HTML
`setIsOpen`	`setIsOpen`	Usar camelCase en HTML
`setGetLastReport`	`setGetLastReport`	Usar camelCase en HTML
`patientdata`	`patientdata`	Igual en ambos
`isopen`	`isopen`	Igual en ambos
`debug`	`debug`	Igual en ambos

Propiedades Deprecadas

Las siguientes propiedades están deprecadas y serán eliminadas en v2.0. No tienen efecto en la arquitectura actual basada en Chat.

Propiedad	Migración
toolsargs	Renombrada a `template`. Ver Propiedades Requeridas
isonlychat	Ya no es necesaria. El modo solo chat es automático cuando no se proporcionan `template`/`templateid`
disableactions	Para deshabilitar todas las acciones, no monte el componente `<sofia-sdk>`
disablegenerate	Para ocultar el botón de generar, no pase `template`/`templateid`
sofiatitle	Ya no es configurable. El título siempre es “SofIA”
isscreenloading	No disponible en la UI basada en Chat
transcriptorselectvalues	No se usa en la UI basada en Chat
render-report-content	No disponible en la UI basada en Chat
handleFill	No disponible en la UI basada en Chat
toast	Ya no tiene efecto

Notas Importantes

patientdata: Debe contener solo información necesaria para el contexto clínico, siguiendo principios de minimización de datos.
Estados: Los cambios en propiedades booleanas se reflejan inmediatamente en la interfaz.
Localización: Cambiar el idioma afecta toda la interfaz del componente, incluyendo mensajes de error y etiquetas.
Callbacks: Las funciones pueden referenciarse por su nombre global (ej.: handleReport="myFunction" resuelve a window.myFunction) o asignarse programáticamente (ej.: element.handleReport = fn).

​Propiedades Activas

​Control de Interfaz

​Callbacks

​Firmas de Callbacks

​Datos Contextuales

​Indicador de Consentimiento

​Localización

​Depuración

​Personalización CSS

​Recuperación Manual de Reportes

​Ejemplos de Uso

​Configuración básica con datos del paciente

​Modo solo chat (sin generación de reportes)

​Configuración avanzada con callbacks

​Propiedades Deprecadas

​Notas Importantes

Propiedades Activas

Control de Interfaz

Callbacks

Firmas de Callbacks

Datos Contextuales

Indicador de Consentimiento

Localización

Depuración

Personalización CSS

Recuperación Manual de Reportes

Ejemplos de Uso

Configuración básica con datos del paciente

Modo solo chat (sin generación de reportes)

Configuración avanzada con callbacks

Propiedades Deprecadas

Notas Importantes