@axtec/components 0.1.8 → 0.1.10

package/dist/index68.js.map

@@ -1 +1 @@
-{"version":3,"file":"index68.js","sources":["../src/components/TaskList/TaskList.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport { Panel, PanelHeader, PanelTitle, PanelAction, PanelEmptyState } from '../Panel/Panel'\nimport { Badge } from '../Badge/Badge'\n\nexport interface Task {\n  id: string\n  title: string\n  description?: string\n  dueDate?: string\n  priority?: 'high' | 'medium' | 'low'\n  status?: 'pending' | 'overdue' | 'completed'\n  meta?: string\n}\n\nexport interface TaskListProps {\n  tasks: Task[]\n  title?: string\n  onTaskClick?: (task: Task) => void\n  onViewAll?: () => void\n  onAddTask?: () => void\n  maxTasks?: number\n  emptyMessage?: string\n  className?: string\n}\n\nconst formatDueDate = (dateString?: string) => {\n  if (!dateString) return null\n  const date = new Date(dateString)\n  const now = new Date()\n  const diffDays = Math.ceil((date.getTime() - now.getTime()) / (1000 * 60 * 60 * 24))\n\n  if (diffDays < 0) {\n    return { text: `Overdue by ${Math.abs(diffDays)} days`, isOverdue: true }\n  } else if (diffDays === 0) {\n    return { text: 'Due today', isOverdue: true }\n  } else if (diffDays === 1) {\n    return { text: 'Due tomorrow', isOverdue: false }\n  } else if (diffDays <= 7) {\n    return { text: `Due in ${diffDays} days`, isOverdue: false }\n  } else {\n    return { text: `Due ${date.toLocaleDateString()}`, isOverdue: false }\n  }\n}\n\nexport const TaskList = ({\n  tasks,\n  title = 'Tasks',\n  onTaskClick,\n  onViewAll,\n  onAddTask,\n  maxTasks = 5,\n  emptyMessage = \"No tasks to display.\",\n  className,\n}: TaskListProps) => {\n  // Sort tasks: overdue first, then by priority, then by due date\n  const sortedTasks = [...tasks]\n    .filter((t) => t.status !== 'completed')\n    .sort((a, b) => {\n      if (a.status === 'overdue' && b.status !== 'overdue') return -1\n      if (a.status !== 'overdue' && b.status === 'overdue') return 1\n      if (a.priority === 'high' && b.priority !== 'high') return -1\n      if (a.priority !== 'high' && b.priority === 'high') return 1\n      if (a.dueDate && b.dueDate) {\n        return new Date(a.dueDate).getTime() - new Date(b.dueDate).getTime()\n      }\n      return 0\n    })\n    .slice(0, maxTasks)\n\n  const overdueCount = tasks.filter((t) => t.status === 'overdue').length\n\n  return (\n    <Panel className={className}>\n      <PanelHeader>\n        <PanelTitle\n          badge={\n            overdueCount > 0 ? (\n              <Badge variant=\"danger\" size=\"sm\">\n                {overdueCount} overdue\n              </Badge>\n            ) : undefined\n          }\n        >\n          {title}\n        </PanelTitle>\n        {onAddTask && (\n          <PanelAction onClick={onAddTask}>\n            + Add Task\n          </PanelAction>\n        )}\n      </PanelHeader>\n\n      {sortedTasks.length === 0 ? (\n        <PanelEmptyState message={emptyMessage} />\n      ) : (\n        <div className=\"flex flex-col gap-3\">\n          {sortedTasks.map((task) => {\n            const dueInfo = formatDueDate(task.dueDate)\n            return (\n              <div\n                key={task.id}\n                className={cn(\n                  'flex items-start p-4',\n                  'bg-white border border-slate-200 rounded-xl',\n                  'transition-colors hover:bg-slate-50',\n                  onTaskClick && 'cursor-pointer'\n                )}\n                onClick={() => onTaskClick?.(task)}\n              >\n                <div className=\"flex-1 min-w-0\">\n                  <h4 className=\"text-sm font-semibold text-slate-900 m-0 mb-1\">\n                    {task.title}\n                  </h4>\n                  {task.description && (\n                    <p className=\"text-sm text-slate-500 m-0 mb-2 truncate\">\n                      {task.description}\n                    </p>\n                  )}\n                  <div className=\"flex items-center gap-2 flex-wrap\">\n                    {dueInfo && (\n                      <span\n                        className={cn(\n                          'text-xs',\n                          dueInfo.isOverdue ? 'text-red-500 font-semibold' : 'text-slate-500'\n                        )}\n                      >\n                        {dueInfo.text}\n                      </span>\n                    )}\n                    {task.meta && (\n                      <>\n                        {dueInfo && <span className=\"text-slate-300\">•</span>}\n                        <span className=\"text-xs text-slate-500\">\n                          {task.meta}\n                        </span>\n                      </>\n                    )}\n                    {task.priority === 'high' && (\n                      <Badge variant=\"warning\" size=\"sm\">\n                        High Priority\n                      </Badge>\n                    )}\n                  </div>\n                </div>\n                {onTaskClick && (\n                  <button\n                    className={cn(\n                      'px-3 py-1.5 ml-3 flex-shrink-0',\n                      'bg-white border border-slate-200 rounded-lg',\n                      'text-xs font-medium text-slate-700',\n                      'transition-colors hover:bg-slate-100 hover:border-slate-300'\n                    )}\n                    onClick={(e) => {\n                      e.stopPropagation()\n                      onTaskClick(task)\n                    }}\n                  >\n                    View\n                  </button>\n                )}\n              </div>\n            )\n          })}\n\n          {tasks.length > maxTasks && onViewAll && (\n            <button\n              onClick={onViewAll}\n              className={cn(\n                'w-full p-3 mt-2',\n                'bg-transparent border border-dashed border-slate-200 rounded-xl',\n                'text-sm text-slate-500',\n                'transition-colors hover:border-slate-400 hover:text-slate-700'\n              )}\n            >\n              View all {tasks.length} tasks\n            </button>\n          )}\n        </div>\n      )}\n    </Panel>\n  )\n}\n"],"names":["formatDueDate","dateString","date","now","diffDays","TaskList","tasks","title","onTaskClick","onViewAll","onAddTask","maxTasks","emptyMessage","className","sortedTasks","t","a","b","overdueCount","jsxs","Panel","PanelHeader","jsx","PanelTitle","Badge","PanelAction","PanelEmptyState","task","dueInfo","cn","Fragment","e"],"mappings":"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"}
+{"version":3,"file":"index68.js","sources":["../src/components/Table/Table.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface TableColumn<T> {\n  key: string\n  header: string\n  render?: (item: T, index: number) => ReactNode\n  className?: string\n  headerClassName?: string\n}\n\nexport interface TableProps<T> {\n  columns: TableColumn<T>[]\n  data: T[]\n  keyExtractor: (item: T, index: number) => string | number\n  striped?: boolean\n  hoverable?: boolean\n  compact?: boolean\n  className?: string\n  emptyMessage?: string\n}\n\nexport function Table<T>({\n  columns,\n  data,\n  keyExtractor,\n  striped = false,\n  hoverable = true,\n  compact = false,\n  className,\n  emptyMessage = 'No data available',\n}: TableProps<T>) {\n  return (\n    <div className={cn('overflow-x-auto', className)}>\n      <table className=\"w-full text-left\">\n        <thead>\n          <tr className=\"border-b border-slate-200 bg-slate-50\">\n            {columns.map((column) => (\n              <th\n                key={column.key}\n                className={cn(\n                  'font-semibold text-slate-700 text-sm',\n                  compact ? 'px-4 py-2' : 'px-6 py-3',\n                  column.headerClassName\n                )}\n              >\n                {column.header}\n              </th>\n            ))}\n          </tr>\n        </thead>\n        <tbody>\n          {data.length === 0 ? (\n            <tr>\n              <td\n                colSpan={columns.length}\n                className={cn(\n                  'text-center text-slate-500',\n                  compact ? 'px-4 py-8' : 'px-6 py-12'\n                )}\n              >\n                {emptyMessage}\n              </td>\n            </tr>\n          ) : (\n            data.map((item, index) => (\n              <tr\n                key={keyExtractor(item, index)}\n                className={cn(\n                  'border-b border-slate-100 transition-colors duration-150',\n                  striped && index % 2 === 1 && 'bg-slate-50',\n                  hoverable && 'hover:bg-slate-50'\n                )}\n              >\n                {columns.map((column) => (\n                  <td\n                    key={column.key}\n                    className={cn(\n                      'text-slate-900',\n                      compact ? 'px-4 py-2' : 'px-6 py-4',\n                      column.className\n                    )}\n                  >\n                    {column.render\n                      ? column.render(item, index)\n                      : (item as Record<string, unknown>)[column.key] as ReactNode}\n                  </td>\n                ))}\n              </tr>\n            ))\n          )}\n        </tbody>\n      </table>\n    </div>\n  )\n}\n"],"names":["Table","columns","data","keyExtractor","striped","hoverable","compact","className","emptyMessage","jsx","cn","jsxs","column","item","index"],"mappings":";;AAsBO,SAASA,EAAS;AAAA,EACvB,SAAAC;AAAA,EACA,MAAAC;AAAA,EACA,cAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,SAAAC,IAAU;AAAA,EACV,WAAAC;AAAA,EACA,cAAAC,IAAe;AACjB,GAAkB;AAChB,SACE,gBAAAC,EAAC,OAAA,EAAI,WAAWC,EAAG,mBAAmBH,CAAS,GAC7C,UAAA,gBAAAI,EAAC,SAAA,EAAM,WAAU,oBACf,UAAA;AAAA,IAAA,gBAAAF,EAAC,SAAA,EACC,4BAAC,MAAA,EAAG,WAAU,yCACX,UAAAR,EAAQ,IAAI,CAACW,MACZ,gBAAAH;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAWC;AAAA,UACT;AAAA,UACAJ,IAAU,cAAc;AAAA,UACxBM,EAAO;AAAA,QAAA;AAAA,QAGR,UAAAA,EAAO;AAAA,MAAA;AAAA,MAPHA,EAAO;AAAA,IAAA,CASf,GACH,EAAA,CACF;AAAA,sBACC,SAAA,EACE,UAAAV,EAAK,WAAW,sBACd,MAAA,EACC,UAAA,gBAAAO;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,SAASR,EAAQ;AAAA,QACjB,WAAWS;AAAA,UACT;AAAA,UACAJ,IAAU,cAAc;AAAA,QAAA;AAAA,QAGzB,UAAAE;AAAA,MAAA;AAAA,IAAA,GAEL,IAEAN,EAAK,IAAI,CAACW,GAAMC,MACd,gBAAAL;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,WAAWC;AAAA,UACT;AAAA,UACAN,KAAWU,IAAQ,MAAM,KAAK;AAAA,UAC9BT,KAAa;AAAA,QAAA;AAAA,QAGd,UAAAJ,EAAQ,IAAI,CAACW,MACZ,gBAAAH;AAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAWC;AAAA,cACT;AAAA,cACAJ,IAAU,cAAc;AAAA,cACxBM,EAAO;AAAA,YAAA;AAAA,YAGR,UAAAA,EAAO,SACJA,EAAO,OAAOC,GAAMC,CAAK,IACxBD,EAAiCD,EAAO,GAAG;AAAA,UAAA;AAAA,UAT3CA,EAAO;AAAA,QAAA,CAWf;AAAA,MAAA;AAAA,MApBIT,EAAaU,GAAMC,CAAK;AAAA,IAAA,CAsBhC,EAAA,CAEL;AAAA,EAAA,EAAA,CACF,EAAA,CACF;AAEJ;"}

package/dist/index69.js

@@ -1,51 +1,78 @@
-import { jsx as a } from "react/jsx-runtime";
-import { cn as r } from "./index3.js";
-const d = {
-  body: "text-base",
-  "body-sm": "text-sm",
-  caption: "text-xs",
-  lead: "text-lg",
-  h1: "text-5xl font-light tracking-tight",
-  h2: "text-2xl font-semibold",
-  h3: "text-lg font-semibold"
-}, i = {
-  h1: "h1",
-  h2: "h2",
-  h3: "h3"
-}, x = {
-  default: "text-slate-900",
-  muted: "text-slate-500",
-  primary: "text-primary-600",
-  danger: "text-red-600"
-}, f = {
-  normal: "font-normal",
-  medium: "font-medium",
-  semibold: "font-semibold",
-  bold: "font-bold"
-};
-function b({
-  children: e,
-  variant: t = "body",
-  color: o = "default",
-  weight: l = "normal",
-  as: n,
-  className: m
+import { jsxs as c, jsx as s } from "react/jsx-runtime";
+import { useState as u } from "react";
+import { TabGroup as f, TabList as m, Tab as x, TabPanels as g, TabPanel as h } from "@headlessui/react";
+import { cn as a } from "./index3.js";
+function j({
+  items: t,
+  defaultIndex: i = 0,
+  onChange: l,
+  variant: r = "underline",
+  fullWidth: d = !1,
+  className: n
 }) {
-  const s = n || i[t] || "p";
-  return /* @__PURE__ */ a(
-    s,
+  const [b, p] = u(i);
+  return /* @__PURE__ */ c(
+    f,
     {
-      className: r(
-        d[t],
-        x[o],
-        f[l],
-        m
-      ),
-      children: e
+      selectedIndex: b,
+      onChange: (e) => {
+        p(e), l == null || l(e);
+      },
+      className: n,
+      children: [
+        /* @__PURE__ */ s(
+          m,
+          {
+            className: a(
+              "flex",
+              r === "underline" && "border-b border-slate-200 gap-0",
+              r === "pills" && "gap-2",
+              r === "boxed" && "bg-slate-100 p-1 rounded-lg gap-1"
+            ),
+            children: t.map((e) => /* @__PURE__ */ s(
+              x,
+              {
+                disabled: e.disabled,
+                className: ({ selected: o }) => a(
+                  "font-medium text-sm transition-colors duration-200",
+                  "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2",
+                  d && "flex-1",
+                  e.disabled && "opacity-50 cursor-not-allowed",
+                  // Underline variant
+                  r === "underline" && [
+                    "px-4 py-3 -mb-px border-b-2",
+                    o ? "border-primary-500 text-primary-600" : "border-transparent text-slate-500 hover:text-slate-700 hover:border-slate-300"
+                  ],
+                  // Pills variant
+                  r === "pills" && [
+                    "px-4 py-2 rounded-lg",
+                    o ? "bg-primary-500 text-white" : "text-slate-600 hover:bg-slate-100"
+                  ],
+                  // Boxed variant
+                  r === "boxed" && [
+                    "px-4 py-2 rounded-md",
+                    o ? "bg-white text-slate-900 shadow-sm" : "text-slate-600 hover:text-slate-900"
+                  ]
+                ),
+                children: e.label
+              },
+              e.key
+            ))
+          }
+        ),
+        /* @__PURE__ */ s(g, { className: "mt-4", children: t.map((e) => /* @__PURE__ */ s(
+          h,
+          {
+            className: "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 rounded-lg",
+            children: e.content
+          },
+          e.key
+        )) })
+      ]
     }
   );
 }
 export {
-  b as Text
+  j as Tabs
 };
 //# sourceMappingURL=index69.js.map

package/dist/index69.js.map

@@ -1 +1 @@
-{"version":3,"file":"index69.js","sources":["../src/components/Typography/Text.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport type { ReactNode, ElementType } from 'react'\n\nexport interface TextProps {\n  children: ReactNode\n  variant?: 'body' | 'body-sm' | 'caption' | 'lead' | 'h1' | 'h2' | 'h3'\n  color?: 'default' | 'muted' | 'primary' | 'danger'\n  weight?: 'normal' | 'medium' | 'semibold' | 'bold'\n  as?: ElementType\n  className?: string\n}\n\nconst variantStyles = {\n  body: 'text-base',\n  'body-sm': 'text-sm',\n  caption: 'text-xs',\n  lead: 'text-lg',\n  h1: 'text-5xl font-light tracking-tight',\n  h2: 'text-2xl font-semibold',\n  h3: 'text-lg font-semibold',\n}\n\nconst variantDefaults: Partial<Record<TextProps['variant'] & string, ElementType>> = {\n  h1: 'h1',\n  h2: 'h2',\n  h3: 'h3',\n}\n\nconst colorStyles = {\n  default: 'text-slate-900',\n  muted: 'text-slate-500',\n  primary: 'text-primary-600',\n  danger: 'text-red-600',\n}\n\nconst weightStyles = {\n  normal: 'font-normal',\n  medium: 'font-medium',\n  semibold: 'font-semibold',\n  bold: 'font-bold',\n}\n\nexport function Text({\n  children,\n  variant = 'body',\n  color = 'default',\n  weight = 'normal',\n  as,\n  className,\n}: TextProps) {\n  const Component = as || variantDefaults[variant!] || 'p'\n  return (\n    <Component\n      className={cn(\n        variantStyles[variant],\n        colorStyles[color],\n        weightStyles[weight],\n        className\n      )}\n    >\n      {children}\n    </Component>\n  )\n}\n"],"names":["variantStyles","variantDefaults","colorStyles","weightStyles","Text","children","variant","color","weight","as","className","Component","jsx","cn"],"mappings":";;AAYA,MAAMA,IAAgB;AAAA,EACpB,MAAM;AAAA,EACN,WAAW;AAAA,EACX,SAAS;AAAA,EACT,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEMC,IAA+E;AAAA,EACnF,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACN,GAEMC,IAAc;AAAA,EAClB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AACV,GAEMC,IAAe;AAAA,EACnB,QAAQ;AAAA,EACR,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,MAAM;AACR;AAEO,SAASC,EAAK;AAAA,EACnB,UAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,OAAAC,IAAQ;AAAA,EACR,QAAAC,IAAS;AAAA,EACT,IAAAC;AAAA,EACA,WAAAC;AACF,GAAc;AACZ,QAAMC,IAAYF,KAAMR,EAAgBK,CAAQ,KAAK;AACrD,SACE,gBAAAM;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,WAAWE;AAAA,QACTb,EAAcM,CAAO;AAAA,QACrBJ,EAAYK,CAAK;AAAA,QACjBJ,EAAaK,CAAM;AAAA,QACnBE;AAAA,MAAA;AAAA,MAGD,UAAAL;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"index69.js","sources":["../src/components/Tabs/Tabs.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { Tab, TabGroup, TabList, TabPanel, TabPanels } from '@headlessui/react'\nimport { cn } from '@/lib/utils'\nimport type { ReactNode } from 'react'\n\nexport interface TabItem {\n  key: string\n  label: string\n  content: ReactNode\n  disabled?: boolean\n}\n\nexport interface TabsProps {\n  items: TabItem[]\n  defaultIndex?: number\n  onChange?: (index: number) => void\n  variant?: 'underline' | 'pills' | 'boxed'\n  fullWidth?: boolean\n  className?: string\n}\n\nexport function Tabs({\n  items,\n  defaultIndex = 0,\n  onChange,\n  variant = 'underline',\n  fullWidth = false,\n  className,\n}: TabsProps) {\n  const [selectedIndex, setSelectedIndex] = useState(defaultIndex)\n\n  const handleChange = (index: number) => {\n    setSelectedIndex(index)\n    onChange?.(index)\n  }\n\n  return (\n    <TabGroup\n      selectedIndex={selectedIndex}\n      onChange={handleChange}\n      className={className}\n    >\n      <TabList\n        className={cn(\n          'flex',\n          variant === 'underline' && 'border-b border-slate-200 gap-0',\n          variant === 'pills' && 'gap-2',\n          variant === 'boxed' && 'bg-slate-100 p-1 rounded-lg gap-1'\n        )}\n      >\n        {items.map((item) => (\n          <Tab\n            key={item.key}\n            disabled={item.disabled}\n            className={({ selected }) =>\n              cn(\n                'font-medium text-sm transition-colors duration-200',\n                'focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2',\n                fullWidth && 'flex-1',\n                item.disabled && 'opacity-50 cursor-not-allowed',\n\n                // Underline variant\n                variant === 'underline' && [\n                  'px-4 py-3 -mb-px border-b-2',\n                  selected\n                    ? 'border-primary-500 text-primary-600'\n                    : 'border-transparent text-slate-500 hover:text-slate-700 hover:border-slate-300',\n                ],\n\n                // Pills variant\n                variant === 'pills' && [\n                  'px-4 py-2 rounded-lg',\n                  selected\n                    ? 'bg-primary-500 text-white'\n                    : 'text-slate-600 hover:bg-slate-100',\n                ],\n\n                // Boxed variant\n                variant === 'boxed' && [\n                  'px-4 py-2 rounded-md',\n                  selected\n                    ? 'bg-white text-slate-900 shadow-sm'\n                    : 'text-slate-600 hover:text-slate-900',\n                ]\n              )\n            }\n          >\n            {item.label}\n          </Tab>\n        ))}\n      </TabList>\n      <TabPanels className=\"mt-4\">\n        {items.map((item) => (\n          <TabPanel\n            key={item.key}\n            className=\"focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500 focus-visible:ring-offset-2 rounded-lg\"\n          >\n            {item.content}\n          </TabPanel>\n        ))}\n      </TabPanels>\n    </TabGroup>\n  )\n}\n"],"names":["Tabs","items","defaultIndex","onChange","variant","fullWidth","className","selectedIndex","setSelectedIndex","useState","jsxs","TabGroup","index","jsx","TabList","cn","item","Tab","selected","TabPanels","TabPanel"],"mappings":";;;;AAqBO,SAASA,EAAK;AAAA,EACnB,OAAAC;AAAA,EACA,cAAAC,IAAe;AAAA,EACf,UAAAC;AAAA,EACA,SAAAC,IAAU;AAAA,EACV,WAAAC,IAAY;AAAA,EACZ,WAAAC;AACF,GAAc;AACZ,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAASP,CAAY;AAO/D,SACE,gBAAAQ;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,eAAAJ;AAAA,MACA,UARiB,CAACK,MAAkB;AACtC,QAAAJ,EAAiBI,CAAK,GACtBT,KAAA,QAAAA,EAAWS;AAAA,MACb;AAAA,MAMI,WAAAN;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAO;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,WAAWC;AAAA,cACT;AAAA,cACAX,MAAY,eAAe;AAAA,cAC3BA,MAAY,WAAW;AAAA,cACvBA,MAAY,WAAW;AAAA,YAAA;AAAA,YAGxB,UAAAH,EAAM,IAAI,CAACe,MACV,gBAAAH;AAAA,cAACI;AAAA,cAAA;AAAA,gBAEC,UAAUD,EAAK;AAAA,gBACf,WAAW,CAAC,EAAE,UAAAE,EAAA,MACZH;AAAA,kBACE;AAAA,kBACA;AAAA,kBACAV,KAAa;AAAA,kBACbW,EAAK,YAAY;AAAA;AAAA,kBAGjBZ,MAAY,eAAe;AAAA,oBACzB;AAAA,oBACAc,IACI,wCACA;AAAA,kBAAA;AAAA;AAAA,kBAINd,MAAY,WAAW;AAAA,oBACrB;AAAA,oBACAc,IACI,8BACA;AAAA,kBAAA;AAAA;AAAA,kBAINd,MAAY,WAAW;AAAA,oBACrB;AAAA,oBACAc,IACI,sCACA;AAAA,kBAAA;AAAA,gBACN;AAAA,gBAIH,UAAAF,EAAK;AAAA,cAAA;AAAA,cAnCDA,EAAK;AAAA,YAAA,CAqCb;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEFG,GAAA,EAAU,WAAU,QAClB,UAAAlB,EAAM,IAAI,CAACe,MACV,gBAAAH;AAAA,UAACO;AAAA,UAAA;AAAA,YAEC,WAAU;AAAA,YAET,UAAAJ,EAAK;AAAA,UAAA;AAAA,UAHDA,EAAK;AAAA,QAAA,CAKb,EAAA,CACH;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/index7.js

@@ -1,80 +1,168 @@
-import { jsxs as r, jsx as t } from "react/jsx-runtime";
-import { cn as e } from "./index3.js";
-import { InformationCircleIcon as m, ExclamationTriangleIcon as d, ExclamationCircleIcon as x, CheckCircleIcon as b, XMarkIcon as f } from "@heroicons/react/20/solid";
-const g = {
-  success: {
-    container: "bg-green-50 border-green-200",
-    icon: "text-green-500",
-    title: "text-green-800",
-    content: "text-green-700"
-  },
-  error: {
-    container: "bg-red-50 border-red-200",
-    icon: "text-red-500",
-    title: "text-red-800",
-    content: "text-red-700"
-  },
-  warning: {
-    container: "bg-yellow-50 border-yellow-200",
-    icon: "text-yellow-500",
-    title: "text-yellow-800",
-    content: "text-yellow-700"
-  },
-  info: {
-    container: "bg-blue-50 border-blue-200",
-    icon: "text-blue-500",
-    title: "text-blue-800",
-    content: "text-blue-700"
-  }
-}, u = {
-  success: b,
-  error: x,
-  warning: d,
-  info: m
-};
-function y({
-  variant: c = "info",
-  title: o,
-  children: l,
-  onClose: i,
-  className: s
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import { useState as b, useRef as y, useEffect as w } from "react";
+import { Transition as E } from "@headlessui/react";
+import { SparklesIcon as g, XMarkIcon as v, PaperAirplaneIcon as K, ChatBubbleLeftRightIcon as V } from "@heroicons/react/24/outline";
+import { cn as s } from "./index3.js";
+function O({
+  title: N = "AI Assistant",
+  subtitle: j = "Ask me anything",
+  messages: n = [],
+  onSendMessage: o,
+  isTyping: m = !1,
+  placeholder: I = "Type a message...",
+  buttonIcon: k,
+  open: D,
+  onOpenChange: c,
+  position: d = "bottom-right",
+  className: A
 }) {
-  const n = g[c], a = u[c];
-  return /* @__PURE__ */ r(
-    "div",
-    {
-      className: e(
-        "flex gap-3 p-4 rounded-lg border",
-        n.container,
-        s
-      ),
-      role: "alert",
-      children: [
-        /* @__PURE__ */ t(a, { className: e("h-5 w-5 flex-shrink-0 mt-0.5", n.icon) }),
-        /* @__PURE__ */ r("div", { className: "flex-1 min-w-0", children: [
-          o && /* @__PURE__ */ t("h3", { className: e("text-sm font-semibold", n.title), children: o }),
-          l && /* @__PURE__ */ t("div", { className: e("text-sm", n.content, o && "mt-1"), children: l })
-        ] }),
-        i && /* @__PURE__ */ r(
-          "button",
+  const [R, T] = b(!1), [l, h] = b(""), u = y(null), f = y(null), a = D ?? R, x = (t) => {
+    T(t), c == null || c(t);
+  };
+  w(() => {
+    var t;
+    (t = u.current) == null || t.scrollIntoView({ behavior: "smooth" });
+  }, [n, m]), w(() => {
+    a && setTimeout(() => {
+      var t;
+      return (t = f.current) == null ? void 0 : t.focus();
+    }, 300);
+  }, [a]);
+  const p = () => {
+    const t = l.trim();
+    t && (o == null || o(t), h(""));
+  }, $ = (t) => {
+    t.key === "Enter" && !t.shiftKey && (t.preventDefault(), p());
+  }, C = d === "bottom-right" ? "right-5 bottom-5" : "left-5 bottom-5", i = d === "bottom-right" ? "origin-bottom-right" : "origin-bottom-left";
+  return /* @__PURE__ */ r("div", { className: s("fixed z-50", C, A), children: [
+    /* @__PURE__ */ e(
+      E,
+      {
+        show: a,
+        enter: "transition ease-out duration-200",
+        enterFrom: `opacity-0 scale-95 ${i}`,
+        enterTo: `opacity-100 scale-100 ${i}`,
+        leave: "transition ease-in duration-150",
+        leaveFrom: `opacity-100 scale-100 ${i}`,
+        leaveTo: `opacity-0 scale-95 ${i}`,
+        children: /* @__PURE__ */ r(
+          "div",
           {
-            type: "button",
-            onClick: i,
-            className: e(
-              "flex-shrink-0 p-1 rounded-lg transition-colors duration-200",
-              "hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-slate-500"
+            className: s(
+              "absolute bottom-16 w-[360px] rounded-2xl shadow-2xl",
+              "border border-slate-200 bg-white",
+              "flex flex-col overflow-hidden",
+              d === "bottom-right" ? "right-0" : "left-0"
             ),
+            style: { height: "480px" },
             children: [
-              /* @__PURE__ */ t(f, { className: e("h-5 w-5", n.icon) }),
-              /* @__PURE__ */ t("span", { className: "sr-only", children: "Dismiss" })
+              /* @__PURE__ */ r("div", { className: "bg-primary-600 px-5 py-4 flex items-center justify-between flex-shrink-0", children: [
+                /* @__PURE__ */ r("div", { className: "flex items-center gap-3", children: [
+                  /* @__PURE__ */ e("div", { className: "w-8 h-8 rounded-lg bg-white/20 flex items-center justify-center", children: /* @__PURE__ */ e(g, { className: "w-4.5 h-4.5 text-white" }) }),
+                  /* @__PURE__ */ r("div", { children: [
+                    /* @__PURE__ */ e("h3", { className: "text-sm font-semibold text-white leading-tight", children: N }),
+                    /* @__PURE__ */ e("p", { className: "text-xs text-white/70", children: j })
+                  ] })
+                ] }),
+                /* @__PURE__ */ e(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: () => x(!1),
+                    className: "p-1 rounded-lg text-white/70 hover:text-white hover:bg-white/10 transition-colors",
+                    children: /* @__PURE__ */ e(v, { className: "w-5 h-5" })
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ r("div", { className: "flex-1 overflow-y-auto px-4 py-4 space-y-3", children: [
+                n.length === 0 && /* @__PURE__ */ r("div", { className: "flex flex-col items-center justify-center h-full text-center px-6", children: [
+                  /* @__PURE__ */ e("div", { className: "w-12 h-12 rounded-2xl bg-primary-50 flex items-center justify-center mb-3", children: /* @__PURE__ */ e(g, { className: "w-6 h-6 text-primary-500" }) }),
+                  /* @__PURE__ */ e("p", { className: "text-sm font-medium text-slate-700", children: "How can I help?" }),
+                  /* @__PURE__ */ e("p", { className: "text-xs text-slate-400 mt-1", children: "Send a message to get started" })
+                ] }),
+                n.map((t) => /* @__PURE__ */ e(
+                  "div",
+                  {
+                    className: s(
+                      "flex",
+                      t.role === "user" ? "justify-end" : "justify-start"
+                    ),
+                    children: /* @__PURE__ */ e(
+                      "div",
+                      {
+                        className: s(
+                          "max-w-[80%] rounded-2xl px-3.5 py-2.5 text-sm leading-relaxed",
+                          t.role === "user" ? "bg-primary-500 text-white rounded-br-md" : "bg-slate-100 text-slate-800 rounded-bl-md"
+                        ),
+                        children: t.content
+                      }
+                    )
+                  },
+                  t.id
+                )),
+                m && /* @__PURE__ */ e("div", { className: "flex justify-start", children: /* @__PURE__ */ e("div", { className: "bg-slate-100 rounded-2xl rounded-bl-md px-4 py-3", children: /* @__PURE__ */ r("div", { className: "flex gap-1", children: [
+                  /* @__PURE__ */ e("span", { className: "w-1.5 h-1.5 bg-slate-400 rounded-full animate-bounce", style: { animationDelay: "0ms" } }),
+                  /* @__PURE__ */ e("span", { className: "w-1.5 h-1.5 bg-slate-400 rounded-full animate-bounce", style: { animationDelay: "150ms" } }),
+                  /* @__PURE__ */ e("span", { className: "w-1.5 h-1.5 bg-slate-400 rounded-full animate-bounce", style: { animationDelay: "300ms" } })
+                ] }) }) }),
+                /* @__PURE__ */ e("div", { ref: u })
+              ] }),
+              /* @__PURE__ */ e("div", { className: "border-t border-slate-100 px-3 py-3 flex-shrink-0", children: /* @__PURE__ */ r("div", { className: "flex items-end gap-2", children: [
+                /* @__PURE__ */ e(
+                  "textarea",
+                  {
+                    ref: f,
+                    value: l,
+                    onChange: (t) => h(t.target.value),
+                    onKeyDown: $,
+                    placeholder: I,
+                    rows: 1,
+                    className: s(
+                      "flex-1 resize-none rounded-xl border border-slate-200 px-3.5 py-2.5",
+                      "text-sm text-slate-800 placeholder:text-slate-400",
+                      "focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent",
+                      "max-h-24"
+                    )
+                  }
+                ),
+                /* @__PURE__ */ e(
+                  "button",
+                  {
+                    type: "button",
+                    onClick: p,
+                    disabled: !l.trim(),
+                    className: s(
+                      "p-2.5 rounded-xl transition-all duration-150",
+                      "focus:outline-none focus:ring-2 focus:ring-primary-500",
+                      l.trim() ? "bg-primary-500 text-white hover:bg-primary-600 shadow-sm" : "bg-slate-100 text-slate-300 cursor-not-allowed"
+                    ),
+                    children: /* @__PURE__ */ e(K, { className: "w-4 h-4" })
+                  }
+                )
+              ] }) })
             ]
           }
         )
-      ]
-    }
-  );
+      }
+    ),
+    /* @__PURE__ */ e(
+      "button",
+      {
+        type: "button",
+        onClick: () => x(!a),
+        className: s(
+          "w-14 h-14 rounded-full shadow-lg",
+          "bg-primary-500 hover:bg-primary-600 active:bg-primary-700",
+          "text-white flex items-center justify-center",
+          "transition-all duration-200 hover:scale-105 hover:shadow-xl",
+          "focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2"
+        ),
+        children: a ? /* @__PURE__ */ e(v, { className: "w-6 h-6" }) : k || /* @__PURE__ */ e(V, { className: "w-6 h-6" })
+      }
+    )
+  ] });
 }
 export {
-  y as Alert
+  O as AgentChat
 };
 //# sourceMappingURL=index7.js.map

package/dist/index7.js.map

@@ -1 +1 @@
-{"version":3,"file":"index7.js","sources":["../src/components/Alert/Alert.tsx"],"sourcesContent":["import { cn } from '@/lib/utils'\nimport {\n  CheckCircleIcon,\n  ExclamationCircleIcon,\n  ExclamationTriangleIcon,\n  InformationCircleIcon,\n  XMarkIcon,\n} from '@heroicons/react/20/solid'\nimport type { ReactNode } from 'react'\n\nexport interface AlertProps {\n  variant?: 'success' | 'error' | 'warning' | 'info'\n  title?: string\n  children?: ReactNode\n  onClose?: () => void\n  className?: string\n}\n\nconst variantStyles = {\n  success: {\n    container: 'bg-green-50 border-green-200',\n    icon: 'text-green-500',\n    title: 'text-green-800',\n    content: 'text-green-700',\n  },\n  error: {\n    container: 'bg-red-50 border-red-200',\n    icon: 'text-red-500',\n    title: 'text-red-800',\n    content: 'text-red-700',\n  },\n  warning: {\n    container: 'bg-yellow-50 border-yellow-200',\n    icon: 'text-yellow-500',\n    title: 'text-yellow-800',\n    content: 'text-yellow-700',\n  },\n  info: {\n    container: 'bg-blue-50 border-blue-200',\n    icon: 'text-blue-500',\n    title: 'text-blue-800',\n    content: 'text-blue-700',\n  },\n}\n\nconst icons = {\n  success: CheckCircleIcon,\n  error: ExclamationCircleIcon,\n  warning: ExclamationTriangleIcon,\n  info: InformationCircleIcon,\n}\n\nexport function Alert({\n  variant = 'info',\n  title,\n  children,\n  onClose,\n  className,\n}: AlertProps) {\n  const styles = variantStyles[variant]\n  const Icon = icons[variant]\n\n  return (\n    <div\n      className={cn(\n        'flex gap-3 p-4 rounded-lg border',\n        styles.container,\n        className\n      )}\n      role=\"alert\"\n    >\n      <Icon className={cn('h-5 w-5 flex-shrink-0 mt-0.5', styles.icon)} />\n      <div className=\"flex-1 min-w-0\">\n        {title && (\n          <h3 className={cn('text-sm font-semibold', styles.title)}>{title}</h3>\n        )}\n        {children && (\n          <div className={cn('text-sm', styles.content, title && 'mt-1')}>\n            {children}\n          </div>\n        )}\n      </div>\n      {onClose && (\n        <button\n          type=\"button\"\n          onClick={onClose}\n          className={cn(\n            'flex-shrink-0 p-1 rounded-lg transition-colors duration-200',\n            'hover:bg-black/5 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-slate-500'\n          )}\n        >\n          <XMarkIcon className={cn('h-5 w-5', styles.icon)} />\n          <span className=\"sr-only\">Dismiss</span>\n        </button>\n      )}\n    </div>\n  )\n}\n"],"names":["variantStyles","icons","CheckCircleIcon","ExclamationCircleIcon","ExclamationTriangleIcon","InformationCircleIcon","Alert","variant","title","children","onClose","className","styles","Icon","jsxs","cn","jsx","XMarkIcon"],"mappings":";;;AAkBA,MAAMA,IAAgB;AAAA,EACpB,SAAS;AAAA,IACP,WAAW;AAAA,IACX,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,EAAA;AAAA,EAEX,OAAO;AAAA,IACL,WAAW;AAAA,IACX,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,EAAA;AAAA,EAEX,SAAS;AAAA,IACP,WAAW;AAAA,IACX,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,EAAA;AAAA,EAEX,MAAM;AAAA,IACJ,WAAW;AAAA,IACX,MAAM;AAAA,IACN,OAAO;AAAA,IACP,SAAS;AAAA,EAAA;AAEb,GAEMC,IAAQ;AAAA,EACZ,SAASC;AAAA,EACT,OAAOC;AAAA,EACP,SAASC;AAAA,EACT,MAAMC;AACR;AAEO,SAASC,EAAM;AAAA,EACpB,SAAAC,IAAU;AAAA,EACV,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AACF,GAAe;AACb,QAAMC,IAASZ,EAAcO,CAAO,GAC9BM,IAAOZ,EAAMM,CAAO;AAE1B,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC;AAAA,QACT;AAAA,QACAH,EAAO;AAAA,QACPD;AAAA,MAAA;AAAA,MAEF,MAAK;AAAA,MAEL,UAAA;AAAA,QAAA,gBAAAK,EAACH,KAAK,WAAWE,EAAG,gCAAgCH,EAAO,IAAI,GAAG;AAAA,QAClE,gBAAAE,EAAC,OAAA,EAAI,WAAU,kBACZ,UAAA;AAAA,UAAAN,KACC,gBAAAQ,EAAC,QAAG,WAAWD,EAAG,yBAAyBH,EAAO,KAAK,GAAI,UAAAJ,EAAA,CAAM;AAAA,UAElEC,KACC,gBAAAO,EAAC,OAAA,EAAI,WAAWD,EAAG,WAAWH,EAAO,SAASJ,KAAS,MAAM,GAC1D,UAAAC,EAAA,CACH;AAAA,QAAA,GAEJ;AAAA,QACCC,KACC,gBAAAI;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,SAASJ;AAAA,YACT,WAAWK;AAAA,cACT;AAAA,cACA;AAAA,YAAA;AAAA,YAGF,UAAA;AAAA,cAAA,gBAAAC,EAACC,KAAU,WAAWF,EAAG,WAAWH,EAAO,IAAI,GAAG;AAAA,cAClD,gBAAAI,EAAC,QAAA,EAAK,WAAU,WAAU,UAAA,UAAA,CAAO;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA;AAAA,MACnC;AAAA,IAAA;AAAA,EAAA;AAIR;"}
+{"version":3,"file":"index7.js","sources":["../src/components/AgentChat/AgentChat.tsx"],"sourcesContent":["import { useState, useRef, useEffect, type ReactNode, type KeyboardEvent } from 'react'\nimport { Transition } from '@headlessui/react'\nimport {\n  ChatBubbleLeftRightIcon,\n  XMarkIcon,\n  PaperAirplaneIcon,\n  SparklesIcon,\n} from '@heroicons/react/24/outline'\nimport { cn } from '@/lib/utils'\n\nexport interface AgentChatMessage {\n  id: string\n  role: 'user' | 'agent'\n  content: string\n  timestamp?: Date\n}\n\nexport interface AgentChatProps {\n  /** Title shown in the chat header */\n  title?: string\n  /** Subtitle / agent description */\n  subtitle?: string\n  /** Chat messages */\n  messages?: AgentChatMessage[]\n  /** Called when user sends a message */\n  onSendMessage?: (message: string) => void\n  /** Whether the agent is currently typing */\n  isTyping?: boolean\n  /** Placeholder text for the input */\n  placeholder?: string\n  /** Custom icon for the floating button */\n  buttonIcon?: ReactNode\n  /** Whether the chat window is open (controlled mode) */\n  open?: boolean\n  /** Callback when open state changes */\n  onOpenChange?: (open: boolean) => void\n  /** Position of the chat bubble */\n  position?: 'bottom-right' | 'bottom-left'\n  /** Additional class for the container */\n  className?: string\n}\n\nexport function AgentChat({\n  title = 'AI Assistant',\n  subtitle = 'Ask me anything',\n  messages = [],\n  onSendMessage,\n  isTyping = false,\n  placeholder = 'Type a message...',\n  buttonIcon,\n  open: controlledOpen,\n  onOpenChange,\n  position = 'bottom-right',\n  className,\n}: AgentChatProps) {\n  const [internalOpen, setInternalOpen] = useState(false)\n  const [inputValue, setInputValue] = useState('')\n  const messagesEndRef = useRef<HTMLDivElement>(null)\n  const inputRef = useRef<HTMLTextAreaElement>(null)\n\n  const isOpen = controlledOpen ?? internalOpen\n  const setIsOpen = (value: boolean) => {\n    setInternalOpen(value)\n    onOpenChange?.(value)\n  }\n\n  useEffect(() => {\n    messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' })\n  }, [messages, isTyping])\n\n  useEffect(() => {\n    if (isOpen) {\n      setTimeout(() => inputRef.current?.focus(), 300)\n    }\n  }, [isOpen])\n\n  const handleSend = () => {\n    const trimmed = inputValue.trim()\n    if (!trimmed) return\n    onSendMessage?.(trimmed)\n    setInputValue('')\n  }\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLTextAreaElement>) => {\n    if (e.key === 'Enter' && !e.shiftKey) {\n      e.preventDefault()\n      handleSend()\n    }\n  }\n\n  const positionClasses = position === 'bottom-right'\n    ? 'right-5 bottom-5'\n    : 'left-5 bottom-5'\n\n  const windowOrigin = position === 'bottom-right'\n    ? 'origin-bottom-right'\n    : 'origin-bottom-left'\n\n  return (\n    <div className={cn('fixed z-50', positionClasses, className)}>\n      {/* Chat Window */}\n      <Transition\n        show={isOpen}\n        enter=\"transition ease-out duration-200\"\n        enterFrom={`opacity-0 scale-95 ${windowOrigin}`}\n        enterTo={`opacity-100 scale-100 ${windowOrigin}`}\n        leave=\"transition ease-in duration-150\"\n        leaveFrom={`opacity-100 scale-100 ${windowOrigin}`}\n        leaveTo={`opacity-0 scale-95 ${windowOrigin}`}\n      >\n        <div\n          className={cn(\n            'absolute bottom-16 w-[360px] rounded-2xl shadow-2xl',\n            'border border-slate-200 bg-white',\n            'flex flex-col overflow-hidden',\n            position === 'bottom-right' ? 'right-0' : 'left-0'\n          )}\n          style={{ height: '480px' }}\n        >\n          {/* Header */}\n          <div className=\"bg-primary-600 px-5 py-4 flex items-center justify-between flex-shrink-0\">\n            <div className=\"flex items-center gap-3\">\n              <div className=\"w-8 h-8 rounded-lg bg-white/20 flex items-center justify-center\">\n                <SparklesIcon className=\"w-4.5 h-4.5 text-white\" />\n              </div>\n              <div>\n                <h3 className=\"text-sm font-semibold text-white leading-tight\">{title}</h3>\n                <p className=\"text-xs text-white/70\">{subtitle}</p>\n              </div>\n            </div>\n            <button\n              type=\"button\"\n              onClick={() => setIsOpen(false)}\n              className=\"p-1 rounded-lg text-white/70 hover:text-white hover:bg-white/10 transition-colors\"\n            >\n              <XMarkIcon className=\"w-5 h-5\" />\n            </button>\n          </div>\n\n          {/* Messages */}\n          <div className=\"flex-1 overflow-y-auto px-4 py-4 space-y-3\">\n            {messages.length === 0 && (\n              <div className=\"flex flex-col items-center justify-center h-full text-center px-6\">\n                <div className=\"w-12 h-12 rounded-2xl bg-primary-50 flex items-center justify-center mb-3\">\n                  <SparklesIcon className=\"w-6 h-6 text-primary-500\" />\n                </div>\n                <p className=\"text-sm font-medium text-slate-700\">How can I help?</p>\n                <p className=\"text-xs text-slate-400 mt-1\">Send a message to get started</p>\n              </div>\n            )}\n            {messages.map((msg) => (\n              <div\n                key={msg.id}\n                className={cn(\n                  'flex',\n                  msg.role === 'user' ? 'justify-end' : 'justify-start'\n                )}\n              >\n                <div\n                  className={cn(\n                    'max-w-[80%] rounded-2xl px-3.5 py-2.5 text-sm leading-relaxed',\n                    msg.role === 'user'\n                      ? 'bg-primary-500 text-white rounded-br-md'\n                      : 'bg-slate-100 text-slate-800 rounded-bl-md'\n                  )}\n                >\n                  {msg.content}\n                </div>\n              </div>\n            ))}\n            {isTyping && (\n              <div className=\"flex justify-start\">\n                <div className=\"bg-slate-100 rounded-2xl rounded-bl-md px-4 py-3\">\n                  <div className=\"flex gap-1\">\n                    <span className=\"w-1.5 h-1.5 bg-slate-400 rounded-full animate-bounce\" style={{ animationDelay: '0ms' }} />\n                    <span className=\"w-1.5 h-1.5 bg-slate-400 rounded-full animate-bounce\" style={{ animationDelay: '150ms' }} />\n                    <span className=\"w-1.5 h-1.5 bg-slate-400 rounded-full animate-bounce\" style={{ animationDelay: '300ms' }} />\n                  </div>\n                </div>\n              </div>\n            )}\n            <div ref={messagesEndRef} />\n          </div>\n\n          {/* Input */}\n          <div className=\"border-t border-slate-100 px-3 py-3 flex-shrink-0\">\n            <div className=\"flex items-end gap-2\">\n              <textarea\n                ref={inputRef}\n                value={inputValue}\n                onChange={(e) => setInputValue(e.target.value)}\n                onKeyDown={handleKeyDown}\n                placeholder={placeholder}\n                rows={1}\n                className={cn(\n                  'flex-1 resize-none rounded-xl border border-slate-200 px-3.5 py-2.5',\n                  'text-sm text-slate-800 placeholder:text-slate-400',\n                  'focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent',\n                  'max-h-24'\n                )}\n              />\n              <button\n                type=\"button\"\n                onClick={handleSend}\n                disabled={!inputValue.trim()}\n                className={cn(\n                  'p-2.5 rounded-xl transition-all duration-150',\n                  'focus:outline-none focus:ring-2 focus:ring-primary-500',\n                  inputValue.trim()\n                    ? 'bg-primary-500 text-white hover:bg-primary-600 shadow-sm'\n                    : 'bg-slate-100 text-slate-300 cursor-not-allowed'\n                )}\n              >\n                <PaperAirplaneIcon className=\"w-4 h-4\" />\n              </button>\n            </div>\n          </div>\n        </div>\n      </Transition>\n\n      {/* Floating Button */}\n      <button\n        type=\"button\"\n        onClick={() => setIsOpen(!isOpen)}\n        className={cn(\n          'w-14 h-14 rounded-full shadow-lg',\n          'bg-primary-500 hover:bg-primary-600 active:bg-primary-700',\n          'text-white flex items-center justify-center',\n          'transition-all duration-200 hover:scale-105 hover:shadow-xl',\n          'focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2'\n        )}\n      >\n        {isOpen ? (\n          <XMarkIcon className=\"w-6 h-6\" />\n        ) : (\n          buttonIcon || <ChatBubbleLeftRightIcon className=\"w-6 h-6\" />\n        )}\n      </button>\n    </div>\n  )\n}\n"],"names":["AgentChat","title","subtitle","messages","onSendMessage","isTyping","placeholder","buttonIcon","controlledOpen","onOpenChange","position","className","internalOpen","setInternalOpen","useState","inputValue","setInputValue","messagesEndRef","useRef","inputRef","isOpen","setIsOpen","value","useEffect","_a","handleSend","trimmed","handleKeyDown","e","positionClasses","windowOrigin","cn","jsx","Transition","jsxs","SparklesIcon","XMarkIcon","msg","PaperAirplaneIcon","ChatBubbleLeftRightIcon"],"mappings":"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"}