zartui 3.0.2 → 3.0.4

package/lib/tabs/Tabs.js

@@ -89,7 +89,9 @@ var stdin_default = (0, import_vue2.defineComponent)({
       inited: false,
       position: "",
       lineStyle: {},
-      currentIndex: -1
+      currentIndex: -1,
+      showLeftOverlay: false,
+      showRightOverlay: false
     });
     const scrollable = (0, import_vue2.computed)(() => children.length > props.swipeThreshold || !props.ellipsis || props.shrink);
     const navStyle = (0, import_vue2.computed)(() => ({
@@ -244,6 +246,15 @@ var stdin_default = (0, import_vue2.defineComponent)({
         setCurrentIndex(index);
       }
     };
+    const hasScrollToEnd = (element) => Math.floor(element.scrollWidth - element.clientWidth - element.scrollLeft) > 0;
+    const onScrollHeader = (event) => {
+      const target = event.target;
+      if (!target) {
+        return;
+      }
+      state.showLeftOverlay = Math.floor(target.scrollLeft) > 0;
+      state.showRightOverlay = hasScrollToEnd(target);
+    };
     const renderNav = () => children.map((item, index) => (0, import_vue.createVNode)(import_TabsTitle.default, (0, import_vue.mergeProps)({
       "key": item.id,
       "id": `${id}-${index}`,
@@ -270,6 +281,20 @@ var stdin_default = (0, import_vue2.defineComponent)({
         }, null);
       }
     };
+    const renderOverlayLeft = () => {
+      if (state.showLeftOverlay) {
+        return (0, import_vue.createVNode)("div", {
+          "class": bem("overlay-left")
+        }, null);
+      }
+    };
+    const renderOverlayRight = () => {
+      if (state.showRightOverlay) {
+        return (0, import_vue.createVNode)("div", {
+          "class": bem("overlay-right")
+        }, null);
+      }
+    };
     const renderHeader = () => {
       var _a, _b;
       const {
@@ -289,8 +314,9 @@ var stdin_default = (0, import_vue2.defineComponent)({
           complete: scrollable.value
         }]),
         "style": navStyle.value,
-        "aria-orientation": "horizontal"
-      }, [(_a = slots["nav-left"]) == null ? void 0 : _a.call(slots), renderNav(), renderLine(), (_b = slots["nav-right"]) == null ? void 0 : _b.call(slots)])]);
+        "aria-orientation": "horizontal",
+        "onScroll": onScrollHeader
+      }, [(_a = slots["nav-left"]) == null ? void 0 : _a.call(slots), renderNav(), renderLine(), (_b = slots["nav-right"]) == null ? void 0 : _b.call(slots)]), scrollable.value ? renderOverlayLeft() : null, scrollable.value ? renderOverlayRight() : null]);
     };
     (0, import_vue2.watch)([() => props.color, import_utils.windowWidth], setLine);
     (0, import_vue2.watch)(() => props.active, (value) => {
@@ -322,6 +348,10 @@ var stdin_default = (0, import_vue2.defineComponent)({
           tabHeight = (0, import_use.useRect)(wrapRef.value).height;
         }
         scrollIntoView(true);
+        if (navRef.value && scrollable.value) {
+          state.showLeftOverlay = Math.floor(navRef.value.scrollLeft) > 0;
+          state.showRightOverlay = hasScrollToEnd(navRef.value);
+        }
       });
     };
     const onRendered = (name2, title) => emit("rendered", name2, title);
@@ -333,7 +363,8 @@ var stdin_default = (0, import_vue2.defineComponent)({
     (0, import_on_popup_reopen.onPopupReopen)(setLine);
     (0, import_use.onMountedOrActivated)(init);
     (0, import_use.useEventListener)("scroll", onScroll, {
-      target: scroller
+      target: scroller,
+      passive: true
     });
     linkChildren({
       id,

package/lib/tabs/TabsTitle.d.ts

@@ -16,7 +16,11 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: true;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    maxWidth: {
+        type: StringConstructor;
+        default: string;
+    };
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     id: StringConstructor;
     dot: BooleanConstructor;
     type: StringConstructor;
@@ -34,12 +38,17 @@ declare const _default: import("vue").DefineComponent<{
         type: BooleanConstructor;
         default: true;
     };
+    maxWidth: {
+        type: StringConstructor;
+        default: string;
+    };
 }>>, {
     dot: boolean;
     disabled: boolean;
-    scrollable: boolean;
     shrink: boolean;
     isActive: boolean;
+    scrollable: boolean;
     showZeroBadge: boolean;
+    maxWidth: string;
 }>;
 export default _default;

package/lib/tabs/TabsTitle.js

@@ -41,7 +41,11 @@ var stdin_default = (0, import_vue2.defineComponent)({
     scrollable: Boolean,
     activeColor: String,
     inactiveColor: String,
-    showZeroBadge: import_utils.truthProp
+    showZeroBadge: import_utils.truthProp,
+    maxWidth: {
+      type: String,
+      default: "144px"
+    }
   },
   setup(props, {
     slots
@@ -54,7 +58,8 @@ var stdin_default = (0, import_vue2.defineComponent)({
         disabled,
         isActive,
         activeColor,
-        inactiveColor
+        inactiveColor,
+        maxWidth
       } = props;
       const isCard = type === "card";
       if (color && isCard) {
@@ -71,6 +76,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
       if (titleColor) {
         style2.color = titleColor;
       }
+      style2.maxWidth = maxWidth;
       return style2;
     });
     const renderText = () => {

package/lib/tabs/index.css

@@ -1 +1 @@
-body{--zt-tab-text-color: var(--zt-gray-7);--zt-tab-active-text-color: var(--zt-text-color);--zt-tab-disabled-text-color: var(--zt-text-color-3);--zt-tab-font-size: var(--zt-font-size-md);--zt-tab-active-font-size: var(--zt-font-size-lg);--zt-tab-disabled-font-size: var(--zt-font-size-md);--zt-tab-line-height: var(--zt-line-height-md);--zt-tabs-default-color: var(--zt-primary-color);--zt-tabs-line-height: 44px;--zt-tabs-card-height: 30px;--zt-tabs-nav-background: var(--zt-background);--zt-tabs-bottom-bar-width: 12px;--zt-tabs-bottom-bar-height: 4px;--zt-tabs-bottom-bar-color: var(--zt-primary-color);--zt-tabs-bottom-bar-radius: 2px}.zt-tab{position:relative;display:flex;flex:1;align-items:center;justify-content:center;box-sizing:border-box;padding:0 var(--zt-padding-base);color:var(--zt-tab-text-color);font-size:var(--zt-tab-font-size);line-height:var(--zt-tab-line-height);cursor:pointer}.zt-tab--active{color:var(--zt-tab-active-text-color);font-weight:var(--zt-font-bold);font-size:var(--zt-tab-active-font-size)}.zt-tab--disabled{color:var(--zt-tab-disabled-text-color);cursor:not-allowed;font-size:var(--zt-tab-disabled-font-size)}.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);border-right:var(--zt-border-width) solid var(--zt-tabs-default-color)}.zt-tab--card:last-child{border-right:none}.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__text--ellipsis{display:-webkit-box;overflow:hidden;-webkit-line-clamp:1;-webkit-box-orient:vertical}.zt-tabs{position:relative}.zt-tabs__wrap{overflow:hidden}.zt-tabs__wrap--page-top{position:fixed}.zt-tabs__wrap--content-bottom{top:auto;bottom:0}.zt-tabs__nav{position:relative;display:flex;background:var(--zt-tabs-nav-background);-webkit-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:15px}.zt-tabs__nav--line.zt-tabs__nav--shrink,.zt-tabs__nav--line.zt-tabs__nav--complete{padding-right:var(--zt-padding-xs);padding-left:var(--zt-padding-xs)}.zt-tabs__nav--card{box-sizing:border-box;height:var(--zt-tabs-card-height);margin:0 var(--zt-padding-md);border:var(--zt-border-width) solid var(--zt-tabs-default-color);border-radius:var(--zt-border-radius-sm)}.zt-tabs__nav--card.zt-tabs__nav--shrink{display:inline-flex}.zt-tabs__line{position:absolute;bottom:15px;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)}
+:root{--zt-tab-active-text-color: var(--zt-text-color);--zt-tab-disabled-text-color: var(--zt-text-color-3);--zt-tab-font-size: var(--zt-font-size-md);--zt-tab-active-font-size: var(--zt-font-size-lg);--zt-tab-active-opacity: .2;--zt-tab-disabled-font-size: var(--zt-font-size-md);--zt-tab-line-height: var(--zt-line-height-md);--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: 4px;--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-a6);--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-tab-font-size);line-height:var(--zt-tab-line-height);cursor:pointer}.zt-tab--active{color:var(--zt-tab-active-text-color);font-size:var(--zt-tab-active-font-size);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-tab-disabled-font-size)}.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__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__nav{position:relative;display:flex;justify-content:flex-start;background-color:var(--zt-tabs-nav-background);-webkit-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)}.zt-theme-dark{--zt-tabs-nav-background: var(--zt-background-2);--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/tabs/index.d.ts

@@ -41,7 +41,7 @@ export declare const Tabs: import("../utils").WithInstall<import("vue").DefineCo
     };
     titleActiveColor: StringConstructor;
     titleInactiveColor: StringConstructor;
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("scroll" | "change" | "rendered" | "clickTab" | "update:active")[], "scroll" | "change" | "rendered" | "clickTab" | "update:active", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "scroll" | "rendered" | "clickTab" | "update:active")[], "change" | "scroll" | "rendered" | "clickTab" | "update:active", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     type: {
         type: import("vue").PropType<import("./types").TabsType>;
         default: import("./types").TabsType;
@@ -91,12 +91,12 @@ export declare const Tabs: import("../utils").WithInstall<import("vue").DefineCo
     "onUpdate:active"?: ((...args: any[]) => any) | undefined;
 }, {
     type: import("./types").TabsType;
-    ellipsis: boolean;
-    sticky: boolean;
     border: boolean;
-    active: string | number;
     duration: string | number;
     lazyRender: boolean;
+    ellipsis: boolean;
+    sticky: boolean;
+    active: string | number;
     offsetTop: string | number;
     shrink: boolean;
     animated: boolean;

package/lib/tag/Tag.d.ts

@@ -0,0 +1,102 @@
+import type { ExtractPropTypes } from 'vue';
+export declare type TagType = 'default' | 'primary' | 'success' | 'warning' | 'danger';
+export declare const tagProps: {
+    mark: BooleanConstructor;
+    show: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    type: {
+        type: import("vue").PropType<TagType>;
+        default: TagType;
+    };
+    color: StringConstructor;
+    plain: BooleanConstructor;
+    round: BooleanConstructor;
+    textColor: StringConstructor;
+    borderColor: StringConstructor;
+    closeable: BooleanConstructor;
+    icon: StringConstructor;
+    iconPrefix: StringConstructor;
+    iconColor: StringConstructor;
+    badge: BooleanConstructor;
+    badgeWidth: {
+        type: NumberConstructor;
+        default: number;
+    };
+    badgeHeight: {
+        type: NumberConstructor;
+        default: number;
+    };
+};
+export declare type TagProps = ExtractPropTypes<typeof tagProps>;
+declare const _default: import("vue").DefineComponent<{
+    mark: BooleanConstructor;
+    show: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    type: {
+        type: import("vue").PropType<TagType>;
+        default: TagType;
+    };
+    color: StringConstructor;
+    plain: BooleanConstructor;
+    round: BooleanConstructor;
+    textColor: StringConstructor;
+    borderColor: StringConstructor;
+    closeable: BooleanConstructor;
+    icon: StringConstructor;
+    iconPrefix: StringConstructor;
+    iconColor: StringConstructor;
+    badge: BooleanConstructor;
+    badgeWidth: {
+        type: NumberConstructor;
+        default: number;
+    };
+    badgeHeight: {
+        type: NumberConstructor;
+        default: number;
+    };
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "close"[], "close", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    mark: BooleanConstructor;
+    show: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    type: {
+        type: import("vue").PropType<TagType>;
+        default: TagType;
+    };
+    color: StringConstructor;
+    plain: BooleanConstructor;
+    round: BooleanConstructor;
+    textColor: StringConstructor;
+    borderColor: StringConstructor;
+    closeable: BooleanConstructor;
+    icon: StringConstructor;
+    iconPrefix: StringConstructor;
+    iconColor: StringConstructor;
+    badge: BooleanConstructor;
+    badgeWidth: {
+        type: NumberConstructor;
+        default: number;
+    };
+    badgeHeight: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & {
+    onClose?: ((...args: any[]) => any) | undefined;
+}, {
+    type: TagType;
+    badge: boolean;
+    mark: boolean;
+    show: boolean;
+    round: boolean;
+    closeable: boolean;
+    plain: boolean;
+    badgeWidth: number;
+    badgeHeight: number;
+}>;
+export default _default;

package/lib/tag/Tag.js

@@ -0,0 +1,120 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name2 in all)
+    __defProp(target, name2, { get: all[name2], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var stdin_exports = {};
+__export(stdin_exports, {
+  default: () => stdin_default,
+  tagProps: () => tagProps
+});
+module.exports = __toCommonJS(stdin_exports);
+var import_vue = require("vue");
+var import_vue2 = require("vue");
+var import_utils = require("../utils");
+var import_icon = require("../icon");
+var import_parse = require("../utils/parse");
+const [name, bem] = (0, import_utils.createNamespace)("tag");
+const tagProps = {
+  mark: Boolean,
+  show: import_utils.truthProp,
+  type: (0, import_utils.makeStringProp)("default"),
+  color: String,
+  plain: Boolean,
+  round: Boolean,
+  textColor: String,
+  borderColor: String,
+  closeable: Boolean,
+  icon: String,
+  iconPrefix: String,
+  iconColor: String,
+  badge: Boolean,
+  badgeWidth: (0, import_utils.makeNumberProp)(50),
+  badgeHeight: (0, import_utils.makeNumberProp)(50)
+};
+var stdin_default = (0, import_vue2.defineComponent)({
+  name,
+  props: tagProps,
+  emits: ["close"],
+  setup(props, {
+    slots,
+    emit
+  }) {
+    const onClose = (event) => {
+      event.stopPropagation();
+      emit("close", event);
+    };
+    const getStyle = () => {
+      const style = {
+        color: props.textColor,
+        background: props.color,
+        borderColor: props.borderColor
+      };
+      if (props.badge) {
+        const radian = Math.atan(props.badgeHeight / props.badgeWidth);
+        const angle = radian * 180 / Math.PI;
+        style.transform = `rotate(${angle}deg)`;
+        style.transformOrigin = "left bottom";
+        const width = Math.sqrt(props.badgeWidth * props.badgeWidth + props.badgeHeight * props.badgeHeight);
+        const originHeight = (0, import_parse.parseNumber)(getComputedStyle(document.body).getPropertyValue("--zt-tag-line-height"), 20);
+        style.top = -originHeight + "px";
+        style.right = props.badgeWidth - width + "px";
+        style.width = width + "px";
+        style.height = originHeight + "px";
+      }
+      return style;
+    };
+    const renderTag = () => {
+      var _a;
+      const {
+        type,
+        mark,
+        plain,
+        round,
+        badge,
+        closeable
+      } = props;
+      const classes = {
+        mark,
+        plain,
+        round,
+        badge,
+        closeable
+      };
+      const CloseIcon = closeable && (0, import_vue.createVNode)(import_icon.Icon, {
+        "name": "clear",
+        "class": [bem("close"), import_utils.HAPTICS_FEEDBACK],
+        "onClick": onClose
+      }, null);
+      const LeftIcon = props.icon && (0, import_vue.createVNode)(import_icon.Icon, {
+        "name": props.icon,
+        "class": bem("icon"),
+        "classPrefix": props.iconPrefix,
+        "style": {
+          color: props.iconColor
+        }
+      }, null);
+      return (0, import_vue.createVNode)("span", {
+        "style": getStyle(),
+        "class": bem([classes, type])
+      }, [LeftIcon, (_a = slots.default) == null ? void 0 : _a.call(slots), CloseIcon]);
+    };
+    return () => (0, import_vue.createVNode)(import_vue2.Transition, {
+      "name": props.closeable ? "zt-fade" : void 0
+    }, {
+      default: () => [props.show ? renderTag() : null]
+    });
+  }
+});

package/lib/tag/index.css

@@ -0,0 +1 @@
+:root{--zt-tag-padding: 0 var(--zt-padding-sm);--zt-tag-text-color: var(--zt-white);--zt-tag-font-size: var(--zt-font-size-sm);--zt-tag-radius: 2px;--zt-tag-line-height: 20px;--zt-tag-icon-gap: 2px;--zt-tag-icon-size: 16px;--zt-tag-close-icon-size: 20px;--zt-tag-round-radius: 12px;--zt-tag-round-line-height: 24px;--zt-tag-closeable-font-size: var(--zt-font-size-md);--zt-tag-closeable-line-height: 28px;--zt-tag-closeable-radius: 14px;--zt-tag-danger-color: var(--zt-danger-color);--zt-tag-primary-color: var(--zt-primary-color);--zt-tag-success-color: var(--zt-success-color);--zt-tag-warning-color: var(--zt-warning-color);--zt-tag-default-color: var(--zt-gray-a08);--zt-tag-plain-background: var(--zt-background-2)}.zt-tag{position:relative;display:inline-flex;align-items:center;padding:var(--zt-tag-padding);color:var(--zt-tag-text-color);font-size:var(--zt-tag-font-size);line-height:var(--zt-tag-line-height);border-radius:var(--zt-tag-radius);overflow:hidden}.zt-tag__icon{font-size:var(--zt-tag-icon-size);margin-right:var(--zt-tag-icon-gap)}.zt-tag--default{background:var(--zt-tag-default-color)}.zt-tag--default.zt-tag--plain{color:var(--zt-tag-default-color)}.zt-tag--danger{background:var(--zt-tag-danger-color)}.zt-tag--danger.zt-tag--plain{color:var(--zt-tag-danger-color)}.zt-tag--primary{background:var(--zt-tag-primary-color)}.zt-tag--primary.zt-tag--plain{color:var(--zt-tag-primary-color)}.zt-tag--success{background:var(--zt-tag-success-color)}.zt-tag--success.zt-tag--plain{color:var(--zt-tag-success-color)}.zt-tag--warning{background:var(--zt-tag-warning-color)}.zt-tag--warning.zt-tag--plain{color:var(--zt-tag-warning-color)}.zt-tag--plain{background:var(--zt-tag-plain-background);border-color:currentColor}.zt-tag--plain:before{position:absolute;top:0;right:0;bottom:0;left:0;border:1px solid;border-color:inherit;border-radius:inherit;content:"";pointer-events:none}.zt-tag--mark{border-radius:0 var(--zt-tag-round-radius) var(--zt-tag-round-radius) 0}.zt-tag--mark:after{display:block;width:2px;content:""}.zt-tag--round{border-radius:var(--zt-tag-round-radius);line-height:var(--zt-tag-round-line-height)}.zt-tag__close{font-size:var(--zt-tag-close-icon-size);margin-left:2px}.zt-tag--closeable{font-size:var(--zt-tag-closeable-font-size);line-height:var(--zt-tag-closeable-line-height);background:var(--zt-text-color-a6);border-radius:var(--zt-tag-closeable-radius)}.zt-tag--badge{position:absolute;text-align:center;display:block;box-sizing:border-box}

package/lib/tag/index.d.ts

@@ -0,0 +1,77 @@
+export declare const Tag: import("../utils").WithInstall<import("vue").DefineComponent<{
+    mark: BooleanConstructor;
+    show: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    type: {
+        type: import("vue").PropType<import("./Tag").TagType>;
+        default: import("./Tag").TagType;
+    };
+    color: StringConstructor;
+    plain: BooleanConstructor;
+    round: BooleanConstructor;
+    textColor: StringConstructor;
+    borderColor: StringConstructor;
+    closeable: BooleanConstructor;
+    icon: StringConstructor;
+    iconPrefix: StringConstructor;
+    iconColor: StringConstructor;
+    badge: BooleanConstructor;
+    badgeWidth: {
+        type: NumberConstructor;
+        default: number;
+    };
+    badgeHeight: {
+        type: NumberConstructor;
+        default: number;
+    };
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "close"[], "close", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    mark: BooleanConstructor;
+    show: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    type: {
+        type: import("vue").PropType<import("./Tag").TagType>;
+        default: import("./Tag").TagType;
+    };
+    color: StringConstructor;
+    plain: BooleanConstructor;
+    round: BooleanConstructor;
+    textColor: StringConstructor;
+    borderColor: StringConstructor;
+    closeable: BooleanConstructor;
+    icon: StringConstructor;
+    iconPrefix: StringConstructor;
+    iconColor: StringConstructor;
+    badge: BooleanConstructor;
+    badgeWidth: {
+        type: NumberConstructor;
+        default: number;
+    };
+    badgeHeight: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & {
+    onClose?: ((...args: any[]) => any) | undefined;
+}, {
+    type: import("./Tag").TagType;
+    badge: boolean;
+    mark: boolean;
+    show: boolean;
+    round: boolean;
+    closeable: boolean;
+    plain: boolean;
+    badgeWidth: number;
+    badgeHeight: number;
+}>>;
+export default Tag;
+export { tagProps } from './Tag';
+export type { TagType, TagProps } from './Tag';
+declare module 'vue' {
+    interface GlobalComponents {
+        ZtTag: typeof Tag;
+    }
+}

package/lib/tag/index.js

@@ -0,0 +1,35 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var stdin_exports = {};
+__export(stdin_exports, {
+  Tag: () => Tag,
+  default: () => stdin_default,
+  tagProps: () => import_Tag2.tagProps
+});
+module.exports = __toCommonJS(stdin_exports);
+var import_utils = require("../utils");
+var import_Tag = __toESM(require("./Tag"));
+var import_Tag2 = require("./Tag");
+const Tag = (0, import_utils.withInstall)(import_Tag.default);
+var stdin_default = Tag;

package/lib/tag/style/index.d.ts

@@ -0,0 +1 @@
+export {};

package/lib/tag/style/index.js

@@ -0,0 +1,4 @@
+require("../../style/base.css");
+require("../../badge/index.css");
+require("../../icon/index.css");
+require("../index.css");

package/lib/time-picker/Arrow.d.ts

@@ -0,0 +1,4 @@
+declare const _default: import("vue").DefineComponent<{}, () => JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "click"[], "click", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>> & {
+    onClick?: ((...args: any[]) => any) | undefined;
+}, {}>;
+export default _default;

package/lib/time-picker/Arrow.js

@@ -0,0 +1,46 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var stdin_exports = {};
+__export(stdin_exports, {
+  default: () => stdin_default
+});
+module.exports = __toCommonJS(stdin_exports);
+var import_vue = require("vue");
+var import_vue2 = require("vue");
+var stdin_default = (0, import_vue2.defineComponent)({
+  name: "Arrow",
+  emits: ["click"],
+  setup(_, {
+    emit
+  }) {
+    const onClick = () => {
+      emit("click");
+    };
+    return () => (0, import_vue.createVNode)("svg", {
+      "xmlns": "http://www.w3.org/2000/svg",
+      "viewBox": "0 0 12 6",
+      "onClick": onClick
+    }, [(0, import_vue.createVNode)("path", {
+      "d": "M34.4,12.2 L39.4,8.45 C39.7555556,8.18333333 40.2444444,8.18333333 40.6,8.45 L45.6,12.2 C46.0418278,12.5313708 46.1313708,13.1581722 45.8,13.6 C45.6111456,13.8518058 45.3147573,14 45,14 L35,14 C34.4477153,14 34,13.5522847 34,13 C34,12.6852427 34.1481942,12.3888544 34.4,12.2 Z",
+      "transform": "translate(-34 -8)",
+      "fill": "#2D4B73",
+      "fill-rule": "nonzero",
+      "opacity": ".2"
+    }, null)]);
+  }
+});