@king-design/vue 3.1.4-beta.2 → 3.1.5

package/components/select/useFilterable.js

@@ -9,28 +9,22 @@ import { isNullOrUndefined, isStringOrNumber } from 'intact-shared';
 import { getTextByChildren, mapChildren, isComponentVNode } from '../utils';
 export function useFilterable(keywords) {
   var component = useInstance();
-
   function getCreatedVNode(children) {
     var _component$get = component.get(),
-        creatable = _component$get.creatable,
-        filterable = _component$get.filterable;
-
+      creatable = _component$get.creatable,
+      filterable = _component$get.filterable;
     var _keywords = keywords.value;
-
     if (creatable && filterable && _keywords) {
       if (!_findInstanceProperty(children).call(children, function (vNode) {
         // TODO: create Option for OptionGroup
         if (vNode.tag === Option) {
           var _context;
-
           var props = vNode.props;
           if (isNullOrUndefined(props)) return false;
-
           if (props.value === _keywords || _trimInstanceProperty(_context = props.label).call(_context) === _keywords) {
             return true;
           }
         }
-
         return false;
       })) {
         return h(Option, {
@@ -40,19 +34,15 @@ export function useFilterable(keywords) {
       }
     }
   }
-
   function filter(children) {
     var _component$get2 = component.get(),
-        filterable = _component$get2.filterable,
-        filter = _filterInstanceProperty(_component$get2),
-        searchable = _component$get2.searchable;
-
+      filterable = _component$get2.filterable,
+      filter = _filterInstanceProperty(_component$get2),
+      searchable = _component$get2.searchable;
     if (!filterable && !searchable) return children;
-
     if (isNullOrUndefined(filter)) {
       filter = defaultFilter;
     }
-
     var loop = function loop(children) {
       var _children = [];
       mapChildren(children, function (vNode) {
@@ -60,28 +50,27 @@ export function useFilterable(keywords) {
           var props = vNode.props;
           if (isNullOrUndefined(props)) return;
           vNode = directClone(vNode);
-
           if (isNullOrUndefined(props.label)) {
             vNode.props = _extends({}, props, {
               label: getTextByChildren(props.children)
             });
           }
-
+          var value = props.value;
+          if (isStringOrNumber(value)) {
+            vNode.key = value;
+          }
           if (filter(keywords.value, vNode.props)) {
             _children.push(vNode);
           }
         } else if (isComponentVNode(vNode, OptionGroup)) {
           var _props = vNode.props;
           if (isNullOrUndefined(_props)) return;
-
           var _children2 = loop(_props.children);
-
           if (!_children2.length) return;
           vNode = directClone(vNode);
           vNode.props = _extends({}, _props, {
             children: _children2
           });
-
           _children.push(vNode);
         } else {
           _children.push(vNode);
@@ -89,30 +78,23 @@ export function useFilterable(keywords) {
       });
       return _children;
     };
-
     return loop(children);
   }
-
   return {
     getCreatedVNode: getCreatedVNode,
     filter: filter
   };
 }
-
 function defaultFilter(keywords, props) {
   if (keywords === '') return true;
   keywords = keywords.toLowerCase();
   var label = props.label;
-
   if (!isNullOrUndefined(label) && ~label.toLowerCase().indexOf(keywords)) {
     return true;
   }
-
   var value = props.value;
-
   if (isStringOrNumber(value) && ~String(value).toLowerCase().indexOf(keywords)) {
     return true;
   }
-
   return false;
 }

package/components/select/useFocusout.d.ts

@@ -1,6 +1,6 @@
 /**
  * don't trigger focusout event when layer is showing,
- * only trigger focusout when it hidden to make FormItem to validate it
+ * only trigger focusout when it is hidden to make FormItem to validate it
  * #449
  */
 export declare function useFocusout(): {

package/components/select/useFocusout.js

@@ -2,10 +2,9 @@ import _Object$assign from "@babel/runtime-corejs3/core-js/object/assign";
 import { useInstance, createRef } from 'intact-vue-next';
 /**
  * don't trigger focusout event when layer is showing,
- * only trigger focusout when it hidden to make FormItem to validate it
+ * only trigger focusout when it is hidden to make FormItem to validate it
  * #449
  */
-
 export function useFocusout() {
   var instance = useInstance();
   var triggerRef = createRef();
@@ -16,32 +15,25 @@ export function useFocusout() {
       _dispatch: true
     });
   });
-
   function onFocusout(e) {
     instance.trigger('focusout', e);
-
     if (instance.get('show')) {
       e.stopPropagation();
     }
   }
-
   return {
     onFocusout: onFocusout,
     triggerRef: triggerRef
   };
 }
-
 function dispatchEvent(target, eventName, options) {
   var event;
-
   if (document.createEvent) {
     event = document.createEvent('Event');
     event.initEvent(eventName, true, true);
   } else if (typeof CustomEvent !== 'undefined') {
     event = new CustomEvent(eventName);
   }
-
   _Object$assign(event, options);
-
   target.dispatchEvent(event);
 }

package/components/select/useInput.js

@@ -5,26 +5,23 @@ export function useInput(resetKeywords) {
   var component = useInstance();
   var keywords = useState('');
   var inputRef = createRef();
-
   function onInput(value) {
     keywords.set(_trimInstanceProperty(value).call(value));
-    var dropdown = component.dropdownRef.value; // the position may be flip, and the select input height may change height too,
+    var dropdown = component.dropdownRef.value;
+    // the position may be flip, and the select input height may change height too,
     // so we should reset the position
-
     nextTick(function () {
       dropdown.focusFirst();
       dropdown.position();
     });
-  } // if menu showed and value changed on multiple mode
+  }
+  // if menu showed and value changed on multiple mode
   // focus the input
-
-
   function focusInput() {
     if (component.get('filterable')) {
       inputRef.value.focus();
     }
   }
-
   component.on('$changed:show', function (show) {
     if (show) {
       focusInput();
@@ -35,9 +32,8 @@ export function useInput(resetKeywords) {
   });
   component.on('$changed:value', function () {
     var _component$get = component.get(),
-        multiple = _component$get.multiple,
-        filterable = _component$get.filterable;
-
+      multiple = _component$get.multiple,
+      filterable = _component$get.filterable;
     if (multiple && filterable) {
       focusInput();
       resetKeywords(keywords);

package/components/select/useLabel.js

@@ -7,30 +7,24 @@ import { useBaseLabel } from './useBaseLabel';
 export function useLabel() {
   var instance = useInstance();
   var activeIndices = createRef([]);
-
   var _useBaseLabel = useBaseLabel(function () {
-    return instance.get('children');
-  }, findLabel),
-      getLabel = _useBaseLabel.getLabel;
-
+      return instance.get('children');
+    }, findLabel),
+    getLabel = _useBaseLabel.getLabel;
   function findLabel(children, value) {
     var label = null;
     var index = 0;
     activeIndices.value = [];
-
     var loop = function loop(children) {
       return findChildren(children, function (vNode) {
         if (isComponentVNode(vNode, Option)) {
           var props = vNode.props;
           if (isNullOrUndefined(props)) return false;
-
           if (props.value === value) {
             label = props.label;
-
             if (isNullOrUndefined(label)) {
               label = props.children;
             }
-
             return true;
           }
         } else if (isComponentVNode(vNode, OptionGroup)) {
@@ -38,18 +32,14 @@ export function useLabel() {
             activeIndices.value.push(index);
             return true;
           }
-
           index++;
         }
-
         return false;
       });
     };
-
     loop(children);
     return label;
   }
-
   return {
     getLabel: getLabel,
     activeIndices: activeIndices

package/components/select/useSearchable.js

@@ -11,15 +11,12 @@ export function useSearchable() {
   var menu = useInstance();
   var select = menu.select;
   var checkedKeys = useState([]);
-
   function selectAll() {
     checkedKeys.set(addKeys(checkedKeys.value, menu.get('values')));
   }
-
   function unselectAll() {
     checkedKeys.set(removeKeys(checkedKeys.value, menu.get('values')));
   }
-
   function toggleSelect() {
     var checked = [];
     var unchecked = [];
@@ -32,17 +29,14 @@ export function useSearchable() {
     });
     checkedKeys.set(removeKeys(addKeys(checkedKeys.value, unchecked), checked));
   }
-
   function confirm() {
     select.set('value', checkedKeys.value);
     select.hide();
   }
-
   function initCheckedKeys() {
     var value = select.get('value');
     checkedKeys.set(isNullOrUndefined(value) ? [] : value);
   }
-
   select.watch('value', initCheckedKeys);
   select.on('hide', initCheckedKeys);
   return {
@@ -53,16 +47,12 @@ export function useSearchable() {
     confirm: confirm
   };
 }
-
 function addKeys(origin, keys) {
   var _context;
-
   return _Array$from(new _Set(_concatInstanceProperty(_context = []).call(_context, keys, origin || [])));
 }
-
 function removeKeys(origin, keys) {
   var _context2;
-
   return _filterInstanceProperty(_context2 = origin || []).call(_context2, function (item) {
     return keys.indexOf(item) < 0;
   });

package/components/skeleton/item.d.ts

@@ -1,5 +1,5 @@
 import { Component, TypeDefs } from 'intact-vue-next';
-declare type ItemType = 'text' | 'avator' | 'image' | 'button' | 'input';
+type ItemType = 'text' | 'avator' | 'image' | 'button' | 'input';
 export declare const ItemTypeMap: ItemType[];
 export interface SkeletonItemProps {
     type?: ItemType;

package/components/skeleton/item.js

@@ -7,30 +7,23 @@ export var ItemTypeMap = ['text', 'avator', 'image', 'button', 'input'];
 var typeDefs = {
   type: ItemTypeMap
 };
-
 var defaults = function defaults() {
   return {
     type: 'text'
   };
 };
-
 export var SkeletonItem = /*#__PURE__*/function (_Component) {
   _inheritsLoose(SkeletonItem, _Component);
-
   function SkeletonItem() {
     var _context;
-
     var _this;
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _Component.call.apply(_Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
     _this.config = useConfigContext();
     return _this;
   }
-
   return SkeletonItem;
 }(Component);
 SkeletonItem.template = template;

package/components/skeleton/item.vdt.js

@@ -11,22 +11,17 @@ var _$tmp1 = {
 };
 export default function ($props, $blocks, $__proto__) {
   var _classNameObj, _ItemklsObj;
-
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
-
   var _this$get = this.get(),
-      type = _this$get.type;
-
+    type = _this$get.type;
   var k = this.config.k;
   var classNameObj = (_classNameObj = {}, _classNameObj[k + "-skeleton-item"] = true, _classNameObj[makeItemStyles(k)] = true, _classNameObj);
   var ItemklsObj = (_ItemklsObj = {}, _ItemklsObj[k + "-skeleton-item-box"] = true, _ItemklsObj[k + "-skeleton-item-" + type] = true, _ItemklsObj);
-
   var skeletonItem = _$cv('div', _extends({
     'className': _$cn(ItemklsObj)
   }, getRestProps(this)), type === 'image' ? _$ce(512, 'svg', _$ce(2, 'path', null, 1, null, _$tmp0), 2, null, _$tmp1) : undefined);
-
   return _$ce(2, 'div', skeletonItem, 0, _$cn(classNameObj));
 }
 ;

package/components/skeleton/skeleton.js

@@ -10,31 +10,24 @@ var typeDefs = {
   avator: Boolean,
   size: String
 };
-
 var defaults = function defaults() {
   return {
     rows: 2,
     size: 'large'
   };
 };
-
 export var Skeleton = /*#__PURE__*/function (_Component) {
   _inheritsLoose(Skeleton, _Component);
-
   function Skeleton() {
     var _context;
-
     var _this;
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _Component.call.apply(_Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
     _this.config = useConfigContext();
     return _this;
   }
-
   return Skeleton;
 }(Component);
 Skeleton.template = template;

package/components/skeleton/skeleton.vdt.js

@@ -7,28 +7,22 @@ var _$tmp0 = {
 };
 export default function ($props, $blocks, $__proto__) {
   var _context, _classNameObj;
-
   $blocks || ($blocks = {});
   $props || ($props = {});
   var $this = this;
-
   var _this$get = this.get(),
-      rows = _this$get.rows,
-      avator = _this$get.avator,
-      animated = _this$get.animated,
-      children = _this$get.children,
-      loading = _this$get.loading,
-      size = _this$get.size;
-
+    rows = _this$get.rows,
+    avator = _this$get.avator,
+    animated = _this$get.animated,
+    children = _this$get.children,
+    loading = _this$get.loading,
+    size = _this$get.size;
   var k = this.config.k;
   var targetRows = typeof rows !== 'number' ? 3 : rows < 1 ? 1 : parseInt(rows);
-
   var skeletonList = _fillInstanceProperty(_context = Array(targetRows + 2)).call(_context);
-
   var skeletonItems = _$ma(skeletonList, function ($value, $key) {
     return _$cc(SkeletonItem);
   }, $this);
-
   var classNameObj = (_classNameObj = {}, _classNameObj[k + "-skeleton"] = true, _classNameObj[k + "-animated"] = animated, _classNameObj[makeStyles(k, size)] = true, _classNameObj);
   return loading ? _$ce(2, 'div', children ? _$ce(2, 'div', children, 0) : avator ? _$ce(2, 'div', [_$cc(SkeletonItem, _$tmp0), _$ce(2, 'div', skeletonItems, 0, _$cn(k + "-skeleton-items"))], 4, _$cn(kls('avator-box', k))) : _$ce(2, 'div', skeletonItems, 0, _$cn(k + "-skeleton-items")), 2, _$cn(classNameObj)) : undefined;
 }

package/components/skeleton/styles.d.ts

@@ -1,6 +1,6 @@
 import '../../styles/global';
 export declare const kls: (className: string, k: string) => string;
-declare type ItemSize = 'default' | 'large' | 'small' | 'mini';
+type ItemSize = 'default' | 'large' | 'small' | 'mini';
 export declare const makeStyles: {
     (k: string, size: ItemSize): string;
     clearCache(): {};

package/components/skeleton/styles.js

@@ -1,5 +1,4 @@
 function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-
 import { deepDefaults } from '../../styles/utils';
 import { theme, setDefault } from '../../styles/theme';
 import { css, keyframes } from '@emotion/css';
@@ -18,8 +17,8 @@ setDefault(function () {
   skeleton = deepDefaults(theme, {
     skeleton: defaults
   }).skeleton;
-  makeStyles == null ? void 0 : makeStyles.clearCache();
-  makeItemStyles == null ? void 0 : makeItemStyles.clearCache();
+  makeStyles == null || makeStyles.clearCache();
+  makeItemStyles == null || makeItemStyles.clearCache();
 });
 export var makeStyles = cache(function makeStyles(k, size) {
   return /*#__PURE__*/css("&.", k, "-animated{.", kls('item', k), "{&>.", k, "-skeleton-item-box{background:linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 37%, #f2f2f2 63%);background-size:400% 100%;animation:", skeletonLoading, " 1.4s ease infinite;}}}.", k, "-skeleton-items{.", kls('item', k), ":first-child{.", k, "-skeleton-item-text{width:33%;}}.", kls('item', k), ":last-child{.", k, "-skeleton-item-text{width:61%;}}}.", kls('avator-box', k), "{display:flex;&>div:last-child{flex-grow:1;padding-left:20px;}}.", k, "-skeleton-item-button,.", k, "-skeleton-item-input{height:", theme[size].height, ";}");

package/components/slider/index.d.ts

@@ -23,7 +23,7 @@ export interface SliderProps<Range extends boolean = boolean> {
     spinnerProps?: SpinnerProps;
     forceStep?: boolean;
 }
-export declare type SliderMarks = Marks;
+export type SliderMarks = Marks;
 export interface SliderEvents<Range extends boolean = boolean> {
     change: [Value<Range>, Value<Range>];
 }

package/components/slider/index.js

@@ -32,7 +32,6 @@ var typeDefs = {
   forceStep: Boolean
 };
 var defaultStep = 1;
-
 var defaults = function defaults() {
   return {
     max: 100,
@@ -46,22 +45,17 @@ var defaults = function defaults() {
     forceStep: true
   };
 };
-
 var events = {
   change: true
 };
 export var Slider = /*#__PURE__*/function (_Component) {
   _inheritsLoose(Slider, _Component);
-
   function Slider() {
     var _context;
-
     var _this;
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _Component.call.apply(_Component, _concatInstanceProperty(_context = [this]).call(_context, args)) || this;
     _this.step = useStep(defaultStep);
     _this.value = useValue(_this.step, function () {
@@ -77,7 +71,6 @@ export var Slider = /*#__PURE__*/function (_Component) {
     _this.config = useConfigContext();
     return _this;
   }
-
   return Slider;
 }(Component);
 Slider.template = template;