@vetc-miniapp/ui-react 0.0.23 → 0.0.25

package/dist/components/toast/Toast.js

@@ -0,0 +1,61 @@
+import { notification, message } from 'antd';
+/** Shared notification style — references CSS vars */
+const toastStyle = {
+    borderRadius: 'var(--vetc-toast-radius)',
+    fontFamily: 'var(--vetc-font-family)',
+};
+/**
+ * Static programmatic toast API
+ * Usage: toast.success('Message')
+ */
+export const toast = {
+    show(opts) {
+        const { type = 'default', message: msg, description, duration = 3, placement = 'top', icon, onClose, } = opts;
+        if (type === 'default') {
+            message.open({ type: 'info', content: msg, duration, onClose });
+            return;
+        }
+        notification[type]({
+            message: msg,
+            description,
+            duration,
+            placement,
+            icon,
+            onClose,
+            style: toastStyle,
+        });
+    },
+    success: (msg, description) => toast.show({ message: msg, description, type: 'success' }),
+    error: (msg, description) => toast.show({ message: msg, description, type: 'error' }),
+    warning: (msg, description) => toast.show({ message: msg, description, type: 'warning' }),
+    info: (msg, description) => toast.show({ message: msg, description, type: 'info' }),
+};
+/**
+ * Hook-based toast — requires VETCProvider (antd App wrapper)
+ */
+export function useToast() {
+    const [api, contextHolder] = notification.useNotification();
+    const show = (opts) => {
+        const { type = 'info', message: msg, description, duration = 3, placement = 'top', icon, onClose, } = opts;
+        api[type === 'default' ? 'info' : type]({
+            message: msg,
+            description,
+            duration,
+            placement,
+            icon,
+            onClose,
+            style: toastStyle,
+        });
+    };
+    return {
+        contextHolder,
+        toast: {
+            show,
+            success: (msg, description) => show({ message: msg, description, type: 'success' }),
+            error: (msg, description) => show({ message: msg, description, type: 'error' }),
+            warning: (msg, description) => show({ message: msg, description, type: 'warning' }),
+            info: (msg, description) => show({ message: msg, description, type: 'info' }),
+        },
+    };
+}
+export default toast;

package/dist/components/toast/index.d.ts

@@ -0,0 +1,2 @@
+export { toast, useToast } from './Toast';
+export type { ToastOptions, ToastType } from './Toast';

package/dist/components/toast/index.js

@@ -0,0 +1 @@
+export { toast, useToast } from './Toast';

package/dist/components/typography/Typography.d.ts

@@ -0,0 +1,45 @@
+/**
+ * VETC Typography Components
+ * All style values reference CSS custom properties from tokens.css
+ */
+import React from 'react';
+declare const styles: Record<string, React.CSSProperties>;
+export type TypographyVariant = keyof typeof styles;
+export type TextColor = 'primary' | 'secondary' | 'tertiary' | 'disabled' | 'brand' | 'error' | 'warning' | 'success' | 'inherit';
+export interface TypographyProps {
+    /** Typography style variant */
+    variant?: TypographyVariant;
+    /** Text color */
+    color?: TextColor;
+    /** Strike-through */
+    strikethrough?: boolean;
+    /** Underline */
+    underline?: boolean;
+    /** Single-line truncate */
+    truncate?: boolean;
+    /** Clamp to N lines */
+    lines?: number;
+    /** Render tag */
+    as?: keyof React.JSX.IntrinsicElements;
+    children?: React.ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+    id?: string;
+}
+export declare function Typography({ variant, color, strikethrough, underline, truncate, lines, as: Tag, children, className, style, id, }: TypographyProps): import("react/jsx-runtime").JSX.Element;
+export declare function Display({ level, ...props }: Omit<TypographyProps, 'variant'> & {
+    level?: '4xl' | '3xl' | '2xl';
+}): import("react/jsx-runtime").JSX.Element;
+export declare function Headline({ level, ...props }: Omit<TypographyProps, 'variant'> & {
+    level?: 'xl' | 'lg';
+}): import("react/jsx-runtime").JSX.Element;
+export declare function Title({ size, ...props }: Omit<TypographyProps, 'variant'> & {
+    size?: 'base' | 'sm';
+}): import("react/jsx-runtime").JSX.Element;
+export declare function Label({ size, ...props }: Omit<TypographyProps, 'variant'> & {
+    size?: 'base' | 'sm' | 'xs' | 'xxs';
+}): import("react/jsx-runtime").JSX.Element;
+export declare function Body({ size, ...props }: Omit<TypographyProps, 'variant'> & {
+    size?: 'base' | 'sm' | 'xs' | '2xs';
+}): import("react/jsx-runtime").JSX.Element;
+export default Typography;

package/dist/components/typography/Typography.js

@@ -0,0 +1,143 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+// ── Typography style map — dùng CSS vars thay vì hardcode ──────────────────
+const styles = {
+    display4xl: {
+        fontSize: 'var(--vetc-font-size-4xl)',
+        fontWeight: 'var(--vetc-font-weight-bold)',
+        lineHeight: 'var(--vetc-line-height-tight)',
+    },
+    display3xl: {
+        fontSize: 'var(--vetc-font-size-3xl)',
+        fontWeight: 'var(--vetc-font-weight-bold)',
+        lineHeight: 'var(--vetc-line-height-tight)',
+    },
+    display2xl: {
+        fontSize: 'var(--vetc-font-size-2xl)',
+        fontWeight: 'var(--vetc-font-weight-bold)',
+        lineHeight: 'var(--vetc-line-height-tight)',
+    },
+    headlineXl: {
+        fontSize: 'var(--vetc-font-size-xl)',
+        fontWeight: 'var(--vetc-font-weight-bold)',
+        lineHeight: 'var(--vetc-line-height-normal)',
+    },
+    headlineLg: {
+        fontSize: 'var(--vetc-font-size-lg)',
+        fontWeight: 'var(--vetc-font-weight-semibold)',
+        lineHeight: 'var(--vetc-line-height-normal)',
+    },
+    titleBase: {
+        fontSize: 'var(--vetc-font-size-base)',
+        fontWeight: 'var(--vetc-font-weight-semibold)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+        letterSpacing: 'var(--vetc-letter-spacing-sm)',
+    },
+    titleSm: {
+        fontSize: 'var(--vetc-font-size-sm)',
+        fontWeight: 'var(--vetc-font-weight-semibold)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+        letterSpacing: 'var(--vetc-letter-spacing-sm)',
+    },
+    labelBase: {
+        fontSize: 'var(--vetc-font-size-base)',
+        fontWeight: 'var(--vetc-font-weight-semibold)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+    },
+    labelSm: {
+        fontSize: 'var(--vetc-font-size-sm)',
+        fontWeight: 'var(--vetc-font-weight-semibold)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+        letterSpacing: 'var(--vetc-letter-spacing-lg)',
+    },
+    labelXs: {
+        fontSize: 'var(--vetc-font-size-xs)',
+        fontWeight: 'var(--vetc-font-weight-semibold)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+        letterSpacing: 'var(--vetc-letter-spacing-lg)',
+    },
+    labelXxs: {
+        fontSize: 'var(--vetc-font-size-2xs)',
+        fontWeight: 'var(--vetc-font-weight-semibold)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+        letterSpacing: 'var(--vetc-letter-spacing-lg)',
+    },
+    bodyBase: {
+        fontSize: 'var(--vetc-font-size-base)',
+        fontWeight: 'var(--vetc-font-weight-regular)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+        letterSpacing: 'var(--vetc-letter-spacing-sm)',
+    },
+    bodySm: {
+        fontSize: 'var(--vetc-font-size-sm)',
+        fontWeight: 'var(--vetc-font-weight-regular)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+        letterSpacing: 'var(--vetc-letter-spacing-md)',
+    },
+    bodyXs: {
+        fontSize: 'var(--vetc-font-size-xs)',
+        fontWeight: 'var(--vetc-font-weight-regular)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+        letterSpacing: 'var(--vetc-letter-spacing-lg)',
+    },
+    body2xs: {
+        fontSize: 'var(--vetc-font-size-2xs)',
+        fontWeight: 'var(--vetc-font-weight-regular)',
+        lineHeight: 'var(--vetc-line-height-relaxed)',
+        letterSpacing: 'var(--vetc-letter-spacing-lg)',
+    },
+};
+const colorMap = {
+    primary: 'var(--vetc-color-text-primary)',
+    secondary: 'var(--vetc-color-text-secondary)',
+    tertiary: 'var(--vetc-color-text-tertiary)',
+    disabled: 'var(--vetc-color-text-disabled)',
+    brand: 'var(--vetc-color-brand)',
+    error: 'var(--vetc-color-text-error)',
+    warning: 'var(--vetc-color-warning)',
+    success: 'var(--vetc-color-positive)',
+    inherit: 'inherit',
+};
+export function Typography({ variant = 'bodyBase', color = 'primary', strikethrough = false, underline = false, truncate = false, lines, as: Tag = 'span', children, className = '', style, id, }) {
+    const variantStyle = styles[variant] ?? styles.bodyBase;
+    const colorValue = colorMap[color];
+    const combinedStyle = {
+        fontFamily: 'var(--vetc-font-family)',
+        margin: 0,
+        padding: 0,
+        ...variantStyle,
+        color: colorValue,
+        textDecoration: strikethrough ? 'line-through' : underline ? 'underline' : 'none',
+        ...(truncate && !lines
+            ? { overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }
+            : {}),
+        ...(lines
+            ? {
+                display: '-webkit-box',
+                WebkitLineClamp: lines,
+                WebkitBoxOrient: 'vertical',
+                overflow: 'hidden',
+            }
+            : {}),
+        ...style,
+    };
+    return (_jsx(Tag, { id: id, className: `vetc-text vetc-text--${variant} ${className}`, style: combinedStyle, children: children }));
+}
+// ── Convenience shorthands ──────────────────────────────────────────────────
+export function Display({ level = '2xl', ...props }) {
+    return _jsx(Typography, { ...props, variant: `display${level}`, as: props.as ?? 'h1' });
+}
+export function Headline({ level = 'xl', ...props }) {
+    return _jsx(Typography, { ...props, variant: level === 'xl' ? 'headlineXl' : 'headlineLg', as: props.as ?? 'h2' });
+}
+export function Title({ size = 'base', ...props }) {
+    return _jsx(Typography, { ...props, variant: size === 'base' ? 'titleBase' : 'titleSm', as: props.as ?? 'h3' });
+}
+export function Label({ size = 'base', ...props }) {
+    const variantMap = { base: 'labelBase', sm: 'labelSm', xs: 'labelXs', xxs: 'labelXxs' };
+    return _jsx(Typography, { ...props, variant: variantMap[size], as: props.as ?? 'span' });
+}
+export function Body({ size = 'base', ...props }) {
+    const variantMap = { base: 'bodyBase', sm: 'bodySm', xs: 'bodyXs', '2xs': 'body2xs' };
+    return _jsx(Typography, { ...props, variant: variantMap[size], as: props.as ?? 'p' });
+}
+export default Typography;

package/dist/components/typography/index.d.ts

@@ -0,0 +1,2 @@
+export { Typography, Display, Headline, Title, Label, Body } from './Typography';
+export type { TypographyProps, TypographyVariant, TextColor } from './Typography';

package/dist/components/typography/index.js

@@ -0,0 +1 @@
+export { Typography, Display, Headline, Title, Label, Body } from './Typography';

package/dist/hooks/use-app-pause.d.ts

@@ -0,0 +1,6 @@
+/**
+ * useAppPause
+ *
+ * Trigger khi Native App đi vào background.
+ */
+export declare function useAppPause(callback: () => void): void;

package/dist/hooks/use-app-pause.js

@@ -0,0 +1,29 @@
+import { useEffect, useRef } from "react";
+/**
+ * useAppPause
+ *
+ * Trigger khi Native App đi vào background.
+ */
+export function useAppPause(callback) {
+    const savedCallback = useRef(callback);
+    // giữ callback luôn mới nhất
+    useEffect(() => {
+        savedCallback.current = callback;
+    }, [callback]);
+    useEffect(() => {
+        if (typeof window === "undefined" || !window.MiniApp)
+            return;
+        const handler = () => {
+            try {
+                savedCallback.current?.();
+            }
+            catch (err) {
+                console.error("[useAppPause error]", err);
+            }
+        };
+        window.MiniApp.on("appPause", handler);
+        return () => {
+            window.MiniApp.off("appPause", handler);
+        };
+    }, []);
+}

package/dist/hooks/use-app-resume.d.ts

@@ -0,0 +1,6 @@
+/**
+ * useAppResume
+ *
+ * Trigger khi Native App quay lại foreground.
+ */
+export declare function useAppResume(callback: () => void): void;

package/dist/hooks/use-app-resume.js

@@ -0,0 +1,28 @@
+import { useEffect, useRef } from "react";
+/**
+ * useAppResume
+ *
+ * Trigger khi Native App quay lại foreground.
+ */
+export function useAppResume(callback) {
+    const savedCallback = useRef(callback);
+    useEffect(() => {
+        savedCallback.current = callback;
+    }, [callback]);
+    useEffect(() => {
+        if (typeof window === "undefined" || !window.MiniApp)
+            return;
+        const handler = () => {
+            try {
+                savedCallback.current?.();
+            }
+            catch (err) {
+                console.error("[useAppResume error]", err);
+            }
+        };
+        window.MiniApp.on("appResume", handler);
+        return () => {
+            window.MiniApp.off("appResume", handler);
+        };
+    }, []);
+}

package/{src/ui-react/hooks/use-app-state.ts → dist/hooks/use-app-state.d.ts}

@@ -1,6 +1,5 @@
 import { Dispatch, SetStateAction } from 'react';
 import { IAppState, IAppConfig } from '../types/app';
-
 export declare const useAppState: () => {
     config: IAppConfig;
     appState: IAppState;

package/dist/hooks/use-app-state.js

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

package/dist/hooks/use-did-hide.d.ts

@@ -0,0 +1,6 @@
+type DidHidePayload = {
+    route?: string;
+    [key: string]: any;
+};
+export declare function useDidHide(route: string, callback: (data?: DidHidePayload) => void): void;
+export {};

package/dist/hooks/use-did-hide.js

@@ -0,0 +1,21 @@
+import { useEffect, useRef } from "react";
+export function useDidHide(route, callback) {
+    const saved = useRef(callback);
+    // luôn giữ callback mới nhất
+    useEffect(() => {
+        saved.current = callback;
+    }, [callback]);
+    useEffect(() => {
+        if (typeof window === "undefined" || !window.MiniApp)
+            return;
+        const handler = (data) => {
+            if (data?.route === route) {
+                saved.current?.(data);
+            }
+        };
+        window.MiniApp.on("didHide", handler);
+        return () => {
+            window.MiniApp.off("didHide", handler);
+        };
+    }, [route]);
+}

package/dist/hooks/use-did-show.d.ts

@@ -0,0 +1,6 @@
+type DidShowPayload = {
+    route?: string;
+    [key: string]: any;
+};
+export declare function useDidShow(route: string, callback: (data?: DidShowPayload) => void): void;
+export {};

package/dist/hooks/use-did-show.js

@@ -0,0 +1,21 @@
+import { useEffect, useRef } from "react";
+export function useDidShow(route, callback) {
+    const saved = useRef(callback);
+    // luôn giữ callback mới nhất
+    useEffect(() => {
+        saved.current = callback;
+    }, [callback]);
+    useEffect(() => {
+        if (typeof window === "undefined" || !window.MiniApp)
+            return;
+        const handler = (data) => {
+            if (data?.route === route) {
+                saved.current?.(data);
+            }
+        };
+        window.MiniApp.on("didShow", handler);
+        return () => {
+            window.MiniApp.off("didShow", handler);
+        };
+    }, [route]);
+}

package/dist/hooks/use-listener-scan-qr.d.ts

@@ -0,0 +1,21 @@
+type ScanQrResult = {
+    raw: string;
+    type?: string;
+    [key: string]: any;
+};
+type MiniAppBridge = {
+    on: (event: string, callback: (data: any) => void) => void;
+    off: (event: string, callback: (data: any) => void) => void;
+};
+declare global {
+    interface Window {
+        MiniApp?: MiniAppBridge;
+    }
+}
+/**
+ * useListenerScanQr
+ *
+ * Lắng nghe kết quả scan QR từ Native
+ */
+export declare function useListenerScanQr(callback: (data: ScanQrResult) => void): void;
+export {};

package/dist/hooks/use-listener-scan-qr.js

@@ -0,0 +1,29 @@
+import { useEffect, useRef } from "react";
+/**
+ * useListenerScanQr
+ *
+ * Lắng nghe kết quả scan QR từ Native
+ */
+export function useListenerScanQr(callback) {
+    const savedCallback = useRef(callback);
+    // luôn giữ callback mới nhất
+    useEffect(() => {
+        savedCallback.current = callback;
+    }, [callback]);
+    useEffect(() => {
+        if (typeof window === "undefined" || !window.MiniApp)
+            return;
+        const handler = (data) => {
+            try {
+                savedCallback.current?.(data);
+            }
+            catch (err) {
+                console.error("[useListenerScanQr error]", err);
+            }
+        };
+        window.MiniApp.on("scanQrResult", handler);
+        return () => {
+            window.MiniApp.off("scanQrResult", handler);
+        };
+    }, []);
+}

package/dist/hooks/use-navigate.d.ts

@@ -0,0 +1,8 @@
+export type NavigateMode = "push" | "replace";
+export interface NavigateOptions {
+    replace?: boolean;
+    popTo?: string;
+}
+export type NavigateParams = Record<string, unknown>;
+export type MiniAppRoute = string | number;
+export declare function useNavigate(): (route: MiniAppRoute, params?: NavigateParams, options?: NavigateOptions) => void;

package/dist/hooks/use-navigate.js

@@ -0,0 +1,23 @@
+import { callHost } from "../bridge";
+/* ================= Hook ================= */
+export function useNavigate() {
+    return (route, params = {}, options = {}) => {
+        // POP navigation
+        if (typeof route === "number") {
+            callHost("navigate", {
+                type: "native",
+                action: "pop",
+                delta: Math.abs(route),
+            });
+            return;
+        }
+        // Gửi sang native host
+        callHost("navigate", {
+            type: "native",
+            action: "push",
+            route,
+            params,
+            options,
+        }).catch(console.error);
+    };
+}

package/dist/hooks/use-tap-app-bar.d.ts

@@ -0,0 +1,6 @@
+type TapAppBarPayload = {
+    route?: string;
+    [key: string]: any;
+};
+export declare function useTapAppBar(route: string, callback: (data?: TapAppBarPayload) => void): void;
+export {};

package/dist/hooks/use-tap-app-bar.js

@@ -0,0 +1,21 @@
+import { useEffect, useRef } from "react";
+export function useTapAppBar(route, callback) {
+    const saved = useRef(callback);
+    // luôn giữ callback mới nhất
+    useEffect(() => {
+        saved.current = callback;
+    }, [callback]);
+    useEffect(() => {
+        if (typeof window === "undefined" || !window.MiniApp)
+            return;
+        const handler = (data) => {
+            if (data?.route === route) {
+                saved.current?.(data);
+            }
+        };
+        window.MiniApp.on("onTapAppBar", handler);
+        return () => {
+            window.MiniApp.off("onTapAppBar", handler);
+        };
+    }, [route]);
+}

package/dist/index.d.ts

@@ -0,0 +1,56 @@
+export { VETCProvider, vetcAntdTheme } from './styles/VETCProvider';
+export type { VETCProviderProps } from './styles/VETCProvider';
+export { colorGlobal, colorAlias } from './tokens/colors';
+export { fontFamily, fontWeight, fontSize, lineHeight, letterSpacing, textStyle } from './tokens/typography';
+export { spacing, borderRadius, componentHeight, shadow } from './tokens/spacing';
+export { Button } from './components/button';
+export type { ButtonProps, ButtonStyle, ButtonVariant, ButtonSize, ButtonShape } from './components/button';
+export { ButtonGroup } from './components/button-group';
+export type { ButtonGroupProps, ButtonGroupAction, ButtonGroupLayout, ButtonGroupVariant } from './components/button-group';
+export { Typography, Display, Headline, Title, Label, Body } from './components/typography';
+export type { TypographyProps, TypographyVariant, TextColor } from './components/typography';
+export { Input, PasswordInput } from './components/input';
+export type { InputProps, PasswordInputProps, InputStatus } from './components/input';
+export { Textarea } from './components/textarea';
+export type { TextareaProps } from './components/textarea';
+export { Select } from './components/select';
+export type { SelectProps, SelectOption } from './components/select';
+export { Checkbox, CheckboxGroup } from './components/checkbox';
+export type { CheckboxProps, CheckboxGroupProps, CheckboxOption, CheckboxVariant } from './components/checkbox';
+export { Radio, RadioGroup } from './components/radio';
+export type { RadioProps, RadioGroupProps, RadioOption, RadioVariant } from './components/radio';
+export { Switch } from './components/switch';
+export type { SwitchProps, SwitchVariant } from './components/switch';
+export { Chip } from './components/chip';
+export type { ChipProps, ChipStyle, ChipType, ChipShape } from './components/chip';
+export { Avatar } from './components/avatar';
+export type { AvatarProps, AvatarSize, AvatarShape } from './components/avatar';
+export { Card } from './components/card';
+export type { CardProps, CardElevation } from './components/card';
+export { List, ListItem } from './components/list';
+export type { ListProps, ListItemProps } from './components/list';
+export { Divider } from './components/divider';
+export type { DividerProps } from './components/divider';
+export { Spinner, SkeletonLoader } from './components/loading';
+export type { SpinnerProps, SkeletonProps, SpinnerSize } from './components/loading';
+export { toast, useToast } from './components/toast';
+export type { ToastOptions, ToastType } from './components/toast';
+export { Modal, useConfirm } from './components/modal';
+export type { ModalProps } from './components/modal';
+export { Dialog } from './components/dialog';
+export type { DialogProps } from './components/dialog';
+export { BottomSheet } from './components/bottom-sheet';
+export type { BottomSheetProps } from './components/bottom-sheet';
+export { NavigationBar } from './components/navigation-bar';
+export type { NavigationBarProps, NavigationBarAction } from './components/navigation-bar';
+export { TabBar } from './components/tab-bar';
+export type { TabBarProps, TabBarItem, TabBarVariant } from './components/tab-bar';
+export { App } from './components/app';
+export * from './hooks/use-app-resume';
+export * from './hooks/use-app-pause';
+export * from './hooks/use-did-show';
+export * from './hooks/use-did-hide';
+export * from './hooks/use-tap-app-bar';
+export * from './hooks/use-navigate';
+export * from './hooks/use-app-state';
+export * from './hooks/use-listener-scan-qr';

package/dist/index.js

@@ -0,0 +1,41 @@
+// ─── Styles (import once at app root) ────────────────────────────────────────
+// import '@vetc-miniapp/ui-react/src/ui-react/styles/tokens.css';
+// ─── Theme Provider ───────────────────────────────────────────────────────────
+export { VETCProvider, vetcAntdTheme } from './styles/VETCProvider';
+// ─── Tokens ───────────────────────────────────────────────────────────────────
+export { colorGlobal, colorAlias } from './tokens/colors';
+export { fontFamily, fontWeight, fontSize, lineHeight, letterSpacing, textStyle } from './tokens/typography';
+export { spacing, borderRadius, componentHeight, shadow } from './tokens/spacing';
+// ─── Components ───────────────────────────────────────────────────────────────
+export { Button } from './components/button';
+export { ButtonGroup } from './components/button-group';
+export { Typography, Display, Headline, Title, Label, Body } from './components/typography';
+export { Input, PasswordInput } from './components/input';
+export { Textarea } from './components/textarea';
+export { Select } from './components/select';
+export { Checkbox, CheckboxGroup } from './components/checkbox';
+export { Radio, RadioGroup } from './components/radio';
+export { Switch } from './components/switch';
+export { Chip } from './components/chip';
+export { Avatar } from './components/avatar';
+export { Card } from './components/card';
+export { List, ListItem } from './components/list';
+export { Divider } from './components/divider';
+export { Spinner, SkeletonLoader } from './components/loading';
+export { toast, useToast } from './components/toast';
+export { Modal, useConfirm } from './components/modal';
+export { Dialog } from './components/dialog';
+export { BottomSheet } from './components/bottom-sheet';
+export { NavigationBar } from './components/navigation-bar';
+export { TabBar } from './components/tab-bar';
+// ─── App (Router + Native init) ───────────────────────────────────────────────
+export { App } from './components/app';
+// ─── Hooks (existing) ─────────────────────────────────────────────────────────
+export * from './hooks/use-app-resume';
+export * from './hooks/use-app-pause';
+export * from './hooks/use-did-show';
+export * from './hooks/use-did-hide';
+export * from './hooks/use-tap-app-bar';
+export * from './hooks/use-navigate';
+export * from './hooks/use-app-state';
+export * from './hooks/use-listener-scan-qr';