@wakastellar/ui 3.5.0 → 4.0.0-dev.0

package/dist/components/waka-tag-input/index.d.ts

@@ -0,0 +1,134 @@
+import * as React from "react";
+export interface Tag {
+    /** Unique identifier */
+    id: string;
+    /** Display value */
+    value: string;
+    /** Optional category for color-coding */
+    category?: string;
+    /** Custom color override */
+    color?: string;
+}
+export interface TagCategory {
+    /** Category name */
+    name: string;
+    /** Background color */
+    bgColor: string;
+    /** Text color */
+    textColor: string;
+    /** Border color (optional) */
+    borderColor?: string;
+}
+export interface TagSuggestion {
+    /** Suggestion value */
+    value: string;
+    /** Category (optional) */
+    category?: string;
+    /** Description (optional) */
+    description?: string;
+}
+export interface WakaTagInputProps {
+    /** Current tags */
+    tags: Tag[];
+    /** Callback when tags change */
+    onChange: (tags: Tag[]) => void;
+    /** Autocomplete suggestions */
+    suggestions?: TagSuggestion[];
+    /** Async suggestions loader */
+    onSuggestionsLoad?: (query: string) => Promise<TagSuggestion[]>;
+    /** Callback when a new tag is created */
+    onTagCreate?: (value: string) => void;
+    /** Maximum number of tags allowed */
+    maxTags?: number;
+    /** Allow duplicate tags */
+    allowDuplicates?: boolean;
+    /** Tag validation regex pattern */
+    validationPattern?: RegExp;
+    /** Validation error message */
+    validationMessage?: string;
+    /** Category color mapping */
+    categories?: Record<string, TagCategory>;
+    /** Allow drag to reorder */
+    draggable?: boolean;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Error state */
+    error?: boolean;
+    /** Error message */
+    errorMessage?: string;
+    /** Delimiters to trigger tag creation (default: Enter, comma) */
+    delimiters?: string[];
+    /** Minimum tag length */
+    minLength?: number;
+    /** Maximum tag length */
+    maxLength?: number;
+    /** Additional CSS classes */
+    className?: string;
+    /** Input ID for accessibility */
+    id?: string;
+    /** Input name for forms */
+    name?: string;
+}
+declare const defaultCategories: Record<string, TagCategory>;
+interface TagChipProps {
+    tag: Tag;
+    category?: TagCategory;
+    onRemove: () => void;
+    draggable?: boolean;
+    disabled?: boolean;
+    onDragStart?: (e: React.DragEvent) => void;
+    onDragEnd?: (e: React.DragEvent) => void;
+    onDragOver?: (e: React.DragEvent) => void;
+    onDrop?: (e: React.DragEvent) => void;
+    isDragging?: boolean;
+    isDragOver?: boolean;
+}
+declare function TagChip({ tag, category, onRemove, draggable, disabled, onDragStart, onDragEnd, onDragOver, onDrop, isDragging, isDragOver, }: TagChipProps): import("react/jsx-runtime").JSX.Element;
+interface SuggestionDropdownProps {
+    suggestions: TagSuggestion[];
+    query: string;
+    selectedIndex: number;
+    onSelect: (suggestion: TagSuggestion) => void;
+    categories?: Record<string, TagCategory>;
+    visible: boolean;
+}
+declare function SuggestionDropdown({ suggestions, query, selectedIndex, onSelect, categories, visible, }: SuggestionDropdownProps): import("react/jsx-runtime").JSX.Element;
+export declare function WakaTagInput({ tags, onChange, suggestions: staticSuggestions, onSuggestionsLoad, onTagCreate, maxTags, allowDuplicates, validationPattern, validationMessage, categories, draggable, placeholder, disabled, error, errorMessage, delimiters, minLength, maxLength, className, id, name, }: WakaTagInputProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace WakaTagInput {
+    var displayName: string;
+}
+export interface UseTagInputOptions {
+    /** Initial tags */
+    initialTags?: Tag[];
+    /** Maximum tags */
+    maxTags?: number;
+    /** Allow duplicates */
+    allowDuplicates?: boolean;
+    /** Validation pattern */
+    validationPattern?: RegExp;
+    /** Callback when tags change */
+    onTagsChange?: (tags: Tag[]) => void;
+}
+export declare function useTagInput(options?: UseTagInputOptions): {
+    tags: Tag[];
+    setTags: (newTags: Tag[]) => void;
+    addTag: (value: string, category?: string) => boolean;
+    addTags: (values: string[], category?: string) => number;
+    removeTag: (tagId: string) => void;
+    removeTagByValue: (value: string) => void;
+    clearTags: () => void;
+    hasTag: (value: string) => boolean;
+    getTag: (tagId: string) => Tag | undefined;
+    reorderTags: (fromIndex: number, toIndex: number) => void;
+    updateTagCategory: (tagId: string, category?: string) => void;
+    getTagsByCategory: (category: string) => Tag[];
+    values: string[];
+    count: number;
+    isEmpty: boolean;
+    isFull: boolean;
+};
+export type { TagChipProps, SuggestionDropdownProps };
+export { TagChip, SuggestionDropdown, defaultCategories };
+export default WakaTagInput;

package/dist/components/waka-team-banner/index.d.ts

@@ -0,0 +1,122 @@
+import * as React from "react";
+export interface TeamMember {
+    /** Unique identifier */
+    id: string;
+    /** Member display name */
+    name: string;
+    /** Avatar URL */
+    avatar?: string;
+    /** Role in the team (e.g., "Leader", "Co-Leader", "Member") */
+    role?: string;
+    /** Is this the team leader/captain */
+    isLeader?: boolean;
+}
+export interface TeamAchievement {
+    /** Unique identifier */
+    id: string;
+    /** Achievement name */
+    name: string;
+    /** Achievement description */
+    description?: string;
+    /** Icon to display */
+    icon: React.ReactNode;
+    /** When the achievement was earned */
+    earnedAt?: Date;
+    /** Rarity/tier of achievement */
+    rarity?: "common" | "rare" | "epic" | "legendary";
+}
+export interface TeamStats {
+    /** Total wins */
+    wins: number;
+    /** Current rank */
+    rank: number;
+    /** Total rank count (e.g., "of 500") */
+    totalRanks?: number;
+    /** Member count */
+    members: number;
+    /** Maximum members allowed */
+    maxMembers?: number;
+    /** Win rate percentage */
+    winRate?: number;
+    /** Current streak */
+    streak?: number;
+    /** Total points/XP */
+    points?: number;
+}
+export interface TeamTheme {
+    /** Primary color (hex or CSS color) */
+    primary: string;
+    /** Secondary color (hex or CSS color) */
+    secondary?: string;
+    /** Gradient direction */
+    gradientDirection?: "to-r" | "to-l" | "to-t" | "to-b" | "to-br" | "to-bl" | "to-tr" | "to-tl";
+}
+export interface WakaTeamBannerProps {
+    /** Team name */
+    name: string;
+    /** Team motto/tagline */
+    motto?: string;
+    /** Team logo URL */
+    logo?: string;
+    /** Team statistics */
+    stats: TeamStats;
+    /** Team members to display */
+    members?: TeamMember[];
+    /** Maximum members to show in avatar stack */
+    maxDisplayMembers?: number;
+    /** Team achievements/badges */
+    achievements?: TeamAchievement[];
+    /** Maximum achievements to display */
+    maxDisplayAchievements?: number;
+    /** Custom team color theme */
+    theme?: TeamTheme;
+    /** Banner size variant */
+    size?: "sm" | "md" | "lg";
+    /** Banner layout variant */
+    variant?: "default" | "compact" | "expanded";
+    /** Enable animated entrance effects */
+    animated?: boolean;
+    /** Join button state */
+    joinState?: "available" | "pending" | "joined" | "closed";
+    /** Callback when join button is clicked */
+    onJoinClick?: () => void;
+    /** Callback when team banner is clicked */
+    onClick?: () => void;
+    /** Callback when a member avatar is clicked */
+    onMemberClick?: (member: TeamMember) => void;
+    /** Callback when an achievement is clicked */
+    onAchievementClick?: (achievement: TeamAchievement) => void;
+    /** Additional CSS classes */
+    className?: string;
+}
+export interface UseTeamBannerOptions {
+    /** Initial join state */
+    initialJoinState?: "available" | "pending" | "joined" | "closed";
+    /** Simulate join request delay (ms) */
+    joinDelay?: number;
+    /** Callback after successful join */
+    onJoinSuccess?: () => void;
+    /** Callback on join error */
+    onJoinError?: (error: Error) => void;
+}
+export interface UseTeamBannerReturn {
+    /** Current join state */
+    joinState: "available" | "pending" | "joined" | "closed";
+    /** Request to join team */
+    requestJoin: () => Promise<void>;
+    /** Cancel join request */
+    cancelJoin: () => void;
+    /** Leave team */
+    leaveTeam: () => void;
+    /** Whether join action is in progress */
+    isJoining: boolean;
+    /** Error from join attempt */
+    error: Error | null;
+    /** Reset to initial state */
+    reset: () => void;
+}
+export declare function useTeamBanner({ initialJoinState, joinDelay, onJoinSuccess, onJoinError, }?: UseTeamBannerOptions): UseTeamBannerReturn;
+export declare function WakaTeamBanner({ name, motto, logo, stats, members, maxDisplayMembers, achievements, maxDisplayAchievements, theme, size, variant, animated, joinState, onJoinClick, onClick, onMemberClick, onAchievementClick, className, }: WakaTeamBannerProps): import("react/jsx-runtime").JSX.Element;
+export declare function WakaTeamBannerCompact(props: Omit<WakaTeamBannerProps, "variant">): import("react/jsx-runtime").JSX.Element;
+export declare function WakaTeamBannerExpanded(props: Omit<WakaTeamBannerProps, "variant">): import("react/jsx-runtime").JSX.Element;
+export default WakaTeamBanner;

package/dist/components/waka-terminal-output/index.d.ts

@@ -0,0 +1,48 @@
+export type LogLevel = "info" | "warn" | "error" | "debug";
+export interface LogLine {
+    /** The log content (can include ANSI codes) */
+    content: string;
+    /** Optional timestamp */
+    timestamp?: Date;
+    /** Log level for filtering and styling */
+    level?: LogLevel;
+}
+export interface WakaTerminalOutputProps {
+    /** Array of log lines to display */
+    lines: LogLine[];
+    /** Maximum lines to keep in memory (for performance) */
+    maxLines?: number;
+    /** Show line numbers */
+    showLineNumbers?: boolean;
+    /** Show timestamps */
+    showTimestamps?: boolean;
+    /** Auto-scroll to bottom on new lines */
+    autoScroll?: boolean;
+    /** Enable search functionality */
+    searchable?: boolean;
+    /** Enable log level filtering */
+    filterable?: boolean;
+    /** Callback when content is copied */
+    onCopy?: (content: string) => void;
+    /** Callback when clear is triggered */
+    onClear?: () => void;
+    /** Height of the terminal */
+    height?: number | string;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaTerminalOutput({ lines, maxLines, showLineNumbers, showTimestamps, autoScroll, searchable, filterable, onCopy, onClear, height, className, }: WakaTerminalOutputProps): import("react/jsx-runtime").JSX.Element;
+export interface UseTerminalOutputOptions {
+    maxLines?: number;
+}
+export declare function useTerminalOutput(options?: UseTerminalOutputOptions): {
+    lines: LogLine[];
+    addLine: (content: string, level?: LogLevel, timestamp?: Date) => void;
+    addLines: (newLines: LogLine[]) => void;
+    clear: () => void;
+    log: (content: string) => void;
+    warn: (content: string) => void;
+    error: (content: string) => void;
+    debug: (content: string) => void;
+};
+export default WakaTerminalOutput;

package/dist/components/waka-test-report/index.d.ts

@@ -0,0 +1,60 @@
+export type TestStatus = "passed" | "failed" | "skipped" | "pending";
+export interface TestCase {
+    id: string;
+    name: string;
+    status: TestStatus;
+    duration: number;
+    errorMessage?: string;
+    stackTrace?: string;
+    file?: string;
+    line?: number;
+}
+export interface TestSuite {
+    id: string;
+    name: string;
+    file?: string;
+    tests: TestCase[];
+    duration: number;
+    timestamp?: Date;
+}
+export interface CoverageReport {
+    lines: {
+        covered: number;
+        total: number;
+        percentage: number;
+    };
+    branches: {
+        covered: number;
+        total: number;
+        percentage: number;
+    };
+    functions: {
+        covered: number;
+        total: number;
+        percentage: number;
+    };
+    statements: {
+        covered: number;
+        total: number;
+        percentage: number;
+    };
+}
+export interface WakaTestReportProps {
+    /** Test suites */
+    suites: TestSuite[];
+    /** Coverage report */
+    coverage?: CoverageReport;
+    /** Title */
+    title?: string;
+    /** Callback when clicking on a test */
+    onTestClick?: (test: TestCase) => void;
+    /** Callback when viewing test file */
+    onViewFile?: (file: string, line?: number) => void;
+    /** Show only failed tests */
+    showFailedOnly?: boolean;
+    /** Custom class name */
+    className?: string;
+}
+export declare function WakaTestReport({ suites, coverage, title, onTestClick, onViewFile, showFailedOnly, className, }: WakaTestReportProps): import("react/jsx-runtime").JSX.Element;
+export declare const defaultTestSuites: TestSuite[];
+export declare const defaultCoverage: CoverageReport;

package/dist/components/waka-theme-creator/index.d.ts

@@ -0,0 +1,59 @@
+export interface ThemeVersion {
+    version: string;
+    createdAt: Date;
+    createdBy?: string;
+    changelog?: string;
+    css: string;
+}
+export interface ThemeMetadata {
+    id: string;
+    label: string;
+    description?: string;
+    previewColor?: string;
+    author?: string;
+    versions: ThemeVersion[];
+    currentVersion: string;
+}
+export interface S3UploadConfig {
+    /** URL de base du bucket S3 */
+    baseUrl: string;
+    /** Méthode HTTP pour l'upload (PUT ou POST) */
+    method?: "PUT" | "POST";
+    /** Headers personnalisés pour l'authentification */
+    headers?: Record<string, string>;
+    /** Préfixe des fichiers */
+    prefix?: string;
+    /** Extension des fichiers */
+    extension?: string;
+}
+export interface WakaThemeCreatorProps {
+    /** Configuration S3 pour l'upload */
+    s3Config: S3UploadConfig;
+    /** Callback après sauvegarde réussie */
+    onSave?: (theme: ThemeMetadata) => void;
+    /** Callback après suppression */
+    onDelete?: (themeId: string) => void;
+    /** Callback pour charger un thème depuis S3 */
+    onLoadTheme?: (themeId: string) => Promise<ThemeMetadata | null>;
+    /** Thèmes existants à charger */
+    existingThemes?: ThemeMetadata[];
+    /** Classe CSS personnalisée */
+    className?: string;
+}
+/**
+ * WakaThemeCreator
+ *
+ * Composant d'administration pour créer, prévisualiser et publier des thèmes TweakCN sur S3.
+ *
+ * Features:
+ * - Création de thèmes avec CSS TweakCN
+ * - Prévisualisation en temps réel
+ * - Gestion des versions
+ * - Upload sur S3/MinIO
+ * - Historique des modifications
+ * - Validation du CSS
+ */
+export declare function WakaThemeCreator({ s3Config, onSave, onDelete, onLoadTheme, existingThemes, className, }: WakaThemeCreatorProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace WakaThemeCreator {
+    var displayName: string;
+}

package/dist/components/waka-theme-manager/index.d.ts

@@ -0,0 +1,62 @@
+import * as React from "react";
+import { type VariantProps } from "class-variance-authority";
+declare const themeManagerVariants: (props?: {
+    size?: "sm" | "lg" | "base" | "full";
+} & import("class-variance-authority/types").ClassProp) => string;
+export interface TweakCNTheme {
+    name: string;
+    description?: string;
+    author?: string;
+    version?: string;
+    colors: {
+        background: string;
+        foreground: string;
+        card: string;
+        cardForeground: string;
+        popover: string;
+        popoverForeground: string;
+        primary: string;
+        primaryForeground: string;
+        secondary: string;
+        secondaryForeground: string;
+        muted: string;
+        mutedForeground: string;
+        accent: string;
+        accentForeground: string;
+        destructive: string;
+        destructiveForeground: string;
+        border: string;
+        input: string;
+        ring: string;
+        chart1?: string;
+        chart2?: string;
+        chart3?: string;
+        chart4?: string;
+        chart5?: string;
+    };
+}
+export interface WakaThemeManagerProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof themeManagerVariants> {
+    onThemeChange?: (theme: TweakCNTheme) => void;
+    onThemeLoad?: (theme: TweakCNTheme) => void;
+    onThemeSave?: (theme: TweakCNTheme) => void;
+    initialTheme?: TweakCNTheme;
+    showPreview?: boolean;
+    showExport?: boolean;
+    showImport?: boolean;
+    allowCustomColors?: boolean;
+}
+/**
+ * WakaThemeManager - Gestionnaire complet de thèmes TweakCN
+ *
+ * @example
+ * ```tsx
+ * <WakaThemeManager
+ *   onThemeChange={(theme) => console.log('Theme changed:', theme)}
+ *   showPreview={true}
+ *   showExport={true}
+ *   showImport={true}
+ * />
+ * ```
+ */
+declare const WakaThemeManager: React.ForwardRefExoticComponent<WakaThemeManagerProps & React.RefAttributes<HTMLDivElement>>;
+export { WakaThemeManager, themeManagerVariants };

package/dist/components/waka-thread-view/index.d.ts

@@ -0,0 +1,101 @@
+export interface ThreadParticipant {
+    /** Unique participant identifier */
+    id: string;
+    /** Display name */
+    name: string;
+    /** Avatar URL */
+    avatar?: string;
+}
+export interface ThreadMessage {
+    /** Unique message identifier */
+    id: string;
+    /** Author of the message */
+    author: ThreadParticipant;
+    /** Message content */
+    content: string;
+    /** When the message was created */
+    timestamp: Date;
+    /** Nested replies to this message */
+    replies?: ThreadMessage[];
+    /** Whether the message has been edited */
+    edited?: boolean;
+    /** Additional reactions or metadata */
+    metadata?: Record<string, unknown>;
+}
+export interface ThreadData {
+    /** Unique thread identifier */
+    id: string;
+    /** Thread title (optional) */
+    title?: string;
+    /** The parent/root message */
+    parentMessage: ThreadMessage;
+    /** Total reply count (may be more than loaded replies) */
+    replyCount: number;
+    /** List of participants in the thread */
+    participants: ThreadParticipant[];
+    /** Whether the thread is closed for new replies */
+    isClosed?: boolean;
+    /** Whether the current user is following this thread */
+    isFollowing?: boolean;
+    /** Whether there are real-time updates available */
+    hasNewUpdates?: boolean;
+    /** Timestamp of last activity */
+    lastActivity?: Date;
+}
+export interface WakaThreadViewProps {
+    /** Thread data to display */
+    thread: ThreadData;
+    /** Current user (for reply input) */
+    currentUser?: ThreadParticipant;
+    /** Callback when a reply is submitted */
+    onReply?: (content: string, parentMessageId?: string) => void;
+    /** Callback when load more replies is triggered */
+    onLoadMore?: () => void;
+    /** Whether more replies can be loaded */
+    hasMoreReplies?: boolean;
+    /** Whether replies are currently loading */
+    loading?: boolean;
+    /** Callback when follow/unfollow is triggered */
+    onFollowToggle?: () => void;
+    /** Callback when real-time updates indicator is clicked */
+    onRefresh?: () => void;
+    /** Maximum nesting depth for replies (default: 3) */
+    maxDepth?: number;
+    /** Whether to show participant avatars in header */
+    showParticipants?: boolean;
+    /** Whether to enable reply input */
+    enableReplies?: boolean;
+    /** Custom className */
+    className?: string;
+}
+export interface UseThreadViewOptions {
+    /** Initial thread data */
+    initialThread?: ThreadData;
+    /** Maximum replies to keep in memory */
+    maxReplies?: number;
+}
+export interface UseThreadViewReturn {
+    /** Current thread data */
+    thread: ThreadData | null;
+    /** Loading state */
+    loading: boolean;
+    /** Collapsed thread IDs */
+    collapsedThreads: Set<string>;
+    /** Toggle thread collapse state */
+    toggleCollapse: (messageId: string) => void;
+    /** Add a new reply to the thread */
+    addReply: (content: string, parentMessageId?: string) => void;
+    /** Set thread data */
+    setThread: (thread: ThreadData) => void;
+    /** Toggle follow state */
+    toggleFollow: () => void;
+    /** Mark thread as having new updates */
+    setHasNewUpdates: (hasUpdates: boolean) => void;
+    /** Set loading state */
+    setLoading: (loading: boolean) => void;
+    /** Check if a thread is collapsed */
+    isCollapsed: (messageId: string) => boolean;
+}
+export declare function WakaThreadView({ thread, currentUser, onReply, onLoadMore, hasMoreReplies, loading, onFollowToggle, onRefresh, maxDepth, showParticipants, enableReplies, className, }: WakaThreadViewProps): import("react/jsx-runtime").JSX.Element;
+export declare function useThreadView({ initialThread, maxReplies, }?: UseThreadViewOptions): UseThreadViewReturn;
+export default WakaThreadView;

package/dist/components/waka-tilt-card/index.d.ts

@@ -0,0 +1,36 @@
+import * as React from "react";
+export interface WakaTiltCardProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Maximum tilt angle in degrees */
+    maxTilt?: number;
+    /** Perspective distance */
+    perspective?: number;
+    /** Scale on hover */
+    scale?: number;
+    /** Transition speed in ms */
+    speed?: number;
+    /** Enable/disable tilt */
+    disabled?: boolean;
+    /** Glare effect */
+    glare?: boolean;
+    /** Maximum glare opacity */
+    maxGlare?: number;
+    /** Reset on mouse leave */
+    reset?: boolean;
+    /** Reverse tilt direction */
+    reverse?: boolean;
+    /** Gyroscope support on mobile */
+    gyroscope?: boolean;
+    /** Children */
+    children: React.ReactNode;
+}
+export declare function WakaTiltCard({ maxTilt, perspective, scale, speed, disabled, glare, maxGlare, reset, reverse, gyroscope, className, children, style, ...props }: WakaTiltCardProps): import("react/jsx-runtime").JSX.Element;
+export interface TiltShowcaseCardProps {
+    title: string;
+    description?: string;
+    icon?: React.ReactNode;
+    image?: string;
+    footer?: React.ReactNode;
+    className?: string;
+    glowColor?: string;
+}
+export declare function WakaTiltShowcaseCard({ title, description, icon, image, footer, className, glowColor, }: TiltShowcaseCardProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/waka-time-picker/index.d.ts

@@ -0,0 +1,51 @@
+import * as React from "react";
+export interface WakaTimePickerProps {
+    /** Valeur sélectionnée (format HH:mm ou HH:mm:ss) */
+    value?: string;
+    /** Callback lors du changement */
+    onChange?: (value: string) => void;
+    /** Placeholder */
+    placeholder?: string;
+    /** Format d'affichage */
+    format?: "12h" | "24h";
+    /** Afficher les secondes */
+    showSeconds?: boolean;
+    /** Intervalle des minutes (5, 10, 15, 30) */
+    minuteStep?: number;
+    /** Intervalle des secondes */
+    secondStep?: number;
+    /** Heure minimum */
+    minTime?: string;
+    /** Heure maximum */
+    maxTime?: string;
+    /** Désactivé */
+    disabled?: boolean;
+    /** Erreur */
+    error?: boolean;
+    /** Taille */
+    size?: "sm" | "md" | "lg";
+    /** Classes CSS additionnelles */
+    className?: string;
+    /** ID pour l'accessibilité */
+    id?: string;
+    /** Nom du champ */
+    name?: string;
+}
+export declare function WakaTimePicker({ value, onChange, placeholder, format, showSeconds, minuteStep, secondStep, minTime, maxTime, disabled, error, size, className, id, name, }: WakaTimePickerProps): import("react/jsx-runtime").JSX.Element;
+export interface UseTimePickerOptions {
+    /** Valeur initiale */
+    initialValue?: string;
+    /** Format */
+    format?: "12h" | "24h";
+    /** Afficher les secondes */
+    showSeconds?: boolean;
+}
+export declare function useTimePicker(options?: UseTimePickerOptions): {
+    value: string;
+    onChange: React.Dispatch<React.SetStateAction<string>>;
+    clear: () => void;
+    setNow: () => void;
+    format: "12h" | "24h";
+    showSeconds: boolean;
+};
+export default WakaTimePicker;