@anymux/ui-kit 0.1.0 → 0.2.0

package/dist/{contacts-DQXTZzHc.js → contacts-By9Wg3kn.js}

@@ -139,7 +139,7 @@ const ContactAvatar = ({ firstName, lastName, avatar, size = "md", className = "
 //#region src/contacts/ContactCard.tsx
 const ContactCard = ({ contact, selected = false, onClick, className = "" }) => /* @__PURE__ */ jsxs("button", {
 	onClick,
-	className: `flex items-center gap-3 px-4 py-3 w-full text-left transition-colors ${selected ? "bg-blue-50 border-l-2 border-blue-500" : "hover:bg-gray-50 border-l-2 border-transparent"} ${className}`,
+	className: `flex items-center gap-3 px-4 py-3 w-full text-left transition-colors ${selected ? "bg-primary/10 border-l-2 border-primary" : "hover:bg-muted/50 border-l-2 border-transparent"} ${className}`,
 	children: [
 		/* @__PURE__ */ jsx(ContactAvatar, {
 			firstName: contact.firstName,
@@ -149,7 +149,7 @@ const ContactCard = ({ contact, selected = false, onClick, className = "" }) =>
 		/* @__PURE__ */ jsxs("div", {
 			className: "flex-1 min-w-0",
 			children: [/* @__PURE__ */ jsxs("p", {
-				className: "text-sm font-medium text-gray-900 truncate",
+				className: "text-sm font-medium text-foreground truncate",
 				title: `${contact.firstName} ${contact.lastName}`,
 				children: [
 					contact.firstName,
@@ -157,13 +157,13 @@ const ContactCard = ({ contact, selected = false, onClick, className = "" }) =>
 					contact.lastName
 				]
 			}), contact.company && /* @__PURE__ */ jsxs("p", {
-				className: "text-xs text-gray-500 flex items-center gap-1 truncate",
+				className: "text-xs text-muted-foreground flex items-center gap-1 truncate",
 				title: contact.company,
 				children: [/* @__PURE__ */ jsx(Building, { size: 12 }), contact.company]
 			})]
 		}),
 		/* @__PURE__ */ jsxs("div", {
-			className: "flex items-center gap-1.5 text-gray-400",
+			className: "flex items-center gap-1.5 text-muted-foreground",
 			children: [contact.email && /* @__PURE__ */ jsx(Mail, { size: 14 }), contact.phone && /* @__PURE__ */ jsx(Phone, { size: 14 })]
 		})
 	]
@@ -174,9 +174,9 @@ const ContactCard = ({ contact, selected = false, onClick, className = "" }) =>
 const ContactList = observer(({ model, className = "" }) => /* @__PURE__ */ jsxs("div", {
 	className: `overflow-y-auto ${className}`,
 	children: [Array.from(model.groupedByLetter.entries()).map(([letter, contacts]) => /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("div", {
-		className: "sticky top-0 bg-gray-50/90 backdrop-blur-sm px-4 py-1 border-b border-gray-100",
+		className: "sticky top-0 bg-muted/50 backdrop-blur-sm px-4 py-1 border-b border-border",
 		children: /* @__PURE__ */ jsx("span", {
-			className: "text-xs font-semibold text-gray-500",
+			className: "text-xs font-semibold text-muted-foreground",
 			children: letter
 		})
 	}), contacts.map((contact) => /* @__PURE__ */ jsx(ContactCard, {
@@ -184,7 +184,7 @@ const ContactList = observer(({ model, className = "" }) => /* @__PURE__ */ jsxs
 		selected: model.selectedContact?.id === contact.id,
 		onClick: () => model.selectContact(contact)
 	}, contact.id))] }, letter)), model.filteredContacts.length === 0 && /* @__PURE__ */ jsx("div", {
-		className: "flex items-center justify-center h-32 text-gray-400 text-sm",
+		className: "flex items-center justify-center h-32 text-muted-foreground text-sm",
 		children: "No contacts found"
 	})]
 }));
@@ -195,19 +195,19 @@ const DetailRow = ({ icon: Icon, label, value }) => /* @__PURE__ */ jsxs("div",
 	className: "flex items-start gap-3 py-2",
 	children: [/* @__PURE__ */ jsx(Icon, {
 		size: 16,
-		className: "text-gray-400 mt-0.5 flex-shrink-0"
+		className: "text-muted-foreground mt-0.5 flex-shrink-0"
 	}), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", {
-		className: "text-xs text-gray-500",
+		className: "text-xs text-muted-foreground",
 		children: label
 	}), /* @__PURE__ */ jsx("p", {
-		className: "text-sm text-gray-900",
+		className: "text-sm text-foreground",
 		children: value
 	})] })]
 });
 const ContactDetail = observer(({ model, className = "" }) => {
 	const contact = model.selectedContact;
 	if (!contact) return /* @__PURE__ */ jsx("div", {
-		className: `flex items-center justify-center h-full text-gray-400 text-sm ${className}`,
+		className: `flex items-center justify-center h-full text-muted-foreground text-sm ${className}`,
 		children: "Select a contact to view details"
 	});
 	return /* @__PURE__ */ jsxs("div", {
@@ -222,7 +222,7 @@ const ContactDetail = observer(({ model, className = "" }) => {
 					size: "lg"
 				}),
 				/* @__PURE__ */ jsxs("h2", {
-					className: "mt-3 text-lg font-semibold text-gray-900",
+					className: "mt-3 text-lg font-semibold text-foreground",
 					children: [
 						contact.firstName,
 						" ",
@@ -230,12 +230,12 @@ const ContactDetail = observer(({ model, className = "" }) => {
 					]
 				}),
 				contact.company && /* @__PURE__ */ jsx("p", {
-					className: "text-sm text-gray-500",
+					className: "text-sm text-muted-foreground",
 					children: contact.company
 				})
 			]
 		}), /* @__PURE__ */ jsxs("div", {
-			className: "divide-y divide-gray-100",
+			className: "divide-y divide-border",
 			children: [
 				contact.email && /* @__PURE__ */ jsx(DetailRow, {
 					icon: Mail,
@@ -266,14 +266,14 @@ const ContactDetail = observer(({ model, className = "" }) => {
 					className: "flex items-start gap-3 py-2",
 					children: [/* @__PURE__ */ jsx(Tag, {
 						size: 16,
-						className: "text-gray-400 mt-0.5 flex-shrink-0"
+						className: "text-muted-foreground mt-0.5 flex-shrink-0"
 					}), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", {
-						className: "text-xs text-gray-500",
+						className: "text-xs text-muted-foreground",
 						children: "Groups"
 					}), /* @__PURE__ */ jsx("div", {
 						className: "flex flex-wrap gap-1 mt-1",
 						children: contact.groups.map((g) => /* @__PURE__ */ jsx("span", {
-							className: "text-xs bg-gray-100 text-gray-600 px-2 py-0.5 rounded-full",
+							className: "text-xs bg-muted text-muted-foreground px-2 py-0.5 rounded-full",
 							children: g
 						}, g))
 					})] })]
@@ -286,29 +286,29 @@ const ContactDetail = observer(({ model, className = "" }) => {
 //#endregion
 //#region src/contacts/ContactGroupSidebar.tsx
 const ContactGroupSidebar = observer(({ model, className = "" }) => /* @__PURE__ */ jsx("div", {
-	className: `w-56 border-r border-gray-200 bg-gray-50 overflow-y-auto ${className}`,
+	className: `w-56 border-r border-border bg-muted/30 overflow-y-auto ${className}`,
 	children: /* @__PURE__ */ jsxs("div", {
 		className: "p-3",
 		children: [
 			/* @__PURE__ */ jsx("h3", {
-				className: "text-xs font-semibold text-gray-500 uppercase tracking-wider mb-2",
+				className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-2",
 				children: "Groups"
 			}),
 			/* @__PURE__ */ jsxs("button", {
 				onClick: () => model.setGroup(null),
-				className: `flex items-center gap-2 w-full px-3 py-2 rounded-lg text-sm transition-colors ${model.currentGroup === null ? "bg-blue-100 text-blue-700" : "text-gray-700 hover:bg-gray-100"}`,
+				className: `flex items-center gap-2 w-full px-3 py-2 rounded-lg text-sm transition-colors ${model.currentGroup === null ? "bg-primary/10 text-primary" : "text-foreground hover:bg-muted"}`,
 				children: [
 					/* @__PURE__ */ jsx(Users, { size: 16 }),
 					/* @__PURE__ */ jsx("span", { children: "All Contacts" }),
 					/* @__PURE__ */ jsx("span", {
-						className: "ml-auto text-xs text-gray-400",
+						className: "ml-auto text-xs text-muted-foreground",
 						children: model.contacts.length
 					})
 				]
 			}),
 			model.groups.map((group) => /* @__PURE__ */ jsxs("button", {
 				onClick: () => model.setGroup(group.id),
-				className: `flex items-center gap-2 w-full px-3 py-2 rounded-lg text-sm transition-colors ${model.currentGroup === group.id ? "bg-blue-100 text-blue-700" : "text-gray-700 hover:bg-gray-100"}`,
+				className: `flex items-center gap-2 w-full px-3 py-2 rounded-lg text-sm transition-colors ${model.currentGroup === group.id ? "bg-primary/10 text-primary" : "text-foreground hover:bg-muted"}`,
 				children: [
 					/* @__PURE__ */ jsx(User, { size: 16 }),
 					/* @__PURE__ */ jsx("span", {
@@ -317,7 +317,7 @@ const ContactGroupSidebar = observer(({ model, className = "" }) => /* @__PURE__
 						children: group.name
 					}),
 					/* @__PURE__ */ jsx("span", {
-						className: "ml-auto text-xs text-gray-400",
+						className: "ml-auto text-xs text-muted-foreground",
 						children: group.count
 					})
 				]
@@ -333,32 +333,34 @@ const ContactBrowser = observer(({ model, className = "", showSidebar = true })
 		model.loadContacts();
 	}, [model]);
 	return /* @__PURE__ */ jsxs("div", {
-		className: `flex h-full bg-white rounded-xl border border-gray-200 overflow-hidden ${className}`,
+		className: `flex h-full bg-background rounded-xl border border-border overflow-hidden ${className}`,
 		children: [
-			showSidebar && /* @__PURE__ */ jsx(ContactGroupSidebar, { model }),
+			showSidebar && /* @__PURE__ */ jsx(ContactGroupSidebar, {
+				model,
+				className: "hidden lg:block"
+			}),
 			/* @__PURE__ */ jsxs("div", {
-				className: "flex-1 flex flex-col min-w-0 border-r border-gray-200",
-				style: { maxWidth: "380px" },
+				className: "flex-1 flex flex-col min-w-0 border-r border-border sm:max-w-[380px]",
 				children: [/* @__PURE__ */ jsx("div", {
-					className: "px-4 py-2 border-b border-gray-200",
+					className: "px-3 py-2 border-b border-border",
 					children: /* @__PURE__ */ jsxs("div", {
 						className: "relative",
 						children: [/* @__PURE__ */ jsx(Search, {
 							size: 16,
-							className: "absolute left-3 top-1/2 -translate-y-1/2 text-gray-400"
+							className: "absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground"
 						}), /* @__PURE__ */ jsx("input", {
 							type: "text",
 							placeholder: "Search contacts...",
 							value: model.searchQuery,
 							onChange: (e) => model.setSearch(e.target.value),
-							className: "w-full pl-9 pr-3 py-1.5 text-sm border border-gray-200 rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
+							className: "w-full pl-9 pr-3 py-1.5 text-sm border border-border rounded-lg bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-ring"
 						})]
 					})
 				}), model.loading ? /* @__PURE__ */ jsx("div", {
 					className: "flex items-center justify-center h-64",
 					children: /* @__PURE__ */ jsx(Loader2, {
 						size: 24,
-						className: "animate-spin text-gray-400"
+						className: "animate-spin text-muted-foreground"
 					})
 				}) : model.error ? /* @__PURE__ */ jsx(BrowserError, {
 					error: model.error,
@@ -371,7 +373,7 @@ const ContactBrowser = observer(({ model, className = "", showSidebar = true })
 			}),
 			/* @__PURE__ */ jsx(ContactDetail, {
 				model,
-				className: "flex-1"
+				className: "flex-1 hidden sm:block"
 			})
 		]
 	});
@@ -536,4 +538,4 @@ var MockContactProvider = class {
 
 //#endregion
 export { ContactAvatar, ContactBrowser, ContactCard, ContactDetail, ContactGroupSidebar, ContactList, ContactListModel, MockContactProvider };
-//# sourceMappingURL=contacts-DQXTZzHc.js.map
+//# sourceMappingURL=contacts-By9Wg3kn.js.map

package/dist/contacts-By9Wg3kn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"contacts-By9Wg3kn.js","names":["provider: IContactProvider","err: any","contact: ContactItem | null","groupId: string | null","query: string","sortBy: ContactSortBy","contact: Omit<ContactItem, 'id' | 'createdAt' | 'updatedAt'>","id: string","contacts: ContactItem[]","GROUPS_DATA: ContactGroup[]","contacts: ContactItem[]","id: string","item: Omit<ContactItem, 'id' | 'createdAt' | 'updatedAt'>","created: ContactItem","updates: Partial<ContactItem>","query: string","groupId: string","name: string"],"sources":["../src/contacts/ContactListModel.ts","../src/contacts/ContactAvatar.tsx","../src/contacts/ContactCard.tsx","../src/contacts/ContactList.tsx","../src/contacts/ContactDetail.tsx","../src/contacts/ContactGroupSidebar.tsx","../src/contacts/ContactBrowser.tsx","../src/contacts/MockContactProvider.ts"],"sourcesContent":["import { makeAutoObservable, runInAction } from 'mobx';\nimport type { IContactProvider, ContactItem, ContactGroup } from './types';\n\nexport type ContactSortBy = 'firstName' | 'lastName' | 'company';\n\nexport class ContactListModel {\n  contacts: ContactItem[] = [];\n  selectedContact: ContactItem | null = null;\n  groups: ContactGroup[] = [];\n  currentGroup: string | null = null;\n  searchQuery = '';\n  sortBy: ContactSortBy = 'lastName';\n  loading = false;\n  error: string | null = null;\n\n  constructor(private provider: IContactProvider) {\n    makeAutoObservable(this);\n  }\n\n  get filteredContacts(): ContactItem[] {\n    let result = this.contacts;\n    if (this.searchQuery) {\n      const q = this.searchQuery.toLowerCase();\n      result = result.filter(c =>\n        c.firstName.toLowerCase().includes(q) ||\n        c.lastName.toLowerCase().includes(q) ||\n        c.email?.toLowerCase().includes(q) ||\n        c.company?.toLowerCase().includes(q)\n      );\n    }\n    return this.sortContacts(result);\n  }\n\n  get groupedByLetter(): Map<string, ContactItem[]> {\n    const groups = new Map<string, ContactItem[]>();\n    for (const contact of this.filteredContacts) {\n      const letter = (this.sortBy === 'firstName' ? contact.firstName : contact.lastName)\n        .charAt(0).toUpperCase();\n      const group = groups.get(letter) ?? [];\n      group.push(contact);\n      groups.set(letter, group);\n    }\n    return groups;\n  }\n\n  get groupedByGroup(): Map<string, ContactItem[]> {\n    const groups = new Map<string, ContactItem[]>();\n    for (const contact of this.filteredContacts) {\n      for (const groupName of contact.groups ?? ['Ungrouped']) {\n        const group = groups.get(groupName) ?? [];\n        group.push(contact);\n        groups.set(groupName, group);\n      }\n    }\n    return groups;\n  }\n\n  async loadContacts() {\n    this.loading = true;\n    this.error = null;\n    try {\n      const [contacts, groups] = await Promise.all([\n        this.currentGroup\n          ? this.provider.getByGroup(this.currentGroup)\n          : this.provider.listItems(),\n        this.provider.getGroups()\n      ]);\n      runInAction(() => {\n        this.contacts = contacts;\n        this.groups = groups;\n      });\n    } catch (err: any) {\n      runInAction(() => { this.error = err?.message || 'Failed to load contacts'; });\n    } finally {\n      runInAction(() => { this.loading = false; });\n    }\n  }\n\n  selectContact(contact: ContactItem | null) {\n    this.selectedContact = contact;\n  }\n\n  setGroup(groupId: string | null) {\n    this.currentGroup = groupId;\n    this.loadContacts();\n  }\n\n  setSearch(query: string) {\n    this.searchQuery = query;\n  }\n\n  setSort(sortBy: ContactSortBy) {\n    this.sortBy = sortBy;\n  }\n\n  async addContact(contact: Omit<ContactItem, 'id' | 'createdAt' | 'updatedAt'>) {\n    const created = await this.provider.createItem(contact);\n    runInAction(() => { this.contacts.push(created); });\n    return created;\n  }\n\n  async deleteContact(id: string) {\n    await this.provider.deleteItem(id);\n    runInAction(() => {\n      this.contacts = this.contacts.filter(c => c.id !== id);\n      if (this.selectedContact?.id === id) this.selectedContact = null;\n    });\n  }\n\n  private sortContacts(contacts: ContactItem[]): ContactItem[] {\n    return [...contacts].sort((a, b) => {\n      switch (this.sortBy) {\n        case 'firstName': return a.firstName.localeCompare(b.firstName);\n        case 'lastName': return a.lastName.localeCompare(b.lastName);\n        case 'company': return (a.company ?? '').localeCompare(b.company ?? '');\n        default: return 0;\n      }\n    });\n  }\n}\n","import React from 'react';\n\nexport interface ContactAvatarProps {\n  firstName: string;\n  lastName: string;\n  avatar?: string;\n  size?: 'sm' | 'md' | 'lg';\n  className?: string;\n}\n\nconst sizeClasses = {\n  sm: 'w-8 h-8 text-xs',\n  md: 'w-10 h-10 text-sm',\n  lg: 'w-16 h-16 text-xl',\n};\n\nconst bgColors = [\n  'bg-blue-500', 'bg-green-500', 'bg-purple-500', 'bg-pink-500',\n  'bg-indigo-500', 'bg-teal-500', 'bg-orange-500', 'bg-red-500',\n];\n\nexport const ContactAvatar = ({ firstName, lastName, avatar, size = 'md', className = '' }: ContactAvatarProps) => {\n  const initials = `${firstName.charAt(0)}${lastName.charAt(0)}`.toUpperCase();\n  const colorIdx = (firstName.charCodeAt(0) + lastName.charCodeAt(0)) % bgColors.length;\n\n  if (avatar) {\n    return <img src={avatar} alt={`${firstName} ${lastName}`} className={`${sizeClasses[size]} rounded-full object-cover ${className}`} />;\n  }\n\n  return (\n    <div className={`${sizeClasses[size]} ${bgColors[colorIdx]} rounded-full flex items-center justify-center text-white font-medium ${className}`}>\n      {initials}\n    </div>\n  );\n};\n","import React from 'react';\nimport { Mail, Phone, Building } from 'lucide-react';\nimport type { ContactItem } from './types';\nimport { ContactAvatar } from './ContactAvatar';\n\nexport interface ContactCardProps {\n  contact: ContactItem;\n  selected?: boolean;\n  onClick?: () => void;\n  className?: string;\n}\n\nexport const ContactCard = ({ contact, selected = false, onClick, className = '' }: ContactCardProps) => (\n  <button\n    onClick={onClick}\n    className={`flex items-center gap-3 px-4 py-3 w-full text-left transition-colors ${\n      selected ? 'bg-primary/10 border-l-2 border-primary' : 'hover:bg-muted/50 border-l-2 border-transparent'\n    } ${className}`}\n  >\n    <ContactAvatar firstName={contact.firstName} lastName={contact.lastName} avatar={contact.avatar} />\n    <div className=\"flex-1 min-w-0\">\n      <p className=\"text-sm font-medium text-foreground truncate\" title={`${contact.firstName} ${contact.lastName}`}>\n        {contact.firstName} {contact.lastName}\n      </p>\n      {contact.company && (\n        <p className=\"text-xs text-muted-foreground flex items-center gap-1 truncate\" title={contact.company}>\n          <Building size={12} />\n          {contact.company}\n        </p>\n      )}\n    </div>\n    <div className=\"flex items-center gap-1.5 text-muted-foreground\">\n      {contact.email && <Mail size={14} />}\n      {contact.phone && <Phone size={14} />}\n    </div>\n  </button>\n);\n","import React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport type { ContactListModel } from './ContactListModel';\nimport { ContactCard } from './ContactCard';\n\nexport interface ContactListProps {\n  model: ContactListModel;\n  className?: string;\n}\n\nexport const ContactList = observer<ContactListProps>(({ model, className = '' }) => (\n  <div className={`overflow-y-auto ${className}`}>\n    {Array.from(model.groupedByLetter.entries()).map(([letter, contacts]) => (\n      <div key={letter}>\n        <div className=\"sticky top-0 bg-muted/50 backdrop-blur-sm px-4 py-1 border-b border-border\">\n          <span className=\"text-xs font-semibold text-muted-foreground\">{letter}</span>\n        </div>\n        {contacts.map(contact => (\n          <ContactCard\n            key={contact.id}\n            contact={contact}\n            selected={model.selectedContact?.id === contact.id}\n            onClick={() => model.selectContact(contact)}\n          />\n        ))}\n      </div>\n    ))}\n    {model.filteredContacts.length === 0 && (\n      <div className=\"flex items-center justify-center h-32 text-muted-foreground text-sm\">No contacts found</div>\n    )}\n  </div>\n));\n","import React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { Mail, Phone, MapPin, Building, Calendar, Tag } from 'lucide-react';\nimport type { ContactListModel } from './ContactListModel';\nimport { ContactAvatar } from './ContactAvatar';\n\nexport interface ContactDetailProps {\n  model: ContactListModel;\n  className?: string;\n}\n\nconst DetailRow = ({ icon: Icon, label, value }: { icon: React.ElementType; label: string; value: string }) => (\n  <div className=\"flex items-start gap-3 py-2\">\n    <Icon size={16} className=\"text-muted-foreground mt-0.5 flex-shrink-0\" />\n    <div>\n      <p className=\"text-xs text-muted-foreground\">{label}</p>\n      <p className=\"text-sm text-foreground\">{value}</p>\n    </div>\n  </div>\n);\n\nexport const ContactDetail = observer<ContactDetailProps>(({ model, className = '' }) => {\n  const contact = model.selectedContact;\n\n  if (!contact) {\n    return (\n      <div className={`flex items-center justify-center h-full text-muted-foreground text-sm ${className}`}>\n        Select a contact to view details\n      </div>\n    );\n  }\n\n  return (\n    <div className={`p-6 overflow-y-auto ${className}`}>\n      <div className=\"flex flex-col items-center mb-6\">\n        <ContactAvatar firstName={contact.firstName} lastName={contact.lastName} avatar={contact.avatar} size=\"lg\" />\n        <h2 className=\"mt-3 text-lg font-semibold text-foreground\">{contact.firstName} {contact.lastName}</h2>\n        {contact.company && <p className=\"text-sm text-muted-foreground\">{contact.company}</p>}\n      </div>\n\n      <div className=\"divide-y divide-border\">\n        {contact.email && <DetailRow icon={Mail} label=\"Email\" value={contact.email} />}\n        {contact.phone && <DetailRow icon={Phone} label=\"Phone\" value={contact.phone} />}\n        {contact.company && <DetailRow icon={Building} label=\"Company\" value={contact.company} />}\n        {contact.address && <DetailRow icon={MapPin} label=\"Address\" value={contact.address} />}\n        {contact.birthday && <DetailRow icon={Calendar} label=\"Birthday\" value={contact.birthday.toLocaleDateString()} />}\n        {contact.groups && contact.groups.length > 0 && (\n          <div className=\"flex items-start gap-3 py-2\">\n            <Tag size={16} className=\"text-muted-foreground mt-0.5 flex-shrink-0\" />\n            <div>\n              <p className=\"text-xs text-muted-foreground\">Groups</p>\n              <div className=\"flex flex-wrap gap-1 mt-1\">\n                {contact.groups.map(g => (\n                  <span key={g} className=\"text-xs bg-muted text-muted-foreground px-2 py-0.5 rounded-full\">{g}</span>\n                ))}\n              </div>\n            </div>\n          </div>\n        )}\n      </div>\n    </div>\n  );\n});\n","import React from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { Users, User } from 'lucide-react';\nimport type { ContactListModel } from './ContactListModel';\n\nexport interface ContactGroupSidebarProps {\n  model: ContactListModel;\n  className?: string;\n}\n\nexport const ContactGroupSidebar = observer<ContactGroupSidebarProps>(({ model, className = '' }) => (\n  <div className={`w-56 border-r border-border bg-muted/30 overflow-y-auto ${className}`}>\n    <div className=\"p-3\">\n      <h3 className=\"text-xs font-semibold text-muted-foreground uppercase tracking-wider mb-2\">Groups</h3>\n      <button\n        onClick={() => model.setGroup(null)}\n        className={`flex items-center gap-2 w-full px-3 py-2 rounded-lg text-sm transition-colors ${\n          model.currentGroup === null ? 'bg-primary/10 text-primary' : 'text-foreground hover:bg-muted'\n        }`}\n      >\n        <Users size={16} />\n        <span>All Contacts</span>\n        <span className=\"ml-auto text-xs text-muted-foreground\">{model.contacts.length}</span>\n      </button>\n      {model.groups.map(group => (\n        <button\n          key={group.id}\n          onClick={() => model.setGroup(group.id)}\n          className={`flex items-center gap-2 w-full px-3 py-2 rounded-lg text-sm transition-colors ${\n            model.currentGroup === group.id ? 'bg-primary/10 text-primary' : 'text-foreground hover:bg-muted'\n          }`}\n        >\n          <User size={16} />\n          <span className=\"truncate\" title={group.name}>{group.name}</span>\n          <span className=\"ml-auto text-xs text-muted-foreground\">{group.count}</span>\n        </button>\n      ))}\n    </div>\n  </div>\n));\n","import React, { useEffect } from 'react';\nimport { observer } from 'mobx-react-lite';\nimport { Search, Loader2 } from 'lucide-react';\nimport { BrowserError } from '@anymux/ui/components/browser-error';\nimport type { ContactListModel } from './ContactListModel';\nimport { ContactList } from './ContactList';\nimport { ContactDetail } from './ContactDetail';\nimport { ContactGroupSidebar } from './ContactGroupSidebar';\n\nexport interface ContactBrowserProps {\n  model: ContactListModel;\n  className?: string;\n  showSidebar?: boolean;\n}\n\nexport const ContactBrowser = observer<ContactBrowserProps>(({ model, className = '', showSidebar = true }) => {\n  useEffect(() => { model.loadContacts(); }, [model]);\n\n  return (\n    <div className={`flex h-full bg-background rounded-xl border border-border overflow-hidden ${className}`}>\n      {showSidebar && <ContactGroupSidebar model={model} className=\"hidden lg:block\" />}\n\n      <div className=\"flex-1 flex flex-col min-w-0 border-r border-border sm:max-w-[380px]\">\n        {/* Search */}\n        <div className=\"px-3 py-2 border-b border-border\">\n          <div className=\"relative\">\n            <Search size={16} className=\"absolute left-3 top-1/2 -translate-y-1/2 text-muted-foreground\" />\n            <input\n              type=\"text\"\n              placeholder=\"Search contacts...\"\n              value={model.searchQuery}\n              onChange={e => model.setSearch(e.target.value)}\n              className=\"w-full pl-9 pr-3 py-1.5 text-sm border border-border rounded-lg bg-background text-foreground focus:outline-none focus:ring-2 focus:ring-ring\"\n            />\n          </div>\n        </div>\n\n        {model.loading ? (\n          <div className=\"flex items-center justify-center h-64\">\n            <Loader2 size={24} className=\"animate-spin text-muted-foreground\" />\n          </div>\n        ) : model.error ? (\n          <BrowserError\n            error={model.error}\n            context=\"Contacts\"\n            onRetry={() => model.loadContacts()}\n          />\n        ) : (\n          <ContactList model={model} className=\"flex-1\" />\n        )}\n      </div>\n\n      <ContactDetail model={model} className=\"flex-1 hidden sm:block\" />\n    </div>\n  );\n});\n","import type { IContactProvider, ContactItem, ContactGroup } from './types';\n\nconst FIRST_NAMES = ['Alice', 'Bob', 'Charlie', 'Diana', 'Emma', 'Frank', 'Grace', 'Henry', 'Iris', 'Jack', 'Karen', 'Leo', 'Mia', 'Nathan', 'Olivia', 'Paul', 'Quinn', 'Rachel', 'Sam', 'Tina', 'Uma', 'Victor', 'Wendy', 'Xavier', 'Yara', 'Zach'];\nconst LAST_NAMES = ['Anderson', 'Baker', 'Chen', 'Davis', 'Evans', 'Fisher', 'Garcia', 'Hall', 'Ibrahim', 'Jones', 'Kim', 'Lee', 'Martinez', 'Nguyen', 'O\\'Brien', 'Park', 'Quinn', 'Robinson', 'Smith', 'Taylor', 'Ueda', 'Vega', 'Wilson', 'Xu', 'Yang', 'Zhang'];\nconst COMPANIES = ['Acme Corp', 'TechStart Inc', 'Global Systems', 'DataFlow', 'CloudNine', 'PixelPerfect'];\nconst GROUPS_DATA: ContactGroup[] = [\n  { id: 'family', name: 'Family', count: 8 },\n  { id: 'work', name: 'Work', count: 12 },\n  { id: 'friends', name: 'Friends', count: 10 },\n  { id: 'vip', name: 'VIP', count: 5 },\n];\n\nfunction generateContacts(): ContactItem[] {\n  const contacts: ContactItem[] = [];\n  const now = new Date();\n  for (let i = 0; i < FIRST_NAMES.length; i++) {\n    contacts.push({\n      id: `contact-${i}`,\n      type: 'contact',\n      title: `${FIRST_NAMES[i]} ${LAST_NAMES[i]}`,\n      firstName: FIRST_NAMES[i],\n      lastName: LAST_NAMES[i],\n      email: `${FIRST_NAMES[i].toLowerCase()}.${LAST_NAMES[i].toLowerCase()}@example.com`,\n      phone: `+1 (555) ${String(100 + i).padStart(3, '0')}-${String(1000 + i * 37).slice(0, 4)}`,\n      company: COMPANIES[i % COMPANIES.length],\n      address: `${100 + i} Main St, City ${i % 10}, ST ${10000 + i}`,\n      birthday: new Date(1985 + (i % 20), i % 12, 1 + (i % 28)),\n      groups: [GROUPS_DATA[i % GROUPS_DATA.length].id],\n      createdAt: now,\n      updatedAt: now,\n    });\n  }\n  return contacts;\n}\n\nexport class MockContactProvider implements IContactProvider {\n  private contacts = generateContacts();\n\n  async listItems() { return this.contacts; }\n\n  async getItem(id: string) { return this.contacts.find(c => c.id === id) ?? null; }\n\n  async createItem(item: Omit<ContactItem, 'id' | 'createdAt' | 'updatedAt'>) {\n    const now = new Date();\n    const created: ContactItem = { ...item, id: `contact-${Date.now()}`, createdAt: now, updatedAt: now } as ContactItem;\n    this.contacts.push(created);\n    return created;\n  }\n\n  async updateItem(id: string, updates: Partial<ContactItem>) {\n    const idx = this.contacts.findIndex(c => c.id === id);\n    if (idx === -1) throw new Error('Not found');\n    this.contacts[idx] = { ...this.contacts[idx], ...updates, updatedAt: new Date() };\n    return this.contacts[idx];\n  }\n\n  async deleteItem(id: string) {\n    this.contacts = this.contacts.filter(c => c.id !== id);\n  }\n\n  async search(query: string) {\n    const q = query.toLowerCase();\n    return this.contacts.filter(c =>\n      c.firstName.toLowerCase().includes(q) || c.lastName.toLowerCase().includes(q)\n    );\n  }\n\n  async getGroups() { return GROUPS_DATA; }\n\n  async getByGroup(groupId: string) {\n    return this.contacts.filter(c => c.groups?.includes(groupId));\n  }\n\n  async searchByName(name: string) {\n    return this.search(name);\n  }\n}\n"],"mappings":"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"}

package/dist/contacts.d.ts

@@ -1,3 +1,3 @@
 import "./types-common-CB3kRek8.js";
-import { ContactAvatar$1 as ContactAvatar, ContactAvatarProps, ContactBrowser$1 as ContactBrowser, ContactBrowserProps, ContactCard$1 as ContactCard, ContactCardProps, ContactDetail$1 as ContactDetail, ContactDetailProps, ContactGroup, ContactGroupSidebar$1 as ContactGroupSidebar, ContactGroupSidebarProps, ContactItem, ContactList$1 as ContactList, ContactListModel$1 as ContactListModel, ContactListProps, ContactSortBy, IContactProvider, MockContactProvider$1 as MockContactProvider } from "./index-DmsyeHFr.js";
+import { ContactAvatar$1 as ContactAvatar, ContactAvatarProps, ContactBrowser$1 as ContactBrowser, ContactBrowserProps, ContactCard$1 as ContactCard, ContactCardProps, ContactDetail$1 as ContactDetail, ContactDetailProps, ContactGroup, ContactGroupSidebar$1 as ContactGroupSidebar, ContactGroupSidebarProps, ContactItem, ContactList$1 as ContactList, ContactListModel$1 as ContactListModel, ContactListProps, ContactSortBy, IContactProvider, MockContactProvider$1 as MockContactProvider } from "./index-Pty-N7-g.js";
 export { ContactAvatar, ContactAvatarProps, ContactBrowser, ContactBrowserProps, ContactCard, ContactCardProps, ContactDetail, ContactDetailProps, ContactGroup, ContactGroupSidebar, ContactGroupSidebarProps, ContactItem, ContactList, ContactListModel, ContactListProps, ContactSortBy, IContactProvider, MockContactProvider };

package/dist/contacts.js

@@ -1,3 +1,3 @@
-import { ContactAvatar, ContactBrowser, ContactCard, ContactDetail, ContactGroupSidebar, ContactList, ContactListModel, MockContactProvider } from "./contacts-DQXTZzHc.js";
+import { ContactAvatar, ContactBrowser, ContactCard, ContactDetail, ContactGroupSidebar, ContactList, ContactListModel, MockContactProvider } from "./contacts-By9Wg3kn.js";
 
 export { ContactAvatar, ContactBrowser, ContactCard, ContactDetail, ContactGroupSidebar, ContactList, ContactListModel, MockContactProvider };