@handled-ai/design-system 0.18.1 → 0.18.3

package/src/components/pill.tsx

@@ -1,67 +0,0 @@
-import * as React from "react"
-import { cva, type VariantProps } from "class-variance-authority"
-
-import { cn } from "../lib/utils"
-
-/**
- * Insights-friendly pill convenience wrappers.
- *
- * Pill and StatusPill are small, rounded wrappers for dense Insights surfaces
- * such as tables, KPI strips, and filter summaries. They intentionally wrap the
- * existing Badge/StatusBadge visual language and are not a replacement for all
- * Badge usage across the design system.
- */
-export type PillStatus = "success" | "warning" | "error" | "neutral" | "info"
-
-const pillVariants = cva(
-  "inline-flex w-fit shrink-0 items-center justify-center gap-1 whitespace-nowrap rounded-full border px-2.5 py-0.5 text-xs font-medium transition-colors [&>svg]:size-3",
-  {
-    variants: {
-      variant: {
-        default: "border-transparent bg-primary text-primary-foreground",
-        secondary: "border-transparent bg-secondary text-secondary-foreground",
-        destructive: "border-transparent bg-destructive text-white dark:bg-destructive/60",
-        outline: "border-border bg-background text-foreground",
-        ghost: "border-transparent bg-transparent text-muted-foreground",
-        success: "border-transparent bg-green-100 text-green-950 dark:bg-green-950 dark:text-green-100",
-        warning: "border-transparent bg-yellow-100 text-yellow-950 dark:bg-yellow-950 dark:text-yellow-100",
-        error: "border-transparent bg-red-100 text-red-950 dark:bg-red-950 dark:text-red-100",
-        neutral: "border-transparent bg-muted text-foreground",
-        info: "border-transparent bg-blue-100 text-blue-950 dark:bg-blue-950 dark:text-blue-100",
-      },
-    },
-    defaultVariants: {
-      variant: "neutral",
-    },
-  }
-)
-
-export interface PillProps
-  extends React.ComponentProps<"span">,
-    VariantProps<typeof pillVariants> {}
-
-export function Pill({ className, variant = "neutral", ...props }: PillProps) {
-  return (
-    <span
-      data-slot="pill"
-      data-variant={variant}
-      className={cn(pillVariants({ variant }), className)}
-      {...props}
-    />
-  )
-}
-
-export interface StatusPillProps extends Omit<PillProps, "variant"> {
-  status: React.ReactNode
-  intent?: PillStatus
-}
-
-export function StatusPill({ status, intent = "neutral", children, ...props }: StatusPillProps) {
-  return (
-    <Pill data-slot="status-pill" variant={intent} {...props}>
-      {children ?? status}
-    </Pill>
-  )
-}
-
-export { pillVariants }

package/src/components/quick-segment.tsx

@@ -1,68 +0,0 @@
-"use client"
-
-import * as React from "react"
-
-import { cn } from "../lib/utils"
-
-export interface QuickSegmentProps
-  extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onSelect" | "value"> {
-  label: React.ReactNode
-  value: string
-  selected?: boolean
-  count?: number | string
-  description?: React.ReactNode
-  onSelect?: (value: string) => void
-}
-
-export function QuickSegment({
-  label,
-  value,
-  selected = false,
-  count,
-  description,
-  onSelect,
-  className,
-  type = "button",
-  ...props
-}: QuickSegmentProps) {
-  return (
-    <button
-      data-slot="quick-segment"
-      data-selected={selected ? "true" : "false"}
-      type={type}
-      aria-pressed={selected}
-      className={cn(
-        "inline-flex min-h-8 items-center gap-2 rounded-full border px-3 py-1.5 text-sm font-medium transition-colors",
-        selected
-          ? "border-primary bg-primary text-primary-foreground shadow-sm"
-          : "border-border bg-background text-muted-foreground hover:bg-muted hover:text-foreground",
-        className
-      )}
-      onClick={(event) => {
-        props.onClick?.(event)
-        if (!event.defaultPrevented) onSelect?.(value)
-      }}
-      {...props}
-    >
-      <span data-slot="quick-segment-label">{label}</span>
-      {count !== undefined ? (
-        <span
-          data-slot="quick-segment-count"
-          className={cn(
-            "rounded-full px-1.5 py-0.5 text-[11px] leading-none",
-            selected
-              ? "bg-primary-foreground/20 text-primary-foreground"
-              : "bg-muted text-muted-foreground"
-          )}
-        >
-          {count}
-        </span>
-      ) : null}
-      {description ? (
-        <span data-slot="quick-segment-description" className="sr-only">
-          {description}
-        </span>
-      ) : null}
-    </button>
-  )
-}