@scmlatam/web-ui 0.2.50 → 0.2.53

package/dist/src/components/core/dashboard/sidebar/Content.d.ts

@@ -1,3 +1,3 @@
 import { ContentProps } from '../../types/types';
-declare const Content: ({ state, setState, groups, tooltips }: ContentProps) => import("react").JSX.Element;
+declare const Content: ({ id, state, setState, groups, tooltips }: ContentProps) => import("react").JSX.Element;
 export default Content;

package/dist/src/components/core/dashboard/sidebar/Footer.d.ts

@@ -1,3 +1,3 @@
 import { FooterProps } from '../../types/types';
-declare const Footer: ({ state, signOut }: FooterProps) => import("react").JSX.Element;
+declare const Footer: ({ id, state, signOut }: FooterProps) => import("react").JSX.Element;
 export default Footer;

package/dist/src/components/core/dashboard/sidebar/Header.d.ts

@@ -1,3 +1,3 @@
 import { HeaderProps } from '../../types/types';
-declare const Header: ({ tooltips, state, setState }: HeaderProps) => import("react").JSX.Element;
+declare const Header: ({ id, tooltips, state, setState }: HeaderProps) => import("react").JSX.Element;
 export default Header;

package/dist/src/rb-components/auth/components/AuthLanguageDropdown.d.ts

@@ -6,9 +6,10 @@ interface AuthLanguage {
     onClick: () => void;
 }
 interface AuthLanguageDropdownProps {
+    id?: string;
     languages: AuthLanguage[];
     value: string;
     onChange: (code: string) => void;
 }
-export declare function AuthLanguageDropdown({ languages, value, onChange, }: AuthLanguageDropdownProps): import("react").JSX.Element | null;
+export declare function AuthLanguageDropdown({ id, languages, value, onChange, }: AuthLanguageDropdownProps): import("react").JSX.Element | null;
 export {};

package/dist/src/rb-components/auth/components/AuthPasswordInput.d.ts

@@ -1,5 +1,6 @@
 import { KeyboardEventHandler } from 'react';
 interface AuthPasswordInputProps {
+    id?: string;
     value: string;
     onChange: (value: string) => void;
     label: string;
@@ -8,5 +9,5 @@ interface AuthPasswordInputProps {
     autoComplete?: string;
     onKeyDown?: KeyboardEventHandler<HTMLInputElement>;
 }
-export declare function AuthPasswordInput({ value, onChange, label, placeholder, disabled, autoComplete, onKeyDown, }: AuthPasswordInputProps): import("react").JSX.Element;
+export declare function AuthPasswordInput({ id, value, onChange, label, placeholder, disabled, autoComplete, onKeyDown, }: AuthPasswordInputProps): import("react").JSX.Element;
 export {};

package/dist/src/rb-components/feedback/empty-state/EmptyState.d.ts

@@ -7,6 +7,7 @@ export interface EmptyStateAction {
     disabled?: boolean;
 }
 export interface EmptyStateProps {
+    id?: string;
     variant?: EmptyStateVariant;
     context?: EmptyStateContext;
     icon?: ReactNode;
@@ -24,5 +25,5 @@ export interface EmptyStateProps {
     hideSecondaryAction?: boolean;
     className?: string;
 }
-export declare function EmptyState({ variant, context, icon, title, description, primaryAction, secondaryAction, permissions, onGoHome, homePath, hideIcon, hideTitle, hideDescription, hidePrimaryAction, hideSecondaryAction, className, }: EmptyStateProps): import("react").JSX.Element;
+export declare function EmptyState({ id, variant, context, icon, title, description, primaryAction, secondaryAction, permissions, onGoHome, homePath, hideIcon, hideTitle, hideDescription, hidePrimaryAction, hideSecondaryAction, className, }: EmptyStateProps): import("react").JSX.Element;
 export default EmptyState;

package/dist/src/rb-components/feedback/message-alert/MessageAlert.d.ts

@@ -6,6 +6,7 @@ export interface MessageAlertAction {
     disabled?: boolean;
 }
 export interface MessageAlertProps {
+    id?: string;
     type?: MessageAlertType;
     title?: ReactNode;
     children?: ReactNode;
@@ -16,5 +17,5 @@ export interface MessageAlertProps {
     hideIcon?: boolean;
     className?: string;
 }
-export declare function MessageAlert({ type, title, children, message, onClose, closeLabel, actions, hideIcon, className, }: MessageAlertProps): import("react").JSX.Element;
+export declare function MessageAlert({ id, type, title, children, message, onClose, closeLabel, actions, hideIcon, className, }: MessageAlertProps): import("react").JSX.Element;
 export default MessageAlert;

package/dist/src/rb-components/feedback/system-alert/SystemAlert.d.ts

@@ -1,5 +1,6 @@
 import { default as React } from 'react';
 export interface SystemAlertProps {
+    id?: string;
     /**
      * Texto accesible por defecto
      * para el botón de cierre.
@@ -9,5 +10,5 @@ export interface SystemAlertProps {
      */
     closeLabel?: string;
 }
-declare const SystemAlert: ({ closeLabel, }: SystemAlertProps) => React.ReactPortal | null;
-export { SystemAlert, };
+declare const SystemAlert: ({ id, closeLabel }: SystemAlertProps) => React.ReactPortal | null;
+export { SystemAlert };

package/dist/src/rb-components/navigation/PillsTabs.d.ts

@@ -37,11 +37,12 @@ export type PillsTabItem<Value extends string = string> = {
     disabled?: boolean;
 };
 export type PillsTabsProps<Value extends string = string> = {
+    id?: string;
     value: Value;
     items: PillsTabItem<Value>[];
     onChange: (value: Value) => void;
     className?: string;
     ariaLabel?: string;
 };
-export declare function PillsTabs<Value extends string = string>({ value, items, onChange, className, ariaLabel, }: PillsTabsProps<Value>): React.JSX.Element;
+export declare function PillsTabs<Value extends string = string>({ id, value, items, onChange, className, ariaLabel, }: PillsTabsProps<Value>): React.JSX.Element;
 export default PillsTabs;

package/dist/src/rb-components/navigation/TabPanel.d.ts

@@ -36,6 +36,7 @@ export type TabPanelItem<Value extends string = string> = {
     disabled?: boolean;
 };
 export type TabPanelProps<Value extends string = string> = {
+    id?: string;
     value: Value;
     items: TabPanelItem<Value>[];
     onChange: (value: Value) => void;
@@ -45,5 +46,5 @@ export type TabPanelProps<Value extends string = string> = {
     className?: string;
     children?: React.ReactNode;
 };
-export declare function TabPanel<Value extends string = string>({ value, items, onChange, onClose, closeLabel, ariaLabel, className, children, }: TabPanelProps<Value>): React.JSX.Element;
+export declare function TabPanel<Value extends string = string>({ id, value, items, onChange, onClose, closeLabel, ariaLabel, className, children, }: TabPanelProps<Value>): React.JSX.Element;
 export default TabPanel;

package/dist/src/rb-components/shell/Breadcrumbs.d.ts

@@ -4,6 +4,7 @@ export type BreadcrumbItem = {
     to?: string;
 };
 export interface BreadcrumbsProps {
+    id?: string;
     items?: BreadcrumbItem[];
     separator?: ReactNode;
     className?: string;
@@ -29,4 +30,4 @@ export interface BreadcrumbsProps {
         value: string;
     }) => ReactNode;
 }
-export default function Breadcrumbs({ items, separator, className, queryKeys, includeHome, homeLabel, homeTo, labelFormatter, }: BreadcrumbsProps): import("react").JSX.Element | null;
+export default function Breadcrumbs({ id, items, separator, className, queryKeys, includeHome, homeLabel, homeTo, labelFormatter, }: BreadcrumbsProps): import("react").JSX.Element | null;

package/dist/src/rb-components/sidebar/Sidebar.d.ts

@@ -1,8 +1,9 @@
 import { SidebarProps } from '../../components/core/types/types';
 type ResponsiveSidebarProps = SidebarProps & {
+    id?: string;
     isMobile?: boolean;
     mobileOpen?: boolean;
     onCloseMobile?: () => void;
 };
-declare const Sidebar: ({ items, signOut, tooltips, state, setState, getWidth, isMobile, mobileOpen, onCloseMobile, }: ResponsiveSidebarProps) => import("react").JSX.Element | null;
+declare const Sidebar: ({ id, items, signOut, tooltips, state, setState, getWidth, isMobile, mobileOpen, onCloseMobile, }: ResponsiveSidebarProps) => import("react").JSX.Element | null;
 export { Sidebar };

package/dist/src/rb-components/table/RbTable.d.ts

@@ -1,3 +1,3 @@
 import { default as React } from 'react';
 import { RbTableBaseRow, RbTableProps } from './types';
-export declare function RbTable<Row extends RbTableBaseRow = RbTableBaseRow>({ columns, rows, loading, getRowKey, title, description, toolbarLeft, toolbarRight, showToolbar, toolbarClassName, emptyText, emptyState, className, rootClassName, bodyClassName, size, fill, density, maxHeight, onRowClick, onCellContextMenu, rowClassName, getCellClassName, getRowClassName, checkboxSelection, rowSelectionModel, setRowSelectionModel, onRowSelectionModelChange, isRowSelectable, disableRowSelectionOnClick, pinnedColumns, initialState, paginate, paginationMode, paginationModel, setPaginationModel, onPaginationModelChange, rowCount, defaultRowsPerPage, rowsPerPageOptions, resultsLabel, viewAllLabel, prevAriaLabel, nextAriaLabel, footer, footerActions, hideFooter, }: RbTableProps<Row>): React.JSX.Element;
+export declare function RbTable<Row extends RbTableBaseRow = RbTableBaseRow>({ id, columns, rows, loading, getRowKey, title, description, toolbarLeft, toolbarRight, showToolbar, toolbarClassName, emptyText, emptyState, className, rootClassName, bodyClassName, size, fill, density, maxHeight, onRowClick, onCellContextMenu, rowClassName, getCellClassName, getRowClassName, checkboxSelection, rowSelectionModel, setRowSelectionModel, onRowSelectionModelChange, isRowSelectable, disableRowSelectionOnClick, pinnedColumns, initialState, paginate, paginationMode, paginationModel, setPaginationModel, onPaginationModelChange, rowCount, defaultRowsPerPage, rowsPerPageOptions, resultsLabel, viewAllLabel, prevAriaLabel, nextAriaLabel, footer, footerActions, hideFooter, }: RbTableProps<Row>): React.JSX.Element;

package/dist/src/rb-components/table/RbTableToolbar.d.ts

@@ -43,11 +43,12 @@ import { default as React } from 'react';
  * - data-toolbar-actions y rbToolbarActions continúan soportados.
  */
 export type RbTableToolbarProps = {
+    id?: string;
     title?: React.ReactNode;
     description?: React.ReactNode;
     left?: React.ReactNode;
     right?: React.ReactNode;
     className?: string;
 };
-export declare function RbTableToolbar({ title, description, left, right, className, }: RbTableToolbarProps): React.JSX.Element | null;
+export declare function RbTableToolbar({ id, title, description, left, right, className, }: RbTableToolbarProps): React.JSX.Element | null;
 export default RbTableToolbar;

package/dist/src/rb-components/table/types.d.ts

@@ -41,7 +41,7 @@ export type RbTableBaseRow = {
     [key: string]: any;
 };
 export type RbTableDensity = "compact" | "comfortable";
-export type RbTableSize = "s" | "m" | "l";
+export type RbTableSize = "s" | "m" | "l" | "f";
 export type RbTableAlign = "left" | "center" | "right";
 export type RbTablePinnedColumns = {
     left?: string[];
@@ -169,15 +169,15 @@ export type RbRowsPerPageOption = number | {
     label: string;
 };
 /**
-* Define cómo se resuelve la paginación de la tabla.
-*
-* client:
-* La tabla recibe todos los rows y realiza el corte internamente.
-*
-* server:
-* La tabla recibe solamente los rows de la página actual.
-* El consumidor es responsable de consultar el backend.
-*/
+ * Define cómo se resuelve la paginación de la tabla.
+ *
+ * client:
+ * La tabla recibe todos los rows y realiza el corte internamente.
+ *
+ * server:
+ * La tabla recibe solamente los rows de la página actual.
+ * El consumidor es responsable de consultar el backend.
+ */
 export type RbTablePaginationMode = "client" | "server";
 /**
  * Estado actual de paginación.
@@ -189,6 +189,7 @@ export type RbTablePaginationModel = {
     pageSize: number;
 };
 export type RbTableProps<Row extends RbTableBaseRow = RbTableBaseRow> = {
+    id?: string;
     columns?: RbAnyTableColumn<Row>[];
     rows?: Row[];
     loading?: boolean;
@@ -218,7 +219,7 @@ export type RbTableProps<Row extends RbTableBaseRow = RbTableBaseRow> = {
      * Altura máxima del body de la tabla. Acepta el mismo formato que el ancho
      * de columnas: number => px, o cualquier string CSS válido ("20rem", "50vh", etc).
      * Si no se define, se usa el valor por defecto asociado a 'size'.
-     * Se ignora cuando 'fill' está activo.
+     * Se ignora cuando 'fill' está activo o 'size' es "f".
      */
     maxHeight?: number | string;
     onRowClick?: (row: Row, index: number) => void;

package/dist/src/rb-components/topbar/TopBar.d.ts

@@ -2,9 +2,10 @@ import { DashboardProps } from '../../components/core/types/types';
 type AccountType = DashboardProps["account"];
 type SidebarItemsType = DashboardProps["sidebar"]["items"];
 interface TopBarProps {
+    id?: string;
     account: AccountType;
     sidebarItems: SidebarItemsType;
     onOpenMobile?: () => void;
 }
-declare const TopBar: ({ account, sidebarItems, onOpenMobile, }: TopBarProps) => import("react").JSX.Element;
+declare const TopBar: ({ id, account, sidebarItems, onOpenMobile }: TopBarProps) => import("react").JSX.Element;
 export { TopBar };

package/dist/src/rb-components/topbar/TopBarUserMenu.d.ts

@@ -1,7 +1,8 @@
 import { DashboardProps } from '../../components/core/types/types';
 type AccountType = DashboardProps["account"];
 interface TopBarUserMenuProps {
+    id?: string;
     account: AccountType;
 }
-declare const TopBarUserMenu: ({ account }: TopBarUserMenuProps) => import("react").JSX.Element;
+declare const TopBarUserMenu: ({ id, account }: TopBarUserMenuProps) => import("react").JSX.Element;
 export { TopBarUserMenu };

package/dist/src/rb-components/ui/overlays/Tooltip.d.ts

@@ -1,6 +1,7 @@
 import { default as React } from 'react';
 type TooltipPlacement = "bottom" | "right";
 export interface TooltipProps {
+    id?: string;
     content: React.ReactNode;
     children: React.ReactNode;
     placement?: TooltipPlacement;
@@ -11,5 +12,5 @@ export interface TooltipProps {
     openDelay?: number;
     closeDelay?: number;
 }
-export default function Tooltip({ content, children, placement, multiline, disabled, triggerClassName, className, openDelay, closeDelay, }: TooltipProps): React.JSX.Element;
+export default function Tooltip({ id, content, children, placement, multiline, disabled, triggerClassName, className, openDelay, closeDelay, }: TooltipProps): React.JSX.Element;
 export {};

package/dist/src/rb-components/ui/primitives/Input.d.ts

@@ -11,6 +11,7 @@ export type BaseInputProps = {
     unstyled?: boolean;
     infoTooltip?: React.ReactNode;
     infoAriaLabel?: string;
+    showCounter?: boolean;
 };
 type TextInputProps = BaseInputProps & Omit<React.InputHTMLAttributes<HTMLInputElement>, "size"> & {
     as?: "input";

package/dist/src/rb-components/ui/primitives/RbContextMenu.d.ts

@@ -20,6 +20,7 @@ export type RbContextMenuItem = {
     className?: string;
 };
 export type RbContextMenuProps = {
+    id?: string;
     open: boolean;
     position?: RbContextMenuPosition | null;
     x?: number | null;
@@ -36,5 +37,5 @@ export type RbContextMenuProps = {
     closeOnResize?: boolean;
     onClose: () => void;
 };
-export declare function RbContextMenu({ open, position, x, y, align, items, variant, ariaLabel, emptyText, className, itemClassName, closeOnClickOutside, closeOnScroll, closeOnResize, onClose, }: RbContextMenuProps): React.JSX.Element | null;
+export declare function RbContextMenu({ id, open, position, x, y, align, items, variant, ariaLabel, emptyText, className, itemClassName, closeOnClickOutside, closeOnScroll, closeOnResize, onClose, }: RbContextMenuProps): React.JSX.Element | null;
 export default RbContextMenu;

package/dist/src/rb-components/ui/primitives/RbInlineChipField.d.ts

@@ -4,6 +4,7 @@ type RbInlineChipFieldType = "text" | "date" | "time" | "datetime-local";
 type RbInlineChipFieldVariant = "default" | "success" | "warning" | "error" | "info" | "neutral";
 type DateSeparator = "-" | "/";
 export type RbInlineChipFieldAction = {
+    id?: string;
     label: React.ReactNode;
     icon?: React.ReactNode;
     helper?: React.ReactNode;
@@ -15,6 +16,7 @@ export type RbInlineChipFieldAction = {
     closeOnSelect?: boolean;
 };
 export type RbInlineChipFieldProps = {
+    id?: string;
     value?: string | null;
     placeholder?: string;
     type?: RbInlineChipFieldType;
@@ -45,5 +47,5 @@ export type RbInlineChipFieldProps = {
 };
 export declare function CalendarChipIcon(): React.JSX.Element;
 export declare function ClockChipIcon(): React.JSX.Element;
-export declare function RbInlineChipField({ value, placeholder, type, variant, dateSeparator, editable, disabled, icon, showIcon, actions, showMenu, menuVariant, onChange, onClick, className, inputClassName, ariaLabel, }: RbInlineChipFieldProps): React.JSX.Element;
+export declare function RbInlineChipField({ id, value, placeholder, type, variant, dateSeparator, editable, disabled, icon, showIcon, actions, showMenu, menuVariant, onChange, onClick, className, inputClassName, ariaLabel, }: RbInlineChipFieldProps): React.JSX.Element;
 export default RbInlineChipField;

package/dist/src/stories/rb/RbTable.stories.d.ts

@@ -27,4 +27,10 @@ declare const meta: {
 export default meta;
 type Story = StoryObj<typeof meta>;
 export declare const Basica: Story;
+export declare const Full: Story;
+export declare const Vacia: Story;
+export declare const VaciaMediana: Story;
+export declare const VaciaGrande: Story;
+export declare const VaciaFull: Story;
+export declare const VaciaPersonalizada: Story;
 export declare const ConToolbarYFiltros: Story;