zartui 0.1.113 → 3.0.1

package/es/multiple-picker/MultiplePickerOptions.js

@@ -1,167 +0,0 @@
-import _mergeJSXProps2 from "@vue/babel-helper-vue-jsx-merge-props";
-import _mergeJSXProps from "@vue/babel-helper-vue-jsx-merge-props";
-import { deepClone } from '../utils/deep-clone';
-import { createNamespace, isObject } from '../utils';
-
-var _createNamespace = createNamespace('multiple-picker-options'),
-    createComponent = _createNamespace[0],
-    bem = _createNamespace[1];
-
-function isOptionDisabled(option) {
-  return isObject(option) && option.disabled;
-}
-
-export default createComponent({
-  props: {
-    valueKey: String,
-    readonly: Boolean,
-    allowHtml: Boolean,
-    itemHeight: Number,
-    defaultIndexs: {
-      type: Array,
-      default: function _default() {
-        return [];
-      }
-    },
-    columnCounts: Number,
-    initialOptions: {
-      type: Array,
-      default: function _default() {
-        return [];
-      }
-    }
-  },
-  data: function data() {
-    return {
-      options: deepClone(this.initialOptions),
-      currentIndexs: [],
-      confirmed: false
-    };
-  },
-  watch: {
-    initialOptions: 'setOptions',
-    defaultIndexs: {
-      deep: true,
-      handler: function handler() {
-        this.setDefaultIndexs();
-      }
-    }
-  },
-  computed: {
-    count: function count() {
-      return this.options.length;
-    }
-  },
-  mounted: function mounted() {
-    this.setDefaultIndexs();
-  },
-  methods: {
-    setOptions: function setOptions(options) {
-      if (JSON.stringify(options) !== JSON.stringify(this.options)) {
-        this.options = deepClone(options);
-        this.setDefaultIndexs();
-      }
-    },
-    setDefaultIndexs: function setDefaultIndexs() {
-      if (this.confirmed) {
-        return;
-      }
-
-      this.currentIndexs = deepClone(this.defaultIndexs);
-    },
-    onClickItem: function onClickItem(index) {
-      var _this = this;
-
-      if (this.readonly) {
-        return;
-      }
-
-      var exist = false;
-      this.currentIndexs.forEach(function (v, i) {
-        if (v === index) {
-          exist = true;
-
-          _this.currentIndexs.splice(i, 1);
-        }
-      });
-
-      if (!exist) {
-        this.currentIndexs.push(index);
-      }
-
-      var currentOptions = [];
-      this.currentIndexs.forEach(function (index) {
-        currentOptions.push(_this.options[index]);
-      });
-      this.$emit('change');
-    },
-    getOptionText: function getOptionText(option) {
-      if (isObject(option) && this.valueKey in option) {
-        return option[this.valueKey];
-      }
-
-      return option;
-    },
-    genOptions: function genOptions() {
-      var _this2 = this;
-
-      var h = this.$createElement;
-      this.columnCounts = Number(this.columnCounts);
-
-      if (this.columnCounts && this.columnCounts > 3) {
-        this.columnCounts = 3;
-      }
-
-      if (this.columnCounts && this.columnCounts < 1) {
-        this.columnCounts = 1;
-      }
-
-      var optionStyle = {
-        height: this.itemHeight + "px",
-        width: 1 / this.columnCounts * 100 + "%"
-      };
-      return this.options.map(function (option, index) {
-        var _domProps;
-
-        var text = _this2.getOptionText(option);
-
-        var disabled = isOptionDisabled(option);
-        var data = {
-          style: optionStyle,
-          attrs: {
-            role: 'button',
-            tabindex: disabled ? -1 : 0
-          },
-          class: [bem('item', {
-            disabled: disabled,
-            selected: _this2.currentIndexs.indexOf(index) > -1,
-            last: (index + 1) % _this2.columnCounts === 0
-          })],
-          on: {
-            click: function click() {
-              _this2.onClickItem(index);
-            }
-          }
-        };
-        var childData = {
-          class: 'zt-ellipsis',
-          domProps: (_domProps = {}, _domProps[_this2.allowHtml ? 'innerHTML' : 'textContent'] = text, _domProps)
-        };
-        return h("div", _mergeJSXProps2([{}, data]), [_this2.slots('option', option) || h("div", _mergeJSXProps([{}, childData]))]);
-      });
-    },
-    setConfirmIndex: function setConfirmIndex(indexs) {
-      this.confirmed = true;
-      this.currentIndexs = deepClone(indexs);
-    }
-  },
-  render: function render() {
-    var h = arguments[0];
-    return h("div", {
-      "class": bem()
-    }, [h("div", {
-      "ref": "wrapper",
-      "class": bem('wrapper')
-    }, [this.genOptions()])]);
-  }
-});

package/es/multiple-picker/index.css

@@ -1 +0,0 @@
-[class*=zt-hairline]::after{position:absolute;box-sizing:border-box;content:' ';pointer-events:none;top:-50%;right:-50%;bottom:-50%;left:-50%;border:0 solid rgba(0,0,0,.1);-webkit-transform:scale(.5);transform:scale(.5)}.zt-hairline,.zt-hairline--bottom,.zt-hairline--left,.zt-hairline--right,.zt-hairline--surround,.zt-hairline--top,.zt-hairline--top-bottom{position:relative}.zt-hairline--top::after{border-top-width:1px}.zt-hairline--left::after{border-left-width:1px}.zt-hairline--right::after{border-right-width:1px}.zt-hairline--bottom::after{border-bottom-width:1px}.zt-hairline--top-bottom::after,.zt-hairline-unset--top-bottom::after{border-width:1px 0}.zt-hairline--surround::after{border-width:1px}.zt-multiple-picker{position:relative;background-color:#fff;-webkit-user-select:none;user-select:none}.zt-multiple-picker__toolbar{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;height:44px}.zt-multiple-picker__border{position:relative}.zt-multiple-picker__border::after{position:absolute;box-sizing:border-box;content:' ';pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid rgba(0,0,0,.1);-webkit-transform:scaleY(.5);transform:scaleY(.5)}.zt-multiple-picker__cancel,.zt-multiple-picker__confirm{height:100%;padding:0 16px;font-size:16px;background-color:transparent;border:none;cursor:pointer}.zt-multiple-picker__cancel:active,.zt-multiple-picker__confirm:active{opacity:.7}.zt-multiple-picker__confirm{color:#0091fa;font-weight:700}.zt-multiple-picker__cancel{color:#000;font-weight:400}.zt-multiple-picker__title{max-width:50%;font-weight:400;font-size:14px;line-height:20px;text-align:center;color:rgba(0,0,0,.4)}.zt-multiple-picker__header{width:100%;height:40px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;font-size:14px;font-weight:400}.zt-multiple-picker__header>li{-webkit-box-flex:1;-webkit-flex:auto;flex:auto;text-align:center}.zt-multiple-picker__options{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;cursor:grab}.zt-multiple-picker__loading{position:absolute;top:0;right:0;bottom:0;left:0;z-index:3;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;color:#0091fa;background-color:rgba(255,255,255,.9)}.zt-multiple-picker-options{-webkit-box-flex:1;-webkit-flex:1;flex:1;overflow:scroll;font-size:16px}.zt-multiple-picker-options__wrapper{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;background-color:#fff;padding:12px 16px 4px 16px}.zt-multiple-picker-options__item{color:rgba(0,0,0,.6);padding:0 4px 8px 0;box-sizing:border-box;border-radius:2px;text-align:center;font-size:14px}.zt-multiple-picker-options__item .zt-ellipsis{height:28px;line-height:28px;background-color:rgba(0,0,0,.04)}.zt-multiple-picker-options__item--disabled{cursor:not-allowed;opacity:.3}.zt-multiple-picker-options__item--last{padding-right:0}.zt-multiple-picker-options__item--selected .zt-ellipsis{background:rgba(0,145,250,.1);border:1px solid #0091fa;border-radius:2px;color:#0091fa}

package/es/multiple-picker/index.js

@@ -1,234 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-// Utils
-import { createNamespace } from '../utils';
-import { pickerProps, DEFAULT_ITEM_HEIGHT } from './shared';
-import { unitToPx } from '../utils/format/unit'; // Components
-
-import Loading from '../loading';
-import MultiplePickerOptions from './MultiplePickerOptions';
-import Popup from '../popup';
-import { PopupMixin } from '../mixins/popup';
-import { deepClone } from '../utils/deep-clone';
-
-var _createNamespace = createNamespace('multiple-picker'),
-    createComponent = _createNamespace[0],
-    bem = _createNamespace[1],
-    t = _createNamespace[2];
-
-export default createComponent({
-  mixins: [PopupMixin()],
-  props: _extends({}, pickerProps, {
-    showToolbar: {
-      type: Boolean,
-      default: true
-    },
-    defaultIndexs: {
-      type: Array,
-      default: function _default() {
-        return [];
-      }
-    },
-    options: {
-      type: Array,
-      default: function _default() {
-        return [];
-      }
-    },
-    toolbarPosition: {
-      type: String,
-      default: 'top'
-    },
-    valueKey: {
-      type: String,
-      default: 'text'
-    },
-    columnCounts: {
-      type: Number,
-      default: 3
-    }
-  }),
-  data: function data() {
-    return {
-      confirmIndexs: null
-    };
-  },
-  watch: {
-    showPicker: {
-      handler: function handler(val) {
-        var _this = this;
-
-        if (val) {
-          this.$nextTick(function () {
-            if (_this.$refs.pickerOptions && _this.confirmIndexs) {
-              _this.$refs.pickerOptions.setConfirmIndex(_this.confirmIndexs);
-            } else if (!_this.confirmIndexs && _this.defaultIndexs && _this.defaultIndexs.length === 0) {
-              _this.$refs.pickerOptions.setConfirmIndex([]);
-            }
-          });
-        }
-      },
-      immediate: true
-    }
-  },
-  computed: {
-    itemPxHeight: function itemPxHeight() {
-      return this.itemHeight ? unitToPx(this.itemHeight) : DEFAULT_ITEM_HEIGHT;
-    }
-  },
-  methods: {
-    onClickOverlay: function onClickOverlay() {
-      if (this.closeOnClickOverlay) {
-        this.cancel();
-      }
-    },
-    emit: function emit(event) {
-      this.$emit(event, this.getOptions());
-    },
-    getOptions: function getOptions() {
-      var _this2 = this;
-
-      var indexs = this.$refs.pickerOptions.currentIndexs;
-      var result = [];
-      indexs.forEach(function (index) {
-        result.push(_extends({}, _this2.options[index], {
-          initialIndex: index
-        }));
-      });
-      return result;
-    },
-    onChange: function onChange() {
-      this.$emit('change', this.getOptions());
-    },
-    cancel: function cancel() {
-      this.emit('cancel');
-    },
-    confirm: function confirm() {
-      var options = this.getOptions();
-      this.confirmIndexs = options.map(function (v) {
-        return v.initialIndex;
-      });
-      this.emit('confirm', options);
-    },
-    genTitle: function genTitle() {
-      var h = this.$createElement;
-      var titleSlot = this.slots('title');
-
-      if (titleSlot) {
-        return titleSlot;
-      }
-
-      if (this.title) {
-        return h("div", {
-          "class": ['zt-ellipsis', bem('title')]
-        }, [this.title]);
-      }
-    },
-    genCancel: function genCancel() {
-      var h = this.$createElement;
-      return h("button", {
-        "attrs": {
-          "type": "button"
-        },
-        "class": bem('cancel'),
-        "on": {
-          "click": this.cancel
-        }
-      }, [this.slots('cancel') || this.cancelButtonText || t('cancel')]);
-    },
-    genConfirm: function genConfirm() {
-      var h = this.$createElement;
-      return h("button", {
-        "attrs": {
-          "type": "button"
-        },
-        "class": bem('confirm'),
-        "on": {
-          "click": this.confirm
-        }
-      }, [this.slots('confirm') || this.confirmButtonText || t('confirm')]);
-    },
-    genToolbar: function genToolbar() {
-      var h = this.$createElement;
-
-      if (this.showToolbar) {
-        return h("div", {
-          "class": bem('toolbar')
-        }, [this.slots() || [this.genCancel(), this.genTitle(), this.genConfirm()]]);
-      }
-    },
-    genOptions: function genOptions() {
-      var h = this.$createElement;
-      var rowsCount = Math.ceil(this.options.length / this.columnCounts);
-      var wrapHeight = 196;
-
-      if (rowsCount > 5) {
-        wrapHeight = 460;
-      }
-
-      var optionsStyle = {
-        height: wrapHeight + "px"
-      };
-      return h("div", {
-        "class": bem('options'),
-        "style": optionsStyle
-      }, [this.genOptionItems()]);
-    },
-    genOptionItems: function genOptionItems() {
-      var _this3 = this;
-
-      var h = this.$createElement;
-      var formatOptions = [];
-
-      if (this.options && this.options[0] && typeof this.options[0] !== 'object') {
-        formatOptions = this.options.map(function (v) {
-          return {
-            value: v,
-            text: v
-          };
-        });
-      } else {
-        formatOptions = this.options;
-      }
-
-      return h(MultiplePickerOptions, {
-        "ref": "pickerOptions",
-        "attrs": {
-          "readonly": this.readonly,
-          "valueKey": this.valueKey,
-          "allowHtml": this.allowHtml,
-          "itemHeight": this.itemPxHeight,
-          "defaultIndexs": this.defaultIndexs,
-          "initialOptions": formatOptions,
-          "columnCounts": this.columnCounts
-        },
-        "scopedSlots": {
-          option: this.$scopedSlots.option
-        },
-        "on": {
-          "change": function change() {
-            _this3.onChange();
-          }
-        }
-      });
-    }
-  },
-  render: function render(h) {
-    return h(Popup, {
-      "attrs": {
-        "value": this.showPicker,
-        "round": true,
-        "position": "bottom",
-        "closeOnPopstate": this.closeOnPopstate,
-        "closeOnClickOverlay": this.closeOnClickOverlay,
-        "customOnClickOverlay": this.onClickOverlay
-      }
-    }, [h("div", {
-      "class": bem(),
-      "ref": 'columnParent'
-    }, [this.toolbarPosition === 'top' ? this.genToolbar() : h(), this.toolbarPosition === 'top' ? h("div", {
-      "class": bem('border')
-    }) : h(), this.loading ? h(Loading, {
-      "class": bem('loading')
-    }) : h(), this.genOptions(), this.toolbarPosition === 'bottom' ? this.genToolbar() : h()])]);
-  }
-});

package/es/multiple-picker/index.less

@@ -1,135 +0,0 @@
-@import '../style/var';
-@import '../style/hairline';
-
-.zt-multiple-picker {
-  position: relative;
-  background-color: @picker-background-color;
-  user-select: none;
-
-  &__toolbar {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    height: @picker-toolbar-height;
-  }
-
-  &__border {
-    position: relative;
-  }
-
-  &__border::after {
-    .hairline-bottom();
-  }
-
-  &__cancel,
-  &__confirm {
-    height: 100%;
-    padding: @picker-action-padding;
-    font-size: @picker-action-font-size;
-    background-color: transparent;
-    border: none;
-    cursor: pointer;
-
-    &:active {
-      opacity: @active-opacity;
-    }
-  }
-
-  &__confirm {
-    color: @picker-confirm-action-color;
-    font-weight: @picker-confirm-action-font-weight;
-  }
-
-  &__cancel {
-    color: @picker-cancel-action-color;
-    font-weight: @picker-cancel-action-font-weight;
-  }
-
-  &__title {
-    max-width: 50%;
-    font-weight: @plain-font-weight;
-    font-size: @picker-title-font-size;
-    line-height: @picker-title-line-height;
-    text-align: center;
-    color: rgba(0, 0, 0, 0.4);
-  }
-
-  &__header {
-    width: 100%;
-    height: 40px;
-    display: flex;
-    align-items: center;
-    font-size: @picker-title-font-size;
-    font-weight: @plain-font-weight;
-
-    >li {
-      flex: auto;
-      text-align: center;
-    }
-  }
-
-  &__options {
-    position: relative;
-    display: flex;
-    cursor: grab;
-  }
-
-  &__loading {
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    z-index: 3;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    color: @picker-loading-icon-color;
-    background-color: @picker-loading-mask-color;
-  }
-
-  &-options {
-    flex: 1;
-    overflow: scroll;
-    font-size: @picker-option-font-size;
-
-    &__wrapper {
-      display: flex;
-      flex-wrap: wrap;
-      background-color: #fff;
-      padding: @multiple-picker-warpper-padding;
-    }
-
-    &__item {
-      color: @multiple-picker-option-text-color;
-      padding: 0 4px 8px 0;
-      box-sizing: border-box;
-      border-radius: 2px;
-      text-align: center;
-      font-size: 14px;
-      .zt-ellipsis {
-        height: 28px;
-        line-height: 28px;
-        background-color: rgba(0,0,0,.04);
-      }
-
-      &--disabled {
-        cursor: not-allowed;
-        opacity: @picker-option-disabled-opacity;
-      }
-
-      &--last {
-        padding-right: 0;
-      }
-
-      &--selected {
-        .zt-ellipsis {
-          background: rgba(0,145,250,0.10);
-          border: 1px solid #0091FA;
-          border-radius: 2px;
-          color: #0091FA;
-        }
-      }
-    }
-  }
-}

package/es/multiple-picker/shared.js

@@ -1,26 +0,0 @@
-export var DEFAULT_ITEM_HEIGHT = 36;
-export var pickerProps = {
-  title: String,
-  loading: Boolean,
-  readonly: Boolean,
-  itemHeight: [Number, String],
-  showToolbar: Boolean,
-  cancelButtonText: String,
-  confirmButtonText: String,
-  showPicker: {
-    type: Boolean,
-    default: false
-  },
-  allowHtml: {
-    type: Boolean,
-    default: true
-  },
-  closeOnPopstate: {
-    type: Boolean,
-    default: true
-  },
-  closeOnClickOverlay: {
-    type: Boolean,
-    default: true
-  }
-};

package/es/multiple-picker/style/index.js

@@ -1,7 +0,0 @@
-import '../../style/base.css';
-import '../../overlay/index.css';
-import '../../info/index.css';
-import '../../icon/index.css';
-import '../../popup/index.css';
-import '../../loading/index.css';
-import '../index.css';

package/es/multiple-picker/style/less.js

@@ -1,7 +0,0 @@
-import '../../style/base.less';
-import '../../overlay/index.less';
-import '../../info/index.less';
-import '../../icon/index.less';
-import '../../popup/index.less';
-import '../../loading/index.less';
-import '../index.less';

package/es/nav-bar/index.css

@@ -1 +0,0 @@
-.zt-nav-bar{position:relative;z-index:1;line-height:22px;text-align:center;background-color:#fff;-webkit-user-select:none;user-select:none}.zt-nav-bar--fixed{position:fixed;top:0;left:0;width:100%}.zt-nav-bar--safe-area-inset-top{padding-top:constant(safe-area-inset-top);padding-top:env(safe-area-inset-top)}.zt-nav-bar .zt-icon{color:#0091fa}.zt-nav-bar__content{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;height:44px}.zt-nav-bar__arrow{margin-right:4px;font-size:16px}.zt-nav-bar__title{max-width:60%;margin:0 auto;color:rgba(0,0,0,.6);font-weight:700;font-size:16px}.zt-nav-bar__left,.zt-nav-bar__right{position:absolute;top:0;bottom:0;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;padding:0 16px;font-size:14px;cursor:pointer}.zt-nav-bar__left:active,.zt-nav-bar__right:active{opacity:.7}.zt-nav-bar__left{left:0}.zt-nav-bar__right{right:0}.zt-nav-bar__text{color:#0091fa}