@opentiny/vue-dropdown - npm Package Compare versions

Comparing version 3.1.0-alpha.0 to 3.5.0-alpha.0

lib/index.js

@@ -7,4 +7,4 @@ import { createVNode, resolveComponent, withDirectives, resolveDirective } from 'vue';
 import Clickoutside from '@opentiny/vue-renderless/common/deps/clickoutside';
+import DropdownMenu from '@opentiny/vue-dropdown-menu';
 import { iconChevronDown, iconChevronUp } from '@opentiny/vue-icon';
-import '@opentiny/vue-theme/dropdown/index.css';
 
@@ -18,3 +18,4 @@ var script = {
     IconChevronDown: iconChevronDown(),
-    IconChevronUp: iconChevronUp()
+    IconChevronUp: iconChevronUp(),
+    TinyDropdownMenu: DropdownMenu
   },
@@ -54,5 +55,20 @@ directives: directive({
       default: 0
+    },
+    menuOptions: {
+      type: Object,
+      default: function _default() {
+        return {
+          options: [],
+          textField: 'label',
+          popperClass: '',
+          placement: 'bottom-end'
+        };
+      }
+    },
+    title: {
+      type: String,
+      default: '下拉菜单'
     }
   },
-  emits: ['visible-change', 'item-click', 'button-click', 'visibles-change', 'menu-item-click'],
+  emits: ['visible-change', 'item-click', 'button-click', 'menu-item-click'],
   setup: function setup$1(props, context) {
@@ -76,3 +92,5 @@ return setup({
       size = this.size,
-      state = this.state;
+      state = this.state,
+      menuOptions = this.menuOptions,
+      title = this.title;
     var triggerElm = null;
@@ -85,3 +103,3 @@ if (splitButton) {
             "size": size,
-            "nativeOn-click": handleMainButtonClick,
+            "onClick": handleMainButtonClick,
             "disabled": disabled
@@ -107,16 +125,20 @@ }, {
     } else {
-      triggerElm = slots.default && slots.default();
-      var vnodeData = triggerElm[0].data || {};
-      var _vnodeData$attrs = vnodeData.attrs,
-        attrs = _vnodeData$attrs === void 0 ? {} : _vnodeData$attrs;
-      if (disabled && !attrs.disabled) {
-        attrs.disabled = true;
-        vnodeData.attrs = attrs;
-      }
-      triggerElm = createVNode("span", {
+      var defaultTriggerElm = createVNode("span", null, [createVNode("span", null, [title]), createVNode(resolveComponent("icon-chevron-down"), null, null)]);
+      triggerElm = slots.default && slots.default() || [defaultTriggerElm];
+      triggerElm = disabled ? createVNode("span", {
         "ref": "trigger",
+        "disabled": true,
         "class": triggerClass
+      }, [triggerElm]) : createVNode("span", {
+        "ref": "trigger",
+        "class": triggerClass
       }, [triggerElm]);
     }
-    var menuElm = disabled ? null : slots.dropdown && slots.dropdown();
+    var defaulMenuElm = createVNode(resolveComponent("tiny-dropdown-menu"), {
+      "options": menuOptions.options,
+      "text-field": menuOptions.textField || menuOptions['text-field'],
+      "popper-class": menuOptions.popperClass || menuOptions['popper-class'],
+      "placement": menuOptions.placement
+    }, null);
+    var menuElm = disabled ? null : slots.dropdown && slots.dropdown() || defaulMenuElm;
     return withDirectives(createVNode("div", {
@@ -129,7 +151,37 @@ "class": "tiny-dropdown",
 
+function styleInject(css, ref) {
+  if ( ref === void 0 ) ref = {};
+  var insertAt = ref.insertAt;
+
+  if (!css || typeof document === 'undefined') { return; }
+
+  var head = document.head || document.getElementsByTagName('head')[0];
+  var style = document.createElement('style');
+  style.type = 'text/css';
+
+  if (insertAt === 'top') {
+    if (head.firstChild) {
+      head.insertBefore(style, head.firstChild);
+    } else {
+      head.appendChild(style);
+    }
+  } else {
+    head.appendChild(style);
+  }
+
+  if (style.styleSheet) {
+    style.styleSheet.cssText = css;
+  } else {
+    style.appendChild(document.createTextNode(css));
+  }
+}
+
+var css_248z = ".tiny-dropdown{display:inline-block;position:relative;font-size:var(--ti-common-font-size-base)}.tiny-dropdown .tiny-button-group{display:block}.tiny-dropdown .tiny-button-group .tiny-button{float:none}.tiny-dropdown .tiny-dropdown__caret-button{padding-left:5px;padding-right:5px;position:relative;border-left:none;min-width:24px}.tiny-dropdown .tiny-dropdown__caret-button:before{content:'';position:absolute;display:block;width:1px;top:5px;bottom:5px;left:0;background:#fff}.tiny-dropdown .tiny-dropdown__caret-button.tiny-button--default:before{background:#d9d9d9}.tiny-dropdown .tiny-dropdown__caret-button.tiny-button--default:hover:before{background-color:#1890ff}.tiny-dropdown .tiny-dropdown__caret-button:hover:not(.is-disabled):before{top:0;bottom:0}.tiny-dropdown .tiny-dropdown__caret-button svg{padding-left:0;margin:0 3px}.tiny-dropdown .tiny-dropdown-selfdefine:focus:active,.tiny-dropdown .tiny-dropdown-selfdefine:focus:not(.focusing){outline-width:0}.tiny-dropdown [disabled]{cursor:not-allowed;color:#bbb}";
+styleInject(css_248z);
+
 script.install = function (Vue) {
   Vue.component(script.name, script);
 };
-script.version = '3.1.0-alpha.0';
+script.version = '3.5.0-alpha.0';
 
 export { script as default };

package.json

 {
   "name": "@opentiny/vue-dropdown",
-  "version": "3.1.0-alpha.0",
+  "version": "3.5.0-alpha.0",
   "description": "",
@@ -12,12 +12,13 @@ "main": "lib/index.js",
   "dependencies": {
-    "@opentiny/vue-renderless": "~3.1.0-alpha.0",
-    "@opentiny/vue-theme": "~3.1.0-alpha.0",
-    "@opentiny/vue-button": "~3.1.0-alpha.0",
-    "@opentiny/vue-button-group": "~3.1.0-alpha.0",
-    "@opentiny/vue-common": "~3.1.0-alpha.0",
-    "@opentiny/vue-icon": "~3.1.0-alpha.0",
-    "@opentiny/vue-theme-mobile": "~3.1.0-alpha.0"
+    "@opentiny/vue-renderless": "~3.5.0",
+    "@opentiny/vue-theme": "~3.5.0",
+    "@opentiny/vue-button": "~3.5.0-alpha.0",
+    "@opentiny/vue-button-group": "~3.5.0-alpha.0",
+    "@opentiny/vue-common": "~3.5.0-alpha.0",
+    "@opentiny/vue-icon": "~3.5.0-alpha.0",
+    "@opentiny/vue-theme-mobile": "~3.5.0"
   },
   "license": "MIT",
+  "types": "index.d.ts",
   "sideEffects": false
 }

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Mixed license

License

(Experimental) Package contains multiple licenses.

Found 1 instance in 1 package

Unidentified License

License

(Experimental) Something that seems like a license was found, but its contents could not be matched with a known license.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

10301

increased by121.29%

Number of package files

4

increased by100%

Lines of code

276

increased by120.8%

Worsened metrics

Number of low license alerts

2

increased byInfinity%

License quality

80

decreased by-20%

Number of low supply chain risk alerts

2

increased by100%

Dependency changes

• + Added@babel/runtime@7.18.3(transitive)

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

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

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

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

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

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

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

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

• + Addedregenerator-runtime@0.13.11(transitive)

• - Removed@babel/runtime@7.26.9(transitive)

• - Removed@opentiny/vue-button@3.1.0-alpha.0(transitive)

• - Removed@opentiny/vue-button-group@3.1.0-alpha.0(transitive)

• - Removed@opentiny/vue-common@3.1.0-alpha.0(transitive)

• - Removed@opentiny/vue-icon@3.1.0-alpha.0(transitive)

• - Removed@opentiny/vue-locale@3.1.0-alpha.0(transitive)

• - Removed@opentiny/vue-renderless@3.1.0-alpha.0(transitive)

• - Removed@opentiny/vue-theme@3.1.0-alpha.1(transitive)

• - Removed@opentiny/vue-theme-mobile@3.1.0-alpha.0(transitive)

• - Removedregenerator-runtime@0.14.1(transitive)

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

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

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

• Updated@opentiny/vue-icon@~3.5.0-alpha.0

• Updated@opentiny/vue-renderless@~3.5.0

• Updated@opentiny/vue-theme@~3.5.0

• Updated@opentiny/vue-theme-mobile@~3.5.0