@wakastellar/ui 1.0.12 → 2.0.0

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

@@ -0,0 +1,81 @@
+import * as React from "react";
+export interface ProductImage {
+    src: string;
+    alt: string;
+}
+export interface ProductVariant {
+    id: string;
+    label: string;
+    value: string;
+    available?: boolean;
+}
+export interface ColorVariant extends ProductVariant {
+    color: string;
+}
+export interface SizeVariant extends ProductVariant {
+}
+export interface WakaProductCardProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Product name */
+    name: string;
+    /** Product price */
+    price: number;
+    /** Original price before discount */
+    originalPrice?: number;
+    /** Currency symbol */
+    currency?: string;
+    /** Product images */
+    images: ProductImage[];
+    /** Product rating (0-5) */
+    rating?: number;
+    /** Number of reviews */
+    reviewCount?: number;
+    /** Discount percentage badge */
+    discountBadge?: string;
+    /** Custom badge text */
+    customBadge?: string;
+    /** Color variants */
+    colorVariants?: ColorVariant[];
+    /** Size variants */
+    sizeVariants?: SizeVariant[];
+    /** Whether product is in stock */
+    inStock?: boolean;
+    /** Whether product is in wishlist */
+    isWishlisted?: boolean;
+    /** Show quick view button */
+    showQuickView?: boolean;
+    /** Image gallery mode */
+    galleryMode?: "thumbnails" | "dots";
+    /** Called when add to cart is clicked */
+    onAddToCart?: () => void;
+    /** Called when wishlist button is clicked */
+    onWishlistToggle?: (isWishlisted: boolean) => void;
+    /** Called when quick view is clicked */
+    onQuickView?: () => void;
+    /** Called when color variant is selected */
+    onColorSelect?: (variant: ColorVariant) => void;
+    /** Called when size variant is selected */
+    onSizeSelect?: (variant: SizeVariant) => void;
+    /** Selected color variant ID */
+    selectedColorId?: string;
+    /** Selected size variant ID */
+    selectedSizeId?: string;
+    /** Card size variant */
+    size?: "sm" | "default" | "lg";
+}
+export declare function WakaProductCard({ name, price, originalPrice, currency, images, rating, reviewCount, discountBadge, customBadge, colorVariants, sizeVariants, inStock, isWishlisted, showQuickView, galleryMode, onAddToCart, onWishlistToggle, onQuickView, onColorSelect, onSizeSelect, selectedColorId, selectedSizeId, size, className, ...props }: WakaProductCardProps): import("react/jsx-runtime").JSX.Element;
+export interface WakaProductGridProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Number of columns */
+    columns?: 2 | 3 | 4 | 5;
+    /** Gap between items */
+    gap?: "sm" | "md" | "lg";
+    /** Children */
+    children: React.ReactNode;
+}
+export declare function WakaProductGrid({ columns, gap, className, children, ...props }: WakaProductGridProps): import("react/jsx-runtime").JSX.Element;
+export interface WakaProductCardSkeletonProps {
+    /** Card size */
+    size?: "sm" | "default" | "lg";
+    /** Show variants placeholder */
+    showVariants?: boolean;
+}
+export declare function WakaProductCardSkeleton({ size, showVariants, }: WakaProductCardSkeletonProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/waka-progress-onboarding/index.d.ts

@@ -0,0 +1,97 @@
+import * as React from "react";
+export interface OnboardingStep {
+    /** Unique identifier for the step */
+    id: string;
+    /** Label for the step (displayed in full variant) */
+    label: string;
+    /** Optional description */
+    description?: string;
+    /** Optional icon for the step */
+    icon?: React.ReactNode;
+    /** Whether the step is completed */
+    completed?: boolean;
+    /** Whether the step is optional */
+    optional?: boolean;
+}
+export type OnboardingVariant = "mini" | "full";
+export type OnboardingOrientation = "horizontal" | "vertical";
+export type OnboardingColor = "default" | "blue" | "green" | "purple" | "orange" | "custom";
+export interface WakaProgressOnboardingProps {
+    /** List of onboarding steps */
+    steps: OnboardingStep[];
+    /** Current step index (0-indexed) */
+    currentStep: number;
+    /** Variant: mini (compact for headers) or full (with labels) */
+    variant?: OnboardingVariant;
+    /** Orientation of the progress bar */
+    orientation?: OnboardingOrientation;
+    /** Show percentage completion */
+    showPercentage?: boolean;
+    /** Show step markers/dots */
+    showStepMarkers?: boolean;
+    /** Animate progress fill */
+    animated?: boolean;
+    /** Color theme */
+    color?: OnboardingColor;
+    /** Custom primary color (when color is "custom") */
+    customColor?: string;
+    /** Show confetti animation on completion */
+    showConfettiOnComplete?: boolean;
+    /** Dismissible - show close button */
+    dismissible?: boolean;
+    /** Callback when dismissed */
+    onDismiss?: () => void;
+    /** Callback when step is clicked (for clickable steps) */
+    onStepClick?: (stepIndex: number) => void;
+    /** Whether steps are clickable */
+    clickable?: boolean;
+    /** Additional class name */
+    className?: string;
+}
+export interface ProgressOnboardingState {
+    /** Current step index */
+    currentStep: number;
+    /** List of steps */
+    steps: OnboardingStep[];
+    /** Whether onboarding is completed */
+    isCompleted: boolean;
+    /** Whether onboarding is dismissed */
+    isDismissed: boolean;
+    /** Percentage completion */
+    percentage: number;
+}
+export interface UseProgressOnboardingOptions {
+    /** Initial steps configuration */
+    initialSteps: OnboardingStep[];
+    /** Initial current step */
+    initialStep?: number;
+    /** Callback when onboarding is completed */
+    onComplete?: () => void;
+    /** Callback when step changes */
+    onStepChange?: (step: number) => void;
+    /** Persist state in localStorage */
+    persistKey?: string;
+}
+export interface UseProgressOnboardingReturn extends ProgressOnboardingState {
+    /** Go to a specific step */
+    goToStep: (stepIndex: number) => void;
+    /** Go to next step */
+    nextStep: () => void;
+    /** Go to previous step */
+    prevStep: () => void;
+    /** Mark a step as completed */
+    completeStep: (stepId: string) => void;
+    /** Mark a step as incomplete */
+    uncompleteStep: (stepId: string) => void;
+    /** Mark current step as complete and go to next */
+    completeAndNext: () => void;
+    /** Dismiss the onboarding */
+    dismiss: () => void;
+    /** Reset the onboarding */
+    reset: () => void;
+    /** Update steps */
+    setSteps: (steps: OnboardingStep[]) => void;
+}
+export declare function WakaProgressOnboarding({ steps, currentStep, variant, orientation, showPercentage, showStepMarkers, animated, color, customColor, showConfettiOnComplete, dismissible, onDismiss, onStepClick, clickable, className, }: WakaProgressOnboardingProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function useProgressOnboarding({ initialSteps, initialStep, onComplete, onStepChange, persistKey, }: UseProgressOnboardingOptions): UseProgressOnboardingReturn;
+export default WakaProgressOnboarding;

package/dist/components/waka-pull-to-refresh/index.d.ts

@@ -0,0 +1,45 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from "react";
+export type RefreshState = "idle" | "pulling" | "ready" | "refreshing" | "complete";
+export interface WakaPullToRefreshProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof pullToRefreshVariants> {
+    /** Async function to call on refresh */
+    onRefresh: () => Promise<void>;
+    /** Pull distance required to trigger refresh (default: 80) */
+    pullThreshold?: number;
+    /** Maximum pull distance (default: 150) */
+    maxPull?: number;
+    /** Resistance factor when pulling (default: 0.5) */
+    resistance?: number;
+    /** Custom indicator component */
+    indicator?: React.ReactNode | ((state: RefreshState, progress: number) => React.ReactNode);
+    /** Custom pulling text */
+    pullingText?: string;
+    /** Custom ready text */
+    readyText?: string;
+    /** Custom refreshing text */
+    refreshingText?: string;
+    /** Custom complete text */
+    completeText?: string;
+    /** Enable haptic feedback */
+    hapticFeedback?: boolean;
+    /** Disable pull-to-refresh */
+    disabled?: boolean;
+    /** Called when pull state changes */
+    onStateChange?: (state: RefreshState) => void;
+    /** Children to render as scrollable content */
+    children: React.ReactNode;
+}
+declare const pullToRefreshVariants: (props?: ({
+    variant?: "default" | "ios" | "material" | null | undefined;
+} & import('class-variance-authority/dist/types').ClassProp) | undefined) => string;
+export declare const WakaPullToRefresh: React.ForwardRefExoticComponent<WakaPullToRefreshProps & React.RefAttributes<HTMLDivElement>>;
+export interface UsePullToRefreshOptions {
+    onRefresh: () => Promise<void>;
+    onStateChange?: (state: RefreshState) => void;
+}
+export declare function usePullToRefresh({ onRefresh, onStateChange }: UsePullToRefreshOptions): {
+    state: RefreshState;
+    isRefreshing: boolean;
+    refresh: () => Promise<void>;
+};
+export {};

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

@@ -0,0 +1,110 @@
+import * as React from "react";
+export interface QuestObjective {
+    /** Unique identifier */
+    id: string;
+    /** Objective description */
+    text: string;
+    /** Whether the objective is completed */
+    completed: boolean;
+    /** Current progress value (for countable objectives) */
+    current?: number;
+    /** Target value (for countable objectives) */
+    target?: number;
+}
+export interface QuestReward {
+    /** Type of reward */
+    type: "xp" | "badge" | "item" | "currency";
+    /** Value of the reward (number for XP/currency, string for badge/item names) */
+    value: number | string;
+    /** Optional custom icon */
+    icon?: React.ReactNode;
+}
+export interface QuestChainInfo {
+    /** Chain identifier */
+    chainId: string;
+    /** Chain name */
+    chainName: string;
+    /** Current quest position in chain (1-indexed) */
+    currentPosition: number;
+    /** Total quests in chain */
+    totalQuests: number;
+    /** Previous quest ID (if any) */
+    previousQuestId?: string;
+    /** Next quest ID (if any) */
+    nextQuestId?: string;
+}
+export interface Quest {
+    /** Unique identifier */
+    id: string;
+    /** Quest title */
+    title: string;
+    /** Quest description */
+    description: string;
+    /** Quest type */
+    type: "daily" | "weekly" | "story" | "challenge" | "achievement";
+    /** Difficulty level */
+    difficulty: "easy" | "medium" | "hard" | "legendary";
+    /** List of objectives */
+    objectives: QuestObjective[];
+    /** List of rewards */
+    rewards: QuestReward[];
+    /** Expiration date for timed quests */
+    expiresAt?: Date;
+    /** Overall progress percentage (0-100) */
+    progress: number;
+    /** Current quest status */
+    status: "available" | "in_progress" | "completed" | "claimed" | "expired" | "abandoned";
+    /** Quest chain information (if part of a series) */
+    chainInfo?: QuestChainInfo;
+    /** Whether the quest can be abandoned */
+    canAbandon?: boolean;
+}
+export interface WakaQuestCardProps {
+    /** Quest data */
+    quest: Quest;
+    /** Callback when claiming rewards */
+    onClaim?: (questId: string) => void;
+    /** Callback when clicking an objective */
+    onObjectiveClick?: (questId: string, objectiveId: string) => void;
+    /** Callback when abandoning a quest */
+    onAbandon?: (questId: string) => void;
+    /** Callback when clicking on chain navigation */
+    onChainNavigate?: (questId: string, direction: "previous" | "next") => void;
+    /** Display variant */
+    variant?: "compact" | "detailed";
+    /** Show abandon confirmation dialog */
+    showAbandonConfirm?: boolean;
+    /** Custom className */
+    className?: string;
+}
+export declare function WakaQuestCard({ quest, onClaim, onObjectiveClick, onAbandon, onChainNavigate, variant, showAbandonConfirm, className, }: WakaQuestCardProps): import("react/jsx-runtime").JSX.Element;
+export declare function WakaQuestCardSkeleton({ variant }: {
+    variant?: "compact" | "detailed";
+}): import("react/jsx-runtime").JSX.Element;
+export interface WakaQuestListProps {
+    quests: Quest[];
+    variant?: "compact" | "detailed";
+    emptyMessage?: string;
+    onClaim?: (questId: string) => void;
+    onObjectiveClick?: (questId: string, objectiveId: string) => void;
+    className?: string;
+}
+export declare function WakaQuestList({ quests, variant, emptyMessage, onClaim, onObjectiveClick, className, }: WakaQuestListProps): import("react/jsx-runtime").JSX.Element;
+export interface UseQuestsOptions {
+    initialQuests: Quest[];
+    onQuestComplete?: (quest: Quest) => void;
+    onQuestClaimed?: (quest: Quest) => void;
+}
+export declare function useQuests({ initialQuests, onQuestComplete, onQuestClaimed }: UseQuestsOptions): {
+    quests: Quest[];
+    setQuests: React.Dispatch<React.SetStateAction<Quest[]>>;
+    updateObjective: (questId: string, objectiveId: string, completed: boolean) => void;
+    incrementObjective: (questId: string, objectiveId: string, amount?: number) => void;
+    claimQuest: (questId: string) => void;
+    addQuest: (quest: Quest) => void;
+    removeQuest: (questId: string) => void;
+    getQuestsByStatus: (status: Quest["status"]) => Quest[];
+    getQuestsByType: (type: Quest["type"]) => Quest[];
+    activeQuests: Quest[];
+    completedQuests: Quest[];
+};

package/dist/components/waka-quota-bar/index.d.ts

@@ -0,0 +1,100 @@
+export interface WakaQuotaBarColors {
+    /** Color for normal usage (below soft limit) */
+    normal: string;
+    /** Color for warning zone (approaching soft limit) */
+    warning: string;
+    /** Color for danger zone (approaching hard limit) */
+    danger: string;
+    /** Color for overflow (exceeding hard limit) */
+    overflow: string;
+}
+export interface WakaQuotaBarProps {
+    /** Current usage value */
+    current: number;
+    /** Soft limit threshold (optional warning point) */
+    softLimit?: number;
+    /** Hard limit (maximum allowed) */
+    hardLimit: number;
+    /** Label for the quota bar */
+    label?: string;
+    /** Unit of measurement (e.g., "GB", "MB", "items") */
+    unit?: string;
+    /** Show value labels */
+    showLabels?: boolean;
+    /** Show limit markers on the bar */
+    showMarkers?: boolean;
+    /** Size variant */
+    size?: "sm" | "md" | "lg";
+    /** Visual variant */
+    variant?: "simple" | "detailed";
+    /** Enable fill animation */
+    animated?: boolean;
+    /** Custom color configuration */
+    colors?: Partial<WakaQuotaBarColors>;
+    /** Custom value formatter */
+    formatValue?: (value: number) => string;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaQuotaBar({ current, softLimit, hardLimit, label, unit, showLabels, showMarkers, size, variant, animated, colors: customColors, formatValue, className, }: WakaQuotaBarProps): import("react/jsx-runtime").JSX.Element;
+export interface QuotaResource {
+    /** Unique identifier for the resource */
+    id: string;
+    /** Display label */
+    label: string;
+    /** Current usage */
+    current: number;
+    /** Soft limit (optional) */
+    softLimit?: number;
+    /** Hard limit */
+    hardLimit: number;
+    /** Unit of measurement */
+    unit?: string;
+    /** Custom colors */
+    colors?: Partial<WakaQuotaBarColors>;
+}
+export interface WakaMultiQuotaBarProps {
+    /** Array of quota resources to display */
+    resources: QuotaResource[];
+    /** Show all resource details in a compact layout */
+    compact?: boolean;
+    /** Size variant */
+    size?: "sm" | "md" | "lg";
+    /** Enable animations */
+    animated?: boolean;
+    /** Custom value formatter */
+    formatValue?: (value: number) => string;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaMultiQuotaBar({ resources, compact, size, animated, formatValue, className, }: WakaMultiQuotaBarProps): import("react/jsx-runtime").JSX.Element;
+export interface UseQuotaOptions {
+    /** Initial current value */
+    initialValue?: number;
+    /** Soft limit */
+    softLimit?: number;
+    /** Hard limit */
+    hardLimit: number;
+    /** Callback when approaching soft limit */
+    onApproachingSoftLimit?: (current: number) => void;
+    /** Callback when approaching hard limit */
+    onApproachingHardLimit?: (current: number) => void;
+    /** Callback when exceeding hard limit */
+    onOverflow?: (current: number, overflow: number) => void;
+    /** Threshold percentage for "approaching" (default: 80%) */
+    approachingThreshold?: number;
+}
+export declare function useQuota({ initialValue, softLimit, hardLimit, onApproachingSoftLimit, onApproachingHardLimit, onOverflow, approachingThreshold, }: UseQuotaOptions): {
+    current: number;
+    usagePercentage: number;
+    softLimitPercentage: number | undefined;
+    isOverflow: boolean;
+    overflowAmount: number;
+    remaining: number;
+    zone: "overflow" | "warning" | "normal" | "danger";
+    add: (amount: number) => void;
+    subtract: (amount: number) => void;
+    set: (value: number) => void;
+    reset: () => void;
+};
+export default WakaQuotaBar;

package/dist/components/waka-radar-score/index.d.ts

@@ -0,0 +1,95 @@
+import * as React from "react";
+export interface RadarDataPoint {
+    /** Label for the axis */
+    label: string;
+    /** Value (0-100) */
+    value: number;
+    /** Optional maximum value (defaults to 100) */
+    max?: number;
+}
+export interface RadarDataSet {
+    /** Unique identifier */
+    id: string;
+    /** Label for the dataset */
+    label: string;
+    /** Data points matching the axes */
+    data: number[];
+    /** Color for the dataset */
+    color?: string;
+    /** Fill opacity (0-1) */
+    fillOpacity?: number;
+    /** Stroke width */
+    strokeWidth?: number;
+}
+export interface WakaRadarScoreProps {
+    /** Axis labels */
+    axes: string[];
+    /** Data sets to display */
+    datasets: RadarDataSet[];
+    /** Size of the chart in pixels */
+    size?: number;
+    /** Number of grid levels */
+    levels?: number;
+    /** Maximum value for the scale */
+    maxValue?: number;
+    /** Show grid lines */
+    showGrid?: boolean;
+    /** Show axis labels */
+    showLabels?: boolean;
+    /** Show data points */
+    showPoints?: boolean;
+    /** Show values on hover */
+    showTooltip?: boolean;
+    /** Animate the chart on mount */
+    animated?: boolean;
+    /** Animation duration in ms */
+    animationDuration?: number;
+    /** Custom className */
+    className?: string;
+    /** Legend position */
+    legendPosition?: "none" | "top" | "bottom" | "left" | "right";
+    /** Grid color */
+    gridColor?: string;
+    /** Axis color */
+    axisColor?: string;
+    /** Label color */
+    labelColor?: string;
+}
+export declare function useRadarScore(datasets: RadarDataSet[]): {
+    activeDataset: string | null;
+    setActiveDataset: React.Dispatch<React.SetStateAction<string | null>>;
+    hoveredPoint: {
+        datasetId: string;
+        axisIndex: number;
+    } | null;
+    setHoveredPoint: React.Dispatch<React.SetStateAction<{
+        datasetId: string;
+        axisIndex: number;
+    } | null>>;
+};
+export declare function WakaRadarScore({ axes, datasets, size, levels, maxValue, showGrid, showLabels, showPoints, showTooltip, animated, animationDuration, className, legendPosition, gridColor, axisColor, labelColor, }: WakaRadarScoreProps): import("react/jsx-runtime").JSX.Element;
+export interface WakaRadarScoreSimpleProps extends Omit<WakaRadarScoreProps, "datasets" | "axes"> {
+    /** Data points with labels and values */
+    data: RadarDataPoint[];
+    /** Color for the chart */
+    color?: string;
+    /** Fill opacity */
+    fillOpacity?: number;
+}
+export declare function WakaRadarScoreSimple({ data, color, fillOpacity, ...props }: WakaRadarScoreSimpleProps): import("react/jsx-runtime").JSX.Element;
+export interface WakaRadarScoreCompareProps extends Omit<WakaRadarScoreProps, "datasets"> {
+    /** First dataset */
+    dataA: {
+        label: string;
+        data: number[];
+        color?: string;
+    };
+    /** Second dataset */
+    dataB: {
+        label: string;
+        data: number[];
+        color?: string;
+    };
+}
+export declare function WakaRadarScoreCompare({ dataA, dataB, ...props }: WakaRadarScoreCompareProps): import("react/jsx-runtime").JSX.Element;
+export default WakaRadarScore;

package/dist/components/waka-rank-badge/index.d.ts

@@ -0,0 +1,58 @@
+export type RankTier = "bronze" | "silver" | "gold" | "platinum" | "diamond" | "master" | "grandmaster";
+export type RankDivision = 1 | 2 | 3 | 4 | 5;
+export type RankSize = "sm" | "md" | "lg" | "xl";
+export interface WakaRankBadgeProps {
+    /** Current rank tier */
+    rank: RankTier;
+    /** Division within the rank (1 = highest, 5 = lowest) */
+    division?: RankDivision;
+    /** Current points */
+    points?: number;
+    /** Points needed for next rank/division */
+    pointsToNext?: number;
+    /** Size variant */
+    size?: RankSize;
+    /** Show points display */
+    showPoints?: boolean;
+    /** Show division display */
+    showDivision?: boolean;
+    /** Enable animations */
+    animated?: boolean;
+    /** Previous rank for promotion animation */
+    previousRank?: RankTier;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaRankBadge({ rank, division, points, pointsToNext, size, showPoints, showDivision, animated, previousRank, className, }: WakaRankBadgeProps): import("react/jsx-runtime").JSX.Element;
+export interface WakaRankBadgeGroupProps {
+    /** Current rank to highlight */
+    currentRank: RankTier;
+    /** Size of badges */
+    size?: RankSize;
+    /** Show all ranks or only nearby ranks */
+    showAll?: boolean;
+    /** Number of ranks to show on each side of current */
+    range?: number;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaRankBadgeGroup({ currentRank, size, showAll, range, className, }: WakaRankBadgeGroupProps): import("react/jsx-runtime").JSX.Element;
+export interface UseRankOptions {
+    initialRank?: RankTier;
+    initialDivision?: RankDivision;
+    initialPoints?: number;
+    pointsPerDivision?: number;
+    pointsPerRank?: number;
+}
+export interface UseRankReturn {
+    rank: RankTier;
+    division: RankDivision;
+    points: number;
+    pointsToNext: number;
+    previousRank: RankTier | undefined;
+    addPoints: (amount: number) => void;
+    setRank: (rank: RankTier, division?: RankDivision) => void;
+    reset: () => void;
+}
+export declare function useRank(options?: UseRankOptions): UseRankReturn;
+export default WakaRankBadge;