文件名称:calico:使用静态生成的原子样式的React组件
文件大小:183KB
文件格式:ZIP
更新时间:2024-05-22 03:26:15
TypeScript
印花布 Calico是一个可定制的样式库,可将React道具映射到静态生成的类名。 动机 Calico是一个CSS-in-JS项目库,旨在将各种样式解决方案的优点结合在一起: 原子CSS受等库的启发 静态提取,但可以在theme文件中进行自定义的预先设置。 使用有限的一组生成的className鼓励重用性。 很轻运行时所做出可能的库。 静态样式提取,具有完整的安全性。 通过交换className的动态样式。 受和启发,以开发人员为中心。 通过数组定义响应样式。 命名空间样式可简化类型可扩展性。 可以在.treat文件中定义一次性样式,并在theme上添加其他响应式帮助器。 安装 除了其对等依赖项之外,还安装软件包: yarn add @walltowall/calico treat react-treat 根据您的项目,您还需要配置webpack来支持treat 。
【文件预览】:
calico-master
----.gitignore(47B)
----jest-puppeteer.config.js(79B)
----package.json(2KB)
----jest.preset.js(161B)
----src()
--------Box.tsx(3KB)
--------createMq.ts(3KB)
--------calicoTheme.d.ts(132B)
--------index.ts(543B)
--------utils.ts(4KB)
--------createCalicoTheme.ts(1KB)
--------variants.ts(87B)
--------useBoxStyles.treat.ts(2KB)
--------rules.ts(6KB)
--------types.ts(351B)
--------useBoxStyles.ts(3KB)
----jest.config.js(187B)
----LICENSE(1KB)
----CHANGELOG.md(5KB)
----tsconfig.json(555B)
----.github()
--------workflows()
----README.md(5KB)
----jest.setup.js(23B)
----test()
--------createMq.test.ts(1KB)
--------Box.test.ts(9KB)
--------utils()
--------resolveResponsiveProp.test.ts(1KB)
--------fixtures()
----yarn.lock(418KB)