# bizarre-ui

> This Components Library will help get you started developing in Vue 3.

Latest version **1.0.1** (published 2023-07-29) · ISC license · 0 weekly downloads

## Install

```sh
npm install bizarre-ui
pnpm add bizarre-ui
yarn add bizarre-ui
bun add bizarre-ui
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.1 |
| Published | 2023-07-29 |
| First published | 2023-07-29 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 12 |
| Unpacked size | 945.6 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Author | theMuseCatcher |
| Maintainers | fyfy123 |
| Keywords | Vue3, TS, Vite, Less, Amazing, UI, Components, Tools |

## Links

- npm: https://www.npmjs.com/package/bizarre-ui
- Repository: https://github.com/FyStrive/bizarre-ui
- Homepage: https://github.com/FyStrive/bizarre-ui.git#readme
- Issues: https://github.com/FyStrive/bizarre-ui.git/issues
- npm.io page: https://npm.io/package/bizarre-ui

## Dependencies (12)

- [vue](https://npm.io/package/vue.md) ^3.3.4
- [qrcode](https://npm.io/package/qrcode.md) ^1.5.3
- [swiper](https://npm.io/package/swiper.md) ^9.4.1
- [core-js](https://npm.io/package/core-js.md) ^3.31.1
- [date-fns](https://npm.io/package/date-fns.md) ^2.30.0
- [vue-router](https://npm.io/package/vue-router.md) ^4.2.4
- [@vueuse/core](https://npm.io/package/@vueuse/core.md) ^10.2.1
- [ant-design-vue](https://npm.io/package/ant-design-vue.md) ^4.0.0
- [vue-amazing-ui](https://npm.io/package/vue-amazing-ui.md) ^0.0.39
- [@vueuse/integrations](https://npm.io/package/@vueuse/integrations.md) ^10.2.1
- [@ant-design/icons-vue](https://npm.io/package/@ant-design/icons-vue.md) ^6.1.0
- [@vuepic/vue-datepicker](https://npm.io/package/@vuepic/vue-datepicker.md) ^4.5.1

## Alternatives

- [@progress/kendo-ooxml](https://npm.io/package/@progress/kendo-ooxml.md) — 152.1K weekly downloads
- [@progress/kendo-react-ripple](https://npm.io/package/@progress/kendo-react-ripple.md) — 8.0K weekly downloads
- [@progress/kendo-react-orgchart](https://npm.io/package/@progress/kendo-react-orgchart.md) — 4.3K weekly downloads
- [@praxisui/dynamic-fields](https://npm.io/package/@praxisui/dynamic-fields.md) — 2.4K weekly downloads
- [@progress/kendo-vue-listbox](https://npm.io/package/@progress/kendo-vue-listbox.md) — 932 weekly downloads

## Recent versions

- 1.0.1 (latest) — 2023-07-29
- 1.0.0 — 2023-07-29
- 0.0.39 — 2023-07-29

## README

# bizarre-ui

_该组件库采用 `Vue3@3.3.4 `+ `TypeScript@4.7.4` + `Vite4.4.7` + `Less@4.1.3` 实现！_<br/> _所有组件样式 `CSS` 均使用 `box-sizing: border-box;` 模式！_<br/> _目前共有 `46` 个常用基础 `UI` 组件，以及 `10` 个常用工具函数，并且持续探索更新中...！_<br/> _开箱即用！_

## Document & Online preview

[Bizarre UI](https://fystrive.github.io/bizarre-ui/)

## Install & Use

```bash
pnpm i bizarre-ui
# or
npm install bizarre-ui
# or
yarn add bizarre-ui
```

Import and register component

**Global**

```ts
import { createApp } from 'vue'
import App from './App.vue'

import VueAmazingUI from 'bizarre-ui'
import 'bizarre-ui/css'

const app = createApp(App)
app.use(BizarreUI)
```

**Local**

```vue
<script setup lang="ts">
import { Button } from 'bizarre-ui'
import 'bizarre-ui/css'
</script>
```

## Project

- Get the project code

```sh
git clone https://github.com/themusecatcher/bizarre-ui.git
```

- Install dependencies

```sh
cd bizarre-ui

pnpm i
```

- Run project

```sh
pnpm dev
```

## Components

| Component name | Descriptions | Component name | Descriptions |
| :------------- | :----------- | :------------- | :----------- |
| Alert          | 警告提示     | Breadcrumb     | 面包屑       |
| Button         | 按钮         | Card           | 卡片         |
| Carousel       | 走马灯       | Cascader       | 级联选择     |
| Checkbox       | 多选框       | Collapse       | 折叠面板     |
| Countdown      | 倒计时       | DatePicker     | 日期选择     |
| Dialog         | 对话框       | Divider        | 分割线       |
| Empty          | 空状态       | Grid           | 栅格         |
| Image          | 图片         | Input          | 输入框       |
| InputNumber    | 数字输入框   | Message        | 全局提示     |
| Modal          | 信息提示     | Notification   | 通知提醒框   |
| Pagination     | 分页         | Progress       | 进度条       |
| QRCode         | 二维码       | Radio          | 单选框       |
| Rate           | 评分         | Result         | 结果         |
| Select         | 选择器       | Slider         | 滑动输入条   |
| Space          | 间距         | Spin           | 加载中       |
| Statistic      | 统计数值     | Steps          | 步骤条       |
| Swiper         | 触摸滑动插件 | Switch         | 开关         |
| Table          | 表格         | Tabs           | 标签页       |
| Tag            | 标签         | Textarea       | 文本域       |
| TextScroll     | 文字滚动     | Timeline       | 时间轴       |
| Tooltip        | 文字提示     | Upload         | 上传         |
| Video          | 播放器       | Waterfall      | 瀑布流       |

## Details

[My CSDN Blogs](https://blog.csdn.net/Dandrose)

## Functions

| Function name | Descriptions | Arguments |
| :-- | :-- | :-- |
| dateFormat | 简单易用的日期格式化函数！ | (timestamp: number&#124;string&#124;Date, format = 'YYYY-MM-DD HH:mm:ss') => string |
| requestAnimationFrame | 针对不同浏览器进行兼容处理！ | 使用方式不变 |
| cancelAnimationFrame | 针对不同浏览器进行兼容处理！ | 使用方式不变 |
| rafTimeout | 使用 requestAnimationFrame 实现的定时器函数，等效替代 (setTimeout 和 setInterval)！ | (func: Function, delay = 0, interval = false) => object |
| cancelRaf | 用于取消 rafTimeout 函数！ | (raf: { id: number }) => void |
| throttle | 使用 rafTimeout 实现的节流函数！ | (fn: Function, delay = 300) => any |
| debounce | 使用 rafTimeout 实现的防抖函数！ | (fn: Function, delay = 300) => any |
| add | 消除 js 加减精度问题的加法函数！ | (num1: number, num2: number) => number |
| downloadFile | 下载文件并自定义文件名！ | (url: string, name: string) => void |
| moneyFormat | 金额格式化函数！ | (value: number&#124;string, decimal = 2, split = ',') => string |

---
_Source: https://npm.io/package/bizarre-ui · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._