├── .eslintignore ├── .eslintrc.js ├── .github └── workflows │ ├── main.yml │ └── pages.yml ├── .gitignore ├── .husky └── pre-commit ├── .npmrc ├── .prettierignore ├── .prettierrc ├── .travis.yml ├── .vscode └── settings.json ├── LICENSE ├── README.md ├── demo └── index.html ├── dev ├── app.vue ├── dashborad.vue ├── layout.vue ├── main.ts ├── online-pkg.vue ├── readme.md ├── router.js └── setting.vue ├── docs ├── .vitepress │ ├── components │ │ └── gitalk.vue │ ├── config.ts │ ├── nav.ts │ ├── sidebar.ts │ ├── theme │ │ ├── Layout.vue │ │ ├── index.ts │ │ ├── style.css │ │ └── var.css │ └── vitepress-theme-demoblock │ │ ├── bin │ │ ├── help.ts │ │ └── vitepress-register-components.ts │ │ ├── client │ │ ├── components │ │ │ ├── Demo.vue │ │ │ ├── DemoBlock.vue │ │ │ ├── Message.vue │ │ │ └── message.js │ │ ├── index.ts │ │ └── utils.ts │ │ ├── node │ │ ├── demoblock.ts │ │ ├── index.ts │ │ ├── markdown-it-container.d.ts │ │ ├── patterns.ts │ │ ├── render.ts │ │ └── utils.ts │ │ ├── theme │ │ ├── index.ts │ │ └── styles │ │ │ ├── code.css │ │ │ ├── index.css │ │ │ └── layout.css │ │ ├── types │ │ └── index.ts │ │ └── utils │ │ ├── getDirname.ts │ │ ├── index.ts │ │ └── util.ts ├── components │ ├── avatar.md │ ├── backtop.md │ ├── button.md │ ├── calendar.md │ ├── card.md │ ├── carousel.md │ ├── checkbox.md │ ├── collapse-transition.md │ ├── drawer.md │ ├── empty.md │ ├── icon.md │ ├── index.md │ ├── input.md │ ├── layout.md │ ├── loading.md │ ├── lockScreen.md │ ├── menu.md │ ├── message.md │ ├── modal.md │ ├── popper.md │ ├── ripple.md │ ├── select.md │ ├── skeleton.md │ ├── slider.md │ ├── space.md │ ├── switch.md │ ├── tab.md │ ├── tag.md │ └── tooltip.md ├── guide │ ├── colors.md │ ├── index.md │ ├── overview.md │ ├── quickstart.md │ ├── timeline.md │ └── toggle-theme.md ├── index.md ├── public │ ├── favicon.ico │ ├── fullscreen-bg2.jpg │ ├── ik-1.jpg │ ├── ik-2.jpg │ ├── ik-3.jpg │ ├── ik-4.png │ ├── ik-5.png │ ├── ik-6.png │ ├── ik-7.png │ ├── ikun.gif │ └── layer5.png ├── shims-vue.d.ts ├── styles │ ├── animation.md │ ├── index.md │ └── shadow.md └── vite.config.ts ├── global.d.ts ├── index.html ├── package.json ├── packages ├── ikui-components │ ├── README.md │ ├── __test__ │ │ └── button.test.ts │ ├── _utils │ │ ├── useClickOutside.ts │ │ ├── useCssVar.ts │ │ ├── useZIndex.ts │ │ └── withInstall.ts │ ├── avatar │ │ ├── index.ts │ │ └── src │ │ │ ├── avatar.tsx │ │ │ └── prop.ts │ ├── backtop │ │ ├── index.ts │ │ └── src │ │ │ ├── backtop.tsx │ │ │ └── prop.ts │ ├── button │ │ ├── index.ts │ │ └── src │ │ │ ├── button.ts │ │ │ └── button.vue │ ├── calendar │ │ ├── index.ts │ │ └── src │ │ │ ├── calendar-util.ts │ │ │ ├── calendar.vue │ │ │ └── props.ts │ ├── card │ │ ├── index.ts │ │ └── src │ │ │ ├── card.ts │ │ │ └── card.vue │ ├── carousel │ │ ├── index.ts │ │ └── src │ │ │ ├── carousel-item.vue │ │ │ ├── carousel.vue │ │ │ └── prop.ts │ ├── checkbox-group │ │ ├── index.ts │ │ └── src │ │ │ ├── checkbox-group.ts │ │ │ ├── checkbox-group.vue │ │ │ └── interface.d.ts │ ├── checkbox │ │ ├── index.ts │ │ └── src │ │ │ ├── checkbox.ts │ │ │ └── checkbox.vue │ ├── collapse-transition │ │ ├── index.ts │ │ └── src │ │ │ └── collapse-transition.vue │ ├── drawer │ │ ├── index.ts │ │ └── src │ │ │ ├── drawer.ts │ │ │ └── drawer.vue │ ├── empty │ │ ├── index.ts │ │ └── src │ │ │ ├── empty.tsx │ │ │ └── prop.ts │ ├── icon │ │ ├── index.ts │ │ └── src │ │ │ ├── icon.ts │ │ │ └── icon.vue │ ├── index.ts │ ├── input │ │ ├── index.ts │ │ └── src │ │ │ ├── input.ts │ │ │ └── input.vue │ ├── layout │ │ ├── index.ts │ │ └── src │ │ │ ├── aside.vue │ │ │ ├── container.vue │ │ │ ├── header.vue │ │ │ └── main.vue │ ├── loading │ │ ├── index.ts │ │ └── src │ │ │ ├── directive.ts │ │ │ ├── mask.ts │ │ │ ├── mask.vue │ │ │ └── service.ts │ ├── lock-screen │ │ ├── index.ts │ │ └── src │ │ │ ├── lock-screen.vue │ │ │ └── prop.ts │ ├── menu │ │ ├── index.ts │ │ └── src │ │ │ ├── collapse-transition.vue │ │ │ ├── menu-item.vue │ │ │ ├── menu.vue │ │ │ ├── prop.ts │ │ │ └── submenu.vue │ ├── message │ │ ├── index.ts │ │ └── src │ │ │ ├── message.ts │ │ │ ├── message.vue │ │ │ └── service.ts │ ├── modal │ │ ├── index.ts │ │ └── src │ │ │ ├── model.tsx │ │ │ └── props.ts │ ├── package.json │ ├── popper │ │ ├── index.ts │ │ └── src │ │ │ ├── popper.vue │ │ │ └── prop.ts │ ├── ripple │ │ ├── index.ts │ │ └── src │ │ │ ├── interface.ts │ │ │ └── ripple.ts │ ├── select │ │ ├── index.ts │ │ └── src │ │ │ ├── props.ts │ │ │ └── select.tsx │ ├── skeleton │ │ ├── index.ts │ │ └── src │ │ │ ├── prop.ts │ │ │ └── skeleton.vue │ ├── slider │ │ ├── index.ts │ │ └── src │ │ │ ├── prop.ts │ │ │ └── slider.vue │ ├── space │ │ ├── index.ts │ │ └── src │ │ │ ├── prop.ts │ │ │ ├── space.ts │ │ │ └── space.vue │ ├── switch │ │ ├── index.ts │ │ └── src │ │ │ ├── prop.ts │ │ │ └── switch.vue │ ├── tab │ │ ├── index.ts │ │ └── src │ │ │ ├── props.ts │ │ │ ├── tab-item.vue │ │ │ └── tab.tsx │ ├── tag │ │ ├── index.ts │ │ └── src │ │ │ ├── prop.ts │ │ │ └── tag.tsx │ └── tooltip │ │ ├── index.ts │ │ └── src │ │ ├── tooltip.ts │ │ ├── tooltip.vue │ │ └── tooltip2.vue ├── ikui-theme │ ├── index.scss │ ├── mixins │ │ ├── common.scss │ │ ├── config.scss │ │ ├── transition.scss │ │ └── var.scss │ ├── package.json │ └── src │ │ ├── avatar.scss │ │ ├── backTop.scss │ │ ├── button.scss │ │ ├── calendar.scss │ │ ├── card.scss │ │ ├── checkbox.scss │ │ ├── container.scss │ │ ├── drawer.scss │ │ ├── empty.scss │ │ ├── icon.scss │ │ ├── input.scss │ │ ├── loading.scss │ │ ├── lock-screen.scss │ │ ├── menu.scss │ │ ├── message.scss │ │ ├── modal.scss │ │ ├── ripple.scss │ │ ├── select.scss │ │ ├── skeleton.scss │ │ ├── slider.scss │ │ ├── space.scss │ │ ├── switch.scss │ │ ├── tab.scss │ │ ├── tag.scss │ │ └── tooltip.scss └── utils │ └── install.ts ├── pnpm-lock.yaml ├── pnpm-workspace.yaml ├── scripts ├── build-theme.config.ts ├── create-component.ts └── gen.ts ├── tsconfig.json ├── vite-plugin-setup-name.ts ├── vite.config.ts └── vitest.config.ts /.eslintignore: -------------------------------------------------------------------------------- 1 | /dev 2 | /dist 3 | */node_modules/* 4 | **/node_modules/** -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | env: { 3 | browser: true, 4 | es2021: true, 5 | node: true, 6 | }, 7 | extends: [ 8 | 'eslint:recommended', 9 | 'plugin:vue/vue3-essential', 10 | 'plugin:@typescript-eslint/recommended', 11 | 'plugin:prettier/recommended', 12 | ], 13 | overrides: [], 14 | parser: 'vue-eslint-parser', 15 | parserOptions: { 16 | ecmaVersion: 'latest', 17 | parser: '@typescript-eslint/parser', 18 | sourceType: 'module', 19 | }, 20 | plugins: ['vue', '@typescript-eslint'], 21 | rules: { 22 | 'vue/multi-word-component-names': 'off', 23 | }, 24 | } 25 | -------------------------------------------------------------------------------- /.github/workflows/main.yml: -------------------------------------------------------------------------------- 1 | name: Codecov 2 | on: 3 | push: 4 | branches: [master] 5 | pull_request: 6 | branches: [master] 7 | jobs: 8 | UnitTest: 9 | # The type of runner that the job will run on 10 | runs-on: ubuntu-latest 11 | # Steps represent a sequence of tasks that will be executed as part of the job 12 | steps: 13 | - uses: actions/checkout@v2 14 | - uses: pnpm/action-setup@v2.1.0 15 | with: 16 | version: 7.2.1 17 | - name: Install modules 18 | run: pnpm install 19 | - name: Run Test 20 | run: pnpm run coverage 21 | - name: Upload coverage to Codecov 22 | uses: codecov/codecov-action@v3 23 | with: 24 | files: ./coverage/coverage-final.json,./coverage/index.html,./coverage/clover.html 25 | token: ${{ secrets.CODECOV_TOKEN }} 26 | -------------------------------------------------------------------------------- /.github/workflows/pages.yml: -------------------------------------------------------------------------------- 1 | name: Deploy 2 | 3 | on: 4 | push: 5 | branches: 6 | - master 7 | 8 | jobs: 9 | deploy: 10 | runs-on: ubuntu-latest 11 | steps: 12 | - name: Checkout 13 | uses: actions/checkout@v3 14 | 15 | - name: Setup pnpm 16 | uses: pnpm/action-setup@v2 17 | 18 | - name: Setup node 19 | uses: actions/setup-node@v3 20 | with: 21 | node-version: 18 22 | 23 | - name: Install dependencies 24 | run: pnpm i 25 | 26 | - name: Build Ik UI 27 | run: pnpm build 28 | env: 29 | FORCE_COLOR: 2 30 | NODE_OPTIONS: --max-old-space-size=4096 31 | 32 | - name: Build website 33 | run: pnpm docs:build 34 | env: 35 | DOC_ENV: preview 36 | NODE_OPTIONS: --max-old-space-size=4096 37 | 38 | - name: Deploy 39 | uses: peaceiris/actions-gh-pages@v3 40 | with: 41 | github_token: ${{ secrets.GITHUB_TOKEN }} 42 | publish_dir: docs/.vitepress/dist 43 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | /node_modules 3 | dist 4 | /docs/.vitepress/dist 5 | /docs/.vitepress/cache 6 | /coverage -------------------------------------------------------------------------------- /.husky/pre-commit: -------------------------------------------------------------------------------- 1 | #!/usr/bin/env sh 2 | . "$(dirname -- "$0")/_/husky.sh" 3 | 4 | pnpm lint && pnpm format 5 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | strict-peer-dependencies=false -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | dist 2 | node_modules 3 | coverage 4 | CHANGELOG.en-US.md 5 | pnpm-lock.yaml 6 | docs/components.d.ts -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true, 4 | "printWidth": 120, 5 | "endOfLine": "auto", 6 | "overrides": [ 7 | { 8 | "files": ".prettierrc", 9 | "options": { 10 | "parser": "json" 11 | } 12 | } 13 | ] 14 | } 15 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - lts/* 4 | install: 5 | - yarn install # npm ci 6 | script: 7 | - yarn docs:build # npm run docs:build 8 | deploy: 9 | provider: pages 10 | skip_cleanup: true 11 | local_dir: docs/.vitepress/dist 12 | # 在 GitHub 中生成，用于允许 Travis 向你的仓库推送代码。在 Travis 的项目设置页面进行配置，设置为 secure variable 13 | github_token: $GITHUB_TOKEN 14 | keep_history: true 15 | on: 16 | branch: master 17 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "editor.codeActionsOnSave": { 3 | "source.fixAll": "never", 4 | "source.fixAll.eslint": "explicit" 5 | }, 6 | "editor.formatOnSave": true, 7 | "editor.defaultFormatter": "esbenp.prettier-vscode" 8 | } 9 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2023 LAINE001 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # IKUN-UI 2 | 3 |

4 | logo 5 |

6 | 7 |

8 | IKUNUI 9 |

10 | 11 |

12 | a simple ui components built on vue3 . 13 |
14 | docs see IKUNUI， 国内：https://laine001.gitee.io/ikun-ui/ or https://ikun-cool.netlify.app/ 15 |

16 | 17 |

18 | 19 | 20 | 21 | 22 |

23 | 24 | ## Features 25 | 26 | - 🏀 vue3、typescript 27 | - ⚡ vite3 28 | - 🌈 pnpm 29 | - ✨ monorepo 30 | 31 | ## Install 32 | 33 | Using `npm` to install: 34 | 35 | ```bash 36 | npm i ikun-ui 37 | ``` 38 | 39 | Using `yarn` or `pnpm` to install: 40 | 41 | ```bash 42 | yarn add ikun-ui 43 | 44 | pnpm add ikun-ui 45 | ``` 46 | 47 | ## Quickstart 48 | 49 | ```js 50 | import { createApp } from 'vue' 51 | import App from './app.vue' 52 | 53 | import ikun from 'ikun-ui' 54 | import 'ikunui/lib/index.css' 55 | 56 | createApp(App).use(ikun).mount('#app') 57 | 58 | // or 59 | 60 | import { IkButton } from 'ikun-ui' 61 | app.use(IkButton) 62 | ``` 63 | 64 | see more in [Quickstart](https://laine001.github.io/ik-ui) 65 | 66 | ## Links 67 | 68 | - [Documentation](https://laine001.github.io/ikun-ui) 69 | - [Timelines](https://laine001.github.io/ikun-ui) 70 | - [more](https://laine001.github.io/ikun-ui) 71 | 72 | ## Join us 73 | 74 | Hava an idea ? u can join us 75 | 76 | ## Contributors 77 | 78 | 79 | 80 | 81 | 82 | ## Thanks 83 | 84 | Learn from many excellent community projects 85 | 86 | - [Element-plus](https://github.com/element-plus/element-plus) 87 | - [Vant](https://github.com/youzan/vant) 88 | - [Varlet](https://github.com/varletjs/varlet) 89 | - [Antd](https://ant.design/index-cn) 90 | - [Fighting-Design](https://github.com/LAINE001/fighting-design) 91 | 92 | ## LICENSE 93 | 94 | [MIT](https://github.com/LAINE001/ikun-ui/blob/master/LICENSE) 95 | -------------------------------------------------------------------------------- /demo/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | {{ message }} 26 | {{ message }}22 27 |
28 | 48 | 64 | 65 | 66 | -------------------------------------------------------------------------------- /dev/dashborad.vue: -------------------------------------------------------------------------------- 1 | 2 | 31 | 36 | -------------------------------------------------------------------------------- /dev/main.ts: -------------------------------------------------------------------------------- 1 | import { createApp } from 'vue' 2 | import app from './layout.vue' 3 | import IkUI from 'ikuiv' 4 | import '@ikui/theme/index.scss' 5 | import router from './router' 6 | 7 | document.title = 'ikui-dev' 8 | createApp(app).use(IkUI).use(router).mount('#app') 9 | 10 | // import { createApp } from 'vue' 11 | // import app from './online-pkg.vue' 12 | // import IkUI, { IkButton } from 'ikuiv' 13 | // console.log(IkButton, 'IkButton') 14 | 15 | // createApp(app) 16 | // .use(IkUI) 17 | // .mount('#app') 18 | -------------------------------------------------------------------------------- /dev/online-pkg.vue: -------------------------------------------------------------------------------- 1 | 5 | -------------------------------------------------------------------------------- /dev/readme.md: -------------------------------------------------------------------------------- 1 | # git 提交规范 2 | 3 | - feat：新增功能（feature） 4 | - fix：修复补丁（bug） 5 | - docs：修订文档，如 Readme, Change Log, Contribute 等 6 | - refactor：代码重构，未新增任何功能和修复任何 bug 7 | - style： 仅调整空格、格式缩进等（不改变代码逻辑的变动） 8 | - perf：优化相关，改善性能和体验的修改 9 | - test：测试用例的增加/修改 10 | - chore：非 src 和 test 的修改 11 | - merge：合并分支或冲突等 12 | - revert： 回滚到上一个版本 13 | - build：改变构建流程，新增依赖库、工具等（例如 webpack、maven 修改） 14 | - ci：自动化流程配置修改 15 | -------------------------------------------------------------------------------- /dev/router.js: -------------------------------------------------------------------------------- 1 | import { createRouter, createWebHistory } from 'vue-router' 2 | 3 | import Dashboard from './dashborad.vue' 4 | import Setting from './setting.vue' 5 | 6 | const routes = [ 7 | { 8 | path: '/', 9 | redirect: '/dashboard', 10 | name: 'dashboard', 11 | }, 12 | { 13 | path: '/dashboard', 14 | name: 'dashboard', 15 | component: Dashboard, 16 | }, 17 | { 18 | path: '/setting', 19 | name: 'setting', 20 | component: Setting, 21 | }, 22 | ] 23 | 24 | const router = createRouter({ 25 | history: createWebHistory(), 26 | routes, 27 | }) 28 | 29 | export default router 30 | -------------------------------------------------------------------------------- /dev/setting.vue: -------------------------------------------------------------------------------- 1 | 2 | 7 | 8 | -------------------------------------------------------------------------------- /docs/.vitepress/components/gitalk.vue: -------------------------------------------------------------------------------- 1 | 21 | 26 | 62 | -------------------------------------------------------------------------------- /docs/.vitepress/nav.ts: -------------------------------------------------------------------------------- 1 | export default [ 2 | { 3 | text: '首页', 4 | link: '/', 5 | }, 6 | { 7 | text: '指引', 8 | // link: '/guide/quickstart', 9 | // activeMatch: '/guide/', 10 | collapsed: false, 11 | items: [ 12 | { 13 | text: '概览', 14 | link: '/guide/overview', 15 | }, 16 | { 17 | text: '快速上手', 18 | link: '/guide/quickstart', 19 | }, 20 | { 21 | text: '视觉与色彩', 22 | link: '/guide/colors', 23 | }, 24 | { 25 | text: '动态主题', 26 | link: '/guide/toggle-theme', 27 | }, 28 | ], 29 | }, 30 | { 31 | text: '组件', 32 | link: '/components/button', 33 | activeMatch: '/components/', 34 | }, 35 | // { 36 | // text: 'CSS', 37 | // link: '/styles/animation', 38 | // activeMatch: '/styles/', 39 | // }, 40 | { 41 | text: '相关链接', 42 | items: [ 43 | { 44 | text: 'vitejs', 45 | link: 'https://vitejs.dev/', 46 | }, 47 | { 48 | text: 'vue3', 49 | link: 'https://vuejs.org/', 50 | }, 51 | { 52 | text: 'blog', 53 | link: 'https://laine001.github.io/blog/fe/components-proj', 54 | }, 55 | { 56 | text: '国内链接', 57 | link: 'https://laine001.gitee.io/ikun-ui/', 58 | }, 59 | ], 60 | }, 61 | ] 62 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/Layout.vue: -------------------------------------------------------------------------------- 1 | 2 | 3 | 39 | 40 | 43 | 44 | 69 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/index.ts: -------------------------------------------------------------------------------- 1 | import DefaultTheme from 'vitepress/theme' 2 | import Layout from './Layout.vue' 3 | import IkUI, { message } from 'ikuiv' 4 | import '@ikui/theme/index.scss' 5 | // import Demo from '../components/demo.vue' 6 | // import DemoBlock from '../components/demoBlock.vue' 7 | import './var.css' 8 | import './style.css' 9 | // console.log(IkUI, message, 'IkUI') 10 | import Demo from '../vitepress-theme-demoblock/client/components/Demo.vue' 11 | import DemoBlock from '../vitepress-theme-demoblock/client/components/DemoBlock.vue' 12 | import Comment from '../components/gitalk.vue' 13 | import '../vitepress-theme-demoblock/theme/styles/index.css' 14 | 15 | export default { 16 | extends: DefaultTheme, 17 | Layout, 18 | enhanceApp({ app }) { 19 | app.use(IkUI) 20 | app.config.globalProperties.$message = message 21 | app.component('Demo', Demo) 22 | app.component('DemoBlock', DemoBlock) 23 | app.component('git-talk', Comment) 24 | }, 25 | } 26 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/var.css: -------------------------------------------------------------------------------- 1 | /* home */ 2 | :root { 3 | --vp-home-hero-name-color: transparent; 4 | /* --vp-home-hero-name-background: -webkit-linear-gradient(120deg, #cd8025 40%, #eccd90); */ 5 | --vp-home-hero-name-background: -webkit-linear-gradient(120deg, var(--primary-color) 40%, var(--primary-color-hover)); 6 | 7 | /* --vp-home-hero-image-background-image: linear-gradient(-45deg, #cd8025 50%, #eccd90 50%); */ 8 | --vp-home-hero-image-background-image: linear-gradient( 9 | -45deg, 10 | var(--primary-color) 50%, 11 | var(--primary-color-hover) 50% 12 | ); 13 | --vp-home-hero-image-filter: blur(60px); 14 | } 15 | 16 | /** 17 | * Colors 18 | * -------------------------------------------------------------------------- */ 19 | 20 | /* :root { 21 | --vp-c-brand: #cd8025; 22 | --vp-c-brand-light: #cd8025; 23 | --vp-c-brand-lighter: #505058; 24 | --vp-c-brand-lightest: #1a1a20; 25 | --vp-c-brand-dark: #a55b03; 26 | --vp-c-brand-darker: #a55b03; 27 | --vp-c-brand-dimm: rgba(100, 108, 255, 0.08); 28 | } */ 29 | :root { 30 | /* --vp-c-brand: #6379f6; */ 31 | --vp-c-brand: var(--primary-color); 32 | /* --vp-c-brand-light: #6379f6; */ 33 | --vp-c-brand-light: var(--primary-color); 34 | --vp-c-brand-lighter: #505058; 35 | --vp-c-brand-lightest: #1a1a20; 36 | /* --vp-c-brand-dark: #6379f6; */ 37 | /* --vp-c-brand-dark: #6379f6; */ 38 | --vp-c-brand-dark: var(--primary-color); 39 | --vp-c-brand-dimm: rgba(100, 108, 255, 0.08); 40 | 41 | --vp-c-brand-opacity: var(--primary-color-hover); 42 | --vp-c-brand-hover: var(--primary-color-hover); 43 | } 44 | 45 | /** 46 | * Component: Button 47 | * -------------------------------------------------------------------------- */ 48 | 49 | :root { 50 | --vp-button-brand-border: var(--vp-c-brand-light); 51 | --vp-button-brand-text: var(--vp-c-text-dark-1); 52 | --vp-button-brand-bg: var(--vp-c-brand); 53 | --vp-button-brand-hover-border: var(--vp-c-brand-light); 54 | --vp-button-brand-hover-text: var(--vp-c-text-dark-1); 55 | --vp-button-brand-hover-bg: var(--vp-c-brand-light); 56 | --vp-button-brand-active-border: var(--vp-c-brand-light); 57 | --vp-button-brand-active-text: var(--vp-c-text-dark-1); 58 | --vp-button-brand-active-bg: var(--vp-button-brand-bg); 59 | } 60 | -------------------------------------------------------------------------------- /docs/.vitepress/vitepress-theme-demoblock/bin/help.ts: -------------------------------------------------------------------------------- 1 | import prettier from 'prettier' 2 | import yaml from 'yaml' 3 | import path from 'path' 4 | import fs from 'fs' 5 | 6 | const cwd = process.cwd() 7 | const resolve = (...args: any[]) => path.resolve(cwd, ...args) 8 | 9 | const prettierConfigPath = '.prettierrc' 10 | 11 | export const format = (content: string, userOptions = { parser: 'javascript' }) => { 12 | const defaultOptionBuffer = fs.readFileSync(resolve(prettierConfigPath)) 13 | const defaultOptions = yaml.parse(defaultOptionBuffer.toString()) 14 | const options = Object.assign({}, defaultOptions, userOptions) 15 | return prettier.format(content, options) 16 | } 17 | -------------------------------------------------------------------------------- /docs/.vitepress/vitepress-theme-demoblock/client/components/DemoBlock.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 19 | 20 | 32 | -------------------------------------------------------------------------------- /docs/.vitepress/vitepress-theme-demoblock/client/components/Message.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 52 | 53 | 100 | -------------------------------------------------------------------------------- /docs/.vitepress/vitepress-theme-demoblock/client/components/message.js: -------------------------------------------------------------------------------- 1 | import { createApp, h } from 'vue' 2 | import Message from './Message.vue' 3 | 4 | // newInstance 5 | Message.newInstance = (props = {}) => { 6 | const container = document.createElement('div') 7 | 8 | const app = createApp({ 9 | render() { 10 | return h(Message, { 11 | ...props, 12 | ref: 'messageRef', 13 | }) 14 | }, 15 | }) 16 | 17 | const instance = app.mount(container) 18 | const messageRef = instance.$refs.messageRef 19 | document.body.appendChild(container.firstElementChild) 20 | 21 | return { 22 | add(messageProps) { 23 | messageRef.add(messageProps) 24 | }, 25 | remove(name) { 26 | messageRef.remove(name) 27 | }, 28 | } 29 | } 30 | 31 | // message 32 | let messageInstance 33 | 34 | function getMessageInstance() { 35 | messageInstance = messageInstance || Message.newInstance() 36 | return messageInstance 37 | } 38 | 39 | function message(content, { duration = 3, type = '' }) { 40 | const instance = getMessageInstance() 41 | 42 | instance.add({ content, duration, type }) 43 | } 44 | 45 | export default { 46 | info(content, options) { 47 | return message(content, { ...options }) 48 | }, 49 | error(content, options) { 50 | return message(content, { ...options, type: 'error' }) 51 | }, 52 | } 53 | -------------------------------------------------------------------------------- /docs/.vitepress/vitepress-theme-demoblock/client/index.ts: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/laine001/ikun-ui/b4da78aa7e152fb135ad9350e3b30a494004a9aa/docs/.vitepress/vitepress-theme-demoblock/client/index.ts -------------------------------------------------------------------------------- /docs/.vitepress/vitepress-theme-demoblock/client/utils.ts: -------------------------------------------------------------------------------- 1 | export function stripScript(content: string) { 2 | const result = content.match(/<(script)>([\s\S]+)<\/\1>/) 3 | return result && result[2] ? result[2].trim() : '' 4 | } 5 | 6 | export function stripStyle(content: string) { 7 | const result = content.match(/<(style)\s*>([\s\S]+)<\/\1>/) 8 | return result && result[2] ? result[2].trim() : '' 9 | } 10 | 11 | // 编写例子时不一定有 template。所以采取的方案是剔除其他的内容 12 | function _stripTemplate(content: string) { 13 | content = content.trim() 14 | if (!content) { 15 | return content 16 | } 17 | return content.replace(/<(script|style)[\s\S]+<\/\1>/g, '').trim() 18 | } 19 | 20 | export function stripTemplate(content: string) { 21 | const result = _stripTemplate(content) 22 | if (result.indexOf('