tw classed

TW تصنيف

Monorepo من مشروع TW المصنف. يتكون من الحزم الأساسية وتفاعل.

الوثائق الكاملة

رد فعل

حزمة React عبارة عن غلاف حول الحزمة الأساسية التي توفر وسيلة سهلة لإنشاء مكونات مصممة. انظر مستندات رد الفعل

 // Button.tsx
import { classed } from "@tw-classed/react" ;

const Button = classed . button ( "px-4 py-2" , {
  variants : {
    color : {
      primary : "bg-blue-500 text-white" ,
      secondary : "bg-gray-500 text-white" ,
    } ,
  } ,
} ) ;

// In your App

const App = ( ) => {
  return (
    < >
      < Button color = "primary" > Primary </ Button >
      < Button color = "secondary" > Secondary </ Button >
    </ >
  ) ;
} ; 

جوهر

الحزمة الأساسية هي مكتبة توفر مجموعة من الوظائف لمساعدتك في بناء المكونات المصممة الخاصة بك.

انظر المستندات الأساسية

 import { classed } from "@tw-classed/core" ;

const button = classed ( "px-4 py-2" , {
  variants : {
    color : {
      primary : "bg-blue-500 text-white" ,
      secondary : "bg-gray-500 text-white" ,
    } ,
  } ,
} ) ;

// In your template
const Button = document . createElement ( "button" ) ;
Button . className = button ( { color : "primary" } ) ;

// Or with a framework (Like lit-html)
const Button = ( ) => html ` < button class =" ${ button ( { color : "primary" } ) } " /> ` ; 

رخصة

معهد ماساتشوستس للتكنولوجيا

مجتمع الخلاف