Aiformify NPM | npm.io

AIFormify

AIFormify es una librería de JavaScript que utiliza IA para rellenar formularios basados en descripciones de texto, con soporte para Vue, React y reconocimiento de voz.

Patrocinado por CooWeb

Este proyecto es orgullosamente patrocinado por CooWeb, una empresa de impacto social dedicada a transformar vidas a través de la tecnología.

Instalación

npm install aiformify

Configuración

Para usar AIFormify, necesitas una API key de Gemini. Configúrala al inicializar AIFormify:

const aiformify = new AIFormify({
  apiKey: 'TU_API_KEY_AQUI'
});

Uso Básico

import AIFormify from 'aiformify';

const aiformify = new AIFormify({ apiKey: 'TU_API_KEY_AQUI' });

const schema = {
  fields: [
    { name: 'nombre', type: 'text', label: 'Nombre' },
    { name: 'email', type: 'email', label: 'Correo electrónico' },
    { name: 'mensaje', type: 'textarea', label: 'Mensaje' }
  ]
};

const textDescription = 'Mi nombre es Juan Pérez. Mi correo es juan@example.co. Quiero dejar un mensaje diciendo que estoy interesado en el producto.';

aiformify.fillForm(textDescription, schema)
  .then(result => {
    console.log('Formulario rellenado:', result.form);
    console.log('Errores de validación:', result.errors);
  })
  .catch(error => console.error('Error:', error));

Uso en React

import { ReactAdapter } from 'aiformify';

const { AIFormifyProvider, AIFormifyForm } = ReactAdapter;

const mySchema = {
  fields: [
    { name: 'nombre', type: 'text', label: 'Nombre' },
    { name: 'email', type: 'email', label: 'Correo electrónico' },
  ]
};

function App() {
  return (
    <AIFormifyProvider config={{ apiKey: 'TU_API_KEY_AQUI' }}>
      <AIFormifyForm schema={mySchema} />
    </AIFormifyProvider>
  );
}

Uso en Vue

<template>
  <AIFormifyForm :schema="mySchema" />
</template>

<script>
import { VueAdapter } from 'aiformify';

export default {
  components: {
    AIFormifyForm: VueAdapter.AIFormifyForm
  },
  data() {
    return {
      mySchema: {
        fields: [
          { name: 'nombre', type: 'text', label: 'Nombre' },
          { name: 'email', type: 'email', label: 'Correo electrónico' },
        ]
      }
    }
  },
  // Asegúrate de proporcionar la API key en la configuración de tu aplicación Vue
}
</script>