zartui 3.1.91 → 3.1.93

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,4 +1,4 @@
1
- import { computed, defineComponent, onMounted, ref, createVNode as _createVNode, createTextVNode as _createTextVNode, Fragment as _Fragment, vShow as _vShow, withDirectives as _withDirectives } from "vue";
1
+ import { computed, defineComponent, nextTick, onMounted, ref, watch, createVNode as _createVNode, createTextVNode as _createTextVNode, Fragment as _Fragment, vShow as _vShow, withDirectives as _withDirectives } from "vue";
2
2
  import { useEventListener, useRect } from "@zartui/use";
3
3
  import { createNamespace, makeArrayProp, makeStringProp } from "../utils/index.mjs";
4
4
  import ZtSearch from "../search/index.mjs";
@@ -46,6 +46,9 @@ var stdin_default = defineComponent({
46
46
  const historyList = ref([]);
47
47
  const showAllCommonTypes = ref(false);
48
48
  const selectCommonId = ref(-1);
49
+ const commonTypesListRef = ref();
50
+ const showLeftCommonTypesMask = ref(false);
51
+ const showRightCommonTypesMask = ref(false);
49
52
  const defaultTreeNode = ref(props.treeData);
50
53
  const fields = computed(() => assignDefaultFields(props.treeFieldName));
51
54
  const visibleCommonTypeList = computed(() => {
@@ -60,6 +63,25 @@ var stdin_default = defineComponent({
60
63
  children,
61
64
  text: key
62
65
  } = fields.value;
66
+ const syncSelectCommonId = (node) => {
67
+ const selectedId = node == null ? void 0 : node[value];
68
+ selectCommonId.value = typeof selectedId === "string" || typeof selectedId === "number" ? selectedId : -1;
69
+ };
70
+ syncSelectCommonId(props.defaultSelectNode);
71
+ watch(() => props.defaultSelectNode, (node) => {
72
+ selectNode.value = node;
73
+ syncSelectCommonId(node);
74
+ });
75
+ const updateCommonTypesMask = () => {
76
+ const list = commonTypesListRef.value;
77
+ if (!list)
78
+ return;
79
+ showLeftCommonTypesMask.value = list.scrollLeft > 0;
80
+ showRightCommonTypesMask.value = list.scrollLeft + list.clientWidth < list.scrollWidth;
81
+ };
82
+ const onCommonTypesScroll = () => {
83
+ updateCommonTypesMask();
84
+ };
63
85
  const allData = {
64
86
  [value]: -1,
65
87
  [key]: "\u5168\u90E8",
@@ -136,6 +158,7 @@ var stdin_default = defineComponent({
136
158
  };
137
159
  flatData(props.treeData);
138
160
  updateOffset();
161
+ nextTick(updateCommonTypesMask);
139
162
  });
140
163
  const isEmpty = (item) => !item[children] || item[children].length === 0;
141
164
  const syncExpandNodeByParent = (item) => {
@@ -323,11 +346,16 @@ var stdin_default = defineComponent({
323
346
  }, [_createVNode("span", {
324
347
  "class": [bem("common-types--label")]
325
348
  }, [_createTextVNode("\u5E38\u7528\u5C0F\u7C7B")]), visibleCommonTypeList.value.length > 0 ? _createVNode("div", {
326
- "class": [bem("common-types--mask")]
349
+ "class": [bem("common-types--mask"), bem("common-types--mask", {
350
+ "left-mask": showLeftCommonTypesMask.value,
351
+ "right-mask": showRightCommonTypesMask.value
352
+ })]
327
353
  }, [_createVNode("div", {
328
354
  "class": [bem("common-types--viewport")]
329
355
  }, [_createVNode("div", {
330
- "class": [bem("common-types--list")]
356
+ "ref": commonTypesListRef,
357
+ "class": [bem("common-types--list")],
358
+ "onScroll": onCommonTypesScroll
331
359
  }, [visibleCommonTypeList.value.map(renderCommonTypeButton)])])]) : _createVNode("div", {
332
360
  "class": [bem("common-types--empty")]
333
361
  }, [_createTextVNode("\u6682\u65E0\u5E38\u7528\u5C0F\u7C7B")]), visibleCommonTypeList.value.length > 0 && _createVNode("div", {
@@ -1 +1 @@
1
- :root{--zt-drawer-select-background: #ebf2f5}.zt-drawer-select{height:100%;width:100%;display:flex;flex-direction:column;background:var(--zt-background)}.zt-drawer-select__search{padding:var(--zt-padding-xs) 0}.zt-drawer-select__search--item{padding:var(--zt-padding-sm) 0 var(--zt-padding-sm) var(--zt-padding-md)}.zt-drawer-select__search--item:after{left:calc(-50% + 22px)}.zt-drawer-select__search--header{font-size:var(--zt-font-size-lg);font-weight:700;color:var(--zt-text-color);margin-bottom:4px}.zt-drawer-select__search--name{font-size:var(--zt-font-size-md);color:var(--zt-text-color-2)}.zt-drawer-select__wrap{position:fixed;right:0;left:0;bottom:0;z-index:999;overflow:hidden}.zt-drawer-select__popup{position:absolute;max-height:350px;border-radius:0 0 16px 16px}.zt-drawer-select__empty{font-size:var(--zt-font-size-md);color:var(--zt-gray-a4);text-align:center;padding:var(--zt-padding-lg) 0}.zt-drawer-select__history--title{height:44px;line-height:44px;font-weight:700;padding-left:var(--zt-padding-sm);color:var(--zt-text-color)}.zt-drawer-select__history--content{padding:var(--zt-padding-sm) var(--zt-padding-md) var(--zt-padding-xs)}.zt-drawer-select__history--content .zt-tag{line-height:28px;border-radius:14px;font-size:var(--zt-font-size-md);margin-right:4px;margin-bottom:8px}.zt-drawer-select__history--clear{display:flex;align-items:center;justify-content:center;height:44px;color:var(--zt-gray-a6);text-align:center;font-size:var(--zt-font-size-md)}.zt-drawer-select__name{position:relative;height:44px;line-height:44px;font-size:var(--zt-font-size-lg);color:var(--zt-text-color);font-weight:700;padding-left:var(--zt-padding-md)}.zt-drawer-select__name:before{content:"";position:absolute;width:4px;height:16px;top:14px;left:0;background:var(--zt-primary-color)}.zt-drawer-select__common-types{width:100%;background:var(--zt-white)}.zt-drawer-select__common-types--head{display:flex;align-items:center;min-height:44px;padding-left:var(--zt-padding-md);font-size:var(--zt-font-size-md);color:var(--zt-text-color)}.zt-drawer-select__common-types--label{flex-shrink:0;font-weight:700;padding-right:4px}.zt-drawer-select__common-types--mask{position:relative;flex:1;min-width:0;background:var(--zt-white)}.zt-drawer-select__common-types--mask:before,.zt-drawer-select__common-types--mask:after{content:"";position:absolute;top:0;bottom:0;width:40px;pointer-events:none;z-index:3}.zt-drawer-select__common-types--mask:before{left:-1px;background-image:linear-gradient(90deg,var(--zt-white) 0%,var(--zt-white) 24px,rgba(255,255,255,0) 100%)}.zt-drawer-select__common-types--mask:after{right:-1px;background-image:linear-gradient(270deg,var(--zt-white) 0%,var(--zt-white) 12px,rgba(255,255,255,0) 100%)}.zt-drawer-select__common-types--viewport{min-width:0;overflow:hidden}.zt-drawer-select__common-types--list{display:flex;align-items:center;gap:4px;padding:8px 16px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:none}.zt-drawer-select__common-types--list::-webkit-scrollbar{display:none}.zt-drawer-select__common-types--icon{display:flex;align-items:center;justify-content:center;width:56px;height:44px;flex-shrink:0}.zt-drawer-select__common-types--empty{flex:1;min-width:0;padding-left:8px;color:var(--zt-text-color-2);opacity:.2}.zt-drawer-select__common-types--btn{flex-shrink:0;min-width:-moz-fit-content;min-width:fit-content;border-radius:15px;opacity:1;padding-top:15px;padding-bottom:15px}.zt-drawer-select__common-types--panel{padding:0 var(--zt-padding-md) 8px;background:var(--zt-white)}.zt-drawer-select__common-types--panel-list{display:flex;flex-wrap:wrap;gap:8px 4px;padding-bottom:8px}.zt-drawer-select__common-types--clear{display:flex;align-items:center;justify-content:center;height:44px;color:var(--zt-text-color-2);opacity:.6;font-size:var(--zt-font-size-md)}.zt-drawer-select__common-types--clear-text{margin-left:4px}.zt-drawer-select__hot-types{width:100%;padding:0 16px 4px;margin-top:8px;box-sizing:border-box;background:var(--zt-white)}.zt-drawer-select__hot-types--label{height:44px;line-height:44px;font-size:var(--zt-font-size-md);font-weight:700;color:var(--zt-text-color)}.zt-drawer-select__hot-types--list{display:flex;flex-wrap:wrap;gap:8px 4px;width:100%;max-height:108px;overflow-x:hidden;overflow-y:auto;padding-bottom:8px}.zt-drawer-select__tree{display:flex;flex:1;min-height:0}.zt-drawer-select__tree-left{width:120px}.zt-drawer-select__tree-right{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--zt-white)}.zt-drawer-select__label{display:flex;align-items:center;line-height:28px;color:var(--zt-text-color);padding:var(--zt-padding-xs) 0 var(--zt-padding-xs) var(--zt-padding-base);font-size:var(--zt-font-size-md)}.zt-drawer-select__label--second{background:var(--zt-drawer-select-background);padding-left:var(--zt-padding-sm)}.zt-drawer-select__label--placeholder{display:flex;align-items:center;width:24px}.zt-drawer-select__label--text{display:flex;align-items:center;min-height:28px}.zt-drawer-select__label--icon--active{transform:rotate(90deg);color:var(--zt-primary-color)}.zt-drawer-select__label--active{color:var(--zt-primary-color);background:var(--zt-white)}.zt-drawer-select__title{display:flex;align-items:center;line-height:28px;font-size:var(--zt-font-size-md);color:var(--zt-text-color);font-weight:700;padding:var(--zt-padding-xs) var(--zt-padding-md)}.zt-drawer-select__content{flex:1;min-height:0;overflow-y:scroll}.zt-drawer-select__item--placeholder{width:30px}.zt-drawer-select__item--header{display:flex;min-height:44px;font-size:var(--zt-font-size-md);color:var(--zt-text-color);padding-left:4px}.zt-drawer-select__item--icon{display:flex;align-items:center;width:24px;margin-right:6px;height:100%}.zt-drawer-select__item--icon--active{transform:rotate(90deg);color:var(--zt-primary-color)}.zt-drawer-select__item--label{flex:1;display:flex;align-items:center;line-height:28px;padding:var(--zt-padding-xs) var(--zt-padding-md) var(--zt-padding-xs) 0}.zt-drawer-select__item--label--active{color:var(--zt-primary-color)}.zt-drawer-select__item--child{padding-left:var(--zt-padding-md)}.zt-drawer-select .zt-dialog__confirm{background:var(--zt-dialog-cancel-button-background-color);border:var(--zt-button-border-width) solid #ff5023;color:#ff5023}
1
+ :root{--zt-drawer-select-background: #ebf2f5}.zt-drawer-select{height:100%;width:100%;display:flex;flex-direction:column;background:var(--zt-background)}.zt-drawer-select__search{padding:var(--zt-padding-xs) 0}.zt-drawer-select__search--item{padding:var(--zt-padding-sm) 0 var(--zt-padding-sm) var(--zt-padding-md)}.zt-drawer-select__search--item:after{left:calc(-50% + 22px)}.zt-drawer-select__search--header{font-size:var(--zt-font-size-lg);font-weight:700;color:var(--zt-text-color);margin-bottom:4px}.zt-drawer-select__search--name{font-size:var(--zt-font-size-md);color:var(--zt-text-color-2)}.zt-drawer-select__wrap{position:fixed;right:0;left:0;bottom:0;z-index:999;overflow:hidden}.zt-drawer-select__popup{position:absolute;max-height:350px;border-radius:0 0 16px 16px}.zt-drawer-select__empty{font-size:var(--zt-font-size-md);color:var(--zt-gray-a4);text-align:center;padding:var(--zt-padding-lg) 0}.zt-drawer-select__history--title{height:44px;line-height:44px;font-weight:700;padding-left:var(--zt-padding-sm);color:var(--zt-text-color)}.zt-drawer-select__history--content{padding:var(--zt-padding-sm) var(--zt-padding-md) var(--zt-padding-xs)}.zt-drawer-select__history--content .zt-tag{line-height:28px;border-radius:14px;font-size:var(--zt-font-size-md);margin-right:4px;margin-bottom:8px}.zt-drawer-select__history--clear{display:flex;align-items:center;justify-content:center;height:44px;color:var(--zt-gray-a6);text-align:center;font-size:var(--zt-font-size-md)}.zt-drawer-select__name{position:relative;height:44px;line-height:44px;font-size:var(--zt-font-size-lg);color:var(--zt-text-color);font-weight:700;padding-left:var(--zt-padding-md)}.zt-drawer-select__name:before{content:"";position:absolute;width:4px;height:16px;top:14px;left:0;background:var(--zt-primary-color)}.zt-drawer-select__common-types{width:100%;background:var(--zt-white)}.zt-drawer-select__common-types--head{display:flex;align-items:center;min-height:44px;padding-left:var(--zt-padding-md);font-size:var(--zt-font-size-md);color:var(--zt-text-color)}.zt-drawer-select__common-types--label{flex-shrink:0;font-weight:700;padding-right:4px}.zt-drawer-select__common-types--mask{position:relative;flex:1;min-width:0;background:var(--zt-white)}.zt-drawer-select__common-types--mask:before,.zt-drawer-select__common-types--mask:after{content:"";position:absolute;top:0;bottom:0;width:32px;pointer-events:none;z-index:3;transition:opacity .2s}.zt-drawer-select__common-types--mask:before{left:-1px;opacity:0;background-image:linear-gradient(270deg,rgba(255,255,255,0) 0%,var(--zt-white) 100%)}.zt-drawer-select__common-types--mask:after{right:-1px;opacity:0;background-image:linear-gradient(90deg,rgba(255,255,255,0) 2.78%,var(--zt-white) 100%)}.zt-drawer-select__common-types--mask--left-mask:before,.zt-drawer-select__common-types--mask--right-mask:after{opacity:1}.zt-drawer-select__common-types--viewport{min-width:0;overflow:hidden}.zt-drawer-select__common-types--list{display:flex;align-items:center;gap:4px;padding:8px 16px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:none}.zt-drawer-select__common-types--list::-webkit-scrollbar{display:none}.zt-drawer-select__common-types--icon{display:flex;align-items:center;justify-content:center;width:56px;height:44px;flex-shrink:0}.zt-drawer-select__common-types--empty{flex:1;min-width:0;padding-left:8px;color:var(--zt-text-color-2);opacity:.2}.zt-drawer-select__common-types--btn{flex-shrink:0;min-width:-moz-fit-content;min-width:fit-content;border-radius:15px;opacity:1;padding-top:15px;padding-bottom:15px}.zt-drawer-select__common-types--panel{padding:0 var(--zt-padding-md) 8px;background:var(--zt-white)}.zt-drawer-select__common-types--panel-list{display:flex;flex-wrap:wrap;gap:8px 4px;padding-bottom:8px}.zt-drawer-select__common-types--clear{display:flex;align-items:center;justify-content:center;height:44px;color:var(--zt-text-color-2);opacity:.6;font-size:var(--zt-font-size-md)}.zt-drawer-select__common-types--clear-text{margin-left:4px}.zt-drawer-select__hot-types{width:100%;padding:0 16px 4px;margin-top:8px;box-sizing:border-box;background:var(--zt-white)}.zt-drawer-select__hot-types--label{height:44px;line-height:44px;font-size:var(--zt-font-size-md);font-weight:700;color:var(--zt-text-color)}.zt-drawer-select__hot-types--list{display:flex;flex-wrap:wrap;gap:8px 4px;width:100%;max-height:108px;overflow-x:hidden;overflow-y:auto;padding-bottom:8px}.zt-drawer-select__tree{display:flex;flex:1;min-height:0}.zt-drawer-select__tree-left{width:120px}.zt-drawer-select__tree-right{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--zt-white)}.zt-drawer-select__label{display:flex;align-items:center;line-height:28px;color:var(--zt-text-color);padding:var(--zt-padding-xs) 0 var(--zt-padding-xs) var(--zt-padding-base);font-size:var(--zt-font-size-md)}.zt-drawer-select__label--second{background:var(--zt-drawer-select-background);padding-left:var(--zt-padding-sm)}.zt-drawer-select__label--placeholder{display:flex;align-items:center;width:24px}.zt-drawer-select__label--text{display:flex;align-items:center;min-height:28px}.zt-drawer-select__label--icon--active{transform:rotate(90deg);color:var(--zt-primary-color)}.zt-drawer-select__label--active{color:var(--zt-primary-color);background:var(--zt-white)}.zt-drawer-select__title{display:flex;align-items:center;line-height:28px;font-size:var(--zt-font-size-md);color:var(--zt-text-color);font-weight:700;padding:var(--zt-padding-xs) var(--zt-padding-md)}.zt-drawer-select__content{flex:1;min-height:0;overflow-y:scroll}.zt-drawer-select__item--placeholder{width:30px}.zt-drawer-select__item--header{display:flex;min-height:44px;font-size:var(--zt-font-size-md);color:var(--zt-text-color);padding-left:4px}.zt-drawer-select__item--icon{display:flex;align-items:center;width:24px;margin-right:6px;height:100%}.zt-drawer-select__item--icon--active{transform:rotate(90deg);color:var(--zt-primary-color)}.zt-drawer-select__item--label{flex:1;display:flex;align-items:center;line-height:28px;padding:var(--zt-padding-xs) var(--zt-padding-md) var(--zt-padding-xs) 0}.zt-drawer-select__item--label--active{color:var(--zt-primary-color)}.zt-drawer-select__item--child{padding-left:var(--zt-padding-md)}.zt-drawer-select .zt-dialog__confirm{background:var(--zt-dialog-cancel-button-background-color);border:var(--zt-button-border-width) solid #ff5023;color:#ff5023}
package/es/index.d.ts CHANGED
@@ -86,4 +86,4 @@ declare namespace _default {
86
86
  }
87
87
  export default _default;
88
88
  export function install(app: any): void;
89
- export const version: "3.1.91";
89
+ export const version: "3.1.93";
package/es/index.mjs CHANGED
@@ -79,7 +79,7 @@ import { Timeline } from "./timeline/index.mjs";
79
79
  import { Toast } from "./toast/index.mjs";
80
80
  import { Uploader } from "./uploader/index.mjs";
81
81
  import { Video } from "./video/index.mjs";
82
- const version = "3.1.91";
82
+ const version = "3.1.93";
83
83
  function install(app) {
84
84
  const components = [
85
85
  ActionSheet,
@@ -78,6 +78,9 @@ var stdin_default = (0, import_vue.defineComponent)({
78
78
  const historyList = (0, import_vue.ref)([]);
79
79
  const showAllCommonTypes = (0, import_vue.ref)(false);
80
80
  const selectCommonId = (0, import_vue.ref)(-1);
81
+ const commonTypesListRef = (0, import_vue.ref)();
82
+ const showLeftCommonTypesMask = (0, import_vue.ref)(false);
83
+ const showRightCommonTypesMask = (0, import_vue.ref)(false);
81
84
  const defaultTreeNode = (0, import_vue.ref)(props.treeData);
82
85
  const fields = (0, import_vue.computed)(() => (0, import_utils2.assignDefaultFields)(props.treeFieldName));
83
86
  const visibleCommonTypeList = (0, import_vue.computed)(() => {
@@ -92,6 +95,25 @@ var stdin_default = (0, import_vue.defineComponent)({
92
95
  children,
93
96
  text: key
94
97
  } = fields.value;
98
+ const syncSelectCommonId = (node) => {
99
+ const selectedId = node == null ? void 0 : node[value];
100
+ selectCommonId.value = typeof selectedId === "string" || typeof selectedId === "number" ? selectedId : -1;
101
+ };
102
+ syncSelectCommonId(props.defaultSelectNode);
103
+ (0, import_vue.watch)(() => props.defaultSelectNode, (node) => {
104
+ selectNode.value = node;
105
+ syncSelectCommonId(node);
106
+ });
107
+ const updateCommonTypesMask = () => {
108
+ const list = commonTypesListRef.value;
109
+ if (!list)
110
+ return;
111
+ showLeftCommonTypesMask.value = list.scrollLeft > 0;
112
+ showRightCommonTypesMask.value = list.scrollLeft + list.clientWidth < list.scrollWidth;
113
+ };
114
+ const onCommonTypesScroll = () => {
115
+ updateCommonTypesMask();
116
+ };
95
117
  const allData = {
96
118
  [value]: -1,
97
119
  [key]: "\u5168\u90E8",
@@ -168,6 +190,7 @@ var stdin_default = (0, import_vue.defineComponent)({
168
190
  };
169
191
  flatData(props.treeData);
170
192
  updateOffset();
193
+ (0, import_vue.nextTick)(updateCommonTypesMask);
171
194
  });
172
195
  const isEmpty = (item) => !item[children] || item[children].length === 0;
173
196
  const syncExpandNodeByParent = (item) => {
@@ -355,11 +378,16 @@ var stdin_default = (0, import_vue.defineComponent)({
355
378
  }, [(0, import_vue.createVNode)("span", {
356
379
  "class": [bem("common-types--label")]
357
380
  }, [(0, import_vue.createTextVNode)("\u5E38\u7528\u5C0F\u7C7B")]), visibleCommonTypeList.value.length > 0 ? (0, import_vue.createVNode)("div", {
358
- "class": [bem("common-types--mask")]
381
+ "class": [bem("common-types--mask"), bem("common-types--mask", {
382
+ "left-mask": showLeftCommonTypesMask.value,
383
+ "right-mask": showRightCommonTypesMask.value
384
+ })]
359
385
  }, [(0, import_vue.createVNode)("div", {
360
386
  "class": [bem("common-types--viewport")]
361
387
  }, [(0, import_vue.createVNode)("div", {
362
- "class": [bem("common-types--list")]
388
+ "ref": commonTypesListRef,
389
+ "class": [bem("common-types--list")],
390
+ "onScroll": onCommonTypesScroll
363
391
  }, [visibleCommonTypeList.value.map(renderCommonTypeButton)])])]) : (0, import_vue.createVNode)("div", {
364
392
  "class": [bem("common-types--empty")]
365
393
  }, [(0, import_vue.createTextVNode)("\u6682\u65E0\u5E38\u7528\u5C0F\u7C7B")]), visibleCommonTypeList.value.length > 0 && (0, import_vue.createVNode)("div", {
@@ -1 +1 @@
1
- :root{--zt-drawer-select-background: #ebf2f5}.zt-drawer-select{height:100%;width:100%;display:flex;flex-direction:column;background:var(--zt-background)}.zt-drawer-select__search{padding:var(--zt-padding-xs) 0}.zt-drawer-select__search--item{padding:var(--zt-padding-sm) 0 var(--zt-padding-sm) var(--zt-padding-md)}.zt-drawer-select__search--item:after{left:calc(-50% + 22px)}.zt-drawer-select__search--header{font-size:var(--zt-font-size-lg);font-weight:700;color:var(--zt-text-color);margin-bottom:4px}.zt-drawer-select__search--name{font-size:var(--zt-font-size-md);color:var(--zt-text-color-2)}.zt-drawer-select__wrap{position:fixed;right:0;left:0;bottom:0;z-index:999;overflow:hidden}.zt-drawer-select__popup{position:absolute;max-height:350px;border-radius:0 0 16px 16px}.zt-drawer-select__empty{font-size:var(--zt-font-size-md);color:var(--zt-gray-a4);text-align:center;padding:var(--zt-padding-lg) 0}.zt-drawer-select__history--title{height:44px;line-height:44px;font-weight:700;padding-left:var(--zt-padding-sm);color:var(--zt-text-color)}.zt-drawer-select__history--content{padding:var(--zt-padding-sm) var(--zt-padding-md) var(--zt-padding-xs)}.zt-drawer-select__history--content .zt-tag{line-height:28px;border-radius:14px;font-size:var(--zt-font-size-md);margin-right:4px;margin-bottom:8px}.zt-drawer-select__history--clear{display:flex;align-items:center;justify-content:center;height:44px;color:var(--zt-gray-a6);text-align:center;font-size:var(--zt-font-size-md)}.zt-drawer-select__name{position:relative;height:44px;line-height:44px;font-size:var(--zt-font-size-lg);color:var(--zt-text-color);font-weight:700;padding-left:var(--zt-padding-md)}.zt-drawer-select__name:before{content:"";position:absolute;width:4px;height:16px;top:14px;left:0;background:var(--zt-primary-color)}.zt-drawer-select__common-types{width:100%;background:var(--zt-white)}.zt-drawer-select__common-types--head{display:flex;align-items:center;min-height:44px;padding-left:var(--zt-padding-md);font-size:var(--zt-font-size-md);color:var(--zt-text-color)}.zt-drawer-select__common-types--label{flex-shrink:0;font-weight:700;padding-right:4px}.zt-drawer-select__common-types--mask{position:relative;flex:1;min-width:0;background:var(--zt-white)}.zt-drawer-select__common-types--mask:before,.zt-drawer-select__common-types--mask:after{content:"";position:absolute;top:0;bottom:0;width:40px;pointer-events:none;z-index:3}.zt-drawer-select__common-types--mask:before{left:-1px;background-image:linear-gradient(90deg,var(--zt-white) 0%,var(--zt-white) 24px,rgba(255,255,255,0) 100%)}.zt-drawer-select__common-types--mask:after{right:-1px;background-image:linear-gradient(270deg,var(--zt-white) 0%,var(--zt-white) 12px,rgba(255,255,255,0) 100%)}.zt-drawer-select__common-types--viewport{min-width:0;overflow:hidden}.zt-drawer-select__common-types--list{display:flex;align-items:center;gap:4px;padding:8px 16px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:none}.zt-drawer-select__common-types--list::-webkit-scrollbar{display:none}.zt-drawer-select__common-types--icon{display:flex;align-items:center;justify-content:center;width:56px;height:44px;flex-shrink:0}.zt-drawer-select__common-types--empty{flex:1;min-width:0;padding-left:8px;color:var(--zt-text-color-2);opacity:.2}.zt-drawer-select__common-types--btn{flex-shrink:0;min-width:-moz-fit-content;min-width:fit-content;border-radius:15px;opacity:1;padding-top:15px;padding-bottom:15px}.zt-drawer-select__common-types--panel{padding:0 var(--zt-padding-md) 8px;background:var(--zt-white)}.zt-drawer-select__common-types--panel-list{display:flex;flex-wrap:wrap;gap:8px 4px;padding-bottom:8px}.zt-drawer-select__common-types--clear{display:flex;align-items:center;justify-content:center;height:44px;color:var(--zt-text-color-2);opacity:.6;font-size:var(--zt-font-size-md)}.zt-drawer-select__common-types--clear-text{margin-left:4px}.zt-drawer-select__hot-types{width:100%;padding:0 16px 4px;margin-top:8px;box-sizing:border-box;background:var(--zt-white)}.zt-drawer-select__hot-types--label{height:44px;line-height:44px;font-size:var(--zt-font-size-md);font-weight:700;color:var(--zt-text-color)}.zt-drawer-select__hot-types--list{display:flex;flex-wrap:wrap;gap:8px 4px;width:100%;max-height:108px;overflow-x:hidden;overflow-y:auto;padding-bottom:8px}.zt-drawer-select__tree{display:flex;flex:1;min-height:0}.zt-drawer-select__tree-left{width:120px}.zt-drawer-select__tree-right{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--zt-white)}.zt-drawer-select__label{display:flex;align-items:center;line-height:28px;color:var(--zt-text-color);padding:var(--zt-padding-xs) 0 var(--zt-padding-xs) var(--zt-padding-base);font-size:var(--zt-font-size-md)}.zt-drawer-select__label--second{background:var(--zt-drawer-select-background);padding-left:var(--zt-padding-sm)}.zt-drawer-select__label--placeholder{display:flex;align-items:center;width:24px}.zt-drawer-select__label--text{display:flex;align-items:center;min-height:28px}.zt-drawer-select__label--icon--active{transform:rotate(90deg);color:var(--zt-primary-color)}.zt-drawer-select__label--active{color:var(--zt-primary-color);background:var(--zt-white)}.zt-drawer-select__title{display:flex;align-items:center;line-height:28px;font-size:var(--zt-font-size-md);color:var(--zt-text-color);font-weight:700;padding:var(--zt-padding-xs) var(--zt-padding-md)}.zt-drawer-select__content{flex:1;min-height:0;overflow-y:scroll}.zt-drawer-select__item--placeholder{width:30px}.zt-drawer-select__item--header{display:flex;min-height:44px;font-size:var(--zt-font-size-md);color:var(--zt-text-color);padding-left:4px}.zt-drawer-select__item--icon{display:flex;align-items:center;width:24px;margin-right:6px;height:100%}.zt-drawer-select__item--icon--active{transform:rotate(90deg);color:var(--zt-primary-color)}.zt-drawer-select__item--label{flex:1;display:flex;align-items:center;line-height:28px;padding:var(--zt-padding-xs) var(--zt-padding-md) var(--zt-padding-xs) 0}.zt-drawer-select__item--label--active{color:var(--zt-primary-color)}.zt-drawer-select__item--child{padding-left:var(--zt-padding-md)}.zt-drawer-select .zt-dialog__confirm{background:var(--zt-dialog-cancel-button-background-color);border:var(--zt-button-border-width) solid #ff5023;color:#ff5023}
1
+ :root{--zt-drawer-select-background: #ebf2f5}.zt-drawer-select{height:100%;width:100%;display:flex;flex-direction:column;background:var(--zt-background)}.zt-drawer-select__search{padding:var(--zt-padding-xs) 0}.zt-drawer-select__search--item{padding:var(--zt-padding-sm) 0 var(--zt-padding-sm) var(--zt-padding-md)}.zt-drawer-select__search--item:after{left:calc(-50% + 22px)}.zt-drawer-select__search--header{font-size:var(--zt-font-size-lg);font-weight:700;color:var(--zt-text-color);margin-bottom:4px}.zt-drawer-select__search--name{font-size:var(--zt-font-size-md);color:var(--zt-text-color-2)}.zt-drawer-select__wrap{position:fixed;right:0;left:0;bottom:0;z-index:999;overflow:hidden}.zt-drawer-select__popup{position:absolute;max-height:350px;border-radius:0 0 16px 16px}.zt-drawer-select__empty{font-size:var(--zt-font-size-md);color:var(--zt-gray-a4);text-align:center;padding:var(--zt-padding-lg) 0}.zt-drawer-select__history--title{height:44px;line-height:44px;font-weight:700;padding-left:var(--zt-padding-sm);color:var(--zt-text-color)}.zt-drawer-select__history--content{padding:var(--zt-padding-sm) var(--zt-padding-md) var(--zt-padding-xs)}.zt-drawer-select__history--content .zt-tag{line-height:28px;border-radius:14px;font-size:var(--zt-font-size-md);margin-right:4px;margin-bottom:8px}.zt-drawer-select__history--clear{display:flex;align-items:center;justify-content:center;height:44px;color:var(--zt-gray-a6);text-align:center;font-size:var(--zt-font-size-md)}.zt-drawer-select__name{position:relative;height:44px;line-height:44px;font-size:var(--zt-font-size-lg);color:var(--zt-text-color);font-weight:700;padding-left:var(--zt-padding-md)}.zt-drawer-select__name:before{content:"";position:absolute;width:4px;height:16px;top:14px;left:0;background:var(--zt-primary-color)}.zt-drawer-select__common-types{width:100%;background:var(--zt-white)}.zt-drawer-select__common-types--head{display:flex;align-items:center;min-height:44px;padding-left:var(--zt-padding-md);font-size:var(--zt-font-size-md);color:var(--zt-text-color)}.zt-drawer-select__common-types--label{flex-shrink:0;font-weight:700;padding-right:4px}.zt-drawer-select__common-types--mask{position:relative;flex:1;min-width:0;background:var(--zt-white)}.zt-drawer-select__common-types--mask:before,.zt-drawer-select__common-types--mask:after{content:"";position:absolute;top:0;bottom:0;width:32px;pointer-events:none;z-index:3;transition:opacity .2s}.zt-drawer-select__common-types--mask:before{left:-1px;opacity:0;background-image:linear-gradient(270deg,rgba(255,255,255,0) 0%,var(--zt-white) 100%)}.zt-drawer-select__common-types--mask:after{right:-1px;opacity:0;background-image:linear-gradient(90deg,rgba(255,255,255,0) 2.78%,var(--zt-white) 100%)}.zt-drawer-select__common-types--mask--left-mask:before,.zt-drawer-select__common-types--mask--right-mask:after{opacity:1}.zt-drawer-select__common-types--viewport{min-width:0;overflow:hidden}.zt-drawer-select__common-types--list{display:flex;align-items:center;gap:4px;padding:8px 16px;overflow-x:auto;overflow-y:hidden;white-space:nowrap;scrollbar-width:none}.zt-drawer-select__common-types--list::-webkit-scrollbar{display:none}.zt-drawer-select__common-types--icon{display:flex;align-items:center;justify-content:center;width:56px;height:44px;flex-shrink:0}.zt-drawer-select__common-types--empty{flex:1;min-width:0;padding-left:8px;color:var(--zt-text-color-2);opacity:.2}.zt-drawer-select__common-types--btn{flex-shrink:0;min-width:-moz-fit-content;min-width:fit-content;border-radius:15px;opacity:1;padding-top:15px;padding-bottom:15px}.zt-drawer-select__common-types--panel{padding:0 var(--zt-padding-md) 8px;background:var(--zt-white)}.zt-drawer-select__common-types--panel-list{display:flex;flex-wrap:wrap;gap:8px 4px;padding-bottom:8px}.zt-drawer-select__common-types--clear{display:flex;align-items:center;justify-content:center;height:44px;color:var(--zt-text-color-2);opacity:.6;font-size:var(--zt-font-size-md)}.zt-drawer-select__common-types--clear-text{margin-left:4px}.zt-drawer-select__hot-types{width:100%;padding:0 16px 4px;margin-top:8px;box-sizing:border-box;background:var(--zt-white)}.zt-drawer-select__hot-types--label{height:44px;line-height:44px;font-size:var(--zt-font-size-md);font-weight:700;color:var(--zt-text-color)}.zt-drawer-select__hot-types--list{display:flex;flex-wrap:wrap;gap:8px 4px;width:100%;max-height:108px;overflow-x:hidden;overflow-y:auto;padding-bottom:8px}.zt-drawer-select__tree{display:flex;flex:1;min-height:0}.zt-drawer-select__tree-left{width:120px}.zt-drawer-select__tree-right{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;background:var(--zt-white)}.zt-drawer-select__label{display:flex;align-items:center;line-height:28px;color:var(--zt-text-color);padding:var(--zt-padding-xs) 0 var(--zt-padding-xs) var(--zt-padding-base);font-size:var(--zt-font-size-md)}.zt-drawer-select__label--second{background:var(--zt-drawer-select-background);padding-left:var(--zt-padding-sm)}.zt-drawer-select__label--placeholder{display:flex;align-items:center;width:24px}.zt-drawer-select__label--text{display:flex;align-items:center;min-height:28px}.zt-drawer-select__label--icon--active{transform:rotate(90deg);color:var(--zt-primary-color)}.zt-drawer-select__label--active{color:var(--zt-primary-color);background:var(--zt-white)}.zt-drawer-select__title{display:flex;align-items:center;line-height:28px;font-size:var(--zt-font-size-md);color:var(--zt-text-color);font-weight:700;padding:var(--zt-padding-xs) var(--zt-padding-md)}.zt-drawer-select__content{flex:1;min-height:0;overflow-y:scroll}.zt-drawer-select__item--placeholder{width:30px}.zt-drawer-select__item--header{display:flex;min-height:44px;font-size:var(--zt-font-size-md);color:var(--zt-text-color);padding-left:4px}.zt-drawer-select__item--icon{display:flex;align-items:center;width:24px;margin-right:6px;height:100%}.zt-drawer-select__item--icon--active{transform:rotate(90deg);color:var(--zt-primary-color)}.zt-drawer-select__item--label{flex:1;display:flex;align-items:center;line-height:28px;padding:var(--zt-padding-xs) var(--zt-padding-md) var(--zt-padding-xs) 0}.zt-drawer-select__item--label--active{color:var(--zt-primary-color)}.zt-drawer-select__item--child{padding-left:var(--zt-padding-md)}.zt-drawer-select .zt-dialog__confirm{background:var(--zt-dialog-cancel-button-background-color);border:var(--zt-button-border-width) solid #ff5023;color:#ff5023}