zartui 0.1.112 → 3.0.2

package/es/locale/lang/zh-CN.mjs

@@ -0,0 +1,64 @@
+var stdin_default = {
+  name: "\u59D3\u540D",
+  tel: "\u7535\u8BDD",
+  save: "\u4FDD\u5B58",
+  confirm: "\u786E\u8BA4",
+  cancel: "\u53D6\u6D88",
+  delete: "\u5220\u9664",
+  loading: "\u52A0\u8F7D\u4E2D...",
+  noCoupon: "\u6682\u65E0\u4F18\u60E0\u5238",
+  nameEmpty: "\u8BF7\u586B\u5199\u59D3\u540D",
+  addContact: "\u6DFB\u52A0\u8054\u7CFB\u4EBA",
+  telInvalid: "\u8BF7\u586B\u5199\u6B63\u786E\u7684\u7535\u8BDD",
+  vanCalendar: {
+    end: "\u7ED3\u675F",
+    start: "\u5F00\u59CB",
+    title: "\u65E5\u671F\u9009\u62E9",
+    weekdays: ["\u65E5", "\u4E00", "\u4E8C", "\u4E09", "\u56DB", "\u4E94", "\u516D"],
+    monthTitle: (year, month) => `${year}\u5E74${month}\u6708`,
+    rangePrompt: (maxRange) => `\u6700\u591A\u9009\u62E9 ${maxRange} \u5929`
+  },
+  vanCascader: {
+    select: "\u8BF7\u9009\u62E9"
+  },
+  vanPagination: {
+    prev: "\u4E0A\u4E00\u9875",
+    next: "\u4E0B\u4E00\u9875"
+  },
+  vanPullRefresh: {
+    pulling: "\u4E0B\u62C9\u5373\u53EF\u5237\u65B0...",
+    loosing: "\u91CA\u653E\u5373\u53EF\u5237\u65B0..."
+  },
+  vanSubmitBar: {
+    label: "\u5408\u8BA1:"
+  },
+  vanCoupon: {
+    unlimited: "\u65E0\u95E8\u69DB",
+    discount: (discount) => `${discount}\u6298`,
+    condition: (condition) => `\u6EE1${condition}\u5143\u53EF\u7528`
+  },
+  vanCouponCell: {
+    title: "\u4F18\u60E0\u5238",
+    count: (count) => `${count}\u5F20\u53EF\u7528`
+  },
+  vanCouponList: {
+    exchange: "\u5151\u6362",
+    close: "\u4E0D\u4F7F\u7528",
+    enable: "\u53EF\u7528",
+    disabled: "\u4E0D\u53EF\u7528",
+    placeholder: "\u8F93\u5165\u4F18\u60E0\u7801"
+  },
+  vanAddressEdit: {
+    area: "\u5730\u533A",
+    areaEmpty: "\u8BF7\u9009\u62E9\u5730\u533A",
+    addressEmpty: "\u8BF7\u586B\u5199\u8BE6\u7EC6\u5730\u5740",
+    addressDetail: "\u8BE6\u7EC6\u5730\u5740",
+    defaultAddress: "\u8BBE\u4E3A\u9ED8\u8BA4\u6536\u8D27\u5730\u5740"
+  },
+  vanAddressList: {
+    add: "\u65B0\u589E\u5730\u5740"
+  }
+};
+export {
+  stdin_default as default
+};

package/es/locale/style/index.d.ts

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

package/es/locale/style/index.mjs

@@ -0,0 +1 @@
+import "../../style/base.css";

package/es/notice-bar/NoticeBar.d.ts

@@ -0,0 +1,71 @@
+import type { PropType, ExtractPropTypes } from 'vue';
+import { NoticeBarMode } from './types';
+declare const noticeBarProps: {
+    text: StringConstructor;
+    mode: PropType<NoticeBarMode>;
+    color: StringConstructor;
+    delay: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    speed: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    leftIcon: StringConstructor;
+    wrapable: BooleanConstructor;
+    background: StringConstructor;
+    scrollable: {
+        type: PropType<boolean | null>;
+        default: null;
+    };
+};
+export declare type NoticeBarProps = ExtractPropTypes<typeof noticeBarProps>;
+declare const _default: import("vue").DefineComponent<{
+    text: StringConstructor;
+    mode: PropType<NoticeBarMode>;
+    color: StringConstructor;
+    delay: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    speed: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    leftIcon: StringConstructor;
+    wrapable: BooleanConstructor;
+    background: StringConstructor;
+    scrollable: {
+        type: PropType<boolean | null>;
+        default: null;
+    };
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("close" | "replay")[], "close" | "replay", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    text: StringConstructor;
+    mode: PropType<NoticeBarMode>;
+    color: StringConstructor;
+    delay: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    speed: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    leftIcon: StringConstructor;
+    wrapable: BooleanConstructor;
+    background: StringConstructor;
+    scrollable: {
+        type: PropType<boolean | null>;
+        default: null;
+    };
+}>> & {
+    onClose?: ((...args: any[]) => any) | undefined;
+    onReplay?: ((...args: any[]) => any) | undefined;
+}, {
+    delay: string | number;
+    speed: string | number;
+    wrapable: boolean;
+    scrollable: boolean | null;
+}>;
+export default _default;

package/es/notice-bar/NoticeBar.mjs

@@ -0,0 +1,165 @@
+import { withDirectives as _withDirectives, vShow as _vShow, createVNode as _createVNode } from "vue";
+import { ref, watch, reactive, defineComponent } from "vue";
+import { isDef, createNamespace, makeNumericProp } from "../utils/index.mjs";
+import { raf, useRect, doubleRaf, useEventListener, onMountedOrActivated } from "@zartui/use";
+import { useExpose } from "../composables/use-expose.mjs";
+import { onPopupReopen } from "../composables/on-popup-reopen.mjs";
+import ZtIcon from "../icon/index.mjs";
+const [name, bem] = createNamespace("notice-bar");
+const noticeBarProps = {
+  text: String,
+  mode: String,
+  color: String,
+  delay: makeNumericProp(1),
+  speed: makeNumericProp(60),
+  leftIcon: String,
+  wrapable: Boolean,
+  background: String,
+  scrollable: {
+    type: Boolean,
+    default: null
+  }
+};
+var stdin_default = defineComponent({
+  name,
+  props: noticeBarProps,
+  emits: ["close", "replay"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    let wrapWidth = 0;
+    let contentWidth = 0;
+    let startTimer;
+    const wrapRef = ref();
+    const contentRef = ref();
+    const state = reactive({
+      show: true,
+      offset: 0,
+      duration: 0
+    });
+    const renderLeftIcon = () => {
+      if (slots["left-icon"]) {
+        return slots["left-icon"]();
+      }
+      if (props.leftIcon) {
+        return _createVNode(ZtIcon, {
+          "class": bem("left-icon"),
+          "name": props.leftIcon
+        }, null);
+      }
+    };
+    const getRightIconName = () => {
+      if (props.mode === "closeable") {
+        return "clear-r";
+      }
+      if (props.mode === "link") {
+        return "arrow-right";
+      }
+    };
+    const onClickRightIcon = (event) => {
+      if (props.mode === "closeable") {
+        state.show = false;
+        emit("close", event);
+      }
+    };
+    const renderRightIcon = () => {
+      if (slots["right-icon"]) {
+        return slots["right-icon"]();
+      }
+      const name2 = getRightIconName();
+      if (name2) {
+        return _createVNode(ZtIcon, {
+          "name": name2,
+          "class": bem("right-icon"),
+          "onClick": onClickRightIcon
+        }, null);
+      }
+    };
+    const onTransitionEnd = () => {
+      state.offset = wrapWidth;
+      state.duration = 0;
+      raf(() => {
+        doubleRaf(() => {
+          state.offset = -contentWidth;
+          state.duration = (contentWidth + wrapWidth) / +props.speed;
+          emit("replay");
+        });
+      });
+    };
+    const renderMarquee = () => {
+      const ellipsis = props.scrollable === false && !props.wrapable;
+      const style = {
+        transform: state.offset ? `translateX(${state.offset}px)` : "",
+        transitionDuration: `${state.duration}s`
+      };
+      return _createVNode("div", {
+        "ref": wrapRef,
+        "role": "marquee",
+        "class": bem("wrap")
+      }, [_createVNode("div", {
+        "ref": contentRef,
+        "style": style,
+        "class": [bem("content"), {
+          "zt-ellipsis": ellipsis
+        }],
+        "onTransitionend": onTransitionEnd
+      }, [slots.default ? slots.default() : props.text])]);
+    };
+    const reset = () => {
+      const {
+        delay,
+        speed,
+        scrollable
+      } = props;
+      const ms = isDef(delay) ? +delay * 1e3 : 0;
+      wrapWidth = 0;
+      contentWidth = 0;
+      state.offset = 0;
+      state.duration = 0;
+      clearTimeout(startTimer);
+      startTimer = setTimeout(() => {
+        if (!wrapRef.value || !contentRef.value || scrollable === false) {
+          return;
+        }
+        const wrapRefWidth = useRect(wrapRef).width;
+        const contentRefWidth = useRect(contentRef).width;
+        if (scrollable || contentRefWidth > wrapRefWidth) {
+          doubleRaf(() => {
+            wrapWidth = wrapRefWidth;
+            contentWidth = contentRefWidth;
+            state.offset = -contentWidth;
+            state.duration = contentWidth / +speed;
+          });
+        }
+      }, ms);
+    };
+    onPopupReopen(reset);
+    onMountedOrActivated(reset);
+    useEventListener("pageshow", reset);
+    useExpose({
+      reset
+    });
+    watch(() => [props.text, props.scrollable], reset);
+    return () => {
+      const {
+        color,
+        wrapable,
+        background
+      } = props;
+      return _withDirectives(_createVNode("div", {
+        "role": "alert",
+        "class": bem({
+          wrapable
+        }),
+        "style": {
+          color,
+          background
+        }
+      }, [renderLeftIcon(), renderMarquee(), renderRightIcon()]), [[_vShow, state.show]]);
+    };
+  }
+});
+export {
+  stdin_default as default
+};

package/es/notice-bar/index.css

@@ -0,0 +1 @@
+body{--zt-notice-bar-height: 36px;--zt-notice-bar-padding: 0 var(--zt-padding-md);--zt-notice-bar-wrapable-padding: var(--zt-padding-xs) var(--zt-padding-md);--zt-notice-bar-text-color: var(--zt-orange-2);--zt-notice-bar-font-size: var(--zt-font-size-md);--zt-notice-bar-line-height: 36px;--zt-notice-bar-background: var(--zt-background-4);--zt-notice-bar-icon-size: 20px;--zt-notice-bar-icon-min-width: 20px;--zt-notice-bar-icon-height: 20px}.zt-notice-bar{position:relative;display:flex;align-items:center;height:var(--zt-notice-bar-height);padding:var(--zt-notice-bar-padding);color:var(--zt-notice-bar-text-color);font-size:var(--zt-notice-bar-font-size);line-height:var(--zt-notice-bar-line-height);background:var(--zt-notice-bar-background)}.zt-notice-bar__left-icon,.zt-notice-bar__right-icon{min-width:var(--zt-notice-bar-icon-min-width);font-size:var(--zt-notice-bar-icon-size);height:var(--zt-notice-bar-icon-height)}.zt-notice-bar__right-icon{text-align:right;cursor:pointer}.zt-notice-bar__left-icon-size,.zt-notice-bar__right-icon-size{width:var(--zt-notice-bar-icon-size);height:var(--zt-notice-bar-icon-size)}.zt-notice-bar__wrap{position:relative;display:flex;flex:1;align-items:center;height:100%;overflow:hidden}.zt-notice-bar__content{position:absolute;white-space:nowrap;transition-timing-function:linear}.zt-notice-bar__content.zt-ellipsis{max-width:100%}.zt-notice-bar--wrapable{height:auto;padding:var(--zt-notice-bar-wrapable-padding)}.zt-notice-bar--wrapable .zt-notice-bar__wrap{height:auto}.zt-notice-bar--wrapable .zt-notice-bar__content{position:relative;white-space:normal;word-wrap:break-word}

package/es/notice-bar/index.d.ts

@@ -0,0 +1,56 @@
+import { NoticeBarProps } from './NoticeBar';
+export declare const NoticeBar: import("../utils").WithInstall<import("vue").DefineComponent<{
+    text: StringConstructor;
+    mode: import("vue").PropType<import("./types").NoticeBarMode>;
+    color: StringConstructor;
+    delay: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    speed: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    leftIcon: StringConstructor;
+    wrapable: BooleanConstructor;
+    background: StringConstructor;
+    scrollable: {
+        type: import("vue").PropType<boolean | null>;
+        default: null;
+    };
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("close" | "replay")[], "close" | "replay", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    text: StringConstructor;
+    mode: import("vue").PropType<import("./types").NoticeBarMode>;
+    color: StringConstructor;
+    delay: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    speed: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    leftIcon: StringConstructor;
+    wrapable: BooleanConstructor;
+    background: StringConstructor;
+    scrollable: {
+        type: import("vue").PropType<boolean | null>;
+        default: null;
+    };
+}>> & {
+    onClose?: ((...args: any[]) => any) | undefined;
+    onReplay?: ((...args: any[]) => any) | undefined;
+}, {
+    delay: string | number;
+    speed: string | number;
+    wrapable: boolean;
+    scrollable: boolean | null;
+}>>;
+export default NoticeBar;
+export type { NoticeBarProps };
+export type { NoticeBarMode, NoticeBarInstance } from './types';
+declare module 'vue' {
+    interface GlobalComponents {
+        ZtNoticeBar: typeof NoticeBar;
+    }
+}

package/es/notice-bar/index.mjs

@@ -0,0 +1,8 @@
+import { withInstall } from "../utils/index.mjs";
+import _NoticeBar from "./NoticeBar.mjs";
+const NoticeBar = withInstall(_NoticeBar);
+var stdin_default = NoticeBar;
+export {
+  NoticeBar,
+  stdin_default as default
+};

package/es/notice-bar/style/index.d.ts

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

package/es/notice-bar/style/index.mjs

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

package/es/notice-bar/types.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentPublicInstance } from 'vue';
+import type { NoticeBarProps } from './NoticeBar';
+export declare type NoticeBarMode = 'closeable' | 'link';
+export declare type NoticeBarExpose = {
+    reset: () => void;
+};
+export declare type NoticeBarInstance = ComponentPublicInstance<NoticeBarProps, NoticeBarExpose>;

package/es/notify/Notify.d.ts

@@ -0,0 +1,134 @@
+import { type ExtractPropTypes } from 'vue';
+import type { NotifyType, NotifyPosition } from './types';
+declare const notifyProps: {
+    show: BooleanConstructor;
+    zIndex: (NumberConstructor | StringConstructor)[];
+    overlay: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    duration: (NumberConstructor | StringConstructor)[];
+    teleport: import("vue").PropType<string | import("vue").RendererElement | null | undefined>;
+    lockScroll: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    lazyRender: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    beforeClose: import("vue").PropType<import("../utils").Interceptor>;
+    overlayStyle: import("vue").PropType<import("vue").CSSProperties>;
+    overlayClass: import("vue").PropType<unknown>;
+    transitionAppear: BooleanConstructor;
+    closeOnClickOverlay: {
+        type: BooleanConstructor;
+        default: true;
+    };
+} & {
+    type: {
+        type: import("vue").PropType<NotifyType>;
+        default: NotifyType;
+    };
+    color: StringConstructor;
+    message: (NumberConstructor | StringConstructor)[];
+    position: {
+        type: import("vue").PropType<NotifyPosition>;
+        default: NotifyPosition;
+    };
+    className: import("vue").PropType<unknown>;
+    background: StringConstructor;
+    lockScroll: BooleanConstructor;
+};
+export declare type NotifyProps = ExtractPropTypes<typeof notifyProps>;
+declare const _default: import("vue").DefineComponent<{
+    show: BooleanConstructor;
+    zIndex: (NumberConstructor | StringConstructor)[];
+    overlay: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    duration: (NumberConstructor | StringConstructor)[];
+    teleport: import("vue").PropType<string | import("vue").RendererElement | null | undefined>;
+    lockScroll: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    lazyRender: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    beforeClose: import("vue").PropType<import("../utils").Interceptor>;
+    overlayStyle: import("vue").PropType<import("vue").CSSProperties>;
+    overlayClass: import("vue").PropType<unknown>;
+    transitionAppear: BooleanConstructor;
+    closeOnClickOverlay: {
+        type: BooleanConstructor;
+        default: true;
+    };
+} & {
+    type: {
+        type: import("vue").PropType<NotifyType>;
+        default: NotifyType;
+    };
+    color: StringConstructor;
+    message: (NumberConstructor | StringConstructor)[];
+    position: {
+        type: import("vue").PropType<NotifyPosition>;
+        default: NotifyPosition;
+    };
+    className: import("vue").PropType<unknown>;
+    background: StringConstructor;
+    lockScroll: BooleanConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:show"[], "update:show", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    show: BooleanConstructor;
+    zIndex: (NumberConstructor | StringConstructor)[];
+    overlay: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    duration: (NumberConstructor | StringConstructor)[];
+    teleport: import("vue").PropType<string | import("vue").RendererElement | null | undefined>;
+    lockScroll: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    lazyRender: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    beforeClose: import("vue").PropType<import("../utils").Interceptor>;
+    overlayStyle: import("vue").PropType<import("vue").CSSProperties>;
+    overlayClass: import("vue").PropType<unknown>;
+    transitionAppear: BooleanConstructor;
+    closeOnClickOverlay: {
+        type: BooleanConstructor;
+        default: true;
+    };
+} & {
+    type: {
+        type: import("vue").PropType<NotifyType>;
+        default: NotifyType;
+    };
+    color: StringConstructor;
+    message: (NumberConstructor | StringConstructor)[];
+    position: {
+        type: import("vue").PropType<NotifyPosition>;
+        default: NotifyPosition;
+    };
+    className: import("vue").PropType<unknown>;
+    background: StringConstructor;
+    lockScroll: BooleanConstructor;
+}>> & {
+    "onUpdate:show"?: ((...args: any[]) => any) | undefined;
+}, {
+    type: NotifyType;
+    position: NotifyPosition;
+    overlay: boolean;
+    show: boolean;
+    lockScroll: boolean;
+    lazyRender: boolean;
+    transitionAppear: boolean;
+    closeOnClickOverlay: boolean;
+}>;
+export default _default;

package/es/notify/Notify.mjs

@@ -0,0 +1,44 @@
+import { createVNode as _createVNode } from "vue";
+import { defineComponent } from "vue";
+import { extend, numericProp, unknownProp, makeStringProp, createNamespace } from "../utils/index.mjs";
+import { Popup } from "../popup/index.mjs";
+import { popupSharedProps } from "../popup/shared.mjs";
+const [name, bem] = createNamespace("notify");
+const notifyProps = extend({}, popupSharedProps, {
+  type: makeStringProp("danger"),
+  color: String,
+  message: numericProp,
+  position: makeStringProp("top"),
+  className: unknownProp,
+  background: String,
+  lockScroll: Boolean
+});
+var stdin_default = defineComponent({
+  name,
+  props: notifyProps,
+  emits: ["update:show"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const updateShow = (show) => emit("update:show", show);
+    return () => _createVNode(Popup, {
+      "show": props.show,
+      "class": [bem([props.type]), props.className],
+      "style": {
+        color: props.color,
+        background: props.background
+      },
+      "overlay": false,
+      "position": props.position,
+      "duration": 0.2,
+      "lockScroll": props.lockScroll,
+      "onUpdate:show": updateShow
+    }, {
+      default: () => [slots.default ? slots.default() : props.message]
+    });
+  }
+});
+export {
+  stdin_default as default
+};

package/es/notify/function-call.d.ts

@@ -0,0 +1,6 @@
+import { type ComponentInstance } from '../utils';
+import type { NotifyMessage, NotifyOptions } from './types';
+export declare const closeNotify: () => void;
+export declare function showNotify(options: NotifyMessage | NotifyOptions): ComponentInstance | undefined;
+export declare const setNotifyDefaultOptions: (options: NotifyOptions) => NotifyOptions;
+export declare const resetNotifyDefaultOptions: () => void;

package/es/notify/function-call.mjs

@@ -0,0 +1,68 @@
+import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
+import { extend, isObject, inBrowser } from "../utils/index.mjs";
+import { mountComponent, usePopupState } from "../utils/mount-component.mjs";
+import ZtNotify from "./Notify.mjs";
+let timer;
+let instance;
+const parseOptions = (message) => isObject(message) ? message : {
+  message
+};
+function initInstance() {
+  ({
+    instance
+  } = mountComponent({
+    setup() {
+      const {
+        state,
+        toggle
+      } = usePopupState();
+      return () => _createVNode(ZtNotify, _mergeProps(state, {
+        "onUpdate:show": toggle
+      }), null);
+    }
+  }));
+}
+const getDefaultOptions = () => ({
+  type: "danger",
+  color: void 0,
+  message: "",
+  onClose: void 0,
+  onClick: void 0,
+  onOpened: void 0,
+  duration: 3e3,
+  position: void 0,
+  className: "",
+  lockScroll: false,
+  background: void 0
+});
+let currentOptions = getDefaultOptions();
+const closeNotify = () => {
+  if (instance) {
+    instance.toggle(false);
+  }
+};
+function showNotify(options) {
+  if (!inBrowser) {
+    return;
+  }
+  if (!instance) {
+    initInstance();
+  }
+  options = extend({}, currentOptions, parseOptions(options));
+  instance.open(options);
+  clearTimeout(timer);
+  if (options.duration > 0) {
+    timer = window.setTimeout(closeNotify, options.duration);
+  }
+  return instance;
+}
+const setNotifyDefaultOptions = (options) => extend(currentOptions, options);
+const resetNotifyDefaultOptions = () => {
+  currentOptions = getDefaultOptions();
+};
+export {
+  closeNotify,
+  resetNotifyDefaultOptions,
+  setNotifyDefaultOptions,
+  showNotify
+};

package/es/notify/index.css

@@ -0,0 +1 @@
+body{--zt-notify-text-color: var(--zt-white);--zt-notify-padding: var(--zt-padding-xs) var(--zt-padding-md);--zt-notify-font-size: var(--zt-font-size-md);--zt-notify-line-height: var(--zt-line-height-md);--zt-notify-primary-background: var(--zt-primary-color);--zt-notify-success-background: var(--zt-success-color);--zt-notify-danger-background: var(--zt-danger-color);--zt-notify-warning-background: var(--zt-warning-color)}.zt-notify{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:var(--zt-notify-padding);color:var(--zt-notify-text-color);font-size:var(--zt-notify-font-size);line-height:var(--zt-notify-line-height);white-space:pre-wrap;text-align:center;word-wrap:break-word}.zt-notify--primary{background:var(--zt-notify-primary-background)}.zt-notify--success{background:var(--zt-notify-success-background)}.zt-notify--danger{background:var(--zt-notify-danger-background)}.zt-notify--warning{background:var(--zt-notify-warning-background)}