v1.9.1

Arreglando las directivas definidas para los métodos "SetMartX y SetMartY".

v1.9.0

Exportando los procesadores como 'getter' a la instancia del sistema, para poder hacer uso de éstos en el componente 'react-layouter'.

v1.7.0

Español

Se agrega la exportación de tipos e interfaces para que la librería sea manejada por su componente de React, ninguna cosa importante solo simples cosas de exportación.

English

Adding types and interfaces exported to manage the library for the React component, any important change in the core of the directives, just some stuff exported.

v1.6.1

Se agrega un filtro para no procesar los nodos de tipo SVG ya que sus propiedades colicionan con las directivas del layouter.

v1.6.0

• Se agregan nuevas directivas plus para definir el padding y margin superior, inferior, derecho e izquierdo respectivamente en solo 2 directivas.

Ejemplo:

// Declara el margen superior e inferior en 10 píxeles
<div my="10">...</div>

// Declara el padding superior e inferior en 20 píxeles
<div py="10">...</div>

Obviamente tambien se agregan sus métodos correspondientes, buildPadX, buildPadY, buildMarX, buildMarY setPadX, setPadY, setMarX, y setMarY

v1.5.0

• Se adiciona la nueva directiva 'display':

Ejemplo:

<div d="re">...</div>

o en modo más semántico

<div display="block inline@sm none@md">...</div>

No hay mucho que explicar acá, utiliza las mismas reglas que las demás directivas, solo que está enfocada a la definición del display.

• En el primer ejemplo se define display: relative para el breakpoint 'xs' (mobile)
• En el segundo ejemplo, un poco más extenso, se definió que en el breakpoint 'xs' el display será 'block', luego para el breakpoint 'sm' será 'inline' y finalmente para el breakpoint 'md' el display será 'none'

v1.4.0

• Método reset mejorado
• Alias de la directiva 'flex' extendidos
• Alias de la directiva 'position' extendidos.
• Alias restantes de las demás directivas, extendidos tambien.

Ejemplo:

<main p="24-1/15 24-1/25@sm 30-1/31@md 29.26-1/41@lg" mxw="1280" m="0-auto">
    <header fx="jc:sb@md" mb="24 30@md">
        <div h="100" c="11.1/29@md" mb="24@-md"></div>
        <div h="100" c="16.9/29@md"></div>
    </header>

    <section h="320" mb="24 25@sm 30@md"></section>

    <footer fx="jc:sb@sm">
        <div h="200" c="7/23@sm 9/29@md 12.33/39@lg"></div>
        <div h="200" c="7/23@sm 9/29@md 12.33/39@lg" m="24-0@-sm"></div>
        <div h="200" c="7/23@sm 9/29@md 12.33/39@lg"></div>
    </footer>
</main>

v1.2.0

• Refactorización total de la librería bajo Typescript. Se dejó de lado el paradigma de clase para pasar a solo funciones.
• Agregada la funcionalidad automática de procesamiento de nodos existentes y nuevos, ya no se requiere un inicializador.
• Se agrega evento 'layout:ready' a los nodos procesados. Evento simple no compuesto, es decir, no abarca el callback cuando los nodos hijos tambien se allan procesado

v1.3.1

• Adicionando la posibilidad del procesamiento de nodos hijos de los nuevos nodos agregados. Es decir, si agregamos un DIV con hijos, se procesará tanto el DIV agregado como los nodos hijos de ese DIV

v1.3.0

• Se agregan las siguientes directivas: 'pos', 't', 'r', 'b' y 'l' para definir el position, top, right, bottom y left respectivamente.
• Se agregan las medidas relativas: 'pt', 'cm', 'pc'
• Se añade la posibilidad de usar la librería con el JSDOM, ejemplo:

const { JSDOM } = require('jsdom');
const { window } = new JSDOM();
require('layouter.js')(window);