@emhome/meeui-mp 1.11.7

package/dist/mixins/transition.js

@@ -0,0 +1,136 @@
+// @ts-nocheck
+import { requestAnimationFrame } from '../common/utils';
+import { isObj } from '../common/validator';
+const getClassNames = (name) => ({
+    enter: `mee-${name}-enter mee-${name}-enter-active enter-class enter-active-class`,
+    'enter-to': `mee-${name}-enter-to mee-${name}-enter-active enter-to-class enter-active-class`,
+    leave: `mee-${name}-leave mee-${name}-leave-active leave-class leave-active-class`,
+    'leave-to': `mee-${name}-leave-to mee-${name}-leave-active leave-to-class leave-active-class`,
+});
+export function transition(showDefaultValue) {
+    return Behavior({
+        properties: {
+            customStyle: String,
+            // @ts-ignore
+            show: {
+                type: Boolean,
+                value: showDefaultValue,
+                observer: 'observeShow',
+            },
+            // @ts-ignore
+            duration: {
+                type: null,
+                value: 300,
+            },
+            name: {
+                type: String,
+                value: 'fade',
+            },
+        },
+        data: {
+            type: '',
+            inited: false,
+            display: false,
+        },
+        ready() {
+            if (this.data.show === true) {
+                this.observeShow(true, false);
+            }
+        },
+        methods: {
+            observeShow(value, old) {
+                if (value === old) {
+                    return;
+                }
+                value ? this.enureEnter() : this.enureLeave();
+            },
+            enureEnter() {
+                if (this.enterPromise)
+                    return;
+                this.enterPromise = new Promise((resolve) => this.enter(resolve));
+            },
+            enureLeave() {
+                const { enterPromise } = this;
+                if (!enterPromise)
+                    return;
+                enterPromise
+                    .then(() => new Promise((resolve) => this.leave(resolve)))
+                    .then(() => {
+                    this.enterPromise = null;
+                });
+            },
+            enter(resolve) {
+                const { duration, name } = this.data;
+                const classNames = getClassNames(name);
+                const currentDuration = isObj(duration) ? duration.enter : duration;
+                if (this.status === 'enter') {
+                    return;
+                }
+                this.status = 'enter';
+                this.$emit('before-enter');
+                requestAnimationFrame(() => {
+                    if (this.status !== 'enter') {
+                        return;
+                    }
+                    this.$emit('enter');
+                    this.setData({
+                        inited: true,
+                        display: true,
+                        classes: classNames.enter,
+                        currentDuration,
+                    });
+                    requestAnimationFrame(() => {
+                        if (this.status !== 'enter') {
+                            return;
+                        }
+                        this.transitionEnded = false;
+                        this.setData({ classes: classNames['enter-to'] });
+                        resolve();
+                    });
+                });
+            },
+            leave(resolve) {
+                if (!this.data.display) {
+                    return;
+                }
+                const { duration, name } = this.data;
+                const classNames = getClassNames(name);
+                const currentDuration = isObj(duration) ? duration.leave : duration;
+                this.status = 'leave';
+                this.$emit('before-leave');
+                requestAnimationFrame(() => {
+                    if (this.status !== 'leave') {
+                        return;
+                    }
+                    this.$emit('leave');
+                    this.setData({
+                        classes: classNames.leave,
+                        currentDuration,
+                    });
+                    requestAnimationFrame(() => {
+                        if (this.status !== 'leave') {
+                            return;
+                        }
+                        this.transitionEnded = false;
+                        setTimeout(() => {
+                            this.onTransitionEnd();
+                            resolve();
+                        }, currentDuration);
+                        this.setData({ classes: classNames['leave-to'] });
+                    });
+                });
+            },
+            onTransitionEnd() {
+                if (this.transitionEnded) {
+                    return;
+                }
+                this.transitionEnded = true;
+                this.$emit(`after-${this.status}`);
+                const { show, display } = this.data;
+                if (!show && display) {
+                    this.setData({ display: false });
+                }
+            },
+        },
+    });
+}

package/dist/nav-bar/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/nav-bar/index.js

@@ -0,0 +1,65 @@
+import { MeeComponent } from '../common/component';
+import { getRect, getSystemInfoSync } from '../common/utils';
+MeeComponent({
+    classes: ['title-class'],
+    props: {
+        title: String,
+        fixed: {
+            type: Boolean,
+            observer: 'setHeight',
+        },
+        placeholder: {
+            type: Boolean,
+            observer: 'setHeight',
+        },
+        leftText: String,
+        rightText: String,
+        customStyle: String,
+        leftArrow: Boolean,
+        border: {
+            type: Boolean,
+            value: true,
+        },
+        zIndex: {
+            type: Number,
+            value: 1,
+        },
+        safeAreaInsetTop: {
+            type: Boolean,
+            value: true,
+        },
+    },
+    data: {
+        height: 46,
+    },
+    created() {
+        const { statusBarHeight } = getSystemInfoSync();
+        this.setData({
+            statusBarHeight,
+            height: 46 + statusBarHeight,
+        });
+    },
+    mounted() {
+        this.setHeight();
+    },
+    methods: {
+        onClickLeft() {
+            this.$emit('click-left');
+        },
+        onClickRight() {
+            this.$emit('click-right');
+        },
+        setHeight() {
+            if (!this.data.fixed || !this.data.placeholder) {
+                return;
+            }
+            wx.nextTick(() => {
+                getRect(this, '.mee-nav-bar').then((res) => {
+                    if (res && 'height' in res) {
+                        this.setData({ height: res.height });
+                    }
+                });
+            });
+        },
+    },
+});

package/dist/nav-bar/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "mee-icon": "../icon/index"
+  }
+}

package/dist/nav-bar/index.wxml

@@ -0,0 +1,42 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+
+<view wx:if="{{ fixed && placeholder }}" style="height: {{ height }}px;" />
+
+<view
+  class="{{ utils.bem('nav-bar', { fixed }) }} custom-class {{ border ? 'mee-hairline--bottom' : '' }}"
+  style="{{ computed.barStyle({ zIndex, statusBarHeight, safeAreaInsetTop }) }}; {{ customStyle }}"
+>
+  <view class="mee-nav-bar__content">
+    <view class="mee-nav-bar__left" bind:tap="onClickLeft">
+      <block wx:if="{{ leftArrow || leftText }}">
+        <mee-icon
+          wx:if="{{ leftArrow }}"
+          size="16px"
+          name="arrow-left"
+          custom-class="mee-nav-bar__arrow"
+        />
+        <view
+          wx:if="{{ leftText }}"
+          class="mee-nav-bar__text"
+          hover-class="mee-nav-bar__text--hover"
+          hover-stay-time="70"
+        >{{ leftText }}</view>
+      </block>
+      <slot wx:else name="left" />
+    </view>
+    <view class="mee-nav-bar__title title-class mee-ellipsis">
+      <block wx:if="{{ title }}">{{ title }}</block>
+      <slot wx:else name="title" />
+    </view>
+    <view class="mee-nav-bar__right" bind:tap="onClickRight">
+      <view
+        wx:if="{{ rightText }}"
+        class="mee-nav-bar__text"
+        hover-class="mee-nav-bar__text--hover"
+        hover-stay-time="70"
+      >{{ rightText }}</view>
+      <slot wx:else name="right" />
+    </view>
+  </view>
+</view>

package/dist/nav-bar/index.wxs

@@ -0,0 +1,13 @@
+/* eslint-disable */
+var style = require('../wxs/style.wxs');
+
+function barStyle(data) {
+  return style({
+    'z-index': data.zIndex,
+    'padding-top': data.safeAreaInsetTop ? data.statusBarHeight + 'px' : 0,
+  });
+}
+
+module.exports = {
+  barStyle: barStyle,
+};

package/dist/nav-bar/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.mee-nav-bar{background-color:var(--nav-bar-background-color,#fff);box-sizing:initial;height:var(--nav-bar-height,46px);line-height:var(--nav-bar-height,46px);position:relative;text-align:center;-webkit-user-select:none;user-select:none}.mee-nav-bar__content{height:100%;position:relative}.mee-nav-bar__text{color:var(--nav-bar-text-color,#1989fa);display:inline-block;margin:0 calc(var(--padding-md, 16px)*-1);padding:0 var(--padding-md,16px);vertical-align:middle}.mee-nav-bar__text--hover{background-color:#f2f3f5}.mee-nav-bar__arrow{color:var(--nav-bar-icon-color,#1989fa)!important;font-size:var(--nav-bar-arrow-size,16px)!important;vertical-align:middle}.mee-nav-bar__arrow+.mee-nav-bar__text{margin-left:-20px;padding-left:25px}.mee-nav-bar--fixed{left:0;position:fixed;top:0;width:100%}.mee-nav-bar__title{color:var(--nav-bar-title-text-color,#323233);font-size:var(--nav-bar-title-font-size,16px);font-weight:var(--font-weight-bold,500);margin:0 auto;max-width:60%}.mee-nav-bar__left,.mee-nav-bar__right{align-items:center;bottom:0;display:flex;font-size:var(--font-size-md,14px);position:absolute;top:0}.mee-nav-bar__left{left:var(--padding-md,16px)}.mee-nav-bar__right{right:var(--padding-md,16px)}

package/dist/notice-bar/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/notice-bar/index.js

@@ -0,0 +1,132 @@
+import { MeeComponent } from '../common/component';
+import { getRect, requestAnimationFrame } from '../common/utils';
+MeeComponent({
+    props: {
+        text: {
+            type: String,
+            value: '',
+            observer: 'init',
+        },
+        mode: {
+            type: String,
+            value: '',
+        },
+        url: {
+            type: String,
+            value: '',
+        },
+        openType: {
+            type: String,
+            value: 'navigate',
+        },
+        delay: {
+            type: Number,
+            value: 1,
+        },
+        speed: {
+            type: Number,
+            value: 60,
+            observer: 'init',
+        },
+        scrollable: null,
+        leftIcon: {
+            type: String,
+            value: '',
+        },
+        color: String,
+        backgroundColor: String,
+        background: String,
+        wrapable: Boolean,
+    },
+    data: {
+        show: true,
+    },
+    created() {
+        this.resetAnimation = wx.createAnimation({
+            duration: 0,
+            timingFunction: 'linear',
+        });
+    },
+    destroyed() {
+        this.timer && clearTimeout(this.timer);
+    },
+    mounted() {
+        this.init();
+    },
+    methods: {
+        init() {
+            requestAnimationFrame(() => {
+                Promise.all([
+                    getRect(this, '.mee-notice-bar__content'),
+                    getRect(this, '.mee-notice-bar__wrap'),
+                ]).then((rects) => {
+                    const [contentRect, wrapRect] = rects;
+                    const { scrollable } = this.data;
+                    if (contentRect == null ||
+                        wrapRect == null ||
+                        !contentRect.width ||
+                        !wrapRect.width ||
+                        scrollable === false) {
+                        return;
+                    }
+                    if (scrollable || wrapRect.width < contentRect.width) {
+                        this.initAnimation(wrapRect.width, contentRect.width);
+                        this.scroll(true);
+                    }
+                    else {
+                        this.reset();
+                    }
+                });
+            });
+        },
+        initAnimation(warpWidth, contentWidth) {
+            const { speed, delay } = this.data;
+            this.wrapWidth = warpWidth;
+            this.contentWidth = contentWidth;
+            // begin 0
+            this.contentDuration = (contentWidth / speed) * 1000;
+            // begin -wrapWidth
+            this.duration = ((warpWidth + contentWidth) / speed) * 1000;
+            this.animation = wx.createAnimation({
+                duration: this.contentDuration,
+                timingFunction: 'linear',
+                delay,
+            });
+        },
+        reset(x = 0) {
+            if (this.timer) {
+                clearTimeout(this.timer);
+                this.timer = null;
+            }
+            this.setData({
+                animationData: this.resetAnimation.translateX(x).step().export(),
+            });
+        },
+        scroll(isInit = false) {
+            this.reset(isInit ? 0 : this.wrapWidth);
+            const duration = isInit ? this.contentDuration : this.duration;
+            requestAnimationFrame(() => {
+                this.setData({
+                    animationData: this.animation
+                        .translateX(-this.contentWidth)
+                        .step({ duration })
+                        .export(),
+                });
+            });
+            this.timer = setTimeout(() => {
+                this.scroll();
+            }, duration + this.data.delay);
+        },
+        onClickIcon(event) {
+            if (this.data.mode === 'closeable') {
+                this.timer && clearTimeout(this.timer);
+                this.timer = null;
+                this.setData({ show: false });
+                this.$emit('close', event.detail);
+            }
+        },
+        onClick(event) {
+            this.$emit('click', event);
+        },
+    },
+});

package/dist/notice-bar/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "mee-icon": "../icon/index"
+  }
+}

package/dist/notice-bar/index.wxml

@@ -0,0 +1,38 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+
+<view
+  wx:if="{{ show }}"
+  class="custom-class {{ utils.bem('notice-bar', { withicon: mode, wrapable }) }}"
+  style="{{ computed.rootStyle({ color, backgroundColor, background }) }}"
+  bind:tap="onClick"
+>
+  <mee-icon
+    wx:if="{{ leftIcon }}"
+    name="{{ leftIcon }}"
+    class="mee-notice-bar__left-icon"
+  />
+  <slot wx:else name="left-icon" />
+
+  <view class="mee-notice-bar__wrap">
+    <view class="mee-notice-bar__content {{ scrollable === false && !wrapable ? 'mee-ellipsis' : '' }}" animation="{{ animationData }}">
+      {{ text }}
+      <slot wx:if="{{ !text }}"></slot>
+    </view>
+  </view>
+
+  <mee-icon
+    wx:if="{{ mode === 'closeable' }}"
+    class="mee-notice-bar__right-icon"
+    name="cross"
+    catch:tap="onClickIcon"
+  />
+  <navigator
+    wx:elif="{{ mode === 'link' }}"
+    url="{{ url }}"
+    open-type="{{ openType }}"
+  >
+    <mee-icon class="mee-notice-bar__right-icon" name="arrow" />
+  </navigator>
+  <slot wx:else name="right-icon" />
+</view>

package/dist/notice-bar/index.wxs

@@ -0,0 +1,15 @@
+/* eslint-disable */
+var style = require('../wxs/style.wxs');
+var addUnit = require('../wxs/add-unit.wxs');
+
+function rootStyle(data) {
+  return style({
+    color: data.color,
+    'background-color': data.backgroundColor,
+    background: data.background,
+  });
+}
+
+module.exports = {
+  rootStyle: rootStyle,
+};

package/dist/notice-bar/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.mee-notice-bar{align-items:center;background-color:var(--notice-bar-background-color,#fffbe8);color:var(--notice-bar-text-color,#ed6a0c);display:flex;font-size:var(--notice-bar-font-size,14px);height:var(--notice-bar-height,40px);line-height:var(--notice-bar-line-height,24px);padding:var(--notice-bar-padding,0 16px)}.mee-notice-bar--withicon{padding-right:40px;position:relative}.mee-notice-bar--wrapable{height:auto;padding:var(--notice-bar-wrapable-padding,8px 16px)}.mee-notice-bar--wrapable .mee-notice-bar__wrap{height:auto}.mee-notice-bar--wrapable .mee-notice-bar__content{position:relative;white-space:normal}.mee-notice-bar__left-icon{align-items:center;display:flex;margin-right:4px;vertical-align:middle}.mee-notice-bar__left-icon,.mee-notice-bar__right-icon{font-size:var(--notice-bar-icon-size,16px);min-width:var(--notice-bar-icon-min-width,22px)}.mee-notice-bar__right-icon{position:absolute;right:15px;top:10px}.mee-notice-bar__wrap{flex:1;height:var(--notice-bar-line-height,24px);overflow:hidden;position:relative}.mee-notice-bar__content{position:absolute;white-space:nowrap}.mee-notice-bar__content.mee-ellipsis{max-width:100%}

package/dist/notify/index.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/notify/index.js

@@ -0,0 +1,65 @@
+import { MeeComponent } from '../common/component';
+import { WHITE } from '../common/color';
+import { getSystemInfoSync } from '../common/utils';
+MeeComponent({
+    props: {
+        message: String,
+        background: String,
+        type: {
+            type: String,
+            value: 'danger',
+        },
+        color: {
+            type: String,
+            value: WHITE,
+        },
+        duration: {
+            type: Number,
+            value: 3000,
+        },
+        zIndex: {
+            type: Number,
+            value: 110,
+        },
+        safeAreaInsetTop: {
+            type: Boolean,
+            value: false,
+        },
+        top: null,
+    },
+    data: {
+        show: false,
+        onOpened: null,
+        onClose: null,
+        onClick: null,
+    },
+    created() {
+        const { statusBarHeight } = getSystemInfoSync();
+        this.setData({ statusBarHeight });
+    },
+    methods: {
+        show() {
+            const { duration, onOpened } = this.data;
+            clearTimeout(this.timer);
+            this.setData({ show: true });
+            wx.nextTick(onOpened);
+            if (duration > 0 && duration !== Infinity) {
+                this.timer = setTimeout(() => {
+                    this.hide();
+                }, duration);
+            }
+        },
+        hide() {
+            const { onClose } = this.data;
+            clearTimeout(this.timer);
+            this.setData({ show: false });
+            wx.nextTick(onClose);
+        },
+        onTap(event) {
+            const { onClick } = this.data;
+            if (onClick) {
+                onClick(event.detail);
+            }
+        },
+    },
+});

package/dist/notify/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "mee-transition": "../transition/index"
+  }
+}

package/dist/notify/index.wxml

@@ -0,0 +1,21 @@
+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="computed" />
+
+<mee-transition
+  name="slide-down"
+  show="{{ show }}"
+  custom-class="mee-notify__container"
+  custom-style="{{ computed.rootStyle({ zIndex, top }) }}"
+  bind:tap="onTap"
+>
+  <view
+    class="mee-notify mee-notify--{{ type }}"
+    style="{{ computed.notifyStyle({ background, color }) }}"
+  >
+    <view
+      wx:if="{{ safeAreaInsetTop }}"
+      style="height: {{ statusBarHeight }}px"
+    />
+    <text>{{ message }}</text>
+  </view>
+</mee-transition>

package/dist/notify/index.wxs

@@ -0,0 +1,22 @@
+/* eslint-disable */
+var style = require('../wxs/style.wxs');
+var addUnit = require('../wxs/add-unit.wxs');
+
+function rootStyle(data) {
+  return style({
+    'z-index': data.zIndex,
+    top: addUnit(data.top),
+  });
+}
+
+function notifyStyle(data) {
+  return style({
+    background: data.background,
+    color: data.color,
+  });
+}
+
+module.exports = {
+  rootStyle: rootStyle,
+  notifyStyle: notifyStyle,
+};

package/dist/notify/index.wxss

@@ -0,0 +1 @@
+@import '../common/index.wxss';.mee-notify{word-wrap:break-word;font-size:var(--notify-font-size,14px);line-height:var(--notify-line-height,20px);padding:var(--notify-padding,6px 15px);text-align:center}.mee-notify__container{box-sizing:border-box;left:0;position:fixed;top:0;width:100%}.mee-notify--primary{background-color:var(--notify-primary-background-color,#1989fa)}.mee-notify--success{background-color:var(--notify-success-background-color,#07c160)}.mee-notify--danger{background-color:var(--notify-danger-background-color,#ee0a24)}.mee-notify--warning{background-color:var(--notify-warning-background-color,#ff976a)}

package/dist/notify/notify.d.ts

@@ -0,0 +1,22 @@
+interface NotifyOptions {
+    type?: 'primary' | 'success' | 'danger' | 'warning';
+    color?: string;
+    zIndex?: number;
+    top?: number;
+    message: string;
+    context?: any;
+    duration?: number;
+    selector?: string;
+    background?: string;
+    safeAreaInsetTop?: boolean;
+    onClick?: () => void;
+    onOpened?: () => void;
+    onClose?: () => void;
+}
+declare function Notify(options: NotifyOptions | string): any;
+declare namespace Notify {
+    var clear: (options?: NotifyOptions | undefined) => void;
+    var setDefaultOptions: (options: NotifyOptions) => void;
+    var resetDefaultOptions: () => void;
+}
+export default Notify;

package/dist/notify/notify.js

@@ -0,0 +1,53 @@
+import { WHITE } from '../common/color';
+const defaultOptions = {
+    selector: '#mee-notify',
+    type: 'danger',
+    message: '',
+    background: '',
+    duration: 3000,
+    zIndex: 110,
+    top: 0,
+    color: WHITE,
+    safeAreaInsetTop: false,
+    onClick: () => { },
+    onOpened: () => { },
+    onClose: () => { },
+};
+let currentOptions = Object.assign({}, defaultOptions);
+function parseOptions(message) {
+    if (message == null) {
+        return {};
+    }
+    return typeof message === 'string' ? { message } : message;
+}
+function getContext() {
+    const pages = getCurrentPages();
+    return pages[pages.length - 1];
+}
+export default function Notify(options) {
+    options = Object.assign(Object.assign({}, currentOptions), parseOptions(options));
+    const context = options.context || getContext();
+    const notify = context.selectComponent(options.selector);
+    delete options.context;
+    delete options.selector;
+    if (notify) {
+        notify.setData(options);
+        notify.show();
+        return notify;
+    }
+    console.warn('未找到 mee-notify 节点，请确认 selector 及 context 是否正确');
+}
+Notify.clear = function (options) {
+    options = Object.assign(Object.assign({}, defaultOptions), parseOptions(options));
+    const context = options.context || getContext();
+    const notify = context.selectComponent(options.selector);
+    if (notify) {
+        notify.hide();
+    }
+};
+Notify.setDefaultOptions = (options) => {
+    Object.assign(currentOptions, options);
+};
+Notify.resetDefaultOptions = () => {
+    currentOptions = Object.assign({}, defaultOptions);
+};

package/dist/overlay/index.d.ts

@@ -0,0 +1 @@
+export {};