@opentiny/vue-search-box 0.1.1 → 0.1.2

package/dist/es/{index-VrLZbD8H.css → index-BYxS8gdW.css}

@@ -1,4 +1,4 @@
-.tvp-search-box__dropdown-menu,
+.tiny-popper.tvp-search-box__dropdown-menu,
 .tvp-search-box__popover {
   --tvp-SearchBox-bg-color: var(--tv-color-bg-secondary, #ffffff);
   --tvp-SearchBox-border-color: var(--tv-color-bg-control-unactive, #c2c2c2);
@@ -29,17 +29,48 @@
   --tvp-SearchBox-dropdown-desc-text-color: var(--tv-color-info-text-primary, #191919);
   width: 232px;
   overflow: auto;
-  overflow-x: hidden;
 }
-.tvp-search-box__dropdown-menu .tiny-form-item.is-error .tvp-search-box-select .tiny-select__tags-group,
+.tiny-popper.tvp-search-box__dropdown-menu::-webkit-scrollbar,
+.tvp-search-box__popover::-webkit-scrollbar {
+  width: 8px;
+  height: 8px;
+}
+.tiny-popper.tvp-search-box__dropdown-menu::-webkit-scrollbar-corner,
+.tvp-search-box__popover::-webkit-scrollbar-corner {
+  background: transparent;
+}
+.tiny-popper.tvp-search-box__dropdown-menu::-webkit-scrollbar-track,
+.tvp-search-box__popover::-webkit-scrollbar-track {
+  background: transparent;
+}
+.tiny-popper.tvp-search-box__dropdown-menu::-webkit-scrollbar-thumb,
+.tvp-search-box__popover::-webkit-scrollbar-thumb {
+  background: var(--tvp-SearchBox-color-bg-scrollbar-thumb);
+  border-radius: var(--tvp-SearchBox-border-radius-scrollbar-thumb);
+}
+.tiny-popper.tvp-search-box__dropdown-menu::-webkit-scrollbar-thumb:hover,
+.tvp-search-box__popover::-webkit-scrollbar-thumb:hover {
+  background: var(--tv-color-bg-scrollbar-thumb-hover);
+}
+.tiny-popper.tvp-search-box__dropdown-menu::-webkit-scrollbar-thumb:active,
+.tvp-search-box__popover::-webkit-scrollbar-thumb:active {
+  background: var(--tvp-SearchBox-color-bg-scrollbar-thumb-active);
+}
+.tiny-popper.tvp-search-box__dropdown-menu.tiny-popper.tvp-search-box__dropdown-menu .tvp-search-box__date-picker .baseClearicon,
+.tiny-popper.tvp-search-box__dropdown-menu.tvp-search-box__popover .tvp-search-box__date-picker .baseClearicon,
+.tvp-search-box__popover.tiny-popper.tvp-search-box__dropdown-menu .tvp-search-box__date-picker .baseClearicon,
+.tvp-search-box__popover.tvp-search-box__popover .tvp-search-box__date-picker .baseClearicon {
+  background-color: var(--tvp-SearchBox-date-picker-clear-icon-bg);
+}
+.tiny-popper.tvp-search-box__dropdown-menu .tiny-form-item.is-error .tvp-search-box-select .tiny-select__tags-group,
 .tvp-search-box__popover .tiny-form-item.is-error .tvp-search-box-select .tiny-select__tags-group {
   border-color: #f23030;
 }
-.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-select .tiny-svg,
+.tiny-popper.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-select .tiny-svg,
 .tvp-search-box__popover .tvp-search-box-select .tiny-select .tiny-svg {
   z-index: 1000;
 }
-.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-select__tags-group,
+.tiny-popper.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-select__tags-group,
 .tvp-search-box__popover .tvp-search-box-select .tiny-select__tags-group {
   min-height: 32px;
   max-height: 82px;
@@ -48,7 +79,7 @@
   border: 1px solid #c2c2c2;
   border-radius: 6px;
 }
-.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-select__tags.is-show-tag,
+.tiny-popper.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-select__tags.is-show-tag,
 .tvp-search-box__popover .tvp-search-box-select .tiny-select__tags.is-show-tag {
   max-width: 276px !important;
   width: calc(100% - 8px) !important;
@@ -57,24 +88,24 @@
   max-height: 76px;
   overflow: auto;
 }
-.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-input__suffix,
+.tiny-popper.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-input__suffix,
 .tvp-search-box__popover .tvp-search-box-select .tiny-input__suffix {
   z-index: 1000;
 }
-.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-input__inner,
+.tiny-popper.tvp-search-box__dropdown-menu .tvp-search-box-select .tiny-input__inner,
 .tvp-search-box__popover .tvp-search-box-select .tiny-input__inner {
   border: 0px;
   overflow: hidden;
 }
-.tvp-search-box__dropdown-menu input[type='number'],
+.tiny-popper.tvp-search-box__dropdown-menu input[type='number'],
 .tvp-search-box__popover input[type='number'] {
   -moz-appearance: textfield;
   /* Firefox */
   appearance: textfield;
 }
-.tvp-search-box__dropdown-menu input[type='number']::-webkit-inner-spin-button,
+.tiny-popper.tvp-search-box__dropdown-menu input[type='number']::-webkit-inner-spin-button,
 .tvp-search-box__popover input[type='number']::-webkit-inner-spin-button,
-.tvp-search-box__dropdown-menu input[type='number']::-webkit-outer-spin-button,
+.tiny-popper.tvp-search-box__dropdown-menu input[type='number']::-webkit-outer-spin-button,
 .tvp-search-box__popover input[type='number']::-webkit-outer-spin-button {
   -webkit-appearance: none;
   /* Safari */
@@ -178,7 +209,7 @@
   margin-right: var(--tvp-SearchBox-separator-icon-margin-right);
   height: 14px;
   width: 1px;
-  background-color: #dfe1e6;
+  background-color: var(--tvp-SearchBox-color-border-divider);
 }
 .tvp-search-box__input-help {
   margin-right: 0px;
@@ -215,6 +246,9 @@
 .tvp-search-box .tiny-dropdown__trigger {
   display: block;
 }
+.tvp-search-box .tiny-dropdown__trigger:focus-visible {
+  outline: none;
+}
 .tvp-search-box .tiny-dropdown__trigger .tiny-dropdown__title {
   width: 100%;
 }
@@ -222,6 +256,9 @@
   display: block;
   flex: 1;
 }
+.tvp-search-box__loading-box {
+  min-height: 32px;
+}
 .tvp-search-box__radio-wrap {
   max-height: 240px;
   overflow: auto;
@@ -241,6 +278,8 @@
   margin-top: var(--tvp-SearchBox-dropdown-btn-group-margin-top);
   padding-top: var(--tvp-SearchBox-dropdown-btn-group-padding-top);
   padding-right: 10px;
+  gap: 5px;
+  justify-content: flex-end;
   padding-bottom: var(--tvp-SearchBox-dropdown-btn-group-padding-bottom);
 }
 .tvp-search-box__bottom-btn .tiny-button,
@@ -267,12 +306,11 @@
 }
 .tvp-search-box__filter-item {
   color: var(--tvp-SearchBox-search-filter-text-color);
-  border-bottom: 1px solid #fff;
 }
 .tvp-search-box__dropdown-item.tiny-dropdown-item {
   width: 100%;
   max-width: 100%;
-  --tv-DropdownItem-icon-color-hover: var(--tv-color-bg-active-control);
+  background: inherit;
 }
 .tvp-search-box__dropdown-item.tiny-dropdown-item > div {
   white-space: nowrap;
@@ -282,6 +320,9 @@
 .tvp-search-box__dropdown-item.tiny-dropdown-item.tvp-search-box__checkbox-item .tiny-checkbox__inner > .tiny-svg {
   margin-right: 0;
 }
+.tvp-search-box__dropdown-item-init {
+  background-color: #f5f5f5;
+}
 .tvp-search-box__checkbox-item .tvp-search-box__checkbox-item-label,
 .tvp-search-box__checkbox-item .tiny-checkbox,
 .tvp-search-box__checkbox-item .tiny-dropdown-item__label {
@@ -315,6 +356,7 @@
 .tvp-search-box__panel-box {
   width: 100%;
   padding: 0px 10px;
+  color: var(--tvp-SearchBox-dropdown-desc-text-color);
 }
 .tvp-search-box__date-item.tiny-form-item,
 .tvp-search-box__number-item.tiny-form-item {

package/dist/es/index.es.js

@@ -1,9 +1,13 @@
 import "./index.vue.es.js";
+import "./components/first-level-panel.vue.es.js";
+import "./components/second-level-panel.vue.es.js";
 import zhCN from "./utils/zh_CN.es.js";
 import { default as default2 } from "./utils/en_US.es.js";
 /* empty css              */
 import "./index.type.es.js";
 import _sfc_main from "./index.vue.es2.js";
+import { default as default3 } from "./components/first-level-panel.vue.es2.js";
+import { default as default4 } from "./components/second-level-panel.vue.es2.js";
 let apps;
 _sfc_main.install = function(app) {
   apps = app;
@@ -15,6 +19,8 @@ const t = (key) => {
   return ((_b = (_a = apps == null ? void 0 : apps.config) == null ? void 0 : _a.globalProperties) == null ? void 0 : _b.$t) ? (_d = (_c = apps == null ? void 0 : apps.config) == null ? void 0 : _c.globalProperties) == null ? void 0 : _d.$t(key) : (_g = (_f = (_e = zhCN) == null ? void 0 : _e[array == null ? void 0 : array[0]]) == null ? void 0 : _f[array == null ? void 0 : array[1]]) == null ? void 0 : _g[array == null ? void 0 : array[2]];
 };
 export {
+  default3 as TinySearchBoxFirstLevelPanel,
+  default4 as TinySearchBoxSecondLevelPanel,
   _sfc_main as default,
   default2 as enUS,
   t,