@rakeyshgidwani/roger-ui-bank-theme-stan-design 0.2.8 → 0.2.10

package/dist/components/ui/data-display/types.esm.js

@@ -8,39 +8,39 @@ import React from 'react';
 // ============================================================================
 
 export interface DataDisplayBaseProps {
-  className?;
-  theme?;
-  size?;
-  variant?;
-  loading?;
-  error?;
-  emptyMessage?;
+  className?: string;
+  theme?: 'stan-design' | 'enterprise' | 'harvey';
+  size?: 'sm' | 'md' | 'lg';
+  variant?: 'default' | 'bordered' | 'striped';
+  loading?: boolean;
+  error?: string | null;
+  emptyMessage?: string;
 }
 
 export interface SortableColumn {
-  key;
-  label;
-  sortable?;
-  width?;
-  align?;
+  key: string;
+  label: string;
+  sortable?: boolean;
+  width?: string | number;
+  align?: 'left' | 'center' | 'right';
 }
 
 export interface SortConfig {
-  key;
-  direction;
+  key: string;
+  direction: 'asc' | 'desc';
 }
 
 export interface PaginationConfig {
-  currentPage;
-  pageSize;
-  totalItems;
-  pageSizeOptions?];
+  currentPage: number;
+  pageSize: number;
+  totalItems: number;
+  pageSizeOptions?: number[];
 }
 
 export interface FilterConfig {
-  key;
-  value;
-  operator;
+  key: string;
+  value: string | number | boolean;
+  operator: 'equals' | 'contains' | 'starts_with' | 'ends_with' | 'greater_than' | 'less_than';
 }
 
 // ============================================================================
@@ -48,44 +48,44 @@ export interface FilterConfig {
 // ============================================================================
 
 export interface TableProps extends DataDisplayBaseProps {
-  columns];
-  data, any>[];
-  sortable?;
-  selectable?;
-  expandable?;
-  onSort?) => void;
-  onSelectionChange?]) => void;
-  onRowClick?, any>, index) => void;
-  onRowExpand?, any>, expanded) => void;
-  selectedKeys?];
-  expandedKeys?];
-  sortConfig?;
-  pagination?;
-  onPageChange?) => void;
-  onPageSizeChange?) => void;
-  filters?];
-  onFiltersChange?]) => void;
-  searchable?;
-  searchValue?;
-  onSearchChange?) => void;
-  rowKey?, any>) => string);
-  loading?;
-  error?;
-  emptyMessage?;
+  columns: SortableColumn[];
+  data: Record<string, any>[];
+  sortable?: boolean;
+  selectable?: boolean;
+  expandable?: boolean;
+  onSort?: (config: SortConfig) => void;
+  onSelectionChange?: (selectedKeys: string[]) => void;
+  onRowClick?: (row: Record<string, any>, index: number) => void;
+  onRowExpand?: (row: Record<string, any>, expanded: boolean) => void;
+  selectedKeys?: string[];
+  expandedKeys?: string[];
+  sortConfig?: SortConfig;
+  pagination?: PaginationConfig;
+  onPageChange?: (page: number) => void;
+  onPageSizeChange?: (pageSize: number) => void;
+  filters?: FilterConfig[];
+  onFiltersChange?: (filters: FilterConfig[]) => void;
+  searchable?: boolean;
+  searchValue?: string;
+  onSearchChange?: (value: string) => void;
+  rowKey?: string | ((row: Record<string, any>) => string);
+  loading?: boolean;
+  error?: string | null;
+  emptyMessage?: string;
 }
 
 export interface TableRowProps {
-  row, any>;
-  index;
-  columns];
-  selected;
-  expanded;
-  onSelect) => void;
-  onExpand) => void;
-  onClick) => void;
-  theme;
-  size;
-  variant;
+  row: Record<string, any>;
+  index: number;
+  columns: SortableColumn[];
+  selected: boolean;
+  expanded: boolean;
+  onSelect: (checked: boolean) => void;
+  onExpand: () => void;
+  onClick: () => void;
+  theme: 'stan-design' | 'enterprise' | 'harvey';
+  size: 'sm' | 'md' | 'lg';
+  variant: 'default' | 'bordered' | 'striped' | 'compact';
 }
 
 // ============================================================================
@@ -93,47 +93,47 @@ export interface TableRowProps {
 // ============================================================================
 
 export interface DataGridProps extends DataDisplayBaseProps {
-  columns];
-  data, any>[];
-  sortable?;
-  filterable?;
-  groupable?;
-  resizable?;
-  reorderable?;
-  onSort?) => void;
-  onFiltersChange?]) => void;
-  onGroupChange?]) => void;
-  onColumnResize?, newWidth) => void;
-  onColumnReorder?, toIndex) => void;
-  sortConfig?;
-  filters?];
-  groups?];
-  columnWidths?, number>;
-  columnOrder?];
-  pagination?;
-  onPageChange?) => void;
-  onPageSizeChange?) => void;
-  searchable?;
-  searchValue?;
-  onSearchChange?) => void;
-  rowKey?, any>) => string);
-  selectable?;
-  onSelectionChange?]) => void;
-  selectedKeys?];
-  loading?;
-  error?;
-  emptyMessage?;
+  columns: SortableColumn[];
+  data: Record<string, any>[];
+  sortable?: boolean;
+  filterable?: boolean;
+  groupable?: boolean;
+  resizable?: boolean;
+  reorderable?: boolean;
+  onSort?: (config: SortConfig) => void;
+  onFiltersChange?: (filters: FilterConfig[]) => void;
+  onGroupChange?: (groups: string[]) => void;
+  onColumnResize?: (columnKey: string, newWidth: number) => void;
+  onColumnReorder?: (fromIndex: number, toIndex: number) => void;
+  sortConfig?: SortConfig;
+  filters?: FilterConfig[];
+  groups?: string[];
+  columnWidths?: Record<string, number>;
+  columnOrder?: string[];
+  pagination?: PaginationConfig;
+  onPageChange?: (page: number) => void;
+  onPageSizeChange?: (pageSize: number) => void;
+  searchable?: boolean;
+  searchValue?: string;
+  onSearchChange?: (value: string) => void;
+  rowKey?: string | ((row: Record<string, any>) => string);
+  selectable?: boolean;
+  onSelectionChange?: (selectedKeys: string[]) => void;
+  selectedKeys?: string[];
+  loading?: boolean;
+  error?: string | null;
+  emptyMessage?: string;
 }
 
 export interface DataGridColumnProps {
-  column;
-  index;
-  onSort) => void;
-  onResize) => void;
-  sortConfig?;
-  theme;
-  size;
-  resizable;
+  column: SortableColumn;
+  index: number;
+  onSort: () => void;
+  onResize: (width: number) => void;
+  sortConfig?: SortConfig;
+  theme: 'stan-design' | 'enterprise' | 'harvey';
+  size: 'sm' | 'md' | 'lg';
+  resizable: boolean;
 }
 
 // ============================================================================
@@ -141,67 +141,68 @@ export interface DataGridColumnProps {
 // ============================================================================
 
 export interface ListProps extends DataDisplayBaseProps {
-  items];
-  selectable?;
-  multiSelect?;
-  onSelectionChange?]) => void;
-  selectedKeys?];
-  onClick?, index) => void;
-  onItemClick?, index) => void;
-  onItemAction?, item) => void;
-  actions?];
-  itemRenderer?, index) => React.ReactNode;
-  searchable?;
-  searchValue?;
-  onSearchChange?) => void;
-  filterable?;
-  filters?];
-  onFiltersChange?]) => void;
-  sortable?;
-  sortConfig?;
-  onSort?) => void;
-  pagination?;
-  onPageChange?) => void;
-  onPageSizeChange?) => void;
-  showDividers?;
-  loading?;
-  error?;
-  emptyMessage?;
+  items: ListItem[];
+  selectable?: boolean;
+  multiSelect?: boolean;
+  onSelectionChange?: (selectedKeys: string[]) => void;
+  selectedKeys?: string[];
+  onClick?: (item: ListItem, index: number) => void;
+  onItemClick?: (item: ListItem, index: number) => void;
+  onItemAction?: (action: string, item: ListItem) => void;
+  actions?: ListAction[];
+  itemRenderer?: (item: ListItem, index: number) => React.ReactNode;
+  searchable?: boolean;
+  searchValue?: string;
+  onSearchChange?: (value: string) => void;
+  filterable?: boolean;
+  filters?: ListFilter[];
+  onFiltersChange?: (filters: ListFilter[]) => void;
+  sortable?: boolean;
+  sortConfig?: SortConfig;
+  onSort?: (config: SortConfig) => void;
+  pagination?: PaginationConfig;
+  onPageChange?: (page: number) => void;
+  onPageSizeChange?: (pageSize: number) => void;
+  showDividers?: boolean;
+  loading?: boolean;
+  error?: string | null;
+  emptyMessage?: string;
 }
 
 export interface ListItem {
-  id;
-  key?;
-  title;
-  description?;
-  subtitle?;
-  avatar?;
-  icon?;
-  metadata?;
-    status?;
-    badge?;
-    [key];
+  id: string;
+  key?: string;
+  title: string;
+  description?: string;
+  subtitle?: string;
+  avatar?: string | React.ReactNode;
+  icon?: React.ReactNode;
+  metadata?: {
+    timestamp?: string;
+    status?: 'active' | 'inactive' | 'warning' | 'error';
+    badge?: string;
+    [key: string]: any;
   };
-  actions?];
-  disabled?;
-  selected?;
+  actions?: ListAction[];
+  disabled?: boolean;
+  selected?: boolean;
 }
 
 export interface ListAction {
-  key;
-  label;
-  icon?;
-  onClick) => void;
-  disabled?;
-  variant?;
+  key: string;
+  label: string;
+  icon?: React.ReactNode;
+  onClick: (item: ListItem) => void;
+  disabled?: boolean;
+  variant?: 'default' | 'primary' | 'secondary' | 'danger';
 }
 
 export interface ListFilter {
-  key;
-  label;
-  type;
-  options?; label}[];
-  value?;
+  key: string;
+  label: string;
+  type: 'text' | 'select' | 'checkbox' | 'date';
+  options?: { value: string; label: string }[];
+  value?: any;
 }
 
 // ============================================================================
@@ -209,77 +210,78 @@ export interface ListFilter {
 // ============================================================================
 
 export interface TreeProps extends DataDisplayBaseProps {
-  data];
-  expandedKeys?];
-  selectedKeys?];
-  onExpandedKeysChange?]) => void;
-  onSelectedKeysChange?]) => void;
-  onNodeClick?, event) => void;
-  selectable?;
-  expandable?;
-  draggable?;
-  onDragStart?, event) => void;
-  onDragEnd?, event) => void;
-  onDrop?, dropNode, event) => void;
-  searchable?;
-  searchValue?;
-  onSearchChange?) => void;
-  filterable?;
-  filters?];
-  onFiltersChange?]) => void;
-  showLines?;
-  showIcons?;
-  expandAll?;
-  collapseAll?;
-  loading?;
-  error?;
-  emptyMessage?;
+  data: TreeNode[];
+  expandedKeys?: string[];
+  selectedKeys?: string[];
+  onExpandedKeysChange?: (expandedKeys: string[]) => void;
+  onSelectedKeysChange?: (selectedKeys: string[]) => void;
+  onNodeClick?: (node: TreeNode, event: React.MouseEvent) => void;
+  selectable?: boolean;
+  expandable?: boolean;
+  draggable?: boolean;
+  onDragStart?: (node: TreeNode, event: React.DragEvent) => void;
+  onDragEnd?: (node: TreeNode, event: React.DragEvent) => void;
+  onDrop?: (dragNode: TreeNode, dropNode: TreeNode, event: React.DragEvent) => void;
+  searchable?: boolean;
+  searchValue?: string;
+  onSearchChange?: (value: string) => void;
+  filterable?: boolean;
+  filters?: TreeFilter[];
+  onFiltersChange?: (filters: TreeFilter[]) => void;
+  showLines?: boolean;
+  showIcons?: boolean;
+  expandAll?: boolean;
+  collapseAll?: boolean;
+  loading?: boolean;
+  error?: string | null;
+  emptyMessage?: string;
 }
 
 export interface TreeNode {
-  id;
-  key?;
-  label;
-  description?;
-  children?];
-  icon?;
-  disabled?;
-  selectable?;
-  expandable?;
-  metadata?;
-    status?;
-    [key];
+  id: string;
+  key?: string;
+  label: string;
+  description?: string;
+  children?: TreeNode[];
+  icon?: React.ReactNode;
+  disabled?: boolean;
+  selectable?: boolean;
+  expandable?: boolean;
+  metadata?: {
+    count?: number;
+    status?: 'active' | 'inactive' | 'warning' | 'error';
+    [key: string]: any;
   };
-  data?, any>;
+  data?: Record<string, any>;
 }
 
 export interface TreeItemProps {
-  node;
-  level?;
-  expandedKeys];
-  selectedKeys];
-  selectable?;
-  expandable?;
-  onToggleExpand?, expanded) => void;
-  onSelectionChange?, selected) => void;
-  onClick?, event) => void;
-  theme;
-  size;
-  variant;
-  draggable?;
-  onDragStart?, event) => void;
-  onDragEnd?, event) => void;
-  onDrop?, dropNode, event) => void;
-  showLines?;
-  showIcons?;
+  node: TreeNode;
+  level?: number;
+  expandedKeys: string[];
+  selectedKeys: string[];
+  selectable?: boolean;
+  expandable?: boolean;
+  onToggleExpand?: (nodeId: string, expanded: boolean) => void;
+  onSelectionChange?: (nodeId: string, selected: boolean) => void;
+  onClick?: (node: TreeNode, event: React.MouseEvent) => void;
+  theme: string;
+  size: 'sm' | 'md' | 'lg';
+  variant: 'default' | 'bordered' | 'striped';
+  draggable?: boolean;
+  onDragStart?: (node: TreeNode, event: React.DragEvent) => void;
+  onDragEnd?: (node: TreeNode, event: React.DragEvent) => void;
+  onDrop?: (dragNode: TreeNode, dropNode: TreeNode, event: React.DragEvent) => void;
+  showLines?: boolean;
+  showIcons?: boolean;
 }
 
 export interface TreeFilter {
-  key;
-  label;
-  type;
-  options?; label}[];
-  value?;
+  key: string;
+  label: string;
+  type: 'text' | 'select' | 'checkbox' | 'date';
+  options?: { value: string; label: string }[];
+  value?: any;
 }
 
 // ============================================================================
@@ -287,70 +289,71 @@ export interface TreeFilter {
 // ============================================================================
 
 export interface TimelineProps extends DataDisplayBaseProps {
-  items];
-  mode?;
-  reverse?;
-  actions?];
-  onItemClick?) => void;
-  searchable?;
-  searchValue?;
-  onSearchChange?) => void;
-  filterable?;
-  filters?];
-  onFiltersChange?]) => void;
-  showConnector?;
-  loading?;
-  error?;
-  emptyMessage?;
+  items: TimelineItem[];
+  mode?: 'left' | 'right' | 'alternate';
+  reverse?: boolean;
+  actions?: TimelineAction[];
+  onItemClick?: (item: TimelineItem) => void;
+  searchable?: boolean;
+  searchValue?: string;
+  onSearchChange?: (value: string) => void;
+  filterable?: boolean;
+  filters?: TimelineFilter[];
+  onFiltersChange?: (filters: TimelineFilter[]) => void;
+  showConnector?: boolean;
+  loading?: boolean;
+  error?: string | null;
+  emptyMessage?: string;
 }
 
 export interface TimelineItem {
-  id;
-  title;
-  description?;
-  timestamp;
-  type?;
-  status?;
-  icon?;
-  content?;
-  metadata?;
-    category?;
-    tags?];
-    [key];
+  id: string;
+  title: string;
+  description?: string;
+  timestamp: string;
+  type?: 'event' | 'task' | 'user' | 'system';
+  status?: 'success' | 'warning' | 'error' | 'info' | 'pending' | 'processing' | 'completed';
+  icon?: React.ReactNode;
+  content?: React.ReactNode;
+  metadata?: {
+    author?: string;
+    category?: string;
+    tags?: string[];
+    [key: string]: any;
   };
-  actions?];
-  disabled?;
-  data?, any>;
+  actions?: TimelineAction[];
+  disabled?: boolean;
+  data?: Record<string, any>;
 }
 
 export interface TimelineAction {
-  key;
-  label;
-  icon?;
-  onClick) => void;
-  disabled?;
-  variant?;
+  key: string;
+  label: string;
+  icon?: React.ReactNode;
+  onClick: (item: TimelineItem) => void;
+  disabled?: boolean;
+  variant?: 'default' | 'primary' | 'secondary' | 'danger';
 }
 
 export interface TimelineItemProps {
-  item;
-  position;
-  isLast;
-  mode;
-  actions];
-  onClick?) => void;
-  theme;
-  size;
-  variant;
-  showConnector;
+  item: TimelineItem;
+  position: 'left' | 'right';
+  isLast: boolean;
+  mode: 'left' | 'right' | 'alternate';
+  actions: TimelineAction[];
+  onClick?: (item: TimelineItem) => void;
+  theme: string;
+  size: 'sm' | 'md' | 'lg';
+  variant: 'default' | 'bordered' | 'striped';
+  showConnector: boolean;
 }
 
 export interface TimelineFilter {
-  key;
-  label;
-  type;
-  options?; label}[];
-  value?;
+  key: string;
+  label: string;
+  type: 'text' | 'select' | 'checkbox' | 'date';
+  options?: { value: string; label: string }[];
+  value?: any;
 }
 
 // ============================================================================
@@ -358,149 +361,171 @@ export interface TimelineFilter {
 // ============================================================================
 
 export interface ChartProps extends DataDisplayBaseProps {
-  type?;
-  data;
-  options?;
-  height?;
-  width?;
-  responsive?;
-  showLegend?;
-  showValues?;
-  showGrid?;
-  animate?;
-  onDataPointClick?, index) => void;
-  onLegendClick?, index) => void;
-  loading?;
-  error?;
-  emptyMessage?;
+  type?: 'line' | 'bar' | 'pie' | 'doughnut' | 'area';
+  data: ChartData;
+  options?: ChartOptions;
+  height?: number | string;
+  width?: number | string;
+  responsive?: boolean;
+  showLegend?: boolean;
+  showValues?: boolean;
+  showGrid?: boolean;
+  animate?: boolean;
+  onDataPointClick?: (point: ChartDataPoint, index: number) => void;
+  onLegendClick?: (legend: ChartLegend, index: number) => void;
+  loading?: boolean;
+  error?: string | null;
+  emptyMessage?: string;
 }
 
 export interface ChartData {
-  labels];
-  datasets];
+  labels: string[];
+  datasets: ChartDataset[];
 }
 
 export interface ChartDataset {
-  label;
-  data)[];
-  color?;
-  backgroundColor?];
-  borderColor?];
-  borderWidth?;
-  fill?;
-  tension?;
-  pointRadius?;
-  pointHoverRadius?;
-  pointBackgroundColor?];
-  pointBorderColor?];
-  pointBorderWidth?;
-  pointStyle?;
-  hidden?;
+  label: string;
+  data: (number | ChartDataPoint)[];
+  color?: string;
+  backgroundColor?: string | string[];
+  borderColor?: string | string[];
+  borderWidth?: number;
+  fill?: boolean;
+  tension?: number;
+  pointRadius?: number;
+  pointHoverRadius?: number;
+  pointBackgroundColor?: string | string[];
+  pointBorderColor?: string | string[];
+  pointBorderWidth?: number;
+  pointStyle?: string;
+  hidden?: boolean;
 }
 
 export interface ChartDataPoint {
-  label;
-  value;
-  datasetIndex;
-  index;
-  x;
-  y;
+  label: string;
+  value: number;
+  datasetIndex: number;
+  index: number;
+  x: number;
+  y: number;
 }
 
 export interface ChartLegend {
-  text;
-  fillStyle;
-  strokeStyle;
-  lineWidth;
-  hidden;
-  index;
+  text: string;
+  fillStyle: string;
+  strokeStyle: string;
+  lineWidth: number;
+  hidden: boolean;
+  index: number;
 }
 
 export interface ChartOptions {
-  title?;
-  subtitle?;
-  showPoints?;
-  showLabels?;
-  responsive?;
-  maintainAspectRatio?;
-  plugins?;
-      text?;
-      color?;
-      font?;
-        size?;
-        weight?;
+  title?: string;
+  subtitle?: string;
+  showPoints?: boolean;
+  showLabels?: boolean;
+  responsive?: boolean;
+  maintainAspectRatio?: boolean;
+  plugins?: {
+    title?: {
+      display?: boolean;
+      text?: string;
+      color?: string;
+      font?: {
+        family?: string;
+        size?: number;
+        weight?: string;
       };
     };
-    legend?;
-      position?;
-      labels?;
-        font?;
-          size?;
-          weight?;
+    legend?: {
+      display?: boolean;
+      position?: 'top' | 'left' | 'bottom' | 'right';
+      labels?: {
+        color?: string;
+        font?: {
+          family?: string;
+          size?: number;
+          weight?: string;
         };
-        usePointStyle?;
-        padding?;
+        usePointStyle?: boolean;
+        padding?: number;
       };
     };
-    tooltip?;
-      mode?;
-      intersect?;
-      backgroundColor?;
-      titleColor?;
-      bodyColor?;
-      borderColor?;
-      borderWidth?;
+    tooltip?: {
+      enabled?: boolean;
+      mode?: 'index' | 'dataset' | 'point' | 'nearest' | 'x' | 'y';
+      intersect?: boolean;
+      backgroundColor?: string;
+      titleColor?: string;
+      bodyColor?: string;
+      borderColor?: string;
+      borderWidth?: number;
     };
   };
-  scales?;
-      title?;
-        text?;
-        color?;
-        font?;
-          size?;
-          weight?;
+  scales?: {
+    x?: {
+      display?: boolean;
+      title?: {
+        display?: boolean;
+        text?: string;
+        color?: string;
+        font?: {
+          family?: string;
+          size?: number;
+          weight?: string;
         };
       };
-      grid?;
-        color?;
-        borderColor?;
-        borderWidth?;
+      grid?: {
+        display?: boolean;
+        color?: string;
+        borderColor?: string;
+        borderWidth?: number;
       };
-      ticks?;
-        font?;
-          size?;
-          weight?;
+      ticks?: {
+        color?: string;
+        font?: {
+          family?: string;
+          size?: number;
+          weight?: string;
         };
       };
     };
-    y?;
-      title?;
-        text?;
-        color?;
-        font?;
-          size?;
-          weight?;
+    y?: {
+      display?: boolean;
+      title?: {
+        display?: boolean;
+        text?: string;
+        color?: string;
+        font?: {
+          family?: string;
+          size?: number;
+          weight?: string;
         };
       };
-      grid?;
-        color?;
-        borderColor?;
-        borderWidth?;
+      grid?: {
+        display?: boolean;
+        color?: string;
+        borderColor?: string;
+        borderWidth?: number;
       };
-      ticks?;
-        font?;
-          size?;
-          weight?;
+      ticks?: {
+        color?: string;
+        font?: {
+          family?: string;
+          size?: number;
+          weight?: string;
         };
       };
     };
   };
-  animation?;
-    easing?;
+  animation?: {
+    duration?: number;
+    easing?: string;
   };
-  interaction?;
-    intersect?;
-    axis?;
+  interaction?: {
+    mode?: 'nearest' | 'index' | 'dataset' | 'point' | 'x' | 'y';
+    intersect?: boolean;
+    axis?: 'x' | 'y';
   };
 }