@varlet/ui 1.23.4-alpha.4 → 1.23.4

package/lib/cell/cell.less

@@ -1,74 +0,0 @@
-@cell-font-size: var(--font-size-md);
-@cell-desc-font-size: var(--font-size-sm);
-@cell-desc-color: rgba(0, 0, 0, 0.6);
-@cell-padding: 10px 12px;
-@cell-min-height: 40px;
-@cell-border-color: #bcc2cb;
-@cell-border-left: 12px;
-@cell-border-right: 12px;
-@cell-icon-right: 8px;
-@cell-extra-left: 8px;
-
-:root {
-  --cell-font-size: @cell-font-size;
-  --cell-desc-font-size: @cell-desc-font-size;
-  --cell-desc-color: @cell-desc-color;
-  --cell-padding: @cell-padding;
-  --cell-min-height: @cell-min-height;
-  --cell-border-color: @cell-border-color;
-  --cell-border-left: @cell-border-left;
-  --cell-border-right: @cell-border-right;
-  --cell-icon-right: @cell-icon-right;
-  --cell-extra-left: @cell-extra-left;
-}
-
-.var-cell {
-  align-items: center;
-  display: flex;
-  min-height: var(--cell-min-height);
-  outline: none;
-  padding: var(--cell-padding);
-  position: relative;
-  box-sizing: border-box;
-  font-size: var(--cell-font-size);
-
-  &--border {
-    &::after {
-      position: absolute;
-      box-sizing: border-box;
-      content: ' ';
-      pointer-events: none;
-      right: var(--cell-border-right);
-      bottom: 0;
-      left: var(--cell-border-left);
-      border-bottom: 1px solid var(--cell-border-color);
-      transform: scaleY(0.5);
-    }
-  }
-
-  &__icon {
-    margin-right: var(--cell-icon-right);
-    flex: 0;
-  }
-
-  &__content {
-    flex: 1;
-    overflow: hidden;
-  }
-
-  &__title {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  &__desc {
-    font-size: var(--cell-desc-font-size);
-    color: var(--cell-desc-color);
-  }
-
-  &__extra {
-    flex: 0;
-    margin-left: var(--cell-extra-left);
-  }
-}

package/lib/cell/index.js

@@ -1,17 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = exports._CellComponent = void 0;
-
-var _Cell = _interopRequireDefault(require("./Cell.js"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-_Cell.default.install = function (app) {
-  app.component(_Cell.default.name, _Cell.default);
-};
-
-var _CellComponent = _Cell.default;
-exports._CellComponent = _CellComponent;
-var _default = _Cell.default;
-exports.default = _default;

package/lib/cell/props.js

@@ -1,32 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.props = void 0;
-var props = {
-  title: {
-    type: [Number, String]
-  },
-  icon: {
-    type: String
-  },
-  desc: {
-    type: String
-  },
-  border: {
-    type: Boolean,
-    default: false
-  },
-  iconClass: {
-    type: String
-  },
-  titleClass: {
-    type: String
-  },
-  descClass: {
-    type: String
-  },
-  extraClass: {
-    type: String
-  }
-};
-exports.props = props;

package/lib/cell/style/index.js

@@ -1,4 +0,0 @@
-require('../../styles/common.css')
-require('../../icon/icon.css')
-require('../cell.css')
-require('../CellSfc.css')

package/lib/cell/style/less.js

@@ -1,4 +0,0 @@
-require('../../styles/common.less')
-require('../../icon/icon.less')
-require('../cell.less')
-require('../CellSfc.less')

package/lib/checkbox/Checkbox.js

@@ -1,232 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.render = render;
-exports.default = void 0;
-
-var _icon = _interopRequireDefault(require("../icon"));
-
-var _formDetails = _interopRequireDefault(require("../form-details"));
-
-var _ripple = _interopRequireDefault(require("../ripple"));
-
-var _vue = require("vue");
-
-var _props = require("./props");
-
-var _components = require("../utils/components");
-
-var _provide = require("./provide");
-
-var _provide2 = require("../form/provide");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-var _withScopeId = n => ((0, _vue.pushScopeId)(""), n = n(), (0, _vue.popScopeId)(), n);
-
-var _hoisted_1 = {
-  class: "var-checkbox"
-};
-
-function render(_ctx, _cache) {
-  var _component_var_icon = (0, _vue.resolveComponent)("var-icon");
-
-  var _component_var_form_details = (0, _vue.resolveComponent)("var-form-details");
-
-  var _directive_ripple = (0, _vue.resolveDirective)("ripple");
-
-  return (0, _vue.openBlock)(), (0, _vue.createElementBlock)("div", {
-    class: "var-checkbox__wrap",
-    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
-  }, [(0, _vue.createElementVNode)("div", _hoisted_1, [(0, _vue.withDirectives)((0, _vue.createElementVNode)("div", {
-    class: (0, _vue.normalizeClass)(["var-checkbox__action", [_ctx.checked ? 'var-checkbox--checked' : 'var-checkbox--unchecked', _ctx.errorMessage || _ctx.checkboxGroupErrorMessage ? 'var-checkbox--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-checkbox--disabled' : null]]),
-    style: (0, _vue.normalizeStyle)({
-      color: _ctx.checked ? _ctx.checkedColor : _ctx.uncheckedColor
-    })
-  }, [_ctx.checked ? (0, _vue.renderSlot)(_ctx.$slots, "checked-icon", {
-    key: 0
-  }, () => [(0, _vue.createVNode)(_component_var_icon, {
-    class: (0, _vue.normalizeClass)(["var-checkbox__icon", [_ctx.withAnimation ? 'var-checkbox--with-animation' : null]]),
-    name: "checkbox-marked",
-    size: _ctx.iconSize,
-    "var-checkbox-cover": ""
-  }, null, 8
-  /* PROPS */
-  , ["class", "size"])]) : (0, _vue.renderSlot)(_ctx.$slots, "unchecked-icon", {
-    key: 1
-  }, () => [(0, _vue.createVNode)(_component_var_icon, {
-    class: (0, _vue.normalizeClass)(["var-checkbox__icon", [_ctx.withAnimation ? 'var-checkbox--with-animation' : null]]),
-    name: "checkbox-blank-outline",
-    size: _ctx.iconSize,
-    "var-checkbox-cover": ""
-  }, null, 8
-  /* PROPS */
-  , ["class", "size"])])], 6
-  /* CLASS, STYLE */
-  ), [[_directive_ripple, {
-    disabled: _ctx.formReadonly || _ctx.readonly || _ctx.formDisabled || _ctx.disabled || !_ctx.ripple
-  }]]), (0, _vue.createElementVNode)("div", {
-    class: (0, _vue.normalizeClass)(["var-checkbox__text", [_ctx.errorMessage || _ctx.checkboxGroupErrorMessage ? 'var-checkbox--error' : null, _ctx.formDisabled || _ctx.disabled ? 'var-checkbox--disabled' : null]])
-  }, [(0, _vue.renderSlot)(_ctx.$slots, "default")], 2
-  /* CLASS */
-  )]), (0, _vue.createVNode)(_component_var_form_details, {
-    "error-message": _ctx.errorMessage
-  }, null, 8
-  /* PROPS */
-  , ["error-message"])]);
-}
-
-var _default = (0, _vue.defineComponent)({
-  render,
-  name: 'VarCheckbox',
-  directives: {
-    Ripple: _ripple.default
-  },
-  components: {
-    VarIcon: _icon.default,
-    VarFormDetails: _formDetails.default
-  },
-  props: _props.props,
-
-  setup(props) {
-    var value = (0, _vue.ref)(false);
-    var checked = (0, _vue.computed)(() => value.value === props.checkedValue);
-    var checkedValue = (0, _vue.computed)(() => props.checkedValue);
-    var withAnimation = (0, _vue.ref)(false);
-    var {
-      checkboxGroup,
-      bindCheckboxGroup
-    } = (0, _provide.useCheckboxGroup)();
-    var {
-      form,
-      bindForm
-    } = (0, _provide2.useForm)();
-    var {
-      errorMessage,
-      validateWithTrigger: vt,
-      validate: v,
-      // expose
-      resetValidation
-    } = (0, _components.useValidation)();
-
-    var validateWithTrigger = trigger => {
-      (0, _vue.nextTick)(() => {
-        var {
-          validateTrigger,
-          rules,
-          modelValue
-        } = props;
-        vt(validateTrigger, trigger, rules, modelValue);
-      });
-    };
-
-    var change = changedValue => {
-      var _props$onUpdateModel;
-
-      value.value = changedValue;
-      var {
-        checkedValue,
-        onChange
-      } = props;
-      (_props$onUpdateModel = props['onUpdate:modelValue']) == null ? void 0 : _props$onUpdateModel.call(props, value.value);
-      onChange == null ? void 0 : onChange(value.value);
-      validateWithTrigger('onChange');
-      changedValue === checkedValue ? checkboxGroup == null ? void 0 : checkboxGroup.onChecked(checkedValue) : checkboxGroup == null ? void 0 : checkboxGroup.onUnchecked(checkedValue);
-    };
-
-    var handleClick = e => {
-      var {
-        disabled,
-        readonly,
-        checkedValue,
-        uncheckedValue,
-        onClick
-      } = props;
-
-      if (form != null && form.disabled.value || disabled) {
-        return;
-      }
-
-      onClick == null ? void 0 : onClick(e);
-
-      if (form != null && form.readonly.value || readonly) {
-        return;
-      }
-
-      withAnimation.value = true;
-      var maximum = checkboxGroup ? checkboxGroup.checkedCount.value >= Number(checkboxGroup.max.value) : false;
-
-      if (!checked.value && maximum) {
-        return;
-      }
-
-      change(checked.value ? uncheckedValue : checkedValue);
-    };
-
-    var sync = values => {
-      var {
-        checkedValue,
-        uncheckedValue
-      } = props;
-      value.value = values.includes(checkedValue) ? checkedValue : uncheckedValue;
-    }; // expose
-
-
-    var reset = () => {
-      var _props$onUpdateModel2;
-
-      (_props$onUpdateModel2 = props['onUpdate:modelValue']) == null ? void 0 : _props$onUpdateModel2.call(props, props.uncheckedValue);
-      resetValidation();
-    }; // expose
-
-
-    var toggle = changedValue => {
-      var {
-        checkedValue,
-        uncheckedValue
-      } = props;
-      var shouldReverse = ![checkedValue, uncheckedValue].includes(changedValue);
-
-      if (shouldReverse) {
-        changedValue = checked.value ? uncheckedValue : checkedValue;
-      }
-
-      change(changedValue);
-    }; // expose
-
-
-    var validate = () => v(props.rules, props.modelValue);
-
-    (0, _vue.watch)(() => props.modelValue, newValue => {
-      value.value = newValue;
-    }, {
-      immediate: true
-    });
-    var checkboxProvider = {
-      checkedValue,
-      checked,
-      sync,
-      validate,
-      resetValidation,
-      reset
-    };
-    bindCheckboxGroup == null ? void 0 : bindCheckboxGroup(checkboxProvider);
-    bindForm == null ? void 0 : bindForm(checkboxProvider);
-    return {
-      withAnimation,
-      checked,
-      errorMessage,
-      checkboxGroupErrorMessage: checkboxGroup == null ? void 0 : checkboxGroup.errorMessage,
-      formDisabled: form == null ? void 0 : form.disabled,
-      formReadonly: form == null ? void 0 : form.readonly,
-      handleClick,
-      toggle,
-      reset,
-      validate,
-      resetValidation
-    };
-  }
-
-});
-
-exports.default = _default;

package/lib/checkbox/checkbox.css

@@ -1 +0,0 @@
-:root { --checkbox-checked-color: var(--color-primary); --checkbox-unchecked-color: #555; --checkbox-disabled-color: var(--color-text-disabled); --checkbox-error-color: var(--color-danger); --checkbox-action-padding: 6px; --checkbox-icon-size: 24px;}@keyframes var-vibrate-animation { 0% { opacity: 1; transform: scale(1); } 50% { opacity: 0.8; transform: scale(0.8); } 100% { opacity: 1; transform: scale(1); }}.var-checkbox { display: flex; align-items: center; transform: translateX(calc(-1 * var(--checkbox-action-padding))); cursor: pointer; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}.var-checkbox__wrap { display: inline-flex; flex-direction: column;}.var-checkbox__action { display: flex; justify-content: center; align-items: center; padding: var(--checkbox-action-padding); border-radius: 50%;}.var-checkbox__icon[var-checkbox-cover] { display: block; font-size: var(--checkbox-icon-size);}.var-checkbox--with-animation { animation: var-vibrate-animation 0.25s;}.var-checkbox--checked { color: var(--checkbox-checked-color);}.var-checkbox--unchecked { color: var(--checkbox-unchecked-color);}.var-checkbox--disabled { color: var(--checkbox-disabled-color);}.var-checkbox--error { color: var(--checkbox-error-color);}

package/lib/checkbox/checkbox.less

@@ -1,78 +0,0 @@
-@checkbox-checked-color: var(--color-primary);
-@checkbox-unchecked-color: #555;
-@checkbox-disabled-color: var(--color-text-disabled);
-@checkbox-error-color: var(--color-danger);
-@checkbox-action-padding: 6px;
-@checkbox-icon-size: 24px;
-
-:root {
-  --checkbox-checked-color: @checkbox-checked-color;
-  --checkbox-unchecked-color: @checkbox-unchecked-color;
-  --checkbox-disabled-color: @checkbox-disabled-color;
-  --checkbox-error-color: @checkbox-error-color;
-  --checkbox-action-padding: @checkbox-action-padding;
-  --checkbox-icon-size: @checkbox-icon-size;
-}
-
-@keyframes var-vibrate-animation {
-  0% {
-    opacity: 1;
-    transform: scale(1);
-  }
-
-  50% {
-    opacity: 0.8;
-    transform: scale(0.8);
-  }
-
-  100% {
-    opacity: 1;
-    transform: scale(1);
-  }
-}
-
-.var-checkbox {
-  display: flex;
-  align-items: center;
-  transform: translateX(calc(-1 * var(--checkbox-action-padding)));
-  cursor: pointer;
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-
-  &__wrap {
-    display: inline-flex;
-    flex-direction: column;
-  }
-
-  &__action {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    padding: var(--checkbox-action-padding);
-    border-radius: 50%;
-  }
-
-  &__icon[var-checkbox-cover] {
-    display: block;
-    font-size: var(--checkbox-icon-size);
-  }
-
-  &--with-animation {
-    animation: var-vibrate-animation 0.25s;
-  }
-
-  &--checked {
-    color: var(--checkbox-checked-color);
-  }
-
-  &--unchecked {
-    color: var(--checkbox-unchecked-color);
-  }
-
-  &--disabled {
-    color: var(--checkbox-disabled-color);
-  }
-
-  &--error {
-    color: var(--checkbox-error-color);
-  }
-}

package/lib/checkbox/index.js

@@ -1,17 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.default = exports._CheckboxComponent = void 0;
-
-var _Checkbox = _interopRequireDefault(require("./Checkbox.js"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-_Checkbox.default.install = function (app) {
-  app.component(_Checkbox.default.name, _Checkbox.default);
-};
-
-var _CheckboxComponent = _Checkbox.default;
-exports._CheckboxComponent = _CheckboxComponent;
-var _default = _Checkbox.default;
-exports.default = _default;

package/lib/checkbox/props.js

@@ -1,56 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.props = void 0;
-var props = {
-  modelValue: {
-    type: [String, Number, Boolean, Object, Array],
-    default: false
-  },
-  checkedValue: {
-    type: [String, Number, Boolean, Object, Array],
-    default: true
-  },
-  uncheckedValue: {
-    type: [String, Number, Boolean, Object, Array],
-    default: false
-  },
-  checkedColor: {
-    type: String
-  },
-  uncheckedColor: {
-    type: String
-  },
-  disabled: {
-    type: Boolean,
-    default: false
-  },
-  readonly: {
-    type: Boolean,
-    default: false
-  },
-  iconSize: {
-    type: [String, Number]
-  },
-  ripple: {
-    type: Boolean,
-    default: true
-  },
-  validateTrigger: {
-    type: Array,
-    default: ['onChange']
-  },
-  rules: {
-    type: Array
-  },
-  onClick: {
-    type: Function
-  },
-  onChange: {
-    type: Function
-  },
-  'onUpdate:modelValue': {
-    type: Function
-  }
-};
-exports.props = props;

package/lib/checkbox/provide.js

@@ -1,23 +0,0 @@
-"use strict";
-
-exports.__esModule = true;
-exports.useCheckboxGroup = useCheckboxGroup;
-
-var _components = require("../utils/components");
-
-var _provide = require("../checkbox-group/provide");
-
-function useCheckboxGroup() {
-  var {
-    bindParent,
-    parentProvider
-  } = (0, _components.useParent)(_provide.CHECKBOX_GROUP_BIND_CHECKBOX_KEY);
-  var {
-    index
-  } = (0, _components.useAtParentIndex)(_provide.CHECKBOX_GROUP_COUNT_CHECKBOX_KEY);
-  return {
-    index,
-    checkboxGroup: parentProvider,
-    bindCheckboxGroup: bindParent
-  };
-}

package/lib/checkbox/style/index.js

@@ -1,5 +0,0 @@
-require('../../styles/common.css')
-require('../../form-details/formDetails.css')
-require('../../icon/icon.css')
-require('../checkbox.css')
-require('../CheckboxSfc.css')

package/lib/checkbox/style/less.js

@@ -1,5 +0,0 @@
-require('../../styles/common.less')
-require('../../form-details/formDetails.less')
-require('../../icon/icon.less')
-require('../checkbox.less')
-require('../CheckboxSfc.less')