zartui 3.0.2 → 3.0.3

package/es/popup/Popup.mjs

@@ -1,7 +1,7 @@
 import { Fragment as _Fragment, withDirectives as _withDirectives, mergeProps as _mergeProps, vShow as _vShow, createVNode as _createVNode } from "vue";
 import { ref, watch, provide, Teleport, nextTick, computed, onMounted, Transition, onActivated, onDeactivated, defineComponent } from "vue";
 import { popupSharedProps } from "./shared.mjs";
-import { isDef, extend, makeStringProp, callInterceptor, createNamespace, HAPTICS_FEEDBACK } from "../utils/index.mjs";
+import { isDef, extend, makeStringProp, callInterceptor, createNamespace, HAPTICS_FEEDBACK, makeNumberProp } from "../utils/index.mjs";
 import { useEventListener } from "@zartui/use";
 import { useExpose } from "../composables/use-expose.mjs";
 import { useLockScroll } from "../composables/use-lock-scroll.mjs";
@@ -12,14 +12,16 @@ import { Overlay } from "../overlay/index.mjs";
 const popupProps = extend({}, popupSharedProps, {
   round: Boolean,
   position: makeStringProp("center"),
-  closeIcon: makeStringProp("cross"),
+  closeIcon: makeStringProp("clear"),
   closeable: Boolean,
   transition: String,
   iconPrefix: String,
   closeOnPopstate: Boolean,
   closeIconPosition: makeStringProp("top-right"),
   safeAreaInsetTop: Boolean,
-  safeAreaInsetBottom: Boolean
+  safeAreaInsetBottom: Boolean,
+  sliderContentHeight: makeNumberProp(60),
+  slideable: Boolean
 });
 const [name, bem] = createNamespace("popup");
 let globalZIndex = 2e3;
@@ -35,7 +37,15 @@ var stdin_default = defineComponent({
   }) {
     let opened;
     let shouldReopen;
+    const root = ref();
+    const positionY = ref(0);
+    let timerId = setInterval(() => {
+    }, 0);
+    const touchHeight = ref(0);
+    const contentStyle = ref(`height:${props.sliderContentHeight}px;`);
+    const touchAreaHeight = ref(40);
     const zIndex = ref();
+    const touchPoint = ref(0);
     const popupRef = ref();
     const lazyRender = useLazyRender(() => props.show || !props.lazyRender);
     const style = computed(() => {
@@ -49,6 +59,9 @@ var stdin_default = defineComponent({
       return style2;
     });
     const open = () => {
+      if (props.slideable) {
+        contentStyle.value = `height:${props.sliderContentHeight}px;`;
+      }
       if (!opened) {
         if (props.zIndex !== void 0) {
           globalZIndex = +props.zIndex;
@@ -75,6 +88,39 @@ var stdin_default = defineComponent({
         close();
       }
     };
+    const move = (event) => {
+      if (timerId) {
+        event.preventDefault();
+      }
+      const h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
+      positionY.value = event.touches[0].clientY;
+      timerId = setTimeout(() => {
+        if (positionY.value === 0 || positionY.value < h * 0.15) {
+          return;
+        }
+        touchHeight.value = positionY.value - touchAreaHeight.value > h - touchAreaHeight.value ? h - touchAreaHeight.value + touchPoint.value : positionY.value;
+        contentStyle.value = `height:${h - touchHeight.value - touchAreaHeight.value + touchPoint.value}px;`;
+      }, 10);
+    };
+    const startMove = (event) => {
+      var _a, _b;
+      if (timerId) {
+        clearInterval(timerId);
+      }
+      touchPoint.value = event.touches[0].clientY - (((_b = (_a = popupRef.value) == null ? void 0 : _a.getBoundingClientRect()) == null ? void 0 : _b.top) || 0);
+    };
+    const endMove = () => {
+      clearInterval(timerId);
+    };
+    useEventListener("touchmove", move, {
+      target: root
+    });
+    useEventListener("touchstart", startMove, {
+      target: root
+    });
+    useEventListener("touchend", endMove, {
+      target: root
+    });
     const renderOverlay = () => {
       if (props.overlay) {
         return _createVNode(Overlay, {
@@ -129,6 +175,23 @@ var stdin_default = defineComponent({
         "onKeydown": onKeydown
       }, attrs), [(_a = slots.default) == null ? void 0 : _a.call(slots), renderCloseIcon()]), [[_vShow, props.show]]);
     });
+    const sliderRenderPopup = lazyRender(() => {
+      var _a, _b;
+      return _withDirectives(_createVNode("div", _mergeProps({
+        "class": bem("slider"),
+        "ref": popupRef,
+        "style": style.value,
+        "onKeydown": onKeydown
+      }, attrs), [(_a = slots.default) == null ? void 0 : _a.call(slots), renderCloseIcon(), _createVNode("div", {
+        "class": bem("slider-title"),
+        "ref": root
+      }, [_createVNode("div", {
+        "class": bem("slider-bar")
+      }, null)]), _createVNode("div", {
+        "class": bem("slider-content"),
+        "style": contentStyle.value
+      }, [(_b = slots.default) == null ? void 0 : _b.call(slots)])]), [[_vShow, props.show]]);
+    });
     const renderTransition = () => {
       const {
         position,
@@ -145,6 +208,22 @@ var stdin_default = defineComponent({
         default: renderPopup
       });
     };
+    const sliderRenderTransition = () => {
+      const {
+        position,
+        transition,
+        transitionAppear
+      } = props;
+      const name2 = position === "center" ? "zt-fade" : `zt-popup-slide-${position}`;
+      return _createVNode(Transition, {
+        "name": transition || name2,
+        "appear": transitionAppear,
+        "onAfterEnter": onOpened,
+        "onAfterLeave": onClosed
+      }, {
+        default: sliderRenderPopup
+      });
+    };
     watch(() => props.show, (show) => {
       if (show && !opened) {
         open();
@@ -196,6 +275,9 @@ var stdin_default = defineComponent({
           default: () => [renderOverlay(), renderTransition()]
         });
       }
+      if (props.slideable) {
+        return _createVNode(_Fragment, null, [renderOverlay(), sliderRenderTransition()]);
+      }
       return _createVNode(_Fragment, null, [renderOverlay(), renderTransition()]);
     };
   }

package/es/popup/index.css

@@ -1 +1 @@
-body{--zt-popup-background: var(--zt-background-2);--zt-popup-transition: transform var(--zt-duration-base);--zt-popup-round-radius: 16px;--zt-popup-close-icon-size: 22px;--zt-popup-close-icon-color: var(--zt-gray-5);--zt-popup-close-icon-margin: 16px;--zt-popup-close-icon-z-index: 1}.zt-overflow-hidden{overflow:hidden!important}.zt-popup{position:fixed;max-height:100%;overflow-y:auto;background:var(--zt-popup-background);transition:var(--zt-popup-transition);-webkit-overflow-scrolling:touch}.zt-popup--center{top:50%;left:50%;transform:translate3d(-50%,-50%,0)}.zt-popup--center.zt-popup--round{border-radius:var(--zt-popup-round-radius)}.zt-popup--top{top:0;left:0;width:100%}.zt-popup--top.zt-popup--round{border-radius:0 0 var(--zt-popup-round-radius) var(--zt-popup-round-radius)}.zt-popup--right{top:50%;right:0;transform:translate3d(0,-50%,0)}.zt-popup--right.zt-popup--round{border-radius:var(--zt-popup-round-radius) 0 0 var(--zt-popup-round-radius)}.zt-popup--bottom{bottom:0;left:0;width:100%}.zt-popup--bottom.zt-popup--round{border-radius:var(--zt-popup-round-radius) var(--zt-popup-round-radius) 0 0}.zt-popup--left{top:50%;left:0;transform:translate3d(0,-50%,0)}.zt-popup--left.zt-popup--round{border-radius:0 var(--zt-popup-round-radius) var(--zt-popup-round-radius) 0}.zt-popup-slide-top-enter-active,.zt-popup-slide-left-enter-active,.zt-popup-slide-right-enter-active,.zt-popup-slide-bottom-enter-active{transition-timing-function:var(--zt-ease-out)}.zt-popup-slide-top-leave-active,.zt-popup-slide-left-leave-active,.zt-popup-slide-right-leave-active,.zt-popup-slide-bottom-leave-active{transition-timing-function:var(--zt-ease-in)}.zt-popup-slide-top-enter-from,.zt-popup-slide-top-leave-active{transform:translate3d(0,-100%,0)}.zt-popup-slide-right-enter-from,.zt-popup-slide-right-leave-active{transform:translate3d(100%,-50%,0)}.zt-popup-slide-bottom-enter-from,.zt-popup-slide-bottom-leave-active{transform:translate3d(0,100%,0)}.zt-popup-slide-left-enter-from,.zt-popup-slide-left-leave-active{transform:translate3d(-100%,-50%,0)}.zt-popup__close-icon{position:absolute;z-index:var(--zt-popup-close-icon-z-index);color:var(--zt-popup-close-icon-color);font-size:var(--zt-popup-close-icon-size)}.zt-popup__close-icon--top-left{top:var(--zt-popup-close-icon-margin);left:var(--zt-popup-close-icon-margin)}.zt-popup__close-icon--top-right{top:var(--zt-popup-close-icon-margin);right:var(--zt-popup-close-icon-margin)}.zt-popup__close-icon--bottom-left{bottom:var(--zt-popup-close-icon-margin);left:var(--zt-popup-close-icon-margin)}.zt-popup__close-icon--bottom-right{right:var(--zt-popup-close-icon-margin);bottom:var(--zt-popup-close-icon-margin)}
+:root{--zt-popup-background: var(--zt-background-2);--zt-popup-transition: transform var(--zt-duration-base);--zt-popup-round-radius: 16px;--zt-popup-close-icon-size: 22px;--zt-popup-close-icon-color: var(--zt-gray-5);--zt-popup-close-icon-margin: 16px;--zt-popup-close-icon-z-index: 1}.zt-overflow-hidden{overflow:hidden!important}.zt-popup{position:fixed;max-height:100%;overflow-y:auto;background:var(--zt-popup-background);transition:var(--zt-popup-transition);-webkit-overflow-scrolling:touch}.zt-popup__slider{position:fixed;width:100%;bottom:0;border-radius:16px 16px 0 0;background-color:#fff}.zt-popup__slider-title{height:40px;text-align:center}.zt-popup__slider-bar{display:inline-block;width:32px;height:4px;transform:scaleY(-1);background:rgba(45,75,115,.2);border-radius:3px}.zt-popup__slider-content{overflow-y:auto}.zt-popup--center{top:50%;left:50%;transform:translate3d(-50%,-50%,0)}.zt-popup--center.zt-popup--round{border-radius:var(--zt-popup-round-radius)}.zt-popup--top{top:0;left:0;width:100%}.zt-popup--top.zt-popup--round{border-radius:0 0 var(--zt-popup-round-radius) var(--zt-popup-round-radius)}.zt-popup--right{top:50%;right:0;transform:translate3d(0,-50%,0)}.zt-popup--right.zt-popup--round{border-radius:var(--zt-popup-round-radius) 0 0 var(--zt-popup-round-radius)}.zt-popup--bottom{bottom:0;left:0;width:100%}.zt-popup--bottom.zt-popup--round{border-radius:var(--zt-popup-round-radius) var(--zt-popup-round-radius) 0 0}.zt-popup--left{top:50%;left:0;transform:translate3d(0,-50%,0)}.zt-popup--left.zt-popup--round{border-radius:0 var(--zt-popup-round-radius) var(--zt-popup-round-radius) 0}.zt-popup-slide-top-enter-active,.zt-popup-slide-left-enter-active,.zt-popup-slide-right-enter-active,.zt-popup-slide-bottom-enter-active{transition-timing-function:var(--zt-ease-out)}.zt-popup-slide-top-leave-active,.zt-popup-slide-left-leave-active,.zt-popup-slide-right-leave-active,.zt-popup-slide-bottom-leave-active{transition-timing-function:var(--zt-ease-in)}.zt-popup-slide-top-enter-from,.zt-popup-slide-top-leave-active{transform:translate3d(0,-100%,0)}.zt-popup-slide-right-enter-from,.zt-popup-slide-right-leave-active{transform:translate3d(100%,-50%,0)}.zt-popup-slide-bottom-enter-from,.zt-popup-slide-bottom-leave-active{transform:translate3d(0,100%,0)}.zt-popup-slide-left-enter-from,.zt-popup-slide-left-leave-active{transform:translate3d(-100%,-50%,0)}.zt-popup__slider-icon{z-index:var(--zt-popup-close-icon-z-index);color:var(--zt-popup-close-icon-color);font-size:var(--zt-popup-close-icon-size);cursor:pointer}.zt-popup__close-icon{position:absolute;z-index:var(--zt-popup-close-icon-z-index);color:var(--zt-popup-close-icon-color);font-size:var(--zt-popup-close-icon-size)}.zt-popup__close-icon--top-left{top:var(--zt-popup-close-icon-margin);left:var(--zt-popup-close-icon-margin)}.zt-popup__close-icon--top-right{top:var(--zt-popup-close-icon-margin);right:var(--zt-popup-close-icon-margin)}.zt-popup__close-icon--bottom-left{bottom:var(--zt-popup-close-icon-margin);left:var(--zt-popup-close-icon-margin)}.zt-popup__close-icon--bottom-right{right:var(--zt-popup-close-icon-margin);bottom:var(--zt-popup-close-icon-margin)}

package/es/popup/index.d.ts

@@ -43,7 +43,12 @@ export declare const Popup: import("../utils").WithInstall<import("vue").DefineC
     };
     safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: BooleanConstructor;
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("open" | "close" | "keydown" | "opened" | "closed" | "update:show" | "clickOverlay" | "clickCloseIcon")[], "open" | "close" | "keydown" | "opened" | "closed" | "update:show" | "clickOverlay" | "clickCloseIcon", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    sliderContentHeight: {
+        type: NumberConstructor;
+        default: number;
+    };
+    slideable: BooleanConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("close" | "keydown" | "open" | "opened" | "closed" | "update:show" | "clickOverlay" | "clickCloseIcon")[], "open" | "close" | "keydown" | "opened" | "closed" | "update:show" | "clickOverlay" | "clickCloseIcon", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     show: BooleanConstructor;
     zIndex: (NumberConstructor | StringConstructor)[];
     overlay: {
@@ -88,6 +93,11 @@ export declare const Popup: import("../utils").WithInstall<import("vue").DefineC
     };
     safeAreaInsetTop: BooleanConstructor;
     safeAreaInsetBottom: BooleanConstructor;
+    sliderContentHeight: {
+        type: NumberConstructor;
+        default: number;
+    };
+    slideable: BooleanConstructor;
 }>> & {
     onKeydown?: ((...args: any[]) => any) | undefined;
     onClose?: ((...args: any[]) => any) | undefined;
@@ -99,19 +109,21 @@ export declare const Popup: import("../utils").WithInstall<import("vue").DefineC
     onClickCloseIcon?: ((...args: any[]) => any) | undefined;
 }, {
     position: import("./types").PopupPosition;
-    round: boolean;
-    overlay: boolean;
     show: boolean;
-    closeable: boolean;
+    overlay: boolean;
     lockScroll: boolean;
     lazyRender: boolean;
     transitionAppear: boolean;
     closeOnClickOverlay: boolean;
+    round: boolean;
     closeIcon: string;
+    closeable: boolean;
     closeOnPopstate: boolean;
     closeIconPosition: import("./types").PopupCloseIconPosition;
     safeAreaInsetTop: boolean;
     safeAreaInsetBottom: boolean;
+    sliderContentHeight: number;
+    slideable: boolean;
 }>>;
 export default Popup;
 export type { PopupProps } from './Popup';

package/es/pull-refresh/PullRefresh.d.ts

@@ -1,4 +1,4 @@
-import { ExtractPropTypes } from 'vue';
+import type { ExtractPropTypes } from 'vue';
 declare const pullRefreshProps: {
     disabled: BooleanConstructor;
     modelValue: BooleanConstructor;
@@ -41,7 +41,7 @@ declare const _default: import("vue").DefineComponent<{
         type: (NumberConstructor | StringConstructor)[];
         default: number;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue" | "refresh")[], "change" | "update:modelValue" | "refresh", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "refresh")[], "update:modelValue" | "change" | "refresh", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     disabled: BooleanConstructor;
     modelValue: BooleanConstructor;
     headHeight: {
@@ -67,8 +67,8 @@ declare const _default: import("vue").DefineComponent<{
     onRefresh?: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
-    animationDuration: string | number;
     modelValue: boolean;
+    animationDuration: string | number;
     headHeight: string | number;
     successDuration: string | number;
 }>;

package/es/pull-refresh/PullRefresh.mjs

@@ -1,7 +1,7 @@
 import { createVNode as _createVNode } from "vue";
 import { ref, watch, reactive, nextTick, defineComponent } from "vue";
 import { numericProp, getScrollTop, preventDefault, createNamespace, makeNumericProp } from "../utils/index.mjs";
-import { useScrollParent } from "@zartui/use";
+import { useEventListener, useScrollParent } from "@zartui/use";
 import { useTouch } from "../composables/use-touch.mjs";
 import { Loading } from "../loading/index.mjs";
 const [name, bem, t] = createNamespace("pull-refresh");
@@ -29,6 +29,7 @@ var stdin_default = defineComponent({
   }) {
     let reachTop;
     const root = ref();
+    const track = ref();
     const scrollParent = useScrollParent(root);
     const state = reactive({
       status: "normal",
@@ -141,6 +142,9 @@ var stdin_default = defineComponent({
         }
       }
     };
+    useEventListener("touchmove", onTouchMove, {
+      target: track
+    });
     const onTouchEnd = () => {
       if (reachTop && touch.deltaY.value && isTouchable()) {
         state.duration = +props.animationDuration;
@@ -173,9 +177,10 @@ var stdin_default = defineComponent({
         "ref": root,
         "class": bem()
       }, [_createVNode("div", {
+        "ref": track,
         "class": bem("track"),
         "style": trackStyle,
-        "onTouchstart": onTouchStart,
+        "onTouchstartPassive": onTouchStart,
         "onTouchmove": onTouchMove,
         "onTouchend": onTouchEnd,
         "onTouchcancel": onTouchEnd

package/es/pull-refresh/index.css

@@ -1 +1 @@
-body{--zt-pull-refresh-head-height: 50px;--zt-pull-refresh-head-font-size: var(--zt-font-size-md);--zt-pull-refresh-head-text-color: var(--zt-text-color-2);--zt-pull-refresh-loading-icon-size: 14px;--zt-pull-refresh-head-background: var(--zt-background)}.zt-pull-refresh{overflow:hidden}.zt-pull-refresh__track{position:relative;height:100%;transition-property:transform}.zt-pull-refresh__head{position:absolute;left:0;width:100%;height:var(--zt-pull-refresh-head-height);overflow:hidden;color:var(--zt-pull-refresh-head-text-color);font-size:var(--zt-pull-refresh-head-font-size);line-height:var(--zt-pull-refresh-head-height);text-align:center;transform:translateY(-100%);background:var(--zt-pull-refresh-head-background)}.zt-pull-refresh__loading .zt-loading__spinner{width:var(--zt-pull-refresh-loading-icon-size);height:var(--zt-pull-refresh-loading-icon-size)}
+:root{--zt-pull-refresh-head-height: 50px;--zt-pull-refresh-head-font-size: var(--zt-font-size-md);--zt-pull-refresh-head-text-color: var(--zt-text-color-2);--zt-pull-refresh-loading-icon-size: 14px;--zt-pull-refresh-head-background: var(--zt-background)}.zt-pull-refresh{overflow:hidden}.zt-pull-refresh__track{position:relative;height:100%;transition-property:transform}.zt-pull-refresh__head{position:absolute;left:0;width:100%;height:var(--zt-pull-refresh-head-height);overflow:hidden;color:var(--zt-pull-refresh-head-text-color);font-size:var(--zt-pull-refresh-head-font-size);line-height:var(--zt-pull-refresh-head-height);text-align:center;transform:translateY(-100%);background:var(--zt-pull-refresh-head-background)}.zt-pull-refresh__loading .zt-loading__spinner{width:var(--zt-pull-refresh-loading-icon-size);height:var(--zt-pull-refresh-loading-icon-size)}

package/es/pull-refresh/index.d.ts

@@ -18,7 +18,7 @@ export declare const PullRefresh: import("../utils").WithInstall<import("vue").D
         type: (NumberConstructor | StringConstructor)[];
         default: number;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue" | "refresh")[], "change" | "update:modelValue" | "refresh", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change" | "refresh")[], "update:modelValue" | "change" | "refresh", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     disabled: BooleanConstructor;
     modelValue: BooleanConstructor;
     headHeight: {
@@ -44,8 +44,8 @@ export declare const PullRefresh: import("../utils").WithInstall<import("vue").D
     onRefresh?: ((...args: any[]) => any) | undefined;
 }, {
     disabled: boolean;
-    animationDuration: string | number;
     modelValue: boolean;
+    animationDuration: string | number;
     headHeight: string | number;
     successDuration: string | number;
 }>>;

package/es/radio/Radio.d.ts

@@ -0,0 +1,37 @@
+import { checkerProps, CheckerShape, CheckerLabelPosition } from '../checkbox/Checker';
+import type { ExtractPropTypes } from 'vue';
+export declare type RadioShape = CheckerShape;
+export declare type RadioLabelPosition = CheckerLabelPosition;
+export declare type RadioProps = ExtractPropTypes<typeof checkerProps>;
+declare const _default: import("vue").DefineComponent<{
+    name: import("vue").PropType<unknown>;
+    shape: {
+        type: import("vue").PropType<CheckerShape>;
+        default: CheckerShape;
+    };
+    disabled: BooleanConstructor;
+    iconSize: (NumberConstructor | StringConstructor)[];
+    modelValue: import("vue").PropType<unknown>;
+    checkedColor: StringConstructor;
+    labelPosition: import("vue").PropType<CheckerLabelPosition>;
+    labelDisabled: BooleanConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    name: import("vue").PropType<unknown>;
+    shape: {
+        type: import("vue").PropType<CheckerShape>;
+        default: CheckerShape;
+    };
+    disabled: BooleanConstructor;
+    iconSize: (NumberConstructor | StringConstructor)[];
+    modelValue: import("vue").PropType<unknown>;
+    checkedColor: StringConstructor;
+    labelPosition: import("vue").PropType<CheckerLabelPosition>;
+    labelDisabled: BooleanConstructor;
+}>> & {
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}, {
+    disabled: boolean;
+    shape: CheckerShape;
+    labelDisabled: boolean;
+}>;
+export default _default;

package/es/radio/Radio.mjs

@@ -0,0 +1,41 @@
+import { createVNode as _createVNode, mergeProps as _mergeProps } from "vue";
+import { defineComponent } from "vue";
+import { pick, createNamespace } from "../utils/index.mjs";
+import { RADIO_KEY } from "../radio-group/RadioGroup.mjs";
+import { useParent } from "@zartui/use";
+import Checker, { checkerProps } from "../checkbox/Checker.mjs";
+const [name, bem] = createNamespace("radio");
+var stdin_default = defineComponent({
+  name,
+  props: checkerProps,
+  emits: ["update:modelValue"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const {
+      parent
+    } = useParent(RADIO_KEY);
+    const checked = () => {
+      const value = parent ? parent.props.modelValue : props.modelValue;
+      return value === props.name;
+    };
+    const toggle = () => {
+      if (parent) {
+        parent.updateValue(props.name);
+      } else {
+        emit("update:modelValue", props.name);
+      }
+    };
+    return () => _createVNode(Checker, _mergeProps({
+      "bem": bem,
+      "role": "radio",
+      "parent": parent,
+      "checked": checked(),
+      "onToggle": toggle
+    }, props), pick(slots, ["default", "icon"]));
+  }
+});
+export {
+  stdin_default as default
+};

package/es/radio/index.css

@@ -0,0 +1 @@
+:root{--zt-radio-size: 16px;--zt-radio-padding: 12px 0;--zt-radio-border-color: var(--zt-gray-5);--zt-radio-duration: var(--zt-duration-fast);--zt-radio-round-box-shadow: -1px -1px 2px 0 #ffffff, 0 0 3px 0 rgba(45, 75, 115, .2);--zt-radio-round-background: linear-gradient(135deg, #e6ebf0 0%, #ffffff 100%);--zt-radio-round-border: 1px solid rgba(45, 75, 115, .13);--zt-radio-label-margin: 14px;--zt-radio-label-color: var(--zt-text-color);--zt-radio-label-font-size: var(--zt-font-size-md);--zt-radio-checked-icon-color: var(--zt-primary-color);--zt-radio-checked-icon-shadow: inset 1px 1px 2px 0 rgba(0, 0, 0, .2);--zt-radio-checked-icon-border: 1px solid rgba(255, 255, 255, .5);--zt-radio-disabled-icon-color: var(--zt-gray-5);--zt-radio-disabled-icon-shadow: -1px -1px 2px 0 #fff, 0 0 3px 0 rgba(45, 75, 115, .2);--zt-radio-disabled-icon-border: 1px solid var(--zt-white-a5);--zt-radio-disabled-label-color: var(--zt-text-color-3);--zt-radio-disabled-background: var(--zt-border-color);--zt-radio-disabled-checked-icon-opacity: .4}.zt-radio{position:relative;display:flex;align-items:center;overflow:hidden;cursor:pointer;-webkit-user-select:none;user-select:none;padding:var(--zt-radio-padding)}.zt-radio--disabled{cursor:not-allowed}.zt-radio--label-disabled{cursor:default}.zt-radio--horizontal{margin-right:var(--zt-padding-md)}.zt-radio__icon{font-size:var(--zt-radio-size);cursor:pointer;box-sizing:border-box}.zt-radio__icon .zt-icon{display:flex;justify-content:center;align-items:center;width:1em;height:1em;color:transparent;text-align:center;border:1px solid var(--zt-radio-border-color);transition-duration:var(--zt-radio-duration);transition-property:color,border-color,background-color}.zt-radio__icon--round .zt-icon{border-radius:100%;border:var(--zt-radio-round-border);box-shadow:var(--zt-radio-round-box-shadow);background:var(--zt-radio-round-background)}.zt-radio__icon--checked .zt-icon{color:var(--zt-white);background:var(--zt-radio-checked-icon-color);box-shadow:var(--zt-radio-checked-icon-shadow);border:var(--zt-radio-checked-icon-border)}.zt-radio__icon--disabled{cursor:not-allowed}.zt-radio__icon--disabled .zt-icon{border:var(--zt-radio-disabled-icon-border);box-shadow:var(--zt-radio-disabled-icon-shadow);background:var(--zt-gradient-white)}.zt-radio__icon--disabled.zt-radio__icon--checked .zt-icon{opacity:var(--zt-radio-disabled-checked-icon-opacity);background:var(--zt-blue);color:var(--zt-white)}.zt-radio__dot{width:calc(var(--zt-radio-size) * .5);height:calc(var(--zt-radio-size) * .5);background:var(--zt-white);border-radius:50%}.zt-radio__label{margin-left:var(--zt-radio-label-margin);color:var(--zt-radio-label-color);font-size:var(--zt-radio-label-font-size)}.zt-radio__label--left{margin:0 var(--zt-radio-label-margin) 0 0}.zt-radio__label--disabled{color:var(--zt-radio-disabled-label-color)}

package/es/radio/index.d.ts

@@ -0,0 +1,38 @@
+export declare const Radio: import("../utils").WithInstall<import("vue").DefineComponent<{
+    name: import("vue").PropType<unknown>;
+    shape: {
+        type: import("vue").PropType<import("../checkbox/Checker").CheckerShape>;
+        default: import("../checkbox/Checker").CheckerShape;
+    };
+    disabled: BooleanConstructor;
+    iconSize: (NumberConstructor | StringConstructor)[];
+    modelValue: import("vue").PropType<unknown>;
+    checkedColor: StringConstructor;
+    labelPosition: import("vue").PropType<import("../checkbox/Checker").CheckerLabelPosition>;
+    labelDisabled: BooleanConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    name: import("vue").PropType<unknown>;
+    shape: {
+        type: import("vue").PropType<import("../checkbox/Checker").CheckerShape>;
+        default: import("../checkbox/Checker").CheckerShape;
+    };
+    disabled: BooleanConstructor;
+    iconSize: (NumberConstructor | StringConstructor)[];
+    modelValue: import("vue").PropType<unknown>;
+    checkedColor: StringConstructor;
+    labelPosition: import("vue").PropType<import("../checkbox/Checker").CheckerLabelPosition>;
+    labelDisabled: BooleanConstructor;
+}>> & {
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}, {
+    disabled: boolean;
+    shape: import("../checkbox/Checker").CheckerShape;
+    labelDisabled: boolean;
+}>>;
+export default Radio;
+export type { RadioProps, RadioShape, RadioLabelPosition } from './Radio';
+declare module 'vue' {
+    interface GlobalComponents {
+        ZtRadio: typeof Radio;
+    }
+}

package/es/radio/index.mjs

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

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

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

package/es/radio/style/index.mjs

@@ -0,0 +1,6 @@
+import "../../style/base.css";
+import "../../badge/index.css";
+import "../../icon/index.css";
+import "../../checkbox/index.css";
+import "../../radio-group/index.css";
+import "../index.css";

package/es/radio-group/RadioGroup.d.ts

@@ -0,0 +1,45 @@
+import type { CheckerDirection } from '../checkbox/Checker';
+import type { InjectionKey, ExtractPropTypes } from 'vue';
+export declare type RadioGroupDirection = CheckerDirection;
+declare const radioGroupProps: {
+    disabled: BooleanConstructor;
+    iconSize: (NumberConstructor | StringConstructor)[];
+    direction: {
+        type: import("vue").PropType<CheckerDirection>;
+        default: CheckerDirection;
+    };
+    modelValue: import("vue").PropType<unknown>;
+    checkedColor: StringConstructor;
+};
+export declare type RadioGroupProps = ExtractPropTypes<typeof radioGroupProps>;
+export declare type RadioGroupProvide = {
+    props: RadioGroupProps;
+    updateValue: (value: unknown) => void;
+};
+export declare const RADIO_KEY: InjectionKey<RadioGroupProvide>;
+declare const _default: import("vue").DefineComponent<{
+    disabled: BooleanConstructor;
+    iconSize: (NumberConstructor | StringConstructor)[];
+    direction: {
+        type: import("vue").PropType<CheckerDirection>;
+        default: CheckerDirection;
+    };
+    modelValue: import("vue").PropType<unknown>;
+    checkedColor: StringConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change")[], "update:modelValue" | "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+    disabled: BooleanConstructor;
+    iconSize: (NumberConstructor | StringConstructor)[];
+    direction: {
+        type: import("vue").PropType<CheckerDirection>;
+        default: CheckerDirection;
+    };
+    modelValue: import("vue").PropType<unknown>;
+    checkedColor: StringConstructor;
+}>> & {
+    onChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}, {
+    disabled: boolean;
+    direction: CheckerDirection;
+}>;
+export default _default;

package/es/radio-group/RadioGroup.mjs

@@ -0,0 +1,44 @@
+import { createVNode as _createVNode } from "vue";
+import { watch, defineComponent } from "vue";
+import { unknownProp, numericProp, createNamespace, makeStringProp } from "../utils/index.mjs";
+import { useChildren, useCustomFieldValue } from "@zartui/use";
+const [name, bem] = createNamespace("radio-group");
+const radioGroupProps = {
+  disabled: Boolean,
+  iconSize: numericProp,
+  direction: makeStringProp("vertical"),
+  modelValue: unknownProp,
+  checkedColor: String
+};
+const RADIO_KEY = Symbol(name);
+var stdin_default = defineComponent({
+  name,
+  props: radioGroupProps,
+  emits: ["change", "update:modelValue"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const {
+      linkChildren
+    } = useChildren(RADIO_KEY);
+    const updateValue = (value) => emit("update:modelValue", value);
+    watch(() => props.modelValue, (value) => emit("change", value));
+    linkChildren({
+      props,
+      updateValue
+    });
+    useCustomFieldValue(() => props.modelValue);
+    return () => {
+      var _a;
+      return _createVNode("div", {
+        "class": bem([props.direction]),
+        "role": "radiogroup"
+      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]);
+    };
+  }
+});
+export {
+  RADIO_KEY,
+  stdin_default as default
+};

package/es/radio-group/index.css

@@ -0,0 +1 @@
+.zt-radio-group--horizontal{display:flex;flex-wrap:wrap}.zt-radio-group--vertical .zt-radio:after{position:absolute;box-sizing:border-box;content:" ";pointer-events:none;right:0;bottom:0;left:calc(var(--zt-radio-size) + var(--zt-radio-label-margin));border-bottom:1px solid var(--zt-border-color);transform:scaleY(.5)}.zt-radio-group--vertical .zt-radio:last-child:after{display:none}

package/es/radio-group/index.d.ts

@@ -0,0 +1,32 @@
+export declare const RadioGroup: import("../utils").WithInstall<import("vue").DefineComponent<{
+    disabled: BooleanConstructor;
+    iconSize: (NumberConstructor | StringConstructor)[];
+    direction: {
+        type: import("vue").PropType<import("../checkbox/Checker").CheckerDirection>;
+        default: import("../checkbox/Checker").CheckerDirection;
+    };
+    modelValue: import("vue").PropType<unknown>;
+    checkedColor: StringConstructor;
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change")[], "update:modelValue" | "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    disabled: BooleanConstructor;
+    iconSize: (NumberConstructor | StringConstructor)[];
+    direction: {
+        type: import("vue").PropType<import("../checkbox/Checker").CheckerDirection>;
+        default: import("../checkbox/Checker").CheckerDirection;
+    };
+    modelValue: import("vue").PropType<unknown>;
+    checkedColor: StringConstructor;
+}>> & {
+    onChange?: ((...args: any[]) => any) | undefined;
+    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
+}, {
+    disabled: boolean;
+    direction: import("../checkbox/Checker").CheckerDirection;
+}>>;
+export default RadioGroup;
+export type { RadioGroupProps, RadioGroupDirection } from './RadioGroup';
+declare module 'vue' {
+    interface GlobalComponents {
+        ZtRadioGroup: typeof RadioGroup;
+    }
+}

package/es/radio-group/index.mjs

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

package/es/radio-group/style/index.d.ts

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

package/es/radio-group/style/index.mjs

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

package/es/rate/Rate.d.ts

@@ -1,4 +1,4 @@
-import { ExtractPropTypes } from 'vue';
+import type { ExtractPropTypes } from 'vue';
 declare const rateProps: {
     size: (NumberConstructor | StringConstructor)[];
     icon: {
@@ -61,7 +61,7 @@ declare const _default: import("vue").DefineComponent<{
         default: number;
     };
     disabledColor: StringConstructor;
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "change")[], "update:modelValue" | "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
     size: (NumberConstructor | StringConstructor)[];
     icon: {
         type: import("vue").PropType<string>;
@@ -98,10 +98,10 @@ declare const _default: import("vue").DefineComponent<{
     disabled: boolean;
     icon: string;
     modelValue: number;
-    count: string | number;
     readonly: boolean;
+    touchable: boolean;
+    count: string | number;
     voidIcon: string;
     allowHalf: boolean;
-    touchable: boolean;
 }>;
 export default _default;

package/es/rate/Rate.mjs

@@ -207,7 +207,7 @@ var stdin_default = defineComponent({
       "tabindex": props.disabled ? void 0 : 0,
       "aria-disabled": props.disabled,
       "aria-readonly": props.readonly,
-      "onTouchstart": onTouchStart,
+      "onTouchstartPassive": onTouchStart,
       "onTouchmove": onTouchMove
     }, [list.value.map(renderStar)]);
   }

package/es/rate/index.css

@@ -1 +1 @@
-body{--zt-rate-icon-size: 20px;--zt-rate-icon-gutter: var(--zt-padding-base);--zt-rate-icon-void-color: var(--zt-gray-5);--zt-rate-icon-full-color: var(--zt-yellow);--zt-rate-icon-disabled-color: var(--zt-gray-5)}.zt-rate{cursor:pointer;-webkit-user-select:none;user-select:none;flex-wrap:wrap;display:inline-flex;align-items:center}.zt-rate__item{position:relative}.zt-rate__item:not(:last-child){padding-right:var(--zt-rate-icon-gutter)}.zt-rate__icon{display:block;width:1em;color:var(--zt-rate-icon-void-color);font-size:var(--zt-rate-icon-size)}.zt-rate__icon--half{position:absolute;top:0;left:0;overflow:hidden}.zt-rate__icon--full{color:var(--zt-rate-icon-full-color)}.zt-rate__icon--disabled{color:var(--zt-rate-icon-disabled-color)}.zt-rate--disabled{cursor:not-allowed}.zt-rate--readonly{cursor:default}
+:root{--zt-rate-icon-size: 20px;--zt-rate-icon-gutter: var(--zt-padding-base);--zt-rate-icon-void-color: var(--zt-gray-5);--zt-rate-icon-full-color: var(--zt-yellow);--zt-rate-icon-disabled-color: var(--zt-gray-5)}.zt-rate{cursor:pointer;-webkit-user-select:none;user-select:none;flex-wrap:wrap;display:inline-flex;align-items:center}.zt-rate__item{position:relative}.zt-rate__item:not(:last-child){padding-right:var(--zt-rate-icon-gutter)}.zt-rate__icon{display:block;width:1em;color:var(--zt-rate-icon-void-color);font-size:var(--zt-rate-icon-size)}.zt-rate__icon--half{position:absolute;top:0;left:0;overflow:hidden}.zt-rate__icon--full{color:var(--zt-rate-icon-full-color)}.zt-rate__icon--disabled{color:var(--zt-rate-icon-disabled-color)}.zt-rate--disabled{cursor:not-allowed}.zt-rate--readonly{cursor:default}