@classytic/fluid 0.2.4 → 0.3.3

package/dist/index.d.mts

@@ -0,0 +1,296 @@
+import { a as buildSearchParams, i as buildListingStatusParams, n as SearchConfig, o as clearSearchAndFilterParams, r as buildFilterParams, s as getApiParams, t as FilterConfig } from "./filter-utils-IZ0GtuPo.mjs";
+import { t as cn } from "./utils-CDue7cEt.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as React$1 from "react";
+import { ElementType, ReactNode } from "react";
+
+//#region src/layout/section.d.ts
+type Background = "default" | "muted" | "primary" | "transparent";
+type Padding = "none" | "sm" | "md" | "lg" | "xl";
+interface SectionProps {
+  id?: string;
+  children: ReactNode;
+  className?: string;
+  background?: Background;
+  padding?: Padding;
+}
+declare function Section({
+  id,
+  children,
+  className,
+  background,
+  padding
+}: SectionProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/layout/container.d.ts
+type MaxWidth = "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "6xl" | "7xl" | "full";
+interface ContainerProps {
+  children: ReactNode;
+  className?: string;
+  maxWidth?: MaxWidth;
+}
+declare function Container({
+  children,
+  className,
+  maxWidth
+}: ContainerProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/display-heading.d.ts
+interface DisplayHeadingProps {
+  children: ReactNode;
+  size?: "lg" | "xl" | "2xl";
+  align?: "left" | "center" | "right";
+  className?: string;
+  highlightText?: string;
+  highlightColor?: "primary" | "secondary" | "accent" | "gradient";
+  as?: ElementType;
+}
+/**
+ * DisplayHeading - Reusable component for hero/display headings
+ * Provides consistent typography across the platform
+ */
+declare function DisplayHeading({
+  children,
+  size,
+  align,
+  className,
+  highlightText,
+  highlightColor,
+  as: Component,
+  ...props
+}: DisplayHeadingProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/social-icons.d.ts
+declare const FacebookIcon: () => react_jsx_runtime0.JSX.Element;
+declare const GoogleIcon: () => react_jsx_runtime0.JSX.Element;
+declare const TwitterXIcon: () => react_jsx_runtime0.JSX.Element;
+declare const InstagramIcon: () => react_jsx_runtime0.JSX.Element;
+declare const WhatsAppIcon: () => react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/skeleton-wrappers.d.ts
+interface SkeletonTableProps {
+  /** Number of skeleton rows */
+  rows?: number;
+  /** Number of skeleton columns */
+  columns?: number;
+  /** Optional column headers - if provided, shows text instead of skeleton */
+  headers?: string[];
+  /** Additional CSS classes */
+  className?: string;
+}
+/**
+ * SkeletonTable - Loading skeleton for tables
+ * Matches DataTable structure for consistent loading states
+ *
+ * @example
+ * ```tsx
+ * <SkeletonTable rows={5} columns={4} />
+ * <SkeletonTable headers={["Name", "Email", "Status"]} rows={10} />
+ * ```
+ */
+declare function SkeletonTable({
+  rows,
+  columns,
+  headers,
+  className
+}: SkeletonTableProps): react_jsx_runtime0.JSX.Element;
+interface SkeletonListProps {
+  /** Number of skeleton items */
+  items?: number;
+  /** Additional CSS classes */
+  className?: string;
+  /** Show avatar placeholder */
+  showAvatar?: boolean;
+  /** Avatar shape */
+  avatarShape?: "circle" | "square";
+}
+/**
+ * SkeletonList - Compact skeleton for lists with avatars
+ *
+ * @example
+ * ```tsx
+ * <SkeletonList items={5} />
+ * <SkeletonList items={3} showAvatar={false} />
+ * ```
+ */
+declare function SkeletonList({
+  items,
+  className,
+  showAvatar,
+  avatarShape
+}: SkeletonListProps): react_jsx_runtime0.JSX.Element;
+interface SkeletonCardProps {
+  /** Additional CSS classes */
+  className?: string;
+  /** Show action buttons placeholder */
+  showActions?: boolean;
+  /** Number of text lines */
+  lines?: number;
+}
+/**
+ * SkeletonCard - Card skeleton for grid layouts
+ *
+ * @example
+ * ```tsx
+ * <SkeletonCard />
+ * <SkeletonCard showActions={false} lines={2} />
+ * ```
+ */
+declare function SkeletonCard({
+  className,
+  showActions,
+  lines
+}: SkeletonCardProps): react_jsx_runtime0.JSX.Element;
+interface SkeletonGridProps {
+  /** Number of skeleton cards */
+  cards?: number;
+  /** Grid columns configuration */
+  columns?: 1 | 2 | 3 | 4;
+  /** Additional CSS classes */
+  className?: string;
+  /** Props passed to each SkeletonCard */
+  cardProps?: Omit<SkeletonCardProps, "className">;
+}
+/**
+ * SkeletonGrid - Grid of skeleton cards
+ *
+ * @example
+ * ```tsx
+ * <SkeletonGrid cards={6} columns={3} />
+ * ```
+ */
+declare function SkeletonGrid({
+  cards,
+  columns,
+  className,
+  cardProps
+}: SkeletonGridProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/loading-state.d.ts
+interface LoadingStateProps {
+  /** Loading message text */
+  text?: string;
+  /** Visual variant */
+  variant?: "default" | "inline" | "overlay" | "minimal";
+  /** Spinner size */
+  size?: "sm" | "md" | "lg";
+  /** Additional className */
+  className?: string;
+}
+interface LoadingOverlayProps {
+  /** Loading message text */
+  text?: string;
+  /** Whether the overlay is visible */
+  visible?: boolean;
+  /** Additional className */
+  className?: string;
+  /** Children to render behind the overlay */
+  children?: React$1.ReactNode;
+}
+/**
+ * LoadingState — Versatile loading indicator
+ *
+ * @example Default (centered, full area)
+ * ```tsx
+ * <LoadingState text="Loading projects..." />
+ * ```
+ *
+ * @example Inline (in a row)
+ * ```tsx
+ * <LoadingState variant="inline" text="Saving..." size="sm" />
+ * ```
+ *
+ * @example Minimal (just the spinner)
+ * ```tsx
+ * <LoadingState variant="minimal" />
+ * ```
+ */
+declare function LoadingState({
+  text,
+  variant,
+  size,
+  className
+}: LoadingStateProps): react_jsx_runtime0.JSX.Element;
+/**
+ * LoadingOverlay — Renders children with an overlay spinner on top
+ *
+ * @example
+ * ```tsx
+ * <LoadingOverlay visible={isSaving} text="Saving changes...">
+ *   <MyFormContent />
+ * </LoadingOverlay>
+ * ```
+ */
+declare function LoadingOverlay({
+  text,
+  visible,
+  className,
+  children
+}: LoadingOverlayProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/empty-state.d.ts
+interface EmptyStateProps {
+  /** Title text */
+  title?: string;
+  /** Description / subtitle */
+  description?: string;
+  /** Icon element (ReactNode) — e.g. <SearchX /> or <MyCustomIcon /> */
+  icon?: React$1.ReactNode;
+  /** Primary action button */
+  action?: React$1.ReactNode;
+  /** Secondary action button */
+  secondaryAction?: React$1.ReactNode;
+  /** Visual variant */
+  variant?: "default" | "compact" | "card";
+  /** Additional className */
+  className?: string;
+  /** Children rendered below the description */
+  children?: React$1.ReactNode;
+}
+/**
+ * EmptyState — Higher-level wrapper around the composable Empty primitives.
+ *
+ * Composes: Empty, EmptyHeader, EmptyMedia, EmptyTitle, EmptyDescription, EmptyContent
+ *
+ * @example Default
+ * ```tsx
+ * <EmptyState
+ *   title="No projects yet"
+ *   description="Create your first project to get started."
+ *   icon={<FolderPlus className="h-6 w-6" />}
+ *   action={<Button>Create Project</Button>}
+ * />
+ * ```
+ *
+ * @example Compact (inline)
+ * ```tsx
+ * <EmptyState variant="compact" title="No items" />
+ * ```
+ *
+ * @example With preset
+ * ```tsx
+ * <EmptyStateNoResults action={<Button onClick={clearFilters}>Clear filters</Button>} />
+ * ```
+ */
+declare function EmptyState({
+  title,
+  description,
+  icon,
+  action,
+  secondaryAction,
+  variant,
+  className,
+  children
+}: EmptyStateProps): react_jsx_runtime0.JSX.Element;
+type EmptyStatePresetProps = Omit<EmptyStateProps, "icon" | "title" | "description"> & {
+  title?: string;
+  description?: string;
+};
+/** No search results — with search icon */
+declare function EmptyStateNoResults(props: EmptyStatePresetProps): react_jsx_runtime0.JSX.Element;
+/** No data — with inbox icon */
+declare function EmptyStateNoData(props: EmptyStatePresetProps): react_jsx_runtime0.JSX.Element;
+/** Not found — with file-x icon */
+declare function EmptyStateNotFound(props: EmptyStatePresetProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Container, type ContainerProps, DisplayHeading, type DisplayHeadingProps, EmptyState, EmptyStateNoData, EmptyStateNoResults, EmptyStateNotFound, type EmptyStatePresetProps, type EmptyStateProps, FacebookIcon, type FilterConfig, GoogleIcon, InstagramIcon, LoadingOverlay, type LoadingOverlayProps, LoadingState, type LoadingStateProps, type SearchConfig, Section, type SectionProps, SkeletonCard, type SkeletonCardProps, SkeletonGrid, type SkeletonGridProps, SkeletonList, type SkeletonListProps, SkeletonTable, type SkeletonTableProps, TwitterXIcon, WhatsAppIcon, buildFilterParams, buildListingStatusParams, buildSearchParams, clearSearchAndFilterParams, cn, getApiParams };