@hanzo/ui 5.3.19 → 5.3.22

package/dist/project/kanban.js

@@ -1 +1,597 @@
-'use strict';Object.defineProperty(exports,'__esModule',{value:true});var f=require('react'),core=require('@dnd-kit/core'),sortable=require('@dnd-kit/sortable'),utilities=require('@dnd-kit/utilities'),classVarianceAuthority=require('class-variance-authority'),lucideReact=require('lucide-react'),utils=require('@hanzo/ui/lib/utils'),badge=require('@hanzo/ui/primitives/badge'),button=require('@hanzo/ui/primitives/button'),card=require('@hanzo/ui/primitives/card'),dialog=require('@hanzo/ui/primitives/dialog'),dropdownMenu=require('@hanzo/ui/primitives/dropdown-menu'),input=require('@hanzo/ui/primitives/input'),label=require('@hanzo/ui/primitives/label'),select=require('@hanzo/ui/primitives/select'),textarea=require('@hanzo/ui/primitives/textarea'),jsxRuntime=require('react/jsx-runtime');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var f__namespace=/*#__PURE__*/_interopNamespace(f);var Y=Object.defineProperty;var u=(t,m)=>Y(t,"name",{value:m,configurable:true});var Me=classVarianceAuthority.cva("inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-semibold",{variants:{priority:{low:"border-blue-200 bg-blue-50 text-blue-700 dark:border-blue-800 dark:bg-blue-900/20 dark:text-blue-400",medium:"border-yellow-200 bg-yellow-50 text-yellow-700 dark:border-yellow-800 dark:bg-yellow-900/20 dark:text-yellow-400",high:"border-orange-200 bg-orange-50 text-orange-700 dark:border-orange-800 dark:bg-orange-900/20 dark:text-orange-400",urgent:"border-red-200 bg-red-50 text-red-700 dark:border-red-800 dark:bg-red-900/20 dark:text-red-400"}},defaultVariants:{priority:"low"}});function Ae({card:t,onEdit:m,onDelete:i}){let{attributes:g,listeners:C,setNodeRef:d,transform:p,transition:y,isDragging:l}=sortable.useSortable({id:t.id}),c={transform:utilities.CSS.Transform.toString(p),transition:y};return jsxRuntime.jsx("div",{ref:d,style:c,...g,...C,className:utils.cn("cursor-grab active:cursor-grabbing",l&&"opacity-50"),children:jsxRuntime.jsx(P,{card:t,onEdit:m,onDelete:i})})}u(Ae,"SortableCard");function P({card:t,onEdit:m,onDelete:i}){return jsxRuntime.jsx(card.Card,{className:"mb-3 group hover:shadow-md transition-shadow",children:jsxRuntime.jsx(card.CardHeader,{className:"pb-3",children:jsxRuntime.jsx("div",{className:"flex items-start justify-between",children:jsxRuntime.jsxs("div",{className:"flex-1 min-w-0",children:[jsxRuntime.jsx("h4",{className:"font-medium text-sm leading-tight mb-2 break-words",children:t.title}),t.description&&jsxRuntime.jsx("p",{className:"text-xs text-muted-foreground line-clamp-2 mb-2",children:t.description}),t.labels&&t.labels.length>0&&jsxRuntime.jsx("div",{className:"flex flex-wrap gap-1 mb-2",children:t.labels.map(g=>jsxRuntime.jsx(badge.Badge,{variant:"outline",className:"text-xs h-5",style:{backgroundColor:`${g.color}20`,borderColor:g.color,color:g.color},children:g.name},g.id))}),jsxRuntime.jsxs("div",{className:"flex items-center justify-between text-xs",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[t.priority&&jsxRuntime.jsx("span",{className:utils.cn(Me({priority:t.priority})),children:t.priority}),t.assignee&&jsxRuntime.jsxs("div",{className:"flex items-center gap-1 text-muted-foreground",children:[jsxRuntime.jsx(lucideReact.User,{className:"h-3 w-3"}),jsxRuntime.jsx("span",{children:t.assignee})]})]}),jsxRuntime.jsxs("div",{className:"flex items-center gap-1",children:[t.dueDate&&jsxRuntime.jsxs("div",{className:"flex items-center gap-1 text-muted-foreground",children:[jsxRuntime.jsx(lucideReact.Calendar,{className:"h-3 w-3"}),jsxRuntime.jsx("span",{children:new Date(t.dueDate).toLocaleDateString()})]}),jsxRuntime.jsxs(dropdownMenu.DropdownMenu,{children:[jsxRuntime.jsx(dropdownMenu.DropdownMenuTrigger,{asChild:true,children:jsxRuntime.jsx(button.Button,{variant:"ghost",size:"icon",className:"h-6 w-6 opacity-0 group-hover:opacity-100 transition-opacity",children:jsxRuntime.jsx(lucideReact.MoreHorizontal,{className:"h-3 w-3"})})}),jsxRuntime.jsxs(dropdownMenu.DropdownMenuContent,{align:"end",children:[jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem,{onClick:()=>m(t),children:[jsxRuntime.jsx(lucideReact.Edit3,{className:"h-4 w-4 mr-2"}),"Edit"]}),jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem,{onClick:()=>i(t.id),className:"text-destructive",children:[jsxRuntime.jsx(lucideReact.X,{className:"h-4 w-4 mr-2"}),"Delete"]})]})]})]})]})]})})})})}u(P,"KanbanCardComponent");function Fe({column:t,onAddCard:m,onEditCard:i,onDeleteCard:g}){let{setNodeRef:C}=sortable.useSortable({id:t.id});return jsxRuntime.jsxs("div",{ref:C,className:"bg-muted/50 rounded-lg p-4 min-w-[280px] max-w-[280px] flex flex-col",children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between mb-4",children:[jsxRuntime.jsxs("div",{className:"flex items-center gap-2",children:[jsxRuntime.jsx("h3",{className:"font-semibold text-sm",children:t.title}),jsxRuntime.jsxs(badge.Badge,{variant:"secondary",className:"text-xs",children:[t.cards.length,t.limit&&`/${t.limit}`]})]}),jsxRuntime.jsx(button.Button,{variant:"ghost",size:"icon",className:"h-8 w-8",onClick:()=>m(t.id),children:jsxRuntime.jsx(lucideReact.Plus,{className:"h-4 w-4"})})]}),jsxRuntime.jsx(sortable.SortableContext,{items:t.cards.map(d=>d.id),strategy:sortable.verticalListSortingStrategy,children:jsxRuntime.jsx("div",{className:"flex-1 min-h-[200px]",children:t.cards.map(d=>jsxRuntime.jsx(Ae,{card:d,onEdit:i,onDelete:g},d.id))})})]})}u(Fe,"KanbanColumnComponent");function Oe({open:t,onOpenChange:m,card:i,onSave:g,labels:C}){let[d,p]=f__namespace.useState({title:i?.title||"",description:i?.description||"",priority:i?.priority||"low",assignee:i?.assignee||"",dueDate:i?.dueDate||"",labels:i?.labels?.map(l=>l.id)||[]}),y=u(l=>{l.preventDefault(),d.title.trim()&&(g({...i,...d,labels:C.filter(c=>d.labels.includes(c.id)),updatedAt:new Date().toISOString()}),m(false));},"handleSubmit");return f__namespace.useEffect(()=>{p(i?{title:i.title,description:i.description||"",priority:i.priority||"low",assignee:i.assignee||"",dueDate:i.dueDate||"",labels:i.labels?.map(l=>l.id)||[]}:{title:"",description:"",priority:"low",assignee:"",dueDate:"",labels:[]});},[i]),jsxRuntime.jsx(dialog.Dialog,{open:t,onOpenChange:m,children:jsxRuntime.jsxs(dialog.DialogContent,{className:"max-w-md",children:[jsxRuntime.jsxs(dialog.DialogHeader,{children:[jsxRuntime.jsx(dialog.DialogTitle,{children:i?"Edit Card":"Create Card"}),jsxRuntime.jsx(dialog.DialogDescription,{children:i?"Update the card details below.":"Create a new card for your kanban board."})]}),jsxRuntime.jsxs("form",{onSubmit:y,className:"space-y-4",children:[jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx(label.Label,{htmlFor:"title",children:"Title *"}),jsxRuntime.jsx(input.Input,{id:"title",value:d.title,onChange:l=>p(c=>({...c,title:l.target.value})),placeholder:"Enter card title...",required:true})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx(label.Label,{htmlFor:"description",children:"Description"}),jsxRuntime.jsx(textarea.Textarea,{id:"description",value:d.description,onChange:l=>p(c=>({...c,description:l.target.value})),placeholder:"Enter card description...",rows:3})]}),jsxRuntime.jsxs("div",{className:"grid grid-cols-2 gap-4",children:[jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx(label.Label,{htmlFor:"priority",children:"Priority"}),jsxRuntime.jsxs(select.Select,{value:d.priority,onValueChange:l=>p(c=>({...c,priority:l})),children:[jsxRuntime.jsx(select.SelectTrigger,{children:jsxRuntime.jsx(select.SelectValue,{})}),jsxRuntime.jsxs(select.SelectContent,{children:[jsxRuntime.jsx(select.SelectItem,{value:"low",children:"Low"}),jsxRuntime.jsx(select.SelectItem,{value:"medium",children:"Medium"}),jsxRuntime.jsx(select.SelectItem,{value:"high",children:"High"}),jsxRuntime.jsx(select.SelectItem,{value:"urgent",children:"Urgent"})]})]})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx(label.Label,{htmlFor:"assignee",children:"Assignee"}),jsxRuntime.jsx(input.Input,{id:"assignee",value:d.assignee,onChange:l=>p(c=>({...c,assignee:l.target.value})),placeholder:"Assign to..."})]})]}),jsxRuntime.jsxs("div",{children:[jsxRuntime.jsx(label.Label,{htmlFor:"dueDate",children:"Due Date"}),jsxRuntime.jsx(input.Input,{id:"dueDate",type:"date",value:d.dueDate,onChange:l=>p(c=>({...c,dueDate:l.target.value}))})]}),jsxRuntime.jsxs(dialog.DialogFooter,{children:[jsxRuntime.jsx(button.Button,{type:"button",variant:"outline",onClick:()=>m(false),children:"Cancel"}),jsxRuntime.jsxs(button.Button,{type:"submit",children:[i?"Update":"Create"," Card"]})]})]})]})})}u(Oe,"CardFormDialog");function Re({board:t,onUpdateBoard:m,className:i}){let[g,C]=f__namespace.useState(null),[d,p]=f__namespace.useState(""),[y,l]=f__namespace.useState(false),[c,A]=f__namespace.useState(void 0),[H,F]=f__namespace.useState(""),V=core.useSensors(core.useSensor(core.PointerSensor,{activationConstraint:{distance:8}})),U=f__namespace.useMemo(()=>d.trim()?{...t,columns:t.columns.map(r=>({...r,cards:r.cards.filter(o=>o.title.toLowerCase().includes(d.toLowerCase())||o.description?.toLowerCase().includes(d.toLowerCase())||o.labels?.some(s=>s.name.toLowerCase().includes(d.toLowerCase())))}))}:t,[t,d]),j=u(a=>{let{active:r}=a,o=t.columns.flatMap(s=>s.cards).find(s=>s.id===r.id);C(o||null);},"handleDragStart"),q=u(a=>{let{active:r,over:o}=a;if(!o)return;let s=r.id,b=o.id,D=E(s),h=E(b);if(!D||!h||D===h)return;let x={...t},S=x.columns.findIndex(I=>I.id===D),w=x.columns.findIndex(I=>I.id===h),N=x.columns[S],v=x.columns[w],J=N.cards.findIndex(I=>I.id===s),[W]=N.cards.splice(J,1);v.limit&&v.cards.length>=v.limit||(v.cards.push(W),m(x));},"handleDragOver"),z=u(a=>{let{active:r,over:o}=a;if(C(null),!o)return;let s=r.id,b=o.id,D=E(s),h=E(b);if(!D||!h)return;let x=t.columns.findIndex(w=>w.id===D),S=t.columns[x];if(D===h){let w=S.cards.findIndex(v=>v.id===s),N=S.cards.findIndex(v=>v.id===b);if(w!==N){let v={...t};v.columns[x].cards=sortable.arrayMove(S.cards,w,N),m(v);}}},"handleDragEnd"),E=u(a=>t.columns.some(r=>r.id===a)?a:t.columns.find(r=>r.cards.some(o=>o.id===a))?.id,"findContainer"),$=u(a=>{F(a),A(void 0),l(true);},"handleAddCard"),Q=u(a=>{A(a),F(""),l(true);},"handleEditCard"),X=u(a=>{let r={...t};if(c){let o=r.columns.findIndex(s=>s.cards.some(b=>b.id===c.id));if(o!==-1){let s=r.columns[o].cards.findIndex(b=>b.id===c.id);s!==-1&&(r.columns[o].cards[s]={...c,...a});}}else {let o=r.columns.findIndex(s=>s.id===H);if(o!==-1){let s={id:`card-${Date.now()}`,title:a.title,description:a.description,labels:a.labels,priority:a.priority,assignee:a.assignee,dueDate:a.dueDate,createdAt:new Date().toISOString(),updatedAt:new Date().toISOString()};r.columns[o].cards.push(s);}}m(r);},"handleSaveCard"),G=u(a=>{let r={...t},o=r.columns.findIndex(s=>s.cards.some(b=>b.id===a));o!==-1&&(r.columns[o].cards=r.columns[o].cards.filter(s=>s.id!==a),m(r));},"handleDeleteCard");return jsxRuntime.jsxs("div",{className:utils.cn("flex flex-col h-full",i),children:[jsxRuntime.jsxs("div",{className:"flex items-center justify-between p-4 border-b",children:[jsxRuntime.jsx("h1",{className:"text-2xl font-bold",children:t.title}),jsxRuntime.jsx("div",{className:"flex items-center gap-3",children:jsxRuntime.jsxs("div",{className:"relative",children:[jsxRuntime.jsx(lucideReact.Search,{className:"absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground"}),jsxRuntime.jsx(input.Input,{placeholder:"Search cards...",value:d,onChange:a=>p(a.target.value),className:"pl-9 w-64"})]})})]}),jsxRuntime.jsx("div",{className:"flex-1 overflow-x-auto",children:jsxRuntime.jsx("div",{className:"h-full p-4",children:jsxRuntime.jsxs(core.DndContext,{sensors:V,collisionDetection:core.closestCorners,onDragStart:j,onDragOver:q,onDragEnd:z,children:[jsxRuntime.jsx("div",{className:"flex gap-6 h-full pb-4",children:U.columns.map(a=>jsxRuntime.jsx(Fe,{column:a,onAddCard:$,onEditCard:Q,onDeleteCard:G},a.id))}),jsxRuntime.jsx(core.DragOverlay,{children:g?jsxRuntime.jsx(P,{card:g,onEdit:()=>{},onDelete:()=>{}}):null})]})})}),jsxRuntime.jsx(Oe,{open:y,onOpenChange:l,card:c,onSave:X,labels:t.labels})]})}u(Re,"KanbanBoard");var rt=Re;exports.KanbanBoard=Re;exports.default=rt;
+"use client";
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var core = require('@dnd-kit/core');
+var sortable = require('@dnd-kit/sortable');
+var utilities = require('@dnd-kit/utilities');
+var classVarianceAuthority = require('class-variance-authority');
+var lucideReact = require('lucide-react');
+var utils = require('@hanzo/ui/lib/utils');
+var badge = require('@hanzo/ui/primitives/badge');
+var button = require('@hanzo/ui/primitives/button');
+var card = require('@hanzo/ui/primitives/card');
+var dialog = require('@hanzo/ui/primitives/dialog');
+var dropdownMenu = require('@hanzo/ui/primitives/dropdown-menu');
+var input = require('@hanzo/ui/primitives/input');
+var label = require('@hanzo/ui/primitives/label');
+var select = require('@hanzo/ui/primitives/select');
+var textarea = require('@hanzo/ui/primitives/textarea');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var priorityVariants = classVarianceAuthority.cva(
+  "inline-flex items-center rounded-full border px-2 py-0.5 text-xs font-semibold",
+  {
+    variants: {
+      priority: {
+        low: "border-blue-200 bg-blue-50 text-blue-700 dark:border-blue-800 dark:bg-blue-900/20 dark:text-blue-400",
+        medium: "border-yellow-200 bg-yellow-50 text-yellow-700 dark:border-yellow-800 dark:bg-yellow-900/20 dark:text-yellow-400",
+        high: "border-orange-200 bg-orange-50 text-orange-700 dark:border-orange-800 dark:bg-orange-900/20 dark:text-orange-400",
+        urgent: "border-red-200 bg-red-50 text-red-700 dark:border-red-800 dark:bg-red-900/20 dark:text-red-400"
+      }
+    },
+    defaultVariants: {
+      priority: "low"
+    }
+  }
+);
+function SortableCard({
+  card,
+  onEdit,
+  onDelete
+}) {
+  const {
+    attributes,
+    listeners,
+    setNodeRef,
+    transform,
+    transition,
+    isDragging
+  } = sortable.useSortable({ id: card.id });
+  const style = {
+    transform: utilities.CSS.Transform.toString(transform),
+    transition
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      ref: setNodeRef,
+      style,
+      ...attributes,
+      ...listeners,
+      className: utils.cn(
+        "cursor-grab active:cursor-grabbing",
+        isDragging && "opacity-50"
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx(KanbanCardComponent, { card, onEdit, onDelete })
+    }
+  );
+}
+__name(SortableCard, "SortableCard");
+function KanbanCardComponent({
+  card: card$1,
+  onEdit,
+  onDelete
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(card.Card, { className: "mb-3 group hover:shadow-md transition-shadow", children: /* @__PURE__ */ jsxRuntime.jsx(card.CardHeader, { className: "pb-3", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-start justify-between", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 min-w-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "font-medium text-sm leading-tight mb-2 break-words", children: card$1.title }),
+    card$1.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs text-muted-foreground line-clamp-2 mb-2", children: card$1.description }),
+    card$1.labels && card$1.labels.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-wrap gap-1 mb-2", children: card$1.labels.map((label) => /* @__PURE__ */ jsxRuntime.jsx(
+      badge.Badge,
+      {
+        variant: "outline",
+        className: "text-xs h-5",
+        style: {
+          backgroundColor: `${label.color}20`,
+          borderColor: label.color,
+          color: label.color
+        },
+        children: label.name
+      },
+      label.id
+    )) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between text-xs", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+        card$1.priority && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            className: utils.cn(
+              priorityVariants({ priority: card$1.priority })
+            ),
+            children: card$1.priority
+          }
+        ),
+        card$1.assignee && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.User, { className: "h-3 w-3" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: card$1.assignee })
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
+        card$1.dueDate && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Calendar, { className: "h-3 w-3" }),
+          /* @__PURE__ */ jsxRuntime.jsx("span", { children: new Date(card$1.dueDate).toLocaleDateString() })
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenu, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(dropdownMenu.DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
+            button.Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: "h-6 w-6 opacity-0 group-hover:opacity-100 transition-opacity",
+              children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreHorizontal, { className: "h-3 w-3" })
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenuContent, { align: "end", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(dropdownMenu.DropdownMenuItem, { onClick: () => onEdit(card$1), children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Edit3, { className: "h-4 w-4 mr-2" }),
+              "Edit"
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              dropdownMenu.DropdownMenuItem,
+              {
+                onClick: () => onDelete(card$1.id),
+                className: "text-destructive",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4 mr-2" }),
+                  "Delete"
+                ]
+              }
+            )
+          ] })
+        ] })
+      ] })
+    ] })
+  ] }) }) }) });
+}
+__name(KanbanCardComponent, "KanbanCardComponent");
+function KanbanColumnComponent({
+  column,
+  onAddCard,
+  onEditCard,
+  onDeleteCard
+}) {
+  const { setNodeRef } = sortable.useSortable({ id: column.id });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      ref: setNodeRef,
+      className: "bg-muted/50 rounded-lg p-4 min-w-[280px] max-w-[280px] flex flex-col",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between mb-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold text-sm", children: column.title }),
+            /* @__PURE__ */ jsxRuntime.jsxs(badge.Badge, { variant: "secondary", className: "text-xs", children: [
+              column.cards.length,
+              column.limit && `/${column.limit}`
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            button.Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: "h-8 w-8",
+              onClick: () => onAddCard(column.id),
+              children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4" })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          sortable.SortableContext,
+          {
+            items: column.cards.map((card) => card.id),
+            strategy: sortable.verticalListSortingStrategy,
+            children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 min-h-[200px]", children: column.cards.map((card) => /* @__PURE__ */ jsxRuntime.jsx(
+              SortableCard,
+              {
+                card,
+                onEdit: onEditCard,
+                onDelete: onDeleteCard
+              },
+              card.id
+            )) })
+          }
+        )
+      ]
+    }
+  );
+}
+__name(KanbanColumnComponent, "KanbanColumnComponent");
+function CardFormDialog({
+  open,
+  onOpenChange,
+  card,
+  onSave,
+  labels
+}) {
+  const [formData, setFormData] = React__namespace.useState({
+    title: card?.title || "",
+    description: card?.description || "",
+    priority: card?.priority || "low",
+    assignee: card?.assignee || "",
+    dueDate: card?.dueDate || "",
+    labels: card?.labels?.map((l) => l.id) || []
+  });
+  const handleSubmit = /* @__PURE__ */ __name((e) => {
+    e.preventDefault();
+    if (!formData.title.trim()) return;
+    onSave({
+      ...card,
+      ...formData,
+      labels: labels.filter((l) => formData.labels.includes(l.id)),
+      updatedAt: (/* @__PURE__ */ new Date()).toISOString()
+    });
+    onOpenChange(false);
+  }, "handleSubmit");
+  React__namespace.useEffect(() => {
+    if (card) {
+      setFormData({
+        title: card.title,
+        description: card.description || "",
+        priority: card.priority || "low",
+        assignee: card.assignee || "",
+        dueDate: card.dueDate || "",
+        labels: card.labels?.map((l) => l.id) || []
+      });
+    } else {
+      setFormData({
+        title: "",
+        description: "",
+        priority: "low",
+        assignee: "",
+        dueDate: "",
+        labels: []
+      });
+    }
+  }, [card]);
+  return /* @__PURE__ */ jsxRuntime.jsx(dialog.Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxRuntime.jsxs(dialog.DialogContent, { className: "max-w-md", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(dialog.DialogHeader, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogTitle, { children: card ? "Edit Card" : "Create Card" }),
+      /* @__PURE__ */ jsxRuntime.jsx(dialog.DialogDescription, { children: card ? "Update the card details below." : "Create a new card for your kanban board." })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, className: "space-y-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(label.Label, { htmlFor: "title", children: "Title *" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          input.Input,
+          {
+            id: "title",
+            value: formData.title,
+            onChange: (e) => setFormData((prev) => ({ ...prev, title: e.target.value })),
+            placeholder: "Enter card title...",
+            required: true
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(label.Label, { htmlFor: "description", children: "Description" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          textarea.Textarea,
+          {
+            id: "description",
+            value: formData.description,
+            onChange: (e) => setFormData((prev) => ({
+              ...prev,
+              description: e.target.value
+            })),
+            placeholder: "Enter card description...",
+            rows: 3
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(label.Label, { htmlFor: "priority", children: "Priority" }),
+          /* @__PURE__ */ jsxRuntime.jsxs(
+            select.Select,
+            {
+              value: formData.priority,
+              onValueChange: (value) => setFormData((prev) => ({ ...prev, priority: value })),
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(select.SelectTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(select.SelectValue, {}) }),
+                /* @__PURE__ */ jsxRuntime.jsxs(select.SelectContent, { children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "low", children: "Low" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "medium", children: "Medium" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "high", children: "High" }),
+                  /* @__PURE__ */ jsxRuntime.jsx(select.SelectItem, { value: "urgent", children: "Urgent" })
+                ] })
+              ]
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(label.Label, { htmlFor: "assignee", children: "Assignee" }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            input.Input,
+            {
+              id: "assignee",
+              value: formData.assignee,
+              onChange: (e) => setFormData((prev) => ({ ...prev, assignee: e.target.value })),
+              placeholder: "Assign to..."
+            }
+          )
+        ] })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(label.Label, { htmlFor: "dueDate", children: "Due Date" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          input.Input,
+          {
+            id: "dueDate",
+            type: "date",
+            value: formData.dueDate,
+            onChange: (e) => setFormData((prev) => ({ ...prev, dueDate: e.target.value }))
+          }
+        )
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs(dialog.DialogFooter, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          button.Button,
+          {
+            type: "button",
+            variant: "outline",
+            onClick: () => onOpenChange(false),
+            children: "Cancel"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs(button.Button, { type: "submit", children: [
+          card ? "Update" : "Create",
+          " Card"
+        ] })
+      ] })
+    ] })
+  ] }) });
+}
+__name(CardFormDialog, "CardFormDialog");
+function KanbanBoard({
+  board,
+  onUpdateBoard,
+  className
+}) {
+  const [activeCard, setActiveCard] = React__namespace.useState(null);
+  const [searchQuery, setSearchQuery] = React__namespace.useState("");
+  const [cardFormOpen, setCardFormOpen] = React__namespace.useState(false);
+  const [editingCard, setEditingCard] = React__namespace.useState(
+    void 0
+  );
+  const [activeColumnId, setActiveColumnId] = React__namespace.useState("");
+  const sensors = core.useSensors(
+    core.useSensor(core.PointerSensor, {
+      activationConstraint: {
+        distance: 8
+      }
+    })
+  );
+  const filteredBoard = React__namespace.useMemo(() => {
+    if (!searchQuery.trim()) return board;
+    const filtered = {
+      ...board,
+      columns: board.columns.map((column) => ({
+        ...column,
+        cards: column.cards.filter(
+          (card) => card.title.toLowerCase().includes(searchQuery.toLowerCase()) || card.description?.toLowerCase().includes(searchQuery.toLowerCase()) || card.labels?.some(
+            (label) => label.name.toLowerCase().includes(searchQuery.toLowerCase())
+          )
+        )
+      }))
+    };
+    return filtered;
+  }, [board, searchQuery]);
+  const handleDragStart = /* @__PURE__ */ __name((event) => {
+    const { active } = event;
+    const card = board.columns.flatMap((col) => col.cards).find((card2) => card2.id === active.id);
+    setActiveCard(card || null);
+  }, "handleDragStart");
+  const handleDragOver = /* @__PURE__ */ __name((event) => {
+    const { active, over } = event;
+    if (!over) return;
+    const activeId = active.id;
+    const overId = over.id;
+    const activeContainer = findContainer(activeId);
+    const overContainer = findContainer(overId);
+    if (!activeContainer || !overContainer || activeContainer === overContainer) {
+      return;
+    }
+    const updatedBoard = { ...board };
+    const activeColumnIndex = updatedBoard.columns.findIndex(
+      (col) => col.id === activeContainer
+    );
+    const overColumnIndex = updatedBoard.columns.findIndex(
+      (col) => col.id === overContainer
+    );
+    const activeColumn = updatedBoard.columns[activeColumnIndex];
+    const overColumn = updatedBoard.columns[overColumnIndex];
+    const activeCardIndex = activeColumn.cards.findIndex(
+      (card) => card.id === activeId
+    );
+    const [movedCard] = activeColumn.cards.splice(activeCardIndex, 1);
+    if (overColumn.limit && overColumn.cards.length >= overColumn.limit) {
+      return;
+    }
+    overColumn.cards.push(movedCard);
+    onUpdateBoard(updatedBoard);
+  }, "handleDragOver");
+  const handleDragEnd = /* @__PURE__ */ __name((event) => {
+    const { active, over } = event;
+    setActiveCard(null);
+    if (!over) return;
+    const activeId = active.id;
+    const overId = over.id;
+    const activeContainer = findContainer(activeId);
+    const overContainer = findContainer(overId);
+    if (!activeContainer || !overContainer) return;
+    const activeColumnIndex = board.columns.findIndex(
+      (col) => col.id === activeContainer
+    );
+    const activeColumn = board.columns[activeColumnIndex];
+    if (activeContainer === overContainer) {
+      const oldIndex = activeColumn.cards.findIndex(
+        (card) => card.id === activeId
+      );
+      const newIndex = activeColumn.cards.findIndex(
+        (card) => card.id === overId
+      );
+      if (oldIndex !== newIndex) {
+        const updatedBoard = { ...board };
+        updatedBoard.columns[activeColumnIndex].cards = sortable.arrayMove(
+          activeColumn.cards,
+          oldIndex,
+          newIndex
+        );
+        onUpdateBoard(updatedBoard);
+      }
+    }
+  }, "handleDragEnd");
+  const findContainer = /* @__PURE__ */ __name((id) => {
+    if (board.columns.some((col) => col.id === id)) {
+      return id;
+    }
+    return board.columns.find((col) => col.cards.some((card) => card.id === id))?.id;
+  }, "findContainer");
+  const handleAddCard = /* @__PURE__ */ __name((columnId) => {
+    setActiveColumnId(columnId);
+    setEditingCard(void 0);
+    setCardFormOpen(true);
+  }, "handleAddCard");
+  const handleEditCard = /* @__PURE__ */ __name((card) => {
+    setEditingCard(card);
+    setActiveColumnId("");
+    setCardFormOpen(true);
+  }, "handleEditCard");
+  const handleSaveCard = /* @__PURE__ */ __name((cardData) => {
+    const updatedBoard = { ...board };
+    if (editingCard) {
+      const columnIndex = updatedBoard.columns.findIndex(
+        (col) => col.cards.some((card) => card.id === editingCard.id)
+      );
+      if (columnIndex !== -1) {
+        const cardIndex = updatedBoard.columns[columnIndex].cards.findIndex(
+          (card) => card.id === editingCard.id
+        );
+        if (cardIndex !== -1) {
+          updatedBoard.columns[columnIndex].cards[cardIndex] = {
+            ...editingCard,
+            ...cardData
+          };
+        }
+      }
+    } else {
+      const columnIndex = updatedBoard.columns.findIndex(
+        (col) => col.id === activeColumnId
+      );
+      if (columnIndex !== -1) {
+        const newCard = {
+          id: `card-${Date.now()}`,
+          title: cardData.title,
+          description: cardData.description,
+          labels: cardData.labels,
+          priority: cardData.priority,
+          assignee: cardData.assignee,
+          dueDate: cardData.dueDate,
+          createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+          updatedAt: (/* @__PURE__ */ new Date()).toISOString()
+        };
+        updatedBoard.columns[columnIndex].cards.push(newCard);
+      }
+    }
+    onUpdateBoard(updatedBoard);
+  }, "handleSaveCard");
+  const handleDeleteCard = /* @__PURE__ */ __name((cardId) => {
+    const updatedBoard = { ...board };
+    const columnIndex = updatedBoard.columns.findIndex(
+      (col) => col.cards.some((card) => card.id === cardId)
+    );
+    if (columnIndex !== -1) {
+      updatedBoard.columns[columnIndex].cards = updatedBoard.columns[columnIndex].cards.filter((card) => card.id !== cardId);
+      onUpdateBoard(updatedBoard);
+    }
+  }, "handleDeleteCard");
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("flex flex-col h-full", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between p-4 border-b", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-2xl font-bold", children: board.title }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-3", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-3 top-1/2 transform -translate-y-1/2 h-4 w-4 text-muted-foreground" }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          input.Input,
+          {
+            placeholder: "Search cards...",
+            value: searchQuery,
+            onChange: (e) => setSearchQuery(e.target.value),
+            className: "pl-9 w-64"
+          }
+        )
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-x-auto", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full p-4", children: /* @__PURE__ */ jsxRuntime.jsxs(
+      core.DndContext,
+      {
+        sensors,
+        collisionDetection: core.closestCorners,
+        onDragStart: handleDragStart,
+        onDragOver: handleDragOver,
+        onDragEnd: handleDragEnd,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-6 h-full pb-4", children: filteredBoard.columns.map((column) => /* @__PURE__ */ jsxRuntime.jsx(
+            KanbanColumnComponent,
+            {
+              column,
+              onAddCard: handleAddCard,
+              onEditCard: handleEditCard,
+              onDeleteCard: handleDeleteCard
+            },
+            column.id
+          )) }),
+          /* @__PURE__ */ jsxRuntime.jsx(core.DragOverlay, { children: activeCard ? /* @__PURE__ */ jsxRuntime.jsx(
+            KanbanCardComponent,
+            {
+              card: activeCard,
+              onEdit: () => {
+              },
+              onDelete: () => {
+              }
+            }
+          ) : null })
+        ]
+      }
+    ) }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      CardFormDialog,
+      {
+        open: cardFormOpen,
+        onOpenChange: setCardFormOpen,
+        card: editingCard,
+        onSave: handleSaveCard,
+        labels: board.labels
+      }
+    )
+  ] });
+}
+__name(KanbanBoard, "KanbanBoard");
+var kanban_default = KanbanBoard;
+
+exports.KanbanBoard = KanbanBoard;
+exports.default = kanban_default;