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

mixment

v0.0.1

Published

A comprehensive component library based on Vue 3 and TypeScript.

Readme

📁 Packages 目录结构 🎨 基础UI组件库 (packages/components/) 通用基础组件 (general/) Button - 按钮组件

Icon - 图标组件

Link - 链接组件

Typography - 排版文本组件

Divider - 分割线组件

数据展示组件 (data-display/) Avatar - 头像组件

Badge - 徽章组件

Calendar - 日历组件

Card - 卡片组件

Carousel - 走马灯组件

Collapse - 折叠面板组件

Empty - 空状态组件

List - 列表组件

Progress - 进度条组件

Statistic - 统计数值组件

Table - 表格组件

Tag - 标签组件

Timeline - 时间轴组件

Tree - 树形控件组件

数据输入组件 (data-entry/) Checkbox - 多选框组件

Cascader - 级联选择器组件

DatePicker - 日期选择器组件

Form - 表单组件

FormItem - 表单项组件

Input - 输入框组件

Radio - 单选框组件

Rate - 评分组件

Select - 选择器组件

Slider - 滑块组件

Switch - 开关组件

TimePicker - 时间选择器组件

Transfer - 穿梭框组件

Upload - 上传组件

反馈组件 (feedback/) Alert - 警告提示组件

Dialog - 对话框组件

Drawer - 抽屉组件

Loading - 加载中组件

Message - 消息提示组件

Modal - 模态框组件

Notification - 通知组件

Popconfirm - 气泡确认框组件

Popover - 气泡卡片组件

Result - 结果页组件

Spin - 加载中动画组件

Tooltip - 文字提示组件

布局组件 (layout/) Grid - 栅格布局组件

Layout - 布局容器组件

Space - 间距组件

Splitter - 分割面板组件

导航组件 (navigation/) Affix - 固钉组件

Anchor - 锚点组件

Breadcrumb - 面包屑组件

Dropdown - 下拉菜单组件

Menu - 导航菜单组件

Pagination - 分页组件

Steps - 步骤条组件

Tabs - 标签页组件

其他组件 (other/) Backtop - 回到顶部组件

ConfigProvider - 全局配置组件

🌋 三维地质建模组件库 (packages/3d-geology/) 三维核心引擎 (core/) Camera - 相机控制系统

Controls - 交互控制组件

Lights - 光照系统组件

Loader - 模型加载器组件

Renderer - 渲染器组件

Scene - 场景管理组件

地质专业组件 (geology/) Drill - 钻孔数据组件

Fault - 断层显示组件

GeologicalMap - 地质图组件

OreBody - 矿体模型组件

RockType - 岩性识别组件

Strata - 地层展示组件

Well - 井筒数据组件

可视化组件 (visualization/) Contour - 等值线组件

HeatMap - 热力图组件

Mesh - 网格模型组件

PointCloud - 点云数据组件

Section - 剖面图组件

VectorField - 矢量场组件

Volume - 体渲染组件

三维工具组件 (tools/) Animation - 动画控制组件

Annotation - 标注工具组件

Clipping - 剪切平面组件

Export - 数据导出组件

Measure - 测量工具组件

Picking - 拾取交互组件

💼 业务级组件库 (packages/business-components/) 通用业务组件 (common/) AdvancedTable - 高级表格组件

FileManager - 文件管理器组件

OrgSelector - 组织选择器组件

SearchForm - 搜索表单组件

UserAvatar - 用户头像组件

矿山业务组件 (mining/) EquipmentStatus - 设备状态组件

MinePlan - 矿山规划组件

ProductionMonitor - 生产监控组件

ResourceEstimate - 资源估算组件

SafetyAlert - 安全预警组件

地质业务组件 (geology/) BoreholeViewer - 钻孔查看器组件

GeologicalModel - 地质模型组件

ReserveCalc - 储量计算组件

RiskAssessment - 风险评估组件

StrataCorrelation - 地层对比组件

图表组件 (charts/) DrillChart - 钻孔图表组件

EquipmentChart - 设备图表组件

GeologyChart - 地质图表组件

ProductionChart - 生产图表组件

SafetyChart - 安全图表组件

报表组件 (reports/) 各种专业报表组件

表单组件 (forms/) 各种业务表单组件

🎨 主题系统 (packages/theme-chalk/) 样式资源 (src/) 基础样式变量 (common/var.scss)

组件样式文件 (components/)

混合功能 (mixins/)

动画效果 (animations/)

主题配置 (themes/)

工具函数 (functions/)

🔧 工具库 (packages/utils/) 工具函数 (hooks/) useDebounce - 防抖Hook

useForm - 表单管理Hook

useLockscreen - 锁屏Hook

useModal - 模态框管理Hook

useRequest - 请求管理Hook

useThrottle - 节流Hook

工具类 (dom/, strings/, etc.) DOM操作工具

字符串处理工具

常量定义

数据验证工具

HTTP请求工具

日期处理工具

数字处理工具

🚀 项目特色 模块化设计 - 每个组件独立,支持按需加载

TypeScript支持 - 完整的类型定义

主题定制 - 支持多套主题切换

三维可视化 - 专业的地质三维展示

业务组件 - 针对矿山行业的专用组件

工具完备 - 丰富的工具函数和Hooks

📦 安装和使用 bash

安装依赖

pnpm install

启动开发服务器

pnpm dev

构建项目

pnpm build

运行测试

pnpm test