├── .stylelintignore ├── docs ├── modal.md ├── notice.md ├── guide │ ├── introduce.md │ └── install.md ├── icon.md ├── layout.md ├── tag.md ├── message.md ├── checkbox.md ├── button.md └── input.md ├── demo ├── styles │ ├── demo │ │ ├── button.scss │ │ ├── icon.scss │ │ └── layout.scss │ ├── mixins.scss │ ├── reset.scss │ ├── index.scss │ └── variables.scss ├── favicon.ico ├── images │ ├── fast-ui.png │ ├── github.png │ └── fast-logo.png ├── app.tsx ├── pages │ └── home │ │ ├── index.scss │ │ └── index.tsx ├── components │ ├── footer │ │ ├── index.scss │ │ └── index.tsx │ ├── all-icon │ │ ├── index.scss │ │ ├── index.tsx │ │ └── icons.json │ ├── sidebar │ │ ├── index.scss │ │ └── index.tsx │ ├── doc-layout │ │ ├── index.tsx │ │ └── index.scss │ ├── demo-container │ │ ├── index.scss │ │ ├── atom-one-light.css │ │ └── index.tsx │ └── header │ │ ├── index.scss │ │ └── index.tsx ├── utils │ ├── compile.ts │ ├── clipboard.ts │ └── group.ts ├── constant │ └── index.ts ├── shims.d.ts ├── index.ts ├── index.html └── router │ └── index.tsx ├── .commitlintrc.js ├── README.md ├── postcss.config.js ├── packages ├── checkbox-group │ ├── index.scss │ └── index.tsx ├── styles │ ├── index.scss │ ├── mixins.scss │ ├── reset.scss │ └── variables.scss ├── utils │ ├── event-bus.ts │ ├── emitter.ts │ └── props-type.ts ├── row │ ├── index.scss │ └── index.tsx ├── icon │ ├── index.scss │ └── index.tsx ├── row-col │ ├── index.scss │ └── index.tsx ├── button-group │ ├── index.scss │ └── index.tsx ├── checkbox │ ├── icons.tsx │ ├── index.scss │ └── index.tsx ├── message │ ├── index.scss │ └── index.tsx ├── tag │ ├── index.tsx │ └── index.scss ├── button │ ├── index.tsx │ └── index.scss └── input │ ├── index.scss │ └── index.tsx ├── test ├── .eslintrc.js └── utils │ └── group.test.js ├── .eslintignore ├── .stylelintrc.js ├── .babelrc.js ├── .gitignore ├── bin └── generate-icon.js ├── .github ├── workflows │ └── deploy-gh-page.yml └── ISSUE_TEMPLATE │ ├── feature_request.md │ └── bug_report.md ├── jest.config.js ├── tsconfig.json ├── LICENSE ├── package.json └── .eslintrc.js /.stylelintignore: -------------------------------------------------------------------------------- 1 | demo/styles/reset.scss -------------------------------------------------------------------------------- /docs/modal.md: -------------------------------------------------------------------------------- 1 | [toc] 2 | 3 | ## Modal 模态框 -------------------------------------------------------------------------------- /docs/notice.md: -------------------------------------------------------------------------------- 1 | [toc] 2 | 3 | ## Notice 通知 -------------------------------------------------------------------------------- /demo/styles/demo/button.scss: -------------------------------------------------------------------------------- 1 | .demo-button { 2 | 3 | } 4 | -------------------------------------------------------------------------------- /docs/guide/introduce.md: -------------------------------------------------------------------------------- 1 | [toc] 2 | ## FAST UI 3 | 4 | 这是一个基于Vue3.x的ui组件 5 | -------------------------------------------------------------------------------- /demo/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mario34/fast-ui/HEAD/demo/favicon.ico -------------------------------------------------------------------------------- /docs/guide/install.md: -------------------------------------------------------------------------------- 1 | [toc] 2 | ## 安装 3 | 4 | The document is being written... 5 | 6 | -------------------------------------------------------------------------------- /.commitlintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: ['@commitlint/config-conventional'] 3 | } -------------------------------------------------------------------------------- /demo/images/fast-ui.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mario34/fast-ui/HEAD/demo/images/fast-ui.png -------------------------------------------------------------------------------- /demo/images/github.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mario34/fast-ui/HEAD/demo/images/github.png -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # FAST UI 2 | 3 | 🌈 一个基于Vue3.x的UI组件库 4 | 5 | [预览地址](https://mario34.github.io/fast-ui) 6 | -------------------------------------------------------------------------------- /demo/images/fast-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Mario34/fast-ui/HEAD/demo/images/fast-logo.png -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: [ 3 | require('autoprefixer'), 4 | ], 5 | }; 6 | -------------------------------------------------------------------------------- /packages/checkbox-group/index.scss: -------------------------------------------------------------------------------- 1 | @import "../styles/variables.scss"; 2 | 3 | .fa-check-box-group { 4 | 5 | } 6 | -------------------------------------------------------------------------------- /test/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [ 3 | 'eslint:recommended', 4 | 'plugin:jest/recommended', 5 | ] 6 | } -------------------------------------------------------------------------------- /packages/styles/index.scss: -------------------------------------------------------------------------------- 1 | @import "../styles/mixins.scss"; 2 | @import "../styles/reset.scss"; 3 | 4 | body { 5 | color: #555; 6 | } 7 | -------------------------------------------------------------------------------- /packages/utils/event-bus.ts: -------------------------------------------------------------------------------- 1 | import mitt from 'mitt'; 2 | 3 | /** 4 | * EventBus替代方案 5 | * https://v3.vuejs.org/guide/migration/events-api.html#overview 6 | */ 7 | export default mitt(); 8 | -------------------------------------------------------------------------------- /demo/app.tsx: -------------------------------------------------------------------------------- 1 | import { defineComponent } from 'vue'; 2 | 3 | const App = defineComponent({ 4 | render() { 5 | return ; 6 | }, 7 | }); 8 | 9 | export default App; 10 | -------------------------------------------------------------------------------- /demo/styles/demo/icon.scss: -------------------------------------------------------------------------------- 1 | @import "@/demo/styles/variables.scss"; 2 | 3 | .demo-icon { 4 | .fa-icon { 5 | padding: 12px; 6 | font-size: 26px; 7 | color: $__color_text4; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | src/utils/popper.js 2 | src/utils/date.js 3 | examples/play 4 | *.sh 5 | node_modules 6 | lib 7 | coverage 8 | *.md 9 | *.scss 10 | *.woff 11 | *.ttf 12 | .eslintrc* 13 | build/ 14 | bin/ 15 | ./dist -------------------------------------------------------------------------------- /.stylelintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: ["stylelint-config-recommended"], 3 | plugins: ["stylelint-scss"], 4 | rules: { 5 | "at-rule-no-unknown": null, 6 | "scss/at-rule-no-unknown": true 7 | } 8 | }; -------------------------------------------------------------------------------- /demo/pages/home/index.scss: -------------------------------------------------------------------------------- 1 | @import "@/demo/styles/variables.scss"; 2 | 3 | .home__main { 4 | min-height: calc(100vh - 120px); 5 | color: $__color_text4; 6 | display: flex; 7 | align-items: center; 8 | justify-content: center; 9 | font-size: 14px; 10 | } 11 | -------------------------------------------------------------------------------- /packages/row/index.scss: -------------------------------------------------------------------------------- 1 | .fa-row { 2 | position: relative; 3 | box-sizing: border-box; 4 | 5 | &::before { 6 | display: table; 7 | content: ""; 8 | } 9 | 10 | &::after { 11 | display: table; 12 | content: ""; 13 | clear: both; 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /.babelrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | "presets": [ 3 | "@babel/preset-typescript", 4 | [ 5 | '@babel/preset-env', 6 | { 7 | targets: { 8 | node: 'current', 9 | }, 10 | }, 11 | ], 12 | ], 13 | "plugins": [ 14 | "@ant-design-vue/babel-plugin-jsx" 15 | ] 16 | } -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | /dist 4 | 5 | # local env files 6 | .env.local 7 | .env.*.local 8 | 9 | # Log files 10 | npm-debug.log* 11 | yarn-debug.log* 12 | yarn-error.log* 13 | pnpm-debug.log* 14 | .eslintcache 15 | 16 | # Editor directories and files 17 | .idea 18 | .vscode 19 | *.suo 20 | *.ntvs* 21 | *.njsproj 22 | *.sln 23 | *.sw? -------------------------------------------------------------------------------- /demo/components/footer/index.scss: -------------------------------------------------------------------------------- 1 | @import "@/demo/styles/variables.scss"; 2 | 3 | .footer { 4 | border-top: 1px solid $__color_line3; 5 | 6 | &__container { 7 | height: 59px; 8 | display: flex; 9 | justify-content: center; 10 | align-items: center; 11 | } 12 | 13 | &__tips { 14 | font-weight: 500; 15 | color: #333; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /demo/styles/demo/layout.scss: -------------------------------------------------------------------------------- 1 | @import "@/demo/styles/variables.scss"; 2 | 3 | .demo-layout { 4 | .fa-col { 5 | line-height: 40px; 6 | background-color: #f0f0f0; 7 | text-align: center; 8 | color: $__color_text4; 9 | 10 | &:nth-child(2n) { 11 | background-color: #efefef; 12 | } 13 | 14 | &:nth-child(2n + 1) { 15 | background-color: #eff6fc; 16 | } 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /packages/icon/index.scss: -------------------------------------------------------------------------------- 1 | [class^="fa-icon"], 2 | [class*=" fa-icon"] { 3 | font-family: 'tabler-icons' !important; 4 | speak: none; 5 | font-style: normal; 6 | font-weight: normal; 7 | font-variant: normal; 8 | text-transform: none; 9 | line-height: 1em; 10 | vertical-align: -0.125em; 11 | 12 | /* Better Font Rendering */ 13 | -webkit-font-smoothing: antialiased; 14 | -moz-osx-font-smoothing: grayscale; 15 | } 16 | -------------------------------------------------------------------------------- /demo/styles/mixins.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * 单行文本省略 3 | */ 4 | @mixin single-overflow($width) { 5 | overflow: hidden; 6 | white-space: nowrap; 7 | text-overflow: ellipsis; 8 | max-width: $width; 9 | } 10 | 11 | /** 12 | * 多行文本省略 13 | */ 14 | @mixin multiline-overflow($line) { 15 | overflow: hidden; 16 | text-overflow: ellipsis; 17 | display: -webkit-box; 18 | -webkit-line-clamp: $line; 19 | -webkit-box-orient: vertical; 20 | } 21 | -------------------------------------------------------------------------------- /demo/components/footer/index.tsx: -------------------------------------------------------------------------------- 1 | import { defineComponent } from 'vue'; 2 | import './index.scss'; 3 | 4 | const Footer = defineComponent({ 5 | setup() { 6 | return () => ( 7 | 14 | ); 15 | }, 16 | }); 17 | 18 | export default Footer; 19 | -------------------------------------------------------------------------------- /bin/generate-icon.js: -------------------------------------------------------------------------------- 1 | /** 2 | * 读取feather-icons/dist/icons/下的文件，生成JSON数组 3 | * 用于Icon文档展示所有icon 4 | */ 5 | 6 | const fs = require('fs'); 7 | const path = require('path'); 8 | const files = fs.readdirSync(path.join(__dirname, '../node_modules/feather-icons/dist/icons/')) 9 | .filter(i => (/\.svg$/).test(i)) 10 | 11 | const iconsJson = files.map(item => item.slice(0, -4)) 12 | 13 | fs.writeFileSync(path.join(__dirname, '../demo/components/all-icon/icons.json'), JSON.stringify(iconsJson)) -------------------------------------------------------------------------------- /demo/pages/home/index.tsx: -------------------------------------------------------------------------------- 1 | import { defineComponent } from 'vue'; 2 | import Footer from '@/demo/components/footer'; 3 | import Header from '@/demo/components/header'; 4 | import './index.scss'; 5 | 6 | export default defineComponent({ 7 | setup() { 8 | return () => ( 9 | <> 10 |
11 |
12 | 🛠 The home page is under construction. 13 |
14 |