@wakastellar/ui 3.5.0 → 4.0.0-dev.0

package/dist/components/waka-connection-matrix/index.d.ts

@@ -0,0 +1,117 @@
+import * as React from "react";
+export type ConnectionType = "http" | "grpc" | "websocket" | "database" | "queue" | "custom";
+export interface Connection {
+    /** Source service/component ID */
+    source: string;
+    /** Target service/component ID */
+    target: string;
+    /** Connection strength/frequency (0-100) */
+    weight: number;
+    /** Type of connection */
+    type: ConnectionType;
+    /** Number of requests/calls */
+    count?: number;
+    /** Average latency in ms */
+    latency?: number;
+    /** Error rate percentage */
+    errorRate?: number;
+    /** Additional metadata */
+    metadata?: Record<string, string | number>;
+}
+export interface Service {
+    /** Unique identifier */
+    id: string;
+    /** Display name */
+    name: string;
+    /** Service category/group */
+    category?: string;
+    /** Service color for visualization */
+    color?: string;
+}
+export interface ConnectionDetails {
+    source: Service;
+    target: Service;
+    connection: Connection;
+}
+export interface ConnectionStatistics {
+    /** Total number of connections */
+    totalConnections: number;
+    /** Average connection weight */
+    averageWeight: number;
+    /** Maximum connection weight */
+    maxWeight: number;
+    /** Minimum connection weight (non-zero) */
+    minWeight: number;
+    /** Total request count */
+    totalCount: number;
+    /** Average latency */
+    averageLatency: number;
+    /** Connection density (actual/possible) */
+    density: number;
+}
+export interface WakaConnectionMatrixProps {
+    /** List of services/components */
+    services: Service[];
+    /** Connection data between services */
+    connections: Connection[];
+    /** Title for the matrix */
+    title?: string;
+    /** Show statistics panel */
+    showStatistics?: boolean;
+    /** Show filter controls */
+    showFilters?: boolean;
+    /** Color scheme for intensity */
+    colorScheme?: "blue" | "green" | "purple" | "orange" | "red";
+    /** Cell size */
+    cellSize?: "sm" | "md" | "lg";
+    /** Callback when a cell is clicked */
+    onCellClick?: (details: ConnectionDetails | null) => void;
+    /** Callback when a connection is hovered */
+    onCellHover?: (details: ConnectionDetails | null) => void;
+    /** Show connection count in cells */
+    showCounts?: boolean;
+    /** Enable sorting */
+    sortable?: boolean;
+    /** Custom className */
+    className?: string;
+}
+export interface UseConnectionMatrixOptions {
+    /** Initial services */
+    services: Service[];
+    /** Initial connections */
+    connections: Connection[];
+    /** Initial filter types */
+    initialFilterTypes?: ConnectionType[];
+    /** Initial sort order */
+    initialSortOrder?: "name" | "connections" | "weight";
+}
+export declare function useConnectionMatrix({ services: initialServices, connections: initialConnections, initialFilterTypes, initialSortOrder, }: UseConnectionMatrixOptions): {
+    services: Service[];
+    connections: Connection[];
+    connectionMap: Map<string, Connection>;
+    statistics: ConnectionStatistics;
+    filterTypes: Set<ConnectionType>;
+    sortOrder: "name" | "weight" | "connections";
+    highlightedService: string;
+    selectedCell: {
+        source: string;
+        target: string;
+    };
+    getConnection: (sourceId: string, targetId: string) => Connection | undefined;
+    getService: (id: string) => Service | undefined;
+    toggleFilterType: (type: ConnectionType) => void;
+    setAllFilterTypes: (types: ConnectionType[]) => void;
+    setSortOrder: React.Dispatch<React.SetStateAction<"name" | "weight" | "connections">>;
+    setHighlightedService: React.Dispatch<React.SetStateAction<string>>;
+    setSelectedCell: React.Dispatch<React.SetStateAction<{
+        source: string;
+        target: string;
+    }>>;
+    updateConnections: (newConnections: Connection[]) => void;
+    updateServices: (newServices: Service[]) => void;
+    addConnection: (connection: Connection) => void;
+    removeConnection: (sourceId: string, targetId: string) => void;
+    getRelatedConnections: (serviceId: string) => Connection[];
+};
+export declare function WakaConnectionMatrix({ services, connections, title, showStatistics, showFilters, colorScheme, cellSize, onCellClick, onCellHover, showCounts, sortable, className, }: WakaConnectionMatrixProps): import("react/jsx-runtime").JSX.Element;
+export default WakaConnectionMatrix;

package/dist/components/waka-container-list/index.d.ts

@@ -0,0 +1,51 @@
+export type ContainerStatus = "running" | "stopped" | "paused" | "restarting" | "exited" | "created";
+export interface ContainerResource {
+    cpu: number;
+    memory: number;
+    memoryLimit: number;
+    networkRx: number;
+    networkTx: number;
+}
+export interface Container {
+    id: string;
+    name: string;
+    image: string;
+    status: ContainerStatus;
+    createdAt: Date;
+    startedAt?: Date;
+    ports?: Array<{
+        host: number;
+        container: number;
+        protocol: string;
+    }>;
+    resources?: ContainerResource;
+    labels?: Record<string, string>;
+    command?: string;
+    exitCode?: number;
+}
+export interface WakaContainerListProps {
+    /** List of containers */
+    containers: Container[];
+    /** Callback when starting a container */
+    onStart?: (containerId: string) => void;
+    /** Callback when stopping a container */
+    onStop?: (containerId: string) => void;
+    /** Callback when restarting a container */
+    onRestart?: (containerId: string) => void;
+    /** Callback when removing a container */
+    onRemove?: (containerId: string) => void;
+    /** Callback when viewing logs */
+    onViewLogs?: (containerId: string) => void;
+    /** Callback when opening terminal */
+    onExec?: (containerId: string) => void;
+    /** Callback when refreshing */
+    onRefresh?: () => void;
+    /** Whether data is loading */
+    isLoading?: boolean;
+    /** Custom class name */
+    className?: string;
+    /** Title */
+    title?: string;
+}
+export declare function WakaContainerList({ containers, onStart, onStop, onRestart, onRemove, onViewLogs, onExec, onRefresh, isLoading, className, title, }: WakaContainerListProps): import("react/jsx-runtime").JSX.Element;
+export declare const defaultContainers: Container[];

package/dist/components/waka-content-recommendation/index.d.ts

@@ -0,0 +1,23 @@
+export type RecommendationLayout = "grid" | "carousel" | "list";
+export interface WakaContentRecommendationProps {
+    /** Widget title */
+    title?: string;
+    /** Slot IDs for recommendations */
+    slotIds: string[];
+    /** Layout style */
+    layout?: RecommendationLayout;
+    /** Number of columns for grid layout */
+    columns?: 2 | 3 | 4;
+    /** Show navigation arrows for carousel */
+    showArrows?: boolean;
+    /** Auto-scroll carousel */
+    autoScroll?: boolean;
+    /** Auto-scroll interval (seconds) */
+    autoScrollInterval?: number;
+    /** Custom class name */
+    className?: string;
+    /** Callback when item is clicked */
+    onItemClick?: (slotId: string) => void;
+}
+export declare function WakaContentRecommendation({ title, slotIds, layout, columns, showArrows, autoScroll, autoScrollInterval, className, onItemClick, }: WakaContentRecommendationProps): import("react/jsx-runtime").JSX.Element;
+export default WakaContentRecommendation;

package/dist/components/waka-contribution-graph/index.d.ts

@@ -0,0 +1,34 @@
+export interface ContributionData {
+    /** Date of the contribution (ISO string or Date object) */
+    date: string | Date;
+    /** Number of contributions on this day */
+    count: number;
+}
+export interface WakaContributionGraphProps {
+    /** Array of contribution data */
+    contributions: ContributionData[];
+    /** Year to display (defaults to current year) */
+    year?: number;
+    /** Predefined color scheme */
+    colorScheme?: "green" | "blue" | "purple" | "orange";
+    /** Custom colors array (5 levels: none, low, medium, high, max) */
+    colors?: string[];
+    /** Callback when a cell is clicked */
+    onCellClick?: (date: Date, count: number) => void;
+    /** Show weekday labels (Mon, Wed, Fri) */
+    showWeekdayLabels?: boolean;
+    /** Show month labels */
+    showMonthLabels?: boolean;
+    /** Show legend */
+    showLegend?: boolean;
+    /** Show streak indicators */
+    showStreak?: boolean;
+    /** Size of each cell in pixels */
+    cellSize?: number;
+    /** Gap between cells in pixels */
+    cellGap?: number;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaContributionGraph({ contributions, year, colorScheme, colors, onCellClick, showWeekdayLabels, showMonthLabels, showLegend, showStreak, cellSize, cellGap, className, }: WakaContributionGraphProps): import("react/jsx-runtime").JSX.Element;
+export default WakaContributionGraph;

package/dist/components/waka-cost-breakdown/index.d.ts

@@ -0,0 +1,50 @@
+import * as React from "react";
+export interface CostItem {
+    /** Unique identifier */
+    id: string;
+    /** Display name */
+    name: string;
+    /** Cost value */
+    value: number;
+    /** Custom color */
+    color?: string;
+    /** Child items for hierarchical data */
+    children?: CostItem[];
+    /** Percentage change from previous period */
+    change?: number;
+}
+export interface WakaCostBreakdownProps {
+    /** Hierarchical cost data */
+    data: CostItem[];
+    /** Visualization variant */
+    variant?: "treemap" | "sunburst";
+    /** Currency symbol or code */
+    currency?: string;
+    /** Show legend with percentages */
+    showLegend?: boolean;
+    /** Show comparison indicators */
+    showComparison?: boolean;
+    /** Callback when an item is clicked */
+    onItemClick?: (id: string, path: string[]) => void;
+    /** Custom value formatter */
+    formatValue?: (value: number) => string;
+    /** Enable animations */
+    animated?: boolean;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaCostBreakdown({ data, variant, currency, showLegend, showComparison, onItemClick, formatValue, animated, className, }: WakaCostBreakdownProps): import("react/jsx-runtime").JSX.Element;
+export interface UseCostBreakdownOptions {
+    data: CostItem[];
+    onDrillDown?: (path: string[]) => void;
+}
+export declare function useCostBreakdown({ data, onDrillDown }: UseCostBreakdownOptions): {
+    path: string[];
+    selectedItem: string;
+    setSelectedItem: React.Dispatch<React.SetStateAction<string>>;
+    drillDown: (itemId: string) => void;
+    drillUp: () => void;
+    reset: () => void;
+    getCurrentData: () => CostItem[];
+};
+export default WakaCostBreakdown;

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

@@ -0,0 +1,105 @@
+export interface Coupon {
+    /** Unique coupon code */
+    code: string;
+    /** Discount value (percentage or fixed amount) */
+    discountValue: number;
+    /** Discount type */
+    discountType: "percentage" | "fixed";
+    /** Optional description */
+    description?: string;
+    /** Optional expiration date */
+    expiresAt?: Date;
+}
+export interface CouponValidationResult {
+    /** Whether the coupon is valid */
+    isValid: boolean;
+    /** The coupon data if valid */
+    coupon?: Coupon;
+    /** Error message if invalid */
+    errorMessage?: string;
+}
+export interface WakaCouponInputProps {
+    /** Currently applied coupons */
+    appliedCoupons?: Coupon[];
+    /** Callback when a coupon is applied */
+    onApply?: (coupon: Coupon) => void;
+    /** Callback when a coupon is removed */
+    onRemove?: (code: string) => void;
+    /** Validation function that returns a promise */
+    validateCoupon?: (code: string) => Promise<CouponValidationResult>;
+    /** Allow multiple coupons */
+    allowMultiple?: boolean;
+    /** Maximum number of coupons (when allowMultiple is true) */
+    maxCoupons?: number;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Apply button text */
+    applyButtonText?: string;
+    /** Currency symbol for fixed discounts */
+    currencySymbol?: string;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Size variant */
+    size?: "sm" | "md" | "lg";
+    /** Custom class name */
+    className?: string;
+    /** Custom input class name */
+    inputClassName?: string;
+    /** Custom button class name */
+    buttonClassName?: string;
+    /** Show applied coupons list */
+    showAppliedCoupons?: boolean;
+    /** Format discount display */
+    formatDiscount?: (coupon: Coupon) => string;
+    /** ID for accessibility */
+    id?: string;
+    /** Name attribute */
+    name?: string;
+}
+export type CouponInputStatus = "idle" | "loading" | "success" | "error";
+export interface UseCouponInputOptions {
+    /** Initial applied coupons */
+    initialCoupons?: Coupon[];
+    /** Validation function */
+    validateCoupon?: (code: string) => Promise<CouponValidationResult>;
+    /** Allow multiple coupons */
+    allowMultiple?: boolean;
+    /** Maximum coupons */
+    maxCoupons?: number;
+    /** Callback when coupon is applied */
+    onApply?: (coupon: Coupon) => void;
+    /** Callback when coupon is removed */
+    onRemove?: (code: string) => void;
+    /** Reset delay after success/error (ms) */
+    statusResetDelay?: number;
+}
+export interface UseCouponInputReturn {
+    /** Current input value */
+    inputValue: string;
+    /** Set input value */
+    setInputValue: (value: string) => void;
+    /** Current status */
+    status: CouponInputStatus;
+    /** Error message if any */
+    errorMessage: string | null;
+    /** Applied coupons */
+    appliedCoupons: Coupon[];
+    /** Apply the current input value as a coupon */
+    applyCoupon: () => Promise<void>;
+    /** Remove a coupon by code */
+    removeCoupon: (code: string) => void;
+    /** Clear all coupons */
+    clearAllCoupons: () => void;
+    /** Reset input and status */
+    resetInput: () => void;
+    /** Check if can apply more coupons */
+    canApplyMore: boolean;
+    /** Check if a code is already applied */
+    isCodeApplied: (code: string) => boolean;
+}
+export declare function useCouponInput(options?: UseCouponInputOptions): UseCouponInputReturn;
+export declare function WakaCouponInput({ appliedCoupons: controlledAppliedCoupons, onApply, onRemove, validateCoupon, allowMultiple, maxCoupons, placeholder, applyButtonText, currencySymbol, disabled, size, className, inputClassName, buttonClassName, showAppliedCoupons, formatDiscount, id, name, }: WakaCouponInputProps): import("react/jsx-runtime").JSX.Element;
+export declare namespace WakaCouponInput {
+    var displayName: string;
+}
+export default WakaCouponInput;

package/dist/components/waka-credit-activity-feed/index.d.ts

@@ -0,0 +1,21 @@
+import type { CreditTransaction } from "../waka-credit-balance/types";
+export interface WakaCreditActivityFeedProps {
+    /** List of credit transactions to display */
+    activities: CreditTransaction[];
+    /** Maximum number of items to display */
+    maxItems?: number;
+    /** Show "Load more" button at bottom */
+    showLoadMore?: boolean;
+    /** Callback when "Load more" is clicked */
+    onLoadMore?: () => void;
+    /** Show loading skeleton state */
+    loading?: boolean;
+    /** Message to display when activity list is empty */
+    emptyMessage?: string;
+    /** Enable staggered fade-in animation for items */
+    animated?: boolean;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaCreditActivityFeed({ activities, maxItems, showLoadMore, onLoadMore, loading, emptyMessage, animated, className, }: WakaCreditActivityFeedProps): import("react/jsx-runtime").JSX.Element;
+export default WakaCreditActivityFeed;

package/dist/components/waka-credit-alert/index.d.ts

@@ -0,0 +1,24 @@
+import type { CreditAlertLevel } from "../waka-credit-balance/types";
+export type { CreditAlertLevel } from "../waka-credit-balance/types";
+export interface WakaCreditAlertProps {
+    /** Alert severity level */
+    level: CreditAlertLevel;
+    /** Current credit balance */
+    balance: number;
+    /** Threshold value that triggered the alert */
+    threshold?: number;
+    /** Custom message (overrides default) */
+    message?: string;
+    /** Callback when dismissing the alert */
+    onDismiss?: () => void;
+    /** Callback when clicking the top-up action */
+    onTopUp?: () => void;
+    /** Label for the top-up button */
+    topUpLabel?: string;
+    /** Whether the alert can be dismissed */
+    dismissable?: boolean;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaCreditAlert({ level, balance, threshold, message, onDismiss, onTopUp, topUpLabel, dismissable, className, }: WakaCreditAlertProps): import("react/jsx-runtime").JSX.Element;
+export default WakaCreditAlert;

package/dist/components/waka-credit-balance/index.d.ts

@@ -0,0 +1,30 @@
+import type { CreditThresholds } from "./types";
+export type { CreditThresholds } from "./types";
+export interface WakaCreditBalanceProps {
+    /** Current credit balance */
+    balance: number;
+    /** Currency symbol or label (default: "credits") */
+    currency?: string;
+    /** Trend indicator */
+    trend?: {
+        direction: "up" | "down" | "neutral";
+        value: string;
+        text?: string;
+    };
+    /** Thresholds for color changes */
+    thresholds?: CreditThresholds;
+    /** Visual variant */
+    variant?: "card" | "compact" | "minimal";
+    /** Component size */
+    size?: "sm" | "md" | "lg";
+    /** Enable animated counter on value change */
+    animated?: boolean;
+    /** Show loading skeleton */
+    loading?: boolean;
+    /** Custom value formatter */
+    formatValue?: (value: number) => string;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaCreditBalance({ balance, currency, trend, thresholds, variant, size, animated, loading, formatValue, className, }: WakaCreditBalanceProps): import("react/jsx-runtime").JSX.Element;
+export default WakaCreditBalance;

package/dist/components/waka-credit-balance/types.d.ts

@@ -0,0 +1,34 @@
+export type CreditTransactionType = "debit" | "credit" | "refund" | "bonus" | "expiry";
+export type CreditTransactionStatus = "completed" | "pending" | "failed" | "cancelled";
+export type CreditAlertLevel = "info" | "warning" | "critical" | "depleted";
+export interface CreditTransaction {
+    id: string;
+    type: CreditTransactionType;
+    amount: number;
+    description: string;
+    service?: string;
+    timestamp: string | Date;
+    status: CreditTransactionStatus;
+    balanceAfter?: number;
+}
+export interface CreditPack {
+    id: string;
+    name: string;
+    credits: number;
+    price: number;
+    currency?: string;
+    unitPrice?: number;
+    bonusPercent?: number;
+    highlighted?: boolean;
+    highlightLabel?: string;
+}
+export interface CreditThresholds {
+    warning: number;
+    critical: number;
+}
+export interface CreditServiceUsage {
+    id: string;
+    name: string;
+    value: number;
+    color?: string;
+}

package/dist/components/waka-credit-breakdown/index.d.ts

@@ -0,0 +1,32 @@
+export interface BreakdownItem {
+    /** Unique identifier */
+    id: string;
+    /** Display name */
+    name: string;
+    /** Credit consumption value */
+    value: number;
+    /** Custom color for this segment */
+    color?: string;
+}
+export interface WakaCreditBreakdownProps {
+    /** Breakdown data items */
+    data: BreakdownItem[];
+    /** Visualization variant */
+    variant?: "pie" | "donut" | "bar";
+    /** Show percentage labels */
+    showPercentages?: boolean;
+    /** Show legend */
+    showLegend?: boolean;
+    /** Chart height in pixels */
+    height?: number;
+    /** Enable animations */
+    animated?: boolean;
+    /** Callback when a segment is clicked */
+    onSegmentClick?: (item: BreakdownItem) => void;
+    /** Custom value formatter */
+    formatValue?: (value: number) => string;
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaCreditBreakdown({ data, variant, showPercentages, showLegend, height, animated, onSegmentClick, formatValue, className, }: WakaCreditBreakdownProps): import("react/jsx-runtime").JSX.Element;
+export default WakaCreditBreakdown;

package/dist/components/waka-credit-burn-rate/index.d.ts

@@ -0,0 +1,25 @@
+export interface WakaCreditBurnRateProps {
+    /** Array of daily usage data points */
+    dailyUsage: {
+        date: string;
+        value: number;
+    }[];
+    /** Current credit balance */
+    balance: number;
+    /** Show projection line on the sparkline */
+    showProjection?: boolean;
+    /** Number of days to project forward */
+    projectionDays?: number;
+    /** Width of the SVG sparkline */
+    width?: number;
+    /** Height of the SVG sparkline */
+    height?: number;
+    /** Animate the sparkline on mount */
+    animated?: boolean;
+    /** Display variant */
+    variant?: "sparkline" | "card";
+    /** Additional CSS classes */
+    className?: string;
+}
+export declare function WakaCreditBurnRate({ dailyUsage, balance, showProjection, projectionDays, width, height, animated, variant, className, }: WakaCreditBurnRateProps): import("react/jsx-runtime").JSX.Element;
+export default WakaCreditBurnRate;

package/dist/components/waka-credit-card-input/index.d.ts

@@ -0,0 +1,95 @@
+import * as React from "react";
+export type CardType = "visa" | "mastercard" | "amex" | "discover" | "diners" | "jcb" | "unionpay" | "maestro" | "unknown";
+export interface CardData {
+    /** Card number (formatted with spaces) */
+    cardNumber: string;
+    /** Raw card number (no spaces) */
+    rawCardNumber: string;
+    /** Card holder name */
+    cardHolder: string;
+    /** Expiry date (MM/YY) */
+    expiry: string;
+    /** CVV code */
+    cvv: string;
+    /** Detected card type */
+    cardType: CardType;
+}
+export interface CardErrors {
+    cardNumber?: string;
+    cardHolder?: string;
+    expiry?: string;
+    cvv?: string;
+}
+export interface WakaCreditCardInputProps {
+    /** Current card data */
+    value?: Partial<CardData>;
+    /** Callback when card data changes */
+    onChange?: (data: CardData) => void;
+    /** Callback when validation changes */
+    onValidationChange?: (isValid: boolean, errors: CardErrors) => void;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Read-only state */
+    readOnly?: boolean;
+    /** Combined single-field mode */
+    singleFieldMode?: boolean;
+    /** Show card flip preview animation */
+    showCardPreview?: boolean;
+    /** Show card type icon */
+    showCardTypeIcon?: boolean;
+    /** Placeholder texts */
+    placeholders?: {
+        cardNumber?: string;
+        cardHolder?: string;
+        expiry?: string;
+        cvv?: string;
+    };
+    /** Labels for fields */
+    labels?: {
+        cardNumber?: string;
+        cardHolder?: string;
+        expiry?: string;
+        cvv?: string;
+    };
+    /** Custom error messages */
+    errorMessages?: {
+        cardNumber?: string;
+        cardHolder?: string;
+        expiry?: string;
+        cvv?: string;
+        luhn?: string;
+    };
+    /** Size variant */
+    size?: "sm" | "md" | "lg";
+    /** Additional class names */
+    className?: string;
+    /** ID for accessibility */
+    id?: string;
+    /** Name prefix for form fields */
+    name?: string;
+    /** Auto-focus first field */
+    autoFocus?: boolean;
+}
+export interface UseCreditCardInputOptions {
+    /** Initial card data */
+    initialValue?: Partial<CardData>;
+    /** Validation on change */
+    validateOnChange?: boolean;
+    /** Custom error messages */
+    errorMessages?: WakaCreditCardInputProps["errorMessages"];
+}
+export declare function useCreditCardInput(options?: UseCreditCardInputOptions): {
+    cardData: CardData;
+    errors: CardErrors;
+    touched: Record<keyof CardErrors, boolean>;
+    isValid: boolean;
+    updateCardNumber: (value: string) => void;
+    updateCardHolder: (value: string) => void;
+    updateExpiry: (value: string) => void;
+    updateCvv: (value: string) => void;
+    validate: () => CardErrors;
+    reset: () => void;
+    setTouched: React.Dispatch<React.SetStateAction<Record<keyof CardErrors, boolean>>>;
+};
+export declare function WakaCreditCardInput({ value, onChange, onValidationChange, disabled, readOnly, singleFieldMode, showCardPreview, showCardTypeIcon, placeholders, labels, errorMessages, size, className, id, name, autoFocus, }: WakaCreditCardInputProps): import("react/jsx-runtime").JSX.Element;
+export default WakaCreditCardInput;