react-icecream

Qiniu Icecream Design for React.

Usage no npm install needed!

<script type="module">
  import reactIcecream from 'https://cdn.skypack.dev/react-icecream';
</script>

README

React-icecream

Qiniu Icecream Design for React.

Permanent-Online-Website

http://ue-env-v2-icecream.qa.qiniu.io/

Install

yarn add react-icecream

Usage

从根结点导出

import { Button } from 'react-icecream'

function App() {
  return (
    <Button>content</Button>
  )
}

Principles

  • 不使用改变组件内部布局的 style
  • 不继承原生组件的 props,改为用 rootHtmlProps 的方式实现
  • rootHtmlProps 的 className、style、onChange、onClick 等等需要被 merge,而不是替换
  • 大部分组件都是通过间距来控制高度的,因此和设计稿有 2px 误差,设计稿必须把边框设计为内边框
  • 没有固定的公式计算 line-height,可以用 setIcecreamFontSize 设置字号的同时帮助设置行高

Develop

Build

yarn build

Test

yarn test

Start Dumi

yarn dev