@jmruthers/pace-core 0.5.54 → 0.5.55

package/src/components/PrintCard/examples/PrintCardShowcase.tsx

@@ -1,239 +0,0 @@
-/**
- * @file PrintCard Showcase Example
- * @package @jmruthers/pace-core
- * @module PrintCardShowcase
- * @since 0.4.38
- * 
- * Example showcasing PrintCard components usage.
- */
-
-import React from 'react';
-import { 
-  PrintLayout,
-  PrintHeader,
-  PrintText,
-  PrintCard, 
-  PrintCardHeader, 
-  PrintCardContent, 
-  PrintCardFooter, 
-  PrintCardImage, 
-  PrintCardGrid 
-} from '../../index';
-
-export function PrintCardShowcase() {
-  return (
-    <PrintLayout
-      orientation="portrait"
-      pageSize="A4"
-      firstPageHeader={
-        <PrintHeader
-          title="Print Card Components Showcase"
-          subtitle="Demonstrating various card layouts and configurations"
-          branding={{
-            logo: "/pace_logo_square.svg",
-            companyName: "Pace Core"
-          }}
-          metadata={[
-            { label: 'Date', value: new Date().toLocaleDateString() },
-            { label: 'Page', value: "1" }
-          ]}
-        />
-      }
-    >
-      <div className="space-y-8">
-        {/* Basic Card Examples */}
-        <section>
-          <PrintText variant="heading" className="mb-4">
-            Basic Card Examples
-          </PrintText>
-          
-          <PrintCardGrid columns={2} gap="md">
-            <PrintCard title="Default Card" variant="default">
-              <PrintCardContent>
-                <PrintText>
-                  This is a default card with standard styling and padding.
-                </PrintText>
-              </PrintCardContent>
-            </PrintCard>
-
-            <PrintCard title="Outlined Card" variant="outlined">
-              <PrintCardContent>
-                <PrintText>
-                  This card uses the outlined variant with a border and transparent background.
-                </PrintText>
-              </PrintCardContent>
-            </PrintCard>
-
-            <PrintCard title="Filled Card" variant="filled" backgroundColor="gray">
-              <PrintCardContent>
-                <PrintText>
-                  This card uses the filled variant with a muted background.
-                </PrintText>
-              </PrintCardContent>
-            </PrintCard>
-
-            <PrintCard title="Elevated Card" variant="elevated">
-              <PrintCardContent>
-                <PrintText>
-                  This card uses the elevated variant with a shadow effect.
-                </PrintText>
-              </PrintCardContent>
-            </PrintCard>
-          </PrintCardGrid>
-        </section>
-
-        {/* Card with Image */}
-        <section>
-          <PrintText variant="heading" className="mb-4">
-            Card with Image
-          </PrintText>
-          
-          <PrintCardGrid columns={2} gap="md">
-            <PrintCard title="Product Card" layout="vertical">
-              <PrintCardImage
-                src="/pace_logo_square.svg"
-                alt="Product Image"
-                aspectRatio="square"
-                objectFit="contain"
-              />
-              <PrintCardContent>
-                <PrintText variant="subheading" weight="semibold">
-                  Premium Product
-                </PrintText>
-                <PrintText variant="caption" color="muted">
-                  High-quality item with excellent features
-                </PrintText>
-                <PrintText className="mt-2">
-                  $99.99
-                </PrintText>
-              </PrintCardContent>
-            </PrintCard>
-
-            <PrintCard title="Profile Card" layout="horizontal">
-              <PrintCardImage
-                src="/pace_logo_square.svg"
-                alt="Profile Picture"
-                aspectRatio="square"
-                width="80"
-                height="80"
-              />
-              <PrintCardContent>
-                <PrintText variant="subheading" weight="semibold">
-                  John Doe
-                </PrintText>
-                <PrintText variant="caption" color="muted">
-                  Software Engineer
-                </PrintText>
-                <PrintText className="mt-2">
-                  john.doe@example.com
-                </PrintText>
-              </PrintCardContent>
-            </PrintCard>
-          </PrintCardGrid>
-        </section>
-
-        {/* Card with Header and Footer */}
-        <section>
-          <PrintText variant="heading" className="mb-4">
-            Card with Header and Footer
-          </PrintText>
-          
-          <PrintCardGrid columns={1} gap="md">
-            <PrintCard>
-              <PrintCardHeader
-                title="Project Status"
-                subtitle="Current project progress and updates"
-                actions={<PrintText variant="caption">Last updated: Today</PrintText>}
-              >
-                <PrintText variant="heading">Project Status</PrintText>
-              </PrintCardHeader>
-              <PrintCardContent>
-                <PrintText>
-                  The project is progressing well with all major milestones completed on time.
-                  The team has been working diligently to ensure quality deliverables.
-                </PrintText>
-                <PrintText className="mt-2">
-                  <strong>Next Steps:</strong> Final testing and deployment preparation.
-                </PrintText>
-              </PrintCardContent>
-              <PrintCardFooter align="right">
-                <PrintText variant="caption" color="muted">
-                  Project Manager: Jane Smith
-                </PrintText>
-              </PrintCardFooter>
-            </PrintCard>
-          </PrintCardGrid>
-        </section>
-
-        {/* Compact Cards */}
-        <section>
-          <PrintText variant="heading" className="mb-4">
-            Compact Cards
-          </PrintText>
-          
-          <PrintCardGrid columns={3} gap="sm">
-            <PrintCard layout="compact" size="sm" variant="outlined">
-              <PrintText variant="small" weight="semibold">
-                Quick Stats
-              </PrintText>
-              <PrintText variant="small">
-                1,234 items
-              </PrintText>
-            </PrintCard>
-
-            <PrintCard layout="compact" size="sm" variant="outlined">
-              <PrintText variant="small" weight="semibold">
-                Status
-              </PrintText>
-              <PrintText variant="small" color="accent">
-                Active
-              </PrintText>
-            </PrintCard>
-
-            <PrintCard layout="compact" size="sm" variant="outlined">
-              <PrintText variant="small" weight="semibold">
-                Priority
-              </PrintText>
-              <PrintText variant="small" color="primary">
-                High
-              </PrintText>
-            </PrintCard>
-          </PrintCardGrid>
-        </section>
-
-        {/* Color Variations */}
-        <section>
-          <PrintText variant="heading" className="mb-4">
-            Color Variations
-          </PrintText>
-          
-          <PrintCardGrid columns={2} gap="md">
-            <PrintCard 
-              backgroundColor="primary" 
-              textColor="primary"
-              title="Primary Card"
-            >
-              <PrintCardContent>
-                <PrintText>
-                  This card uses the primary color scheme.
-                </PrintText>
-              </PrintCardContent>
-            </PrintCard>
-
-            <PrintCard 
-              backgroundColor="accent" 
-              textColor="accent"
-              title="Accent Card"
-            >
-              <PrintCardContent>
-                <PrintText>
-                  This card uses the accent color scheme.
-                </PrintText>
-              </PrintCardContent>
-            </PrintCard>
-          </PrintCardGrid>
-        </section>
-      </div>
-    </PrintLayout>
-  );
-}

package/src/components/PrintCard/index.ts

@@ -1,34 +0,0 @@
-/**
- * @file PrintCard Exports
- * @package @jmruthers/pace-core
- * @module PrintCard
- * @since 0.4.38
- * 
- * Exports for PrintCard components.
- */
-
-export { PrintCard } from './PrintCard';
-export { PrintCardHeader } from './PrintCardHeader';
-export { PrintCardContent } from './PrintCardContent';
-export { PrintCardFooter } from './PrintCardFooter';
-export { PrintCardImage } from './PrintCardImage';
-export { PrintCardGrid } from './PrintCardGrid';
-
-export type {
-  PrintCardProps,
-  PrintCardHeaderProps,
-  PrintCardContentProps,
-  PrintCardFooterProps,
-  PrintCardImageProps,
-  PrintCardGridProps,
-  PrintCardVariant,
-  PrintCardSize,
-  PrintCardLayout,
-  PrintCardBackgroundColor,
-  PrintCardTextColor,
-  PrintCardAlignment,
-  PrintCardPadding,
-  PrintCardAspectRatio,
-  PrintCardObjectFit,
-  PrintCardGap,
-} from './types';

package/src/components/PrintCard/types.ts

@@ -1,171 +0,0 @@
-/**
- * @file PrintCard Types
- * @package @jmruthers/pace-core
- * @module PrintCard
- * @since 0.4.38
- * 
- * Type definitions for PrintCard component.
- */
-
-import { ReactNode } from 'react';
-
-export interface PrintCardProps {
-  /** Card content */
-  children: ReactNode;
-  
-  /** Card title */
-  title?: string;
-  
-  /** Card subtitle */
-  subtitle?: string;
-  
-  /** Card variant */
-  variant?: 'default' | 'outlined' | 'filled' | 'elevated';
-  
-  /** Card size */
-  size?: 'sm' | 'md' | 'lg' | 'xl';
-  
-  /** Card layout */
-  layout?: 'vertical' | 'horizontal' | 'compact';
-  
-  /** Show card border */
-  showBorder?: boolean;
-  
-  /** Card background color */
-  backgroundColor?: 'white' | 'gray' | 'primary' | 'secondary' | 'accent';
-  
-  /** Card text color */
-  textColor?: 'primary' | 'secondary' | 'muted' | 'accent' | 'destructive';
-  
-  /** Print optimization */
-  printOptimized?: boolean;
-  
-  /** Custom CSS classes */
-  className?: string;
-  
-  /** Additional props */
-  [key: string]: any;
-}
-
-export interface PrintCardHeaderProps {
-  /** Header content */
-  children: ReactNode;
-  
-  /** Header title */
-  title?: string;
-  
-  /** Header subtitle */
-  subtitle?: string;
-  
-  /** Header actions */
-  actions?: ReactNode;
-  
-  /** Header alignment */
-  align?: 'left' | 'center' | 'right';
-  
-  /** Print optimization */
-  printOptimized?: boolean;
-  
-  /** Custom CSS classes */
-  className?: string;
-  
-  /** Additional props */
-  [key: string]: any;
-}
-
-export interface PrintCardContentProps {
-  /** Content */
-  children: ReactNode;
-  
-  /** Content padding */
-  padding?: 'none' | 'sm' | 'md' | 'lg';
-  
-  /** Print optimization */
-  printOptimized?: boolean;
-  
-  /** Custom CSS classes */
-  className?: string;
-  
-  /** Additional props */
-  [key: string]: any;
-}
-
-export interface PrintCardFooterProps {
-  /** Footer content */
-  children: ReactNode;
-  
-  /** Footer alignment */
-  align?: 'left' | 'center' | 'right';
-  
-  /** Print optimization */
-  printOptimized?: boolean;
-  
-  /** Custom CSS classes */
-  className?: string;
-  
-  /** Additional props */
-  [key: string]: any;
-}
-
-export interface PrintCardImageProps {
-  /** Image source */
-  src: string;
-  
-  /** Image alt text */
-  alt: string;
-  
-  /** Image width */
-  width?: string | number;
-  
-  /** Image height */
-  height?: string | number;
-  
-  /** Image aspect ratio */
-  aspectRatio?: 'square' | 'portrait' | 'landscape' | 'auto';
-  
-  /** Image object fit */
-  objectFit?: 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
-  
-  /** Print optimization */
-  printOptimized?: boolean;
-  
-  /** Custom CSS classes */
-  className?: string;
-  
-  /** Additional props */
-  [key: string]: any;
-}
-
-export interface PrintCardGridProps {
-  /** Grid items */
-  children: ReactNode;
-  
-  /** Number of columns */
-  columns?: 1 | 2 | 3 | 4 | 5 | 6;
-  
-  /** Column gap */
-  gap?: 'sm' | 'md' | 'lg' | 'xl';
-  
-  /** Row gap */
-  rowGap?: 'sm' | 'md' | 'lg' | 'xl';
-  
-  /** Print optimization */
-  printOptimized?: boolean;
-  
-  /** Custom CSS classes */
-  className?: string;
-  
-  /** Additional props */
-  [key: string]: any;
-}
-
-export type PrintCardVariant = 'default' | 'outlined' | 'filled' | 'elevated';
-export type PrintCardSize = 'sm' | 'md' | 'lg' | 'xl';
-export type PrintCardLayout = 'vertical' | 'horizontal' | 'compact';
-export type PrintCardBackgroundColor = 'white' | 'gray' | 'primary' | 'secondary' | 'accent';
-export type PrintCardTextColor = 'primary' | 'secondary' | 'muted' | 'accent' | 'destructive';
-export type PrintCardAlignment = 'left' | 'center' | 'right';
-export type PrintCardPadding = 'none' | 'sm' | 'md' | 'lg';
-export type PrintCardAspectRatio = 'square' | 'portrait' | 'landscape' | 'auto';
-export type PrintCardObjectFit = 'cover' | 'contain' | 'fill' | 'none' | 'scale-down';
-export type PrintCardGap = 'sm' | 'md' | 'lg' | 'xl';

package/src/components/PrintDataTable/PrintDataTable.tsx

@@ -1,215 +0,0 @@
-/**
- * @file PrintDataTable Component
- * @package @jmruthers/pace-core
- * @module PrintDataTable
- * @since 0.4.38
- * 
- * Print-optimized data table component with grouping and styling options.
- * 
- * Features:
- * - Print-optimized table rendering
- * - Column grouping with custom headers
- * - Page break controls per column
- * - Print-specific styling options
- * - Integration with existing theme system
- * 
- * @example
- * ```tsx
- * <PrintDataTable
- *   data={reportData}
- *   columns={columns}
- *   title="Analytics Summary"
- *   grouping={{
- *     enabled: true,
- *     groupBy: 'category',
- *     groupHeader: (group) => <CategoryGroupHeader group={group} />
- *   }}
- *   printOptimized={true}
- * />
- * ```
- */
-
-import React from 'react';
-import { cn } from '../../utils/cn';
-import { PrintText } from '../PrintText';
-import { PrintTableGroup } from './PrintTableGroup';
-import type { PrintDataTableProps, PrintColumn } from './types';
-
-/**
- * PrintDataTable component provides print-optimized table rendering with grouping support.
- */
-export function PrintDataTable({
-  data,
-  columns,
-  title,
-  showTitle = true,
-  grouping,
-  styling = {
-    headerStyle: 'solid',
-    rowStyle: 'striped',
-    cellPadding: 'normal'
-  },
-  printOptimized = true,
-  className,
-  ...props
-}: PrintDataTableProps) {
-  const getTableClasses = () => {
-    const baseClasses = 'w-full border-collapse';
-    
-    if (printOptimized) {
-      return cn(
-        baseClasses,
-        'print:text-xs print:leading-tight',
-        'print:border-black print:border-solid'
-      );
-    }
-    
-    return baseClasses;
-  };
-
-  const getHeaderClasses = () => {
-    const baseClasses = 'text-left font-semibold';
-    
-    switch (styling.headerStyle) {
-      case 'solid':
-        return cn(baseClasses, 'bg-primary text-primary-foreground');
-      case 'outline':
-        return cn(baseClasses, 'border-2 border-primary text-primary');
-      default:
-        return baseClasses;
-    }
-  };
-
-  const getRowClasses = (isEven: boolean) => {
-    const baseClasses = 'border-b border-border';
-    
-    switch (styling.rowStyle) {
-      case 'striped':
-        return cn(baseClasses, isEven ? 'bg-muted/30' : 'bg-background');
-      case 'solid':
-        return cn(baseClasses, 'bg-background');
-      case 'bordered':
-        return cn(baseClasses, 'border border-border bg-background');
-      default:
-        return baseClasses;
-    }
-  };
-
-  const getCellPaddingClasses = () => {
-    switch (styling.cellPadding) {
-      case 'compact':
-        return 'px-2 py-1 print:px-1 print:py-0.5';
-      case 'spacious':
-        return 'px-6 py-4 print:px-4 print:py-2';
-      case 'normal':
-      default:
-        return 'px-4 py-2 print:px-2 print:py-1';
-    }
-  };
-
-  const renderTableHeader = () => (
-    <thead>
-      <tr className={getHeaderClasses()}>
-        {columns.map((column) => (
-          <th
-            key={column.key}
-            className={cn(
-              getCellPaddingClasses(),
-              'text-left',
-              column.align === 'center' && 'text-center',
-              column.align === 'right' && 'text-right',
-              column.printBreak === 'avoid' && 'print-break-avoid',
-              column.printBreak === 'always' && 'print-break-before'
-            )}
-            style={{ width: column.width }}
-          >
-            <PrintText variant="small" weight="semibold">
-              {column.header}
-            </PrintText>
-          </th>
-        ))}
-      </tr>
-    </thead>
-  );
-
-  const renderTableBody = () => {
-    if (grouping?.enabled) {
-      const groupedData = groupDataByField(data, grouping.groupBy);
-      
-      return (
-        <tbody>
-          {Object.entries(groupedData).map(([groupKey, groupData], groupIndex) => (
-            <PrintTableGroup
-              key={groupKey}
-              groupKey={groupKey}
-              groupData={groupData}
-              columns={columns}
-              groupHeader={grouping.groupHeader}
-              styling={styling}
-              printOptimized={printOptimized}
-            />
-          ))}
-        </tbody>
-      );
-    }
-
-    return (
-      <tbody>
-        {data.map((row, index) => (
-          <tr
-            key={index}
-            className={getRowClasses(index % 2 === 0)}
-          >
-            {columns.map((column) => (
-              <td
-                key={column.key}
-                className={cn(
-                  getCellPaddingClasses(),
-                  'text-left',
-                  column.align === 'center' && 'text-center',
-                  column.align === 'right' && 'text-right',
-                  column.printBreak === 'avoid' && 'print-break-avoid'
-                )}
-              >
-                <PrintText variant="small">
-                  {column.render ? column.render(row[column.key], row) : row[column.key]}
-                </PrintText>
-              </td>
-            ))}
-          </tr>
-        ))}
-      </tbody>
-    );
-  };
-
-  return (
-    <div className={cn('print-data-table', className)} {...props}>
-      {title && showTitle && (
-        <div className="mb-4">
-          <PrintText variant="subheading" weight="semibold">
-            {title}
-          </PrintText>
-        </div>
-      )}
-      
-      <div className="overflow-x-auto print:overflow-visible">
-        <table className={getTableClasses()}>
-          {renderTableHeader()}
-          {renderTableBody()}
-        </table>
-      </div>
-    </div>
-  );
-}
-
-// Helper function to group data by field
-function groupDataByField(data: any[], field: string): Record<string, any[]> {
-  return data.reduce((groups, item) => {
-    const key = item[field] || 'Unknown';
-    if (!groups[key]) {
-      groups[key] = [];
-    }
-    groups[key].push(item);
-    return groups;
-  }, {} as Record<string, any[]>);
-}