├── packages ├── taro-ui-vue-docs │ ├── view │ │ ├── Avatar │ │ │ ├── style.scss │ │ │ └── index.jsx │ │ ├── Badge │ │ │ ├── style.scss │ │ │ └── index.jsx │ │ ├── Card │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Drawer │ │ │ ├── style.scss │ │ │ └── index.jsx │ │ ├── Flex │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Form │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Grid │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Icon │ │ │ ├── style.scss │ │ │ └── index.jsx │ │ ├── List │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Modal │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Tag │ │ │ ├── style.scss │ │ │ └── index.jsx │ │ ├── Toast │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── ActionSheet │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Article │ │ │ ├── style.scss │ │ │ └── index.jsx │ │ ├── FloatLayout │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Noticebar │ │ │ ├── style.scss │ │ │ └── index.jsx │ │ ├── Pagination │ │ │ ├── style.scss │ │ │ └── index.jsx │ │ ├── Progress │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Questions │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Timeline │ │ │ ├── style.scss │ │ │ └── index.jsx │ │ ├── ActivityIndicator │ │ │ ├── index.scss │ │ │ └── index.jsx │ │ ├── Fab │ │ │ └── index.jsx │ │ ├── Rate │ │ │ └── index.jsx │ │ ├── Tabs │ │ │ └── index.jsx │ │ ├── Input │ │ │ └── index.jsx │ │ ├── Radio │ │ │ └── index.jsx │ │ ├── Range │ │ │ └── index.jsx │ │ ├── Steps │ │ │ └── index.jsx │ │ ├── Button │ │ │ ├── index.jsx │ │ │ └── style.scss │ │ ├── NavBar │ │ │ └── index.jsx │ │ ├── Picker │ │ │ └── index.jsx │ │ ├── Slider │ │ │ └── index.jsx │ │ ├── Swiper │ │ │ └── index.jsx │ │ ├── Switch │ │ │ └── index.jsx │ │ ├── TabBar │ │ │ └── index.jsx │ │ ├── Curtain │ │ │ └── index.jsx │ │ ├── Divider │ │ │ └── index.jsx │ │ ├── Indexes │ │ │ └── index.jsx │ │ ├── Message │ │ │ └── index.jsx │ │ ├── Resource │ │ │ └── index.jsx │ │ ├── Calendar │ │ │ └── index.jsx │ │ ├── Checkbox │ │ │ └── index.jsx │ │ ├── LoadMore │ │ │ └── index.jsx │ │ ├── Textarea │ │ │ └── index.jsx │ │ ├── Accordion │ │ │ └── index.jsx │ │ ├── Countdown │ │ │ └── index.jsx │ │ ├── SearchBar │ │ │ └── index.jsx │ │ ├── Quickstart │ │ │ └── index.jsx │ │ ├── Color │ │ │ ├── index.jsx │ │ │ └── style.scss │ │ ├── ImagePicker │ │ │ └── index.jsx │ │ ├── InputNumber │ │ │ └── index.jsx │ │ ├── SwipeAction │ │ │ └── index.jsx │ │ ├── Introduction │ │ │ └── index.jsx │ │ ├── Changelog │ │ │ └── index.jsx │ │ ├── CustomizeTheme │ │ │ └── index.jsx │ │ └── SegmentedControl │ │ │ └── index.jsx │ ├── dist │ │ ├── CNAME │ │ ├── img │ │ │ ├── wxapp.jpg │ │ │ ├── header-bg.png │ │ │ ├── logo-taro.png │ │ │ ├── panel-img1.png │ │ │ ├── panel-img2.png │ │ │ ├── panel-img3.png │ │ │ ├── panel-img4.png │ │ │ ├── panel-tip.png │ │ │ ├── wxapp-logo.png │ │ │ └── iframe_iphonex.png │ │ ├── fonts │ │ │ ├── feather.eot │ │ │ ├── feather.ttf │ │ │ └── feather.woff │ │ ├── favicons │ │ │ └── favicon.png │ │ └── index.html │ ├── static │ │ └── CNAME │ ├── build │ │ ├── conf.js │ │ ├── build-static.js │ │ ├── devServer.conf.js │ │ ├── webpack.dev.config.js │ │ ├── open.js │ │ └── webpack.prod.config.js │ ├── assets │ │ ├── wxapp.jpg │ │ ├── favicon.png │ │ ├── o2logo.png │ │ ├── qr_code.png │ │ ├── header-bg.png │ │ ├── logo-taro.png │ │ ├── o2logo-doc.png │ │ ├── o2logo@2x.png │ │ ├── o2logo_2.png │ │ ├── panel-img1.png │ │ ├── panel-img2.png │ │ ├── panel-img3.png │ │ ├── panel-img4.png │ │ ├── panel-tip.png │ │ ├── wxapp-logo.png │ │ ├── navbar-logo.png │ │ ├── iframe_iphonex.png │ │ └── style │ │ │ └── mixin.scss │ ├── .gitignore │ ├── lib │ │ └── animations │ │ │ └── collapseanimations.scss │ ├── components │ │ └── iconlist │ │ │ └── index.jsx │ ├── babel.config.json │ ├── markdown │ │ ├── introduction.md │ │ ├── resource.md │ │ └── badge.md │ └── app.jsx ├── taro-ui-vue-demo │ ├── src │ │ ├── pages │ │ │ ├── form │ │ │ │ ├── input │ │ │ │ │ └── index.scss │ │ │ │ ├── checkbox │ │ │ │ │ └── index.scss │ │ │ │ ├── search-bar │ │ │ │ │ └── index.scss │ │ │ │ ├── rate │ │ │ │ │ └── index.scss │ │ │ │ ├── slider │ │ │ │ │ └── index.scss │ │ │ │ ├── range │ │ │ │ │ └── index.scss │ │ │ │ ├── input-number │ │ │ │ │ └── index.scss │ │ │ │ ├── picker-view │ │ │ │ │ └── index.scss │ │ │ │ ├── form │ │ │ │ │ └── index.scss │ │ │ │ └── picker │ │ │ │ │ └── index.scss │ │ │ ├── view │ │ │ │ ├── steps │ │ │ │ │ └── index.scss │ │ │ │ ├── article │ │ │ │ │ └── index.scss │ │ │ │ ├── avatar │ │ │ │ │ └── index.scss │ │ │ │ ├── divider │ │ │ │ │ └── index.scss │ │ │ │ ├── load-more │ │ │ │ │ ├── index.scss │ │ │ │ │ └── index.vue │ │ │ │ ├── noticebar │ │ │ │ │ └── index.scss │ │ │ │ ├── badge │ │ │ │ │ └── index.scss │ │ │ │ └── swiper │ │ │ │ │ └── index.scss │ │ │ ├── action │ │ │ │ ├── modal │ │ │ │ │ └── index.scss │ │ │ │ ├── message │ │ │ │ │ └── index.scss │ │ │ │ ├── toast │ │ │ │ │ └── index.scss │ │ │ │ ├── action-sheet │ │ │ │ │ └── index.scss │ │ │ │ ├── progress │ │ │ │ │ └── index.scss │ │ │ │ ├── swipe-action │ │ │ │ │ └── index.scss │ │ │ │ └── activity-indicator │ │ │ │ │ └── index.scss │ │ │ ├── navigation │ │ │ │ ├── pagination │ │ │ │ │ └── index.scss │ │ │ │ ├── navbar │ │ │ │ │ └── index.scss │ │ │ │ ├── segmented-control │ │ │ │ │ └── index.scss │ │ │ │ ├── indexes │ │ │ │ │ └── index.scss │ │ │ │ ├── tabs │ │ │ │ │ └── index.scss │ │ │ │ ├── tabbar │ │ │ │ │ └── index.scss │ │ │ │ └── drawer │ │ │ │ │ └── index.scss │ │ │ ├── index │ │ │ │ └── index.config.ts │ │ │ ├── panel │ │ │ │ └── index.config.ts │ │ │ ├── basic │ │ │ │ ├── color │ │ │ │ │ ├── index.config.ts │ │ │ │ │ └── index.scss │ │ │ │ ├── button │ │ │ │ │ ├── index.config.ts │ │ │ │ │ └── index.scss │ │ │ │ ├── icon │ │ │ │ │ ├── index.config.ts │ │ │ │ │ └── index.scss │ │ │ │ └── typo │ │ │ │ │ └── index.config.ts │ │ │ ├── layout │ │ │ │ └── flex │ │ │ │ │ └── index.scss │ │ │ └── advanced │ │ │ │ └── calendar │ │ │ │ └── index.scss │ │ ├── assets │ │ │ └── images │ │ │ │ ├── curtain.png │ │ │ │ ├── logo_taro.png │ │ │ │ ├── icon-list-form.png │ │ │ │ ├── icon-list-hoc.png │ │ │ │ ├── icon-list-view.png │ │ │ │ ├── icon-list-action.png │ │ │ │ ├── icon-list-basic.png │ │ │ │ ├── icon-list-layout.png │ │ │ │ ├── verification_code.png │ │ │ │ └── icon-list-navigation.png │ │ ├── mixins │ │ │ └── setStateMixin.ts │ │ ├── utils │ │ │ ├── common.ts │ │ │ └── transform.js │ │ ├── store.ts │ │ ├── app.ts │ │ ├── components │ │ │ └── DocsHeader.vue │ │ └── index.html │ ├── config │ │ ├── dev.js │ │ ├── prod.js │ │ └── fix-build-h5.js │ ├── tsconfig.json │ ├── .gitignore │ ├── babel.config.js │ ├── tsconfig.build.json │ ├── project.config.json │ └── global.d.ts └── taro-ui-vue │ ├── src │ ├── style │ │ ├── mixins │ │ │ ├── libs │ │ │ │ ├── disabled.scss │ │ │ │ ├── active.scss │ │ │ │ ├── absolute-center.scss │ │ │ │ ├── overlay.scss │ │ │ │ ├── placeholder.scss │ │ │ │ ├── alignhack.scss │ │ │ │ ├── line.scss │ │ │ │ ├── clearfix.scss │ │ │ │ ├── shade.scss │ │ │ │ ├── tint.scss │ │ │ │ ├── border.scss │ │ │ │ └── flex.scss │ │ │ └── index.scss │ │ ├── index.scss │ │ ├── components │ │ │ ├── form.scss │ │ │ ├── slider.scss │ │ │ ├── load-more.scss │ │ │ ├── pagination.scss │ │ │ ├── activity-indicator.scss │ │ │ ├── divider.scss │ │ │ ├── fab.scss │ │ │ ├── rate.scss │ │ │ ├── swipe-action.scss │ │ │ ├── loading.scss │ │ │ ├── article.scss │ │ │ ├── avatar.scss │ │ │ ├── message.scss │ │ │ ├── badge.scss │ │ │ ├── indexes.scss │ │ │ └── range.scss │ │ └── themes │ │ │ ├── red.scss │ │ │ └── purple.scss │ └── components │ │ ├── calendar │ │ ├── common │ │ │ └── constant.ts │ │ ├── ui │ │ │ ├── day-list │ │ │ │ └── index.vue │ │ │ └── date-list │ │ │ │ └── index.vue │ │ └── controller │ │ │ └── index.vue │ │ ├── list │ │ ├── index.vue │ │ └── index.ts │ │ ├── tag │ │ └── index.vue │ │ ├── swipe-action │ │ ├── options │ │ │ ├── index.vue │ │ │ └── index.ts │ │ └── index.vue │ │ ├── icon │ │ └── index.vue │ │ ├── fab │ │ ├── index.vue │ │ └── index.ts │ │ ├── avatar │ │ └── index.vue │ │ ├── badge │ │ ├── index.vue │ │ └── index.ts │ │ ├── curtain │ │ └── index.vue │ │ ├── modal │ │ ├── header │ │ │ └── index.vue │ │ ├── content │ │ │ └── index.vue │ │ └── action │ │ │ └── index.vue │ │ ├── divider │ │ └── index.vue │ │ ├── action-sheet │ │ ├── components │ │ │ ├── body.vue │ │ │ ├── header.vue │ │ │ ├── item.vue │ │ │ └── footer.vue │ │ └── index.vue │ │ ├── message │ │ └── index.vue │ │ ├── mixins.ts │ │ ├── switch │ │ └── index.vue │ │ ├── tabs-pane │ │ ├── index.vue │ │ └── index.ts │ │ ├── activity-indicator │ │ ├── index.vue │ │ └── index.ts │ │ ├── rate │ │ └── index.vue │ │ ├── segmented-control │ │ └── index.vue │ │ ├── steps │ │ └── index.ts │ │ ├── progress │ │ └── index.vue │ │ ├── countdown │ │ ├── item.vue │ │ └── index.vue │ │ ├── slider │ │ └── index.vue │ │ ├── radio │ │ └── index.vue │ │ ├── checkbox │ │ └── index.vue │ │ ├── input-number │ │ └── index.vue │ │ ├── toast │ │ └── index.vue │ │ ├── range │ │ └── index.vue │ │ ├── load-more │ │ ├── index.vue │ │ └── main.ts │ │ ├── drawer │ │ └── index.vue │ │ ├── timeline │ │ └── index.vue │ │ ├── textarea │ │ └── index.vue │ │ ├── card │ │ └── index.vue │ │ └── float-layout │ │ └── index.vue │ ├── tests │ ├── helper.ts │ ├── README.md │ └── unit │ │ ├── __snapshots__ │ │ ├── form.spec.js.snap │ │ ├── fab.spec.js.snap │ │ ├── message.spec.js.snap │ │ ├── badge.spec.js.snap │ │ ├── tabs-pane.spec.js.snap │ │ ├── icon.spec.js.snap │ │ ├── tag.spec.js.snap │ │ └── loading.spec.js.snap │ │ ├── calendar.spec.js │ │ ├── loading.spec.js │ │ ├── message.spec.js │ │ ├── fab.spec.js │ │ ├── badge.spec.js │ │ ├── form.spec.js │ │ └── tabs-pane.spec.js │ ├── tsconfig.json │ ├── config │ ├── copy.js │ ├── rollup.config.analyze.js │ ├── tsconfig.build.json │ ├── tsconfig.rollup.json │ └── formatTag.js │ ├── .gitignore │ ├── types │ ├── icon.d.ts │ ├── badge.d.ts │ ├── fab.d.ts │ ├── checkbox.d.ts │ ├── tabs-pane.d.ts │ ├── float-button.d.ts │ ├── base.d.ts │ ├── activity-indicator.d.ts │ ├── divider.d.ts │ ├── form.d.ts │ ├── curtain.d.ts │ ├── switch.d.ts │ ├── timeline.d.ts │ ├── rate.d.ts │ ├── message.d.ts │ ├── avatar.d.ts │ ├── flex.d.ts │ ├── progress.d.ts │ ├── drawer.d.ts │ ├── radio.d.ts │ ├── card.d.ts │ ├── tag.d.ts │ ├── pagination.d.ts │ ├── segmented-control.d.ts │ ├── accordion.d.ts │ ├── grid.d.ts │ ├── load-more.d.ts │ ├── toast.d.ts │ ├── action-sheet.d.ts │ ├── range.d.ts │ ├── noticebar.d.ts │ ├── nav-bar.d.ts │ └── steps.d.ts │ ├── babel.config.js │ ├── README.md │ ├── jest.config.js │ ├── jest.tsconfig.json │ ├── global.d.ts │ ├── tsconfig.build.json │ └── project.config.json ├── tsconfig.json ├── .vscode └── settings.json ├── .gitignore ├── .editorconfig ├── lerna.json ├── package.json ├── .github ├── dependabot.yml └── ISSUE_TEMPLATE │ ├── ---feature-request.md │ └── ---bug-report.md ├── tsconfig.build.json └── LICENSE.md /packages/taro-ui-vue-docs/view/Avatar/style.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Badge/style.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Card/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Drawer/style.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Flex/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Form/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Grid/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Icon/style.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/List/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Modal/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Tag/style.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Toast/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/ActionSheet/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Article/style.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/FloatLayout/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Noticebar/style.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Pagination/style.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Progress/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Questions/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Timeline/style.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/input/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/view/steps/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/CNAME: -------------------------------------------------------------------------------- 1 | taro-ui.aotu.io 2 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/static/CNAME: -------------------------------------------------------------------------------- 1 | taro-ui.aotu.io 2 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/action/modal/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/checkbox/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/search-bar/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/ActivityIndicator/index.scss: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/build/conf.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | output: 'dist' 3 | } 4 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/view/article/index.scss: -------------------------------------------------------------------------------- 1 | @import 'taro-ui-vue/style/components/article.scss'; 2 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/rate/index.scss: -------------------------------------------------------------------------------- 1 | .example-item { 2 | color: #333; 3 | font-size: 28px; 4 | } 5 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/slider/index.scss: -------------------------------------------------------------------------------- 1 | .panel__content .example-item__desc { 2 | margin-left: 18PX; 3 | } 4 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/disabled.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * 禁止态 3 | */ 4 | @mixin disabled { 5 | color: #bbb; 6 | } 7 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.build", 3 | "compilerOptions": { 4 | "baseUrl": "./packages" 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/wxapp.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/wxapp.jpg -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/favicon.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/o2logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/o2logo.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/qr_code.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/qr_code.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/wxapp.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/wxapp.jpg -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "editor.codeActionsOnSave": { 3 | "source.fixAll.eslint": true 4 | }, 5 | "search.followSymlinks": false 6 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/header-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/header-bg.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/logo-taro.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/logo-taro.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/o2logo-doc.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/o2logo-doc.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/o2logo@2x.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/o2logo@2x.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/o2logo_2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/o2logo_2.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/panel-img1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/panel-img1.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/panel-img2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/panel-img2.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/panel-img3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/panel-img3.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/panel-img4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/panel-img4.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/panel-tip.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/panel-tip.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/wxapp-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/wxapp-logo.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/range/index.scss: -------------------------------------------------------------------------------- 1 | .example-item { 2 | color: #333; 3 | font-size: 28px; 4 | // padding: 0 28px; 5 | } 6 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/navbar-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/navbar-logo.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/fonts/feather.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/fonts/feather.eot -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/fonts/feather.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/fonts/feather.ttf -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/fonts/feather.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/fonts/feather.woff -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/header-bg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/header-bg.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/logo-taro.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/logo-taro.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/panel-img1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/panel-img1.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/panel-img2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/panel-img2.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/panel-img3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/panel-img3.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/panel-img4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/panel-img4.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/panel-tip.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/panel-tip.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/wxapp-logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/wxapp-logo.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/action/message/index.scss: -------------------------------------------------------------------------------- 1 | .toast-page .example__body { 2 | &-button { 3 | display: inline-block; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/action/toast/index.scss: -------------------------------------------------------------------------------- 1 | .toast-page .example__body { 2 | &-button { 3 | display: inline-block; 4 | } 5 | } 6 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/iframe_iphonex.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/assets/iframe_iphonex.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/favicons/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/favicons/favicon.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/img/iframe_iphonex.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-docs/dist/img/iframe_iphonex.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/curtain.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/curtain.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/logo_taro.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/logo_taro.png -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/helper.ts: -------------------------------------------------------------------------------- 1 | export const sleep = async (timeout: number): Promise => 2 | new Promise((resolve) => setTimeout(resolve, timeout)) 3 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/action/action-sheet/index.scss: -------------------------------------------------------------------------------- 1 | @import "~taro-ui/dist/style/variables/default"; 2 | 3 | .danger { 4 | color: $color-error; 5 | } 6 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/icon-list-form.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/icon-list-form.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/icon-list-hoc.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/icon-list-hoc.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/icon-list-view.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/icon-list-view.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/input-number/index.scss: -------------------------------------------------------------------------------- 1 | .example--item { 2 | margin-bottom: 24px; 3 | 4 | &:last-child { 5 | margin-bottom: 0; 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/icon-list-action.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/icon-list-action.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/icon-list-basic.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/icon-list-basic.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/icon-list-layout.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/icon-list-layout.png -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/calendar/common/constant.ts: -------------------------------------------------------------------------------- 1 | export const TYPE_PRE_MONTH = -1 2 | 3 | export const TYPE_NOW_MONTH = 0 4 | 5 | export const TYPE_NEXT_MONTH = 1 6 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.build", 3 | "compilerOptions": { 4 | "baseUrl": ".", 5 | "experimentalDecorators": true 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/verification_code.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/verification_code.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/navigation/pagination/index.scss: -------------------------------------------------------------------------------- 1 | 2 | .btn-item { 3 | margin-top: 30px; 4 | color: #666; 5 | font-size: 24px; 6 | text-align: center; 7 | } 8 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/assets/images/icon-list-navigation.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/psaren/taro-ui-vue/HEAD/packages/taro-ui-vue-demo/src/assets/images/icon-list-navigation.png -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/picker-view/index.scss: -------------------------------------------------------------------------------- 1 | .example-item { 2 | .title-date { 3 | margin: 40px 0 20px; 4 | text-align: center; 5 | font-size: 36px; 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/navigation/navbar/index.scss: -------------------------------------------------------------------------------- 1 | .example__body { 2 | background-color: #f8f8f8; 3 | min-height: 100px; 4 | 5 | .item { 6 | margin-bottom: 10px; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/view/avatar/index.scss: -------------------------------------------------------------------------------- 1 | .panel__content { 2 | .example-item { 3 | .subitem { 4 | margin-left: 32px; 5 | vertical-align: middle; 6 | } 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/navigation/segmented-control/index.scss: -------------------------------------------------------------------------------- 1 | .tab-content { 2 | padding: 100px 50px; 3 | font-size: 30px; 4 | text-align: center; 5 | background-color: #FAFBFC; 6 | } 7 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/mixins/setStateMixin.ts: -------------------------------------------------------------------------------- 1 | import assign from 'lodash/assign' 2 | export default { 3 | methods: { 4 | setState(state) { 5 | assign(this.state, state) 6 | } 7 | } 8 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/form/index.scss: -------------------------------------------------------------------------------- 1 | .component-item { 2 | &__btn-group { 3 | padding: 0 20px; 4 | 5 | &__btn-item { 6 | margin-bottom: 20px; 7 | } 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/view/divider/index.scss: -------------------------------------------------------------------------------- 1 | .panel__content { 2 | .bar-item { 3 | margin-bottom: 20px; 4 | 5 | &:last-child { 6 | margin-bottom: 0; 7 | } 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/config/dev.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | mode: 'development', 3 | env: { 4 | NODE_ENV: '"development"', 5 | }, 6 | defineConstants: {}, 7 | mini: {}, 8 | h5: {}, 9 | } 10 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/view/load-more/index.scss: -------------------------------------------------------------------------------- 1 | .panel__content { 2 | .bar-item { 3 | margin-bottom: 20px; 4 | 5 | &:last-child { 6 | margin-bottom: 0; 7 | } 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/view/noticebar/index.scss: -------------------------------------------------------------------------------- 1 | .panel__content { 2 | .bar-item { 3 | margin-bottom: 20px; 4 | 5 | &:last-child { 6 | margin-bottom: 0; 7 | } 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/config/copy.js: -------------------------------------------------------------------------------- 1 | const copydir = require('copy-dir') 2 | const path = require('path') 3 | copydir(path.resolve(__dirname, '../src/style'), path.resolve(__dirname, '../dist/style'), { 4 | cover: true, 5 | }) 6 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/active.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * 点击态 3 | */ 4 | @mixin active { 5 | transition: background-color 0.3s; 6 | 7 | &:active { 8 | background-color: $color-grey-5; 9 | } 10 | } 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.build", 3 | "compilerOptions": { 4 | "baseUrl": ".", 5 | "paths": { 6 | "@/taro-ui-vue/*": ["../taro-ui-vue/*"] 7 | } 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/list/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 10 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | dist/ 2 | deploy_versions/ 3 | .temp/ 4 | .rn_temp/ 5 | node_modules/ 6 | .DS_Store 7 | .vscode/ 8 | 9 | # Rollup visualizer file 10 | stats.html 11 | 12 | # Build outputs 13 | bundle 14 | lib 15 | # test 16 | tests/coverage 17 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/absolute-center.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * 元素居中定位 3 | */ 4 | @mixin absolute-center($pos: absolute) { 5 | position: $pos; 6 | top: 50%; 7 | left: 50%; 8 | transform: translate(-50%, -50%); 9 | } 10 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/.gitignore: -------------------------------------------------------------------------------- 1 | dist/ 2 | deploy_versions/ 3 | .temp/ 4 | .rn_temp/ 5 | node_modules/ 6 | .DS_Store 7 | .vscode/ 8 | 9 | # Rollup visualizer file 10 | stats.html 11 | 12 | # Build outputs 13 | bundle 14 | lib 15 | taro-ui-vue -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/.gitignore: -------------------------------------------------------------------------------- 1 | dist/ 2 | deploy_versions/ 3 | .temp/ 4 | .rn_temp/ 5 | node_modules/ 6 | .DS_Store 7 | .vscode/ 8 | 9 | # Rollup visualizer file 10 | stats.html 11 | 12 | # Build outputs 13 | bundle 14 | lib 15 | taro-ui-vue -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/README.md: -------------------------------------------------------------------------------- 1 | # 测试目录结构 2 | 3 | ``` 4 | tests 5 | ├── components // 由 transform-component.js 转换而来 不应直接修改 6 | ├── coverrage // 测试覆盖率目录 7 | ├── unit // 测试代码目录 8 | ├── utils // 由 transform-component.js 转换而来 不应直接修改 9 | 10 | ``` -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Fab/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import FabDoc from '@md/fab.md' 3 | 4 | class FabView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default FabView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Tag/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import TagDoc from '@md/tag.md' 3 | 4 | class TagView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default TagView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Form/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import FormDoc from '@md/form.md' 3 | 4 | class FormView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default FormView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Icon/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import IconDoc from '@md/icon.md' 3 | 4 | class IconView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default IconView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/List/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ListDoc from '@md/list.md' 3 | 4 | class ListView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ListView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Rate/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import RateDoc from '@md/rate.md' 3 | 4 | class RateView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default RateView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Tabs/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import TabsDoc from '@md/tabs.md' 3 | 4 | class TabsView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default TabsView 11 | -------------------------------------------------------------------------------- /.editorconfig: -------------------------------------------------------------------------------- 1 | # http://editorconfig.org 2 | root = true 3 | 4 | [*] 5 | indent_style = space 6 | indent_size = 2 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | 11 | [*.md] 12 | trim_trailing_whitespace = false 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Badge/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import BadgeDoc from '@md/badge.md' 3 | 4 | class BadgeView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default BadgeView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Card/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import CardDoc from '@md/card.md' 3 | 4 | class ButtonView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ButtonView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Flex/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import FlexDoc from '@md/flex.md' 3 | 4 | class ButtonView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ButtonView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Grid/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import GridDoc from '@md/grid.md' 3 | 4 | class ButtonView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ButtonView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Input/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import InputDoc from '@md/input.md' 3 | 4 | class InputView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default InputView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Modal/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ModalDoc from '@md/modal.md' 3 | 4 | class ModalView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ModalView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Radio/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import RadioDoc from '@md/radio.md' 3 | 4 | class RadioView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default RadioView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Range/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import RangeDoc from '@md/range.md' 3 | 4 | class RangeView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default RangeView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Steps/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import StepsDoc from '@md/steps.md' 3 | 4 | class StepsView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default StepsView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Toast/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ToastDoc from '@md/toast.md' 3 | 4 | class ToastView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ToastView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/.gitignore: -------------------------------------------------------------------------------- 1 | dist/ 2 | deploy_versions/ 3 | .temp/ 4 | .rn_temp/ 5 | node_modules/ 6 | .DS_Store 7 | .vscode/ 8 | 9 | # Rollup visualizer file 10 | stats.html 11 | 12 | # Build outputs 13 | bundle 14 | lib 15 | # test 16 | tests/coverage 17 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/navigation/indexes/index.scss: -------------------------------------------------------------------------------- 1 | .example-item { 2 | color: #333; 3 | font-size: 28px; 4 | } 5 | 6 | .custom-area { 7 | padding: 80px 20px; 8 | font-size: 28px; 9 | text-align: center; 10 | background: #FCFCFC; 11 | } 12 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Avatar/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import AvatarDoc from '@md/avatar.md' 3 | 4 | class AvatarView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default AvatarView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Button/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ButtonDoc from '@md/button.md' 3 | 4 | class ButtonView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ButtonView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Drawer/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import DrawerDoc from '@md/drawer.md' 3 | 4 | class DrawerView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default DrawerView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/NavBar/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import NavBarDoc from '@md/navbar.md' 3 | 4 | class NavBarView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default NavBarView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Picker/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import PickerDoc from '@md/picker.md' 3 | 4 | class PickerView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default PickerView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Slider/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import SliderDoc from '@md/slider.md' 3 | 4 | class SliderView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default SliderView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Swiper/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import SwiperDoc from '@md/swiper.md' 3 | 4 | class SwiperView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default SwiperView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Switch/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import SwitchDoc from '@md/switch.md' 3 | 4 | class SwitchView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default SwitchView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/TabBar/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import TabBarDoc from '@md/tabbar.md' 3 | 4 | class TabBarView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default TabBarView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/overlay.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * 通用的遮罩 3 | */ 4 | @mixin overlay { 5 | top: 0; 6 | left: 0; 7 | width: 100%; 8 | height: 100%; 9 | position: absolute; 10 | background-color: rgba($color: #000, $alpha: 0.3); 11 | } 12 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Article/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ArticleDoc from '@md/article.md' 3 | 4 | class ArticleView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ArticleView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Curtain/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import CurtainDoc from '@md/curtain.md' 3 | 4 | class CurtainView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default CurtainView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Divider/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import DividerDoc from '@md/divider.md' 3 | 4 | class DividerView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default DividerView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Indexes/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import IndexesDoc from '@md/indexes.md' 3 | 4 | class IndexesView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default IndexesView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Message/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import MessageDoc from '@md/message.md' 3 | 4 | class MessageView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default MessageView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Resource/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ResourceDoc from '@md/resource.md' 3 | 4 | class Resource extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default Resource 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/utils/common.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: pengyue 3 | * @Date: 2020-07-06 21:43:33 4 | * @LastEditTime: 2020-07-07 01:58:28 5 | * @LastEditors: pengyue 6 | * @Description: 7 | * @FilePath: /taro-ui-vue/packages/taro-ui-vue-demo/src/utils/common.ts 8 | */ 9 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/config/rollup.config.analyze.js: -------------------------------------------------------------------------------- 1 | import RollupVisualizer from 'rollup-plugin-visualizer' 2 | import defaultConfig from './rollup.config' 3 | 4 | export default Object.assign({}, defaultConfig, { 5 | plugins: [...defaultConfig.plugins, RollupVisualizer()] 6 | }) 7 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/placeholder.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * 设置placeholder 颜色 3 | */ 4 | @mixin placeholder($color: $color-grey-3) { 5 | @at-root .placeholder { 6 | color: $color; 7 | } 8 | 9 | &::placeholder { 10 | color: $color; 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Calendar/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import CalendarDoc from '@md/calendar.md' 3 | 4 | class CalendarView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default CalendarView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Checkbox/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import CheckboxDoc from '@md/checkbox.md' 3 | 4 | class CheckboxView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default CheckboxView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/LoadMore/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import LoadMoreDoc from '@md/load-more.md' 3 | 4 | class LoadMoreView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default LoadMoreView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Progress/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ProgressDoc from '@md/progress.md' 3 | 4 | class ProgressView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ProgressView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Questions/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import QuestionDoc from '@md/questions.md' 3 | 4 | class QuestionsView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default QuestionsView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Textarea/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import TextareaDoc from '@md/textarea.md' 3 | 4 | class TextareaView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default TextareaView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Timeline/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import TimelineDoc from '@md/timeline.md' 3 | 4 | class TimelineView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default TimelineView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/index.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * Taro UI - Default variables 3 | */ 4 | 5 | /* Variables */ 6 | @import './variables/default.scss'; 7 | 8 | /* Mixin */ 9 | @import './mixins/index.scss'; 10 | 11 | /* Components */ 12 | @import './components/index.scss'; 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Accordion/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import AccordionDoc from '@md/accordion.md' 3 | 4 | class AccordionView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default AccordionView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Countdown/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import CountdownDoc from '@md/countdown.md' 3 | 4 | class CountdownView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default CountdownView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Noticebar/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import NoticebarDoc from '@md/noticebar.md' 3 | 4 | class NoticebarView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default NoticebarView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/SearchBar/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import SearchBarDoc from '@md/search-bar.md' 3 | 4 | class SearchBarView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default SearchBarView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/tag/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Pagination/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import PaginationDoc from '@md/pagination.md' 3 | 4 | class PaginationView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default PaginationView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Quickstart/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import QuickStartDoc from '@md/quickstart.md' 3 | 4 | class QuickStartView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default QuickStartView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/ActionSheet/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ActionSheetDoc from '@md/action-sheet.md' 3 | 4 | class ActionSheetView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ActionSheetView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Color/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ColorDoc from '@md/color.md' 3 | 4 | import './style.scss' 5 | 6 | class ColorView extends React.Component { 7 | render() { 8 | return 9 | } 10 | } 11 | 12 | export default ColorView 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/FloatLayout/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import FloatLayoutDoc from '@md/float-layout.md' 3 | 4 | class FloatLayoutView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default FloatLayoutView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/ImagePicker/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ImagePickerDoc from '@md/image-picker.md' 3 | 4 | class ImagePickerView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ImagePickerView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/InputNumber/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import InputNumberDoc from '@md/input-number.md' 3 | 4 | class InputNumberView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default InputNumberView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/SwipeAction/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import SwipeActionDoc from '@md/swipe-action.md' 3 | 4 | class SwipeActionView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default SwipeActionView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/form.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | $at-form-bg-color: $color-bg; 5 | 6 | .at-form { 7 | display: block; 8 | background-color: $at-form-bg-color; 9 | @include hairline-top-bottom(); 10 | } 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Introduction/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import IntroductionDoc from '@md/introduction.md' 3 | 4 | class IntroductionView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default IntroductionView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/icon.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEventFunction } from '@tarojs/components/types/common' 3 | 4 | import AtComponent, { AtIconBaseProps } from './base' 5 | 6 | export interface AtIconProps extends AtComponent, AtIconBaseProps { 7 | onClick?: CommonEventFunction 8 | } 9 | 10 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/view/badge/index.scss: -------------------------------------------------------------------------------- 1 | .panel__content { 2 | .badge-item { 3 | margin-bottom: 20px; 4 | 5 | &:last-child { 6 | margin-bottom: 0; 7 | } 8 | 9 | .subitem { 10 | display: inline-block; 11 | margin-left: 40px; 12 | } 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Changelog/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ChangelogDoc from '@md/changelog.md' 3 | import './index.scss' 4 | 5 | class ChangelogView extends React.Component { 6 | render() { 7 | return 8 | } 9 | } 10 | 11 | export default ChangelogView 12 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/CustomizeTheme/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import CustomizeThemeDoc from '@md/customize-theme.md' 3 | 4 | class CustomizeThemeView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default CustomizeThemeView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/action/progress/index.scss: -------------------------------------------------------------------------------- 1 | .progress-page .example-item { 2 | &__buttons { 3 | margin-top: 20px; 4 | 5 | .btn { 6 | display: inline-block; 7 | margin-left: 12px; 8 | 9 | &:first-child { 10 | margin-left: 0; 11 | } 12 | } 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/SegmentedControl/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import SegmentedControlDoc from '@md/segmented-control.md' 3 | 4 | class SegmentedControlView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default SegmentedControlView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/swipe-action/options/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/alignhack.scss: -------------------------------------------------------------------------------- 1 | // 修复小元素文本垂直居中 2 | @mixin alignhack($position: before, $margintop: 1px) { 3 | &::#{$position} { 4 | content: ''; 5 | display: inline-block; 6 | vertical-align: middle; 7 | width: 0; 8 | height: 100%; 9 | margin-top: $margintop; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/ActivityIndicator/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ActivityIndicatorDoc from '@md/activity-indicator.md' 3 | 4 | class ActivityIndicatorView extends React.Component { 5 | render() { 6 | return 7 | } 8 | } 9 | 10 | export default ActivityIndicatorView 11 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/__snapshots__/form.spec.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`AtForm Snap render initial AtForm 1`] = ` 4 |
7 | `; 8 | 9 | exports[`AtForm Snap render initial AtForm 2`] = ` 10 | 14 | `; 15 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/index/index.config.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: pengyue 3 | * @Date: 2020-07-03 21:34:49 4 | * @LastEditTime: 2020-07-05 14:08:33 5 | * @LastEditors: pengyue 6 | * @Description: 7 | * @FilePath: /taro-ui-vue/src/pages/index/index.config.ts 8 | */ 9 | 10 | export default { 11 | navigationBarTitleText: '首页', 12 | } 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/panel/index.config.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: pengyue 3 | * @Date: 2020-07-03 21:34:49 4 | * @LastEditTime: 2020-07-05 15:16:29 5 | * @LastEditors: pengyue 6 | * @Description: 7 | * @FilePath: /taro-ui-vue/src/pages/panel/index.config.ts 8 | */ 9 | 10 | export default { 11 | navigationBarTitleText: 'Taro UI', 12 | } 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Button/style.scss: -------------------------------------------------------------------------------- 1 | // .row { 2 | // .at-btn + .at-btn { 3 | // margin-left: 8px; 4 | // } 5 | 6 | // & + .row { 7 | // margin-top: 8px; 8 | // } 9 | // .at-btn-group .at-btn { 10 | // margin-left: 0; 11 | // } 12 | // } 13 | // .at-btn-group { 14 | // margin-left: 8px; 15 | // margin-top: 16px; 16 | // } 17 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/babel.config.js: -------------------------------------------------------------------------------- 1 | // babel-preset-taro 更多选项和默认值： 2 | // https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md 3 | module.exports = { 4 | presets: [ 5 | '@vue/babel-preset-jsx', 6 | [ 7 | 'taro', 8 | { 9 | framework: 'vue', 10 | ts: true, 11 | }, 12 | ], 13 | ], 14 | } 15 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/line.scss: -------------------------------------------------------------------------------- 1 | @mixin line($num: 1) { 2 | overflow: hidden; 3 | text-overflow: ellipsis; 4 | 5 | @if ($num == 1) { 6 | white-space: nowrap; 7 | } @else { 8 | display: -webkit-box; 9 | -webkit-line-clamp: $num; 10 | 11 | /* autoprefixer: off */ 12 | -webkit-box-orient: vertical; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/babel.config.js: -------------------------------------------------------------------------------- 1 | // babel-preset-taro 更多选项和默认值： 2 | // https://github.com/NervJS/taro/blob/next/packages/babel-preset-taro/README.md 3 | module.exports = { 4 | presets: [ 5 | '@vue/babel-preset-jsx', 6 | [ 7 | 'taro', 8 | { 9 | framework: 'vue', 10 | ts: true, 11 | }, 12 | ], 13 | ], 14 | } 15 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/basic/color/index.config.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: pengyue 3 | * @Date: 2020-07-03 21:34:49 4 | * @LastEditTime: 2020-07-05 15:16:29 5 | * @LastEditors: pengyue 6 | * @Description: 7 | * @FilePath: /taro-ui-vue/src/pages/panel/index.config.ts 8 | */ 9 | 10 | export default { 11 | navigationBarTitleText: 'Taro UI Vue', 12 | } 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/icon/index.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 14 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/badge.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import AtComponent from './base' 3 | 4 | export interface AtBadgeProps extends AtComponent { 5 | /** 6 | * 角标红点 7 | * @default false 8 | */ 9 | dot?: boolean 10 | /** 11 | * 角标内容 12 | */ 13 | value?: string | number 14 | /** 15 | * 角标最大值 16 | * @default 99 17 | */ 18 | maxValue?: number 19 | } 20 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/basic/button/index.config.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: pengyue 3 | * @Date: 2020-07-03 21:34:49 4 | * @LastEditTime: 2020-07-11 14:56:54 5 | * @LastEditors: pengyue 6 | * @Description: 7 | * @FilePath: /taro-ui-vue/packages/taro-ui-vue-demo/src/pages/basic/icon/index.config.ts 8 | */ 9 | 10 | export default { 11 | navigationBarTitleText: 'Taro UI Vue', 12 | } 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/basic/icon/index.config.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: pengyue 3 | * @Date: 2020-07-03 21:34:49 4 | * @LastEditTime: 2020-07-11 14:56:54 5 | * @LastEditors: pengyue 6 | * @Description: 7 | * @FilePath: /taro-ui-vue/packages/taro-ui-vue-demo/src/pages/basic/icon/index.config.ts 8 | */ 9 | 10 | export default { 11 | navigationBarTitleText: 'Taro UI Vue', 12 | } 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/basic/typo/index.config.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: pengyue 3 | * @Date: 2020-07-03 21:34:49 4 | * @LastEditTime: 2020-07-11 14:57:02 5 | * @LastEditors: pengyue 6 | * @Description: 7 | * @FilePath: /taro-ui-vue/packages/taro-ui-vue-demo/src/pages/basic/typo/index.config.ts 8 | */ 9 | 10 | export default { 11 | navigationBarTitleText: 'Taro UI Vue', 12 | } 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/navigation/tabs/index.scss: -------------------------------------------------------------------------------- 1 | .tab-content { 2 | padding: 100px 50px; 3 | font-size: 30px; 4 | text-align: center; 5 | background-color: #FAFBFC; 6 | } 7 | 8 | .tab-content--vertical { 9 | height: 200PX; 10 | padding: 100PX 50px; 11 | font-size: 30px; 12 | text-align: center; 13 | box-sizing: border-box; 14 | background-color: #FAFBFC; 15 | } 16 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/fab.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEventFunction } from '@tarojs/components/types/common' 3 | 4 | 5 | import AtComponent from './base' 6 | 7 | export interface AtFabProps extends AtComponent { 8 | /** 9 | * 大小尺寸 10 | * @default 'normal' 11 | */ 12 | size?: 'normal' | 'small' 13 | /** 14 | * 点击标签时触发 15 | */ 16 | onClick?: CommonEventFunction 17 | } 18 | -------------------------------------------------------------------------------- /lerna.json: -------------------------------------------------------------------------------- 1 | { 2 | "packages": [ 3 | "packages/taro-ui-vue" 4 | ], 5 | "command": { 6 | "publish": { 7 | "message": "chore(release): publish %s" 8 | }, 9 | "create": { 10 | "homepage": "https://github.com/psaren/taro-ui-vue", 11 | "license": "MIT" 12 | } 13 | }, 14 | "version": "1.0.0-beta.16", 15 | "npmClient": "yarn", 16 | "useWorkspaces": true 17 | } 18 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/action/swipe-action/index.scss: -------------------------------------------------------------------------------- 1 | .swipe-action-page { 2 | .panel__controller { 3 | text-align: center; 4 | } 5 | 6 | .normal { 7 | padding: 0 24px; 8 | line-height: 88px; 9 | } 10 | 11 | .example-item--border { 12 | /* prettier-ignore */ 13 | border: 1PX solid #e2ecf4; 14 | border-left: none; 15 | border-right: none; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/fab/index.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 19 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/clearfix.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * @example scss 3 | * 4 | * .element { 5 | * @include clearfix; 6 | * } 7 | * 8 | * // CSS Output 9 | * .element::after { 10 | * clear: both; 11 | * content: ''; 12 | * display: block; 13 | * } 14 | */ 15 | @mixin clearfix { 16 | &::after { 17 | clear: both; 18 | content: ''; 19 | display: block; 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/checkbox.d.ts: -------------------------------------------------------------------------------- 1 | import AtComponent from './base' 2 | 3 | export interface CheckboxOption { 4 | value: T 5 | label: string 6 | desc?: string 7 | disabled?: boolean 8 | } 9 | 10 | export interface AtCheckboxProps extends AtComponent { 11 | options: Array> 12 | 13 | selectedList: Array 14 | 15 | onChange: (selectedList: Array) => void 16 | } 17 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/navigation/tabbar/index.scss: -------------------------------------------------------------------------------- 1 | .example__body { 2 | background-color: #f8f8f8; 3 | min-height: 100px; 4 | padding: 30px 10px 80px; 5 | 6 | .item { 7 | margin-bottom: 10px; 8 | } 9 | 10 | .tab-content { 11 | font-size: 25px; 12 | padding: 20px; 13 | text-align: center; 14 | border-top: 2px solid #f8f8f8; 15 | background-color: #fff; 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/lib/animations/collapseanimations.scss: -------------------------------------------------------------------------------- 1 | .collapse-exited { 2 | display: none; 3 | } 4 | .collapse-exiting { 5 | height: 0!important; 6 | } 7 | .collapse-enter { 8 | height: 0 9 | } 10 | .collapse-entered { 11 | height: 53px!important; 12 | } 13 | .collapse-entering { 14 | height: 53px!important; 15 | } 16 | .collapse { 17 | overflow: hidden; 18 | transition: height 0.3s ease-in-out; 19 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue/README.md: -------------------------------------------------------------------------------- 1 | ## 项目背景 2 | `tarojs` 已经开始支持 `vue` 去写 taro 应用了，由于缺少相关的 ui 库，因此决定 按照 taro-ui 重写成 `vue` 组件。 3 | 形成了 `taro-ui-vue` 这个库。 4 | 5 | ## 相关链接 6 | [Taro Ui Vue 使用文档](http://taro-ui-vue.fontend.com/) 7 | [Taro](https://github.com/NervJS/taro) 8 | [Taro Ui](https://github.com/NervJS/taro-ui) 9 | 10 | ## 使用注意 11 | Taro Ui Vue 提供的是源文件，源文件部分代码使用 `ts` 编写，需要项目支持 ts。 12 | 如果是用 `taro init` 命令创建，则需在使用时选择 `ts` 。 -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/basic/icon/index.scss: -------------------------------------------------------------------------------- 1 | .icon-list { 2 | display: flex; 3 | justify-content: flex-start; 4 | align-items: flex-start; 5 | flex-wrap: wrap; 6 | 7 | &__item { 8 | margin-bottom: 30px; 9 | width: 25%; 10 | text-align: center; 11 | } 12 | 13 | &__name { 14 | margin-top: 20px; 15 | color: #88889C; 16 | font-size: 20px; 17 | text-align: center; 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/config/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig", 3 | "compilerOptions": { 4 | "skipLibCheck": true, 5 | "target": "es2017", 6 | "module": "es6", 7 | "baseUrl": "../", 8 | "outDir": "../lib" 9 | }, 10 | "include": [ 11 | "../src/utils/*", 12 | "../src/components/*", 13 | "../src/index.ts" 14 | ], 15 | "exclude": [ 16 | "../node_modules/*" 17 | ] 18 | } 19 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/assets/style/mixin.scss: -------------------------------------------------------------------------------- 1 | @mixin image2x-background($name, $full-size: false) { 2 | $img-path: '../assets/' + $name + '.png'; 3 | $img2x-path: '../assets/' + $name + '@2x.png'; 4 | 5 | background-image: url($img-path); 6 | background-image: -webkit-image-set(url($img-path) 1x, url($img2x-path) 2x); 7 | background-repeat: no-repeat; 8 | 9 | @if $full-size { 10 | background-size: 100% auto; 11 | } 12 | } 13 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/avatar/index.vue: -------------------------------------------------------------------------------- 1 | 10 | 14 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/config/tsconfig.rollup.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./tsconfig.build", 3 | "compilerOptions": { 4 | "skipLibCheck": true, 5 | "target": "es5", 6 | "module": "es6", 7 | "downlevelIteration": true, 8 | "baseUrl": "../", 9 | "types": ["node"] 10 | }, 11 | "include": [ 12 | "../src/utils/*", 13 | "../src/components/*", 14 | "../src/index.ts" 15 | ], 16 | "exclude": [ 17 | "../node_modules/*" 18 | ] 19 | } 20 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/badge/index.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 17 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/curtain/index.vue: -------------------------------------------------------------------------------- 1 | 11 | 15 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/config/prod.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | mode: 'production', 3 | env: { 4 | NODE_ENV: '"production"', 5 | }, 6 | defineConstants: {}, 7 | mini: {}, 8 | h5: { 9 | /** 10 | * 如果h5端编译后体积过大，可以使用webpack-bundle-analyzer插件对打包体积进行分析。 11 | * 参考代码如下： 12 | * webpackChain (chain) { 13 | * chain.plugin('analyzer') 14 | * .use(require('webpack-bundle-analyzer').BundleAnalyzerPlugin, []) 15 | * } 16 | */ 17 | }, 18 | } 19 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/tabs-pane.d.ts: -------------------------------------------------------------------------------- 1 | 2 | 3 | import AtComponent from './base' 4 | 5 | export interface AtTabsPaneProps extends AtComponent { 6 | /** 7 | * Tab 方向，请跟 AtTabs 保持一致 8 | * @default 'horizontal' 9 | */ 10 | tabDirection?: 'horizontal' | 'vertical' 11 | /** 12 | * 当前选中的标签索引值，从 0 计数，请跟 AtTabs 保持一致 13 | * @default 0 14 | */ 15 | current: number 16 | /** 17 | * tabPane 排序，从 0 计数 18 | * @default 0 19 | */ 20 | index: number 21 | } 22 | 23 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/index.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * Mixins 3 | */ 4 | 5 | /* library */ 6 | @import './libs/absolute-center'; 7 | @import './libs/clearfix'; 8 | @import './libs/line'; 9 | @import './libs/overlay'; 10 | @import './libs/shade'; 11 | @import './libs/tint'; 12 | @import './libs/flex'; 13 | @import './libs/border'; 14 | @import './libs/active'; 15 | @import './libs/disabled'; 16 | @import './libs/placeholder'; 17 | @import './libs/alignhack'; 18 | @import './libs/hairline'; 19 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/calendar.spec.js: -------------------------------------------------------------------------------- 1 | import { mount } from '@vue/test-utils' 2 | import { AtCalendar } from '../dist/index.esm' 3 | 4 | const factory = (values = {}, slots = { default: [] }) => { 5 | return mount(AtCalendar, { 6 | slots, 7 | propsData: { ...values }, 8 | }) 9 | } 10 | 11 | describe('AtCalendar Snap', () => { 12 | it('render initial AtCalendar', () => { 13 | const wrapper = factory() 14 | expect(wrapper.element).toMatchSnapshot() 15 | }) 16 | }) 17 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/view/swiper/index.scss: -------------------------------------------------------------------------------- 1 | .example-item { 2 | .control-cnt { 3 | margin-top: 40px; 4 | } 5 | 6 | .slider-list { 7 | margin-top: 80px; 8 | 9 | &__item { 10 | margin-bottom: 40px; 11 | 12 | &-header { 13 | margin-bottom: 16px; 14 | color: #999; 15 | font-size: 28px; 16 | text-align: center; 17 | } 18 | } 19 | } 20 | 21 | .slide-image { 22 | width: 100%; 23 | height: 360px; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "taro-ui-vue", 3 | "workspaces": { 4 | "packages": [ 5 | "packages/*" 6 | ] 7 | }, 8 | "scripts": { 9 | "publish": "lerna publish --conventional-commits" 10 | }, 11 | "devDependencies": { 12 | "@babel/core": "^7.10.4", 13 | "@babel/plugin-proposal-class-properties": "^7.10.4", 14 | "@babel/plugin-syntax-dynamic-import": "^7.8.3", 15 | "@babel/preset-env": "^7.10.4", 16 | "@babel/preset-react": "^7.10.4", 17 | "lerna": "^3.22.1" 18 | } 19 | } 20 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/modal/header/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 24 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/divider/index.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 19 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/modal/content/index.vue: -------------------------------------------------------------------------------- 1 | 6 | 23 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/float-button.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEventFunction } from '@tarojs/components/types/common' 3 | 4 | import AtComponent from './base' 5 | 6 | export interface AtFloatButtonProps extends AtComponent { 7 | size?: number 8 | 9 | icon?: string 10 | 11 | onClick?: CommonEventFunction 12 | 13 | onTouchStart?: CommonEventFunction 14 | 15 | onTouchEnd?: CommonEventFunction 16 | 17 | backgroundColor?: string 18 | 19 | touchedBackgroundColor?: string 20 | 21 | borderColor?: string 22 | } 23 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/action-sheet/components/body.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 24 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/message/index.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 24 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/base.d.ts: -------------------------------------------------------------------------------- 1 | import { CSSProperties } from '../global' 2 | 3 | export interface AtComponent { 4 | className?: string; 5 | 6 | customStyle?: string | CSSProperties; 7 | } 8 | 9 | export interface AtIconBaseProps2 extends AtComponent { 10 | value: string; 11 | 12 | color?: string; 13 | } 14 | 15 | export interface AtIconBaseProps extends AtComponent { 16 | value: string; 17 | 18 | color?: string; 19 | 20 | prefixClass?: string; 21 | 22 | size?: number | string; 23 | } 24 | 25 | export default AtComponent 26 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | # To get started with Dependabot version updates, you'll need to specify which 2 | # package ecosystems to update and where the package manifests are located. 3 | # Please see the documentation for all configuration options: 4 | # https://help.github.com/github/administering-a-repository/configuration-options-for-dependency-updates 5 | 6 | version: 2 7 | updates: 8 | - package-ecosystem: "" # See documentation for possible values 9 | directory: "/" # Location of package manifests 10 | schedule: 11 | interval: "daily" 12 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/activity-indicator.d.ts: -------------------------------------------------------------------------------- 1 | import AtComponent from './base' 2 | 3 | export interface AtActivityIndicatorProps extends AtComponent { 4 | /** 5 | * loading 图的大小 6 | * @default 24 7 | */ 8 | size?: number 9 | /** 10 | * 元素的类型 11 | */ 12 | mode?: 'center' | 'normal' 13 | /** 14 | * loading 图的颜色 15 | * @default #6190E8 16 | */ 17 | color?: string 18 | /** 19 | * 元素的内容文本 20 | */ 21 | content?: string 22 | /** 23 | * 控制元素显示隐藏 24 | * @default true 25 | */ 26 | isOpened?: boolean 27 | } 28 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/action-sheet/components/header.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 25 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/__snapshots__/fab.spec.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`AtFab Snap render AtFab -- default props 1`] = ` 4 | 7 | 按钮 8 | 9 | `; 10 | 11 | exports[`AtFab Snap render AtFab -- props className 1`] = ` 12 | 15 | 按钮 16 | 17 | `; 18 | 19 | exports[`AtFab Snap render AtFab -- props size small 1`] = ` 20 | 23 | 按钮 24 | 25 | `; 26 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/mixins.ts: -------------------------------------------------------------------------------- 1 | interface StateInterFace { 2 | [id: string]: any 3 | } 4 | 5 | export default { 6 | methods: { 7 | setState(newState: StateInterFace, fn?: Function) { 8 | const ks = Object.keys(newState) 9 | if (Array.isArray(ks)) { 10 | ks.forEach((k) => { 11 | if (k in this.state) { 12 | this.state[k] = newState[k] 13 | } 14 | }) 15 | } 16 | this.$nextTick(() => { 17 | typeof fn === 'function' && fn.call(this) 18 | }) 19 | }, 20 | }, 21 | } 22 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/slider.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | .at-slider { 5 | display: flex; 6 | align-items: center; 7 | 8 | /* elements */ 9 | &__inner { 10 | flex: 1; 11 | } 12 | 13 | &__text { 14 | width: 80px; 15 | color: $at-slider-text-color; 16 | font-size: $at-slider-text-size; 17 | text-align: center; 18 | } 19 | 20 | /* modifiers */ 21 | &--disabled { 22 | .at-slider__inner { 23 | opacity: $opacity-disabled; 24 | } 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/switch/index.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 20 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/config/fix-build-h5.js: -------------------------------------------------------------------------------- 1 | // require('@tarojs/components/dist-h5/vue') 2 | // import '@tarojs/components/dist-h5/vue' 3 | const { resolve } = require('path'); 4 | const fs = require('fs'); 5 | const utilsJsPath = resolve(__dirname, '../node_modules/@tarojs/taro-loader/lib/utils.js') 6 | 7 | let content = fs.readFileSync( 8 | utilsJsPath, 9 | { encoding: 'utf8'} 10 | ); 11 | content = content.replace(`import '@tarojs/components/dist-h5/vue'`, `require('@tarojs/components/dist-h5/vue')`) 12 | 13 | fs.writeFileSync(utilsJsPath, content, { encoding: 'utf8' }) 14 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/build/build-static.js: -------------------------------------------------------------------------------- 1 | const ora = require('ora') 2 | const fs = require('fs-extra') 3 | const path = require('path') 4 | 5 | const spinner = ora('Copy h5 website to docs...') 6 | 7 | spinner.start() 8 | 9 | // packages/taro-ui-docs/dist/h5 10 | fs.emptyDirSync(path.resolve(__dirname, '../dist/h5')) 11 | 12 | fs.copy( 13 | // packages/taro-ui-demo/dist 14 | path.resolve(__dirname, '../../taro-ui-demo/dist'), 15 | path.resolve(__dirname, '../dist/h5') 16 | ) 17 | .then(() => { 18 | spinner.stop() 19 | }) 20 | .catch((err) => console.error(err)) 21 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/shade.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * Mixes a color with black. It's different from darken() 3 | * 4 | * @param {color} $color 5 | * @param {number (percentage)} $percent [The amount of black to be mixed in] 6 | * @return {color} 7 | * 8 | * @example 9 | * .element { 10 | * background-color: shade(#ffbb52, 60%); 11 | * } 12 | * 13 | * // CSS Output 14 | * .element { 15 | * background-color: #664a20; 16 | * } 17 | */ 18 | @function shade( 19 | $color, 20 | $percent 21 | ) { 22 | @return mix(#000, $color, $percent); 23 | } 24 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/tint.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * Mixes a color with white. It's different from lighten() 3 | * 4 | * @param {color} $color 5 | * @param {number (percentage)} $percent [The amout of white to be mixed in] 6 | * @return {color} 7 | * 8 | * @example 9 | * .element { 10 | * background-color: tint(#6ecaa6 , 40%); 11 | * } 12 | * 13 | * // CSS Output 14 | * .element { 15 | * background-color: #a8dfc9; 16 | * } 17 | */ 18 | @function tint( 19 | $color, 20 | $percent 21 | ) { 22 | @return mix(#FFF, $color, $percent); 23 | } 24 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/layout/flex/index.scss: -------------------------------------------------------------------------------- 1 | @import "taro-ui-vue/style/variables/default.scss"; 2 | @import 'taro-ui-vue/style/components/flex.scss'; 3 | 4 | .flex-page .at-row { 5 | margin-bottom: 40px; 6 | 7 | .at-col { 8 | padding: $spacing-v-md $spacing-h-md; 9 | color: $color-white; 10 | font-size: $font-size-base; 11 | text-align: center; 12 | 13 | &:nth-child(odd) { 14 | background-color: $color-brand-light; 15 | } 16 | 17 | &:nth-child(even) { 18 | background-color: tint($color-brand-light, 20%); 19 | } 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/divider.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import AtComponent from './base' 3 | 4 | export interface AtDividerProps extends AtComponent { 5 | /** 6 | * 分隔符文字 7 | */ 8 | content?: string 9 | /** 10 | * 分隔符高度，会自动转 rem,rpx 11 | * @default 112 12 | */ 13 | height?: number | string 14 | /** 15 | * 文字颜色 16 | * @default #6190E8 17 | */ 18 | fontColor?: string 19 | /** 20 | * 文字大小，会自动转 rem,rpx 21 | * @default 32 22 | */ 23 | fontSize?: number | string 24 | /** 25 | * 分割线颜色 26 | * @default #CCC 27 | */ 28 | lineColor?: string 29 | } 30 | 31 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/utils/transform.js: -------------------------------------------------------------------------------- 1 | // 格式化 JSX 2 | // 使用时修改 relativePath 3 | const fs = require('fs') 4 | const { resolve } = require('path') 5 | 6 | const relativePath = '../pages/view/timeline/index.vue' 7 | 8 | const encoding = 'utf8' 9 | let content = fs.readFileSync( 10 | resolve(__dirname, relativePath), 11 | { encoding } 12 | ) 13 | 14 | content = content 15 | .replace(/{\/\*/g, '') 17 | .replace(/className=/g, 'class=') 18 | .replace(/View/g, 'view') 19 | 20 | fs.writeFileSync(resolve(__dirname, relativePath), content, { encoding }) 21 | 22 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/list/index.ts: -------------------------------------------------------------------------------- 1 | import classNames from 'classnames' 2 | 3 | const AtList = { 4 | name: 'AtList', 5 | props: { 6 | hasBorder: { 7 | type: Boolean, 8 | default: true, 9 | }, 10 | className: { 11 | type: [Array, String], 12 | default: '', 13 | }, 14 | }, 15 | computed: { 16 | rootClass() { 17 | return classNames( 18 | 'at-list', 19 | { 20 | 'at-list--no-border': !this.hasBorder, 21 | }, 22 | this.className 23 | ) 24 | }, 25 | }, 26 | } 27 | 28 | export default AtList 29 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/tabs-pane/index.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 24 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/load-more.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | .at-load-more { 5 | position: relative; 6 | text-align: center; 7 | display: flex; 8 | justify-content: center; 9 | align-items: center; 10 | width: 100%; 11 | height: $at-load-more-height; 12 | overflow: hidden; 13 | box-sizing: border-box; 14 | 15 | &__cnt { 16 | flex: 1; 17 | } 18 | 19 | &__tip { 20 | text-align: center; 21 | width: 100%; 22 | color: $at-load-more-tips-color; 23 | font-size: $at-load-more-tips-size; 24 | } 25 | } 26 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/store.ts: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | 4 | Vue.use(Vuex) 5 | 6 | const state = { 7 | numbers: [1, 2, 3] 8 | } 9 | 10 | const mutations = { 11 | ADD_NUMBER(state, payload) { 12 | state.numbers.push(payload) 13 | } 14 | } 15 | 16 | const actions = { 17 | addNumber(context, number) { 18 | context.commit('ADD_NUMBER', number) 19 | } 20 | } 21 | 22 | const getters = { 23 | getNumbers(state) { 24 | return state.numbers 25 | } 26 | } 27 | 28 | export default new Vuex.Store({ 29 | state, 30 | mutations, 31 | actions, 32 | getters 33 | }) 34 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/__snapshots__/message.spec.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`AtMessage Snap render AtMessage -- props className 1`] = ` 4 | 7 | `; 8 | 9 | exports[`AtMessage Snap render AtMessage -- props customStyle 1`] = ` 10 | 14 | `; 15 | 16 | exports[`AtMessage Snap render initial AtMessage 1`] = ` 17 | 20 | `; 21 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/fab/index.ts: -------------------------------------------------------------------------------- 1 | import classNames from 'classnames' 2 | 3 | export default { 4 | name: 'AtFab', 5 | props: { 6 | size: { 7 | type: String, 8 | default: 'normal', 9 | validator: (val) => ['normal', 'small'].includes(val), 10 | }, 11 | className: { 12 | type: [Object, String], 13 | default: '', 14 | }, 15 | onClick: { 16 | type: Function, 17 | default: () => () => {}, 18 | }, 19 | }, 20 | methods: { 21 | classNames, 22 | handleTab(event) { 23 | this.onClick && this.onClick(event) 24 | }, 25 | }, 26 | } 27 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/form.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEvent } from '@tarojs/components/types/common' 3 | 4 | declare type FormFunction = (event: CommonEvent) => void 5 | 6 | import AtComponent from './base' 7 | 8 | export interface AtFormProps extends AtComponent { 9 | /** 10 | * 是否返回 formId 用于发送模板消息 11 | * @default false 12 | */ 13 | reportSubmit?: boolean 14 | /** 15 | * 携带 form 中的数据触发 submit 事件，由于小程序组件化的限制，onSubmit 事件获得的 event 中的 event.detail.value 始终为空对象，开发者要获取数据，可以自行在页面的 state 中获取 16 | */ 17 | onSubmit?: FormFunction 18 | /** 19 | * 表单重置时会触发 reset 事件 20 | */ 21 | onReset?: FormFunction 22 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/curtain.d.ts: -------------------------------------------------------------------------------- 1 | import { CommonEventFunction } from '@tarojs/components/types/common' 2 | 3 | import AtComponent from './base' 4 | 5 | export interface AtCurtainProps extends AtComponent { 6 | /** 7 | * 是否开启 8 | * @default false 9 | */ 10 | isOpened?: boolean 11 | /** 12 | * 关闭图标位置 13 | * 'top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right' 14 | * @default 'bottom' 15 | */ 16 | closeBtnPosition?: 'top' | 'top-left' | 'top-right' | 'bottom' | 'bottom-left' | 'bottom-right' 17 | /** 18 | * 点击关闭按钮触发事件 19 | */ 20 | onClose: CommonEventFunction 21 | } 22 | 23 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/switch.d.ts: -------------------------------------------------------------------------------- 1 | 2 | 3 | import AtComponent from './base' 4 | 5 | export interface AtSwitchProps extends AtComponent { 6 | /** 7 | * 标签名 8 | */ 9 | title?: string 10 | /** 11 | * 背景颜色 12 | * @default #6190e8 13 | */ 14 | color?: string 15 | /** 16 | * 是否显示开启 17 | * @default false 18 | */ 19 | checked?: boolean 20 | /** 21 | * 是否禁止点击 22 | * @default false 23 | */ 24 | disabled?: boolean 25 | /** 26 | * 是否显示下划线边框 27 | * @default false 28 | */ 29 | border?: boolean 30 | /** 31 | * 输入框值改变时触发的事件 32 | */ 33 | onChange?: (value: boolean) => void 34 | } 35 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/timeline.d.ts: -------------------------------------------------------------------------------- 1 | 2 | 3 | import AtComponent from './base' 4 | 5 | export interface Item { 6 | /** 7 | * 标题 8 | */ 9 | title: string 10 | /** 11 | * 子项内容 12 | */ 13 | content?: string[] 14 | /** 15 | * 自定义 icon 16 | */ 17 | icon?: string 18 | /** 19 | * icon 颜色 20 | * @default 'blue' 21 | */ 22 | color?: 'blue' | 'green' | 'red' | 'yellow' 23 | } 24 | 25 | export interface AtTimelineProps extends AtComponent { 26 | /** 27 | * 最后一项是否为未完成态 28 | * @default false 29 | */ 30 | pending?: boolean 31 | /** 32 | * 需展示的内容 33 | */ 34 | items: Array 35 | } 36 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/activity-indicator/index.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 23 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/rate/index.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 22 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/basic/button/index.scss: -------------------------------------------------------------------------------- 1 | .my-button.at-button { 2 | color: red; 3 | } 4 | 5 | .panel__content { 6 | &.demo-button { 7 | .at-form { 8 | padding-left: 0; 9 | } 10 | } 11 | 12 | .btn-demo-fab { 13 | position: fixed; 14 | right: 32px; 15 | bottom: 32px; 16 | z-index: 1100; 17 | } 18 | 19 | .btn-item { 20 | margin-bottom: 20px; 21 | 22 | &:last-child { 23 | margin-bottom: 0; 24 | } 25 | 26 | .subitem { 27 | display: inline-block; 28 | margin-left: 24px; 29 | 30 | &:first-child { 31 | margin-left: 0; 32 | } 33 | } 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/segmented-control/index.vue: -------------------------------------------------------------------------------- 1 | 18 | 19 | 23 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/action/activity-indicator/index.scss: -------------------------------------------------------------------------------- 1 | @import "taro-ui-vue/style/mixins/index.scss"; 2 | @import "taro-ui-vue/style/variables/default.scss"; 3 | 4 | .activity-indicator-page .panel__content { 5 | position: relative; 6 | .example-item { 7 | @include display-flex; 8 | @include align-items(center); 9 | 10 | &--center { 11 | height: 200px; 12 | position: relative; 13 | background-color: #fafbfc; 14 | margin-bottom: 20px; 15 | } 16 | 17 | .subitem { 18 | margin-left: 32px; 19 | @include flex(0, 0, auto); 20 | 21 | &:first-child { 22 | margin-left: 0; 23 | } 24 | } 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/rate.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEventFunction } from '@tarojs/components/types/common' 3 | 4 | import AtComponent from './base' 5 | 6 | export interface AtRateProps extends AtComponent { 7 | /** 8 | * 评分星星大小 9 | * @default 20 10 | */ 11 | size?: number 12 | /** 13 | * 当前评分,开发者需要通过 onChange 事件来更新 value 值，必填 14 | */ 15 | value?: number 16 | /** 17 | * 最大评分 18 | * @default 5 19 | */ 20 | max?: number 21 | /** 22 | * 星星间隔,单位根据环境自动转为 rpx 或 rem 23 | * @default 5 24 | */ 25 | margin?: number 26 | /** 27 | * 输入框值改变时触发的事件，开发者需要通过 onChange 事件来更新 value 值变化，但不填写 onChange 函数时，该组件只读 28 | */ 29 | onChange?: CommonEventFunction 30 | } 31 | 32 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/---feature-request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: "\U0001F680 Feature Request" 3 | about: 创建一个新功能请求 4 | title: '' 5 | labels: '' 6 | assignees: '' 7 | 8 | --- 9 | 10 | 25 | 26 | **这个功能解决了什么问题？** 27 | 28 | 29 | **你期望的功能是怎样的？** 30 | 31 | 32 | **补充信息** 33 | 34 | 35 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/message.d.ts: -------------------------------------------------------------------------------- 1 | 2 | 3 | import AtComponent from './base' 4 | 5 | export interface AtMessageProps extends AtComponent {} 6 | 7 | export interface AtMessageState { 8 | _isOpened: boolean 9 | _message: string 10 | _type: 'info' | 'success' | 'error' | 'warning' 11 | _duration: number 12 | } 13 | 14 | interface Options { 15 | /** 16 | * 文本消息内容 17 | */ 18 | message: string 19 | /** 20 | * 消息类型 21 | * @default 'info' 22 | */ 23 | type?: 'info' | 'success' | 'error' | 'warning' 24 | /** 25 | * 消息持续时间,单位 ms 26 | * @default 3000 27 | */ 28 | duration?: number 29 | } 30 | 31 | declare function message({ }: Options ): void 32 | 33 | export { message } 34 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/build/devServer.conf.js: -------------------------------------------------------------------------------- 1 | module.exports = function ({ 2 | publicPath, 3 | contentBase, 4 | protocol, 5 | host, 6 | publicUrl 7 | }) { 8 | return { 9 | disableHostCheck: process.env.DANGEROUSLY_DISABLE_HOST_CHECK === 'true', 10 | compress: true, 11 | contentBase, 12 | watchContentBase: true, 13 | hot: true, 14 | inline: true, 15 | quiet: true, 16 | publicPath, 17 | // stats: "errors-only", 18 | watchOptions: { 19 | ignored: /node_modules/ 20 | }, 21 | https: protocol === 'https', 22 | host, 23 | // overlay: true, 24 | historyApiFallback: { 25 | disableDotRule: true 26 | }, 27 | public: publicUrl 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/build/webpack.dev.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path') 2 | const webpack = require('webpack') 3 | 4 | const conf = require('./conf') 5 | const { getProjectRoot } = require('./util') 6 | 7 | const projectRoot = getProjectRoot() 8 | 9 | module.exports = { 10 | mode: 'development', 11 | devtool: 'cheap-module-eval-source-map', 12 | output: { 13 | path: path.resolve(projectRoot, conf.output), 14 | filename: 'js/[name].js', 15 | chunkFilename: 'chunk/[name].chunk.js', 16 | publicPath: '/' 17 | }, 18 | plugins: [ 19 | new webpack.HotModuleReplacementPlugin(), 20 | new webpack.DefinePlugin({ 21 | BASE_NAME: '`/`', 22 | BUILD_MODE: `'dev'`, 23 | }) 24 | ] 25 | } 26 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/tabs-pane/index.ts: -------------------------------------------------------------------------------- 1 | import classNames from 'classnames' 2 | 3 | export default { 4 | name: 'AtTabsPane', 5 | props: { 6 | customStyle: { 7 | type: [Object, String], 8 | default: () => '', 9 | }, 10 | className: { 11 | type: [Array, String], 12 | default: () => '', 13 | }, 14 | tabDirection: { 15 | type: String, 16 | default: 'horizontal', 17 | validator: (val) => ['horizontal', 'vertical'].includes(val), 18 | }, 19 | index: { 20 | type: Number, 21 | default: 0, 22 | }, 23 | current: { 24 | type: Number, 25 | default: 0, 26 | }, 27 | }, 28 | methods: { 29 | classNames, 30 | }, 31 | } 32 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/avatar.d.ts: -------------------------------------------------------------------------------- 1 | import AtComponent from './base' 2 | 3 | export interface AtAvatarProps extends AtComponent{ 4 | /** 5 | * 头像大小 6 | * @default 'normal' 7 | */ 8 | size?: 'large' | 'normal' | 'small' 9 | /** 10 | * 头像是否圆形 11 | * @default false 12 | */ 13 | circle?: boolean 14 | /** 15 | * 以文字形式展示头像 16 | */ 17 | text?: string 18 | /** 19 | * 头像图片地址 20 | */ 21 | image?: string 22 | /** 23 | * 参考微信[开放数据](https://developers.weixin.qq.com/miniprogram/dev/component/open-data.html) 24 | * 25 | * **注意：** openData 仅支持 type 为 userAvatarUrl 26 | */ 27 | openData?: { type: 'userAvatarUrl' } 28 | } 29 | 30 | export interface AtAvatarState { 31 | isWEAPP: boolean 32 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/flex.d.ts: -------------------------------------------------------------------------------- 1 | import AtComponent from './base' 2 | 3 | export interface AtFlexItemProps extends AtComponent { 4 | isAuto: boolean 5 | isWrap: boolean 6 | align: 'top' | 'bottom' | 'center' 7 | size: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 8 | offset: 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 9 | } 10 | 11 | export interface AtFlexProps extends AtComponent { 12 | wrap: 'no-wrap' | 'wrap' | 'wrap-reverse' 13 | align: 'start' | 'end' | 'center' | 'stretch' | 'baseline' 14 | justify: 'start' | 'end' | 'center' | 'between' | 'around' 15 | dirction: 'row' | 'column' | 'row-reverse' | 'column-reverse' 16 | alignContent: 'start' | 'end' | 'center' | 'stretch' | 'between' | 'around' 17 | } 18 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/steps/index.ts: -------------------------------------------------------------------------------- 1 | import classNames from 'classnames' 2 | 3 | export default { 4 | name: 'AtSteps', 5 | props: { 6 | customStyle: { 7 | type: [Object, String], 8 | default: () => '', 9 | }, 10 | className: { 11 | type: [Object, String], 12 | default: () => '', 13 | }, 14 | current: { 15 | type: Number, 16 | default: 0, 17 | }, 18 | items: { 19 | type: Array, 20 | default: () => [], 21 | }, 22 | onChange: { 23 | type: Function, 24 | default: () => () => {}, 25 | }, 26 | }, 27 | methods: { 28 | classNames, 29 | handleClick(event) { 30 | this.onChange && this.onChange(event) 31 | }, 32 | }, 33 | } 34 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/calendar/ui/day-list/index.vue: -------------------------------------------------------------------------------- 1 | 14 | 15 | 25 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/progress/index.vue: -------------------------------------------------------------------------------- 1 | 21 | 22 | 26 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/action-sheet/components/item.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 34 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/__snapshots__/badge.spec.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`AtBadge Snap render AtBadge -- props dot 1`] = ` 4 | 8 | 11 | 12 | `; 13 | 14 | exports[`AtBadge Snap render AtBadge -- props maxValue 1`] = ` 15 | 20 | 23 | 24 | `; 25 | 26 | exports[`AtBadge Snap render AtBadge -- props value 1`] = ` 27 | 31 | 34 | 35 | `; 36 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/progress.d.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: pengyue 3 | * @Date: 2020-07-06 21:27:18 4 | * @LastEditTime: 2020-07-11 14:12:42 5 | * @LastEditors: pengyue 6 | * @Description: 7 | * @FilePath: /taro-ui-vue/packages/taro-ui-vue/types/progress.d.ts 8 | */ 9 | 10 | 11 | import AtComponent from './base' 12 | 13 | export enum statusEnum { 14 | 'progress', 'error' , 'success' 15 | } 16 | export interface AtProgressProps extends AtComponent { 17 | /** 18 | * 元素的颜色 19 | */ 20 | color?: string 21 | /** 22 | * 元素的状态 23 | */ 24 | status?: statusEnum 25 | /** 26 | * 元素的进度 27 | */ 28 | percent?: number 29 | /** 30 | * 元素的规格 31 | */ 32 | strokeWidth?: number 33 | /** 34 | * 是否隐藏文字 35 | */ 36 | isHidePercent?: boolean 37 | } 38 | 39 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/navigation/drawer/index.scss: -------------------------------------------------------------------------------- 1 | .page { 2 | background-color: #fff; 3 | } 4 | 5 | .example { 6 | margin-bottom: 15px; 7 | text-align: center; 8 | } 9 | 10 | .drawer-item { 11 | height: 80px; 12 | line-height: 80px; 13 | margin: 0 25px; 14 | color: #666; 15 | font-size: 30px; 16 | border-bottom: 1px solid #eee; 17 | position: relative; 18 | 19 | .at-icon { 20 | position: absolute; 21 | right: 5px; 22 | top: 25px; 23 | } 24 | 25 | .at-badge { 26 | position: absolute; 27 | right: 5px; 28 | top: 25px; 29 | 30 | .at-icon { 31 | position: static; 32 | margin-top: -45px; 33 | } 34 | } 35 | 36 | &--sub { 37 | font-size: 26px; 38 | margin-left: 50px; 39 | color: #999; 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/countdown/item.vue: -------------------------------------------------------------------------------- 1 | 13 | 14 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/modal/action/index.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 37 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/action-sheet/components/footer.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 34 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/pagination.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | .at-pagination { 5 | position: relative; 6 | display: flex; 7 | justify-content: space-between; 8 | align-items: center; 9 | margin: 0 $at-pagination-margin; 10 | 11 | &__btn-prev, 12 | &__btn-next { 13 | font-size: 0; 14 | 15 | .at-icon { 16 | color: $at-pagination-icon-color; 17 | font-size: $at-pagination-icon-font-size; 18 | } 19 | } 20 | 21 | &__number { 22 | flex: 1; 23 | color: $at-pagination-num-color; 24 | font-size: $at-pagination-num-font-size; 25 | text-align: center; 26 | overflow: hidden; 27 | 28 | &-current { 29 | color: $at-pagination-current-num-color; 30 | } 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/drawer.d.ts: -------------------------------------------------------------------------------- 1 | 2 | 3 | import AtComponent from './base' 4 | 5 | export interface AtDrawerProps extends AtComponent { 6 | /** 7 | * 展示或隐藏 8 | * @default false 9 | */ 10 | show: boolean 11 | /** 12 | * 是否需要遮罩 13 | * @default true 14 | */ 15 | mask?: boolean 16 | /** 17 | * 抽屉宽度 18 | * @default 230px 19 | */ 20 | width?: string 21 | /** 22 | * 是否从右侧滑出 23 | * @default false 24 | */ 25 | right?: boolean 26 | /** 27 | * Array 28 | */ 29 | items?: Array 30 | /** 31 | * 点击菜单时触发 32 | */ 33 | onItemClick?: (index: number) => void 34 | /** 35 | * 动画结束组件关闭的时候触发 36 | */ 37 | onClose?: () => void 38 | } 39 | 40 | export interface AtDrawerState { 41 | animShow: boolean, 42 | _show: boolean 43 | } 44 | 45 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/radio.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEvent } from "@tarojs/components/types/common"; 3 | 4 | import AtComponent from './base' 5 | 6 | export interface RadioOption { 7 | /** 8 | * 选项标识符，必须保证唯一 9 | */ 10 | value: T 11 | /** 12 | * 选项标题 13 | */ 14 | label: string 15 | /** 16 | * 选项描述，显示在标题下方的文字 17 | */ 18 | desc?: string 19 | /** 20 | * 是否禁止点击 21 | * @default false 22 | */ 23 | disabled?: boolean 24 | } 25 | 26 | export interface AtRadioProps extends AtComponent { 27 | /** 28 | * 输入框当前值，用户需要通过 onClick 事件来更新 value 值，必填 29 | */ 30 | value: T 31 | /** 32 | * 选项列表 33 | */ 34 | options: Array> 35 | /** 36 | * 点击选项触发事件,开发者需要通过此事件来更新 value，onClick 函数必填 37 | */ 38 | onClick: (vaule: T, event: CommonEvent) => void 39 | } 40 | 41 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/app.ts: -------------------------------------------------------------------------------- 1 | /* 2 | * @Author: pengyue 3 | * @Date: 2020-07-11 06:40:46 4 | * @LastEditTime: 2020-07-12 16:26:26 5 | * @LastEditors: pengyue 6 | * @Description: 7 | * @FilePath: /taro-ui-vue/packages/taro-ui-vue-demo/src/app.ts 8 | */ 9 | 10 | import Vue from 'vue' 11 | import Taro from '@tarojs/taro' 12 | 13 | import TaroUi from 'taro-ui-vue' 14 | import 'taro-ui-vue/style/index.scss' 15 | import './app.scss' 16 | 17 | import DocsHeader from './components/DocsHeader.vue' 18 | 19 | Vue.config.productionTip = false 20 | Vue.prototype.$taro = Taro 21 | 22 | Vue.component('DocsHeader', DocsHeader) 23 | Vue.use(TaroUi) 24 | 25 | const App = new Vue({ 26 | render(h) { 27 | // this.$slots.default 是将要会渲染的页面 28 | return h('block', this.$slots.default) 29 | }, 30 | }) 31 | 32 | export default App 33 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/advanced/calendar/index.scss: -------------------------------------------------------------------------------- 1 | 2 | .calendar-page .body_controllers { 3 | margin-top: 20px; 4 | text-align: center; 5 | 6 | .at-button { 7 | font-size: 24px; 8 | border-radius: 0; 9 | 10 | + .at-button { 11 | border-left: none; 12 | } 13 | 14 | &:first-child { 15 | border-top-left-radius: 8px; 16 | border-bottom-left-radius: 8px; 17 | 18 | // prettier-ignore 19 | border-left: 1PX solid #dcdfe6; 20 | } 21 | 22 | &:last-child { 23 | border-top-right-radius: 8px; 24 | border-bottom-right-radius: 8px; 25 | } 26 | } 27 | } 28 | 29 | .test { 30 | margin-left: 20px; 31 | } 32 | // fix h5 calendar 33 | taro-swiper-core.main__body { 34 | height: 1.536 * 6rem; 35 | } 36 | taro-swiper-item-core { 37 | background-color: #fff; 38 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/slider/index.vue: -------------------------------------------------------------------------------- 1 | 24 | 25 | 29 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/components/iconlist/index.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ICONS from './icons.js' 3 | import './style.scss' 4 | 5 | class IconList extends React.Component { 6 | render() { 7 | const { type = 'main' } = this.props 8 | const iconlist = ICONS[type] 9 | 10 | return ( 11 |
    12 | {iconlist.map((icon, index) => ( 13 |
  • 17 |
    18 | 19 |

    {icon}

    20 |
    21 |
    • 22 | ))} 23 |
24 | ) 25 | } 26 | } 27 | 28 | export default IconList 29 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | moduleFileExtensions: ['js', 'jsx', 'json', 'vue', 'tsx', 'ts'], 3 | transform: { 4 | '^.+\\.vue$': 'vue-jest', 5 | '.+\\.(css|styl|less|sass|scss|png|jpg|ttf|woff|woff2)$': 'jest-transform-stub', 6 | '^.+\\.jsx?$': 'babel-jest', 7 | '^.+\\.tsx?$': 'ts-jest', 8 | }, 9 | moduleNameMapper: { 10 | '^@/(.*)$': '/src/$1', 11 | }, 12 | snapshotSerializers: ['jest-serializer-vue'], 13 | testMatch: ['**/tests/unit/**/*.spec.[jt]s?(x)', '**/__tests__/*.[jt]s?(x)'], 14 | coverageDirectory: '/tests/coverage', 15 | collectCoverage: true, 16 | collectCoverageFrom: ['/src/components/**/*.{js, ts, vue}', '!**/node_modules/**'], 17 | globals: { 18 | 'ts-jest': { 19 | tsConfig: './jest.tsconfig.json', 20 | }, 21 | }, 22 | } 23 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/radio/index.vue: -------------------------------------------------------------------------------- 1 | 21 | 25 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/loading.spec.js: -------------------------------------------------------------------------------- 1 | import { mount } from '@vue/test-utils' 2 | import AtLoading from '../../src/components/loading/index.vue' 3 | 4 | const factory = (values = {}, slots = { default: [] }) => { 5 | return mount(AtLoading, { 6 | components: {}, 7 | slots, 8 | propsData: { ...values }, 9 | }) 10 | } 11 | 12 | describe('AtLoading Snap', () => { 13 | it('render initial AtLoading', () => { 14 | const wrapper = factory() 15 | expect(wrapper.element).toMatchSnapshot() 16 | }) 17 | 18 | it('render AtLoading -- props size', () => { 19 | const wrapper = factory({ size: 15 }) 20 | expect(wrapper.element).toMatchSnapshot() 21 | }) 22 | 23 | it('render AtLoading -- props color', () => { 24 | const wrapper = factory({ color: '#fff' }) 25 | expect(wrapper.element).toMatchSnapshot() 26 | }) 27 | }) 28 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/message.spec.js: -------------------------------------------------------------------------------- 1 | import { mount } from '@vue/test-utils' 2 | import AtMessage from '../components/message' 3 | 4 | const factory = (values = {}, slots = { default: [] }) => { 5 | return mount(AtMessage, { 6 | components: {}, 7 | slots, 8 | propsData: { ...values }, 9 | }) 10 | } 11 | 12 | describe('AtMessage Snap', () => { 13 | it('render initial AtMessage', () => { 14 | const wrapper = factory() 15 | expect(wrapper.element).toMatchSnapshot() 16 | }) 17 | 18 | it('render AtMessage -- props className', () => { 19 | const wrapper = factory({ className: 'test' }) 20 | expect(wrapper.element).toMatchSnapshot() 21 | }) 22 | 23 | it('render AtMessage -- props customStyle', () => { 24 | const wrapper = factory({ customStyle: 'color:red;' }) 25 | expect(wrapper.element).toMatchSnapshot() 26 | }) 27 | }) 28 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/card.d.ts: -------------------------------------------------------------------------------- 1 | import { CommonEventFunction } from '@tarojs/components/types/common' 2 | 3 | import AtComponent, { AtIconBaseProps } from './base' 4 | 5 | export interface AtCardProps extends AtComponent { 6 | /** 7 | * 元素的辅助信息 8 | */ 9 | note?: string 10 | /** 11 | * 是否通栏 12 | */ 13 | isFull?: boolean 14 | /** 15 | * 元素的缩略图 16 | */ 17 | thumb?: string 18 | /** 19 | * 元素的标题 20 | */ 21 | title?: string 22 | /** 23 | * 元素的额外信息 24 | */ 25 | extra?: string 26 | /** 27 | * 元素的额外信息自定义样式 28 | */ 29 | extraStyle?: object 30 | /** 31 | * 图标，仅支持 AtIcon 支持的类型， 32 | * object 属性有 value color size prefixClass 33 | */ 34 | icon?: AtIconBaseProps 35 | /** 36 | * 元素自定义图标 37 | */ 38 | renderIcon?: JSX.Element 39 | /** 40 | * 元素被点击触发的事件 41 | */ 42 | onClick?: CommonEventFunction 43 | } 44 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/tag.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEvent } from '@tarojs/components/types/common' 3 | 4 | import AtComponent from './base' 5 | 6 | export interface TagInfo { 7 | name: string 8 | active: boolean 9 | } 10 | 11 | export interface AtTagProps extends AtComponent { 12 | /** 13 | * 大小尺寸 14 | * @default 'normal' 15 | */ 16 | size?: 'normal' | 'small' 17 | /** 18 | * 样式类型 19 | */ 20 | type?: string 21 | /** 22 | * 标签名字 23 | */ 24 | name?: string 25 | /** 26 | * 是否大圆角 27 | * @default false 28 | */ 29 | circle?: boolean 30 | /** 31 | * 是否为选中态 32 | * @default false 33 | */ 34 | active?: boolean 35 | /** 36 | * 是否为禁用态 37 | * @default false 38 | */ 39 | disabled?: boolean 40 | /** 41 | * 点击标签时触发，返回标签名字和状态的对象 42 | */ 43 | onClick?: (tagInfo: TagInfo, event: CommonEvent) => void 44 | } 45 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/activity-indicator.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | .at-activity-indicator { 5 | @include display-flex(); 6 | 7 | line-height: $line-height-base; 8 | visibility: hidden; 9 | opacity: 0; 10 | transition: all 0.3s $ease-in-quad; 11 | 12 | /* elements */ 13 | &__body { 14 | @include flex(0, 0, auto); 15 | 16 | line-height: 0; 17 | } 18 | 19 | &__content { 20 | @include flex(0, 0, auto); 21 | @include align-self(center); 22 | 23 | margin-left: $spacing-h-lg; 24 | color: $at-activity-indicator-font-color; 25 | font-size: $at-activity-indicator-font-size; 26 | } 27 | 28 | /* modifiers */ 29 | &--center { 30 | @include absolute-center; 31 | } 32 | 33 | &--isopened { 34 | opacity: 1; 35 | visibility: initial; 36 | } 37 | } 38 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/pagination.d.ts: -------------------------------------------------------------------------------- 1 | 2 | 3 | import AtComponent from './base' 4 | 5 | export interface PageChangeData { 6 | /** 7 | * 翻页事件类型 8 | */ 9 | type: 'prev' | 'next' 10 | /** 11 | * 当前页 12 | */ 13 | current: number 14 | } 15 | 16 | export interface AtPaginationProps extends AtComponent{ 17 | /** 18 | * 数据总量 19 | * @default 0 20 | */ 21 | total: number 22 | /** 23 | * 当前页 24 | * @default 1 25 | */ 26 | current?: number 27 | /** 28 | * 每页数据量 29 | * @default 20 30 | */ 31 | pageSize?: number 32 | /** 33 | * 是否以 icon 形式展示按钮 34 | * @default false 35 | */ 36 | icon?: boolean 37 | /** 38 | * 点击页码按钮时触发 39 | */ 40 | onPageChange?: (data: PageChangeData) => void 41 | } 42 | 43 | export interface AtPaginationState { 44 | currentPage: number 45 | maxPage: number 46 | pickerRange: number[] 47 | } 48 | 49 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/checkbox/index.vue: -------------------------------------------------------------------------------- 1 | 23 | 27 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/divider.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | .at-divider { 5 | display: flex; 6 | align-items: center; 7 | justify-content: center; 8 | position: relative; 9 | width: 100%; 10 | height: $at-divider-height; 11 | font-size: $font-size-base; 12 | text-align: center; 13 | 14 | /* elements */ 15 | &__content { 16 | display: inline-block; 17 | position: relative; 18 | padding: 0 $spacing-h-lg; 19 | color: $at-divider-content-color; 20 | font-size: $at-divider-font-size; 21 | background: $color-bg; 22 | z-index: $zindex-divider + 1; 23 | } 24 | 25 | &__line { 26 | position: absolute; 27 | top: 50%; 28 | left: 0; 29 | width: 100%; 30 | height: 1PX; 31 | background-color: $at-divider-line-color; 32 | z-index: $zindex-divider; 33 | } 34 | } 35 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/jest.tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es2017", 4 | "module": "commonjs", 5 | "removeComments": false, 6 | "preserveConstEnums": true, 7 | "moduleResolution": "node", 8 | "experimentalDecorators": true, 9 | "noImplicitAny": false, 10 | "allowSyntheticDefaultImports": true, 11 | "outDir": "lib", 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "strictNullChecks": true, 15 | "sourceMap": true, 16 | "baseUrl": ".", 17 | "rootDir": ".", 18 | "jsx": "react", 19 | "jsxFactory": "h", 20 | "allowJs": true, 21 | "resolveJsonModule": true, 22 | "typeRoots": [ 23 | "node_modules/@types", 24 | "global.d.ts", 25 | "types" 26 | ] 27 | }, 28 | "include": [ 29 | "src/components/**/*.ts" 30 | ], 31 | "exclude": ["node_modules/*", "dist", "**/*.spec.js"] 32 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/form/picker/index.scss: -------------------------------------------------------------------------------- 1 | 2 | .picker__page .example-item { 3 | .at-list__item .item-extra__info { 4 | max-width: 300px; 5 | } 6 | } 7 | 8 | .demo-list-item { 9 | position: relative; 10 | display: flex; 11 | justify-content: space-between; 12 | padding: 24px; 13 | 14 | &::before, 15 | &::after { 16 | content: ''; 17 | position: absolute; 18 | top: auto; 19 | left: 0; 20 | right: 0; 21 | bottom: 0; 22 | transform: scaleY(0.5); 23 | border-bottom: 1PX solid #d6e4ef; 24 | transform-origin: center; 25 | box-sizing: border-box; 26 | pointer-events: none; 27 | } 28 | 29 | &::before { 30 | top: 0; 31 | bottom: auto; 32 | } 33 | 34 | &__label, 35 | &__value { 36 | color: #333; 37 | font-size: 32px; 38 | line-height: 1.5; 39 | } 40 | 41 | &__value { 42 | color: #999; 43 | } 44 | } 45 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/__snapshots__/tabs-pane.spec.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`AtTabsPane Snap render AtTabsPane -- props className 1`] = ` 4 | 7 | `; 8 | 9 | exports[`AtTabsPane Snap render AtTabsPane -- props customStyle 1`] = ` 10 | 14 | `; 15 | 16 | exports[`AtTabsPane Snap render AtTabsPane -- props index current 1`] = ` 17 | 20 | `; 21 | 22 | exports[`AtTabsPane Snap render AtTabsPane -- props index current 2`] = ` 23 | 26 | `; 27 | 28 | exports[`AtTabsPane Snap render initial AtTabs 1`] = ` 29 | 32 | test 33 | 34 | `; 35 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/input-number/index.vue: -------------------------------------------------------------------------------- 1 | 24 | 28 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/segmented-control.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEvent } from '@tarojs/components/types/common' 3 | 4 | import AtComponent from './base' 5 | 6 | export interface AtSegmentedControlProps extends AtComponent { 7 | /** 8 | * 当前选中的 tab 索引值，从 0 计数 9 | * @default 0 10 | */ 11 | current: number 12 | /** 13 | * 背景颜色与选中标签字体的颜色 14 | * @default #fff 15 | */ 16 | color?: string 17 | /** 18 | * 选中的标签背景色与边框颜色 19 | * @default #6190E8 20 | */ 21 | selectedColor?: string 22 | /** 23 | * 字体大小，单位 h5 为 rem，小程序为 rem 24 | * @default 28 25 | */ 26 | fontSize?: number 27 | /** 28 | * 是否禁止点击 29 | * @default false 30 | */ 31 | disabled?: boolean 32 | /** 33 | * 选项数组，值是字符串，eg: ['标签页1', '标签页2'] 34 | */ 35 | values: string[] 36 | /** 37 | * 点击触发事件，开发者需要通过 onClick 事件来更新 current 值变化，onClick 函数必填 38 | */ 39 | onClick: (index: number, event: CommonEvent) => void 40 | } 41 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/dist/index.html: -------------------------------------------------------------------------------- 1 | Taro UI | O2Team
-------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/calendar/controller/index.vue: -------------------------------------------------------------------------------- 1 | 27 | 34 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/components/DocsHeader.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 19 | 46 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/babel.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "overrides": [ 3 | { 4 | "include": "../taro-ui-vue-docs/**", 5 | "presets": [ 6 | [ 7 | "@babel/preset-env", 8 | { 9 | "spec": true, 10 | "modules": false, 11 | "targets": { 12 | "browsers": [ 13 | "ie >= 9", 14 | "Chrome >= 21", 15 | "Firefox >= 1", 16 | "Edge >= 13", 17 | "last 3 versions" 18 | ] 19 | }, 20 | "loose": false, 21 | "forceAllTransforms": true, 22 | "useBuiltIns": "entry", 23 | "corejs": "3.6" 24 | } 25 | ], 26 | "@babel/preset-react" 27 | ], 28 | "plugins": [ 29 | "@babel/plugin-syntax-dynamic-import", 30 | "@babel/plugin-proposal-class-properties" 31 | ] 32 | } 33 | ] 34 | } 35 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/toast/index.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 28 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/accordion.d.ts: -------------------------------------------------------------------------------- 1 | import { CommonEvent } from '@tarojs/components/types/common' 2 | 3 | import AtComponent, { AtIconBaseProps } from './base' 4 | 5 | export interface AtAccordionProps extends AtComponent { 6 | /** 7 | * 是否默认开启 8 | * @default false 9 | */ 10 | open?: boolean; 11 | /** 12 | * 标题 13 | */ 14 | title?: string; 15 | /** 16 | * 图标，仅支持 AtIcon 支持的类型， 17 | * object 属性有 value color size prefixClass 18 | */ 19 | icon?: AtIconBaseProps; 20 | /** 21 | * 是否开启动画 22 | * @default true 23 | * @since v2.0.0-beta.3 24 | */ 25 | isAnimation?: boolean; 26 | /** 27 | * 是否有头部下划线 28 | * @default true 29 | */ 30 | hasBorder?: boolean; 31 | /** 32 | * 描述信息 33 | */ 34 | note?: string; 35 | /** 36 | * 点击头部触发事件 37 | */ 38 | onClick?: (open: boolean, event: CommonEvent) => void; 39 | } 40 | 41 | export interface AtAccordionState { 42 | wrapperHeight: number; 43 | } 44 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/grid.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEvent } from '@tarojs/components/types/common' 3 | import AtComponent, { AtIconBaseProps } from './base' 4 | 5 | export interface AtGridItem { 6 | /** 7 | * 宫格图片 8 | */ 9 | image?: string 10 | /** 11 | * 宫格文字 12 | */ 13 | value?: string 14 | /** 15 | * 宫格图标 16 | */ 17 | iconInfo?: AtIconBaseProps 18 | /** 19 | * 允许用户扩充 Item 字段 20 | */ 21 | [key: string]: any 22 | } 23 | 24 | export interface AtGridProps extends AtComponent { 25 | /** 26 | * 宫格布局数据源 27 | */ 28 | data: Array 29 | /** 30 | * 每一列有多少个 31 | */ 32 | columnNum?: number 33 | /** 34 | * 是否有边框 35 | * @default true 36 | */ 37 | hasBorder?: boolean 38 | /** 39 | * 布局模式 40 | * @default square 41 | */ 42 | mode?: 'square' | 'rect' 43 | /** 44 | * 点击宫格触发的事件 45 | */ 46 | onClick?: (item: AtGridItem, index: number, event: CommonEvent) => void 47 | } 48 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/view/Color/style.scss: -------------------------------------------------------------------------------- 1 | .at-color-container { 2 | margin: 16px 16px 0 0; 3 | padding: 16px; 4 | border-radius: 4px; 5 | 6 | p { 7 | color: #fff; 8 | font-size: 14px; 9 | } 10 | 11 | .color-value { 12 | font-size: 12px; 13 | opacity: 0.7; 14 | } 15 | } 16 | 17 | .c-dark { 18 | color: #7E95A7 !important; 19 | } 20 | 21 | .color-palette { 22 | .color-group { 23 | padding: 0; 24 | margin: 16px 16px 16px 0; 25 | color: #fff; 26 | font-size: 14px; 27 | list-style: none; 28 | min-width: 200px; 29 | border-radius: 4px; 30 | overflow: hidden; 31 | 32 | li { 33 | padding: 16px; 34 | overflow: hidden; 35 | line-height: 1.4; 36 | 37 | &:first-child { 38 | .color-name { 39 | display: block; 40 | font-size: 18px; 41 | } 42 | } 43 | } 44 | 45 | .color-value { 46 | float: right; 47 | } 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/calendar/ui/date-list/index.vue: -------------------------------------------------------------------------------- 1 | 23 | 24 | 28 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/pages/view/load-more/index.vue: -------------------------------------------------------------------------------- 1 | 21 | 40 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/fab.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | .at-fab { 5 | display: flex; 6 | justify-content: center; 7 | align-items: center; 8 | padding: 0; 9 | width: $at-fab-size; 10 | height: $at-fab-size; 11 | color: $color-white; 12 | font-size: $font-size-base; 13 | line-height: $line-height-zh; 14 | text-align: center; 15 | border-radius: 50%; 16 | background: $at-fab-bg-color; 17 | box-shadow: $at-fab-box-shadow; 18 | box-sizing: border-box; 19 | 20 | &:active { 21 | background: $at-fab-bg-color-active; 22 | box-shadow: $at-fab-box-shadow-active; 23 | } 24 | 25 | /* elements */ 26 | &__icon, 27 | .at-icon { 28 | width: $at-fab-icon-size; 29 | height: $at-fab-icon-size; 30 | font-size: $at-fab-icon-size; 31 | } 32 | 33 | /* modifiers */ 34 | &--small { 35 | width: $at-fab-size-sm; 36 | height: $at-fab-size-sm; 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/load-more.d.ts: -------------------------------------------------------------------------------- 1 | import { CSSProperties } from '../global' 2 | import { CommonEventFunction } from '@tarojs/components/types/common' 3 | 4 | import AtComponent from './base' 5 | 6 | export interface AtLoadMoreProps extends AtComponent { 7 | /** 8 | * noMore 状态显示文案样式 9 | */ 10 | noMoreTextStyle?: string | CSSProperties; 11 | /** 12 | * more 状态按钮样式 13 | */ 14 | moreBtnStyle?: string | CSSProperties; 15 | /** 16 | * 组件状态，more 状态显示查看更多按钮，loading 状态显示加载状态，noMore 显示无更多数据 17 | * @default 'more' 18 | */ 19 | status?: 'more' | 'loading' | 'noMore'; 20 | /** 21 | * loading 状态显示文案 22 | * @default '加载中' 23 | */ 24 | loadingText?: string; 25 | /** 26 | * more 状态显示文案 27 | * @default '查看更多' 28 | */ 29 | moreText?: string; 30 | /** 31 | * noMore 状态显示文案 32 | * @default '没有更多' 33 | */ 34 | noMoreText?: string; 35 | /** 36 | * more 状态点击触发的事件 37 | */ 38 | onClick?: CommonEventFunction; 39 | } 40 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/toast.d.ts: -------------------------------------------------------------------------------- 1 | 2 | import { CommonEventFunction } from '@tarojs/components/types/common' 3 | 4 | import AtComponent from './base' 5 | 6 | export interface AtToastProps extends AtComponent { 7 | /** 8 | * 是否展示元素 9 | * @default false 10 | */ 11 | isOpened: boolean 12 | /** 13 | * 元素的内容 14 | */ 15 | text?: string 16 | /** 17 | * icon 的类型 18 | */ 19 | icon?: string 20 | /** 21 | * 元素展示的图片 22 | */ 23 | image?: string 24 | /** 25 | * 元素的状态 26 | */ 27 | status?: 'error' | 'loading' | 'success' 28 | /** 29 | * 元素持续的事件（设置为 0 将不会自动消失） 30 | * @default 3000 31 | */ 32 | duration?: number 33 | /** 34 | * 是否存在底部遮罩层(无法点击底部的内容区) 35 | */ 36 | hasMask?: boolean 37 | /** 38 | * 元素被点击之后触发的事件 39 | */ 40 | onClick?: CommonEventFunction 41 | /** 42 | * 元素被关闭之后触发的事件 43 | */ 44 | onClose?: CommonEventFunction 45 | } 46 | 47 | export interface AtToastState { 48 | _isOpened: boolean 49 | } 50 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/global.d.ts: -------------------------------------------------------------------------------- 1 | import * as CSS from 'csstype' 2 | import Vue, { VNode } from 'vue' 3 | 4 | declare module "*.png"; 5 | declare module "*.gif"; 6 | declare module "*.jpg"; 7 | declare module "*.jpeg"; 8 | declare module "*.svg"; 9 | declare module "*.css"; 10 | declare module "*.less"; 11 | declare module "*.scss"; 12 | declare module "*.sass"; 13 | declare module "*.styl"; 14 | 15 | declare namespace JSX { 16 | interface Element extends VNode {} 17 | interface ElementClass extends Vue {} 18 | interface IntrinsicElements { 19 | [elem: string]: any; 20 | } 21 | } 22 | 23 | // @ts-ignore 24 | declare const process: { 25 | env: { 26 | TARO_ENV: 'weapp' | 'swan' | 'alipay' | 'h5' | 'rn' | 'tt' | 'quickapp' | 'qq'; 27 | [key: string]: any; 28 | } 29 | } 30 | export type CSSProperties = CSS.Properties 31 | 32 | declare module 'vue/types/options' { 33 | interface ComponentOptions { 34 | [propName: string]: any; 35 | } 36 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/rate.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | .at-rate { 5 | font-size: 0; 6 | line-height: 0; 7 | 8 | /* elements */ 9 | &__left { 10 | display: inline-block; 11 | position: absolute; 12 | left: 0; 13 | top: 0; 14 | width: 50%; 15 | height: 100%; 16 | color: transparent; 17 | overflow: hidden; 18 | z-index: 10; 19 | } 20 | 21 | &__icon { 22 | position: relative; 23 | display: inline-block; 24 | color: $at-rate-star-color; 25 | font-size: 0; 26 | line-height: 0; 27 | transition: all 0.2s; 28 | 29 | .at-icon { 30 | font-size: $at-rate-icon-size; 31 | } 32 | 33 | &--on { 34 | color: $at-rate-star-color-on; 35 | } 36 | 37 | &--off { 38 | color: $at-rate-star-color; 39 | } 40 | 41 | &--half { 42 | .at-rate__left { 43 | color: $at-rate-star-color-on; 44 | } 45 | } 46 | } 47 | } 48 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es2017", 4 | "module": "commonjs", 5 | "removeComments": false, 6 | "preserveConstEnums": true, 7 | "moduleResolution": "node", 8 | "experimentalDecorators": true, 9 | "noImplicitAny": false, 10 | "allowSyntheticDefaultImports": true, 11 | "outDir": "lib", 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "strictNullChecks": false, 15 | "sourceMap": true, 16 | "baseUrl": ".", 17 | "rootDir": ".", 18 | "jsx": "preserve", 19 | "jsxFactory": "h", 20 | "allowJs": true, 21 | "resolveJsonModule": true, 22 | "typeRoots": [ 23 | "node_modules/@types", 24 | "global.d.ts", 25 | "types" 26 | ] 27 | }, 28 | "include": [ 29 | "src/**/**.jsx", 30 | "src/**/**.vue", 31 | "src/**/**.ts", 32 | ], 33 | "exclude": [ 34 | "node_modules/*", 35 | "dist" 36 | ], 37 | "compileOnSave": false 38 | } 39 | -------------------------------------------------------------------------------- /tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es2017", 4 | "module": "commonjs", 5 | "removeComments": false, 6 | "preserveConstEnums": true, 7 | "moduleResolution": "node", 8 | "experimentalDecorators": true, 9 | "noImplicitAny": false, 10 | "allowSyntheticDefaultImports": true, 11 | "outDir": "lib", 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "strictNullChecks": true, 15 | "sourceMap": true, 16 | "baseUrl": ".", 17 | "rootDir": ".", 18 | "jsx": "preserve", 19 | "jsxFactory": "h", 20 | "allowJs": true, 21 | "resolveJsonModule": true, 22 | "typeRoots": [ 23 | "node_modules/@types", 24 | "global.d.ts", 25 | "types" 26 | ] 27 | }, 28 | "include": [ 29 | "src/components/**.jsx", 30 | "src/utils/**.ts", 31 | "src/index.ts" 32 | ], 33 | "exclude": [ 34 | "node_modules/*", 35 | "packages/taro-ui-vue/dist" 36 | ], 37 | "compileOnSave": false 38 | } 39 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/countdown/index.vue: -------------------------------------------------------------------------------- 1 | 28 | 29 | 41 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/range/index.vue: -------------------------------------------------------------------------------- 1 | 24 | 28 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/activity-indicator/index.ts: -------------------------------------------------------------------------------- 1 | import classNames from 'classnames' 2 | 3 | export default { 4 | props: { 5 | size: { 6 | type: Number, 7 | default: 0, 8 | }, 9 | mode: { 10 | type: String, 11 | default: 'normal', 12 | }, 13 | color: { 14 | type: String, 15 | default: '', 16 | }, 17 | content: { 18 | type: String, 19 | default: '', 20 | }, 21 | className: { 22 | type: [Array, String], 23 | default: () => '', 24 | }, 25 | isOpened: { 26 | type: Boolean, 27 | default: true, 28 | }, 29 | }, 30 | computed: { 31 | rootClass() { 32 | const { mode, isOpened, className } = this 33 | return classNames( 34 | 'at-activity-indicator', 35 | { 36 | 'at-activity-indicator--center': mode === 'center', 37 | 'at-activity-indicator--isopened': isOpened, 38 | }, 39 | className 40 | ) 41 | }, 42 | }, 43 | } 44 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/__snapshots__/icon.spec.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`AtIcon Snap render AtIcon -- props className 1`] = ` 4 | 7 | `; 8 | 9 | exports[`AtIcon Snap render AtIcon -- props color 1`] = ` 10 | 14 | `; 15 | 16 | exports[`AtIcon Snap render AtIcon -- props customStyle 1`] = ` 17 | 21 | `; 22 | 23 | exports[`AtIcon Snap render AtIcon -- props prefixClass 1`] = ` 24 | 27 | `; 28 | 29 | exports[`AtIcon Snap render AtIcon -- props size 1`] = ` 30 | 33 | `; 34 | 35 | exports[`AtIcon Snap render AtIcon -- props value 1`] = ` 36 | 39 | `; 40 | 41 | exports[`AtIcon Snap render initial AtIcon 1`] = ` 42 | 45 | `; 46 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/tsconfig.build.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "es2017", 4 | "module": "commonjs", 5 | "removeComments": false, 6 | "preserveConstEnums": true, 7 | "moduleResolution": "node", 8 | "experimentalDecorators": true, 9 | "noImplicitAny": false, 10 | "allowSyntheticDefaultImports": true, 11 | "outDir": "lib", 12 | "noUnusedLocals": true, 13 | "noUnusedParameters": true, 14 | "strictNullChecks": true, 15 | "sourceMap": true, 16 | "baseUrl": ".", 17 | "rootDir": ".", 18 | "jsx": "preserve", 19 | "jsxFactory": "h", 20 | "allowJs": true, 21 | "resolveJsonModule": true, 22 | "typeRoots": [ 23 | "node_modules/@types", 24 | "global.d.ts", 25 | "types" 26 | ] 27 | }, 28 | "include": [ 29 | "src/pages/**/*.vue", 30 | "src/components/**/*.vue", 31 | "src/utils/**/*.ts", 32 | "src/*.ts" 33 | ], 34 | "exclude": [ 35 | "node_modules/*", 36 | "dist" 37 | ], 38 | "compileOnSave": false 39 | } 40 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/action-sheet/index.vue: -------------------------------------------------------------------------------- 1 | 17 | 18 | 33 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/load-more/index.vue: -------------------------------------------------------------------------------- 1 | 23 | 36 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/tests/unit/__snapshots__/tag.spec.js.snap: -------------------------------------------------------------------------------- 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP 2 | 3 | exports[`AtTag Snap render AtTag -- props active 1`] = ` 4 | 7 | 标签 8 | 9 | `; 10 | 11 | exports[`AtTag Snap render AtTag -- props circle 1`] = ` 12 | 15 | 标签 16 | 17 | `; 18 | 19 | exports[`AtTag Snap render AtTag -- props disabled 1`] = ` 20 | 23 | 标签 24 | 25 | `; 26 | 27 | exports[`AtTag Snap render AtTag -- props name 1`] = ` 28 | 31 | 标签 32 | 33 | `; 34 | 35 | exports[`AtTag Snap render AtTag -- props size 1`] = ` 36 | 39 | 标签 40 | 41 | `; 42 | 43 | exports[`AtTag Snap render AtTag -- props type 1`] = ` 44 | 47 | 标签 48 | 49 | `; 50 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/project.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "miniprogramRoot": "bundle/", 3 | "projectname": "taro-ui-vue", 4 | "description": "taro-vue-app-ts", 5 | "appid": "wx9bcb37a08f9f5bf8", 6 | "setting": { 7 | "urlCheck": true, 8 | "es6": false, 9 | "enhance": false, 10 | "postcss": false, 11 | "preloadBackgroundData": false, 12 | "minified": false, 13 | "newFeature": true, 14 | "coverView": true, 15 | "nodeModules": false, 16 | "autoAudits": false, 17 | "showShadowRootInWxmlPanel": true, 18 | "scopeDataCheck": false, 19 | "uglifyFileName": false, 20 | "checkInvalidKey": true, 21 | "checkSiteMap": true, 22 | "uploadWithSourceMap": true, 23 | "compileHotReLoad": false, 24 | "babelSetting": { 25 | "ignore": [], 26 | "disablePlugins": [], 27 | "outputPath": "" 28 | }, 29 | "useIsolateContext": true, 30 | "useCompilerModule": false, 31 | "userConfirmedUseCompilerModuleSwitch": false 32 | }, 33 | "compileType": "miniprogram", 34 | "simulatorType": "wechat", 35 | "simulatorPluginLibVersion": {}, 36 | "condition": {} 37 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/markdown/introduction.md: -------------------------------------------------------------------------------- 1 | # 介绍 2 | 3 | ---- 4 | 5 | `Taro UI Vue` 是一款基于 [Taro](https://taro.aotu.io) 框架开发的多端 UI 组件库 6 | 7 | 主要参考 [Taro UI](https://taro-ui.jd.com/#/) 实现 8 | 9 | ## Taro 10 | 11 | Taro 是由 [京东·凹凸实验室](https://aotu.io) 倾力打造的多端开发解决方案。现如今市面上端的形态多种多样，Web、ReactNative、微信小程序等各种端大行其道，当业务要求同时在不同的端都要求有所表现的时候，针对不同的端去编写多套代码的成本显然非常高，这时候只编写一套代码就能够适配到多端的能力就显得极为需要。 12 | 13 | 使用 Taro，我们可以只书写一套代码，再通过 Taro 的编译工具，将源代码分别编译出可以在不同端（微信小程序、H5、RN等）运行的代码。 14 | 15 | ## 特性 16 | 17 | - 基于 `Taro` 开发 UI 组件 18 | - 一套组件可以在 `微信小程序`，`支付宝小程序`，`百度小程序`，`H5` 多端适配运行（`ReactNative` 端暂不支持） 19 | - 提供友好的 API，可灵活的使用组件 20 | 21 | ## 体验 22 | 23 | -- 24 | 25 | ## 官方示例 26 | 27 | -- 28 | 29 | ## 版本 30 | 31 | `Taro-UI-Vue`：[![NPM version](https://img.shields.io/npm/v/taro-ui-vue.svg)](https://npmjs.org/package/taro-ui-vue) 32 | 33 | ## 开发交流 34 | 35 | -- 36 | 37 | ## 开发计划 38 | 39 | -- 40 | 41 | ## 贡献 42 | 43 | 如果你在使用 `Taro UI Vue` 时遇到问题，或者有好的建议，欢迎给我们提 [Issue](https://github.com/psaren/taro-ui-vue/issues) 或 [Pull Request](https://github.com/psaren/taro-ui-vue/pulls) 44 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/swipe-action.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | .at-swipe-action { 5 | position: relative; 6 | overflow: hidden; 7 | 8 | /* elements */ 9 | &__content { 10 | position: relative; 11 | font-size: $font-size-lg; 12 | background-color: $at-swipe-action-bg-color; 13 | z-index: 2; 14 | 15 | &.animtion { 16 | transition: transform 300ms $timing-func; 17 | } 18 | } 19 | 20 | &__option { 21 | @include active; 22 | @include align-items(center); 23 | 24 | display: inline-flex; 25 | padding: 0 $spacing-h-xl; 26 | height: 100%; 27 | color: $at-swipe-action-color; 28 | font-size: $at-swipe-action-font-size; 29 | text-align: center; 30 | background-color: $at-swipe-action-option-bg-color; 31 | } 32 | 33 | &__options { 34 | @include align-items(center); 35 | 36 | display: inline-flex; 37 | position: absolute; 38 | top: 0; 39 | right: 0; 40 | height: 100%; 41 | z-index: 1; 42 | } 43 | } 44 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/project.config.json: -------------------------------------------------------------------------------- 1 | { 2 | "miniprogramRoot": "dist/", 3 | "projectname": "taro-ui-vue-demo", 4 | "description": "demo for Taro-UI-Vue", 5 | "appid": "wx9bcb37a08f9f5bf8", 6 | "setting": { 7 | "urlCheck": true, 8 | "es6": false, 9 | "enhance": false, 10 | "postcss": false, 11 | "preloadBackgroundData": false, 12 | "minified": false, 13 | "newFeature": true, 14 | "coverView": true, 15 | "nodeModules": false, 16 | "autoAudits": false, 17 | "showShadowRootInWxmlPanel": true, 18 | "scopeDataCheck": false, 19 | "uglifyFileName": false, 20 | "checkInvalidKey": true, 21 | "checkSiteMap": true, 22 | "uploadWithSourceMap": true, 23 | "compileHotReLoad": false, 24 | "babelSetting": { 25 | "ignore": [], 26 | "disablePlugins": [], 27 | "outputPath": "" 28 | }, 29 | "useIsolateContext": true, 30 | "useCompilerModule": false, 31 | "userConfirmedUseCompilerModuleSwitch": false 32 | }, 33 | "compileType": "miniprogram", 34 | "simulatorType": "wechat", 35 | "simulatorPluginLibVersion": {}, 36 | "condition": {} 37 | } -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/load-more/main.ts: -------------------------------------------------------------------------------- 1 | import classNames from 'classnames' 2 | 3 | export default { 4 | props: { 5 | customStyle: { 6 | type: [Object, String], 7 | default: () => {}, 8 | }, 9 | className: { 10 | type: [Array, String], 11 | default: () => '', 12 | }, 13 | noMoreTextStyle: { 14 | type: [Object, String], 15 | default: () => {}, 16 | }, 17 | moreBtnStyle: { 18 | type: [Object, String], 19 | default: () => {}, 20 | }, 21 | status: { 22 | type: String, 23 | default: 'more', 24 | validator: (val) => ['more', 'loading', 'noMore'].includes(val), 25 | }, 26 | loadingText: { 27 | type: String, 28 | default: '加载中', 29 | }, 30 | moreText: { 31 | type: String, 32 | default: '查看更多', 33 | }, 34 | noMoreText: { 35 | type: String, 36 | default: '没有更多', 37 | }, 38 | onClick: { 39 | type: Function, 40 | default: () => () => {}, 41 | }, 42 | }, 43 | methods: { 44 | classNames, 45 | }, 46 | } 47 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/mixins/libs/border.scss: -------------------------------------------------------------------------------- 1 | /** 2 | * 默认主题下 $color-border-light 3 | */ 4 | 5 | @mixin border-thin( 6 | $color: $color-border-light, 7 | $style: solid, 8 | $directions: top bottom right left, 9 | $width: 1px 10 | ) { 11 | @each $value in $directions { 12 | border-#{$value}: $width $color $style; 13 | } 14 | } 15 | 16 | @mixin border-thin-top( 17 | $color: $color-border-light, 18 | $style: solid, 19 | $width: 1px 20 | ) { 21 | @include border-thin($color, $style, top, $width); 22 | } 23 | 24 | @mixin border-thin-left( 25 | $color: $color-border-light, 26 | $style: solid, 27 | $width: 1px 28 | ) { 29 | @include border-thin($color, $style, left, $width); 30 | } 31 | 32 | @mixin border-thin-right( 33 | $color: $color-border-light, 34 | $style: solid, 35 | $width: 1px 36 | ) { 37 | @include border-thin($color, $style, right, $width); 38 | } 39 | 40 | @mixin border-thin-bottom( 41 | $color: $color-border-light, 42 | $style: solid, 43 | $width: 1px 44 | ) { 45 | @include border-thin($color, $style, bottom, $width); 46 | } 47 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/style/components/loading.scss: -------------------------------------------------------------------------------- 1 | @import '../variables/default.scss'; 2 | @import '../mixins/index.scss'; 3 | 4 | @keyframes loading { 5 | 0% { 6 | transform: rotate(0deg); 7 | } 8 | 9 | 100% { 10 | transform: rotate(360deg); 11 | } 12 | } 13 | 14 | .at-loading { 15 | display: inline-block; 16 | position: relative; 17 | width: $at-loading-size; 18 | height: $at-loading-size; 19 | 20 | &__ring { 21 | box-sizing: border-box; 22 | display: block; 23 | position: absolute; 24 | width: $at-loading-size; 25 | height: $at-loading-size; 26 | margin: 1PX; 27 | border-width: 1PX; 28 | border-style: solid; 29 | border-color: $at-loading-color transparent transparent transparent; 30 | border-radius: 50%; 31 | animation: loading 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite; 32 | 33 | &:nth-child(1) { 34 | animation-delay: -0.45s; 35 | } 36 | 37 | &:nth-child(2) { 38 | animation-delay: -0.3s; 39 | } 40 | 41 | &:nth-child(3) { 42 | animation-delay: -0.15s; 43 | } 44 | } 45 | } 46 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-docs/build/open.js: -------------------------------------------------------------------------------- 1 | const exec = require('child_process').exec 2 | 3 | module.exports = function open(target, appName, callback) { 4 | let opener 5 | 6 | if (typeof appName === 'function') { 7 | callback = appName 8 | appName = null 9 | } 10 | 11 | switch (process.platform) { 12 | case 'darwin': 13 | if (appName) { 14 | opener = `open -a "${escape(appName)}"` 15 | } else { 16 | opener = 'open' 17 | } 18 | break 19 | case 'win32': 20 | if (appName) { 21 | opener = `start "" "${escape(appName)}"` 22 | } else { 23 | opener = 'start ""' 24 | } 25 | break 26 | default: 27 | if (appName) { 28 | opener = `xdg-open "" "${escape(appName)}"` 29 | } else { 30 | opener = 'xdg-open ""' 31 | } 32 | break 33 | } 34 | 35 | if (process.env.SUDO_USER) { 36 | opener = `sudo -u ${process.env.SUDO_USER} ${opener}` 37 | } 38 | return exec(`${opener} "${escape(target)}"`, callback) 39 | } 40 | 41 | function escape(s) { 42 | return s.replace(/"/g, '\\"') 43 | } 44 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/config/formatTag.js: -------------------------------------------------------------------------------- 1 | const fs = require('fs') 2 | const { resolve } = require('path') 3 | const glob = require('glob') 4 | 5 | // 转换 小写 tag 6 | const formatTag = (file) => { 7 | let content = fs.readFileSync(file, { encoding: 'utf8' }) 8 | 9 | const matched = content.match(/<[a-z]+/g) 10 | 11 | const matchedUniq = Array.from(new Set(matched)) 12 | 13 | const comps = matchedUniq.map((item) => { 14 | const tag = item.replace('<', '').replace(/[a-z]/, (p) => p.toUpperCase()) 15 | content = content 16 | .replace(new RegExp('<' + tag, 'gi'), `<${tag}`) 17 | .replace(new RegExp(` 2 | 3 | 4 | 5 | 17 | 20 | 21 | 22 | 23 | 36 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/timeline/index.vue: -------------------------------------------------------------------------------- 1 | 32 | 33 | 37 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/types/action-sheet.d.ts: -------------------------------------------------------------------------------- 1 | import { CommonEvent } from '@tarojs/components/types/common' 2 | 3 | import AtComponent from './base' 4 | 5 | export interface AtActionSheetProps extends AtComponent { 6 | /** 7 | * 是否展示元素 8 | * @default false 9 | */ 10 | isOpened: boolean 11 | /** 12 | * 元素的标题 13 | */ 14 | title?: string 15 | /** 16 | * 取消按钮的内容 17 | */ 18 | cancelText?: string 19 | /** 20 | * 元素被关闭触发的事件 21 | */ 22 | onClose?: (event?: CommonEvent) => void 23 | /** 24 | * 点击了底部取消按钮触发的事件 25 | */ 26 | onCancel?: (event?: CommonEvent) => void 27 | } 28 | 29 | export interface AtActionSheetState { 30 | _isOpened: boolean 31 | } 32 | 33 | export interface AtActionSheetHeaderProps extends AtComponent {} 34 | 35 | export interface AtActionSheetFooterProps extends AtComponent { 36 | onClick?: Function 37 | } 38 | 39 | export interface AtActionSheetBodyProps extends AtComponent {} 40 | 41 | export interface AtActionSheetItemProps extends AtComponent { 42 | /** 43 | * 点击 Item 触发的事件 44 | */ 45 | onClick?: (event?: CommonEvent) => void 46 | } 47 | 48 | -------------------------------------------------------------------------------- /packages/taro-ui-vue-demo/src/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | Taro UI Vue 12 | 15 | 16 | 17 |
18 | 19 | 20 | -------------------------------------------------------------------------------- /packages/taro-ui-vue/src/components/textarea/index.vue: -------------------------------------------------------------------------------- 1 |