@opentiny/vue-search - npm Package Compare versions

Comparing version 2.5.0 to 2.6.0-alpha.0

lib/index.js

@@ -98,2 +98,9 @@ import { $prefix, $props, $setup } from '@opentiny/vue-common';
       default: false
+    },
+    themeType: {
+      type: String,
+      default: 'primary',
+      validator: function validator(value) {
+        return ['primary', 'gray'].includes(value);
+      }
     }
@@ -117,4 +124,4 @@ }),
 };
-Search.version = '2.5.0';
+Search.version = '2.6.0-alpha.0';
 
 export { Search as default };

lib/mobile.js

@@ -33,3 +33,3 @@ import { renderless, api } from '@opentiny/vue-renderless/search/vue';
 var script = {
-  props: [].concat(_toConsumableArray(props), ['transparent', 'searchTypes', 'placeholder', 'buttonText', 'modelValue']),
+  props: [].concat(_toConsumableArray(props), ['transparent', 'searchTypes', 'placeholder', 'buttonText', 'modelValue', 'themeType']),
   components: {
@@ -39,2 +39,3 @@ IconSearch: iconSearch(),
   },
+  emits: ['change', 'search', 'update:modelValue', 'clear', 'select'],
   setup: function setup$1(props, context) {
@@ -141,3 +142,3 @@ return setup({
   return _c('div', {
-    class: ['tiny-mobile-search', {
+    class: ['tiny-mobile-search', "tiny-mobile-search-" + _vm.themeType, {
       collapse: _vm.state.collapse
@@ -170,3 +171,3 @@ }, {
     ref: "input",
-    staticClass: "tiny-mobile-search__input",
+    class: ['tiny-mobile-search__input', "tiny-mobile-search__input-" + _vm.themeType],
     style: _vm.transparent ? {
@@ -184,2 +185,9 @@ border: 'transparent',
     on: {
+      "keyup": function keyup($event) {
+        if (!$event.type.indexOf('key') && _vm._k($event.keyCode, "enter", 13, $event.key, "Enter")) {
+          return null;
+        }
+        return _vm.searchEnterKey.apply(null, arguments);
+      },
+      "change": _vm.handleChange,
       "input": [function ($event) {
@@ -191,3 +199,2 @@ if ($event.target.composing) {
       }, _vm.handleInput],
-      "change": _vm.handleInput,
       "focus": function focus($event) {
@@ -198,2 +205,5 @@ _vm.state.focus = true;
         _vm.state.focus = false;
+      },
+      "select": function select($event) {
+        $event.stopPropagation();
       }
@@ -215,18 +225,14 @@ }
     staticClass: "tiny-mobile-search__label"
-  }, [_c('a', {
-    staticClass: "tiny-mobile-search__icon-label"
-  }, [_c('icon-search')], 1), _vm._v(" "), _c('span', [_vm._v(_vm._s(_vm.placeholder))])])]), _vm._v(" "), _c('div', {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: _vm.state.focus || !_vm.state.focus && _vm.state.currentValue,
-      expression: "state.focus || (!state.focus && state.currentValue)"
-    }],
-    staticClass: "tiny-mobile-search__present",
-    on: {
-      "click": _vm.searchClick
-    }
-  }, [_c('span', {
-    staticClass: "tiny-mobile-search__text"
-  }, [_vm._v(_vm._s(_vm.buttonText))])])]);
+  }, [_c('span', [_vm._v(_vm._s(_vm.placeholder))])])]), _vm._v(" "), _c('div', {
+    staticClass: "tiny-mobile-search__right"
+  }, [_vm._t("default", function () {
+    return [_c('div', {
+      staticClass: "tiny-mobile-search__present",
+      on: {
+        "click": _vm.searchClick
+      }
+    }, [_c('span', {
+      staticClass: "tiny-mobile-search__text"
+    }, [_vm._v(_vm._s(_vm.buttonText))])])];
+  })], 2)]);
 };
@@ -233,0 +239,0 @@ var __vue_staticRenderFns__ = [];

lib/pc.js

 import { renderless, api } from '@opentiny/vue-renderless/search/vue';
 import { setup, props } from '@opentiny/vue-common';
 import { iconChevronDown, iconSearch, iconClose } from '@opentiny/vue-icon';
+import '@opentiny/vue-theme/search/index.css';
 
@@ -31,32 +32,2 @@ function _toConsumableArray(arr) {
 
-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-transition-zoom-in-top-enter-active,.tiny-transition-zoom-in-top-leave-active{opacity:1;-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1);transition:transform .3s cubic-bezier(.23,1,.32,1),opacity .3s cubic-bezier(.23,1,.32,1),-webkit-transform .3s cubic-bezier(.23,1,.32,1);-webkit-transform-origin:center top;transform-origin:center top}.tiny-transition-zoom-in-top-enter,.tiny-transition-zoom-in-top-enter-from,.tiny-transition-zoom-in-top-leave-to{opacity:0;-webkit-transform:scaleY(0);transform:scaleY(0);-webkit-transform-origin:center top;transform-origin:center top}.tiny-transition-search-line-fade-enter,.tiny-transition-search-line-fade-enter-from,.tiny-transition-search-line-fade-leave-to{opacity:0}.tiny-transition-search-line-fade-enter-to{opacity:0}.tiny-transition-search-line-fade-enter-active,.tiny-transition-search-line-fade-leave-active{-webkit-transition:opacity .3s;transition:opacity .3s}.tiny-transition-icon-out-in-enter-active{-webkit-animation:bounce-in .3s;animation:bounce-in .3s}.tiny-transition-icon-out-in-leave-active{animation:bounce-in .3s reverse}.tiny-transition-icon-scale-in-enter-active{-webkit-animation:scale-in .3s;animation:scale-in .3s}.tiny-transition-icon-scale-in-leave-active{animation:scale-in .3s reverse}@-webkit-keyframes bounce-in{0%{-webkit-transform:translateY(-50%) scale(0);transform:translateY(-50%) scale(0)}50%{-webkit-transform:translateY(-50%) scale(1.2);transform:translateY(-50%) scale(1.2)}100%{-webkit-transform:translateY(-50%) scale(1);transform:translateY(-50%) scale(1)}}@keyframes bounce-in{0%{-webkit-transform:translateY(-50%) scale(0);transform:translateY(-50%) scale(0)}50%{-webkit-transform:translateY(-50%) scale(1.2);transform:translateY(-50%) scale(1.2)}100%{-webkit-transform:translateY(-50%) scale(1);transform:translateY(-50%) scale(1)}}@-webkit-keyframes scale-in{0%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1.2);transform:scale(1.2)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes scale-in{0%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1.2);transform:scale(1.2)}100%{-webkit-transform:scale(1);transform:scale(1)}}.tiny-search{--ti-search-font-size:var(--ti-common-font-size-base);--ti-search-input-height:var(--ti-base-size-height-normal);--ti-search-input-btn-width:var(--ti-base-size-height-small);--ti-search-input-btn-line-height:var(--ti-base-size-height-small);--ti-search-input-text-color:var(--ti-base-color-info-normal);--ti-search-input-bg-color:var(--ti-base-color-light);--ti-search-input-btn-text-color:var(--ti-base-color-common-5);--ti-search-input-btn-hover-border-color:var(--ti-base-color-brand-5);--ti-search-input-btn-font-size:var(--ti-common-font-size-1);--ti-search-input-border-color:var(--ti-base-color-border);--ti-search-icon-border-color:#dbdbdb;--ti-search-icon-color:#c4c4c4;--ti-search-size-height-normal:var(--ti-base-size-height-normal);--ti-search-size-height-small:var(--ti-base-size-height-small);--ti-search-selector-text-color:var(--ti-base-color-info-normal);--ti-search-line-hover-border-color:var(--ti-base-color-border-hover);--ti-search-list-hover-bg-color:var(--ti-base-color-selected-background);--ti-search-selector-border-radius:var(--ti-common-border-radius-normal);--ti-search-selector-bg-color:var(--ti-base-color-light);--ti-search-selector-list-height:var(--ti-base-size-height-normal);position:relative;display:inline-block;font-size:var(--ti-search-font-size);width:100%}.tiny-search .tiny-search__line{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;height:var(--ti-search-input-height);border:1px solid var(--ti-search-input-border-color);border-radius:var(--ti-common-border-radius-normal);background-color:var(--ti-search-input-bg-color);-webkit-transition:.4s;transition:.4s;border-collapse:separate}.tiny-search .tiny-search__line:hover{border-color:var(--ti-search-line-hover-border-color)}.tiny-search .tiny-search__line.focus,.tiny-search .tiny-search__line:focus{border-color:var(--ti-search-input-btn-hover-border-color)}.tiny-search .tiny-search__input{width:100%;height:100%;line-height:1;color:var(--ti-search-input-text-color);padding:0 0 0 8px;border:0;outline:0;background:0 0}.tiny-search .tiny-search__input::-moz-placeholder{color:#999;opacity:1}.tiny-search .tiny-search__input:-ms-input-placeholder{color:#999}.tiny-search .tiny-search__input::-webkit-input-placeholder{color:#999}.tiny-search .tiny-search__input::-ms-input-placeholder{color:#999}.tiny-search .tiny-search__input::placeholder{color:#999}.tiny-search .tiny-search__input:focus::-moz-placeholder{color:#d9d9d9;opacity:1}.tiny-search .tiny-search__input:focus:-ms-input-placeholder{color:#d9d9d9}.tiny-search .tiny-search__input:focus::-webkit-input-placeholder{color:#d9d9d9}.tiny-search .tiny-search__input:focus::-ms-input-placeholder{color:#d9d9d9}.tiny-search .tiny-search__input:focus::placeholder{color:#d9d9d9}.tiny-search .tiny-search__input-btn{text-align:center}.tiny-search .tiny-search__input-btn a{text-decoration:none;display:block;width:var(--ti-search-input-btn-width);height:100%;line-height:var(--ti-search-input-btn-line-height)}.tiny-search .tiny-search__input-btn svg{fill:var(--ti-search-input-btn-text-color);font-size:var(--ti-search-input-btn-font-size)}.tiny-search .tiny-search__input-btn:hover svg{fill:var(--ti-search-input-btn-hover-border-color)}.tiny-search .tiny-search__present{color:var(--ti-search-selector-text-color);line-height:var(--ti-search-size-height-normal);padding-left:8px;white-space:nowrap}.tiny-search .tiny-search__present .icon-outer{height:calc(var(--ti-search-size-height-normal) - 12px);line-height:calc(var(--ti-search-size-height-normal) - 12px);display:inline-block;padding:0 8px 0 4px;border-right:1px solid var(--ti-search-input-border-color);cursor:pointer}.tiny-search .tiny-search__present .icon-outer svg{font-size:var(--ti-search-input-btn-font-size);fill:var(--ti-search-icon-color)}.tiny-search .tiny-search__selector{position:absolute;top:32px;left:0;overflow:hidden;min-width:68px;border:1px solid var(--ti-search-input-border-color);border-radius:var(--ti-search-selector-border-radius);font-size:var(--ti-search-font-size);-webkit-box-shadow:var(--ti-base-box-shadow);box-shadow:var(--ti-base-box-shadow);background:var(--ti-search-selector-bg-color);color:var(--ti-search-selector-text-color);margin-top:2px}.tiny-search .tiny-search__selector-body{max-height:300px;overflow-y:auto;overflow-x:hidden}.tiny-search .tiny-search__poplist-item{min-height:var(--ti-search-selector-list-height);padding:0 8px;line-height:var(--ti-search-selector-list-height);max-width:100%;font-size:var(--ti-search-font-size);overflow:hidden;text-align:left;text-overflow:ellipsis;white-space:nowrap}.tiny-search .tiny-search__poplist-item:hover{background:var(--ti-search-list-hover-bg-color);cursor:pointer}.tiny-search .tiny-search__poplist-item span{font-size:var(--ti-search-font-size)}.tiny-search .tiny-search__poplist-item .icon-check{font-size:var(--ti-common-font-size-2)}.tiny-search .tiny-search__poplist-item .icon-check:hover{color:var(--ti-search-input-btn-hover-border-color)}.tiny-search.mini .tiny-search__line{border-radius:var(--ti-search-input-height);width:100%;float:right}.tiny-search.mini.collapse .tiny-search__input-btn svg{fill:var(--ti-search-icon-color)}.tiny-search.mini .tiny-search__input{border-radius:var(--ti-search-input-height)}.tiny-search.collapse .tiny-search__input{padding:0;width:var(--ti-search-size-height-normal);float:right}.tiny-search.mini.collapse .tiny-search__line{width:30px;float:right;background-color:transparent;border-collapse:separate}.tiny-search.mini.collapse .tiny-search__input,.tiny-search.mini.collapse .tiny-search__present{display:none}.tiny-search .fade-enter-to{opacity:0}.tiny-search .fade-enter,.tiny-search .fade-leave-to{opacity:0}";
-styleInject(css_248z);
-
 var script = {
@@ -63,0 +34,0 @@ props: [].concat(_toConsumableArray(props), ['mini', 'transparent', 'searchTypes', 'placeholder', 'modelValue', 'tabindex', 'clearable', 'isEnterSearch']),

package.json

 {
   "name": "@opentiny/vue-search",
-  "version": "2.5.0",
+  "version": "2.6.0-alpha.0",
   "description": "",
@@ -12,7 +12,7 @@ "main": "lib/index.js",
   "dependencies": {
-    "@opentiny/vue-renderless": "~3.5.0",
-    "@opentiny/vue-common": "~2.5.0",
-    "@opentiny/vue-icon": "~2.5.0",
-    "@opentiny/vue-theme": "~3.5.0",
-    "@opentiny/vue-theme-mobile": "~3.5.0"
+    "@opentiny/vue-renderless": "~3.6.0-alpha.1",
+    "@opentiny/vue-common": "~2.6.0-alpha.0",
+    "@opentiny/vue-icon": "~2.6.0-alpha.0",
+    "@opentiny/vue-theme": "~3.6.0-alpha.1",
+    "@opentiny/vue-theme-mobile": "~3.6.0-alpha.1"
   },
@@ -19,0 +19,0 @@ "license": "MIT",

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

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

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

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

Improved metrics

Number of low supply chain risk alerts

3

decreased by-25%

Worsened metrics

Total package byte prevSize

21246

decreased by-28.19%

Lines of code

615

decreased by-6.25%

Number of low quality alerts

2

increased by100%

Dependency changes

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

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

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

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

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

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

• + Added@vue/composition-api@1.2.4(transitive)

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

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

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

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

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

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

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

• - Removed@vue/composition-api@1.2.2(transitive)

• - Removedregenerator-runtime@0.13.11(transitive)

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

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

• Updated@opentiny/vue-renderless@~3.6.0-alpha.1

• Updated@opentiny/vue-theme@~3.6.0-alpha.1

• Updated@opentiny/vue-theme-mobile@~3.6.0-alpha.1