@producteca/producteca-ui-kit 1.86.0 → 1.87.0

package/dist/components/link/index.d.ts

@@ -1,2 +1,3 @@
-export { Link, type LinkProps, type LinkSize, type LinkDecoration, type LinkWeight } from './link';
+export { Link } from './link';
+export type { LinkProps, LinkSize, LinkDecoration, LinkVariant, LinkWeight } from './link.types';
 export { Link as default } from './link';

package/dist/components/link/link.d.ts

@@ -1,17 +1,6 @@
 import { default as React } from 'react';
+import { LinkProps } from './link.types';
 
-type LinkSize = 'sm' | 'md' | 'lg';
-type LinkDecoration = 'none' | 'underline';
-type LinkWeight = 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
-export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
-    size?: LinkSize;
-    decoration?: LinkDecoration;
-    weight?: LinkWeight;
-    disabled?: boolean;
-    href: string;
-    onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
-    children: React.ReactNode;
-}
 export declare const Link: React.MemoExoticComponent<React.ForwardRefExoticComponent<LinkProps & React.RefAttributes<HTMLAnchorElement>>>;
-export type { LinkSize, LinkDecoration, LinkWeight };
+export type { LinkProps, LinkSize, LinkDecoration, LinkVariant, LinkWeight } from './link.types';
 export default Link;

package/dist/components/link/link.types.d.js

@@ -0,0 +1 @@
+export {};

package/dist/components/link/link.types.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+
+export type LinkSize = 'sm' | 'md' | 'lg';
+export type LinkDecoration = 'none' | 'underline';
+export type LinkVariant = 'default' | 'tooltip-link';
+export type LinkWeight = 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900;
+export interface LinkProps extends React.AnchorHTMLAttributes<HTMLAnchorElement> {
+    size?: LinkSize;
+    decoration?: LinkDecoration;
+    variant?: LinkVariant;
+    weight?: LinkWeight;
+    disabled?: boolean;
+    href?: string;
+    onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
+    children: React.ReactNode;
+}

package/dist/components/menu/menuItem/menuItem.types.d.ts

@@ -1,6 +1,6 @@
 import { default as React } from 'react';
 import { ButtonProps } from '../../button/button';
-import { BaseTooltipProps } from '../../tooltip/tooltip';
+import { BaseTooltipProps } from '../../tooltip/tooltip.types';
 
 export interface MenuItemTooltipProps extends Omit<BaseTooltipProps, 'trigger'> {
     content: string | React.ReactNode;

package/dist/components/tooltip/index.d.ts

@@ -1,3 +1,3 @@
 export { OverflowChecker } from './overflowChecker';
 export { WithTooltip, WithOverflowTooltip } from './tooltip';
-export type { WithTooltipProps, CombinedTooltipProps, TooltipPlacement, BaseTooltipProps, TooltipTrigger, } from './tooltip';
+export type { WithTooltipProps, CombinedTooltipProps, TooltipPlacement, BaseTooltipProps, TooltipTrigger, } from './tooltip.types';

package/dist/components/tooltip/tooltip.d.ts

@@ -1,21 +1,5 @@
-import { default as React } from 'react';
+import { CombinedTooltipProps, WithTooltipProps } from './tooltip.types';
 
-export type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
-export type TooltipTrigger = 'hover' | 'click';
-export interface BaseTooltipProps {
-    content?: string | React.ReactNode;
-    placement?: TooltipPlacement;
-    arrow?: boolean;
-    maxWidth?: number | string;
-    trigger?: TooltipTrigger;
-    shouldShowTooltip?: boolean;
-}
-export interface WithTooltipProps extends BaseTooltipProps {
-    children: React.ReactElement;
-    slotProps?: any;
-}
 export declare const WithTooltip: ({ children, content, placement, arrow, maxWidth, trigger, shouldShowTooltip, slotProps: customSlotProps, ...otherProps }: WithTooltipProps) => import("react/jsx-runtime").JSX.Element;
-export interface CombinedTooltipProps extends BaseTooltipProps {
-    children: React.ReactElement;
-}
 export declare const WithOverflowTooltip: ({ content, children, ...tooltipProps }: CombinedTooltipProps) => import("react/jsx-runtime").JSX.Element;
+export type { TooltipPlacement, TooltipTrigger, BaseTooltipProps, WithTooltipProps, CombinedTooltipProps, } from './tooltip.types';

package/dist/components/tooltip/tooltip.examples.d.js

@@ -0,0 +1 @@
+export {};

package/dist/components/tooltip/tooltip.examples.d.ts

@@ -0,0 +1,9 @@
+import { BaseTooltipProps } from './index';
+
+export type TooltipStoryArgs = BaseTooltipProps;
+export declare const bulletListContent: import("react/jsx-runtime").JSX.Element;
+export declare const renderHoverLabelTooltip: (args: TooltipStoryArgs) => import("react/jsx-runtime").JSX.Element;
+export declare const renderClickLabelTooltip: (args: TooltipStoryArgs) => import("react/jsx-runtime").JSX.Element;
+export declare const renderOverflowLabelTooltip: (args: TooltipStoryArgs) => import("react/jsx-runtime").JSX.Element;
+export declare const renderButtonTooltip: (args: TooltipStoryArgs) => import("react/jsx-runtime").JSX.Element;
+export declare const renderDisabledButtonTooltip: (args: TooltipStoryArgs) => import("react/jsx-runtime").JSX.Element;

package/dist/components/tooltip/tooltip.types.d.js

@@ -0,0 +1 @@
+export {};

package/dist/components/tooltip/tooltip.types.d.ts

@@ -0,0 +1,20 @@
+import { default as React } from 'react';
+import { TooltipProps } from '@mui/material/Tooltip';
+
+export type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
+export type TooltipTrigger = 'hover' | 'click';
+export interface BaseTooltipProps {
+    content?: string | React.ReactNode;
+    placement?: TooltipPlacement;
+    arrow?: boolean;
+    maxWidth?: number | string;
+    trigger?: TooltipTrigger;
+    shouldShowTooltip?: boolean;
+}
+export interface WithTooltipProps extends BaseTooltipProps {
+    children: React.ReactElement;
+    slotProps?: TooltipProps['slotProps'];
+}
+export interface CombinedTooltipProps extends BaseTooltipProps {
+    children: React.ReactElement;
+}

package/dist/locales/description.d.ts

@@ -17,7 +17,7 @@ export declare const breadcrumbItemFormat = "\n  ## Formato de BreadcrumbItem\n\
 export declare const menuItems = "Lista de \u00EDtems que se mostrar\u00E1n en el men\u00FA.\n      \n**Tipo:** `MenuActionItem[]`\n\n```ts\ninterface MenuActionItem {\n  label: React.ReactNode\n  icon?: React.ReactElement\n  onClick?: () => void\n  selected?: boolean\n  disabled?: boolean\n}\n```\n";
 export declare const draggableListExample = "\n## Uso del componente\n\nEl componente `DraggableList` permite crear listas de items arrastrables con un componente personalizado para cada item.\n\n**`value`** acepta dos formatos:\n- **string[]**: `[\"valor1\", \"valor2\"]` \u2014 `onChange` devuelve un array de strings.\n- **{ id, value }[]**: `[{ id: 'item-1', value: 'valor1' }, ...]` \u2014 `onChange` devuelve el mismo formato de objetos.\n\n**`canRemove`**: funci\u00F3n opcional `(item: DraggableItem) => boolean`. Se eval\u00FAa por cada item; si devuelve `false`, el bot\u00F3n de eliminar se muestra deshabilitado para ese item.\n\n**`showRemoveAction`**: si es `false`, no se muestra el bot\u00F3n de eliminar en ninguna fila. Por defecto `true`.\n\n### Ejemplo con objetos (id + value):\n\n```tsx\n<DraggableList\n  label=\"Seleccionar un deposito\"\n  addLabel=\"+ Agregar\"\n  itemComponent={SelectField}\n  componentProps={{\n    placeholder: 'Seleccionar...',\n    options: [\n      { value: 'option1', label: 'Opci\u00F3n 1' },\n      { value: 'option2', label: 'Opci\u00F3n 2' },\n    ],\n    size: 'md',\n  }}\n  value={[\n    { id: 'item-1', value: 'option1' },\n    { id: 'item-2', value: 'option2' },\n  ]}\n  onChange={(event) => console.log('Items actualizados:', event.target.value)}\n/>\n```\n\n### Ejemplo con array de strings:\n\n```tsx\n<DraggableList\n  label=\"Nombres\"\n  addLabel=\"+ Agregar\"\n  itemComponent={FormField}\n  componentProps={{ placeholder: 'Texto', size: 'md', type: 'text' }}\n  value={['Uno', 'Dos']}\n  onChange={(event) => setValues(event.target.value)}\n/>\n```\n\n### Ejemplo con Redux Form (Field):\n\n```tsx\n<Field\n  name=\"warehouses\"\n  component={DraggableList}\n  itemComponent={FormField}\n  label=\"Dep\u00F3sitos\"\n  addLabel=\"+ Agregar\"\n  componentProps={{\n    placeholder: 'Nombre del dep\u00F3sito',\n    size: 'md',\n    type: 'text',\n  }}\n  value={[\n    { id: 'item-1', value: 'Texto 1' },\n    { id: 'item-2', value: 'Texto 2' },\n  ]}\n/>\n```\n";
 export declare const switchInputExample = "\n## Uso del componente\n\nEl componente `SwitchInput` / `SwitchInputGroup` muestra switches (toggle) individuales o en grupo. Soporta tama\u00F1os `sm`, `md`, `lg` e integraci\u00F3n con Redux Form.\n\n### Ejemplo b\u00E1sico (grupo):\n\n```tsx\n<SwitchInputGroup\n  name=\"options\"\n  title=\"Opciones\"\n  size=\"md\"\n  items={[\n    { id: '1', label: 'Opci\u00F3n 1' },\n    { id: '2', label: 'Opci\u00F3n 2' },\n    { id: '3', label: 'Opci\u00F3n 3', disabled: true },\n  ]}\n  onChange={(event) => handleChange(event.target.value)}\n/>\n```\n\n### Ejemplo (un solo switch):\n\n```tsx\nconst [checked, setChecked] = React.useState(false)\n\n<SwitchInput\n  name=\"toggle\"\n  checked={checked}\n  onChange={(e) => setChecked(e.target.checked)}\n  label=\"Activar\"\n  title=\"Configuraci\u00F3n\"\n/>\n```\n";
-export declare const linkExample = "\n## Uso del componente\n\nEl componente `Link` renderiza un enlace con estilos del design system. Soporta tama\u00F1os (`sm`, `md`, `lg`), decoraci\u00F3n (`none`, `underline`) y estado `disabled`.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<Link href=\"/productos\" size=\"md\">\n  Ver productos\n</Link>\n```\n\n### Con underline y tama\u00F1o:\n\n```tsx\n<Link href=\"/historial\" decoration=\"underline\" size=\"lg\">\n  Historial de cambios\n</Link>\n```\n";
+export declare const linkExample = "\n## Uso del componente\n\nEl componente `Link` renderiza un enlace con estilos del design system. Soporta tama\u00F1os (`sm`, `md`, `lg`), decoraci\u00F3n (`none`, `underline`), variantes (`default`, `tooltip-link`) y estado `disabled`. El prop `href` es opcional: si se omite, el link se renderiza como una acci\u00F3n con `role=\"button\"` y activable por teclado.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<Link href=\"/productos\" size=\"md\">\n  Ver productos\n</Link>\n```\n\n### Con underline y tama\u00F1o:\n\n```tsx\n<Link href=\"/historial\" decoration=\"underline\" size=\"lg\">\n  Historial de cambios\n</Link>\n```\n\n### Dentro de un tooltip (fondo oscuro, sin href):\n\n```tsx\n<Link variant=\"tooltip-link\" size=\"sm\" onClick={handleClick}>\n  Ver detalle\n</Link>\n```\n";
 export declare const alertExample = "\n## Uso del componente\n\nEl componente `Alert` muestra mensajes de feedback con variantes `success`, `error`, `warning` e `info`. Soporta \u00EDcono personalizado y link de acci\u00F3n.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<Alert\n  variant=\"success\"\n  message=\"Operaci\u00F3n completada correctamente.\"\n/>\n```\n\n### Con link:\n\n```tsx\n<Alert\n  variant=\"info\"\n  message=\"Revis\u00E1 tu bandeja de entrada.\"\n  link={{\n    text: 'No volver a mostrar',\n    href: '#',\n  }}\n/>\n```\n";
 export declare const buttonExample = "\n## Uso del componente\n\nEl componente `Button` renderiza un bot\u00F3n con variantes (`primary`, `secondary`, `success`, `error`, `link`, `tooltip-link`), tama\u00F1os y soporte para iconos.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<Button\n  variant=\"primary\"\n  size=\"lg\"\n  label=\"Continuar\"\n  onClick={() => handleSubmit()}\n/>\n```\n\n### Con \u00EDcono:\n\n```tsx\n<Button\n  variant=\"secondary\"\n  label=\"Agregar\"\n  rightAdornment={<Add />}\n  onClick={() => openModal()}\n/>\n```\n";
 export declare const cardExample = "\n## Uso del componente\n\nEl componente `Card` muestra una tarjeta con t\u00EDtulo, descripci\u00F3n, \u00EDcono opcional y acci\u00F3n al hacer click.\n\n### Ejemplo b\u00E1sico:\n\n```tsx\n<Card\n  title=\"T\u00EDtulo\"\n  description=\"Descripci\u00F3n de la tarjeta.\"\n  icon={<CustomIcon><ShareIcon /></CustomIcon>}\n  onClick={() => navigate('/detalle')}\n  isActive={false}\n/>\n```\n";

package/dist/locales/es.d.ts

@@ -509,6 +509,9 @@ declare const _default: {
         large: string;
         withUnderline: string;
         exampleIntegrationName: string;
+        variant: string;
+        tooltipLink: string;
+        tooltipLinkDescription: string;
     };
     theme: {
         colorPalettes: string;