diff --git a/dist/button/index.js b/dist/button/index.js index 84f08639..5bbc0e18 100644 --- a/dist/button/index.js +++ b/dist/button/index.js @@ -36,6 +36,10 @@ Component({ block: { type: Boolean, observer + }, + square: { + type: Boolean, + observer } }, @@ -51,11 +55,12 @@ Component({ }, setClasses() { - const { type, size, plain, disabled, loading, block } = this.data; + const { type, size, plain, disabled, loading, square, block } = this.data; this.setData({ classes: classnames(`van-button--${type}`, `van-button--${size}`, { 'van-button--block': block, 'van-button--plain': plain, + 'van-button--square': square, 'van-button--loading': loading, 'van-button--disabled': disabled, 'van-button--unclickable': disabled || loading diff --git a/dist/button/index.wxss b/dist/button/index.wxss index 50eceafe..f84b5d1e 100644 --- a/dist/button/index.wxss +++ b/dist/button/index.wxss @@ -1 +1 @@ -.van-button{position:relative;padding:0;display:inline-block;height:44px;line-height:42px;border-radius:3px;box-sizing:border-box;font-size:16px;text-align:center;vertical-align:middle;-webkit-appearance:none;-webkit-text-size-adjust:100%}.van-button::after{content:" ";position:absolute;top:50%;left:50%;opacity:0;width:100%;height:100%;border:inherit;border-color:#000;background-color:#000;border-radius:inherit;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.van-button:active::after{opacity:.3}.van-button--unclickable::after{display:none}.van-button--default{color:#333;background-color:#fff;border:1px solid #e5e5e5}.van-button--primary{color:#fff;background-color:#4b0;border:1px solid #4b0}.van-button--danger{color:#fff;background-color:#f44;border:1px solid #f44}.van-button--warning{color:#fff;background-color:#f85;border:1px solid #f85}.van-button--plain{background-color:#fff}.van-button--plain.van-button--primary{color:#4b0}.van-button--plain.van-button--danger{color:#f44}.van-button--plain.van-button--warning{color:#f85}.van-button--large{width:100%;height:50px;line-height:48px}.van-button--normal{padding:0 15px;font-size:14px}.van-button--small{height:30px;padding:0 8px;min-width:60px;font-size:12px;line-height:28px}.van-button--loading .van-loading{display:inline-block}.van-button--loading .van-button__text{display:none}.van-button--mini{display:inline-block;width:50px;height:22px;line-height:20px;font-size:10px}.van-button--mini+.van-button--mini{margin-left:5px}.van-button--block{width:100%;display:block}.van-button--disabled{color:#999;background-color:#e8e8e8;border:1px solid #e5e5e5} \ No newline at end of file +.van-button{position:relative;padding:0;display:inline-block;height:44px;line-height:42px;border-radius:3px;box-sizing:border-box;font-size:16px;text-align:center;vertical-align:middle;-webkit-appearance:none;-webkit-text-size-adjust:100%}.van-button::after{content:" ";position:absolute;top:50%;left:50%;opacity:0;width:100%;height:100%;border:inherit;border-color:#000;background-color:#000;border-radius:inherit;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.van-button:active::after{opacity:.3}.van-button--unclickable::after{display:none}.van-button--default{color:#333;background-color:#fff;border:1px solid #e5e5e5}.van-button--primary{color:#fff;background-color:#4b0;border:1px solid #4b0}.van-button--danger{color:#fff;background-color:#f44;border:1px solid #f44}.van-button--warning{color:#fff;background-color:#f85;border:1px solid #f85}.van-button--plain{background-color:#fff}.van-button--plain.van-button--primary{color:#4b0}.van-button--plain.van-button--danger{color:#f44}.van-button--plain.van-button--warning{color:#f85}.van-button--large{width:100%;height:50px;line-height:48px}.van-button--normal{padding:0 15px;font-size:14px}.van-button--small{height:30px;padding:0 8px;min-width:60px;font-size:12px;line-height:28px}.van-button--loading .van-loading{display:inline-block}.van-button--loading .van-button__text{display:none}.van-button--mini{display:inline-block;width:50px;height:22px;line-height:20px;font-size:10px}.van-button--mini+.van-button--mini{margin-left:5px}.van-button--block{width:100%;display:block}.van-button--square{border-radius:0}.van-button--disabled{color:#999;background-color:#e8e8e8;border:1px solid #e5e5e5} \ No newline at end of file diff --git a/dist/field/index.js b/dist/field/index.js index 55bff46a..99481344 100644 --- a/dist/field/index.js +++ b/dist/field/index.js @@ -30,6 +30,7 @@ Component({ errorMessage: String, placeholder: String, customStyle: String, + useIconSlot: Boolean, useButtonSlot: Boolean, placeholderClass: String, cursorSpacing: { diff --git a/dist/overlay/index.js b/dist/overlay/index.js new file mode 100644 index 00000000..e2a08dc3 --- /dev/null +++ b/dist/overlay/index.js @@ -0,0 +1,11 @@ +Component({ + properties: { + show: Boolean + }, + + methods: { + onClickOverlay() { + + } + } +}); diff --git a/dist/overlay/index.json b/dist/overlay/index.json new file mode 100644 index 00000000..467ce294 --- /dev/null +++ b/dist/overlay/index.json @@ -0,0 +1,3 @@ +{ + "component": true +} diff --git a/dist/overlay/index.wxml b/dist/overlay/index.wxml new file mode 100644 index 00000000..bf46ec1c --- /dev/null +++ b/dist/overlay/index.wxml @@ -0,0 +1,5 @@ + diff --git a/dist/overlay/index.wxss b/dist/overlay/index.wxss new file mode 100644 index 00000000..e69de29b diff --git a/dist/switch/index.wxml b/dist/switch/index.wxml index 9120172e..4b719f1d 100644 --- a/dist/switch/index.wxml +++ b/dist/switch/index.wxml @@ -1,7 +1,7 @@ diff --git a/dist/tabbar-item/index.js b/dist/tabbar-item/index.js new file mode 100644 index 00000000..da38910c --- /dev/null +++ b/dist/tabbar-item/index.js @@ -0,0 +1,36 @@ +const TABBAR_PATH = '../tabbar/index'; + +Component({ + name: 'tabbar-item', + + properties: { + info: null, + icon: String, + dot: Boolean + }, + + options: { + multipleSlots: true + }, + + relations: { + [TABBAR_PATH]: { + type: 'ancestor' + } + }, + + data: { + active: false, + count: 0 + }, + + methods: { + onClick() { + const parent = this.getRelationNodes(TABBAR_PATH)[0]; + if (parent) { + parent.onChange(this); + } + this.triggerEvent('click'); + } + } +}); diff --git a/dist/tabbar-item/index.json b/dist/tabbar-item/index.json new file mode 100644 index 00000000..0a336c08 --- /dev/null +++ b/dist/tabbar-item/index.json @@ -0,0 +1,6 @@ +{ + "component": true, + "usingComponents": { + "van-icon": "../icon/index" + } +} diff --git a/dist/tabbar-item/index.wxml b/dist/tabbar-item/index.wxml new file mode 100644 index 00000000..d888e740 --- /dev/null +++ b/dist/tabbar-item/index.wxml @@ -0,0 +1,18 @@ + + + + + + + + + + + + + + diff --git a/dist/tabbar-item/index.wxss b/dist/tabbar-item/index.wxss new file mode 100644 index 00000000..1b9ea5e8 --- /dev/null +++ b/dist/tabbar-item/index.wxss @@ -0,0 +1 @@ +.van-tabbar-item{float:left;color:#666;height:100%;display:-webkit-box;display:-webkit-flex;display:flex;line-height:1;font-size:12px;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center}.van-tabbar-item__icon{font-size:18px;margin-bottom:5px;position:relative}.van-tabbar-item__icon .van-icon{display:block}.van-tabbar-item__icon--dot::after{top:0;right:-8px;width:8px;height:8px;content:' ';position:absolute;border-radius:100%;background-color:#f44}.van-tabbar-item__icon image{width:50px;height:18px}.van-tabbar-item--active{color:#38f} \ No newline at end of file diff --git a/dist/tabbar/index.js b/dist/tabbar/index.js new file mode 100644 index 00000000..c22d01be --- /dev/null +++ b/dist/tabbar/index.js @@ -0,0 +1,68 @@ +const ITEM_PATH = '../tabbar-item/index'; + +Component({ + externalClasses: ['custom-class'], + + properties: { + active: { + type: Number, + observer(active) { + this.setData({ currentActive: active }); + this.setActiveItem(); + } + }, + fixed: { + type: Boolean, + value: true + }, + zIndex: { + type: Number, + value: 1 + } + }, + + data: { + items: [], + currentActive: -1 + }, + + attached() { + this.setData({ currentActive: this.data.active }); + }, + + relations: { + [ITEM_PATH]: { + type: 'descendant', + + linked(target) { + this.data.items.push(target); + this.setActiveItem(); + }, + + unlinked(target) { + this.data.items = this.data.items.filter(item => item !== target); + this.setActiveItem(); + } + } + }, + + methods: { + setActiveItem() { + this.data.items.forEach((item, index) => { + item.setData({ + active: index === this.data.currentActive, + count: this.data.items.length + }); + }); + }, + + onChange(child) { + const active = this.data.items.indexOf(child); + if (active !== this.data.currentActive && active !== -1) { + this.triggerEvent('change', active); + this.setData({ currentActive: active }); + this.setActiveItem(); + } + } + } +}); diff --git a/dist/tabbar/index.json b/dist/tabbar/index.json new file mode 100644 index 00000000..467ce294 --- /dev/null +++ b/dist/tabbar/index.json @@ -0,0 +1,3 @@ +{ + "component": true +} diff --git a/dist/tabbar/index.wxml b/dist/tabbar/index.wxml new file mode 100644 index 00000000..18a1ed96 --- /dev/null +++ b/dist/tabbar/index.wxml @@ -0,0 +1,6 @@ + + + diff --git a/dist/tabbar/index.wxss b/dist/tabbar/index.wxss new file mode 100644 index 00000000..e1099017 --- /dev/null +++ b/dist/tabbar/index.wxss @@ -0,0 +1 @@ +.van-tabbar{width:100%;height:50px;background-color:#fff}.van-tabbar--fixed{left:0;bottom:0;position:fixed} \ No newline at end of file diff --git a/dist/toast/index.js b/dist/toast/index.js new file mode 100644 index 00000000..a64e1306 --- /dev/null +++ b/dist/toast/index.js @@ -0,0 +1,32 @@ +import Toast from './toast'; + +Component({ + properties: { + show: Boolean, + mask: Boolean, + message: String, + forbidClick: Boolean, + type: { + type: String, + value: 'text' + }, + loadingType: { + type: String, + value: 'circular' + }, + position: { + type: String, + value: 'middle' + } + }, + + methods: { + clear() { + this.setData({ + show: false + }); + } + } +}); + +export default Toast; diff --git a/dist/toast/index.json b/dist/toast/index.json new file mode 100644 index 00000000..19bf9891 --- /dev/null +++ b/dist/toast/index.json @@ -0,0 +1,8 @@ +{ + "component": true, + "usingComponents": { + "van-icon": "../icon/index", + "van-popup": "../popup/index", + "van-loading": "../loading/index" + } +} diff --git a/dist/toast/index.wxml b/dist/toast/index.wxml new file mode 100644 index 00000000..89565eca --- /dev/null +++ b/dist/toast/index.wxml @@ -0,0 +1,23 @@ + + + + {{ message }} + + + + + + {{ message }} + + diff --git a/dist/toast/index.wxss b/dist/toast/index.wxss new file mode 100644 index 00000000..d80fab77 --- /dev/null +++ b/dist/toast/index.wxss @@ -0,0 +1 @@ +.van-toast{top:50%;left:50%;display:-webkit-box;display:-webkit-flex;display:flex;position:fixed;color:#fff;font-size:12px;line-height:1.2;border-radius:5px;word-break:break-all;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;flex-direction:column;box-sizing:border-box;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);background-color:rgba(0,0,0,.7);z-index:3001}.van-toast__overlay{z-index:3000;position:fixed;top:0;left:0;right:0;bottom:0}.van-toast__overlay--mask{background-color:rgba(0,0,0,.7)}.van-toast--text{padding:12px;min-width:220px}.van-toast--icon{width:120px;min-height:120px;padding:15px}.van-toast--icon .van-toast__icon{height:1em;font-size:50px}.van-toast--icon .van-toast__text{font-size:14px;padding-top:10px}.van-toast__loading{margin:10px 0 5px}.van-toast--top{top:50px;-webkit-transform:translate(-50%,0);transform:translate(-50%,0)}.van-toast--bottom{top:auto;bottom:50px;-webkit-transform:translate(-50%,0);transform:translate(-50%,0)} \ No newline at end of file diff --git a/dist/toast/toast.js b/dist/toast/toast.js new file mode 100644 index 00000000..c72dab44 --- /dev/null +++ b/dist/toast/toast.js @@ -0,0 +1,68 @@ +import { isObj } from '../utils/index'; + +const defaultOptions = { + type: 'text', + mask: false, + message: '', + show: true, + duration: 3000, + position: 'middle', + forbidClick: false, + loadingType: 'circular', + selector: '#van-toast' +}; +const parseOptions = message => isObj(message) ? message : { message }; + +let queue = []; +let currentOptions = { ...defaultOptions }; + +function Toast(options = {}) { + options = { + ...currentOptions, + ...parseOptions(options) + }; + + const pages = getCurrentPages(); + const ctx = pages[pages.length - 1]; + + const toast = ctx.selectComponent(options.selector); + delete options.selector; + + queue.push(toast); + toast.setData(options); + clearTimeout(toast.timer); + + if (options.duration > 0) { + toast.timer = setTimeout(() => { + toast.clear(); + queue = queue.filter(item => item !== toast); + }, options.duration); + } + + return toast; +}; + +const createMethod = type => options => Toast({ + type, ...parseOptions(options) +}); + +['loading', 'success', 'fail'].forEach(method => { + Toast[method] = createMethod(method); +}); + +Toast.clear = all => { + queue.forEach(toast => { + toast.clear(); + }); + queue = []; +}; + +Toast.setDefaultOptions = options => { + Object.assign(currentOptions, options); +}; + +Toast.resetDefaultOptions = () => { + currentOptions = { ...defaultOptions }; +}; + +export default Toast; diff --git a/dist/utils/index.js b/dist/utils/index.js index 71ddfc64..44f8e829 100644 --- a/dist/utils/index.js +++ b/dist/utils/index.js @@ -7,7 +7,7 @@ function isObj(x) { return x !== null && (type === 'object' || type === 'function'); } -export { +module.exports = { isObj, isDef }; diff --git a/docs/src/Preview.vue b/docs/src/Preview.vue index 303fd2f2..585ed76c 100644 --- a/docs/src/Preview.vue +++ b/docs/src/Preview.vue @@ -34,6 +34,7 @@ const MAP = { switch: 'switch-201808092138.png', tag: 'tag-201808092138.png', tabbar: 'tabbar-201808160922.png', + toast: 'toast-201808191046.png', 'tree-select': 'tree-select-201808092138.png' };