@opentiny/vue-drawer - npm Package Compare versions

Comparing version 3.12.0 to 3.13.0-alpha.0

lib/index.js

@@ -15,10 +15,12 @@ function _extends() {
 }
-import { $prefix, $props, $setup } from "@opentiny/vue-common";
+import { $prefix, $setup, $props } from "@opentiny/vue-common";
 import PcTemplate from "./pc.js";
 import MobileFirstTemplate from "./mobile-first.js";
 var template = function template2(mode) {
-  if ("pc" === (process.env.TINY_MODE || mode)) {
+  var _process$env;
+  var tinyMode = typeof process === "object" ? (_process$env = process.env) == null ? void 0 : _process$env.TINY_MODE : null;
+  if ("pc" === (tinyMode || mode)) {
     return PcTemplate;
   }
-  if ("mobile-first" === (process.env.TINY_MODE || mode)) {
+  if ("mobile-first" === (tinyMode || mode)) {
     return MobileFirstTemplate;
@@ -34,61 +36,63 @@ }
     return scrollLockClasses[mode] || "";
-  }
+  },
+  DEFAULT_WIDTH: "500px"
 };
+var drawerProps = _extends({}, $props, {
+  _constants: {
+    type: Object,
+    default: function _default() {
+      return $constants;
+    }
+  },
+  visible: {
+    type: Boolean,
+    default: false
+  },
+  customClass: [String, Object, Array],
+  placement: {
+    type: String,
+    default: "right"
+  },
+  width: {
+    type: String
+  },
+  title: String,
+  showClose: {
+    type: Boolean,
+    default: true
+  },
+  showHeader: {
+    type: Boolean,
+    default: true
+  },
+  showFooter: {
+    type: Boolean,
+    default: false
+  },
+  mask: {
+    type: Boolean,
+    default: true
+  },
+  maskClosable: {
+    type: Boolean,
+    default: true
+  },
+  dragable: Boolean,
+  lockScroll: {
+    type: Boolean,
+    default: true
+  },
+  flex: {
+    type: Boolean,
+    default: false
+  },
+  zIndex: {
+    type: Number,
+    default: 2e3
+  },
+  beforeClose: Function
+});
 var Drawer = {
   name: $prefix + "Drawer",
-  props: _extends({}, $props, {
-    _constants: {
-      type: Object,
-      default: function _default() {
-        return $constants;
-      }
-    },
-    visible: {
-      type: Boolean,
-      default: false
-    },
-    customClass: [String, Object, Array],
-    placement: {
-      type: String,
-      default: "right"
-    },
-    width: {
-      type: String,
-      default: "500px"
-    },
-    title: String,
-    showClose: {
-      type: Boolean,
-      default: true
-    },
-    showHeader: {
-      type: Boolean,
-      default: true
-    },
-    showFooter: {
-      type: Boolean,
-      default: false
-    },
-    mask: {
-      type: Boolean,
-      default: true
-    },
-    maskClosable: {
-      type: Boolean,
-      default: true
-    },
-    dragable: Boolean,
-    lockScroll: {
-      type: Boolean,
-      default: true
-    },
-    flex: {
-      type: Boolean,
-      default: false
-    },
-    zIndex: {
-      type: Number,
-      default: 2e3
-    }
-  }),
+  props: drawerProps,
   setup: function setup(props, context) {
@@ -102,3 +106,3 @@ return $setup({
 };
-var version = "3.12.0";
+var version = "3.13.0-alpha.0";
 Drawer.model = {
@@ -105,0 +109,0 @@ prop: "modelValue",

lib/mobile-first.js

@@ -56,3 +56,3 @@ import { renderless, api } from "@opentiny/vue-renderless/drawer/vue";
   },
-  props: [].concat(props, ["visible", "title", "showHeader", "showFooter", "customClass", "placement", "width", "mask", "dragable", "maskClosable", "lockScroll", "flex"]),
+  props: [].concat(props, ["visible", "title", "showHeader", "showFooter", "customClass", "placement", "width", "mask", "dragable", "maskClosable", "lockScroll", "flex", "beforeClose"]),
   setup: function setup(props2, context) {
@@ -111,3 +111,3 @@ return _setup({
         onClick: _cache[0] || (_cache[0] = function($event) {
-          return $props.maskClosable && _ctx.close();
+          return _ctx.handleClose("mask");
         })
@@ -130,11 +130,11 @@ },
         }, {
-          "left-0 bottom-0 translate-y-full border-t-0.5": $props.placement === "bottom"
+          "left-0 bottom-0 translate-y-full border-t-0.5 rounded-t-lg": $props.placement === "bottom"
         }, {
-          "left-0 top-0 -translate-y-full border-b-0.5": $props.placement === "top"
+          "left-0 top-0 -translate-y-full border-b-0.5 rounded-b-lg": $props.placement === "top"
         }, {
           "translate-y-0": ["top", "bottom"].includes($props.placement) && _ctx.state.toggle
         }, {
-          "left-0 top-0 -translate-x-full border-r-0.5": $props.placement === "left"
+          "left-0 top-0 -translate-x-full border-r-0.5 rounded-r-lg": $props.placement === "left"
         }, {
-          "right-0 top-0 translate-x-full border-l-0.5": $props.placement === "right"
+          "right-0 top-0 translate-x-full border-l-0.5 rounded-l-lg": $props.placement === "right"
         }, {
@@ -171,4 +171,6 @@ "translate-x-0": ["left", "right"].includes($props.placement) && _ctx.state.toggle
               "custom-class": "h-5 w-5 cursor-pointer",
-              onClick: _ctx.close
-            }, null, 8, ["onClick"])];
+              onClick: _cache[1] || (_cache[1] = function($event) {
+                return _ctx.handleClose("close");
+              })
+            })];
           })])];
@@ -196,3 +198,5 @@ })],
             tiny_mode: "mobile-first",
-            onClick: _ctx.close
+            onClick: _cache[2] || (_cache[2] = function($event) {
+              return _ctx.handleClose("cancel");
+            })
           }, {
@@ -208,7 +212,9 @@ default: withCtx(function() {
             /* STABLE */
-          }, 8, ["onClick"]), createVNode(_component_tiny_button, {
+          }), createVNode(_component_tiny_button, {
             tiny_mode: "mobile-first",
             class: "ml-2",
             type: "primary",
-            onClick: _ctx.confirm
+            onClick: _cache[3] || (_cache[3] = function($event) {
+              return _ctx.handleClose("confirm");
+            })
           }, {
@@ -224,3 +230,3 @@ default: withCtx(function() {
             /* STABLE */
-          }, 8, ["onClick"])];
+          })];
         })])],
@@ -227,0 +233,0 @@ 512

lib/pc.js

@@ -57,3 +57,3 @@ import { renderless, api } from "@opentiny/vue-renderless/drawer/vue";
   },
-  props: [].concat(props, ["visible", "title", "showHeader", "showFooter", "customClass", "placement", "width", "mask", "dragable", "maskClosable", "lockScroll", "flex", "showClose", "zIndex"]),
+  props: [].concat(props, ["visible", "title", "showHeader", "showFooter", "customClass", "placement", "width", "mask", "dragable", "maskClosable", "lockScroll", "flex", "showClose", "zIndex", "beforeClose"]),
   setup: function setup(props2, context) {
@@ -122,3 +122,3 @@ return _setup({
           onClick: _cache[0] || (_cache[0] = function($event) {
-            return $props.maskClosable && _ctx.close();
+            return _ctx.handleClose("mask");
           })
@@ -150,3 +150,3 @@ },
             "toggle": _ctx.state.toggle
-          }, $props.customClass]),
+          }, "tiny-drawer-main", $props.customClass]),
           style: normalizeStyle({
@@ -179,4 +179,4 @@ width: ["left", "right"].includes($props.placement) ? _ctx.state.computedWidth : null,
             "aria-label": "Close",
-            onClick: _cache[1] || (_cache[1] = function() {
-              return _ctx.close && _ctx.close.apply(_ctx, arguments);
+            onClick: _cache[1] || (_cache[1] = function($event) {
+              return _ctx.handleClose("close");
             })
@@ -195,3 +195,3 @@ }, [createVNode(_component_icon_close, {
               "flex flex-col": $props.flex
-            }])
+            }, "drawer-body"])
           },
@@ -207,3 +207,8 @@ [renderSlot(_ctx.$slots, "default")],
               type: "primary",
-              onClick: _ctx.confirm
+              style: normalizeStyle({
+                order: _ctx.state.isSaasTheme ? 1 : 0
+              }),
+              onClick: _cache[2] || (_cache[2] = function($event) {
+                return _ctx.handleClose("confirm");
+              })
             }, {
@@ -219,5 +224,10 @@ default: withCtx(function() {
               /* STABLE */
-            }, 8, ["onClick"]), createVNode(_component_tiny_button, {
+            }, 8, ["style"]), createVNode(_component_tiny_button, {
               plain: "",
-              onClick: _ctx.close
+              style: normalizeStyle({
+                order: _ctx.state.isSaasTheme ? 0 : 1
+              }),
+              onClick: _cache[3] || (_cache[3] = function($event) {
+                return _ctx.handleClose("cancel");
+              })
             }, {
@@ -233,3 +243,3 @@ default: withCtx(function() {
               /* STABLE */
-            }, 8, ["onClick"])];
+            }, 8, ["style"])];
           })],
@@ -236,0 +246,0 @@ 512

package.json

 {
   "name": "@opentiny/vue-drawer",
-  "version": "3.12.0",
+  "version": "3.13.0-alpha.0",
   "description": "",
@@ -10,5 +10,5 @@ "main": "./lib/index.js",
   "dependencies": {
-    "@opentiny/vue-button": "~3.12.0",
-    "@opentiny/vue-common": "~3.12.0",
-    "@opentiny/vue-renderless": "~3.12.0"
+    "@opentiny/vue-button": "~3.13.0-alpha.0",
+    "@opentiny/vue-common": "~3.13.0-alpha.0",
+    "@opentiny/vue-renderless": "~3.13.0-alpha.0"
   },
@@ -15,0 +15,0 @@ "license": "MIT",

New alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Improved metrics

Number of low supply chain risk alerts

2

decreased by-33.33%

Worsened metrics

Total package byte prevSize

21129

decreased by-21.04%

Number of package files

5

decreased by-44.44%

Lines of code

604

decreased by-24.88%

Number of low quality alerts

2

increased by100%

Dependency changes

• + Added@opentiny/vue-button@3.13.0(transitive)

• + Added@opentiny/vue-common@3.13.1(transitive)

• + Added@opentiny/vue-icon@3.13.0(transitive)

• + Added@opentiny/vue-locale@3.13.0(transitive)

• + Added@opentiny/vue-renderless@3.13.2(transitive)

• + Added@opentiny/vue-theme@3.13.3(transitive)

• + Added@opentiny/vue-theme-mobile@3.13.0(transitive)

• - Removed@opentiny/vue-button@3.12.0(transitive)

• - Removed@opentiny/vue-common@3.12.0(transitive)

• - Removed@opentiny/vue-icon@3.12.0(transitive)

• - Removed@opentiny/vue-locale@3.12.0(transitive)

• - Removed@opentiny/vue-renderless@3.12.1(transitive)

• - Removed@opentiny/vue-theme@3.12.1(transitive)

• - Removed@opentiny/vue-theme-mobile@3.12.0(transitive)

• Updated@opentiny/vue-button@~3.13.0-alpha.0

• Updated@opentiny/vue-common@~3.13.0-alpha.0

• Updated@opentiny/vue-renderless@~3.13.0-alpha.0