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 🙏

© 2025 – Pkg Stats / Ryan Hefner

shibo-ui

v1.0.1

Published

React components library

Downloads

4

Readme

Build Status tested with jest david-dev-image david-image

Shibo UI,是一款基于 Dumi,由 React + TypeScript 开发的个人组件库 🎉。

该开源项目是我为进阶 React,同时探索组件库设计开发思路所做的,故不可用于生产环境。由于个人设计能力有限,故 UI 设计方面会大量参考Ant Design 组件库,同时组件的使用方式也会参照 Ant Design 进行实现。如果你也想学习组件开发,欢迎加入或提供意见,你的 star ⭐,是对我最大的鼓励。

✨ 特性

  • 🌈 提炼组件库设计良好的视觉风格
  • 📦 渐进式探索高质量的前端代码的实现
  • 🛡 使用 TypeScript 开发,提升开发体验
  • ✅ 使用单元测试,为组件稳定性保驾护航
  • 📖 提供开发过程的文档思路,助力你学习组件开发
  • 🔖 欢迎贡献组件代码,探索最佳实践

📦 安装

使用 npm 或 yarn 安装(推荐)

yarn add shibo-ui
npm install shibo-ui

🔨 示例

import { Button } from 'shibo-ui'

const App = () => (
  <>
    <Button type="primary">Primary Button</Button>
  </>
)

引入样式:

import 'shibo-ui/dist/index.css'

计划

🚧 开发中......

  • [ ] 开发 Upload 组件

✨ 已完成

  • [x] CSS 样式解决方案、初始化文件结构、UI 设计
  • [x] Button 组件开发与测试
  • [x] 增加 Travis CI
  • [x] 创建入口文件,并发布到 npm
  • [x] 开发 Alert 组件
  • [x] 开发 Menu 组件
  • [x] 开发 Tab 组件
  • [x] 开发 Input 组件
  • [x] 开发 AutoComplete 组件
  • [x] 开发 Tag 组件
  • [x] 开发 Select 组件

开源协议

版权 (c) 2020-至今 归 JackySummer 所有. 详情请阅 LICENSE.