@king-design/vue 2.1.2 → 2.1.4

package/components/colorpicker/styles.js

@@ -7,45 +7,36 @@ var defaults = {
   get height() {
     return theme.default.height;
   },
-
   width: '100px',
-
   get border() {
     return "1px solid " + theme.color.border;
   },
-
   get borderRadius() {
     return theme.borderRadius;
   },
-
   cursor: 'pointer',
   bgColor: '#fff',
   padding: '4px',
-
   get innerBorderRadius() {
     return theme.borderRadius;
   },
-
   // size
   large: {
     get height() {
       return theme.large.height;
     },
-
     width: '120px'
   },
   small: {
     get height() {
       return theme.small.height;
     },
-
     width: '70px'
   },
   mini: {
     get height() {
       return theme.mini.height;
     },
-
     width: '50px',
     padding: '2px'
   },
@@ -101,11 +92,9 @@ var defaults = {
     get bgColor() {
       return theme.color.disabledBg;
     },
-
     get borderColor() {
       return theme.color.disabledBorder;
     },
-
     cursor: 'not-allowed'
   }
 };
@@ -127,7 +116,7 @@ export function makePanelStyles() {
 }
 export function makeAlphaBgColor(_ref) {
   var r = _ref.r,
-      g = _ref.g,
-      b = _ref.b;
+    g = _ref.g,
+    b = _ref.b;
   return /*#__PURE__*/css(".k-slider-track-wrapper{background:linear-gradient(to right, rgba(", r, ", ", g, ", ", b, ", 0) 0%, rgb(", r, ", ", g, ", ", b, ") 100%);}");
 }

package/components/colorpicker/useDrag.js

@@ -5,35 +5,31 @@ export function useDrag() {
   var mousedown = false;
   var mousemove = false;
   var x;
-
   var _useDraggable = useDraggable({
-    onStart: function onStart(e) {
-      mousedown = true;
-      x = e.clientX;
-      instance.get('onStart')();
-    },
-    onMove: function onMove(e) {
-      mousemove = true;
-
-      var _instance$get = instance.get(),
+      onStart: function onStart(e) {
+        mousedown = true;
+        x = e.clientX;
+        instance.get('onStart')();
+      },
+      onMove: function onMove(e) {
+        mousemove = true;
+        var _instance$get = instance.get(),
           value = _instance$get.value,
           max = _instance$get.max;
-
-      var deltaX = e.clientX - x;
-      var newValue = value + deltaX;
-      x = e.clientX;
-      instance.set('value', Math.min(max, Math.max(0, newValue)));
-    },
-    onEnd: function onEnd(e) {
-      if (instance.$unmounted) return;
-      if (mousedown && !mousemove) instance.trigger('click');
-      mousedown = false;
-      mousemove = false;
-      instance.get('onEnd')();
-    }
-  }),
-      start = _useDraggable.start;
-
+        var deltaX = e.clientX - x;
+        var newValue = value + deltaX;
+        x = e.clientX;
+        instance.set('value', Math.min(max, Math.max(0, newValue)));
+      },
+      onEnd: function onEnd(e) {
+        if (instance.$unmounted) return;
+        if (mousedown && !mousemove) instance.trigger('click');
+        mousedown = false;
+        mousemove = false;
+        instance.get('onEnd')();
+      }
+    }),
+    start = _useDraggable.start;
   return {
     start: start
   };

package/components/colorpicker/useInput.js

@@ -5,64 +5,48 @@ import { useInstance } from 'intact-vue-next';
 import tinycolor from 'tinycolor2';
 import { useState } from '../../hooks/useState';
 export var Mode;
-
 (function (Mode) {
   Mode[Mode["RGB"] = 0] = "RGB";
   Mode[Mode["HSL"] = 1] = "HSL";
 })(Mode || (Mode = {}));
-
 export function useInput(hsv, rgb, hsl) {
   var instance = useInstance();
   var mode = useState(Mode.RGB);
   var dragging = useState(false);
-
   function onInputHex(e) {
     var _context;
-
     var hex = _trimInstanceProperty(_context = e.target.value).call(_context);
-
     var color = tinycolor(hex);
-
     if (color.isValid()) {
       hsv.set(color.toHsv());
     }
   }
-
   function changeMode() {
     mode.set(mode.value === Mode.RGB ? Mode.HSL : Mode.RGB);
   }
-
   function changeColor(type, v) {
     var _extends2;
-
     var isRgb = mode.value === Mode.RGB;
     var color = isRgb ? rgb.value : hsl.value;
-
     if (!isRgb && type !== 'h' || type === 'a') {
       v = v / 100;
     }
-
     if (color[type] === v) return;
     hsv.set(tinycolor(_extends({}, color, (_extends2 = {}, _extends2[type] = v, _extends2))).toHsv());
   }
-
   function setInputValue(type, maxValue, e) {
     var _context2;
-
     var value = parseInt(_trimInstanceProperty(_context2 = e.target.value).call(_context2), 10);
     if (_Number$isNaN(value)) return;
     value = Math.min(Math.max(0, value), maxValue);
     changeColor(type, value);
   }
-
   function onStart() {
     dragging.set(true);
   }
-
   function onEnd() {
     dragging.set(false);
   }
-
   return {
     onInputHex: onInputHex,
     mode: mode,

package/components/colorpicker/usePointer.js

@@ -7,25 +7,22 @@ window.tinycolor = tinycolor;
 export function usePointer(hsv, format) {
   var instance = useInstance();
   var areaRef = createRef();
-
   var _useDraggable = useDraggable({
-    onStart: function onStart(e) {
-      handleChange(e);
-    },
-    onMove: function onMove(e) {
-      handleChange(e);
-    }
-  }),
-      start = _useDraggable.start; // @reference: https://github.com/casesandberg/react-color/blob/master/src/helpers/saturation.js
-
-
+      onStart: function onStart(e) {
+        handleChange(e);
+      },
+      onMove: function onMove(e) {
+        handleChange(e);
+      }
+    }),
+    start = _useDraggable.start;
+  // @reference: https://github.com/casesandberg/react-color/blob/master/src/helpers/saturation.js
   function handleChange(e) {
     var _areaRef$value$getBou = areaRef.value.getBoundingClientRect(),
-        width = _areaRef$value$getBou.width,
-        height = _areaRef$value$getBou.height,
-        _left = _areaRef$value$getBou.left,
-        _top = _areaRef$value$getBou.top;
-
+      width = _areaRef$value$getBou.width,
+      height = _areaRef$value$getBou.height,
+      _left = _areaRef$value$getBou.left,
+      _top = _areaRef$value$getBou.top;
     var x = isNumber(e.pageX) ? e.pageX : e.touches[0].pageX;
     var y = isNumber(e.pageY) ? e.pageY : e.touches[0].pageY;
     var left = x - _left - window.pageXOffset;
@@ -37,13 +34,13 @@ export function usePointer(hsv, format) {
     hsv.set(_extends({}, hsv.value, {
       s: saturation,
       v: bright
-    })); // const value = tinycolor(hsv.value!).toString(format.value as 'rgb');
+    }));
+    // const value = tinycolor(hsv.value!).toString(format.value as 'rgb');
     // // console.log()
     // // const tinyValue = tinycolor(value);
     // // console.log(hsv, value, tinycolor(hsv).toHsv(), getFormat(), tinyValue.toHsv());
     // instance.set({value});
   }
-
   return {
     start: start,
     areaRef: areaRef

package/components/colorpicker/useValue.js

@@ -19,30 +19,25 @@ export function useValue() {
     var color = tinycolor(hsv);
     rgb.set(color.toRgb());
     hex.set(color.toHex());
-    hsl.set(color.toHsl()); // if alpha less than 1, use rgba format
-
+    hsl.set(color.toHsl());
+    // if alpha less than 1, use rgba format
     var _format = hsv.a < 1 ? 'rgb' : format.value;
-
     instance.set('value', color.toString(_format));
   });
-
   function changeHue(v) {
     hsv.set(_extends({}, hsv.value, {
       h: v
     }));
   }
-
   function changeAlpha(v) {
     format.set('rgb');
     hsv.set(_extends({}, hsv.value, {
       a: v
     }));
   }
-
   function setValue(v) {
     hsv.set(tinycolor(v).toHsv());
   }
-
   return {
     format: format,
     hex: hex,

package/components/context.d.ts

@@ -5,8 +5,8 @@ export interface ProviderProps<T> {
 export interface ConsumerProps<T> {
     defaultValue?: T;
 }
-declare type ProviderConstructor<T> = ComponentConstructor<Component<ProviderProps<T>>>;
-declare type ConsumerConstructor<T> = ComponentConstructor<Component<ConsumerProps<T>>>;
+type ProviderConstructor<T> = ComponentConstructor<Component<ProviderProps<T>>>;
+type ConsumerConstructor<T> = ComponentConstructor<Component<ConsumerProps<T>>>;
 export declare function createContext<T = any>(defaultValue?: T): {
     Provider: ProviderConstructor<T>;
     Consumer: ConsumerConstructor<T>;

package/components/context.js

@@ -5,26 +5,19 @@ import { isNullOrUndefined } from 'intact-shared';
 var id = 0;
 export function createContext(defaultValue) {
   var injectionKey = "$Context-" + id++;
-
   var Provider = /*#__PURE__*/function (_Component) {
     _inheritsLoose(Provider, _Component);
-
     function Provider() {
       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.ref = createRef();
       return _this;
     }
-
     var _proto = Provider.prototype;
-
     _proto.init = function init(props) {
       var value = props && props.value;
       var ref = this.ref;
@@ -34,49 +27,39 @@ export function createContext(defaultValue) {
         return ref.value = v;
       });
     };
-
     return Provider;
   }(Component);
-
   Provider.template = providerTemplate;
-
   var Consumer = /*#__PURE__*/function (_Component2) {
     _inheritsLoose(Consumer, _Component2);
-
     function Consumer() {
       var _context2;
-
       var _this2;
-
       for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
         args[_key2] = arguments[_key2];
       }
-
       _this2 = _Component2.call.apply(_Component2, _concatInstanceProperty(_context2 = [this]).call(_context2, args)) || this;
       _this2.ref = inject(injectionKey, null);
       return _this2;
     }
-
     return Consumer;
   }(Component);
-
   Consumer.template = consumerTemplate;
   return {
     Provider: Provider,
     Consumer: Consumer
   };
 }
-
 function providerTemplate() {
   return this.$props.children;
 }
-
 function consumerTemplate() {
   var ref = this.ref;
   var props = this.$props;
   var value = ref && ref.value || props && props.value;
   return this.$props.children(value);
-} // Maybe like legency context api of React
+}
+// Maybe like legency context api of React
 // Error: Can not use it in multiple instances.
 // export function Context<T = any>(defaultValue?: T) {
 // let data: T | undefined;

package/components/datepicker/basepicker.d.ts

@@ -9,13 +9,13 @@ import type { useDisabled } from './useDisabled';
 import { PanelFlags, usePanel } from './usePanel';
 import { BaseSelect, BaseSelectProps, BaseSelectEvents, BaseSelectBlocks } from '../select/base';
 import type { Events } from '../types';
-export declare type StateValueRange = [Dayjs, Dayjs?];
-export declare type StateValueItem = Dayjs | StateValueRange;
-export declare type StateValue = StateValueItem[];
-export declare type StringValue = string | string[] | [string, string] | [string, string][];
-export declare type DayjsValueRange = [Dayjs, Dayjs];
-export declare type DayjsValueItem = Dayjs | DayjsValueRange;
-export declare type DayjsValue = DayjsValueItem[];
+export type StateValueRange = [Dayjs, Dayjs?];
+export type StateValueItem = Dayjs | StateValueRange;
+export type StateValue = StateValueItem[];
+export type StringValue = string | string[] | [string, string] | [string, string][];
+export type DayjsValueRange = [Dayjs, Dayjs];
+export type DayjsValueItem = Dayjs | DayjsValueRange;
+export type DayjsValue = DayjsValueItem[];
 export interface BasePickerProps<V extends Value = Value, Multipe extends boolean = boolean, Range extends boolean = boolean> extends BaseSelectProps<V | [V, V], Multipe> {
     value?: Multipe extends true ? Range extends true ? [
         V,
@@ -37,7 +37,7 @@ export interface BasePickerEvents extends BaseSelectEvents {
 }
 export interface BasePickerBlocks<V extends Value = Value, R extends boolean = boolean> extends BaseSelectBlocks<R extends true ? [Value, Value] : Value> {
 }
-export declare type Value = string | Date | number | Dayjs;
+export type Value = string | Date | number | Dayjs;
 export declare abstract class BasePicker<T extends BasePickerProps = BasePickerProps, E extends BasePickerEvents = BasePickerEvents, B extends BasePickerBlocks<any> = BasePickerBlocks<any>> extends BaseSelect<T, E, B> {
     static typeDefs: Required<TypeDefs<BasePickerProps<Value, boolean, boolean>>>;
     static defaults: () => Partial<BasePickerProps<any, boolean, boolean>>;