@rakeyshgidwani/roger-ui-bank-theme-stan-design 0.2.7 → 0.2.9

package/dist/components/ui/navigation/types.d.ts

@@ -0,0 +1,293 @@
+
+// ============================================================================
+// COMMON NAVIGATION TYPES
+// ============================================================================
+
+export interface NavigationBaseProps {
+  className?: string;
+  'data-testid'?: string;
+  theme?: 'stan-design' | 'enterprise' | 'harvey';
+}
+
+export interface NavigationItem {
+  id: string;
+  label: string;
+  href?: string;
+  icon?: ReactNode;
+  disabled?: boolean;
+  active?: boolean;
+  children?: NavigationItem[];
+  onClick?: () => void;
+  badge?: ReactNode;
+  description?: string;
+}
+
+export interface NavigationGroup {
+  id: string;
+  title?: string;
+  items: NavigationItem[];
+  divider?: boolean;
+}
+
+// ============================================================================
+// BREADCRUMB COMPONENT TYPES
+// ============================================================================
+
+export interface BreadcrumbProps extends NavigationBaseProps {
+  items: BreadcrumbItem[];
+  separator?: ReactNode;
+  maxItems?: number;
+  showHome?: boolean;
+  homeIcon?: ReactNode;
+  onItemClick?: (item: BreadcrumbItem) => void;
+  truncate?: boolean;
+  responsive?: boolean;
+}
+
+export interface BreadcrumbItem {
+  id: string;
+  label: string;
+  href?: string;
+  icon?: ReactNode;
+  onClick?: () => void;
+  disabled?: boolean;
+}
+
+// ============================================================================
+// PAGINATION COMPONENT TYPES
+// ============================================================================
+
+export interface PaginationProps extends NavigationBaseProps {
+  currentPage: number;
+  totalPages: number;
+  totalItems?: number;
+  itemsPerPage?: number;
+  showFirstLast?: boolean;
+  showPrevNext?: boolean;
+  showPageNumbers?: boolean;
+  maxPageNumbers?: number;
+  size?: 'sm' | 'md' | 'lg';
+  variant?: 'default' | 'outlined' | 'minimal';
+  onPageChange: (page: number) => void;
+  onItemsPerPageChange?: (itemsPerPage: number) => void;
+  itemsPerPageOptions?: number[];
+  showItemsPerPage?: boolean;
+  showTotal?: boolean;
+  totalLabel?: string;
+  disabled?: boolean;
+  loading?: boolean;
+}
+
+export interface PaginationItem {
+  type: 'page' | 'ellipsis' | 'previous' | 'next' | 'first' | 'last';
+  page?: number;
+  disabled?: boolean;
+  active?: boolean;
+  label: string;
+  onClick?: () => void;
+}
+
+// ============================================================================
+// TABS COMPONENT TYPES
+// ============================================================================
+
+export interface TabsProps extends NavigationBaseProps {
+  tabs: TabItem[];
+  activeTab?: string;
+  defaultActiveTab?: string;
+  onTabChange?: (tabId: string) => void;
+  variant?: 'default' | 'pills' | 'underline' | 'cards' | 'minimal';
+  size?: 'sm' | 'md' | 'lg';
+  orientation?: 'horizontal' | 'vertical';
+  fullWidth?: boolean;
+  centered?: boolean;
+  disabled?: boolean;
+  loading?: boolean;
+  closable?: boolean;
+  onTabClose?: (tabId: string) => void;
+  addable?: boolean;
+  onTabAdd?: () => void;
+  draggable?: boolean;
+  onTabsReorder?: (tabs: TabItem[]) => void;
+}
+
+export interface TabItem {
+  id: string;
+  label: string;
+  content: ReactNode;
+  icon?: ReactNode;
+  disabled?: boolean;
+  closable?: boolean;
+  badge?: ReactNode;
+  description?: string;
+}
+
+// ============================================================================
+// STEPPER COMPONENT TYPES
+// ============================================================================
+
+export interface StepperProps extends NavigationBaseProps {
+  steps: StepItem[];
+  currentStep?: number;
+  defaultCurrentStep?: number;
+  onStepChange?: (stepIndex: number) => void;
+  variant?: 'default' | 'vertical' | 'horizontal' | 'wizard';
+  size?: 'sm' | 'md' | 'lg';
+  showStepNumbers?: boolean;
+  showStepLabels?: boolean;
+  showStepDescriptions?: boolean;
+  showStepIcons?: boolean;
+  allowStepClick?: boolean;
+  allowStepNavigation?: boolean;
+  showProgress?: boolean;
+  showStepStatus?: boolean;
+  onStepComplete?: (stepIndex: number) => void;
+  onStepError?: (stepIndex: number) => void;
+  onFinish?: () => void;
+  onCancel?: () => void;
+}
+
+export interface StepItem {
+  id: string;
+  label: string;
+  description?: string;
+  icon?: ReactNode;
+  status?: 'pending' | 'active' | 'completed' | 'error' | 'warning';
+  disabled?: boolean;
+  required?: boolean;
+  validation?: () => boolean | Promise<boolean>;
+  content?: ReactNode;
+  actions?: StepAction[];
+}
+
+export interface StepAction {
+  label: string;
+  variant?: 'primary' | 'secondary' | 'outline' | 'ghost';
+  onClick: () => void;
+  disabled?: boolean;
+  loading?: boolean;
+}
+
+// ============================================================================
+// MENU COMPONENT TYPES
+// ============================================================================
+
+export interface MenuProps extends NavigationBaseProps {
+  items: NavigationItem[];
+  groups?: NavigationGroup[];
+  variant?: 'default' | 'dropdown' | 'context' | 'command';
+  size?: 'sm' | 'md' | 'lg';
+  orientation?: 'horizontal' | 'vertical';
+  trigger?: 'click' | 'hover' | 'focus';
+  placement?: 'top' | 'bottom' | 'left' | 'right';
+  offset?: number;
+  showArrow?: boolean;
+  fullWidth?: boolean;
+  disabled?: boolean;
+  loading?: boolean;
+  searchable?: boolean;
+  onSearch?: (query: string) => void;
+  filterable?: boolean;
+  onFilter?: (filter: string) => void;
+  selectable?: boolean;
+  multiSelect?: boolean;
+  selectedItems?: string[];
+  onSelectionChange?: (selectedItems: string[]) => void;
+}
+
+// ============================================================================
+// SIDEBAR COMPONENT TYPES
+// ============================================================================
+
+export interface SidebarProps extends NavigationBaseProps {
+  items: NavigationItem[];
+  groups?: NavigationGroup[];
+  variant?: 'default' | 'collapsible' | 'overlay' | 'drawer';
+  size?: 'sm' | 'md' | 'lg' | 'xl';
+  position?: 'left' | 'right';
+  collapsed?: boolean;
+  defaultCollapsed?: boolean;
+  onCollapseChange?: (collapsed: boolean) => void;
+  collapsible?: boolean;
+  showToggle?: boolean;
+  toggleIcon?: ReactNode;
+  header?: ReactNode;
+  footer?: ReactNode;
+  overlay?: boolean;
+  overlayCloseOnClick?: boolean;
+  overlayCloseOnEscape?: boolean;
+  overlayCloseOnOutsideClick?: boolean;
+  responsive?: boolean;
+  breakpoint?: 'sm' | 'md' | 'lg' | 'xl';
+  onItemClick?: (item: NavigationItem) => void;
+  onGroupToggle?: (groupId: string, expanded: boolean) => void;
+  expandedGroups?: string[];
+  defaultExpandedGroups?: string[];
+  showGroupIcons?: boolean;
+  showItemIcons?: boolean;
+  showItemBadges?: boolean;
+  showItemDescriptions?: boolean;
+  sticky?: boolean;
+  zIndex?: number;
+}
+
+// ============================================================================
+// NAVIGATION STATE TYPES
+// ============================================================================
+
+export interface NavigationState {
+  activeItem?: string;
+  expandedGroups: string[];
+  collapsed: boolean;
+  searchQuery: string;
+  filterValue: string;
+  selectedItems: string[];
+}
+
+export interface NavigationContextValue {
+  state: NavigationState;
+  dispatch: React.Dispatch<NavigationAction>;
+  theme: string;
+}
+
+export type NavigationAction =
+  | { type: 'SET_ACTIVE_ITEM'; payload: string }
+  | { type: 'TOGGLE_GROUP'; payload: string }
+  | { type: 'SET_COLLAPSED'; payload: boolean }
+  | { type: 'SET_SEARCH_QUERY'; payload: string }
+  | { type: 'SET_FILTER_VALUE'; payload: string }
+  | { type: 'SET_SELECTED_ITEMS'; payload: string[] }
+  | { type: 'RESET_STATE' };
+
+// ============================================================================
+// NAVIGATION UTILITY TYPES
+// ============================================================================
+
+export interface NavigationBreakpoint {
+  sm: string;
+  md: string;
+  lg: string;
+  xl: string;
+}
+
+export interface NavigationSpacing {
+  xs: string;
+  sm: string;
+  md: string;
+  lg: string;
+  xl: string;
+}
+
+export interface NavigationAnimation {
+  duration: string;
+  easing: string;
+  delay?: string;
+}
+
+export interface NavigationAccessibility {
+  ariaLabel?: string;
+  ariaDescribedBy?: string;
+  ariaLabelledBy?: string;
+  role?: string;
+  tabIndex?: number;
+}

package/dist/components/ui/navigation/types.esm.js

@@ -0,0 +1,298 @@
+/**
+ * Advanced Navigation Components - Type Definitions
+ * Provides comprehensive type definitions for all navigation components
+ */
+
+import { ReactNode } from 'react';
+
+// ============================================================================
+// COMMON NAVIGATION TYPES
+// ============================================================================
+
+export interface NavigationBaseProps {
+  className?;
+  'data-testid'?;
+  theme?;
+}
+
+export interface NavigationItem {
+  id;
+  label;
+  href?;
+  icon?;
+  disabled?;
+  active?;
+  children?];
+  onClick?) => void;
+  badge?;
+  description?;
+}
+
+export interface NavigationGroup {
+  id;
+  title?;
+  items];
+  divider?;
+}
+
+// ============================================================================
+// BREADCRUMB COMPONENT TYPES
+// ============================================================================
+
+export interface BreadcrumbProps extends NavigationBaseProps {
+  items];
+  separator?;
+  maxItems?;
+  showHome?;
+  homeIcon?;
+  onItemClick?) => void;
+  truncate?;
+  responsive?;
+}
+
+export interface BreadcrumbItem {
+  id;
+  label;
+  href?;
+  icon?;
+  onClick?) => void;
+  disabled?;
+}
+
+// ============================================================================
+// PAGINATION COMPONENT TYPES
+// ============================================================================
+
+export interface PaginationProps extends NavigationBaseProps {
+  currentPage;
+  totalPages;
+  totalItems?;
+  itemsPerPage?;
+  showFirstLast?;
+  showPrevNext?;
+  showPageNumbers?;
+  maxPageNumbers?;
+  size?;
+  variant?;
+  onPageChange) => void;
+  onItemsPerPageChange?) => void;
+  itemsPerPageOptions?];
+  showItemsPerPage?;
+  showTotal?;
+  totalLabel?;
+  disabled?;
+  loading?;
+}
+
+export interface PaginationItem {
+  type;
+  page?;
+  disabled?;
+  active?;
+  label;
+  onClick?) => void;
+}
+
+// ============================================================================
+// TABS COMPONENT TYPES
+// ============================================================================
+
+export interface TabsProps extends NavigationBaseProps {
+  tabs];
+  activeTab?;
+  defaultActiveTab?;
+  onTabChange?) => void;
+  variant?;
+  size?;
+  orientation?;
+  fullWidth?;
+  centered?;
+  disabled?;
+  loading?;
+  closable?;
+  onTabClose?) => void;
+  addable?;
+  onTabAdd?) => void;
+  draggable?;
+  onTabsReorder?]) => void;
+}
+
+export interface TabItem {
+  id;
+  label;
+  content;
+  icon?;
+  disabled?;
+  closable?;
+  badge?;
+  description?;
+}
+
+// ============================================================================
+// STEPPER COMPONENT TYPES
+// ============================================================================
+
+export interface StepperProps extends NavigationBaseProps {
+  steps];
+  currentStep?;
+  defaultCurrentStep?;
+  onStepChange?) => void;
+  variant?;
+  size?;
+  showStepNumbers?;
+  showStepLabels?;
+  showStepDescriptions?;
+  showStepIcons?;
+  allowStepClick?;
+  allowStepNavigation?;
+  showProgress?;
+  showStepStatus?;
+  onStepComplete?) => void;
+  onStepError?) => void;
+  onFinish?) => void;
+  onCancel?) => void;
+}
+
+export interface StepItem {
+  id;
+  label;
+  description?;
+  icon?;
+  status?;
+  disabled?;
+  required?;
+  validation?) => boolean | Promise<boolean>;
+  content?;
+  actions?];
+}
+
+export interface StepAction {
+  label;
+  variant?;
+  onClick) => void;
+  disabled?;
+  loading?;
+}
+
+// ============================================================================
+// MENU COMPONENT TYPES
+// ============================================================================
+
+export interface MenuProps extends NavigationBaseProps {
+  items];
+  groups?];
+  variant?;
+  size?;
+  orientation?;
+  trigger?;
+  placement?;
+  offset?;
+  showArrow?;
+  fullWidth?;
+  disabled?;
+  loading?;
+  searchable?;
+  onSearch?) => void;
+  filterable?;
+  onFilter?) => void;
+  selectable?;
+  multiSelect?;
+  selectedItems?];
+  onSelectionChange?]) => void;
+}
+
+// ============================================================================
+// SIDEBAR COMPONENT TYPES
+// ============================================================================
+
+export interface SidebarProps extends NavigationBaseProps {
+  items];
+  groups?];
+  variant?;
+  size?;
+  position?;
+  collapsed?;
+  defaultCollapsed?;
+  onCollapseChange?) => void;
+  collapsible?;
+  showToggle?;
+  toggleIcon?;
+  header?;
+  footer?;
+  overlay?;
+  overlayCloseOnClick?;
+  overlayCloseOnEscape?;
+  overlayCloseOnOutsideClick?;
+  responsive?;
+  breakpoint?;
+  onItemClick?) => void;
+  onGroupToggle?, expanded) => void;
+  expandedGroups?];
+  defaultExpandedGroups?];
+  showGroupIcons?;
+  showItemIcons?;
+  showItemBadges?;
+  showItemDescriptions?;
+  sticky?;
+  zIndex?;
+}
+
+// ============================================================================
+// NAVIGATION STATE TYPES
+// ============================================================================
+
+export interface NavigationState {
+  activeItem?;
+  expandedGroups];
+  collapsed;
+  searchQuery;
+  filterValue;
+  selectedItems];
+}
+
+export interface NavigationContextValue {
+  state;
+  dispatch;
+  theme;
+}
+
+ payload}
+  | { type; payload}
+  | { type; payload}
+  | { type; payload}
+  | { type; payload}
+  | { type; payload] }
+  | { type};
+
+// ============================================================================
+// NAVIGATION UTILITY TYPES
+// ============================================================================
+
+export interface NavigationBreakpoint {
+  sm;
+  md;
+  lg;
+  xl;
+}
+
+export interface NavigationSpacing {
+  xs;
+  sm;
+  md;
+  lg;
+  xl;
+}
+
+export interface NavigationAnimation {
+  duration;
+  easing;
+  delay?;
+}
+
+export interface NavigationAccessibility {
+  ariaLabel?;
+  ariaDescribedBy?;
+  ariaLabelledBy?;
+  role?;
+  tabIndex?;
+}