create-lexy 0.3.0 → 0.4.0

package/assets/r/logo.json

@@ -11,7 +11,7 @@
       "path": "components/base/Logo.tsx",
       "type": "registry:ui",
       "target": "components/base/Logo.tsx",
-      "content": "import * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nimport lexyDarkHorizontal from \"./assets/logo/lexy-dark-horizontal.svg\";\nimport lexyDarkHorizontalSlogan from \"./assets/logo/lexy-dark-horizontal-slogan.svg\";\nimport lexyDarkVertical from \"./assets/logo/lexy-dark-vertical.svg\";\nimport lexyDarkVerticalSlogan from \"./assets/logo/lexy-dark-vertical-slogan.svg\";\nimport lexyDarkIsotipe from \"./assets/logo/lexy-dark-isotipe.svg\";\nimport lexyLightHorizontal from \"./assets/logo/lexy-light-horizontal.svg\";\nimport lexyLightHorizontalSlogan from \"./assets/logo/lexy-light-horizontal-slogan.svg\";\nimport lexyLightVertical from \"./assets/logo/lexy-light-vertical.svg\";\nimport lexyLightVerticalSlogan from \"./assets/logo/lexy-light-vertical-slogan.svg\";\nimport lexyLightIsotipe from \"./assets/logo/lexy-light-isotipe.svg\";\nimport saludDarkV1 from \"./assets/logo/lexysalud-dark-v1.svg\";\nimport saludDarkV2 from \"./assets/logo/lexysalud-dark-v2.svg\";\nimport saludLightV1 from \"./assets/logo/lexysalud-light-v1.svg\";\nimport saludLightV2 from \"./assets/logo/lexysalud-light-v2.svg\";\nimport deudorDarkV1 from \"./assets/logo/lexydeudor-dark-v1.svg\";\nimport deudorDarkV2 from \"./assets/logo/lexydeudor-dark-v2.svg\";\nimport deudorLightV1 from \"./assets/logo/lexydeudor-light-v1.svg\";\nimport deudorLightV2 from \"./assets/logo/lexydeudor-light-v2.svg\";\n\nexport type LogoBrand = \"lexy\" | \"salud\" | \"deudor\";\n/**\n * Color del fondo sobre el que va el logo:\n *  - `light` (fondo claro)  → logo OSCURO (navy).  ← por defecto\n *  - `dark`  (fondo oscuro) → logo CLARO (blanco).\n */\nexport type LogoSurface = \"light\" | \"dark\";\nexport type LogoLayout = \"horizontal\" | \"vertical\" | \"isotipe\";\nexport type LogoVersion = \"v1\" | \"v2\";\n\n// Clave del mapa = el `surface` (fondo). El archivo `*-light-*` trae arte oscuro\n// (para fondo claro) y `*-dark-*` trae arte claro (para fondo oscuro).\nconst lexyMap = {\n  light: {\n    horizontal: { false: lexyLightHorizontal, true: lexyLightHorizontalSlogan },\n    vertical: { false: lexyLightVertical, true: lexyLightVerticalSlogan },\n    isotipe: { false: lexyLightIsotipe, true: lexyLightIsotipe },\n  },\n  dark: {\n    horizontal: { false: lexyDarkHorizontal, true: lexyDarkHorizontalSlogan },\n    vertical: { false: lexyDarkVertical, true: lexyDarkVerticalSlogan },\n    isotipe: { false: lexyDarkIsotipe, true: lexyDarkIsotipe },\n  },\n} as const;\n\nconst subBrandMap = {\n  salud: {\n    light: { v1: saludLightV1, v2: saludLightV2 },\n    dark: { v1: saludDarkV1, v2: saludDarkV2 },\n  },\n  deudor: {\n    light: { v1: deudorLightV1, v2: deudorLightV2 },\n    dark: { v1: deudorDarkV1, v2: deudorDarkV2 },\n  },\n} as const;\n\nexport interface LogoProps\n  extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, \"src\"> {\n  brand?: LogoBrand;\n  /** Fondo sobre el que va el logo. `light` (def.) = logo oscuro; `dark` = logo claro. */\n  surface?: LogoSurface;\n  /** Solo Lexy. */\n  layout?: LogoLayout;\n  /** Solo Lexy. */\n  slogan?: boolean;\n  /** Solo sub-marcas (salud / deudor). */\n  version?: LogoVersion;\n}\n\nexport const Logo = React.forwardRef<HTMLImageElement, LogoProps>(function Logo(\n  {\n    brand = \"lexy\",\n    surface = \"light\",\n    layout = \"horizontal\",\n    slogan = false,\n    version = \"v1\",\n    alt,\n    className,\n    draggable = false,\n    ...props\n  },\n  ref,\n) {\n  let src: string;\n  let label: string;\n\n  if (brand === \"lexy\") {\n    src = lexyMap[surface][layout][slogan ? \"true\" : \"false\"];\n    label = \"Lexy\";\n  } else {\n    src = subBrandMap[brand][surface][version];\n    label = brand === \"salud\" ? \"Lexy Salud\" : \"Lexy Deudor\";\n  }\n\n  return (\n    <img\n      ref={ref}\n      src={src}\n      alt={alt ?? label}\n      draggable={draggable}\n      className={cn(\"block h-8 w-auto max-w-full select-none\", className)}\n      {...props}\n    />\n  );\n});\n\nLogo.displayName = \"Logo\";\n"
+      "content": "import * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nimport lexyDarkHorizontal from \"./assets/logo/lexy-dark-horizontal.svg\";\nimport lexyDarkHorizontalSlogan from \"./assets/logo/lexy-dark-horizontal-slogan.svg\";\nimport lexyDarkIsotipe from \"./assets/logo/lexy-dark-isotipe.svg\";\nimport lexyDarkVertical from \"./assets/logo/lexy-dark-vertical.svg\";\nimport lexyDarkVerticalSlogan from \"./assets/logo/lexy-dark-vertical-slogan.svg\";\nimport lexyLightHorizontal from \"./assets/logo/lexy-light-horizontal.svg\";\nimport lexyLightHorizontalSlogan from \"./assets/logo/lexy-light-horizontal-slogan.svg\";\nimport lexyLightIsotipe from \"./assets/logo/lexy-light-isotipe.svg\";\nimport lexyLightVertical from \"./assets/logo/lexy-light-vertical.svg\";\nimport lexyLightVerticalSlogan from \"./assets/logo/lexy-light-vertical-slogan.svg\";\nimport deudorDarkV1 from \"./assets/logo/lexydeudor-dark-v1.svg\";\nimport deudorDarkV2 from \"./assets/logo/lexydeudor-dark-v2.svg\";\nimport deudorLightV1 from \"./assets/logo/lexydeudor-light-v1.svg\";\nimport deudorLightV2 from \"./assets/logo/lexydeudor-light-v2.svg\";\nimport saludDarkV1 from \"./assets/logo/lexysalud-dark-v1.svg\";\nimport saludDarkV2 from \"./assets/logo/lexysalud-dark-v2.svg\";\nimport saludLightV1 from \"./assets/logo/lexysalud-light-v1.svg\";\nimport saludLightV2 from \"./assets/logo/lexysalud-light-v2.svg\";\n\nexport type LogoBrand = \"lexy\" | \"salud\" | \"deudor\";\n/**\n * Color del fondo sobre el que va el logo:\n *  - `light` (fondo claro)  → logo OSCURO (navy).  ← por defecto\n *  - `dark`  (fondo oscuro) → logo CLARO (blanco).\n */\nexport type LogoSurface = \"light\" | \"dark\";\nexport type LogoLayout = \"horizontal\" | \"vertical\" | \"isotipe\";\nexport type LogoVersion = \"v1\" | \"v2\";\n\n// Clave del mapa = el `surface` (fondo). El archivo `*-light-*` trae arte oscuro\n// (para fondo claro) y `*-dark-*` trae arte claro (para fondo oscuro).\nconst lexyMap = {\n  light: {\n    horizontal: { false: lexyLightHorizontal, true: lexyLightHorizontalSlogan },\n    vertical: { false: lexyLightVertical, true: lexyLightVerticalSlogan },\n    isotipe: { false: lexyLightIsotipe, true: lexyLightIsotipe },\n  },\n  dark: {\n    horizontal: { false: lexyDarkHorizontal, true: lexyDarkHorizontalSlogan },\n    vertical: { false: lexyDarkVertical, true: lexyDarkVerticalSlogan },\n    isotipe: { false: lexyDarkIsotipe, true: lexyDarkIsotipe },\n  },\n} as const;\n\nconst subBrandMap = {\n  salud: {\n    light: { v1: saludLightV1, v2: saludLightV2 },\n    dark: { v1: saludDarkV1, v2: saludDarkV2 },\n  },\n  deudor: {\n    light: { v1: deudorLightV1, v2: deudorLightV2 },\n    dark: { v1: deudorDarkV1, v2: deudorDarkV2 },\n  },\n} as const;\n\nexport interface LogoProps extends Omit<React.ImgHTMLAttributes<HTMLImageElement>, \"src\"> {\n  brand?: LogoBrand;\n  /** Fondo sobre el que va el logo. `light` (def.) = logo oscuro; `dark` = logo claro. */\n  surface?: LogoSurface;\n  /** Solo Lexy. */\n  layout?: LogoLayout;\n  /** Solo Lexy. */\n  slogan?: boolean;\n  /** Solo sub-marcas (salud / deudor). */\n  version?: LogoVersion;\n}\n\nexport const Logo = React.forwardRef<HTMLImageElement, LogoProps>(function Logo(\n  {\n    brand = \"lexy\",\n    surface = \"light\",\n    layout = \"horizontal\",\n    slogan = false,\n    version = \"v1\",\n    alt,\n    className,\n    draggable = false,\n    ...props\n  },\n  ref,\n) {\n  let src: string;\n  let label: string;\n\n  if (brand === \"lexy\") {\n    src = lexyMap[surface][layout][slogan ? \"true\" : \"false\"];\n    label = \"Lexy\";\n  } else {\n    src = subBrandMap[brand][surface][version];\n    label = brand === \"salud\" ? \"Lexy Salud\" : \"Lexy Deudor\";\n  }\n\n  return (\n    <img\n      ref={ref}\n      src={src}\n      alt={alt ?? label}\n      draggable={draggable}\n      className={cn(\"block h-8 w-auto max-w-full select-none\", className)}\n      {...props}\n    />\n  );\n});\n\nLogo.displayName = \"Logo\";\n"
     },
     {
       "path": "components/base/Logo.md",

package/assets/r/menubar.json

@@ -13,7 +13,7 @@
       "path": "components/base/Menubar.tsx",
       "type": "registry:ui",
       "target": "components/base/Menubar.tsx",
-      "content": "import * as React from \"react\";\nimport * as MenubarPrimitive from \"@radix-ui/react-menubar\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst MenubarMenu = MenubarPrimitive.Menu;\nconst MenubarGroup = MenubarPrimitive.Group;\nconst MenubarPortal = MenubarPrimitive.Portal;\nconst MenubarSub = MenubarPrimitive.Sub;\nconst MenubarRadioGroup = MenubarPrimitive.RadioGroup;\n\nconst ChevronRightIcon = () => (\n  <svg\n    className='ml-auto h-4 w-4'\n    viewBox='0 0 24 24'\n    fill='none'\n    stroke='currentColor'\n    strokeWidth='2'\n    strokeLinecap='round'\n    strokeLinejoin='round'>\n    <path d='m9 18 6-6-6-6' />\n  </svg>\n);\n\nconst CheckIcon = () => (\n  <svg\n    className='h-4 w-4'\n    viewBox='0 0 24 24'\n    fill='none'\n    stroke='currentColor'\n    strokeWidth='2'\n    strokeLinecap='round'\n    strokeLinejoin='round'>\n    <path d='M20 6 9 17l-5-5' />\n  </svg>\n);\n\nconst DotIcon = () => (\n  <svg className='h-2 w-2 fill-current' viewBox='0 0 24 24'>\n    <circle cx='12' cy='12' r='12' />\n  </svg>\n);\n\nconst Menubar = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Root\n    ref={ref}\n    className={cn(\n      \"flex h-10 items-center gap-1 rounded border border-border bg-background p-1\",\n      className,\n    )}\n    {...props}\n  />\n));\nMenubar.displayName = MenubarPrimitive.Root.displayName;\n\nconst MenubarTrigger = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Trigger>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      \"flex cursor-pointer select-none items-center rounded px-3 py-1.5 text-sm font-medium text-foreground outline-none focus:bg-primary/15 focus:text-primary data-[state=open]:bg-primary/15 data-[state=open]:text-primary\",\n      className,\n    )}\n    {...props}\n  />\n));\nMenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName;\n\nconst MenubarSubTrigger = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubTrigger> & {\n    inset?: boolean;\n  }\n>(({ className, inset, children, ...props }, ref) => (\n  <MenubarPrimitive.SubTrigger\n    ref={ref}\n    className={cn(\n      \"flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm outline-none focus:bg-primary/15 focus:text-primary data-[state=open]:bg-primary/15 data-[state=open]:text-primary\",\n      inset && \"pl-8\",\n      className,\n    )}\n    {...props}>\n    {children}\n    <ChevronRightIcon />\n  </MenubarPrimitive.SubTrigger>\n));\nMenubarSubTrigger.displayName = MenubarPrimitive.SubTrigger.displayName;\n\nconst MenubarSubContent = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubContent>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.SubContent\n    ref={ref}\n    className={cn(\n      \"z-50 min-w-32 overflow-hidden rounded border border-border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n      className,\n    )}\n    {...props}\n  />\n));\nMenubarSubContent.displayName = MenubarPrimitive.SubContent.displayName;\n\nconst MenubarContent = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Content>\n>(\n  (\n    { className, align = \"start\", alignOffset = -4, sideOffset = 8, ...props },\n    ref,\n  ) => (\n    <MenubarPortal>\n      <MenubarPrimitive.Content\n        ref={ref}\n        align={align}\n        alignOffset={alignOffset}\n        sideOffset={sideOffset}\n        className={cn(\n          \"z-50 min-w-48 overflow-hidden rounded border border-border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n          className,\n        )}\n        {...props}\n      />\n    </MenubarPortal>\n  ),\n);\nMenubarContent.displayName = MenubarPrimitive.Content.displayName;\n\nconst MenubarItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Item> & {\n    inset?: boolean;\n  }\n>(({ className, inset, ...props }, ref) => (\n  <MenubarPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"relative flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm outline-none focus:bg-primary/15 focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      inset && \"pl-8\",\n      className,\n    )}\n    {...props}\n  />\n));\nMenubarItem.displayName = MenubarPrimitive.Item.displayName;\n\nconst MenubarCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n  <MenubarPrimitive.CheckboxItem\n    ref={ref}\n    className={cn(\n      \"relative flex cursor-pointer select-none items-center rounded py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-primary/15 focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      className,\n    )}\n    checked={checked}\n    {...props}>\n    <span className='absolute left-2 flex h-3.5 w-3.5 items-center justify-center'>\n      <MenubarPrimitive.ItemIndicator>\n        <CheckIcon />\n      </MenubarPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </MenubarPrimitive.CheckboxItem>\n));\nMenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName;\n\nconst MenubarRadioItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n  <MenubarPrimitive.RadioItem\n    ref={ref}\n    className={cn(\n      \"relative flex cursor-pointer select-none items-center rounded py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-primary/15 focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      className,\n    )}\n    {...props}>\n    <span className='absolute left-2 flex h-3.5 w-3.5 items-center justify-center'>\n      <MenubarPrimitive.ItemIndicator>\n        <DotIcon />\n      </MenubarPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </MenubarPrimitive.RadioItem>\n));\nMenubarRadioItem.displayName = MenubarPrimitive.RadioItem.displayName;\n\nconst MenubarLabel = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Label> & {\n    inset?: boolean;\n  }\n>(({ className, inset, ...props }, ref) => (\n  <MenubarPrimitive.Label\n    ref={ref}\n    className={cn(\n      \"px-2 py-1.5 text-sm font-semibold text-foreground\",\n      inset && \"pl-8\",\n      className,\n    )}\n    {...props}\n  />\n));\nMenubarLabel.displayName = MenubarPrimitive.Label.displayName;\n\nconst MenubarSeparator = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Separator\n    ref={ref}\n    className={cn(\"-mx-1 my-1 h-px bg-border\", className)}\n    {...props}\n  />\n));\nMenubarSeparator.displayName = MenubarPrimitive.Separator.displayName;\n\nconst MenubarShortcut = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement>) => (\n  <span\n    className={cn(\n      \"ml-auto text-xs tracking-widest text-muted-foreground\",\n      className,\n    )}\n    {...props}\n  />\n);\nMenubarShortcut.displayName = \"MenubarShortcut\";\n\nexport {\n  Menubar,\n  MenubarMenu,\n  MenubarTrigger,\n  MenubarContent,\n  MenubarItem,\n  MenubarSeparator,\n  MenubarLabel,\n  MenubarCheckboxItem,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarPortal,\n  MenubarSubContent,\n  MenubarSubTrigger,\n  MenubarGroup,\n  MenubarSub,\n  MenubarShortcut,\n};\n"
+      "content": "import * as MenubarPrimitive from \"@radix-ui/react-menubar\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst MenubarMenu = MenubarPrimitive.Menu;\nconst MenubarGroup = MenubarPrimitive.Group;\nconst MenubarPortal = MenubarPrimitive.Portal;\nconst MenubarSub = MenubarPrimitive.Sub;\nconst MenubarRadioGroup = MenubarPrimitive.RadioGroup;\n\nconst ChevronRightIcon = () => (\n  <svg\n    className=\"ml-auto h-4 w-4\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n  >\n    <path d=\"m9 18 6-6-6-6\" />\n  </svg>\n);\n\nconst CheckIcon = () => (\n  <svg\n    className=\"h-4 w-4\"\n    viewBox=\"0 0 24 24\"\n    fill=\"none\"\n    stroke=\"currentColor\"\n    strokeWidth=\"2\"\n    strokeLinecap=\"round\"\n    strokeLinejoin=\"round\"\n  >\n    <path d=\"M20 6 9 17l-5-5\" />\n  </svg>\n);\n\nconst DotIcon = () => (\n  <svg className=\"h-2 w-2 fill-current\" viewBox=\"0 0 24 24\">\n    <circle cx=\"12\" cy=\"12\" r=\"12\" />\n  </svg>\n);\n\nconst Menubar = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Root\n    ref={ref}\n    className={cn(\n      \"flex h-10 items-center gap-1 rounded border border-border bg-background p-1\",\n      className,\n    )}\n    {...props}\n  />\n));\nMenubar.displayName = MenubarPrimitive.Root.displayName;\n\nconst MenubarTrigger = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Trigger>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      \"flex cursor-pointer select-none items-center rounded px-3 py-1.5 text-sm font-medium text-foreground outline-none focus:bg-primary/15 focus:text-primary data-[state=open]:bg-primary/15 data-[state=open]:text-primary\",\n      className,\n    )}\n    {...props}\n  />\n));\nMenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName;\n\nconst MenubarSubTrigger = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.SubTrigger>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubTrigger> & {\n    inset?: boolean;\n  }\n>(({ className, inset, children, ...props }, ref) => (\n  <MenubarPrimitive.SubTrigger\n    ref={ref}\n    className={cn(\n      \"flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm outline-none focus:bg-primary/15 focus:text-primary data-[state=open]:bg-primary/15 data-[state=open]:text-primary\",\n      inset && \"pl-8\",\n      className,\n    )}\n    {...props}\n  >\n    {children}\n    <ChevronRightIcon />\n  </MenubarPrimitive.SubTrigger>\n));\nMenubarSubTrigger.displayName = MenubarPrimitive.SubTrigger.displayName;\n\nconst MenubarSubContent = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.SubContent>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.SubContent>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.SubContent\n    ref={ref}\n    className={cn(\n      \"z-50 min-w-32 overflow-hidden rounded border border-border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n      className,\n    )}\n    {...props}\n  />\n));\nMenubarSubContent.displayName = MenubarPrimitive.SubContent.displayName;\n\nconst MenubarContent = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Content>\n>(({ className, align = \"start\", alignOffset = -4, sideOffset = 8, ...props }, ref) => (\n  <MenubarPortal>\n    <MenubarPrimitive.Content\n      ref={ref}\n      align={align}\n      alignOffset={alignOffset}\n      sideOffset={sideOffset}\n      className={cn(\n        \"z-50 min-w-48 overflow-hidden rounded border border-border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n        className,\n      )}\n      {...props}\n    />\n  </MenubarPortal>\n));\nMenubarContent.displayName = MenubarPrimitive.Content.displayName;\n\nconst MenubarItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Item> & {\n    inset?: boolean;\n  }\n>(({ className, inset, ...props }, ref) => (\n  <MenubarPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"relative flex cursor-pointer select-none items-center rounded px-2 py-1.5 text-sm outline-none focus:bg-primary/15 focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      inset && \"pl-8\",\n      className,\n    )}\n    {...props}\n  />\n));\nMenubarItem.displayName = MenubarPrimitive.Item.displayName;\n\nconst MenubarCheckboxItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.CheckboxItem>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.CheckboxItem>\n>(({ className, children, checked, ...props }, ref) => (\n  <MenubarPrimitive.CheckboxItem\n    ref={ref}\n    className={cn(\n      \"relative flex cursor-pointer select-none items-center rounded py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-primary/15 focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      className,\n    )}\n    checked={checked}\n    {...props}\n  >\n    <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n      <MenubarPrimitive.ItemIndicator>\n        <CheckIcon />\n      </MenubarPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </MenubarPrimitive.CheckboxItem>\n));\nMenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName;\n\nconst MenubarRadioItem = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.RadioItem>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.RadioItem>\n>(({ className, children, ...props }, ref) => (\n  <MenubarPrimitive.RadioItem\n    ref={ref}\n    className={cn(\n      \"relative flex cursor-pointer select-none items-center rounded py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-primary/15 focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      className,\n    )}\n    {...props}\n  >\n    <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n      <MenubarPrimitive.ItemIndicator>\n        <DotIcon />\n      </MenubarPrimitive.ItemIndicator>\n    </span>\n    {children}\n  </MenubarPrimitive.RadioItem>\n));\nMenubarRadioItem.displayName = MenubarPrimitive.RadioItem.displayName;\n\nconst MenubarLabel = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Label> & {\n    inset?: boolean;\n  }\n>(({ className, inset, ...props }, ref) => (\n  <MenubarPrimitive.Label\n    ref={ref}\n    className={cn(\"px-2 py-1.5 text-sm font-semibold text-foreground\", inset && \"pl-8\", className)}\n    {...props}\n  />\n));\nMenubarLabel.displayName = MenubarPrimitive.Label.displayName;\n\nconst MenubarSeparator = React.forwardRef<\n  React.ElementRef<typeof MenubarPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof MenubarPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <MenubarPrimitive.Separator\n    ref={ref}\n    className={cn(\"-mx-1 my-1 h-px bg-border\", className)}\n    {...props}\n  />\n));\nMenubarSeparator.displayName = MenubarPrimitive.Separator.displayName;\n\nconst MenubarShortcut = ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>) => (\n  <span\n    className={cn(\"ml-auto text-xs tracking-widest text-muted-foreground\", className)}\n    {...props}\n  />\n);\nMenubarShortcut.displayName = \"MenubarShortcut\";\n\nexport {\n  Menubar,\n  MenubarCheckboxItem,\n  MenubarContent,\n  MenubarGroup,\n  MenubarItem,\n  MenubarLabel,\n  MenubarMenu,\n  MenubarPortal,\n  MenubarRadioGroup,\n  MenubarRadioItem,\n  MenubarSeparator,\n  MenubarShortcut,\n  MenubarSub,\n  MenubarSubContent,\n  MenubarSubTrigger,\n  MenubarTrigger,\n};\n"
     },
     {
       "path": "components/base/Menubar.md",

package/assets/r/navigation-menu.json

@@ -14,7 +14,7 @@
       "path": "components/base/NavigationMenu.tsx",
       "type": "registry:ui",
       "target": "components/base/NavigationMenu.tsx",
-      "content": "import * as React from \"react\";\nimport * as NavigationMenuPrimitive from \"@radix-ui/react-navigation-menu\";\nimport { cva } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst NavigationMenu = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Root>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Root\n    ref={ref}\n    className={cn(\n      \"relative z-10 flex max-w-max flex-1 items-center justify-center\",\n      className,\n    )}\n    {...props}>\n    {children}\n    <NavigationMenuViewport />\n  </NavigationMenuPrimitive.Root>\n));\nNavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName;\n\nconst NavigationMenuList = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.List\n    ref={ref}\n    className={cn(\n      \"group flex flex-1 list-none items-center justify-center gap-1\",\n      className,\n    )}\n    {...props}\n  />\n));\nNavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;\n\nconst NavigationMenuItem = NavigationMenuPrimitive.Item;\n\nconst navigationMenuTriggerStyle = cva(\n  \"group inline-flex h-10 w-max cursor-pointer items-center justify-center rounded bg-background px-4 py-2 text-sm font-medium text-foreground transition-colors hover:bg-primary/15 hover:text-primary focus:bg-primary/15 focus:text-primary focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-secondary data-[state=open]:bg-secondary\",\n);\n\nconst NavigationMenuTrigger = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Trigger>\n>(({ className, children, onPointerMove, onPointerLeave, ...props }, ref) => (\n  <NavigationMenuPrimitive.Trigger\n    ref={ref}\n    className={cn(navigationMenuTriggerStyle(), \"group\", className)}\n    // Desactiva la apertura por hover para evitar el conflicto hover/click de\n    // Radix (el menú se cerraba al reabrirlo tras un click). Queda controlado\n    // por click y teclado. Radix omite su handler si el evento está prevenido.\n    onPointerMove={(event) => {\n      event.preventDefault();\n      onPointerMove?.(event);\n    }}\n    onPointerLeave={(event) => {\n      event.preventDefault();\n      onPointerLeave?.(event);\n    }}\n    {...props}>\n    {children}{\" \"}\n    <svg\n      className='relative top-px ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180'\n      viewBox='0 0 24 24'\n      fill='none'\n      stroke='currentColor'\n      strokeWidth='2'\n      strokeLinecap='round'\n      strokeLinejoin='round'\n      aria-hidden='true'>\n      <path d='m6 9 6 6 6-6' />\n    </svg>\n  </NavigationMenuPrimitive.Trigger>\n));\nNavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;\n\nconst NavigationMenuContent = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Content>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.Content\n    ref={ref}\n    className={cn(\n      \"left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out md:absolute md:w-auto\",\n      className,\n    )}\n    {...props}\n  />\n));\nNavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;\n\nconst NavigationMenuLink = NavigationMenuPrimitive.Link;\n\nconst NavigationMenuViewport = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Viewport>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Viewport>\n>(({ className, ...props }, ref) => (\n  <div className={cn(\"absolute left-0 top-full flex justify-center\")}>\n    <NavigationMenuPrimitive.Viewport\n      ref={ref}\n      className={cn(\n        \"origin-top-center relative mt-2 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded border border-border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]\",\n        className,\n      )}\n      {...props}\n    />\n  </div>\n));\nNavigationMenuViewport.displayName =\n  NavigationMenuPrimitive.Viewport.displayName;\n\nconst NavigationMenuIndicator = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Indicator>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Indicator>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.Indicator\n    ref={ref}\n    className={cn(\n      \"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in\",\n      className,\n    )}\n    {...props}>\n    <div className='relative top-[60%] h-2 w-2 rotate-45 rounded-tl bg-border shadow-md' />\n  </NavigationMenuPrimitive.Indicator>\n));\nNavigationMenuIndicator.displayName =\n  NavigationMenuPrimitive.Indicator.displayName;\n\nexport {\n  navigationMenuTriggerStyle,\n  NavigationMenu,\n  NavigationMenuList,\n  NavigationMenuItem,\n  NavigationMenuContent,\n  NavigationMenuTrigger,\n  NavigationMenuLink,\n  NavigationMenuIndicator,\n  NavigationMenuViewport,\n};\n"
+      "content": "import * as NavigationMenuPrimitive from \"@radix-ui/react-navigation-menu\";\nimport { cva } from \"class-variance-authority\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst NavigationMenu = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Root>\n>(({ className, children, ...props }, ref) => (\n  <NavigationMenuPrimitive.Root\n    ref={ref}\n    className={cn(\"relative z-10 flex max-w-max flex-1 items-center justify-center\", className)}\n    {...props}\n  >\n    {children}\n    <NavigationMenuViewport />\n  </NavigationMenuPrimitive.Root>\n));\nNavigationMenu.displayName = NavigationMenuPrimitive.Root.displayName;\n\nconst NavigationMenuList = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.List>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.List>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.List\n    ref={ref}\n    className={cn(\"group flex flex-1 list-none items-center justify-center gap-1\", className)}\n    {...props}\n  />\n));\nNavigationMenuList.displayName = NavigationMenuPrimitive.List.displayName;\n\nconst NavigationMenuItem = NavigationMenuPrimitive.Item;\n\nconst navigationMenuTriggerStyle = cva(\n  \"group inline-flex h-10 w-max cursor-pointer items-center justify-center rounded bg-background px-4 py-2 text-sm font-medium text-foreground transition-colors hover:bg-primary/15 hover:text-primary focus:bg-primary/15 focus:text-primary focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-secondary data-[state=open]:bg-secondary\",\n);\n\nconst NavigationMenuTrigger = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Trigger>\n>(({ className, children, onPointerMove, onPointerLeave, ...props }, ref) => (\n  <NavigationMenuPrimitive.Trigger\n    ref={ref}\n    className={cn(navigationMenuTriggerStyle(), \"group\", className)}\n    // Desactiva la apertura por hover para evitar el conflicto hover/click de\n    // Radix (el menú se cerraba al reabrirlo tras un click). Queda controlado\n    // por click y teclado. Radix omite su handler si el evento está prevenido.\n    onPointerMove={(event) => {\n      event.preventDefault();\n      onPointerMove?.(event);\n    }}\n    onPointerLeave={(event) => {\n      event.preventDefault();\n      onPointerLeave?.(event);\n    }}\n    {...props}\n  >\n    {children}{\" \"}\n    <svg\n      className=\"relative top-px ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      aria-hidden=\"true\"\n    >\n      <path d=\"m6 9 6 6 6-6\" />\n    </svg>\n  </NavigationMenuPrimitive.Trigger>\n));\nNavigationMenuTrigger.displayName = NavigationMenuPrimitive.Trigger.displayName;\n\nconst NavigationMenuContent = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Content>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.Content\n    ref={ref}\n    className={cn(\n      \"left-0 top-0 w-full data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out md:absolute md:w-auto\",\n      className,\n    )}\n    {...props}\n  />\n));\nNavigationMenuContent.displayName = NavigationMenuPrimitive.Content.displayName;\n\nconst NavigationMenuLink = NavigationMenuPrimitive.Link;\n\nconst NavigationMenuViewport = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Viewport>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Viewport>\n>(({ className, ...props }, ref) => (\n  <div className={cn(\"absolute left-0 top-full flex justify-center\")}>\n    <NavigationMenuPrimitive.Viewport\n      ref={ref}\n      className={cn(\n        \"origin-top-center relative mt-2 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded border border-border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]\",\n        className,\n      )}\n      {...props}\n    />\n  </div>\n));\nNavigationMenuViewport.displayName = NavigationMenuPrimitive.Viewport.displayName;\n\nconst NavigationMenuIndicator = React.forwardRef<\n  React.ElementRef<typeof NavigationMenuPrimitive.Indicator>,\n  React.ComponentPropsWithoutRef<typeof NavigationMenuPrimitive.Indicator>\n>(({ className, ...props }, ref) => (\n  <NavigationMenuPrimitive.Indicator\n    ref={ref}\n    className={cn(\n      \"top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in\",\n      className,\n    )}\n    {...props}\n  >\n    <div className=\"relative top-[60%] h-2 w-2 rotate-45 rounded-tl bg-border shadow-md\" />\n  </NavigationMenuPrimitive.Indicator>\n));\nNavigationMenuIndicator.displayName = NavigationMenuPrimitive.Indicator.displayName;\n\nexport {\n  NavigationMenu,\n  NavigationMenuContent,\n  NavigationMenuIndicator,\n  NavigationMenuItem,\n  NavigationMenuLink,\n  NavigationMenuList,\n  NavigationMenuTrigger,\n  navigationMenuTriggerStyle,\n  NavigationMenuViewport,\n};\n"
     },
     {
       "path": "components/base/NavigationMenu.md",

package/assets/r/pagination.json

@@ -9,14 +9,14 @@
     "lucide-react"
   ],
   "registryDependencies": [
-    "button"
+    "@lexy/button"
   ],
   "files": [
     {
       "path": "components/base/Pagination.tsx",
       "type": "registry:ui",
       "target": "components/base/Pagination.tsx",
-      "content": "import * as React from \"react\";\n\nimport { type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@/lib/utils/cn\";\nimport { buttonVariants } from \"./Button\";\nimport { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from \"lucide-react\";\n\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n  return (\n    <nav\n      role=\"navigation\"\n      aria-label=\"pagination\"\n      data-slot=\"pagination\"\n      className={cn(\"mx-auto flex w-full justify-center\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction PaginationContent({\n  className,\n  ...props\n}: React.ComponentProps<\"ul\">) {\n  return (\n    <ul\n      data-slot=\"pagination-content\"\n      className={cn(\"flex items-center gap-1\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n  return <li data-slot=\"pagination-item\" {...props} />;\n}\n\ntype PaginationLinkProps = {\n  isActive?: boolean;\n} & Pick<VariantProps<typeof buttonVariants>, \"size\"> &\n  Omit<React.ComponentProps<\"a\">, \"size\">;\n\nfunction PaginationLink({\n  className,\n  isActive,\n  size = \"icon\",\n  ...props\n}: PaginationLinkProps) {\n  return (\n    <a\n      aria-current={isActive ? \"page\" : undefined}\n      data-slot=\"pagination-link\"\n      data-active={isActive}\n      className={cn(\n        buttonVariants({\n          variant: isActive ? \"outline\" : \"ghost\",\n          size,\n        }),\n        \"cursor-pointer\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction PaginationPrevious({\n  className,\n  text = \"Anterior\",\n  ...props\n}: React.ComponentProps<typeof PaginationLink> & { text?: string }) {\n  return (\n    <PaginationLink\n      aria-label=\"Ir a la página anterior\"\n      size=\"default\"\n      className={cn(\"pl-2!\", className)}\n      {...props}\n    >\n      <ChevronLeftIcon data-icon=\"inline-start\" className=\"cn-rtl-flip\" />\n      <span className=\"hidden sm:block\">{text}</span>\n    </PaginationLink>\n  );\n}\n\nfunction PaginationNext({\n  className,\n  text = \"Siguiente\",\n  ...props\n}: React.ComponentProps<typeof PaginationLink> & { text?: string }) {\n  return (\n    <PaginationLink\n      aria-label=\"Ir a la página siguiente\"\n      size=\"default\"\n      className={cn(\"pr-2!\", className)}\n      {...props}\n    >\n      <span className=\"hidden sm:block\">{text}</span>\n      <ChevronRightIcon data-icon=\"inline-end\" className=\"cn-rtl-flip\" />\n    </PaginationLink>\n  );\n}\n\nfunction PaginationEllipsis({\n  className,\n  ...props\n}: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      aria-hidden\n      data-slot=\"pagination-ellipsis\"\n      className={cn(\n        \"flex size-9 items-center justify-center [&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    >\n      <MoreHorizontalIcon />\n      <span className=\"sr-only\">Más páginas</span>\n    </span>\n  );\n}\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationEllipsis,\n  PaginationItem,\n  PaginationLink,\n  PaginationNext,\n  PaginationPrevious,\n};\n"
+      "content": "import { type VariantProps } from \"class-variance-authority\";\nimport { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from \"lucide-react\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nimport { buttonVariants } from \"./Button\";\n\nfunction Pagination({ className, ...props }: React.ComponentProps<\"nav\">) {\n  return (\n    <nav\n      role=\"navigation\"\n      aria-label=\"pagination\"\n      data-slot=\"pagination\"\n      className={cn(\"mx-auto flex w-full justify-center\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction PaginationContent({ className, ...props }: React.ComponentProps<\"ul\">) {\n  return (\n    <ul\n      data-slot=\"pagination-content\"\n      className={cn(\"flex items-center gap-1\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction PaginationItem({ ...props }: React.ComponentProps<\"li\">) {\n  return <li data-slot=\"pagination-item\" {...props} />;\n}\n\ntype PaginationLinkProps = {\n  isActive?: boolean;\n} & Pick<VariantProps<typeof buttonVariants>, \"size\"> &\n  Omit<React.ComponentProps<\"a\">, \"size\">;\n\nfunction PaginationLink({ className, isActive, size = \"icon\", ...props }: PaginationLinkProps) {\n  return (\n    // eslint-disable-next-line jsx-a11y/anchor-has-content -- el contenido llega por {...props} (componente genérico de enlace)\n    <a\n      aria-current={isActive ? \"page\" : undefined}\n      data-slot=\"pagination-link\"\n      data-active={isActive}\n      className={cn(\n        buttonVariants({\n          variant: isActive ? \"outline\" : \"ghost\",\n          size,\n        }),\n        \"cursor-pointer\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction PaginationPrevious({\n  className,\n  text = \"Anterior\",\n  ...props\n}: React.ComponentProps<typeof PaginationLink> & { text?: string }) {\n  return (\n    <PaginationLink\n      aria-label=\"Ir a la página anterior\"\n      size=\"default\"\n      className={cn(\"pl-2!\", className)}\n      {...props}\n    >\n      <ChevronLeftIcon data-icon=\"inline-start\" className=\"cn-rtl-flip\" />\n      <span className=\"hidden sm:block\">{text}</span>\n    </PaginationLink>\n  );\n}\n\nfunction PaginationNext({\n  className,\n  text = \"Siguiente\",\n  ...props\n}: React.ComponentProps<typeof PaginationLink> & { text?: string }) {\n  return (\n    <PaginationLink\n      aria-label=\"Ir a la página siguiente\"\n      size=\"default\"\n      className={cn(\"pr-2!\", className)}\n      {...props}\n    >\n      <span className=\"hidden sm:block\">{text}</span>\n      <ChevronRightIcon data-icon=\"inline-end\" className=\"cn-rtl-flip\" />\n    </PaginationLink>\n  );\n}\n\nfunction PaginationEllipsis({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      aria-hidden\n      data-slot=\"pagination-ellipsis\"\n      className={cn(\n        \"flex size-9 items-center justify-center [&_svg:not([class*='size-'])]:size-4\",\n        className,\n      )}\n      {...props}\n    >\n      <MoreHorizontalIcon />\n      <span className=\"sr-only\">Más páginas</span>\n    </span>\n  );\n}\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationEllipsis,\n  PaginationItem,\n  PaginationLink,\n  PaginationNext,\n  PaginationPrevious,\n};\n"
     },
     {
       "path": "components/base/Pagination.md",

package/assets/r/popover.json

@@ -13,7 +13,7 @@
       "path": "components/base/Popover.tsx",
       "type": "registry:ui",
       "target": "components/base/Popover.tsx",
-      "content": "import * as React from \"react\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Popover = PopoverPrimitive.Root;\nconst PopoverTrigger = PopoverPrimitive.Trigger;\nconst PopoverAnchor = PopoverPrimitive.Anchor;\n\nconst PopoverContent = React.forwardRef<\n  React.ElementRef<typeof PopoverPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ className, align = \"center\", sideOffset = 4, ...props }, ref) => (\n  <PopoverPrimitive.Portal>\n    <PopoverPrimitive.Content\n      ref={ref}\n      align={align}\n      sideOffset={sideOffset}\n      className={cn(\n        \"z-50 w-72 rounded border border-border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n        className,\n      )}\n      {...props}\n    />\n  </PopoverPrimitive.Portal>\n));\nPopoverContent.displayName = PopoverPrimitive.Content.displayName;\n\nexport { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };\n"
+      "content": "import * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Popover = PopoverPrimitive.Root;\nconst PopoverTrigger = PopoverPrimitive.Trigger;\nconst PopoverAnchor = PopoverPrimitive.Anchor;\n\nconst PopoverContent = React.forwardRef<\n  React.ElementRef<typeof PopoverPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ className, align = \"center\", sideOffset = 4, ...props }, ref) => (\n  <PopoverPrimitive.Portal>\n    <PopoverPrimitive.Content\n      ref={ref}\n      align={align}\n      sideOffset={sideOffset}\n      className={cn(\n        \"z-50 w-72 rounded border border-border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95\",\n        className,\n      )}\n      {...props}\n    />\n  </PopoverPrimitive.Portal>\n));\nPopoverContent.displayName = PopoverPrimitive.Content.displayName;\n\nexport { Popover, PopoverAnchor, PopoverContent, PopoverTrigger };\n"
     },
     {
       "path": "components/base/Popover.md",

package/assets/r/profile-card.json

@@ -6,15 +6,15 @@
   "description": "Tarjeta de perfil. Para mostrar información de usuario. El componente vive en tu proyecto: instálalo con `create-lexy add profile-card` y edítalo con libertad.",
   "dependencies": [],
   "registryDependencies": [
-    "avatar",
-    "button"
+    "@lexy/avatar",
+    "@lexy/button"
   ],
   "files": [
     {
       "path": "components/base/ProfileCard.tsx",
       "type": "registry:ui",
       "target": "components/base/ProfileCard.tsx",
-      "content": "import * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\nimport { Avatar, AvatarFallback, AvatarImage } from \"./Avatar\";\nimport { Button } from \"./Button\";\n\nexport interface ProfileCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string;\n  role?: string;\n  initials?: string;\n  src?: string;\n  primaryAction?: string;\n  secondaryAction?: string;\n  onPrimary?: () => void;\n  onSecondary?: () => void;\n  /** Oculta la fila de acciones cuando es `false`. */\n  showActions?: boolean;\n}\n\nexport const ProfileCard = React.forwardRef<HTMLDivElement, ProfileCardProps>(\n  (\n    {\n      name,\n      role,\n      initials,\n      src,\n      primaryAction = \"Ver perfil\",\n      secondaryAction = \"Mensaje\",\n      onPrimary,\n      onSecondary,\n      showActions = true,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <article\n        ref={ref}\n        className={cn(\n          \"flex w-70 flex-col gap-4 rounded-lg border border-border bg-background p-6 transition-shadow hover:shadow-md\",\n          className,\n        )}\n        {...props}>\n        <Avatar className='h-16 w-16'>\n          {src && <AvatarImage src={src} alt={name} />}\n          <AvatarFallback>{initials ?? name.slice(0, 2)}</AvatarFallback>\n        </Avatar>\n        <div className='flex flex-col gap-0.5'>\n          <h3 className='text-sm font-medium text-foreground'>{name}</h3>\n          {role && <p className='text-xs text-muted-foreground'>{role}</p>}\n        </div>\n        {showActions && (\n          <div className='flex gap-2'>\n            <Button size='sm' onClick={onPrimary}>\n              {primaryAction}\n            </Button>\n            <Button size='sm' variant='secondary' onClick={onSecondary}>\n              {secondaryAction}\n            </Button>\n          </div>\n        )}\n      </article>\n    );\n  },\n);\n\nProfileCard.displayName = \"ProfileCard\";\n"
+      "content": "import * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nimport { Avatar, AvatarFallback, AvatarImage } from \"./Avatar\";\nimport { Button } from \"./Button\";\n\nexport interface ProfileCardProps extends React.HTMLAttributes<HTMLDivElement> {\n  name: string;\n  role?: string;\n  initials?: string;\n  src?: string;\n  primaryAction?: string;\n  secondaryAction?: string;\n  onPrimary?: () => void;\n  onSecondary?: () => void;\n  /** Oculta la fila de acciones cuando es `false`. */\n  showActions?: boolean;\n}\n\nexport const ProfileCard = React.forwardRef<HTMLDivElement, ProfileCardProps>(\n  (\n    {\n      name,\n      role,\n      initials,\n      src,\n      primaryAction = \"Ver perfil\",\n      secondaryAction = \"Mensaje\",\n      onPrimary,\n      onSecondary,\n      showActions = true,\n      className,\n      ...props\n    },\n    ref,\n  ) => {\n    return (\n      <article\n        ref={ref}\n        className={cn(\n          \"flex w-70 flex-col gap-4 rounded-lg border border-border bg-background p-6 transition-shadow hover:shadow-md\",\n          className,\n        )}\n        {...props}\n      >\n        <Avatar className=\"h-16 w-16\">\n          {src && <AvatarImage src={src} alt={name} />}\n          <AvatarFallback>{initials ?? name.slice(0, 2)}</AvatarFallback>\n        </Avatar>\n        <div className=\"flex flex-col gap-0.5\">\n          <h3 className=\"text-sm font-medium text-foreground\">{name}</h3>\n          {role && <p className=\"text-xs text-muted-foreground\">{role}</p>}\n        </div>\n        {showActions && (\n          <div className=\"flex gap-2\">\n            <Button size=\"sm\" onClick={onPrimary}>\n              {primaryAction}\n            </Button>\n            <Button size=\"sm\" variant=\"secondary\" onClick={onSecondary}>\n              {secondaryAction}\n            </Button>\n          </div>\n        )}\n      </article>\n    );\n  },\n);\n\nProfileCard.displayName = \"ProfileCard\";\n"
     },
     {
       "path": "components/base/ProfileCard.md",

package/assets/r/progress.json

@@ -13,7 +13,7 @@
       "path": "components/base/Progress.tsx",
       "type": "registry:ui",
       "target": "components/base/Progress.tsx",
-      "content": "import * as React from \"react\";\nimport * as ProgressPrimitive from \"@radix-ui/react-progress\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Progress = React.forwardRef<\n  React.ElementRef<typeof ProgressPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>\n>(({ className, value, ...props }, ref) => (\n  <ProgressPrimitive.Root\n    ref={ref}\n    className={cn(\n      \"relative h-2 w-full overflow-hidden rounded-full bg-secondary\",\n      className,\n    )}\n    {...props}>\n    <ProgressPrimitive.Indicator\n      className='h-full w-full flex-1 bg-primary transition-all'\n      style={{ transform: `translateX(-${100 - (value || 0)}%)` }}\n    />\n  </ProgressPrimitive.Root>\n));\nProgress.displayName = ProgressPrimitive.Root.displayName;\n\nexport { Progress };\n"
+      "content": "import * as ProgressPrimitive from \"@radix-ui/react-progress\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Progress = React.forwardRef<\n  React.ElementRef<typeof ProgressPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof ProgressPrimitive.Root>\n>(({ className, value, ...props }, ref) => (\n  <ProgressPrimitive.Root\n    ref={ref}\n    className={cn(\"relative h-2 w-full overflow-hidden rounded-full bg-secondary\", className)}\n    {...props}\n  >\n    <ProgressPrimitive.Indicator\n      className=\"h-full w-full flex-1 bg-primary transition-all\"\n      style={{ transform: `translateX(-${100 - (value || 0)}%)` }}\n    />\n  </ProgressPrimitive.Root>\n));\nProgress.displayName = ProgressPrimitive.Root.displayName;\n\nexport { Progress };\n"
     },
     {
       "path": "components/base/Progress.md",

package/assets/r/radio-group.json

@@ -13,7 +13,7 @@
       "path": "components/base/RadioGroup.tsx",
       "type": "registry:ui",
       "target": "components/base/RadioGroup.tsx",
-      "content": "import * as React from \"react\";\nimport * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst RadioGroup = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <RadioGroupPrimitive.Root\n    ref={ref}\n    className={cn(\"grid gap-2\", className)}\n    {...props}\n  />\n));\nRadioGroup.displayName = RadioGroupPrimitive.Root.displayName;\n\nconst RadioGroupItem = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <RadioGroupPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"aspect-square h-4 w-4 cursor-pointer rounded-full border border-primary text-primary focus:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50\",\n      className,\n    )}\n    {...props}>\n    <RadioGroupPrimitive.Indicator className='flex items-center justify-center'>\n      <span className='h-2.5 w-2.5 rounded-full bg-current' />\n    </RadioGroupPrimitive.Indicator>\n  </RadioGroupPrimitive.Item>\n));\nRadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;\n\nexport { RadioGroup, RadioGroupItem };\n"
+      "content": "import * as RadioGroupPrimitive from \"@radix-ui/react-radio-group\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst RadioGroup = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root>\n>(({ className, ...props }, ref) => (\n  <RadioGroupPrimitive.Root ref={ref} className={cn(\"grid gap-2\", className)} {...props} />\n));\nRadioGroup.displayName = RadioGroupPrimitive.Root.displayName;\n\nconst RadioGroupItem = React.forwardRef<\n  React.ElementRef<typeof RadioGroupPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>\n>(({ className, ...props }, ref) => (\n  <RadioGroupPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"aspect-square h-4 w-4 cursor-pointer rounded-full border border-primary text-primary focus:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50\",\n      className,\n    )}\n    {...props}\n  >\n    <RadioGroupPrimitive.Indicator className=\"flex items-center justify-center\">\n      <span className=\"h-2.5 w-2.5 rounded-full bg-current\" />\n    </RadioGroupPrimitive.Indicator>\n  </RadioGroupPrimitive.Item>\n));\nRadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;\n\nexport { RadioGroup, RadioGroupItem };\n"
     },
     {
       "path": "components/base/RadioGroup.md",

package/assets/r/registry.json

@@ -35,7 +35,7 @@
         "class-variance-authority"
       ],
       "registryDependencies": [
-        "button"
+        "@lexy/button"
       ],
       "files": [
         {
@@ -57,7 +57,7 @@
       "description": "Acordeón de aplicación **data-driven**. Describe los items como datos (`items`)",
       "dependencies": [],
       "registryDependencies": [
-        "accordion"
+        "@lexy/accordion"
       ],
       "files": [
         {
@@ -79,8 +79,8 @@
       "description": "Diálogo de aplicación al estilo **Material 3**. Estructura canónica sin dividers: El componente vive en tu proyecto: instálalo con `create-lexy add app-dialog` y edítalo con libertad.",
       "dependencies": [],
       "registryDependencies": [
-        "button",
-        "dialog"
+        "@lexy/button",
+        "@lexy/dialog"
       ],
       "files": [
         {
@@ -104,9 +104,9 @@
         "class-variance-authority"
       ],
       "registryDependencies": [
-        "button",
-        "header-bar",
-        "logo"
+        "@lexy/button",
+        "@lexy/header-bar",
+        "@lexy/logo"
       ],
       "files": [
         {
@@ -130,8 +130,8 @@
         "lucide-react"
       ],
       "registryDependencies": [
-        "avatar",
-        "sidebar"
+        "@lexy/avatar",
+        "@lexy/sidebar"
       ],
       "files": [
         {
@@ -245,7 +245,7 @@
         "class-variance-authority"
       ],
       "registryDependencies": [
-        "separator"
+        "@lexy/separator"
       ],
       "files": [
         {
@@ -270,7 +270,7 @@
         "react-day-picker@^9.8.0"
       ],
       "registryDependencies": [
-        "button"
+        "@lexy/button"
       ],
       "files": [
         {
@@ -358,9 +358,9 @@
       "description": "Campo de entrada con lista desplegable filtrable. Para búsqueda + selección. El componente vive en tu proyecto: instálalo con `create-lexy add combobox` y edítalo con libertad.",
       "dependencies": [],
       "registryDependencies": [
-        "button",
-        "command",
-        "popover"
+        "@lexy/button",
+        "@lexy/command",
+        "@lexy/popover"
       ],
       "files": [
         {
@@ -429,9 +429,9 @@
         "react-day-picker@^9.8.0"
       ],
       "registryDependencies": [
-        "button",
-        "calendar",
-        "popover"
+        "@lexy/button",
+        "@lexy/calendar",
+        "@lexy/popover"
       ],
       "files": [
         {
@@ -544,7 +544,7 @@
         "@hookform/resolvers@^5.2.0"
       ],
       "registryDependencies": [
-        "label"
+        "@lexy/label"
       ],
       "files": [
         {
@@ -568,7 +568,7 @@
         "class-variance-authority"
       ],
       "registryDependencies": [
-        "logo"
+        "@lexy/logo"
       ],
       "files": [
         {
@@ -791,7 +791,7 @@
         "lucide-react"
       ],
       "registryDependencies": [
-        "button"
+        "@lexy/button"
       ],
       "files": [
         {
@@ -835,8 +835,8 @@
       "description": "Tarjeta de perfil. Para mostrar información de usuario. El componente vive en tu proyecto: instálalo con `create-lexy add profile-card` y edítalo con libertad.",
       "dependencies": [],
       "registryDependencies": [
-        "avatar",
-        "button"
+        "@lexy/avatar",
+        "@lexy/button"
       ],
       "files": [
         {
@@ -1015,12 +1015,12 @@
         "lucide-react"
       ],
       "registryDependencies": [
-        "button",
-        "input",
-        "separator",
-        "sheet",
-        "skeleton",
-        "tooltip"
+        "@lexy/button",
+        "@lexy/input",
+        "@lexy/separator",
+        "@lexy/sheet",
+        "@lexy/skeleton",
+        "@lexy/tooltip"
       ],
       "files": [
         {
@@ -1327,7 +1327,7 @@
         "lucide-react"
       ],
       "registryDependencies": [
-        "button"
+        "@lexy/button"
       ],
       "files": [
         {
@@ -1351,9 +1351,9 @@
         "lucide-react"
       ],
       "registryDependencies": [
-        "app-sidebar",
-        "logo",
-        "sidebar"
+        "@lexy/app-sidebar",
+        "@lexy/logo",
+        "@lexy/sidebar"
       ],
       "files": [
         {
@@ -1377,11 +1377,11 @@
         "lucide-react"
       ],
       "registryDependencies": [
-        "button",
-        "input",
-        "pagination",
-        "status-dot",
-        "table"
+        "@lexy/button",
+        "@lexy/input",
+        "@lexy/pagination",
+        "@lexy/status-dot",
+        "@lexy/table"
       ],
       "files": [
         {
@@ -1403,10 +1403,10 @@
       "description": "Detalle master-detail para **CRM**: contexto del caso a la izquierda (panel fijo de 288px), trabajo al centro en tabs, acción primaria a la mano. La información que se consulta junta vive junta. Instálalo con `create-lexy add crm-detalle-caso` — trae `Tabs`, `Tag`, `Separator` y `Button`. La vista queda en tu proyecto (`views/CasoDetalle.tsx`): edítala con libertad.",
       "dependencies": [],
       "registryDependencies": [
-        "button",
-        "separator",
-        "tabs",
-        "tag"
+        "@lexy/button",
+        "@lexy/separator",
+        "@lexy/tabs",
+        "@lexy/tag"
       ],
       "files": [
         {
@@ -1428,10 +1428,10 @@
       "description": "Paso de wizard de intake para **mundo cliente**: un paso enfocado, columna angosta (`max-w-xl`), indicador de avance arriba y CTA al final. Instálalo con `create-lexy add intake-wizard` — trae consigo `Progress`, `Input`, `Label` y `Button`. La vista queda en tu proyecto (`views/IntakeDatosPersonales.tsx`): edítala con libertad.",
       "dependencies": [],
       "registryDependencies": [
-        "button",
-        "input",
-        "label",
-        "progress"
+        "@lexy/button",
+        "@lexy/input",
+        "@lexy/label",
+        "@lexy/progress"
       ],
       "files": [
         {
@@ -1453,10 +1453,10 @@
       "description": "Pantalla de acceso: una sola tarea, foco único, ayuda contextual breve. Instálalo con `create-lexy add login` — trae `Card`, `Input`, `Label` y `Button`. La vista queda en tu proyecto (`views/Login.tsx`): edítala con libertad.",
       "dependencies": [],
       "registryDependencies": [
-        "button",
-        "card",
-        "input",
-        "label"
+        "@lexy/button",
+        "@lexy/card",
+        "@lexy/input",
+        "@lexy/label"
       ],
       "files": [
         {

package/assets/r/scroll-area.json

@@ -13,7 +13,7 @@
       "path": "components/base/ScrollArea.tsx",
       "type": "registry:ui",
       "target": "components/base/ScrollArea.tsx",
-      "content": "import * as React from \"react\";\nimport * as ScrollAreaPrimitive from \"@radix-ui/react-scroll-area\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nfunction ScrollArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"size-full rounded-[inherit] transition-[color,box-shadow] outline-none\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n}\n\nfunction ScrollBar({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      data-orientation={orientation}\n      orientation={orientation}\n      className={cn(\n        \"flex touch-none select-none transition-colors\",\n        \"data-[orientation=horizontal]:h-2 data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-transparent\",\n        \"data-[orientation=vertical]:h-full data-[orientation=vertical]:w-2 data-[orientation=vertical]:border-l data-[orientation=vertical]:border-l-transparent\",\n        className\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"relative flex-1 rounded-full bg-muted-foreground/20 hover:bg-muted-foreground/30 transition-colors\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n}\n\nexport { ScrollArea, ScrollBar };\n"
+      "content": "import * as ScrollAreaPrimitive from \"@radix-ui/react-scroll-area\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nfunction ScrollArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"size-full rounded-[inherit] transition-[color,box-shadow] outline-none\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n}\n\nfunction ScrollBar({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      data-orientation={orientation}\n      orientation={orientation}\n      className={cn(\n        \"flex touch-none select-none transition-colors\",\n        \"data-[orientation=horizontal]:h-2 data-[orientation=horizontal]:flex-col data-[orientation=horizontal]:border-t data-[orientation=horizontal]:border-t-transparent\",\n        \"data-[orientation=vertical]:h-full data-[orientation=vertical]:w-2 data-[orientation=vertical]:border-l data-[orientation=vertical]:border-l-transparent\",\n        className,\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"relative flex-1 rounded-full bg-muted-foreground/20 hover:bg-muted-foreground/30 transition-colors\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n}\n\nexport { ScrollArea, ScrollBar };\n"
     },
     {
       "path": "components/base/ScrollArea.md",

package/assets/r/searchbox.json

@@ -11,7 +11,7 @@
       "path": "components/base/Searchbox.tsx",
       "type": "registry:ui",
       "target": "components/base/Searchbox.tsx",
-      "content": "import * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nexport interface SearchboxProps\n  extends Omit<React.ComponentProps<\"input\">, \"type\"> {\n  /** Cuando se define, muestra un botón (×) para limpiar el campo. */\n  onClear?: () => void;\n}\n\nconst Searchbox = React.forwardRef<HTMLInputElement, SearchboxProps>(\n  ({ className, onClear, value, disabled, ...props }, ref) => {\n    const hasValue = value !== undefined && String(value) !== \"\";\n    const showClear = !!onClear && hasValue && !disabled;\n\n    return (\n      <div className={cn(\"relative flex w-full items-center\", className)}>\n        <svg\n          className='pointer-events-none absolute left-3 h-4 w-4 text-muted-foreground'\n          viewBox='0 0 24 24'\n          fill='none'\n          stroke='currentColor'\n          strokeWidth='2'\n          strokeLinecap='round'\n          strokeLinejoin='round'>\n          <circle cx='11' cy='11' r='8' />\n          <path d='m21 21-4.3-4.3' />\n        </svg>\n        <input\n          ref={ref}\n          type='search'\n          role='searchbox'\n          value={value}\n          disabled={disabled}\n          className={cn(\n            \"flex h-10 w-full rounded border border-input bg-background pl-9 pr-9 text-sm text-foreground outline-none transition-colors duration-150\",\n            \"placeholder:text-muted-foreground\",\n            \"hover:border-muted-foreground/40 focus-visible:border-primary\",\n            \"disabled:cursor-not-allowed disabled:opacity-50\",\n            \"[&::-webkit-search-cancel-button]:appearance-none\",\n          )}\n          {...props}\n        />\n        {showClear && (\n          <button\n            type='button'\n            onClick={onClear}\n            aria-label='Limpiar'\n            className='absolute right-3 flex h-4 w-4 cursor-pointer items-center justify-center text-muted-foreground transition-colors hover:text-foreground'>\n            <svg\n              className='h-4 w-4'\n              viewBox='0 0 24 24'\n              fill='none'\n              stroke='currentColor'\n              strokeWidth='2'\n              strokeLinecap='round'\n              strokeLinejoin='round'>\n              <path d='M18 6 6 18M6 6l12 12' />\n            </svg>\n          </button>\n        )}\n      </div>\n    );\n  },\n);\nSearchbox.displayName = \"Searchbox\";\n\nexport { Searchbox };\n"
+      "content": "import * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nexport interface SearchboxProps extends Omit<React.ComponentProps<\"input\">, \"type\"> {\n  /** Cuando se define, muestra un botón (×) para limpiar el campo. */\n  onClear?: () => void;\n}\n\nconst Searchbox = React.forwardRef<HTMLInputElement, SearchboxProps>(\n  ({ className, onClear, value, disabled, ...props }, ref) => {\n    const hasValue = value !== undefined && String(value) !== \"\";\n    const showClear = !!onClear && hasValue && !disabled;\n\n    return (\n      <div className={cn(\"relative flex w-full items-center\", className)}>\n        <svg\n          className=\"pointer-events-none absolute left-3 h-4 w-4 text-muted-foreground\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        >\n          <circle cx=\"11\" cy=\"11\" r=\"8\" />\n          <path d=\"m21 21-4.3-4.3\" />\n        </svg>\n        <input\n          ref={ref}\n          type=\"search\"\n          role=\"searchbox\"\n          value={value}\n          disabled={disabled}\n          className={cn(\n            \"flex h-10 w-full rounded border border-input bg-background pl-9 pr-9 text-sm text-foreground outline-none transition-colors duration-150\",\n            \"placeholder:text-muted-foreground\",\n            \"hover:border-muted-foreground/40 focus-visible:border-primary\",\n            \"disabled:cursor-not-allowed disabled:opacity-50\",\n            \"[&::-webkit-search-cancel-button]:appearance-none\",\n          )}\n          {...props}\n        />\n        {showClear && (\n          <button\n            type=\"button\"\n            onClick={onClear}\n            aria-label=\"Limpiar\"\n            className=\"absolute right-3 flex h-4 w-4 cursor-pointer items-center justify-center text-muted-foreground transition-colors hover:text-foreground\"\n          >\n            <svg\n              className=\"h-4 w-4\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              strokeWidth=\"2\"\n              strokeLinecap=\"round\"\n              strokeLinejoin=\"round\"\n            >\n              <path d=\"M18 6 6 18M6 6l12 12\" />\n            </svg>\n          </button>\n        )}\n      </div>\n    );\n  },\n);\nSearchbox.displayName = \"Searchbox\";\n\nexport { Searchbox };\n"
     },
     {
       "path": "components/base/Searchbox.md",

package/assets/r/select.json

@@ -13,7 +13,7 @@
       "path": "components/base/Select.tsx",
       "type": "registry:ui",
       "target": "components/base/Select.tsx",
-      "content": "import * as React from \"react\";\nimport * as SelectPrimitive from \"@radix-ui/react-select\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Select = SelectPrimitive.Root;\nconst SelectGroup = SelectPrimitive.Group;\nconst SelectValue = SelectPrimitive.Value;\n\nconst SelectTrigger = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n  <SelectPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      \"flex h-10 w-full items-center justify-between rounded border border-input bg-background px-3 py-2 text-sm text-foreground outline-none transition-colors duration-150 hover:border-muted-foreground/40 focus:border-primary disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-muted-foreground [&>span]:line-clamp-1\",\n      className,\n    )}\n    {...props}>\n    {children}\n    <SelectPrimitive.Icon asChild>\n      <svg\n        className='h-4 w-4 opacity-50 transition-transform duration-200 data-[state=open]:rotate-180'\n        viewBox='0 0 24 24'\n        fill='none'\n        stroke='currentColor'\n        strokeWidth='2'\n        strokeLinecap='round'\n        strokeLinejoin='round'>\n        <path d='m6 9 6 6 6-6' />\n      </svg>\n    </SelectPrimitive.Icon>\n  </SelectPrimitive.Trigger>\n));\nSelectTrigger.displayName = SelectPrimitive.Trigger.displayName;\n\nconst SelectScrollUpButton = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.ScrollUpButton\n    ref={ref}\n    className={cn(\"flex cursor-default items-center justify-center py-1\", className)}\n    {...props}>\n    <svg\n      className='h-4 w-4'\n      viewBox='0 0 24 24'\n      fill='none'\n      stroke='currentColor'\n      strokeWidth='2'\n      strokeLinecap='round'\n      strokeLinejoin='round'>\n      <path d='m18 15-6-6-6 6' />\n    </svg>\n  </SelectPrimitive.ScrollUpButton>\n));\nSelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;\n\nconst SelectScrollDownButton = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.ScrollDownButton\n    ref={ref}\n    className={cn(\"flex cursor-default items-center justify-center py-1\", className)}\n    {...props}>\n    <svg\n      className='h-4 w-4'\n      viewBox='0 0 24 24'\n      fill='none'\n      stroke='currentColor'\n      strokeWidth='2'\n      strokeLinecap='round'\n      strokeLinejoin='round'>\n      <path d='m6 9 6 6 6-6' />\n    </svg>\n  </SelectPrimitive.ScrollDownButton>\n));\nSelectScrollDownButton.displayName =\n  SelectPrimitive.ScrollDownButton.displayName;\n\nconst SelectContent = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>\n>(({ className, children, position = \"popper\", ...props }, ref) => (\n  <SelectPrimitive.Portal>\n    <SelectPrimitive.Content\n      ref={ref}\n      className={cn(\n        \"relative z-50 max-h-96 overflow-hidden rounded border border-border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2\",\n        position === \"popper\" &&\n          \"w-[var(--radix-select-trigger-width)] data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1\",\n        className,\n      )}\n      position={position}\n      {...props}>\n      <SelectScrollUpButton />\n      <SelectPrimitive.Viewport\n        className={cn(\n          \"p-1\",\n          position === \"popper\" &&\n            \"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]\",\n        )}>\n        {children}\n      </SelectPrimitive.Viewport>\n      <SelectScrollDownButton />\n    </SelectPrimitive.Content>\n  </SelectPrimitive.Portal>\n));\nSelectContent.displayName = SelectPrimitive.Content.displayName;\n\nconst SelectLabel = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.Label\n    ref={ref}\n    className={cn(\n      \"px-2 py-1.5 text-xs font-medium text-muted-foreground\",\n      className,\n    )}\n    {...props}\n  />\n));\nSelectLabel.displayName = SelectPrimitive.Label.displayName;\n\nconst SelectItem = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>\n>(({ className, children, ...props }, ref) => (\n  <SelectPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"relative flex w-full cursor-pointer select-none items-center rounded py-1.5 pl-8 pr-2 text-sm text-foreground outline-none focus:bg-primary/15 focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      className,\n    )}\n    {...props}>\n    <span className='absolute left-2 flex h-3.5 w-3.5 items-center justify-center'>\n      <SelectPrimitive.ItemIndicator>\n        <svg\n          className='h-4 w-4'\n          viewBox='0 0 24 24'\n          fill='none'\n          stroke='currentColor'\n          strokeWidth='2'\n          strokeLinecap='round'\n          strokeLinejoin='round'>\n          <path d='M20 6 9 17l-5-5' />\n        </svg>\n      </SelectPrimitive.ItemIndicator>\n    </span>\n    <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n  </SelectPrimitive.Item>\n));\nSelectItem.displayName = SelectPrimitive.Item.displayName;\n\nconst SelectSeparator = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.Separator\n    ref={ref}\n    className={cn(\"-mx-1 my-1 h-px bg-border\", className)}\n    {...props}\n  />\n));\nSelectSeparator.displayName = SelectPrimitive.Separator.displayName;\n\nexport {\n  Select,\n  SelectGroup,\n  SelectValue,\n  SelectTrigger,\n  SelectContent,\n  SelectLabel,\n  SelectItem,\n  SelectSeparator,\n  SelectScrollUpButton,\n  SelectScrollDownButton,\n};\n"
+      "content": "import * as SelectPrimitive from \"@radix-ui/react-select\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Select = SelectPrimitive.Root;\nconst SelectGroup = SelectPrimitive.Group;\nconst SelectValue = SelectPrimitive.Value;\n\nconst SelectTrigger = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Trigger>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>\n>(({ className, children, ...props }, ref) => (\n  <SelectPrimitive.Trigger\n    ref={ref}\n    className={cn(\n      \"flex h-10 w-full items-center justify-between rounded border border-input bg-background px-3 py-2 text-sm text-foreground outline-none transition-colors duration-150 hover:border-muted-foreground/40 focus:border-primary disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-muted-foreground [&>span]:line-clamp-1\",\n      className,\n    )}\n    {...props}\n  >\n    {children}\n    <SelectPrimitive.Icon asChild>\n      <svg\n        className=\"h-4 w-4 opacity-50 transition-transform duration-200 data-[state=open]:rotate-180\"\n        viewBox=\"0 0 24 24\"\n        fill=\"none\"\n        stroke=\"currentColor\"\n        strokeWidth=\"2\"\n        strokeLinecap=\"round\"\n        strokeLinejoin=\"round\"\n      >\n        <path d=\"m6 9 6 6 6-6\" />\n      </svg>\n    </SelectPrimitive.Icon>\n  </SelectPrimitive.Trigger>\n));\nSelectTrigger.displayName = SelectPrimitive.Trigger.displayName;\n\nconst SelectScrollUpButton = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.ScrollUpButton\n    ref={ref}\n    className={cn(\"flex cursor-default items-center justify-center py-1\", className)}\n    {...props}\n  >\n    <svg\n      className=\"h-4 w-4\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"m18 15-6-6-6 6\" />\n    </svg>\n  </SelectPrimitive.ScrollUpButton>\n));\nSelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;\n\nconst SelectScrollDownButton = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.ScrollDownButton\n    ref={ref}\n    className={cn(\"flex cursor-default items-center justify-center py-1\", className)}\n    {...props}\n  >\n    <svg\n      className=\"h-4 w-4\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n    >\n      <path d=\"m6 9 6 6 6-6\" />\n    </svg>\n  </SelectPrimitive.ScrollDownButton>\n));\nSelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;\n\nconst SelectContent = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>\n>(({ className, children, position = \"popper\", ...props }, ref) => (\n  <SelectPrimitive.Portal>\n    <SelectPrimitive.Content\n      ref={ref}\n      className={cn(\n        \"relative z-50 max-h-96 overflow-hidden rounded border border-border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2\",\n        position === \"popper\" &&\n          \"w-[var(--radix-select-trigger-width)] data-[side=bottom]:translate-y-1 data-[side=top]:-translate-y-1\",\n        className,\n      )}\n      position={position}\n      {...props}\n    >\n      <SelectScrollUpButton />\n      <SelectPrimitive.Viewport\n        className={cn(\n          \"p-1\",\n          position === \"popper\" &&\n            \"h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]\",\n        )}\n      >\n        {children}\n      </SelectPrimitive.Viewport>\n      <SelectScrollDownButton />\n    </SelectPrimitive.Content>\n  </SelectPrimitive.Portal>\n));\nSelectContent.displayName = SelectPrimitive.Content.displayName;\n\nconst SelectLabel = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Label>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.Label\n    ref={ref}\n    className={cn(\"px-2 py-1.5 text-xs font-medium text-muted-foreground\", className)}\n    {...props}\n  />\n));\nSelectLabel.displayName = SelectPrimitive.Label.displayName;\n\nconst SelectItem = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Item>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>\n>(({ className, children, ...props }, ref) => (\n  <SelectPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"relative flex w-full cursor-pointer select-none items-center rounded py-1.5 pl-8 pr-2 text-sm text-foreground outline-none focus:bg-primary/15 focus:text-primary data-[disabled]:pointer-events-none data-[disabled]:opacity-50\",\n      className,\n    )}\n    {...props}\n  >\n    <span className=\"absolute left-2 flex h-3.5 w-3.5 items-center justify-center\">\n      <SelectPrimitive.ItemIndicator>\n        <svg\n          className=\"h-4 w-4\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        >\n          <path d=\"M20 6 9 17l-5-5\" />\n        </svg>\n      </SelectPrimitive.ItemIndicator>\n    </span>\n    <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>\n  </SelectPrimitive.Item>\n));\nSelectItem.displayName = SelectPrimitive.Item.displayName;\n\nconst SelectSeparator = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Separator>,\n  React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>\n>(({ className, ...props }, ref) => (\n  <SelectPrimitive.Separator\n    ref={ref}\n    className={cn(\"-mx-1 my-1 h-px bg-border\", className)}\n    {...props}\n  />\n));\nSelectSeparator.displayName = SelectPrimitive.Separator.displayName;\n\nexport {\n  Select,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectLabel,\n  SelectScrollDownButton,\n  SelectScrollUpButton,\n  SelectSeparator,\n  SelectTrigger,\n  SelectValue,\n};\n"
     },
     {
       "path": "components/base/Select.md",

package/assets/r/separator.json

@@ -13,7 +13,7 @@
       "path": "components/base/Separator.tsx",
       "type": "registry:ui",
       "target": "components/base/Separator.tsx",
-      "content": "import * as React from \"react\";\nimport * as SeparatorPrimitive from \"@radix-ui/react-separator\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Separator = React.forwardRef<\n  React.ElementRef<typeof SeparatorPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>\n>(\n  (\n    { className, orientation = \"horizontal\", decorative = true, ...props },\n    ref,\n  ) => (\n    <SeparatorPrimitive.Root\n      ref={ref}\n      decorative={decorative}\n      orientation={orientation}\n      className={cn(\n        \"shrink-0 bg-border\",\n        orientation === \"horizontal\" ? \"h-px w-full\" : \"h-full w-px\",\n        className,\n      )}\n      {...props}\n    />\n  ),\n);\nSeparator.displayName = SeparatorPrimitive.Root.displayName;\n\nexport { Separator };\n"
+      "content": "import * as SeparatorPrimitive from \"@radix-ui/react-separator\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Separator = React.forwardRef<\n  React.ElementRef<typeof SeparatorPrimitive.Root>,\n  React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>\n>(({ className, orientation = \"horizontal\", decorative = true, ...props }, ref) => (\n  <SeparatorPrimitive.Root\n    ref={ref}\n    decorative={decorative}\n    orientation={orientation}\n    className={cn(\n      \"shrink-0 bg-border\",\n      orientation === \"horizontal\" ? \"h-px w-full\" : \"h-full w-px\",\n      className,\n    )}\n    {...props}\n  />\n));\nSeparator.displayName = SeparatorPrimitive.Root.displayName;\n\nexport { Separator };\n"
     },
     {
       "path": "components/base/Separator.md",

package/assets/r/sheet.json

@@ -14,7 +14,7 @@
       "path": "components/base/Sheet.tsx",
       "type": "registry:ui",
       "target": "components/base/Sheet.tsx",
-      "content": "import * as React from \"react\";\nimport * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Sheet = SheetPrimitive.Root;\nconst SheetTrigger = SheetPrimitive.Trigger;\nconst SheetClose = SheetPrimitive.Close;\nconst SheetPortal = SheetPrimitive.Portal;\n\nconst SheetOverlay = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Overlay\n    ref={ref}\n    className={cn(\n      \"fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n      className,\n    )}\n    {...props}\n  />\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst sheetVariants = cva(\n  \"fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500\",\n  {\n    variants: {\n      side: {\n        top: \"inset-x-0 top-0 border-b border-border data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n        bottom:\n          \"inset-x-0 bottom-0 border-t border-border data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n        left: \"inset-y-0 left-0 h-full w-3/4 border-r border-border data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm\",\n        right:\n          \"inset-y-0 right-0 h-full w-3/4 border-l border-border data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm\",\n      },\n    },\n    defaultVariants: { side: \"right\" },\n  },\n);\n\ninterface SheetContentProps\n  extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,\n    VariantProps<typeof sheetVariants> {}\n\nconst SheetContent = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Content>,\n  SheetContentProps\n>(({ side = \"right\", className, children, ...props }, ref) => (\n  <SheetPortal>\n    <SheetOverlay />\n    <SheetPrimitive.Content\n      ref={ref}\n      className={cn(sheetVariants({ side }), className)}\n      {...props}>\n      {children}\n      <SheetPrimitive.Close className='absolute right-4 top-4 cursor-pointer rounded opacity-70 transition-opacity hover:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none'>\n        <svg\n          className='h-4 w-4'\n          viewBox='0 0 24 24'\n          fill='none'\n          stroke='currentColor'\n          strokeWidth='2'\n          strokeLinecap='round'\n          strokeLinejoin='round'>\n          <path d='M18 6 6 18M6 6l12 12' />\n        </svg>\n        <span className='sr-only'>Cerrar</span>\n      </SheetPrimitive.Close>\n    </SheetPrimitive.Content>\n  </SheetPortal>\n));\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\nconst SheetHeader = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"flex flex-col space-y-2 text-center sm:text-left\",\n      className,\n    )}\n    {...props}\n  />\n);\nSheetHeader.displayName = \"SheetHeader\";\n\nconst SheetFooter = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\",\n      className,\n    )}\n    {...props}\n  />\n);\nSheetFooter.displayName = \"SheetFooter\";\n\nconst SheetTitle = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Title\n    ref={ref}\n    className={cn(\"text-lg font-semibold text-foreground\", className)}\n    {...props}\n  />\n));\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nconst SheetDescription = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Description\n    ref={ref}\n    className={cn(\"text-sm text-muted-foreground\", className)}\n    {...props}\n  />\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\nexport {\n  Sheet,\n  SheetPortal,\n  SheetOverlay,\n  SheetTrigger,\n  SheetClose,\n  SheetContent,\n  SheetHeader,\n  SheetFooter,\n  SheetTitle,\n  SheetDescription,\n};\n"
+      "content": "import * as SheetPrimitive from \"@radix-ui/react-dialog\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nconst Sheet = SheetPrimitive.Root;\nconst SheetTrigger = SheetPrimitive.Trigger;\nconst SheetClose = SheetPrimitive.Close;\nconst SheetPortal = SheetPrimitive.Portal;\n\nconst SheetOverlay = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Overlay\n    ref={ref}\n    className={cn(\n      \"fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\",\n      className,\n    )}\n    {...props}\n  />\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst sheetVariants = cva(\n  \"fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500\",\n  {\n    variants: {\n      side: {\n        top: \"inset-x-0 top-0 border-b border-border data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top\",\n        bottom:\n          \"inset-x-0 bottom-0 border-t border-border data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom\",\n        left: \"inset-y-0 left-0 h-full w-3/4 border-r border-border data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm\",\n        right:\n          \"inset-y-0 right-0 h-full w-3/4 border-l border-border data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm\",\n      },\n    },\n    defaultVariants: { side: \"right\" },\n  },\n);\n\ninterface SheetContentProps\n  extends\n    React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,\n    VariantProps<typeof sheetVariants> {}\n\nconst SheetContent = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Content>,\n  SheetContentProps\n>(({ side = \"right\", className, children, ...props }, ref) => (\n  <SheetPortal>\n    <SheetOverlay />\n    <SheetPrimitive.Content ref={ref} className={cn(sheetVariants({ side }), className)} {...props}>\n      {children}\n      <SheetPrimitive.Close className=\"absolute right-4 top-4 cursor-pointer rounded opacity-70 transition-opacity hover:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none\">\n        <svg\n          className=\"h-4 w-4\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          strokeWidth=\"2\"\n          strokeLinecap=\"round\"\n          strokeLinejoin=\"round\"\n        >\n          <path d=\"M18 6 6 18M6 6l12 12\" />\n        </svg>\n        <span className=\"sr-only\">Cerrar</span>\n      </SheetPrimitive.Close>\n    </SheetPrimitive.Content>\n  </SheetPortal>\n));\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\nconst SheetHeader = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div className={cn(\"flex flex-col space-y-2 text-center sm:text-left\", className)} {...props} />\n);\nSheetHeader.displayName = \"SheetHeader\";\n\nconst SheetFooter = ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2\", className)}\n    {...props}\n  />\n);\nSheetFooter.displayName = \"SheetFooter\";\n\nconst SheetTitle = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Title\n    ref={ref}\n    className={cn(\"text-lg font-semibold text-foreground\", className)}\n    {...props}\n  />\n));\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nconst SheetDescription = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Description\n    ref={ref}\n    className={cn(\"text-sm text-muted-foreground\", className)}\n    {...props}\n  />\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\nexport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetOverlay,\n  SheetPortal,\n  SheetTitle,\n  SheetTrigger,\n};\n"
     },
     {
       "path": "components/base/Sheet.md",