@etus/ui 0.4.0-beta.3 → 0.4.0-beta.5

package/dist/chunk-SAKW2OKH.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/data-display/KPICard/KPICard.tsx"],"names":[],"mappings":"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","file":"chunk-SAKW2OKH.js","sourcesContent":["import type {\n  KPICardGroupProps,\n  KPICardProps,\n  KPICardTrend,\n} from \"./KPICard.types\"\n\nimport { ArrowDown, ArrowUp, Minus } from \"lucide-react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n} from \"../../layout/Card\"\nimport { Badge } from \"../../primitives/Badge\"\nimport { ProgressBar } from \"../../primitives/ProgressBar\"\nimport { SkeletonLoader } from \"../../primitives/SkeletonLoader\"\n\n/**\n * Size configuration for typography\n */\nconst sizeConfig = {\n  sm: {\n    value: \"text-2xl font-bold\",\n    padding: \"p-4\",\n  },\n  md: {\n    value: \"text-3xl font-bold\",\n    padding: \"p-6\",\n  },\n  lg: {\n    value: \"text-4xl font-bold\",\n    padding: \"p-6\",\n  },\n} as const\n\n/**\n * Trend icons mapping\n */\nconst TrendIcons = {\n  up: ArrowUp,\n  down: ArrowDown,\n  neutral: Minus,\n} as const\n\n/**\n * Trend colors mapping using design tokens\n */\nconst trendColors = {\n  up: \"text-success\",\n  down: \"text-destructive\",\n  neutral: \"text-muted-foreground\",\n} as const\n\n/**\n * KPICard - Key Performance Indicator Card\n *\n * Dashboard component that displays important metrics prominently.\n * Combines main value, comparison/delta, mini chart, and contextual metadata\n * in a layout optimized for quick visualization.\n *\n * @example\n * ```tsx\n * <KPICard\n *   title=\"Revenue\"\n *   value=\"$45,231.89\"\n *   delta={20.1}\n *   deltaLabel=\"from last month\"\n * />\n * ```\n */\nfunction KPICard({\n  title,\n  value,\n  previousValue: _previousValue,\n  delta,\n  deltaLabel,\n  trend,\n  sparkline,\n  icon,\n  featuredIcon,\n  dropdownIcon,\n  helpText,\n  progressBar,\n  swap,\n  showBadge = true,\n  action,\n  variant = \"default\",\n  size = \"md\",\n  loading = false,\n  className,\n  ...props\n}: KPICardProps) {\n  // Auto-detect trend direction if not provided\n  const computedTrend: KPICardTrend = trend ?? (delta !== undefined\n    ? delta > 0 ? \"up\" : delta < 0 ? \"down\" : \"neutral\"\n    : \"neutral\")\n\n  const TrendIcon = TrendIcons[computedTrend]\n  const trendColor = trendColors[computedTrend]\n  const sizeStyles = sizeConfig[size]\n\n  // Variant styles\n  const variantStyles = {\n    default: \"\",\n    ghost: \"border-none shadow-none bg-transparent\",\n    highlight: \"border-primary/50 bg-primary/5\",\n  }\n\n  if (loading) {\n    return (\n      <Card\n        className={cn(variantStyles[variant], className)}\n        data-slot=\"kpi-card\"\n        {...props}\n      >\n        <CardHeader className=\"flex flex-row items-center justify-between pb-2\">\n          <SkeletonLoader className=\"h-4 w-24\" />\n          <SkeletonLoader className=\"size-4\" />\n        </CardHeader>\n        <CardContent>\n          <SkeletonLoader className=\"mb-2 h-8 w-32\" />\n          <SkeletonLoader className=\"h-4 w-20\" />\n        </CardContent>\n      </Card>\n    )\n  }\n\n  return (\n    <Card\n      className={cn(variantStyles[variant], className)}\n      data-slot=\"kpi-card\"\n      {...props}\n    >\n      <CardHeader className=\"flex flex-row items-center justify-between pb-2\">\n        <div className=\"flex items-center gap-1.5\">\n          <CardTitle className=\"text-sm font-medium text-muted-foreground\">\n            {title}\n          </CardTitle>\n          {helpText && (\n            <span\n              className=\"text-xs text-muted-foreground\"\n              data-slot=\"kpi-card-help-text\"\n            >\n              {helpText}\n            </span>\n          )}\n        </div>\n        <div className=\"flex items-center gap-2\">\n          {featuredIcon && (\n            <span\n              className=\"inline-flex size-10 items-center justify-center rounded-full bg-primary/10 text-primary [&_svg]:size-5\"\n              data-slot=\"kpi-card-featured-icon\"\n            >\n              {featuredIcon}\n            </span>\n          )}\n          {icon && !featuredIcon && (\n            <span className=\"text-muted-foreground\" data-slot=\"kpi-card-icon\">\n              {icon}\n            </span>\n          )}\n          {dropdownIcon && (\n            <span\n              className=\"text-muted-foreground\"\n              data-slot=\"kpi-card-dropdown-icon\"\n            >\n              {dropdownIcon}\n            </span>\n          )}\n          {action && !icon && !featuredIcon && !dropdownIcon && (\n            <span data-slot=\"kpi-card-action\">{action}</span>\n          )}\n        </div>\n      </CardHeader>\n      <CardContent>\n        <div className=\"flex items-end justify-between\">\n          <div>\n            <div\n              className={cn(sizeStyles.value, \"tabular-nums\")}\n              data-slot=\"kpi-card-value\"\n            >\n              {value}\n            </div>\n            {delta !== undefined && (\n              <div\n                className={cn(\"mt-1 flex items-center gap-2\", trendColor)}\n                data-slot=\"kpi-card-delta\"\n                data-trend={computedTrend}\n              >\n                {showBadge ? (\n                  <Badge\n                    color={\n                      computedTrend === \"up\"\n                        ? \"success\"\n                        : computedTrend === \"down\"\n                        ? \"destructive\"\n                        : \"muted\"\n                    }\n                    leadingIcon={<TrendIcon aria-hidden=\"true\" />}\n                    size=\"sm\"\n                    type=\"pill-color\"\n                  >\n                    {Math.abs(delta)}%\n                  </Badge>\n                ) : (\n                  <span className={cn(\"flex items-center text-xs\", trendColor)}>\n                    <TrendIcon aria-hidden=\"true\" className=\"mr-1 size-3\" />\n                    <span className=\"font-medium\">{Math.abs(delta)}%</span>\n                  </span>\n                )}\n                {deltaLabel && (\n                  <span className=\"text-xs text-muted-foreground\">\n                    {deltaLabel}\n                  </span>\n                )}\n                {swap && (\n                  <span className=\"ml-auto\" data-slot=\"kpi-card-swap\">\n                    {swap}\n                  </span>\n                )}\n              </div>\n            )}\n          </div>\n          {/* Sparkline placeholder - to be implemented when Sparkline component is ready */}\n          {sparkline && sparkline.length > 0 && (\n            <div\n              aria-hidden=\"true\"\n              className=\"flex h-8 items-end gap-0.5\"\n              data-slot=\"kpi-card-sparkline\"\n            >\n              {/* Simple bar visualization as placeholder */}\n              {sparkline.slice(-10).map((val, idx) => {\n                const max = Math.max(...sparkline)\n                const min = Math.min(...sparkline)\n                const range = max - min || 1\n                const height = ((val - min) / range) * 100\n                return (\n                  <div\n                    key={`sparkline-bar-${String(val)}-${String(idx)}`}\n                    className={cn(\n                      \"w-1 rounded-full\",\n                      computedTrend === \"up\" ? \"bg-success/60\" :\n                      computedTrend === \"down\" ? \"bg-destructive/60\" :\n                      \"bg-muted-foreground/40\"\n                    )}\n                    style={{ height: `${String(Math.max(height, 10))}%` }}\n                  />\n                )\n              })}\n            </div>\n          )}\n        </div>\n        {progressBar !== undefined && (\n          <div className=\"mt-3\" data-slot=\"kpi-card-progress\">\n            {typeof progressBar === \"number\" ? (\n              <ProgressBar value={progressBar} />\n            ) : (\n              progressBar\n            )}\n          </div>\n        )}\n      </CardContent>\n      {/* Screen reader summary */}\n      <span className=\"sr-only\">\n        {title}: {value}\n        {delta !== undefined && `, ${computedTrend === \"up\" ? \"up\" : computedTrend === \"down\" ? \"down\" : \"unchanged\"} ${String(Math.abs(delta))}%`}\n        {deltaLabel && ` ${deltaLabel}`}\n      </span>\n    </Card>\n  )\n}\n\n/**\n * KPICardGroup — Multiple KPIs composition (Figma Type=Multiple KPIs)\n *\n * Wrapper que diagramra múltiplos `KPICard` em layout horizontal ou vertical.\n *\n * @example\n * ```tsx\n * <KPICardGroup orientation=\"horizontal\" gap=\"md\">\n *   <KPICard title=\"Revenue\" value=\"$45k\" delta={12} />\n *   <KPICard title=\"Orders\" value={1240} delta={-3} />\n *   <KPICard title=\"Users\" value={892} delta={8} />\n * </KPICardGroup>\n * ```\n */\nfunction KPICardGroup({\n  children,\n  orientation = \"horizontal\",\n  gap = \"md\",\n  className,\n  ...props\n}: KPICardGroupProps) {\n  const gapClasses = {\n    sm: \"gap-2\",\n    md: \"gap-4\",\n    lg: \"gap-6\",\n  } as const\n\n  return (\n    <div\n      className={cn(\n        \"flex\",\n        orientation === \"horizontal\"\n          ? \"flex-row [&>*]:flex-1\"\n          : \"flex-col\",\n        gapClasses[gap],\n        className\n      )}\n      data-orientation={orientation}\n      data-slot=\"kpi-card-group\"\n      {...props}\n    >\n      {children}\n    </div>\n  )\n}\n\nexport { KPICard, KPICardGroup }\n"]}

package/dist/chunk-VJITPUUS.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/feedback/Notification/Notification.variants.ts","../src/components/feedback/Notification/Notification.tsx"],"names":[],"mappings":"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","file":"chunk-VJITPUUS.js","sourcesContent":["import { cva } from \"class-variance-authority\"\n\n/**\n * Notification variant styles using CVA\n * Individual notification items for lists, dropdowns, or feeds\n */\nexport const notificationVariants = cva(\n  \"relative flex gap-[var(--notification-root-gap)] p-[var(--notification-root-padding)] transition-colors\",\n  {\n    variants: {\n      variant: {\n        default: \"\",\n        info: \"\",\n        success: \"\",\n        warning: \"\",\n        error: \"\",\n      },\n      read: {\n        true: \"bg-[color:var(--notification-bg-read)]\",\n        false: \"bg-[color:var(--notification-bg-unread)]/50\",\n      },\n      interactive: {\n        true: \"cursor-pointer hover:bg-[color:var(--notification-bg-hover)] focus-visible:bg-[color:var(--notification-bg-hover)] focus-visible:outline-none\",\n        false: \"\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      read: false,\n      interactive: false,\n    },\n  }\n)\n\n/**\n * Unread indicator dot styles\n */\nexport const unreadDotVariants = cva(\n  \"absolute left-[var(--notification-dot-left)] top-[var(--notification-dot-top)] size-[var(--notification-dot-size)] rounded-full\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-[color:var(--notification-dot-color-default)]\",\n        info: \"bg-[color:var(--notification-dot-color-info)]\",\n        success: \"bg-[color:var(--notification-dot-color-success)]\",\n        warning: \"bg-[color:var(--notification-dot-color-warning)]\",\n        error: \"bg-[color:var(--notification-dot-color-error)]\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n","import type { NotificationProps, NotificationVariant } from \"./Notification.types\"\n\nimport { Check, Trash2, X } from \"lucide-react\"\n\nimport { cn } from \"../../../lib/utils\"\nimport { Avatar, AvatarFallback, AvatarImage } from \"../../primitives/Avatar\"\nimport { notificationVariants, unreadDotVariants } from \"./Notification.variants\"\n\n/**\n * Format a timestamp into a relative or absolute string\n */\nfunction formatTimestamp(timestamp: Date | string | undefined): string {\n  if (!timestamp) return \"\"\n  if (typeof timestamp === \"string\") return timestamp\n  return timestamp.toLocaleString()\n}\n\n/**\n * Notification component for individual notification items\n *\n * Used in lists, dropdowns, or feeds. Unlike Toast which is temporary\n * and global, Notification is persistent and associated with the user.\n *\n * @example\n * ```tsx\n * <Notification\n *   title=\"Nova mensagem\"\n *   description=\"Voce recebeu uma nova mensagem de Maria.\"\n *   timestamp=\"5 min atras\"\n * />\n * ```\n */\nfunction Notification({\n  className,\n  variant = \"default\",\n  title,\n  description,\n  timestamp,\n  read = false,\n  icon,\n  avatar,\n  avatarSrc,\n  avatarFallback,\n  onClick,\n  onMarkAsRead,\n  onDelete,\n  actions,\n  ...props\n}: NotificationProps) {\n  const isInteractive = Boolean(onClick)\n  const formattedTimestamp = formatTimestamp(timestamp)\n  const showAvatar = Boolean(avatar ?? avatarSrc ?? avatarFallback)\n  const showActions = Boolean(onMarkAsRead ?? onDelete ?? actions)\n\n  const handleClick = () => {\n    if (onClick) {\n      onClick()\n    }\n  }\n\n  const handleKeyDown = (event: React.KeyboardEvent<HTMLElement>) => {\n    if (isInteractive && (event.key === \"Enter\" || event.key === \" \")) {\n      event.preventDefault()\n      onClick?.()\n    }\n    if (event.key === \"Delete\" && onDelete) {\n      event.preventDefault()\n      onDelete()\n    }\n  }\n\n  const handleMarkAsRead = (event: React.MouseEvent) => {\n    event.stopPropagation()\n    onMarkAsRead?.()\n  }\n\n  const handleDelete = (event: React.MouseEvent) => {\n    event.stopPropagation()\n    onDelete?.()\n  }\n\n  return (\n    <article\n      className={cn(\n        notificationVariants({ variant, read, interactive: isInteractive }),\n        className\n      )}\n      aria-label={`${read ? \"\" : \"Unread: \"}${title}${description ? `. ${description}` : \"\"}${formattedTimestamp ? `. ${formattedTimestamp}` : \"\"}`}\n      data-slot=\"notification\"\n      data-unread={!read}\n      data-variant={variant}\n      role=\"article\"\n      tabIndex={isInteractive ? 0 : undefined}\n      onClick={isInteractive ? handleClick : undefined}\n      onKeyDown={handleKeyDown}\n      {...props}\n    >\n      {/* Unread indicator dot */}\n      {!read && (\n        <span\n          aria-hidden=\"true\"\n          className={cn(unreadDotVariants({ variant }))}\n          data-slot=\"notification-unread-dot\"\n        />\n      )}\n\n      {/* Icon or Avatar */}\n      <div className=\"flex-shrink-0\" data-slot=\"notification-media\">\n        {icon ? (\n          <div\n            aria-hidden=\"true\"\n            className=\"flex size-10 items-center justify-center\"\n          >\n            {icon}\n          </div>\n        ) : showAvatar ? (\n          avatar ?? (\n            <Avatar size=\"default\">\n              {avatarSrc && (\n                <AvatarImage alt=\"\" src={avatarSrc} />\n              )}\n              <AvatarFallback>{avatarFallback}</AvatarFallback>\n            </Avatar>\n          )\n        ) : null}\n      </div>\n\n      {/* Content */}\n      <div className=\"min-w-0 flex-1\" data-slot=\"notification-content\">\n        <div className=\"flex items-start justify-between gap-2\">\n          <p\n            className=\"text-foreground line-clamp-2 text-sm font-medium\"\n            data-slot=\"notification-title\"\n          >\n            {title}\n          </p>\n          {formattedTimestamp && (\n            <time\n              className=\"text-muted-foreground shrink-0 text-xs\"\n              data-slot=\"notification-timestamp\"\n              dateTime={timestamp instanceof Date ? timestamp.toISOString() : undefined}\n            >\n              {formattedTimestamp}\n            </time>\n          )}\n        </div>\n        {description && (\n          <p\n            className=\"text-muted-foreground mt-0.5 line-clamp-2 text-sm\"\n            data-slot=\"notification-description\"\n          >\n            {description}\n          </p>\n        )}\n        {actions && (\n          <div className=\"mt-2\" data-slot=\"notification-actions\">\n            {actions}\n          </div>\n        )}\n      </div>\n\n      {/* Built-in action buttons */}\n      {showActions && !actions && (\n        <div\n          className=\"flex shrink-0 items-center gap-1\"\n          data-slot=\"notification-action-buttons\"\n        >\n          {onMarkAsRead && !read && (\n            <button\n              aria-label=\"Mark as read\"\n              className=\"text-muted-foreground hover:text-foreground hover:bg-accent rounded-md p-1.5 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n              data-slot=\"notification-mark-read\"\n              type=\"button\"\n              onClick={handleMarkAsRead}\n            >\n              <Check aria-hidden=\"true\" className=\"size-4\" />\n            </button>\n          )}\n          {onDelete && (\n            <button\n              aria-label=\"Delete notification\"\n              className=\"text-muted-foreground hover:text-destructive hover:bg-destructive/10 rounded-md p-1.5 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\"\n              data-slot=\"notification-delete\"\n              type=\"button\"\n              onClick={handleDelete}\n            >\n              <Trash2 aria-hidden=\"true\" className=\"size-4\" />\n            </button>\n          )}\n        </div>\n      )}\n    </article>\n  )\n}\n\n/**\n * NotificationDismissButton for use within custom actions\n */\nfunction NotificationDismissButton({\n  className,\n  onClick,\n  ...props\n}: React.ComponentPropsWithoutRef<\"button\">) {\n  return (\n    <button\n      className={cn(\n        \"text-muted-foreground hover:text-foreground rounded-md p-1 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring\",\n        className\n      )}\n      aria-label=\"Dismiss\"\n      data-slot=\"notification-dismiss\"\n      type=\"button\"\n      onClick={onClick}\n      {...props}\n    >\n      <X aria-hidden=\"true\" className=\"size-4\" />\n    </button>\n  )\n}\n\nexport { Notification, NotificationDismissButton, notificationVariants, unreadDotVariants }\nexport type { NotificationProps, NotificationVariant }\n"]}