Conceptos
Ubicaciones
9 min
las ubicaciones son cómo te refieres a lugares específicos en el documento al insertar, eliminar o hacer cualquier otra cosa con un editor slate hay diferentes tipos de interfaces de ubicación, cada una para diferentes casos de uso ruta las rutas son la forma de nivel más bajo de referirse a una ubicación cada ruta es un simple arreglo de números que se refiere a un nodo en el árbol del documento por sus índices en cada uno de sus nodos ancestros hacia abajo en el árbol type path = number\[] por ejemplo, en este documento const editor = { children \[ { type 'paragraph', children \[ { text 'a line of text!', }, ], }, ], } el nodo de texto hoja tendría una ruta de \[0, 0] punto los puntos son ligeramente más específicos que las rutas, y contienen un desplazamiento hacia un nodo de texto específico su interfaz es interface point { path path offset number } por ejemplo, con ese mismo documento, si quisieras referirte al primer lugar donde podrías colocar el cursor, sería const start = { path \[0, 0], offset 0, } o, si quisieras referirte al final de la oración const end = { path \[0, 0], offset 15, } puede ser útil pensar en los puntos como "cursos" (o "caret") de una selección 🤖 puntos siempre se refieren a nodos de texto! dado que son los únicos que tienen cadenas que pueden tener cursores rango los rangos son una forma de referirse no solo a un solo punto en el documento, sino a un rango más amplio de contenido entre dos puntos (un ejemplo de un rango es cuando haces una selección ) su interfaz es interface range { anchor point focus point } 🤖 los términos "ancla" y "foco" se toman del dom, ver https //developer mozilla org/en us/docs/web/api/selection/anchornode y https //developer mozilla org/en us/docs/web/api/selection/focusnode un ancla y un foco se establecen mediante una interacción del usuario el punto de ancla no siempre está antes del punto de foco en el documento al igual que en el dom, el orden de un ancla y un punto de selección depende de si el rango es hacia atrás o hacia adelante así es como explica mozilla developer network un usuario puede hacer una selección de izquierda a derecha (en el orden del documento) o de derecha a izquierda (inverso del orden del documento) el ancla es donde el usuario comenzó la selección y el foco es donde el usuario termina la selección si haces una selección con un ratón de escritorio, el ancla se coloca donde presionaste el botón del ratón y el foco se coloca donde soltaste el botón del ratón el ancla y el foco no deben confundirse con las posiciones de inicio y fin de una selección, ya que el ancla puede colocarse antes del foco o viceversa, dependiendo de la dirección en que hiciste tu selección — selección, mdn https //developer mozilla org/en us/docs/web/api/selection una distinción importante es que los puntos de ancla y foco de los rangos siempre hacen referencia a los nodos de texto de nivel hoja en un documento y nunca hacen referencia a elementos este comportamiento es diferente al del dom, pero simplifica el trabajo con rangos ya que hay menos casos límite que manejar 🤖 para más información, consulta el docid\ bltb9uxsdugeysr8maeab selección los rangos se utilizan en muchos lugares en la api de slate cuando necesitas referirte a un intervalo de contenido entre dos puntos uno de los más comunes, sin embargo, es la "selección" actual del usuario la selección es un rango especial que es una propiedad del editor por ejemplo, digamos que alguien tiene toda la oración actualmente seleccionada const editor = { selection { anchor { path \[0, 0], offset 0 }, focus { path \[0, 0], offset 15 }, }, children \[ { type 'paragraph', children \[ { text 'a line of text!', }, ], }, ], } 🤖 el concepto de selección también se toma del dom, consulta selección, mdn https //developer mozilla org/en us/docs/web/api/selection , aunque en una forma muy simplificada porque slate no permite múltiples rangos dentro de una sola selección, lo que hace que las cosas sean mucho más fáciles de manejar no hay una selección especial es solo un objeto que respeta la interfaz de rango en su lugar
