@etus/ui 0.1.1 → 0.1.2

package/src/components/workflow/ApprovalFlow/ApprovalFlow.types.ts

@@ -1,233 +0,0 @@
-import type { approvalFlowVariants } from "./ApprovalFlow.variants"
-import type { VariantProps } from "class-variance-authority"
-import type { ReactNode } from "react"
-
-/**
- * Approver data structure
- */
-export interface Approver {
-  /** Optional avatar URL */
-  avatar?: string
-  /** Can delegate approval to others */
-  canDelegate?: boolean
-  /** Department (optional) */
-  department?: string
-  /** Approver's email */
-  email: string
-  /** Unique identifier */
-  id: string
-  /** Approver's name */
-  name: string
-  /** Role or title */
-  role: string
-}
-
-/**
- * Status of an approval step
- */
-export type ApprovalStepStatus =
-  | "approved"
-  | "awaiting"
-  | "escalated"
-  | "in_progress"
-  | "pending"
-  | "rejected"
-  | "skipped"
-
-/**
- * Condition for conditional flows
- */
-export interface ApprovalCondition {
-  /** Field to check */
-  field: string
-  /** ID of step to go to if condition is met */
-  nextStepId?: string
-  /** Comparison operator */
-  operator: "contains" | "equals" | "greater_than" | "less_than"
-  /** Value to compare against */
-  value: unknown
-}
-
-/**
- * Action that can be taken on a step
- */
-export interface ApprovalAction {
-  /** Confirmation message to display */
-  confirmationMessage?: string
-  /** Optional icon */
-  icon?: ReactNode
-  /** Button label */
-  label: string
-  /** Whether a comment is required */
-  requiresComment?: boolean
-  /** Type of action */
-  type: "approve" | "delegate" | "escalate" | "reject" | "request_info"
-}
-
-/**
- * Approval step data structure
- */
-export interface ApprovalStep {
-  /** Available actions for this step */
-  actions?: ApprovalAction[]
-  /** Approvers for this step */
-  approvers: Approver[]
-  /** Conditions for conditional flows */
-  conditions?: ApprovalCondition[]
-  /** Optional deadline */
-  deadline?: Date
-  /** Optional description */
-  description?: string
-  /** Unique identifier */
-  id: string
-  /** Number of required approvals for parallel flows */
-  requiredApprovals?: number
-  /** Current status of the step */
-  status: ApprovalStepStatus
-  /** Step title */
-  title: string
-}
-
-/**
- * History entry for approval actions
- */
-export interface ApprovalHistory {
-  /** Action that was performed */
-  action: string
-  /** Who performed the action */
-  actor: Approver
-  /** Optional comment */
-  comment?: string
-  /** Step ID this action was performed on */
-  stepId: string
-  /** When the action was performed */
-  timestamp: Date
-}
-
-/**
- * Payload for onApprove event
- */
-export interface ApprovePayload {
-  /** Optional comment */
-  comment?: string
-  /** ID of the step being approved */
-  stepId: string
-}
-
-/**
- * Payload for onReject event
- */
-export interface RejectPayload {
-  /** Reason for rejection (required) */
-  reason: string
-  /** ID of the step being rejected */
-  stepId: string
-}
-
-/**
- * Payload for onDelegate event
- */
-export interface DelegatePayload {
-  /** Approver to delegate to */
-  delegateTo: Approver
-  /** ID of the step being delegated */
-  stepId: string
-}
-
-/**
- * Payload for onEscalate event
- */
-export interface EscalatePayload {
-  /** Approver to escalate to */
-  escalateTo: Approver
-  /** ID of the step being escalated */
-  stepId: string
-}
-
-/**
- * Payload for onStepChange event
- */
-export interface StepChangePayload {
-  /** New current step index */
-  currentStep: number
-  /** Previous step index */
-  previousStep: number
-}
-
-/**
- * Payload for onComplete event
- */
-export interface CompletePayload {
-  /** Complete history of actions */
-  history: ApprovalHistory[]
-  /** Final status of the flow */
-  status: "approved" | "rejected"
-}
-
-/**
- * Props for ApprovalFlow component
- */
-export interface ApprovalFlowProps
-  extends Omit<React.ComponentProps<"div">, "children">,
-    VariantProps<typeof approvalFlowVariants> {
-  /** Allow delegation of approvals @default true */
-  allowDelegation?: boolean
-  /** Allow escalation to superiors @default true */
-  allowEscalation?: boolean
-  /** Current step index @default 0 */
-  currentStep?: number
-  /** Approval history entries */
-  history?: ApprovalHistory[]
-  /** Called when a step is approved */
-  onApprove?: (payload: ApprovePayload) => void
-  /** Called when the flow is complete */
-  onComplete?: (payload: CompletePayload) => void
-  /** Called when approval is delegated */
-  onDelegate?: (payload: DelegatePayload) => void
-  /** Called when approval is escalated */
-  onEscalate?: (payload: EscalatePayload) => void
-  /** Called when a step is rejected */
-  onReject?: (payload: RejectPayload) => void
-  /** Called when the current step changes */
-  onStepChange?: (payload: StepChangePayload) => void
-  /** Read-only mode @default false */
-  readOnly?: boolean
-  /** Show comments from approvers @default true */
-  showComments?: boolean
-  /** Show timeline of actions @default true */
-  showTimeline?: boolean
-  /** Array of approval steps */
-  steps: ApprovalStep[]
-}
-
-/**
- * Props for ApprovalFlowStep component
- */
-export interface ApprovalFlowStepProps
-  extends React.ComponentProps<"div">,
-    VariantProps<typeof approvalFlowVariants> {
-  /** Allow delegation */
-  allowDelegation?: boolean
-  /** Allow escalation */
-  allowEscalation?: boolean
-  /** Index of this step */
-  index: number
-  /** Whether this is the current step */
-  isCurrent: boolean
-  /** Whether this is the last step */
-  isLast: boolean
-  /** Called when approve is clicked */
-  onApprove?: () => void
-  /** Called when delegate is clicked */
-  onDelegate?: () => void
-  /** Called when escalate is clicked */
-  onEscalate?: () => void
-  /** Called when reject is clicked */
-  onReject?: () => void
-  /** Read-only mode */
-  readOnly?: boolean
-  /** Show connector to next step */
-  showConnector?: boolean
-  /** Step data */
-  step: ApprovalStep
-}

package/src/components/workflow/ApprovalFlow/ApprovalFlow.variants.ts

@@ -1,207 +0,0 @@
-import { cva, type VariantProps } from "class-variance-authority"
-
-/**
- * ApprovalFlow container variants
- */
-export const approvalFlowVariants = cva(
-  "relative rounded-lg border bg-card p-6 transition-all duration-300",
-  {
-    variants: {
-      variant: {
-        linear: "",
-        parallel: "",
-        conditional: "",
-        hybrid: "",
-      },
-      layout: {
-        horizontal: "flex flex-row gap-4 overflow-x-auto",
-        vertical: "flex flex-col gap-4",
-        compact: "flex flex-col gap-2 p-4",
-      },
-    },
-    defaultVariants: {
-      variant: "linear",
-      layout: "horizontal",
-    },
-  }
-)
-
-/**
- * ApprovalFlow step variants
- */
-export const approvalFlowStepVariants = cva(
-  "relative flex transition-all duration-300 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
-  {
-    variants: {
-      layout: {
-        horizontal: "flex-col items-center gap-2 min-w-[160px]",
-        vertical: "flex-row gap-4",
-        compact: "flex-row gap-3",
-      },
-      status: {
-        pending: "",
-        in_progress: "",
-        awaiting: "",
-        approved: "",
-        rejected: "",
-        escalated: "",
-        skipped: "opacity-50",
-      },
-    },
-    defaultVariants: {
-      layout: "horizontal",
-      status: "pending",
-    },
-  }
-)
-
-/**
- * Step marker/indicator variants based on status
- */
-export const approvalFlowMarkerVariants = cva(
-  "flex shrink-0 items-center justify-center rounded-full border-2 transition-all duration-300",
-  {
-    variants: {
-      status: {
-        pending: "border-muted-foreground/50 bg-muted text-muted-foreground",
-        in_progress:
-          "border-primary bg-primary text-primary-foreground animate-pulse",
-        awaiting: "border-warning bg-warning text-warning-foreground",
-        approved: "border-success bg-success text-success-foreground",
-        rejected: "border-destructive bg-destructive text-destructive-foreground",
-        escalated: "border-warning bg-warning text-warning-foreground",
-        skipped: "border-muted-foreground/30 bg-muted/50 text-muted-foreground/50",
-      },
-      size: {
-        sm: "h-8 w-8 text-xs",
-        default: "h-10 w-10 text-sm",
-        lg: "h-12 w-12 text-base",
-      },
-    },
-    defaultVariants: {
-      status: "pending",
-      size: "default",
-    },
-  }
-)
-
-/**
- * Connector line variants between steps
- */
-export const approvalFlowConnectorVariants = cva(
-  "transition-colors duration-300",
-  {
-    variants: {
-      layout: {
-        horizontal: "h-0.5 flex-1 min-w-[40px]",
-        vertical: "w-0.5 min-h-[40px] ml-5",
-        compact: "w-0.5 min-h-[24px] ml-4",
-      },
-      status: {
-        pending: "bg-muted-foreground/30",
-        in_progress: "bg-primary/50",
-        awaiting: "bg-warning/50",
-        approved: "bg-success",
-        rejected: "bg-destructive/50",
-        escalated: "bg-warning/50",
-        skipped: "bg-muted-foreground/20",
-      },
-      style: {
-        solid: "",
-        dashed: "border-dashed border-2 bg-transparent",
-      },
-    },
-    compoundVariants: [
-      {
-        layout: "horizontal",
-        style: "dashed",
-        className: "border-l-0 border-r-0 border-t-2 border-b-0 h-0",
-      },
-      {
-        layout: "vertical",
-        style: "dashed",
-        className: "border-t-0 border-b-0 border-l-2 border-r-0 w-0",
-      },
-      {
-        layout: "compact",
-        style: "dashed",
-        className: "border-t-0 border-b-0 border-l-2 border-r-0 w-0",
-      },
-    ],
-    defaultVariants: {
-      layout: "horizontal",
-      status: "pending",
-      style: "solid",
-    },
-  }
-)
-
-/**
- * Step card variants
- */
-export const approvalFlowStepCardVariants = cva(
-  "rounded-md border bg-background p-4 transition-all duration-200",
-  {
-    variants: {
-      status: {
-        pending: "border-muted",
-        in_progress: "border-primary shadow-sm ring-1 ring-primary/20",
-        awaiting: "border-warning shadow-sm",
-        approved: "border-success/50 bg-success/5",
-        rejected: "border-destructive/50 bg-destructive/5",
-        escalated: "border-warning/50 bg-warning/5",
-        skipped: "border-muted/50 bg-muted/10",
-      },
-      layout: {
-        horizontal: "w-full max-w-[200px]",
-        vertical: "flex-1",
-        compact: "flex-1 py-2",
-      },
-    },
-    defaultVariants: {
-      status: "pending",
-      layout: "horizontal",
-    },
-  }
-)
-
-/**
- * Action button group variants
- */
-export const approvalFlowActionsVariants = cva(
-  "flex gap-2 transition-opacity duration-200",
-  {
-    variants: {
-      layout: {
-        horizontal: "flex-wrap justify-center mt-2",
-        vertical: "flex-wrap",
-        compact: "flex-wrap",
-      },
-      visible: {
-        true: "opacity-100",
-        false: "opacity-0 pointer-events-none",
-      },
-    },
-    defaultVariants: {
-      layout: "horizontal",
-      visible: true,
-    },
-  }
-)
-
-export type ApprovalFlowVariantProps = VariantProps<typeof approvalFlowVariants>
-export type ApprovalFlowStepVariantProps = VariantProps<
-  typeof approvalFlowStepVariants
->
-export type ApprovalFlowMarkerVariantProps = VariantProps<
-  typeof approvalFlowMarkerVariants
->
-export type ApprovalFlowConnectorVariantProps = VariantProps<
-  typeof approvalFlowConnectorVariants
->
-export type ApprovalFlowStepCardVariantProps = VariantProps<
-  typeof approvalFlowStepCardVariants
->
-export type ApprovalFlowActionsVariantProps = VariantProps<
-  typeof approvalFlowActionsVariants
->