straw-ui-vue 0.1.0

package/dist/components/st-popover/index.d.ts

@@ -0,0 +1,243 @@
+export declare const StPopover: {
+    new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
+        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("./types.d.ts").PopoverProps> & Readonly<{
+            "onUpdate:visible"?: (value: boolean) => any;
+            onVisibleChange?: (value: boolean) => any;
+        }>, import("./types.d.ts").PopoverExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            "update:visible": (value: boolean) => any;
+            visibleChange: (value: boolean) => any;
+        }, import("vue").PublicProps, {
+            gap: number;
+            disabled: boolean;
+            trigger: import("./types.d.ts").PopoverTrigger;
+            placement: import("./types.d.ts").PopoverPlacement;
+            visible: boolean;
+            offset: number;
+            showArrow: boolean;
+            closeOnClickOutside: boolean;
+            closeOnEsc: boolean;
+            openDelay: number;
+            closeDelay: number;
+            triggerClass: string;
+        }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import("./types.d.ts").PopoverProps> & Readonly<{
+            "onUpdate:visible"?: (value: boolean) => any;
+            onVisibleChange?: (value: boolean) => any;
+        }>, import("./types.d.ts").PopoverExpose, {}, {}, {}, {
+            gap: number;
+            disabled: boolean;
+            trigger: import("./types.d.ts").PopoverTrigger;
+            placement: import("./types.d.ts").PopoverPlacement;
+            visible: boolean;
+            offset: number;
+            showArrow: boolean;
+            closeOnClickOutside: boolean;
+            closeOnEsc: boolean;
+            openDelay: number;
+            closeDelay: number;
+            triggerClass: string;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import("vue").ComponentOptionsBase<Readonly<import("./types.d.ts").PopoverProps> & Readonly<{
+        "onUpdate:visible"?: (value: boolean) => any;
+        onVisibleChange?: (value: boolean) => any;
+    }>, import("./types.d.ts").PopoverExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        "update:visible": (value: boolean) => any;
+        visibleChange: (value: boolean) => any;
+    }, string, {
+        gap: number;
+        disabled: boolean;
+        trigger: import("./types.d.ts").PopoverTrigger;
+        placement: import("./types.d.ts").PopoverPlacement;
+        visible: boolean;
+        offset: number;
+        showArrow: boolean;
+        closeOnClickOutside: boolean;
+        closeOnEsc: boolean;
+        openDelay: number;
+        closeDelay: number;
+        triggerClass: string;
+    }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: {
+            trigger?: (props: {}) => any;
+        } & {
+            default?: (props: {}) => any;
+        } & {
+            content?: (props: {}) => any;
+        };
+    })>>, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {
+        [x: string]: any;
+    }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("vue").ExtractPropTypes<{
+        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("./types.d.ts").PopoverProps> & Readonly<{
+            "onUpdate:visible"?: (value: boolean) => any;
+            onVisibleChange?: (value: boolean) => any;
+        }>, import("./types.d.ts").PopoverExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            "update:visible": (value: boolean) => any;
+            visibleChange: (value: boolean) => any;
+        }, import("vue").PublicProps, {
+            gap: number;
+            disabled: boolean;
+            trigger: import("./types.d.ts").PopoverTrigger;
+            placement: import("./types.d.ts").PopoverPlacement;
+            visible: boolean;
+            offset: number;
+            showArrow: boolean;
+            closeOnClickOutside: boolean;
+            closeOnEsc: boolean;
+            openDelay: number;
+            closeDelay: number;
+            triggerClass: string;
+        }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import("./types.d.ts").PopoverProps> & Readonly<{
+            "onUpdate:visible"?: (value: boolean) => any;
+            onVisibleChange?: (value: boolean) => any;
+        }>, import("./types.d.ts").PopoverExpose, {}, {}, {}, {
+            gap: number;
+            disabled: boolean;
+            trigger: import("./types.d.ts").PopoverTrigger;
+            placement: import("./types.d.ts").PopoverPlacement;
+            visible: boolean;
+            offset: number;
+            showArrow: boolean;
+            closeOnClickOutside: boolean;
+            closeOnEsc: boolean;
+            openDelay: number;
+            closeDelay: number;
+            triggerClass: string;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import("vue").ComponentOptionsBase<Readonly<import("./types.d.ts").PopoverProps> & Readonly<{
+        "onUpdate:visible"?: (value: boolean) => any;
+        onVisibleChange?: (value: boolean) => any;
+    }>, import("./types.d.ts").PopoverExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        "update:visible": (value: boolean) => any;
+        visibleChange: (value: boolean) => any;
+    }, string, {
+        gap: number;
+        disabled: boolean;
+        trigger: import("./types.d.ts").PopoverTrigger;
+        placement: import("./types.d.ts").PopoverPlacement;
+        visible: boolean;
+        offset: number;
+        showArrow: boolean;
+        closeOnClickOutside: boolean;
+        closeOnEsc: boolean;
+        openDelay: number;
+        closeDelay: number;
+        triggerClass: string;
+    }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: {
+            trigger?: (props: {}) => any;
+        } & {
+            default?: (props: {}) => any;
+        } & {
+            content?: (props: {}) => any;
+        };
+    })>>, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, {
+        [x: string]: any;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+    new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("./types.d.ts").PopoverProps> & Readonly<{
+        "onUpdate:visible"?: (value: boolean) => any;
+        onVisibleChange?: (value: boolean) => any;
+    }>, import("./types.d.ts").PopoverExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        "update:visible": (value: boolean) => any;
+        visibleChange: (value: boolean) => any;
+    }, import("vue").PublicProps, {
+        gap: number;
+        disabled: boolean;
+        trigger: import("./types.d.ts").PopoverTrigger;
+        placement: import("./types.d.ts").PopoverPlacement;
+        visible: boolean;
+        offset: number;
+        showArrow: boolean;
+        closeOnClickOutside: boolean;
+        closeOnEsc: boolean;
+        openDelay: number;
+        closeDelay: number;
+        triggerClass: string;
+    }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import("./types.d.ts").PopoverProps> & Readonly<{
+        "onUpdate:visible"?: (value: boolean) => any;
+        onVisibleChange?: (value: boolean) => any;
+    }>, import("./types.d.ts").PopoverExpose, {}, {}, {}, {
+        gap: number;
+        disabled: boolean;
+        trigger: import("./types.d.ts").PopoverTrigger;
+        placement: import("./types.d.ts").PopoverPlacement;
+        visible: boolean;
+        offset: number;
+        showArrow: boolean;
+        closeOnClickOutside: boolean;
+        closeOnEsc: boolean;
+        openDelay: number;
+        closeDelay: number;
+        triggerClass: string;
+    }>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import("vue").ComponentOptionsBase<Readonly<import("./types.d.ts").PopoverProps> & Readonly<{
+    "onUpdate:visible"?: (value: boolean) => any;
+    onVisibleChange?: (value: boolean) => any;
+}>, import("./types.d.ts").PopoverExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:visible": (value: boolean) => any;
+    visibleChange: (value: boolean) => any;
+}, string, {
+    gap: number;
+    disabled: boolean;
+    trigger: import("./types.d.ts").PopoverTrigger;
+    placement: import("./types.d.ts").PopoverPlacement;
+    visible: boolean;
+    offset: number;
+    showArrow: boolean;
+    closeOnClickOutside: boolean;
+    closeOnEsc: boolean;
+    openDelay: number;
+    closeDelay: number;
+    triggerClass: string;
+}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+    $slots: {
+        trigger?: (props: {}) => any;
+    } & {
+        default?: (props: {}) => any;
+    } & {
+        content?: (props: {}) => any;
+    };
+})>>, {}, {}, import("vue").ComputedOptions, import("vue").MethodOptions, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
+    [x: string]: any;
+}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & (import("vue").VNodeProps & (import("vue").AllowedComponentProps & (import("vue").ComponentCustomProps & import("vue").Plugin)));
+export default StPopover;
+export type * from './types.d.ts';

package/dist/components/st-popover/st-popover.vue.cjs

@@ -0,0 +1 @@
+var e=require("./st-popover.vue_vue_type_script_setup_true_lang.cjs").default;exports.default=e;

package/dist/components/st-popover/st-popover.vue.d.ts

@@ -0,0 +1,37 @@
+import type { PopoverExpose, PopoverPlacement, PopoverProps } from './types.d.ts';
+declare var __VLS_1: {}, __VLS_3: {}, __VLS_19: {};
+type __VLS_Slots = {} & {
+    trigger?: (props: typeof __VLS_1) => any;
+} & {
+    default?: (props: typeof __VLS_3) => any;
+} & {
+    content?: (props: typeof __VLS_19) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<PopoverProps, PopoverExpose, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:visible": (value: boolean) => any;
+    visibleChange: (value: boolean) => any;
+}, string, import("vue").PublicProps, Readonly<PopoverProps> & Readonly<{
+    "onUpdate:visible"?: (value: boolean) => any;
+    onVisibleChange?: (value: boolean) => any;
+}>, {
+    gap: number;
+    disabled: boolean;
+    trigger: import("./types.d.ts").PopoverTrigger;
+    placement: PopoverPlacement;
+    visible: boolean;
+    offset: number;
+    showArrow: boolean;
+    closeOnClickOutside: boolean;
+    closeOnEsc: boolean;
+    openDelay: number;
+    closeDelay: number;
+    triggerClass: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
+declare const _default: typeof __VLS_export;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/st-popover/st-popover.vue.js

@@ -0,0 +1,5 @@
+import e from "./st-popover.vue_vue_type_script_setup_true_lang.js";
+//#region src/components/st-popover/st-popover.vue
+var t = e;
+//#endregion
+export { t as default };

package/dist/components/st-popover/st-popover.vue_vue_type_script_setup_true_lang.cjs

@@ -0,0 +1 @@
+const e=require("../../utils/cn.cjs");let t=require("vue");var n={class:`st-popover-content text-foreground`},r=(0,t.defineComponent)({inheritAttrs:!1,__name:`st-popover`,props:{trigger:{default:`hover`},placement:{default:`top-center`},disabled:{type:Boolean,default:!1},visible:{type:Boolean,default:void 0},offset:{default:void 0},gap:{default:0},showArrow:{type:Boolean,default:!0},closeOnClickOutside:{type:Boolean,default:!0},closeOnEsc:{type:Boolean,default:!0},openDelay:{default:150},closeDelay:{default:200},triggerClass:{default:``}},emits:[`update:visible`,`visibleChange`],setup(r,{expose:i,emit:a}){let o=(0,t.useAttrs)(),s=r,c=a,l=(0,t.ref)(null),u=(0,t.ref)(null),d=(0,t.ref)(null),f=(0,t.ref)(!1),p=(0,t.ref)(s.placement),m=(0,t.ref)({top:0,left:0}),h=(0,t.ref)(`bottom center`),g=(0,t.ref)(!1),_=(0,t.ref)(null),v=null,y=null,b=()=>{v&&=(clearTimeout(v),null),y&&=(clearTimeout(y),null)},x=(0,t.computed)(()=>s.visible!==void 0),S=(0,t.computed)({get:()=>x.value?s.visible:f.value,set:e=>{x.value?c(`update:visible`,e):f.value=e,c(`visibleChange`,e)}}),C=(0,t.computed)(()=>s.offset===void 0?s.gap:s.offset),w=(0,t.computed)(()=>e.cn(`st-popover`,`fixed`,`z-50`,`rounded-radius`,`bg-popover`,`shadow-lg`,`border`,`border-border`,`st-popover--${p.value}`,o.class)),T=(0,t.computed)(()=>{let e={position:`fixed`,top:`${m.value.top}px`,left:`${m.value.left}px`,transformOrigin:h.value};g.value||(e.left=`-9999px`,e.top=`-9999px`,e.opacity=`0`,e.visibility=`hidden`);let t=o.style;return t?{...t,...e}:e}),E=(0,t.computed)(()=>{let[t,n]=p.value.split(`-`),r=[`st-popover-arrow`,`absolute`,`w-2`,`h-2`,`bg-popover`,`border`,`border-border`,`transform`,`rotate-45`],i={top:[`-bottom-1`,`border-t-0`,`border-l-0`],bottom:[`-top-1`,`border-b-0`,`border-r-0`],left:[`-right-1`,`border-l-0`,`border-t-0`],right:[`-left-1`,`border-r-0`,`border-b-0`]},a;if(t===`top`||t===`bottom`)switch(n){case`left`:a=[`left-2`];break;case`center`:a=[`left-1/2`,`-translate-x-1/2`];break;case`right`:a=[`right-2`];break;default:a=[`left-1/2`,`-translate-x-1/2`]}else switch(n){case`top`:a=[`top-2`];break;case`center`:a=[`top-1/2`,`-translate-y-1/2`];break;case`bottom`:a=[`bottom-2`];break;default:a=[`top-1/2`,`-translate-y-1/2`]}return e.cn(r,i[t],a)}),D=e=>({"top-left":`bottom left`,"top-center":`bottom center`,"top-right":`bottom right`,"bottom-left":`top left`,"bottom-center":`top center`,"bottom-right":`top right`,"left-top":`center right`,"left-center":`center right`,"left-bottom":`center right`,"right-top":`center left`,"right-center":`center left`,"right-bottom":`center left`})[e],O=e=>{let[t,n]=e.split(`-`);return`${{top:`bottom`,bottom:`top`,left:`right`,right:`left`}[t]}-${n}`},k=(e,t)=>{let[n,r]=e.split(`-`);return t===`horizontal`?n===`top`||n===`bottom`?`${n}-${{left:`right`,center:`left`,right:`left`}[r]||r}`:`${n}-${{top:`bottom`,center:`top`,bottom:`top`}[r]||r}`:n===`top`||n===`bottom`?e:`${n}-${{top:`bottom`,center:`top`,bottom:`top`}[r]||r}`},A=(e,t=!1)=>{s.disabled||(b(),e&&(_.value=e),s.trigger===`hover`&&!t&&s.openDelay>0?v=setTimeout(()=>{S.value=!0},s.openDelay):S.value=!0)},j=(e=!1)=>{b(),s.trigger===`hover`&&!e&&s.closeDelay>0?y=setTimeout(()=>{S.value=!1},s.closeDelay):S.value=!1},M=()=>{S.value?j():A()},N=()=>{g.value=!1},P=(e,t,n,r)=>{let[i,a]=e.split(`-`),o=0,s=0;switch(i){case`top`:switch(o=t.top-n.height-r,a){case`left`:s=t.left;break;case`center`:s=t.left+(t.width-n.width)/2;break;case`right`:s=t.right-n.width;break}break;case`bottom`:switch(o=t.bottom+r,a){case`left`:s=t.left;break;case`center`:s=t.left+(t.width-n.width)/2;break;case`right`:s=t.right-n.width;break}break;case`left`:switch(s=t.left-n.width-r,a){case`top`:o=t.top;break;case`center`:o=t.top+(t.height-n.height)/2;break;case`bottom`:o=t.bottom-n.height;break}break;case`right`:switch(s=t.right+r,a){case`top`:o=t.top;break;case`center`:o=t.top+(t.height-n.height)/2;break;case`bottom`:o=t.bottom-n.height;break}break}return{top:o,left:s}},F=(e,t,n,r,i)=>{let[a]=e.split(`-`);switch(a){case`top`:return t.top<0;case`bottom`:return t.top+n.height>i;case`left`:return t.left<0;case`right`:return t.left+n.width>r;default:return!1}},I=(e,t,n)=>e.left<0||e.left+t.width>n,L=(e,t,n)=>e.top<0||e.top+t.height>n,R=(e,t,n,r)=>{if(!_.value)return;let i=_.value.clientX,a=_.value.clientY,o=i+r,s=a+r;o+n.width>e&&(o=i-n.width-r),s+n.height>t&&(s=a-n.height-r),o=Math.max(r,Math.min(o,e-n.width-r)),s=Math.max(r,Math.min(s,t-n.height-r)),m.value={top:s,left:o};let c=o<=i+r?`left`:`right`;h.value=`${s<=a+r?`top`:`bottom`} ${c}`,p.value=`bottom-left`},z=async()=>{if(await(0,t.nextTick)(),!u.value||!d.value)return;let e=d.value.getBoundingClientRect(),{innerWidth:n,innerHeight:r}=window,i=C.value;if(s.trigger===`contextmenu`&&_.value){R(n,r,e,i),g.value=!0;return}let a=u.value.getBoundingClientRect(),o=s.placement,c=P(o,a,e,i);if(F(o,c,e,n,r)){let t=O(o),s=P(t,a,e,i);F(t,s,e,n,r)||(o=t,c=s)}if(I(c,e,n)){let t=k(o,`horizontal`),r=P(t,a,e,i);I(r,e,n)||(o=t,c=r)}if(L(c,e,r)){let t=k(o,`vertical`),n=P(t,a,e,i);L(n,e,r)||(o=t,c=n)}let{top:l,left:f}=c;l=Math.max(0,Math.min(l,r-e.height)),f=Math.max(0,Math.min(f,n-e.width)),p.value=o,m.value={top:l,left:f},h.value=D(o),g.value=!0},B=e=>{s.trigger===`click`&&(e.stopPropagation(),M())},V=()=>{s.trigger===`hover`&&(b(),A())},H=()=>{s.trigger===`hover`&&j()},U=()=>{s.trigger===`focus`&&A()},W=()=>{s.trigger===`focus`&&j()},G=e=>{s.trigger===`contextmenu`&&(e.preventDefault(),e.stopPropagation(),_.value=e,A())},K=()=>{s.trigger===`hover`&&b()},q=()=>{s.trigger===`hover`&&j()},J=e=>{if(!s.closeOnClickOutside||!S.value)return;let t=e.target,n=u.value?.contains(t),r=d.value?.contains(t);!n&&!r&&j()},Y=e=>{if(!S.value)return;let t=e.target,n=u.value?.contains(t),r=d.value?.contains(t);n||r||j()},X=e=>{s.closeOnEsc&&e.key===`Escape`&&S.value&&j()},Z=e=>{if(!S.value)return;let t=e.target;d.value?.contains(t)||j()},Q=()=>{S.value&&j()};return(0,t.watch)(S,async e=>{e?(g.value=!1,await(0,t.nextTick)(),await z()):_.value=null}),(0,t.watch)(()=>s.placement,()=>{S.value&&z()}),(0,t.onMounted)(()=>{document.addEventListener(`click`,J,!0),document.addEventListener(`contextmenu`,Y,!0),document.addEventListener(`keydown`,X,!0),window.addEventListener(`resize`,Q,!0),document.addEventListener(`scroll`,Z,!0)}),(0,t.onBeforeUnmount)(()=>{b(),document.removeEventListener(`click`,J,!0),document.removeEventListener(`contextmenu`,Y,!0),document.removeEventListener(`keydown`,X,!0),window.removeEventListener(`resize`,Q,!0),document.removeEventListener(`scroll`,Z,!0)}),i({show:A,hide:j,toggle:M}),(i,a)=>((0,t.openBlock)(),(0,t.createElementBlock)(t.Fragment,null,[(0,t.createElementVNode)(`div`,{ref_key:`wrapperRef`,ref:l,class:`contents`},[(0,t.createElementVNode)(`div`,{ref_key:`triggerRef`,ref:u,class:(0,t.normalizeClass)((0,t.unref)(e.cn)(`st-popover-trigger inline-block`,s.triggerClass)),onBlur:W,onClick:B,onContextmenu:G,onFocus:U,onMouseenter:V,onMouseleave:H},[(0,t.renderSlot)(i.$slots,`trigger`,{},()=>[(0,t.renderSlot)(i.$slots,`default`)])],34)],512),((0,t.openBlock)(),(0,t.createBlock)(t.Teleport,{to:`body`},[(0,t.createVNode)(t.Transition,{"enter-active-class":`transition-[transform,opacity] duration-160 ease-[var(--animate-ease-menu)]`,"enter-from-class":`scale-94 opacity-0`,"leave-active-class":`transition-[transform,opacity] duration-100 ease`,"leave-to-class":`scale-96 opacity-0`,onAfterLeave:N},{default:(0,t.withCtx)(()=>[S.value?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,ref_key:`popoverRef`,ref:d,class:(0,t.normalizeClass)(w.value),style:(0,t.normalizeStyle)(T.value),onClick:a[0]||=(0,t.withModifiers)(()=>{},[`stop`]),onContextmenu:a[1]||=(0,t.withModifiers)(()=>{},[`prevent`]),onMouseenter:K,onMouseleave:q},[(0,t.createElementVNode)(`div`,n,[(0,t.renderSlot)(i.$slots,`content`)]),r.showArrow?((0,t.openBlock)(),(0,t.createElementBlock)(`div`,{key:0,class:(0,t.normalizeClass)(E.value)},null,2)):(0,t.createCommentVNode)(``,!0)],38)):(0,t.createCommentVNode)(``,!0)]),_:3})]))],64))}});exports.default=r;

package/dist/components/st-popover/st-popover.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,355 @@
+import { cn as e } from "../../utils/cn.js";
+import { Fragment as t, Teleport as n, Transition as r, computed as i, createBlock as a, createCommentVNode as o, createElementBlock as s, createElementVNode as c, createVNode as l, defineComponent as u, nextTick as d, normalizeClass as f, normalizeStyle as ee, onBeforeUnmount as te, onMounted as p, openBlock as m, ref as h, renderSlot as g, unref as ne, useAttrs as re, watch as _, withCtx as v, withModifiers as y } from "vue";
+//#region src/components/st-popover/st-popover.vue?vue&type=script&setup=true&lang.ts
+var ie = { class: "st-popover-content text-foreground" }, b = /*@__PURE__*/ u({
+	inheritAttrs: !1,
+	__name: "st-popover",
+	props: {
+		trigger: { default: "hover" },
+		placement: { default: "top-center" },
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
+		visible: {
+			type: Boolean,
+			default: void 0
+		},
+		offset: { default: void 0 },
+		gap: { default: 0 },
+		showArrow: {
+			type: Boolean,
+			default: !0
+		},
+		closeOnClickOutside: {
+			type: Boolean,
+			default: !0
+		},
+		closeOnEsc: {
+			type: Boolean,
+			default: !0
+		},
+		openDelay: { default: 150 },
+		closeDelay: { default: 200 },
+		triggerClass: { default: "" }
+	},
+	emits: ["update:visible", "visibleChange"],
+	setup(u, { expose: b, emit: x }) {
+		let S = re(), C = u, w = x, T = h(null), E = h(null), D = h(null), O = h(!1), k = h(C.placement), A = h({
+			top: 0,
+			left: 0
+		}), j = h("bottom center"), M = h(!1), N = h(null), P = null, F = null, I = () => {
+			P &&= (clearTimeout(P), null), F &&= (clearTimeout(F), null);
+		}, L = i(() => C.visible !== void 0), R = i({
+			get: () => L.value ? C.visible : O.value,
+			set: (e) => {
+				L.value ? w("update:visible", e) : O.value = e, w("visibleChange", e);
+			}
+		}), ae = i(() => C.offset === void 0 ? C.gap : C.offset), oe = i(() => e("st-popover", "fixed", "z-50", "rounded-radius", "bg-popover", "shadow-lg", "border", "border-border", `st-popover--${k.value}`, S.class)), se = i(() => {
+			let e = {
+				position: "fixed",
+				top: `${A.value.top}px`,
+				left: `${A.value.left}px`,
+				transformOrigin: j.value
+			};
+			M.value || (e.left = "-9999px", e.top = "-9999px", e.opacity = "0", e.visibility = "hidden");
+			let t = S.style;
+			return t ? {
+				...t,
+				...e
+			} : e;
+		}), ce = i(() => {
+			let [t, n] = k.value.split("-"), r = [
+				"st-popover-arrow",
+				"absolute",
+				"w-2",
+				"h-2",
+				"bg-popover",
+				"border",
+				"border-border",
+				"transform",
+				"rotate-45"
+			], i = {
+				top: [
+					"-bottom-1",
+					"border-t-0",
+					"border-l-0"
+				],
+				bottom: [
+					"-top-1",
+					"border-b-0",
+					"border-r-0"
+				],
+				left: [
+					"-right-1",
+					"border-l-0",
+					"border-t-0"
+				],
+				right: [
+					"-left-1",
+					"border-r-0",
+					"border-b-0"
+				]
+			}, a;
+			if (t === "top" || t === "bottom") switch (n) {
+				case "left":
+					a = ["left-2"];
+					break;
+				case "center":
+					a = ["left-1/2", "-translate-x-1/2"];
+					break;
+				case "right":
+					a = ["right-2"];
+					break;
+				default: a = ["left-1/2", "-translate-x-1/2"];
+			}
+			else switch (n) {
+				case "top":
+					a = ["top-2"];
+					break;
+				case "center":
+					a = ["top-1/2", "-translate-y-1/2"];
+					break;
+				case "bottom":
+					a = ["bottom-2"];
+					break;
+				default: a = ["top-1/2", "-translate-y-1/2"];
+			}
+			return e(r, i[t], a);
+		}), le = (e) => ({
+			"top-left": "bottom left",
+			"top-center": "bottom center",
+			"top-right": "bottom right",
+			"bottom-left": "top left",
+			"bottom-center": "top center",
+			"bottom-right": "top right",
+			"left-top": "center right",
+			"left-center": "center right",
+			"left-bottom": "center right",
+			"right-top": "center left",
+			"right-center": "center left",
+			"right-bottom": "center left"
+		})[e], ue = (e) => {
+			let [t, n] = e.split("-");
+			return `${{
+				top: "bottom",
+				bottom: "top",
+				left: "right",
+				right: "left"
+			}[t]}-${n}`;
+		}, z = (e, t) => {
+			let [n, r] = e.split("-");
+			return t === "horizontal" ? n === "top" || n === "bottom" ? `${n}-${{
+				left: "right",
+				center: "left",
+				right: "left"
+			}[r] || r}` : `${n}-${{
+				top: "bottom",
+				center: "top",
+				bottom: "top"
+			}[r] || r}` : n === "top" || n === "bottom" ? e : `${n}-${{
+				top: "bottom",
+				center: "top",
+				bottom: "top"
+			}[r] || r}`;
+		}, B = (e, t = !1) => {
+			C.disabled || (I(), e && (N.value = e), C.trigger === "hover" && !t && C.openDelay > 0 ? P = setTimeout(() => {
+				R.value = !0;
+			}, C.openDelay) : R.value = !0);
+		}, V = (e = !1) => {
+			I(), C.trigger === "hover" && !e && C.closeDelay > 0 ? F = setTimeout(() => {
+				R.value = !1;
+			}, C.closeDelay) : R.value = !1;
+		}, H = () => {
+			R.value ? V() : B();
+		}, de = () => {
+			M.value = !1;
+		}, U = (e, t, n, r) => {
+			let [i, a] = e.split("-"), o = 0, s = 0;
+			switch (i) {
+				case "top":
+					switch (o = t.top - n.height - r, a) {
+						case "left":
+							s = t.left;
+							break;
+						case "center":
+							s = t.left + (t.width - n.width) / 2;
+							break;
+						case "right":
+							s = t.right - n.width;
+							break;
+					}
+					break;
+				case "bottom":
+					switch (o = t.bottom + r, a) {
+						case "left":
+							s = t.left;
+							break;
+						case "center":
+							s = t.left + (t.width - n.width) / 2;
+							break;
+						case "right":
+							s = t.right - n.width;
+							break;
+					}
+					break;
+				case "left":
+					switch (s = t.left - n.width - r, a) {
+						case "top":
+							o = t.top;
+							break;
+						case "center":
+							o = t.top + (t.height - n.height) / 2;
+							break;
+						case "bottom":
+							o = t.bottom - n.height;
+							break;
+					}
+					break;
+				case "right":
+					switch (s = t.right + r, a) {
+						case "top":
+							o = t.top;
+							break;
+						case "center":
+							o = t.top + (t.height - n.height) / 2;
+							break;
+						case "bottom":
+							o = t.bottom - n.height;
+							break;
+					}
+					break;
+			}
+			return {
+				top: o,
+				left: s
+			};
+		}, W = (e, t, n, r, i) => {
+			let [a] = e.split("-");
+			switch (a) {
+				case "top": return t.top < 0;
+				case "bottom": return t.top + n.height > i;
+				case "left": return t.left < 0;
+				case "right": return t.left + n.width > r;
+				default: return !1;
+			}
+		}, G = (e, t, n) => e.left < 0 || e.left + t.width > n, K = (e, t, n) => e.top < 0 || e.top + t.height > n, fe = (e, t, n, r) => {
+			if (!N.value) return;
+			let i = N.value.clientX, a = N.value.clientY, o = i + r, s = a + r;
+			o + n.width > e && (o = i - n.width - r), s + n.height > t && (s = a - n.height - r), o = Math.max(r, Math.min(o, e - n.width - r)), s = Math.max(r, Math.min(s, t - n.height - r)), A.value = {
+				top: s,
+				left: o
+			};
+			let c = o <= i + r ? "left" : "right";
+			j.value = `${s <= a + r ? "top" : "bottom"} ${c}`, k.value = "bottom-left";
+		}, q = async () => {
+			if (await d(), !E.value || !D.value) return;
+			let e = D.value.getBoundingClientRect(), { innerWidth: t, innerHeight: n } = window, r = ae.value;
+			if (C.trigger === "contextmenu" && N.value) {
+				fe(t, n, e, r), M.value = !0;
+				return;
+			}
+			let i = E.value.getBoundingClientRect(), a = C.placement, o = U(a, i, e, r);
+			if (W(a, o, e, t, n)) {
+				let s = ue(a), c = U(s, i, e, r);
+				W(s, c, e, t, n) || (a = s, o = c);
+			}
+			if (G(o, e, t)) {
+				let n = z(a, "horizontal"), s = U(n, i, e, r);
+				G(s, e, t) || (a = n, o = s);
+			}
+			if (K(o, e, n)) {
+				let t = z(a, "vertical"), s = U(t, i, e, r);
+				K(s, e, n) || (a = t, o = s);
+			}
+			let { top: s, left: c } = o;
+			s = Math.max(0, Math.min(s, n - e.height)), c = Math.max(0, Math.min(c, t - e.width)), k.value = a, A.value = {
+				top: s,
+				left: c
+			}, j.value = le(a), M.value = !0;
+		}, pe = (e) => {
+			C.trigger === "click" && (e.stopPropagation(), H());
+		}, me = () => {
+			C.trigger === "hover" && (I(), B());
+		}, he = () => {
+			C.trigger === "hover" && V();
+		}, ge = () => {
+			C.trigger === "focus" && B();
+		}, _e = () => {
+			C.trigger === "focus" && V();
+		}, ve = (e) => {
+			C.trigger === "contextmenu" && (e.preventDefault(), e.stopPropagation(), N.value = e, B());
+		}, J = () => {
+			C.trigger === "hover" && I();
+		}, ye = () => {
+			C.trigger === "hover" && V();
+		}, Y = (e) => {
+			if (!C.closeOnClickOutside || !R.value) return;
+			let t = e.target, n = E.value?.contains(t), r = D.value?.contains(t);
+			!n && !r && V();
+		}, X = (e) => {
+			if (!R.value) return;
+			let t = e.target, n = E.value?.contains(t), r = D.value?.contains(t);
+			n || r || V();
+		}, Z = (e) => {
+			C.closeOnEsc && e.key === "Escape" && R.value && V();
+		}, Q = (e) => {
+			if (!R.value) return;
+			let t = e.target;
+			D.value?.contains(t) || V();
+		}, $ = () => {
+			R.value && V();
+		};
+		return _(R, async (e) => {
+			e ? (M.value = !1, await d(), await q()) : N.value = null;
+		}), _(() => C.placement, () => {
+			R.value && q();
+		}), p(() => {
+			document.addEventListener("click", Y, !0), document.addEventListener("contextmenu", X, !0), document.addEventListener("keydown", Z, !0), window.addEventListener("resize", $, !0), document.addEventListener("scroll", Q, !0);
+		}), te(() => {
+			I(), document.removeEventListener("click", Y, !0), document.removeEventListener("contextmenu", X, !0), document.removeEventListener("keydown", Z, !0), window.removeEventListener("resize", $, !0), document.removeEventListener("scroll", Q, !0);
+		}), b({
+			show: B,
+			hide: V,
+			toggle: H
+		}), (i, d) => (m(), s(t, null, [c("div", {
+			ref_key: "wrapperRef",
+			ref: T,
+			class: "contents"
+		}, [c("div", {
+			ref_key: "triggerRef",
+			ref: E,
+			class: f(ne(e)("st-popover-trigger inline-block", C.triggerClass)),
+			onBlur: _e,
+			onClick: pe,
+			onContextmenu: ve,
+			onFocus: ge,
+			onMouseenter: me,
+			onMouseleave: he
+		}, [g(i.$slots, "trigger", {}, () => [g(i.$slots, "default")])], 34)], 512), (m(), a(n, { to: "body" }, [l(r, {
+			"enter-active-class": "transition-[transform,opacity] duration-160 ease-[var(--animate-ease-menu)]",
+			"enter-from-class": "scale-94 opacity-0",
+			"leave-active-class": "transition-[transform,opacity] duration-100 ease",
+			"leave-to-class": "scale-96 opacity-0",
+			onAfterLeave: de
+		}, {
+			default: v(() => [R.value ? (m(), s("div", {
+				key: 0,
+				ref_key: "popoverRef",
+				ref: D,
+				class: f(oe.value),
+				style: ee(se.value),
+				onClick: d[0] ||= y(() => {}, ["stop"]),
+				onContextmenu: d[1] ||= y(() => {}, ["prevent"]),
+				onMouseenter: J,
+				onMouseleave: ye
+			}, [c("div", ie, [g(i.$slots, "content")]), u.showArrow ? (m(), s("div", {
+				key: 0,
+				class: f(ce.value)
+			}, null, 2)) : o("", !0)], 38)) : o("", !0)]),
+			_: 3
+		})]))], 64));
+	}
+});
+//#endregion
+export { b as default };