solid blocks

Blocs solides

Blocs constitutifs de l'interface utilisateur pour Solidjs

Concepts de base

Composants précieux au lieu de composants sans valeur ajoutée

Envelopper des éléments comme les en-têtes, le texte ou les images dans des composants personnalisés est tout simplement un gaspillage. Les composants ne seront fournis que s'ils ont ajouté de la valeur sur leurs éléments indigènes. La valeur ajoutée peut être

• expérience utilisateur
• accessibilité
• expérience du développeur
• performance

Si aucun de ces avantages ne peut être fourni, il est préférable d'utiliser efficacement les éléments HTML natifs ou les capacités de SolidJS comme le portail.

Composants avec style au lieu de composants stylisés

L'utilisation directement de CSS est désapprouvée de nos jours, mais pas à juste titre. Le CSS bien conçu surpassera facilement les composants stylisés. Ça devrait le faire avec

• Saignement minimal (préfixe de classe sb-[component] , réinitialisation CSS, styles de base, variables de thème)
• Noms de classe sémantique, IE .primary.sb-button
• considération attentive de A11Y
• fonctionne autant que possible dans les environnements non JS (SSR)
• thèmeable, mode sombre, commutateur en mode en ligne possible
• TODO: disposition réactive

Usage

yarn
yarn dev

Pour utiliser les composants

 import { Accordion , AccordionHeader } from "solid-blocks" ;

const MyApp = ( ) => {
  return (
    < Accordion >
      < AccordionHeader > Accordion </ AccordionHeader >
      < p > Hidden </ p >
    </ Accordion >
  ) ;
} ;