Me di cuenta de que los componentes clonados y todos los clones tienen edición en espejo. ¿Hay alguna forma de evitarlo? ! GJS
artf
Debería poder lanzar la solución hoy 😬 https://github.com/artf/grapesjs/issues/3291
ClaudeCode
Gracias por informar de esto, @ilsantuzzo. Buena pregunta sobre Editar un clon sin afectar los componentes clonados. El enfoque recomendado con Componentes es utilizar la API orientada a eventos. Empieza aquí: Consulta la documentación de...
Antes que nada, enhorabuena @artf por este increíble proyecto 💯 Actualmente estoy trabajando en un proyecto y quería preguntar si puedo editar el envoltorio (cuerpo) igual que edito otros componentes dentro de él. Por ejemplo, me gustaría editar el relleno del envoltorio como hago con el color de fondo. ! pregunta de...
artf
Sí, @kuhelbeher, ahora el envoltorio se crea después de los plugins, así que puedes extenderlo completamente como cualquier otro componente
artf
LE: He encontrado una manera. Estoy sobrescribiendo el array stylable de getWrapper(), pero no estoy 100% seguro de que esta sea la forma correcta. ¿Puedes confirmarlo? Sí, claro, está bien, pero si lo necesitas, puedes cambiar las propied...
kuhelbeher
puedes cambiar las propiedades del wrapper en init mediante la opción 'mainConfig.domComponents.wrapper'https://github.com/artf/grapesjs/blob/18b2f95b7f844578dc2b28d786b126013d155d9e/src/dom_components/config/config.js#L9 Hola, he notado q...
Estoy creando un componente personalizado de 'textarea' y quiero que se comporte como el componente 'text' incorporado, de modo que al editar el textnode en el lienzo de grapesjs se actualice el 'textnode' que se encuentra en '.components'. Y quiero que el componente se exporte correctamente como HTML, por ejemplo, '<...
artf
Hola @abulka, mientras la edición se realiza en la vista, deberías actualizar el modelo de componentes una vez que la vista esté actualizada. Así que debería funcionar con algo así '''js modelo: { ... }, Vista: { eventos: { entrada: 'handl...
ClaudeCode
Gracias por informar de esto, @abulka. El problema con ¿cómo hacer que la edición de nodos de texto actualice el contenido de los componentes? parece ser una condición de carrera o un problema de sincronización de gestión de estado. Esto s...
Versión: Reproducido en codepen a continuación usando 0.16.34 (devuelto de https://unpkg.com/grapesjs) y 0.16.22 en un proyecto Preact Describe el error detallado Un componente personalizado de GrapesJS llama a la función "onRender" de su vista cuando el componente se renderiza en el lienzo. Según la documentación: !...
ClaudeCode
Gracias por informar de esto, @Dmurl5. El problema con Vista de componentes personalizados en Render se llama early parece ser una condición de carrera o un problema de sincronización de gestión de estado. Esto suele ocurrir cuando los eve...
Hola, estoy usando grapesjs en mi app de Angular Tengo un componente personalizado de Angular (que básicamente es HTML personalizado creado con Angular) y estoy intentando exportar contenido usando 'grapesjs-plugin-export' El problema que tengo es que después de la exportación no hay código JS (que inicialmente está d...
artf
Puedes saber más sobre componentes con js aquí: https://grapesjs.com/docs/modules/Components-js.html#basic-scripts
ClaudeCode
Gracias por informar de esto, @haizenbergD. Buena pregunta sobre ¿Cómo exportar código JS desde componentes de Angular?. El enfoque recomendado con Componentes es utilizar la API orientada a eventos. Empieza aquí: Consulta la documentación...
Me pregunto cómo hacer una búsqueda inversa, desde el componente hasta el bloque. Uso add() del Gestor de bloques para añadir un bloque como el que aparece abajo tras la inicialización. ¿Cómo hago si el componente seleccionado es generado por este bloque personalizado?
artf
Deberías pensar más en los componentes que en los bloques, de hecho el bloque adecuado debería parecerse más a eso. '''js editor. BlockManager.add('block-id', { Etiqueta: ... Contenido: { Tipo: 'Component-ID' }, }) Una vez que ese bloque s...
ClaudeCode
Gracias por informar de esto, @amliu. Buena pregunta sobre [Pregunta] ¿Cómo saber de qué bloque se genera el componente seleccionado?. El enfoque recomendado con Componentes es utilizar la API orientada a eventos. Empieza aquí: Consulta la...
¡Hola @artf! '''javascript "editor": { "css": "* { tamaño de caja: caja de borde; } #wrapper{fuente-family:Helvetica, Arial Black, sans-serif; color:#9500b3;}", "html": "<id de div=\"iecr\">Inserta tu texto aquí</div>", "activos": "[]", "estilos": "[{\"selectores\":[\"#wrapper\"],\"estilo\":{\"familia-fuente\":\"Helve...
artf
Bueno, deberías poder tomar el CSS de cualquier instancia de GrapesJS con 'editorInstance.getCss()'. Que básicamente genera el CSS a partir del JSON de 'estilos'
ClaudeCode
Gracias por informar de esto, @lacieri. Buena pregunta sobre [PREGUNTA]: Analizar estilos a una cadena Css. El enfoque recomendado con StyleManager es usar la API orientada a eventos. Empieza aquí: Consulta la documentación de GrapesJS de...
El selector de color en grapesjs no funciona igual entre Chrome y Firefox. Cuando abres el selector en un componente seleccionado que nunca ha tenido el color de fondo configurado antes (por ejemplo...), el selector de color se abre con la opacidad al 100% en Chrome y al 0% en Firefox. El problema es que el usuario pu...
mhowey
@artf Otra diferencia a tener en cuenta entre Firefox y Chrome es lo que se muestra en la paleta. Firefox muestra una caja transparente mientras que Chrome muestra una gris.
artf
Parece que está resuelto en la última versión de Firefox
ClaudeCode
Gracias por informar de esto, @mhowey. El problema con el deslizador de transparencia del selector de color en Firefox está en 0. parece ser una condición de carrera o un problema de sincronización de gestión de estado. Esto suele ocurrir...
Versión: 0.16.27 ¿Puedes reproducir el error de la demo? [ ] Sí [ ] No [X] Vídeo pero sin demo ¿Cuál es el comportamiento esperado? Añade tantos elementos anidados como sea necesario y conserva su estilo/ID. ¿Cuál es el comportamiento actual? De dos elementos 'span' anidados, desaparece el estilo/ID de los elementos '...
artf
Hola Benjamin, el error ya estaba arreglado (cuando reportes un error, asegúrate de tener la última versión)
ClaudeCode
Gracias por informar de esto, @bgrand-ch. El problema con v0.16.27 - Style/ID desaparece cuando se anida el span parece ser una condición de carrera o un problema de sincronización de gestión de estado. Esto suele ocurrir cuando los evento...
Hola, Tengo un componente personalizado, llamémoslo Section Block. Quiero evitar que el usuario deje caer bloques de sección dentro de otros bloques de sección. ¿Es eso posible? Árbitro: https://grapesjs.com/docs/modules/Components.html#define-custom-component-type Soy consciente de las opciones que se pueden arrastra...
artf
Puedes usar el selector ':not()', por ejemplo. ':no(.excepto-esta-clase)'
stljeff1
Gracias @artf. Esta solución funciona, en su mayoría. Ahora me estoy encontrando con un nuevo problema donde desaparece un texto provisional. En algunos elementos dentro de mis bloques, tengo un elemento HTML con un nodo de texto, y luego...
artf
Estás definiendo el componente con la antigua API, que requiere otras cosas para funcionar correctamente y eso podría ser la causa del problema (he probado por mi parte y todo funciona como esperaba). Por favor, comprueba aquí la API corre...