@opentiny/vue-drawer - npm Package Compare versions

Comparing version 2.8.3 to 2.9.0

lib/index.js

@@ -16,9 +16,30 @@ function _extends() {
 import { $prefix, $props, $setup } from "@opentiny/vue-common";
+import PcTemplate from "./pc.js";
 import MobileFirstTemplate from "./mobile-first.js";
-var template = function template2() {
-  return MobileFirstTemplate;
+var template = function template2(mode) {
+  if ("pc" === (process.env.TINY_MODE || mode)) {
+    return PcTemplate;
+  }
+  if ("mobile-first" === (process.env.TINY_MODE || mode)) {
+    return MobileFirstTemplate;
+  }
+  return PcTemplate;
 };
+var $constants = {
+  SCROLL_LOCK_CLASS: function SCROLL_LOCK_CLASS(mode) {
+    var scrollLockClasses = {
+      "mobile-first": "overflow-hidden"
+    };
+    return scrollLockClasses[mode] || "";
+  }
+};
 var Drawer = {
   name: $prefix + "Drawer",
   props: _extends({}, $props, {
+    _constants: {
+      type: Object,
+      default: function _default() {
+        return $constants;
+      }
+    },
     visible: {
@@ -35,5 +56,9 @@ type: Boolean,
       type: String,
-      default: "300px"
+      default: "500px"
     },
     title: String,
+    showClose: {
+      type: Boolean,
+      default: true
+    },
     showHeader: {
@@ -55,3 +80,15 @@ type: Boolean,
     },
-    dragable: Boolean
+    dragable: Boolean,
+    lockScroll: {
+      type: Boolean,
+      default: true
+    },
+    flex: {
+      type: Boolean,
+      default: false
+    },
+    zIndex: {
+      type: Number,
+      default: 2e3
+    }
   }),
@@ -66,3 +103,3 @@ setup: function setup(props, context) {
 };
-var version = "3.7.0";
+var version = "2.9.0";
 Drawer.model = {
@@ -69,0 +106,0 @@ prop: "modelValue",

lib/mobile-first.js

@@ -64,3 +64,3 @@ import { renderless, api } from "@opentiny/vue-renderless/drawer/vue";
   },
-  props: [].concat(props, ["visible", "title", "showHeader", "showFooter", "customClass", "placement", "width", "mask", "dragable", "maskClosable"]),
+  props: [].concat(props, ["visible", "title", "showHeader", "showFooter", "customClass", "placement", "width", "mask", "dragable", "maskClosable", "lockScroll", "flex"]),
   setup: function setup(props2, context) {
@@ -92,4 +92,4 @@ return _setup({
     ref: "mask",
-    class: _vm.m("fixed z-50 inset-0 w-full h-full bg-black opacity-0 transition-opacity ease-linear duration-200", {
-      "opacity-30": _vm.state.toggle
+    class: _vm.m("fixed z-50 left-0 right-0 top-0 bottom-0 w-full h-full transition-opacity ease-linear duration-200", {
+      "bg-color-bg-7": _vm.state.toggle
     }),
@@ -103,3 +103,3 @@ on: {
     ref: "drawerBox",
-    class: _vm.m("fixed w-full max-w-full flex flex-col bg-white z-50 shadow-sm border-color-border-separator", {
+    class: _vm.m("fixed w-full max-w-full flex flex-col bg-color-bg-1 z-50 shadow-sm border-color-border-separator", {
       "transition-all ease-linear duration-200": !_vm.state.dragEvent.isDrag
@@ -109,2 +109,4 @@ }, {
     }, {
+      "max-h-full": ["top", "bottom"].includes(_vm.placement)
+    }, {
       "left-0 bottom-0 translate-y-full border-t-0.5": _vm.placement === "bottom"
@@ -135,6 +137,6 @@ }, {
   }) : _vm._e(), _c("div", {
-    class: ["flex-auto flex-col flex max-h-full"]
+    class: ["flex-auto flex-col flex max-h-full overflow-hidden"]
   }, [_vm.showHeader ? _c("div", {
     ref: "header",
-    staticClass: "flex leading-6 p-4 text-base items-center",
+    staticClass: "flex-none flex leading-6 p-4 text-base items-center",
     attrs: {
@@ -160,3 +162,5 @@ "data-tag": "drawer-header"
     ref: "body",
-    staticClass: "flex-auto flex flex-col overflow-auto",
+    class: ["flex-auto overflow-auto", {
+      "flex flex-col": _vm.flex
+    }],
     attrs: {
@@ -163,0 +167,0 @@ "data-tag": "drawer-body"

package.json

 {
   "name": "@opentiny/vue-drawer",
-  "version": "2.8.3",
+  "version": "2.9.0",
   "description": "",
@@ -9,5 +9,5 @@ "main": "./lib/index.js",
   "dependencies": {
-    "@opentiny/vue-button": "~2.8.3",
-    "@opentiny/vue-common": "~2.8.3",
-    "@opentiny/vue-renderless": "~3.8.3"
+    "@opentiny/vue-button": "~2.9.0",
+    "@opentiny/vue-common": "~2.9.0",
+    "@opentiny/vue-renderless": "~3.9.0"
   },
@@ -14,0 +14,0 @@ "license": "MIT",

src/index.d.ts

 declare const _default: {
     name: string;
     props: {
+        _constants: {
+            type: ObjectConstructor;
+            default: () => {
+                SCROLL_LOCK_CLASS(mode: any): any;
+            };
+        };
         visible: {
@@ -18,2 +24,6 @@ type: BooleanConstructor;
         title: StringConstructor;
+        showClose: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
         showHeader: {
@@ -36,2 +46,14 @@ type: BooleanConstructor;
         dragable: BooleanConstructor;
+        lockScroll: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        flex: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        zIndex: {
+            type: NumberConstructor;
+            default: number;
+        };
         tiny_mode: StringConstructor;
@@ -38,0 +60,0 @@ tiny_mode_root: BooleanConstructor;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

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

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

18879

increased by68.97%

Number of package files

9

increased by28.57%

Lines of code

608

increased by82.04%

Worsened metrics

Number of low supply chain risk alerts

3

increased by200%

Dependency changes

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

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

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

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

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

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

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

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

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

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

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

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

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

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

• Updated@opentiny/vue-button@~2.9.0

• Updated@opentiny/vue-common@~2.9.0

• Updated@opentiny/vue-renderless@~3.9.0