Habilidades react-native-design

📦

react-native-design

Name: react-native-design
Author: wshobson

Revisão do conteúdo r1 Seguro ⚙️ Comandos externos🌐 Acesso à rede

Criar Interfaces Mobile em React Native

Equipes de React Native precisam de padrões consistentes de UI mobile que funcionem entre plataformas. Esta skill fornece orientação prática sobre estilização, navegação, gestos e animação.

Suporta: Claude Codex Code(CC)

📊 75 Adequado

Instalar com meu Agente

Copie esta solicitação para o seu Agente. Ela inclui a página canônica do Skill e o manifesto.

Solicitação do agente

Review the Skillstore skill "react-native-design" from https://skillstore.io/skills/wshobson-react-native-design.md and its manifest at https://skillstore.io/api/skills/wshobson-react-native-design/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.

Seu Agente ainda deve apresentar o plano e solicitar qualquer confirmação exigida pela política de segurança.

Recursos legíveis por agentes

Use estes links quando um agente de IA, crawler ou script precisar de contexto limpo em vez de ler a página completa.

Detalhe em Markdown GET /skills/wshobson-react-native-design.md manifest assinado GET /api/skills/wshobson-react-native-design/manifest lockfile assinado GET /api/skills/wshobson-react-native-design/lockfile

Testar

Usando "react-native-design". Projete uma tela de configurações para um app React Native.

Resultado esperado:

Uma estrutura de tela com tratamento de área segura e seções de configurações agrupadas.
Um plano de estilização para tipografia, espaçamento, divisores e estados pressionados.
Notas sobre diferenças de interação entre iOS e Android.

Usando "react-native-design". Planeje a navegação para um app com telas autenticadas e públicas.

Resultado esperado:

Uma hierarquia de navegação usando fluxos de autenticação, stack e tab.
Orientação sobre parâmetros de rota para telas de detalhe e modais.
Avisos sobre armazenamento seguro de tokens e gerenciamento de sessão.

Usando "react-native-design". Melhore o desempenho de animação de um bottom sheet.

Resultado esperado:

Uma abordagem com Reanimated usando shared values e gesture handlers.
Comportamento de snap points e recomendações de ajuste de spring.
Notas de desempenho para worklets na thread de UI e limpeza.

Auditoria de segurança

Seguro

v4 • 08/07/2026 Abrir o relatório versionado

All static findings were adjudicated as false positives after reviewing the cited markdown and TypeScript examples. The suspicious patterns are documentation fences, JavaScript template literals, React Navigation route keys, official documentation links, and ordinary mobile UI guidance. No prompt injection, secret handling, command execution, or data exfiltration intent was found.

Arquivos analisados

2,922

Linhas analisadas

Itens de revisão

Falsos positivos ignorados

Fatores de risco

⚙️ Comandos externos (36)

references/navigation-patterns.md:684-687 references/navigation-patterns.md:687-701 references/navigation-patterns.md:701-704 references/navigation-patterns.md:704-720 references/navigation-patterns.md:720-721 references/navigation-patterns.md:721-726 references/reanimated-patterns.md:30-59 references/reanimated-patterns.md:187-200 references/reanimated-patterns.md:511-520 references/reanimated-patterns.md:608-644 references/styling-patterns.md:306-313 SKILL.md:27-57 SKILL.md:57-61 SKILL.md:61-99 SKILL.md:99-105 SKILL.md:105-135 SKILL.md:135-141 SKILL.md:141-173 SKILL.md:173-181 SKILL.md:181-185 SKILL.md:185-219 SKILL.md:219-225 SKILL.md:225-254 SKILL.md:254-258 SKILL.md:258-295 SKILL.md:295-299 SKILL.md:299-326 SKILL.md:326-330 SKILL.md:330-412 SKILL.md:412-417 SKILL.md:417 SKILL.md:420 SKILL.md:427 SKILL.md:428-429 SKILL.md:429-431 SKILL.md:431

🌐 Acesso à rede (6)

references/navigation-patterns.md:430 SKILL.md:436 SKILL.md:437 SKILL.md:438 SKILL.md:439 SKILL.md:440

A auditoria estática e semântica concluída mais recente não detectou achados de segurança confirmados. Isso não comprova que a skill não tenha efeitos colaterais.

Auditado por: codex Ver histórico de auditoria →

Compartilhar e citar este relatório

Compartilhe o relatório de avaliação versionado, o badge neutro, o cartão incorporável e as citações. A Skillstore apresenta evidências sem decidir se este Skill é seguro.

Abrir o relatório versionado

Copiar link do relatório

https://skillstore.io/skills/wshobson-react-native-design/audits/4?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_report

Badge Markdown

[![Skillstore security assessment](https://skillstore.io/badges/skills/wshobson-react-native-design/security.svg)](https://skillstore.io/skills/wshobson-react-native-design?utm_source=security_passport_badge)

Badge HTML

<a href="https://skillstore.io/skills/wshobson-react-native-design?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/wshobson-react-native-design/security.svg" alt="Skillstore security assessment" loading="lazy"></a>

Cartão incorporável

<iframe src="https://skillstore.io/embed/skills/wshobson-react-native-design.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>

Citações acadêmicas (APA · BibTeX · CFF)

Citação APA

wshobson. (2026). react-native-design security audit report (audit version 4) [Author version unspecified]. Skillstore. https://skillstore.io/skills/wshobson-react-native-design/audits/4

Citação BibTeX

@techreport{wshobson-wshobson-react-native-design-2026,
  author = {wshobson},
  title = {react-native-design security audit report (audit version 4)},
  institution = {Skillstore},
  year = {2026},
  number = {4},
  url = {https://skillstore.io/skills/wshobson-react-native-design/audits/4},
  note = {Author version unspecified}
}

CITATION.cff

cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "react-native-design security audit report (audit version 4)"
version: "unspecified"
type: report
authors:
  - name: "wshobson"
date-released: "2026-07-08"
url: "https://skillstore.io/skills/wshobson-react-native-design/audits/4"
identifiers:
  - type: other
    value: "skillstore:wshobson-react-native-design:audit:4"
    description: "Skillstore immutable audit report identifier"

Pontuação do Skillstore

Por que esta pontuação Confiança das evidências: Alto

Arquitetura

Manutenibilidade

Conteúdo

Comunidade

Conformidade com a especificação

O que você pode criar

Projetar um Sistema de Telas Mobile

Crie padrões reutilizáveis de layout, espaçamento, tipografia e componentes para um app React Native.

Planejar a Navegação do App

Escolha fluxos de stack, tab, drawer, modal, autenticação e deep links para um app multiplataforma.

Melhorar Movimento e Gestos

Adicione gestos, transições e animações interativas performáticas com Reanimated sem bloquear a thread de UI.

Teste estes prompts

Criar uma Tela Estilizada

Use esta skill para projetar uma tela de perfil em React Native com StyleSheet, áreas seguras e hierarquia de texto acessível.

Criar Fluxo de Navegação

Use esta skill para planejar navegação stack e tab para um app com telas de início, busca, detalhe, configurações e autenticação.

Adicionar Animação de Gesto

Use esta skill para projetar uma interação de card deslizável com Gesture Handler e shared values do Reanimated.

Revisar Arquitetura de UX Mobile

Use esta skill para auditar meu app React Native quanto à consistência de navegação, diferenças de plataforma, desempenho de animações e reutilização de estilização.

Boas práticas

Use tipos TypeScript para rotas e componentes antes de adicionar fluxos de navegação complexos.
Teste layouts e gestos em dispositivos iOS e Android reais.
Mantenha animações na thread de UI e limpe-as quando os componentes forem desmontados.