cbvirtua 1.0.6 → 1.0.8

package/asy.js

@@ -0,0 +1,32 @@
+async function asyncTaskWithCb(cb) {
+    let err, user, savedTask, notification;
+
+    [ err, user ] = await to(UserModel.findById(1));
+    if(!user) return cb('No user found');
+
+    [ err, savedTask ] = await to(TaskModel({userId: user.id, name: 'Demo Task'}));
+    if(err) return cb('Error occurred while saving task');
+
+   if(user.notificationsEnabled) {
+      [ err ] = await to(NotificationService.sendNotification(user.id, 'Task Created'));
+      if(err) return cb('Error while sending notification');
+   }
+
+   if(savedTask.assignedUser.id !== user.id) {
+      [ err, notification ] = await to(NotificationService.sendNotification(savedTask.assignedUser.id, 'Task was created for you'));
+      if(err) return cb('Error while sending notification');
+   }
+
+   cb(null, savedTask);
+}
+
+function to(promise, errorExt) {
+    return promise
+        .then(function (data) { return [null, data]; }) // 执行成功，返回数组第一项为 null。第二个是结果。
+        .catch(function (err) {
+        if (errorExt) {
+            Object.assign(err, errorExt);
+        }
+        return [err, undefined]; // 执行失败，返回数组第一项为错误信息，第二项为 undefined
+    });
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cbvirtua",
-  "version": "1.0.6",
+  "version": "1.0.8",
   "description": "",
   "main": "index.js",
   "scripts": {

package/style/basic.less

@@ -0,0 +1,69 @@
+@sides: {
+  top: bottom;
+  bottom: top;
+  left: right;
+  right: left;
+}
+@N: .van-popper;
+@{N} {
+  --van-arrow-size: 10px;
+  --van-popper-content-bg: #fff;
+  --van-popper-border: 1px solid #ebedf0;
+  border-radius: 4px;
+  color: #000;
+  background-color: var(--van-popper-content-bg);
+  padding: 10px 12px;
+  border: var(--van-popper-border);
+  position: absolute;
+  white-space: nowrap;
+  transition: opacity .3s;
+  font-size: 13px;
+  z-index: 1000;
+  width: max-content;
+  
+  &__arrow {
+    position: absolute;
+    width: 10px;
+    height: 10px;
+    background: var(--van-popper-content-bg);
+    transform: rotate(45deg);
+  }
+
+  each(@sides, {
+    &[data-side^='@{value}'] {
+      @{N}__arrow {
+        @{key}: -5px;
+      }
+      @{N}__arrow {
+        border-@{key}: var(--van-popper-border);
+      }
+      @{N}__arrow when (@value =top) {
+        border-right: var(--van-popper-border);
+      }
+      @{N}__arrow when (@value =bottom) {
+        border-left: var(--van-popper-border);
+      }
+      @{N}__arrow when (@value =left) {
+        border-top: var(--van-popper-border);
+      }
+      @{N}__arrow when (@value =right) {
+        border-bottom: var(--van-popper-border);
+      }
+    }
+  });
+
+  &.is-dark {
+    --van-popper-content-bg: #000;
+    color: #fff;
+    border: none;
+
+    @{N}__arrow {
+      border-color: transparent;
+    }
+  }
+}
+
+.van-popper-fade-enter-from,
+.van-popper-fade-leave-to {
+  opacity: 0;
+}

package/style/index.less

@@ -0,0 +1,125 @@
+@import '../../style/themes/index';
+@import '../../style/mixins/index';
+@import './mixin';
+
+@row-prefix-cls: ~'@{ant-prefix}-row';
+@col-prefix-cls: ~'@{ant-prefix}-col';
+
+// Grid system
+.@{row-prefix-cls} {
+  display: flex;
+  flex-flow: row wrap;
+
+  &::before,
+  &::after {
+    display: flex;
+  }
+
+  // No wrap of flex
+  &-no-wrap {
+    flex-wrap: nowrap;
+  }
+}
+
+// x轴原点
+.@{row-prefix-cls}-start {
+  justify-content: flex-start;
+}
+
+// x轴居中
+.@{row-prefix-cls}-center {
+  justify-content: center;
+}
+
+// x轴反方向
+.@{row-prefix-cls}-end {
+  justify-content: flex-end;
+}
+
+// x轴平分
+.@{row-prefix-cls}-space-between {
+  justify-content: space-between;
+}
+
+// x轴有间隔地平分
+.@{row-prefix-cls}-space-around {
+  justify-content: space-around;
+}
+
+// 顶部对齐
+.@{row-prefix-cls}-top {
+  align-items: flex-start;
+}
+
+// 居中对齐
+.@{row-prefix-cls}-middle {
+  align-items: center;
+}
+
+// 底部对齐
+.@{row-prefix-cls}-bottom {
+  align-items: flex-end;
+}
+
+.@{col-prefix-cls} {
+  position: relative;
+  max-width: 100%;
+  // Prevent columns from collapsing when empty
+  min-height: 1px;
+}
+
+.make-grid();
+
+// Extra small grid
+//
+// Columns, offsets, pushes, and pulls for extra small devices like
+// smartphones.
+
+.make-grid(-xs);
+
+// Small grid
+//
+// Columns, offsets, pushes, and pulls for the small device range, from phones
+// to tablets.
+
+@media (min-width: @screen-sm-min) {
+  .make-grid(-sm);
+}
+
+// Medium grid
+//
+// Columns, offsets, pushes, and pulls for the desktop device range.
+
+@media (min-width: @screen-md-min) {
+  .make-grid(-md);
+}
+
+// Large grid
+//
+// Columns, offsets, pushes, and pulls for the large desktop device range.
+
+@media (min-width: @screen-lg-min) {
+  .make-grid(-lg);
+}
+
+// Extra Large grid
+//
+// Columns, offsets, pushes, and pulls for the full hd device range.
+
+@media (min-width: @screen-xl-min) {
+  .make-grid(-xl);
+}
+
+// Extra Extra Large grid
+//
+// Columns, offsets, pushes, and pulls for the full hd device range.
+
+@media (min-width: @screen-xxl-min) {
+  .make-grid(-xxl);
+}
+
+@media (min-width: @screen-xxxl-min) {
+  .make-grid(-xxxl);
+}
+
+@import './rtl';

package/style/index.tsx

@@ -0,0 +1,2 @@
+import '../../style/index.less';
+import './index.less';

package/style/mixin.less

@@ -0,0 +1,53 @@
+@import '../../style/mixins/index';
+
+// mixins for grid system
+// ------------------------
+
+.loop-grid-columns(@index, @class) when (@index > 0) {
+  .@{ant-prefix}-col@{class}-@{index} {
+    display: block;
+    flex: 0 0 percentage((@index / @grid-columns));
+    max-width: percentage((@index / @grid-columns));
+  }
+  .@{ant-prefix}-col@{class}-push-@{index} {
+    left: percentage((@index / @grid-columns));
+  }
+  .@{ant-prefix}-col@{class}-pull-@{index} {
+    right: percentage((@index / @grid-columns));
+  }
+  .@{ant-prefix}-col@{class}-offset-@{index} {
+    margin-left: percentage((@index / @grid-columns));
+  }
+  .@{ant-prefix}-col@{class}-order-@{index} {
+    order: @index;
+  }
+  .loop-grid-columns((@index - 1), @class);
+}
+
+.loop-grid-columns(@index, @class) when (@index = 0) {
+  .@{ant-prefix}-col@{class}-@{index} {
+    display: none;
+  }
+  .@{ant-prefix}-col-push-@{index} {
+    left: auto;
+  }
+  .@{ant-prefix}-col-pull-@{index} {
+    right: auto;
+  }
+  .@{ant-prefix}-col@{class}-push-@{index} {
+    left: auto;
+  }
+  .@{ant-prefix}-col@{class}-pull-@{index} {
+    right: auto;
+  }
+  .@{ant-prefix}-col@{class}-offset-@{index} {
+    margin-left: 0;
+  }
+  .@{ant-prefix}-col@{class}-order-@{index} {
+    order: 0;
+  }
+}
+
+.make-grid(@class: ~'') {
+  .loop-grid-columns(@grid-columns, @class);
+}

package/style/rtl.less

@@ -0,0 +1,68 @@
+@import '../../style/themes/index';
+@import '../../style/mixins/index';
+
+.@{ant-prefix}-row {
+  &-rtl {
+    direction: rtl;
+  }
+}
+
+// mixin
+.loop-grid-columns(@index, @class) when (@index > 0) {
+  .@{ant-prefix}-col@{class}-push-@{index} {
+    // reset property in RTL direction
+    &.@{ant-prefix}-col-rtl {
+      right: percentage((@index / @grid-columns));
+      left: auto;
+    }
+  }
+
+  .@{ant-prefix}-col@{class}-pull-@{index} {
+    // reset property in RTL direction
+    &.@{ant-prefix}-col-rtl {
+      right: auto;
+      left: percentage((@index / @grid-columns));
+    }
+  }
+
+  .@{ant-prefix}-col@{class}-offset-@{index} {
+    // reset property in RTL direction
+    &.@{ant-prefix}-col-rtl {
+      margin-right: percentage((@index / @grid-columns));
+      margin-left: 0;
+    }
+  }
+}
+
+.loop-grid-columns(@index, @class) when (@index = 0) {
+  .@{ant-prefix}-col-push-@{index} {
+    // reset property in RTL direction
+    &.@{ant-prefix}-col-rtl {
+      right: auto;
+    }
+  }
+
+  .@{ant-prefix}-col-pull-@{index} {
+    &.@{ant-prefix}-col-rtl {
+      left: auto;
+    }
+  }
+
+  .@{ant-prefix}-col@{class}-push-@{index} {
+    &.@{ant-prefix}-col-rtl {
+      right: auto;
+    }
+  }
+
+  .@{ant-prefix}-col@{class}-pull-@{index} {
+    &.@{ant-prefix}-col-rtl {
+      left: auto;
+    }
+  }
+
+  .@{ant-prefix}-col@{class}-offset-@{index} {
+    &.@{ant-prefix}-col-rtl {
+      margin-right: 0;
+    }
+  }
+}

package/v2/App.vue

@@ -1,56 +0,0 @@
-<template>
-  <div id="app">
-    <Dropdown :distance="6">
-      <button>Click me</button>
-      <template #popper>
-        <button v-close-popper="myBooleanProp" @click="hide">Close</button>
-      </template>
-    </Dropdown>
-
-  </div>
-</template>
-
-<script>
-import {
-  // Directives
-  vTooltip,
-  VClosePopper,
-  // Components
-  Dropdown,
-  Tooltip,
-  Menu
-} from './components/v2'
-console.log(VClosePopper)
-export default {
-  name: 'App',
-  data() {
-    return {
-      myBooleanProp: true
-    }
-  },
-  directives: {
-    'close-popper': VClosePopper
-  },
-  components: {
-    Dropdown
-  },
-  methods: {
-    hide() {
-      console.log(123)
-      this.myBooleanProp = true
-      console.log(this.myBooleanProp)
-    }
-  }
-}
-</script>
-
-<style>
-#app {
-  font-family: Avenir, Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-  margin-top: 60px;
-}
-</style>

package/v2/components/Dropdown.vue

@@ -1,28 +0,0 @@
-<script lang="ts">
-import PopperWrapper from './PopperWrapper.vue'
-
-export default {
-  ...PopperWrapper,
-  name: 'VDropdown',
-  vPopperTheme: 'dropdown',
-}
-</script>
-
-<style>
-.v-popper--theme-dropdown .v-popper__inner {
-  background: #fff;
-  color: black;
-  border-radius: 6px;
-  border: 1px solid #ddd;
-  box-shadow: 0 6px 30px rgba(0, 0, 0, .1);
-}
-
-.v-popper--theme-dropdown .v-popper__arrow-inner {
-  visibility: visible;
-  border-color: #fff;
-}
-
-.v-popper--theme-dropdown .v-popper__arrow-outer {
-  border-color: #ddd;
-}
-</style>

package/v2/components/Menu.vue

@@ -1,9 +0,0 @@
-<script lang="ts">
-import PopperWrapper from './PopperWrapper.vue'
-
-export default {
-  ...PopperWrapper,
-  name: 'VMenu',
-  vPopperTheme: 'menu',
-}
-</script>