bkui-vue 0.0.1-beta.36 → 0.0.1-beta.39

package/lib/loading/loading.css

@@ -1,261 +0,0 @@
-@keyframes loading-scale-animate {
-  0% {
-    transform: scale(1);
-  }
-  100% {
-    transform: scale(0.6);
-  }
-}
-@keyframes fade {
-  100% {
-    background-color: transparent;
-  }
-}
-.bk-fade-transtion .bk-fade-enter-active,
-.bk-fade-transtion .bk-fade-leave-active {
-  transition: all 0.3s cubic-bezier(0.55, 0, 0.1, 1);
-}
-.bk-fade-transtion .bk-fade-enter,
-.bk-fade-transtion .bk-fade-leave-to {
-  opacity: 0;
-}
-.bk-loading-wrapper {
-  position: static;
-  font-size: 0;
-  vertical-align: middle;
-}
-.bk-loading-wrapper:not(.bk-nested-loading) {
-  display: inline-block;
-}
-.bk-loading-wrapper.bk-nested-loading {
-  position: relative;
-}
-.bk-loading-wrapper.bk-nested-loading.is-block {
-  display: block;
-}
-.bk-loading-wrapper.bk-nested-loading .bk-loading-indicator {
-  position: absolute;
-  top: 50%;
-  left: 50%;
-  z-index: 4;
-  text-align: center;
-  transform: translate(-50%, -50%);
-}
-.bk-loading-wrapper .dot {
-  display: inline-block;
-  width: 14px;
-  height: 14px;
-  margin-right: 10px;
-  border-radius: 50%;
-  transform: scale(0.6);
-  animation-duration: 0.8s;
-  animation-iteration-count: infinite;
-  animation-name: loading-scale-animate;
-  animation-direction: normal;
-}
-.bk-loading-wrapper .oval {
-  position: absolute;
-  width: 6px;
-  height: 8px;
-  background-color: #63656e;
-  border-radius: 8px;
-  animation-duration: 1.2s;
-  animation-iteration-count: infinite;
-  animation-name: fade;
-  transform-origin: center 20px;
-  animation-direction: normal;
-}
-.bk-loading-wrapper .bk-loading-mask {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-  opacity: 0.5;
-}
-.bk-loading-wrapper .bk-loading-mask::after {
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  z-index: 10;
-  width: 100%;
-  height: 100%;
-  background-color: rgba(255, 255, 255, 0.8);
-  content: '';
-}
-.bk-loading-wrapper .bk-loading-indicator {
-  line-height: 1;
-  text-align: center;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .oval,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-1,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-2,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-3,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-success .dot-4 {
-  background-color: #2dcb56;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .oval,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-1,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-2,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-3,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-danger .dot-4 {
-  background-color: #ea3636;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .oval,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-1,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-2,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-3,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-warning .dot-4 {
-  background-color: #ff9c01;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .oval,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-1,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-2,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-3,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-primary .dot-4 {
-  background-color: #3a84ff;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .oval,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-1,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-2,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-3,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-white .dot-4 {
-  background-color: white;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .oval,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-1,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-2,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-3,
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-default .dot-4 {
-  background-color: #c4c6cc;
-}
-.bk-loading-wrapper .bk-loading-indicator .dot-1 {
-  background-color: #ea3636;
-  animation-delay: 0.1s;
-}
-.bk-loading-wrapper .bk-loading-indicator .dot-2 {
-  background-color: #ff9c01;
-  animation-delay: 0.25s;
-}
-.bk-loading-wrapper .bk-loading-indicator .dot-3 {
-  background-color: #2dcb56;
-  animation-delay: 0.4s;
-}
-.bk-loading-wrapper .bk-loading-indicator .dot-4 {
-  background-color: #3a84ff;
-  animation-delay: 0.55s;
-  margin-right: 0px;
-}
-.bk-loading-wrapper .bk-loading-indicator .oval-1 {
-  transform: rotate(-135deg);
-  animation-delay: 0.6s;
-}
-.bk-loading-wrapper .bk-loading-indicator .oval-2 {
-  transform: rotate(-90deg);
-  animation-delay: 0.75s;
-}
-.bk-loading-wrapper .bk-loading-indicator .oval-3 {
-  transform: rotate(-45deg);
-  animation-delay: 0.9s;
-}
-.bk-loading-wrapper .bk-loading-indicator .oval-4 {
-  transform: rotate(0deg);
-  animation-delay: 1.05s;
-}
-.bk-loading-wrapper .bk-loading-indicator .oval-5 {
-  transform: rotate(45deg);
-  animation-delay: 1.2s;
-}
-.bk-loading-wrapper .bk-loading-indicator .oval-6 {
-  transform: rotate(90deg);
-  animation-delay: 1.35s;
-}
-.bk-loading-wrapper .bk-loading-indicator .oval-7 {
-  transform: rotate(135deg);
-  animation-delay: 1.5s;
-}
-.bk-loading-wrapper .bk-loading-indicator .oval-8 {
-  transform: rotate(180deg);
-  animation-delay: 1.65s;
-}
-.bk-loading-wrapper .bk-loading-indicator .bk-spin-indicator {
-  display: inline-block;
-  width: 40px;
-  height: 40px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .bk-spin-indicator {
-  height: 16px;
-  width: 16px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .dot {
-  width: 3px;
-  height: 3px;
-  margin-right: 3px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .dot.dot-4 {
-  margin-right: 0;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .oval {
-  width: 2px;
-  height: 3px;
-  border-radius: 3px;
-  transform-origin: center 8px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-mini .bk-loading-title {
-  font-size: 14px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-spin-indicator {
-  height: 22px;
-  width: 22px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .dot {
-  width: 6px;
-  height: 6px;
-  margin-right: 6px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .dot.dot-4 {
-  margin-right: 0;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .oval {
-  width: 4px;
-  height: 5px;
-  border-radius: 5px;
-  transform-origin: center 11px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-small .bk-loading-title {
-  font-size: 12px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-spin-indicator {
-  height: 52px;
-  width: 52px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .dot {
-  width: 20px;
-  height: 20px;
-  margin-right: 12px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .dot.dot-4 {
-  margin-right: 0;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .oval {
-  width: 8px;
-  height: 12px;
-  border-radius: 12px;
-  transform-origin: center 26px;
-}
-.bk-loading-wrapper .bk-loading-indicator.bk-loading-size-large .bk-loading-title {
-  font-size: 14px;
-}
-.bk-loading-wrapper .bk-loading-indicator .bk-loading-title {
-  margin-top: 8px;
-  font-size: 14px;
-  line-height: normal;
-  color: #63656e;
-  text-align: center;
-}

package/lib/loading/loading.d.ts

@@ -1,94 +0,0 @@
-import { ExtractPropTypes } from 'vue';
-export declare enum BkLoadingMode {
-    Default = "default",
-    Spin = "spin"
-}
-export declare enum BkLoadingSize {
-    Normal = "",
-    Mini = "mini",
-    Small = "small",
-    Large = "large"
-}
-export declare function setDefaultIndicator(Indicator: any): void;
-export declare const loadingTypes: {
-    indicator: {
-        type: FunctionConstructor;
-    };
-    loading: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    };
-    inline: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-    theme: import("vue-types").VueTypeDef<string>;
-    title: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    } & {
-        default: string;
-    };
-    size: import("vue-types").VueTypeDef<string> & {
-        default: string;
-    };
-    mode: import("vue-types").VueTypeDef<string> & {
-        default: string;
-    };
-};
-export declare type LoadingTypes = ExtractPropTypes<typeof loadingTypes>;
-declare const _default: import("vue").DefineComponent<{
-    indicator: {
-        type: FunctionConstructor;
-    };
-    loading: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    };
-    inline: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-    theme: import("vue-types").VueTypeDef<string>;
-    title: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    } & {
-        default: string;
-    };
-    size: import("vue-types").VueTypeDef<string> & {
-        default: string;
-    };
-    mode: import("vue-types").VueTypeDef<string> & {
-        default: string;
-    };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
-    indicator: {
-        type: FunctionConstructor;
-    };
-    loading: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    };
-    inline: import("vue-types").VueTypeValidableDef<boolean> & {
-        default: boolean;
-    } & {
-        default: boolean;
-    };
-    theme: import("vue-types").VueTypeDef<string>;
-    title: import("vue-types").VueTypeValidableDef<string> & {
-        default: string;
-    } & {
-        default: string;
-    };
-    size: import("vue-types").VueTypeDef<string> & {
-        default: string;
-    };
-    mode: import("vue-types").VueTypeDef<string> & {
-        default: string;
-    };
-}>>, {
-    title: string;
-    inline: boolean;
-    size: string;
-    loading: boolean;
-    mode: string;
-}>;
-export default _default;

package/lib/loading/loading.js

@@ -1 +0,0 @@
-!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t(require("../shared"),require("@babel/runtime/helpers/defineProperty"),require("vue"));else if("function"==typeof define&&define.amd)define(["../shared","@babel/runtime/helpers/defineProperty","vue"],t);else{var o="object"==typeof exports?t(require("../shared"),require("@babel/runtime/helpers/defineProperty"),require("vue")):t(e["../shared"],e["@babel/runtime/helpers/defineProperty"],e.vue);for(var r in o)("object"==typeof exports?exports:e)[r]=o[r]}}(self,((e,t,o)=>(()=>{"use strict";var r={4212:t=>{t.exports=e},311:e=>{e.exports=t},748:e=>{e.exports=o}},n={};function a(e){var t=n[e];if(void 0!==t)return t.exports;var o=n[e]={exports:{}};return r[e](o,o.exports,a),o.exports}a.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return a.d(t,{a:t}),t},a.d=(e,t)=>{for(var o in t)a.o(t,o)&&!a.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},a.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),a.r=e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var i={};return(()=>{a.r(i),a.d(i,{BkLoading:()=>p,BkLoadingMode:()=>e,BkLoadingSize:()=>t,default:()=>f,setDefaultIndicator:()=>u});var e,t,o,r=a(4212),n=a(311),l=a.n(n),d=a(748);function u(e){o="function"==typeof e?e:function(){return(0,d.createVNode)(e,null,null)}}!function(e){e.Default="default",e.Spin="spin"}(e||(e={})),function(e){e.Normal="",e.Mini="mini",e.Small="small",e.Large="large"}(t||(t={}));var s={indicator:{type:Function},loading:r.PropTypes.bool,inline:r.PropTypes.bool.def(!0),theme:r.PropTypes.theme(["white","primary","warning","success","danger"]),title:r.PropTypes.string.def(""),size:r.PropTypes.commonType(Object.values(t)).def(t.Normal),mode:r.PropTypes.commonType(Object.values(e)).def("default")};const c=(0,d.defineComponent)({name:"Loading",props:s,setup:function(t,n){this.$createElement;var a=[1,2,3,4].map((function(e){return(0,d.createVNode)("span",{class:"dot dot-".concat(e)},null)})),i=(0,d.createVNode)("div",{class:"bk-spin-indicator"},[[1,2,3,4,5,6,7,8].map((function(e){return(0,d.createVNode)("span",{class:"oval oval-".concat(e)},null)}))]),u=(0,d.computed)((function(){return(0,r.classes)({"bk-loading-wrapper":t.loading,"bk-nested-loading":!!n.slots.default})})),s=(0,d.computed)((function(){var e;return(0,r.classes)((e={},l()(e,"bk-loading-size-".concat(t.size),!!t.size),l()(e,"bk-loading-".concat(t.theme),!!t.theme),e),"bk-loading-indicator")})),c=(0,d.computed)((function(){return!!t.title})),p=(0,d.computed)((function(){var r=t.mode===e.Spin;return"function"==typeof t.indicator?(0,d.createVNode)(t.indicator,null,null):"function"==typeof o?(0,d.createVNode)(o,null,null):r?i:a}));return function(){var e,o;return(0,d.createVNode)("div",{class:u.value},[t.loading&&(0,d.createVNode)(d.Fragment,null,[(0,d.createVNode)("div",{class:s.value},[p.value,c.value&&(0,d.createVNode)("div",{class:"bk-loading-title"},[t.title])]),n.slots.default&&(0,d.createVNode)("div",{class:"bk-loading-mask"},null)]),null===(o=(e=n.slots).default)||void 0===o?void 0:o.call(e)])}}});var p=(0,r.withInstallProps)(c,{setDefaultIndicator:u,BkLoadingMode:e,BkLoadingSize:t},!0);const f=p})(),i})()));

package/lib/loading/loading.less

@@ -1,197 +0,0 @@
-@import '../styles/themes/themes.less';
-@import '../styles/mixins/mixins.less';
-
-@dotSize: 14px;
-@dotGap: 10px;
-@ovalWidth: 6px;
-@ovalHeight: 8px;
-@ovalGap: 20px;
-@titleMarginTop: 8px;
-
-@miniDotSize: 3px;
-@miniDotGap: 3px;
-@miniOvalWidth: 2px;
-@miniOvalHeight: 3px;
-@miniOvalGap: 8px;
-
-@smallDotSize: 6px;
-@smallDotGap: 6px;
-@smallOvalWidth: 4px;
-@smallOvalHeight: 5px;
-@smallOvalGap: 11px;
-
-@largeDotSize: 20px;
-@largeDotGap: 12px;
-@largeOvalWidth: 8px;
-@largeOvalHeight: 12px;
-@largeOvalGap: 26px;
-
-.create-rotate(@time, @deg) {
-  transform: rotate(@deg);
-  animation-delay: @time;
-}
-
-.loading-theme(@theme) {
-  .oval,
-  .dot,
-  .dot-1,
-  .dot-2,
-  .dot-3,
-  .dot-4 {
-    background-color: @theme;
-  }
-}
-
-@sizeSelectors: mini, small, large;
-@selectors: @danger-color, @warning-color, @success-color, @primary-color;
-@themeSelectors: {
-  success: @success-color;
-  danger: @danger-color;
-  warning: @warning-color;
-  primary: @primary-color;
-  white: @white-color;
-  default: @light-gray;
-};
-
-.@{bk-prefix}-loading-wrapper {
-  position: static;
-  font-size: 0;
-  vertical-align: middle;
-  &:not(.@{bk-prefix}-nested-loading) {
-    display: inline-block;
-  }
-
-  &.@{bk-prefix}-nested-loading {
-    position: relative;
-
-    &.is-block {
-      display: block;
-    }
-
-    .@{bk-prefix}-loading-indicator {
-      position: absolute;
-      top: 50%;
-      left: 50%;
-      z-index: 4;
-      text-align: center;
-      transform: translate(-50%, -50%);
-    }
-  }
-
-  .dot {
-    display: inline-block;
-    width: @dotSize;
-    height: @dotSize;
-    margin-right: @dotGap;
-    border-radius: 50%;
-    transform: scale(.6);
-    animation-duration: .8s;
-    animation-iteration-count: infinite;
-    animation-name: loading-scale-animate;
-    animation-direction: normal;
-  }
-
-  .oval {
-    position: absolute;
-    width: @ovalWidth;
-    height: @ovalHeight;
-    background-color: @default-color;
-    border-radius: @ovalHeight;
-    animation-duration: 1.2s;
-    animation-iteration-count: infinite;
-    animation-name: fade;
-    transform-origin: center @ovalGap;
-    animation-direction: normal;
-  }
-
-  .@{bk-prefix}-loading-mask {
-    position: absolute;
-    width: 100%;
-    height: 100%;
-    opacity: .5;
-
-    &::after {
-      position: absolute;
-      top: 0;
-      right: 0;
-      bottom: 0;
-      left: 0;
-      z-index: 10;
-      width: 100%;
-      height: 100%;
-      background-color: rgba(255, 255, 255, .8);
-      content: '';
-    }
-  }
-
-  .@{bk-prefix}-loading-indicator {
-    line-height: 1;
-    text-align: center;
-    each(@themeSelectors, {
-      &.@{bk-prefix}-loading-@{key} {
-        .loading-theme(@value);
-      }
-    })
-    
-      each(@selectors, {
-      .dot-@{index} {
-        background-color: @value;
-        animation-delay: .1s + (@index - 1) * .15;
-        & when (@index = 4) {
-          margin-right: 0px;
-        }
-      }
-    });
-
-    each(range(8), {
-      .oval-@{value} {
-        .create-rotate(.45s + (@value * .15), -135deg + (45 * (@value - 1)));
-      }
-    });
-
-    .@{bk-prefix}-spin-indicator {
-      display: inline-block;
-      width: 2 * @ovalGap;
-      height: 2 * @ovalGap;
-    }
-
-    each(@sizeSelectors, {
-    @sizedDotSize: '@{value}DotSize';
-    @sizedDotGap: '@{value}DotGap';
-    @sizedOvalWidth: '@{value}OvalWidth';
-    @sizedOvalHeight: '@{value}OvalHeight';
-    @sizedOvalGap: '@{value}OvalGap';
-  
-    &.@{bk-prefix}-loading-size-@{value} {
-      .@{bk-prefix}-spin-indicator  {
-        height: 2 * @@sizedOvalGap;
-        width: 2 * @@sizedOvalGap;
-      }
-      .dot {
-        width: @@sizedDotSize;
-        height: @@sizedDotSize;
-        margin-right: @@sizedDotGap;
-        &.dot-4 {
-          margin-right: 0;
-        }
-      }
-      .oval {
-        width: @@sizedOvalWidth;
-        height: @@sizedOvalHeight;
-        border-radius: @@sizedOvalHeight;
-        transform-origin: center @@sizedOvalGap;
-      }
-      .@{bk-prefix}-loading-title {
-        font-size: if(@value = small, @font-size-base, @font-size-medium);
-      }
-    } 
-  })
-    .@{bk-prefix}-loading-title {
-      margin-top: @titleMarginTop;
-      font-size: @font-size-medium;
-      line-height: normal;
-      color: @default-color;
-      text-align: center;
-    }
-  }
-}