tembro 6.1.0 → 6.1.1

package/dist/src/components/ui/number-field/index.cjs

@@ -1 +0,0 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../lib/utils.cjs");let n=require("react");n=e.__toESM(n,1);let r=require("lucide-react"),i=require("react/jsx-runtime"),a=require("@base-ui/react/number-field");function o({className:e,...n}){return(0,i.jsx)(a.NumberField.Root,{"data-slot":`number-field`,className:t.cn(`grid gap-2`,e),...n})}function s({className:e,...n}){return(0,i.jsx)(a.NumberField.Group,{"data-slot":`number-field-group`,className:t.cn(`flex min-h-10 w-full overflow-hidden rounded-[var(--radius-md)] border border-input bg-background text-foreground shadow-xs transition-[border-color,box-shadow] focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/35 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50`,e),...n})}function c({className:e,...n}){return(0,i.jsx)(a.NumberField.Input,{"data-slot":`number-field-input`,className:t.cn(`min-w-0 flex-1 bg-transparent px-3 py-2 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed`,e),...n})}function l({className:e,children:n,...o}){return(0,i.jsx)(a.NumberField.Increment,{"data-slot":`number-field-increment`,className:t.cn(`flex h-5 w-8 items-center justify-center border-l border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:pointer-events-none disabled:opacity-40`,e),...o,children:n??(0,i.jsx)(r.ChevronUpIcon,{"aria-hidden":`true`,className:`size-3.5`})})}function u({className:e,children:n,...o}){return(0,i.jsx)(a.NumberField.Decrement,{"data-slot":`number-field-decrement`,className:t.cn(`flex h-5 w-8 items-center justify-center border-l border-t border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:pointer-events-none disabled:opacity-40`,e),...o,children:n??(0,i.jsx)(r.ChevronDownIcon,{"aria-hidden":`true`,className:`size-3.5`})})}function d({className:e,...n}){return(0,i.jsx)(`div`,{"data-slot":`number-field-stepper`,className:t.cn(`grid shrink-0 grid-rows-2`,e),...n})}function f({className:e,...n}){return(0,i.jsx)(a.NumberField.ScrubArea,{"data-slot":`number-field-scrub-area`,className:t.cn(`cursor-ew-resize select-none`,e),...n})}function p({className:e,...n}){return(0,i.jsx)(a.NumberField.ScrubAreaCursor,{"data-slot":`number-field-scrub-area-cursor`,className:t.cn(`fixed z-50 rounded bg-foreground px-2 py-1 text-xs text-background shadow-lg`,e),...n})}exports.NumberField=o,exports.NumberFieldDecrement=u,exports.NumberFieldGroup=s,exports.NumberFieldIncrement=l,exports.NumberFieldInput=c,exports.NumberFieldScrubArea=f,exports.NumberFieldScrubAreaCursor=p,exports.NumberFieldStepper=d;

package/dist/src/components/ui/number-field/index.js

@@ -1,73 +0,0 @@
-"use client";
-import { cn as e } from "../../../lib/utils.js";
-import "react";
-import { ChevronDownIcon as t, ChevronUpIcon as n } from "lucide-react";
-import { jsx as r } from "react/jsx-runtime";
-import { NumberField as i } from "@base-ui/react/number-field";
-//#region src/components/ui/number-field/index.tsx
-function a({ className: t, ...n }) {
-	return /* @__PURE__ */ r(i.Root, {
-		"data-slot": "number-field",
-		className: e("grid gap-2", t),
-		...n
-	});
-}
-function o({ className: t, ...n }) {
-	return /* @__PURE__ */ r(i.Group, {
-		"data-slot": "number-field-group",
-		className: e("flex min-h-10 w-full overflow-hidden rounded-[var(--radius-md)] border border-input bg-background text-foreground shadow-xs transition-[border-color,box-shadow] focus-within:border-ring focus-within:ring-2 focus-within:ring-ring/35 has-[:disabled]:cursor-not-allowed has-[:disabled]:opacity-50", t),
-		...n
-	});
-}
-function s({ className: t, ...n }) {
-	return /* @__PURE__ */ r(i.Input, {
-		"data-slot": "number-field-input",
-		className: e("min-w-0 flex-1 bg-transparent px-3 py-2 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed", t),
-		...n
-	});
-}
-function c({ className: t, children: a, ...o }) {
-	return /* @__PURE__ */ r(i.Increment, {
-		"data-slot": "number-field-increment",
-		className: e("flex h-5 w-8 items-center justify-center border-l border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:pointer-events-none disabled:opacity-40", t),
-		...o,
-		children: a ?? /* @__PURE__ */ r(n, {
-			"aria-hidden": "true",
-			className: "size-3.5"
-		})
-	});
-}
-function l({ className: n, children: a, ...o }) {
-	return /* @__PURE__ */ r(i.Decrement, {
-		"data-slot": "number-field-decrement",
-		className: e("flex h-5 w-8 items-center justify-center border-l border-t border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:pointer-events-none disabled:opacity-40", n),
-		...o,
-		children: a ?? /* @__PURE__ */ r(t, {
-			"aria-hidden": "true",
-			className: "size-3.5"
-		})
-	});
-}
-function u({ className: t, ...n }) {
-	return /* @__PURE__ */ r("div", {
-		"data-slot": "number-field-stepper",
-		className: e("grid shrink-0 grid-rows-2", t),
-		...n
-	});
-}
-function d({ className: t, ...n }) {
-	return /* @__PURE__ */ r(i.ScrubArea, {
-		"data-slot": "number-field-scrub-area",
-		className: e("cursor-ew-resize select-none", t),
-		...n
-	});
-}
-function f({ className: t, ...n }) {
-	return /* @__PURE__ */ r(i.ScrubAreaCursor, {
-		"data-slot": "number-field-scrub-area-cursor",
-		className: e("fixed z-50 rounded bg-foreground px-2 py-1 text-xs text-background shadow-lg", t),
-		...n
-	});
-}
-//#endregion
-export { a as NumberField, l as NumberFieldDecrement, o as NumberFieldGroup, c as NumberFieldIncrement, s as NumberFieldInput, d as NumberFieldScrubArea, f as NumberFieldScrubAreaCursor, u as NumberFieldStepper };

package/dist/src/components/ui/toolbar/index.cjs

@@ -1 +0,0 @@
-"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../../lib/utils.cjs");let t=require("react/jsx-runtime"),n=require("@base-ui/react/toolbar");function r({className:r,orientation:i=`horizontal`,...a}){return(0,t.jsx)(n.Toolbar.Root,{"data-slot":`toolbar`,orientation:i,className:e.cn(`flex min-w-0 items-center gap-1 rounded-[var(--radius-lg)] border border-border bg-card p-1 text-card-foreground shadow-xs`,i===`vertical`&&`w-max flex-col items-stretch`,r),...a})}function i({className:r,...i}){return(0,t.jsx)(n.Toolbar.Group,{"data-slot":`toolbar-group`,className:e.cn(`flex min-w-0 items-center gap-1`,r),...i})}function a({className:r,...i}){return(0,t.jsx)(n.Toolbar.Button,{"data-slot":`toolbar-button`,className:e.cn(`inline-flex h-8 min-w-8 items-center justify-center gap-1.5 rounded-[var(--radius-md)] px-2.5 text-sm font-medium text-muted-foreground outline-none transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 data-[pressed]:bg-muted data-[pressed]:text-foreground [&_svg]:size-4 [&_svg]:shrink-0`,r),...i})}function o({className:r,...i}){return(0,t.jsx)(n.Toolbar.Link,{"data-slot":`toolbar-link`,className:e.cn(`inline-flex h-8 items-center justify-center gap-1.5 rounded-[var(--radius-md)] px-2.5 text-sm font-medium text-muted-foreground outline-none transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring`,r),...i})}function s({className:r,...i}){return(0,t.jsx)(n.Toolbar.Input,{"data-slot":`toolbar-input`,className:e.cn(`h-8 min-w-32 rounded-[var(--radius-md)] border border-input bg-background px-2.5 text-sm outline-none placeholder:text-muted-foreground focus-visible:ring-2 focus-visible:ring-ring`,r),...i})}function c({className:r,...i}){return(0,t.jsx)(n.Toolbar.Separator,{"data-slot":`toolbar-separator`,className:e.cn(`mx-1 h-5 w-px bg-border data-[orientation=vertical]:h-px data-[orientation=vertical]:w-full`,r),...i})}exports.Toolbar=r,exports.ToolbarButton=a,exports.ToolbarGroup=i,exports.ToolbarInput=s,exports.ToolbarLink=o,exports.ToolbarSeparator=c;

package/dist/src/components/ui/toolbar/index.js

@@ -1,50 +0,0 @@
-"use client";
-import { cn as e } from "../../../lib/utils.js";
-import { jsx as t } from "react/jsx-runtime";
-import { Toolbar as n } from "@base-ui/react/toolbar";
-//#region src/components/ui/toolbar/index.tsx
-function r({ className: r, orientation: i = "horizontal", ...a }) {
-	return /* @__PURE__ */ t(n.Root, {
-		"data-slot": "toolbar",
-		orientation: i,
-		className: e("flex min-w-0 items-center gap-1 rounded-[var(--radius-lg)] border border-border bg-card p-1 text-card-foreground shadow-xs", i === "vertical" && "w-max flex-col items-stretch", r),
-		...a
-	});
-}
-function i({ className: r, ...i }) {
-	return /* @__PURE__ */ t(n.Group, {
-		"data-slot": "toolbar-group",
-		className: e("flex min-w-0 items-center gap-1", r),
-		...i
-	});
-}
-function a({ className: r, ...i }) {
-	return /* @__PURE__ */ t(n.Button, {
-		"data-slot": "toolbar-button",
-		className: e("inline-flex h-8 min-w-8 items-center justify-center gap-1.5 rounded-[var(--radius-md)] px-2.5 text-sm font-medium text-muted-foreground outline-none transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 data-[pressed]:bg-muted data-[pressed]:text-foreground [&_svg]:size-4 [&_svg]:shrink-0", r),
-		...i
-	});
-}
-function o({ className: r, ...i }) {
-	return /* @__PURE__ */ t(n.Link, {
-		"data-slot": "toolbar-link",
-		className: e("inline-flex h-8 items-center justify-center gap-1.5 rounded-[var(--radius-md)] px-2.5 text-sm font-medium text-muted-foreground outline-none transition-colors hover:bg-muted hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring", r),
-		...i
-	});
-}
-function s({ className: r, ...i }) {
-	return /* @__PURE__ */ t(n.Input, {
-		"data-slot": "toolbar-input",
-		className: e("h-8 min-w-32 rounded-[var(--radius-md)] border border-input bg-background px-2.5 text-sm outline-none placeholder:text-muted-foreground focus-visible:ring-2 focus-visible:ring-ring", r),
-		...i
-	});
-}
-function c({ className: r, ...i }) {
-	return /* @__PURE__ */ t(n.Separator, {
-		"data-slot": "toolbar-separator",
-		className: e("mx-1 h-5 w-px bg-border data-[orientation=vertical]:h-px data-[orientation=vertical]:w-full", r),
-		...i
-	});
-}
-//#endregion
-export { r as Toolbar, a as ToolbarButton, i as ToolbarGroup, s as ToolbarInput, o as ToolbarLink, c as ToolbarSeparator };

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

@@ -1,195 +0,0 @@
-import * as React from "react"
-
-import { Card } from "@/components/ui/card"
-import { Skeleton, SkeletonText } from "@/components/ui/skeleton"
-import { cn, stopInteractivePropagation } from "@/lib/utils"
-
-export type InfoCardVariant = "default" | "outline" | "elevated" | "ghost"
-export type InfoCardSize = "sm" | "md" | "lg"
-export type InfoCardDensity = "compact" | "default" | "comfortable"
-export type InfoCardOrientation = "vertical" | "horizontal"
-
-export type InfoCardClassNames = {
-  root?: string
-  media?: string
-  header?: string
-  icon?: string
-  body?: string
-  eyebrow?: string
-  title?: string
-  description?: string
-  content?: string
-  footer?: string
-  actions?: string
-  meta?: string
-  status?: string
-}
-
-export type InfoCardRenderContext = {
-  title?: React.ReactNode
-  description?: React.ReactNode
-  eyebrow?: React.ReactNode
-  media?: React.ReactNode
-  icon?: React.ReactNode
-  status?: React.ReactNode
-  actions?: React.ReactNode
-  meta?: React.ReactNode
-  content?: React.ReactNode
-  footer?: React.ReactNode
-}
-
-export type InfoCardProps = Omit<React.ComponentProps<typeof Card>, "title" | "content" | "size" | "orientation"> & InfoCardRenderContext & {
-  orientation?: InfoCardOrientation
-  variant?: InfoCardVariant
-  size?: InfoCardSize
-  density?: InfoCardDensity
-  compact?: boolean
-  loading?: boolean
-  disabled?: boolean
-  selected?: boolean
-  interactive?: boolean
-  classNames?: InfoCardClassNames
-  renderHeader?: (ctx: InfoCardRenderContext) => React.ReactNode
-  renderMedia?: (ctx: InfoCardRenderContext) => React.ReactNode
-  renderContent?: (ctx: InfoCardRenderContext) => React.ReactNode
-  renderFooter?: (ctx: InfoCardRenderContext) => React.ReactNode
-}
-
-const densityClassName: Record<InfoCardDensity, string> = {
-  compact: "gap-2",
-  default: "gap-3",
-  comfortable: "gap-4",
-}
-
-const titleClassName: Record<InfoCardSize, string> = {
-  sm: "text-sm font-semibold",
-  md: "text-base font-semibold",
-  lg: "text-lg font-semibold",
-}
-
-function InfoCard({
-  eyebrow,
-  title,
-  description,
-  media,
-  icon,
-  status,
-  actions,
-  meta,
-  content,
-  footer,
-  orientation = "vertical",
-  variant = "outline",
-  size = "md",
-  density,
-  compact,
-  loading = false,
-  disabled = false,
-  selected = false,
-  interactive,
-  className,
-  classNames,
-  renderHeader,
-  renderMedia,
-  renderContent,
-  renderFooter,
-  children,
-  onClick,
-  ...props
-}: InfoCardProps) {
-  const ctx: InfoCardRenderContext = { eyebrow, title, description, media, icon, status, actions, meta, content, footer }
-  const clickable = Boolean(onClick || interactive)
-  const resolvedDensity = compact ? "compact" : density ?? "default"
-
-  return (
-    <Card
-      data-slot="info-card"
-      data-selected={selected || undefined}
-      data-disabled={disabled || undefined}
-      data-loading={loading || undefined}
-      data-info-variant={variant}
-      data-info-size={size}
-      data-info-density={resolvedDensity}
-      data-orientation={orientation}
-      variant={variant}
-      size={size === "md" ? "default" : size}
-      density={resolvedDensity}
-      interactive={clickable}
-      selected={selected}
-      disabled={disabled}
-      className={cn(
-        "overflow-hidden",
-        orientation === "horizontal" && "flex",
-        className,
-        classNames?.root
-      )}
-      onClick={disabled ? undefined : onClick}
-      {...props}
-    >
-      {loading ? (
-        <div data-slot="info-card-loading" className="grid gap-3">
-          <Skeleton className="h-5 w-1/2" />
-          <SkeletonText rows={3} />
-        </div>
-      ) : (
-        <>
-          {media &&
-            (renderMedia?.(ctx) ?? (
-              <div
-                data-slot="info-card-media"
-                className={cn(
-                  orientation === "horizontal" ? "w-40 shrink-0" : "aspect-video",
-                  classNames?.media
-                )}
-              >
-                {media}
-              </div>
-            ))}
-          <div data-slot="info-card-body" className={cn("grid min-w-0 flex-1 gap-3", densityClassName[resolvedDensity], classNames?.body)}>
-            {renderHeader?.(ctx) ?? (
-              <div data-slot="info-card-header" className={cn("flex items-start justify-between gap-3", classNames?.header)}>
-                <div className="flex min-w-0 items-start gap-3">
-                  {icon && (
-                    <div
-                      data-slot="info-card-icon"
-                      className={cn(
-                        "flex shrink-0 items-center justify-center",
-                        classNames?.icon
-                      )}
-                    >
-                      {icon}
-                    </div>
-                  )}
-                  <div className="grid min-w-0 gap-1">
-                    {eyebrow && <div data-slot="info-card-eyebrow" className={classNames?.eyebrow}>{eyebrow}</div>}
-                    <div className="flex flex-wrap items-center gap-2">
-                      {title && <div data-slot="info-card-title" className={cn("truncate", titleClassName[size], classNames?.title)}>{title}</div>}
-                      {status && <div data-slot="info-card-status" className={classNames?.status}>{status}</div>}
-                    </div>
-                    {description && <div data-slot="info-card-description" className={cn("line-clamp-2", classNames?.description)}>{description}</div>}
-                  </div>
-                </div>
-                {actions && (
-                  <div
-                    data-slot="info-card-actions"
-                    className={cn("shrink-0", classNames?.actions)}
-                    onClick={stopInteractivePropagation}
-                    onMouseDown={stopInteractivePropagation}
-                    onDoubleClick={stopInteractivePropagation}
-                  >
-                    {actions}
-                  </div>
-                )}
-              </div>
-            )}
-            {meta && <div data-slot="info-card-meta" className={classNames?.meta}>{meta}</div>}
-            {(content || children) && (renderContent?.(ctx) ?? <div data-slot="info-card-content" className={classNames?.content}>{content ?? children}</div>)}
-            {footer && (renderFooter?.(ctx) ?? <div data-slot="info-card-footer" className={classNames?.footer}>{footer}</div>)}
-          </div>
-        </>
-      )}
-    </Card>
-  )
-}
-
-export { InfoCard }

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

@@ -1,114 +0,0 @@
-import * as React from "react"
-import { ArrowDownIcon, ArrowUpIcon } from "lucide-react"
-
-import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"
-import { cn } from "@/lib/utils"
-
-export type StatisticTrend = "up" | "down" | "neutral"
-
-export type StatisticProps = React.ComponentProps<"div"> & {
-  label: React.ReactNode
-  value: React.ReactNode
-  prefix?: React.ReactNode
-  suffix?: React.ReactNode
-  description?: React.ReactNode
-  trend?: StatisticTrend
-  change?: React.ReactNode
-  loading?: boolean
-}
-
-function Statistic({ label, value, prefix, suffix, description, trend = "neutral", change, loading = false, className, ...props }: StatisticProps) {
-  const trendIcon = trend === "up" ? <ArrowUpIcon className="size-3" /> : trend === "down" ? <ArrowDownIcon className="size-3" /> : null
-
-  return (
-    <div data-slot="statistic" data-loading={loading || undefined} data-trend={trend} aria-busy={loading || undefined} className={cn("grid gap-1", className)} {...props}>
-      <div data-slot="statistic-label" className="text-sm text-muted-foreground">{label}</div>
-      <div data-slot="statistic-value-row" className="flex flex-wrap items-baseline gap-1.5">
-        {loading ? (
-          <div data-slot="statistic-skeleton" className="h-8 w-28 animate-pulse rounded-md bg-muted" />
-        ) : (
-          <>
-            {prefix && <span data-slot="statistic-prefix" className="text-base text-muted-foreground">{prefix}</span>}
-            <span data-slot="statistic-value" className="text-2xl font-semibold tracking-tight">{value}</span>
-            {suffix && <span data-slot="statistic-suffix" className="text-sm text-muted-foreground">{suffix}</span>}
-          </>
-        )}
-      </div>
-      {(description || change) && (
-        <div data-slot="statistic-meta" className="flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
-          {change && (
-            <span
-              data-slot="statistic-change"
-              data-trend={trend}
-              className={cn(
-                "inline-flex items-center gap-1 rounded-full px-1.5 py-0.5 font-medium",
-                trend === "up" && "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400",
-                trend === "down" && "bg-destructive/10 text-destructive",
-                trend === "neutral" && "bg-muted text-muted-foreground"
-              )}
-            >
-              {trendIcon}
-              {change}
-            </span>
-          )}
-          {description && <span data-slot="statistic-description">{description}</span>}
-        </div>
-      )}
-    </div>
-  )
-}
-
-export type StatisticCardProps = React.ComponentProps<typeof Card> & StatisticProps & {
-  action?: React.ReactNode
-  density?: "compact" | "default"
-}
-
-function StatisticCard({ action, density = "default", label, value, prefix, suffix, description, trend, change, loading, className, ...props }: StatisticCardProps) {
-  return (
-    <Card data-slot="statistic-card" data-density={density} className={className} {...props}>
-      <CardHeader data-slot="statistic-card-header" className={cn("flex flex-row items-center justify-between gap-3 pb-2", density === "compact" && "px-4 pt-4 pb-1")}>
-        <CardTitle className="text-sm font-medium text-muted-foreground">{label}</CardTitle>
-        {action ? <div data-slot="statistic-card-action">{action}</div> : null}
-      </CardHeader>
-      <CardContent className={cn(density === "compact" && "px-4 pb-4")}>
-        <Statistic
-          label={<span className="sr-only">{label}</span>}
-          value={value}
-          prefix={prefix}
-          suffix={suffix}
-          description={description}
-          trend={trend}
-          change={change}
-          loading={loading}
-        />
-      </CardContent>
-    </Card>
-  )
-}
-
-export type StatisticGridProps = React.ComponentProps<"div"> & {
-  columns?: 1 | 2 | 3 | 4
-  gap?: "sm" | "default" | "lg"
-}
-
-function StatisticGrid({ columns = 4, gap = "default", className, ...props }: StatisticGridProps) {
-  return (
-    <div
-      data-slot="statistic-grid"
-      className={cn(
-        "grid",
-        gap === "sm" && "gap-3",
-        gap === "default" && "gap-4",
-        gap === "lg" && "gap-6",
-        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 { Statistic, StatisticCard, StatisticGrid }

package/packages/cli/vendor/src/components/filters/filter-bar.tsx

@@ -1,163 +0,0 @@
-"use client"
-
-import * as React from "react"
-import { SlidersHorizontalIcon, XIcon } from "lucide-react"
-
-import { Badge } from "@/components/ui/badge"
-import { Button } from "@/components/ui/button"
-import { cn, stopInteractivePropagation } from "@/lib/utils"
-
-export type FilterBarChip = {
-  key: string
-  label: React.ReactNode
-  value?: React.ReactNode
-  tone?: "default" | "success" | "warning" | "danger" | "info" | "muted"
-  disabled?: boolean
-  hidden?: boolean
-}
-
-export type FilterBarProps = React.ComponentProps<"div"> & {
-  search?: React.ReactNode
-  filters?: React.ReactNode
-  actions?: React.ReactNode
-  chips?: FilterBarChip[]
-  activeCount?: number
-  activeLabel?: (count: number) => React.ReactNode
-  resetLabel?: React.ReactNode
-  clearChipLabel?: React.ReactNode
-  onReset?: () => void
-  onRemoveChip?: (key: string) => void
-  collapsible?: boolean
-  defaultExpanded?: boolean
-  emptyChips?: React.ReactNode
-  chipLimit?: number
-  chipOverflowLabel?: (hiddenCount: number) => React.ReactNode
-}
-
-const chipVariant: Record<NonNullable<FilterBarChip["tone"]>, React.ComponentProps<typeof Badge>["variant"]> = {
-  default: "secondary",
-  success: "secondary",
-  warning: "outline",
-  danger: "destructive",
-  info: "outline",
-  muted: "outline",
-}
-
-function FilterBar({
-  className,
-  search,
-  filters,
-  actions,
-  chips,
-  activeCount,
-  activeLabel = (count) => `${count} active`,
-  resetLabel = "Reset",
-  clearChipLabel,
-  onReset,
-  onRemoveChip,
-  collapsible = false,
-  defaultExpanded = false,
-  emptyChips,
-  chipLimit,
-  chipOverflowLabel = (hiddenCount) => `+${hiddenCount} more`,
-  children,
-  ...props
-}: FilterBarProps) {
-  const [expanded, setExpanded] = React.useState(defaultExpanded)
-  const visibleChips = chips?.filter((chip) => !chip.hidden) ?? []
-  const renderedChips = chipLimit && chipLimit > 0 ? visibleChips.slice(0, chipLimit) : visibleChips
-  const hiddenChipCount = Math.max(visibleChips.length - renderedChips.length, 0)
-  const resolvedActiveCount = activeCount ?? visibleChips.length
-  const hasFilters = Boolean(filters || children)
-  const hasChips = Boolean(chips)
-  const shouldShowFilters = !collapsible || expanded
-  const shouldShowChipRow = visibleChips.length > 0 || (hasChips && emptyChips)
-
-  return (
-    <div
-      data-slot="filter-bar"
-      className={cn("flex flex-col gap-3 rounded-lg border bg-card p-3", className)}
-      {...props}
-    >
-      <div className="flex flex-col gap-2 lg:flex-row lg:items-center lg:justify-between">
-        <div className="flex min-w-0 flex-1 flex-col gap-2 sm:flex-row sm:items-center">
-          {search && <div className="min-w-0 flex-1">{search}</div>}
-
-          {collapsible && hasFilters && (
-            <Button
-              type="button"
-              variant={expanded ? "secondary" : "outline"}
-              size="sm"
-              onClick={() => setExpanded((value) => !value)}
-            >
-              <SlidersHorizontalIcon data-icon="inline-start" />
-              Filters
-              {resolvedActiveCount > 0 && (
-                <span className="ml-1 rounded-full bg-background px-1.5 text-xs">
-                  {resolvedActiveCount}
-                </span>
-              )}
-            </Button>
-          )}
-        </div>
-
-        <div className="flex shrink-0 flex-wrap items-center gap-2">
-          {resolvedActiveCount > 0 && (
-            <span className="text-sm text-muted-foreground">{activeLabel(resolvedActiveCount)}</span>
-          )}
-          {resolvedActiveCount > 0 && onReset && (
-            <Button type="button" variant="ghost" size="sm" onClick={onReset}>
-              <XIcon data-icon="inline-start" />
-              {resetLabel}
-            </Button>
-          )}
-          {actions}
-        </div>
-      </div>
-
-      {hasFilters && shouldShowFilters && (
-        <div className="flex flex-col gap-2 sm:flex-row sm:flex-wrap sm:items-center">
-          {filters}
-          {children}
-        </div>
-      )}
-
-      {shouldShowChipRow && (
-        <div data-slot="filter-bar-chips" className="flex flex-wrap items-center gap-2">
-          {visibleChips.length > 0 ? (
-            <>
-              {renderedChips.map((chip) => (
-              <Badge key={chip.key} variant={chipVariant[chip.tone ?? "default"]} className={cn("gap-1.5", chip.disabled && "opacity-60")}>
-                <span>{chip.label}</span>
-                {chip.value !== undefined && <span className="text-muted-foreground">{chip.value}</span>}
-                {onRemoveChip && !chip.disabled && (
-                  <button
-                    type="button"
-                    aria-label={typeof clearChipLabel === "string" ? clearChipLabel : "Remove filter"}
-                    className="rounded-full p-0.5 hover:bg-muted"
-                    onClick={(event) => {
-                      stopInteractivePropagation(event)
-                      onRemoveChip(chip.key)
-                    }}
-                    onMouseDown={stopInteractivePropagation}
-                    onDoubleClick={stopInteractivePropagation}
-                  >
-                    <XIcon className="size-3" />
-                  </button>
-                )}
-              </Badge>
-              ))}
-              {hiddenChipCount > 0 ? (
-                <Badge variant="outline">{chipOverflowLabel(hiddenChipCount)}</Badge>
-              ) : null}
-            </>
-          ) : (
-            <span className="text-sm text-muted-foreground">{emptyChips}</span>
-          )}
-        </div>
-      )}
-    </div>
-  )
-}
-
-export { FilterBar }