@type-dom/ui 0.0.10 → 0.1.1

package/src/hooks/use-aria/index.d.ts

@@ -0,0 +1,50 @@
+export declare const ariaProps: {
+    /**
+     * @description native `aria-label` attribute
+     */
+    ariaLabel: StringConstructor;
+    /**
+     * @description native `aria-orientation` attribute
+     */
+    ariaOrientation: {
+        type: StringConstructor;
+        values: string[];
+    };
+    /**
+     * @description native `aria-controls` attribute
+     */
+    ariaControls: StringConstructor;
+};
+export declare const useAriaProps: <T extends keyof typeof ariaProps>(arias: Array<T>) => T extends infer T_1 extends keyof {
+    /**
+     * @description native `aria-label` attribute
+     */
+    ariaLabel: StringConstructor;
+    /**
+     * @description native `aria-orientation` attribute
+     */
+    ariaOrientation: {
+        type: StringConstructor;
+        values: string[];
+    };
+    /**
+     * @description native `aria-controls` attribute
+     */
+    ariaControls: StringConstructor;
+} ? { [P in T_1]: {
+    /**
+     * @description native `aria-label` attribute
+     */
+    ariaLabel: StringConstructor;
+    /**
+     * @description native `aria-orientation` attribute
+     */
+    ariaOrientation: {
+        type: StringConstructor;
+        values: string[];
+    };
+    /**
+     * @description native `aria-controls` attribute
+     */
+    ariaControls: StringConstructor;
+}[P]; } : never;

package/src/hooks/use-aria/index.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAriaProps = exports.ariaProps = void 0;
+const utils_1 = require("@type-dom/utils");
+exports.ariaProps = {
+    /**
+     * @description native `aria-label` attribute
+     */
+    ariaLabel: String,
+    /**
+     * @description native `aria-orientation` attribute
+     */
+    ariaOrientation: {
+        type: String,
+        values: ['horizontal', 'vertical', 'undefined'],
+    },
+    /**
+     * @description native `aria-controls` attribute
+     */
+    ariaControls: String,
+};
+const useAriaProps = (arias) => {
+    return (0, utils_1.pick)(exports.ariaProps, arias);
+};
+exports.useAriaProps = useAriaProps;

package/src/hooks/use-attrs/index.d.ts

@@ -0,0 +1,7 @@
+import { Computed } from '@type-dom/signals';
+interface Params {
+    excludeListeners?: boolean;
+    excludeKeys?: Computed<string[]>;
+}
+export declare const useAttrs: (params?: Params) => Computed;
+export {};

package/src/hooks/use-attrs/index.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAttrs = void 0;
+const signals_1 = require("@type-dom/signals");
+const framework_1 = require("@type-dom/framework");
+const utils_1 = require("@type-dom/utils");
+const DEFAULT_EXCLUDE_KEYS = ['class', 'style'];
+const LISTENER_PREFIX = /^on[A-Z]/;
+const useAttrs = (params = {}) => {
+    const { excludeListeners = false, excludeKeys } = params;
+    const allExcludeKeys = (0, signals_1.computed)(() => {
+        return ((excludeKeys === null || excludeKeys === void 0 ? void 0 : excludeKeys.get()) || []).concat(DEFAULT_EXCLUDE_KEYS);
+    });
+    const instance = (0, framework_1.getCurrentInstance)();
+    if (!instance) {
+        (0, utils_1.debugWarn)('use-attrs', 'getCurrentInstance() returned null. useAttrs() must be called at the top of a setup function');
+        return (0, signals_1.computed)(() => ({}));
+    }
+    return (0, signals_1.computed)(() => (0, utils_1.fromPairs)(Object.entries(instance.props.attrObj).filter(([key]) => !allExcludeKeys.get().includes(key) &&
+        !(excludeListeners && LISTENER_PREFIX.test(key)))));
+};
+exports.useAttrs = useAttrs;

package/src/hooks/use-calc-input-width/index.d.ts

@@ -0,0 +1,7 @@
+export declare function useCalcInputWidth(): {
+    calculatorRef: import("@type-dom/signals").Signal<HTMLElement | undefined>;
+    calculatorWidth: import("@type-dom/signals").Signal<number>;
+    inputStyle: import("@type-dom/signals").Computed<{
+        minWidth: string;
+    }>;
+};

package/src/hooks/use-calc-input-width/index.js

@@ -0,0 +1,25 @@
+"use strict";
+// import { computed, ref, shallowRef } from 'vue'
+// import { useResizeObserver } from '@vueuse/core'
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCalcInputWidth = useCalcInputWidth;
+const signals_1 = require("@type-dom/signals");
+const framework_1 = require("@type-dom/framework");
+function useCalcInputWidth() {
+    const calculatorRef = (0, signals_1.signal)();
+    const calculatorWidth = (0, signals_1.signal)(0);
+    const MINIMUM_INPUT_WIDTH = 11;
+    const inputStyle = (0, signals_1.computed)(() => ({
+        minWidth: `${Math.max(calculatorWidth.get(), MINIMUM_INPUT_WIDTH)}px`,
+    }));
+    const resetCalculatorWidth = () => {
+        var _a, _b;
+        calculatorWidth.set((_b = (_a = calculatorRef.get()) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect().width) !== null && _b !== void 0 ? _b : 0);
+    };
+    (0, framework_1.useResizeObserver)(calculatorRef, resetCalculatorWidth);
+    return {
+        calculatorRef,
+        calculatorWidth,
+        inputStyle,
+    };
+}

package/src/hooks/use-composition/index.d.ts

@@ -0,0 +1,12 @@
+interface UseCompositionOptions {
+    afterComposition: (event?: CompositionEvent) => void;
+    emit?: ((event: 'compositionstart', evt?: CompositionEvent) => void) & ((event: 'compositionupdate', evt?: CompositionEvent) => void) & ((event: 'compositionend', evt?: CompositionEvent) => void);
+}
+export declare function useComposition({ afterComposition, emit, }: UseCompositionOptions): {
+    isComposing: import("@type-dom/signals").Signal<boolean>;
+    handleComposition: (event?: CompositionEvent) => void;
+    handleCompositionStart: (event?: CompositionEvent) => void;
+    handleCompositionUpdate: (event?: CompositionEvent) => void;
+    handleCompositionEnd: (event?: CompositionEvent) => void;
+};
+export {};

package/src/hooks/use-composition/index.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useComposition = useComposition;
+const signals_1 = require("@type-dom/signals");
+const framework_1 = require("@type-dom/framework");
+const utils_1 = require("@type-dom/utils");
+function useComposition({ afterComposition, emit, }) {
+    const isComposing = (0, signals_1.signal)(false);
+    const handleCompositionStart = (event) => {
+        emit === null || emit === void 0 ? void 0 : emit('compositionstart', event);
+        isComposing.set(true);
+    };
+    const handleCompositionUpdate = (event) => {
+        var _a;
+        emit === null || emit === void 0 ? void 0 : emit('compositionupdate', event);
+        const text = (_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.value;
+        const lastCharacter = text[text.length - 1] || '';
+        isComposing.set(!(0, utils_1.isKorean)(lastCharacter));
+    };
+    const handleCompositionEnd = (event) => {
+        emit === null || emit === void 0 ? void 0 : emit('compositionend', event);
+        if (isComposing.get()) {
+            isComposing.set(false);
+            (0, framework_1.nextTick)(() => afterComposition(event));
+        }
+    };
+    const handleComposition = (event) => {
+        (event === null || event === void 0 ? void 0 : event.type) === 'compositionend'
+            ? handleCompositionEnd(event)
+            : handleCompositionUpdate(event);
+    };
+    return {
+        isComposing,
+        handleComposition,
+        handleCompositionStart,
+        handleCompositionUpdate,
+        handleCompositionEnd,
+    };
+}

package/src/hooks/use-cursor/index.d.ts

@@ -0,0 +1,2 @@
+import { Signal } from '@type-dom/signals';
+export declare function useCursor(input: Signal<HTMLInputElement | undefined>): [() => void, () => void];

package/src/hooks/{use-cursor.js → use-cursor/index.js}

@@ -1,39 +1,37 @@
 "use strict";
-// element plus hooks useCursor
-// Keep input cursor in the correct position when we use formatter.
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useCursor = useCursor;
+// Keep input cursor in the correct position when we use formatter.
 function useCursor(input) {
-    let selectionRef;
+    let selectionInfo;
     function recordCursor() {
-        console.log('recordCursor . ');
-        if (input === undefined) {
+        if (input.get() == undefined) {
             return;
         }
-        const { selectionStart, selectionEnd, value } = input;
-        if (selectionStart === null || selectionEnd === null) {
+        const { selectionStart, selectionEnd, value } = input.get();
+        if (selectionStart == null || selectionEnd == null) {
             return;
         }
         const beforeTxt = value.slice(0, Math.max(0, selectionStart));
         const afterTxt = value.slice(Math.max(0, selectionEnd));
-        selectionRef = {
+        selectionInfo = {
             selectionStart,
             selectionEnd,
             value,
             beforeTxt,
-            afterTxt
+            afterTxt,
         };
     }
     function setCursor() {
-        console.log('setCursor . ');
-        if (input === undefined || selectionRef === undefined) {
+        var _a;
+        if (input.get() == undefined || selectionInfo == undefined) {
             return;
         }
-        const { value } = input;
-        const { beforeTxt, afterTxt, selectionStart } = selectionRef;
-        if (beforeTxt === undefined ||
-            afterTxt === undefined ||
-            selectionStart === undefined) {
+        const { value } = input.get();
+        const { beforeTxt, afterTxt, selectionStart } = selectionInfo;
+        if (beforeTxt == undefined ||
+            afterTxt == undefined ||
+            selectionStart == undefined) {
             return;
         }
         let startPos = value.length;
@@ -50,7 +48,7 @@ function useCursor(input) {
                 startPos = newIndex + 1;
             }
         }
-        input.setSelectionRange(startPos, startPos);
+        (_a = input.get()) === null || _a === void 0 ? void 0 : _a.setSelectionRange(startPos, startPos);
     }
     return [recordCursor, setCursor];
 }

package/src/hooks/use-delayed-toggle/index.d.ts

@@ -0,0 +1,24 @@
+export declare const useDelayedToggleProps: UseDelayedToggleProps;
+export interface UseDelayedToggleProps {
+    /**
+     * @description delay of appearance, in millisecond
+     *     default: 0,
+     */
+    showAfter?: number;
+    /**
+     * @description delay of disappear, in millisecond
+     *     default: 200,
+     */
+    hideAfter?: number;
+    /**
+     * @description disappear automatically, in millisecond
+     *     default: 0,
+     */
+    autoClose?: number;
+    open?: (event?: Event) => void;
+    close?: (event?: Event) => void;
+}
+export declare const useDelayedToggle: ({ showAfter, hideAfter, autoClose, open, close, }: UseDelayedToggleProps) => {
+    onOpen: (event?: Event) => void;
+    onClose: (event?: Event) => void;
+};

package/src/hooks/use-delayed-toggle/index.js

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDelayedToggle = exports.useDelayedToggleProps = void 0;
+// import { unref } from 'vue'
+// import { buildProps, isNumber } from '@element-plus/utils'
+const use_timeout_1 = require("../use-timeout");
+const signals_1 = require("@type-dom/signals");
+const utils_1 = require("@type-dom/utils");
+// import type { ExtractPropTypes, ToRefs } from 'vue'
+exports.useDelayedToggleProps = {
+    showAfter: 0,
+    hideAfter: 200,
+    autoClose: 0,
+};
+const useDelayedToggle = ({ showAfter, hideAfter, autoClose, open, close, }) => {
+    const { registerTimeout } = (0, use_timeout_1.useTimeout)();
+    const { registerTimeout: registerTimeoutForAutoClose, cancelTimeout: cancelTimeoutForAutoClose, } = (0, use_timeout_1.useTimeout)();
+    const onOpen = (event) => {
+        console.log('use-delayed-toggle onOpen');
+        registerTimeout(() => {
+            open === null || open === void 0 ? void 0 : open(event);
+            const _autoClose = (0, signals_1.unref)(autoClose);
+            if ((0, utils_1.isNumber)(_autoClose) && _autoClose > 0) {
+                registerTimeoutForAutoClose(() => {
+                    close === null || close === void 0 ? void 0 : close(event);
+                }, _autoClose);
+            }
+        }, (0, signals_1.unref)(showAfter));
+    };
+    const onClose = (event) => {
+        cancelTimeoutForAutoClose();
+        registerTimeout(() => {
+            close === null || close === void 0 ? void 0 : close(event);
+        }, (0, signals_1.unref)(hideAfter));
+    };
+    return {
+        onOpen,
+        onClose,
+    };
+};
+exports.useDelayedToggle = useDelayedToggle;

package/src/hooks/use-deprecated/index.d.ts

@@ -0,0 +1,11 @@
+import { MaybeRef } from '@type-dom/signals';
+type DeprecationParam = {
+    from: string;
+    replacement: string;
+    scope: string;
+    version: string;
+    ref: string;
+    type?: 'API' | 'Attribute' | 'Event' | 'Slot';
+};
+export declare const useDeprecated: ({ from, replacement, scope, version, ref, type }: DeprecationParam, condition: MaybeRef<boolean>) => void;
+export {};

package/src/hooks/use-deprecated/index.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDeprecated = void 0;
+const signals_1 = require("@type-dom/signals");
+const utils_1 = require("@type-dom/utils");
+const useDeprecated = ({ from, replacement, scope, version, ref, type = 'API' }, condition) => {
+    (0, signals_1.watch)(() => (0, signals_1.unref)(condition), (val) => {
+        if (val) {
+            (0, utils_1.debugWarn)(scope, `[${type}] ${from} is about to be deprecated in version ${version}, please use ${replacement} instead.
+For more detail, please visit: ${ref}
+`);
+        }
+    }, {
+        immediate: true,
+    });
+};
+exports.useDeprecated = useDeprecated;

package/src/hooks/use-draggable/index.d.ts

@@ -0,0 +1,4 @@
+import { Computed, Ref } from '@type-dom/signals';
+export declare const useDraggable: (targetRef: Ref<HTMLElement | undefined>, dragRef: Ref<HTMLElement | undefined>, draggable: Computed<boolean | undefined>, overflow?: Computed<boolean | undefined>) => {
+    resetPosition: () => void;
+};

package/src/hooks/use-draggable/index.js

@@ -0,0 +1,90 @@
+"use strict";
+// import { onBeforeUnmount, onMounted, watchEffect } from 'vue'
+// import { addUnit } from '@element-plus/utils'
+// import type { ComputedRef, Ref } from 'vue'
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDraggable = void 0;
+const signals_1 = require("@type-dom/signals");
+const utils_1 = require("@type-dom/utils");
+const framework_1 = require("@type-dom/framework");
+const useDraggable = (targetRef, dragRef, draggable, overflow) => {
+    let transform = {
+        offsetX: 0,
+        offsetY: 0,
+    };
+    const onMousedown = (e) => {
+        const downX = e.clientX;
+        const downY = e.clientY;
+        const { offsetX, offsetY } = transform;
+        const targetRect = (0, signals_1.unref)(targetRef).getBoundingClientRect();
+        const targetLeft = targetRect.left;
+        const targetTop = targetRect.top;
+        const targetWidth = targetRect.width;
+        const targetHeight = targetRect.height;
+        const clientWidth = document.documentElement.clientWidth;
+        const clientHeight = document.documentElement.clientHeight;
+        const minLeft = -targetLeft + offsetX;
+        const minTop = -targetTop + offsetY;
+        const maxLeft = clientWidth - targetLeft - targetWidth + offsetX;
+        const maxTop = clientHeight - targetTop - targetHeight + offsetY;
+        const onMousemove = (e) => {
+            let moveX = offsetX + e.clientX - downX;
+            let moveY = offsetY + e.clientY - downY;
+            if (!(0, signals_1.unref)(overflow)) {
+                moveX = Math.min(Math.max(moveX, minLeft), maxLeft);
+                moveY = Math.min(Math.max(moveY, minTop), maxTop);
+            }
+            transform = {
+                offsetX: moveX,
+                offsetY: moveY,
+            };
+            if ((0, signals_1.unref)(targetRef)) {
+                (0, signals_1.unref)(targetRef).style.transform = `translate(${(0, utils_1.addUnit)(moveX)}, ${(0, utils_1.addUnit)(moveY)})`;
+            }
+        };
+        const onMouseup = () => {
+            document.removeEventListener('mousemove', onMousemove);
+            document.removeEventListener('mouseup', onMouseup);
+        };
+        document.addEventListener('mousemove', onMousemove);
+        document.addEventListener('mouseup', onMouseup);
+    };
+    const onDraggable = () => {
+        var _a;
+        if ((0, signals_1.unref)(dragRef) && (0, signals_1.unref)(targetRef)) {
+            (_a = (0, signals_1.unref)(dragRef)) === null || _a === void 0 ? void 0 : _a.addEventListener('mousedown', onMousedown);
+        }
+    };
+    const offDraggable = () => {
+        var _a;
+        if ((0, signals_1.unref)(dragRef) && (0, signals_1.unref)(targetRef)) {
+            (_a = (0, signals_1.unref)(dragRef)) === null || _a === void 0 ? void 0 : _a.removeEventListener('mousedown', onMousedown);
+        }
+    };
+    const resetPosition = () => {
+        transform = {
+            offsetX: 0,
+            offsetY: 0,
+        };
+        if ((0, signals_1.unref)(targetRef)) {
+            (0, signals_1.unref)(targetRef).style.transform = 'none';
+        }
+    };
+    (0, framework_1.onMounted)(() => {
+        (0, signals_1.effect)(() => {
+            if ((0, signals_1.unref)(draggable)) {
+                onDraggable();
+            }
+            else {
+                offDraggable();
+            }
+        });
+    });
+    (0, framework_1.onBeforeUnmount)(() => {
+        offDraggable();
+    });
+    return {
+        resetPosition,
+    };
+};
+exports.useDraggable = useDraggable;

package/src/hooks/use-empty-values/index.d.ts

@@ -0,0 +1,44 @@
+import { InjectionKey, AnyFn } from '@type-dom/framework';
+export type EmptyValuesContext = {
+    /**
+     * @description empty values supported by the component
+     */
+    emptyValues?: Array<any>;
+    /**
+     * @description return value when cleared, if you want to set `undefined`, use `() => undefined`
+     */
+    valueOnClear?: string | number | boolean | AnyFn;
+};
+export declare const emptyValuesContextKey: InjectionKey<EmptyValuesContext>;
+export declare const SCOPE = "use-empty-values";
+export declare const DEFAULT_EMPTY_VALUES: (string | null | undefined)[];
+export declare const DEFAULT_VALUE_ON_CLEAR: undefined;
+export interface UseEmptyValuesProps {
+    /**
+     * @description empty values supported by the component
+     */
+    emptyValues?: any[];
+    /**
+     * @description return value when cleared, if you want to set `undefined`, use `() => undefined`
+     */
+    valueOnClear?: string | number | boolean | AnyFn;
+}
+export declare const useEmptyValuesProps: {
+    /**
+     * @description empty values supported by the component
+     */
+    emptyValues: ArrayConstructor;
+    /**
+     * @description return value when cleared, if you want to set `undefined`, use `() => undefined`
+     */
+    valueOnClear: {
+        type: (StringConstructor | NumberConstructor | BooleanConstructor | FunctionConstructor)[];
+        default: undefined;
+        validator: (val: any) => boolean;
+    };
+};
+export declare const useEmptyValues: (props: EmptyValuesContext, defaultValue?: null | undefined) => {
+    emptyValues: any[];
+    valueOnClear: import("@type-dom/signals").Computed<any>;
+    isEmptyValue: (value: any) => boolean;
+};

package/src/hooks/use-empty-values/index.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useEmptyValues = exports.useEmptyValuesProps = exports.DEFAULT_VALUE_ON_CLEAR = exports.DEFAULT_EMPTY_VALUES = exports.SCOPE = exports.emptyValuesContextKey = void 0;
+const utils_1 = require("@type-dom/utils");
+const framework_1 = require("@type-dom/framework");
+const signals_1 = require("@type-dom/signals");
+exports.emptyValuesContextKey = Symbol('emptyValuesContextKey');
+exports.SCOPE = 'use-empty-values';
+exports.DEFAULT_EMPTY_VALUES = ['', undefined, null];
+exports.DEFAULT_VALUE_ON_CLEAR = undefined;
+exports.useEmptyValuesProps = {
+    /**
+     * @description empty values supported by the component
+     */
+    emptyValues: Array,
+    /**
+     * @description return value when cleared, if you want to set `undefined`, use `() => undefined`
+     */
+    valueOnClear: {
+        type: [String, Number, Boolean, Function],
+        default: undefined,
+        validator: (val) => ((0, utils_1.isFunction)(val) ? !val() : !val),
+    },
+};
+const useEmptyValues = (props, defaultValue) => {
+    const config = (0, framework_1.getCurrentInstance)()
+        ? (0, framework_1.inject)(exports.emptyValuesContextKey, {})
+        : {};
+    const emptyValues = props.emptyValues || (config === null || config === void 0 ? void 0 : config.emptyValues) || exports.DEFAULT_EMPTY_VALUES;
+    const valueOnClear = (0, signals_1.computed)(() => {
+        // function is used for undefined cause undefined can't be a value of prop
+        if ((0, utils_1.isFunction)(props.valueOnClear)) {
+            return props.valueOnClear();
+        }
+        else if (props.valueOnClear !== undefined) {
+            return props.valueOnClear;
+        }
+        else if ((0, utils_1.isFunction)(config.valueOnClear)) {
+            return config.valueOnClear();
+        }
+        else if (config.valueOnClear !== undefined) {
+            return config.valueOnClear;
+        }
+        return defaultValue !== undefined ? defaultValue : exports.DEFAULT_VALUE_ON_CLEAR;
+    });
+    const isEmptyValue = (value) => {
+        return emptyValues.includes(value);
+    };
+    if (!emptyValues.includes(valueOnClear)) {
+        (0, utils_1.debugWarn)(exports.SCOPE, 'value-on-clear should be a value of empty-values');
+    }
+    return {
+        emptyValues,
+        valueOnClear,
+        isEmptyValue,
+    };
+};
+exports.useEmptyValues = useEmptyValues;

package/src/hooks/use-escape-keydown/index.d.ts

@@ -0,0 +1 @@
+export declare const useEscapeKeydown: (handler: (e: KeyboardEvent) => void) => void;

package/src/hooks/{use-escape-keydown.js → use-escape-keydown/index.js}

@@ -2,30 +2,28 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useEscapeKeydown = void 0;
 const utils_1 = require("@type-dom/utils");
+const framework_1 = require("@type-dom/framework");
+const aria_1 = require("../../constants/aria");
 let registeredEscapeHandlers = [];
-const cachedHandler = (e) => {
-    const event = e;
-    if (event.key === utils_1.EVENT_CODE.esc) {
+const cachedHandler = (event) => {
+    if (event.code === aria_1.EVENT_CODE.esc) {
         registeredEscapeHandlers.forEach((registeredHandler) => registeredHandler(event));
     }
 };
 const useEscapeKeydown = (handler) => {
-    const mounted = () => {
+    (0, framework_1.onMounted)(() => {
         if (registeredEscapeHandlers.length === 0) {
             document.addEventListener('keydown', cachedHandler);
         }
-        if (utils_1.isClient) {
+        if (utils_1.isClient)
             registeredEscapeHandlers.push(handler);
-        }
-    };
-    const beforeDestroy = () => {
+    });
+    (0, framework_1.onBeforeUnmount)(() => {
         registeredEscapeHandlers = registeredEscapeHandlers.filter((registeredHandler) => registeredHandler !== handler);
         if (registeredEscapeHandlers.length === 0) {
-            if (utils_1.isClient) {
+            if (utils_1.isClient)
                 document.removeEventListener('keydown', cachedHandler);
-            }
         }
-    };
-    return { mounted, beforeDestroy };
+    });
 };
 exports.useEscapeKeydown = useEscapeKeydown;

package/src/hooks/use-floating/index.d.ts

@@ -0,0 +1,15 @@
+import { Middleware, Placement, SideObject, Strategy } from '@type-dom/popper';
+import { Ref, ToRefs } from '@type-dom/signals';
+export declare const useFloatingProps: {};
+export type UseFloatingProps = ToRefs<{
+    middleware: Array<Middleware>;
+    placement: Placement;
+    strategy: Strategy;
+}>;
+export declare const getPositionDataWithUnit: <T extends Record<string, number>>(record: T | undefined, key: keyof T) => string;
+export declare const useFloating: ({ middleware, placement, strategy, }: UseFloatingProps) => any;
+export type ArrowMiddlewareProps = {
+    arrowRef: Ref<HTMLElement | null | undefined>;
+    padding?: number | SideObject;
+};
+export declare const arrowMiddleware: ({ arrowRef, padding, }: ArrowMiddlewareProps) => Middleware;