@zendir/ui 0.2.20 → 0.3.0

package/dist/react/core/Container.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Container.js","sources":["../../../src/react/core/Container.tsx"],"sourcesContent":["/**\n * @zendir/ui - Container/Card Component\n * \n * Container/Card wrapper following Astro UX Design System.\n * Automatically switches to glassmorphic styling when transparent themes are active.\n * \n * Transparent themes (transparent, transparent-bold):\n * - Glassmorphic panels with blur effect\n * - Colored top border accent\n * - Hover glow effect (like GlassCard)\n * - transparent-bold has 2px top border\n * \n * @example\n * ```tsx\n * <Container>Simple container</Container>\n * <Container title=\"Spacecraft Status\" status=\"normal\">Content</Container>\n * <Container title=\"Power System\" icon=\"solar\" iconStatus=\"normal\">With status</Container>\n * <Container title=\"Custom Color\" icon=\"thermal\" iconColor=\"#FF6B6B\">Custom color</Container>\n * ```\n */\n\nimport React, { memo, useCallback } from 'react';\nimport { useTheme } from '../theme';\nimport { classNames, addAlpha, type StatusLevel } from '../utils';\nimport { AstroIcon, type AstroIconName } from './AstroIcon';\nimport { HeaderIconWithStatus } from './HeaderIconWithStatus';\nimport { CardHeader } from './CardHeader';\nimport { useBreakpoint } from './layout/useBreakpoint';\n\nexport type ContainerVariant = 'default' | 'elevated' | 'outlined' | 'ghost' | 'glass' | 'glass-dark' | 'glass-light';\nexport type ContainerPadding = 'none' | 'sm' | 'md' | 'lg';\n\n/** Status colors matching Astro UXD status system */\nconst STATUS_COLORS: Record<StatusLevel, string> = {\n  off: '#a4abb6',\n  standby: '#2dccff',\n  normal: '#56f000',\n  caution: '#fce83a',\n  serious: '#ffb302',\n  critical: '#ff3838',\n};\n\n/** Status descriptions for tooltips (default synonyms from AstroUXDS) */\nconst STATUS_DESCRIPTIONS: Record<StatusLevel, string> = {\n  off: 'Off, unavailable, disabled',\n  standby: 'Standby, available, enabled',\n  normal: 'Normal, ok, satisfactory',\n  caution: 'Caution, warning, unstable',\n  serious: 'Serious, error, needs attention',\n  critical: 'Critical, emergency, urgent',\n};\n\n/** Status symbol shapes following AstroUXDS guidelines */\ntype _StatusShape = 'circle' | 'square' | 'diamond' | 'triangle' | 'circle-hollow';\n\nexport interface ContainerProps {\n  /** Visual variant */\n  variant?: ContainerVariant;\n  /** Padding size */\n  padding?: ContainerPadding;\n  /** Container title */\n  title?: React.ReactNode;\n  /** Subtitle or description */\n  subtitle?: React.ReactNode;\n  /** Status indicator (affects left border in non-glass mode) */\n  status?: StatusLevel;\n  /** Header actions (buttons, etc.) */\n  actions?: React.ReactNode;\n  /** Full height */\n  fullHeight?: boolean;\n  /**\n   * Clip overflowing content area when fullHeight is enabled.\n   * Keep false for form cards so wrapped rows can expand naturally.\n   */\n  clipContent?: boolean;\n  /** Loading state */\n  loading?: boolean;\n  /** Children */\n  children: React.ReactNode;\n  /** Custom className */\n  className?: string;\n  /** Custom style */\n  style?: React.CSSProperties;\n  /** Click handler */\n  onClick?: () => void;\n  /** Disable auto-glass effect in transparent theme */\n  disableAutoGlass?: boolean;\n  /** Icon to display in header (Astro icon name) */\n  icon?: AstroIconName;\n  /** Icon status - shows status symbol and colors icon accordingly */\n  iconStatus?: StatusLevel;\n  /** Custom status message shown in tooltip (overrides default description) */\n  statusMessage?: string;\n  /** Custom icon color (overrides iconStatus and theme color) */\n  iconColor?: string;\n  /** Custom accent color for glass mode (title, line, etc.) */\n  accentColor?: string;\n}\n\n/**\n * Icon wrapper with status tooltip - triggers tooltip on hover over entire icon area\n */\nfunction IconWithStatusTooltip({\n  icon,\n  iconColor,\n  iconStatus,\n  statusMessage,\n  iconSize = 20,\n}: {\n  icon: string;\n  iconColor: string;\n  iconStatus?: StatusLevel;\n  statusMessage?: string;\n  iconSize?: number;\n}): React.ReactElement {\n  const [isHovered, setIsHovered] = React.useState(false);\n  const color = iconStatus ? STATUS_COLORS[iconStatus] : iconColor;\n  const defaultMessage = iconStatus ? STATUS_DESCRIPTIONS[iconStatus] : '';\n  const tooltipText = statusMessage || defaultMessage;\n  const statusLabel = iconStatus ? iconStatus.charAt(0).toUpperCase() + iconStatus.slice(1) : '';\n  \n  return (\n    <div\n      style={{\n        position: 'relative',\n        display: 'inline-flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        flexShrink: 0,\n        cursor: iconStatus ? 'help' : 'default',\n      }}\n      onMouseEnter={() => iconStatus && setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n    >\n      {/* Use HeaderIconWithStatus for consistent sizing with SpacecraftCard */}\n      {iconStatus ? (\n        <HeaderIconWithStatus\n          icon={icon as AstroIconName}\n          status={iconStatus}\n          size={iconSize}\n          statusColor={iconColor}\n        />\n      ) : (\n        <AstroIcon \n          name={icon} \n          size={iconSize}\n          color={iconColor}\n        />\n      )}\n      {/* Tooltip popup - triggers on whole icon area hover */}\n      {iconStatus && isHovered && (\n        <div\n          style={{\n            position: 'absolute',\n            bottom: 'calc(100% + 12px)',\n            left: '50%',\n            transform: 'translateX(-50%)',\n            padding: '8px 12px',\n            backgroundColor: 'rgba(10, 15, 25, 0.95)',\n            border: `1px solid ${color}`,\n            borderRadius: '4px',\n            boxShadow: `0 0 12px ${color}40, 0 4px 12px rgba(0,0,0,0.4)`,\n            zIndex: 1000,\n            whiteSpace: 'nowrap',\n            pointerEvents: 'none',\n            minWidth: '150px',\n          }}\n        >\n          {/* Status label */}\n          <div style={{ \n            fontSize: '0.6875rem', // 11px in rem \n            fontWeight: 500, // AstroUXDS medium for labels\n            color: color,\n            marginBottom: '4px',\n            textTransform: 'uppercase',\n            letterSpacing: '0.5px',\n          }}>\n            {statusLabel}\n          </div>\n          {/* Status message */}\n          <div style={{ \n            fontSize: '0.75rem', // 12px in rem\n            color: 'rgba(255,255,255,0.9)',\n            lineHeight: 1.4,\n          }}>\n            {tooltipText}\n          </div>\n          {/* Arrow */}\n          <div style={{\n            position: 'absolute',\n            bottom: '-6px',\n            left: '50%',\n            transform: 'translateX(-50%) rotate(45deg)',\n            width: '10px',\n            height: '10px',\n            backgroundColor: 'rgba(10, 15, 25, 0.95)',\n            borderRight: `1px solid ${color}`,\n            borderBottom: `1px solid ${color}`,\n          }} />\n        </div>\n      )}\n    </div>\n  );\n}\n\n/** \n * Renders AstroUXDS-compliant status symbol with proper shape\n * Shapes: Critical=triangle, Serious=diamond, Caution=square, Normal=circle, Standby=ring, Off=small-circle\n */\nfunction StatusSymbol({ \n  status, \n  size = 8, \n  message,\n  showTooltip = false,\n}: { \n  status: StatusLevel; \n  size?: number; \n  message?: string;\n  showTooltip?: boolean;\n}): React.ReactElement {\n  const [isHovered, setIsHovered] = React.useState(false);\n  const color = STATUS_COLORS[status];\n  const defaultMessage = STATUS_DESCRIPTIONS[status];\n  const tooltipText = message || defaultMessage;\n  const statusLabel = status.charAt(0).toUpperCase() + status.slice(1);\n  \n  // Shape rendering based on Astro UX dual-coded status levels\n  const renderShape = () => {\n    const h = size / 2;\n    const glow = `drop-shadow(0 0 3px ${color})`;\n    switch (status) {\n      case 'critical':\n        // Triangle pointing down\n        return (\n          <svg width={size} height={size} viewBox={`0 0 ${size} ${size}`} style={{ filter: glow }}>\n            <polygon points={`${h},${size} 0,0 ${size},0`} fill={color} />\n          </svg>\n        );\n      case 'serious':\n        // Diamond (rotated square)\n        return (\n          <svg width={size} height={size} viewBox={`0 0 ${size} ${size}`} style={{ filter: glow }}>\n            <polygon points={`${h},0 ${size},${h} ${h},${size} 0,${h}`} fill={color} />\n          </svg>\n        );\n      case 'caution':\n        // Filled square\n        return (\n          <svg width={size} height={size} viewBox={`0 0 ${size} ${size}`} style={{ filter: glow }}>\n            <rect width={size} height={size} fill={color} />\n          </svg>\n        );\n      case 'normal':\n        // Filled circle\n        return (\n          <svg width={size} height={size} viewBox={`0 0 ${size} ${size}`} style={{ filter: glow }}>\n            <circle cx={h} cy={h} r={h} fill={color} />\n          </svg>\n        );\n      case 'standby':\n        // Ring (donut) — per official Astro UXDS\n        return (\n          <svg width={size} height={size} viewBox=\"0 0 12 12\" style={{ filter: glow }}>\n            <circle cx=\"6\" cy=\"6\" r=\"3.5\" fill=\"none\" stroke={color} strokeWidth=\"2\" />\n          </svg>\n        );\n      case 'off':\n      default:\n        // Small filled circle — per official Astro UXDS\n        return (\n          <svg width={size} height={size} viewBox=\"0 0 12 12\" style={{ filter: glow }}>\n            <circle cx=\"6\" cy=\"6\" r=\"3\" fill={color} />\n          </svg>\n        );\n    }\n  };\n\n  return (\n    <div \n      style={{\n        position: 'relative',\n        display: 'inline-flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        cursor: showTooltip ? 'help' : 'default',\n      }}\n      onMouseEnter={() => showTooltip && setIsHovered(true)}\n      onMouseLeave={() => setIsHovered(false)}\n    >\n      {renderShape()}\n      {/* Custom tooltip popup */}\n      {showTooltip && isHovered && (\n        <div\n          style={{\n            position: 'absolute',\n            bottom: 'calc(100% + 8px)',\n            left: '50%',\n            transform: 'translateX(-50%)',\n            padding: '8px 12px',\n            backgroundColor: 'rgba(10, 15, 25, 0.95)',\n            border: `1px solid ${color}`,\n            borderRadius: '4px',\n            boxShadow: `0 0 12px ${color}40, 0 4px 12px rgba(0,0,0,0.4)`,\n            zIndex: 1000,\n            whiteSpace: 'nowrap',\n            pointerEvents: 'none',\n            minWidth: '150px',\n          }}\n        >\n          {/* Status label */}\n          <div style={{ \n            fontSize: '0.6875rem', // 11px in rem \n            fontWeight: 500, // AstroUXDS medium for labels\n            color: color,\n            marginBottom: '4px',\n            textTransform: 'uppercase',\n            letterSpacing: '0.5px',\n          }}>\n            {statusLabel}\n          </div>\n          {/* Status message */}\n          <div style={{ \n            fontSize: '0.75rem', // 12px in rem\n            color: 'rgba(255,255,255,0.9)',\n            lineHeight: 1.4,\n          }}>\n            {tooltipText}\n          </div>\n          {/* Arrow */}\n          <div style={{\n            position: 'absolute',\n            bottom: '-6px',\n            left: '50%',\n            transform: 'translateX(-50%) rotate(45deg)',\n            width: '10px',\n            height: '10px',\n            backgroundColor: 'rgba(10, 15, 25, 0.95)',\n            borderRight: `1px solid ${color}`,\n            borderBottom: `1px solid ${color}`,\n          }} />\n        </div>\n      )}\n    </div>\n  );\n}\n\n/**\n * StatusBadge - Compact status indicator for accent lines\n * Shows colored badge with status shape at end of accent line\n */\nfunction StatusBadge({ \n  status, \n  tokens: _tokens,\n  size = 'bold',\n}: { \n  status: StatusLevel; \n  tokens: any;\n  size?: 'bold' | 'minimal';\n}): React.ReactElement {\n  const color = STATUS_COLORS[status];\n  const label = status.charAt(0).toUpperCase() + status.slice(1);\n  const isBold = size === 'bold';\n  \n  return (\n    <span style={{\n      display: 'inline-flex',\n      alignItems: 'center',\n      gap: isBold ? '6px' : '4px',\n      padding: isBold ? '3px 10px' : '2px 8px',\n      borderRadius: '12px',\n      fontSize: isBold ? '11px' : '10px',\n      fontWeight: 500,\n      backgroundColor: `${color}20`,\n      color: color,\n      flexShrink: 0,\n      textTransform: 'uppercase',\n      letterSpacing: '0.3px',\n    }}>\n      {/* Status shape */}\n      <StatusSymbol status={status} size={isBold ? 6 : 5} />\n      {label}\n    </span>\n  );\n}\n\nexport const Container = memo(function Container({\n  variant = 'default',\n  padding = 'md',\n  title,\n  subtitle,\n  status,\n  actions,\n  fullHeight = false,\n  clipContent = true,\n  loading = false,\n  children,\n  className = '',\n  style,\n  onClick,\n  disableAutoGlass = false,\n  icon,\n  iconStatus,\n  statusMessage,\n  iconColor,\n  accentColor,\n}: ContainerProps): React.ReactElement {\n  const { tokens, theme } = useTheme();\n  const { isMobile } = useBreakpoint();\n  \n  // Theme detection\n  const _isTransparentTheme = theme === 'transparent' || theme === 'transparent-bold' || theme === 'transparent-minimal';\n  const isBoldVariant = theme === 'transparent-bold';\n  const isMinimalVariant = theme === 'transparent-minimal';\n  \n  // Glass mode with accent styling ONLY for bold/minimal themes\n  // Normal \"transparent\" (Glass) theme uses simpler styling without accent borders\n  const useGlassMode = (isBoldVariant || isMinimalVariant) && !disableAutoGlass && !variant.startsWith('glass');\n  \n  // Simple glass mode for normal \"transparent\" theme (no accent borders)\n  const useSimpleGlass = theme === 'transparent' && !disableAutoGlass && !variant.startsWith('glass');\n  \n  // Default accent color: bold/minimal themes use theme accent (Zendir purple)\n  const defaultAccentColor = tokens.colors.accent.primary;\n  const glassAccentColor = accentColor || defaultAccentColor;\n  const glassAccentMuted = `${glassAccentColor}66`;\n  const glassGradient = `linear-gradient(135deg, ${glassAccentColor}10 0%, ${glassAccentColor}03 100%)`;\n  \n  // Determine icon color: custom > status > accent\n  const resolvedIconColor = iconColor || (iconStatus ? STATUS_COLORS[iconStatus] : glassAccentColor);\n  const _iconColorMuted = `${resolvedIconColor}66`;\n  \n  const paddingConfig = {\n    none: '0',\n    sm: isMobile ? tokens.spacing.xs : tokens.spacing.sm,\n    md: isMobile ? tokens.spacing.sm : tokens.spacing.md,\n    lg: isMobile ? tokens.spacing.md : tokens.spacing.lg,\n  };\n\n  const headingConfig = tokens.layout?.card?.heading ?? {\n    iconSize: 20,\n    iconSizeCompact: 16,\n    titleFontSize: '1.125rem',\n    titleFontSizeChart: '0.875rem',\n    titleFontWeight: 500,\n    gap: 8,\n  };\n  \n  const variantStyles: Record<ContainerVariant, React.CSSProperties> = {\n    default: {\n      backgroundColor: tokens.colors.background.surface,\n      border: `1px solid ${tokens.colors.border.muted}`,\n      boxShadow: 'none',\n    },\n    elevated: {\n      backgroundColor: tokens.colors.background.surface,\n      border: 'none',\n      boxShadow: tokens.shadows.md,\n    },\n    outlined: {\n      backgroundColor: 'transparent',\n      border: `1px solid ${tokens.colors.border.muted}`,\n      boxShadow: 'none',\n    },\n    ghost: {\n      backgroundColor: 'transparent',\n      border: 'none',\n      boxShadow: 'none',\n    },\n    // Glass variants - transparent with blur\n    glass: {\n      backgroundColor: 'rgba(15, 20, 35, 0.85)',\n      backdropFilter: 'blur(12px)',\n      WebkitBackdropFilter: 'blur(12px)',\n      border: '1px solid rgba(0, 212, 255, 0.25)',\n      boxShadow: 'none',\n    } as React.CSSProperties,\n    'glass-dark': {\n      backgroundColor: 'rgba(0, 0, 0, 0.7)',\n      backdropFilter: 'blur(16px)',\n      WebkitBackdropFilter: 'blur(16px)',\n      border: '1px solid rgba(100, 130, 160, 0.2)',\n      boxShadow: 'none',\n    } as React.CSSProperties,\n    'glass-light': {\n      backgroundColor: 'rgba(255, 255, 255, 0.15)',\n      backdropFilter: 'blur(12px)',\n      WebkitBackdropFilter: 'blur(12px)',\n      border: '1px solid rgba(255, 255, 255, 0.25)',\n      boxShadow: 'none',\n    } as React.CSSProperties,\n  };\n  \n  // Glow color for hover effect (like GlassCard)\n  const glowColor = accentColor \n    ? `${accentColor}66` \n    : 'rgba(0, 212, 255, 0.4)';\n\n  // Glass mode overrides for BOLD/MINIMAL themes (Glassmorphic Panels with accent borders)\n  const glassOverrides: React.CSSProperties = useGlassMode ? {\n    backgroundColor: 'rgba(10, 15, 25, 0.35)',\n    backdropFilter: 'blur(12px)',\n    WebkitBackdropFilter: 'blur(12px)',\n    border: `1px solid ${glassAccentMuted}`,\n    borderTop: isBoldVariant ? `2px solid ${glassAccentColor}` : `1px solid ${glassAccentColor}`,\n    transition: 'all 0.3s ease-out, box-shadow 0.3s ease-out',\n  } as React.CSSProperties : {};\n  \n  // Simple glass overrides for normal \"transparent\" (Glass) theme — match top cards (ISS): transparent + blur\n  const simpleGlassOverrides: React.CSSProperties = useSimpleGlass ? {\n    backgroundColor: 'transparent',\n    backdropFilter: 'blur(12px)',\n    WebkitBackdropFilter: 'blur(12px)',\n    border: `1px solid ${tokens.colors.border.muted}`,\n    transition: 'all 0.3s ease-out',\n  } as React.CSSProperties : {};\n\n  // Hover handlers for glow effect (like GlassCard)\n  const handleMouseEnter = useCallback((e: React.MouseEvent<HTMLDivElement>) => {\n    if (useGlassMode) {\n      e.currentTarget.style.boxShadow = `0 0 30px ${glowColor}, 0 4px 20px rgba(0,0,0,0.3)`;\n    }\n  }, [useGlassMode, glowColor]);\n\n  const handleMouseLeave = useCallback((e: React.MouseEvent<HTMLDivElement>) => {\n    if (useGlassMode) {\n      e.currentTarget.style.boxShadow = 'none';\n    }\n  }, [useGlassMode]);\n  \n  const statusColor = status ? tokens.colors.status[status] : undefined;\n  const isInteractive = !!onClick;\n  \n  return (\n    <div\n      className={classNames(\n        'zendir-container', \n        `zendir-container--${variant}`,\n        useGlassMode && 'zendir-container--auto-glass',\n        className\n      )}\n      onClick={onClick}\n      role={isInteractive ? 'button' : undefined}\n      tabIndex={isInteractive ? 0 : undefined}\n      onKeyDown={onClick ? (e: React.KeyboardEvent) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onClick(); } } : undefined}\n      onMouseEnter={handleMouseEnter}\n      onMouseLeave={handleMouseLeave}\n      style={{\n        borderRadius: tokens.borderRadius.lg,\n        overflow: 'hidden',\n        position: 'relative',\n        height: fullHeight ? '100%' : 'auto',\n        display: 'flex',\n        flexDirection: 'column',\n        cursor: isInteractive ? 'pointer' : 'default',\n        transition: 'all 0.3s ease-out',\n        borderLeft: statusColor ? `4px solid ${statusColor}` : undefined,\n        ...variantStyles[variant],\n        ...simpleGlassOverrides, // Normal Glass theme\n        ...glassOverrides,       // Bold/Minimal themes (overrides simpleGlass if both)\n        ...style,\n      }}\n    >\n      {/* Glass gradient overlay for bold/minimal transparent themes */}\n      {useGlassMode && (\n        <div\n          style={{\n            position: 'absolute',\n            inset: 0,\n            background: glassGradient,\n            pointerEvents: 'none',\n            zIndex: 0,\n          }}\n        />\n      )}\n      \n      {/* Loading overlay */}\n      {loading && (\n        <div\n          style={{\n            position: 'absolute',\n            inset: 0,\n            backgroundColor: addAlpha(tokens.colors.background.surface, 0.5),\n            display: 'flex',\n            alignItems: 'center',\n            justifyContent: 'center',\n            zIndex: 10,\n          }}\n        >\n          <svg\n            width=\"32\"\n            height=\"32\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            style={{ animation: 'spin 1s linear infinite' }}\n          >\n            <circle\n              cx=\"12\"\n              cy=\"12\"\n              r=\"10\"\n              stroke={tokens.colors.accent.primary}\n              strokeWidth=\"3\"\n              strokeDasharray=\"31.4 31.4\"\n              strokeDashoffset=\"10\"\n            />\n          </svg>\n          <style>\n            {`@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }`}\n          </style>\n        </div>\n      )}\n      \n      {/* Header - Glass mode BOLD variant (matching GlassCard style exactly) */}\n      {(title || actions) && useGlassMode && isBoldVariant && (\n        <div\n          style={{\n            position: 'relative',\n            zIndex: 1,\n          }}\n        >\n          {/* Title row */}\n          <div \n            style={{ \n              display: 'flex', \n              alignItems: 'center', \n              justifyContent: 'space-between',\n              padding: `16px ${paddingConfig[padding]} 0`,\n            }}\n          >\n            <div style={{ display: 'flex', alignItems: 'center', gap: headingConfig.gap }}>\n              {/* Icon with optional status symbol - full area triggers tooltip */}\n              {icon && (\n                <IconWithStatusTooltip\n                  icon={icon}\n                  iconColor={resolvedIconColor}\n                  iconStatus={iconStatus}\n                  statusMessage={statusMessage}\n                  iconSize={headingConfig.iconSize}\n                />\n              )}\n              <h3\n                style={{\n                  margin: 0,\n                  fontSize: headingConfig.titleFontSize,\n                  fontWeight: headingConfig.titleFontWeight,\n                  color: glassAccentColor,\n                  letterSpacing: '0.5px',\n                  textShadow: `0 0 20px ${glassAccentMuted}`,\n                }}\n              >\n                {title}\n              </h3>\n            </div>\n            {actions && (\n              <div style={{ display: 'flex', gap: tokens.spacing.xs }}>\n                {actions}\n              </div>\n            )}\n          </div>\n          \n          {subtitle && (\n            <p\n              style={{\n                margin: 0,\n                padding: `${tokens.spacing.xs} ${paddingConfig[padding]} 0`,\n                fontSize: tokens.typography.fontSize.sm,\n                color: tokens.colors.text.secondary,\n              }}\n            >\n              {subtitle}\n            </p>\n          )}\n          \n          {/* Accent line with optional status badge */}\n          <div\n            style={{\n              display: 'flex',\n              alignItems: 'center',\n              gap: tokens.spacing.sm,\n              padding: `12px ${paddingConfig[padding]} 0`,\n              marginBottom: tokens.spacing.sm,\n            }}\n          >\n            {/* Main accent line with gradient */}\n            <div\n              style={{\n                flex: 1,\n                height: '2px',\n                background: `linear-gradient(90deg, ${glassAccentColor} 0%, ${glassAccentMuted} 70%, ${glassAccentMuted}20 100%)`,\n                boxShadow: `0 0 8px ${glassAccentMuted}`,\n              }}\n            />\n            {/* Status badge at the end if status is set */}\n            {iconStatus && iconStatus !== 'off' && (\n              <StatusBadge status={iconStatus} tokens={tokens} size=\"bold\" />\n            )}\n          </div>\n        </div>\n      )}\n      \n      {/* Header - Glass mode MINIMAL variant (inline thin line) */}\n      {(title || actions) && useGlassMode && !isBoldVariant && (\n        <div\n          style={{\n            display: 'flex',\n            alignItems: 'center',\n            padding: `${tokens.spacing.sm} ${paddingConfig[padding]} 0`,\n            marginBottom: tokens.spacing.sm,\n            position: 'relative',\n            zIndex: 1,\n          }}\n        >\n          {/* Icon with optional status symbol - full area triggers tooltip */}\n          {icon && (\n            <div style={{ display: 'flex', alignItems: 'center', marginRight: tokens.spacing.sm }}>\n              <IconWithStatusTooltip\n                icon={icon}\n                iconColor={resolvedIconColor}\n                iconStatus={iconStatus}\n                statusMessage={statusMessage}\n                iconSize={headingConfig.iconSizeCompact}\n              />\n            </div>\n          )}\n          \n          {/* Title — card heading system */}\n          {title && (\n            <h3\n              style={{\n                margin: 0,\n                fontSize: headingConfig.titleFontSize,\n                fontWeight: headingConfig.titleFontWeight,\n                color: glassAccentColor,\n                textShadow: `0 0 16px ${glassAccentMuted}`,\n                letterSpacing: '0.02em',\n                whiteSpace: 'nowrap',\n                marginRight: '12px',\n              }}\n            >\n              {title}\n            </h3>\n          )}\n          \n          {/* Accent line - inline after title with optional status badge */}\n          <div\n            style={{\n              flex: 1,\n              display: 'flex',\n              alignItems: 'center',\n              gap: tokens.spacing.sm,\n              minWidth: 40,\n            }}\n          >\n            {/* Main gradient line */}\n            <div\n              style={{\n                flex: 1,\n                height: '1px',\n                background: `linear-gradient(90deg, ${glassAccentColor} 0%, ${glassAccentMuted} 70%, ${glassAccentMuted}20 100%)`,\n              }}\n            />\n            {/* Status badge at the end if status is set */}\n            {iconStatus && iconStatus !== 'off' && (\n              <StatusBadge status={iconStatus} tokens={tokens} size=\"minimal\" />\n            )}\n          </div>\n          \n          {actions && (\n            <div style={{ display: 'flex', gap: tokens.spacing.xs, flexShrink: 0, marginLeft: '12px' }}>\n              {actions}\n            </div>\n          )}\n        </div>\n      )}\n      \n      {/* Subtitle for glass mode MINIMAL - separate row */}\n      {subtitle && useGlassMode && !isBoldVariant && (\n        <p\n          style={{\n            margin: 0,\n            padding: `0 ${paddingConfig[padding]}`,\n            marginBottom: tokens.spacing.sm,\n            fontSize: tokens.typography.fontSize.sm,\n            color: tokens.colors.text.secondary,\n            position: 'relative',\n            zIndex: 1,\n          }}\n        >\n          {subtitle}\n        </p>\n      )}\n      \n      {/* Header - Regular mode (non-glass) - Uses shared CardHeader for consistency */}\n      {(title || actions) && !useGlassMode && (\n        <div\n          style={{\n            padding: `${paddingConfig[padding]} ${paddingConfig[padding]} 0`,\n            position: 'relative',\n            zIndex: 1,\n          }}\n        >\n          <CardHeader\n            icon={icon || (iconStatus ? 'mission' : '')}\n            title={typeof title === 'string' ? title : String(title || '')}\n            subtitle={typeof subtitle === 'string' ? subtitle : undefined}\n            status={iconStatus || status}\n            iconColor={iconColor}\n            iconSize={headingConfig.iconSize}\n            hideStatusIndicator={!icon && !iconStatus && !status}\n            rightSlot={actions}\n            style={{ marginBottom: tokens.spacing.sm }}\n          />\n          {/* Render non-string subtitles (React elements) below the CardHeader */}\n          {subtitle && typeof subtitle !== 'string' && (\n            <div style={{\n              fontSize: tokens.typography.fontSize.sm,\n              color: tokens.colors.text.secondary,\n              marginTop: -parseInt(tokens.spacing.xs || '4', 10) || -4,\n              marginBottom: parseInt(tokens.spacing.sm || '8', 10) || 8,\n            }}>\n              {subtitle}\n            </div>\n          )}\n        </div>\n      )}\n      \n      {/* Content */}\n      <div\n        style={{\n          flex: 1,\n          minHeight: fullHeight ? 0 : undefined,\n          overflow: fullHeight && clipContent ? 'hidden' : undefined,\n          // When fullHeight, become a flex column so any child using flex:1 or height:100%\n          // gets a properly bounded height and scroll containers can work.\n          display: fullHeight ? 'flex' : undefined,\n          flexDirection: fullHeight ? 'column' : undefined,\n          padding: fullHeight ? `${tokens.spacing.xs} 0 0 0` : (title ? `${tokens.spacing.xs} ${paddingConfig[padding]} ${paddingConfig[padding]}` : paddingConfig[padding]),\n          position: 'relative',\n          zIndex: 1,\n        }}\n      >\n        {children}\n      </div>\n    </div>\n  );\n});\n\nexport default Container;\n"],"names":["Container"],"mappings":"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"}

package/dist/react/core/CopyButton.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CopyButton.js","sources":["../../../src/react/core/CopyButton.tsx"],"sourcesContent":["/**\r\n * @zendir/ui - Clipboard Utilities\r\n * \r\n * Copy-to-clipboard hook and button component. Used universally in operator\r\n * dashboards for sharing configuration URLs, copying telemetry values,\r\n * exporting command IDs.\r\n * \r\n * @example\r\n * ```tsx\r\n * // Hook\r\n * const { copy, copied } = useCopyToClipboard();\r\n * <Button onClick={() => copy(configUrl)}>\r\n *   {copied ? 'Copied!' : 'Copy URL'}\r\n * </Button>\r\n * \r\n * // Component\r\n * <CopyButton value={telemetryValue} label=\"Copy Value\" />\r\n * <CopyButton value={shareUrl} size=\"small\" />\r\n * ```\r\n */\r\n\r\nimport React, { memo, useState, useCallback, useRef, useEffect } from 'react';\r\nimport { useTheme } from '../theme';\r\n\r\n// ─── Hook ────────────────────────────────────────────────────────────────────\r\n\r\nexport interface UseCopyToClipboardReturn {\r\n  /** Copy text to clipboard */\r\n  copy: (text: string) => Promise<boolean>;\r\n  /** True for brief period after successful copy */\r\n  copied: boolean;\r\n  /** Error if copy failed */\r\n  error: string | null;\r\n}\r\n\r\n/**\r\n * Hook for clipboard operations.\r\n * \r\n * @param resetDelay - Time in ms before `copied` resets to false (default 2000)\r\n * \r\n * @example\r\n * ```tsx\r\n * const { copy, copied } = useCopyToClipboard();\r\n * ```\r\n */\r\nexport function useCopyToClipboard(resetDelay = 2000): UseCopyToClipboardReturn {\r\n  const [copied, setCopied] = useState(false);\r\n  const [error, setError] = useState<string | null>(null);\r\n  const timeoutRef = useRef<ReturnType<typeof setTimeout>>();\r\n  \r\n  const copy = useCallback(async (text: string): Promise<boolean> => {\r\n    try {\r\n      if (navigator.clipboard && navigator.clipboard.writeText) {\r\n        await navigator.clipboard.writeText(text);\r\n      } else {\r\n        // Fallback for older browsers / non-HTTPS\r\n        const textarea = document.createElement('textarea');\r\n        textarea.value = text;\r\n        textarea.style.cssText = 'position:fixed;left:-9999px;top:-9999px;opacity:0';\r\n        document.body.appendChild(textarea);\r\n        textarea.select();\r\n        document.execCommand('copy');\r\n        document.body.removeChild(textarea);\r\n      }\r\n      \r\n      setCopied(true);\r\n      setError(null);\r\n      clearTimeout(timeoutRef.current);\r\n      timeoutRef.current = setTimeout(() => setCopied(false), resetDelay);\r\n      return true;\r\n    } catch (err) {\r\n      const message = err instanceof Error ? err.message : 'Copy failed';\r\n      setError(message);\r\n      setCopied(false);\r\n      return false;\r\n    }\r\n  }, [resetDelay]);\r\n  \r\n  // Cleanup on unmount\r\n  useEffect(() => {\r\n    return () => { clearTimeout(timeoutRef.current); };\r\n  }, []);\r\n  \r\n  return { copy, copied, error };\r\n}\r\n\r\n// ─── Component ───────────────────────────────────────────────────────────────\r\n\r\nexport interface CopyButtonProps {\r\n  /** Text to copy */\r\n  value: string;\r\n  /** Button label (default: shows icon only) */\r\n  label?: string;\r\n  /** Label shown briefly after copy (default: \"Copied!\") */\r\n  copiedLabel?: string;\r\n  /** Size */\r\n  size?: 'small' | 'medium' | 'large';\r\n  /** Tooltip text */\r\n  tooltip?: string;\r\n  /** Disabled */\r\n  disabled?: boolean;\r\n  /** Custom style */\r\n  style?: React.CSSProperties;\r\n}\r\n\r\nexport const CopyButton = memo(function CopyButton({\r\n  value,\r\n  label,\r\n  copiedLabel = 'Copied!',\r\n  size = 'medium',\r\n  tooltip = 'Copy to clipboard',\r\n  disabled = false,\r\n  style,\r\n}: CopyButtonProps): React.ReactElement {\r\n  const { tokens } = useTheme();\r\n  const { copy, copied } = useCopyToClipboard();\r\n  const [isHovered, setIsHovered] = useState(false);\r\n  \r\n  const sizeConfig = {\r\n    small: { height: 28, padding: '4px 8px', fontSize: '0.75rem', iconSize: 14 },\r\n    medium: { height: 36, padding: '6px 12px', fontSize: '0.875rem', iconSize: 16 },\r\n    large: { height: 44, padding: '8px 16px', fontSize: '1rem', iconSize: 18 },\r\n  };\r\n  const config = sizeConfig[size];\r\n  \r\n  // Copy icon (two overlapping rectangles)\r\n  const copyIcon = (\r\n    <svg width={config.iconSize} height={config.iconSize} viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\r\n      <rect x=\"9\" y=\"9\" width=\"13\" height=\"13\" rx=\"2\" ry=\"2\" />\r\n      <path d=\"M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1\" />\r\n    </svg>\r\n  );\r\n  \r\n  // Checkmark icon\r\n  const checkIcon = (\r\n    <svg width={config.iconSize} height={config.iconSize} viewBox=\"0 0 24 24\" fill=\"none\" stroke={tokens.colors.status.normal} strokeWidth=\"2.5\" strokeLinecap=\"round\" strokeLinejoin=\"round\">\r\n      <polyline points=\"20 6 9 17 4 12\" />\r\n    </svg>\r\n  );\r\n  \r\n  return (\r\n    <button\r\n      type=\"button\"\r\n      onClick={() => !disabled && copy(value)}\r\n      disabled={disabled}\r\n      title={copied ? copiedLabel : tooltip}\r\n      aria-label={!label ? (copied ? copiedLabel : tooltip) : undefined}\r\n      onMouseEnter={() => setIsHovered(true)}\r\n      onMouseLeave={() => setIsHovered(false)}\r\n      style={{\r\n        display: 'inline-flex',\r\n        alignItems: 'center',\r\n        justifyContent: 'center',\r\n        gap: '6px',\r\n        height: config.height,\r\n        padding: label ? config.padding : `0 ${Math.round(parseInt(config.padding) * 0.6)}px`,\r\n        fontSize: config.fontSize,\r\n        fontWeight: 500,\r\n        fontFamily: tokens.typography.fontFamily.primary,\r\n        color: copied\r\n          ? tokens.colors.status.normal\r\n          : tokens.colors.text.secondary,\r\n        backgroundColor: isHovered && !disabled\r\n          ? `${tokens.colors.accent.primary}12`\r\n          : 'transparent',\r\n        border: `1px solid ${copied ? `${tokens.colors.status.normal}40` : tokens.colors.border.muted}`,\r\n        borderRadius: tokens.borderRadius.md,\r\n        cursor: disabled ? 'not-allowed' : 'pointer',\r\n        transition: tokens.animation.fast,\r\n        opacity: disabled ? 0.5 : 1,\r\n        outline: 'none',\r\n        whiteSpace: 'nowrap',\r\n        ...style,\r\n      }}\r\n    >\r\n      {copied ? checkIcon : copyIcon}\r\n      {label && <span>{copied ? copiedLabel : label}</span>}\r\n    </button>\r\n  );\r\n});\r\n\r\nexport default CopyButton;\r\n"],"names":["CopyButton"],"mappings":"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"}

package/dist/react/core/DataTable.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DataTable.js","sources":["../../../src/react/core/DataTable.tsx"],"sourcesContent":["/**\r\n * @zendir/ui - DataTable Component\r\n * \r\n * Structured data display with expandable groups, responsive columns,\r\n * and theme-aware styling. Designed for telemetry parameter grids,\r\n * link budget displays, spacecraft information panels.\r\n * \r\n * Astro UX Compliance:\r\n * - Tabular monospace numbers for value columns\r\n * - Status-based row coloring\r\n * - Compact mode support\r\n * - Accessible table semantics\r\n * \r\n * Enhanced Tooltip System:\r\n * - Row-level tooltips (string or rich ReactNode via rowTooltipContent)\r\n * - Cell-level tooltips per column definition\r\n * - Header tooltips for column descriptions\r\n * - Built-in DataTableRowDetail component for structured detail views\r\n * - Portal-rendered, WCAG-compliant, animated tooltips\r\n * \r\n * @example\r\n * ```tsx\r\n * <DataTable\r\n *   columns={[\r\n *     { key: 'label', header: 'Parameter', width: '40%', headerTooltip: 'Telemetry parameter name' },\r\n *     { key: 'value', header: 'Value', align: 'right', mono: true, cellTooltip: (v, row) => `Raw: ${v}` },\r\n *     { key: 'unit', header: 'Unit', width: 80 },\r\n *   ]}\r\n *   data={[\r\n *     { label: 'Frequency', value: '437.500', unit: 'MHz' },\r\n *     { label: 'Bandwidth', value: '25.000', unit: 'kHz' },\r\n *   ]}\r\n *   rowTooltipContent={(row) => (\r\n *     <DataTableRowDetail\r\n *       title={row.label}\r\n *       fields={[\r\n *         { label: 'Value', value: `${row.value} ${row.unit}` },\r\n *       ]}\r\n *     />\r\n *   )}\r\n * />\r\n * ```\r\n */\r\n\r\nimport React, { memo, useState, useCallback, useMemo } from 'react';\r\nimport { useTheme } from '../theme';\r\nimport { useBreakpoint } from './layout/useBreakpoint';\r\nimport { Tooltip } from './Tooltip';\r\nimport type { TooltipPlacement } from './Tooltip';\r\nimport { addAlpha } from '../utils';\r\n\r\n// ─── Types ───────────────────────────────────────────────────────────────────\r\n\r\nexport interface DataTableColumn<T = Record<string, unknown>> {\r\n  /** Key in data object */\r\n  key: string;\r\n  /** Column header text */\r\n  header: string;\r\n  /** Column width (CSS value or number for px) */\r\n  width?: string | number;\r\n  /** Text alignment */\r\n  align?: 'left' | 'center' | 'right';\r\n  /** Use monospace font (good for numbers) */\r\n  mono?: boolean;\r\n  /** Custom cell renderer */\r\n  render?: (value: unknown, row: T, index: number) => React.ReactNode;\r\n  /** Hide column on mobile */\r\n  hideOnMobile?: boolean;\r\n  /** Tooltip for the column header (explains what this column represents) */\r\n  headerTooltip?: string;\r\n  /** Per-cell tooltip — return string or ReactNode, or undefined to skip */\r\n  cellTooltip?: (value: unknown, row: T, index: number) => React.ReactNode | undefined;\r\n}\r\n\r\nexport interface DataTableProps<T = Record<string, unknown>> {\r\n  /** Column definitions */\r\n  columns: DataTableColumn<T>[];\r\n  /** Data rows */\r\n  data: T[];\r\n  /** Key field for React keys (default: index) */\r\n  keyField?: string;\r\n  /** Group rows by this field */\r\n  groupBy?: string;\r\n  /** Allow expanding/collapsing groups */\r\n  expandable?: boolean;\r\n  /** Default expanded state for groups */\r\n  defaultExpanded?: boolean;\r\n  /** Striped rows */\r\n  striped?: boolean;\r\n  /** Compact row padding */\r\n  compact?: boolean;\r\n  /** Show header row */\r\n  showHeader?: boolean;\r\n  /** Empty state message */\r\n  emptyMessage?: string;\r\n  /** Row click handler */\r\n  onRowClick?: (row: T, index: number) => void;\r\n  /** Simple string tooltip for each row (legacy — uses native title) */\r\n  rowTooltip?: (row: T) => string | undefined;\r\n  /** Rich tooltip content for each row — renders in a portal-based Tooltip */\r\n  rowTooltipContent?: (row: T, index: number) => React.ReactNode | undefined;\r\n  /** Placement for row and cell tooltips (default: 'top') */\r\n  tooltipPlacement?: TooltipPlacement;\r\n  /** Delay before tooltips appear in ms (default: 300) */\r\n  tooltipDelay?: number;\r\n  /** Max height with scroll */\r\n  maxHeight?: string | number;\r\n  /** Color for boolean ✓/✗ values (e.g. '#fff' for white). Defaults to text.primary or row status. */\r\n  booleanColor?: string;\r\n  /** Optional row status key or getter — boolean cells use this row's status color when set (matches white/status design). */\r\n  getRowStatus?: (row: T, index: number) => 'normal' | 'caution' | 'serious' | 'critical' | 'standby' | 'off' | undefined;\r\n  /** Custom style */\r\n  style?: React.CSSProperties;\r\n}\r\n\r\n// ─── DataTableRowDetail ──────────────────────────────────────────────────────\r\n\r\nexport interface DataTableRowDetailField {\r\n  /** Field label */\r\n  label: string;\r\n  /** Field value (string, number, or ReactNode for custom rendering) */\r\n  value: React.ReactNode;\r\n  /** Optional status color for the value */\r\n  status?: 'normal' | 'caution' | 'serious' | 'critical' | 'standby' | 'off';\r\n  /** Use monospace font for this value */\r\n  mono?: boolean;\r\n}\r\n\r\nexport interface DataTableRowDetailProps {\r\n  /** Title shown at the top of the tooltip */\r\n  title?: React.ReactNode;\r\n  /** Optional subtitle / secondary info */\r\n  subtitle?: React.ReactNode;\r\n  /** Structured key-value fields to display */\r\n  fields?: DataTableRowDetailField[];\r\n  /** Optional footer content (timestamps, actions, etc.) */\r\n  footer?: React.ReactNode;\r\n  /** Optional icon or status indicator beside the title */\r\n  icon?: React.ReactNode;\r\n  /** Maximum width of the tooltip (default: 320) */\r\n  maxWidth?: number;\r\n}\r\n\r\nconst STATUS_DOT_COLORS: Record<string, string> = {\r\n  normal: '#56F000',\r\n  caution: '#FCE83A',\r\n  serious: '#FFB302',\r\n  critical: '#FF3838',\r\n  standby: '#2DCCFF',\r\n  off: '#9EA7AD',\r\n};\r\n\r\n/**\r\n * Pre-built tooltip content renderer for DataTable rows.\r\n * Provides a structured layout: title, key-value fields, and optional footer.\r\n * \r\n * @example\r\n * ```tsx\r\n * <DataTable\r\n *   columns={columns}\r\n *   data={data}\r\n *   rowTooltipContent={(row) => (\r\n *     <DataTableRowDetail\r\n *       title={row.parameter}\r\n *       subtitle={row.category}\r\n *       fields={[\r\n *         { label: 'Value', value: row.value, mono: true },\r\n *         { label: 'Status', value: row.status, status: row.status },\r\n *       ]}\r\n *       footer={`Last updated: ${row.timestamp}`}\r\n *     />\r\n *   )}\r\n * />\r\n * ```\r\n */\r\nexport const DataTableRowDetail = memo(function DataTableRowDetail({\r\n  title,\r\n  subtitle,\r\n  fields,\r\n  footer,\r\n  icon,\r\n  maxWidth = 320,\r\n}: DataTableRowDetailProps): React.ReactElement {\r\n  const { tokens } = useTheme();\r\n\r\n  return (\r\n    <div style={{ maxWidth, minWidth: 180 }}>\r\n      {/* Header */}\r\n      {(title || icon) && (\r\n        <div style={{\r\n          display: 'flex',\r\n          alignItems: 'center',\r\n          gap: tokens.spacing.sm,\r\n          marginBottom: fields?.length || subtitle ? tokens.spacing.sm : 0,\r\n        }}>\r\n          {icon}\r\n          <div style={{ flex: 1, minWidth: 0 }}>\r\n            {title && (\r\n              <div style={{\r\n                fontWeight: tokens.typography.fontWeight.semibold,\r\n                fontSize: tokens.typography.fontSize.sm,\r\n                color: tokens.colors.text.primary,\r\n                lineHeight: 1.3,\r\n                overflow: 'hidden',\r\n                textOverflow: 'ellipsis',\r\n              }}>\r\n                {title}\r\n              </div>\r\n            )}\r\n            {subtitle && (\r\n              <div style={{\r\n                fontSize: tokens.typography.fontSize.xxs,\r\n                color: tokens.colors.text.tertiary,\r\n                marginTop: 2,\r\n              }}>\r\n                {subtitle}\r\n              </div>\r\n            )}\r\n          </div>\r\n        </div>\r\n      )}\r\n\r\n      {/* Fields */}\r\n      {fields && fields.length > 0 && (\r\n        <div style={{\r\n          display: 'grid',\r\n          gridTemplateColumns: 'auto 1fr',\r\n          gap: `${tokens.spacing.xs} ${tokens.spacing.md}`,\r\n          fontSize: tokens.typography.fontSize.xs,\r\n          lineHeight: 1.5,\r\n        }}>\r\n          {fields.map((field, i) => (\r\n            <React.Fragment key={i}>\r\n              <span style={{\r\n                color: tokens.colors.text.tertiary,\r\n                whiteSpace: 'nowrap',\r\n              }}>\r\n                {field.label}\r\n              </span>\r\n              <span style={{\r\n                color: field.status\r\n                  ? STATUS_DOT_COLORS[field.status] || tokens.colors.text.primary\r\n                  : tokens.colors.text.primary,\r\n                fontFamily: field.mono ? tokens.typography.fontFamily.mono : 'inherit',\r\n                fontVariantNumeric: field.mono ? 'tabular-nums' : 'normal',\r\n                textAlign: 'right',\r\n                overflow: 'hidden',\r\n                textOverflow: 'ellipsis',\r\n                whiteSpace: 'nowrap',\r\n              }}>\r\n                {field.value}\r\n              </span>\r\n            </React.Fragment>\r\n          ))}\r\n        </div>\r\n      )}\r\n\r\n      {/* Footer */}\r\n      {footer && (\r\n        <div style={{\r\n          marginTop: tokens.spacing.sm,\r\n          paddingTop: tokens.spacing.xs,\r\n          borderTop: `1px solid ${addAlpha(tokens.colors.border.muted, 0.19)}`,\r\n          fontSize: tokens.typography.fontSize.xxs,\r\n          color: tokens.colors.text.tertiary,\r\n        }}>\r\n          {footer}\r\n        </div>\r\n      )}\r\n    </div>\r\n  );\r\n});\r\n\r\n// ─── Cell Tooltip Wrapper ────────────────────────────────────────────────────\r\n\r\ninterface CellTooltipWrapperProps {\r\n  content: React.ReactNode;\r\n  placement: TooltipPlacement;\r\n  delay: number;\r\n  children: React.ReactElement;\r\n}\r\n\r\nconst CellTooltipWrapper = memo(function CellTooltipWrapper({\r\n  content,\r\n  placement,\r\n  delay,\r\n  children,\r\n}: CellTooltipWrapperProps): React.ReactElement {\r\n  if (!content) return children;\r\n  return (\r\n    <Tooltip content={content} placement={placement} delay={delay}>\r\n      {children}\r\n    </Tooltip>\r\n  );\r\n});\r\n\r\n// ─── DataTable ───────────────────────────────────────────────────────────────\r\n\r\nexport const DataTable = memo(function DataTable<T extends Record<string, unknown>>({\r\n  columns,\r\n  data,\r\n  keyField,\r\n  groupBy,\r\n  expandable = false,\r\n  defaultExpanded = true,\r\n  striped = false,\r\n  compact = false,\r\n  showHeader = true,\r\n  emptyMessage = 'No data available',\r\n  onRowClick,\r\n  rowTooltip,\r\n  rowTooltipContent,\r\n  tooltipPlacement = 'top',\r\n  tooltipDelay = 300,\r\n  maxHeight,\r\n  booleanColor,\r\n  getRowStatus,\r\n  style,\r\n}: DataTableProps<T>): React.ReactElement {\r\n  const { tokens } = useTheme();\r\n  const { isMobile: isMobileView } = useBreakpoint();\r\n  const statusColorMap = useMemo(() => ({\r\n    normal: tokens.colors.status.normal,\r\n    caution: tokens.colors.status.caution,\r\n    serious: tokens.colors.status.serious,\r\n    critical: tokens.colors.status.critical,\r\n    standby: tokens.colors.status.standby,\r\n    off: tokens.colors.status.off,\r\n  }), [tokens.colors.status]);\r\n  const visibleColumns = isMobileView ? columns.filter(col => !col.hideOnMobile) : columns;\r\n  \r\n  const [expandedGroups, setExpandedGroups] = useState<Set<string>>(\r\n    defaultExpanded ? new Set(['__all__']) : new Set()\r\n  );\r\n  const [hoveredRow, setHoveredRow] = useState<number | null>(null);\r\n  const visibleColumnCount = Math.max(1, visibleColumns.length);\r\n  \r\n  const cellPadding = compact ? `${tokens.spacing.xs} ${tokens.spacing.sm}` : `${tokens.spacing.sm} ${tokens.spacing.md}`;\r\n  \r\n  const toggleGroup = useCallback((group: string) => {\r\n    setExpandedGroups(prev => {\r\n      const next = new Set(prev);\r\n      if (next.has(group)) next.delete(group);\r\n      else next.add(group);\r\n      return next;\r\n    });\r\n  }, []);\r\n  \r\n  const isGroupExpanded = useCallback((group: string) => {\r\n    return expandedGroups.has('__all__') || expandedGroups.has(group);\r\n  }, [expandedGroups]);\r\n  \r\n  const groups = useMemo(() => {\r\n    if (!groupBy) return [{ key: '__default__', label: '', rows: data }];\r\n    \r\n    const map = new Map<string, T[]>();\r\n    data.forEach(row => {\r\n      const key = String((row as Record<string, unknown>)[groupBy] ?? 'Other');\r\n      if (!map.has(key)) map.set(key, []);\r\n      map.get(key)!.push(row);\r\n    });\r\n    \r\n    return Array.from(map.entries()).map(([key, rows]) => ({\r\n      key,\r\n      label: key,\r\n      rows,\r\n    }));\r\n  }, [data, groupBy]);\r\n  \r\n  const resolveWidth = (w: string | number | undefined): string | undefined => {\r\n    if (w === undefined) return undefined;\r\n    if (typeof w === 'number') return `${w}px`;\r\n    return w;\r\n  };\r\n  \r\n  const renderCell = (col: DataTableColumn<T>, row: T, rowIndex: number) => {\r\n    const value = row[col.key];\r\n    if (col.render) return col.render(value, row, rowIndex);\r\n    if (value === null || value === undefined) return '—';\r\n    if (typeof value === 'boolean') {\r\n      const label = value ? '✓' : '✗';\r\n      const color = booleanColor\r\n        ?? (getRowStatus ? (() => { const s = getRowStatus(row, rowIndex); return s ? statusColorMap[s] : undefined; })() : undefined)\r\n        ?? tokens.colors.text.primary;\r\n      return <span style={{ color }}>{label}</span>;\r\n    }\r\n    return String(value);\r\n  };\r\n\r\n  const renderCellWithTooltip = (col: DataTableColumn<T>, row: T, rowIndex: number) => {\r\n    const cellContent = renderCell(col, row, rowIndex);\r\n    if (!col.cellTooltip) return cellContent;\r\n\r\n    const tooltipContent = col.cellTooltip(row[col.key], row, rowIndex);\r\n    if (!tooltipContent) return cellContent;\r\n\r\n    return (\r\n      <CellTooltipWrapper\r\n        content={tooltipContent}\r\n        placement={tooltipPlacement}\r\n        delay={tooltipDelay}\r\n      >\r\n        <span style={{ cursor: 'help' }}>{cellContent}</span>\r\n      </CellTooltipWrapper>\r\n    );\r\n  };\r\n\r\n  const renderHeaderCell = (col: DataTableColumn<T>) => {\r\n    const headerContent = (\r\n      <span style={{ display: 'inline-flex', alignItems: 'center', gap: 4 }}>\r\n        {col.header}\r\n        {col.headerTooltip && (\r\n          <svg\r\n            width=\"12\" height=\"12\" viewBox=\"0 0 16 16\" fill=\"none\"\r\n            style={{ opacity: 0.5, flexShrink: 0 }}\r\n          >\r\n            <circle cx=\"8\" cy=\"8\" r=\"7\" stroke=\"currentColor\" strokeWidth=\"1.5\" />\r\n            <path d=\"M8 7v4\" stroke=\"currentColor\" strokeWidth=\"1.5\" strokeLinecap=\"round\" />\r\n            <circle cx=\"8\" cy=\"5\" r=\"0.75\" fill=\"currentColor\" />\r\n          </svg>\r\n        )}\r\n      </span>\r\n    );\r\n    \r\n    if (!col.headerTooltip) return headerContent;\r\n    \r\n    return (\r\n      <Tooltip content={col.headerTooltip} placement=\"bottom\" delay={tooltipDelay}>\r\n        {headerContent}\r\n      </Tooltip>\r\n    );\r\n  };\r\n  \r\n  const chevron = (expanded: boolean) => (\r\n    <svg\r\n      width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\"\r\n      stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\"\r\n      style={{\r\n        transition: tokens.animation.fast,\r\n        transform: expanded ? 'rotate(90deg)' : 'rotate(0deg)',\r\n        flexShrink: 0,\r\n      }}\r\n    >\r\n      <polyline points=\"9 18 15 12 9 6\" />\r\n    </svg>\r\n  );\r\n\r\n  const hasRichRowTooltip = !!rowTooltipContent;\r\n  \r\n  const renderRowContent = (row: T, rowIdx: number, localIndex: number) => {\r\n    const isHovered = hoveredRow === rowIdx;\r\n    const rowKey = keyField ? String(row[keyField]) : rowIdx;\r\n    const useNativeTitle = !hasRichRowTooltip && rowTooltip;\r\n\r\n    const tr = (\r\n      <tr\r\n        key={rowKey}\r\n        tabIndex={onRowClick ? 0 : undefined}\r\n        onClick={onRowClick ? () => onRowClick(row, rowIdx) : undefined}\r\n        onKeyDown={onRowClick ? (e) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onRowClick(row, rowIdx); } } : undefined}\r\n        onMouseEnter={() => setHoveredRow(rowIdx)}\r\n        onMouseLeave={() => setHoveredRow(null)}\r\n        title={useNativeTitle ? rowTooltip(row) : undefined}\r\n        style={{\r\n          cursor: onRowClick ? 'pointer' : 'default',\r\n          backgroundColor: isHovered\r\n            ? addAlpha(tokens.colors.accent.primary, 0.08)\r\n            : striped && localIndex % 2 === 1\r\n              ? addAlpha(tokens.colors.background.surface, 0.5)\r\n              : 'transparent',\r\n          transition: 'background-color 150ms ease',\r\n        }}\r\n      >\r\n        {visibleColumns.map(col => (\r\n          <td\r\n            key={col.key}\r\n            style={{\r\n              padding: cellPadding,\r\n              textAlign: col.align || 'left',\r\n              color: tokens.colors.text.primary,\r\n              borderBottom: `1px solid ${addAlpha(tokens.colors.border.muted, 0.08)}`,\r\n              fontFamily: col.mono ? tokens.typography.fontFamily.mono : 'inherit',\r\n              fontVariantNumeric: col.mono ? 'tabular-nums' : 'normal',\r\n              whiteSpace: 'nowrap',\r\n              overflow: 'hidden',\r\n              textOverflow: 'ellipsis',\r\n              maxWidth: resolveWidth(col.width) || '300px',\r\n            }}\r\n          >\r\n            {renderCellWithTooltip(col, row, rowIdx)}\r\n          </td>\r\n        ))}\r\n      </tr>\r\n    );\r\n\r\n    if (hasRichRowTooltip) {\r\n      const tooltipContent = rowTooltipContent(row, rowIdx);\r\n      if (tooltipContent) {\r\n        return (\r\n          <Tooltip\r\n            key={rowKey}\r\n            content={tooltipContent}\r\n            placement={tooltipPlacement}\r\n            delay={tooltipDelay}\r\n          >\r\n            {tr}\r\n          </Tooltip>\r\n        );\r\n      }\r\n    }\r\n\r\n    return tr;\r\n  };\r\n  \r\n  let globalRowIndex = 0;\r\n  \r\n  return (\r\n    <div\r\n      style={{\r\n        fontFamily: tokens.typography.fontFamily.primary,\r\n        overflow: 'auto',\r\n        WebkitOverflowScrolling: 'touch',\r\n        maxHeight: typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight,\r\n        borderRadius: tokens.borderRadius.md,\r\n        border: tokens.borders.divider,\r\n        ...style,\r\n      }}\r\n    >\r\n      <table\r\n        style={{\r\n          width: '100%',\r\n          borderCollapse: 'collapse',\r\n          fontSize: compact ? tokens.typography.fontSize.xs : tokens.typography.fontSize.sm,\r\n        }}\r\n      >\r\n        {showHeader && (\r\n          <thead>\r\n            <tr>\r\n              {visibleColumns.map(col => (\r\n                <th\r\n                  key={col.key}\r\n                  style={{\r\n                    padding: cellPadding,\r\n                    textAlign: col.align || 'left',\r\n                    fontSize: tokens.typography.fontSize.xxs,\r\n                    fontWeight: tokens.typography.fontWeight.bold,\r\n                    color: tokens.colors.text.tertiary,\r\n                    textTransform: 'uppercase',\r\n                    letterSpacing: '0.06em',\r\n                    backgroundColor: tokens.colors.background.surface,\r\n                    borderBottom: tokens.borders.divider,\r\n                    width: resolveWidth(col.width),\r\n                    position: 'sticky',\r\n                    top: 0,\r\n                    zIndex: 1,\r\n                    whiteSpace: 'nowrap',\r\n                  }}\r\n                >\r\n                  {renderHeaderCell(col)}\r\n                </th>\r\n              ))}\r\n            </tr>\r\n          </thead>\r\n        )}\r\n        \r\n        <tbody>\r\n          {data.length === 0 && (\r\n            <tr>\r\n              <td\r\n                colSpan={visibleColumnCount}\r\n                style={{\r\n                  padding: tokens.spacing.xl,\r\n                  textAlign: 'center',\r\n                  color: tokens.colors.text.tertiary,\r\n                  fontSize: tokens.typography.fontSize.sm,\r\n                }}\r\n              >\r\n                {emptyMessage}\r\n              </td>\r\n            </tr>\r\n          )}\r\n          \r\n          {groups.map(group => {\r\n            const isExpanded = !groupBy || isGroupExpanded(group.key);\r\n            \r\n            return (\r\n              <React.Fragment key={group.key}>\r\n                {groupBy && group.label && (\r\n                  <tr\r\n                    style={{\r\n                      backgroundColor: addAlpha(tokens.colors.accent.primary, 0.08),\r\n                    }}\r\n                  >\r\n                    <td\r\n                      colSpan={visibleColumnCount}\r\n                      style={{\r\n                        padding: 0,\r\n                        borderBottom: tokens.borders.divider,\r\n                      }}\r\n                    >\r\n                      {expandable ? (\r\n                        <button\r\n                          type=\"button\"\r\n                          aria-expanded={isExpanded}\r\n                          onClick={() => toggleGroup(group.key)}\r\n                          style={{\r\n                            display: 'flex',\r\n                            alignItems: 'center',\r\n                            gap: tokens.spacing.xs,\r\n                            width: '100%',\r\n                            padding: cellPadding,\r\n                            margin: 0,\r\n                            border: 'none',\r\n                            background: 'none',\r\n                            cursor: 'pointer',\r\n                            fontWeight: tokens.typography.fontWeight.semibold,\r\n                            color: tokens.colors.text.primary,\r\n                            fontSize: compact ? tokens.typography.fontSize.xs : tokens.typography.fontSize.sm,\r\n                            fontFamily: 'inherit',\r\n                            textAlign: 'left',\r\n                          }}\r\n                        >\r\n                          {chevron(isExpanded)}\r\n                          {group.label}\r\n                          <span style={{\r\n                            fontSize: tokens.typography.fontSize.xxs,\r\n                            color: tokens.colors.text.tertiary,\r\n                            fontWeight: tokens.typography.fontWeight.normal,\r\n                          }}>\r\n                            ({group.rows.length})\r\n                          </span>\r\n                        </button>\r\n                      ) : (\r\n                        <div\r\n                          style={{\r\n                            display: 'flex',\r\n                            alignItems: 'center',\r\n                            gap: tokens.spacing.xs,\r\n                            padding: cellPadding,\r\n                            fontWeight: tokens.typography.fontWeight.semibold,\r\n                            color: tokens.colors.text.primary,\r\n                            fontSize: compact ? tokens.typography.fontSize.xs : tokens.typography.fontSize.sm,\r\n                          }}\r\n                        >\r\n                          {group.label}\r\n                          <span style={{\r\n                            fontSize: tokens.typography.fontSize.xxs,\r\n                            color: tokens.colors.text.tertiary,\r\n                            fontWeight: tokens.typography.fontWeight.normal,\r\n                          }}>\r\n                            ({group.rows.length})\r\n                          </span>\r\n                        </div>\r\n                      )}\r\n                    </td>\r\n                  </tr>\r\n                )}\r\n                \r\n                {isExpanded && group.rows.map((row, localIndex) => {\r\n                  const rowIdx = globalRowIndex++;\r\n                  return renderRowContent(row, rowIdx, localIndex);\r\n                })}\r\n              </React.Fragment>\r\n            );\r\n          })}\r\n        </tbody>\r\n      </table>\r\n    </div>\r\n  );\r\n}) as <T extends Record<string, unknown>>(props: DataTableProps<T>) => React.ReactElement;\r\n\r\nexport default DataTable;\r\n"],"names":["DataTableRowDetail","CellTooltipWrapper","DataTable"],"mappings":"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"}

package/dist/react/core/DataValue.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"DataValue.js","sources":["../../../src/react/core/DataValue.tsx"],"sourcesContent":["/**\n * @zendir/ui - DataValue Component\n * \n * Enterprise-grade data value display with icon, label, value, and status.\n * The building block for telemetry displays, dashboards, and monitoring UIs.\n * \n * AstroUXDS Compliance:\n * - Status colors per AstroUXDS status system\n * - Dual-coding (color + shape) for accessibility via StatusIndicator\n * - Tabular numbers for alignment\n * - Sentence-case labels\n * \n * Features:\n * - Auto-derive status from value + thresholds\n * - Contextual icons from property presets\n * - Multiple layout variants (stacked, inline, compact)\n * - Theme-aware styling\n * \n * @example\n * ```tsx\n * import { DataValue } from '@zendir/ui';\n * \n * // Simple usage with property preset\n * <DataValue property=\"temperature\" value={72.5} />\n * \n * // Custom configuration\n * <DataValue \n *   label=\"Battery\"\n *   value={85}\n *   unit=\"%\"\n *   icon=\"battery-full\"\n *   thresholds={{ critical: 10, caution: 30 }}\n * />\n * \n * // Inline layout\n * <DataValue property=\"voltage\" value={28.4} variant=\"inline\" />\n * ```\n */\n\nimport React, { memo, useMemo } from 'react';\nimport { useTheme } from '../theme';\nimport { AstroIcon, type AstroIconName } from './AstroIcon';\nimport { \n  getPropertyConfig, \n  deriveStatus, \n  formatPropertyValue,\n  type PropertyKey,\n  type StatusThresholds,\n  type PropertyConfig,\n} from './propertyConfig';\nimport type { StatusLevel } from '../utils';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport type DataValueVariant = 'stacked' | 'inline' | 'compact' | 'minimal' | 'card' | 'banner';\nexport type DataValueSize = 'sm' | 'md' | 'lg';\n\nexport interface DataValueProps {\n  /** Property key for auto-configuration (e.g., 'temperature', 'battery') */\n  property?: PropertyKey;\n  /** Display label (overrides property preset) */\n  label?: string;\n  /** Current value */\n  value: number | string | undefined | null;\n  /** Unit of measurement (overrides property preset) */\n  unit?: string;\n  /** Icon name (overrides property preset) */\n  icon?: AstroIconName;\n  /** Show icon */\n  showIcon?: boolean;\n  /** Status thresholds for auto-derivation (overrides property preset) */\n  thresholds?: StatusThresholds;\n  /** Override status (bypasses auto-derivation) */\n  status?: StatusLevel;\n  /** Show status indicator */\n  showStatus?: boolean;\n  /** Precision for number formatting (overrides property preset) */\n  precision?: number;\n  /** Layout variant */\n  variant?: DataValueVariant;\n  /** Size */\n  size?: DataValueSize;\n  /** Custom value color (overrides status color) */\n  color?: string;\n  /** Additional CSS class */\n  className?: string;\n  /** Custom inline styles */\n  style?: React.CSSProperties;\n  /** Click handler */\n  onClick?: () => void;\n  /** Tooltip text */\n  tooltip?: string;\n}\n\n// =============================================================================\n// Astro UX Status Border Colors - Required for light theme WCAG compliance\n// https://www.astrouxds.com/patterns/status-system/\n// =============================================================================\n\nconst STATUS_BORDER_COLORS: Record<StatusLevel, string> = {\n  off: '#3c3e42',\n  standby: '#285766',\n  normal: '#005a00',\n  caution: '#645600',\n  serious: '#664618',\n  critical: '#661102',\n};\n\n// =============================================================================\n// Status Shape SVG - Matches MonitoringIcon exactly\n// - Glow effect in dark mode for visibility\n// - Border in light mode for WCAG AA compliance\n// =============================================================================\n\ninterface StatusShapeProps {\n  status: StatusLevel;\n  size: number;\n  color: string;\n  borderColor?: string;\n  glow?: boolean;\n}\n\nconst StatusShape = ({ status, size, color, borderColor, glow = true }: StatusShapeProps) => {\n  const hasBorder = !!borderColor;\n  const strokeWidth = hasBorder ? 1 : 0;\n  const glowFilter = glow && !hasBorder ? `drop-shadow(0 0 3px ${color})` : undefined;\n  \n  const renderShape = () => {\n    switch (status) {\n      case 'off':\n        return <circle cx=\"6\" cy=\"6\" r={hasBorder ? 2.5 : 3} fill={color} stroke={borderColor} strokeWidth={strokeWidth} />;\n      case 'standby':\n        return <circle cx=\"6\" cy=\"6\" r=\"3.5\" fill=\"none\" stroke={color} strokeWidth=\"2\" />;\n      case 'normal':\n        return (\n          <circle\n            cx=\"6\"\n            cy=\"6\"\n            r={hasBorder ? 4.5 : 5}\n            fill={color}\n            stroke={borderColor}\n            strokeWidth={strokeWidth}\n          />\n        );\n      case 'caution':\n        return (\n          <rect\n            x={hasBorder ? 1.5 : 1}\n            y={hasBorder ? 1.5 : 1}\n            width={hasBorder ? 9 : 10}\n            height={hasBorder ? 9 : 10}\n            fill={color}\n            stroke={borderColor}\n            strokeWidth={strokeWidth}\n          />\n        );\n      case 'serious':\n        return (\n          <polygon\n            points=\"6,1 11,6 6,11 1,6\"\n            fill={color}\n            stroke={borderColor}\n            strokeWidth={strokeWidth}\n          />\n        );\n      case 'critical':\n        return (\n          <polygon\n            points=\"6,11 1,2 11,2\"\n            fill={color}\n            stroke={borderColor}\n            strokeWidth={strokeWidth}\n          />\n        );\n      default:\n        return null;\n    }\n  };\n  \n  return (\n    <svg \n      viewBox=\"0 0 12 12\" \n      width={size} \n      height={size}\n      style={{ filter: glowFilter }}\n    >\n      {renderShape()}\n    </svg>\n  );\n};\n\n// =============================================================================\n// Icon with Status Badge - Enterprise-grade alignment\n// \n// Design System Principles (Apple HIG / Google Material / AstroUXDS):\n// - 4px-based spacing grid for visual harmony\n// - Explicit container sizing prevents layout shift\n// - Status badge positioned at corner, not extending beyond container bounds\n// - Proportional badge sizing: ~35% of icon size for optimal visibility\n// =============================================================================\n\ninterface IconWithBadgeProps {\n  icon: AstroIconName;\n  iconSize: number;\n  iconColor: string;\n  showBadge: boolean;\n  status: StatusLevel;\n  statusColor: string;\n  isLightTheme?: boolean;\n}\n\nconst IconWithBadge = memo(function IconWithBadge({ \n  icon, iconSize, iconColor, showBadge, status, statusColor, isLightTheme = false \n}: IconWithBadgeProps) {\n  // ═══════════════════════════════════════════════════════════════════════════\n  // STATUS BADGE CONTROLS\n  // ═══════════════════════════════════════════════════════════════════════════\n  // BADGE SIZE: Percentage of icon size (0.25 = 25%)\n  const badgeSizeRatio = 0.30;\n  const badgeSize = Math.max(7, Math.min(14, Math.round(iconSize * badgeSizeRatio)));\n  \n  // BADGE POSITION: Offset from top-left corner (negative = away from icon)\n  const badgeOffsetX = -2; // px (negative = left, positive = right)\n  const badgeOffsetY = -2; // px (negative = up, positive = down)\n  \n  // ═══════════════════════════════════════════════════════════════════════════\n  const borderColor = isLightTheme ? STATUS_BORDER_COLORS[status] : undefined;\n  const containerSize = iconSize;\n  \n  return (\n    <div style={{\n      position: 'relative',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      flexShrink: 0,\n      width: containerSize,\n      height: containerSize,\n    }}>\n      <AstroIcon name={icon} size={iconSize} color={iconColor} />\n      {showBadge && (\n        <span style={{\n          position: 'absolute',\n          top: badgeOffsetY,\n          left: badgeOffsetX,\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'center',\n        }}>\n          <StatusShape \n            status={status} \n            size={badgeSize} \n            color={statusColor} \n            borderColor={borderColor}\n            glow={!isLightTheme} \n          />\n        </span>\n      )}\n    </div>\n  );\n});\n\n// =============================================================================\n// DataValue Component\n// =============================================================================\n\nexport const DataValue = memo(function DataValue({\n  property,\n  label: labelProp,\n  value,\n  unit: unitProp,\n  icon: iconProp,\n  showIcon = true,\n  thresholds: thresholdsProp,\n  status: statusProp,\n  showStatus = true,\n  precision: precisionProp,\n  variant = 'stacked',\n  size = 'md',\n  color: colorProp,\n  className = '',\n  style,\n  onClick,\n  tooltip,\n}: DataValueProps): React.ReactElement {\n  const { tokens, mode } = useTheme();\n  const isLightTheme = mode === 'light';\n\n  // Merge property preset with explicit props\n  const config = useMemo((): PropertyConfig => {\n    const preset = property ? getPropertyConfig(property) : {\n      label: labelProp || 'Value',\n      icon: iconProp || 'info',\n      unit: unitProp,\n      precision: precisionProp,\n      thresholds: thresholdsProp,\n    };\n\n    return {\n      ...preset,\n      ...(labelProp !== undefined && { label: labelProp }),\n      ...(iconProp !== undefined && { icon: iconProp }),\n      ...(unitProp !== undefined && { unit: unitProp }),\n      ...(precisionProp !== undefined && { precision: precisionProp }),\n      ...(thresholdsProp !== undefined && { thresholds: thresholdsProp }),\n    };\n  }, [property, labelProp, iconProp, unitProp, precisionProp, thresholdsProp]);\n\n  // Derive or use explicit status\n  const status = useMemo((): StatusLevel => {\n    if (statusProp) return statusProp;\n    if (typeof value === 'number') {\n      return deriveStatus(value, config.thresholds);\n    }\n    return 'normal';\n  }, [statusProp, value, config.thresholds]);\n\n  // Format the value\n  const formattedValue = useMemo((): string => {\n    if (value === undefined || value === null) return '--';\n    if (typeof value === 'string') return value;\n    return formatPropertyValue(value, config);\n  }, [value, config]);\n\n  // Get status color\n  const statusColor = tokens.colors.status[status] || tokens.colors.status.off;\n  const valueColor = colorProp || (showStatus && status !== 'normal' ? statusColor : tokens.colors.text.primary);\n\n  // ==========================================================================\n  // Size Configuration - Uses theme tokens for consistency with other cards\n  // ==========================================================================\n  // Typography uses theme tokens to match SpacecraftCard's DataCell\n  // fontSize.xs = 10px (0.625rem), fontSize.sm = 12px (0.75rem)\n  const sizeConfig = {\n    sm: { \n      iconSize: 16, \n      labelSize: tokens.typography.fontSize.xs,  // 10px - matches DataCell\n      valueSize: tokens.typography.fontSize.sm,  // 12px - matches DataCell\n      lineHeight: 1.4,\n      gap: 6,  // Increased from 4px to 6px for better icon separation with larger icons\n      rowGap: 2, // 2px between label and value\n    },\n    md: { \n      iconSize: 20, \n      labelSize: tokens.typography.fontSize.xs,  // 10px\n      valueSize: tokens.typography.fontSize.base, // 14px\n      lineHeight: 1.4,\n      gap: 10,  // Increased from 8px to 10px\n      rowGap: 2, // 2px between label and value\n    },\n    lg: { \n      iconSize: 24, \n      labelSize: tokens.typography.fontSize.sm,  // 12px\n      valueSize: tokens.typography.fontSize.md,  // 14px\n      lineHeight: 1.4,\n      gap: 14, // Increased from 12px to 14px\n      rowGap: 4, // 4px between label and value\n    },\n  }[size];\n\n  // ==========================================================================\n  // Render Based on Variant\n  // \n  // Layout principles:\n  // - Baseline alignment for inline text\n  // - Consistent icon-to-text spacing\n  // - Symmetrical padding\n  // - Tabular numbers for value alignment in grids\n  // ==========================================================================\n  const renderContent = () => {\n    // Determine if status indicator should show\n    const hasStatus = showStatus && status !== 'normal' && status !== 'off';\n    \n    switch (variant) {\n      // ======================================================================\n      // INLINE: Icon + Label ... Value (space-between)\n      // Best for: Key-value pairs in tables or lists\n      // ======================================================================\n      case 'inline': {\n        return (\n          <div style={{ \n            display: 'flex', \n            alignItems: 'center', \n            justifyContent: 'space-between', \n            gap: sizeConfig.gap * 2,\n            minHeight: sizeConfig.iconSize, // Ensure consistent row height\n          }}>\n            <div style={{ \n              display: 'flex', \n              alignItems: 'center', \n              gap: sizeConfig.gap,\n            }}>\n              {showIcon && config.icon && (\n                <IconWithBadge\n                  icon={config.icon}\n                  iconSize={sizeConfig.iconSize}\n                  iconColor={hasStatus ? statusColor : tokens.colors.text.tertiary}\n                  showBadge={hasStatus}\n                  status={status}\n                  statusColor={statusColor}\n                  isLightTheme={isLightTheme}\n                />\n              )}\n              <span style={{\n                fontSize: sizeConfig.labelSize,\n                lineHeight: sizeConfig.lineHeight,\n                color: tokens.colors.text.secondary,\n                fontWeight: 500,\n                fontFamily: tokens.typography.fontFamily.primary,\n              }}>\n                {config.label}\n              </span>\n            </div>\n            <span style={{\n              fontSize: sizeConfig.valueSize,\n              lineHeight: sizeConfig.lineHeight,\n              fontWeight: 500, // Match SpacecraftCard DataCell\n              fontFamily: tokens.typography.fontFamily.mono,\n              fontVariantNumeric: 'tabular-nums',\n              color: valueColor,\n            }}>\n              {formattedValue}\n            </span>\n          </div>\n        );\n      }\n\n      // ======================================================================\n      // COMPACT: Icon + Value (horizontal, no label)\n      // Best for: Dense displays, status bars, compact dashboards\n      // ======================================================================\n      case 'compact': {\n        return (\n          <div style={{ \n            display: 'flex', \n            alignItems: 'center', \n            gap: sizeConfig.gap,\n            minHeight: sizeConfig.iconSize,\n          }}>\n            {showIcon && config.icon && (\n              <IconWithBadge\n                icon={config.icon}\n                iconSize={sizeConfig.iconSize}\n                iconColor={hasStatus ? statusColor : tokens.colors.text.tertiary}\n                showBadge={hasStatus}\n                status={status}\n                statusColor={statusColor}\n                isLightTheme={isLightTheme}\n              />\n            )}\n            <span style={{\n              fontSize: sizeConfig.valueSize,\n              lineHeight: sizeConfig.lineHeight,\n              fontWeight: 500, // Match SpacecraftCard DataCell\n              fontFamily: tokens.typography.fontFamily.mono,\n              fontVariantNumeric: 'tabular-nums',\n              color: valueColor,\n            }}>\n              {formattedValue}\n            </span>\n          </div>\n        );\n      }\n\n      // ======================================================================\n      // MINIMAL: Value only (no icon, no label)\n      // Best for: Inline values, table cells\n      // ======================================================================\n      case 'minimal':\n        return (\n          <span style={{\n            fontSize: sizeConfig.valueSize,\n            lineHeight: sizeConfig.lineHeight,\n            fontWeight: 500, // Match SpacecraftCard DataCell\n            fontFamily: tokens.typography.fontFamily.mono,\n            fontVariantNumeric: 'tabular-nums',\n            color: valueColor,\n          }}>\n            {formattedValue}\n          </span>\n        );\n\n      // ======================================================================\n      // CARD: Icon EXACTLY matches 2-row text height\n      // Best for: Dashboard tiles, prominent metrics\n      // ======================================================================\n      case 'card': {\n        // ═══════════════════════════════════════════════════════════════════════════\n        // 2-ROW LAYOUT CONTROLS (card variant)\n        // ═══════════════════════════════════════════════════════════════════════════\n        // ICON MULTIPLIER: Scale factor (0.5 = half, 1.0 = match text height, 1.5 = 150%)\n        const iconMultiplier = 0.7;\n        \n        // GAP: Pixels between icon and text column\n        const iconToTextGap = 4; // px\n        \n        // ═══════════════════════════════════════════════════════════════════════════\n        const baseSize = { sm: 26, md: 32, lg: 40 }[size];\n        const iconSize = Math.round(baseSize * iconMultiplier);\n        \n        return (\n          <div style={{ \n            display: 'flex', \n            alignItems: 'center',\n            gap: iconToTextGap,\n          }}>\n            {showIcon && config.icon && (\n              <IconWithBadge\n                icon={config.icon}\n                iconSize={iconSize}\n                iconColor={hasStatus ? statusColor : tokens.colors.text.tertiary}\n                showBadge={hasStatus}\n                status={status}\n                statusColor={statusColor}\n                isLightTheme={isLightTheme}\n              />\n            )}\n            <div style={{ \n              display: 'flex', \n              flexDirection: 'column', \n              justifyContent: 'space-between', // Distribute label/value to edges\n              gap: sizeConfig.rowGap, \n              minWidth: 0,\n            }}>\n              <span style={{\n                fontSize: sizeConfig.labelSize,\n                lineHeight: sizeConfig.lineHeight,\n                color: tokens.colors.text.secondary,\n                fontWeight: 500,\n                fontFamily: tokens.typography.fontFamily.primary,\n              }}>\n                {config.label}\n              </span>\n              <span style={{\n                fontSize: sizeConfig.valueSize,\n                lineHeight: sizeConfig.lineHeight,\n                fontWeight: 500, // Match SpacecraftCard DataCell\n                fontFamily: tokens.typography.fontFamily.mono,\n                fontVariantNumeric: 'tabular-nums',\n                color: valueColor,\n              }}>\n                {formattedValue}\n              </span>\n            </div>\n          </div>\n        );\n      }\n\n      // ======================================================================\n      // BANNER: Label on top, icon left-aligned + value right-aligned below\n      // Best for: TopBar metrics, KPI tiles where heading spans full width\n      // ======================================================================\n      case 'banner': {\n        const bannerIconSize = { sm: 18, md: 22, lg: 28 }[size];\n        return (\n          <div style={{ display: 'flex', flexDirection: 'column', gap: sizeConfig.rowGap, minWidth: 0, width: '100%' }}>\n            <span style={{\n              fontSize: sizeConfig.labelSize,\n              lineHeight: sizeConfig.lineHeight,\n              color: tokens.colors.text.secondary,\n              fontWeight: 500,\n              fontFamily: tokens.typography.fontFamily.primary,\n              textTransform: 'uppercase' as const,\n              letterSpacing: '0.5px',\n            }}>\n              {config.label}\n            </span>\n            <div style={{\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'flex-start',\n              width: '100%',\n              gap: 6,\n              minWidth: 0,\n            }}>\n              {showIcon && config.icon && (\n                <IconWithBadge\n                  icon={config.icon}\n                  iconSize={bannerIconSize}\n                  iconColor={hasStatus ? statusColor : tokens.colors.text.tertiary}\n                  showBadge={hasStatus}\n                  status={status}\n                  statusColor={statusColor}\n                  isLightTheme={isLightTheme}\n                />\n              )}\n              <span style={{\n                fontSize: sizeConfig.valueSize,\n                lineHeight: sizeConfig.lineHeight,\n                fontWeight: 600,\n                fontFamily: tokens.typography.fontFamily.mono,\n                fontVariantNumeric: 'tabular-nums',\n                color: valueColor,\n                textAlign: 'left',\n              }}>\n                {formattedValue}\n              </span>\n            </div>\n          </div>\n        );\n      }\n\n      // ======================================================================\n      // STACKED (default): Icon EXACTLY matches 2-row text height\n      // Best for: General telemetry displays, standard data values\n      // ======================================================================\n      case 'stacked':\n      default: {\n        // ═══════════════════════════════════════════════════════════════════════════\n        // 2-ROW LAYOUT CONTROLS (stacked variant)\n        // ═══════════════════════════════════════════════════════════════════════════\n        // ICON MULTIPLIER: Scale factor (0.5 = half, 1.0 = match text height, 1.5 = 150%)\n        const iconMultiplier = 0.7;\n        \n        // GAP: Pixels between icon and text column\n        const iconToTextGap = 4; // px\n        \n        // ═══════════════════════════════════════════════════════════════════════════\n        const baseSize = { sm: 26, md: 32, lg: 40 }[size];\n        const iconSize = Math.round(baseSize * iconMultiplier);\n        \n        return (\n          <div style={{ \n            display: 'flex', \n            alignItems: 'center',\n            gap: iconToTextGap,\n          }}>\n            {showIcon && config.icon && (\n              <IconWithBadge\n                icon={config.icon}\n                iconSize={iconSize}\n                iconColor={hasStatus ? statusColor : tokens.colors.text.tertiary}\n                showBadge={hasStatus}\n                status={status}\n                statusColor={statusColor}\n                isLightTheme={isLightTheme}\n              />\n            )}\n            <div style={{ \n              display: 'flex', \n              flexDirection: 'column', \n              justifyContent: 'space-between', // Distribute label/value to edges\n              gap: sizeConfig.rowGap, \n              minWidth: 0,\n            }}>\n              <span style={{\n                fontSize: sizeConfig.labelSize,\n                lineHeight: sizeConfig.lineHeight,\n                color: tokens.colors.text.secondary,\n                fontWeight: 500,\n                fontFamily: tokens.typography.fontFamily.primary,\n              }}>\n                {config.label}\n              </span>\n              <span style={{\n                fontSize: sizeConfig.valueSize,\n                lineHeight: sizeConfig.lineHeight,\n                fontWeight: 500, // Match SpacecraftCard DataCell\n                fontFamily: tokens.typography.fontFamily.mono,\n                fontVariantNumeric: 'tabular-nums',\n                color: valueColor,\n              }}>\n                {formattedValue}\n              </span>\n            </div>\n          </div>\n        );\n      }\n    }\n  };\n\n  return (\n    <div\n      className={`zendir-data-value zendir-data-value--${variant} zendir-data-value--${size} ${className}`}\n      style={{\n        cursor: onClick ? 'pointer' : 'default',\n        ...(variant === 'banner' ? { flex: 1, minWidth: 0 } : {}),\n        ...style,\n      }}\n      onClick={onClick}\n      title={tooltip || config.description}\n      role={onClick ? 'button' : undefined}\n      tabIndex={onClick ? 0 : undefined}\n      onKeyDown={onClick ? (e) => e.key === 'Enter' && onClick() : undefined}\n    >\n      {renderContent()}\n    </div>\n  );\n});\n\n// =============================================================================\n// DataValueGroup Component\n// =============================================================================\n\nexport interface DataValueGroupProps {\n  /** Title for the group */\n  title?: string;\n  /** Icon for the title */\n  icon?: AstroIconName;\n  /** Layout direction */\n  direction?: 'row' | 'column' | 'grid';\n  /** Number of columns for grid layout */\n  columns?: number;\n  /** Gap between items */\n  gap?: 'sm' | 'md' | 'lg';\n  /** Children DataValue components */\n  children: React.ReactNode;\n  /** Additional CSS class */\n  className?: string;\n  /** Custom inline styles */\n  style?: React.CSSProperties;\n}\n\nexport const DataValueGroup = memo(function DataValueGroup({\n  title,\n  icon,\n  direction = 'grid',\n  columns = 2,\n  gap = 'md',\n  children,\n  className = '',\n  style,\n}: DataValueGroupProps): React.ReactElement {\n  const { tokens } = useTheme();\n\n  // Gap sizing on 4px grid\n  const gapSize = {\n    sm: 8,  // 2 × 4px\n    md: 16, // 4 × 4px\n    lg: 24, // 6 × 4px\n  }[gap];\n\n  const layoutStyles: Record<typeof direction, React.CSSProperties> = {\n    row: { \n      display: 'flex', \n      flexDirection: 'row' as const, \n      flexWrap: 'wrap' as const, \n      gap: gapSize,\n      alignItems: 'flex-start',\n    },\n    column: { \n      display: 'flex', \n      flexDirection: 'column' as const, \n      gap: gapSize,\n    },\n    grid: { \n      display: 'grid', \n      gridTemplateColumns: `repeat(${columns}, 1fr)`, \n      gap: gapSize,\n      alignItems: 'start',\n    },\n  };\n  const layoutStyle = layoutStyles[direction];\n\n  return (\n    <div className={`zendir-data-value-group ${className}`} style={style}>\n      {title && (\n        <div style={{\n          display: 'flex',\n          alignItems: 'center',\n          gap: 6, // 6px gap for tight header\n          marginBottom: 12, // 3 × 4px\n          paddingBottom: 8, // 2 × 4px\n          borderBottom: `1px solid ${tokens.colors.border.muted}`,\n        }}>\n          {icon && (\n            <AstroIcon \n              name={icon} \n              size={14} \n              color={tokens.colors.text.tertiary}\n              style={{ flexShrink: 0 }}\n            />\n          )}\n          <span style={{\n            fontSize: '12px',\n            fontWeight: 500,\n            color: tokens.colors.text.secondary,\n            textTransform: 'uppercase',\n            letterSpacing: '0.5px',\n          }}>\n            {title}\n          </span>\n        </div>\n      )}\n      <div style={layoutStyle}>\n        {children}\n      </div>\n    </div>\n  );\n});\n\nexport default DataValue;\n"],"names":["IconWithBadge","DataValue","DataValueGroup"],"mappings":"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"}

package/dist/react/core/Dialog.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Dialog.js","sources":["../../../src/react/core/Dialog.tsx"],"sourcesContent":["/**\n * @zendir/ui - Dialog/Modal Component\n * \n * Modal dialog following Astro UX Design System.\n * \n * @example\n * ```tsx\n * <Dialog\n *   open={isOpen}\n *   onClose={() => setIsOpen(false)}\n *   title=\"Confirm Action\"\n * >\n *   <p>Are you sure you want to proceed?</p>\n *   <Dialog.Actions>\n *     <Button variant=\"secondary\" onClick={() => setIsOpen(false)}>Cancel</Button>\n *     <Button onClick={handleConfirm}>Confirm</Button>\n *   </Dialog.Actions>\n * </Dialog>\n * ```\n */\n\nimport React, { memo, useEffect, useRef, useCallback, useId } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useTheme } from '../theme';\nimport { classNames } from '../utils';\n\nexport type DialogSize = 'small' | 'medium' | 'large' | 'fullscreen';\n\nexport interface DialogProps {\n  /** Open state */\n  open: boolean;\n  /** Close handler */\n  onClose: () => void;\n  /** Dialog title */\n  title?: string;\n  /** Size variant */\n  size?: DialogSize;\n  /** Show close button */\n  showCloseButton?: boolean;\n  /** Close on backdrop click */\n  closeOnBackdropClick?: boolean;\n  /** Close on escape key */\n  closeOnEscape?: boolean;\n  /** Children */\n  children: React.ReactNode;\n  /** Custom className */\n  className?: string;\n}\n\nexport interface DialogActionsProps {\n  children: React.ReactNode;\n  align?: 'left' | 'center' | 'right';\n}\n\nconst DialogActions = memo(function DialogActions({\n  children,\n  align = 'right',\n}: DialogActionsProps): React.ReactElement {\n  const { tokens } = useTheme();\n  \n  return (\n    <div\n      style={{\n        display: 'flex',\n        justifyContent: align === 'left' ? 'flex-start' : align === 'right' ? 'flex-end' : 'center',\n        gap: tokens.spacing.sm,\n        marginTop: tokens.spacing.lg,\n        paddingTop: tokens.spacing.md,\n        borderTop: tokens.borders.divider,\n      }}\n    >\n      {children}\n    </div>\n  );\n});\n\nexport const Dialog = memo(function Dialog({\n  open,\n  onClose,\n  title,\n  size = 'medium',\n  showCloseButton = true,\n  closeOnBackdropClick = true,\n  closeOnEscape = true,\n  children,\n  className = '',\n}: DialogProps): React.ReactElement | null {\n  const { tokens, theme } = useTheme();\n  const isTransparentTheme = theme === 'transparent' || theme === 'transparent-bold' || theme === 'transparent-minimal';\n  const dialogRef = useRef<HTMLDivElement>(null);\n  const previousActiveElement = useRef<HTMLElement | null>(null);\n  const titleId = useId();\n  const DIALOG_Z_INDEX = 2147483000;\n  \n  const sizeConfig = {\n    small: { width: 'min(360px, calc(100vw - 32px))', maxHeight: '80vh' },\n    medium: { width: 'min(540px, calc(100vw - 32px))', maxHeight: '80vh' },\n    large: { width: 'min(800px, calc(100vw - 32px))', maxHeight: '90vh' },\n    fullscreen: { width: '100vw', maxHeight: '100vh' },\n  };\n  const config = sizeConfig[size];\n  \n  // Handle escape key\n  const handleKeyDown = useCallback((e: KeyboardEvent) => {\n    if (closeOnEscape && e.key === 'Escape') {\n      onClose();\n    }\n  }, [closeOnEscape, onClose]);\n  \n  // Focus trap and escape key\n  useEffect(() => {\n    if (open) {\n      previousActiveElement.current = document.activeElement as HTMLElement;\n      document.body.style.overflow = 'hidden';\n      document.addEventListener('keydown', handleKeyDown);\n      \n      // Focus first focusable element\n      const focusTimer = setTimeout(() => {\n        const focusable = dialogRef.current?.querySelector<HTMLElement>(\n          'button, [href], input, select, textarea, [tabindex]:not([tabindex=\"-1\"])'\n        );\n        focusable?.focus();\n      }, 0);\n      \n      return () => {\n        clearTimeout(focusTimer);\n        document.body.style.overflow = '';\n        document.removeEventListener('keydown', handleKeyDown);\n        previousActiveElement.current?.focus();\n      };\n    }\n  }, [open, handleKeyDown]);\n  \n  if (!open) return null;\n  if (typeof document === 'undefined') return null;\n\n  return createPortal((\n    <div\n      className={classNames('zendir-dialog-backdrop', className)}\n      onClick={closeOnBackdropClick ? onClose : undefined}\n      style={{\n        position: 'fixed',\n        inset: 0,\n        backgroundColor: isTransparentTheme ? `${tokens.colors.background.base}66` : `${tokens.colors.background.base}99`,\n        backdropFilter: isTransparentTheme ? 'blur(4px)' : undefined,\n        WebkitBackdropFilter: isTransparentTheme ? 'blur(4px)' : undefined,\n        display: 'flex',\n        alignItems: size === 'fullscreen' ? 'stretch' : 'center',\n        justifyContent: 'center',\n        zIndex: DIALOG_Z_INDEX,\n        animation: `zendir-dialog-backdrop ${tokens.animation.duration.normal}ms ${tokens.animation.easing.default} both`,\n      }}\n    >\n      <div\n        ref={dialogRef}\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-labelledby={title ? titleId : undefined}\n        className=\"zendir-dialog\"\n        onClick={(e) => e.stopPropagation()}\n        style={{\n          width: config.width,\n          maxWidth: size === 'fullscreen' ? '100vw' : 'calc(100vw - 32px)',\n          maxHeight: config.maxHeight,\n          backgroundColor: isTransparentTheme ? 'rgba(139, 92, 246, 0.08)' : tokens.colors.background.surface,\n          ...(isTransparentTheme && { backdropFilter: 'blur(16px)', WebkitBackdropFilter: 'blur(16px)', border: '1px solid rgba(139, 92, 246, 0.2)' }),\n          borderRadius: size === 'fullscreen' ? 0 : tokens.borderRadius.lg,\n          boxShadow: tokens.shadows.xl,\n          display: 'flex',\n          flexDirection: 'column',\n          overflow: 'hidden',\n          animation: `zendir-dialog-panel ${tokens.animation.duration.normal}ms ${tokens.animation.easing.default} both`,\n        }}\n      >\n        {/* Header */}\n        {(title || showCloseButton) && (\n          <div\n            style={{\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'space-between',\n              padding: `${tokens.spacing.md} ${tokens.spacing.lg}`,\n              borderBottom: tokens.borders.divider,\n            }}\n          >\n            {title && (\n              <h2\n                id={titleId}\n                style={{\n                  margin: 0,\n                  fontSize: tokens.typography.fontSize.lg,\n                  fontWeight: tokens.typography.fontWeight.semibold,\n                  color: tokens.colors.text.primary,\n                }}\n              >\n                {title}\n              </h2>\n            )}\n            {showCloseButton && (\n              <button\n                type=\"button\"\n                onClick={onClose}\n                aria-label=\"Close dialog\"\n                style={{\n                  padding: tokens.spacing.sm,\n                  minWidth: 44,\n                  minHeight: 44,\n                  backgroundColor: 'transparent',\n                  border: 'none',\n                  borderRadius: tokens.borderRadius.sm,\n                  cursor: 'pointer',\n                  color: tokens.colors.text.muted ?? tokens.colors.text.tertiary,\n                  display: 'flex',\n                  alignItems: 'center',\n                  justifyContent: 'center',\n                  transition: `color ${tokens.animation.fast}`,\n                }}\n                onMouseEnter={(e) => {\n                  e.currentTarget.style.color = tokens.colors.text.primary;\n                }}\n                onMouseLeave={(e) => {\n                  e.currentTarget.style.color = tokens.colors.text.muted ?? tokens.colors.text.tertiary;\n                }}\n              >\n                <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n                  <path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\" />\n                </svg>\n              </button>\n            )}\n          </div>\n        )}\n        \n        {/* Content */}\n        <div\n          style={{\n            flex: 1,\n            padding: tokens.spacing.lg,\n            overflow: 'auto',\n          }}\n        >\n          {children}\n        </div>\n      </div>\n      \n      <style>\n        {`\n          @keyframes zendir-dialog-backdrop { from { opacity: 0; } to { opacity: 1; } }\n          @keyframes zendir-dialog-panel { from { transform: scale(0.96); opacity: 0; } to { transform: scale(1); opacity: 1; } }\n        `}\n      </style>\n    </div>\n  ), document.body);\n}) as React.NamedExoticComponent<DialogProps> & {\n  Actions: typeof DialogActions;\n};\n\n// Attach subcomponent\n(Dialog as any).Actions = DialogActions;\n\nexport default Dialog;\n"],"names":["DialogActions","Dialog"],"mappings":"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"}

package/dist/react/core/FileExplorer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FileExplorer.js","sources":["../../../src/react/core/FileExplorer.tsx"],"sourcesContent":["/**\n * @zendir/ui - FileExplorer Component\n * \n * Hierarchical file browser for mission data management and file operations.\n * Supports tree navigation, file actions (download, delete, upload),\n * search, breadcrumbs, and multiple selection.\n * \n * Features:\n * - Tree view and list view modes\n * - Breadcrumb navigation\n * - File type icons\n * - Search/filter\n * - Multi-select with checkboxes\n * - File actions (open, download, delete, rename)\n * - Upload dropzone\n * - File size and modified date display\n * - Sort by name, size, date\n * \n * @example\n * ```tsx\n * <FileExplorer\n *   files={fileTree}\n *   onFileOpen={(file) => console.log('Open:', file)}\n *   onFileDownload={(file) => console.log('Download:', file)}\n * />\n * ```\n */\n\nimport React, { useState, useCallback, useMemo, memo } from 'react';\nimport { useTheme } from '../theme';\nimport { AstroIcon, type AstroIconName } from './AstroIcon';\n\n// =============================================================================\n// Types\n// =============================================================================\n\nexport interface FileNode {\n  /** File/folder name */\n  name: string;\n  /** Full path */\n  path: string;\n  /** Whether this is a directory */\n  isDirectory: boolean;\n  /** File size in bytes (for files) */\n  size?: number;\n  /** Last modified date */\n  modified?: string | Date;\n  /** MIME type */\n  mimeType?: string;\n  /** Children (for directories) */\n  children?: FileNode[];\n  /** Custom icon name */\n  icon?: string;\n  /** Whether the file is readonly */\n  readonly?: boolean;\n}\n\nexport type FileViewMode = 'tree' | 'list';\nexport type FileSortBy = 'name' | 'size' | 'modified';\nexport type FileSortDir = 'asc' | 'desc';\n\nexport interface FileExplorerProps {\n  /** Root file tree */\n  files: FileNode[];\n  /** Height (default: 500) */\n  height?: number | string;\n  /** Title */\n  title?: string;\n  /** View mode (default: 'list') */\n  viewMode?: FileViewMode;\n  /** Show search bar (default: true) */\n  showSearch?: boolean;\n  /** Show breadcrumbs (default: true) */\n  showBreadcrumbs?: boolean;\n  /** Show file details (size, date) (default: true) */\n  showDetails?: boolean;\n  /** Allow multi-select (default: false) */\n  multiSelect?: boolean;\n  /** Allow upload (default: false) */\n  allowUpload?: boolean;\n  /** Allow delete (default: false) */\n  allowDelete?: boolean;\n  /** Called when a file is opened/double-clicked */\n  onFileOpen?: (file: FileNode) => void;\n  /** Called when download is requested */\n  onFileDownload?: (file: FileNode) => void;\n  /** Called when delete is requested */\n  onFileDelete?: (files: FileNode[]) => void;\n  /** Called when files are uploaded */\n  onFileUpload?: (files: File[], targetPath: string) => void;\n  /** Called when selection changes */\n  onSelectionChange?: (files: FileNode[]) => void;\n  /** CSS class */\n  className?: string;\n  /** Show outer container border (default: true). Set false when embedded inside a Container/card. */\n  bordered?: boolean;\n  /** Custom style overrides for the outer container */\n  style?: React.CSSProperties;\n}\n\n// =============================================================================\n// Helpers\n// =============================================================================\n\nfunction formatFileSize(bytes?: number): string {\n  if (bytes === undefined || bytes === null) return '—';\n  if (bytes === 0) return '0 B';\n  const units = ['B', 'KB', 'MB', 'GB', 'TB'];\n  const i = Math.floor(Math.log(bytes) / Math.log(1024));\n  return `${(bytes / Math.pow(1024, i)).toFixed(i > 0 ? 1 : 0)} ${units[i]}`;\n}\n\nfunction formatDate(date?: string | Date): string {\n  if (!date) return '—';\n  const d = typeof date === 'string' ? new Date(date) : date;\n  if (isNaN(d.getTime())) return String(date);\n  return d.toLocaleDateString('en-US', { month: 'short', day: '2-digit', year: 'numeric' }) + ' '\n    + d.toLocaleTimeString('en-US', { hour12: false, hour: '2-digit', minute: '2-digit' });\n}\n\nfunction getFileIconName(file: FileNode): AstroIconName {\n  if (file.isDirectory) return 'folder';\n  const ext = file.name.split('.').pop()?.toLowerCase() ?? '';\n  const iconMap: Record<string, AstroIconName> = {\n    rb: 'code', py: 'code', js: 'code', ts: 'code', jsx: 'code', tsx: 'code',\n    json: 'insert-drive-file', yaml: 'insert-drive-file', yml: 'insert-drive-file',\n    xml: 'insert-drive-file', csv: 'table-chart', txt: 'short-text',\n    md: 'description', log: 'insert-drive-file', gz: 'archive', zip: 'archive', tar: 'archive',\n    bin: 'storage', dat: 'storage', png: 'image', jpg: 'image', gif: 'image', svg: 'image',\n    pdf: 'picture-as-pdf', doc: 'insert-drive-file', xls: 'table-chart', ppt: 'insert-drive-file',\n  };\n  return iconMap[ext] || 'insert-drive-file';\n}\n\nfunction flattenVisible(\n  files: FileNode[],\n  expanded: Set<string>,\n  depth: number = 0,\n): { file: FileNode; depth: number }[] {\n  const result: { file: FileNode; depth: number }[] = [];\n  for (const f of files) {\n    result.push({ file: f, depth });\n    if (f.isDirectory && expanded.has(f.path) && f.children) {\n      result.push(...flattenVisible(f.children, expanded, depth + 1));\n    }\n  }\n  return result;\n}\n\nfunction filterFiles(files: FileNode[], query: string): FileNode[] {\n  const q = query.toLowerCase();\n  return files.reduce<FileNode[]>((acc, f) => {\n    if (f.isDirectory && f.children) {\n      const filteredChildren = filterFiles(f.children, query);\n      if (filteredChildren.length > 0 || f.name.toLowerCase().includes(q)) {\n        acc.push({ ...f, children: filteredChildren });\n      }\n    } else if (f.name.toLowerCase().includes(q)) {\n      acc.push(f);\n    }\n    return acc;\n  }, []);\n}\n\nfunction sortFiles(files: FileNode[], sortBy: FileSortBy, sortDir: FileSortDir): FileNode[] {\n  const sorted = [...files].sort((a, b) => {\n    // Directories first\n    if (a.isDirectory !== b.isDirectory) return a.isDirectory ? -1 : 1;\n    let cmp = 0;\n    if (sortBy === 'name') cmp = a.name.localeCompare(b.name);\n    else if (sortBy === 'size') cmp = (a.size ?? 0) - (b.size ?? 0);\n    else if (sortBy === 'modified') {\n      const da = a.modified ? new Date(a.modified).getTime() : 0;\n      const db = b.modified ? new Date(b.modified).getTime() : 0;\n      cmp = da - db;\n    }\n    return sortDir === 'asc' ? cmp : -cmp;\n  });\n  return sorted.map(f => f.isDirectory && f.children\n    ? { ...f, children: sortFiles(f.children, sortBy, sortDir) }\n    : f\n  );\n}\n\n// =============================================================================\n// Component\n// =============================================================================\n\nexport const FileExplorer = memo(function FileExplorer({\n  files,\n  height = 500,\n  title,\n  viewMode: initialViewMode = 'list',\n  showSearch = true,\n  showBreadcrumbs = true,\n  showDetails = true,\n  multiSelect = false,\n  allowUpload = false,\n  allowDelete = false,\n  onFileOpen,\n  onFileDownload: _onFileDownload,\n  onFileDelete,\n  onFileUpload,\n  onSelectionChange: _onSelectionChange,\n  className = '',\n  bordered = true,\n  style: styleProp,\n}: FileExplorerProps): React.ReactElement {\n  const { tokens, theme } = useTheme();\n  const isTransparentTheme =\n    theme === 'transparent' || theme === 'transparent-bold' || theme === 'transparent-minimal';\n  const [expanded, setExpanded] = useState<Set<string>>(new Set());\n  const [selected, setSelected] = useState<Set<string>>(new Set());\n  const [currentPath, setCurrentPath] = useState<string[]>([]);\n  const [searchQuery, setSearchQuery] = useState('');\n  const [sortBy, setSortBy] = useState<FileSortBy>('name');\n  const [sortDir, setSortDir] = useState<FileSortDir>('asc');\n  const [isDragging, setIsDragging] = useState(false);\n  const [scrollTop, setScrollTop] = useState(0);\n  const [viewportHeight, setViewportHeight] = useState(240);\n  const listRef = React.useRef<HTMLDivElement>(null);\n\n  const processedFiles = useMemo(() => {\n    let result = files;\n    if (searchQuery.trim()) result = filterFiles(result, searchQuery);\n    return sortFiles(result, sortBy, sortDir);\n  }, [files, searchQuery, sortBy, sortDir]);\n\n  // Navigate to directory by breadcrumb\n  const currentFiles = useMemo(() => {\n    let current = processedFiles;\n    for (const dir of currentPath) {\n      const found = current.find(f => f.isDirectory && f.name === dir);\n      if (found && found.children) current = found.children;\n      else break;\n    }\n    return current;\n  }, [processedFiles, currentPath]);\n\n  const visibleItems = useMemo(() => {\n    if (initialViewMode === 'tree') return flattenVisible(processedFiles, expanded);\n    return currentFiles.map(f => ({ file: f, depth: 0 }));\n  }, [processedFiles, expanded, currentFiles, initialViewMode]);\n\n  const toggleExpand = useCallback((path: string) => {\n    setExpanded(prev => {\n      const next = new Set(prev);\n      if (next.has(path)) next.delete(path);\n      else next.add(path);\n      return next;\n    });\n  }, []);\n\n  const toggleSelect = useCallback((path: string) => {\n    setSelected(prev => {\n      const next = new Set(prev);\n      if (next.has(path)) next.delete(path);\n      else {\n        if (!multiSelect) next.clear();\n        next.add(path);\n      }\n      return next;\n    });\n  }, [multiSelect]);\n\n  const handleFileClick = useCallback((file: FileNode) => {\n    if (file.isDirectory) {\n      if (initialViewMode === 'list') {\n        setCurrentPath(prev => [...prev, file.name]);\n      } else {\n        toggleExpand(file.path);\n      }\n    } else {\n      toggleSelect(file.path);\n    }\n  }, [initialViewMode, toggleExpand, toggleSelect]);\n\n  const handleFileDoubleClick = useCallback((file: FileNode) => {\n    if (!file.isDirectory) onFileOpen?.(file);\n  }, [onFileOpen]);\n\n  const navigateTo = useCallback((idx: number) => {\n    setCurrentPath(prev => prev.slice(0, idx));\n  }, []);\n\n  const handleDrop = useCallback((e: React.DragEvent) => {\n    e.preventDefault();\n    setIsDragging(false);\n    if (!allowUpload || !onFileUpload) return;\n    const droppedFiles = Array.from(e.dataTransfer.files);\n    if (droppedFiles.length > 0) {\n      onFileUpload(droppedFiles, '/' + currentPath.join('/'));\n    }\n  }, [allowUpload, onFileUpload, currentPath]);\n\n  const handleSort = useCallback((col: FileSortBy) => {\n    if (sortBy === col) setSortDir(d => d === 'asc' ? 'desc' : 'asc');\n    else { setSortBy(col); setSortDir('asc'); }\n  }, [sortBy]);\n\n  const selectedFiles = useMemo(() =>\n    visibleItems.filter(v => selected.has(v.file.path)).map(v => v.file),\n  [visibleItems, selected]);\n  const rowHeightPx = Number.parseInt(String(tokens.elementSize.sm), 10) || 32;\n  const overscanRows = 12;\n  const totalRows = visibleItems.length;\n  const startRow = Math.max(0, Math.floor(scrollTop / rowHeightPx) - overscanRows);\n  const visibleRows = Math.ceil(viewportHeight / rowHeightPx) + overscanRows * 2;\n  const endRow = Math.min(totalRows, startRow + visibleRows);\n  const virtualVisibleItems = useMemo(\n    () => visibleItems.slice(startRow, endRow),\n    [visibleItems, startRow, endRow],\n  );\n\n  React.useEffect(() => {\n    const el = listRef.current;\n    if (!el) return undefined;\n\n    const updateHeight = () => setViewportHeight(Math.max(rowHeightPx * 4, el.clientHeight || 240));\n    updateHeight();\n\n    if (typeof ResizeObserver !== 'undefined') {\n      const observer = new ResizeObserver(updateHeight);\n      observer.observe(el);\n      return () => observer.disconnect();\n    }\n\n    window.addEventListener('resize', updateHeight);\n    return () => window.removeEventListener('resize', updateHeight);\n  }, [rowHeightPx]);\n\n  return (\n    <div\n      className={`file-explorer ${className}`}\n      style={{\n        height: typeof height === 'number' ? height : undefined,\n        background: tokens.colors.background.base,\n        ...(bordered ? (tokens.colors.border.cardStyle ?? { border: `1px solid ${tokens.colors.border.muted}` }) : { border: 'none' }),\n        borderRadius: tokens.borderRadius.lg,\n        overflow: 'hidden',\n        display: 'flex',\n        flexDirection: 'column',\n        fontFamily: tokens.typography.fontFamily.primary,\n        color: tokens.colors.text.primary,\n        backdropFilter: isTransparentTheme ? 'blur(10px)' : undefined,\n        WebkitBackdropFilter: isTransparentTheme ? 'blur(10px)' : undefined,\n        ...styleProp,\n      }}\n    >\n      {/* Header */}\n      <div style={{\n        padding: `${tokens.spacing.sm} ${tokens.spacing.smd}`,\n        borderBottom: `1px solid ${tokens.colors.border.muted}`,\n        background: tokens.colors.background.surface,\n        backdropFilter: 'blur(8px)',\n        display: 'flex', alignItems: 'center', justifyContent: 'space-between',\n      }}>\n        <span style={{ fontWeight: tokens.typography.fontWeight.medium, fontSize: tokens.typography.fontSize.sm }}>{title || 'File Explorer'}</span>\n        <div style={{ display: 'flex', gap: tokens.spacing.sm }}>\n          {allowUpload && (\n            <button aria-label=\"Upload files\" style={{\n              background: tokens.colors.interactive.default,\n              color: tokens.colors.text.inverse, border: 'none', borderRadius: tokens.borderRadius.md,\n              padding: `${tokens.spacing.xs} ${tokens.spacing.smd}`, fontSize: tokens.typography.fontSize.xxs, cursor: 'pointer',\n              fontWeight: tokens.typography.fontWeight.medium,\n              transition: 'opacity 150ms ease',\n            }}>\n              Upload\n            </button>\n          )}\n          {allowDelete && selectedFiles.length > 0 && (\n            <button\n              onClick={() => onFileDelete?.(selectedFiles)}\n              aria-label={`Delete ${selectedFiles.length} selected files`}\n              style={{\n                background: `${tokens.colors.status.critical}22`,\n                color: tokens.colors.status.critical,\n                border: `1px solid ${tokens.colors.status.critical}44`,\n                borderRadius: tokens.borderRadius.md, padding: `${tokens.spacing.xs} ${tokens.spacing.smd}`, fontSize: tokens.typography.fontSize.xxs, cursor: 'pointer',\n                fontWeight: tokens.typography.fontWeight.medium,\n                transition: 'opacity 150ms ease',\n              }}\n            >\n              Delete ({selectedFiles.length})\n            </button>\n          )}\n        </div>\n      </div>\n\n      {/* Toolbar: search + breadcrumbs */}\n      {(showSearch || showBreadcrumbs) && (\n        <div style={{\n          padding: `${tokens.spacing.sm} ${tokens.spacing.smd}`,\n          borderBottom: `1px solid ${tokens.colors.border.muted}`,\n          display: 'flex', alignItems: 'center', gap: tokens.spacing.sm,\n          background: tokens.colors.background.surface,\n        }}>\n          {showBreadcrumbs && initialViewMode === 'list' && (\n            <nav aria-label=\"File path\" style={{ display: 'flex', alignItems: 'center', gap: tokens.spacing.xs, fontSize: tokens.typography.fontSize.xs, flex: 1 }}>\n              <span\n                role=\"button\"\n                tabIndex={0}\n                aria-label=\"Navigate to root\"\n                onClick={() => navigateTo(0)}\n                onKeyDown={e => { if (e.key === 'Enter') navigateTo(0); }}\n                style={{ cursor: 'pointer', color: tokens.colors.interactive.default, fontWeight: tokens.typography.fontWeight.medium }}\n              >\n                /\n              </span>\n              {currentPath.map((dir, idx) => (\n                <React.Fragment key={idx}>\n                  <span aria-hidden=\"true\" style={{ color: tokens.colors.text.muted }}>/</span>\n                  <span\n                    role=\"button\"\n                    tabIndex={0}\n                    aria-label={`Navigate to ${dir}`}\n                    onClick={() => navigateTo(idx + 1)}\n                    onKeyDown={e => { if (e.key === 'Enter') navigateTo(idx + 1); }}\n                    style={{\n                      cursor: 'pointer',\n                      color: idx === currentPath.length - 1 ? tokens.colors.text.primary : tokens.colors.interactive.default,\n                      fontWeight: idx === currentPath.length - 1 ? tokens.typography.fontWeight.medium : tokens.typography.fontWeight.normal,\n                    }}\n                  >\n                    {dir}\n                  </span>\n                </React.Fragment>\n              ))}\n            </nav>\n          )}\n          {showSearch && (\n            <input\n              type=\"text\"\n              value={searchQuery}\n              onChange={e => setSearchQuery(e.target.value)}\n              placeholder=\"Search files...\"\n              aria-label=\"Search files\"\n              style={{\n                background: tokens.colors.background.base,\n                color: tokens.colors.text.primary,\n                border: `1px solid ${tokens.colors.border.muted}`,\n                borderRadius: tokens.borderRadius.md, padding: `${tokens.spacing.xs} ${tokens.spacing.sm}`, fontSize: tokens.typography.fontSize.xs,\n                outline: 'none', minWidth: 150,\n                transition: 'border-color 150ms ease',\n              }}\n            />\n          )}\n        </div>\n      )}\n\n      {/* Column headers */}\n      <div role=\"row\" style={{\n        display: 'grid',\n        gridTemplateColumns: showDetails ? '1fr auto auto' : '1fr',\n        padding: `${tokens.spacing.xs} ${tokens.spacing.smd}`,\n        borderBottom: `1px solid ${tokens.colors.border.muted}`,\n        background: tokens.colors.background.surface,\n        fontSize: tokens.typography.fontSize.xxs, color: tokens.colors.text.muted, fontWeight: tokens.typography.fontWeight.medium,\n        textTransform: 'uppercase',\n        letterSpacing: '0.5px',\n      }}>\n        <span role=\"columnheader\" tabIndex={0} aria-label=\"Sort by name\" onClick={() => handleSort('name')} onKeyDown={e => { if (e.key === 'Enter') handleSort('name'); }} style={{ cursor: 'pointer' }}>\n          Name {sortBy === 'name' && (sortDir === 'asc' ? '\\u25B2' : '\\u25BC')}\n        </span>\n        {showDetails && (\n          <>\n            <span role=\"columnheader\" tabIndex={0} aria-label=\"Sort by size\" onClick={() => handleSort('size')} onKeyDown={e => { if (e.key === 'Enter') handleSort('size'); }} style={{ cursor: 'pointer', minWidth: 70, textAlign: 'right' }}>\n              Size {sortBy === 'size' && (sortDir === 'asc' ? '\\u25B2' : '\\u25BC')}\n            </span>\n            <span role=\"columnheader\" tabIndex={0} aria-label=\"Sort by modified date\" onClick={() => handleSort('modified')} onKeyDown={e => { if (e.key === 'Enter') handleSort('modified'); }} style={{ cursor: 'pointer', minWidth: 140, textAlign: 'right' }}>\n              Modified {sortBy === 'modified' && (sortDir === 'asc' ? '\\u25B2' : '\\u25BC')}\n            </span>\n          </>\n        )}\n      </div>\n\n      {/* File list */}\n      <div\n        ref={listRef}\n        style={{\n          flex: 1, overflow: 'auto', position: 'relative',\n          border: isDragging ? `2px dashed ${tokens.colors.interactive.default}` : '2px solid transparent',\n        }}\n        onScroll={e => setScrollTop(e.currentTarget.scrollTop)}\n        onDragOver={allowUpload ? e => { e.preventDefault(); setIsDragging(true); } : undefined}\n        onDragLeave={allowUpload ? () => setIsDragging(false) : undefined}\n        onDrop={allowUpload ? handleDrop : undefined}\n      >\n        {isDragging && (\n          <div style={{\n            position: 'absolute', inset: 0, background: `${tokens.colors.interactive.default}11`,\n            display: 'flex', alignItems: 'center', justifyContent: 'center',\n            fontSize: tokens.typography.fontSize.sm, color: tokens.colors.interactive.default,\n            fontWeight: tokens.typography.fontWeight.medium, zIndex: 10,\n          }}>\n            Drop files to upload\n          </div>\n        )}\n        {visibleItems.length === 0 ? (\n          <div style={{\n            display: 'flex', alignItems: 'center', justifyContent: 'center',\n            height: '100%', color: tokens.colors.text.muted, fontSize: tokens.typography.fontSize.sm,\n          }}>\n            {searchQuery ? 'No matching files' : 'Empty directory'}\n          </div>\n        ) : (\n          <div style={{ height: totalRows * rowHeightPx, position: 'relative' }}>\n            <div style={{ position: 'absolute', top: startRow * rowHeightPx, left: 0, right: 0 }}>\n              {virtualVisibleItems.map(({ file, depth }) => (\n                <div\n                  role=\"treeitem\"\n                  tabIndex={0}\n                  aria-label={`${file.isDirectory ? 'Folder' : 'File'}: ${file.name}`}\n                  aria-selected={selected.has(file.path)}\n                  key={file.path}\n                  onClick={() => handleFileClick(file)}\n                  onDoubleClick={() => handleFileDoubleClick(file)}\n                  onKeyDown={e => { if (e.key === 'Enter') handleFileDoubleClick(file); if (e.key === ' ') { e.preventDefault(); handleFileClick(file); } }}\n                  style={{\n                    display: 'grid',\n                    gridTemplateColumns: showDetails ? '1fr auto auto' : '1fr',\n                    padding: `0 ${tokens.spacing.smd}`,\n                    paddingLeft: `calc(${tokens.spacing.smd} + ${depth * 20}px)`,\n                    height: tokens.elementSize.sm,\n                    alignItems: 'center',\n                    borderBottom: `1px solid ${tokens.colors.border.muted}`,\n                    cursor: 'pointer',\n                    background: selected.has(file.path) ? `${tokens.colors.interactive.default}15` : 'transparent',\n                    transition: 'background 150ms ease',\n                  }}\n                  onMouseEnter={e => {\n                    if (!selected.has(file.path)) (e.currentTarget as HTMLDivElement).style.background = tokens.colors.background.surface;\n                  }}\n                  onMouseLeave={e => {\n                    (e.currentTarget as HTMLDivElement).style.background = selected.has(file.path) ? `${tokens.colors.interactive.default}15` : 'transparent';\n                  }}\n                >\n                  <span style={{ display: 'flex', alignItems: 'center', gap: tokens.spacing.sm, overflow: 'hidden' }}>\n                    {multiSelect && (\n                      <input\n                        type=\"checkbox\"\n                        checked={selected.has(file.path)}\n                        onChange={() => toggleSelect(file.path)}\n                        onClick={e => e.stopPropagation()}\n                        aria-label={`Select ${file.name}`}\n                        style={{ accentColor: tokens.colors.interactive.default }}\n                      />\n                    )}\n                    {initialViewMode === 'tree' && file.isDirectory && (\n                      <span aria-hidden=\"true\" style={{ fontSize: tokens.typography.fontSize.xxs, color: tokens.colors.text.muted, width: 12, textAlign: 'center' }}>\n                        {expanded.has(file.path) ? '\\u25BC' : '\\u25B6'}\n                      </span>\n                    )}\n                    <span aria-hidden=\"true\" style={{ display: 'inline-flex', alignItems: 'center', fontSize: tokens.typography.fontSize.sm }}>\n                      <AstroIcon name={getFileIconName(file)} size=\"small\" label=\"\" style={{ fontSize: 'inherit' }} />\n                    </span>\n                    <span style={{\n                      fontSize: tokens.typography.fontSize.xs,\n                      fontWeight: file.isDirectory ? tokens.typography.fontWeight.medium : tokens.typography.fontWeight.normal,\n                      color: file.isDirectory ? tokens.colors.interactive.default : tokens.colors.text.primary,\n                      overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap',\n                    }}>\n                      {file.name}\n                    </span>\n                  </span>\n                  {showDetails && (\n                    <>\n                      <span style={{ fontSize: tokens.typography.fontSize.xs, color: tokens.colors.text.muted, textAlign: 'right', minWidth: 70, fontFamily: tokens.typography.fontFamily.mono }}>\n                        {file.isDirectory ? '—' : formatFileSize(file.size)}\n                      </span>\n                      <span style={{ fontSize: tokens.typography.fontSize.xs, color: tokens.colors.text.muted, textAlign: 'right', minWidth: 140, fontFamily: tokens.typography.fontFamily.mono }}>\n                        {formatDate(file.modified)}\n                      </span>\n                    </>\n                  )}\n                </div>\n              ))}\n            </div>\n          </div>\n        )}\n      </div>\n\n      {/* Status bar */}\n      <div style={{\n        padding: `${tokens.spacing.xs} ${tokens.spacing.smd}`,\n        borderTop: `1px solid ${tokens.colors.border.muted}`,\n        background: tokens.colors.background.surface,\n        fontSize: tokens.typography.fontSize.xxs, color: tokens.colors.text.muted,\n        display: 'flex', justifyContent: 'space-between',\n      }}>\n        <span>{visibleItems.length} items</span>\n        {selected.size > 0 && <span>{selected.size} selected</span>}\n      </div>\n    </div>\n  );\n});\n\nexport default FileExplorer;\n"],"names":["FileExplorer"],"mappings":"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"}

package/dist/react/core/GlassCard.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"GlassCard.js","sources":["../../../src/react/core/GlassCard.tsx"],"sourcesContent":["/**\r\n * @zendir/ui - GlassCard Component\r\n * \r\n * Glassmorphic card component with transparent blur backgrounds,\r\n * gradient overlays, and Zendir brand color accent system.\r\n * \r\n * Inspired by AstroUXDS radar chart styling with modern glassmorphism.\r\n * \r\n * @example\r\n * ```tsx\r\n * <GlassCard title=\"Radar Chart 001\" colorOverlay=\"electric\">\r\n *   <RadarChart data={data} />\r\n * </GlassCard>\r\n * \r\n * <GlassCard title=\"System Status\" colorOverlay=\"purple\" accentPosition=\"top\">\r\n *   <StatusContent />\r\n * </GlassCard>\r\n * ```\r\n */\r\n\r\nimport React, { memo } from 'react';\r\nimport { useTheme } from '../theme';\r\nimport { classNames, type StatusLevel } from '../utils';\r\n\r\n// =============================================================================\r\n// Zendir Brand Color Palette for Glass Overlays\r\n// =============================================================================\r\n\r\nexport const GLASS_COLOR_OVERLAYS = {\r\n  // Core brand colors\r\n  electric: {\r\n    gradient: 'linear-gradient(135deg, rgba(62, 60, 255, 0.15) 0%, rgba(62, 60, 255, 0.05) 100%)',\r\n    accent: '#3E3CFF',\r\n    border: 'rgba(62, 60, 255, 0.3)',\r\n    glow: 'rgba(62, 60, 255, 0.4)',\r\n  },\r\n  purple: {\r\n    gradient: 'linear-gradient(135deg, rgba(157, 112, 255, 0.15) 0%, rgba(157, 112, 255, 0.05) 100%)',\r\n    accent: '#9D70FF',\r\n    border: 'rgba(157, 112, 255, 0.3)',\r\n    glow: 'rgba(157, 112, 255, 0.4)',\r\n  },\r\n  prussianBlue: {\r\n    gradient: 'linear-gradient(135deg, rgba(27, 45, 160, 0.2) 0%, rgba(27, 45, 160, 0.08) 100%)',\r\n    accent: '#1B2DA0',\r\n    border: 'rgba(27, 45, 160, 0.4)',\r\n    glow: 'rgba(27, 45, 160, 0.5)',\r\n  },\r\n  \r\n  // Cyan/Teal (matching the reference image style)\r\n  cyan: {\r\n    gradient: 'linear-gradient(135deg, rgba(0, 212, 255, 0.12) 0%, rgba(0, 180, 220, 0.04) 100%)',\r\n    accent: '#00D4FF',\r\n    border: 'rgba(0, 212, 255, 0.35)',\r\n    glow: 'rgba(0, 212, 255, 0.5)',\r\n  },\r\n  teal: {\r\n    gradient: 'linear-gradient(135deg, rgba(45, 204, 255, 0.12) 0%, rgba(45, 204, 255, 0.04) 100%)',\r\n    accent: '#2DCCFF',\r\n    border: 'rgba(45, 204, 255, 0.35)',\r\n    glow: 'rgba(45, 204, 255, 0.5)',\r\n  },\r\n  \r\n  // Neutral options\r\n  dark: {\r\n    gradient: 'linear-gradient(135deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.2) 100%)',\r\n    accent: '#1a1a2e',\r\n    border: 'rgba(255, 255, 255, 0.1)',\r\n    glow: 'rgba(0, 0, 0, 0.3)',\r\n  },\r\n  light: {\r\n    gradient: 'linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.05) 100%)',\r\n    accent: '#ffffff',\r\n    border: 'rgba(255, 255, 255, 0.25)',\r\n    glow: 'rgba(255, 255, 255, 0.3)',\r\n  },\r\n  white: {\r\n    gradient: 'linear-gradient(135deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0.08) 100%)',\r\n    accent: '#ffffff',\r\n    border: 'rgba(255, 255, 255, 0.3)',\r\n    glow: 'rgba(255, 255, 255, 0.4)',\r\n  },\r\n  \r\n  // Additional shades\r\n  electricLight: {\r\n    gradient: 'linear-gradient(135deg, rgba(107, 105, 255, 0.15) 0%, rgba(107, 105, 255, 0.05) 100%)',\r\n    accent: '#6B69FF',\r\n    border: 'rgba(107, 105, 255, 0.3)',\r\n    glow: 'rgba(107, 105, 255, 0.4)',\r\n  },\r\n  purpleLight: {\r\n    gradient: 'linear-gradient(135deg, rgba(180, 141, 255, 0.15) 0%, rgba(180, 141, 255, 0.05) 100%)',\r\n    accent: '#B48DFF',\r\n    border: 'rgba(180, 141, 255, 0.3)',\r\n    glow: 'rgba(180, 141, 255, 0.4)',\r\n  },\r\n  \r\n  // No overlay (transparent)\r\n  none: {\r\n    gradient: 'none',\r\n    accent: 'transparent',\r\n    border: 'rgba(255, 255, 255, 0.1)',\r\n    glow: 'transparent',\r\n  },\r\n} as const;\r\n\r\nexport type GlassColorOverlay = keyof typeof GLASS_COLOR_OVERLAYS;\r\n\r\nexport type GlassAccentPosition = 'top' | 'left' | 'right' | 'bottom' | 'none';\r\n\r\nexport interface GlassCardProps {\r\n  /** Card title with optional icon */\r\n  title?: React.ReactNode;\r\n  /** Subtitle text */\r\n  subtitle?: React.ReactNode;\r\n  /** Color overlay from Zendir brand palette */\r\n  colorOverlay?: GlassColorOverlay;\r\n  /** Custom color overlay (hex or rgba) */\r\n  customOverlay?: {\r\n    gradient: string;\r\n    accent: string;\r\n    border: string;\r\n    glow?: string;\r\n  };\r\n  /** \r\n   * Accent color (hex) - auto-generates overlay from this color\r\n   * Overrides colorOverlay if provided\r\n   * Can be used with CardAccentProvider: accentColor={getAccentColor(title)}\r\n   */\r\n  accentColor?: string;\r\n  /** Position of the accent line/glow */\r\n  accentPosition?: GlassAccentPosition;\r\n  /** Accent line style */\r\n  accentStyle?: 'solid' | 'gradient' | 'glow' | 'dots';\r\n  /** Header icon (rendered before title) */\r\n  icon?: React.ReactNode;\r\n  /** Header right actions (legend, buttons, etc.) */\r\n  actions?: React.ReactNode;\r\n  /** Legend items to display in header */\r\n  legend?: Array<{ label: string; color: string }>;\r\n  /** Status indicator */\r\n  status?: StatusLevel;\r\n  /** Blur intensity (0-20) */\r\n  blur?: number;\r\n  /** Background opacity (0-1) */\r\n  backgroundOpacity?: number;\r\n  /** Enable glow effect on hover */\r\n  glowOnHover?: boolean;\r\n  /** Children content */\r\n  children: React.ReactNode;\r\n  /** Custom className */\r\n  className?: string;\r\n  /** Custom style */\r\n  style?: React.CSSProperties;\r\n  /** Click handler */\r\n  onClick?: () => void;\r\n  /** Full height mode */\r\n  fullHeight?: boolean;\r\n  /** Padding size */\r\n  padding?: 'none' | 'sm' | 'md' | 'lg';\r\n}\r\n\r\n/**\r\n * GlassCard - Glassmorphic card with Zendir brand styling\r\n * \r\n * Features:\r\n * - Transparent blur background\r\n * - Gradient color overlays\r\n * - Accent lines with glow effects\r\n * - Legend support for charts\r\n * - Customizable via props or custom overlay object\r\n */\r\n/**\r\n * Create overlay from accent color hex\r\n */\r\nfunction createOverlayFromColor(color: string) {\r\n  // Extract RGB from hex\r\n  const hex = color.replace('#', '');\r\n  const r = parseInt(hex.substring(0, 2), 16);\r\n  const g = parseInt(hex.substring(2, 4), 16);\r\n  const b = parseInt(hex.substring(4, 6), 16);\r\n  \r\n  return {\r\n    gradient: `linear-gradient(135deg, rgba(${r}, ${g}, ${b}, 0.15) 0%, rgba(${r}, ${g}, ${b}, 0.05) 100%)`,\r\n    accent: color,\r\n    border: `rgba(${r}, ${g}, ${b}, 0.35)`,\r\n    glow: `rgba(${r}, ${g}, ${b}, 0.5)`,\r\n  };\r\n}\r\n\r\nexport const GlassCard = memo(function GlassCard({\r\n  title,\r\n  subtitle,\r\n  colorOverlay = 'cyan',\r\n  customOverlay,\r\n  accentColor,\r\n  accentPosition = 'top',\r\n  accentStyle = 'gradient',\r\n  icon,\r\n  actions,\r\n  legend,\r\n  status,\r\n  blur = 12,\r\n  backgroundOpacity = 0.85,\r\n  glowOnHover = true,\r\n  children,\r\n  className = '',\r\n  style,\r\n  onClick,\r\n  fullHeight = false,\r\n  padding = 'md',\r\n}: GlassCardProps): React.ReactElement {\r\n  const { tokens, mode, theme } = useTheme();\r\n  const isDark = mode === 'dark';\r\n  const isTransparent = theme === 'transparent' || theme === 'transparent-bold' || theme === 'transparent-minimal';\r\n  const isBoldVariant = theme === 'transparent-bold';\r\n  const isMinimalVariant = theme === 'transparent-minimal';\r\n  \r\n  // Accent styling only for Bold/Minimal themes (or when position explicitly set for non-transparent)\r\n  const showAccentStyling = isBoldVariant || isMinimalVariant || !isTransparent;\r\n  \r\n  // For all transparent themes, default to purple (Zendir accent) instead of cyan\r\n  const effectiveColorOverlay = isTransparent && colorOverlay === 'cyan' ? 'purple' : colorOverlay;\r\n  \r\n  // Get overlay colors (priority: accentColor > customOverlay > colorOverlay)\r\n  const overlay = accentColor \r\n    ? createOverlayFromColor(accentColor)\r\n    : customOverlay || GLASS_COLOR_OVERLAYS[effectiveColorOverlay];\r\n  \r\n  // Auto-switch to light token for 'white' overlay in light mode\r\n  const effectiveOverlay = mode === 'light' && colorOverlay === 'white' && !accentColor && !customOverlay\r\n    ? GLASS_COLOR_OVERLAYS.dark\r\n    : overlay;\r\n  \r\n  // Theme-aware background colors\r\n  const cardBackground = isDark\r\n    ? `rgba(15, 20, 35, ${backgroundOpacity})`\r\n    : `rgba(255, 255, 255, ${backgroundOpacity})`;\r\n  \r\n  // Theme-aware border colors\r\n  const baseBorderColor = isDark\r\n    ? effectiveOverlay.border\r\n    : `rgba(100, 116, 139, 0.25)`;\r\n  \r\n  const paddingConfig = {\r\n    none: '0',\r\n    sm: tokens.spacing.sm,\r\n    md: tokens.spacing.md,\r\n    lg: tokens.spacing.lg,\r\n  };\r\n  \r\n  const isInteractive = !!onClick;\r\n  \r\n  // Accent line styles based on position and style\r\n  // Only show accent styling for Bold/Minimal themes (or non-transparent themes)\r\n  const getAccentStyles = (): React.CSSProperties => {\r\n    // For normal Glass theme, use subtle muted border instead of colored accent\r\n    if (isTransparent && !showAccentStyling) {\r\n      return {};\r\n    }\r\n    \r\n    if (accentPosition === 'none') return {};\r\n    \r\n    const accentColorValue = effectiveOverlay.accent;\r\n    const glowColor = effectiveOverlay.glow || accentColorValue;\r\n    \r\n    const baseAccentStyle: React.CSSProperties = {};\r\n    \r\n    // Position-based border\r\n    const positions: Record<GlassAccentPosition, string> = {\r\n      top: 'borderTop',\r\n      left: 'borderLeft',\r\n      right: 'borderRight',\r\n      bottom: 'borderBottom',\r\n      none: '',\r\n    };\r\n    \r\n    const borderProp = positions[accentPosition] as keyof React.CSSProperties;\r\n    \r\n    if (accentStyle === 'solid') {\r\n      (baseAccentStyle as any)[borderProp] = `2px solid ${accentColorValue}`;\r\n    } else if (accentStyle === 'gradient' || accentStyle === 'glow') {\r\n      // Using pseudo-element for gradient, so just set position indicator\r\n      (baseAccentStyle as any)[borderProp] = `2px solid ${accentColorValue}`;\r\n      if (accentStyle === 'glow') {\r\n        baseAccentStyle.boxShadow = `0 -2px 20px ${glowColor}, 0 -1px 8px ${glowColor}`;\r\n      }\r\n    } else if (accentStyle === 'dots') {\r\n      (baseAccentStyle as any)[borderProp] = `2px dotted ${accentColorValue}`;\r\n    }\r\n    \r\n    return baseAccentStyle;\r\n  };\r\n  \r\n  // Status color\r\n  const statusColor = status ? tokens.colors.status[status] : undefined;\r\n  \r\n  return (\r\n    <div\r\n      className={classNames('zendir-glass-card', `zendir-glass-card--${colorOverlay}`, className)}\r\n      onClick={onClick}\r\n      role={isInteractive ? 'button' : undefined}\r\n      tabIndex={isInteractive ? 0 : undefined}\r\n      onKeyDown={onClick ? (e: React.KeyboardEvent) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onClick(); } } : undefined}\r\n      style={{\r\n        position: 'relative',\r\n        borderRadius: tokens.borderRadius.lg,\r\n        overflow: 'hidden',\r\n        height: fullHeight ? '100%' : 'auto',\r\n        display: 'flex',\r\n        flexDirection: 'column',\r\n        cursor: isInteractive ? 'pointer' : 'default',\r\n        \r\n        // Glassmorphic base (theme-aware)\r\n        background: cardBackground,\r\n        backdropFilter: isTransparent ? `blur(${blur}px)` : 'none',\r\n        WebkitBackdropFilter: isTransparent ? `blur(${blur}px)` : 'none',\r\n        \r\n        // Border with color tint (theme-aware)\r\n        border: `1px solid ${baseBorderColor}`,\r\n        \r\n        // Accent positioning\r\n        ...getAccentStyles(),\r\n        \r\n        // Hover glow effect\r\n        transition: 'all 0.3s ease-out',\r\n        boxShadow: glowOnHover ? 'none' : undefined,\r\n        \r\n        ...style,\r\n      }}\r\n      onMouseEnter={(e) => {\r\n        if (glowOnHover && effectiveOverlay.glow) {\r\n          e.currentTarget.style.boxShadow = `0 0 30px ${effectiveOverlay.glow}, 0 4px 20px rgba(0,0,0,0.3)`;\r\n        }\r\n      }}\r\n      onMouseLeave={(e) => {\r\n        if (glowOnHover) {\r\n          e.currentTarget.style.boxShadow = 'none';\r\n        }\r\n      }}\r\n    >\r\n      {/* Gradient overlay layer */}\r\n      <div\r\n        style={{\r\n          position: 'absolute',\r\n          inset: 0,\r\n          background: effectiveOverlay.gradient,\r\n          pointerEvents: 'none',\r\n          zIndex: 0,\r\n        }}\r\n      />\r\n      \r\n      {/* Accent glow line (top) - only for Bold/Minimal themes */}\r\n      {showAccentStyling && accentPosition === 'top' && accentStyle === 'glow' && (\r\n        <div\r\n          style={{\r\n            position: 'absolute',\r\n            top: 0,\r\n            left: '10%',\r\n            right: '10%',\r\n            height: '2px',\r\n            background: `linear-gradient(90deg, transparent, ${effectiveOverlay.accent}, transparent)`,\r\n            boxShadow: `0 0 15px ${effectiveOverlay.glow}, 0 0 30px ${effectiveOverlay.glow}`,\r\n            zIndex: 1,\r\n          }}\r\n        />\r\n      )}\r\n      \r\n      {/* Content wrapper */}\r\n      <div style={{ position: 'relative', zIndex: 1, display: 'flex', flexDirection: 'column', flex: 1 }}>\r\n        {/* Header */}\r\n        {(title || actions || legend) && (\r\n          <div\r\n            style={{\r\n              display: 'flex',\r\n              alignItems: 'center',\r\n              justifyContent: 'space-between',\r\n              gap: tokens.spacing.md,\r\n              padding: `${paddingConfig[padding]} ${paddingConfig[padding]} 0`,\r\n              marginBottom: tokens.spacing.sm,\r\n            }}\r\n          >\r\n            {/* Title section */}\r\n            <div style={{ display: 'flex', alignItems: 'center', gap: tokens.spacing.sm }}>\r\n              {/* Icon */}\r\n              {icon && (\r\n                <span style={{ color: effectiveOverlay.accent, display: 'flex', alignItems: 'center' }}>\r\n                  {icon}\r\n                </span>\r\n              )}\r\n              \r\n              {/* Status shape — Astro UX dual-coded */}\r\n              {status && statusColor && (() => {\r\n                const s = 10;\r\n                const h = s / 2;\r\n                const glow = `drop-shadow(0 0 4px ${statusColor})`;\r\n                switch (status) {\r\n                  case 'critical':\r\n                    return (\r\n                      <svg width={s} height={s} viewBox={`0 0 ${s} ${s}`} style={{ flexShrink: 0, filter: glow }}>\r\n                        <polygon points={`${h},${s} 0,0 ${s},0`} fill={statusColor} />\r\n                      </svg>\r\n                    );\r\n                  case 'serious':\r\n                    return (\r\n                      <svg width={s} height={s} viewBox={`0 0 ${s} ${s}`} style={{ flexShrink: 0, filter: glow }}>\r\n                        <polygon points={`${h},0 ${s},${h} ${h},${s} 0,${h}`} fill={statusColor} />\r\n                      </svg>\r\n                    );\r\n                  case 'caution':\r\n                    return (\r\n                      <svg width={s} height={s} viewBox={`0 0 ${s} ${s}`} style={{ flexShrink: 0, filter: glow }}>\r\n                        <rect width={s} height={s} fill={statusColor} />\r\n                      </svg>\r\n                    );\r\n                  case 'standby':\r\n                    return (\r\n                      <svg width={s} height={s} viewBox=\"0 0 12 12\" style={{ flexShrink: 0, filter: glow }}>\r\n                        <circle cx=\"6\" cy=\"6\" r=\"3.5\" fill=\"none\" stroke={statusColor} strokeWidth=\"2\" />\r\n                      </svg>\r\n                    );\r\n                  case 'off':\r\n                    return (\r\n                      <svg width={s} height={s} viewBox=\"0 0 12 12\" style={{ flexShrink: 0, filter: glow }}>\r\n                        <circle cx=\"6\" cy=\"6\" r=\"3\" fill={statusColor} />\r\n                      </svg>\r\n                    );\r\n                  default: // normal\r\n                    return (\r\n                      <svg width={s} height={s} viewBox={`0 0 ${s} ${s}`} style={{ flexShrink: 0, filter: glow }}>\r\n                        <circle cx={h} cy={h} r={h} fill={statusColor} />\r\n                      </svg>\r\n                    );\r\n                }\r\n              })()}\r\n              \r\n              {/* Title text — card heading system */}\r\n              <div>\r\n                {title && (\r\n                  <h3\r\n                    style={{\r\n                      margin: 0,\r\n                      fontSize: tokens.layout?.card?.heading?.titleFontSize ?? '1.125rem',\r\n                      fontWeight: tokens.layout?.card?.heading?.titleFontWeight ?? 500,\r\n                      color: effectiveOverlay.accent,\r\n                      letterSpacing: '0.5px',\r\n                      textShadow: `0 0 20px ${effectiveOverlay.glow}`,\r\n                    }}\r\n                  >\r\n                    {title}\r\n                  </h3>\r\n                )}\r\n                {subtitle && (\r\n                  <p\r\n                    style={{\r\n                      margin: `${tokens.spacing.xs} 0 0`,\r\n                      fontSize: tokens.typography.body[3].fontSize,\r\n                      color: tokens.colors.text.secondary,\r\n                    }}\r\n                  >\r\n                    {subtitle}\r\n                  </p>\r\n                )}\r\n              </div>\r\n            </div>\r\n            \r\n            {/* Right section: legend + actions */}\r\n            <div style={{ display: 'flex', alignItems: 'center', gap: tokens.spacing.md }}>\r\n              {/* Legend items */}\r\n              {legend && legend.length > 0 && (\r\n                <div style={{ display: 'flex', alignItems: 'center', gap: tokens.spacing.md }}>\r\n                  {legend.map((item, idx) => (\r\n                    <div\r\n                      key={idx}\r\n                      style={{\r\n                        display: 'flex',\r\n                        alignItems: 'center',\r\n                        gap: tokens.spacing.xs,\r\n                      }}\r\n                    >\r\n                      <span\r\n                        style={{\r\n                          width: '8px',\r\n                          height: '8px',\r\n                          borderRadius: '2px',\r\n                          backgroundColor: item.color,\r\n                        }}\r\n                      />\r\n                      <span\r\n                        style={{\r\n                          fontSize: tokens.typography.body[3].fontSize,\r\n                          color: tokens.colors.text.secondary,\r\n                        }}\r\n                      >\r\n                        {item.label}\r\n                      </span>\r\n                    </div>\r\n                  ))}\r\n                </div>\r\n              )}\r\n              \r\n              {/* Actions */}\r\n              {actions && (\r\n                <div style={{ display: 'flex', gap: tokens.spacing.xs }}>\r\n                  {actions}\r\n                </div>\r\n              )}\r\n            </div>\r\n          </div>\r\n        )}\r\n        \r\n        {/* Accent line - only for Bold/Minimal themes (no decorative dashes) */}\r\n        {showAccentStyling && accentPosition === 'top' && (\r\n          <div\r\n            style={{\r\n              display: 'flex',\r\n              alignItems: 'center',\r\n              padding: `0 ${paddingConfig[padding]}`,\r\n              marginBottom: tokens.spacing.sm,\r\n            }}\r\n          >\r\n            {/* Clean accent line with smooth gradient */}\r\n            <div\r\n              style={{\r\n                flex: 1,\r\n                height: '2px',\r\n                background: `linear-gradient(90deg, ${effectiveOverlay.accent} 0%, ${effectiveOverlay.accent}60 70%, ${effectiveOverlay.accent}20 100%)`,\r\n                boxShadow: `0 0 6px ${effectiveOverlay.accent}40`,\r\n              }}\r\n            />\r\n          </div>\r\n        )}\r\n        \r\n        {/* Content */}\r\n        <div\r\n          style={{\r\n            flex: 1,\r\n            padding: title ? `0 ${paddingConfig[padding]} ${paddingConfig[padding]}` : paddingConfig[padding],\r\n          }}\r\n        >\r\n          {children}\r\n        </div>\r\n      </div>\r\n    </div>\r\n  );\r\n});\r\n\r\nexport default GlassCard;\r\n"],"names":["GlassCard"],"mappings":"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"}

package/dist/react/core/HeaderIconWithStatus.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"HeaderIconWithStatus.js","sources":["../../../src/react/core/HeaderIconWithStatus.tsx"],"sourcesContent":["/**\n * @zendir/ui - HeaderIconWithStatus Component\n * \n * Shared component for card/chart header icons with status indicator.\n * Follows MonitoringIcon pattern for Astro UX compliance.\n * \n * Features:\n * - Status indicator positioned at top-left with transform offset\n * - Glow effect in dark mode for visibility\n * - Border in light mode for WCAG AA compliance\n * - Theme-aware colors\n * - Consistent sizing across all usages\n */\n\nimport React, { memo } from 'react';\nimport { useTheme } from '../theme';\nimport { type StatusLevel } from '../utils';\nimport { AstroIcon, type AstroIconName } from './AstroIcon';\n\n// =============================================================================\n// Astro UX Status Border Colors - Required for light theme WCAG compliance\n// https://www.astrouxds.com/patterns/status-system/\n// =============================================================================\n\nconst STATUS_BORDER_COLORS: Record<StatusLevel, string> = {\n  off: '#3c3e42',\n  standby: '#285766',\n  normal: '#005a00',\n  caution: '#645600',\n  serious: '#664618',\n  critical: '#661102',\n};\n\n// =============================================================================\n// Status Shape SVG - Matches MonitoringIcon exactly\n// =============================================================================\n\ninterface StatusShapeProps {\n  status: StatusLevel;\n  size: number;\n  color: string;\n  borderColor?: string;\n  glow?: boolean;\n}\n\nconst StatusShape = ({ status, size, color, borderColor, glow = true }: StatusShapeProps) => {\n  const hasBorder = !!borderColor;\n  const strokeWidth = hasBorder ? 1 : 0;\n  const glowFilter = glow && !hasBorder ? `drop-shadow(0 0 3px ${color})` : undefined;\n  \n  const renderShape = () => {\n    switch (status) {\n      case 'off':\n        return <circle cx=\"6\" cy=\"6\" r={hasBorder ? 2.5 : 3} fill={color} stroke={borderColor} strokeWidth={strokeWidth} />;\n      case 'standby':\n        return <circle cx=\"6\" cy=\"6\" r=\"3.5\" fill=\"none\" stroke={color} strokeWidth=\"2\" />;\n      case 'normal':\n        return (\n          <circle\n            cx=\"6\"\n            cy=\"6\"\n            r={hasBorder ? 4.5 : 5}\n            fill={color}\n            stroke={borderColor}\n            strokeWidth={strokeWidth}\n          />\n        );\n      case 'caution':\n        return (\n          <rect\n            x={hasBorder ? 1.5 : 1}\n            y={hasBorder ? 1.5 : 1}\n            width={hasBorder ? 9 : 10}\n            height={hasBorder ? 9 : 10}\n            fill={color}\n            stroke={borderColor}\n            strokeWidth={strokeWidth}\n          />\n        );\n      case 'serious':\n        return (\n          <polygon\n            points=\"6,1 11,6 6,11 1,6\"\n            fill={color}\n            stroke={borderColor}\n            strokeWidth={strokeWidth}\n          />\n        );\n      case 'critical':\n        return (\n          <polygon\n            points=\"6,11 1,2 11,2\"\n            fill={color}\n            stroke={borderColor}\n            strokeWidth={strokeWidth}\n          />\n        );\n      default:\n        return null;\n    }\n  };\n  \n  return (\n    <svg \n      viewBox=\"0 0 12 12\" \n      width={size} \n      height={size}\n      style={{ filter: glowFilter }}\n    >\n      {renderShape()}\n    </svg>\n  );\n};\n\n// =============================================================================\n// HeaderIconWithStatus Component\n// =============================================================================\n\nexport interface HeaderIconWithStatusProps {\n  /** Astro icon name */\n  icon: AstroIconName | string;\n  /** Icon size in pixels */\n  size?: number;\n  /** Status level */\n  status: StatusLevel;\n  /** Custom status color (optional - defaults to theme status color) */\n  statusColor?: string;\n  /** Override light theme detection */\n  isLightTheme?: boolean;\n  /** Additional CSS class */\n  className?: string;\n  /** Additional inline styles */\n  style?: React.CSSProperties;\n}\n\n/**\n * HeaderIconWithStatus - Card/Chart header icon with status indicator\n * \n * Follows MonitoringIcon pattern exactly:\n * - Icon colored by status\n * - Status symbol at top-left with transform offset\n * - Glow in dark mode, border in light mode\n * \n * @example\n * ```tsx\n * <HeaderIconWithStatus\n *   icon=\"satellite-transmit\"\n *   status=\"normal\"\n *   size={24}\n * />\n * ```\n */\nexport const HeaderIconWithStatus = memo(function HeaderIconWithStatus({\n  icon,\n  size = 24,\n  status,\n  statusColor: statusColorProp,\n  isLightTheme: isLightThemeProp,\n  className,\n  style,\n}: HeaderIconWithStatusProps) {\n  const { tokens, mode } = useTheme();\n  \n  // Theme detection\n  const isLightTheme = isLightThemeProp ?? mode === 'light';\n  \n  // Status color from theme or prop\n  const statusColor = statusColorProp ?? tokens.colors.status[status] ?? '#a4abb6';\n  \n  // Border color for light theme (WCAG compliance)\n  const borderColor = isLightTheme ? STATUS_BORDER_COLORS[status] : undefined;\n  \n  // ═══════════════════════════════════════════════════════════════════════════\n  // SIZING CONTROLS - Adjust these to match MonitoringIcon proportions\n  // ═══════════════════════════════════════════════════════════════════════════\n  // Badge size: ~35% of icon size (same ratio as MonitoringIcon's 9px badge on 24px icon)\n  const badgeSize = Math.max(7, Math.min(12, Math.round(size * 0.38)));\n  \n  // Transform offset: translate(-35%, -35%) matches MonitoringIcon exactly\n  const transformOffset = 'translate(-35%, -35%)';\n  \n  return (\n    <div\n      role=\"img\"\n      aria-label={`${icon} — status: ${status}`}\n      className={className}\n      style={{\n        position: 'relative',\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'center',\n        width: size,\n        height: size,\n        flexShrink: 0,\n        color: statusColor,\n        ...style,\n      }}\n    >\n      {/* Icon - colored by status */}\n      <AstroIcon \n        name={icon as AstroIconName} \n        size={size} \n        color={statusColor}\n        aria-hidden=\"true\"\n      />\n      \n      {/* Status symbol - top-left corner with transform offset */}\n      <span\n        aria-hidden=\"true\"\n        style={{\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          transform: transformOffset,\n          display: 'flex',\n          alignItems: 'center',\n          justifyContent: 'center',\n        }}\n      >\n        <StatusShape \n          status={status} \n          size={badgeSize} \n          color={statusColor} \n          borderColor={borderColor}\n          glow={!isLightTheme} \n        />\n      </span>\n    </div>\n  );\n});\n\nexport default HeaderIconWithStatus;\n"],"names":["HeaderIconWithStatus"],"mappings":"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"}