@hotelcard/ui 0.0.46 → 0.0.48

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import { ButtonHTMLAttributes } from 'react';
+import { CSSProperties } from 'react';
 import { default as default_2 } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { i18n } from 'i18next';
@@ -47,6 +48,105 @@ export declare interface BadgeProps {
     className?: string;
 }
 
+/**
+ * BaseCard - Container component
+ *
+ * A composable card container that provides consistent styling.
+ * Use with BaseCardImage and BaseCardContent for complete cards.
+ *
+ * @example
+ * ```tsx
+ * <BaseCard hoverable onClick={handleClick}>
+ *   <BaseCardImage src={imageUrl} alt="Hotel" topRightSlot={<FavoriteButton />} />
+ *   <BaseCardContent padding="large">
+ *     <h3>Hotel Name</h3>
+ *     <p>Location</p>
+ *   </BaseCardContent>
+ * </BaseCard>
+ * ```
+ */
+export declare const BaseCard: default_2.FC<BaseCardProps>;
+
+/**
+ * BaseCardContent - Content container with configurable padding
+ *
+ * Wraps card content with consistent spacing.
+ */
+export declare const BaseCardContent: default_2.FC<BaseCardContentProps>;
+
+export declare interface BaseCardContentProps {
+    /** Child content */
+    children: ReactNode;
+    /** Padding size: 'none' | 'small' | 'medium' | 'large' */
+    padding?: 'none' | 'small' | 'medium' | 'large';
+    /** Additional class name */
+    className?: string;
+    /** Custom styles */
+    style?: CSSProperties;
+    /** Content click handler */
+    onClick?: () => void;
+}
+
+/**
+ * BaseCardImage - Image container with overlay slots
+ *
+ * Provides consistent image styling with support for overlays
+ * like badges, favorite buttons, and indicators.
+ */
+export declare const BaseCardImage: default_2.FC<BaseCardImageProps>;
+
+export declare interface BaseCardImageProps {
+    /** Image source URL */
+    src: string;
+    /** Alt text for accessibility */
+    alt: string;
+    /** Image height (default: 268.5px for mobile) */
+    height?: number | string;
+    /** Aspect ratio (e.g., "16/9") - alternative to fixed height */
+    aspectRatio?: string;
+    /** Top-left overlay slot (e.g., badges) */
+    topLeftSlot?: ReactNode;
+    /** Top-right overlay slot (e.g., favorite button) */
+    topRightSlot?: ReactNode;
+    /** Bottom overlay slot (e.g., indicators, buttons) */
+    bottomSlot?: ReactNode;
+    /** Center overlay slot (e.g., play button) */
+    centerSlot?: ReactNode;
+    /** Whether to show gradient overlay for better text visibility */
+    showGradient?: boolean;
+    /** Image click handler (separate from card click) */
+    onClick?: () => void;
+    /** Custom styles */
+    style?: CSSProperties;
+    /** Additional class name */
+    className?: string;
+    /** Placeholder shown while loading or on error */
+    placeholder?: string;
+    /** Border radius for image container (default: inherits from card) */
+    borderRadius?: string;
+}
+
+/**
+ * BaseCard - Composable card container for building hotel/booking cards
+ *
+ * Provides consistent styling for:
+ * - Card container (border, radius, shadow)
+ * - Image container (aspect ratio, overlays)
+ * - Content container (padding)
+ */
+export declare interface BaseCardProps {
+    /** Child content - can include BaseCardImage and BaseCardContent */
+    children: ReactNode;
+    /** Additional CSS class name */
+    className?: string;
+    /** Card click handler */
+    onClick?: () => void;
+    /** Whether to show hover shadow effect */
+    hoverable?: boolean;
+    /** Custom border radius (default: 24px) */
+    borderRadius?: number | string;
+}
+
 export declare interface BenefitItem {
     icon?: string;
     title: string;
@@ -1008,6 +1108,7 @@ export declare interface Hotel {
  * HotelCard Component
  *
  * A presentational card component for displaying hotel information in search results.
+ * Built on BaseCard for consistent card styling across the app.
  * Platform-agnostic - navigation and auth logic should be handled by consuming apps.
  * Translations handled internally via UIContext.
  *
@@ -1703,10 +1804,15 @@ export declare interface ThemeAggregation {
 }
 
 /** Translation function type */
-export declare type TranslateFunction = (key: string, fallback?: string) => string;
+export declare type TranslateFunction = (key: string, optionsOrFallback?: TranslateOptions | string, fallback?: string) => string;
 
 declare type TranslateFunction_2 = (key: string, optionsOrFallback?: string | Record<string, unknown>, fallback?: string) => string;
 
+/** Translation options for interpolation */
+export declare interface TranslateOptions {
+    [key: string]: string | number;
+}
+
 export declare type TranslationKeys = typeof _default;
 
 export declare const translations: {