├── theme ├── dark │ ├── appBar.ts │ ├── chip.ts │ ├── tabs.ts │ ├── badge.ts │ ├── paper.ts │ ├── button.ts │ ├── menu.ts │ ├── radio-group.ts │ ├── breadcrumbs.ts │ ├── pullRefresh.ts │ ├── checkbox-group.ts │ ├── popup.ts │ ├── tab.ts │ ├── cell.ts │ ├── dialog.ts │ ├── bottomNavigationItem.ts │ ├── index.d.ts │ ├── avatar.ts │ ├── divider.ts │ ├── input.ts │ ├── switch.ts │ ├── bottomNavigation.ts │ ├── actionSheet.ts │ ├── steps.ts │ ├── datePicker.ts │ ├── select.ts │ ├── collapse.ts │ ├── card.ts │ ├── timePicker.ts │ ├── uploader.ts │ ├── pagination.ts │ ├── table.ts │ ├── common.ts │ ├── result.ts │ ├── skeleton.ts │ └── picker.ts └── light │ ├── countdown.ts │ ├── icon.ts │ ├── paper.ts │ ├── menu.ts │ ├── overlay.ts │ ├── loading.ts │ ├── backtop.ts │ ├── popup.ts │ ├── ripple.ts │ ├── swipe.ts │ ├── loading-bar.ts │ ├── progress.ts │ ├── breadcrumbs.ts │ ├── appBar.ts │ ├── rote.ts │ ├── divider.ts │ ├── form.ts │ ├── pullRefresh.ts │ ├── radio-group.ts │ ├── indexBar.ts │ ├── space.ts │ ├── checkbox-group.ts │ ├── badge.ts │ ├── avatar.ts │ ├── link.ts │ ├── fab.ts │ ├── list.ts │ ├── cell.ts │ ├── collapse.ts │ ├── image-preview.ts │ ├── slider.ts │ ├── switch.ts │ ├── tooltip.ts │ ├── counter.ts │ ├── tabs.ts │ ├── input.ts │ ├── picker.ts │ ├── actionSheet.ts │ ├── table.ts │ ├── snackBar.ts │ ├── dialog.ts │ ├── buttonNavigation.ts │ ├── steps.ts │ ├── common.ts │ ├── skeleton.ts │ ├── select.ts │ ├── pagination.ts │ ├── button.ts │ ├── chip.ts │ ├── result.ts │ ├── card.ts │ └── uploader.ts ├── .prettierrc ├── sponsor └── community.png ├── src ├── form │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── index.ts │ │ ├── zh-CN.ts │ │ └── en-US.ts ├── icon │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── input │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── link │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── index.ts │ │ └── en-US.ts ├── menu │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── cell │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ ├── Editor.vue │ │ └── index.vue ├── chip │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── index.ts │ │ └── en-US.ts ├── counter │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── index.ts │ │ └── en-US.ts │ │ └── Editor.vue ├── fab │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── index-bar │ ├── example │ │ ├── locale │ │ │ ├── zh-CN.ts │ │ │ ├── en-US.ts │ │ │ └── index.ts │ │ └── Editor.vue │ └── docs │ │ ├── zh-CN.md │ │ └── en-US.md ├── list │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── overlay │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── paper │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ ├── Editor.vue │ │ └── index.vue ├── picker │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── popup │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── rate │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── index.ts │ │ └── en-US.ts ├── space │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── swipe │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── switch │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── table │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── tabs │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── index.ts │ │ ├── zh-CN.ts │ │ └── en-US.ts ├── app-bar │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── avatar │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── back-top │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── index.vue ├── badge │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── button │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── index.ts │ │ ├── zh-CN.ts │ │ └── en-US.ts ├── card │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── index.ts │ │ └── en-US.ts ├── collapse │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── common │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── index.ts │ │ ├── zh-CN.ts │ │ └── en-US.ts ├── countdown │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── date-picker │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── dialog │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── loading │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── pagination │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ ├── Editor.vue │ │ └── index.vue ├── result │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── ripple │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ ├── Editor.vue │ │ └── index.vue ├── select │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── index.ts │ │ ├── zh-CN.ts │ │ └── en-US.ts ├── skeleton │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── slider │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── snackbar │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── steps │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── time-picker │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── uploader │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── index.ts │ │ └── en-US.ts ├── action-sheet │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── checkbox-group │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── divider │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ ├── Editor.vue │ │ └── index.vue ├── progress │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── pull-refresh │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ └── Editor.vue ├── radio-group │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── tooltip │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── index.ts │ │ └── en-US.ts ├── bottom-navigation │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── breadcrumbs │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ └── Editor.vue ├── image-preview │ ├── docs │ │ ├── zh-CN.md │ │ └── en-US.md │ └── example │ │ ├── Editor.vue │ │ └── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts ├── loading-bar │ ├── docs │ │ ├── en-US.md │ │ └── zh-CN.md │ └── example │ │ ├── locale │ │ ├── zh-CN.ts │ │ ├── en-US.ts │ │ └── index.ts │ │ ├── Editor.vue │ │ └── index.vue └── utils │ ├── shared.ts │ └── sync.ts ├── shims ├── shims-md.d.ts └── shims-vue.d.ts ├── .prettierignore ├── .gitignore ├── .github ├── ISSUE_TEMPLATE │ ├── custom.md │ ├── feature_request.md │ └── bug_report.md └── workflows │ └── deploy-playground-sync-gitee.yaml ├── babel.config.js ├── components └── editor │ └── locale │ ├── zh-CN.ts │ ├── en-US.ts │ └── index.ts ├── tsconfig.json ├── docs ├── home.zh-CN.md └── home.en-US.md ├── LICENSE └── README.zh-CN.md /theme/dark/appBar.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--app-bar-color': '#272727', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/chip.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--chip-default-color': '#555', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/tabs.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--tabs-background': '#1e1e1e', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/badge.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--badge-default-color': '#555', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/paper.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--paper-background': '#303030', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/button.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--button-default-color': '#303030', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/menu.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--menu-background-color': '#272727', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/radio-group.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--radio-unchecked-color': '#fff', 3 | } 4 | -------------------------------------------------------------------------------- /theme/light/countdown.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--countdown-text-color': '#fff', 3 | } 4 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "printWidth": 120, 3 | "singleQuote": true, 4 | "semi": false 5 | } 6 | -------------------------------------------------------------------------------- /sponsor/community.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/varletjs/varlet-ute/HEAD/sponsor/community.png -------------------------------------------------------------------------------- /src/form/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 表单 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` -------------------------------------------------------------------------------- /src/icon/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 图标 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/input/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Input 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` -------------------------------------------------------------------------------- /src/input/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 输入框 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` -------------------------------------------------------------------------------- /src/link/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 链接 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/menu/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 菜单 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /theme/dark/breadcrumbs.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--breadcrumb-inactive-color': '#aaa', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/pullRefresh.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--pull-refresh-background': '#303030', 3 | } 4 | -------------------------------------------------------------------------------- /src/cell/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Cell 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/cell/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 单元格 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/chip/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 纸片 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/counter/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 计数器 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/fab/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Fab 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/fab/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 悬浮按钮 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/form/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Form 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` -------------------------------------------------------------------------------- /src/index-bar/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | title: '标题', 3 | text: '文本', 4 | } 5 | -------------------------------------------------------------------------------- /src/link/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Link 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/list/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # List 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/list/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 无限滚动列表 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/menu/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Menu 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/overlay/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 遮罩层 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/paper/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 纸张 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/picker/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 多列选择器 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/popup/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Popup 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/popup/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 弹出层 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/rate/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 评分 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/space/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Space 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/swipe/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Swipe 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/swipe/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 轮播 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/switch/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 开关 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/table/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Table 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/table/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 表格 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/tabs/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Tabs 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/tabs/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 选项卡组 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /theme/dark/checkbox-group.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--checkbox-unchecked-color': '#fff', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/popup.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--popup-content-background-color': '#1e1e1e', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/tab.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--tab-inactive-color': 'rgba(255, 255, 255, 0.65)', 3 | } 4 | -------------------------------------------------------------------------------- /src/app-bar/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 导航栏 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/avatar/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Avatar 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/avatar/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 头像 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/back-top/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # BackTop 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/back-top/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 回到顶部 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/badge/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Badge 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/badge/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 徽标 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | 7 | -------------------------------------------------------------------------------- /src/button/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Button 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/button/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 按钮 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/card/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Card 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/card/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 卡片 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | 7 | -------------------------------------------------------------------------------- /src/chip/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Chip 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/collapse/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 折叠面板 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/common/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 公共样式 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/countdown/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 倒计时 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/counter/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Counter 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/date-picker/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 日期选择器 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/dialog/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Dialog 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/dialog/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 对话框 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/icon/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Icon 2 | 3 | 4 | ```vue 5 | import Editor from '../example/Editor' 6 | ``` 7 | -------------------------------------------------------------------------------- /src/index-bar/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 索引栏 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/index-bar/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | title: 'Title', 3 | text: 'Text', 4 | } 5 | -------------------------------------------------------------------------------- /src/loading/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Loading 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/loading/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 加载 2 | 3 | 4 | ```vue 5 | import Editor from '../example/Editor' 6 | ``` 7 | -------------------------------------------------------------------------------- /src/overlay/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Overlay 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/pagination/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 分页 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/paper/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Paper 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/picker/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Picker 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/rate/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Rate 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/result/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Result 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/result/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 结果 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/ripple/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 水波指令 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/select/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Select 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/select/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 选择框 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/skeleton/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 骨架屏 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/slider/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Slider 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/slider/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 滑块 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/snackbar/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 消息条 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/space/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # Space 间隔 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/steps/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Steps 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/steps/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 步骤条 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/switch/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Switch 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/time-picker/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 时间选择器 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/uploader/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Uploader 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/uploader/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 文件上传 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /shims/shims-md.d.ts: -------------------------------------------------------------------------------- 1 | declare module '*.md' { 2 | const content: string 3 | export default content 4 | } 5 | -------------------------------------------------------------------------------- /src/action-sheet/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 动作面板 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/app-bar/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # AppBar 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/checkbox-group/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 复选框 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/collapse/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Collapse 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/date-picker/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # DatePicker 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/divider/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Divider 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/divider/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 分割线 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | 7 | -------------------------------------------------------------------------------- /src/index-bar/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # IndexBar 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/progress/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Progress 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/progress/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 进度条 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | 7 | -------------------------------------------------------------------------------- /src/pull-refresh/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 下拉刷新 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/radio-group/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Radio 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/skeleton/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Skeleton 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/snackbar/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Snackbar 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/time-picker/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # TimePicker 2 | 3 | ```vue 4 | import Editor from '../example/Editor' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/tooltip/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Tooltip 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/tooltip/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 提示 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | 7 | -------------------------------------------------------------------------------- /theme/light/icon.ts: -------------------------------------------------------------------------------- 1 | const IconTheme = { 2 | '--icon-size': '20px', 3 | } 4 | 5 | export default IconTheme 6 | -------------------------------------------------------------------------------- /src/bottom-navigation/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 底部导航栏 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/breadcrumbs/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Breadcrumbs 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/breadcrumbs/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 面包屑 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | 7 | -------------------------------------------------------------------------------- /src/checkbox-group/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Checkbox 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/common/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Common Style 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/countdown/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Countdown 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/image-preview/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 图片预览 2 | 3 | 4 | ```vue 5 | import Editor from '../example/Editor' 6 | ``` 7 | -------------------------------------------------------------------------------- /src/loading-bar/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # LoadingBar 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/loading-bar/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 加载条 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | 7 | -------------------------------------------------------------------------------- /src/pagination/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Pagination 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/radio-group/docs/zh-CN.md: -------------------------------------------------------------------------------- 1 | # 单选框 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | 7 | -------------------------------------------------------------------------------- /src/ripple/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # Ripple Directive 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/action-sheet/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # ActionSheet 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /src/image-preview/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # ImagePreview 2 | 3 | 4 | ```vue 5 | import Editor from '../example/Editor' 6 | ``` 7 | -------------------------------------------------------------------------------- /src/pull-refresh/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # PullRefresh 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /theme/dark/cell.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--cell-desc-color': '#aaa', 3 | '--cell-border-color': '#545454', 4 | } 5 | -------------------------------------------------------------------------------- /theme/light/paper.ts: -------------------------------------------------------------------------------- 1 | const paperTheme = { 2 | '--paper-background': '#fff', 3 | } 4 | 5 | export default paperTheme 6 | -------------------------------------------------------------------------------- /theme/dark/dialog.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--dialog-background': '#1e1e1e', 3 | '--dialog-message-color': '#bbb', 4 | } 5 | -------------------------------------------------------------------------------- /theme/light/menu.ts: -------------------------------------------------------------------------------- 1 | const MenuTheme = { 2 | '--menu-background-color': '#fff', 3 | } 4 | 5 | export default MenuTheme 6 | -------------------------------------------------------------------------------- /src/bottom-navigation/docs/en-US.md: -------------------------------------------------------------------------------- 1 | # BottomNavigation 2 | 3 | ```vue 4 | import Editor from '../example/Editor.vue' 5 | ``` 6 | -------------------------------------------------------------------------------- /theme/dark/bottomNavigationItem.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--bottom-navigation-item-active-background-color': '#272727', 3 | } 4 | -------------------------------------------------------------------------------- /theme/dark/index.d.ts: -------------------------------------------------------------------------------- 1 | import { StyleVars } from '../../../types' 2 | 3 | declare const dark: StyleVars 4 | 5 | export default dark 6 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | coverage/** 2 | es/** 3 | umd/** 4 | site/** 5 | public/** 6 | types/global.d.ts 7 | *.md 8 | package.json 9 | 10 | -------------------------------------------------------------------------------- /theme/dark/avatar.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--avatar-background-color': '#303030', 3 | '--avatar-border': '2px solid #1e1e1e', 4 | } 5 | -------------------------------------------------------------------------------- /theme/dark/divider.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--divider-color': 'rgba(255, 255, 255, 0.2)', 3 | '--divider-text-color': '#aaa', 4 | } 5 | -------------------------------------------------------------------------------- /theme/dark/input.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--input-input-text-color': '#fff', 3 | '--input-blur-color': 'rgb(255, 255, 255, 0.7)', 4 | } 5 | -------------------------------------------------------------------------------- /theme/dark/switch.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--switch-track-background': '#727272', 3 | '--switch-handle-background': '#727272', 4 | } 5 | -------------------------------------------------------------------------------- /theme/light/overlay.ts: -------------------------------------------------------------------------------- 1 | const OverlayTheme = { 2 | '--overlay-background-color': 'rgba(0, 0, 0, .6)', 3 | } 4 | 5 | export default OverlayTheme 6 | -------------------------------------------------------------------------------- /src/ripple/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | click: '点击', 3 | basicUsage: '基本使用', 4 | customColor: '自定义颜色', 5 | disabledStatus: '禁用状态', 6 | } 7 | -------------------------------------------------------------------------------- /theme/dark/bottomNavigation.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--bottom-navigation-background-color': '#272727', 3 | '--bottom-navigation-border-color': '#444', 4 | } 5 | -------------------------------------------------------------------------------- /theme/light/loading.ts: -------------------------------------------------------------------------------- 1 | const LoadingTheme = { 2 | '--loading-opacity': '0.38', 3 | '--loading-desc-margin': '8px 0 0', 4 | } 5 | 6 | export default LoadingTheme 7 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | 3 | .varlet 4 | .idea 5 | .vscode 6 | *.log 7 | .DS_Store 8 | .history 9 | 10 | site 11 | lib 12 | es 13 | umd 14 | coverage 15 | highlight -------------------------------------------------------------------------------- /src/progress/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | circle: '环形进度条', 3 | style: '自定义样式', 4 | basicUsage: '基本使用', 5 | showLabel: '显示标签', 6 | hideTrack: '隐藏轨道', 7 | } 8 | -------------------------------------------------------------------------------- /shims/shims-vue.d.ts: -------------------------------------------------------------------------------- 1 | declare module '*.vue' { 2 | import { defineComponent } from 'vue' 3 | 4 | const component: ReturnType 5 | export default component 6 | } 7 | -------------------------------------------------------------------------------- /src/loading-bar/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | start: '开始', 4 | finish: '结束', 5 | error: '错误', 6 | custom: '设置样式', 7 | clear: '清除样式', 8 | } 9 | -------------------------------------------------------------------------------- /src/paper/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | ripple: '水波效果', 4 | round: '圆形纸张', 5 | radius: '自定义圆角', 6 | slot: '使用插槽', 7 | paper: '纸张', 8 | } 9 | -------------------------------------------------------------------------------- /src/ripple/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | click: 'Click', 3 | basicUsage: 'Basic Usage', 4 | customColor: 'Custom Color', 5 | disabledStatus: 'Disabled Status', 6 | } 7 | -------------------------------------------------------------------------------- /theme/dark/actionSheet.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--action-sheet-background': '#1e1e1e', 3 | '--action-sheet-title-color': '#aaa', 4 | '--action-sheet-action-item-color': '#fff', 5 | } 6 | -------------------------------------------------------------------------------- /theme/dark/steps.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--step-content-color': 'rgba(255, 255, 255, 0.38)', 3 | '--step-content-active-color': '#fff', 4 | '--step-line-background': '#fff', 5 | } 6 | -------------------------------------------------------------------------------- /theme/dark/datePicker.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--date-picker-main-color': '#fff', 3 | '--date-picker-body-background-color': '#303030', 4 | '--day-picker-head-item-color': '#aaaaaa', 5 | } 6 | -------------------------------------------------------------------------------- /theme/dark/select.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--select-select-text-color': '#fff', 3 | '--select-blur-color': 'rgb(255, 255, 255, 0.7)', 4 | '--select-scroller-background': '#303030', 5 | } 6 | -------------------------------------------------------------------------------- /theme/light/backtop.ts: -------------------------------------------------------------------------------- 1 | const backTopTheme = { 2 | '--back-top-right': '40px', 3 | '--back-top-bottom': '40px', 4 | '--back-top-button-size': '40px', 5 | } 6 | export default backTopTheme 7 | -------------------------------------------------------------------------------- /theme/light/popup.ts: -------------------------------------------------------------------------------- 1 | const PopupTheme = { 2 | '--popup-overlay-background-color': 'rgba(0, 0, 0, .6)', 3 | '--popup-content-background-color': '#fff', 4 | } 5 | export default PopupTheme 6 | -------------------------------------------------------------------------------- /src/common/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 8 | -------------------------------------------------------------------------------- /theme/dark/collapse.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--collapse-background': '#303030', 3 | '--collapse-text-color': '#fff', 4 | '--collapse-border-top': 'thin solid rgba(255, 255, 255, 0.12)', 5 | } 6 | -------------------------------------------------------------------------------- /theme/light/ripple.ts: -------------------------------------------------------------------------------- 1 | const RippleTheme = { 2 | '--ripple-cubic-bezier': 'cubic-bezier(0.68, 0.01, 0.62, 0.6)', 3 | '--ripple-color': 'currentColor', 4 | } 5 | 6 | export default RippleTheme 7 | -------------------------------------------------------------------------------- /src/back-top/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 8 | -------------------------------------------------------------------------------- /src/cell/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | showIcon: '显示图标', 4 | showDesc: '显示描述', 5 | showBorder: '显示边框', 6 | content: '这是单元格', 7 | description: '描述', 8 | } 9 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/custom.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Custom issue template 3 | about: Describe this issue template's purpose here. 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | 8 | --- 9 | 10 | 11 | -------------------------------------------------------------------------------- /src/pull-refresh/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 8 | -------------------------------------------------------------------------------- /src/table/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | slot: '尾部插槽', 4 | math: '数学', 5 | english: '英语', 6 | tom: '火猫桑', 7 | jerry: '耗子君', 8 | name: '姓名', 9 | } 10 | -------------------------------------------------------------------------------- /src/time-picker/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | hour24: '24小时格式', 4 | readonly: '只读', 5 | timeLimit: '时间限制', 6 | custom: '自定义', 7 | showSecond: '显示秒', 8 | } 9 | -------------------------------------------------------------------------------- /theme/dark/card.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--card-background': '#303030', 3 | '--card-title-color': '#ffffff', 4 | '--card-subtitle-color': '#aaaaaa', 5 | '--card-description-color': '#aaaaaa', 6 | } 7 | -------------------------------------------------------------------------------- /theme/light/swipe.ts: -------------------------------------------------------------------------------- 1 | const SwipeTheme = { 2 | '--swipe-indicator-color': '#fff', 3 | '--swipe-indicators-offset': '10px', 4 | '--swipe-indicator-offset': '4px', 5 | } 6 | 7 | export default SwipeTheme 8 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | '@varlet/cli/preset', 5 | { 6 | loose: process.env.NODE_ENV === 'compile', 7 | }, 8 | ], 9 | ], 10 | } 11 | -------------------------------------------------------------------------------- /src/progress/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | circle: 'Circle Progress', 3 | basicUsage: 'Basic Usage', 4 | style: 'Custom Style', 5 | showLabel: 'Show Label', 6 | hideTrack: 'Hide Track', 7 | } 8 | -------------------------------------------------------------------------------- /src/space/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | baseUse: '基本使用', 3 | vertical: '垂直', 4 | space: '间隙', 5 | rightAlign: '靠右', 6 | around: '环绕', 7 | center: '居中', 8 | between: '两端对齐', 9 | } 10 | -------------------------------------------------------------------------------- /theme/dark/timePicker.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--time-picker-clock-container-background': '#545454', 3 | '--time-picker-body-background': '#303030', 4 | '--time-picker-clock-item-disable-color': '#aaaaaa', 5 | } 6 | -------------------------------------------------------------------------------- /src/loading-bar/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | start: 'Start', 4 | finish: 'Finish', 5 | error: 'Error', 6 | custom: 'Custom Style', 7 | clear: 'Clear Style', 8 | } 9 | -------------------------------------------------------------------------------- /src/swipe/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | forbidLoop: '禁止循环轮播', 4 | autoplay: '开启自动播放', 5 | vertical: '垂直轮播', 6 | handleChange: '监听切换', 7 | customIndicator: '自定义指示器', 8 | } 9 | -------------------------------------------------------------------------------- /src/paper/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | ripple: 'Ripple Effect', 4 | round: 'Rounded Paper', 5 | radius: 'Custom Border Radius', 6 | slot: 'Use Slot', 7 | paper: 'Paper', 8 | } 9 | -------------------------------------------------------------------------------- /src/time-picker/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | hour24: '24hr Format', 4 | readonly: 'Readonly', 5 | timeLimit: 'Time Limit', 6 | custom: 'Custom', 7 | showSecond: 'show-seconds', 8 | } 9 | -------------------------------------------------------------------------------- /src/list/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | loadFail: '加载失败', 4 | tipText: '提示文字', 5 | loadingText: '正在努力输出', 6 | errorText: '出错了出错了', 7 | finishedText: '一滴都没有了', 8 | listItem: '列表项', 9 | } 10 | -------------------------------------------------------------------------------- /theme/light/loading-bar.ts: -------------------------------------------------------------------------------- 1 | const LoadingBarTheme = { 2 | '--loading-bar-color': 'var(--color-primary)', 3 | '--loading-bar-error-color': 'var(--color-danger)', 4 | '--loading-bar-height': '3px', 5 | } 6 | 7 | export default LoadingBarTheme 8 | -------------------------------------------------------------------------------- /src/cell/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | showIcon: 'Show Icon', 4 | showDesc: 'Show Description', 5 | showBorder: 'Show Border', 6 | content: 'This is Cell', 7 | description: 'Description', 8 | } 9 | -------------------------------------------------------------------------------- /src/pagination/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | showTotal: '显示总数', 4 | total: '共', 5 | item: '条', 6 | disabled: '禁用', 7 | hideSize: '隐藏 size 切换器', 8 | pcTotal: '共', 9 | current: '当前', 10 | } 11 | -------------------------------------------------------------------------------- /src/divider/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | dashed: '虚线', 4 | inset: '缩进', 5 | vertical: '垂直分割线', 6 | text: '文字', 7 | withDesc: '带有文字描述的分割线', 8 | withDescText: '文字描述', 9 | custom: '自定义', 10 | } 11 | -------------------------------------------------------------------------------- /src/overlay/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | overlayBase: '基础用法', 3 | overlayContent: '嵌入内容', 4 | showOverlay: '显示遮罩层', 5 | event: '注册事件', 6 | clickOverlay: '点击遮罩层', 7 | text: '素胚勾勒出青花笔锋浓转淡, 瓶身描绘的牡丹一如你初妆, 冉冉檀香透过窗心事我了然, 宣纸上走笔至此搁一半。', 8 | } 9 | -------------------------------------------------------------------------------- /src/swipe/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | forbidLoop: 'Forbid Loop', 4 | autoplay: 'Autoplay', 5 | vertical: 'Vertical Swipe', 6 | handleChange: 'Handle Change', 7 | customIndicator: 'Custom Indicator', 8 | } 9 | -------------------------------------------------------------------------------- /src/switch/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | customColor: '自定义颜色', 4 | notAvailable: '不可用', 5 | size: '不同大小', 6 | loading: '加载状态', 7 | validateValue: '值的校验', 8 | text: '是否打开开关', 9 | state: '错误！', 10 | } 11 | -------------------------------------------------------------------------------- /src/table/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | slot: 'Footer Slots', 4 | math: 'Math', 5 | english: 'English', 6 | frontend: 'Frontend', 7 | tom: 'Tom', 8 | jerry: 'Jerry', 9 | name: 'Name', 10 | } 11 | -------------------------------------------------------------------------------- /src/breadcrumbs/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本用法', 3 | separator: '分隔符', 4 | childSeparator: '子级分隔符', 5 | separatorSlot: '分隔符插槽', 6 | level1: '首页', 7 | level2: '一级', 8 | level3: '二级', 9 | events: '注册事件', 10 | } 11 | -------------------------------------------------------------------------------- /src/picker/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: '函数调用', 3 | componentCall: '组件调用', 4 | singlePicker: '单列选择', 5 | multiplePicker: '多列选择', 6 | cascadePicker: '级联选择', 7 | textFormatter: '文本格式化', 8 | extension: '值的映射', 9 | } 10 | -------------------------------------------------------------------------------- /src/badge/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | avatarSize: '头像尺寸', 3 | avatarShape: '头像形状', 4 | fitMode: '填充模式', 5 | fontSize: '文字自适应', 6 | backgroundColor: '背景颜色', 7 | avatarHorizontalGroup: '头像水平分组', 8 | avatarVerticalGroup: '头像垂直分组', 9 | } 10 | -------------------------------------------------------------------------------- /src/date-picker/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | monthPicker: '月份选择器', 4 | multiple: '多选', 5 | range: '选择范围', 6 | dateLimit: '日期限制', 7 | custom: '自定义', 8 | year: '年', 9 | month: '月', 10 | divider: '年', 11 | } 12 | -------------------------------------------------------------------------------- /src/space/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | baseUse: 'Basic Use', 3 | vertical: 'Vertical', 4 | space: 'Space Size', 5 | rightAlign: 'Right Align', 6 | around: 'Space Around', 7 | center: 'Align Center', 8 | between: 'Space Between', 9 | } 10 | -------------------------------------------------------------------------------- /src/bottom-navigation/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | matchByName: '通过名称匹配', 4 | showBadge: '徽标提示', 5 | customColor: '自定义颜色', 6 | changeEvent: '监听切换事件', 7 | clickEvent: '监听点击事件', 8 | fab: '悬浮按钮', 9 | label: '标签', 10 | } 11 | -------------------------------------------------------------------------------- /src/list/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | loadFail: 'Load Fail', 4 | tipText: 'Tip Text', 5 | loadingText: 'loading QAQ', 6 | errorText: 'error TNT', 7 | finishedText: 'finished ORZ', 8 | listItem: 'List Item', 9 | } 10 | -------------------------------------------------------------------------------- /theme/light/progress.ts: -------------------------------------------------------------------------------- 1 | const ProgressTheme = { 2 | '--progress-font-size': 'var(--font-size-sm)', 3 | '--progress-ripple-color': '#fff', 4 | '--progress-track-color': '#d8d8d8', 5 | '--progress-background': 'var(--color-primary)', 6 | } 7 | 8 | export default ProgressTheme 9 | -------------------------------------------------------------------------------- /components/editor/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | clearProps: '重置当前组件样式变量', 3 | clearAll: '重置所有组件样式变量', 4 | exports: '导出当前主题', 5 | clearPropsSuccess: '已清空当前组件样式变量', 6 | clearAllSuccess: '已清空所有组件样式变量', 7 | exportsSuccess: '已导出当前主题', 8 | isHave: '是否要', 9 | } 10 | -------------------------------------------------------------------------------- /src/loading/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | type: '类型', 3 | size: '大小', 4 | color: '颜色', 5 | wrap: '包裹内容', 6 | open: '打开', 7 | close: '关闭', 8 | cardTitle: '介绍', 9 | cardDesc: 'Varlet 是一个基于Vue3开发的 Material 风格移动端组件库，全面拥抱Vue3生态，由社区的小伙伴开发和维护。', 10 | } 11 | -------------------------------------------------------------------------------- /theme/dark/uploader.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--uploader-action-background': '#303030', 3 | '--uploader-action-icon-color': '#fff', 4 | '--uploader-file-name-background': '#303030', 5 | '--uploader-file-name-color': '#aaa', 6 | '--uploader-file-cover-background': '#303030', 7 | } 8 | -------------------------------------------------------------------------------- /src/pagination/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | showTotal: 'Show Total', 4 | total: '', 5 | item: 'items', 6 | disabled: 'Disabled', 7 | hideSize: 'Hide Size Changer', 8 | pcTotal: 'Total ', 9 | current: 'Current', 10 | } 11 | -------------------------------------------------------------------------------- /theme/dark/pagination.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--pagination-list-bg-color': '#303030', 3 | '--pagination-hover-bg-color': '#25293a', 4 | '--pagination-list-active-bg-color': '#25293a', 5 | '--pagination-list-active-color': '#4a7afe', 6 | '--pagination-item-background': '#303030', 7 | } 8 | -------------------------------------------------------------------------------- /src/date-picker/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | monthPicker: 'Month Picker', 4 | multiple: 'Multiple', 5 | range: 'Range', 6 | dateLimit: 'Date Limit', 7 | custom: 'Custom', 8 | year: '', 9 | month: '', 10 | divider: '-', 11 | } 12 | -------------------------------------------------------------------------------- /theme/light/breadcrumbs.ts: -------------------------------------------------------------------------------- 1 | const BreadcrumbsTheme = { 2 | '--breadcrumb-active-color': 'var(--color-primary)', 3 | '--breadcrumb-inactive-color': '#888', 4 | '--breadcrumb-separator-margin': '0 10px', 5 | '--breadcrumb-separator-font-size': '14px', 6 | } 7 | 8 | export default BreadcrumbsTheme 9 | -------------------------------------------------------------------------------- /src/icon/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | iconSize: '图标尺寸', 3 | iconColor: '图标颜色', 4 | useImage: '使用图片', 5 | events: '注册事件', 6 | iconAnimation: '图标切换动画 (点击切换)', 7 | toggle: '切换', 8 | iconList: '图标列表 (点击复制)', 9 | copySuccess: '复制成功', 10 | clickSuccess: '点击成功', 11 | } 12 | -------------------------------------------------------------------------------- /src/breadcrumbs/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | separator: 'Separator', 4 | childSeparator: 'Child Separator', 5 | separatorSlot: 'Separator Slot', 6 | level1: 'Home', 7 | level2: 'Link 1', 8 | level3: 'Link 2', 9 | events: 'Events', 10 | } 11 | -------------------------------------------------------------------------------- /src/counter/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | range: '设置取值范围', 4 | step: '设置步长', 5 | toFixed: '保留小数', 6 | disabled: '禁用', 7 | readonly: '只读', 8 | lazyChange: '异步变更', 9 | size: '设置尺寸', 10 | validate: '字段校验', 11 | validateMessage: '请选择大于5的值', 12 | } 13 | -------------------------------------------------------------------------------- /src/skeleton/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | displayTitle: '显示标题', 4 | customRowsHeight: '自定义段落高度', 5 | displayAvatar: '显示头像', 6 | displayCard: '显示卡片', 7 | fullscreenMode: '全屏模式', 8 | toggleFullscreenMode: '切换全屏模式', 9 | loadingData: '加载的数据', 10 | } 11 | -------------------------------------------------------------------------------- /src/collapse/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | hideMargin: '隐藏边距', 4 | accordionMode: '手风琴模式', 5 | disabled: '禁用', 6 | enable: '启用', 7 | customContent: '自定义内容', 8 | title: '标题', 9 | text: '文本', 10 | slotTitle: '这是标题', 11 | slotContent: '这是内容', 12 | } 13 | -------------------------------------------------------------------------------- /src/fab/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/badge/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/bottom-navigation/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | matchByName: 'Match by name', 4 | showBadge: 'Show Badge', 5 | customColor: 'Custom Color', 6 | changeEvent: 'Change Event', 7 | clickEvent: 'Click Event', 8 | fab: 'Fab', 9 | label: 'label', 10 | } 11 | -------------------------------------------------------------------------------- /src/card/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/cell/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/chip/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/countdown/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | customFormat: '自定义格式', 4 | showMillisecond: '显示毫秒', 5 | customStyle: '自定义样式', 6 | manualControl: '手动控制', 7 | format: 'DD 天 HH 时 mm 分 ss 秒', 8 | startText: '开始', 9 | pauseText: '暂停', 10 | resetText: '重置', 11 | } 12 | -------------------------------------------------------------------------------- /src/form/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/icon/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/input/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/link/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/list/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/menu/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/paper/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/popup/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/rate/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/slider/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | stepSize: '指定步长', 4 | dualThumb: '双滑块', 5 | disable: '禁用', 6 | readonly: '只读', 7 | sliderSize: '不同大小', 8 | customStyle: '自定义样式', 9 | showLabel: '显示标签', 10 | customBtn: '自定义按钮', 11 | validateValue: '值的校验', 12 | } 13 | -------------------------------------------------------------------------------- /src/space/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/steps/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/swipe/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/switch/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | customColor: 'Custom Color', 4 | notAvailable: 'Not Available', 5 | size: 'Size', 6 | loading: 'Loading', 7 | validateValue: 'Validate Value', 8 | text: 'Whether to open the switch', 9 | state: 'Error!', 10 | } 11 | -------------------------------------------------------------------------------- /src/table/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/tabs/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/app-bar/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/avatar/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/button/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/collapse/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/counter/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/dialog/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/divider/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/divider/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | dashed: 'Dashed Divider', 4 | inset: 'Inset Divider', 5 | vertical: 'Vertical Divider', 6 | text: 'Text', 7 | withDesc: 'The Divider with description', 8 | withDescText: 'Description', 9 | custom: 'Custom', 10 | } 11 | -------------------------------------------------------------------------------- /src/loading/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/overlay/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/picker/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/progress/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/radio-group/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/result/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/ripple/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/select/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/skeleton/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/slider/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/snackbar/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/switch/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/tooltip/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/uploader/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/countdown/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/date-picker/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/index-bar/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/loading-bar/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/pagination/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/result/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | success: '成功', 4 | info: '信息', 5 | warning: '警告', 6 | error: '错误', 7 | question: '疑问', 8 | empty: '空值', 9 | type: '类型', 10 | button: '知道了', 11 | description: '嗨~ 我是结果页的一段描述~', 12 | changeBackgroundColor: '修改背景色', 13 | } 14 | -------------------------------------------------------------------------------- /src/time-picker/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /theme/light/appBar.ts: -------------------------------------------------------------------------------- 1 | const appBarTheme = { 2 | '--app-bar-color': 'var(--color-primary)', 3 | '--app-bar-title-padding': '0 12px', 4 | '--app-bar-text-color': '#fff', 5 | '--app-bar-height': '54px', 6 | '--app-bar-left-gap': '6px', 7 | '--app-bar-right-gap': '6px', 8 | } 9 | 10 | export default appBarTheme 11 | -------------------------------------------------------------------------------- /src/action-sheet/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/breadcrumbs/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/checkbox-group/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /src/image-preview/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /theme/light/rote.ts: -------------------------------------------------------------------------------- 1 | const RoteTheme = { 2 | '--rate-color': 'var(--color-text)', 3 | '--rate-primary-color': 'var(--color-primary)', 4 | '--rate-disabled-color': 'var(--color-text-disabled)', 5 | '--rate-error-color': 'var(--color-danger)', 6 | '--rate-action-padding': '4px', 7 | } 8 | 9 | export default RoteTheme 10 | -------------------------------------------------------------------------------- /theme/light/divider.ts: -------------------------------------------------------------------------------- 1 | const DividerTheme = { 2 | '--divider-color': 'rgba(0, 0, 0, 0.12)', 3 | '--divider-text-color': '#888', 4 | '--divider-text-margin': '8px 0', 5 | '--divider-text-padding': '0 8px', 6 | '--divider-inset': '72px', 7 | '--divider-vertical-inset': '8px', 8 | } 9 | 10 | export default DividerTheme 11 | -------------------------------------------------------------------------------- /theme/light/form.ts: -------------------------------------------------------------------------------- 1 | const formTheme = { 2 | '--form-details-error-message-color': 'var(--color-danger)', 3 | '--form-details-extra-message-color': '#888', 4 | '--form-details-margin-top': '6px', 5 | '--form-details-font-size': '12px', 6 | '--form-details-message-margin-right': '4px', 7 | } 8 | 9 | export default formTheme 10 | -------------------------------------------------------------------------------- /src/badge/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | avatarSize: 'Avatar Size', 3 | avatarShape: 'Avatar Shape', 4 | fitMode: 'Fit Mode', 5 | fontSize: 'Text Adaptive', 6 | backgroundColor: 'Background Color', 7 | avatarHorizontalGroup: 'Avatar Horizontal Group', 8 | avatarVerticalGroup: 'Avatar Vertical Group', 9 | } 10 | -------------------------------------------------------------------------------- /src/bottom-navigation/example/Editor.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 12 | -------------------------------------------------------------------------------- /theme/light/pullRefresh.ts: -------------------------------------------------------------------------------- 1 | const pullRefreshTheme = { 2 | '--pull-refresh-size': '40px', 3 | '--pull-refresh-background': '#fff', 4 | '--pull-refresh-color': 'var(--color-primary)', 5 | '--pull-refresh-success-color': 'var(--color-success)', 6 | '--pull-refresh-icon-size': '25px', 7 | } 8 | 9 | export default pullRefreshTheme 10 | -------------------------------------------------------------------------------- /src/picker/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: 'Function Call', 3 | componentCall: 'Component Call', 4 | singlePicker: 'Single Column Picker', 5 | multiplePicker: 'Multiple Column Picker', 6 | cascadePicker: 'Cascade Column Picker', 7 | textFormatter: 'Text Formatter', 8 | extension: 'Value Mapping', 9 | } 10 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "strict": true, 4 | "downlevelIteration": true, 5 | "declaration": true, 6 | "skipLibCheck": true, 7 | "esModuleInterop": true, 8 | "allowJs": true, 9 | "lib": ["esnext", "dom"], 10 | "allowSyntheticDefaultImports": true, 11 | "jsx": "preserve" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/action-sheet/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: '函数调用', 3 | basicUsage: '基本使用', 4 | modifyTitle: '修改标题', 5 | componentCall: '组件调用', 6 | yourSelected: '您选择的是:', 7 | customTitle: '选择一个你喜欢的吧', 8 | disableCloseOnClickAction: '禁用点击选项时关闭动作面板', 9 | disabled: '禁用选项', 10 | customActionStyles: '自定义选项样式', 11 | } 12 | -------------------------------------------------------------------------------- /src/menu/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | alignmentMethods: '对齐方式', 4 | topAlignment: '顶部对齐', 5 | menuOption: '菜单项', 6 | bottomAlignment: '底部对齐', 7 | offset: '偏移量', 8 | events: '注册事件', 9 | disabled: '禁用菜单', 10 | placement: '弹出位置', 11 | trigger: '触发方式', 12 | twoWayBinding: '双向绑定', 13 | } 14 | -------------------------------------------------------------------------------- /theme/dark/table.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--table-background': '#303030', 3 | '--table-thead-th-text-color': 'rgba(255, 255, 255, 0.6)', 4 | '--table-tbody-tr-hover-background': '#4c4b4b', 5 | '--table-thead-border-bottom': 'thin solid rgba(255, 255, 255, 0.12)', 6 | '--table-tbody-tr-border-bottom': 'thin solid rgba(255, 255, 255, 0.12)', 7 | } 8 | -------------------------------------------------------------------------------- /src/countdown/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | customFormat: 'Custom Format', 4 | showMillisecond: 'Show Millisecond', 5 | customStyle: 'Custom Style', 6 | manualControl: 'Manual Control', 7 | format: 'DD Day, HH:mm:ss', 8 | startText: 'Start', 9 | pauseText: 'Pause', 10 | resetText: 'Reset', 11 | } 12 | -------------------------------------------------------------------------------- /src/icon/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | iconSize: 'Icon Size', 3 | iconColor: 'Icon color', 4 | useImage: 'Use Image', 5 | events: 'Events', 6 | iconAnimation: 'Icon Animation (click toggle)', 7 | toggle: 'Toggle', 8 | iconList: 'Icon List (click copy)', 9 | copySuccess: 'copy success', 10 | clickSuccess: 'Click success', 11 | } 12 | -------------------------------------------------------------------------------- /src/steps/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | customStyle: '自定义样式', 4 | dynamicSteps: '动态步骤', 5 | vertical: '垂直模式', 6 | next: '下一步', 7 | first: '步骤1', 8 | second: '步骤2', 9 | third: '步骤3', 10 | fourth: '步骤4', 11 | fifth: '步骤5', 12 | placeholder: '改变step的数量', 13 | step: '步骤', 14 | text: '接下来...', 15 | } 16 | -------------------------------------------------------------------------------- /theme/dark/common.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--color-body': '#1e1e1e', 3 | '--color-text': '#fff', 4 | '--color-primary': '#4a7afe', 5 | '--color-info': '#10afef', 6 | '--color-success': '#10c48f', 7 | '--color-warning': '#ff8800', 8 | '--color-danger': '#ef5350', 9 | '--color-disabled': '#404040', 10 | '--color-text-disabled': '#757575', 11 | } 12 | -------------------------------------------------------------------------------- /src/input/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | plainMode: '朴素模式', 4 | textarea: '文本域', 5 | maxlength: '最大长度', 6 | disabled: '禁用', 7 | readonly: '只读', 8 | clearable: '可清除', 9 | displayIcon: '显示图标', 10 | validate: '字段校验', 11 | placeholder: '请输入文本', 12 | maxMessage: '文本长度必须大于6', 13 | clearableText: '可清除文本', 14 | } 15 | -------------------------------------------------------------------------------- /src/dialog/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: '函数调用', 3 | basicUsage: '基本使用', 4 | modifyTitle: '修改标题', 5 | hideButton: '隐藏按钮', 6 | handleUserBehavior: '处理用户行为', 7 | asyncClose: '异步关闭', 8 | componentCall: '组件调用', 9 | title: '兰亭序', 10 | message: '兰亭临帖 行书如行云流水', 11 | customSlots: '自定义插槽', 12 | asyncCloseProgress: '正在异步关闭', 13 | } 14 | -------------------------------------------------------------------------------- /src/loading/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | type: 'Type', 3 | size: 'Size', 4 | color: 'Color', 5 | wrap: 'Wrap', 6 | open: 'Open', 7 | close: 'Close', 8 | cardTitle: 'Intro', 9 | cardDesc: 10 | 'Varlet is a Material design mobile component library developed based on Vue3, developed and maintained by partners in the community.', 11 | } 12 | -------------------------------------------------------------------------------- /theme/light/radio-group.ts: -------------------------------------------------------------------------------- 1 | const RadioTheme = { 2 | '--radio-checked-color': 'var(--color-primary)', 3 | '--radio-unchecked-color': '#555', 4 | '--radio-disabled-color': 'var(--color-text-disabled)', 5 | '--radio-error-color': 'var(color-danger)', 6 | '--radio-action-padding': '6px', 7 | '--radio-icon-size': '24px', 8 | } 9 | 10 | export default RadioTheme 11 | -------------------------------------------------------------------------------- /src/slider/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | stepSize: 'Step Size', 4 | dualThumb: 'Dual thumb', 5 | disable: 'Disable', 6 | readonly: 'Readonly', 7 | sliderSize: 'Slider Size', 8 | customStyle: 'Custom Style', 9 | showLabel: 'Show Label', 10 | customBtn: 'Custom Button', 11 | validateValue: 'Validate Value', 12 | } 13 | -------------------------------------------------------------------------------- /theme/light/indexBar.ts: -------------------------------------------------------------------------------- 1 | const indexBarTheme = { 2 | '--index-bar-list-item-font-size': 'var(--font-size-xs)', 3 | '--index-bar-list-item-color': 'var(--color-primary)', 4 | '--index-bar-list-item-active-color': 'var(--color-danger)', 5 | '--index-bar-list-item-height': '14px', 6 | '--index-bar-list-item-padding': '0 10px', 7 | } 8 | 9 | export default indexBarTheme 10 | -------------------------------------------------------------------------------- /src/collapse/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | hideMargin: 'Hide Margin', 4 | accordionMode: 'Accordion Mode', 5 | disabled: 'Disabled', 6 | enable: 'Enable', 7 | customContent: 'Custom Content', 8 | title: 'Title', 9 | text: 'Hello World', 10 | slotTitle: 'This is a Title', 11 | slotContent: 'This is a content', 12 | } 13 | -------------------------------------------------------------------------------- /src/skeleton/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | displayTitle: 'Display Title', 4 | customRowsHeight: 'Custom Row Heights', 5 | displayAvatar: 'Display Avatar', 6 | displayCard: 'Display Card', 7 | fullscreenMode: 'Fullscreen Mode', 8 | toggleFullscreenMode: 'Toggle Fullscreen Mode', 9 | loadingData: 'Loading Data', 10 | } 11 | -------------------------------------------------------------------------------- /theme/dark/result.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--result-background': '#303030', 3 | '--result-title-color': '#ffffff', 4 | '--result-description-color': '#aaaaaa', 5 | '--result-question-color': '#7f8e96', 6 | '--result-question-border-color': 'rgba(151,194,216,0.3)', 7 | '--result-empty-color': '#adadad', 8 | '--result-empty-border-color': 'rgba(232,229,229,0.3)', 9 | } 10 | -------------------------------------------------------------------------------- /theme/dark/skeleton.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--skeleton-card-background-color': 'hsla(0,0%,100%,0.12)', 3 | '--skeleton-animation-background': `linear-gradient( 4 | 90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,0.05),hsla(0,0%,100%,0)) 5 | `, 6 | '--skeleton-avatar-background-color': 'hsla(0,0%,100%,0.12)', 7 | '--skeleton-title-background-color': 'hsla(0,0%,100%,0.12)', 8 | } 9 | -------------------------------------------------------------------------------- /theme/light/space.ts: -------------------------------------------------------------------------------- 1 | const SpaceTheme = { 2 | '--space-size-mini-y': '4px', 3 | '--space-size-mini-x': '4px', 4 | '--space-size-small-y': '6px', 5 | '--space-size-small-x': '6px', 6 | '--space-size-normal-y': '8px', 7 | '--space-size-normal-x': '12px', 8 | '--space-size-large-y': '12px', 9 | '--space-size-large-x': '20px', 10 | } 11 | 12 | export default SpaceTheme 13 | -------------------------------------------------------------------------------- /theme/dark/picker.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--picker-background': '#1e1e1e', 3 | '--picker-cancel-button-text-color': '#aaa', 4 | '--picker-picked-border': '1px solid rgba(255, 255, 255, 0.12)', 5 | '--picker-mask-background-image': 6 | 'linear-gradient(180deg, hsla(0, 0%, 12%, 0.9), hsla(0, 0%, 12%, 0.4)), linear-gradient(0deg, hsla(0, 0%, 12%, 0.9), hsla(0, 0%, 12%, 0.4))', 7 | } 8 | -------------------------------------------------------------------------------- /src/fab/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | type: '主题色按钮', 3 | trigger: '触发方式', 4 | direction: '动作菜单弹出方向', 5 | position: '触发器位置', 6 | default: '默认', 7 | primary: '主要', 8 | info: '信息', 9 | success: '成功', 10 | warning: '警告', 11 | danger: '危险', 12 | disabled: '禁用', 13 | triggerToggle: '触发器显示/隐藏', 14 | actionsToggle: '动作菜单展开/收起', 15 | toggle: '切换', 16 | } 17 | -------------------------------------------------------------------------------- /src/app-bar/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicAppBar: '基础导航栏', 3 | customStyle: '自定义样式', 4 | addSlotsAtTitle: '添加标题处插槽', 5 | addTheTitleFromTheSlot: '从插槽处添加标题', 6 | addLeftSlot: '添加左侧插槽', 7 | title: '标题', 8 | addRightSlot: '添加右侧插槽', 9 | addLeftAndRightSlot: '添加左右插槽', 10 | options1: '选项一', 11 | options2: '选项二', 12 | search: '搜索', 13 | goBack: '返回', 14 | } 15 | -------------------------------------------------------------------------------- /src/image-preview/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: '函数调用', 3 | componentCall: '组件调用', 4 | preview: '基本使用', 5 | callBack: '处理回调函数', 6 | basicUse: '基本使用', 7 | specifyInitialPosition: '指定初始位置', 8 | displayCloseButton: '展示关闭按钮', 9 | listenCloseEvents: '监听关闭事件', 10 | shutdownEvent: '触发了关闭事件。', 11 | showExtraSlots: '展示额外插槽', 12 | operate: '操作', 13 | } 14 | -------------------------------------------------------------------------------- /src/overlay/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | overlayBase: 'overlayBase', 3 | overlayContent: 'overlayContent', 4 | overlayStyle: 'overlay style', 5 | showOverlay: 'showOverlay', 6 | event: 'event', 7 | clickOverlay: 'clickOverlay', 8 | text: 'As he came into the window. It was the sound of a crescendo. He came into her apartment. He left the bloodstains on the carpet.', 9 | } 10 | -------------------------------------------------------------------------------- /src/popup/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | popupPosition: '弹出位置', 3 | centerPopup: '居中弹出', 4 | belowPopup: '下方弹出', 5 | abovePopup: '上方弹出', 6 | leftPopup: '左侧弹出', 7 | rightPopup: '右侧弹出', 8 | overlayStyle: '遮罩层样式', 9 | overlayClass: '遮罩层class', 10 | overlayStyles: '遮罩层style', 11 | event: '注册事件', 12 | text: '素胚勾勒出青花笔锋浓转淡, 瓶身描绘的牡丹一如你初妆, 冉冉檀香透过窗心事我了然, 宣纸上走笔至此搁一半。', 13 | } 14 | -------------------------------------------------------------------------------- /theme/light/checkbox-group.ts: -------------------------------------------------------------------------------- 1 | const CheckboxTheme = { 2 | '--checkbox-checked-color': 'var(--color-primary)', 3 | '--checkbox-unchecked-color': '#555', 4 | '--checkbox-disabled-color': 'var(--color-text-disabled)', 5 | '--checkbox-error-color': 'var(--color-danger)', 6 | '--checkbox-action-padding': '6px', 7 | '--checkbox-icon-size': '24px', 8 | } 9 | 10 | export default CheckboxTheme 11 | -------------------------------------------------------------------------------- /components/editor/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | clearProps: 'Reset current component Variables', 3 | clearAll: 'Reset all component variables', 4 | exports: 'Export current theme', 5 | clearPropsSuccess: 'The current component variables has been cleared', 6 | clearAllSuccess: 'Empty all component variables', 7 | exportsSuccess: 'Exported current theme', 8 | isHave: 'Do you want to', 9 | } 10 | -------------------------------------------------------------------------------- /src/result/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | success: 'Success', 4 | info: 'Info', 5 | warning: 'Warning', 6 | error: 'Error', 7 | question: 'Question', 8 | empty: 'Empty', 9 | type: 'Type', 10 | button: 'OK', 11 | successTitle: 'Success', 12 | description: "Hi, I'm a result description.", 13 | changeBackgroundColor: 'Change BackGround Color', 14 | } 15 | -------------------------------------------------------------------------------- /src/menu/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | alignmentMethods: 'Alignment Methods', 4 | topAlignment: 'Top Alignment', 5 | menuOption: 'Menu Option', 6 | bottomAlignment: 'Bottom Alignment', 7 | offset: 'Offset', 8 | events: 'Events', 9 | disabled: 'Disabled', 10 | placement: 'Placement', 11 | trigger: 'Trigger', 12 | twoWayBinding: 'Two-way binding', 13 | } 14 | -------------------------------------------------------------------------------- /src/steps/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | customStyle: 'Custom Style', 4 | dynamicSteps: 'Dynamic Steps', 5 | vertical: 'Vertical Mode', 6 | next: 'next', 7 | first: 'Step1', 8 | second: 'Step2', 9 | third: 'Step3', 10 | fourth: 'Step4', 11 | fifth: 'Step5', 12 | placeholder: 'Change the number of steps', 13 | step: 'Step', 14 | text: 'do something...', 15 | } 16 | -------------------------------------------------------------------------------- /theme/light/badge.ts: -------------------------------------------------------------------------------- 1 | const BadgeTheme = { 2 | '--badge-content-padding': '2px 6px', 3 | '--badge-default-color': '#e0e0e0', 4 | '--badge-primary-color': 'var(--color-primary)', 5 | '--badge-danger-color': 'var(--color-danger)', 6 | '--badge-success-color': 'var(--color-success)', 7 | '--badge-warning-color': 'var(--color-warning)', 8 | '--badge-info-color': 'var(--color-info)', 9 | } 10 | 11 | export default BadgeTheme 12 | -------------------------------------------------------------------------------- /src/action-sheet/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: 'Function Call', 3 | basicUsage: 'Basic Usage', 4 | modifyTitle: 'Modify Title', 5 | componentCall: 'Component Call', 6 | yourSelected: 'Your selected is:', 7 | customTitle: 'Choose whichever you like', 8 | disableCloseOnClickAction: 'Disable close on click action', 9 | disabled: 'Action Disabled', 10 | customActionStyles: 'Custom Action Styles', 11 | } 12 | -------------------------------------------------------------------------------- /theme/light/avatar.ts: -------------------------------------------------------------------------------- 1 | const avatarTheme = { 2 | '--avatar-text-color': '#f5f5f5', 3 | '--avatar-border-radius': '4px', 4 | '--avatar-mini-size': '28px', 5 | '--avatar-small-size': '36px', 6 | '--avatar-normal-size': '48px', 7 | '--avatar-large-size': '64px', 8 | '--avatar-border': '2px solid #fff', 9 | '--avatar-background-color': '#bebebe', 10 | '--avatar-group-offset': '-10px', 11 | } 12 | 13 | export default avatarTheme 14 | -------------------------------------------------------------------------------- /theme/light/link.ts: -------------------------------------------------------------------------------- 1 | const linkProps = { 2 | '--link-primary-color': 'var(--color-primary)', 3 | '--link-danger-color': 'var(--color-danger)', 4 | '--link-success-color': 'var(--color-success)', 5 | '--link-warning-color': 'var(--color-warning)', 6 | '--link-info-color': 'var(--color-info)', 7 | '--link-disabled-color': 'var(--color-text-disabled)', 8 | '--link-font-size': 'var(--font-size-md)', 9 | } 10 | 11 | export default linkProps 12 | -------------------------------------------------------------------------------- /src/input/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | plainMode: 'Plain Mode', 4 | textarea: 'Textarea', 5 | maxlength: 'Maxlength', 6 | disabled: 'Disabled', 7 | readonly: 'Readonly', 8 | clearable: 'Clearable', 9 | displayIcon: 'Display Icon', 10 | validate: 'Validate', 11 | placeholder: 'Please enter text', 12 | maxMessage: 'Text length must be greater than 6', 13 | clearableText: 'Clearable Text', 14 | } 15 | -------------------------------------------------------------------------------- /src/radio-group/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | currentValue: '当前的值:', 4 | setState: '设置状态值', 5 | setStyle: '修改图标和颜色', 6 | disabled: '禁用', 7 | readonly: '只读', 8 | eat: '吃饭', 9 | sleep: '睡觉', 10 | checkAll: '全选', 11 | inverseAll: '反选', 12 | radioGroup: '单选框组', 13 | radioValidate: '单选框字段校验', 14 | radioGroupValidate: '单选框组字段校验', 15 | radioValidateMessage: '请勾选', 16 | radioGroupValidateMessage: '必须选择吃饭', 17 | } 18 | -------------------------------------------------------------------------------- /theme/light/fab.ts: -------------------------------------------------------------------------------- 1 | const FabTheme = { 2 | '--fab-top': '70px', 3 | '--fab-bottom': '16px', 4 | '--fab-left': '16px', 5 | '--fab-right': '16px', 6 | '--fab-trigger-size': '56px', 7 | '--fab-trigger-inactive-icon-size': '26px', 8 | '--fab-trigger-active-icon-size': '22px', 9 | '--fab-actions-padding': '10px 0', 10 | '--fab-action-margin': '6px', 11 | '--fab-transition-standard-easing': 'cubic-bezier(0.4, 0, 0.2, 1)', 12 | } 13 | 14 | export default FabTheme 15 | -------------------------------------------------------------------------------- /theme/light/list.ts: -------------------------------------------------------------------------------- 1 | const ListTheme = { 2 | '--list-loading-height': '50px', 3 | '--list-finished-height': '50px', 4 | '--list-error-height': '50px', 5 | '--list-loading-color': '#888', 6 | '--list-finished-color': '#888', 7 | '--list-error-color': '#888', 8 | '--list-loading-font-size': 'var(--font-size-md)', 9 | '--list-finished-font-size': 'var(--font-size-md)', 10 | '--list-error-font-size': 'var(--font-size-md)', 11 | } 12 | 13 | export default ListTheme 14 | -------------------------------------------------------------------------------- /src/avatar/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | themeColorBadge: '主题色徽标', 3 | dotBadge: '圆点徽标', 4 | customContentBadge: '自定义内容标签', 5 | maximum: '最大值', 6 | differentPositioningBadges: '不同定位徽标', 7 | upperRight: '右上', 8 | lowerRight: '右下', 9 | upperLeft: '左上', 10 | lowerLeft: '左下', 11 | whetherToDisplayTheBadge: '是否显示徽标', 12 | clickToChangeTheState: '点击改变状态', 13 | badge: '徽标', 14 | customBadgeColors: '自定义徽标颜色', 15 | customBadgeIcons: '自定义徽标图标', 16 | } 17 | -------------------------------------------------------------------------------- /src/app-bar/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicAppBar: 'Basic AppBar', 3 | customStyle: 'Custom Style', 4 | addSlotsAtTitle: 'Add Slots At Title', 5 | addTheTitleFromTheSlot: 'Add The Title From The Slot', 6 | addLeftSlot: 'Add Left Slot', 7 | title: 'Title', 8 | addRightSlot: 'Add Right Slot', 9 | addLeftAndRightSlot: 'Add Left And Right Slot', 10 | options1: 'options1', 11 | options2: 'options2', 12 | search: 'search', 13 | goBack: 'Go Back', 14 | } 15 | -------------------------------------------------------------------------------- /src/card/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | title: '本草纲目', 4 | showSubtitle: '显示副标题', 5 | subtitle: '我表情悠哉 跳个大概', 6 | horizontal: '横向显示', 7 | description: 8 | '如果华佗再世,崇洋都被医治,外邦来学汉字,激发我民族意识。马钱子、决明子、苍耳子，还有莲子；黄药子、苦豆子、川楝子，我要面子。用我的方式，改写一部历史。没什么别的事，跟着我念几个字。山药当归枸杞 GO，山药 当归 枸杞 GO，看我抓一把中药，服下一帖骄傲~', 9 | showImage: '显示图片', 10 | useSlot: '使用插槽', 11 | action1: '操作 1', 12 | action2: '操作 2', 13 | showRipple: '水波效果', 14 | floating: '漂浮', 15 | } 16 | -------------------------------------------------------------------------------- /src/checkbox-group/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | currentValue: '当前的值:', 4 | setState: '设置状态值', 5 | setStyle: '修改图标和颜色', 6 | disabled: '禁用', 7 | readonly: '只读', 8 | eat: '吃饭', 9 | sleep: '睡觉', 10 | checkAll: '全选', 11 | inverseAll: '反选', 12 | checkboxGroup: '复选框组', 13 | checkboxValidate: '复选框字段校验', 14 | checkboxGroupValidate: '复选框组字段校验', 15 | checkboxValidateMessage: '请勾选', 16 | checkboxGroupValidateMessage: '请全选', 17 | } 18 | -------------------------------------------------------------------------------- /src/snackbar/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: '函数调用', 3 | componentCall: '组件调用', 4 | type: 'Snackbar 类型', 5 | success: '成功', 6 | info: '消息', 7 | warning: '警告', 8 | error: '错误', 9 | loading: '加载', 10 | text: '这是一个消息条！！', 11 | loaded: '加载成功！！', 12 | wait: '等待中...', 13 | close: '关闭', 14 | basicUsage: '基本使用', 15 | multiLine: '垂直排列', 16 | bottomDisplay: '底部显示', 17 | hiddenTime: '显示时长', 18 | forbidClick: '禁止穿透点击', 19 | multiple: '多例模式', 20 | } 21 | -------------------------------------------------------------------------------- /src/fab/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | type: 'Theme Color Button', 3 | trigger: 'Trigger Method', 4 | direction: 'Action Menu Popup Direction', 5 | position: 'Trigger Position', 6 | default: 'default', 7 | primary: 'primary', 8 | info: 'info', 9 | success: 'success', 10 | warning: 'warning', 11 | danger: 'danger', 12 | disabled: 'Disabled', 13 | triggerToggle: 'Trigger Show/Hide', 14 | actionsToggle: 'Action Menu Expand/Collapse', 15 | toggle: 'Toggle', 16 | } 17 | -------------------------------------------------------------------------------- /src/dialog/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: 'Function Call', 3 | basicUsage: 'Basic Usage', 4 | modifyTitle: 'Modify Title', 5 | hideButton: 'Hide Button', 6 | handleUserBehavior: 'Handle User Behavior', 7 | asyncClose: 'Asynchronous closing', 8 | componentCall: 'Component Call', 9 | title: 'Beat It', 10 | message: "Don't Wanna See No Blood, Don't Be A Macho Man", 11 | customSlots: 'Custom Slots', 12 | asyncCloseProgress: 'Asynchronous shutdown in progress', 13 | } 14 | -------------------------------------------------------------------------------- /src/image-preview/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: 'Function Call', 3 | componentCall: 'Component Call', 4 | preview: 'Basic use', 5 | callBack: 'Handle callback function', 6 | basicUse: 'Basic use', 7 | specifyInitialPosition: 'Specify initial position', 8 | displayCloseButton: 'Display the close button', 9 | listenCloseEvents: 'Listen for close event', 10 | shutdownEvent: 'The shutdown event was triggered.', 11 | showExtraSlots: 'Show extra slots', 12 | operate: 'Operate', 13 | } 14 | -------------------------------------------------------------------------------- /src/rate/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | baseRating: '基础评分', 3 | customizeTheTotalNumberOfRatingICONS: '自定义评分总数', 4 | customizeTheIconColor: '自定义图标颜色', 5 | customizeRatingIconStyles: '自定义评分图标样式', 6 | customizeRatingIconSize: '自定义评分图标尺寸', 7 | customIconSpacing: '自定义图标间隔', 8 | useHalfAStar: '使用半星', 9 | disableTheRating: '禁用评分', 10 | readonlyRating: '只读评分', 11 | waterRippleIsProhibited: '禁止使用水波纹', 12 | listeningForClickEvents: '监听点击事件', 13 | validate: '字段校验', 14 | rateMessage: '必须大于2', 15 | } 16 | -------------------------------------------------------------------------------- /theme/light/cell.ts: -------------------------------------------------------------------------------- 1 | const CellTheme = { 2 | '--cell-color': 'var(--color-text)', 3 | '--cell-font-size': 'var(--font-size-md)', 4 | '--cell-desc-font-size': 'var(--font-size-sm)', 5 | '--cell-desc-color': 'rgba(0, 0, 0, 0.6)', 6 | '--cell-padding': '10px 12px', 7 | '--cell-min-height': '40px', 8 | '--cell-border-color': '#bcc2cb', 9 | '--cell-border-left': '12px', 10 | '--cell-border-right': '12px', 11 | '--cell-icon-right': '8px', 12 | '--cell-extra-left': '8px', 13 | } 14 | 15 | export default CellTheme 16 | -------------------------------------------------------------------------------- /src/back-top/example/index.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 18 | -------------------------------------------------------------------------------- /src/popup/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | popupPosition: 'Popup Position', 3 | centerPopup: 'Center Popup', 4 | belowPopup: 'Below Popup', 5 | abovePopup: 'Above Popup', 6 | leftPopup: 'Left Popup', 7 | rightPopup: 'Right Popup', 8 | overlayStyle: 'Overlay Style', 9 | overlayClass: 'Overlay Class', 10 | overlayStyles: 'Overlay Styles', 11 | event: 'Event', 12 | text: 'As he came into the window. It was the sound of a crescendo. He came into her apartment. He left the bloodstains on the carpet.', 13 | } 14 | -------------------------------------------------------------------------------- /theme/light/collapse.ts: -------------------------------------------------------------------------------- 1 | const CollapseTheme = { 2 | '--collapse-background': '#fff', 3 | '--collapse-text-color': '#232222', 4 | '--collapse-header-font-size': 'var(--font-size-lg)', 5 | '--collapse-header-padding': '10px 12px', 6 | '--collapse-content-font-size': 'var(--font-size-md)', 7 | '--collapse-content-padding': '0 12px 10px', 8 | '--collapse-item-margin-top': '16px', 9 | '--collapse-disable-color': '#bdbdbd', 10 | '--collapse-border-top': 'thin solid rgba(0, 0, 0, 0.12)', 11 | } 12 | 13 | export default CollapseTheme 14 | -------------------------------------------------------------------------------- /theme/light/image-preview.ts: -------------------------------------------------------------------------------- 1 | const ImagePreviewTheme = { 2 | '--image-preview-swipe-indicators-text-color': '#ddd', 3 | '--image-preview-swipe-indicators-padding': '16px 0', 4 | '--image-preview-zoom-container-background': '#000', 5 | '--image-preview-close-icon-top': '14px', 6 | '--image-preview-close-icon-right': '14px', 7 | '--image-preview-close-icon-size': '22px', 8 | '--image-preview-close-icon-color': '#fff', 9 | '--image-preview-extra-top': '14px', 10 | '--image-preview-extra-left': '14px', 11 | } 12 | 13 | export default ImagePreviewTheme 14 | -------------------------------------------------------------------------------- /theme/light/slider.ts: -------------------------------------------------------------------------------- 1 | const SliderTheme = { 2 | '--slider-error-color': 'var(--color-danger)', 3 | '--slider-track-background': '#bdbdbd', 4 | '--slider-track-fill-background': 'var(--color-primary)', 5 | '--slider-thumb-block-background': 'var(--color-primary)', 6 | '--slider-thumb-ripple-background': 'var(--color-primary)', 7 | '--slider-thumb-label-background': 'var(--color-primary)', 8 | '--slider-thumb-label-font-size': 'var(--font-size-sm)', 9 | '--slider-disabled-opacity': 'var(--opacity-disabled)', 10 | } 11 | 12 | export default SliderTheme 13 | -------------------------------------------------------------------------------- /theme/light/switch.ts: -------------------------------------------------------------------------------- 1 | const SwitchTheme = { 2 | '--switch-track-background': '#fff', 3 | '--switch-track-active-background': 'var(--color-primary)', 4 | '--switch-track-error-background': 'var(--color-danger)', 5 | '--switch-ripple-color': 'var(--color-primary)', 6 | '--switch-handle-background': '#fff', 7 | '--switch-handle-color': '#fff', 8 | '--switch-handle-active-background': 'var(--color-primary)', 9 | '--switch-handle-error-background': 'var(--color-danger)', 10 | '--switch-disabled-opacity': 'var(--opacity-disabled)', 11 | } 12 | 13 | export default SwitchTheme 14 | -------------------------------------------------------------------------------- /theme/light/tooltip.ts: -------------------------------------------------------------------------------- 1 | const TooltipTheme = { 2 | '--tooltip-opacity': '0.9', 3 | '--tooltip-border-radius': '4px', 4 | '--tooltip-font-size': '14px', 5 | '--tooltip-padding': '8px 16px', 6 | '--tooltip-default-color': '#616161', 7 | '--tooltip-offset': '10px', 8 | '--tooltip-primary-color': 'var(--color-primary)', 9 | '--tooltip-info-color': 'var(--color-info)', 10 | '--tooltip-success-color': 'var(--color-success)', 11 | '--tooltip-warning-color': 'var(--color-warning)', 12 | '--tooltip-danger-color': 'var(--color-danger)', 13 | } 14 | 15 | export default TooltipTheme 16 | -------------------------------------------------------------------------------- /src/uploader/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | preview: '文件预览', 4 | state: '上传状态', 5 | maxlength: '文件数量限制', 6 | maxsize: '文件大小限制', 7 | beforeRead: '上传预处理', 8 | disabled: '禁用', 9 | readonly: '只读', 10 | validate: '字段校验', 11 | validateMessage: '存在上传失败的文件', 12 | style: '自定义上传样式', 13 | upload: '上传', 14 | beforeRemove: '删除前处理', 15 | removeTitle: '是否删除?', 16 | removeMessage: '删除后无法撤回', 17 | fileSizeExceedsLimit: '文件大小超出限制', 18 | fileLessThen: '文件小于1M，上传成功', 19 | fileLargeThen: '文件大于1M，不能上传', 20 | customRender: '自定义渲染文件列表', 21 | } 22 | -------------------------------------------------------------------------------- /theme/light/counter.ts: -------------------------------------------------------------------------------- 1 | const CounterTheme = { 2 | '--counter-padding': '0 4px', 3 | '--counter-font-color': '#fff', 4 | '--counter-background': 'var(--color-primary)', 5 | '--counter-input-width': '28px', 6 | '--counter-input-margin': '0 4px', 7 | '--counter-input-font-size': '14px', 8 | '--counter-button-size': '28px', 9 | '--counter-button-icon-size': '100%', 10 | '--counter-disabled-color': 'var(--color-disabled)', 11 | '--counter-disabled-opacity': 'var(--opacity-disabled)', 12 | '--counter-error-color': 'var(--color-danger)', 13 | } 14 | 15 | export default CounterTheme 16 | -------------------------------------------------------------------------------- /src/snackbar/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | functionCall: 'Function Call', 3 | componentCall: 'Component Call', 4 | type: 'Snackbar Type', 5 | success: 'Success', 6 | warning: 'Warning', 7 | info: 'Info', 8 | error: 'Error', 9 | loading: 'Loading', 10 | text: "Hello, I'm a snackbar", 11 | loaded: 'Loaded', 12 | wait: 'waiting...', 13 | close: 'Close', 14 | basicUsage: 'Basic Usage', 15 | multiLine: 'Multi-Line', 16 | bottomDisplay: 'Bottom Display', 17 | hiddenTime: 'Display Duration', 18 | forbidClick: 'Forbid Click', 19 | multiple: 'Multiple', 20 | } 21 | -------------------------------------------------------------------------------- /theme/light/tabs.ts: -------------------------------------------------------------------------------- 1 | const TabsTheme = { 2 | ' --tabs-item-horizontal-height': '44px', 3 | '--tabs-item-vertical-height': '66px', 4 | '--tabs-radius': '2px', 5 | '--tabs-padding': '12px', 6 | '--tabs-indicator-size': '2px', 7 | ' --tabs-indicator-background': 'var(--color-primary)', 8 | '--tabs-background': '#fff', 9 | '--tab-padding': '12px', 10 | '--tab-active-color': 'var(--color-primary)', 11 | '--tab-inactive-color': '#646566', 12 | '--tab-disabled-color': 'var(--color-text-disabled)', 13 | '--tab-font-size': 'var(--font-size-md)', 14 | } 15 | 16 | export default TabsTheme 17 | -------------------------------------------------------------------------------- /src/radio-group/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | currentValue: 'Current value:', 4 | setState: 'Set State value', 5 | setStyle: 'Modify the icon and color', 6 | disabled: 'Disabled', 7 | readonly: 'Readonly', 8 | eat: 'Eat', 9 | sleep: 'Sleep', 10 | checkAll: 'Check All', 11 | inverseAll: 'Inverse All', 12 | radioGroup: 'RadioGroup', 13 | radioValidate: 'Radio validation', 14 | radioGroupValidate: 'RadioGroup validate', 15 | radioValidateMessage: 'Please check your choice', 16 | radioGroupValidateMessage: 'Please check eat', 17 | } 18 | -------------------------------------------------------------------------------- /theme/light/input.ts: -------------------------------------------------------------------------------- 1 | const InputTheme = { 2 | '--input-input-text-color': '#555', 3 | '--input-error-color': 'var(--color-danger)', 4 | '--input-blur-color': '#888', 5 | '--input-focus-color': 'var(--color-primary)', 6 | '--input-placeholder-size': '16px', 7 | '--input-textarea-height': 'auto', 8 | '--input-textarea-padding-top': '8px', 9 | '--input-icon-padding': '16px 0 0', 10 | '--input-icon-size': '20px', 11 | '--input-line-size': '1px', 12 | '--input-line-spread-size': '2px', 13 | '--input-disabled-color': 'var(--color-text-disabled)', 14 | } 15 | 16 | export default InputTheme 17 | -------------------------------------------------------------------------------- /theme/light/picker.ts: -------------------------------------------------------------------------------- 1 | const PickerTheme = { 2 | '--picker-background': '#fff', 3 | '--picker-toolbar-height': '44px', 4 | '--picker-confirm-button-text-color': 'var(--color-primary)', 5 | '--picker-cancel-button-text-color': '#888', 6 | '--picker-picked-border': '1px solid rgba(0, 0, 0, 0.12)', 7 | '--picker-title-font-size': '16px', 8 | '--picker-toolbar-padding': '0 4px', 9 | '--picker-mask-background-image': 10 | 'linear-gradient(180deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4)),linear-gradient(0deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4))', 11 | } 12 | export default PickerTheme 13 | -------------------------------------------------------------------------------- /src/checkbox-group/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | currentValue: 'Current value:', 4 | setState: 'Set State value', 5 | setStyle: 'Modify the icon and color', 6 | disabled: 'Disabled', 7 | readonly: 'Readonly', 8 | eat: 'Eat', 9 | sleep: 'Sleep', 10 | checkAll: 'Check All', 11 | inverseAll: 'Inverse All', 12 | checkboxGroup: 'CheckboxGroup', 13 | checkboxValidate: 'Checkbox validation', 14 | checkboxGroupValidate: 'CheckboxGroup validate', 15 | checkboxValidateMessage: 'Please check your choices', 16 | checkboxGroupValidateMessage: 'Please check all', 17 | } 18 | -------------------------------------------------------------------------------- /src/tooltip/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | contentSlot: '内容插槽', 4 | alignmentMethods: '对齐方式', 5 | topAlignment: '顶部对齐', 6 | tooltip: 'tooltip', 7 | bottomAlignment: '底部对齐', 8 | offset: '偏移量', 9 | events: '注册事件', 10 | disabled: '禁用提示', 11 | placement: '弹出位置', 12 | trigger: '触发方式', 13 | twoWayBinding: '双向绑定', 14 | themeColorTooltip: '主题色文字提示', 15 | defaultTooltip: '默认', 16 | primaryTooltip: '主要', 17 | infoTooltip: '信息', 18 | successTooltip: '成功', 19 | warningTooltip: '警告', 20 | dangerTooltip: '危险', 21 | customColor: '自定义颜色', 22 | countDown: '秒后关闭', 23 | } 24 | -------------------------------------------------------------------------------- /src/link/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | themeColorLink: '主题色链接', 3 | defaultLink: '默认链接', 4 | primaryLink: '主要链接', 5 | infoLink: '信息链接', 6 | successLink: '成功链接', 7 | warningLink: '警告链接', 8 | dangerLink: '危险链接', 9 | mode: '链接模式', 10 | hrefLink: '#/home', 11 | toLink: '/button', 12 | withHref: 'href 链接', 13 | withRouterLink: 'router-link 链接', 14 | underline: '下划线', 15 | useUnderlineAlways: '始终显示', 16 | useUnderlineHove: '悬停显示', 17 | notUseUnderline: '不显示', 18 | disabledStatus: '禁用状态', 19 | customColor: '自定义颜色', 20 | linkText: '链接', 21 | slots: '默认插槽', 22 | buttonText: '跳转首页', 23 | } 24 | -------------------------------------------------------------------------------- /src/avatar/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | themeColorBadge: 'Theme Color Badge', 3 | dotBadge: 'Dot Badge', 4 | customContentBadge: 'Custom Content Badge', 5 | maximum: 'Maximum', 6 | differentPositioningBadges: 'Different Positioning Badges', 7 | upperRight: 'The Upper Right', 8 | lowerRight: 'The Lower Right', 9 | upperLeft: 'The Upper Left', 10 | lowerLeft: 'The Lower Left', 11 | whetherToDisplayTheBadge: 'Whether To Display The Badge', 12 | clickToChangeTheState: 'Click To Change The State', 13 | badge: 'Badge', 14 | customBadgeColors: 'Custom Badge Colors', 15 | customBadgeIcons: 'Custom Badge Icons', 16 | } 17 | -------------------------------------------------------------------------------- /theme/light/actionSheet.ts: -------------------------------------------------------------------------------- 1 | const actionSheetTheme = { 2 | '--action-sheet-border-radius': '2px', 3 | '--action-sheet-title-color': '#888', 4 | '--action-sheet-title-padding': '10px 16px', 5 | '--action-sheet-title-font-size': '14px', 6 | '--action-sheet-action-item-height': '48px', 7 | '--action-sheet-action-item-padding': '0px 18px', 8 | '--action-sheet-action-item-color': '#333', 9 | '--action-sheet-action-item-disabled-color': 'var(--color-text-disabled)', 10 | '--action-sheet-icon-margin': '0 0 20px 0', 11 | '--action-sheet-icon-size': '24px', 12 | '--action-sheet-background': '#fff', 13 | } 14 | 15 | export default actionSheetTheme 16 | -------------------------------------------------------------------------------- /src/chip/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | chipType: '纸片类型', 3 | defaultChip: '默认纸片', 4 | primaryChip: '主要纸片', 5 | infoChip: '信息纸片', 6 | successChip: '成功纸片', 7 | warningChip: '警告纸片', 8 | dangerChip: '危险纸片', 9 | plainChip: '空心纸片', 10 | nonRoundChip: '非圆角纸片', 11 | chipSize: '纸片尺寸', 12 | largeChip: '大型纸片', 13 | normalChip: '常规纸片', 14 | smallChip: '小型纸片', 15 | miniChip: '迷你纸片', 16 | blockChip: '块级纸片', 17 | canCloseChip: '可关闭纸片', 18 | customCloseIcon: '自定义关闭图标', 19 | customColor: '自定义颜色', 20 | chip: '纸片', 21 | addSlot: '添加插槽', 22 | leftSlot: '左侧插槽', 23 | rightSlot: '右侧插槽', 24 | leftAndRightSlot: '左右两侧插槽', 25 | } 26 | -------------------------------------------------------------------------------- /docs/home.zh-CN.md: -------------------------------------------------------------------------------- 1 | ### 介绍 2 | 3 | Varlet UI theme editor 是一个基于 `VARLET` 开发的主题编辑工具, 由社区团队进行维护。 4 | 5 | ### 特性 6 | 7 | - 🚀   提供 VARLET 组件库所有组件的主题编辑能力 8 | - 🚀   导出的主题包十分轻量 9 | - 💪   由国人开发，完善的中英文文档和后勤保障 10 | - 💪   使用 VARLET CLI 构建，与 VARLET 官方文档的交互体验高度一致 11 | - 🛠️   支持亮色和暗色两种主题定制 12 | - 🌍   支持国际化 13 | 14 | ### PR & Issue 15 | 16 | 使用过程中出现的问题可以到 [github](https://github.com/varletjs/varlet-ute) 来给我们提 [issue](https://github.com/varletjs/varlet-ute/issues)， 17 | 我们会在第一时间处理问题。也可以给我们提 [PR](https://github.com/varletjs/varlet-ute/pulls)，十分欢迎小伙伴们来找茬。 18 | 19 | ### 开源协议 20 | 21 | 主题编辑工具基于 `MIT` 协议。 22 | 23 | ### 特别鸣谢 24 | 25 | 特别鸣谢 `haoziqaq` 对主题编辑工具的大力支持 26 | -------------------------------------------------------------------------------- /src/app-bar/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/avatar/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/badge/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/button/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/card/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/chip/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/common/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/divider/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/fab/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/paper/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/rate/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/result/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/ripple/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/select/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/steps/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/tooltip/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /components/editor/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/action-sheet/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/breadcrumbs/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/cell/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/collapse/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/countdown/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/dialog/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/form/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/icon/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/input/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/link/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/loading-bar/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/menu/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/pagination/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/picker/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/popup/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/progress/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/radio-group/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/skeleton/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/slider/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/space/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/swipe/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/switch/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/table/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/tabs/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/bottom-navigation/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/checkbox-group/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 11 | 12 | const use = (lang: string) => { 13 | _use(lang) 14 | exampleUse(lang) 15 | } 16 | 17 | export { add, pack, packs, merge, use } 18 | 19 | // lib 20 | _add('zh-CN', _zhCN) 21 | _add('en-US', _enCN) 22 | // mobile example doc 23 | add('zh-CN', zhCN as any) 24 | add('en-US', enUS as any) 25 | -------------------------------------------------------------------------------- /src/counter/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/date-picker/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/index-bar/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/loading/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/overlay/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/snackbar/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/time-picker/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/uploader/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /src/image-preview/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | // lib 2 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 3 | import _enCN from '@varlet/ui/es/locale/en-US' 4 | // mobile example doc 5 | import zhCN from './zh-CN' 6 | import enUS from './en-US' 7 | import { Locale } from '@varlet/ui' 8 | 9 | const { useLocale, use: _use, add: _add } = Locale 10 | 11 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 12 | 13 | const use = (lang: string) => { 14 | _use(lang) 15 | exampleUse(lang) 16 | } 17 | 18 | export { add, pack, packs, merge, use } 19 | 20 | // lib 21 | _add('zh-CN', _zhCN) 22 | _add('en-US', _enCN) 23 | // mobile example doc 24 | add('zh-CN', zhCN as any) 25 | add('en-US', enUS as any) 26 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature_request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Feature request 3 | about: Suggest an idea for this project 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | 8 | --- 9 | 10 | **Is your feature request related to a problem? Please describe.** 11 | A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] 12 | 13 | **Describe the solution you'd like** 14 | A clear and concise description of what you want to happen. 15 | 16 | **Describe alternatives you've considered** 17 | A clear and concise description of any alternative solutions or features you've considered. 18 | 19 | **Additional context** 20 | Add any other context or screenshots about the feature request here. 21 | -------------------------------------------------------------------------------- /theme/light/table.ts: -------------------------------------------------------------------------------- 1 | const TableTheme = { 2 | '--table-background': '#fff', 3 | '--table-border-radius': '2px', 4 | '--table-thead-border-bottom': 'thin solid rgba(0, 0, 0, 0.12)', 5 | '--table-thead-th-text-color': 'rgba(0, 0, 0, 0.6)', 6 | '--table-thead-th-font-size': '14px', 7 | '--table-thead-tr-border-bottom': 'thin solid rgba(0, 0, 0, 0.12)', 8 | '--table-tbody-tr-hover-background': '#eee', 9 | '--table-tbody-tr-border-bottom': 'thin solid rgba(0, 0, 0, 0.12)', 10 | '--table-tbody-td-font-size': '16px', 11 | '--table-row-height': '46px', 12 | '--table-row-padding': '0 16px', 13 | '--table-footer-border-top': 'thin solid rgba(0, 0, 0, 0.12)', 14 | } 15 | 16 | export default TableTheme 17 | -------------------------------------------------------------------------------- /src/rate/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | baseRating: 'Base Rating', 3 | customizeTheTotalNumberOfRatingICONS: 'Customize The Total Number Of Rating ICONS', 4 | customizeTheIconColor: 'Customize The Icon Color', 5 | customizeRatingIconStyles: 'Customize Rating Icon Styles', 6 | customizeRatingIconSize: 'Customize Rating Icon Size', 7 | customIconSpacing: 'Custom Icon Spacing', 8 | useHalfAStar: 'Use Half A Star', 9 | disableTheRating: 'Disable The Rating', 10 | readonlyRating: 'Readonly Rating', 11 | waterRippleIsProhibited: 'Water ripple is prohibited', 12 | listeningForClickEvents: 'Listening For Click Events', 13 | validate: 'Validate', 14 | rateMessage: 'It has to be greater than 2', 15 | } 16 | -------------------------------------------------------------------------------- /theme/light/snackBar.ts: -------------------------------------------------------------------------------- 1 | const snackBarTheme = { 2 | '--snackbar-width': '256px', 3 | '--snackbar-color': 'rgba(255, 255, 255, 0.87)', 4 | '--snackbar-border-radius': '4px', 5 | '--snackbar-background': '#333', 6 | '--snackbar-font-size': 'var(--font-size-md)', 7 | '--snackbar-margin': '6px 24px', 8 | '--snackbar-border-color': 'currentColor', 9 | '--snackbar-success-background': 'var(--color-success)', 10 | '--snackbar-info-background': 'var(--color-info)', 11 | '--snackbar-error-background': 'var(--color-danger)', 12 | '--snackbar-warning-background': 'var(--color-warning)', 13 | '--snackbar-content-padding': '14px 16px', 14 | '--snackbar-action-margin': '0 16px 0 0', 15 | } 16 | 17 | export default snackBarTheme 18 | -------------------------------------------------------------------------------- /theme/light/dialog.ts: -------------------------------------------------------------------------------- 1 | const DialogTheme = { 2 | '--dialog-width': '280px', 3 | '--dialog-border-radius': '3px', 4 | '--dialog-title-padding': '20px 20px 0', 5 | '--dialog-message-color': '#888', 6 | '--dialog-message-padding': '12px 20px', 7 | '--dialog-message-line-height': '24px', 8 | '--dialog-message-font-size': 'var(--font-size-md)', 9 | '--dialog-title-font-size': 'var(--font-size-lg)', 10 | '--dialog-actions-padding': '0 12px 12px', 11 | '--dialog-button-margin-left': '6px', 12 | '--dialog-confirm-button-color': 'var(--color-primary)', 13 | '--dialog-cancel-button-color': 'var(--color-primary)', 14 | '--dialog-background': '#fff', 15 | '--dialog-background:': '#fff', 16 | } 17 | 18 | export default DialogTheme 19 | -------------------------------------------------------------------------------- /src/tooltip/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | contentSlot: 'Content Slot', 4 | alignmentMethods: 'Alignment Methods', 5 | topAlignment: 'Top Alignment', 6 | tooltip: 'Tooltip', 7 | bottomAlignment: 'Bottom Alignment', 8 | offset: 'Offset', 9 | events: 'Events', 10 | disabled: 'Disabled', 11 | placement: 'Placement', 12 | trigger: 'Trigger', 13 | twoWayBinding: 'Two-way binding', 14 | themeColorTooltip: 'Theme Color Tooltip', 15 | defaultTooltip: 'Default', 16 | primaryTooltip: 'Primary', 17 | infoTooltip: 'Info', 18 | successTooltip: 'Success', 19 | warningTooltip: 'Warning', 20 | dangerTooltip: 'Danger', 21 | customColor: 'Custom Color', 22 | countDown: 's closed', 23 | } 24 | -------------------------------------------------------------------------------- /src/select/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | plainMode: '朴素模式', 4 | disabled: '禁用', 5 | readonly: '只读', 6 | clearable: '可清除', 7 | displayIcon: '显示图标', 8 | validate: '单选值校验', 9 | multipleValidate: '多选值校验', 10 | placeholder: '请选择一个选项', 11 | multiplePlaceholder: '请选择多个选项', 12 | clearableText: '可清除文本', 13 | relation: '文本关联值', 14 | multiple: '多选', 15 | chipMultiple: '纸片风格的多选', 16 | eat: '吃饭', 17 | sleep: '睡觉', 18 | play: '打游戏', 19 | coding: '写代码', 20 | rest: '摸鱼', 21 | currentSelect: '当前选择的是:', 22 | mustSelectRest: '您一定得选择摸鱼', 23 | mustSelectMoreThan: '您至少选择两个选项', 24 | offsetY: '垂直偏移', 25 | emberSprit: '火猫', 26 | earthSprit: '土猫', 27 | stormSpirit: '蓝猫', 28 | voidSpirit: '紫猫', 29 | } 30 | -------------------------------------------------------------------------------- /src/utils/shared.ts: -------------------------------------------------------------------------------- 1 | import { saveAs } from 'file-saver' 2 | 3 | export function flatObject(object: Record) { 4 | return Object.entries(object).reduce((ret, [key, value]) => { 5 | ret = { ...ret, ...value } 6 | 7 | return ret 8 | }, {}) 9 | } 10 | 11 | export async function downloadFile(theme: any) { 12 | const template = Object.keys(theme).reduce((template, key) => { 13 | template += ` '${key}': '${theme[key]}',\n` 14 | 15 | return template 16 | }, '') 17 | 18 | const { default: JSZip } = await import('jszip') 19 | const zip = new JSZip() 20 | zip.file('varlet-ute-theme.js', `export default {\n${template}}`) 21 | const blob = await zip.generateAsync({ type: 'blob' }) 22 | saveAs(blob, 'varlet-ute-theme.zip') 23 | } 24 | -------------------------------------------------------------------------------- /theme/light/buttonNavigation.ts: -------------------------------------------------------------------------------- 1 | const buttonNavigationTheme = { 2 | '--bottom-navigation-height': '50px', 3 | '--bottom-navigation-z-index': '1', 4 | '--bottom-navigation-background-color': '#fff', 5 | '--bottom-navigation-border-color': '#e3e3e3', 6 | '--bottom-navigation-fab-offset': '4px', 7 | '--bottom-navigation-item-font-size': 'var(--font-size-sm)', 8 | '--bottom-navigation-item-inactive-color': '#646566', 9 | '--bottom-navigation-item-active-color': 'var(--color-primary)', 10 | '--bottom-navigation-item-active-background-color': '#fff', 11 | '--bottom-navigation-item-line-height': '1', 12 | '--bottom-navigation-item-icon-size': '22px', 13 | '--bottom-navigation-item-icon-margin-bottom': '5px', 14 | } 15 | 16 | export default buttonNavigationTheme 17 | -------------------------------------------------------------------------------- /theme/light/steps.ts: -------------------------------------------------------------------------------- 1 | const StepsTheme = { 2 | '--step-tag-size': '20px', 3 | '--step-tag-background': '#9e9e9e', 4 | '--step-tag-font-size': 'var(--font-size-md)', 5 | '--step-tag-color': '#fff', 6 | '--step-tag-active-color': 'var(--color-primary)', 7 | '--step-tag-margin': '4px 0', 8 | '--step-tag-icon-size': 'var(--font-size-lg)', 9 | '--step-content-font-size': 'var(--font-size-md)', 10 | '--step-content-color': 'rgba(0, 0, 0, 0.38)', 11 | '--step-content-active-color': '#000', 12 | '--step-line-background': '#000', 13 | '--step-vertical-min-height': '30px', 14 | '--step-vertical-tag-margin': '0 4px', 15 | '--step-vertical-line-height': 'calc(100% - 30px)', 16 | '--step-vertical-line-min-height': '20px', 17 | } 18 | 19 | export default StepsTheme 20 | -------------------------------------------------------------------------------- /src/card/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | title: 'Dangerous', 4 | showSubtitle: 'Show Subtitle', 5 | subtitle: 'The girl was dangerous', 6 | horizontal: 'Horizontal', 7 | description: 8 | 'The way she came into the place I knew right then and there.There was something different about this girl.The way she moved her hair her face her lines.Divinity in motion as she stalked the room.I could feel the aura of her presence.Every head turned feeling passion and lust.The girl was persuasive the girl I could not trust.The girl was bad.The girl was dangerous.', 9 | showImage: 'Show Image', 10 | useSlot: 'Use Slot', 11 | action1: 'ACTION 1', 12 | action2: 'ACTION 2', 13 | showRipple: 'Ripple Effect', 14 | floating: 'Floating', 15 | } 16 | -------------------------------------------------------------------------------- /src/counter/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: wzhaofei wangzf@wellnkiot.com 3 | * @Date: 2022-09-30 16:35:23 4 | * @LastEditors: wzhaofei wangzf@wellnkiot.com 5 | * @LastEditTime: 2022-09-30 16:37:49 6 | * @FilePath: \varlet-ute\src\counter\example\locale\en-US.ts 7 | * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE 8 | */ 9 | export default { 10 | basicUsage: 'Basic Usage', 11 | range: 'Set the value range', 12 | step: 'Set step', 13 | toFixed: 'Decimal length', 14 | disabled: 'Disabled', 15 | readonly: 'Readonly', 16 | lazyChange: 'Asynchronous change', 17 | size: 'Set size', 18 | validate: 'Validate', 19 | validateMessage: 'Please select a value greater than 5', 20 | } 21 | -------------------------------------------------------------------------------- /src/link/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | themeColorLink: 'Theme Color Link', 3 | defaultLink: 'Default Link', 4 | primaryLink: 'Primary Link', 5 | infoLink: 'Info Link', 6 | successLink: 'Success Link', 7 | warningLink: 'Warning Link', 8 | dangerLink: 'Danger Link', 9 | mode: 'Link Mode', 10 | hrefLink: '#/home?language=en-US&replace=home', 11 | toLink: '/button?language=en-US&platform=mobile&replace=button', 12 | withHref: 'Href', 13 | withRouterLink: 'Router Link', 14 | underline: 'Underline', 15 | useUnderlineAlways: 'Underline', 16 | useUnderlineHove: 'Hover', 17 | notUseUnderline: 'Never', 18 | disabledStatus: 'Disabled Status', 19 | customColor: 'Custom Color', 20 | linkText: 'Link', 21 | slots: 'Default Slots', 22 | buttonText: 'To Home', 23 | } 24 | -------------------------------------------------------------------------------- /src/tabs/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: '基本使用', 3 | modifyStyle: '修改样式', 4 | disabled: '禁用选项', 5 | enableScroll: '开启滚动', 6 | tabVerticalLayout: '选项卡垂直布局', 7 | tabsVerticalLayout: '容器垂直布局', 8 | viewRelation: '视图联动', 9 | option: '选项', 10 | stickyLayout: '开启粘性布局', 11 | text: 12 | '呜啦啦啦火车笛，随着奔腾的马蹄。\n' + 13 | '小妹妹吹着口琴，夕阳下美了剪影。\n' + 14 | '我用子弹写日记，介绍完了风景。\n' + 15 | '接下来换介绍我自己。\n' + 16 | '我虽然是个牛仔，在酒吧只点牛奶。\n' + 17 | '为什么不喝啤酒，因为啤酒伤身体。', 18 | text2: 19 | '很多人不长眼睛，嚣张都靠武器。\n' + 20 | '赤手空拳就缩成蚂蚁。\n' + 21 | '不用麻烦了，不用麻烦了。\n' + 22 | '不用麻烦，不用麻烦了，不用麻烦了。', 23 | text3: 24 | '你们一起上，我在赶时间。\n' + 25 | '每天决斗观众都累了，英雄也累了。\n' + 26 | '不用麻烦了，不用麻烦了。\n' + 27 | '副歌不长你们有几个，一起上好了。\n' + 28 | '正义呼唤我，美女需要我。\n' + 29 | '牛仔很忙的。', 30 | } 31 | -------------------------------------------------------------------------------- /src/chip/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | chipType: 'Chip Type', 3 | defaultChip: 'Default Chip', 4 | primaryChip: 'Primary Chip', 5 | infoChip: 'Info Chip', 6 | successChip: 'Success Chip', 7 | warningChip: 'Warning Chip', 8 | dangerChip: 'Danger Chip', 9 | plainChip: 'Plain Chip', 10 | nonRoundChip: 'Non Round Chip', 11 | chipSize: 'Chip Size', 12 | largeChip: 'Large Chip', 13 | normalChip: 'Normal Chip', 14 | smallChip: 'Small Chip', 15 | miniChip: 'Mini Chip', 16 | blockChip: 'Block Chip', 17 | canCloseChip: 'Can Close Chip', 18 | customCloseIcon: 'Custom Close Icon', 19 | customColor: 'Custom Color', 20 | chip: 'Chip', 21 | addSlot: 'Add Slot', 22 | leftSlot: 'Left Slot', 23 | rightSlot: 'Right Slot', 24 | leftAndRightSlot: 'Left And Right Slot', 25 | } 26 | -------------------------------------------------------------------------------- /src/form/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | example: '表单示例', 3 | username: '请输入用户名', 4 | usernameMessage: '用户名不能为空', 5 | password: '请输入密码', 6 | passwordMessage: '请输入密码', 7 | department: '请选择部门', 8 | departmentMessage: '必须选一个部门', 9 | eat: '吃饭', 10 | sleep: '睡觉', 11 | play: '打游戏', 12 | departmentUnit: '部', 13 | group: '请选择组织', 14 | groupMessage: '至少选择一个组织', 15 | groupUnit: '组', 16 | genderMessage: '必须选择一个性别', 17 | male: '男', 18 | female: '女', 19 | rateMessage: '必须大于2', 20 | likeMessage: '至少选择一个爱好', 21 | licenseMessage: '您必须开启', 22 | countMessage: '必须大于10', 23 | rangeMessage: '必须大于10', 24 | filesMessage: '至少上传一张图片', 25 | controller: '表单控制', 26 | reset: '清空表单', 27 | resetValidation: '清空验证', 28 | validate: '触发验证', 29 | disabled: '表单禁用', 30 | readonly: '表单只读', 31 | } 32 | -------------------------------------------------------------------------------- /src/utils/sync.ts: -------------------------------------------------------------------------------- 1 | import { StyleProvider } from '@varlet/ui' 2 | import { onUnmounted } from 'vue' 3 | import { flatObject } from './shared' 4 | 5 | export function useSync() { 6 | function handleMessage(event: MessageEvent) { 7 | if (event.data.action === 'editor-change') { 8 | const currentTheme = localStorage.getItem('VARLET_THEME') as 'lightTheme' | 'darkTheme' 9 | const patch = JSON.parse(localStorage.getItem(currentTheme)!) 10 | const styleVars = flatObject(patch) 11 | 12 | StyleProvider(styleVars) 13 | } 14 | } 15 | 16 | window.addEventListener('message', handleMessage) 17 | 18 | onUnmounted(() => { 19 | window.removeEventListener('message', handleMessage) 20 | }) 21 | 22 | window.parent.postMessage({ action: 'editor-example-mounted', from: 'editor-mobile' }) 23 | } 24 | -------------------------------------------------------------------------------- /src/uploader/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | preview: 'File Preview', 4 | state: 'Upload State', 5 | maxlength: 'File Maxlength', 6 | maxsize: 'File Size Limit', 7 | beforeRead: 'Upload Preprocessing', 8 | disabled: 'Disabled', 9 | readonly: 'Readonly', 10 | validate: 'Validate', 11 | validateMessage: 'There is a file that failed to upload', 12 | style: 'Customize upload styles', 13 | upload: 'Upload', 14 | beforeRemove: 'Remove Preprocessing', 15 | removeTitle: 'Delete or not?', 16 | removeMessage: 'Cannot be withdrawn after deletion', 17 | fileSizeExceedsLimit: 'file size exceeds limit', 18 | fileLessThen: 'the file is less than 1M, the upload is successful', 19 | fileLargeThen: 'the file is larger than 1M and cannot be uploaded', 20 | customRender: 'Custom render file list', 21 | } 22 | -------------------------------------------------------------------------------- /theme/light/common.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | '--font-size-xs': '10px', 3 | '--font-size-sm': '12px', 4 | '--font-size-md': '14px', 5 | '--font-size-lg': '16px', 6 | '--icon-size-xs': '16px', 7 | '--icon-size-sm': '18px', 8 | '--icon-size-md': '20px', 9 | '--icon-size-lg': '22px', 10 | '--color-body': '#fff', 11 | '--color-text': '#333', 12 | '--color-primary': '#3a7afe', 13 | '--color-info': '#00afef', 14 | '--color-success': '#00c48f', 15 | '--color-warning': '#ff9f00', 16 | '--color-danger': '#f44336', 17 | '--color-disabled': '#e0e0e0', 18 | '--color-text-disabled': '#aaa', 19 | '--opacity-disabled': 0.6, 20 | '--cubic-bezier': 'cubic-bezier(0.25, 0.8, 0.5, 1)', 21 | '--shadow-key-umbra-opacity': 'rgba(0, 0, 0, 0.2)', 22 | '--shadow-key-penumbra-opacity': 'rgba(0, 0, 0, 0.14)', 23 | '--shadow-key-ambient-opacity': 'rgba(0, 0, 0, 0.12)', 24 | } 25 | -------------------------------------------------------------------------------- /theme/light/skeleton.ts: -------------------------------------------------------------------------------- 1 | const SkeletonTheme = { 2 | '--skeleton-content-padding': '16px', 3 | '--skeleton-card-height': '160px', 4 | '--skeleton-card-border-radius': '4px', 5 | '--skeleton-card-margin-bottom': '16px', 6 | '--skeleton-card-background-color': 'rgba(0, 0, 0, 0.12)', 7 | '--skeleton-animation-background': 8 | 'linear-gradient(90deg, hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0.3), hsla(0, 0%, 100%, 0))', 9 | '--skeleton-avatar-size': '34px', 10 | '--skeleton-avatar-border-radius': '50%', 11 | '--skeleton-avatar-margin-right': '16px', 12 | '--skeleton-avatar-background-color': 'rgba(0, 0, 0, 0.12)', 13 | '--skeleton-title-width': '50%', 14 | '--skeleton-title-border-radius': '10px', 15 | '--skeleton-title-background-color': 'rgba(0, 0, 0, 0.12)', 16 | '--skeleton-row-height': '12px', 17 | '--skeleton-row-border-radius': '10px', 18 | '--skeleton-row-margin-top': '10px', 19 | } 20 | 21 | export default SkeletonTheme 22 | -------------------------------------------------------------------------------- /src/tabs/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | modifyStyle: 'Modify Style', 4 | disabled: 'Tab Disabled', 5 | enableScroll: 'Enable Scroll', 6 | tabVerticalLayout: 'Tab Vertical Layout', 7 | tabsVerticalLayout: 'Tabs Vertical Layout', 8 | viewRelation: 'View Relation', 9 | option: 'Option', 10 | stickyLayout: 'Sticky Layout', 11 | text: 12 | 'The way she came into the place.\n' + 13 | 'I knew right then and there.\n' + 14 | 'there was something different about this girl.', 15 | text2: 16 | 'The girl was persuasive.\n' + 17 | 'the girl I could not trust.\n' + 18 | 'The girl was bad.\n' + 19 | 'the girl was dangerous.\n' + 20 | 'I never know.', 21 | text3: 22 | "She's so dangerous.\n" + 23 | 'the girl is so dangerous.\n' + 24 | 'Take away my money, throw away my time.\n' + 25 | 'You can call me honey.\n' + 26 | "but you're no damn good for me.", 27 | } 28 | -------------------------------------------------------------------------------- /theme/light/select.ts: -------------------------------------------------------------------------------- 1 | const SelectTheme = { 2 | '--select-select-text-color': '#555', 3 | '--select-select-padding': '5px 0', 4 | '--select-error-color': 'var(--color-danger)', 5 | '--select-blur-color': '#888', 6 | '--select-focus-color': 'var(--color-primary)', 7 | '--select-scroller-background': '#fff', 8 | '--select-scroller-padding': '6px 0', 9 | '--select-scroller-margin': '8px 0 0 0', 10 | '--select-scroller-max-height': '278px', 11 | '--select-placeholder-size': '16px', 12 | '--select-icon-padding': '16px 0 0', 13 | '--select-icon-size': '20px', 14 | '--select-chip-margin': '5px 5px 0', 15 | '--select-line-size': '1px', 16 | '--select-line-spread-size': '2px', 17 | '--select-arrow-size': '20px', 18 | '--select-disabled-color': 'var(--color-text-disabled)', 19 | '--option-height': '38px', 20 | '--option-padding': '0 12px', 21 | '--option-selected-background': 'var(--select-focus-color)', 22 | } 23 | 24 | export default SelectTheme 25 | -------------------------------------------------------------------------------- /theme/light/pagination.ts: -------------------------------------------------------------------------------- 1 | const PopupTheme = { 2 | '--pagination-font-size': 'var(--font-size-md)', 3 | '--pagination-active-color': '#fff', 4 | '--pagination-active-bg-color': 'var(--color-primary)', 5 | '--pagination-hover-bg-color': '#edf5ff', 6 | '--pagination-total-margin': '0 12px', 7 | '--pagination-total-line-height': '24px', 8 | '--pagination-item-width': '32px', 9 | '--pagination-item-height': '32px', 10 | '--pagination-item-margin': '0 6px', 11 | '--pagination-item-background': '#fff', 12 | '--pagination-item-border-radius': '4px', 13 | '--pagination-list-bg-color': '#fff', 14 | '--pagination-list-active-bg-color': '#edf5ff', 15 | '--pagination-list-active-color': 'var(--color-primary)', 16 | '--pagination-input-width': '32px', 17 | '--pagination-disabled-color': 'var(--color-text-disabled)', 18 | '--pagination-bg-disabled-color': 'var(--color-disabled)', 19 | '--pagination-size-line-height': '24px', 20 | } 21 | export default PopupTheme 22 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug_report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Bug report 3 | about: Create a report to help us improve 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | 8 | --- 9 | 10 | **Describe the bug** 11 | A clear and concise description of what the bug is. 12 | 13 | **To Reproduce** 14 | Steps to reproduce the behavior: 15 | 1. Go to '...' 16 | 2. Click on '....' 17 | 3. Scroll down to '....' 18 | 4. See error 19 | 20 | **Expected behavior** 21 | A clear and concise description of what you expected to happen. 22 | 23 | **Screenshots** 24 | If applicable, add screenshots to help explain your problem. 25 | 26 | **Desktop (please complete the following information):** 27 | - OS: [e.g. iOS] 28 | - Browser [e.g. chrome, safari] 29 | - Version [e.g. 22] 30 | 31 | **Smartphone (please complete the following information):** 32 | - Device: [e.g. iPhone6] 33 | - OS: [e.g. iOS8.1] 34 | - Browser [e.g. stock browser, safari] 35 | - Version [e.g. 22] 36 | 37 | **Additional context** 38 | Add any other context about the problem here. 39 | -------------------------------------------------------------------------------- /src/select/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | basicUsage: 'Basic Usage', 3 | plainMode: 'Plain Mode', 4 | disabled: 'Disabled', 5 | readonly: 'Readonly', 6 | clearable: 'Clearable', 7 | displayIcon: 'Display Icon', 8 | validate: 'Validate', 9 | multipleValidate: 'Multiple Validate', 10 | placeholder: 'Please select one the options', 11 | multiplePlaceholder: 'Please select multiple options', 12 | clearableText: 'Clearable Text', 13 | relation: 'Label relation value', 14 | multiple: 'Multiple Selection', 15 | chipMultiple: 'Multiple choice of paper style', 16 | eat: 'Eat', 17 | sleep: 'Sleep', 18 | play: 'Play game', 19 | coding: 'Coding', 20 | rest: 'Rest', 21 | currentSelect: 'The current selection is:', 22 | mustSelectRest: 'You must choose to rest', 23 | mustSelectMoreThan: 'You select at least two options', 24 | offsetY: 'offsetY', 25 | emberSprit: 'Ember Sprit', 26 | earthSprit: 'Earth Sprit', 27 | stormSpirit: 'Storm Spirit', 28 | voidSpirit: 'Void Spirit', 29 | } 30 | -------------------------------------------------------------------------------- /src/common/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | themeColorButton: '主题色按钮', 3 | defaultButton: '默认按钮', 4 | primaryButton: '主要按钮', 5 | infoButton: '信息按钮', 6 | successButton: '成功按钮', 7 | warningButton: '警告按钮', 8 | dangerButton: '危险按钮', 9 | textButton: '文字按钮', 10 | plainTextButton: '纯文字按钮', 11 | outlineButton: '外边框按钮', 12 | disabledStatus: '禁用状态', 13 | loadingStatus: '加载状态', 14 | buttonSize: '按钮尺寸', 15 | normalButton: '常规按钮', 16 | smallButton: '小型按钮', 17 | miniButton: '迷你按钮', 18 | largeButton: '大型按钮', 19 | blockButton: '块级按钮', 20 | customColor: '自定义颜色', 21 | backgroundTextColor: '背景/文字', 22 | linearGradientColor: '使用渐变', 23 | roundButton: '圆形按钮', 24 | event: '注册事件', 25 | click: '点击', 26 | touchstart: '触摸', 27 | autoLoading: '自动加载', 28 | clickSuccess: '点击成功', 29 | touchstartSuccess: '触摸成功', 30 | basicUsage: '基本使用', 31 | showIcon: '显示图标', 32 | showDesc: '显示描述', 33 | showBorder: '显示边框', 34 | content: '这是单元格', 35 | description: '描述', 36 | iconSize: '图标尺寸', 37 | iconColor: '图标颜色', 38 | } 39 | -------------------------------------------------------------------------------- /src/list/example/locale/index.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: wzhaofei wangzf@wellnkiot.com 3 | * @Date: 2022-09-28 16:50:06 4 | * @LastEditors: wzhaofei wangzf@wellnkiot.com 5 | * @LastEditTime: 2022-09-28 17:00:07 6 | * @FilePath: \varlet-ute\src\list\example\locale\index.ts 7 | * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE 8 | */ 9 | // lib 10 | import _zhCN from '@varlet/ui/es/locale/zh-CN' 11 | import _enCN from '@varlet/ui/es/locale/en-US' 12 | // mobile example doc 13 | import zhCN from './zh-CN' 14 | import enUS from './en-US' 15 | import { Locale } from '@varlet/ui' 16 | 17 | const { useLocale, use: _use, add: _add } = Locale 18 | 19 | const { add, use: exampleUse, pack, packs, merge } = useLocale() 20 | 21 | const use = (lang: string) => { 22 | _use(lang) 23 | exampleUse(lang) 24 | } 25 | 26 | export { add, pack, packs, merge, use } 27 | 28 | // lib 29 | _add('zh-CN', _zhCN) 30 | _add('en-US', _enCN) 31 | // mobile example doc 32 | add('zh-CN', zhCN as any) 33 | add('en-US', enUS as any) 34 | -------------------------------------------------------------------------------- /src/button/example/locale/zh-CN.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | themeColorButton: '主题色按钮', 3 | themeColorButtonGroup: '按钮组主题色', 4 | defaultButton: '默认按钮', 5 | primaryButton: '主要按钮', 6 | infoButton: '信息按钮', 7 | successButton: '成功按钮', 8 | warningButton: '警告按钮', 9 | dangerButton: '危险按钮', 10 | textButton: '文字按钮', 11 | modeButtonGroup: '按钮组模式', 12 | plainTextButton: '纯文字按钮', 13 | outlineButton: '外边框按钮', 14 | outline: '边框', 15 | disabledStatus: '禁用状态', 16 | loadingStatus: '加载状态', 17 | buttonSize: '按钮尺寸', 18 | buttonGroupSize: '按钮组尺寸', 19 | normalButton: '常规按钮', 20 | smallButton: '小型按钮', 21 | miniButton: '迷你按钮', 22 | largeButton: '大型按钮', 23 | blockButton: '块级按钮', 24 | customColor: '自定义颜色', 25 | customButtonGroupColor: '自定义按钮组颜色', 26 | backgroundTextColor: '背景/文字', 27 | linearGradientColor: '使用渐变', 28 | verticalButtonGroup: '按钮组竖直排列', 29 | roundButton: '圆形按钮', 30 | event: '注册事件', 31 | click: '点击', 32 | touchstart: '触摸', 33 | autoLoading: '自动加载', 34 | clickSuccess: '点击成功', 35 | touchstartSuccess: '触摸成功', 36 | button: '按钮', 37 | splitButton: '按钮拆分', 38 | } 39 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2022 vike 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 | -------------------------------------------------------------------------------- /theme/light/button.ts: -------------------------------------------------------------------------------- 1 | const ButtonTheme = { 2 | '--button-default-color': '#f5f5f5', 3 | '--button-primary-color': 'var(--color-primary)', 4 | '--button-danger-color': 'var(--color-danger)', 5 | '--button-success-color': 'var(--color-success)', 6 | '--button-warning-color': 'var(--color-warning)', 7 | '--button-info-color': 'var(--color-info)', 8 | '--button-disabled-color': 'var(--color-disabled)', 9 | '--button-disabled-text-color': 'var(--color-text-disabled)', 10 | '--button-border-radius': '4px', 11 | '--button-mini-padding': '0 9px', 12 | '--button-small-padding': '0 11px', 13 | '--button-normal-padding': '0 15px', 14 | '--button-large-padding': '0 22px', 15 | '--button-round-padding': '6px', 16 | '--button-mini-height': '20px', 17 | '--button-small-height': '28px', 18 | '--button-normal-height': '36px', 19 | '--button-large-height': '44px', 20 | '--button-mini-font-size': 'var(--font-size-xs)', 21 | '--button-small-font-size': 'var(--font-size-sm)', 22 | '--button-normal-font-size': 'var(--font-size-md)', 23 | '--button-large-font-size': 'var(--font-size-lg)', 24 | } 25 | 26 | export default ButtonTheme 27 | -------------------------------------------------------------------------------- /theme/light/chip.ts: -------------------------------------------------------------------------------- 1 | const ChipTheme = { 2 | '--chip-default-color': '#e0e0e0', 3 | '--chip-primary-color': 'var(--color-primary)', 4 | '--chip-danger-color': 'var(--color-danger)', 5 | '--chip-success-color': 'var(--color-success)', 6 | '--chip-warning-color': 'var(--color-warning)', 7 | '--chip-info-color': 'var(--color-info)', 8 | '--chip-border-radius': '2px', 9 | '--chip-mini-height': '16px', 10 | '--chip-small-height': '24px', 11 | '--chip-normal-height': '32px', 12 | '--chip-large-height': '40px', 13 | '--chip-round-radius': '100px', 14 | '--chip-mini-padding': '0 4px', 15 | '--chip-small-padding': '0 6px', 16 | '--chip-normal-padding': '0 10px', 17 | '--chip-large-padding': '0 17px', 18 | '--chip-text-large-margin': '0 5px', 19 | '--chip-text-normal-margin': '0 5px', 20 | '--chip-text-small-margin': '0 3px', 21 | '--chip-text-mini-margin': '0 2px', 22 | '--chip-mini-font-size': 'var(--font-size-xs)', 23 | '--chip-small-font-size': 'var(--font-size-sm)', 24 | '--chip-normal-font-size': 'var(--font-size-md)', 25 | '--chip-large-font-size': 'var(--font-size-lg)', 26 | } 27 | 28 | export default ChipTheme 29 | -------------------------------------------------------------------------------- /src/form/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | example: 'Form Example', 3 | username: 'Please input username', 4 | usernameMessage: 'The username cannot be empty', 5 | password: 'Please input password', 6 | passwordMessage: 'The password cannot be empty', 7 | department: 'Please select department', 8 | departmentMessage: 'The select cannot be empty', 9 | eat: 'Eat', 10 | sleep: 'Sleep', 11 | play: 'Play game', 12 | departmentUnit: ' department', 13 | group: 'Please select group', 14 | groupMessage: 'The select cannot be empty', 15 | groupUnit: ' group', 16 | genderMessage: 'The gender cannot be empty', 17 | male: 'Male', 18 | female: 'Female', 19 | rateMessage: 'It has to be greater than 2', 20 | likeMessage: 'The select cannot be empty', 21 | licenseMessage: 'You must turn on', 22 | countMessage: 'It has to be greater than 10', 23 | rangeMessage: 'It has to be greater than 10', 24 | filesMessage: 'Upload at least one picture', 25 | controller: 'Form control', 26 | reset: 'Empty form', 27 | resetValidation: 'Empty the validation', 28 | validate: 'Trigger validation', 29 | disabled: 'Form disabled', 30 | readonly: 'Form readonly', 31 | } 32 | -------------------------------------------------------------------------------- /docs/home.en-US.md: -------------------------------------------------------------------------------- 1 | 2 | ### Intro 3 | 4 | Varlet UI theme editor is a theme editing tool based on `VARLET` and maintained by the community team. 5 | 6 | ### Features 7 | 8 | - 🚀   Provides theme editing capabilities for all components of the VARLET component library 9 | - 🚀   The exported theme package is very lightweight 10 | - 💪   Developed by Chinese people, complete Chinese and English documents and logistical support 11 | - 💪   Built using VARLET CLI, the interactive experience is consistent with the official VARLET documentation 12 | - 🛠️   Support editing dark mode 13 | - 🌍   Support internationalization 14 | 15 | ### PR & Issue 16 | 17 | If you have any problems during use, you can [issue](https://github.com/varletjs/varlet-ute/issues) them to us on [github](https://github.com/varletjs/varlet-ute), 18 | we will deal with it as soon as possible. You can also give us [PR](https://github.com/varletjs/varlet-ute/pulls). 19 | 20 | ### Open source licenses 21 | Component library based on `MIT` licenses. 22 | 23 | ### Special thanks 24 | 25 | Special thanks to `haoziqaq` for the visual support of our component library documentation site, 26 | to help us continue to evolve. 27 | -------------------------------------------------------------------------------- /src/paper/example/index.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 35 | -------------------------------------------------------------------------------- /.github/workflows/deploy-playground-sync-gitee.yaml: -------------------------------------------------------------------------------- 1 | name: Deploy Playground And Sync to Gitee 2 | 3 | on: 4 | push: 5 | branches: [dev, main] 6 | 7 | jobs: 8 | deploy-playground-sync-gitee: 9 | runs-on: ubuntu-latest 10 | steps: 11 | - name: Checkout 12 | uses: actions/checkout@v3 13 | 14 | - name: Install pnpm 15 | uses: pnpm/action-setup@v2.2.2 16 | with: 17 | version: 7 18 | 19 | - name: Set node version to 16 20 | uses: actions/setup-node@v3 21 | with: 22 | node-version: '16' 23 | cache: 'pnpm' 24 | 25 | - name: Install dependencies 26 | run: pnpm install 27 | 28 | - name: Build ute 29 | run: pnpm build 30 | 31 | - name: Deploy site 32 | uses: JamesIves/github-pages-deploy-action@4.1.1 33 | with: 34 | branch: gh-page 35 | folder: site 36 | 37 | - name: Sync to Gitee 38 | uses: wearerequired/git-mirror-action@master 39 | env: 40 | SSH_PRIVATE_KEY: ${{ secrets.GITEE_RSA_PRIVATE_KEY }} 41 | with: 42 | source-repo: git@github.com:varletjs/varlet-ute.git 43 | destination-repo: git@gitee.com:vike123/varlet-ute.git 44 | -------------------------------------------------------------------------------- /src/pagination/example/index.vue: -------------------------------------------------------------------------------- 1 | 13 | 14 | 32 | 33 | 38 | -------------------------------------------------------------------------------- /src/ripple/example/index.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 22 | 23 | 37 | -------------------------------------------------------------------------------- /theme/light/result.ts: -------------------------------------------------------------------------------- 1 | const ResultTheme = { 2 | '--result-background': '#fff', 3 | '--result-info-color': 'var(--color-info)', 4 | '--result-info-border-color': 'rgba(0, 175, 239, 0.3)', 5 | '--result-success-color': 'var(--color-success)', 6 | '--result-success-border-color': 'rgba(0, 196, 143, 0.3)', 7 | '--result-error-color': 'var(--color-danger)', 8 | '--result-error-border-color': 'rgba(244, 67, 54, 0.3)', 9 | '--result-warning-color': 'var(--color-warning)', 10 | '--result-warning-border-color': 'rgba(255, 159, 0, 0.3)', 11 | '--result-question-color': '#607d8b', 12 | '--result-question-border-color': 'rgba(96, 125, 139, 0.3)', 13 | '--result-empty-color': '#9e9e9e', 14 | '--result-empty-border-color': 'rgba(158, 158, 158, 0.3)', 15 | '--result-padding': '24px', 16 | '--result-border-radius': '3px', 17 | '--result-title-color': '#444', 18 | '--result-title-font-size': '32px', 19 | '--result-title-margin': '15px 0 0 0', 20 | '--result-image-size': '80px', 21 | '--result-title-font-weight': 500, 22 | '--result-description-margin': '10px 0 0 0', 23 | '--result-description-font-size': '14px', 24 | '--result-description-color': 'rgba(0, 0, 0, 0.6)', 25 | '--result-description-line-height': 1.6, 26 | } 27 | 28 | export default ResultTheme 29 | -------------------------------------------------------------------------------- /src/common/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | themeColorButton: 'Theme Color Button', 3 | defaultButton: 'Default Button', 4 | primaryButton: 'Primary Button', 5 | infoButton: 'Info Button', 6 | successButton: 'Success Button', 7 | warningButton: 'Warning Button', 8 | dangerButton: 'Danger Button', 9 | textButton: 'Text Button', 10 | plainTextButton: 'Plain Text Button', 11 | outlineButton: 'Outline Button', 12 | disabledStatus: 'Disabled Status', 13 | loadingStatus: 'Loading Status', 14 | buttonSize: 'Button Size', 15 | normalButton: 'Normal Button', 16 | smallButton: 'Small Button', 17 | miniButton: 'Mini Button', 18 | largeButton: 'Large Button', 19 | blockButton: 'Block Button', 20 | customColor: 'Custom Color', 21 | textColor: 'Text Color', 22 | backgroundTextColor: 'Background/Text Color', 23 | linearGradientColor: 'LinearGradient Color', 24 | roundButton: 'Round Button', 25 | event: 'Event', 26 | click: 'Click', 27 | touchstart: 'Touchstart', 28 | autoLoading: 'Auto Loading', 29 | clickSuccess: 'Click Success', 30 | touchstartSuccess: 'Touchstart Success', 31 | basicUsage: 'Basic Usage', 32 | showIcon: 'Show Icon', 33 | showDesc: 'Show Description', 34 | showBorder: 'Show Border', 35 | content: 'This is Cell', 36 | description: 'Description', 37 | iconSize: 'Icon Size', 38 | iconColor: 'Icon color', 39 | } 40 | -------------------------------------------------------------------------------- /src/cell/example/index.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 42 | -------------------------------------------------------------------------------- /README.zh-CN.md: -------------------------------------------------------------------------------- 1 | 2 |
3 | 4 | 5 | 6 |

VARLET UTE

7 |

Varlet UI 主题编辑工具

8 |

9 | 文档(Gitee) | 10 | English README 11 |

12 |

13 | version 14 | vue 15 | licence 16 |

17 |
18 | 19 | --- 20 | 21 | ### 介绍 22 | 23 | Varlet UTE 是一个基于 `VARLET` 开发的主题编辑工具, 由社区团队维护 24 | 25 | ### 特性 26 | 27 | - 🚀   提供 VARLET 组件库所有组件的主题编辑能力 28 | - 🚀   导出的主题包十分轻量 29 | - 💪   由国人开发，完善的中英文文档和后勤保障 30 | - 💪   使用 VARLET CLI 构建，与 VARLET 官方文档的交互体验高度一致 31 | - 🛠️   支持亮色和暗色两种主题定制 32 | - 🌍   支持国际化 33 | 34 | ### 反馈和交流 35 | 36 | 我们推荐使用`issue`列表进行最直接有效的反馈，也可以下面的方式 37 | 38 | * 微信 39 | 40 | 41 | 42 | 43 | ### 感谢贡献者们做出的努力 44 | 45 | 46 | 47 | 48 | -------------------------------------------------------------------------------- /theme/light/card.ts: -------------------------------------------------------------------------------- 1 | const CardTheme = { 2 | '--card-padding': '0 0 15px 0', 3 | '--card-background': '#fff', 4 | '--card-border-radius': '4px', 5 | '--card-image-width': '100%', 6 | '--card-row-image-width': '140px', 7 | '--card-image-height': '200px', 8 | '--card-row-height': '140px', 9 | '--card-title-color': '#333', 10 | '--card-title-font-size': '20px', 11 | '--card-title-padding': '0 12px', 12 | '--card-title-margin': '15px 0 0 0', 13 | '--card-title-row-margin': '12px 0', 14 | '--card-subtitle-color': 'rgba(0, 0, 0, 0.6)', 15 | '--card-subtitle-font-size': '14px', 16 | '--card-subtitle-padding': '0 12px', 17 | '--card-subtitle-margin': '10px 0 0 0', 18 | '--card-subtitle-row-margin': '-8px 0 0 0', 19 | '--card-description-color': 'rgba(0, 0, 0, 0.6)', 20 | '--card-description-font-size': '14px', 21 | '--card-description-margin': '20px 0 0 0', 22 | '--card-description-padding': '0 13px', 23 | '--card-footer-padding': '0 12px', 24 | '--card-footer-right': '13px', 25 | '--card-footer-bottom': '9px', 26 | '--card-footer-margin': '30px 0 0 0', 27 | '--card-line-height': '22px', 28 | '--card-row-line-height': '1.5', 29 | '--card-floating-buttons-bottom': '16px', 30 | '--card-floating-buttons-right': '16px', 31 | '--card-floating-buttons-color': '#fff', 32 | '--card-close-button-icon-size': '24px', 33 | '--card-close-button-size': '56px', 34 | '--card-close-button-primary-color': '#212121', 35 | } 36 | 37 | export default CardTheme 38 | -------------------------------------------------------------------------------- /src/button/example/locale/en-US.ts: -------------------------------------------------------------------------------- 1 | export default { 2 | themeColorButton: 'Theme Color Button', 3 | themeColorButtonGroup: 'Button Group Theme Color', 4 | defaultButton: 'Default Button', 5 | default: 'Default', 6 | primaryButton: 'Primary Button', 7 | infoButton: 'Info Button', 8 | successButton: 'Success Button', 9 | warningButton: 'Warning Button', 10 | dangerButton: 'Danger Button', 11 | textButton: 'Text Button', 12 | modeButtonGroup: 'Button Group Mode', 13 | plainTextButton: 'Plain Text Button', 14 | outlineButton: 'Outline Button', 15 | outline: 'Outline', 16 | disabledStatus: 'Disabled Status', 17 | loadingStatus: 'Loading Status', 18 | buttonSize: 'Button Size', 19 | buttonGroupSize: 'Button Group Size', 20 | normalButton: 'Normal Button', 21 | smallButton: 'Small Button', 22 | miniButton: 'Mini Button', 23 | largeButton: 'Large Button', 24 | blockButton: 'Block Button', 25 | customColor: 'Custom Color', 26 | customButtonGroupColor: 'Custom Button Group Color', 27 | textColor: 'Text Color', 28 | backgroundTextColor: 'Background/Text Color', 29 | verticalButtonGroup: 'Vertical Button Group', 30 | linearGradientColor: 'LinearGradient Color', 31 | roundButton: 'Round Button', 32 | event: 'Events', 33 | click: 'Click', 34 | touchstart: 'Touchstart', 35 | autoLoading: 'Auto Loading', 36 | clickSuccess: 'Click Success', 37 | touchstartSuccess: 'Touchstart Success', 38 | button: 'Button', 39 | splitButton: 'Split Button', 40 | } 41 | -------------------------------------------------------------------------------- /theme/light/uploader.ts: -------------------------------------------------------------------------------- 1 | const UploaderTheme = { 2 | '--uploader-action-background': '#f7f8fa', 3 | '--uploader-action-icon-color': '#888', 4 | '--uploader-action-icon-size': '24px', 5 | '--uploader-action-margin': '0 10px 10px 0', 6 | '--uploader-file-size': '80px', 7 | '--uploader-file-margin': '0 10px 10px 0', 8 | '--uploader-file-name-background': '#f7f8fa', 9 | '--uploader-file-name-color': '#888', 10 | '--uploader-file-name-font-size': '12px', 11 | '--uploader-file-name-padding': '10px', 12 | '--uploader-file-text-align': 'center', 13 | '--uploader-file-close-background': 'rgba(0, 0, 0, 0.3)', 14 | '--uploader-file-close-size': '24px', 15 | '--uploader-file-close-icon-font-size': '14px', 16 | '--uploader-file-close-icon-color': '#fff', 17 | '--uploader-file-cover-fit': 'cover', 18 | '--uploader-file-cover-background': '#f7f8fa', 19 | '--uploader-preview-video-width': '100vw', 20 | '--uploader-preview-video-height': '100vw', 21 | '--uploader-file-indicator-height': '4px', 22 | '--uploader-file-indicator-normal-color': 'var(--color-disabled)', 23 | '--uploader-file-indicator-success-color': 'var(--color-success)', 24 | '--uploader-file-indicator-error-color': 'var(--color-danger)', 25 | '--uploader-disabled-color': 'var(--color-disabled)', 26 | '--uploader-disabled-text-color': 'var(--color-text-disabled)', 27 | '--uploader-loading-background': 28 | 'linear-gradient(90deg, hsla(0, 0%, 100%, 0), hsla(0, 0%, 100%, 0.3), hsla(0, 0%, 100%, 0))', 29 | } 30 | 31 | export default UploaderTheme 32 | -------------------------------------------------------------------------------- /src/loading-bar/example/index.vue: -------------------------------------------------------------------------------- 1 | 31 | 32 | 41 | -------------------------------------------------------------------------------- /src/divider/example/index.vue: -------------------------------------------------------------------------------- 1 | 14 | 43 | 44 | 57 | --------------------------------------------------------------------------------