@blinkdotnew/ui 0.1.0 → 0.1.1

package/dist/index.mjs

@@ -70,16 +70,16 @@ function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
 var buttonVariants = cva(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-[var(--radius)] text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))] focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium font-sans transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
   {
     variants: {
       variant: {
-        default: "bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))] hover:bg-[hsl(var(--primary)/0.9)]",
-        secondary: "bg-[hsl(var(--secondary))] text-[hsl(var(--secondary-foreground))] hover:bg-[hsl(var(--secondary)/0.8)]",
-        outline: "border border-[hsl(var(--border))] bg-transparent hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]",
-        ghost: "hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]",
-        destructive: "bg-[hsl(var(--destructive))] text-[hsl(var(--destructive-foreground))] hover:bg-[hsl(var(--destructive)/0.9)]",
-        link: "text-[hsl(var(--primary))] underline-offset-4 hover:underline"
+        default: "bg-primary text-primary-foreground hover:bg-primary/90",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+        outline: "border border-border bg-transparent hover:bg-accent hover:text-accent-foreground",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+        link: "text-primary underline-offset-4 hover:underline"
       },
       size: {
         sm: "h-8 px-3 text-xs",
@@ -104,9 +104,9 @@ var Input = React14.forwardRef(
     {
       type,
       className: cn(
-        "flex h-9 w-full rounded-[var(--radius)] border border-[hsl(var(--input))] bg-transparent px-3 py-1 text-sm shadow-sm transition-colors",
-        "placeholder:text-[hsl(var(--muted-foreground))]",
-        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))]",
+        "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm font-sans shadow-sm transition-colors",
+        "placeholder:text-muted-foreground",
+        "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
         "disabled:cursor-not-allowed disabled:opacity-50",
         "file:border-0 file:bg-transparent file:text-sm file:font-medium",
         className
@@ -122,7 +122,7 @@ var Textarea = React14.forwardRef(
     "textarea",
     {
       className: cn(
-        "flex min-h-[80px] w-full rounded-[var(--radius)] border border-[hsl(var(--input))] bg-transparent px-3 py-2 text-sm shadow-sm",
+        "flex min-h-[80px] w-full rounded-md border border-[hsl(var(--input))] bg-transparent px-3 py-2 text-sm shadow-sm",
         "placeholder:text-[hsl(var(--muted-foreground))]",
         "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))]",
         "disabled:cursor-not-allowed disabled:opacity-50",
@@ -143,7 +143,7 @@ var SelectTrigger = React14.forwardRef(({ className, children, ...props }, ref)
   {
     ref,
     className: cn(
-      "flex h-9 w-full items-center justify-between rounded-[var(--radius)] border border-[hsl(var(--input))] bg-transparent px-3 py-2 text-sm shadow-sm",
+      "flex h-9 w-full items-center justify-between rounded-md border border-[hsl(var(--input))] bg-transparent px-3 py-2 text-sm shadow-sm",
       "placeholder:text-[hsl(var(--muted-foreground))]",
       "focus:outline-none focus:ring-2 focus:ring-[hsl(var(--ring))]",
       "disabled:cursor-not-allowed disabled:opacity-50",
@@ -183,7 +183,7 @@ var SelectContent = React14.forwardRef(({ className, children, position = "poppe
   {
     ref,
     className: cn(
-      "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--popover))] text-[hsl(var(--popover-foreground))] shadow-md",
+      "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--popover))] text-[hsl(var(--popover-foreground))] shadow-md",
       "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
       "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
       position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1",
@@ -339,7 +339,7 @@ var DialogContent = React14.forwardRef(({ className, children, ...props }, ref)
       ref,
       className: cn(
         "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4",
-        "bg-[hsl(var(--background))] p-6 shadow-lg duration-200 rounded-[var(--radius)]",
+        "bg-[hsl(var(--background))] p-6 shadow-lg duration-200 rounded-md",
         "border border-[hsl(var(--border))]",
         "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95 data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%]",
         "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%]",
@@ -438,7 +438,7 @@ var PopoverContent = React14.forwardRef(({ className, align = "center", sideOffs
     align,
     sideOffset,
     className: cn(
-      "z-50 w-72 rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--popover))] p-4 text-[hsl(var(--popover-foreground))] shadow-md outline-none",
+      "z-50 w-72 rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--popover))] p-4 text-[hsl(var(--popover-foreground))] shadow-md outline-none",
       "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
       "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
       "data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2",
@@ -457,7 +457,7 @@ var TooltipContent = React14.forwardRef(({ className, sideOffset = 4, ...props }
     ref,
     sideOffset,
     className: cn(
-      "z-50 overflow-hidden rounded-[var(--radius)] bg-[hsl(var(--primary))] px-3 py-1.5 text-xs text-[hsl(var(--primary-foreground))] shadow-md",
+      "z-50 overflow-hidden rounded-md bg-[hsl(var(--primary))] px-3 py-1.5 text-xs text-[hsl(var(--primary-foreground))] shadow-md",
       "animate-in fade-in-0 zoom-in-95",
       "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
       "data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2",
@@ -474,7 +474,7 @@ var DropdownMenuPortal = DropdownMenuPrimitive.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive.Sub;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
 var contentStyle = cn(
-  "z-50 min-w-[8rem] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--popover))] p-1 text-[hsl(var(--popover-foreground))] shadow-md",
+  "z-50 min-w-[8rem] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--popover))] p-1 text-[hsl(var(--popover-foreground))] shadow-md",
   "data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=open]:zoom-in-95",
   "data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95"
 );
@@ -516,7 +516,7 @@ var ContextMenuGroup = ContextMenuPrimitive.Group;
 var ContextMenuPortal = ContextMenuPrimitive.Portal;
 var ContextMenuSub = ContextMenuPrimitive.Sub;
 var ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
-var contentStyle2 = "z-50 min-w-[8rem] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--popover))] p-1 text-[hsl(var(--popover-foreground))] shadow-md animate-in fade-in-80";
+var contentStyle2 = "z-50 min-w-[8rem] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--popover))] p-1 text-[hsl(var(--popover-foreground))] shadow-md animate-in fade-in-80";
 var itemStyle2 = "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-[hsl(var(--accent))] focus:text-[hsl(var(--accent-foreground))] data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
 var ContextMenuContent = React14.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(ContextMenuPrimitive.Content, { ref, className: cn(contentStyle2, className), ...props }) }));
 ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
@@ -549,7 +549,7 @@ var Card = React14.forwardRef(
     "div",
     {
       ref,
-      className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] text-[hsl(var(--card-foreground))] shadow-sm", className),
+      className: cn("rounded-lg border border-border bg-card text-card-foreground shadow-card", className),
       ...props
     }
   )
@@ -564,7 +564,7 @@ var CardTitle = React14.forwardRef(
 );
 CardTitle.displayName = "CardTitle";
 var CardDescription = React14.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("text-sm text-[hsl(var(--muted-foreground))]", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("text-sm text-muted-foreground", className), ...props })
 );
 CardDescription.displayName = "CardDescription";
 var CardContent = React14.forwardRef(
@@ -631,7 +631,7 @@ function Skeleton({ className, ...props }) {
   return /* @__PURE__ */ jsx(
     "div",
     {
-      className: cn("animate-pulse rounded-[var(--radius)] bg-[hsl(var(--muted))]", className),
+      className: cn("animate-pulse rounded-md bg-[hsl(var(--muted))]", className),
       ...props
     }
   );
@@ -1116,7 +1116,7 @@ var SearchInput = React14.forwardRef(
           value,
           onChange: handleChange,
           className: cn(
-            "flex h-9 w-full rounded-[var(--radius)] border border-[hsl(var(--input))] bg-transparent pl-8 pr-8 text-sm shadow-sm transition-colors",
+            "flex h-9 w-full rounded-md border border-[hsl(var(--input))] bg-transparent pl-8 pr-8 text-sm shadow-sm transition-colors",
             "placeholder:text-[hsl(var(--muted-foreground))]",
             "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[hsl(var(--ring))]",
             "disabled:cursor-not-allowed disabled:opacity-50",
@@ -1178,7 +1178,7 @@ function FileUpload({ accept, multiple, maxSize, onFiles, className, disabled })
       onDragLeave: () => setDragging(false),
       onDrop: handleDrop,
       className: cn(
-        "flex flex-col items-center justify-center gap-2 rounded-[var(--radius)] border-2 border-dashed border-[hsl(var(--border))] p-8 text-center transition-colors cursor-pointer",
+        "flex flex-col items-center justify-center gap-2 rounded-md border-2 border-dashed border-[hsl(var(--border))] p-8 text-center transition-colors cursor-pointer",
         dragging && "border-[hsl(var(--primary))] bg-[hsl(var(--accent))]",
         disabled && "cursor-not-allowed opacity-50",
         className
@@ -1211,7 +1211,7 @@ function FileUpload({ accept, multiple, maxSize, onFiles, className, disabled })
 function FileUploadPreview({ files, onRemove, className }) {
   if (!files.length)
     return null;
-  return /* @__PURE__ */ jsx("ul", { className: cn("flex flex-col gap-1", className), children: files.map((file, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-center justify-between rounded-[var(--radius)] border border-[hsl(var(--border))] px-3 py-2 text-sm", children: [
+  return /* @__PURE__ */ jsx("ul", { className: cn("flex flex-col gap-1", className), children: files.map((file, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-center justify-between rounded-md border border-[hsl(var(--border))] px-3 py-2 text-sm", children: [
     /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-[hsl(var(--foreground))]", children: file.name }),
     /* @__PURE__ */ jsxs("div", { className: "ml-2 flex shrink-0 items-center gap-2", children: [
       /* @__PURE__ */ jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: formatBytes(file.size) }),
@@ -1257,7 +1257,7 @@ function CalendarGrid({ year, month, selected, onSelect }) {
           type: "button",
           onClick: () => onSelect(date),
           className: cn(
-            "flex h-8 w-8 items-center justify-center rounded-[var(--radius)] text-sm transition-colors",
+            "flex h-8 w-8 items-center justify-center rounded-md text-sm transition-colors",
             isSelected && "bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))]",
             !isSelected && isToday && "border border-[hsl(var(--primary))] text-[hsl(var(--primary))]",
             !isSelected && !isToday && "hover:bg-[hsl(var(--accent))]"
@@ -1459,7 +1459,7 @@ function ObjectField({
   className
 }) {
   const [open, setOpen] = useState(defaultOpen);
-  return /* @__PURE__ */ jsxs("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] overflow-hidden", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("rounded-md border border-[hsl(var(--border))] overflow-hidden", className), children: [
     /* @__PURE__ */ jsxs(
       "div",
       {
@@ -1628,7 +1628,7 @@ function DataTable({ columns, data, pageSize = 10, searchable, searchColumn, loa
     return /* @__PURE__ */ jsx("div", { className: "space-y-2", children: Array.from({ length: 5 }).map((_, i) => /* @__PURE__ */ jsx(Skeleton, { className: "h-10 w-full" }, i)) });
   return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
     searchable && /* @__PURE__ */ jsx(DataTableToolbar, { table, searchColumn }),
-    /* @__PURE__ */ jsx("div", { className: "rounded-[var(--radius)] border border-[hsl(var(--border))] overflow-hidden", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-sm", children: [
+    /* @__PURE__ */ jsx("div", { className: "rounded-md border border-[hsl(var(--border))] overflow-hidden", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-sm", children: [
       /* @__PURE__ */ jsx("thead", { className: "bg-[hsl(var(--muted)/0.4)]", children: table.getHeaderGroups().map((hg) => /* @__PURE__ */ jsx("tr", { children: hg.headers.map((h) => /* @__PURE__ */ jsx("th", { className: "px-4 py-3 text-left font-medium text-[hsl(var(--muted-foreground))]", children: h.isPlaceholder ? null : flexRender(h.column.columnDef.header, h.getContext()) }, h.id)) }, hg.id)) }),
       /* @__PURE__ */ jsxs("tbody", { children: [
         table.getRowModel().rows.map((row, i) => /* @__PURE__ */ jsx("tr", { className: cn("border-t border-[hsl(var(--border))] hover:bg-[hsl(var(--muted)/0.3)] transition-colors", i % 2 === 0 ? "" : "bg-[hsl(var(--muted)/0.1)]"), children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx("td", { className: "px-4 py-3", children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id)) }, row.id)),
@@ -1706,7 +1706,7 @@ function DataGrid({ columns, data: initialData, onDataChange, editable, classNam
     state: { rowSelection },
     enableColumnResizing: true
   });
-  return /* @__PURE__ */ jsx("div", { className: cn("overflow-auto rounded-[var(--radius)] border border-[hsl(var(--border))]", className), children: /* @__PURE__ */ jsxs("table", { className: "w-full text-sm", style: { width: table.getCenterTotalSize() }, children: [
+  return /* @__PURE__ */ jsx("div", { className: cn("overflow-auto rounded-md border border-[hsl(var(--border))]", className), children: /* @__PURE__ */ jsxs("table", { className: "w-full text-sm", style: { width: table.getCenterTotalSize() }, children: [
     /* @__PURE__ */ jsx("thead", { className: "bg-[hsl(var(--muted)/0.4)]", children: table.getHeaderGroups().map((hg) => /* @__PURE__ */ jsx("tr", { children: hg.headers.map((h) => /* @__PURE__ */ jsxs("th", { style: { width: h.getSize() }, className: "relative px-3 py-2 text-left font-medium text-[hsl(var(--muted-foreground))] border-r border-[hsl(var(--border))] last:border-r-0", children: [
       h.isPlaceholder ? null : flexRender(h.column.columnDef.header, h.getContext()),
       h.column.getCanResize() && /* @__PURE__ */ jsx("div", { onMouseDown: h.getResizeHandler(), className: "absolute right-0 top-0 h-full w-1 cursor-col-resize hover:bg-[hsl(var(--primary)/0.4)]" })
@@ -1837,7 +1837,7 @@ function IconBadge({ icon, color = "default", size = "md", className }) {
 function StructuredListSection({ title, children, className }) {
   return /* @__PURE__ */ jsxs("div", { className: cn("", className), children: [
     title && /* @__PURE__ */ jsx("p", { className: "px-4 pb-1 pt-4 text-xs font-semibold uppercase tracking-wider text-[hsl(var(--muted-foreground))]", children: title }),
-    /* @__PURE__ */ jsx("div", { className: "rounded-[var(--radius)] border border-[hsl(var(--border))] overflow-hidden divide-y divide-[hsl(var(--border))]", children })
+    /* @__PURE__ */ jsx("div", { className: "rounded-md border border-[hsl(var(--border))] overflow-hidden divide-y divide-[hsl(var(--border))]", children })
   ] });
 }
 function StructuredListItem({ left, title, description, right, onClick, className }) {
@@ -1867,7 +1867,7 @@ function CommandItem({ icon, label, description, shortcut, active, onClick, clas
     {
       onClick,
       className: cn(
-        "flex items-center gap-3 rounded-[var(--radius)] px-3 py-2 cursor-pointer transition-colors",
+        "flex items-center gap-3 rounded-md px-3 py-2 cursor-pointer transition-colors",
         active ? "bg-[hsl(var(--accent))] text-[hsl(var(--accent-foreground))]" : "hover:bg-[hsl(var(--accent)/0.6)]",
         className
       ),
@@ -2072,7 +2072,7 @@ function LoadingOverlay({ loading, text, fullPage, children, className }) {
   }
   return /* @__PURE__ */ jsxs("div", { className: cn("relative", className), children: [
     children,
-    loading && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-10 flex items-center justify-center rounded-[var(--radius)] bg-[hsl(var(--background)/0.8)] backdrop-blur-[2px]", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2", children: [
+    loading && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-10 flex items-center justify-center rounded-md bg-[hsl(var(--background)/0.8)] backdrop-blur-[2px]", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-2", children: [
       /* @__PURE__ */ jsx(Loader2, { className: "h-6 w-6 animate-spin text-[hsl(var(--primary))]" }),
       text && /* @__PURE__ */ jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: text })
     ] }) })
@@ -2221,7 +2221,7 @@ function ToggleButton({ pressed, onClick, disabled, children, className }) {
       disabled,
       onClick,
       className: cn(
-        "inline-flex items-center justify-center gap-1.5 rounded-[var(--radius)] px-3 py-1.5 text-sm font-medium transition-colors border",
+        "inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 text-sm font-medium transition-colors border",
         "disabled:pointer-events-none disabled:opacity-50",
         pressed ? "bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))] border-[hsl(var(--primary))]" : "bg-transparent text-[hsl(var(--foreground))] border-[hsl(var(--border))] hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--accent-foreground))]",
         className
@@ -2241,7 +2241,7 @@ function ToggleButtonGroup(props) {
       props.onChange(val);
     }
   };
-  return /* @__PURE__ */ jsx("div", { className: cn("inline-flex items-center gap-1 rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--muted)/0.4)] p-0.5", className), children: React14.Children.map(children, (child) => {
+  return /* @__PURE__ */ jsx("div", { className: cn("inline-flex items-center gap-1 rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--muted)/0.4)] p-0.5", className), children: React14.Children.map(children, (child) => {
     if (!React14.isValidElement(child))
       return child;
     const tb = child;
@@ -2280,7 +2280,7 @@ function CommandBarItem({ icon, label, shortcut, onSelect, active, className })
     {
       onClick: onSelect,
       className: cn(
-        "flex w-full items-center gap-2.5 rounded-[var(--radius)] px-3 py-2 text-sm transition-colors",
+        "flex w-full items-center gap-2.5 rounded-md px-3 py-2 text-sm transition-colors",
         active ? "bg-[hsl(var(--accent))] text-[hsl(var(--accent-foreground))]" : "hover:bg-[hsl(var(--accent)/0.6)]",
         className
       ),
@@ -2347,7 +2347,7 @@ function KanbanCard({ card, isDragging }) {
       style,
       ...attributes,
       ...listeners,
-      className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-3 cursor-grab active:cursor-grabbing select-none", isDragging && "shadow-lg opacity-80"),
+      className: cn("rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-3 cursor-grab active:cursor-grabbing select-none", isDragging && "shadow-lg opacity-80"),
       children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-2", children: [
           /* @__PURE__ */ jsx("p", { className: "text-sm font-medium text-[hsl(var(--foreground))] leading-tight", children: card.title }),
@@ -2359,7 +2359,7 @@ function KanbanCard({ card, isDragging }) {
   );
 }
 function KanbanColumn({ column, isOver }) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex w-64 shrink-0 flex-col gap-2 rounded-[var(--radius)] bg-[hsl(var(--muted)/0.4)] p-3 transition-colors", isOver && "bg-[hsl(var(--muted)/0.7)]"), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex w-64 shrink-0 flex-col gap-2 rounded-md bg-[hsl(var(--muted)/0.4)] p-3 transition-colors", isOver && "bg-[hsl(var(--muted)/0.7)]"), children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
       /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-[hsl(var(--foreground))]", children: column.title }),
       /* @__PURE__ */ jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))] bg-[hsl(var(--muted))] rounded-full px-2 py-0.5", children: column.cards.length })
@@ -2430,7 +2430,7 @@ function AreaChart({
 }) {
   const keys = Array.isArray(dataKey) ? dataKey : [dataKey];
   const curve = curved ? "monotone" : "linear";
-  return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxs(AreaChart$1, { data, margin: { top: 4, right: 4, left: -20, bottom: 0 }, children: [
+  return /* @__PURE__ */ jsx("div", { className: cn("w-full overflow-hidden", className), style: { minWidth: 0 }, children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxs(AreaChart$1, { data, margin: { top: 4, right: 4, left: -20, bottom: 0 }, children: [
     showGrid && /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3", stroke: "hsl(var(--border))" }),
     /* @__PURE__ */ jsx(XAxis, { dataKey: xAxisKey, tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
     /* @__PURE__ */ jsx(YAxis, { tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
@@ -2482,7 +2482,7 @@ function BarChart({
 }) {
   const keys = Array.isArray(dataKey) ? dataKey : [dataKey];
   const isVertical = layout === "vertical";
-  return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxs(BarChart$1, { data, layout, margin: { top: 4, right: 4, left: -20, bottom: 0 }, children: [
+  return /* @__PURE__ */ jsx("div", { className: cn("w-full overflow-hidden", className), style: { minWidth: 0 }, children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxs(BarChart$1, { data, layout, margin: { top: 4, right: 4, left: -20, bottom: 0 }, children: [
     showGrid && /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3", stroke: "hsl(var(--border))" }),
     isVertical ? /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(XAxis, { type: "number", tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
@@ -2539,7 +2539,7 @@ function LineChart({
   const keys = Array.isArray(dataKey) ? dataKey : [dataKey];
   const curve = curved ? "monotone" : "linear";
   const dash = dotted ? "4 4" : void 0;
-  return /* @__PURE__ */ jsx("div", { className: cn("w-full", className), children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxs(LineChart$1, { data, margin: { top: 4, right: 4, left: -20, bottom: 0 }, children: [
+  return /* @__PURE__ */ jsx("div", { className: cn("w-full overflow-hidden", className), style: { minWidth: 0 }, children: /* @__PURE__ */ jsx(ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxs(LineChart$1, { data, margin: { top: 4, right: 4, left: -20, bottom: 0 }, children: [
     showGrid && /* @__PURE__ */ jsx(CartesianGrid, { strokeDasharray: "3 3", stroke: "hsl(var(--border))" }),
     /* @__PURE__ */ jsx(XAxis, { dataKey: xAxisKey, tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
     /* @__PURE__ */ jsx(YAxis, { tick: { fontSize: 12, fill: "hsl(var(--muted-foreground))" }, axisLine: false, tickLine: false }),
@@ -2695,8 +2695,8 @@ function TourStep({ step, title, description, placement = "bottom", children })
         style: { boxShadow: "0 0 0 9999px rgba(0,0,0,0.5)" }
       }
     ),
-    /* @__PURE__ */ jsx("span", { className: cn("relative", active && "z-50 ring-2 ring-[hsl(var(--primary))] ring-offset-2 rounded-[var(--radius)]"), children }),
-    active && /* @__PURE__ */ jsxs("div", { className: cn("absolute z-50 w-64 rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4 shadow-lg", placementClasses[placement]), children: [
+    /* @__PURE__ */ jsx("span", { className: cn("relative", active && "z-50 ring-2 ring-[hsl(var(--primary))] ring-offset-2 rounded-md"), children }),
+    active && /* @__PURE__ */ jsxs("div", { className: cn("absolute z-50 w-64 rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4 shadow-lg", placementClasses[placement]), children: [
       /* @__PURE__ */ jsx("p", { className: "font-semibold text-sm mb-1", children: title }),
       /* @__PURE__ */ jsx("p", { className: "text-xs text-[hsl(var(--muted-foreground))] mb-3", children: description }),
       /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
@@ -2734,7 +2734,7 @@ function SidebarLayoutMinimal({
   children,
   className
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
     /* @__PURE__ */ jsxs("aside", { className: "flex w-60 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
       /* @__PURE__ */ jsx("div", { className: "flex h-14 items-center px-4 font-semibold text-sm", children: brandName }),
       /* @__PURE__ */ jsx(Separator4, {}),
@@ -2783,7 +2783,7 @@ function SidebarLayoutGroups({
   children,
   className
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
     /* @__PURE__ */ jsxs("aside", { className: "flex w-60 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
       /* @__PURE__ */ jsx("div", { className: "flex h-14 items-center px-4 font-semibold text-sm", children: brandName }),
       /* @__PURE__ */ jsx(Separator4, {}),
@@ -2823,9 +2823,9 @@ function SidebarLayoutUser({
   children,
   className
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
     /* @__PURE__ */ jsxs("aside", { className: "flex w-60 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
-      /* @__PURE__ */ jsx("div", { className: "p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 rounded-[var(--radius)] bg-[hsl(var(--accent))] p-3", children: [
+      /* @__PURE__ */ jsx("div", { className: "p-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 rounded-md bg-[hsl(var(--accent))] p-3", children: [
         /* @__PURE__ */ jsx(Avatar, { className: "h-9 w-9", children: /* @__PURE__ */ jsx(AvatarFallback, { className: "text-xs", children: userName.slice(0, 2).toUpperCase() }) }),
         /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
           /* @__PURE__ */ jsx("p", { className: "truncate text-sm font-semibold", children: userName }),
@@ -2868,7 +2868,7 @@ function SidebarLayoutSearch({
 }) {
   const [query, setQuery] = useState("");
   const filtered = ALL_ITEMS.filter((i) => i.label.toLowerCase().includes(query.toLowerCase()));
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
     /* @__PURE__ */ jsxs("aside", { className: "flex w-60 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
       /* @__PURE__ */ jsx("div", { className: "flex h-14 items-center px-4 font-semibold text-sm", children: brandName }),
       /* @__PURE__ */ jsx(Separator4, {}),
@@ -2916,7 +2916,7 @@ function NavItem5({ icon: Icon2, label, active }) {
   ] });
 }
 function SidebarLayoutDashboard({ className }) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
     /* @__PURE__ */ jsxs("aside", { className: "flex w-56 flex-col border-r border-[hsl(var(--border))] bg-[hsl(var(--card))]", children: [
       /* @__PURE__ */ jsx("div", { className: "flex h-12 items-center px-4 font-semibold text-sm", children: "Acme Inc" }),
       /* @__PURE__ */ jsx(Separator4, {}),
@@ -2944,7 +2944,7 @@ function SidebarLayoutDashboard({ className }) {
             k.change
           ] })
         ] }) }, k.label)) }),
-        /* @__PURE__ */ jsx("div", { className: "rounded-[var(--radius)] border border-[hsl(var(--border))]", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-xs", children: [
+        /* @__PURE__ */ jsx("div", { className: "rounded-md border border-[hsl(var(--border))]", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-xs", children: [
           /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsx("tr", { className: "border-b border-[hsl(var(--border))]", children: ["Project", "Status", "Team", "Progress"].map((h) => /* @__PURE__ */ jsx("th", { className: "px-3 py-2 text-left font-medium text-[hsl(var(--muted-foreground))]", children: h }, h)) }) }),
           /* @__PURE__ */ jsx("tbody", { children: TABLE_ROWS.map((r) => /* @__PURE__ */ jsxs("tr", { className: "border-b border-[hsl(var(--border))] last:border-0", children: [
             /* @__PURE__ */ jsx("td", { className: "px-3 py-2 font-medium", children: r.name }),
@@ -2966,7 +2966,7 @@ function StackedLayoutTabs({
 }) {
   const [activeTab, setActiveTab] = useState(0);
   const [activeNav, setActiveNav] = useState(0);
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] flex-col overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] flex-col overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
     /* @__PURE__ */ jsxs("nav", { className: "flex h-14 items-center gap-6 border-b border-[hsl(var(--border))] bg-[hsl(var(--card))] px-4", children: [
       /* @__PURE__ */ jsx("span", { className: "font-semibold text-sm shrink-0", children: brandName }),
       /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center gap-1", children: NAV_LINKS.map((link, i) => /* @__PURE__ */ jsx(
@@ -3014,7 +3014,7 @@ function StackedLayoutBranded({
   children,
   className
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] flex-col overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[600px] flex-col overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--background))]", className), children: [
     /* @__PURE__ */ jsxs("nav", { className: "flex h-14 items-center gap-6 bg-[hsl(var(--primary))] px-6", children: [
       /* @__PURE__ */ jsx("span", { className: "font-bold text-sm text-[hsl(var(--primary-foreground))] shrink-0", children: brandName }),
       /* @__PURE__ */ jsx("div", { className: "flex flex-1 items-center gap-1", children: NAV_LINKS2.map((link) => /* @__PURE__ */ jsx("button", { className: "px-3 py-1.5 text-sm text-[hsl(var(--primary-foreground)/0.8)] hover:text-[hsl(var(--primary-foreground))] transition-colors rounded-md hover:bg-white/10", children: link }, link)) }),
@@ -3059,7 +3059,7 @@ function NotificationSettings({ className }) {
   const [states, setStates] = useState(
     Object.fromEntries(NOTIFICATIONS.map((n) => [n.id, n.default]))
   );
-  return /* @__PURE__ */ jsxs("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-6", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-6", className), children: [
     /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
       /* @__PURE__ */ jsx("h2", { className: "text-base font-semibold", children: "Email Notifications" }),
       /* @__PURE__ */ jsx("p", { className: "text-sm text-[hsl(var(--muted-foreground))] mt-0.5", children: "Choose what you want to be notified about." })
@@ -3090,7 +3090,7 @@ function WorkspaceMembers({ className }) {
   const filtered = members.filter(
     (m) => m.name.toLowerCase().includes(query.toLowerCase()) || m.email.toLowerCase().includes(query.toLowerCase())
   );
-  return /* @__PURE__ */ jsxs("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))]", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--card))]", className), children: [
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-4 border-b border-[hsl(var(--border))]", children: [
       /* @__PURE__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("h2", { className: "text-sm font-semibold", children: "Members" }),
@@ -3123,8 +3123,8 @@ function IntegrationCard({
   className
 }) {
   const [isConnected, setIsConnected] = useState(connected);
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-4 rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4", className), children: [
-    /* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-[var(--radius)] bg-[hsl(var(--muted))] text-[hsl(var(--muted-foreground))]", children: icon ?? /* @__PURE__ */ jsx("span", { className: "text-base font-bold", children: name[0] }) }),
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex items-center gap-4 rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4", className), children: [
+    /* @__PURE__ */ jsx("div", { className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-md bg-[hsl(var(--muted))] text-[hsl(var(--muted-foreground))]", children: icon ?? /* @__PURE__ */ jsx("span", { className: "text-base font-bold", children: name[0] }) }),
     /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
         /* @__PURE__ */ jsx("p", { className: "text-sm font-semibold", children: name }),
@@ -3177,7 +3177,7 @@ function FeedbackModal({ onSubmit, className }) {
       {
         onClick: () => setReaction(r),
         className: cn(
-          "flex h-10 w-10 items-center justify-center rounded-[var(--radius)] border text-xl transition-colors",
+          "flex h-10 w-10 items-center justify-center rounded-md border text-xl transition-colors",
           reaction === r ? "border-[hsl(var(--primary))] bg-[hsl(var(--primary)/0.1)]" : "border-[hsl(var(--border))] hover:bg-[hsl(var(--accent))]"
         ),
         children: r
@@ -3238,7 +3238,7 @@ function InviteModal({ className }) {
     ] }),
     pending.length > 0 && /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
       /* @__PURE__ */ jsx("p", { className: "text-xs font-medium text-[hsl(var(--muted-foreground))]", children: "Pending invites" }),
-      /* @__PURE__ */ jsx("div", { className: "divide-y divide-[hsl(var(--border))] rounded-[var(--radius)] border border-[hsl(var(--border))]", children: pending.map((p, i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-3 py-2", children: [
+      /* @__PURE__ */ jsx("div", { className: "divide-y divide-[hsl(var(--border))] rounded-md border border-[hsl(var(--border))]", children: pending.map((p, i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 px-3 py-2", children: [
         /* @__PURE__ */ jsx(Avatar, { className: "h-6 w-6", children: /* @__PURE__ */ jsx(AvatarFallback, { className: "text-[10px]", children: p.email[0].toUpperCase() }) }),
         /* @__PURE__ */ jsx("span", { className: "flex-1 text-sm truncate", children: p.email }),
         /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "text-[10px] px-1.5 py-0.5 shrink-0", children: p.role }),
@@ -3292,7 +3292,7 @@ function ManageTagsModal({ className }) {
       ),
       /* @__PURE__ */ jsx(Button, { size: "sm", className: "h-9", onClick: addTag, children: "Add" })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: tags.map((tag) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 rounded-[var(--radius)] border border-[hsl(var(--border))] px-3 py-2", children: [
+    /* @__PURE__ */ jsx("div", { className: "space-y-1.5", children: tags.map((tag) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 rounded-md border border-[hsl(var(--border))] px-3 py-2", children: [
       /* @__PURE__ */ jsx("span", { className: cn("h-3 w-3 rounded-full shrink-0", tag.color) }),
       /* @__PURE__ */ jsx("span", { className: "flex-1 text-sm", children: tag.name }),
       /* @__PURE__ */ jsx("button", { className: "text-[hsl(var(--muted-foreground))] hover:text-[hsl(var(--foreground))] transition-colors", children: /* @__PURE__ */ jsx(Pencil, { className: "h-3.5 w-3.5" }) }),
@@ -3362,7 +3362,7 @@ function UserMenu({
   className
 }) {
   return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
-    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: cn("flex items-center gap-2 rounded-[var(--radius)] px-2 py-1.5 text-sm transition-colors hover:bg-[hsl(var(--accent))] focus:outline-none", className), children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: cn("flex items-center gap-2 rounded-md px-2 py-1.5 text-sm transition-colors hover:bg-[hsl(var(--accent))] focus:outline-none", className), children: [
       /* @__PURE__ */ jsx(Avatar, { className: "h-7 w-7", children: /* @__PURE__ */ jsx(AvatarFallback, { className: "text-xs", children: initials }) }),
       /* @__PURE__ */ jsx("span", { className: "font-medium max-w-[120px] truncate", children: name }),
       /* @__PURE__ */ jsx(ChevronDown, { className: "h-3.5 w-3.5 text-[hsl(var(--muted-foreground))]" })
@@ -3406,7 +3406,7 @@ function OrgMenu({
 }) {
   const current = ORGS.find((o) => o.id === currentOrgId) ?? ORGS[0];
   return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
-    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: cn("flex items-center gap-2 rounded-[var(--radius)] px-2 py-1.5 text-sm transition-colors hover:bg-[hsl(var(--accent))] focus:outline-none", className), children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxs("button", { className: cn("flex items-center gap-2 rounded-md px-2 py-1.5 text-sm transition-colors hover:bg-[hsl(var(--accent))] focus:outline-none", className), children: [
       /* @__PURE__ */ jsx("div", { className: "flex h-6 w-6 items-center justify-center rounded bg-[hsl(var(--primary))] text-[10px] font-bold text-[hsl(var(--primary-foreground))]", children: current.name[0] }),
       /* @__PURE__ */ jsx("span", { className: "font-medium max-w-[120px] truncate", children: current.name }),
       /* @__PURE__ */ jsx(ChevronDown, { className: "h-3.5 w-3.5 text-[hsl(var(--muted-foreground))]" })
@@ -3482,7 +3482,7 @@ function MetricCardWithIcon({ icon, iconColor = "bg-[hsl(var(--primary)/0.1)] te
         props.change ?? "+12.5%"
       ] })
     ] }),
-    /* @__PURE__ */ jsx("div", { className: cn("flex h-10 w-10 items-center justify-center rounded-[var(--radius)]", iconColor), children: icon ?? /* @__PURE__ */ jsx(TrendingUp, { className: "h-5 w-5" }) })
+    /* @__PURE__ */ jsx("div", { className: cn("flex h-10 w-10 items-center justify-center rounded-md", iconColor), children: icon ?? /* @__PURE__ */ jsx(TrendingUp, { className: "h-5 w-5" }) })
   ] }) }) });
 }
 function MetricCardWithButton({ actionLabel = "View details", onAction, ...props }) {
@@ -3513,7 +3513,7 @@ function ChatBubble({ msg }) {
         /* @__PURE__ */ jsx("span", { className: "text-[10px] text-[hsl(var(--muted-foreground))]", children: msg.time })
       ] }),
       /* @__PURE__ */ jsx("div", { className: cn(
-        "rounded-[var(--radius)] px-3 py-2 text-sm",
+        "rounded-md px-3 py-2 text-sm",
         msg.self ? "bg-[hsl(var(--primary))] text-[hsl(var(--primary-foreground))]" : "bg-[hsl(var(--muted))]"
       ), children: msg.text })
     ] })
@@ -3529,7 +3529,7 @@ function ChatDetail({ className }) {
     setMessages((m) => [...m, { id: `${Date.now()}`, author: "You", initials: "JD", text: input.trim(), time: now, self: true }]);
     setInput("");
   };
-  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[480px] flex-col overflow-hidden rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))]", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex h-[480px] flex-col overflow-hidden rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--card))]", className), children: [
     /* @__PURE__ */ jsxs("header", { className: "flex items-center gap-3 border-b border-[hsl(var(--border))] px-4 py-3", children: [
       /* @__PURE__ */ jsx(Avatar, { className: "h-8 w-8", children: /* @__PURE__ */ jsx(AvatarFallback, { className: "text-xs", children: "AC" }) }),
       /* @__PURE__ */ jsxs("div", { children: [
@@ -3611,7 +3611,7 @@ var TYPE_COLOR = {
 function FileCard({ file }) {
   const Icon2 = TYPE_ICON[file.type] ?? File;
   return /* @__PURE__ */ jsx(Card, { className: "cursor-pointer hover:shadow-md transition-shadow", children: /* @__PURE__ */ jsxs(CardContent, { className: "p-4", children: [
-    /* @__PURE__ */ jsx("div", { className: cn("flex h-10 w-10 items-center justify-center rounded-[var(--radius)] bg-[hsl(var(--muted))] mb-3", TYPE_COLOR[file.type]), children: /* @__PURE__ */ jsx(Icon2, { className: "h-5 w-5" }) }),
+    /* @__PURE__ */ jsx("div", { className: cn("flex h-10 w-10 items-center justify-center rounded-md bg-[hsl(var(--muted))] mb-3", TYPE_COLOR[file.type]), children: /* @__PURE__ */ jsx(Icon2, { className: "h-5 w-5" }) }),
     /* @__PURE__ */ jsx("p", { className: "text-sm font-medium truncate", children: file.name }),
     /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mt-1", children: [
       /* @__PURE__ */ jsx("span", { className: "text-xs text-[hsl(var(--muted-foreground))]", children: file.size }),
@@ -3663,7 +3663,7 @@ function FileRow({ file, onDelete }) {
 }
 function FilesList({ className }) {
   const [files, setFiles] = React14.useState(FILES2);
-  return /* @__PURE__ */ jsx("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] overflow-hidden", className), children: /* @__PURE__ */ jsxs("table", { className: "w-full", children: [
+  return /* @__PURE__ */ jsx("div", { className: cn("rounded-md border border-[hsl(var(--border))] overflow-hidden", className), children: /* @__PURE__ */ jsxs("table", { className: "w-full", children: [
     /* @__PURE__ */ jsx("thead", { className: "bg-[hsl(var(--muted)/0.5)]", children: /* @__PURE__ */ jsx("tr", { children: ["Name", "Type", "Size", "Modified", ""].map((h) => /* @__PURE__ */ jsx("th", { className: "px-4 py-2.5 text-left text-xs font-medium text-[hsl(var(--muted-foreground))]", children: h }, h)) }) }),
     /* @__PURE__ */ jsx("tbody", { children: files.map((f) => /* @__PURE__ */ jsx(FileRow, { file: f, onDelete: () => setFiles((fs) => fs.filter((x) => x.id !== f.id)) }, f.id)) })
   ] }) });
@@ -3742,7 +3742,7 @@ function TaskRow({ task, onToggle }) {
 function SortableTaskList({ className }) {
   const [tasks, setTasks] = useState(TASKS);
   const toggle = (id) => setTasks((ts) => ts.map((t) => t.id === id ? { ...t, done: !t.done } : t));
-  return /* @__PURE__ */ jsx("div", { className: cn("rounded-[var(--radius)] border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4 space-y-4", className), children: SECTIONS.map((section) => {
+  return /* @__PURE__ */ jsx("div", { className: cn("rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-4 space-y-4", className), children: SECTIONS.map((section) => {
     const items = tasks.filter((t) => t.status === section);
     return /* @__PURE__ */ jsxs("div", { children: [
       /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 mb-1.5", children: [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@blinkdotnew/ui",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Blink UI SDK — production-quality React component library for SaaS apps",
   "keywords": [
     "blink",

package/src/themes/base.css

@@ -1,4 +1,5 @@
-/* Blink UI — shared base resets (applied by every theme) */
+/* Blink UI — shared base resets applied by every theme */
+
 *,
 *::before,
 *::after {
@@ -9,6 +10,16 @@ body {
   background-color: hsl(var(--background, 0 0% 100%));
   color: hsl(var(--foreground, 0 0% 3.9%));
   font-family: var(--font-sans, system-ui, sans-serif);
+  font-size: var(--font-size-base, 0.9375rem);
+  line-height: var(--line-height-normal, 1.5);
+  letter-spacing: var(--letter-spacing-body, 0em);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
+
+h1, h2, h3, h4, h5, h6 {
+  font-family: var(--font-heading, var(--font-sans));
+  letter-spacing: var(--letter-spacing-heading, -0.02em);
+  line-height: var(--line-height-heading, 1.2);
+  font-weight: var(--font-weight-heading, 600);
+}