@adamosuiteservices/ui 2.9.15 → 2.10.0

package/docs/components/ui/context-menu.md

@@ -107,7 +107,7 @@ import {
 | `disabled`        | `boolean`                    | Desactiva el item          |
 | `className`       | `string`                     | Clases CSS adicionales     |
 
-**Indicador**: CheckIcon automático cuando `checked={true}`, posicionado con `pl-8`
+**Indicador**: Check icon (Material Symbol "check") automático cuando `checked={true}`, posicionado con `pl-8`
 
 ### ContextMenuRadioGroup
 
@@ -124,7 +124,7 @@ import {
 | `disabled`  | `boolean` | Desactiva el item      |
 | `className` | `string`  | Clases CSS adicionales |
 
-**Indicador**: CircleIcon automático cuando seleccionado, posicionado con `pl-8`
+**Indicador**: Circle icon (Material Symbol "circle") automático cuando seleccionado, posicionado con `pl-8`
 
 ### ContextMenuSub
 
@@ -141,7 +141,7 @@ import {
 | `inset`     | `boolean` | Padding izquierdo (`pl-8`) |
 | `className` | `string`  | Clases CSS adicionales     |
 
-**Indicador**: ChevronRightIcon automático con `ml-auto`
+**Indicador**: Chevron right icon (Material Symbol "chevron_right") automático con `ml-auto`
 
 ### ContextMenuLabel
 
@@ -181,24 +181,24 @@ import {
 ### Con Iconos y Shortcuts
 
 ```tsx
-import { UserIcon, SettingsIcon, LogOutIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <ContextMenu>
   <ContextMenuTrigger>Right click</ContextMenuTrigger>
   <ContextMenuContent>
     <ContextMenuItem>
-      <UserIcon />
+      <Icon symbol="person" />
       Profile
       <ContextMenuShortcut>⌘P</ContextMenuShortcut>
     </ContextMenuItem>
     <ContextMenuItem>
-      <SettingsIcon />
+      <Icon symbol="settings" />
       Settings
       <ContextMenuShortcut>⌘S</ContextMenuShortcut>
     </ContextMenuItem>
     <ContextMenuSeparator />
     <ContextMenuItem variant="destructive">
-      <LogOutIcon />
+      <Icon symbol="logout" />
       Log Out
       <ContextMenuShortcut>⌘Q</ContextMenuShortcut>
     </ContextMenuItem>
@@ -206,7 +206,7 @@ import { UserIcon, SettingsIcon, LogOutIcon } from "lucide-react";
 </ContextMenu>;
 ```
 
-**Nota**: SVGs automáticamente `size-4`, `text-muted-foreground` (excepto en variant destructive)
+**Nota**: Material Symbol icons automáticamente `text-lg` (18px), `text-muted-foreground` (excepto en variant destructive). SVG icons soportados con `size-4`.
 
 ### Con Checkboxes
 
@@ -266,7 +266,7 @@ function Settings() {
 ### Con Submenú
 
 ```tsx
-import { MoreHorizontalIcon, DownloadIcon, ShareIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <ContextMenu>
   <ContextMenuTrigger>Right click</ContextMenuTrigger>
@@ -276,16 +276,16 @@ import { MoreHorizontalIcon, DownloadIcon, ShareIcon } from "lucide-react";
     <ContextMenuSeparator />
     <ContextMenuSub>
       <ContextMenuSubTrigger>
-        <MoreHorizontalIcon />
+        <Icon symbol="more_horiz" />
         More Options
       </ContextMenuSubTrigger>
       <ContextMenuSubContent>
         <ContextMenuItem>
-          <DownloadIcon />
+          <Icon symbol="download" />
           Export
         </ContextMenuItem>
         <ContextMenuItem>
-          <ShareIcon />
+          <Icon symbol="share" />
           Share
         </ContextMenuItem>
       </ContextMenuSubContent>
@@ -297,12 +297,12 @@ import { MoreHorizontalIcon, DownloadIcon, ShareIcon } from "lucide-react";
 ### File Manager (Multiple Items)
 
 ```tsx
-import { FileIcon, FolderIcon, TrashIcon, CopyIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <div className="grid grid-cols-3 gap-4">
   <ContextMenu>
     <ContextMenuTrigger className="flex h-24 flex-col items-center justify-center rounded-lg border p-4">
-      <FileIcon className="h-8 w-8 mb-2" />
+      <Icon symbol="description" className="text-2xl mb-2" />
       <span className="text-sm">Document.pdf</span>
     </ContextMenuTrigger>
     <ContextMenuContent>
@@ -310,11 +310,11 @@ import { FileIcon, FolderIcon, TrashIcon, CopyIcon } from "lucide-react";
       <ContextMenuItem>Open with...</ContextMenuItem>
       <ContextMenuSeparator />
       <ContextMenuItem>
-        <CopyIcon />
+        <Icon symbol="content_copy" />
         Copy
       </ContextMenuItem>
       <ContextMenuItem variant="destructive">
-        <TrashIcon />
+        <Icon symbol="delete" />
         Delete
       </ContextMenuItem>
     </ContextMenuContent>
@@ -322,7 +322,7 @@ import { FileIcon, FolderIcon, TrashIcon, CopyIcon } from "lucide-react";
 
   <ContextMenu>
     <ContextMenuTrigger className="flex h-24 flex-col items-center justify-center rounded-lg border p-4">
-      <FolderIcon className="h-8 w-8 mb-2" />
+      <Icon symbol="folder" className="text-2xl mb-2" />
       <span className="text-sm">Projects</span>
     </ContextMenuTrigger>
     <ContextMenuContent>
@@ -330,7 +330,7 @@ import { FileIcon, FolderIcon, TrashIcon, CopyIcon } from "lucide-react";
       <ContextMenuItem>Open in new window</ContextMenuItem>
       <ContextMenuSeparator />
       <ContextMenuItem>
-        <CopyIcon />
+        <Icon symbol="content_copy" />
         Copy
       </ContextMenuItem>
       <ContextMenuItem variant="destructive">
@@ -345,19 +345,19 @@ import { FileIcon, FolderIcon, TrashIcon, CopyIcon } from "lucide-react";
 ### Con Labels y Grupos
 
 ```tsx
-import { FileIcon, FolderIcon, CopyIcon, EditIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <ContextMenu>
   <ContextMenuTrigger>Right click</ContextMenuTrigger>
   <ContextMenuContent className="w-56">
     <ContextMenuLabel>File Operations</ContextMenuLabel>
     <ContextMenuItem>
-      <FileIcon />
+      <Icon symbol="description" />
       New File
       <ContextMenuShortcut>⌘N</ContextMenuShortcut>
     </ContextMenuItem>
     <ContextMenuItem>
-      <FolderIcon />
+      <Icon symbol="folder" />
       New Folder
       <ContextMenuShortcut>⌘⇧N</ContextMenuShortcut>
     </ContextMenuItem>
@@ -366,12 +366,12 @@ import { FileIcon, FolderIcon, CopyIcon, EditIcon } from "lucide-react";
 
     <ContextMenuLabel>Edit</ContextMenuLabel>
     <ContextMenuItem>
-      <CopyIcon />
+      <Icon symbol="content_copy" />
       Copy
       <ContextMenuShortcut>⌘C</ContextMenuShortcut>
     </ContextMenuItem>
     <ContextMenuItem>
-      <EditIcon />
+      <Icon symbol="edit" />
       Paste
       <ContextMenuShortcut>⌘V</ContextMenuShortcut>
     </ContextMenuItem>

package/docs/components/ui/dialog.md

@@ -159,9 +159,9 @@ import {
 ### Formulario de Edición
 
 ```tsx
+import { Icon } from "@adamosuiteservices/ui/icon";
 import { Input } from "@adamosuiteservices/ui/input";
 import { Label } from "@adamosuiteservices/ui/label";
-import { SaveIcon } from "lucide-react";
 
 <Dialog>
   <DialogTrigger asChild>
@@ -190,7 +190,7 @@ import { SaveIcon } from "lucide-react";
     </DialogBody>
     <DialogFooter>
       <Button type="submit">
-        <SaveIcon />
+        <Icon symbol="save" />
         Save changes
       </Button>
     </DialogFooter>
@@ -201,12 +201,12 @@ import { SaveIcon } from "lucide-react";
 ### Compartir Link
 
 ```tsx
-import { ShareIcon, CopyIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <Dialog>
   <DialogTrigger asChild>
     <Button variant="outline">
-      <ShareIcon />
+      <Icon symbol="share" />
       Share
     </Button>
   </DialogTrigger>
@@ -229,7 +229,7 @@ import { ShareIcon, CopyIcon } from "lucide-react";
         />
       </div>
       <Button type="submit" size="sm" className="px-3">
-        <CopyIcon />
+        <Icon symbol="content_copy" />
       </Button>
     </DialogBody>
     <DialogFooter className="sm:justify-start">
@@ -246,13 +246,13 @@ import { ShareIcon, CopyIcon } from "lucide-react";
 ### Confirmación de Eliminación
 
 ```tsx
-import { TrashIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 import { Checkbox } from "@adamosuiteservices/ui/checkbox";
 
 <Dialog>
   <DialogTrigger asChild>
     <Button variant="destructive">
-      <TrashIcon />
+      <Icon symbol="delete" />
       Delete Account
     </Button>
   </DialogTrigger>
@@ -274,7 +274,7 @@ import { Checkbox } from "@adamosuiteservices/ui/checkbox";
         <Button variant="outline">Cancel</Button>
       </DialogClose>
       <Button variant="destructive">
-        <TrashIcon />
+        <Icon symbol="delete" />
         Delete Account
       </Button>
     </DialogFooter>
@@ -285,12 +285,12 @@ import { Checkbox } from "@adamosuiteservices/ui/checkbox";
 ### Crear Proyecto
 
 ```tsx
-import { PlusIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <Dialog>
   <DialogTrigger asChild>
     <Button>
-      <PlusIcon />
+      <Icon symbol="add" />
       New Project
     </Button>
   </DialogTrigger>
@@ -327,7 +327,7 @@ import { PlusIcon } from "lucide-react";
         <Button variant="outline">Cancel</Button>
       </DialogClose>
       <Button type="submit">
-        <PlusIcon />
+        <Icon symbol="add" />
         Create Project
       </Button>
     </DialogFooter>
@@ -338,12 +338,12 @@ import { PlusIcon } from "lucide-react";
 ### Ver Detalles (Read-only)
 
 ```tsx
-import { UserIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <Dialog>
   <DialogTrigger asChild>
     <Button variant="outline">
-      <UserIcon />
+      <Icon symbol="person" />
       View Details
     </Button>
   </DialogTrigger>
@@ -381,7 +381,7 @@ import { UserIcon } from "lucide-react";
         <Button variant="outline">Close</Button>
       </DialogClose>
       <Button>
-        <UserIcon />
+        <Icon symbol="person" />
         Edit User
       </Button>
     </DialogFooter>
@@ -392,12 +392,12 @@ import { UserIcon } from "lucide-react";
 ### Información Estructurada
 
 ```tsx
-import { InfoIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <Dialog>
   <DialogTrigger asChild>
     <Button variant="outline">
-      <InfoIcon />
+      <Icon symbol="info" />
       More Info
     </Button>
   </DialogTrigger>

package/docs/components/ui/dropdown-menu.md

@@ -200,12 +200,7 @@ import {
 ### Con Iconos y Shortcuts
 
 ```tsx
-import {
-  UserIcon,
-  CreditCardIcon,
-  SettingsIcon,
-  LogOutIcon,
-} from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <DropdownMenu>
   <DropdownMenuTrigger asChild>
@@ -215,23 +210,23 @@ import {
     <DropdownMenuLabel>My Account</DropdownMenuLabel>
     <DropdownMenuSeparator />
     <DropdownMenuItem>
-      <UserIcon />
+      <Icon symbol="person" />
       Profile
       <DropdownMenuShortcut>⇧⌘P</DropdownMenuShortcut>
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <CreditCardIcon />
+      <Icon symbol="credit_card" />
       Billing
       <DropdownMenuShortcut>⌘B</DropdownMenuShortcut>
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <SettingsIcon />
+      <Icon symbol="settings" />
       Settings
       <DropdownMenuShortcut>⌘S</DropdownMenuShortcut>
     </DropdownMenuItem>
     <DropdownMenuSeparator />
     <DropdownMenuItem>
-      <LogOutIcon />
+      <Icon symbol="logout" />
       Log out
       <DropdownMenuShortcut>⇧⌘Q</DropdownMenuShortcut>
     </DropdownMenuItem>
@@ -313,7 +308,7 @@ function Settings() {
 ### Con Submenú
 
 ```tsx
-import { UsersIcon, MailIcon, MessageSquareIcon, PlusIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <DropdownMenu>
   <DropdownMenuTrigger asChild>
@@ -321,27 +316,27 @@ import { UsersIcon, MailIcon, MessageSquareIcon, PlusIcon } from "lucide-react";
   </DropdownMenuTrigger>
   <DropdownMenuContent>
     <DropdownMenuItem>
-      <UsersIcon />
+      <Icon symbol="group" />
       Team
     </DropdownMenuItem>
     <DropdownMenuSub>
       <DropdownMenuSubTrigger>
-        <UserIcon />
+        <Icon symbol="person" />
         Invite users
       </DropdownMenuSubTrigger>
       <DropdownMenuPortal>
         <DropdownMenuSubContent>
           <DropdownMenuItem>
-            <MailIcon />
+            <Icon symbol="mail" />
             Email
           </DropdownMenuItem>
           <DropdownMenuItem>
-            <MessageSquareIcon />
+            <Icon symbol="chat_bubble" />
             Message
           </DropdownMenuItem>
           <DropdownMenuSeparator />
           <DropdownMenuItem>
-            <PlusIcon />
+            <Icon symbol="add" />
             More...
           </DropdownMenuItem>
         </DropdownMenuSubContent>
@@ -354,17 +349,12 @@ import { UsersIcon, MailIcon, MessageSquareIcon, PlusIcon } from "lucide-react";
 ### User Menu (Avatar)
 
 ```tsx
-import {
-  UserIcon,
-  CreditCardIcon,
-  SettingsIcon,
-  LogOutIcon,
-} from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <DropdownMenu>
   <DropdownMenuTrigger asChild>
     <Button variant="ghost" className="h-8 w-8 rounded-full">
-      <UserIcon />
+      <Icon symbol="person" />
     </Button>
   </DropdownMenuTrigger>
   <DropdownMenuContent className="w-56" align="end" forceMount>
@@ -378,23 +368,23 @@ import {
     </DropdownMenuLabel>
     <DropdownMenuSeparator />
     <DropdownMenuItem>
-      <UserIcon />
+      <Icon symbol="person" />
       Profile
       <DropdownMenuShortcut>⇧⌘P</DropdownMenuShortcut>
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <CreditCardIcon />
+      <Icon symbol="credit_card" />
       Billing
       <DropdownMenuShortcut>⌘B</DropdownMenuShortcut>
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <SettingsIcon />
+      <Icon symbol="settings" />
       Settings
       <DropdownMenuShortcut>⌘S</DropdownMenuShortcut>
     </DropdownMenuItem>
     <DropdownMenuSeparator />
     <DropdownMenuItem>
-      <LogOutIcon />
+      <Icon symbol="logout" />
       Log out
       <DropdownMenuShortcut>⇧⌘Q</DropdownMenuShortcut>
     </DropdownMenuItem>
@@ -407,44 +397,39 @@ import {
 ```tsx
 import {
   MoreHorizontalIcon,
-  EditIcon,
-  CopyIcon,
-  ShareIcon,
-  DownloadIcon,
-  TrashIcon,
-} from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <DropdownMenu>
   <DropdownMenuTrigger asChild>
     <Button variant="ghost" size="sm">
-      <MoreHorizontalIcon />
+      <Icon symbol="more_horiz" />
     </Button>
   </DropdownMenuTrigger>
   <DropdownMenuContent align="end">
     <DropdownMenuItem>
-      <EditIcon />
+      <Icon symbol="open_in_new" />
       Open
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <CopyIcon />
+      <Icon symbol="content_copy" />
       Copy Link
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <ShareIcon />
+      <Icon symbol="share" />
       Share
     </DropdownMenuItem>
     <DropdownMenuSeparator />
     <DropdownMenuItem>
-      <DownloadIcon />
+      <Icon symbol="download" />
       Download
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <EditIcon />
+      <Icon symbol="edit" />
       Rename
     </DropdownMenuItem>
     <DropdownMenuSeparator />
     <DropdownMenuItem variant="destructive">
-      <TrashIcon />
+      <Icon symbol="delete" />
       Delete
     </DropdownMenuItem>
   </DropdownMenuContent>
@@ -457,34 +442,31 @@ import {
 import {
   ChevronDownIcon,
   EditIcon,
-  CopyIcon,
-  ShareIcon,
-  TrashIcon,
-} from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <DropdownMenu>
   <DropdownMenuTrigger asChild>
     <Button variant="outline">
       Actions
-      <ChevronDownIcon />
+      <Icon symbol="expand_more" />
     </Button>
   </DropdownMenuTrigger>
   <DropdownMenuContent>
     <DropdownMenuItem>
-      <EditIcon />
+      <Icon symbol="edit" />
       Edit
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <CopyIcon />
+      <Icon symbol="content_copy" />
       Duplicate
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <ShareIcon />
+      <Icon symbol="share" />
       Share
     </DropdownMenuItem>
     <DropdownMenuSeparator />
     <DropdownMenuItem variant="destructive">
-      <TrashIcon />
+      <Icon symbol="delete" />
       Delete
     </DropdownMenuItem>
   </DropdownMenuContent>
@@ -500,54 +482,50 @@ import {
   ShareIcon,
   CopyIcon,
   UsersIcon,
-  UserIcon,
-  SettingsIcon,
-  DownloadIcon,
-  TrashIcon,
-} from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <DropdownMenu>
   <DropdownMenuTrigger asChild>
     <Button variant="outline">
-      <FolderIcon />
+      <Icon symbol="folder" />
       My Project
-      <ChevronDownIcon />
+      <Icon symbol="expand_more" />
     </Button>
   </DropdownMenuTrigger>
   <DropdownMenuContent className="w-56">
     <DropdownMenuLabel>Project Actions</DropdownMenuLabel>
     <DropdownMenuSeparator />
     <DropdownMenuItem>
-      <EditIcon />
+      <Icon symbol="edit" />
       Edit Project
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <ShareIcon />
+      <Icon symbol="share" />
       Share Project
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <CopyIcon />
+      <Icon symbol="content_copy" />
       Duplicate Project
     </DropdownMenuItem>
     <DropdownMenuSeparator />
     <DropdownMenuSub>
       <DropdownMenuSubTrigger>
-        <UsersIcon />
+        <Icon symbol="group" />
         Manage Access
       </DropdownMenuSubTrigger>
       <DropdownMenuPortal>
         <DropdownMenuSubContent>
           <DropdownMenuItem>
-            <UserIcon />
+            <Icon symbol="person_add" />
             Add Member
           </DropdownMenuItem>
           <DropdownMenuItem>
-            <SettingsIcon />
+            <Icon symbol="admin_panel_settings" />
             Permissions
           </DropdownMenuItem>
           <DropdownMenuSeparator />
           <DropdownMenuItem>
-            <UsersIcon />
+            <Icon symbol="group" />
             View Members
           </DropdownMenuItem>
         </DropdownMenuSubContent>
@@ -555,16 +533,16 @@ import {
     </DropdownMenuSub>
     <DropdownMenuSeparator />
     <DropdownMenuItem>
-      <DownloadIcon />
+      <Icon symbol="download" />
       Export
     </DropdownMenuItem>
     <DropdownMenuItem>
-      <SettingsIcon />
+      <Icon symbol="settings" />
       Settings
     </DropdownMenuItem>
     <DropdownMenuSeparator />
     <DropdownMenuItem variant="destructive">
-      <TrashIcon />
+      <Icon symbol="delete" />
       Delete Project
     </DropdownMenuItem>
   </DropdownMenuContent>

package/docs/components/ui/hover-card.md

@@ -98,7 +98,7 @@ import {
   AvatarImage,
   AvatarFallback,
 } from "@adamosuiteservices/ui/avatar";
-import { CalendarIcon } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <HoverCard>
   <HoverCardTrigger asChild>
@@ -116,7 +116,7 @@ import { CalendarIcon } from "lucide-react";
           Building design systems and web apps. Creator of ui.shadcn.com.
         </p>
         <div className="flex items-center pt-2">
-          <CalendarIcon className="mr-2 h-4 w-4 opacity-70" />
+          <Icon symbol="calendar_month" className="mr-2 text-lg opacity-70" />
           <span className="text-xs text-muted-foreground">
             Joined December 2021
           </span>
@@ -165,7 +165,7 @@ import { CalendarIcon } from "lucide-react";
 ### Repository Info
 
 ```tsx
-import { Star, GitBranch } from "lucide-react";
+import { Icon } from "@adamosuiteservices/ui/icon";
 
 <HoverCard>
   <HoverCardTrigger asChild>
@@ -184,11 +184,11 @@ import { Star, GitBranch } from "lucide-react";
       </div>
       <div className="flex items-center gap-4 text-sm text-muted-foreground">
         <div className="flex items-center gap-1">
-          <Star className="h-4 w-4" />
+          <Icon symbol="star" className="text-lg" />
           <span>45.2k</span>
         </div>
         <div className="flex items-center gap-1">
-          <GitBranch className="h-4 w-4" />
+          <Icon symbol="account_tree" className="text-lg" />
           <span>4.1k</span>
         </div>
         <div className="flex items-center gap-1">