准则
Chakra UI 建立在一系列原则之上,以保持其组件的相对一致性。了解这些概念将有助于您更好地为 Chakra UI 做出贡献。
我们的目标是设计简单、可组合的组件,以解决现实中的 UI 设计问题。为了实现这一目标,我们制定了一套原则,帮助我们始终走在这条道路上。
样式属性(Style Props):所有组件样式都可以通过样式属性进行覆盖或扩展,以减少对 css 属性或 styled()
的使用。从 Box
组件中组合出新的组件。
简洁性:努力保持组件 API 相对简单,并展示使用组件的真实场景。
组合性:将组件拆分为具有最小属性的较小部分,以保持复杂性较低,并将它们组合在一起。这将确保样式和功能是灵活且可扩展的。
可访问性:在创建组件时,将可访问性置于首位。这包括键盘导航、焦点管理、颜色对比度、语音导航和正确使用 aria-*
属性。
暗黑模式:使组件兼容暗黑模式。使用 useColorMode
钩子来处理样式。了解有关暗黑模式的更多信息。
命名属性:我们都知道在这个行业中,命名是最难的事情。通常,确保属性名称反映其功能。布尔属性应使用辅助动词,例如 does
、has
、is
和 should
。例如,Button
使用 isDisabled
、isLoading
等。