Componentes

En la implementación de los tokens de Nivel 3 (Componentes) hablamos de los valores más específicos al representar las propiedades propias de cada componente en el sistema.

Por su especificidad, cada componente es independiente de los otros en su descripción de valores a nivel de “Design Tokens”, es decir, si cambia el valor del token, no afectará nada fuera del componente.

También son fáciles de leer y ser interpretados por desarrollo. Los tokens específicos del componente del tipo “button-color-background” aclaran la función y aplicación del mismo. En otros niveles este nombre no pueden tener sentido en el contexto en el que se está utilizando.

Necesitan ser creados a medida que el sistema crece. Nuevos componentes implican nuevos “Design Tokens”. Por esta característica creemos que este tipo de implementaciones son ideales en entornos estables y con crecimientos bien escalados, de otra forma supondrán un importante foco de mantenimiento.

En diseño

Cada componente estaría enlazado a su propia librería de Foundations nivel 3. Esto supondría una tarea enorme de mantenimiento y construcción. No existe ningún Sistema que en su parte de diseño tenga implementada una solución de este tipo.

En desarrollo

Los valores son específicos de cada componente.

✅ Beneficio

Cada componente es independiente del resto. Es más fácil tener un grado alto de libertad en los diseños.

Son intuitivos de implementar, al leer su nombre es sencillo saber dónde hay que aplicarlo, por ejemplo “--button-color-background”.

⚠️ Contrapartida

Nuevos componentes requieren nuevos tokens y estos han de ser implementados en cada componente. Esto repercute en la sostenibilidad del sistema en ambientes de muchos cambios y alta creación de componentes.

Los tokens de Nivel 3 (Decisiones) son sencillos de leer e implementar por desarrollo, pero también un reto si existe un escenario de constantes cambios y creación frecuente de nuevos componentes.

Plural DS y los Componentes

Plural DS podría utilizar tokens de nivel 3, pero en la versión actual no son soportados.

Última actualización