准则

Chakra UI 建立在一系列原则之上,以保持其组件的相对一致性。了解这些概念将有助于您更好地为 Chakra UI 做出贡献。

我们的目标是设计简单、可组合的组件,以解决现实中的 UI 设计问题。为了实现这一目标,我们制定了一套原则,帮助我们始终走在这条道路上。

样式属性(Style Props):所有组件样式都可以通过样式属性进行覆盖或扩展,以减少对 css 属性或 styled() 的使用。从 Box 组件中组合出新的组件。

简洁性:努力保持组件 API 相对简单,并展示使用组件的真实场景。

组合性:将组件拆分为具有最小属性的较小部分,以保持复杂性较低,并将它们组合在一起。这将确保样式和功能是灵活且可扩展的。

可访问性:在创建组件时,将可访问性置于首位。这包括键盘导航、焦点管理、颜色对比度、语音导航和正确使用 aria-* 属性。

暗黑模式:使组件兼容暗黑模式。使用 useColorMode 钩子来处理样式。了解有关暗黑模式的更多信息。

命名属性:我们都知道在这个行业中,命名是最难的事情。通常,确保属性名称反映其功能。布尔属性应使用辅助动词,例如 doeshasisshould。例如,Button 使用 isDisabledisLoading 等。