@bouku/core 0.0.1

package/dist/ui/text/badge.d.ts

@@ -0,0 +1,18 @@
+import type { Component } from "../../utils";
+type Props = Component & {
+    color?: string;
+    icon?: React.ReactNode;
+    size?: "xs" | "sm" | "md";
+};
+/**
+ * Color-themed badge component.
+ *
+ * To use a CSS variable it must exist and be passed in the
+ * form `--variable-name`. Any other format may cause unexpected
+ * results. CSS variables use 'color-mix' which is not supported in
+ * some old browsers such as Safari 15.3 and Internet Explorer.
+ *
+ * @param {string} color - Color of badge. (optional, default = accent)
+**/
+export declare function Badge({ style, color, size, icon, children }: Props): import("react").JSX.Element | null;
+export default Badge;

package/dist/ui/text/badge.js

@@ -0,0 +1,42 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Badge = Badge;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const style_1 = require("@bouko/style");
+const tailwind_variants_1 = require("tailwind-variants");
+/**
+ * Color-themed badge component.
+ *
+ * To use a CSS variable it must exist and be passed in the
+ * form `--variable-name`. Any other format may cause unexpected
+ * results. CSS variables use 'color-mix' which is not supported in
+ * some old browsers such as Safari 15.3 and Internet Explorer.
+ *
+ * @param {string} color - Color of badge. (optional, default = accent)
+**/
+function Badge({ style, color = "--color-accent", size = "md", icon, children }) {
+    if (!children)
+        return null;
+    if (color === "future")
+        return ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2 test-badge", children: [icon && (0, jsx_runtime_1.jsx)("div", { className: "text-primary-dark", children: icon }), (0, jsx_runtime_1.jsx)("span", { children: children })] }));
+    return ((0, jsx_runtime_1.jsx)("span", { className: (0, style_1.cn)(base({ size }), style), style: styles(color), children: children }));
+}
+const styles = (color) => ({
+    background: (0, style_1.opacitize)(color),
+    border: `1px solid var(${color})`,
+    borderRadius: "calc(infinity * 1px)",
+    textAlign: "center",
+    fontWeight: "600",
+    color: "var(--color-primary)"
+});
+const base = (0, tailwind_variants_1.tv)({
+    base: "w-min",
+    variants: {
+        size: {
+            xs: "px-1 py-px text-[0.5rem]",
+            sm: "px-1 py-px text-xs",
+            md: "px-2 py-1 text-sm"
+        }
+    }
+});
+exports.default = Badge;

package/dist/ui/text/input.d.ts

@@ -0,0 +1,39 @@
+import { ReactNode } from "react";
+type FieldProps<T> = {
+    id?: string;
+    label?: string;
+    style?: string;
+    value?: T;
+    update?: (x: T) => void;
+    updateForm?: (id: string, x: T) => void;
+    required?: boolean;
+    disabled?: boolean;
+    note?: ReactNode;
+};
+type Variant = "normal" | "ghost";
+type Props<T> = FieldProps<T> & {
+    type?: "text" | "number" | "email" | "password";
+    variant?: Variant;
+    style?: string;
+    placeholder?: string;
+    onEnter?: (x: string) => void;
+};
+/**
+ * Text field component.
+ *
+ * Wraps the native `input` element with custom styling and validation.
+ * It displays an optional label and note, and can be marked as required.
+ * Optional callback for when the user presses `Enter` key.
+ * The value is controlled externally via props, usually `useState`.
+ *
+ * Variants:
+ *  - `normal`: Standard input with primary color scheme.
+ *  - `ghost`: Transparent for injecting input inside other component.
+ *
+ * @param {Variant} variant - Visual style variant. (optional, default = normal)
+ * @param {string} style - Additional class names for styling. (optional)
+ * @param {string} placeholder - Placeholder text for the input. (optional)
+ * @param {Function} onEnter - Callback when `Enter` key is pressed. (optional)
+**/
+export default function Input<T>({ id, type, variant, style, value, update, updateForm, onEnter, disabled, placeholder, ...props }: Props<T>): import("react").JSX.Element;
+export {};

package/dist/ui/text/input.js

@@ -0,0 +1,50 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = Input;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const style_1 = require("@bouko/style");
+const tailwind_variants_1 = require("tailwind-variants");
+function Field({ style, label, required = true, note, children }) {
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, style_1.cn)(fieldStyles.container, style), children: [label && (0, jsx_runtime_1.jsxs)("span", { className: fieldStyles.label, children: [label, " ", !required ? (0, jsx_runtime_1.jsx)("span", { className: "italic text-slate-400", children: "(optional)" }) : ""] }), children, note && (0, jsx_runtime_1.jsx)("span", { className: fieldStyles.note, children: note })] }));
+}
+const fieldStyles = {
+    container: "flex flex-col shrink-0 gap-1 overflow-hidden",
+    label: "text-xs text-primary-dark",
+    note: "mt-1 text-xs text-slate-500 whitespace-pre-line"
+};
+/**
+ * Text field component.
+ *
+ * Wraps the native `input` element with custom styling and validation.
+ * It displays an optional label and note, and can be marked as required.
+ * Optional callback for when the user presses `Enter` key.
+ * The value is controlled externally via props, usually `useState`.
+ *
+ * Variants:
+ *  - `normal`: Standard input with primary color scheme.
+ *  - `ghost`: Transparent for injecting input inside other component.
+ *
+ * @param {Variant} variant - Visual style variant. (optional, default = normal)
+ * @param {string} style - Additional class names for styling. (optional)
+ * @param {string} placeholder - Placeholder text for the input. (optional)
+ * @param {Function} onEnter - Callback when `Enter` key is pressed. (optional)
+**/
+function Input({ id, type = "text", variant, style, value, update, updateForm, onEnter, disabled, placeholder, ...props }) {
+    const handleUpdate = (value) => {
+        if (id && updateForm)
+            updateForm(id, value);
+        else if (update)
+            update(value);
+    };
+    return ((0, jsx_runtime_1.jsx)(Field, { ...props, children: (0, jsx_runtime_1.jsx)("input", { type: type, className: (0, style_1.cn)(styles({ variant }), style), placeholder: placeholder || `Enter ${id}`, value: value, onChange: ({ target: { value } }) => handleUpdate(value), onKeyUp: ({ key }) => key === "Enter" && value ? onEnter?.(value) : null, disabled: disabled }) }));
+}
+const styles = (0, tailwind_variants_1.tv)({
+    base: "px-3 py-2 duration-200 rounded text-xs sm:text-sm placeholder:text-primary-darker text-primary disabled:brightness-90 disabled:cursor-not-allowed",
+    defaultVariants: { variant: "normal" },
+    variants: {
+        variant: {
+            normal: "bg-input border border-outline focus:border-outline-light outline-none",
+            ghost: "p-0 bg-transparent border-none outline-none"
+        }
+    }
+});

package/dist/utils/functions/_.d.ts

@@ -0,0 +1,2 @@
+export * from "./element";
+export * from "./text";

package/dist/utils/functions/_.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./element"), exports);
+__exportStar(require("./text"), exports);

package/dist/utils/functions/element.d.ts

@@ -0,0 +1,3 @@
+import type { ReactElement, ReactNode } from "react";
+import type { ListItem } from "../types/_";
+export declare function renderList<T extends object>(items: T[], Component: (props: T & ListItem) => ReactElement): ReactNode;

package/dist/utils/functions/element.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderList = renderList;
+const react_1 = require("react");
+function renderList(items, Component) {
+    return items.map((item, index) => ((0, react_1.createElement)(Component, { ...item, index: index, key: index })));
+}

package/dist/utils/functions/text.d.ts

@@ -0,0 +1,2 @@
+import type { ReactNode } from "react";
+export declare function formatText(text: string): ReactNode;

package/dist/utils/functions/text.js

@@ -0,0 +1,36 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.formatText = formatText;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const ts_1 = require("@bouko/ts");
+const delimiterConfig = [
+    {
+        key: "**",
+        style: "font-bold",
+    },
+    {
+        key: "~~",
+        style: "font-semibold",
+    },
+    {
+        key: "^^",
+        style: "text-accent",
+    },
+];
+const delimiterPattern = delimiterConfig.map(({ key }) => {
+    const escaped = (0, ts_1.escapeRegex)(key);
+    return `${escaped}.*?${escaped}`;
+}).join("|");
+const delimiterRegex = new RegExp(`(${delimiterPattern})`, "g");
+function formatText(text) {
+    const parts = text
+        .split(delimiterRegex)
+        .filter(Boolean);
+    return (0, jsx_runtime_1.jsx)("span", { children: parts.map((part, index) => {
+            const delimiter = delimiterConfig.find(({ key }) => part.startsWith(key) && part.endsWith(key));
+            if (!delimiter)
+                return part;
+            const content = part.slice(delimiter.key.length, -delimiter.key.length);
+            return ((0, jsx_runtime_1.jsx)("span", { className: delimiter.style, children: content }, index));
+        }) });
+}

package/dist/utils/hooks/_.d.ts

@@ -0,0 +1,5 @@
+export * from "./clock";
+export * from "./element";
+export * from "./pagination";
+export * from "./router";
+export * from "./state";

package/dist/utils/hooks/_.js

@@ -0,0 +1,21 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./clock"), exports);
+__exportStar(require("./element"), exports);
+__exportStar(require("./pagination"), exports);
+__exportStar(require("./router"), exports);
+__exportStar(require("./state"), exports);

package/dist/utils/hooks/clock.d.ts

@@ -0,0 +1,8 @@
+type Props = {
+    action: () => Promise<boolean | void>;
+    duration: number;
+    deps: unknown[];
+    oops?: (x: string) => void;
+};
+export default function useInterval({ action, duration, deps, oops }: Props): void;
+export {};

package/dist/utils/hooks/clock.js

@@ -0,0 +1,28 @@
+"use client";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = useInterval;
+const react_1 = require("react");
+function useInterval({ action, duration, deps = [], oops }) {
+    const ref = (0, react_1.useRef)(async () => false);
+    (0, react_1.useEffect)(() => {
+        ref.current = action;
+    }, [action]);
+    (0, react_1.useEffect)(() => {
+        if (deps.some(v => v === undefined || v === null))
+            return;
+        const tick = async () => {
+            try {
+                const stop = await ref.current();
+                if (stop && id)
+                    clearInterval(id);
+            }
+            catch (err) {
+                oops?.(err.message);
+            }
+        };
+        const id = setInterval(tick, duration);
+        tick();
+        return () => clearInterval(id);
+    }, [duration, ...deps]);
+}

package/dist/utils/hooks/element.d.ts

@@ -0,0 +1,13 @@
+import { type RefObject } from "react";
+type Options = {
+    onResize?: () => void;
+};
+export type DivRef = RefObject<HTMLDivElement | null>;
+export type AudioRef = RefObject<HTMLAudioElement | null>;
+export declare function withRef<T>(ref: RefObject<T | null>, fn: (el: T) => void): void;
+export declare const useElement: (init?: HTMLDivElement, opts?: Options) => {
+    ref: RefObject<HTMLDivElement | null>;
+    container: HTMLElement | null | undefined;
+    width: number;
+};
+export {};

package/dist/utils/hooks/element.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useElement = void 0;
+exports.withRef = withRef;
+const react_1 = require("react");
+function withRef(ref, fn) {
+    const el = ref.current;
+    if (!el)
+        return;
+    return fn(el);
+}
+const useElement = (init, opts = {}) => {
+    const ref = (0, react_1.useRef)(init ?? null);
+    const element = ref.current;
+    const container = element?.parentElement;
+    const width = element?.clientWidth || 0;
+    (0, react_1.useEffect)(() => withRef(ref, (el => {
+        if (!opts?.onResize)
+            return;
+        const observer = new ResizeObserver(opts.onResize);
+        observer.observe(el);
+        opts.onResize();
+        return () => observer.disconnect();
+    })), [element, opts?.onResize]);
+    return { ref, container, width };
+};
+exports.useElement = useElement;

package/dist/utils/hooks/pagination.d.ts

@@ -0,0 +1,36 @@
+type Options<T> = {
+    fetcher: (query: PageQuery) => Promise<T[] | {
+        items: T[];
+        total?: number;
+        totalPages?: number;
+    }>;
+    pageSize: number;
+};
+export type PageQuery = {
+    page: number;
+    pageSize: number;
+    refresh?: boolean;
+};
+export type PageState<T> = {
+    page: number;
+    isLoading: boolean;
+    items: T[];
+    totalPages: number;
+    fetchedAt: Date | null;
+    prev: () => void;
+    next: () => void;
+    jump: (page: number) => void;
+    refresh: () => void;
+};
+export declare function usePagination<T>({ fetcher, pageSize }: Options<T>): {
+    items: T[];
+    isLoading: boolean;
+    page: number;
+    totalPages: number;
+    prev: () => void;
+    next: () => void;
+    jump: (target: number) => void;
+    refresh: () => Promise<void>;
+    fetchedAt: Date | null;
+};
+export {};

package/dist/utils/hooks/pagination.js

@@ -0,0 +1,82 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.usePagination = usePagination;
+const react_1 = require("react");
+const react_router_dom_1 = require("react-router-dom");
+function usePagination({ fetcher, pageSize }) {
+    const [params, setParams] = (0, react_router_dom_1.useSearchParams)();
+    const [items, setItems] = (0, react_1.useState)([]);
+    const [totalPages, setTotalPages] = (0, react_1.useState)(0);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    const [fetchedAt, setFetchedAt] = (0, react_1.useState)(null);
+    const raw = params.get("page");
+    const page = Math.max(1, Number(raw) || 1);
+    const setPage = (0, react_1.useCallback)((nextPage) => {
+        const p = Math.max(1, Math.trunc(nextPage));
+        const next = new URLSearchParams(params.toString());
+        next.set("page", String(p));
+        setParams(next);
+    }, [params, setParams]);
+    const jump = (0, react_1.useCallback)((target) => setPage(target), [setPage]);
+    const fetchPage = (0, react_1.useCallback)(async (refresh = false) => {
+        setLoading(true);
+        try {
+            const result = await fetcher({ page, pageSize, refresh });
+            // normalize result to { items, totalPages }
+            let resultItems = [];
+            let computedTotalPages = 0;
+            if (Array.isArray(result)) {
+                resultItems = result;
+                // can't compute total pages from array alone
+                computedTotalPages = 0;
+            }
+            else {
+                resultItems = result?.items ?? [];
+                if (typeof result?.totalPages === "number") {
+                    computedTotalPages = Math.max(0, Math.trunc(result.totalPages));
+                }
+                else if (typeof result?.total === "number") {
+                    computedTotalPages = Math.max(0, Math.ceil(result.total / pageSize));
+                }
+                else {
+                    computedTotalPages = 0;
+                }
+            }
+            setItems(resultItems);
+            setTotalPages(computedTotalPages);
+            setFetchedAt(new Date());
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [page, pageSize]);
+    (0, react_1.useEffect)(() => {
+        fetchPage(false);
+    }, [fetchPage]);
+    const prev = (0, react_1.useCallback)(() => {
+        if (page > 1)
+            setPage(page - 1);
+    }, [page, setPage]);
+    const next = (0, react_1.useCallback)(() => {
+        // if totalPages is known, don't advance past it
+        if (totalPages > 0) {
+            if (page < totalPages)
+                setPage(page + 1);
+        }
+        else {
+            // unknown total -> allow advancing
+            setPage(page + 1);
+        }
+    }, [page, setPage, totalPages]);
+    return {
+        items,
+        isLoading: loading,
+        page,
+        totalPages,
+        prev,
+        next,
+        jump,
+        refresh: () => fetchPage(true),
+        fetchedAt,
+    };
+}

package/dist/utils/hooks/router.d.ts

@@ -0,0 +1,5 @@
+export declare function useRouter<T>(): {
+    navigate: import("react-router").NavigateFunction;
+    params: T;
+};
+export declare const useSearchParam: (key: string) => string | null;

package/dist/utils/hooks/router.js

@@ -0,0 +1,15 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSearchParam = void 0;
+exports.useRouter = useRouter;
+const react_router_dom_1 = require("react-router-dom");
+function useRouter() {
+    const navigate = (0, react_router_dom_1.useNavigate)();
+    const params = (0, react_router_dom_1.useParams)();
+    return { navigate, params };
+}
+const useSearchParam = (key) => {
+    const [params] = (0, react_router_dom_1.useSearchParams)();
+    return params.get(key);
+};
+exports.useSearchParam = useSearchParam;

package/dist/utils/hooks/state.d.ts

@@ -0,0 +1,26 @@
+type Options<T> = {
+    fetcher: () => Promise<T>;
+    updater: (x?: T) => Promise<T | null>;
+};
+export declare function useValue<T>({ fetcher, updater }: Options<T>): {
+    value: T | null;
+    update: (x?: T) => Promise<void>;
+};
+export declare function useList<T extends {
+    id?: string;
+}>(initial?: T[]): {
+    items: T[];
+    add: (entry: T) => void;
+    updateOne: (id: string, entry: Partial<T>) => void;
+    remove: (id: string) => void;
+    clear: () => void;
+};
+type MapOptions<T> = {
+    fetcher: () => Promise<Record<string, T> | null>;
+    updater: (x: string, value: T) => Promise<T>;
+};
+export declare function useMap<T>({ fetcher, updater }: MapOptions<T>): {
+    config: Record<string, T>;
+    update: (id: string, x: T) => Promise<void>;
+};
+export {};

package/dist/utils/hooks/state.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useValue = useValue;
+exports.useList = useList;
+exports.useMap = useMap;
+const react_1 = require("react");
+function useValue({ fetcher, updater }) {
+    const [value, setValue] = (0, react_1.useState)(null);
+    (0, react_1.useEffect)(() => {
+        fetcher()
+            .then(setValue);
+    }, []);
+    const update = async (x) => {
+        const res = await updater(x);
+        setValue(res || null);
+    };
+    return { value, update };
+}
+function useList(initial = []) {
+    const [items, setItems] = (0, react_1.useState)(initial);
+    const add = (entry) => setItems(prev => [...prev, entry]);
+    const remove = (id) => setItems(prev => prev.filter(x => x.id !== id));
+    const updateOne = (id, entry) => {
+        setItems(prev => prev.map((x, i) => x.id === id ? { ...x, ...entry } : x));
+    };
+    const clear = () => {
+        setItems([]);
+    };
+    return {
+        items,
+        add,
+        updateOne,
+        remove,
+        clear
+    };
+}
+function useMap({ fetcher, updater }) {
+    const [config, setConfig] = (0, react_1.useState)({});
+    (0, react_1.useEffect)(() => {
+        fetcher()
+            .then(x => setConfig(x || {}));
+    }, []);
+    const update = async (id, x) => {
+        const res = await updater(id, x);
+        setConfig(prev => ({ ...prev, [id]: res }));
+    };
+    return { config, update };
+}

package/dist/utils/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./types/_";
+export * from "./functions/_";
+export * from "./hooks/_";

package/dist/utils/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./types/_"), exports);
+__exportStar(require("./functions/_"), exports);
+__exportStar(require("./hooks/_"), exports);

package/dist/utils/types/_.d.ts

@@ -0,0 +1,2 @@
+export * from "./element";
+export * from "./state";

package/dist/utils/types/_.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./element"), exports);
+__exportStar(require("./state"), exports);

package/dist/utils/types/element.d.ts

@@ -0,0 +1,20 @@
+import type { ReactNode } from "react";
+/**
+ * Common props for React components.
+ *
+ * @property `Component` - Component with Tailwind style(s) and children.
+ * @property `Clickable` - Component that executes a callback when clicked.
+ * @property `Hoverable` - Component that tracks hovered state.
+ * @property `ListItem`  - For items that belong in a list.
+**/
+export type Component = {
+    style?: string;
+    children?: ReactNode;
+};
+export type Hoverable = {
+    onHover?: () => void;
+    onLeave?: () => void;
+};
+export type ListItem = {
+    index: number;
+};

package/dist/utils/types/element.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+// 

package/dist/utils/types/state.d.ts

@@ -0,0 +1,2 @@
+import type { Dispatch, SetStateAction } from "react";
+export type SetState<T> = Dispatch<SetStateAction<T>>;

package/dist/utils/types/state.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });