npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

phoenix-ui

v3.5.30

Published

future team ui for app with react

Downloads

325

Readme

phoenix-ui

一个基于React的移动端UI组件库。

Install

    $ npm install phoenix-ui --save

Usage

    // CommonJS
    var Button = require('phoenix-ui/lib/button');
    // ES6
    import Button from 'phoenix-ui/lib/button';

    //react
    <Button phSize="xs" phStyle="primary">按钮</Button>

Attention

使用phoenix2.0+版本必须在head中引入gfs-viewport.js:

    ...
    <meta charset="UTF-8">
    <title>Phoenix-ui Examples</title>
    <script type="text/javascript" src="https://www.dpfile.com/app/gfs-viewport/gfs-viewport.js"></script>
    ...

以上js文件自动生成viewport的meta,需要删掉之前写在头部的<meta name="viewport" ...>

Layout

强烈推荐rem布局,布局方式:750规格设计稿提供的px值(像素值)下,除以100,得到rem的值。 配合gfs-viewport.js解决px在不同dpr(设备像素比)下的表现差异问题。

Documentation

文档随时更新,请关注: https://future-team.github.io/phoenix-ui/doc/index.html

Examples

https://future-team.github.io/phoenix-ui/examples/index.html

    $ cd phoenix-ui
    $ npm install
    $ bower install
    生成文件:
    build:npm run build || gulp build
    开发调试:
    demo:npm run dev || gulp dev
    测试:
    npm run test
    生成文档:
    npm run docBuild
    查看示例:
    $npm install anywhere -g
    $ anywhere

Browser Support

Phoenix UI is tested with the following browsers and mobile OS.

  • Android 4.4.2 +
  • IOS 8 +
  • Chrome

Command

    $ npm run dev
    $ npm run build
    $ npm run doc
    $ npm run test

Repair

version 3.5.0 FastClick兼容ios11。 version 3.4.0 ButtonGroup新增extra属性,Checkbox新增小的checkbox,PhFilterCheckbox支持showExtra。 version 3.0.1 styles采用px布局,摒除viewport引入。 version 3.0.0 升级到react16。 version 2.0.13 接入[email protected]记录数据。 version 2.0.10 解决ph-filter、input等多组件问题。 version 2.0.0 去掉TableView和ForemGroup,新增List;Popover去掉Whisper的辅助使用;Input拆分成Input、Checkbox、Radio等。 version 1.7.4 Toast增加duration的参数范围; Button增加phIcon属性。 version 1.7.0 Slider组件功能拓展,新增Steps、ImageList组件; version 1.6.2 新增LoadingList组件; version 1.4.2 Toast拓展; ButtonGroup回调函数名称修改; version 1.4.1 onChange方法统一改名,避免子组件包含Input组件引发的问题;menu组件bug修改。 version 1.4.0 新增menu子组件,包括导航,导航列表 version 1.3.0 新增menu组件 version 1.2.0 新增Icon组件 version 1.1.3 统一组件使用方式; Textarea bug处理&使用方式优化; 优化手风琴使用方式; 增加弹框可操控参数; version 1.1.1 样式统一加ph前缀,配合[email protected]使用 version 1.1.0 增加Drag对鼠标事件的支持;文案类整理 version 1.0.0 新增Whisper/Popover、Slider、Animate、Drag version 0.4.0 新增Popup、Accordion、Modal改Dialog version 0.3.0 新增Textarea、Swipe、Modal、Toast version 0.2.0 修复tab相关bug和优化