se-design 1.0.68-dev → 1.0.68-devnav

package/dist/index55.js.map

@@ -1 +1 @@
-{"version":3,"file":"index55.js","sources":["../src/components/SnackBar/index.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Icon, IconProps } from '../Icon';\nimport { ProgressBar } from '../ProgressBar';\nimport './style.scss';\n\nexport type SnackbarPosition =\n  | 'top-right'\n  | 'top-left'\n  | 'bottom-right'\n  | 'bottom-left'\n  | 'top-center'\n  | 'bottom-center';\n\nexport type SnackbarVariant = 'default' | 'success' | 'warning' | 'error' | 'info';\n\nexport type SnackbarAction = {\n  label: string;\n  onClick: () => void;\n  variant?: 'primary' | 'secondary';\n};\n\nexport type SnackbarItem = {\n  id: string | number;\n  name: string;\n  type: 'file' | 'folder';\n  fileType?: 'doc' | 'pdf' | 'image' | 'other';\n  icon?: string;\n  onClick?: () => void;\n};\n\nexport interface SnackbarProps {\n  /** Whether the snackbar is open */\n  open: boolean;\n  /** Function to close the snackbar */\n  onClose: () => void;\n  /** Title text displayed prominently */\n  title?: string;\n  /** Description text displayed below title */\n  description?: string;\n  /** Position of the snackbar on screen */\n  position?: SnackbarPosition;\n  /** Visual variant of the snackbar */\n  variant?: SnackbarVariant;\n  /** Auto-hide duration in milliseconds (0 = no auto-hide) */\n  autoHideDuration?: number;\n  /** Whether to show close button */\n  showCloseButton?: boolean;\n  /** Optional action button */\n  action?: SnackbarAction;\n  /** Custom className for additional styling */\n  className?: string;\n  /** Custom styles */\n  style?: React.CSSProperties;\n  /** Whether to show progress indicator */\n  showProgress?: boolean;\n  /** Progress value (0-100) */\n  progress?: number;\n  /** Icon props object (name, fill, stroke, rotation, size, etc.) */\n  iconProps?: Omit<IconProps, 'className'>;\n  /** List of items to display in expandable section */\n  items?: SnackbarItem[];\n  /** Whether items list is expanded by default */\n  defaultExpanded?: boolean;\n  /** Compact mode - renders a simple inline notification with just icon and title */\n  compact?: boolean;\n  /** Automation ID for testing */\n  automationId?: string;\n}\n\nexport const Snackbar: React.FC<SnackbarProps> = ({\n  open,\n  onClose,\n  title,\n  description,\n  position = 'bottom-right',\n  variant = 'default',\n  autoHideDuration = 6000,\n  showCloseButton = true,\n  action,\n  className = '',\n  style,\n  showProgress = false,\n  progress = 0,\n  iconProps,\n  items,\n  defaultExpanded = false,\n  compact = false,\n  automationId = ''\n}) => {\n  const [isVisible, setIsVisible] = useState(false);\n  const [isExiting, setIsExiting] = useState(false);\n  const [isExpanded, setIsExpanded] = useState(defaultExpanded);\n\n  useEffect(() => {\n    if (open) {\n      setIsVisible(true);\n      setIsExiting(false);\n\n      // Auto-hide functionality\n      if (autoHideDuration > 0) {\n        const timer = setTimeout(() => {\n          handleClose();\n        }, autoHideDuration);\n\n        return () => clearTimeout(timer);\n      }\n    }\n  }, [open, autoHideDuration]);\n\n  const handleClose = () => {\n    setIsExiting(true);\n    setTimeout(() => {\n      setIsVisible(false);\n      setIsExiting(false);\n      onClose();\n    }, 300); // Animation duration\n  };\n\n  const handleToggleExpanded = () => {\n    setIsExpanded(!isExpanded);\n  };\n\n  const getFileIcon = (item: SnackbarItem) => {\n    if (item.icon) return item.icon;\n\n    if (item.type === 'folder') return 'folder-empty';\n    if (item.type === 'file') return 'file-empty';\n\n    return 'file-empty';\n\n    // switch (item.fileType) {\n    //   case 'doc':\n    //     return 'docFile';\n    //   case 'pdf':\n    //     return 'pdf-file';\n    //   case 'image':\n    //     return 'file-empty';\n    //   default:\n    //     return 'file-empty';\n    // }\n  };\n\n  if (!isVisible) return null;\n\n  const getPositionClasses = () => {\n    const positionMap = {\n      'top-right': 'top-4 right-4',\n      'top-left': 'top-4 left-4',\n      'bottom-right': 'bottom-4 right-4',\n      'bottom-left': 'bottom-4 left-4',\n      'top-center': 'top-4 snackbar-center',\n      'bottom-center': 'bottom-4 snackbar-center'\n    };\n    return positionMap[position];\n  };\n\n  const getVariantClasses = () => {\n    const variantMap = {\n      default: 'snackbar-default',\n      success: 'snackbar-success',\n      warning: 'snackbar-warning',\n      error: 'snackbar-error',\n      info: 'snackbar-info'\n    };\n    return variantMap[variant];\n  };\n\n  const getContainerStyle = (): React.CSSProperties => {\n    const baseStyle = style || {};\n\n    if (position === 'top-center' || position === 'bottom-center') {\n      return {\n        ...baseStyle,\n        left: '50%',\n        // Initial transform for center - animation will override but preserve translateX(-50%)\n        transform: 'translateX(-50%)'\n      };\n    }\n\n    return baseStyle;\n  };\n\n  return (\n    <div className=\"snackbar-backdrop fixed inset-0 z-[1000] pointer-events-none\">\n      <div\n        className={`\n          snackbar-container\n          ${getPositionClasses()}\n          ${getVariantClasses()}\n          ${isExiting ? 'snackbar-exit' : 'snackbar-enter'}\n          ${compact ? 'snackbar-compact' : ''}\n          ${className}\n        `}\n        style={getContainerStyle()}\n        role=\"alert\"\n        aria-live=\"polite\"\n        data-automation-id={automationId}\n      >\n        {compact ? (\n          // Compact mode - simple inline notification\n          <div className=\"snackbar-compact-content\">\n            {iconProps?.name && <Icon {...iconProps} size={iconProps.size ?? 16} className=\"snackbar-compact-icon\" />}\n            {title && <span className=\"snackbar-compact-title\">{title}</span>}\n          </div>\n        ) : (\n          // Full mode - standard snackbar with all features\n          <div className=\"snackbar-content\">\n            {/* Header with icon, title, expand/collapse, and close button */}\n            <div className=\"snackbar-header\">\n              <div className=\"snackbar-title-section\">\n                {iconProps?.name && <Icon {...iconProps} size={iconProps.size ?? 20} className=\"snackbar-icon\" />}\n                {title && <h4 className=\"snackbar-title\">{title}</h4>}\n              </div>\n              <div className=\"snackbar-header-actions\">\n                {items && items.length > 0 && (\n                  <Icon\n                    name=\"chevron\"\n                    size={16}\n                    stroke=\"var(--color-gray-100)\"\n                    rotation={isExpanded ? '0' : '180'}\n                    className=\"snackbar-expand-icon\"\n                    onClick={handleToggleExpanded}\n                  />\n                )}\n                {showCloseButton && !showProgress && (\n                  <Icon\n                    name=\"close\"\n                    size={16}\n                    fill=\"var(--color-gray-600)\"\n                    className=\"snackbar-close-icon\"\n                    onClick={handleClose}\n                  />\n                )}\n              </div>\n            </div>\n\n            {/* Description */}\n            {description && <div className=\"snackbar-description\">{description}</div>}\n\n            {/* Progress bar */}\n            {showProgress && (\n              <div className=\"snackbar-progress-container\">\n                {progress === -1 ? (\n                  <div className=\"snackbar-indeterminate-progress\">\n                    <div className=\"snackbar-progress-gradient\"></div>\n                  </div>\n                ) : (\n                  <ProgressBar\n                    totalTasks={100}\n                    completedTasks={progress}\n                    needPercentageCompleted={false}\n                    progressBarColor=\"var(--color-green-500)\"\n                  />\n                )}\n              </div>\n            )}\n\n            {/* Expandable Items List */}\n            {items && items.length > 0 && (\n              <div\n                className={`snackbar-items-container ${\n                  isExpanded ? 'snackbar-items-expanded' : 'snackbar-items-collapsed'\n                }`}\n              >\n                <div className=\"snackbar-items-list\">\n                  {items.map((item) => (\n                    <div key={item.id} className=\"snackbar-item\" onClick={item.onClick}>\n                      <div className=\"snackbar-item-content\">\n                        <Icon name={getFileIcon(item)} size={16} className=\"snackbar-item-icon\" />\n                        <span className=\"snackbar-item-name\">{item.name}</span>\n                      </div>\n                    </div>\n                  ))}\n                </div>\n              </div>\n            )}\n\n            {/* Action button */}\n            {action && (\n              <div className=\"snackbar-actions\">\n                <button\n                  className={`snackbar-action-button snackbar-action-${action.variant || 'primary'}`}\n                  onClick={action.onClick}\n                >\n                  {action.label}\n                </button>\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["Snackbar","open","onClose","title","description","position","variant","autoHideDuration","showCloseButton","action","className","style","showProgress","progress","iconProps","items","defaultExpanded","compact","automationId","isVisible","setIsVisible","useState","isExiting","setIsExiting","isExpanded","setIsExpanded","useEffect","timer","setTimeout","handleClose","clearTimeout","handleToggleExpanded","getFileIcon","item","icon","type","getPositionClasses","getVariantClasses","default","success","warning","error","info","getContainerStyle","baseStyle","left","transform","React","createElement","role","name","Icon","_extends","size","length","stroke","rotation","onClick","fill","ProgressBar","totalTasks","completedTasks","needPercentageCompleted","progressBarColor","map","key","id","label"],"mappings":"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"}
+{"version":3,"file":"index55.js","sources":["../src/components/SnackBar/index.tsx"],"sourcesContent":["import React, { useEffect, useState } from 'react';\nimport { Icon, IconProps } from '../Icon';\nimport { ProgressBar } from '../ProgressBar';\nimport './style.scss';\n\nexport type SnackbarPosition =\n  | 'top-right'\n  | 'top-left'\n  | 'bottom-right'\n  | 'bottom-left'\n  | 'top-center'\n  | 'bottom-center';\n\nexport type SnackbarVariant = 'default' | 'success' | 'warning' | 'error' | 'info';\n\nexport type SnackbarAction = {\n  label: string;\n  onClick: () => void;\n  variant?: 'primary' | 'secondary';\n};\n\nexport type SnackbarItem = {\n  id: string | number;\n  name: string;\n  type: 'file' | 'folder';\n  fileType?: 'doc' | 'pdf' | 'image' | 'other';\n  icon?: string;\n  onClick?: () => void;\n};\n\nexport interface SnackbarProps {\n  /** Whether the snackbar is open */\n  open: boolean;\n  /** Function to close the snackbar */\n  onClose: () => void;\n  /** Title text displayed prominently */\n  title?: string;\n  /** Description text displayed below title */\n  description?: string;\n  /** Position of the snackbar on screen */\n  position?: SnackbarPosition;\n  /** Visual variant of the snackbar */\n  variant?: SnackbarVariant;\n  /** Auto-hide duration in milliseconds (0 = no auto-hide) */\n  autoHideDuration?: number;\n  /** Whether to show close button */\n  showCloseButton?: boolean;\n  /** Optional action button */\n  action?: SnackbarAction;\n  /** Custom className for additional styling */\n  className?: string;\n  /** Custom styles */\n  style?: React.CSSProperties;\n  /** Whether to show progress indicator */\n  showProgress?: boolean;\n  /** Progress value (0-100) */\n  progress?: number;\n  /** Icon props object (name, fill, stroke, rotation, size, etc.) */\n  iconProps?: Omit<IconProps, 'className'>;\n  /** List of items to display in expandable section */\n  items?: SnackbarItem[];\n  /** Whether items list is expanded by default */\n  defaultExpanded?: boolean;\n  /** Compact mode - renders a simple inline notification with just icon and title */\n  compact?: boolean;\n  /** Automation ID for testing */\n  automationId?: string;\n}\n\nexport const Snackbar: React.FC<SnackbarProps> = ({\n  open,\n  onClose,\n  title,\n  description,\n  position = 'bottom-right',\n  variant = 'default',\n  autoHideDuration = 6000,\n  showCloseButton = true,\n  action,\n  className = '',\n  style,\n  showProgress = false,\n  progress = 0,\n  iconProps,\n  items,\n  defaultExpanded = false,\n  compact = false,\n  automationId = ''\n}) => {\n  const [isVisible, setIsVisible] = useState(false);\n  const [isExiting, setIsExiting] = useState(false);\n  const [isExpanded, setIsExpanded] = useState(defaultExpanded);\n\n  useEffect(() => {\n    if (open) {\n      setIsVisible(true);\n      setIsExiting(false);\n\n      // Auto-hide functionality\n      if (autoHideDuration > 0) {\n        const timer = setTimeout(() => {\n          handleClose();\n        }, autoHideDuration);\n\n        return () => clearTimeout(timer);\n      }\n    }\n  }, [open, autoHideDuration]);\n\n  const handleClose = () => {\n    setIsExiting(true);\n    setTimeout(() => {\n      setIsVisible(false);\n      setIsExiting(false);\n      onClose();\n    }, 300); // Animation duration\n  };\n\n  const handleToggleExpanded = () => {\n    setIsExpanded(!isExpanded);\n  };\n\n  const getFileIcon = (item: SnackbarItem) => {\n    if (item.icon) return item.icon;\n\n    if (item.type === 'folder') return 'folder-empty';\n    if (item.type === 'file') return 'file-empty';\n\n    return 'file-empty';\n\n    // switch (item.fileType) {\n    //   case 'doc':\n    //     return 'docFile';\n    //   case 'pdf':\n    //     return 'pdf-file';\n    //   case 'image':\n    //     return 'file-empty';\n    //   default:\n    //     return 'file-empty';\n    // }\n  };\n\n  if (!isVisible) return null;\n\n  const getPositionClasses = () => {\n    const positionMap = {\n      'top-right': 'top-4 right-4',\n      'top-left': 'top-4 left-4',\n      'bottom-right': 'bottom-4 right-4',\n      'bottom-left': 'bottom-4 left-4',\n      'top-center': 'top-4 snackbar-center',\n      'bottom-center': 'bottom-4 snackbar-center'\n    };\n    return positionMap[position];\n  };\n\n  const getVariantClasses = () => {\n    const variantMap = {\n      default: 'snackbar-default',\n      success: 'snackbar-success',\n      warning: 'snackbar-warning',\n      error: 'snackbar-error',\n      info: 'snackbar-info'\n    };\n    return variantMap[variant];\n  };\n\n  const getContainerStyle = (): React.CSSProperties => {\n    const baseStyle = style || {};\n\n    if (position === 'top-center' || position === 'bottom-center') {\n      return {\n        ...baseStyle,\n        left: '50%',\n        // Initial transform for center - animation will override but preserve translateX(-50%)\n        transform: 'translateX(-50%)'\n      };\n    }\n\n    return baseStyle;\n  };\n\n  return (\n    <div className=\"snackbar-backdrop fixed inset-0 z-[1000] pointer-events-none\">\n      <div\n        className={`\n          snackbar-container\n          ${getPositionClasses()}\n          ${getVariantClasses()}\n          ${isExiting ? 'snackbar-exit' : 'snackbar-enter'}\n          ${compact ? 'snackbar-compact' : ''}\n          ${className}\n        `}\n        style={getContainerStyle()}\n        role=\"alert\"\n        aria-live=\"polite\"\n        data-automation-id={automationId}\n      >\n        {compact ? (\n          // Compact mode - simple inline notification\n          <div className=\"snackbar-compact-content\">\n            {iconProps?.name && <Icon {...iconProps} size={iconProps.size ?? 16} className=\"snackbar-compact-icon\" />}\n            {title && <span className=\"snackbar-compact-title\">{title}</span>}\n          </div>\n        ) : (\n          // Full mode - standard snackbar with all features\n          <div className=\"snackbar-content\">\n            {/* Header with icon, title, expand/collapse, and close button */}\n            <div className=\"snackbar-header\">\n              <div className=\"snackbar-title-section\">\n                {iconProps?.name && <Icon {...iconProps} size={iconProps.size ?? 20} className=\"snackbar-icon\" />}\n                {title && <h4 className=\"snackbar-title\">{title}</h4>}\n              </div>\n              <div className=\"snackbar-header-actions\">\n                {items && items.length > 0 && (\n                  <Icon\n                    name=\"chevron\"\n                    size={16}\n                    stroke=\"var(--color-gray-100)\"\n                    rotation={isExpanded ? '0' : '180'}\n                    className=\"snackbar-expand-icon\"\n                    onClick={handleToggleExpanded}\n                  />\n                )}\n                {showCloseButton && !showProgress && (\n                  <Icon\n                    name=\"close\"\n                    size={16}\n                    fill=\"var(--color-gray-600)\"\n                    className=\"snackbar-close-icon\"\n                    onClick={handleClose}\n                  />\n                )}\n              </div>\n            </div>\n\n            {/* Description */}\n            {description && <div className=\"snackbar-description\">{description}</div>}\n\n            {/* Progress bar */}\n            {showProgress && (\n              <div className=\"snackbar-progress-container\">\n                {progress === -1 ? (\n                  <div className=\"snackbar-indeterminate-progress\">\n                    <div className=\"snackbar-progress-gradient\"></div>\n                  </div>\n                ) : (\n                  <ProgressBar\n                    totalTasks={100}\n                    completedTasks={progress}\n                    needPercentageCompleted={false}\n                    progressBarColor=\"var(--color-green-500)\"\n                  />\n                )}\n              </div>\n            )}\n\n            {/* Expandable Items List */}\n            {items && items.length > 0 && (\n              <div\n                className={`snackbar-items-container ${\n                  isExpanded ? 'snackbar-items-expanded' : 'snackbar-items-collapsed'\n                }`}\n              >\n                <div className=\"snackbar-items-list\">\n                  {items.map((item) => (\n                    <div key={item.id} className=\"snackbar-item\" onClick={item.onClick}>\n                      <div className=\"snackbar-item-content\">\n                        <Icon name={getFileIcon(item)} size={16} className=\"snackbar-item-icon\" />\n                        <span className=\"snackbar-item-name\">{item.name}</span>\n                      </div>\n                    </div>\n                  ))}\n                </div>\n              </div>\n            )}\n\n            {/* Action button */}\n            {action && (\n              <div className=\"snackbar-actions\">\n                <button\n                  className={`snackbar-action-button snackbar-action-${action.variant || 'primary'}`}\n                  onClick={action.onClick}\n                >\n                  {action.label}\n                </button>\n              </div>\n            )}\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n"],"names":["Snackbar","open","onClose","title","description","position","variant","autoHideDuration","showCloseButton","action","className","style","showProgress","progress","iconProps","items","defaultExpanded","compact","automationId","isVisible","setIsVisible","useState","isExiting","setIsExiting","isExpanded","setIsExpanded","useEffect","timer","setTimeout","handleClose","clearTimeout","handleToggleExpanded","getFileIcon","item","icon","type","getPositionClasses","getVariantClasses","default","success","warning","error","info","getContainerStyle","baseStyle","left","transform","React","createElement","role","name","Icon","_extends","size","length","stroke","rotation","onClick","fill","ProgressBar","totalTasks","completedTasks","needPercentageCompleted","progressBarColor","map","key","id","label"],"mappings":"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"}

package/dist/index56.js.map

@@ -1 +1 @@
-{"version":3,"file":"index56.js","sources":["../src/components/OTPInput/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, KeyboardEvent, ChangeEvent, ClipboardEvent, FC } from 'react';\nimport { useStableId } from '../../utils/useStableId';\nimport './style.scss';\n\nexport interface OTPInputProps {\n  length?: number;\n  onChange?: (value: string) => void;\n  onComplete?: (value: string) => void;\n  label?: string;\n  disabled?: boolean;\n  className?: string;\n  autoFocus?: boolean;\n  error?: boolean;\n  errorMessage?: string;\n  validateOnBlur?: boolean;\n  onValidate?: (value: string) => boolean | string;\n  id?: string;\n}\n\nexport const OTPInput: FC<OTPInputProps> = ({\n  length = 6,\n  onChange,\n  onComplete,\n  label,\n  disabled = false,\n  className = '',\n  autoFocus = true,\n  error = false,\n  errorMessage,\n  validateOnBlur = false,\n  onValidate,\n  id\n}) => {\n  const [values, setValues] = useState<string[]>(Array(length).fill(''));\n  const [internalError, setInternalError] = useState<string | null>(null);\n  const inputRefs = useRef<(HTMLInputElement | null)[]>([]);\n  const isBackspacePressed = useRef<boolean>(false);\n  \n  // Generate stable IDs for ARIA attributes\n  const baseId = useStableId(id, 'se-otp-input');\n  const labelId = `${baseId}-label`;\n  const errorId = `${baseId}-error`;\n\n  // Helper: Check if a string is a single digit\n  const isDigit = (char: string): boolean => /^\\d$/.test(char);\n\n  // Helper: Check if OTP is complete\n  const isComplete = (otpValue: string): boolean => {\n    return otpValue.length === length && values.every((val) => val !== '');\n  };\n\n  // Helper: Update value at specific index\n  const updateValue = (index: number, value: string, shouldFocusNext = false) => {\n    const newValues = [...values];\n    newValues[index] = value;\n    setValues(newValues);\n\n    if (shouldFocusNext && value && index < length - 1) {\n      focusInput(index + 1);\n    }\n  };\n\n  // Helper: Clear value at specific index\n  const clearValue = (index: number) => {\n    updateValue(index, '');\n  };\n\n  // Helper: Focus input at index\n  const focusInput = (index: number) => {\n    inputRefs.current[index]?.focus();\n  };\n\n  useEffect(() => {\n    if (autoFocus && inputRefs.current[0] && !disabled) {\n      focusInput(0);\n    }\n  }, [autoFocus, disabled]);\n\n  // Internal validation\n  const validateOTP = (otpValue: string): string | null => {\n    // Empty validation\n    if (otpValue.length === 0) {\n      return errorMessage || 'Please enter the verification code';\n    }\n\n    // Incomplete validation\n    if (otpValue.length < length || !isComplete(otpValue)) {\n      return errorMessage || 'Please enter all digits';\n    }\n\n    // Custom validation\n    if (onValidate) {\n      const validationResult = onValidate(otpValue);\n      if (validationResult === false) {\n        return errorMessage || 'Invalid verification code';\n      }\n      if (typeof validationResult === 'string') {\n        return validationResult;\n      }\n    }\n\n    return null;\n  };\n\n  useEffect(() => {\n    const otpValue = values.join('');\n    onChange?.(otpValue);\n\n    // Clear error when user starts typing\n    if (internalError && otpValue.length > 0) {\n      setInternalError(null);\n    }\n\n    if (isComplete(otpValue)) {\n      // Validate on complete\n      if (onValidate) {\n        const validationResult = onValidate(otpValue);\n        if (validationResult === false || typeof validationResult === 'string') {\n          const errorMsg =\n            typeof validationResult === 'string' ? validationResult : errorMessage || 'Invalid verification code';\n          setInternalError(errorMsg);\n        } else {\n          setInternalError(null);\n        }\n      }\n      onComplete?.(otpValue);\n    }\n  }, [values, length, onChange, onComplete, onValidate, errorMessage]);\n\n  const handleChange = (index: number, value: string) => {\n    // Only allow single digit or empty\n    if (value && !isDigit(value)) {\n      return;\n    }\n\n    updateValue(index, value, true);\n  };\n\n  const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {\n    if (disabled) return;\n\n    const currentValue = values[index];\n\n    // Handle backspace\n    if (e.key === 'Backspace') {\n      isBackspacePressed.current = true;\n      if (currentValue) {\n        clearValue(index);\n      } else if (index > 0) {\n        clearValue(index - 1);\n        focusInput(index - 1);\n      }\n      // Reset backspace flag after a short delay\n      setTimeout(() => {\n        isBackspacePressed.current = false;\n      }, 100);\n      e.preventDefault();\n      return;\n    }\n\n    // Handle delete\n    if (e.key === 'Delete') {\n      isBackspacePressed.current = true;\n      clearValue(index);\n      // Reset backspace flag after a short delay\n      setTimeout(() => {\n        isBackspacePressed.current = false;\n      }, 100);\n      e.preventDefault();\n      return;\n    }\n\n    // Handle navigation keys\n    const navigationHandlers: Record<string, () => void> = {\n      ArrowLeft: () => index > 0 && focusInput(index - 1),\n      ArrowRight: () => index < length - 1 && focusInput(index + 1),\n      Home: () => focusInput(0),\n      End: () => focusInput(length - 1)\n    };\n\n    if (navigationHandlers[e.key]) {\n      navigationHandlers[e.key]();\n      e.preventDefault();\n      return;\n    }\n\n    // Allow digits, but prevent if already filled\n    if (isDigit(e.key)) {\n      if (currentValue) {\n        updateValue(index, e.key, true);\n      }\n    }\n  };\n\n  const handlePaste = (e: ClipboardEvent<HTMLInputElement>) => {\n    if (disabled) return;\n\n    e.preventDefault();\n    const pastedData = e.clipboardData.getData('text/plain').trim();\n\n    // Extract only digits\n    const digits = pastedData.replace(/\\D/g, '').slice(0, length);\n\n    if (digits.length > 0) {\n      const newValues = [...values];\n\n      // Fill inputs starting from the current index\n      const startIndex = inputRefs.current.findIndex((ref) => ref === document.activeElement);\n      const actualStartIndex = startIndex >= 0 ? startIndex : 0;\n\n      for (let i = 0; i < digits.length && actualStartIndex + i < length; i++) {\n        newValues[actualStartIndex + i] = digits[i];\n      }\n\n      setValues(newValues);\n\n      // Focus the next empty input or the last input\n      const nextEmptyIndex = newValues.findIndex((val, idx) => idx >= actualStartIndex && val === '');\n      const focusIndex = nextEmptyIndex >= 0 ? nextEmptyIndex : Math.min(actualStartIndex + digits.length, length - 1);\n      focusInput(focusIndex);\n    }\n  };\n\n  const handleFocus = (index: number) => {\n    inputRefs.current[index]?.select();\n  };\n\n  const handleBlur = () => {\n    // Don't validate on blur if backspace/delete was just pressed\n    if (validateOnBlur && !isBackspacePressed.current) {\n      const otpValue = values.join('');\n      const validationError = validateOTP(otpValue);\n      setInternalError(validationError);\n    }\n  };\n\n  const hasError = error || !!internalError;\n  // Priority: errorMessage prop > internalError\n  const displayError = hasError && (errorMessage || internalError);\n  \n  const ariaDescribedByError = displayError ? errorId : undefined;\n\n  return (\n    <div className={`se-design-otp-input ${className || ''}`} data-automation-id=\"otp-input-container\">\n      {label && <div id={labelId} className=\"se-design-otp-input-label\">{label}</div>}\n      <div className=\"flex items-center gap-[12px]\" role=\"group\" aria-labelledby={label ? labelId : undefined}>\n        {values.map((value, index) => (\n          <input\n            key={index}\n            ref={(el) => {\n              inputRefs.current[index] = el;\n            }}\n            type=\"text\"\n            inputMode=\"numeric\"\n            maxLength={1}\n            value={value}\n            onChange={(e: ChangeEvent<HTMLInputElement>) => handleChange(index, e.target.value)}\n            onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => handleKeyDown(index, e)}\n            onPaste={handlePaste}\n            onFocus={() => handleFocus(index)}\n            onBlur={handleBlur}\n            disabled={disabled}\n            className={`\n              w-12 h-12 \n              flex flex-col items-start \n              text-center text-lg font-medium\n              border rounded-md\n              outline-none\n              transition-colors\n              disabled:bg-gray-50 disabled:cursor-not-allowed\n              ${\n                disabled\n                  ? 'border-[var(--color-gray-300)] text-gray-400'\n                  : hasError\n                  ? 'border-[var(--color-red-500)] text-gray-900 focus:border-[var(--color-red-500)] focus:ring-1 focus:ring-[var(--color-red-500)]'\n                  : 'border-[var(--color-gray-600)] text-gray-900 focus:border-[var(--color-blue-500)] focus:ring-1 focus:ring-[var(--color-blue-500)]'\n              }\n            `}\n            style={{\n              gap: 'var(--Spacer-6px, 6px)'\n            }}\n            aria-label={`OTP digit ${index + 1} of ${length}`}\n            aria-invalid={hasError}\n            aria-describedby={ariaDescribedByError}\n            data-automation-id={`otp-input-${index}`}\n          />\n        ))}\n      </div>\n      {displayError && <div id={errorId} className=\"se-design-otp-input-error\" role=\"alert\">{displayError}</div>}\n    </div>\n  );\n};\n"],"names":["OTPInput","length","onChange","onComplete","label","disabled","className","autoFocus","error","errorMessage","validateOnBlur","onValidate","id","values","setValues","useState","Array","fill","internalError","setInternalError","inputRefs","useRef","isBackspacePressed","baseId","useStableId","labelId","errorId","isDigit","char","test","isComplete","otpValue","every","val","updateValue","index","value","shouldFocusNext","newValues","focusInput","clearValue","current","focus","useEffect","validateOTP","validationResult","join","handleChange","handleKeyDown","e","currentValue","key","setTimeout","preventDefault","navigationHandlers","ArrowLeft","ArrowRight","Home","End","handlePaste","digits","clipboardData","getData","trim","replace","slice","startIndex","findIndex","ref","document","activeElement","actualStartIndex","i","nextEmptyIndex","idx","focusIndex","Math","min","handleFocus","select","handleBlur","validationError","hasError","displayError","ariaDescribedByError","undefined","React","createElement","role","map","el","type","inputMode","maxLength","target","onKeyDown","onPaste","onFocus","onBlur","style","gap"],"mappings":"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"}
+{"version":3,"file":"index56.js","sources":["../src/components/OTPInput/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, KeyboardEvent, ChangeEvent, ClipboardEvent, FC } from 'react';\nimport { useStableId } from '../../utils/useStableId';\nimport './style.scss';\n\nexport interface OTPInputProps {\n  length?: number;\n  onChange?: (value: string) => void;\n  onComplete?: (value: string) => void;\n  label?: string;\n  disabled?: boolean;\n  className?: string;\n  autoFocus?: boolean;\n  error?: boolean;\n  errorMessage?: string;\n  validateOnBlur?: boolean;\n  onValidate?: (value: string) => boolean | string;\n  id?: string;\n}\n\nexport const OTPInput: FC<OTPInputProps> = ({\n  length = 6,\n  onChange,\n  onComplete,\n  label,\n  disabled = false,\n  className = '',\n  autoFocus = true,\n  error = false,\n  errorMessage,\n  validateOnBlur = false,\n  onValidate,\n  id\n}) => {\n  const [values, setValues] = useState<string[]>(Array(length).fill(''));\n  const [internalError, setInternalError] = useState<string | null>(null);\n  const inputRefs = useRef<(HTMLInputElement | null)[]>([]);\n  const isBackspacePressed = useRef<boolean>(false);\n  \n  // Generate stable IDs for ARIA attributes\n  const baseId = useStableId(id, 'se-otp-input');\n  const labelId = `${baseId}-label`;\n  const errorId = `${baseId}-error`;\n\n  // Helper: Check if a string is a single digit\n  const isDigit = (char: string): boolean => /^\\d$/.test(char);\n\n  // Helper: Check if OTP is complete\n  const isComplete = (otpValue: string): boolean => {\n    return otpValue.length === length && values.every((val) => val !== '');\n  };\n\n  // Helper: Update value at specific index\n  const updateValue = (index: number, value: string, shouldFocusNext = false) => {\n    const newValues = [...values];\n    newValues[index] = value;\n    setValues(newValues);\n\n    if (shouldFocusNext && value && index < length - 1) {\n      focusInput(index + 1);\n    }\n  };\n\n  // Helper: Clear value at specific index\n  const clearValue = (index: number) => {\n    updateValue(index, '');\n  };\n\n  // Helper: Focus input at index\n  const focusInput = (index: number) => {\n    inputRefs.current[index]?.focus();\n  };\n\n  useEffect(() => {\n    if (autoFocus && inputRefs.current[0] && !disabled) {\n      focusInput(0);\n    }\n  }, [autoFocus, disabled]);\n\n  // Internal validation\n  const validateOTP = (otpValue: string): string | null => {\n    // Empty validation\n    if (otpValue.length === 0) {\n      return errorMessage || 'Please enter the verification code';\n    }\n\n    // Incomplete validation\n    if (otpValue.length < length || !isComplete(otpValue)) {\n      return errorMessage || 'Please enter all digits';\n    }\n\n    // Custom validation\n    if (onValidate) {\n      const validationResult = onValidate(otpValue);\n      if (validationResult === false) {\n        return errorMessage || 'Invalid verification code';\n      }\n      if (typeof validationResult === 'string') {\n        return validationResult;\n      }\n    }\n\n    return null;\n  };\n\n  useEffect(() => {\n    const otpValue = values.join('');\n    onChange?.(otpValue);\n\n    // Clear error when user starts typing\n    if (internalError && otpValue.length > 0) {\n      setInternalError(null);\n    }\n\n    if (isComplete(otpValue)) {\n      // Validate on complete\n      if (onValidate) {\n        const validationResult = onValidate(otpValue);\n        if (validationResult === false || typeof validationResult === 'string') {\n          const errorMsg =\n            typeof validationResult === 'string' ? validationResult : errorMessage || 'Invalid verification code';\n          setInternalError(errorMsg);\n        } else {\n          setInternalError(null);\n        }\n      }\n      onComplete?.(otpValue);\n    }\n  }, [values, length, onChange, onComplete, onValidate, errorMessage]);\n\n  const handleChange = (index: number, value: string) => {\n    // Only allow single digit or empty\n    if (value && !isDigit(value)) {\n      return;\n    }\n\n    updateValue(index, value, true);\n  };\n\n  const handleKeyDown = (index: number, e: KeyboardEvent<HTMLInputElement>) => {\n    if (disabled) return;\n\n    const currentValue = values[index];\n\n    // Handle backspace\n    if (e.key === 'Backspace') {\n      isBackspacePressed.current = true;\n      if (currentValue) {\n        clearValue(index);\n      } else if (index > 0) {\n        clearValue(index - 1);\n        focusInput(index - 1);\n      }\n      // Reset backspace flag after a short delay\n      setTimeout(() => {\n        isBackspacePressed.current = false;\n      }, 100);\n      e.preventDefault();\n      return;\n    }\n\n    // Handle delete\n    if (e.key === 'Delete') {\n      isBackspacePressed.current = true;\n      clearValue(index);\n      // Reset backspace flag after a short delay\n      setTimeout(() => {\n        isBackspacePressed.current = false;\n      }, 100);\n      e.preventDefault();\n      return;\n    }\n\n    // Handle navigation keys\n    const navigationHandlers: Record<string, () => void> = {\n      ArrowLeft: () => index > 0 && focusInput(index - 1),\n      ArrowRight: () => index < length - 1 && focusInput(index + 1),\n      Home: () => focusInput(0),\n      End: () => focusInput(length - 1)\n    };\n\n    if (navigationHandlers[e.key]) {\n      navigationHandlers[e.key]();\n      e.preventDefault();\n      return;\n    }\n\n    // Allow digits, but prevent if already filled\n    if (isDigit(e.key)) {\n      if (currentValue) {\n        updateValue(index, e.key, true);\n      }\n    }\n  };\n\n  const handlePaste = (e: ClipboardEvent<HTMLInputElement>) => {\n    if (disabled) return;\n\n    e.preventDefault();\n    const pastedData = e.clipboardData.getData('text/plain').trim();\n\n    // Extract only digits\n    const digits = pastedData.replace(/\\D/g, '').slice(0, length);\n\n    if (digits.length > 0) {\n      const newValues = [...values];\n\n      // Fill inputs starting from the current index\n      const startIndex = inputRefs.current.findIndex((ref) => ref === document.activeElement);\n      const actualStartIndex = startIndex >= 0 ? startIndex : 0;\n\n      for (let i = 0; i < digits.length && actualStartIndex + i < length; i++) {\n        newValues[actualStartIndex + i] = digits[i];\n      }\n\n      setValues(newValues);\n\n      // Focus the next empty input or the last input\n      const nextEmptyIndex = newValues.findIndex((val, idx) => idx >= actualStartIndex && val === '');\n      const focusIndex = nextEmptyIndex >= 0 ? nextEmptyIndex : Math.min(actualStartIndex + digits.length, length - 1);\n      focusInput(focusIndex);\n    }\n  };\n\n  const handleFocus = (index: number) => {\n    inputRefs.current[index]?.select();\n  };\n\n  const handleBlur = () => {\n    // Don't validate on blur if backspace/delete was just pressed\n    if (validateOnBlur && !isBackspacePressed.current) {\n      const otpValue = values.join('');\n      const validationError = validateOTP(otpValue);\n      setInternalError(validationError);\n    }\n  };\n\n  const hasError = error || !!internalError;\n  // Priority: errorMessage prop > internalError\n  const displayError = hasError && (errorMessage || internalError);\n  \n  const ariaDescribedByError = displayError ? errorId : undefined;\n\n  return (\n    <div className={`se-design-otp-input ${className || ''}`} data-automation-id=\"otp-input-container\">\n      {label && <div id={labelId} className=\"se-design-otp-input-label\">{label}</div>}\n      <div className=\"flex items-center gap-[12px]\" role=\"group\" aria-labelledby={label ? labelId : undefined}>\n        {values.map((value, index) => (\n          <input\n            key={index}\n            ref={(el) => {\n              inputRefs.current[index] = el;\n            }}\n            type=\"text\"\n            inputMode=\"numeric\"\n            maxLength={1}\n            value={value}\n            onChange={(e: ChangeEvent<HTMLInputElement>) => handleChange(index, e.target.value)}\n            onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => handleKeyDown(index, e)}\n            onPaste={handlePaste}\n            onFocus={() => handleFocus(index)}\n            onBlur={handleBlur}\n            disabled={disabled}\n            className={`\n              w-12 h-12 \n              flex flex-col items-start \n              text-center text-lg font-medium\n              border rounded-md\n              outline-none\n              transition-colors\n              disabled:bg-gray-50 disabled:cursor-not-allowed\n              ${\n                disabled\n                  ? 'border-[var(--color-gray-300)] text-gray-400'\n                  : hasError\n                  ? 'border-[var(--color-red-500)] text-gray-900 focus:border-[var(--color-red-500)] focus:ring-1 focus:ring-[var(--color-red-500)]'\n                  : 'border-[var(--color-gray-600)] text-gray-900 focus:border-[var(--color-blue-500)] focus:ring-1 focus:ring-[var(--color-blue-500)]'\n              }\n            `}\n            style={{\n              gap: 'var(--Spacer-6px, 6px)'\n            }}\n            aria-label={`OTP digit ${index + 1} of ${length}`}\n            aria-invalid={hasError}\n            aria-describedby={ariaDescribedByError}\n            data-automation-id={`otp-input-${index}`}\n          />\n        ))}\n      </div>\n      {displayError && <div id={errorId} className=\"se-design-otp-input-error\" role=\"alert\">{displayError}</div>}\n    </div>\n  );\n};\n"],"names":["OTPInput","length","onChange","onComplete","label","disabled","className","autoFocus","error","errorMessage","validateOnBlur","onValidate","id","values","setValues","useState","Array","fill","internalError","setInternalError","inputRefs","useRef","isBackspacePressed","baseId","useStableId","labelId","errorId","isDigit","char","test","isComplete","otpValue","every","val","updateValue","index","value","shouldFocusNext","newValues","focusInput","clearValue","current","focus","useEffect","validateOTP","validationResult","join","handleChange","handleKeyDown","e","currentValue","key","setTimeout","preventDefault","navigationHandlers","ArrowLeft","ArrowRight","Home","End","handlePaste","digits","clipboardData","getData","trim","replace","slice","startIndex","findIndex","ref","document","activeElement","actualStartIndex","i","nextEmptyIndex","idx","focusIndex","Math","min","handleFocus","select","handleBlur","validationError","hasError","displayError","ariaDescribedByError","undefined","React","createElement","role","map","el","type","inputMode","maxLength","target","onKeyDown","onPaste","onFocus","onBlur","style","gap"],"mappings":"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"}

package/dist/index57.js.map

@@ -1 +1 @@
-{"version":3,"file":"index57.js","sources":["../src/components/InfoBar/index.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { Icon } from \"../Icon\";\n\nexport interface InfoBarProps {\n  className?: string;\n  message: string;\n  backgroundColor?: string;\n  textColor?: string;\n  borderColor?: string;\n  actionJSX?: () => React.ReactNode;\n}\n\nexport const InfoBar: FC<InfoBarProps> = ({\n  className = \"\",\n  message = \"\",\n  backgroundColor = 'var(--color-yellow-50)',\n  textColor = 'var(--color-yellow-800)',\n  borderColor = 'var(--color-yellow-200)',\n  actionJSX = () => <></>\n}) => {\n\n  return (\n    <div\n      className={`se-design-info-bar ${className} px-3 py-2 border rounded-[6px]`}\n      style={{ backgroundColor, borderColor, color: textColor }}\n    >\n      <div className={`info-bar-message flex items-center gap-2`}>\n        <Icon name=\"info\" stroke={textColor} />\n        <span style={{ color: textColor }}>{message}</span>\n      </div>\n      <div className={`info-bar-action ml-[22px]`}>\n        {actionJSX()}\n      </div>\n    </div>\n  );\n};"],"names":["InfoBar","className","message","backgroundColor","textColor","borderColor","actionJSX","React","createElement","Fragment","style","color","Icon","name","stroke"],"mappings":";;AAYO,MAAMA,IAA4BA,CAAC;AAAA,EACxCC,WAAAA,IAAY;AAAA,EACZC,SAAAA,IAAU;AAAA,EACVC,iBAAAA,IAAkB;AAAA,EAClBC,WAAAA,IAAY;AAAA,EACZC,aAAAA,IAAc;AAAA,EACdC,WAAAA,IAAYA,MAAMC,gBAAAA,EAAAC,cAAAD,EAAAE,UAAI,IAAA;AACxB,MAGIF,gBAAAA,EAAAC,cAAA,OAAA;AAAA,EACEP,WAAW,sBAAsBA,CAAS;AAAA,EAC1CS,OAAO;AAAA,IAAEP,iBAAAA;AAAAA,IAAiBE,aAAAA;AAAAA,IAAaM,OAAOP;AAAAA,EAAU;AAAA,GAExDI,gBAAAA,EAAAA,cAAA,OAAA;AAAA,EAAKP,WAAW;AAAA,GACdO,gBAAAA,EAAAA,cAACI,GAAI;AAAA,EAACC,MAAK;AAAA,EAAOC,QAAQV;AAAAA,CAAY,GACtCI,gBAAAA,EAAAA,cAAA,QAAA;AAAA,EAAME,OAAO;AAAA,IAAEC,OAAOP;AAAAA,EAAU;GAAIF,CAAc,CAC/C,GACLK,gBAAAA,EAAAC,cAAA,OAAA;AAAA,EAAKP,WAAW;AAAA,GACbK,EACE,CAAA,CACF;"}
+{"version":3,"file":"index57.js","sources":["../src/components/InfoBar/index.tsx"],"sourcesContent":["import React, { FC } from \"react\";\nimport { Icon } from \"../Icon\";\n\nexport interface InfoBarProps {\n  className?: string;\n  message: string;\n  backgroundColor?: string;\n  textColor?: string;\n  borderColor?: string;\n  actionJSX?: () => React.ReactNode;\n}\n\nexport const InfoBar: FC<InfoBarProps> = ({\n  className = \"\",\n  message = \"\",\n  backgroundColor = 'var(--color-yellow-50)',\n  textColor = 'var(--color-yellow-800)',\n  borderColor = 'var(--color-yellow-200)',\n  actionJSX = () => <></>\n}) => {\n\n  return (\n    <div\n      className={`se-design-info-bar ${className} px-3 py-2 border rounded-[6px]`}\n      style={{ backgroundColor, borderColor, color: textColor }}\n    >\n      <div className={`info-bar-message flex items-center gap-2`}>\n        <Icon name=\"info\" stroke={textColor} />\n        <span style={{ color: textColor }}>{message}</span>\n      </div>\n      <div className={`info-bar-action ml-[22px]`}>\n        {actionJSX()}\n      </div>\n    </div>\n  );\n};"],"names":["InfoBar","className","message","backgroundColor","textColor","borderColor","actionJSX","React","createElement","Fragment","style","color","Icon","name","stroke"],"mappings":";;AAYO,MAAMA,IAA4BA,CAAC;AAAA,EACxCC,WAAAA,IAAY;AAAA,EACZC,SAAAA,IAAU;AAAA,EACVC,iBAAAA,IAAkB;AAAA,EAClBC,WAAAA,IAAY;AAAA,EACZC,aAAAA,IAAc;AAAA,EACdC,WAAAA,IAAYA,MAAMC,gBAAAA,EAAAC,cAAAD,EAAAE,UAAA,IAAI;AACxB,MAGIF,gBAAAA,EAAAC,cAAA,OAAA;AAAA,EACEP,WAAW,sBAAsBA,CAAS;AAAA,EAC1CS,OAAO;AAAA,IAAEP,iBAAAA;AAAAA,IAAiBE,aAAAA;AAAAA,IAAaM,OAAOP;AAAAA,EAAAA;AAAU,GAExDG,gBAAAA,EAAAC,cAAA,OAAA;AAAA,EAAKP,WAAW;AAAA,GACdM,gBAAAA,EAAAC,cAACI,GAAI;AAAA,EAACC,MAAK;AAAA,EAAOC,QAAQV;AAAAA,CAAY,GACtCG,gBAAAA,EAAAC,cAAA,QAAA;AAAA,EAAME,OAAO;AAAA,IAAEC,OAAOP;AAAAA,EAAAA;AAAU,GAAIF,CAAc,CAC/C,GACLK,gBAAAA,EAAAC,cAAA,OAAA;AAAA,EAAKP,WAAW;AAAA,GACbK,EAAAA,CACE,CACF;"}

package/dist/index58.js.map

@@ -1 +1 @@
-{"version":3,"file":"index58.js","sources":["../src/components/BottomSheet/index.tsx"],"sourcesContent":["import React, { FC, useState, useRef } from 'react';\nimport { CustomModal } from '../CustomModal';\nimport { Icon } from '../Icon';\n\nimport './style.scss';\n\nexport interface BottomSheetProps {\n  isOpen: boolean;\n  title?: string;\n  onClose: () => void;\n  showCloseIcon?: boolean;\n  showBackButton?: boolean;\n  onBack?: () => void;\n  children: React.ReactNode;\n  className?: string;\n  automationId?: string;\n  minHeight?: string;\n}\n\ninterface BottomSheetContentProps {\n  title?: string;\n  onClose: () => void;\n  showCloseIcon?: boolean;\n  showBackButton?: boolean;\n  onBack?: () => void;\n  children: React.ReactNode;\n  className?: string;\n  automationId?: string;\n  minHeight?: string;\n}\n\nconst BottomSheetContent: FC<BottomSheetContentProps> = ({\n  children = null,\n  title = '',\n  onClose = () => {},\n  showCloseIcon = false,\n  showBackButton = false,\n  onBack = () => {},\n  className = '',\n  automationId = '',\n  minHeight = 'auto'\n}) => {\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [startY, setStartY] = useState<number>(0);\n  const [currentY, setCurrentY] = useState<number>(0);\n  const [isDragging, setIsDragging] = useState<boolean>(false);\n\n  const handleTouchStart = (e: React.TouchEvent) => {\n    setStartY(e.touches[0].clientY);\n    setCurrentY(e.touches[0].clientY);\n    setIsDragging(true);\n  };\n\n  const handleTouchMove = (e: React.TouchEvent) => {\n    if (!isDragging) return;\n\n    const touchY = e.touches[0].clientY;\n    const deltaY = touchY - startY;\n\n    // Only allow dragging down\n    if (deltaY > 0) {\n      setCurrentY(touchY);\n      if (contentRef.current) {\n        contentRef.current.style.transform = `translateY(${deltaY}px)`;\n      }\n    }\n  };\n\n  const handleTouchEnd = () => {\n    if (!isDragging) return;\n\n    const deltaY = currentY - startY;\n    const threshold = 60; // pixels to swipe down to trigger close\n\n    if (deltaY > threshold) {\n      // Trigger close\n      onClose();\n    } else {\n      // Reset position\n      if (contentRef.current) {\n        contentRef.current.style.transform = 'translateY(0)';\n      }\n    }\n\n    setIsDragging(false);\n    setStartY(0);\n    setCurrentY(0);\n  };\n\n  return (\n    <div\n      ref={contentRef}\n      className={`se-design-bottom-sheet relative h-max max-h-[98vh] rounded-t-2xl flex flex-col pt-5 ${className}`}\n      onClick={(e) => e.stopPropagation()}\n      onTouchStart={handleTouchStart}\n      onTouchMove={handleTouchMove}\n      onTouchEnd={handleTouchEnd}\n      data-automation-id={automationId}\n      style={{ minHeight }}\n    >\n      {(title || showBackButton) && (\n        <div className=\"se-design-bottom-sheet-header flex items-center justify-left gap-3 mr-6 px-4\">\n          {showBackButton && (\n            <Icon\n              name=\"back\"\n              stroke=\"var(--color-gray-700)\"\n              onClick={onBack}\n              className=\"se-design-bottom-sheet-back-icon cursor-pointer\"\n              automationId={`${automationId}-back-icon`}\n            />\n          )}\n          {title && <div className=\"se-design-bottom-sheet-title text-lg font-semibold\">{title}</div>}\n        </div>\n      )}\n      {showCloseIcon && (\n        <Icon\n          name=\"close\"\n          onClick={onClose}\n          className=\"se-design-bottom-sheet-close-icon absolute top-6 right-4 cursor-pointer z-10\"\n          automationId={`${automationId}-close-icon`}\n        />\n      )}\n      <div className=\"se-design-bottom-sheet-content px-4 pb-5 flex-1 min-h-0 overflow-y-auto\">{children}</div>\n    </div>\n  );\n};\n\nexport const BottomSheet: FC<BottomSheetProps> = ({\n  isOpen = false,\n  title = '',\n  onClose = () => {},\n  children = null,\n  showCloseIcon = true,\n  showBackButton = false,\n  onBack = () => {},\n  className = '',\n  automationId = 'bottomsheet',\n  minHeight = ''\n}) => {\n  return (\n    <CustomModal\n      isOpen={isOpen}\n      onClose={onClose}\n      onModalClick={onClose}\n      className=\"custom-bottom-sheet\"\n      renderModalContent={() => (\n        <BottomSheetContent\n          title={title}\n          onClose={onClose}\n          showCloseIcon={showCloseIcon}\n          showBackButton={showBackButton}\n          onBack={onBack}\n          className={className}\n          automationId={automationId}\n          minHeight={minHeight}\n        >\n          {children}\n        </BottomSheetContent>\n      )}\n    />\n  );\n};\n"],"names":["BottomSheetContent","children","title","onClose","showCloseIcon","showBackButton","onBack","className","automationId","minHeight","contentRef","useRef","startY","setStartY","useState","currentY","setCurrentY","isDragging","setIsDragging","handleTouchStart","e","touches","clientY","handleTouchMove","touchY","deltaY","current","style","transform","handleTouchEnd","React","createElement","ref","onClick","stopPropagation","onTouchStart","onTouchMove","onTouchEnd","Icon","name","stroke","BottomSheet","isOpen","CustomModal","onModalClick","renderModalContent"],"mappings":"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"}
+{"version":3,"file":"index58.js","sources":["../src/components/BottomSheet/index.tsx"],"sourcesContent":["import React, { FC, useState, useRef } from 'react';\nimport { CustomModal } from '../CustomModal';\nimport { Icon } from '../Icon';\n\nimport './style.scss';\n\nexport interface BottomSheetProps {\n  isOpen: boolean;\n  title?: string;\n  onClose: () => void;\n  showCloseIcon?: boolean;\n  showBackButton?: boolean;\n  onBack?: () => void;\n  children: React.ReactNode;\n  className?: string;\n  automationId?: string;\n  minHeight?: string;\n}\n\ninterface BottomSheetContentProps {\n  title?: string;\n  onClose: () => void;\n  showCloseIcon?: boolean;\n  showBackButton?: boolean;\n  onBack?: () => void;\n  children: React.ReactNode;\n  className?: string;\n  automationId?: string;\n  minHeight?: string;\n}\n\nconst BottomSheetContent: FC<BottomSheetContentProps> = ({\n  children = null,\n  title = '',\n  onClose = () => {},\n  showCloseIcon = false,\n  showBackButton = false,\n  onBack = () => {},\n  className = '',\n  automationId = '',\n  minHeight = 'auto'\n}) => {\n  const contentRef = useRef<HTMLDivElement>(null);\n  const [startY, setStartY] = useState<number>(0);\n  const [currentY, setCurrentY] = useState<number>(0);\n  const [isDragging, setIsDragging] = useState<boolean>(false);\n\n  const handleTouchStart = (e: React.TouchEvent) => {\n    setStartY(e.touches[0].clientY);\n    setCurrentY(e.touches[0].clientY);\n    setIsDragging(true);\n  };\n\n  const handleTouchMove = (e: React.TouchEvent) => {\n    if (!isDragging) return;\n\n    const touchY = e.touches[0].clientY;\n    const deltaY = touchY - startY;\n\n    // Only allow dragging down\n    if (deltaY > 0) {\n      setCurrentY(touchY);\n      if (contentRef.current) {\n        contentRef.current.style.transform = `translateY(${deltaY}px)`;\n      }\n    }\n  };\n\n  const handleTouchEnd = () => {\n    if (!isDragging) return;\n\n    const deltaY = currentY - startY;\n    const threshold = 60; // pixels to swipe down to trigger close\n\n    if (deltaY > threshold) {\n      // Trigger close\n      onClose();\n    } else {\n      // Reset position\n      if (contentRef.current) {\n        contentRef.current.style.transform = 'translateY(0)';\n      }\n    }\n\n    setIsDragging(false);\n    setStartY(0);\n    setCurrentY(0);\n  };\n\n  return (\n    <div\n      ref={contentRef}\n      className={`se-design-bottom-sheet relative h-max max-h-[98vh] rounded-t-2xl flex flex-col pt-5 ${className}`}\n      onClick={(e) => e.stopPropagation()}\n      onTouchStart={handleTouchStart}\n      onTouchMove={handleTouchMove}\n      onTouchEnd={handleTouchEnd}\n      data-automation-id={automationId}\n      style={{ minHeight }}\n    >\n      {(title || showBackButton) && (\n        <div className=\"se-design-bottom-sheet-header flex items-center justify-left gap-3 mr-6 px-4\">\n          {showBackButton && (\n            <Icon\n              name=\"back\"\n              stroke=\"var(--color-gray-700)\"\n              onClick={onBack}\n              className=\"se-design-bottom-sheet-back-icon cursor-pointer\"\n              automationId={`${automationId}-back-icon`}\n            />\n          )}\n          {title && <div className=\"se-design-bottom-sheet-title text-lg font-semibold\">{title}</div>}\n        </div>\n      )}\n      {showCloseIcon && (\n        <Icon\n          name=\"close\"\n          onClick={onClose}\n          className=\"se-design-bottom-sheet-close-icon absolute top-6 right-4 cursor-pointer z-10\"\n          automationId={`${automationId}-close-icon`}\n        />\n      )}\n      <div className=\"se-design-bottom-sheet-content px-4 pb-5 flex-1 min-h-0 overflow-y-auto\">{children}</div>\n    </div>\n  );\n};\n\nexport const BottomSheet: FC<BottomSheetProps> = ({\n  isOpen = false,\n  title = '',\n  onClose = () => {},\n  children = null,\n  showCloseIcon = true,\n  showBackButton = false,\n  onBack = () => {},\n  className = '',\n  automationId = 'bottomsheet',\n  minHeight = ''\n}) => {\n  return (\n    <CustomModal\n      isOpen={isOpen}\n      onClose={onClose}\n      onModalClick={onClose}\n      className=\"custom-bottom-sheet\"\n      renderModalContent={() => (\n        <BottomSheetContent\n          title={title}\n          onClose={onClose}\n          showCloseIcon={showCloseIcon}\n          showBackButton={showBackButton}\n          onBack={onBack}\n          className={className}\n          automationId={automationId}\n          minHeight={minHeight}\n        >\n          {children}\n        </BottomSheetContent>\n      )}\n    />\n  );\n};\n"],"names":["BottomSheetContent","children","title","onClose","showCloseIcon","showBackButton","onBack","className","automationId","minHeight","contentRef","useRef","startY","setStartY","useState","currentY","setCurrentY","isDragging","setIsDragging","handleTouchStart","e","touches","clientY","handleTouchMove","touchY","deltaY","current","style","transform","handleTouchEnd","React","createElement","ref","onClick","stopPropagation","onTouchStart","onTouchMove","onTouchEnd","Icon","name","stroke","BottomSheet","isOpen","CustomModal","onModalClick","renderModalContent"],"mappings":"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"}

package/dist/index59.js.map

@@ -1 +1 @@
-{"version":3,"file":"index59.js","sources":["../src/components/TimePicker/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport { Button } from '../Button';\n\nexport interface TimePickerProps {\n  initialHour?: number;\n  initialMinute?: number;\n  onApply?: (time: { hour: number; minute: number }) => void;\n  ctaLabel?: string;\n  onClose?: () => void;\n  className?: string;\n  automationId?: string;\n}\n\nconst ITEM_HEIGHT = 40;\nconst VISIBLE_ITEMS = 7;\nconst BUFFER_ITEMS = 3;\n\nconst HOURS = Array.from({ length: 12 }, (_, i) => String(i + 1).padStart(2, '0'));\nconst MINUTES = Array.from({ length: 60 }, (_, i) => String(i).padStart(2, '0'));\nconst PERIODS: ('AM' | 'PM')[] = ['AM', 'PM'];\n\ninterface ScrollColumnProps {\n  items: readonly string[];\n  selectedIndex: number;\n  onSelect: (index: number) => void;\n  automationId?: string;\n}\n\nconst ScrollColumn: React.FC<ScrollColumnProps> = ({ items, selectedIndex, onSelect, automationId = '' }) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const scrollTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (containerRef.current) {\n      containerRef.current.scrollTo({ top: selectedIndex * ITEM_HEIGHT, behavior: 'smooth' });\n    }\n  }, [selectedIndex]);\n\n  const handleScroll = () => {\n    if (!containerRef.current) return;\n\n    if (scrollTimeout.current) clearTimeout(scrollTimeout.current);\n\n    scrollTimeout.current = setTimeout(() => {\n      const container = containerRef.current;\n      if (!container) return;\n\n      const newIndex = Math.round(container.scrollTop / ITEM_HEIGHT);\n      const clampedIndex = Math.max(0, Math.min(items.length - 1, newIndex));\n\n      container.scrollTo({ top: clampedIndex * ITEM_HEIGHT, behavior: 'smooth' });\n\n      if (clampedIndex !== selectedIndex) onSelect(clampedIndex);\n    }, 100);\n  };\n\n  const handleItemClick = (index: number) => {\n    onSelect(index);\n    containerRef.current?.scrollTo({ top: index * ITEM_HEIGHT, behavior: 'smooth' });\n  };\n\n  return (\n    <div className=\"w-14\">\n      <div\n        ref={containerRef}\n        className=\"overflow-y-auto [&::-webkit-scrollbar]:hidden\"\n        onScroll={handleScroll}\n        style={{\n          height: VISIBLE_ITEMS * ITEM_HEIGHT,\n          paddingTop: BUFFER_ITEMS * ITEM_HEIGHT,\n          paddingBottom: BUFFER_ITEMS * ITEM_HEIGHT,\n          scrollSnapType: 'y mandatory',\n          scrollbarWidth: 'none'\n        }}\n      >\n        {items.map((item, index) => (\n          <div\n            key={item}\n            className={`flex items-center justify-center cursor-pointer select-none transition-colors h-10 ${\n              index === selectedIndex\n                ? 'text-[var(--color-blue-500)] font-semibold'\n                : 'text-[var(--color-gray-700)] hover:text-[var(--color-blue-500)]'\n            }`}\n            onClick={() => handleItemClick(index)}\n            style={{ scrollSnapAlign: 'center' }}\n            data-automation-id={`${automationId}-item-${index}`}\n          >\n            {item}\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport const TimePicker: React.FC<TimePickerProps> = ({\n  initialHour = 12,\n  initialMinute = 0,\n  onApply,\n  ctaLabel = 'Apply',\n  onClose,\n  className = '',\n  automationId = 'timepicker'\n}) => {\n  const [selectedHourIndex, setSelectedHourIndex] = useState(() => {\n    if (initialHour === 0) return 11; // 0 = 12 AM\n    if (initialHour > 12) return initialHour - 12 - 1; // 13-23 → 1-11 (PM hours)\n    return initialHour - 1; // 1-12 → 0-11\n  });\n  const [selectedMinuteIndex, setSelectedMinuteIndex] = useState(Math.max(0, Math.min(59, initialMinute ?? 0)));\n  const [selectedPeriodIndex, setSelectedPeriodIndex] = useState(\n    () => (initialHour >= 12 ? 1 : 0) // 0-11 = AM, 12-23 = PM\n  );\n\n  const handleApply = () => {\n    const hourIn24Format = selectedPeriodIndex === 1 ? selectedHourIndex + 12 : selectedHourIndex;\n    onApply?.({\n      hour: hourIn24Format + 1,\n      minute: selectedMinuteIndex\n    });\n    onClose?.();\n  };\n\n  return (\n    <div\n      className={`se-design-timepicker-container w-full min-w-[216px] bg-[var(--color-white)] rounded-xl shadow-md border border-[var(--color-gray-400)] overflow-hidden ${className}`}\n    >\n      <div className=\"se-design-timepicker-content w-full relative p-4\">\n        <div className=\"absolute left-4 right-4 top-1/2 -translate-y-1/2 h-10 bg-[var(--color-blue-50)] rounded-lg pointer-events-none z-0\" />\n        <div className=\"flex justify-between gap-2 relative z-10\">\n          <ScrollColumn\n            items={HOURS}\n            selectedIndex={selectedHourIndex}\n            onSelect={setSelectedHourIndex}\n            automationId={`${automationId}-hours`}\n          />\n          <div className=\"w-px bg-[var(--color-gray-200)]\" style={{ height: VISIBLE_ITEMS * ITEM_HEIGHT }} />\n          <ScrollColumn\n            items={MINUTES}\n            selectedIndex={selectedMinuteIndex}\n            onSelect={setSelectedMinuteIndex}\n            automationId={`${automationId}-minutes`}\n          />\n          <div className=\"w-px bg-[var(--color-gray-200)]\" style={{ height: VISIBLE_ITEMS * ITEM_HEIGHT }} />\n          <ScrollColumn\n            items={PERIODS}\n            selectedIndex={selectedPeriodIndex}\n            onSelect={setSelectedPeriodIndex}\n            automationId={`${automationId}-periods`}\n          />\n        </div>\n      </div>\n      <div className=\"se-design-timepicker-footer flex justify-end p-3 border-t border-[var(--color-gray-200)]\">\n        <Button label={ctaLabel} type=\"primary\" onClick={handleApply} automationId={`${automationId}-apply-button`} />\n      </div>\n    </div>\n  );\n};\n"],"names":["ITEM_HEIGHT","VISIBLE_ITEMS","BUFFER_ITEMS","HOURS","Array","from","length","_","i","String","padStart","MINUTES","PERIODS","ScrollColumn","items","selectedIndex","onSelect","automationId","containerRef","useRef","scrollTimeout","useEffect","current","scrollTo","top","behavior","handleScroll","setTimeout","container","newIndex","Math","round","scrollTop","clampedIndex","max","min","handleItemClick","index","React","createElement","className","ref","onScroll","style","height","paddingTop","paddingBottom","scrollSnapType","scrollbarWidth","map","item","key","onClick","scrollSnapAlign","TimePicker","initialHour","initialMinute","onApply","ctaLabel","onClose","selectedHourIndex","setSelectedHourIndex","useState","selectedMinuteIndex","setSelectedMinuteIndex","selectedPeriodIndex","setSelectedPeriodIndex","handleApply","hourIn24Format","hour","minute","Button","label","type"],"mappings":"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"}
+{"version":3,"file":"index59.js","sources":["../src/components/TimePicker/index.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport { Button } from '../Button';\n\nexport interface TimePickerProps {\n  initialHour?: number;\n  initialMinute?: number;\n  onApply?: (time: { hour: number; minute: number }) => void;\n  ctaLabel?: string;\n  onClose?: () => void;\n  className?: string;\n  automationId?: string;\n}\n\nconst ITEM_HEIGHT = 40;\nconst VISIBLE_ITEMS = 7;\nconst BUFFER_ITEMS = 3;\n\nconst HOURS = Array.from({ length: 12 }, (_, i) => String(i + 1).padStart(2, '0'));\nconst MINUTES = Array.from({ length: 60 }, (_, i) => String(i).padStart(2, '0'));\nconst PERIODS: ('AM' | 'PM')[] = ['AM', 'PM'];\n\ninterface ScrollColumnProps {\n  items: readonly string[];\n  selectedIndex: number;\n  onSelect: (index: number) => void;\n  automationId?: string;\n}\n\nconst ScrollColumn: React.FC<ScrollColumnProps> = ({ items, selectedIndex, onSelect, automationId = '' }) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const scrollTimeout = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (containerRef.current) {\n      containerRef.current.scrollTo({ top: selectedIndex * ITEM_HEIGHT, behavior: 'smooth' });\n    }\n  }, [selectedIndex]);\n\n  const handleScroll = () => {\n    if (!containerRef.current) return;\n\n    if (scrollTimeout.current) clearTimeout(scrollTimeout.current);\n\n    scrollTimeout.current = setTimeout(() => {\n      const container = containerRef.current;\n      if (!container) return;\n\n      const newIndex = Math.round(container.scrollTop / ITEM_HEIGHT);\n      const clampedIndex = Math.max(0, Math.min(items.length - 1, newIndex));\n\n      container.scrollTo({ top: clampedIndex * ITEM_HEIGHT, behavior: 'smooth' });\n\n      if (clampedIndex !== selectedIndex) onSelect(clampedIndex);\n    }, 100);\n  };\n\n  const handleItemClick = (index: number) => {\n    onSelect(index);\n    containerRef.current?.scrollTo({ top: index * ITEM_HEIGHT, behavior: 'smooth' });\n  };\n\n  return (\n    <div className=\"w-14\">\n      <div\n        ref={containerRef}\n        className=\"overflow-y-auto [&::-webkit-scrollbar]:hidden\"\n        onScroll={handleScroll}\n        style={{\n          height: VISIBLE_ITEMS * ITEM_HEIGHT,\n          paddingTop: BUFFER_ITEMS * ITEM_HEIGHT,\n          paddingBottom: BUFFER_ITEMS * ITEM_HEIGHT,\n          scrollSnapType: 'y mandatory',\n          scrollbarWidth: 'none'\n        }}\n      >\n        {items.map((item, index) => (\n          <div\n            key={item}\n            className={`flex items-center justify-center cursor-pointer select-none transition-colors h-10 ${\n              index === selectedIndex\n                ? 'text-[var(--color-blue-500)] font-semibold'\n                : 'text-[var(--color-gray-700)] hover:text-[var(--color-blue-500)]'\n            }`}\n            onClick={() => handleItemClick(index)}\n            style={{ scrollSnapAlign: 'center' }}\n            data-automation-id={`${automationId}-item-${index}`}\n          >\n            {item}\n          </div>\n        ))}\n      </div>\n    </div>\n  );\n};\n\nexport const TimePicker: React.FC<TimePickerProps> = ({\n  initialHour = 12,\n  initialMinute = 0,\n  onApply,\n  ctaLabel = 'Apply',\n  onClose,\n  className = '',\n  automationId = 'timepicker'\n}) => {\n  const [selectedHourIndex, setSelectedHourIndex] = useState(() => {\n    if (initialHour === 0) return 11; // 0 = 12 AM\n    if (initialHour > 12) return initialHour - 12 - 1; // 13-23 → 1-11 (PM hours)\n    return initialHour - 1; // 1-12 → 0-11\n  });\n  const [selectedMinuteIndex, setSelectedMinuteIndex] = useState(Math.max(0, Math.min(59, initialMinute ?? 0)));\n  const [selectedPeriodIndex, setSelectedPeriodIndex] = useState(\n    () => (initialHour >= 12 ? 1 : 0) // 0-11 = AM, 12-23 = PM\n  );\n\n  const handleApply = () => {\n    const hourIn24Format = selectedPeriodIndex === 1 ? selectedHourIndex + 12 : selectedHourIndex;\n    onApply?.({\n      hour: hourIn24Format + 1,\n      minute: selectedMinuteIndex\n    });\n    onClose?.();\n  };\n\n  return (\n    <div\n      className={`se-design-timepicker-container w-full min-w-[216px] bg-[var(--color-white)] rounded-xl shadow-md border border-[var(--color-gray-400)] overflow-hidden ${className}`}\n    >\n      <div className=\"se-design-timepicker-content w-full relative p-4\">\n        <div className=\"absolute left-4 right-4 top-1/2 -translate-y-1/2 h-10 bg-[var(--color-blue-50)] rounded-lg pointer-events-none z-0\" />\n        <div className=\"flex justify-between gap-2 relative z-10\">\n          <ScrollColumn\n            items={HOURS}\n            selectedIndex={selectedHourIndex}\n            onSelect={setSelectedHourIndex}\n            automationId={`${automationId}-hours`}\n          />\n          <div className=\"w-px bg-[var(--color-gray-200)]\" style={{ height: VISIBLE_ITEMS * ITEM_HEIGHT }} />\n          <ScrollColumn\n            items={MINUTES}\n            selectedIndex={selectedMinuteIndex}\n            onSelect={setSelectedMinuteIndex}\n            automationId={`${automationId}-minutes`}\n          />\n          <div className=\"w-px bg-[var(--color-gray-200)]\" style={{ height: VISIBLE_ITEMS * ITEM_HEIGHT }} />\n          <ScrollColumn\n            items={PERIODS}\n            selectedIndex={selectedPeriodIndex}\n            onSelect={setSelectedPeriodIndex}\n            automationId={`${automationId}-periods`}\n          />\n        </div>\n      </div>\n      <div className=\"se-design-timepicker-footer flex justify-end p-3 border-t border-[var(--color-gray-200)]\">\n        <Button label={ctaLabel} type=\"primary\" onClick={handleApply} automationId={`${automationId}-apply-button`} />\n      </div>\n    </div>\n  );\n};\n"],"names":["ITEM_HEIGHT","VISIBLE_ITEMS","BUFFER_ITEMS","HOURS","Array","from","length","_","i","String","padStart","MINUTES","PERIODS","ScrollColumn","items","selectedIndex","onSelect","automationId","containerRef","useRef","scrollTimeout","useEffect","current","scrollTo","top","behavior","handleScroll","clearTimeout","setTimeout","container","newIndex","Math","round","scrollTop","clampedIndex","max","min","handleItemClick","index","React","createElement","className","ref","onScroll","style","height","paddingTop","paddingBottom","scrollSnapType","scrollbarWidth","map","item","key","onClick","scrollSnapAlign","TimePicker","initialHour","initialMinute","onApply","ctaLabel","onClose","selectedHourIndex","setSelectedHourIndex","useState","selectedMinuteIndex","setSelectedMinuteIndex","selectedPeriodIndex","setSelectedPeriodIndex","handleApply","hourIn24Format","hour","minute","Button","label","type"],"mappings":"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"}

package/dist/index6.js

@@ -1,8 +1,8 @@
-import s, { useState as h, useCallback as i } from "react";
+import c, { useState as h, useCallback as i } from "react";
 import { isElementVisible as p } from "./index187.js";
 const w = ({
   skipLinks: n,
-  className: c = ""
+  className: s = ""
 }) => {
   const [r, u] = h(n), l = i(() => {
     const t = n.filter((e) => {
@@ -29,10 +29,10 @@ const w = ({
       });
     }
   }, []);
-  return n.length === 0 ? null : /* @__PURE__ */ s.createElement("div", {
-    className: `se-design-skip-links-bar relative w-full h-0 overflow-hidden p-0 flex items-center justify-center bg-[var(--color-blue-50)] transition-[height] duration-300 ease-out focus-within:h-auto focus-within:py-1 focus-within:px-2 ${c}`,
+  return n.length === 0 ? null : /* @__PURE__ */ c.createElement("div", {
+    className: `se-design-skip-links-bar relative w-full h-0 overflow-hidden p-0 flex items-center justify-center bg-[var(--color-blue-50)] transition-[height] duration-300 ease-out focus-within:h-auto focus-within:py-1 focus-within:px-2 ${s}`,
     onFocus: a
-  }, r.map((t) => /* @__PURE__ */ s.createElement("a", {
+  }, r.map((t) => /* @__PURE__ */ c.createElement("a", {
     key: t.id,
     href: `#${t.id}`,
     className: "absolute -left-[9999px] [clip:rect(0,0,0,0)] no-underline text-[var(--color-blue-500)] text-md py-1 px-2.5 rounded capitalize focus:static focus:left-auto focus:[clip:auto] focus:outline-none focus-visible:!outline-none hover:text-[var(--color-blue-600)] hover:bg-[var(--color-blue-200)]",
@@ -42,7 +42,6 @@ const w = ({
   }, t.label)));
 };
 export {
-  w as SkipLinksBar,
-  w as default
+  w as SkipLinksBar
 };
 //# sourceMappingURL=index6.js.map

package/dist/index6.js.map

@@ -1 +1 @@
-{"version":3,"file":"index6.js","sources":["../src/components/SkipLinksBar/index.tsx"],"sourcesContent":["import React, { useState, useCallback } from 'react';\nimport { isElementVisible } from '../../utils/a11y';\n\nexport interface SkipLink {\n  id: string;              \n  label: string;\n}\n\nexport interface SkipLinksBarProps {\n  skipLinks: SkipLink[];   // Required: array of skip targets\n  className?: string;        \n}\n\nexport const SkipLinksBar: React.FC<SkipLinksBarProps> = ({\n  skipLinks,\n  className = '',\n}) => {\n  const [visibleLinks, setVisibleLinks] = useState<SkipLink[]>(skipLinks);\n\n  // Check which target elements exist in DOM AND are visible\n  const checkVisibleLinks = useCallback(() => {\n    const existing = skipLinks.filter(link => {\n      const element = document.getElementById(link.id);\n      return isElementVisible(element);\n    });\n    setVisibleLinks(existing);\n  }, [skipLinks]);\n\n  // Only check on focus — by the time user tabs in, all child routes have rendered\n  const handleContainerFocus = useCallback(() => {\n    checkVisibleLinks();\n  }, [checkVisibleLinks]);\n\n  const handleSkipLinkClick = useCallback((targetId: string) => {\n    const targetElement = document.getElementById(targetId);\n    if (targetElement) {\n      // Find sticky/fixed header that should be accounted for\n      const header = document.getElementById('main-header')||document.querySelector('header');\n      \n      // If target is the header itself, just focus it (it's already at top)\n      if (targetElement === header) {\n        targetElement.focus();\n        return;\n      }\n      \n      const headerHeight = header ? header.offsetHeight : 0;\n      \n      // Scroll with offset to avoid content being hidden behind sticky headers\n      const elementPosition = targetElement.getBoundingClientRect().top + window.scrollY;\n      const offsetPosition = elementPosition - headerHeight - 16; // 16px padding for breathing room\n      \n      window.scrollTo({\n        top: offsetPosition,\n        behavior: 'smooth'\n      });\n      \n      targetElement.focus({ preventScroll: true });\n    }\n  }, []);\n\n  if (skipLinks.length === 0) {\n    return null;\n  }\n\n  return (\n    <div\n      className={`se-design-skip-links-bar relative w-full h-0 overflow-hidden p-0 flex items-center justify-center bg-[var(--color-blue-50)] transition-[height] duration-300 ease-out focus-within:h-auto focus-within:py-1 focus-within:px-2 ${className}`}\n      onFocus={handleContainerFocus}\n    >\n      {visibleLinks.map((link) => (\n        <a\n          key={link.id}\n          href={`#${link.id}`}\n          className=\"absolute -left-[9999px] [clip:rect(0,0,0,0)] no-underline text-[var(--color-blue-500)] text-md py-1 px-2.5 rounded capitalize focus:static focus:left-auto focus:[clip:auto] focus:outline-none focus-visible:!outline-none hover:text-[var(--color-blue-600)] hover:bg-[var(--color-blue-200)]\"\n          onClick={(e) => {\n            e.preventDefault();\n            handleSkipLinkClick(link.id);\n          }}\n        >\n          {link.label}\n        </a>\n      ))}\n    </div>\n  );\n};\n\nexport default SkipLinksBar;\n"],"names":["SkipLinksBar","skipLinks","className","visibleLinks","setVisibleLinks","useState","checkVisibleLinks","useCallback","existing","filter","link","element","document","getElementById","id","isElementVisible","handleContainerFocus","handleSkipLinkClick","targetId","targetElement","header","querySelector","focus","headerHeight","offsetHeight","offsetPosition","getBoundingClientRect","top","window","scrollY","scrollTo","behavior","preventScroll","length","React","createElement","onFocus","map","key","href","onClick","e","preventDefault","label"],"mappings":";;AAaO,MAAMA,IAA4CA,CAAC;AAAA,EACxDC,WAAAA;AAAAA,EACAC,WAAAA,IAAY;AACd,MAAM;AACJ,QAAM,CAACC,GAAcC,CAAe,IAAIC,EAAqBJ,CAAS,GAGhEK,IAAoBC,EAAY,MAAM;AACpCC,UAAAA,IAAWP,EAAUQ,OAAOC,CAAQA,MAAA;AACxC,YAAMC,IAAUC,SAASC,eAAeH,EAAKI,EAAE;AAC/C,aAAOC,EAAiBJ,CAAO;AAAA,IAAA,CAChC;AACDP,IAAAA,EAAgBI,CAAQ;AAAA,EAAA,GACvB,CAACP,CAAS,CAAC,GAGRe,IAAuBT,EAAY,MAAM;AAC3B,IAAAD;EAAA,GACjB,CAACA,CAAiB,CAAC,GAEhBW,IAAsBV,EAAY,CAACW,MAAqB;AACtDC,UAAAA,IAAgBP,SAASC,eAAeK,CAAQ;AACtD,QAAIC,GAAe;AAEjB,YAAMC,IAASR,SAASC,eAAe,aAAa,KAAGD,SAASS,cAAc,QAAQ;AAGtF,UAAIF,MAAkBC,GAAQ;AAC5BD,QAAAA,EAAcG,MAAM;AACpB;AAAA,MACF;AAEMC,YAAAA,IAAeH,IAASA,EAAOI,eAAe,GAI9CC,IADkBN,EAAcO,sBAAsB,EAAEC,MAAMC,OAAOC,UAClCN,IAAe;AAExDK,aAAOE,SAAS;AAAA,QACdH,KAAKF;AAAAA,QACLM,UAAU;AAAA,MAAA,CACX,GAEDZ,EAAcG,MAAM;AAAA,QAAEU,eAAe;AAAA,MAAA,CAAM;AAAA,IAC7C;AAAA,EACF,GAAG,CAAE,CAAA;AAED/B,SAAAA,EAAUgC,WAAW,IAChB,OAIPC,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEjC,WAAW,iOAAiOA,CAAS;AAAA,IACrPkC,SAASpB;AAAAA,EAAAA,GAERb,EAAakC,IAAK3B,CACjBwB,MAAAA,gBAAAA,EAAAC,cAAA,KAAA;AAAA,IACEG,KAAK5B,EAAKI;AAAAA,IACVyB,MAAM,IAAI7B,EAAKI,EAAE;AAAA,IACjBZ,WAAU;AAAA,IACVsC,SAAUC,CAAM,MAAA;AACdA,QAAEC,eAAe,GACjBzB,EAAoBP,EAAKI,EAAE;AAAA,IAC7B;AAAA,EAAA,GAECJ,EAAKiC,KACL,CACJ,CACE;AAET;"}
+{"version":3,"file":"index6.js","sources":["../src/components/SkipLinksBar/index.tsx"],"sourcesContent":["import React, { useState, useCallback } from 'react';\nimport { isElementVisible } from '../../utils/a11y';\n\nexport interface SkipLink {\n  id: string;              \n  label: string;\n}\n\nexport interface SkipLinksBarProps {\n  skipLinks: SkipLink[];   // Required: array of skip targets\n  className?: string;        \n}\n\nexport const SkipLinksBar: React.FC<SkipLinksBarProps> = ({\n  skipLinks,\n  className = '',\n}) => {\n  const [visibleLinks, setVisibleLinks] = useState<SkipLink[]>(skipLinks);\n\n  // Check which target elements exist in DOM AND are visible\n  const checkVisibleLinks = useCallback(() => {\n    const existing = skipLinks.filter(link => {\n      const element = document.getElementById(link.id);\n      return isElementVisible(element);\n    });\n    setVisibleLinks(existing);\n  }, [skipLinks]);\n\n  // Only check on focus — by the time user tabs in, all child routes have rendered\n  const handleContainerFocus = useCallback(() => {\n    checkVisibleLinks();\n  }, [checkVisibleLinks]);\n\n  const handleSkipLinkClick = useCallback((targetId: string) => {\n    const targetElement = document.getElementById(targetId);\n    if (targetElement) {\n      // Find sticky/fixed header that should be accounted for\n      const header = document.getElementById('main-header')||document.querySelector('header');\n      \n      // If target is the header itself, just focus it (it's already at top)\n      if (targetElement === header) {\n        targetElement.focus();\n        return;\n      }\n      \n      const headerHeight = header ? header.offsetHeight : 0;\n      \n      // Scroll with offset to avoid content being hidden behind sticky headers\n      const elementPosition = targetElement.getBoundingClientRect().top + window.scrollY;\n      const offsetPosition = elementPosition - headerHeight - 16; // 16px padding for breathing room\n      \n      window.scrollTo({\n        top: offsetPosition,\n        behavior: 'smooth'\n      });\n      \n      targetElement.focus({ preventScroll: true });\n    }\n  }, []);\n\n  if (skipLinks.length === 0) {\n    return null;\n  }\n\n  return (\n    <div\n      className={`se-design-skip-links-bar relative w-full h-0 overflow-hidden p-0 flex items-center justify-center bg-[var(--color-blue-50)] transition-[height] duration-300 ease-out focus-within:h-auto focus-within:py-1 focus-within:px-2 ${className}`}\n      onFocus={handleContainerFocus}\n    >\n      {visibleLinks.map((link) => (\n        <a\n          key={link.id}\n          href={`#${link.id}`}\n          className=\"absolute -left-[9999px] [clip:rect(0,0,0,0)] no-underline text-[var(--color-blue-500)] text-md py-1 px-2.5 rounded capitalize focus:static focus:left-auto focus:[clip:auto] focus:outline-none focus-visible:!outline-none hover:text-[var(--color-blue-600)] hover:bg-[var(--color-blue-200)]\"\n          onClick={(e) => {\n            e.preventDefault();\n            handleSkipLinkClick(link.id);\n          }}\n        >\n          {link.label}\n        </a>\n      ))}\n    </div>\n  );\n};\n\nexport default SkipLinksBar;\n"],"names":["SkipLinksBar","skipLinks","className","visibleLinks","setVisibleLinks","useState","checkVisibleLinks","useCallback","existing","filter","link","element","document","getElementById","id","isElementVisible","handleContainerFocus","handleSkipLinkClick","targetId","targetElement","header","querySelector","focus","headerHeight","offsetHeight","offsetPosition","getBoundingClientRect","top","window","scrollY","scrollTo","behavior","preventScroll","length","React","createElement","onFocus","map","key","href","onClick","e","preventDefault","label"],"mappings":";;AAaO,MAAMA,IAA4CA,CAAC;AAAA,EACxDC,WAAAA;AAAAA,EACAC,WAAAA,IAAY;AACd,MAAM;AACJ,QAAM,CAACC,GAAcC,CAAe,IAAIC,EAAqBJ,CAAS,GAGhEK,IAAoBC,EAAY,MAAM;AAC1C,UAAMC,IAAWP,EAAUQ,OAAOC,CAAAA,MAAQ;AACxC,YAAMC,IAAUC,SAASC,eAAeH,EAAKI,EAAE;AAC/C,aAAOC,EAAiBJ,CAAO;AAAA,IACjC,CAAC;AACDP,IAAAA,EAAgBI,CAAQ;AAAA,EAC1B,GAAG,CAACP,CAAS,CAAC,GAGRe,IAAuBT,EAAY,MAAM;AAC7CD,IAAAA,EAAAA;AAAAA,EACF,GAAG,CAACA,CAAiB,CAAC,GAEhBW,IAAsBV,EAAY,CAACW,MAAqB;AAC5D,UAAMC,IAAgBP,SAASC,eAAeK,CAAQ;AACtD,QAAIC,GAAe;AAEjB,YAAMC,IAASR,SAASC,eAAe,aAAa,KAAGD,SAASS,cAAc,QAAQ;AAGtF,UAAIF,MAAkBC,GAAQ;AAC5BD,QAAAA,EAAcG,MAAAA;AACd;AAAA,MACF;AAEA,YAAMC,IAAeH,IAASA,EAAOI,eAAe,GAI9CC,IADkBN,EAAcO,sBAAAA,EAAwBC,MAAMC,OAAOC,UAClCN,IAAe;AAExDK,aAAOE,SAAS;AAAA,QACdH,KAAKF;AAAAA,QACLM,UAAU;AAAA,MAAA,CACX,GAEDZ,EAAcG,MAAM;AAAA,QAAEU,eAAe;AAAA,MAAA,CAAM;AAAA,IAC7C;AAAA,EACF,GAAG,CAAA,CAAE;AAEL,SAAI/B,EAAUgC,WAAW,IAChB,OAIPC,gBAAAA,EAAAC,cAAA,OAAA;AAAA,IACEjC,WAAW,iOAAiOA,CAAS;AAAA,IACrPkC,SAASpB;AAAAA,EAAAA,GAERb,EAAakC,IAAK3B,CAAAA,MACjBwB,gBAAAA,EAAAC,cAAA,KAAA;AAAA,IACEG,KAAK5B,EAAKI;AAAAA,IACVyB,MAAM,IAAI7B,EAAKI,EAAE;AAAA,IACjBZ,WAAU;AAAA,IACVsC,SAAUC,CAAAA,MAAM;AACdA,QAAEC,eAAAA,GACFzB,EAAoBP,EAAKI,EAAE;AAAA,IAC7B;AAAA,EAAA,GAECJ,EAAKiC,KACL,CACJ,CACE;AAET;"}

package/dist/index60.js.map

@@ -1 +1 @@
-{"version":3,"file":"index60.js","sources":["../src/components/InfoTooltip/index.tsx"],"sourcesContent":["import React, { useState, useEffect, useCallback } from 'react';\nimport { Popover } from '../Popover';\nimport './styles.scss';\n\nexport interface InfoTooltipProps {\n  label: string;\n  children: React.ReactNode;\n  iconColor?: string;\n  /**\n   * Background color shown on hover. Defaults to var(--color-blue-200).\n   */\n  hoverBackgroundColor?: string;\n  isDisabled?: boolean;\n  /**\n   * Remove padding from tooltip wrapper (useful for precise alignment)\n   */\n  noPadding?: boolean;\n}\n\nexport const InfoTooltip = ({\n  label,\n  children,\n  iconColor = '',\n  hoverBackgroundColor,\n  isDisabled = false,\n  noPadding = false\n}: InfoTooltipProps) => {\n  const [isHovered, setIsHovered] = useState(false);\n  const [isFocused, setIsFocused] = useState(false);\n\n  // Show tooltip on hover OR focus (for keyboard accessibility)\n  const isOpen = isHovered || isFocused;\n\n  // Global Escape key handler (W3C WAI-ARIA tooltip pattern requirement)\n  const handleEscapeKey = useCallback((event: KeyboardEvent) => {\n    if (event.key === 'Escape') {\n      setIsHovered(false);\n      setIsFocused(false);\n      // Prevent other handlers (e.g., modal) from also closing - \"innermost first\" pattern\n      event.stopImmediatePropagation();\n    }\n  }, []);\n\n  useEffect(() => {\n    if (isOpen) {\n      document.addEventListener('keydown', handleEscapeKey);\n      return () => document.removeEventListener('keydown', handleEscapeKey);\n    }\n  }, [isOpen, handleEscapeKey]);\n\n  const interactionHandlers = {\n    onMouseEnter: () => setIsHovered(true),\n    onMouseLeave: () => setIsHovered(false),\n    onFocus: (event: React.FocusEvent<HTMLDivElement>) => {\n      const focusTarget = event.target as HTMLElement;\n      if (focusTarget.matches(':focus-visible')) {\n        setIsFocused(true);\n      }\n    },\n    onBlur: () => setIsFocused(false)\n  };\n\n  return (\n    <div\n      className={isDisabled ? 'se-design-info-tooltip-wrapper-disabled' : ''}\n      {...(isDisabled ? {} : interactionHandlers)}\n    >\n      <Popover\n        position={'bottom-center'}\n        isPopoverOpen={isOpen}\n        onPopoverToggle={(open) => {\n          // Sync popover state changes (e.g., Escape key) back to component state\n          if (!open) {\n            setIsHovered(false);\n            setIsFocused(false);\n          }\n        }}\n        renderPopoverSrcElement={() => (\n          <div\n            className={`se-design-info-tooltip-src ${noPadding ? 'no-padding' : ''} ${\n              isDisabled ? 'se-design-info-tooltip-disabled' : ''\n            }`}\n            style={\n              {\n                '--info-tooltip-icon-color': iconColor,\n                ...(hoverBackgroundColor ? { '--info-tooltip-hover-bg': hoverBackgroundColor } : {}),\n                cursor: isDisabled ? 'not-allowed' : 'pointer'\n              } as React.CSSProperties\n            }\n          >\n            {children}\n          </div>\n        )}\n        renderPopoverContents={() => (\n          <div className=\"se-design-info-tooltip-content\" data-automation-id=\"se-design-info-tooltip-content\">\n            {label}\n          </div>\n        )}\n        isWithPortal\n        noBorder\n        disableClickToggle\n        popoverContentStyleProperty={{\n          zIndex: 2000,\n          backgroundColor: ''\n        }}\n      />\n    </div>\n  );\n};\n"],"names":["InfoTooltip","label","children","iconColor","hoverBackgroundColor","isDisabled","noPadding","isHovered","setIsHovered","useState","isFocused","setIsFocused","isOpen","handleEscapeKey","useCallback","event","key","stopImmediatePropagation","useEffect","addEventListener","document","removeEventListener","interactionHandlers","onMouseEnter","onMouseLeave","onFocus","focusTarget","target","matches","onBlur","React","createElement","_extends","className","Popover","position","isPopoverOpen","onPopoverToggle","open","renderPopoverSrcElement","style","cursor","renderPopoverContents","isWithPortal","noBorder","disableClickToggle","popoverContentStyleProperty","zIndex","backgroundColor"],"mappings":";;;;;;;;;;;;AAmBO,MAAMA,IAAcA,CAAC;AAAA,EAC1BC,OAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,sBAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,WAAAA,IAAY;AACI,MAAM;AACtB,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAWC,CAAY,IAAIF,EAAS,EAAK,GAG1CG,IAASL,KAAaG,GAGtBG,IAAkBC,EAAY,CAACC,MAAyB;AACxDA,IAAAA,EAAMC,QAAQ,aAChBR,EAAa,EAAK,GAClBG,EAAa,EAAK,GAElBI,EAAME,yBAAyB;AAAA,EAEnC,GAAG,CAAE,CAAA;AAELC,EAAAA,EAAU,MAAM;AACd,QAAIN;AACOO,sBAAAA,iBAAiB,WAAWN,CAAe,GAC7C,MAAMO,SAASC,oBAAoB,WAAWR,CAAe;AAAA,EACtE,GACC,CAACD,GAAQC,CAAe,CAAC;AAE5B,QAAMS,IAAsB;AAAA,IAC1BC,cAAcA,MAAMf,EAAa,EAAI;AAAA,IACrCgB,cAAcA,MAAMhB,EAAa,EAAK;AAAA,IACtCiB,SAASA,CAACV,MAA4C;AAEhDW,MADgBX,EAAMY,OACVC,QAAQ,gBAAgB,KACtCjB,EAAa,EAAI;AAAA,IAErB;AAAA,IACAkB,QAAQA,MAAMlB,EAAa,EAAK;AAAA,EAAA;AAIhCmB,SAAAA,gBAAAA,EAAAC,cAAA,OAAAC,EAAA;AAAA,IACEC,WAAW5B,IAAa,4CAA4C;AAAA,EAAA,GAC/DA,IAAa,CAAA,IAAKiB,CAAmB,GAE1CQ,gBAAAA,EAAAC,cAACG,GAAO;AAAA,IACNC,UAAU;AAAA,IACVC,eAAexB;AAAAA,IACfyB,iBAAkBC,CAASA,MAAA;AAEzB,MAAKA,MACH9B,EAAa,EAAK,GAClBG,EAAa,EAAK;AAAA,IAEtB;AAAA,IACA4B,yBAAyBA,MACvBR,gBAAAA,EAAAA,cAAA,OAAA;AAAA,MACEE,WAAW,8BAA8B3B,IAAY,eAAe,EAAE,IACpED,IAAa,oCAAoC,EAAE;AAAA,MAErDmC,OACE;AAAA,QACE,6BAA6BrC;AAAAA,QAC7B,GAAIC,IAAuB;AAAA,UAAE,2BAA2BA;AAAAA,QAAAA,IAAyB,CAAC;AAAA,QAClFqC,QAAQpC,IAAa,gBAAgB;AAAA,MACvC;AAAA,OAGDH,CACE;AAAA,IAEPwC,uBAAuBA,MACrBX,gBAAAA,EAAAA,cAAA,OAAA;AAAA,MAAKE,WAAU;AAAA,MAAiC,sBAAmB;AAAA,OAChEhC,CACE;AAAA,IAEP0C,cAAY;AAAA,IACZC,UAAQ;AAAA,IACRC,oBAAkB;AAAA,IAClBC,6BAA6B;AAAA,MAC3BC,QAAQ;AAAA,MACRC,iBAAiB;AAAA,IACnB;AAAA,EACD,CAAA,CACE;AAET;"}
+{"version":3,"file":"index60.js","sources":["../src/components/InfoTooltip/index.tsx"],"sourcesContent":["import React, { useState, useEffect, useCallback } from 'react';\nimport { Popover } from '../Popover';\nimport './styles.scss';\n\nexport interface InfoTooltipProps {\n  label: string;\n  children: React.ReactNode;\n  iconColor?: string;\n  /**\n   * Background color shown on hover. Defaults to var(--color-blue-200).\n   */\n  hoverBackgroundColor?: string;\n  isDisabled?: boolean;\n  /**\n   * Remove padding from tooltip wrapper (useful for precise alignment)\n   */\n  noPadding?: boolean;\n}\n\nexport const InfoTooltip = ({\n  label,\n  children,\n  iconColor = '',\n  hoverBackgroundColor,\n  isDisabled = false,\n  noPadding = false\n}: InfoTooltipProps) => {\n  const [isHovered, setIsHovered] = useState(false);\n  const [isFocused, setIsFocused] = useState(false);\n\n  // Show tooltip on hover OR focus (for keyboard accessibility)\n  const isOpen = isHovered || isFocused;\n\n  // Global Escape key handler (W3C WAI-ARIA tooltip pattern requirement)\n  const handleEscapeKey = useCallback((event: KeyboardEvent) => {\n    if (event.key === 'Escape') {\n      setIsHovered(false);\n      setIsFocused(false);\n      // Prevent other handlers (e.g., modal) from also closing - \"innermost first\" pattern\n      event.stopImmediatePropagation();\n    }\n  }, []);\n\n  useEffect(() => {\n    if (isOpen) {\n      document.addEventListener('keydown', handleEscapeKey);\n      return () => document.removeEventListener('keydown', handleEscapeKey);\n    }\n  }, [isOpen, handleEscapeKey]);\n\n  const interactionHandlers = {\n    onMouseEnter: () => setIsHovered(true),\n    onMouseLeave: () => setIsHovered(false),\n    onFocus: (event: React.FocusEvent<HTMLDivElement>) => {\n      const focusTarget = event.target as HTMLElement;\n      if (focusTarget.matches(':focus-visible')) {\n        setIsFocused(true);\n      }\n    },\n    onBlur: () => setIsFocused(false)\n  };\n\n  return (\n    <div\n      className={isDisabled ? 'se-design-info-tooltip-wrapper-disabled' : ''}\n      {...(isDisabled ? {} : interactionHandlers)}\n    >\n      <Popover\n        position={'bottom-center'}\n        isPopoverOpen={isOpen}\n        onPopoverToggle={(open) => {\n          // Sync popover state changes (e.g., Escape key) back to component state\n          if (!open) {\n            setIsHovered(false);\n            setIsFocused(false);\n          }\n        }}\n        renderPopoverSrcElement={() => (\n          <div\n            className={`se-design-info-tooltip-src ${noPadding ? 'no-padding' : ''} ${\n              isDisabled ? 'se-design-info-tooltip-disabled' : ''\n            }`}\n            style={\n              {\n                '--info-tooltip-icon-color': iconColor,\n                ...(hoverBackgroundColor ? { '--info-tooltip-hover-bg': hoverBackgroundColor } : {}),\n                cursor: isDisabled ? 'not-allowed' : 'pointer'\n              } as React.CSSProperties\n            }\n          >\n            {children}\n          </div>\n        )}\n        renderPopoverContents={() => (\n          <div className=\"se-design-info-tooltip-content\" data-automation-id=\"se-design-info-tooltip-content\">\n            {label}\n          </div>\n        )}\n        isWithPortal\n        noBorder\n        disableClickToggle\n        popoverContentStyleProperty={{\n          zIndex: 2000,\n          backgroundColor: ''\n        }}\n      />\n    </div>\n  );\n};\n"],"names":["InfoTooltip","label","children","iconColor","hoverBackgroundColor","isDisabled","noPadding","isHovered","setIsHovered","useState","isFocused","setIsFocused","isOpen","handleEscapeKey","useCallback","event","key","stopImmediatePropagation","useEffect","document","addEventListener","removeEventListener","interactionHandlers","onMouseEnter","onMouseLeave","onFocus","target","matches","onBlur","React","createElement","_extends","className","Popover","position","isPopoverOpen","onPopoverToggle","open","renderPopoverSrcElement","style","cursor","renderPopoverContents","isWithPortal","noBorder","disableClickToggle","popoverContentStyleProperty","zIndex","backgroundColor"],"mappings":";;;;;;;;;;;;AAmBO,MAAMA,IAAcA,CAAC;AAAA,EAC1BC,OAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,WAAAA,IAAY;AAAA,EACZC,sBAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,WAAAA,IAAY;AACI,MAAM;AACtB,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAWC,CAAY,IAAIF,EAAS,EAAK,GAG1CG,IAASL,KAAaG,GAGtBG,IAAkBC,EAAY,CAACC,MAAyB;AAC5D,IAAIA,EAAMC,QAAQ,aAChBR,EAAa,EAAK,GAClBG,EAAa,EAAK,GAElBI,EAAME,yBAAAA;AAAAA,EAEV,GAAG,CAAA,CAAE;AAELC,EAAAA,EAAU,MAAM;AACd,QAAIN;AACFO,sBAASC,iBAAiB,WAAWP,CAAe,GAC7C,MAAMM,SAASE,oBAAoB,WAAWR,CAAe;AAAA,EAExE,GAAG,CAACD,GAAQC,CAAe,CAAC;AAE5B,QAAMS,IAAsB;AAAA,IAC1BC,cAAcA,MAAMf,EAAa,EAAI;AAAA,IACrCgB,cAAcA,MAAMhB,EAAa,EAAK;AAAA,IACtCiB,SAASA,CAACV,MAA4C;AAEpD,MADoBA,EAAMW,OACVC,QAAQ,gBAAgB,KACtChB,EAAa,EAAI;AAAA,IAErB;AAAA,IACAiB,QAAQA,MAAMjB,EAAa,EAAK;AAAA,EAAA;AAGlC,SACEkB,gBAAAA,EAAAC,cAAA,OAAAC,EAAA;AAAA,IACEC,WAAW3B,IAAa,4CAA4C;AAAA,EAAA,GAC/DA,IAAa,CAAA,IAAKiB,CAAmB,GAE1CO,gBAAAA,EAAAC,cAACG,GAAO;AAAA,IACNC,UAAU;AAAA,IACVC,eAAevB;AAAAA,IACfwB,iBAAkBC,CAAAA,MAAS;AAEzB,MAAKA,MACH7B,EAAa,EAAK,GAClBG,EAAa,EAAK;AAAA,IAEtB;AAAA,IACA2B,yBAAyBA,MACvBT,gBAAAA,EAAAC,cAAA,OAAA;AAAA,MACEE,WAAW,8BAA8B1B,IAAY,eAAe,EAAE,IACpED,IAAa,oCAAoC,EAAE;AAAA,MAErDkC,OACE;AAAA,QACE,6BAA6BpC;AAAAA,QAC7B,GAAIC,IAAuB;AAAA,UAAE,2BAA2BA;AAAAA,QAAAA,IAAyB,CAAA;AAAA,QACjFoC,QAAQnC,IAAa,gBAAgB;AAAA,MAAA;AAAA,IACvC,GAGDH,CACE;AAAA,IAEPuC,uBAAuBA,MACrBZ,gBAAAA,EAAAC,cAAA,OAAA;AAAA,MAAKE,WAAU;AAAA,MAAiC,sBAAmB;AAAA,IAAA,GAChE/B,CACE;AAAA,IAEPyC,cAAY;AAAA,IACZC,UAAQ;AAAA,IACRC,oBAAkB;AAAA,IAClBC,6BAA6B;AAAA,MAC3BC,QAAQ;AAAA,MACRC,iBAAiB;AAAA,IAAA;AAAA,EACnB,CACD,CACE;AAET;"}

package/dist/index61.js.map

@@ -1 +1 @@
-{"version":3,"file":"index61.js","sources":["../src/components/OnboardingTour/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState, useCallback } from 'react';\n\nimport { Button } from 'components/Button';\nimport { Tooltip } from 'components/Tooltip';\n\nimport './style.scss';\n\nconst TOUR_NAVIGATION_STEPS = {\n  gotIt: 'got_it',\n  finish: 'finish',\n  next: 'next',\n  back: 'back'\n};\n\nexport interface TourStep {\n  targetElementSelector: string;\n  targetElementContainerSelector?: string;\n  targetElementGap?: {\n    horizontal: number;\n    vertical: number;\n  };\n  tooltipPosition?:\n    | 'top-left'\n    | 'top-center'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-center'\n    | 'bottom-right'\n    | 'left-top'\n    | 'left-center'\n    | 'left-bottom'\n    | 'right-top'\n    | 'right-center'\n    | 'right-bottom';\n  content: {\n    title?: string;\n    description?: string;\n    illustration?: any;\n  };\n  tourMixPanelHandler?: (data: { user_path: string; action_type: string }) => void;\n}\n\nexport interface OnboardingTourProps {\n  steps: TourStep[];\n  screenBaseElementSelector: string;\n  handleCloseProductTour: (e?: React.MouseEvent<HTMLButtonElement>) => void;\n  tourType?: string;\n  highlightBorderRadius?: number;\n  automationId?: string;\n  labels?: {\n    next: string;\n    gotIt: string;\n    finish: string;\n    skip: string;\n    stepInfo: string;\n  };\n}\n\nexport const OnboardingTour: FC<OnboardingTourProps> = ({\n  steps = [],\n  screenBaseElementSelector = '',\n  handleCloseProductTour,\n  tourType = '',\n  automationId = 'onboarding-tour',\n  highlightBorderRadius = 6,\n  labels\n}) => {\n  const [currentStep, setCurrentStep] = useState(0);\n  const overlayRef = useRef<HTMLDivElement>(null);\n  const blockerRef = useRef<HTMLDivElement>(null);\n\n  const {\n    next = 'Next',\n    gotIt = 'Got It',\n    finish = 'Finish',\n    skip = 'Skip tour',\n    stepInfo = 'Step {step} of {total}'\n  } = labels || {};\n\n  const parentScreenElement = document.querySelector(screenBaseElementSelector) as HTMLElement | null;\n\n  const clipTargetElementAndPositionTooltip = useCallback(() => {\n    let timerId: any;\n\n    if (currentStep >= steps.length) {\n      return timerId;\n    }\n\n    // get the target element\n    const initialTargetElement = document.querySelector(\n      steps[currentStep]?.targetElementContainerSelector\n        ? steps[currentStep].targetElementContainerSelector\n        : steps[currentStep]?.targetElementSelector\n    ) as HTMLElement | null;\n\n    if (!initialTargetElement) {\n      return timerId;\n    }\n\n    const initialTargetArea = initialTargetElement.getBoundingClientRect();\n\n    // check whether target element is fully visible in viewport\n    const isFullyVisible =\n      initialTargetArea.top >= 0 &&\n      initialTargetArea.left >= 0 &&\n      initialTargetArea.bottom <= window.innerHeight &&\n      initialTargetArea.right <= window.innerWidth;\n\n    if (!isFullyVisible) {\n      if (initialTargetArea.top < 0) {\n        initialTargetElement.scrollIntoView({ behavior: 'auto', block: 'start' });\n      } else if (initialTargetArea.bottom > window.innerHeight) {\n        initialTargetElement.scrollIntoView({ behavior: 'auto', block: 'end' });\n      }\n    }\n\n    // if the target element is visible, then clip the target element and position the tooltip\n    timerId = setTimeout(() => {\n      const targetElement = document.querySelector(steps[currentStep]?.targetElementSelector) as HTMLElement | null;\n\n      if (!targetElement || !overlayRef.current || !blockerRef.current) {\n        return;\n      }\n\n      const targetArea = targetElement.getBoundingClientRect();\n\n      const documentHeight = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight);\n\n      // Update overlay dimensions and calculate target element area to focus\n      overlayRef.current.style.height = `${documentHeight}px`;\n\n      // Providing gap around target element\n      const targetElementGap = steps[currentStep]?.targetElementGap || { horizontal: 0, vertical: 0 };\n\n      // clip the target element with rounded corners\n      const borderRadius = highlightBorderRadius * 2;\n      const left = targetArea.left - targetElementGap.horizontal;\n      const top = targetArea.top + window.scrollY - targetElementGap.vertical;\n      const right = targetArea.right + targetElementGap.horizontal;\n      const bottom = targetArea.bottom + window.scrollY + targetElementGap.vertical;\n      const width = right - left;\n      const height = bottom - top;\n      const documentWidth = Math.max(document.documentElement.scrollWidth, document.body.scrollWidth);\n\n      // Create SVG mask with rounded rectangle hole\n      const svgMask = encodeURIComponent(`\n      <svg width=\"${documentWidth}\" height=\"${documentHeight}\" xmlns=\"http://www.w3.org/2000/svg\">\n        <defs>\n          <mask id=\"highlight-mask-${currentStep}\">\n            <rect x=\"0\" y=\"0\" width=\"${documentWidth}\" height=\"${documentHeight}\" fill=\"white\"/>\n            <rect x=\"${left}\" y=\"${top}\" width=\"${width}\" height=\"${height}\" rx=\"${borderRadius}\" ry=\"${borderRadius}\" fill=\"black\"/>\n          </mask>\n        </defs>\n      </svg>\n    `);\n\n      // Apply created mask to the overlay\n      overlayRef.current.style.maskImage = `url(\"data:image/svg+xml,${svgMask}#highlight-mask-${currentStep}\")`;\n      overlayRef.current.style.webkitMaskImage = `url(\"data:image/svg+xml,${svgMask}#highlight-mask-${currentStep}\")`;\n\n      // Position blocker over clipped area to avoid clicks on the target element\n      blockerRef.current.style.top = `${targetArea.top}px`;\n      blockerRef.current.style.left = `${targetArea.left}px`;\n      blockerRef.current.style.width = `${targetArea.width}px`;\n      blockerRef.current.style.height = `${targetArea.height}px`;\n      blockerRef.current.style.borderRadius = `${highlightBorderRadius}px`;\n    }, 50);\n\n    return timerId;\n  }, [currentStep, steps]);\n\n  const handleSkipTour = useCallback(() => {\n    handleCloseProductTour();\n    if (parentScreenElement) {\n      parentScreenElement.scrollTo({ top: 0, behavior: 'smooth' });\n    }\n  }, [handleCloseProductTour, parentScreenElement]);\n\n  const handleNextClick = useCallback(\n    (e?: React.MouseEvent<HTMLButtonElement>) => {\n      e?.preventDefault();\n      e?.stopPropagation();\n\n      if (currentStep < steps.length - 1) {\n        setCurrentStep((prev) => prev + 1);\n      } else {\n        handleCloseProductTour(e);\n        if (parentScreenElement) {\n          parentScreenElement.scrollTo({ top: 0, behavior: 'smooth' });\n        }\n      }\n      steps[currentStep]?.tourMixPanelHandler?.({\n        user_path: tourType,\n        action_type: `clicked_${\n          currentStep === steps.length - 1\n            ? steps.length === 1\n              ? TOUR_NAVIGATION_STEPS.gotIt\n              : TOUR_NAVIGATION_STEPS.finish\n            : TOUR_NAVIGATION_STEPS.next\n        }`\n      });\n    },\n    [currentStep, steps, handleCloseProductTour, tourType, parentScreenElement]\n  );\n\n  const handlePrevClick = useCallback(() => {\n    if (currentStep > 0) {\n      setCurrentStep((prev) => prev - 1);\n    }\n    steps[currentStep]?.tourMixPanelHandler?.({\n      user_path: tourType,\n      action_type: `clicked_${TOUR_NAVIGATION_STEPS.back}`\n    });\n  }, [currentStep, steps, tourType]);\n\n  const handleKeyPress = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.keyCode === 37 || e.key === 'ArrowLeft') {\n        // for previous navigation\n        if (currentStep > 0) {\n          handlePrevClick();\n        }\n      }\n      if (e.keyCode === 39 || e.key === 'ArrowRight') {\n        // for next navigation\n        handleNextClick();\n      }\n    },\n    [currentStep, handleNextClick, handlePrevClick]\n  );\n\n  useEffect(() => {\n    // Adding event listener for keydown\n    window.addEventListener('keydown', handleKeyPress);\n\n    return () => {\n      window.removeEventListener('keydown', handleKeyPress);\n    };\n  }, [handleKeyPress]);\n\n  useEffect(() => {\n    let timerId: any;\n    if (currentStep < steps.length) {\n      timerId = clipTargetElementAndPositionTooltip();\n    }\n\n    return () => {\n      if (timerId) {\n        clearTimeout(timerId);\n      }\n    };\n  }, [currentStep, steps, clipTargetElementAndPositionTooltip]);\n\n  // To prevent scroll when tour is active\n  useEffect(() => {\n    if (currentStep < steps.length && overlayRef.current) {\n      const overlay = overlayRef.current;\n\n      const preventScroll = (e: Event) => {\n        e.preventDefault();\n        e.stopPropagation();\n      };\n\n      overlay.addEventListener('wheel', preventScroll, { passive: false });\n      overlay.addEventListener('touchmove', preventScroll, { passive: false });\n      overlay.addEventListener('scroll', preventScroll, { passive: false });\n\n      return () => {\n        overlay.removeEventListener('wheel', preventScroll);\n        overlay.removeEventListener('touchmove', preventScroll);\n        overlay.removeEventListener('scroll', preventScroll);\n      };\n    }\n  }, [currentStep]);\n\n  if (!steps || steps.length === 0) {\n    return null;\n  }\n\n  return (\n    <>\n      <div\n        className=\"se-design-onboarding-tour-overlay\"\n        ref={overlayRef}\n        data-automation-id={`${automationId}-overlay`}\n      />\n\n      <Tooltip\n        content={\n          <div className=\"se-design-onboarding-tour-tooltip-content\">\n            {steps[currentStep]?.content?.illustration && (\n              <img\n                src={steps[currentStep].content.illustration}\n                className=\"se-design-onboarding-tour-illustration\"\n                alt=\"illustration\"\n              />\n            )}\n            <div className=\"se-design-onboarding-tour-content\">\n              {steps[currentStep]?.content?.title && (\n                <p className=\"se-design-onboarding-tour-title\">{steps[currentStep].content.title}</p>\n              )}\n              {steps[currentStep]?.content?.description && (\n                <p className=\"se-design-onboarding-tour-description\">{steps[currentStep].content.description}</p>\n              )}\n            </div>\n\n            <div className=\"se-design-onboarding-tour-actions\">\n              {steps.length > 1 && (\n                <span className=\"steps\">\n                  {stepInfo.replace('{step}', `${currentStep + 1}`).replace('{total}', `${steps.length}`)}\n                </span>\n              )}\n              <div className=\"btns-container\">\n                {currentStep !== steps.length - 1 && (\n                  <Button\n                    theme=\"white\"\n                    type=\"link\"\n                    label={skip}\n                    automationId={`${automationId}-skip-button`}\n                    onClick={handleSkipTour}\n                  />\n                )}\n                <Button\n                  theme=\"white\"\n                  type=\"primary\"\n                  size=\"sm\"\n                  label={currentStep === steps.length - 1 ? (steps.length === 1 ? gotIt : finish) : next}\n                  automationId={`${automationId}-next-button`}\n                  onClick={handleNextClick}\n                />\n              </div>\n            </div>\n          </div>\n        }\n        tooltipSrc={<div className=\"blocker\" ref={blockerRef} />}\n        tooltipSrcRef={blockerRef as React.RefObject<HTMLDivElement>}\n        position={steps[currentStep]?.tooltipPosition || 'bottom-center'}\n        tooltipOffset={16}\n        displayOn=\"always-on\"\n        isWithPortal={true}\n        maxWidth={384}\n      />\n    </>\n  );\n};\n"],"names":["React__default","useState","useRef","useCallback","useEffect","Button","Tooltip","TOUR_NAVIGATION_STEPS","gotIt","finish","next","back","OnboardingTour","steps","screenBaseElementSelector","handleCloseProductTour","tourType","automationId","highlightBorderRadius","labels","currentStep","setCurrentStep","overlayRef","blockerRef","skip","stepInfo","parentScreenElement","document","querySelector","clipTargetElementAndPositionTooltip","timerId","length","initialTargetElement","targetElementContainerSelector","targetElementSelector","initialTargetArea","getBoundingClientRect","top","left","bottom","window","innerHeight","right","innerWidth","scrollIntoView","behavior","block","setTimeout","targetElement","current","targetArea","documentHeight","Math","max","documentElement","scrollHeight","body","style","height","targetElementGap","horizontal","vertical","borderRadius","scrollY","width","documentWidth","scrollWidth","svgMask","encodeURIComponent","maskImage","webkitMaskImage","handleSkipTour","scrollTo","handleNextClick","e","preventDefault","stopPropagation","prev","tourMixPanelHandler","user_path","action_type","handlePrevClick","handleKeyPress","keyCode","key","addEventListener","removeEventListener","clearTimeout","overlay","preventScroll","passive","createElement","React","Fragment","className","ref","content","illustration","src","alt","title","description","replace","theme","type","label","onClick","size","tooltipSrc","tooltipSrcRef","position","tooltipPosition","tooltipOffset","displayOn","isWithPortal","maxWidth"],"mappings":"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"}
+{"version":3,"file":"index61.js","sources":["../src/components/OnboardingTour/index.tsx"],"sourcesContent":["import React, { FC, useEffect, useRef, useState, useCallback } from 'react';\n\nimport { Button } from 'components/Button';\nimport { Tooltip } from 'components/Tooltip';\n\nimport './style.scss';\n\nconst TOUR_NAVIGATION_STEPS = {\n  gotIt: 'got_it',\n  finish: 'finish',\n  next: 'next',\n  back: 'back'\n};\n\nexport interface TourStep {\n  targetElementSelector: string;\n  targetElementContainerSelector?: string;\n  targetElementGap?: {\n    horizontal: number;\n    vertical: number;\n  };\n  tooltipPosition?:\n    | 'top-left'\n    | 'top-center'\n    | 'top-right'\n    | 'bottom-left'\n    | 'bottom-center'\n    | 'bottom-right'\n    | 'left-top'\n    | 'left-center'\n    | 'left-bottom'\n    | 'right-top'\n    | 'right-center'\n    | 'right-bottom';\n  content: {\n    title?: string;\n    description?: string;\n    illustration?: any;\n  };\n  tourMixPanelHandler?: (data: { user_path: string; action_type: string }) => void;\n}\n\nexport interface OnboardingTourProps {\n  steps: TourStep[];\n  screenBaseElementSelector: string;\n  handleCloseProductTour: (e?: React.MouseEvent<HTMLButtonElement>) => void;\n  tourType?: string;\n  highlightBorderRadius?: number;\n  automationId?: string;\n  labels?: {\n    next: string;\n    gotIt: string;\n    finish: string;\n    skip: string;\n    stepInfo: string;\n  };\n}\n\nexport const OnboardingTour: FC<OnboardingTourProps> = ({\n  steps = [],\n  screenBaseElementSelector = '',\n  handleCloseProductTour,\n  tourType = '',\n  automationId = 'onboarding-tour',\n  highlightBorderRadius = 6,\n  labels\n}) => {\n  const [currentStep, setCurrentStep] = useState(0);\n  const overlayRef = useRef<HTMLDivElement>(null);\n  const blockerRef = useRef<HTMLDivElement>(null);\n\n  const {\n    next = 'Next',\n    gotIt = 'Got It',\n    finish = 'Finish',\n    skip = 'Skip tour',\n    stepInfo = 'Step {step} of {total}'\n  } = labels || {};\n\n  const parentScreenElement = document.querySelector(screenBaseElementSelector) as HTMLElement | null;\n\n  const clipTargetElementAndPositionTooltip = useCallback(() => {\n    let timerId: any;\n\n    if (currentStep >= steps.length) {\n      return timerId;\n    }\n\n    // get the target element\n    const initialTargetElement = document.querySelector(\n      steps[currentStep]?.targetElementContainerSelector\n        ? steps[currentStep].targetElementContainerSelector\n        : steps[currentStep]?.targetElementSelector\n    ) as HTMLElement | null;\n\n    if (!initialTargetElement) {\n      return timerId;\n    }\n\n    const initialTargetArea = initialTargetElement.getBoundingClientRect();\n\n    // check whether target element is fully visible in viewport\n    const isFullyVisible =\n      initialTargetArea.top >= 0 &&\n      initialTargetArea.left >= 0 &&\n      initialTargetArea.bottom <= window.innerHeight &&\n      initialTargetArea.right <= window.innerWidth;\n\n    if (!isFullyVisible) {\n      if (initialTargetArea.top < 0) {\n        initialTargetElement.scrollIntoView({ behavior: 'auto', block: 'start' });\n      } else if (initialTargetArea.bottom > window.innerHeight) {\n        initialTargetElement.scrollIntoView({ behavior: 'auto', block: 'end' });\n      }\n    }\n\n    // if the target element is visible, then clip the target element and position the tooltip\n    timerId = setTimeout(() => {\n      const targetElement = document.querySelector(steps[currentStep]?.targetElementSelector) as HTMLElement | null;\n\n      if (!targetElement || !overlayRef.current || !blockerRef.current) {\n        return;\n      }\n\n      const targetArea = targetElement.getBoundingClientRect();\n\n      const documentHeight = Math.max(document.documentElement.scrollHeight, document.body.scrollHeight);\n\n      // Update overlay dimensions and calculate target element area to focus\n      overlayRef.current.style.height = `${documentHeight}px`;\n\n      // Providing gap around target element\n      const targetElementGap = steps[currentStep]?.targetElementGap || { horizontal: 0, vertical: 0 };\n\n      // clip the target element with rounded corners\n      const borderRadius = highlightBorderRadius * 2;\n      const left = targetArea.left - targetElementGap.horizontal;\n      const top = targetArea.top + window.scrollY - targetElementGap.vertical;\n      const right = targetArea.right + targetElementGap.horizontal;\n      const bottom = targetArea.bottom + window.scrollY + targetElementGap.vertical;\n      const width = right - left;\n      const height = bottom - top;\n      const documentWidth = Math.max(document.documentElement.scrollWidth, document.body.scrollWidth);\n\n      // Create SVG mask with rounded rectangle hole\n      const svgMask = encodeURIComponent(`\n      <svg width=\"${documentWidth}\" height=\"${documentHeight}\" xmlns=\"http://www.w3.org/2000/svg\">\n        <defs>\n          <mask id=\"highlight-mask-${currentStep}\">\n            <rect x=\"0\" y=\"0\" width=\"${documentWidth}\" height=\"${documentHeight}\" fill=\"white\"/>\n            <rect x=\"${left}\" y=\"${top}\" width=\"${width}\" height=\"${height}\" rx=\"${borderRadius}\" ry=\"${borderRadius}\" fill=\"black\"/>\n          </mask>\n        </defs>\n      </svg>\n    `);\n\n      // Apply created mask to the overlay\n      overlayRef.current.style.maskImage = `url(\"data:image/svg+xml,${svgMask}#highlight-mask-${currentStep}\")`;\n      overlayRef.current.style.webkitMaskImage = `url(\"data:image/svg+xml,${svgMask}#highlight-mask-${currentStep}\")`;\n\n      // Position blocker over clipped area to avoid clicks on the target element\n      blockerRef.current.style.top = `${targetArea.top}px`;\n      blockerRef.current.style.left = `${targetArea.left}px`;\n      blockerRef.current.style.width = `${targetArea.width}px`;\n      blockerRef.current.style.height = `${targetArea.height}px`;\n      blockerRef.current.style.borderRadius = `${highlightBorderRadius}px`;\n    }, 50);\n\n    return timerId;\n  }, [currentStep, steps]);\n\n  const handleSkipTour = useCallback(() => {\n    handleCloseProductTour();\n    if (parentScreenElement) {\n      parentScreenElement.scrollTo({ top: 0, behavior: 'smooth' });\n    }\n  }, [handleCloseProductTour, parentScreenElement]);\n\n  const handleNextClick = useCallback(\n    (e?: React.MouseEvent<HTMLButtonElement>) => {\n      e?.preventDefault();\n      e?.stopPropagation();\n\n      if (currentStep < steps.length - 1) {\n        setCurrentStep((prev) => prev + 1);\n      } else {\n        handleCloseProductTour(e);\n        if (parentScreenElement) {\n          parentScreenElement.scrollTo({ top: 0, behavior: 'smooth' });\n        }\n      }\n      steps[currentStep]?.tourMixPanelHandler?.({\n        user_path: tourType,\n        action_type: `clicked_${\n          currentStep === steps.length - 1\n            ? steps.length === 1\n              ? TOUR_NAVIGATION_STEPS.gotIt\n              : TOUR_NAVIGATION_STEPS.finish\n            : TOUR_NAVIGATION_STEPS.next\n        }`\n      });\n    },\n    [currentStep, steps, handleCloseProductTour, tourType, parentScreenElement]\n  );\n\n  const handlePrevClick = useCallback(() => {\n    if (currentStep > 0) {\n      setCurrentStep((prev) => prev - 1);\n    }\n    steps[currentStep]?.tourMixPanelHandler?.({\n      user_path: tourType,\n      action_type: `clicked_${TOUR_NAVIGATION_STEPS.back}`\n    });\n  }, [currentStep, steps, tourType]);\n\n  const handleKeyPress = useCallback(\n    (e: KeyboardEvent) => {\n      if (e.keyCode === 37 || e.key === 'ArrowLeft') {\n        // for previous navigation\n        if (currentStep > 0) {\n          handlePrevClick();\n        }\n      }\n      if (e.keyCode === 39 || e.key === 'ArrowRight') {\n        // for next navigation\n        handleNextClick();\n      }\n    },\n    [currentStep, handleNextClick, handlePrevClick]\n  );\n\n  useEffect(() => {\n    // Adding event listener for keydown\n    window.addEventListener('keydown', handleKeyPress);\n\n    return () => {\n      window.removeEventListener('keydown', handleKeyPress);\n    };\n  }, [handleKeyPress]);\n\n  useEffect(() => {\n    let timerId: any;\n    if (currentStep < steps.length) {\n      timerId = clipTargetElementAndPositionTooltip();\n    }\n\n    return () => {\n      if (timerId) {\n        clearTimeout(timerId);\n      }\n    };\n  }, [currentStep, steps, clipTargetElementAndPositionTooltip]);\n\n  // To prevent scroll when tour is active\n  useEffect(() => {\n    if (currentStep < steps.length && overlayRef.current) {\n      const overlay = overlayRef.current;\n\n      const preventScroll = (e: Event) => {\n        e.preventDefault();\n        e.stopPropagation();\n      };\n\n      overlay.addEventListener('wheel', preventScroll, { passive: false });\n      overlay.addEventListener('touchmove', preventScroll, { passive: false });\n      overlay.addEventListener('scroll', preventScroll, { passive: false });\n\n      return () => {\n        overlay.removeEventListener('wheel', preventScroll);\n        overlay.removeEventListener('touchmove', preventScroll);\n        overlay.removeEventListener('scroll', preventScroll);\n      };\n    }\n  }, [currentStep]);\n\n  if (!steps || steps.length === 0) {\n    return null;\n  }\n\n  return (\n    <>\n      <div\n        className=\"se-design-onboarding-tour-overlay\"\n        ref={overlayRef}\n        data-automation-id={`${automationId}-overlay`}\n      />\n\n      <Tooltip\n        content={\n          <div className=\"se-design-onboarding-tour-tooltip-content\">\n            {steps[currentStep]?.content?.illustration && (\n              <img\n                src={steps[currentStep].content.illustration}\n                className=\"se-design-onboarding-tour-illustration\"\n                alt=\"illustration\"\n              />\n            )}\n            <div className=\"se-design-onboarding-tour-content\">\n              {steps[currentStep]?.content?.title && (\n                <p className=\"se-design-onboarding-tour-title\">{steps[currentStep].content.title}</p>\n              )}\n              {steps[currentStep]?.content?.description && (\n                <p className=\"se-design-onboarding-tour-description\">{steps[currentStep].content.description}</p>\n              )}\n            </div>\n\n            <div className=\"se-design-onboarding-tour-actions\">\n              {steps.length > 1 && (\n                <span className=\"steps\">\n                  {stepInfo.replace('{step}', `${currentStep + 1}`).replace('{total}', `${steps.length}`)}\n                </span>\n              )}\n              <div className=\"btns-container\">\n                {currentStep !== steps.length - 1 && (\n                  <Button\n                    theme=\"white\"\n                    type=\"link\"\n                    label={skip}\n                    automationId={`${automationId}-skip-button`}\n                    onClick={handleSkipTour}\n                  />\n                )}\n                <Button\n                  theme=\"white\"\n                  type=\"primary\"\n                  size=\"sm\"\n                  label={currentStep === steps.length - 1 ? (steps.length === 1 ? gotIt : finish) : next}\n                  automationId={`${automationId}-next-button`}\n                  onClick={handleNextClick}\n                />\n              </div>\n            </div>\n          </div>\n        }\n        tooltipSrc={<div className=\"blocker\" ref={blockerRef} />}\n        tooltipSrcRef={blockerRef as React.RefObject<HTMLDivElement>}\n        position={steps[currentStep]?.tooltipPosition || 'bottom-center'}\n        tooltipOffset={16}\n        displayOn=\"always-on\"\n        isWithPortal={true}\n        maxWidth={384}\n      />\n    </>\n  );\n};\n"],"names":["React__default","useState","useRef","useCallback","useEffect","Button","Tooltip","TOUR_NAVIGATION_STEPS","gotIt","finish","next","back","OnboardingTour","steps","screenBaseElementSelector","handleCloseProductTour","tourType","automationId","highlightBorderRadius","labels","currentStep","setCurrentStep","overlayRef","blockerRef","skip","stepInfo","parentScreenElement","document","querySelector","clipTargetElementAndPositionTooltip","timerId","length","initialTargetElement","targetElementContainerSelector","targetElementSelector","initialTargetArea","getBoundingClientRect","top","left","bottom","window","innerHeight","right","innerWidth","scrollIntoView","behavior","block","setTimeout","targetElement","current","targetArea","documentHeight","Math","max","documentElement","scrollHeight","body","style","height","targetElementGap","horizontal","vertical","borderRadius","scrollY","width","documentWidth","scrollWidth","svgMask","encodeURIComponent","maskImage","webkitMaskImage","handleSkipTour","scrollTo","handleNextClick","e","preventDefault","stopPropagation","prev","tourMixPanelHandler","user_path","action_type","handlePrevClick","handleKeyPress","keyCode","key","addEventListener","removeEventListener","clearTimeout","overlay","preventScroll","passive","createElement","React","Fragment","className","ref","content","illustration","src","alt","title","description","replace","theme","type","label","onClick","size","tooltipSrc","tooltipSrcRef","position","tooltipPosition","tooltipOffset","displayOn","isWithPortal","maxWidth"],"mappings":"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"}