zartui 0.1.113 → 3.0.1

package/es/picker/index.js

@@ -1,450 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-// Utils
-import { createNamespace } from '../utils';
-import { preventDefault } from '../utils/dom/event';
-import { pickerProps, DEFAULT_ITEM_HEIGHT } from './shared';
-import { unitToPx } from '../utils/format/unit'; // Components
-
-import Loading from '../loading';
-import PickerColumn from './PickerColumn';
-import Popup from '../popup';
-import { PopupMixin } from '../mixins/popup';
-
-var _createNamespace = createNamespace('picker'),
-    createComponent = _createNamespace[0],
-    bem = _createNamespace[1],
-    t = _createNamespace[2];
-
-export default createComponent({
-  mixins: [PopupMixin()],
-  props: _extends({}, pickerProps, {
-    showToolbar: {
-      type: Boolean,
-      default: true
-    },
-    defaultIndex: {
-      type: [Number, String],
-      default: 0
-    },
-    columns: {
-      type: Array,
-      default: function _default() {
-        return [];
-      }
-    },
-    headers: {
-      type: Array,
-      default: null
-    },
-    toolbarPosition: {
-      type: String,
-      default: 'top'
-    },
-    valueKey: {
-      type: String,
-      default: 'text'
-    }
-  }),
-  data: function data() {
-    return {
-      children: [],
-      formattedColumns: [],
-      confirmIndex: ""
-    };
-  },
-  computed: {
-    itemPxHeight: function itemPxHeight() {
-      return this.itemHeight ? unitToPx(this.itemHeight) : DEFAULT_ITEM_HEIGHT;
-    },
-    dataType: function dataType() {
-      var columns = this.columns;
-      var firstColumn = columns[0] || {};
-
-      if (firstColumn.children) {
-        return 'cascade';
-      }
-
-      if (firstColumn.values) {
-        return 'object';
-      }
-
-      return 'text';
-    }
-  },
-  watch: {
-    columns: {
-      handler: 'format',
-      immediate: true
-    },
-    showPicker: {
-      handler: function handler(val) {
-        var _this = this;
-
-        if (val) {
-          this.$nextTick(function () {
-            _this.children.forEach(function (child) {
-              if (child.confirmIndex !== "") {
-                child.setConfirmIndex();
-              }
-            });
-          });
-        }
-      },
-      immediate: true
-    }
-  },
-  methods: {
-    onClickOverlay: function onClickOverlay() {
-      if (this.closeOnClickOverlay) {
-        this.cancel();
-      }
-    },
-    format: function format() {
-      var columns = this.columns,
-          dataType = this.dataType;
-
-      if (dataType === 'text') {
-        this.formattedColumns = [{
-          values: columns
-        }];
-      } else if (dataType === 'cascade') {
-        this.formatCascade();
-      } else {
-        this.formattedColumns = columns;
-      }
-    },
-    formatCascade: function formatCascade() {
-      var formatted = [];
-      var cursor = {
-        children: this.columns
-      };
-
-      while (cursor && cursor.children) {
-        var _cursor$defaultIndex;
-
-        var _cursor = cursor,
-            children = _cursor.children;
-        var defaultIndex = (_cursor$defaultIndex = cursor.defaultIndex) != null ? _cursor$defaultIndex : +this.defaultIndex;
-
-        while (children[defaultIndex] && children[defaultIndex].disabled) {
-          if (defaultIndex < children.length - 1) {
-            defaultIndex++;
-          } else {
-            defaultIndex = 0;
-            break;
-          }
-        }
-
-        formatted.push({
-          values: cursor.children,
-          className: cursor.className,
-          defaultIndex: defaultIndex
-        });
-        cursor = children[defaultIndex];
-      }
-
-      this.formattedColumns = formatted;
-    },
-    emit: function emit(event) {
-      var _this2 = this;
-
-      if (this.dataType === 'text') {
-        this.$emit(event, this.getColumnValue(0), this.getColumnIndex(0));
-      } else {
-        var values = this.getValues(); // compatible with old version of wrong parameters
-        // should be removed in next major version
-        // see: https://github.com/youzan/vant/issues/5905
-
-        if (this.dataType === 'cascade') {
-          values = values.map(function (item) {
-            return item[_this2.valueKey];
-          });
-        }
-
-        this.$emit(event, values, this.getIndexes());
-      }
-    },
-    onCascadeChange: function onCascadeChange(columnIndex) {
-      var cursor = {
-        children: this.columns
-      };
-      var indexes = this.getIndexes();
-
-      for (var i = 0; i <= columnIndex; i++) {
-        cursor = cursor.children[indexes[i]];
-      }
-
-      while (cursor && cursor.children) {
-        columnIndex++;
-        this.setColumnValues(columnIndex, cursor.children);
-        cursor = cursor.children[cursor.defaultIndex || 0];
-      }
-    },
-    onChange: function onChange(columnIndex) {
-      var _this3 = this;
-
-      if (this.dataType === 'cascade') {
-        this.onCascadeChange(columnIndex);
-      }
-
-      if (this.dataType === 'text') {
-        this.$emit('change', this, this.getColumnValue(0), this.getColumnIndex(0));
-      } else {
-        var values = this.getValues(); // compatible with old version of wrong parameters
-        // should be removed in next major version
-        // see: https://github.com/youzan/vant/issues/5905
-
-        if (this.dataType === 'cascade') {
-          values = values.map(function (item) {
-            return item[_this3.valueKey];
-          });
-        }
-
-        this.$emit('change', this, values, columnIndex);
-      }
-    },
-    getColumnCount: function getColumnCount() {
-      return this.children ? this.children.length : 0;
-    },
-    // get column instance by index
-    getColumn: function getColumn(index) {
-      return this.children[index];
-    },
-    // @exposed-api
-    // get column value by index
-    getColumnValue: function getColumnValue(index) {
-      var column = this.getColumn(index);
-      return column && column.getValue();
-    },
-    // @exposed-api
-    // set column value by index
-    setColumnValue: function setColumnValue(index, value) {
-      var column = this.getColumn(index);
-
-      if (column) {
-        column.setValue(value);
-
-        if (this.dataType === 'cascade') {
-          this.onCascadeChange(index);
-        }
-      }
-    },
-    // @exposed-api
-    // get column option index by column index
-    getColumnIndex: function getColumnIndex(columnIndex) {
-      return (this.getColumn(columnIndex) || {}).currentIndex;
-    },
-    // @exposed-api
-    // set column option index by column index
-    setColumnIndex: function setColumnIndex(columnIndex, optionIndex) {
-      var column = this.getColumn(columnIndex);
-
-      if (column) {
-        column.setIndex(optionIndex);
-
-        if (this.dataType === 'cascade') {
-          this.onCascadeChange(columnIndex);
-        }
-      }
-    },
-    // @exposed-api
-    // get options of column by index
-    getColumnValues: function getColumnValues(index) {
-      return (this.children[index] || {}).options;
-    },
-    // @exposed-api
-    // set options of column by index
-    setColumnValues: function setColumnValues(index, options) {
-      var column = this.children[index];
-
-      if (column) {
-        column.setOptions(options);
-      }
-    },
-    // @exposed-api
-    // get values of all columns
-    getValues: function getValues() {
-      return this.children.map(function (child) {
-        return child.getValue();
-      });
-    },
-    // @exposed-api
-    // set values of all columns
-    setValues: function setValues(values) {
-      var _this4 = this;
-
-      values.forEach(function (value, index) {
-        _this4.setColumnValue(index, value);
-      });
-    },
-    // @exposed-api
-    // get indexes of all columns
-    getIndexes: function getIndexes() {
-      return this.children.map(function (child) {
-        return child.currentIndex;
-      });
-    },
-    // @exposed-api
-    // set indexes of all columns
-    setIndexes: function setIndexes(indexes) {
-      var _this5 = this;
-
-      indexes.forEach(function (optionIndex, columnIndex) {
-        _this5.setColumnIndex(columnIndex, optionIndex);
-      });
-    },
-    // @exposed-api
-    confirm: function confirm() {
-      this.children.forEach(function (child) {
-        return child.stopMomentum();
-      });
-      this.children.forEach(function (child) {
-        return child.recordConfirmIndex();
-      });
-      this.emit('confirm');
-    },
-    cancel: function cancel() {
-      this.emit('cancel');
-    },
-    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()]]);
-      }
-    },
-    genHeaders: function genHeaders() {
-      var h = this.$createElement;
-      return h("ul", {
-        "class": bem('header')
-      }, [this.genHeaderItems()]);
-    },
-    genHeaderItems: function genHeaderItems() {
-      var h = this.$createElement;
-      return this.headers.map(function (header) {
-        return h("li", [header]);
-      });
-    },
-    genColumns: function genColumns() {
-      var h = this.$createElement;
-      var itemPxHeight = this.itemPxHeight;
-      var wrapHeight = itemPxHeight * this.visibleItemCount;
-      var frameStyle = {
-        height: itemPxHeight + "px"
-      };
-      var columnsStyle = {
-        height: wrapHeight + "px"
-      };
-      var maskStyle = {
-        backgroundSize: "100% " + (wrapHeight - itemPxHeight) / 2 + "px"
-      };
-      return h("div", {
-        "class": bem('columns'),
-        "style": columnsStyle,
-        "on": {
-          "touchmove": preventDefault
-        }
-      }, [h("div", {
-        "class": bem('background')
-      }), this.genColumnItems(), h("div", {
-        "class": bem('mask'),
-        "style": maskStyle
-      }), h("div", {
-        "class": [bem('frame')],
-        "style": frameStyle
-      })]);
-    },
-    genColumnItems: function genColumnItems() {
-      var _this6 = this;
-
-      var h = this.$createElement;
-      return this.formattedColumns.map(function (item, columnIndex) {
-        var _item$defaultIndex;
-
-        return h(PickerColumn, {
-          "attrs": {
-            "columnCollector": _this6.children,
-            "readonly": _this6.readonly,
-            "valueKey": _this6.valueKey,
-            "allowHtml": _this6.allowHtml,
-            "className": item.className,
-            "itemHeight": _this6.itemPxHeight,
-            "defaultIndex": (_item$defaultIndex = item.defaultIndex) != null ? _item$defaultIndex : +_this6.defaultIndex,
-            "swipeDuration": _this6.swipeDuration,
-            "visibleItemCount": _this6.visibleItemCount,
-            "initialOptions": item.values
-          },
-          "scopedSlots": {
-            option: _this6.$scopedSlots.option
-          },
-          "on": {
-            "change": function change() {
-              _this6.onChange(columnIndex);
-            }
-          }
-        });
-      });
-    }
-  },
-  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.slots('columns-top'), this.headers && this.headers.length > 0 ? this.genHeaders() : h(), this.headers && this.headers.length > 0 ? h("div", {
-      "class": bem('border')
-    }) : h(), this.genColumns(), this.slots('columns-bottom'), this.toolbarPosition === 'bottom' ? this.genToolbar() : h()])]);
-  }
-});

package/es/picker/index.less

@@ -1,155 +0,0 @@
-@import '../style/var';
-@import '../style/hairline';
-
-.zt-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;
-    }
-  }
-
-  &__columns {
-    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;
-  }
-
-  &__frame {
-    position: absolute;
-    top: 50%;
-    right: @padding-md;
-    left: @padding-md;
-    z-index: 2;
-    transform: translateY(-50%);
-    pointer-events: none;
-  }
-
-  &__background {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    opacity: 0.04;
-    background-color: #000;
-  }
-
-  &__mask {
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: 1;
-    width: 100%;
-    height: 100%;
-    background-image: linear-gradient(
-            180deg,
-            hsla(0, 0%, 100%, 0.9),
-            hsla(0, 0%, 100%, 0.4)
-    ),
-    linear-gradient(0deg, hsla(0, 0%, 100%, 0.9), hsla(0, 0%, 100%, 0.4));
-    background-repeat: no-repeat;
-    background-position: top, bottom;
-    // fix rendering failure during animation on safari
-    transform: translateZ(0);
-    pointer-events: none;
-  }
-
-  &-column {
-    flex: 1;
-    overflow: hidden;
-    font-size: @picker-option-font-size;
-
-    &__wrapper {
-      transition-timing-function: cubic-bezier(0.23, 1, 0.68, 1);
-    }
-
-    &__item {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      padding: 0 @padding-base;
-      color: @picker-option-text-color;
-
-      &--disabled {
-        cursor: not-allowed;
-        opacity: @picker-option-disabled-opacity;
-      }
-
-      &--selected {
-        font-weight: @font-weight-bold;
-      }
-    }
-  }
-}

package/es/picker/shared.js

@@ -1,34 +0,0 @@
-export var DEFAULT_ITEM_HEIGHT = 44;
-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
-  },
-  visibleItemCount: {
-    type: [Number, String],
-    default: 6
-  },
-  swipeDuration: {
-    type: [Number, String],
-    default: 1000
-  },
-  closeOnPopstate: {
-    type: Boolean,
-    default: true
-  },
-  closeOnClickOverlay: {
-    type: Boolean,
-    default: true
-  }
-};

package/es/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/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/popover/index.css

@@ -1 +0,0 @@
-.zt-popover{position:absolute;overflow:visible;background-color:transparent;-webkit-transition:opacity .15s,-webkit-transform .15s;transition:opacity .15s,-webkit-transform .15s;transition:opacity .15s,transform .15s;transition:opacity .15s,transform .15s,-webkit-transform .15s}.zt-popover__wrapper{display:inline-block}.zt-popover__arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px}.zt-popover__content{overflow:hidden;border-radius:2px}.zt-popover__action{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;box-sizing:border-box;width:120px;height:40px;padding:0 12px;font-size:14px;line-height:20px;cursor:pointer}.zt-popover__action:last-child .zt-popover__action-text::after{display:none}.zt-popover__action-text{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-flex:1;-webkit-flex:1;flex:1;-webkit-box-align:center;-webkit-align-items:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;height:100%}.zt-popover__action-icon{margin-right:8px;font-size:20px}.zt-popover__action--with-icon .zt-popover__action-text{-webkit-box-pack:start;-webkit-justify-content:flex-start;justify-content:flex-start}.zt-popover[data-popper-placement^=top] .zt-popover__arrow{bottom:0;border-top-color:currentColor;border-bottom-width:0;-webkit-transform:translate(-50%,100%);transform:translate(-50%,100%)}.zt-popover[data-popper-placement=top]{-webkit-transform-origin:50% 100%;transform-origin:50% 100%}.zt-popover[data-popper-placement=top] .zt-popover__arrow{left:50%}.zt-popover[data-popper-placement=top-start]{-webkit-transform-origin:0 100%;transform-origin:0 100%}.zt-popover[data-popper-placement=top-start] .zt-popover__arrow{left:8px}.zt-popover[data-popper-placement=top-end]{-webkit-transform-origin:100% 100%;transform-origin:100% 100%}.zt-popover[data-popper-placement=top-end] .zt-popover__arrow{right:8px}.zt-popover[data-popper-placement^=left] .zt-popover__arrow{right:0;border-right-width:0;border-left-color:currentColor;-webkit-transform:translate(100%,-50%);transform:translate(100%,-50%)}.zt-popover[data-popper-placement=left]{-webkit-transform-origin:100% 50%;transform-origin:100% 50%}.zt-popover[data-popper-placement=left] .zt-popover__arrow{top:50%}.zt-popover[data-popper-placement=left-start]{-webkit-transform-origin:100% 0;transform-origin:100% 0}.zt-popover[data-popper-placement=left-start] .zt-popover__arrow{top:16px}.zt-popover[data-popper-placement=left-end]{-webkit-transform-origin:100% 100%;transform-origin:100% 100%}.zt-popover[data-popper-placement=left-end] .zt-popover__arrow{bottom:16px}.zt-popover[data-popper-placement^=right] .zt-popover__arrow{left:0;border-right-color:currentColor;border-left-width:0;-webkit-transform:translate(-100%,-50%);transform:translate(-100%,-50%)}.zt-popover[data-popper-placement=right]{-webkit-transform-origin:0 50%;transform-origin:0 50%}.zt-popover[data-popper-placement=right] .zt-popover__arrow{top:50%}.zt-popover[data-popper-placement=right-start]{-webkit-transform-origin:0 0;transform-origin:0 0}.zt-popover[data-popper-placement=right-start] .zt-popover__arrow{top:16px}.zt-popover[data-popper-placement=right-end]{-webkit-transform-origin:0 100%;transform-origin:0 100%}.zt-popover[data-popper-placement=right-end] .zt-popover__arrow{bottom:16px}.zt-popover[data-popper-placement^=bottom] .zt-popover__arrow{top:0;border-top-width:0;border-bottom-color:currentColor;-webkit-transform:translate(-50%,-100%);transform:translate(-50%,-100%)}.zt-popover[data-popper-placement=bottom]{-webkit-transform-origin:50% 0;transform-origin:50% 0}.zt-popover[data-popper-placement=bottom] .zt-popover__arrow{left:50%}.zt-popover[data-popper-placement=bottom-start]{-webkit-transform-origin:0 0;transform-origin:0 0}.zt-popover[data-popper-placement=bottom-start] .zt-popover__arrow{left:8px}.zt-popover[data-popper-placement=bottom-end]{-webkit-transform-origin:100% 0;transform-origin:100% 0}.zt-popover[data-popper-placement=bottom-end] .zt-popover__arrow{right:8px}.zt-popover--light{color:#000}.zt-popover--light .zt-popover__content{background-color:#fff;box-shadow:0 2px 12px rgba(50,50,51,.12)}.zt-popover--light .zt-popover__arrow{color:#fff}.zt-popover--light .zt-popover__action:active{background-color:rgba(0,0,0,.04)}.zt-popover--light .zt-popover__action--disabled{color:rgba(0,0,0,.2);cursor:not-allowed}.zt-popover--light .zt-popover__action--disabled:active{background-color:transparent}.zt-popover--dark{color:#fff}.zt-popover--dark .zt-popover__content{background-color:#4a4a4a}.zt-popover--dark .zt-popover__arrow{color:#4a4a4a}.zt-popover--dark .zt-popover__action:active{background-color:rgba(0,0,0,.2)}.zt-popover--dark .zt-popover__action--disabled{color:#969799}.zt-popover--dark .zt-popover__action--disabled:active{background-color:transparent}.zt-popover--dark .zt-popover__action-text::after{border-color:#646566}.zt-popover-zoom-enter,.zt-popover-zoom-leave-active{-webkit-transform:scale(.8);transform:scale(.8);opacity:0}.zt-popover-zoom-enter-active{-webkit-transition-timing-function:ease-out;transition-timing-function:ease-out}.zt-popover-zoom-leave-active{-webkit-transition-timing-function:ease-in;transition-timing-function:ease-in}