tembro 3.0.0 → 3.1.5

package/packages/cli/vendor/src/components/charts/horizontal-bar-chart.tsx

@@ -1,60 +0,0 @@
-import * as React from "react"
-
-import { cn } from "@/lib/utils"
-
-export type HorizontalBarDatum = {
-  key: string
-  label: React.ReactNode
-  value: number
-  description?: React.ReactNode
-  color?: string
-}
-
-export type HorizontalBarChartProps = React.ComponentProps<"div"> & {
-  data: HorizontalBarDatum[]
-  max?: number
-  showValue?: boolean
-  emptyLabel?: React.ReactNode
-  valueFormatter?: (value: number) => React.ReactNode
-}
-
-function HorizontalBarChart({ data, max, showValue = true, emptyLabel = "No ranking data.", valueFormatter, className, ...props }: HorizontalBarChartProps) {
-  const resolvedMax = max ?? Math.max(...data.map((item) => item.value), 1)
-
-  if (data.length === 0) {
-    return (
-      <div
-        data-slot="horizontal-bar-chart"
-        className={cn("rounded-[min(var(--radius-xl),16px)] border border-dashed border-border/70 px-4 py-10 text-center text-sm text-muted-foreground", className)}
-        {...props}
-      >
-        {emptyLabel}
-      </div>
-    )
-  }
-
-  return (
-    <div data-slot="horizontal-bar-chart" className={cn("grid gap-3", className)} {...props}>
-      {data.map((item) => {
-        const width = resolvedMax > 0 ? Math.max(0, Math.min((item.value / resolvedMax) * 100, 100)) : 0
-
-        return (
-          <div key={item.key} className="grid gap-1.5">
-            <div className="flex items-center justify-between gap-3 text-sm">
-              <div className="min-w-0">
-                <div className="truncate font-medium text-foreground">{item.label}</div>
-                {item.description && <div className="truncate text-xs text-muted-foreground">{item.description}</div>}
-              </div>
-              {showValue && <div className="text-xs font-medium text-muted-foreground">{valueFormatter ? valueFormatter(item.value) : item.value.toLocaleString()}</div>}
-            </div>
-            <div className="h-2 overflow-hidden rounded-full bg-muted">
-              <div className="h-full rounded-full bg-primary" style={{ width: `${width}%`, background: item.color }} />
-            </div>
-          </div>
-        )
-      })}
-    </div>
-  )
-}
-
-export { HorizontalBarChart }

package/packages/cli/vendor/src/components/charts/kpi.tsx

@@ -1,68 +0,0 @@
-import * as React from "react"
-
-import { Sparkline } from "@/components/charts/charts"
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
-import { cn } from "@/lib/utils"
-
-export type KpiTone = "neutral" | "success" | "warning" | "danger"
-
-export type KpiCardProps = React.ComponentProps<typeof Card> & {
-  label: React.ReactNode
-  value: React.ReactNode
-  description?: React.ReactNode
-  change?: React.ReactNode
-  tone?: KpiTone
-  values?: number[]
-  icon?: React.ReactNode
-}
-
-const toneClassName: Record<KpiTone, string> = {
-  neutral: "bg-muted text-muted-foreground",
-  success: "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400",
-  warning: "bg-amber-500/10 text-amber-600 dark:text-amber-400",
-  danger: "bg-destructive/10 text-destructive",
-}
-
-function KpiCard({ label, value, description, change, tone = "neutral", values, icon, className, ...props }: KpiCardProps) {
-  return (
-    <Card data-slot="kpi-card" className={cn("overflow-hidden", className)} {...props}>
-      <CardHeader className="flex flex-row items-start justify-between gap-3 pb-2">
-        <CardTitle className="text-sm font-medium text-muted-foreground">{label}</CardTitle>
-        {icon && <div className="text-muted-foreground">{icon}</div>}
-      </CardHeader>
-      <CardContent className="grid gap-3">
-        <div className="flex items-end justify-between gap-3">
-          <div className="grid gap-1">
-            <div className="text-2xl font-semibold tracking-tight text-foreground">{value}</div>
-            {description && <div className="text-xs text-muted-foreground">{description}</div>}
-          </div>
-          {change && <div className={cn("rounded-full px-2 py-1 text-xs font-medium", toneClassName[tone])}>{change}</div>}
-        </div>
-        {values && <Sparkline values={values} positive={tone !== "danger"} />}
-      </CardContent>
-    </Card>
-  )
-}
-
-export type KpiGridProps = React.ComponentProps<"div"> & {
-  columns?: 1 | 2 | 3 | 4
-}
-
-function KpiGrid({ columns = 4, className, ...props }: KpiGridProps) {
-  return (
-    <div
-      data-slot="kpi-grid"
-      className={cn(
-        "grid gap-4",
-        columns === 1 && "grid-cols-1",
-        columns === 2 && "grid-cols-1 sm:grid-cols-2",
-        columns === 3 && "grid-cols-1 sm:grid-cols-2 xl:grid-cols-3",
-        columns === 4 && "grid-cols-1 sm:grid-cols-2 xl:grid-cols-4",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-export { KpiCard, KpiGrid }

package/packages/cli/vendor/src/components/display/comparison-card.tsx

@@ -1,35 +0,0 @@
-import * as React from "react"
-
-import { StatCard } from "@/components/layout/stat-card"
-
-export type ComparisonCardItem = {
-  label: React.ReactNode
-  value: React.ReactNode
-  change?: React.ReactNode
-  trend?: "up" | "down" | "neutral"
-}
-
-export type ComparisonCardProps = Omit<React.ComponentProps<typeof StatCard>, "comparisonItems" | "comparisonColumns"> & {
-  title?: React.ReactNode
-  items: ComparisonCardItem[]
-  columns?: 2 | 3 | 4
-}
-
-function ComparisonCard({ title, items, columns = 2, ...props }: ComparisonCardProps) {
-  return (
-    <StatCard
-      data-slot="comparison-card"
-      title={title}
-      comparisonColumns={columns}
-      comparisonItems={items.map((item) => ({
-        label: item.label,
-        value: item.value,
-        change: item.change,
-        trend: item.trend === "up" ? "success" : item.trend === "down" ? "danger" : "neutral",
-      }))}
-      {...props}
-    />
-  )
-}
-
-export { ComparisonCard }

package/packages/cli/vendor/src/components/display/data-list.tsx

@@ -1,97 +0,0 @@
-import * as React from "react"
-import { ChevronRightIcon } from "lucide-react"
-
-import { cn } from "@/lib/utils"
-
-export type DataListItem = {
-  key: string
-  label: React.ReactNode
-  value?: React.ReactNode
-  description?: React.ReactNode
-  meta?: React.ReactNode
-  icon?: React.ReactNode
-  href?: string
-  disabled?: boolean
-  onClick?: () => void
-}
-
-export type DataListProps = React.ComponentProps<"div"> & {
-  items: DataListItem[]
-  density?: "compact" | "default" | "comfortable"
-  showDividers?: boolean
-}
-
-const densityClassNames = {
-  compact: "px-3 py-2",
-  default: "px-4 py-3",
-  comfortable: "px-5 py-4",
-}
-
-function DataList({ items, density = "default", showDividers = true, className, ...props }: DataListProps) {
-  return (
-    <div
-      data-slot="data-list"
-      className={cn("overflow-hidden rounded-[var(--aui-card-radius,var(--radius-xl))] border bg-card text-card-foreground", className)}
-      {...props}
-    >
-      {items.map((item) => (
-        <DataListRow key={item.key} item={item} density={density} showDivider={showDividers} />
-      ))}
-    </div>
-  )
-}
-
-export type DataListRowProps = React.ComponentProps<"div"> & {
-  item: DataListItem
-  density?: DataListProps["density"]
-  showDivider?: boolean
-}
-
-function DataListRow({ item, density = "default", showDivider = true, className, ...props }: DataListRowProps) {
-  const interactive = Boolean(item.href || item.onClick)
-  const rowClassName = cn(
-    "group flex min-w-0 items-center gap-3 bg-card text-sm transition-colors",
-    densityClassNames[density],
-    showDivider && "border-b last:border-b-0",
-    interactive && !item.disabled && "cursor-pointer hover:bg-muted/55",
-    item.disabled && "pointer-events-none opacity-55",
-    className
-  )
-  const content = (
-    <>
-      {item.icon && <div className="flex size-9 shrink-0 items-center justify-center rounded-lg bg-muted text-muted-foreground">{item.icon}</div>}
-      <div className="min-w-0 flex-1">
-        <div className="flex min-w-0 items-center gap-2">
-          <div className="truncate font-medium text-foreground">{item.label}</div>
-          {item.meta && <div className="shrink-0 text-xs text-muted-foreground">{item.meta}</div>}
-        </div>
-        {item.description && <div className="mt-0.5 line-clamp-2 text-xs leading-5 text-muted-foreground">{item.description}</div>}
-      </div>
-      {item.value && <div className="shrink-0 text-right font-medium text-foreground">{item.value}</div>}
-      {interactive && <ChevronRightIcon className="size-4 shrink-0 text-muted-foreground transition-transform group-hover:translate-x-0.5" />}
-    </>
-  )
-
-  if (item.href) {
-    return (
-      <a data-slot="data-list-row" href={item.href} className={rowClassName} {...(props as React.ComponentProps<"a">)}>
-        {content}
-      </a>
-    )
-  }
-
-  return (
-    <div
-      data-slot="data-list-row"
-      role={interactive ? "button" : undefined}
-      tabIndex={interactive && !item.disabled ? 0 : undefined}
-      className={rowClassName}
-      onClick={item.onClick}
-      {...props}
-    >
-      {content}
-    </div>
-  )
-}
-
-export { DataList, DataListRow }

package/packages/cli/vendor/src/components/display/delta-badge.tsx

@@ -1,42 +0,0 @@
-import * as React from "react"
-import { ArrowDownIcon, ArrowUpIcon, MinusIcon } from "lucide-react"
-
-import { Badge, type BadgeProps } from "@/components/ui/badge"
-import { cn } from "@/lib/utils"
-
-export type DeltaBadgeProps = Omit<BadgeProps, "children" | "label" | "tone" | "status" | "leftIcon" | "variant" | "size"> & {
-  value: React.ReactNode
-  trend?: "up" | "down" | "neutral"
-  size?: "sm" | "default"
-  icon?: boolean
-}
-
-function DeltaBadge({
-  value,
-  trend = "neutral",
-  size = "default",
-  icon = true,
-  className,
-  ...props
-}: DeltaBadgeProps) {
-  const TrendIcon = trend === "up" ? ArrowUpIcon : trend === "down" ? ArrowDownIcon : MinusIcon
-  const tone = trend === "up" ? "success" : trend === "down" ? "danger" : "muted"
-
-  return (
-    <Badge
-      data-slot="delta-badge"
-      variant="soft"
-      tone={tone}
-      size={size}
-      leftIcon={icon ? <TrendIcon className={cn("shrink-0", size === "sm" ? "size-2.5" : "size-3")} /> : undefined}
-      label={value}
-      className={cn(
-        size === "sm" && "min-h-5 px-1.5 text-[10px]",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-export { DeltaBadge }

package/packages/cli/vendor/src/components/display/descriptions.tsx

@@ -1,83 +0,0 @@
-import * as React from "react"
-
-import { cn } from "@/lib/utils"
-
-export type DescriptionItem = {
-  key: string
-  label: React.ReactNode
-  value: React.ReactNode
-  span?: 1 | 2 | 3 | 4
-}
-
-export type DescriptionsProps = React.ComponentProps<"div"> & {
-  items: DescriptionItem[]
-  title?: React.ReactNode
-  extra?: React.ReactNode
-  bordered?: boolean
-  columns?: 1 | 2 | 3 | 4
-  size?: "sm" | "md" | "lg"
-  labelClassName?: string
-  valueClassName?: string
-}
-
-const gapClassName = {
-  sm: "gap-2 text-sm",
-  md: "gap-3 text-sm",
-  lg: "gap-4 text-base",
-}
-
-function Descriptions({
-  items,
-  title,
-  extra,
-  bordered = true,
-  columns = 3,
-  size = "md",
-  labelClassName,
-  valueClassName,
-  className,
-  ...props
-}: DescriptionsProps) {
-  return (
-    <div data-slot="descriptions" className={cn("grid gap-3", className)} {...props}>
-      {(title || extra) && (
-        <div className="flex items-center justify-between gap-3">
-          {title && <div className="text-base font-semibold text-foreground">{title}</div>}
-          {extra}
-        </div>
-      )}
-      <div
-        className={cn(
-          "grid overflow-hidden",
-          bordered && "rounded-lg border bg-card",
-          !bordered && gapClassName[size],
-          columns === 1 && "grid-cols-1",
-          columns === 2 && "grid-cols-1 sm:grid-cols-2",
-          columns === 3 && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
-          columns === 4 && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4"
-        )}
-      >
-        {items.map((item) => (
-          <div
-            key={item.key}
-            data-slot="descriptions-item"
-            className={cn(
-              "min-w-0",
-              bordered ? "border-b border-r p-3 last:border-b-0" : "grid gap-1",
-              item.span === 2 && "sm:col-span-2",
-              item.span === 3 && "lg:col-span-3",
-              item.span === 4 && "lg:col-span-4"
-            )}
-          >
-            <div className={cn("text-xs font-medium uppercase tracking-wide text-muted-foreground", labelClassName)}>
-              {item.label}
-            </div>
-            <div className={cn("mt-1 min-w-0 break-words text-sm text-foreground", valueClassName)}>{item.value}</div>
-          </div>
-        ))}
-      </div>
-    </div>
-  )
-}
-
-export { Descriptions }

package/packages/cli/vendor/src/components/display/metric-grid.tsx

@@ -1,89 +0,0 @@
-import * as React from "react"
-
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"
-import { cn } from "@/lib/utils"
-
-export type MetricTone = "default" | "success" | "warning" | "danger" | "info" | "muted"
-export type MetricGridColumn = 1 | 2 | 3 | 4
-
-export type MetricItem = {
-  key: string
-  label: React.ReactNode
-  value: React.ReactNode
-  description?: React.ReactNode
-  icon?: React.ReactNode
-  trend?: React.ReactNode
-  tone?: MetricTone
-  hidden?: boolean
-  className?: string
-  loading?: boolean
-}
-
-export type MetricGridProps = React.ComponentProps<"div"> & {
-  items: MetricItem[]
-  columns?: MetricGridColumn
-  compact?: boolean
-  itemClassName?: string
-}
-
-const columnsClassName: Record<MetricGridColumn, string> = {
-  1: "grid-cols-1",
-  2: "grid-cols-1 sm:grid-cols-2",
-  3: "grid-cols-1 sm:grid-cols-2 xl:grid-cols-3",
-  4: "grid-cols-1 sm:grid-cols-2 xl:grid-cols-4",
-}
-
-const toneClassName: Record<MetricTone, string> = {
-  default: "",
-  success: "border-emerald-500/20 bg-emerald-500/5",
-  warning: "border-amber-500/20 bg-amber-500/5",
-  danger: "border-destructive/20 bg-destructive/5",
-  info: "border-blue-500/20 bg-blue-500/5",
-  muted: "bg-muted/40",
-}
-
-function MetricGrid({
-  className,
-  items,
-  columns = 4,
-  compact = false,
-  itemClassName,
-  ...props
-}: MetricGridProps) {
-  const visibleItems = items.filter((item) => !item.hidden)
-
-  return (
-    <div
-      data-slot="metric-grid"
-      className={cn("grid gap-3", columnsClassName[columns], className)}
-      {...props}
-    >
-      {visibleItems.map((item) => (
-        <Card
-          key={item.key}
-          data-slot="stat-card"
-          data-tone={item.tone ?? "default"}
-          className={cn("min-w-0 overflow-hidden", toneClassName[item.tone ?? "default"], itemClassName, item.className)}
-        >
-          <CardHeader className={cn("flex flex-row items-start justify-between gap-3 space-y-0", compact ? "p-3 pb-1" : "pb-2")}>
-            <div className="min-w-0 space-y-1">
-              <CardDescription className="truncate">{item.label}</CardDescription>
-              <CardTitle className={cn("truncate", compact ? "text-xl" : "text-2xl")}>
-                {item.loading ? <span className="block h-8 w-24 animate-pulse rounded bg-muted" /> : item.value}
-              </CardTitle>
-            </div>
-            {item.icon && <div className="shrink-0 rounded-lg bg-muted p-2 text-muted-foreground [&_svg]:size-4">{item.icon}</div>}
-          </CardHeader>
-          {(item.description || item.trend) && (
-            <CardContent className={cn("flex min-w-0 items-center justify-between gap-2", compact ? "p-3 pt-1" : "pt-0")}>
-              {item.description && <div className="min-w-0 truncate text-xs text-muted-foreground">{item.description}</div>}
-              {item.trend && <div className="shrink-0 text-xs font-medium">{item.trend}</div>}
-            </CardContent>
-          )}
-        </Card>
-      ))}
-    </div>
-  )
-}
-
-export { MetricGrid }

package/packages/cli/vendor/src/components/display/progress-circle.tsx

@@ -1,24 +0,0 @@
-import * as React from "react"
-
-import { cn } from "@/lib/utils"
-
-export type ProgressCircleProps = React.ComponentProps<"div"> & {
-  value?: number
-  max?: number
-  label?: React.ReactNode
-}
-
-function ProgressCircle({ value = 0, max = 100, label, className, ...props }: ProgressCircleProps) {
-  const percent = max > 0 ? Math.max(0, Math.min(100, Math.round((value / max) * 100))) : 0
-
-  return (
-    <div data-slot="progress-circle" className={cn("inline-flex items-center gap-3", className)} {...props}>
-      <span className="inline-flex size-14 items-center justify-center rounded-full border-4 border-muted bg-background text-xs font-semibold text-foreground">
-        {percent}%
-      </span>
-      {label ? <span className="text-sm text-muted-foreground">{label}</span> : null}
-    </div>
-  )
-}
-
-export { ProgressCircle }

package/packages/cli/vendor/src/components/display/property-grid.tsx

@@ -1,54 +0,0 @@
-import * as React from "react"
-
-import { cn } from "@/lib/utils"
-
-export type PropertyGridItem = {
-  key: string
-  label: React.ReactNode
-  value: React.ReactNode
-  description?: React.ReactNode
-  span?: 1 | 2 | 3 | 4
-}
-
-export type PropertyGridProps = React.ComponentProps<"div"> & {
-  items: PropertyGridItem[]
-  columns?: 1 | 2 | 3 | 4
-  bordered?: boolean
-}
-
-function PropertyGrid({ items, columns = 3, bordered = true, className, ...props }: PropertyGridProps) {
-  return (
-    <div
-      data-slot="property-grid"
-      className={cn(
-        "grid gap-3",
-        columns === 1 && "grid-cols-1",
-        columns === 2 && "grid-cols-1 sm:grid-cols-2",
-        columns === 3 && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-3",
-        columns === 4 && "grid-cols-1 sm:grid-cols-2 lg:grid-cols-4",
-        className
-      )}
-      {...props}
-    >
-      {items.map((item) => (
-        <div
-          key={item.key}
-          data-slot="property-grid-item"
-          className={cn(
-            "min-w-0 rounded-lg bg-card p-3",
-            bordered && "border",
-            item.span === 2 && "sm:col-span-2",
-            item.span === 3 && "lg:col-span-3",
-            item.span === 4 && "lg:col-span-4"
-          )}
-        >
-          <div className="text-xs font-medium uppercase tracking-wide text-muted-foreground">{item.label}</div>
-          <div className="mt-1 break-words text-sm font-medium text-foreground">{item.value}</div>
-          {item.description && <div className="mt-1 text-xs text-muted-foreground">{item.description}</div>}
-        </div>
-      ))}
-    </div>
-  )
-}
-
-export { PropertyGrid }

package/packages/cli/vendor/src/components/display/result.tsx

@@ -1,90 +0,0 @@
-import * as React from "react"
-import { AlertCircleIcon, CheckCircle2Icon, InfoIcon, ShieldAlertIcon, TriangleAlertIcon } from "lucide-react"
-
-import { Button } from "@/components/ui/button"
-import { cn } from "@/lib/utils"
-
-export type ResultStatus = "success" | "error" | "warning" | "info" | "not-found" | "forbidden" | "server-error"
-
-export type ResultProps = React.ComponentProps<"div"> & {
-  status?: ResultStatus
-  icon?: React.ReactNode
-  title?: React.ReactNode
-  description?: React.ReactNode
-  actions?: React.ReactNode
-  extra?: React.ReactNode
-  compact?: boolean
-  iconClassName?: string
-  titleClassName?: string
-  descriptionClassName?: string
-}
-
-const statusIcon: Record<ResultStatus, React.ReactNode> = {
-  success: <CheckCircle2Icon className="size-8" />,
-  error: <AlertCircleIcon className="size-8" />,
-  warning: <TriangleAlertIcon className="size-8" />,
-  info: <InfoIcon className="size-8" />,
-  "not-found": <InfoIcon className="size-8" />,
-  forbidden: <ShieldAlertIcon className="size-8" />,
-  "server-error": <AlertCircleIcon className="size-8" />,
-}
-
-const statusClassName: Record<ResultStatus, string> = {
-  success: "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400",
-  error: "bg-destructive/10 text-destructive",
-  warning: "bg-amber-500/10 text-amber-600 dark:text-amber-400",
-  info: "bg-blue-500/10 text-blue-600 dark:text-blue-400",
-  "not-found": "bg-muted text-muted-foreground",
-  forbidden: "bg-amber-500/10 text-amber-600 dark:text-amber-400",
-  "server-error": "bg-destructive/10 text-destructive",
-}
-
-const defaultTitle: Record<ResultStatus, React.ReactNode> = {
-  success: "Success",
-  error: "Something went wrong",
-  warning: "Check this action",
-  info: "Information",
-  "not-found": "Page not found",
-  forbidden: "Access forbidden",
-  "server-error": "Server error",
-}
-
-function Result({
-  status = "info",
-  icon,
-  title,
-  description,
-  actions,
-  extra,
-  compact = false,
-  iconClassName,
-  titleClassName,
-  descriptionClassName,
-  className,
-  ...props
-}: ResultProps) {
-  return (
-    <div
-      data-slot="result"
-      data-status={status}
-      className={cn("flex flex-col items-center justify-center text-center", compact ? "gap-3 p-4" : "gap-4 p-8", className)}
-      {...props}
-    >
-      <div className={cn("flex items-center justify-center rounded-full", compact ? "size-12" : "size-16", statusClassName[status], iconClassName)}>
-        {icon ?? statusIcon[status]}
-      </div>
-      <div className="max-w-lg space-y-2">
-        <h3 className={cn("font-semibold tracking-tight", compact ? "text-base" : "text-2xl", titleClassName)}>{title ?? defaultTitle[status]}</h3>
-        {description && <p className={cn("text-sm leading-6 text-muted-foreground", descriptionClassName)}>{description}</p>}
-      </div>
-      {actions && <div className="flex flex-wrap justify-center gap-2">{actions}</div>}
-      {extra && <div className="w-full max-w-2xl">{extra}</div>}
-    </div>
-  )
-}
-
-function ResultAction({ className, ...props }: React.ComponentProps<typeof Button>) {
-  return <Button className={cn("min-w-28", className)} {...props} />
-}
-
-export { Result, ResultAction }