zartui 3.2.2 → 3.2.3

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.
Files changed (27) hide show
  1. package/es/action-sheet/ActionSheet.d.ts +1 -1
  2. package/es/action-sheet/ActionSheet.mjs +2 -3
  3. package/es/action-sheet/index.css +1 -1
  4. package/es/dialog/Dialog.d.ts +6 -6
  5. package/es/dialog/Dialog.mjs +4 -4
  6. package/es/dialog/index.d.ts +4 -4
  7. package/es/index.d.ts +1 -1
  8. package/es/index.mjs +1 -1
  9. package/es/tabs/Tabs.mjs +6 -2
  10. package/es/tabs/index.css +1 -1
  11. package/lib/action-sheet/ActionSheet.d.ts +1 -1
  12. package/lib/action-sheet/ActionSheet.js +2 -3
  13. package/lib/action-sheet/index.css +1 -1
  14. package/lib/dialog/Dialog.d.ts +6 -6
  15. package/lib/dialog/Dialog.js +4 -4
  16. package/lib/dialog/index.d.ts +4 -4
  17. package/lib/index.css +1 -1
  18. package/lib/index.d.ts +1 -1
  19. package/lib/index.js +1 -1
  20. package/lib/tabs/Tabs.js +6 -2
  21. package/lib/tabs/index.css +1 -1
  22. package/lib/web-types.json +1 -1
  23. package/lib/zartui.cjs.js +13 -10
  24. package/lib/zartui.es.js +13 -10
  25. package/lib/zartui.js +13 -10
  26. package/lib/zartui.min.js +1 -1
  27. package/package.json +6 -6
package/es/action-sheet/ActionSheet.d.ts CHANGED
@@ -3,7 +3,7 @@ export type ActionSheetAction = {
3
3
  name?: string;
4
4
  color?: string;
5
5
  subNameColor?: string;
6
- bgColor?: string;
6
+ background?: string;
7
7
  border?: string;
8
8
  subname?: string;
9
9
  loading?: boolean;
package/es/action-sheet/ActionSheet.mjs CHANGED
@@ -37,7 +37,6 @@ var stdin_default = defineComponent({
37
37
  "class": bem("header")
38
38
  }, [props.title, props.closeable && _createVNode(Icon, {
39
39
  "name": props.closeIcon,
40
- "size": "16",
41
40
  "class": [bem("close"), HAPTICS_FEEDBACK],
42
41
  "onClick": onCancel
43
42
  }, null)]);
@@ -73,7 +72,7 @@ var stdin_default = defineComponent({
73
72
  };
74
73
  const renderAction = (action, index) => {
75
74
  const {
76
- bgColor,
75
+ background,
77
76
  border,
78
77
  loading,
79
78
  callback,
@@ -100,7 +99,7 @@ var stdin_default = defineComponent({
100
99
  return _createVNode("button", {
101
100
  "type": "button",
102
101
  "style": {
103
- background: bgColor,
102
+ background,
104
103
  border
105
104
  },
106
105
  "class": [
package/es/action-sheet/index.css CHANGED
@@ -1 +1 @@
1
- :root{--zt-action-sheet-max-height: 80%;--zt-action-sheet-header-height: 44px;--zt-action-sheet-description-color: var(--zt-gray-40);--zt-action-sheet-item-background: var(--zt-background-popup);--zt-action-sheet-item-border-color: var(--zt-border-color);--zt-action-sheet-item-border-radius: 24px;--zt-action-sheet-item-margin-left: 16px;--zt-action-sheet-item-margin: 8px var(--zt-action-sheet-item-margin-left);--zt-action-sheet-item-text-color: var(--zt-text-color);--zt-action-sheet-item-disabled-text-color: var(--zt-gray-20);--zt-action-sheet-subname-color: var(--zt-gray-40);--zt-action-sheet-close-icon-color: var(--zt-gray-40);--zt-action-sheet-close-icon-padding: 0 20px;--zt-action-sheet-cancel-text-color: var(--zt-text-color);--zt-action-sheet-loading-icon-size: 16px;--zt-action-sheet-description-background: var(--zt-background-popup)}:root[zt-theme-size=large]{--zt-action-sheet-header-height: 56px}.zt-action-sheet{display:flex;flex-direction:column;max-height:var(--zt-action-sheet-max-height);overflow:hidden;color:var(--zt-action-sheet-item-text-color)}.zt-action-sheet__content{flex:1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.zt-action-sheet__item,.zt-action-sheet__cancel{display:block;width:calc(100% - var(--zt-action-sheet-item-margin-left) * 2);padding:10px var(--zt-padding-md);font-size:var(--zt-font-size-lg);line-height:var(--zt-line-height-lg);background:var(--zt-action-sheet-item-background);border:1px solid var(--zt-action-sheet-item-border-color);border-radius:var(--zt-action-sheet-item-border-radius);margin:var(--zt-action-sheet-item-margin);cursor:pointer}.zt-action-sheet__item:active{background-color:var(--zt-gray-10)}.zt-action-sheet__item--loading,.zt-action-sheet__item--disabled{color:var(--zt-action-sheet-item-disabled-text-color)}.zt-action-sheet__item--loading:active,.zt-action-sheet__item--disabled:active{background-color:var(--zt-action-sheet-item-background)}.zt-action-sheet__item--disabled{cursor:not-allowed}.zt-action-sheet__item--loading{cursor:default}.zt-action-sheet__item--with-sub{padding-top:8px;padding-bottom:8px}.zt-action-sheet__cancel{padding:8px 16px;flex-shrink:0;box-sizing:border-box;color:var(--zt-action-sheet-cancel-text-color)}.zt-action-sheet__cancel-btn{width:100%;border:none;cursor:pointer;background-color:var(--zt-gray-10);border-radius:20px;height:var(--zt-button-default-height);font-size:var(--zt-font-size-lg);color:var(--zt-text-color);line-height:var(--zt-line-height-lg)}.zt-action-sheet__cancel-btn:active{opacity:var(--zt-active-opacity)}.zt-action-sheet__subname{margin-top:var(--zt-padding-xxs);color:var(--zt-action-sheet-subname-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-sm)}.zt-action-sheet__header{position:relative;flex-shrink:0;font-weight:var(--zt-font-bold);font-size:var(--zt-font-size-xl);line-height:var(--zt-action-sheet-header-height);text-align:center}.zt-action-sheet__header:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-action-sheet__description{background:var(--zt-action-sheet-description-background);position:relative;flex-shrink:0;padding:12px var(--zt-padding-md);color:var(--zt-action-sheet-description-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);text-align:center}.zt-action-sheet__description:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-action-sheet__description--custom{padding:0}.zt-action-sheet__loading-icon .zt-loading__spinner{width:var(--zt-action-sheet-loading-icon-size);height:var(--zt-action-sheet-loading-icon-size)}.zt-action-sheet__close{position:absolute;top:0;left:0;padding:var(--zt-action-sheet-close-icon-padding);color:var(--zt-action-sheet-close-icon-color);font-size:var(--zt-font-size-xxxl);line-height:inherit}
1
+ :root{--zt-action-sheet-max-height: 80%;--zt-action-sheet-header-height: 44px;--zt-action-sheet-description-color: var(--zt-gray-40);--zt-action-sheet-item-background: var(--zt-background-popup);--zt-action-sheet-item-border-color: var(--zt-border-color);--zt-action-sheet-item-border-radius: 24px;--zt-action-sheet-item-margin-left: 16px;--zt-action-sheet-item-margin: 8px var(--zt-action-sheet-item-margin-left);--zt-action-sheet-item-text-color: var(--zt-text-color);--zt-action-sheet-item-disabled-text-color: var(--zt-gray-20);--zt-action-sheet-subname-color: var(--zt-gray-40);--zt-action-sheet-close-icon-color: var(--zt-gray-40);--zt-action-sheet-close-icon-padding: 0 20px;--zt-action-sheet-cancel-text-color: var(--zt-text-color);--zt-action-sheet-loading-icon-size: 16px;--zt-action-sheet-description-background: var(--zt-background-popup)}:root[zt-theme-size=large]{--zt-action-sheet-header-height: 56px}.zt-action-sheet{display:flex;flex-direction:column;max-height:var(--zt-action-sheet-max-height);overflow:hidden;color:var(--zt-action-sheet-item-text-color)}.zt-action-sheet__content{flex:1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.zt-action-sheet__item,.zt-action-sheet__cancel{display:block;width:calc(100% - var(--zt-action-sheet-item-margin-left) * 2);padding:10px var(--zt-padding-md);font-size:var(--zt-font-size-lg);line-height:var(--zt-line-height-lg);background:var(--zt-action-sheet-item-background);border:1px solid var(--zt-action-sheet-item-border-color);border-radius:var(--zt-action-sheet-item-border-radius);margin:var(--zt-action-sheet-item-margin);cursor:pointer}.zt-action-sheet__item:active{background-color:var(--zt-darkblue-10);border-color:var(--zt-darkblue-60);color:var(--zt-primary-color)}.zt-action-sheet__item:active .zt-action-sheet__subname{color:var(--zt-darkblue-40)}.zt-action-sheet__item--loading,.zt-action-sheet__item--disabled{color:var(--zt-action-sheet-item-disabled-text-color)}.zt-action-sheet__item--loading:active,.zt-action-sheet__item--disabled:active{background-color:var(--zt-action-sheet-item-background)}.zt-action-sheet__item--disabled{cursor:not-allowed}.zt-action-sheet__item--loading{cursor:default}.zt-action-sheet__item--with-sub{padding-top:8px;padding-bottom:8px}.zt-action-sheet__cancel{padding:8px 16px;flex-shrink:0;box-sizing:border-box;color:var(--zt-action-sheet-cancel-text-color)}.zt-action-sheet__cancel-btn{width:100%;border:none;cursor:pointer;background-color:var(--zt-gray-10);border-radius:20px;height:var(--zt-button-default-height);font-size:var(--zt-font-size-lg);color:var(--zt-text-color);line-height:var(--zt-line-height-lg)}.zt-action-sheet__cancel-btn:active{opacity:var(--zt-active-opacity)}.zt-action-sheet__subname{margin-top:var(--zt-padding-xxs);color:var(--zt-action-sheet-subname-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-sm)}.zt-action-sheet__header{position:relative;flex-shrink:0;font-weight:var(--zt-font-bold);font-size:var(--zt-font-size-xl);line-height:var(--zt-action-sheet-header-height);text-align:center}.zt-action-sheet__header:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-action-sheet__description{background:var(--zt-action-sheet-description-background);position:relative;flex-shrink:0;padding:12px var(--zt-padding-md);color:var(--zt-action-sheet-description-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);text-align:center}.zt-action-sheet__description:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-action-sheet__description--custom{padding:0}.zt-action-sheet__loading-icon .zt-loading__spinner{width:var(--zt-action-sheet-loading-icon-size);height:var(--zt-action-sheet-loading-icon-size)}.zt-action-sheet__close{position:absolute;top:0;left:0;padding:var(--zt-action-sheet-close-icon-padding);color:var(--zt-action-sheet-close-icon-color);font-size:var(--zt-font-size-lg);line-height:inherit}
package/es/dialog/Dialog.d.ts CHANGED
@@ -46,11 +46,11 @@ export declare const dialogProps: {
46
46
  showCancelButton: BooleanConstructor;
47
47
  cancelButtonText: StringConstructor;
48
48
  cancelButtonColor: StringConstructor;
49
- cancelButtonBgColor: StringConstructor;
49
+ cancelButtonBackground: StringConstructor;
50
50
  cancelButtonDisabled: BooleanConstructor;
51
51
  confirmButtonText: StringConstructor;
52
52
  confirmButtonColor: StringConstructor;
53
- confirmButtonBgColor: StringConstructor;
53
+ confirmButtonBackground: StringConstructor;
54
54
  confirmButtonDisabled: BooleanConstructor;
55
55
  showConfirmButton: {
56
56
  type: BooleanConstructor;
@@ -105,11 +105,11 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
105
105
  showCancelButton: BooleanConstructor;
106
106
  cancelButtonText: StringConstructor;
107
107
  cancelButtonColor: StringConstructor;
108
- cancelButtonBgColor: StringConstructor;
108
+ cancelButtonBackground: StringConstructor;
109
109
  cancelButtonDisabled: BooleanConstructor;
110
110
  confirmButtonText: StringConstructor;
111
111
  confirmButtonColor: StringConstructor;
112
- confirmButtonBgColor: StringConstructor;
112
+ confirmButtonBackground: StringConstructor;
113
113
  confirmButtonDisabled: BooleanConstructor;
114
114
  showConfirmButton: {
115
115
  type: BooleanConstructor;
@@ -162,11 +162,11 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
162
162
  showCancelButton: BooleanConstructor;
163
163
  cancelButtonText: StringConstructor;
164
164
  cancelButtonColor: StringConstructor;
165
- cancelButtonBgColor: StringConstructor;
165
+ cancelButtonBackground: StringConstructor;
166
166
  cancelButtonDisabled: BooleanConstructor;
167
167
  confirmButtonText: StringConstructor;
168
168
  confirmButtonColor: StringConstructor;
169
- confirmButtonBgColor: StringConstructor;
169
+ confirmButtonBackground: StringConstructor;
170
170
  confirmButtonDisabled: BooleanConstructor;
171
171
  showConfirmButton: {
172
172
  type: BooleanConstructor;
package/es/dialog/Dialog.mjs CHANGED
@@ -19,11 +19,11 @@ const dialogProps = extend({}, popupSharedProps, {
19
19
  showCancelButton: Boolean,
20
20
  cancelButtonText: String,
21
21
  cancelButtonColor: String,
22
- cancelButtonBgColor: String,
22
+ cancelButtonBackground: String,
23
23
  cancelButtonDisabled: Boolean,
24
24
  confirmButtonText: String,
25
25
  confirmButtonColor: String,
26
- confirmButtonBgColor: String,
26
+ confirmButtonBackground: String,
27
27
  confirmButtonDisabled: Boolean,
28
28
  showConfirmButton: truthProp,
29
29
  closeOnClickOverlay: Boolean
@@ -159,7 +159,7 @@ var stdin_default = defineComponent({
159
159
  "class": bem("cancel"),
160
160
  "style": {
161
161
  color: props.cancelButtonColor,
162
- background: props.cancelButtonBgColor
162
+ background: props.cancelButtonBackground
163
163
  },
164
164
  "loading": loading.cancel,
165
165
  "disabled": props.cancelButtonDisabled,
@@ -172,7 +172,7 @@ var stdin_default = defineComponent({
172
172
  }),
173
173
  "style": {
174
174
  color: props.confirmButtonColor,
175
- background: props.confirmButtonBgColor
175
+ background: props.confirmButtonBackground
176
176
  },
177
177
  "loading": loading.confirm,
178
178
  "disabled": props.confirmButtonDisabled,
package/es/dialog/index.d.ts CHANGED
@@ -44,11 +44,11 @@ export declare const Dialog: import("../utils").WithInstall<import("vue").Define
44
44
  showCancelButton: BooleanConstructor;
45
45
  cancelButtonText: StringConstructor;
46
46
  cancelButtonColor: StringConstructor;
47
- cancelButtonBgColor: StringConstructor;
47
+ cancelButtonBackground: StringConstructor;
48
48
  cancelButtonDisabled: BooleanConstructor;
49
49
  confirmButtonText: StringConstructor;
50
50
  confirmButtonColor: StringConstructor;
51
- confirmButtonBgColor: StringConstructor;
51
+ confirmButtonBackground: StringConstructor;
52
52
  confirmButtonDisabled: BooleanConstructor;
53
53
  showConfirmButton: {
54
54
  type: BooleanConstructor;
@@ -101,11 +101,11 @@ export declare const Dialog: import("../utils").WithInstall<import("vue").Define
101
101
  showCancelButton: BooleanConstructor;
102
102
  cancelButtonText: StringConstructor;
103
103
  cancelButtonColor: StringConstructor;
104
- cancelButtonBgColor: StringConstructor;
104
+ cancelButtonBackground: StringConstructor;
105
105
  cancelButtonDisabled: BooleanConstructor;
106
106
  confirmButtonText: StringConstructor;
107
107
  confirmButtonColor: StringConstructor;
108
- confirmButtonBgColor: StringConstructor;
108
+ confirmButtonBackground: StringConstructor;
109
109
  confirmButtonDisabled: BooleanConstructor;
110
110
  showConfirmButton: {
111
111
  type: BooleanConstructor;
package/es/index.d.ts CHANGED
@@ -84,4 +84,4 @@ declare namespace _default {
84
84
  }
85
85
  export default _default;
86
86
  export function install(app: any): void;
87
- export const version: "3.2.0";
87
+ export const version: "3.2.3";
package/es/index.mjs CHANGED
@@ -77,7 +77,7 @@ import { Timeline } from "./timeline/index.mjs";
77
77
  import { Toast } from "./toast/index.mjs";
78
78
  import { Uploader } from "./uploader/index.mjs";
79
79
  import { Video } from "./video/index.mjs";
80
- const version = "3.2.0";
80
+ const version = "3.2.3";
81
81
  function install(app) {
82
82
  const components = [
83
83
  ActionSheet,
package/es/tabs/Tabs.mjs CHANGED
@@ -112,6 +112,12 @@ var stdin_default = defineComponent({
112
112
  }
113
113
  return 0;
114
114
  });
115
+ watch(() => titleRefs.value, () => {
116
+ if (navRef.value && scrollable.value) {
117
+ state.showLeftOverlay = Math.floor(navRef.value.scrollLeft) > 0;
118
+ state.showRightOverlay = hasScrollToEnd(navRef.value);
119
+ }
120
+ });
115
121
  const scrollIntoView = (immediate) => {
116
122
  const nav = navRef.value;
117
123
  const titles = titleRefs.value;
@@ -288,7 +294,6 @@ var stdin_default = defineComponent({
288
294
  "class": bem("indicator-left")
289
295
  }, [_createVNode(Icon, {
290
296
  "name": "back",
291
- "size": "16",
292
297
  "class": bem("icon-indicator-left")
293
298
  }, null)]);
294
299
  }
@@ -300,7 +305,6 @@ var stdin_default = defineComponent({
300
305
  "class": bem("indicator-right")
301
306
  }, [_createVNode(Icon, {
302
307
  "name": "arrow-right",
303
- "size": "16",
304
308
  "class": bem("icon-indicator-right")
305
309
  }, null)]);
306
310
  }
package/es/tabs/index.css CHANGED
@@ -1 +1 @@
1
- :root{--zt-tab-active-text-color: var(--zt-text-color);--zt-tab-disabled-text-color: var(--zt-text-color-3);--zt-tab-active-opacity: .2;--zt-tabs-default-color: var(--zt-primary-color);--zt-tabs-line-height: 44px;--zt-tabs-line-bottom: 16px;--zt-tabs-card-height: 32px;--zt-tabs-bottom-bar-width: 12px;--zt-tabs-bottom-bar-height: 2px;--zt-tabs-bottom-bar-color: var(--zt-primary-color);--zt-tabs-bottom-bar-radius: 2px;--zt-tabs-nav-background: var(--zt-background);--zt-tab-text-color: var(--zt-gray-40);--zt-tabs-overlay-left-background: linear-gradient(90deg, #ffffff 0%, rgba(245, 250, 255, 0) 100%);--zt-tabs-overlay-right-background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%)}.zt-tab{position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0 var(--zt-padding-md);color:var(--zt-tab-text-color);font-size:var(--zt-font-size-lg);line-height:var(--zt-line-height-md);cursor:pointer}.zt-tab--active{color:var(--zt-tab-active-text-color);font-weight:var(--zt-font-bold)}.zt-tab--active:active{opacity:var(--zt-tab-active-opacity)}.zt-tab--disabled{color:var(--zt-tab-disabled-text-color);cursor:not-allowed;font-size:var(--zt-font-size-md)}.zt-tab--grow{flex:1 0 auto;padding:0 var(--zt-padding-sm)}.zt-tab--shrink{flex:none;padding:0 var(--zt-padding-xs)}.zt-tab--card{color:var(--zt-tabs-default-color)}.zt-tab--card.zt-tab--active{color:var(--zt-white);background-color:var(--zt-tabs-default-color)}.zt-tab--card--disabled{color:var(--zt-tab-disabled-text-color)}.zt-tab__title{flex:1;display:flex;align-items:center;justify-content:center}.zt-tab__text--ellipsis{display:-webkit-box;overflow:hidden;-webkit-line-clamp:1;-webkit-box-orient:vertical}.zt-tab__text-wrapper,.zt-tabs{position:relative}.zt-tabs__wrap{overflow:hidden;position:relative}.zt-tabs__wrap--page-top{position:fixed}.zt-tabs__wrap--content-bottom{top:auto;bottom:0}.zt-tabs__overlay-left,.zt-tabs__overlay-right{position:absolute;top:0;width:var(--zt-tabs-line-height);height:var(--zt-tabs-line-height);pointer-events:none}.zt-tabs__overlay-left{left:0;background:var(--zt-tabs-overlay-left-background)}.zt-tabs__overlay-right{right:0;background:var(--zt-tabs-overlay-right-background)}.zt-tabs__indicator-left{position:absolute;left:0;top:0;width:35px;height:44px;background:var(--zt-tabs-nav-background)}.zt-tabs__indicator-right{position:absolute;right:0;top:0;width:35px;height:44px;background:var(--zt-tabs-nav-background)}.zt-tabs__icon-indicator-left{position:absolute;top:12px;left:12px;color:var(--zt-gray-40)}.zt-tabs__icon-indicator-right{position:absolute;top:12px;right:12px;color:var(--zt-gray-40)}.zt-tabs__nav{position:relative;display:flex;justify-content:flex-start;background-color:var(--zt-tabs-nav-background);-webkit-user-select:none;-moz-user-select:none;user-select:none}.zt-tabs__nav--complete{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.zt-tabs__nav--complete::-webkit-scrollbar{display:none}.zt-tabs__nav--line{box-sizing:content-box;height:100%;padding-bottom:var(--zt-tabs-line-bottom)}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tab,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tab{flex:1 0 auto;padding:0 var(--zt-padding-sm)}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tabs__nav,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tabs__nav{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tabs__nav::-webkit-scrollbar,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tabs__nav::-webkit-scrollbar{display:none}.zt-tabs__nav--card.zt-tabs__nav--shrink{display:inline-flex}.zt-tabs__line{position:absolute;bottom:var(--zt-tabs-line-bottom);left:0;z-index:1;width:var(--zt-tabs-bottom-bar-width);height:var(--zt-tabs-bottom-bar-height);background:var(--zt-tabs-bottom-bar-color);border-radius:var(--zt-tabs-bottom-bar-radius)}.zt-tabs__track{position:relative;display:flex;width:100%;height:100%;will-change:left}.zt-tabs__content--animated{overflow:hidden}.zt-tabs--line .zt-tabs__wrap{height:var(--zt-tabs-line-height)}.zt-tabs--card>.zt-tabs__wrap{height:var(--zt-tabs-card-height);display:flex;justify-content:center}.zt-theme-dark{--zt-tabs-overlay-left-background: linear-gradient(90deg, #0f1923 0%, rgba(15, 25, 35, 0) 100%);--zt-tabs-overlay-right-background: linear-gradient(90deg, rgba(15, 25, 35, 0) 3%, #0f1923 100%)}
1
+ :root{--zt-tab-active-text-color: var(--zt-text-color);--zt-tab-disabled-text-color: var(--zt-text-color-3);--zt-tab-active-opacity: .2;--zt-tabs-default-color: var(--zt-primary-color);--zt-tabs-line-height: 44px;--zt-tabs-line-bottom: 16px;--zt-tabs-card-height: 32px;--zt-tabs-bottom-bar-width: 12px;--zt-tabs-bottom-bar-height: 2px;--zt-tabs-bottom-bar-color: var(--zt-primary-color);--zt-tabs-bottom-bar-radius: 2px;--zt-tabs-nav-background: var(--zt-background);--zt-tab-text-color: var(--zt-gray-40);--zt-tabs-overlay-left-background: linear-gradient(90deg, #ffffff 0%, rgba(245, 250, 255, 0) 100%);--zt-tabs-overlay-right-background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #ffffff 100%)}.zt-tab{position:relative;display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:0 var(--zt-padding-md);color:var(--zt-tab-text-color);font-size:var(--zt-font-size-lg);line-height:var(--zt-line-height-md);cursor:pointer}.zt-tab--active{color:var(--zt-tab-active-text-color);font-weight:var(--zt-font-bold)}.zt-tab--active:active{opacity:var(--zt-tab-active-opacity)}.zt-tab--disabled{color:var(--zt-tab-disabled-text-color);cursor:not-allowed;font-size:var(--zt-font-size-md)}.zt-tab--grow{flex:1 0 auto;padding:0 var(--zt-padding-sm)}.zt-tab--shrink{flex:none;padding:0 var(--zt-padding-xs)}.zt-tab--card{color:var(--zt-tabs-default-color)}.zt-tab--card.zt-tab--active{color:var(--zt-white);background-color:var(--zt-tabs-default-color)}.zt-tab--card--disabled{color:var(--zt-tab-disabled-text-color)}.zt-tab__title{flex:1;display:flex;align-items:center;justify-content:center}.zt-tab__text--ellipsis{display:-webkit-box;overflow:hidden;-webkit-line-clamp:1;-webkit-box-orient:vertical}.zt-tab__text-wrapper,.zt-tabs{position:relative}.zt-tabs__wrap{overflow:hidden;position:relative}.zt-tabs__wrap--page-top{position:fixed}.zt-tabs__wrap--content-bottom{top:auto;bottom:0}.zt-tabs__overlay-left,.zt-tabs__overlay-right{position:absolute;top:0;width:var(--zt-tabs-line-height);height:var(--zt-tabs-line-height);pointer-events:none}.zt-tabs__overlay-left{left:0;background:var(--zt-tabs-overlay-left-background)}.zt-tabs__overlay-right{right:0;background:var(--zt-tabs-overlay-right-background)}.zt-tabs__indicator-left{position:absolute;left:0;top:0;width:35px;height:44px;background:var(--zt-tabs-nav-background)}.zt-tabs__indicator-right{position:absolute;right:0;top:0;width:35px;height:44px;background:var(--zt-tabs-nav-background)}.zt-tabs__icon-indicator-left{position:absolute;top:12px;left:12px;color:var(--zt-gray-40);font-size:var(--zt-font-size-lg)}.zt-tabs__icon-indicator-right{position:absolute;top:12px;right:12px;color:var(--zt-gray-40);font-size:var(--zt-font-size-lg)}.zt-tabs__nav{position:relative;display:flex;justify-content:flex-start;background-color:var(--zt-tabs-nav-background);-webkit-user-select:none;-moz-user-select:none;user-select:none}.zt-tabs__nav--complete{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.zt-tabs__nav--complete::-webkit-scrollbar{display:none}.zt-tabs__nav--line{box-sizing:content-box;height:100%;padding-bottom:var(--zt-tabs-line-bottom)}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tab,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tab{flex:1 0 auto;padding:0 var(--zt-padding-sm)}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tabs__nav,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tabs__nav{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.zt-tabs__nav--line.zt-tabs__nav--shrink .zt-tabs__nav::-webkit-scrollbar,.zt-tabs__nav--line.zt-tabs__nav--complete .zt-tabs__nav::-webkit-scrollbar{display:none}.zt-tabs__nav--card.zt-tabs__nav--shrink{display:inline-flex}.zt-tabs__line{position:absolute;bottom:var(--zt-tabs-line-bottom);left:0;z-index:1;width:var(--zt-tabs-bottom-bar-width);height:var(--zt-tabs-bottom-bar-height);background:var(--zt-tabs-bottom-bar-color);border-radius:var(--zt-tabs-bottom-bar-radius)}.zt-tabs__track{position:relative;display:flex;width:100%;height:100%;will-change:left}.zt-tabs__content--animated{overflow:hidden}.zt-tabs--line .zt-tabs__wrap{height:var(--zt-tabs-line-height)}.zt-tabs--card>.zt-tabs__wrap{height:var(--zt-tabs-card-height);display:flex;justify-content:center}.zt-theme-dark{--zt-tabs-overlay-left-background: linear-gradient(90deg, #0f1923 0%, rgba(15, 25, 35, 0) 100%);--zt-tabs-overlay-right-background: linear-gradient(90deg, rgba(15, 25, 35, 0) 3%, #0f1923 100%)}
package/lib/action-sheet/ActionSheet.d.ts CHANGED
@@ -3,7 +3,7 @@ export type ActionSheetAction = {
3
3
  name?: string;
4
4
  color?: string;
5
5
  subNameColor?: string;
6
- bgColor?: string;
6
+ background?: string;
7
7
  border?: string;
8
8
  subname?: string;
9
9
  loading?: boolean;
package/lib/action-sheet/ActionSheet.js CHANGED
@@ -60,7 +60,6 @@ var stdin_default = (0, import_vue.defineComponent)({
60
60
  "class": bem("header")
61
61
  }, [props.title, props.closeable && (0, import_vue.createVNode)(import_icon.Icon, {
62
62
  "name": props.closeIcon,
63
- "size": "16",
64
63
  "class": [bem("close"), import_utils.HAPTICS_FEEDBACK],
65
64
  "onClick": onCancel
66
65
  }, null)]);
@@ -96,7 +95,7 @@ var stdin_default = (0, import_vue.defineComponent)({
96
95
  };
97
96
  const renderAction = (action, index) => {
98
97
  const {
99
- bgColor,
98
+ background,
100
99
  border,
101
100
  loading,
102
101
  callback,
@@ -123,7 +122,7 @@ var stdin_default = (0, import_vue.defineComponent)({
123
122
  return (0, import_vue.createVNode)("button", {
124
123
  "type": "button",
125
124
  "style": {
126
- background: bgColor,
125
+ background,
127
126
  border
128
127
  },
129
128
  "class": [
package/lib/action-sheet/index.css CHANGED
@@ -1 +1 @@
1
- :root{--zt-action-sheet-max-height: 80%;--zt-action-sheet-header-height: 44px;--zt-action-sheet-description-color: var(--zt-gray-40);--zt-action-sheet-item-background: var(--zt-background-popup);--zt-action-sheet-item-border-color: var(--zt-border-color);--zt-action-sheet-item-border-radius: 24px;--zt-action-sheet-item-margin-left: 16px;--zt-action-sheet-item-margin: 8px var(--zt-action-sheet-item-margin-left);--zt-action-sheet-item-text-color: var(--zt-text-color);--zt-action-sheet-item-disabled-text-color: var(--zt-gray-20);--zt-action-sheet-subname-color: var(--zt-gray-40);--zt-action-sheet-close-icon-color: var(--zt-gray-40);--zt-action-sheet-close-icon-padding: 0 20px;--zt-action-sheet-cancel-text-color: var(--zt-text-color);--zt-action-sheet-loading-icon-size: 16px;--zt-action-sheet-description-background: var(--zt-background-popup)}:root[zt-theme-size=large]{--zt-action-sheet-header-height: 56px}.zt-action-sheet{display:flex;flex-direction:column;max-height:var(--zt-action-sheet-max-height);overflow:hidden;color:var(--zt-action-sheet-item-text-color)}.zt-action-sheet__content{flex:1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.zt-action-sheet__item,.zt-action-sheet__cancel{display:block;width:calc(100% - var(--zt-action-sheet-item-margin-left) * 2);padding:10px var(--zt-padding-md);font-size:var(--zt-font-size-lg);line-height:var(--zt-line-height-lg);background:var(--zt-action-sheet-item-background);border:1px solid var(--zt-action-sheet-item-border-color);border-radius:var(--zt-action-sheet-item-border-radius);margin:var(--zt-action-sheet-item-margin);cursor:pointer}.zt-action-sheet__item:active{background-color:var(--zt-gray-10)}.zt-action-sheet__item--loading,.zt-action-sheet__item--disabled{color:var(--zt-action-sheet-item-disabled-text-color)}.zt-action-sheet__item--loading:active,.zt-action-sheet__item--disabled:active{background-color:var(--zt-action-sheet-item-background)}.zt-action-sheet__item--disabled{cursor:not-allowed}.zt-action-sheet__item--loading{cursor:default}.zt-action-sheet__item--with-sub{padding-top:8px;padding-bottom:8px}.zt-action-sheet__cancel{padding:8px 16px;flex-shrink:0;box-sizing:border-box;color:var(--zt-action-sheet-cancel-text-color)}.zt-action-sheet__cancel-btn{width:100%;border:none;cursor:pointer;background-color:var(--zt-gray-10);border-radius:20px;height:var(--zt-button-default-height);font-size:var(--zt-font-size-lg);color:var(--zt-text-color);line-height:var(--zt-line-height-lg)}.zt-action-sheet__cancel-btn:active{opacity:var(--zt-active-opacity)}.zt-action-sheet__subname{margin-top:var(--zt-padding-xxs);color:var(--zt-action-sheet-subname-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-sm)}.zt-action-sheet__header{position:relative;flex-shrink:0;font-weight:var(--zt-font-bold);font-size:var(--zt-font-size-xl);line-height:var(--zt-action-sheet-header-height);text-align:center}.zt-action-sheet__header:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-action-sheet__description{background:var(--zt-action-sheet-description-background);position:relative;flex-shrink:0;padding:12px var(--zt-padding-md);color:var(--zt-action-sheet-description-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);text-align:center}.zt-action-sheet__description:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-action-sheet__description--custom{padding:0}.zt-action-sheet__loading-icon .zt-loading__spinner{width:var(--zt-action-sheet-loading-icon-size);height:var(--zt-action-sheet-loading-icon-size)}.zt-action-sheet__close{position:absolute;top:0;left:0;padding:var(--zt-action-sheet-close-icon-padding);color:var(--zt-action-sheet-close-icon-color);font-size:var(--zt-font-size-xxxl);line-height:inherit}
1
+ :root{--zt-action-sheet-max-height: 80%;--zt-action-sheet-header-height: 44px;--zt-action-sheet-description-color: var(--zt-gray-40);--zt-action-sheet-item-background: var(--zt-background-popup);--zt-action-sheet-item-border-color: var(--zt-border-color);--zt-action-sheet-item-border-radius: 24px;--zt-action-sheet-item-margin-left: 16px;--zt-action-sheet-item-margin: 8px var(--zt-action-sheet-item-margin-left);--zt-action-sheet-item-text-color: var(--zt-text-color);--zt-action-sheet-item-disabled-text-color: var(--zt-gray-20);--zt-action-sheet-subname-color: var(--zt-gray-40);--zt-action-sheet-close-icon-color: var(--zt-gray-40);--zt-action-sheet-close-icon-padding: 0 20px;--zt-action-sheet-cancel-text-color: var(--zt-text-color);--zt-action-sheet-loading-icon-size: 16px;--zt-action-sheet-description-background: var(--zt-background-popup)}:root[zt-theme-size=large]{--zt-action-sheet-header-height: 56px}.zt-action-sheet{display:flex;flex-direction:column;max-height:var(--zt-action-sheet-max-height);overflow:hidden;color:var(--zt-action-sheet-item-text-color)}.zt-action-sheet__content{flex:1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.zt-action-sheet__item,.zt-action-sheet__cancel{display:block;width:calc(100% - var(--zt-action-sheet-item-margin-left) * 2);padding:10px var(--zt-padding-md);font-size:var(--zt-font-size-lg);line-height:var(--zt-line-height-lg);background:var(--zt-action-sheet-item-background);border:1px solid var(--zt-action-sheet-item-border-color);border-radius:var(--zt-action-sheet-item-border-radius);margin:var(--zt-action-sheet-item-margin);cursor:pointer}.zt-action-sheet__item:active{background-color:var(--zt-darkblue-10);border-color:var(--zt-darkblue-60);color:var(--zt-primary-color)}.zt-action-sheet__item:active .zt-action-sheet__subname{color:var(--zt-darkblue-40)}.zt-action-sheet__item--loading,.zt-action-sheet__item--disabled{color:var(--zt-action-sheet-item-disabled-text-color)}.zt-action-sheet__item--loading:active,.zt-action-sheet__item--disabled:active{background-color:var(--zt-action-sheet-item-background)}.zt-action-sheet__item--disabled{cursor:not-allowed}.zt-action-sheet__item--loading{cursor:default}.zt-action-sheet__item--with-sub{padding-top:8px;padding-bottom:8px}.zt-action-sheet__cancel{padding:8px 16px;flex-shrink:0;box-sizing:border-box;color:var(--zt-action-sheet-cancel-text-color)}.zt-action-sheet__cancel-btn{width:100%;border:none;cursor:pointer;background-color:var(--zt-gray-10);border-radius:20px;height:var(--zt-button-default-height);font-size:var(--zt-font-size-lg);color:var(--zt-text-color);line-height:var(--zt-line-height-lg)}.zt-action-sheet__cancel-btn:active{opacity:var(--zt-active-opacity)}.zt-action-sheet__subname{margin-top:var(--zt-padding-xxs);color:var(--zt-action-sheet-subname-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-sm)}.zt-action-sheet__header{position:relative;flex-shrink:0;font-weight:var(--zt-font-bold);font-size:var(--zt-font-size-xl);line-height:var(--zt-action-sheet-header-height);text-align:center}.zt-action-sheet__header:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-action-sheet__description{background:var(--zt-action-sheet-description-background);position:relative;flex-shrink:0;padding:12px var(--zt-padding-md);color:var(--zt-action-sheet-description-color);font-size:var(--zt-font-size-md);line-height:var(--zt-line-height-md);text-align:center}.zt-action-sheet__description:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:0;border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-action-sheet__description--custom{padding:0}.zt-action-sheet__loading-icon .zt-loading__spinner{width:var(--zt-action-sheet-loading-icon-size);height:var(--zt-action-sheet-loading-icon-size)}.zt-action-sheet__close{position:absolute;top:0;left:0;padding:var(--zt-action-sheet-close-icon-padding);color:var(--zt-action-sheet-close-icon-color);font-size:var(--zt-font-size-lg);line-height:inherit}
package/lib/dialog/Dialog.d.ts CHANGED
@@ -46,11 +46,11 @@ export declare const dialogProps: {
46
46
  showCancelButton: BooleanConstructor;
47
47
  cancelButtonText: StringConstructor;
48
48
  cancelButtonColor: StringConstructor;
49
- cancelButtonBgColor: StringConstructor;
49
+ cancelButtonBackground: StringConstructor;
50
50
  cancelButtonDisabled: BooleanConstructor;
51
51
  confirmButtonText: StringConstructor;
52
52
  confirmButtonColor: StringConstructor;
53
- confirmButtonBgColor: StringConstructor;
53
+ confirmButtonBackground: StringConstructor;
54
54
  confirmButtonDisabled: BooleanConstructor;
55
55
  showConfirmButton: {
56
56
  type: BooleanConstructor;
@@ -105,11 +105,11 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
105
105
  showCancelButton: BooleanConstructor;
106
106
  cancelButtonText: StringConstructor;
107
107
  cancelButtonColor: StringConstructor;
108
- cancelButtonBgColor: StringConstructor;
108
+ cancelButtonBackground: StringConstructor;
109
109
  cancelButtonDisabled: BooleanConstructor;
110
110
  confirmButtonText: StringConstructor;
111
111
  confirmButtonColor: StringConstructor;
112
- confirmButtonBgColor: StringConstructor;
112
+ confirmButtonBackground: StringConstructor;
113
113
  confirmButtonDisabled: BooleanConstructor;
114
114
  showConfirmButton: {
115
115
  type: BooleanConstructor;
@@ -162,11 +162,11 @@ declare const _default: import("vue").DefineComponent<ExtractPropTypes<{
162
162
  showCancelButton: BooleanConstructor;
163
163
  cancelButtonText: StringConstructor;
164
164
  cancelButtonColor: StringConstructor;
165
- cancelButtonBgColor: StringConstructor;
165
+ cancelButtonBackground: StringConstructor;
166
166
  cancelButtonDisabled: BooleanConstructor;
167
167
  confirmButtonText: StringConstructor;
168
168
  confirmButtonColor: StringConstructor;
169
- confirmButtonBgColor: StringConstructor;
169
+ confirmButtonBackground: StringConstructor;
170
170
  confirmButtonDisabled: BooleanConstructor;
171
171
  showConfirmButton: {
172
172
  type: BooleanConstructor;
package/lib/dialog/Dialog.js CHANGED
@@ -42,11 +42,11 @@ const dialogProps = (0, import_utils.extend)({}, import_shared.popupSharedProps,
42
42
  showCancelButton: Boolean,
43
43
  cancelButtonText: String,
44
44
  cancelButtonColor: String,
45
- cancelButtonBgColor: String,
45
+ cancelButtonBackground: String,
46
46
  cancelButtonDisabled: Boolean,
47
47
  confirmButtonText: String,
48
48
  confirmButtonColor: String,
49
- confirmButtonBgColor: String,
49
+ confirmButtonBackground: String,
50
50
  confirmButtonDisabled: Boolean,
51
51
  showConfirmButton: import_utils.truthProp,
52
52
  closeOnClickOverlay: Boolean
@@ -182,7 +182,7 @@ var stdin_default = (0, import_vue.defineComponent)({
182
182
  "class": bem("cancel"),
183
183
  "style": {
184
184
  color: props.cancelButtonColor,
185
- background: props.cancelButtonBgColor
185
+ background: props.cancelButtonBackground
186
186
  },
187
187
  "loading": loading.cancel,
188
188
  "disabled": props.cancelButtonDisabled,
@@ -195,7 +195,7 @@ var stdin_default = (0, import_vue.defineComponent)({
195
195
  }),
196
196
  "style": {
197
197
  color: props.confirmButtonColor,
198
- background: props.confirmButtonBgColor
198
+ background: props.confirmButtonBackground
199
199
  },
200
200
  "loading": loading.confirm,
201
201
  "disabled": props.confirmButtonDisabled,
package/lib/dialog/index.d.ts CHANGED
@@ -44,11 +44,11 @@ export declare const Dialog: import("../utils").WithInstall<import("vue").Define
44
44
  showCancelButton: BooleanConstructor;
45
45
  cancelButtonText: StringConstructor;
46
46
  cancelButtonColor: StringConstructor;
47
- cancelButtonBgColor: StringConstructor;
47
+ cancelButtonBackground: StringConstructor;
48
48
  cancelButtonDisabled: BooleanConstructor;
49
49
  confirmButtonText: StringConstructor;
50
50
  confirmButtonColor: StringConstructor;
51
- confirmButtonBgColor: StringConstructor;
51
+ confirmButtonBackground: StringConstructor;
52
52
  confirmButtonDisabled: BooleanConstructor;
53
53
  showConfirmButton: {
54
54
  type: BooleanConstructor;
@@ -101,11 +101,11 @@ export declare const Dialog: import("../utils").WithInstall<import("vue").Define
101
101
  showCancelButton: BooleanConstructor;
102
102
  cancelButtonText: StringConstructor;
103
103
  cancelButtonColor: StringConstructor;
104
- cancelButtonBgColor: StringConstructor;
104
+ cancelButtonBackground: StringConstructor;
105
105
  cancelButtonDisabled: BooleanConstructor;
106
106
  confirmButtonText: StringConstructor;
107
107
  confirmButtonColor: StringConstructor;
108
- confirmButtonBgColor: StringConstructor;
108
+ confirmButtonBackground: StringConstructor;
109
109
  confirmButtonDisabled: BooleanConstructor;
110
110
  showConfirmButton: {
111
111
  type: BooleanConstructor;