Bloco de ícones 1.4.0 adiciona controle de altura, melhora o manuseio de cores para melhor suporte a estilos globais – WP Tavern

Nick Diego, defensor do desenvolvedor na WP Engine, lançou a versão 1.4.0 de seu plugin Icon Block. Diego o lançou em outubro de 2021, depois de lutar para encontrar uma maneira eficiente de adicionar ícones SVG ao editor de blocos. Ele pretende que este plugin pequeno, mas útil, se torne “o ícone SVG definitivo e o bloco gráfico”. No ano passado, cresceu 1300% para mais de 7.000 instalações ativas, mantendo o foco em um conjunto restrito de recursos.

Os contribuidores do WordPress vêm discutindo a adição de suporte SVG ao núcleo por mais de uma década, mas ainda não encontraram um caminho claro que aborde adequadamente as questões de segurança. Em julho de 2022, a equipe de Performance começou a trabalhar em um módulo para uploads de SVG, mas ainda está em andamento. Enquanto isso, como o formato SVG tem suporte quase universal na Web, os usuários contam com plug-ins como Suporte SVG (mais de 1 milhão de instalações) ou Safe SVG (mais de 700 mil instalações) para fazer upload de arquivos SVG para a biblioteca de mídia e usá-los como qualquer outra imagem Arquivo.

O plugin de Diego é diferente porque foi feito para uso com os editores de blocos e sites. O bloco de ícones registra um único bloco que permite aos usuários adicionar ícones e gráficos SVG personalizados. Ele também permite o acesso à biblioteca de ícones do WordPress, que contém mais de 270 ícones SVG.

Uma vantagem do plug-in é que os usuários não precisam instalar uma biblioteca de blocos inteira se precisarem apenas de ícones SVG. Na versão 1.2.0, o Icon Block adicionou a capacidade de os desenvolvedores registrarem suas próprias bibliotecas de ícones personalizados.

A versão mais recente expande o controle de largura além do que é oferecido no bloco de imagem principal para suportar %, px, em, rem, vh, vw, ou quaisquer unidades definidas em theme.json. Essas unidades também estão disponíveis em Estilos globais, para que os usuários possam controlar a largura com base na intenção do autor do tema. Diego, que disse preferir usar componentes nativos do WordPress sempre que possível, atualizou os controles de largura usando o HeightControl de Gutenberg, que ainda não está disponível no núcleo.

“Felizmente, ele é construído com componentes que estão no WordPress desde a versão 6.0. Eu portei o código do HeightControl para um costume DimensionControl no Icon Block e fiz algumas modificações para atender às minhas necessidades específicas”, disse Diego.

O suporte à altura do ícone é um novo recurso na versão 1.4.0 mais recente, outro recurso solicitado pela comunidade de usuários do plug-in.

“Uma coisa a notar é que eu escolho excluir % das opções de unidade de altura”, disse Diego no post de lançamento. “Usando % pode ter resultados inesperados com base na altura do contêiner do ícone e não é muito intuitivo.”

A versão 1.4.0 também melhora o suporte a cores para melhor suporte a estilos globais. Quando os temas definem um primary e secondary colors em theme.json, os ícones definidos para usá-los funcionarão perfeitamente com a alternância de variação de estilo. Esta é uma bela demonstração de como os desenvolvedores de blocos podem fazer seus plugins funcionarem harmoniosamente com o Global Styles para melhorar a experiência de edição completa do site.

Em versões futuras, Diego disse que planeja trabalhar em uma maneira de permitir que os usuários insiram ícones SVG personalizados de um arquivo SVG “carregado”, bem como explorar maneiras de integrar com bibliotecas de ícones de terceiros. O acesso a ícones Font Awesome, Boostrap, Ionicons e outras bibliotecas SVG daria aos usuários uma seleção muito mais ampla além da biblioteca de ícones do WordPress ao projetar seus sites.

Os usuários podem enviar solicitações de recursos por meio da fila de problemas no repositório GitHub do plug-in. Como Diego está desenvolvendo o plug-in usando componentes nativos do WordPress tanto quanto possível, os usuários também podem esperar que funcionalidades adicionais sejam disponibilizadas à medida que são adicionadas ao núcleo do WordPress.

“Existem toneladas de ótimos plugins de ícones no ecossistema WordPress, gratuitos e premium”, disse Diego. “A maioria tem mais recursos e funcionalidades do que o Icon Block. No entanto, o que torna esse bloco diferente é seu forte compromisso com os princípios básicos de design do WordPress.

“O objetivo sempre foi fazer com que o bloco parecesse pertencer ao próprio WordPress. Eu me esforcei para usar o máximo possível de suportes e componentes do bloco principal. A versão 1.4.0 permanece fiel a esse esforço com melhorias muito necessárias.”