@ttoss/components 2.14.25 → 2.14.27

package/dist/index.d.mts

@@ -0,0 +1,910 @@
+
+import { BadgeProps, BoxProps, ButtonProps, FlexProps, InputProps, Theme, ThemeUIStyleObject } from "@ttoss/ui";
+import * as React from "react";
+import { IconType } from "@ttoss/react-icons";
+import DrawerUi from "react-modern-drawer";
+import { JsonEditor } from "json-edit-react";
+import { JsonView } from "react-json-view-lite";
+import { Options } from "react-markdown";
+import ReactModal from "react-modal";
+import { createCell, createColumnHelper, flexRender, getCoreRowModel, useReactTable } from "@tanstack/react-table";
+import { TabListProps, TabPanelProps, TabProps, TabsProps } from "react-tabs";
+import { ToastContainerProps, ToastOptions, toast as toast$1 } from "react-toastify";
+
+//#region src/components/Accordion/Accordion.d.ts
+/**
+ * Individual item for the Accordion component.
+ */
+type AccordionItem = {
+  /**
+   * Unique identifier for the accordion item.
+   * If not provided, will use the index as the key.
+   */
+  id?: string;
+  /**
+   * Title displayed in the accordion header.
+   */
+  title: React.ReactNode;
+  /**
+   * Content displayed when the accordion item is expanded.
+   */
+  content: React.ReactNode;
+  /**
+   * Whether the item is disabled.
+   * @default false
+   */
+  disabled?: boolean;
+};
+/**
+ * Render props for custom accordion item rendering.
+ */
+type AccordionRenderItemProps = {
+  /**
+   * The accordion item data.
+   */
+  item: AccordionItem;
+  /**
+   * Index of the item in the items array.
+   */
+  index: number;
+  /**
+   * Whether the item is currently expanded.
+   */
+  isExpanded: boolean;
+  /**
+   * Function to toggle the item's expanded state.
+   */
+  toggle: () => void;
+  /**
+   * Generated IDs for accessibility.
+   */
+  ids: {
+    itemId: string;
+    headingId: string;
+    panelId: string;
+  };
+};
+/**
+ * Props for the Accordion component.
+ */
+type AccordionProps = BoxProps & {
+  /**
+   * Array of accordion items to render.
+   */
+  items: AccordionItem[];
+  /**
+   * Whether multiple items can be expanded at once.
+   * @default false
+   */
+  multiple?: boolean;
+  /**
+   * Index or array of indices for initially expanded items.
+   */
+  defaultExpanded?: number | number[];
+  /**
+   * Callback invoked when items are expanded or collapsed.
+   * Receives array of currently expanded indices.
+   */
+  onAccordionChange?: (expandedIndices: number[]) => void;
+  /**
+   * Custom render function for accordion items.
+   * Provides full control over item rendering while maintaining accessibility.
+   */
+  renderItem?: (props: AccordionRenderItemProps) => React.ReactNode;
+};
+/**
+ * Accessible accordion component with collapsible content sections.
+ *
+ * This component provides a simplified API for creating expandable/collapsible
+ * content sections. It uses design tokens from @ttoss/theme for consistent styling
+ * and follows WAI-ARIA accordion pattern for accessibility.
+ *
+ * @example
+ * ```tsx
+ * <Accordion
+ *   items={[
+ *     {
+ *       title: 'Section 1',
+ *       content: 'Content for section 1',
+ *     },
+ *     {
+ *       title: 'Section 2',
+ *       content: 'Content for section 2',
+ *     },
+ *   ]}
+ * />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * <Accordion
+ *   multiple
+ *   defaultExpanded={[0, 1]}
+ *   items={[
+ *     {
+ *       id: 'item-1',
+ *       title: 'Pre-expanded Section 1',
+ *       content: <div>Rich content</div>,
+ *     },
+ *     {
+ *       id: 'item-2',
+ *       title: 'Pre-expanded Section 2',
+ *       content: <p>More content</p>,
+ *     },
+ *   ]}
+ *   onAccordionChange={(expanded) => console.log('Expanded items:', expanded)}
+ * />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Custom rendering with renderItem
+ * <Accordion
+ *   items={items}
+ *   renderItem={({ item, isExpanded, toggle, ids }) => (
+ *     <CustomAccordionItem
+ *       item={item}
+ *       isExpanded={isExpanded}
+ *       onToggle={toggle}
+ *       headingId={ids.headingId}
+ *       panelId={ids.panelId}
+ *     />
+ *   )}
+ * />
+ * ```
+ */
+declare const Accordion: ({
+  items,
+  multiple,
+  defaultExpanded,
+  onAccordionChange,
+  renderItem,
+  sx,
+  ...boxProps
+}: AccordionProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/DatePicker/DatePicker.d.ts
+interface DateRange {
+  from: Date | undefined;
+  to: Date | undefined;
+}
+interface DateRangePreset {
+  label: string;
+  getValue: () => DateRange;
+}
+interface DatePickerProps {
+  label?: string;
+  value?: DateRange;
+  presets?: DateRangePreset[];
+  onChange?: (range: DateRange | undefined) => void;
+  disabled?: boolean;
+}
+declare const DatePicker: ({
+  label,
+  value,
+  presets,
+  onChange,
+  disabled
+}: DatePickerProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/Drawer/Drawer.d.ts
+type DrawerUiProps = React.ComponentProps<typeof DrawerUi>;
+type DrawerProps = DrawerUiProps & {
+  sx?: BoxProps['sx'];
+};
+declare const Drawer: ({
+  children,
+  sx,
+  ...props
+}: DrawerProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/EnhancedTitle/EnhancedTitle.types.d.ts
+/**
+ * Visual variant for the icon wrapper.
+ */
+type EnhancedTitleVariant = 'spotlight-accent' | 'spotlight-primary' | 'primary' | 'secondary' | 'accent' | 'positive' | 'negative' | 'informative' | 'muted';
+/**
+ * Badge configuration for top and bottom badge sections.
+ */
+interface EnhancedTitleBadge {
+  /**
+   * Icon to display in the badge.
+   */
+  icon?: string;
+  /**
+   * Badge label text.
+   */
+  label: string;
+  /**
+   * Badge visual variant.
+   */
+  variant?: BadgeProps['variant'];
+}
+/**
+ * Props for the EnhancedTitle component.
+ */
+interface EnhancedTitleProps {
+  /**
+   * Visual variant for the icon wrapper.
+   * @default 'primary'
+   */
+  variant?: EnhancedTitleVariant;
+  /**
+   * Icon to display next to the title.
+   */
+  icon?: string;
+  /**
+   * Main title text (heading).
+   */
+  title: string;
+  /**
+   * Optional subtitle/description text.
+   */
+  description?: string;
+  /**
+   * Optional text displayed next to the title (e.g., price, metadata).
+   */
+  frontTitle?: string;
+  /**
+   * Badges to display above the title.
+   */
+  topBadges?: EnhancedTitleBadge[];
+  /**
+   * Badges to display below the title.
+   */
+  bottomBadges?: EnhancedTitleBadge[];
+}
+//#endregion
+//#region src/components/EnhancedTitle/EnhancedTitle.d.ts
+/**
+ * EnhancedTitle component renders a structured title section with icon, badges, and metadata.
+ *
+ * This component is useful for displaying rich title sections with status indicators,
+ * feature tags, and supplementary information in a consistent layout.
+ *
+ * @example
+ * ```tsx
+ * <EnhancedTitle
+ *   icon="fluent:shield-24-filled"
+ *   title="Starter Plan"
+ *   frontTitle="R$ 49,90/mês"
+ *   description="Perfect for small teams"
+ *   variant="primary"
+ *   topBadges={[
+ *     { label: 'Active', variant: 'positive', icon: 'fluent:checkmark-circle-24-filled' }
+ *   ]}
+ *   bottomBadges={[
+ *     { label: 'OneClick Tracking', icon: 'fluent:checkmark-24-filled' }
+ *   ]}
+ * />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * <EnhancedTitle
+ *   title="Pro Plan"
+ *   frontTitle="$99/month"
+ *   variant="accent"
+ *   topBadges={[
+ *     { label: 'Most Popular', variant: 'informative' }
+ *   ]}
+ * />
+ * ```
+ */
+declare const EnhancedTitle: ({
+  variant,
+  icon,
+  title,
+  description,
+  frontTitle,
+  topBadges,
+  bottomBadges
+}: EnhancedTitleProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/FileUploader/FileUploader.d.ts
+type UploadResult = {
+  url: string;
+  id: string | number;
+};
+type FileUploadState = {
+  file: File;
+  status: 'pending' | 'uploading' | 'completed' | 'error';
+  progress?: number;
+  result?: UploadResult;
+  error?: Error;
+};
+type OnUpload = (file: File, onProgress?: (progress: number) => void) => Promise<UploadResult>;
+type OnUploadStart = (file: File) => void;
+type OnUploadProgress = (file: File, progress: number) => void;
+type OnUploadComplete = (file: File, result: UploadResult) => void;
+type OnUploadError = (file: File, error: Error) => void;
+type OnFilesChange = (files: FileUploadState[]) => void;
+type OnRemove = (file: UploadedFile, index: number) => void;
+type UploadedFile = {
+  id: string | number;
+  name: string;
+  imageUrl?: string;
+  url: string;
+};
+type FileUploaderProps = {
+  onUpload: OnUpload;
+  onUploadStart?: OnUploadStart;
+  onUploadProgress?: OnUploadProgress;
+  onUploadComplete?: OnUploadComplete;
+  onUploadError?: OnUploadError;
+  onFilesChange?: OnFilesChange;
+  onRemove?: OnRemove;
+  accept?: string;
+  multiple?: boolean;
+  maxSize?: number;
+  maxFiles?: number;
+  disabled?: boolean;
+  autoUpload?: boolean;
+  retryAttempts?: number;
+  placeholder?: string;
+  error?: string;
+  children?: React.ReactNode;
+  showFileList?: boolean;
+  FileListComponent?: (props: {
+    files: UploadedFile[];
+    onRemove: (index: number) => void;
+  }) => React.ReactNode;
+  files?: UploadedFile[];
+};
+declare const FileUploader: ({
+  onUpload,
+  onUploadStart,
+  onUploadProgress,
+  onUploadComplete,
+  onUploadError,
+  onFilesChange,
+  onRemove,
+  accept,
+  multiple,
+  maxSize,
+  maxFiles,
+  disabled,
+  autoUpload,
+  retryAttempts,
+  placeholder,
+  error,
+  children,
+  showFileList,
+  FileListComponent,
+  files: uploadedFiles
+}: FileUploaderProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/InstallPwa/InstallPwa.d.ts
+type InstallPwaUiProps = {
+  onInstall: React.MouseEventHandler<HTMLButtonElement>;
+};
+declare const InstallPwaUi: ({
+  onInstall
+}: InstallPwaUiProps) => import("react/jsx-runtime").JSX.Element;
+declare const InstallPwa: () => import("react/jsx-runtime").JSX.Element | null;
+//#endregion
+//#region src/components/List/List.d.ts
+interface ListProps extends React.HTMLProps<HTMLUListElement> {
+  children: React.ReactNode;
+}
+declare const List: React.ForwardRefExoticComponent<Omit<ListProps, "ref"> & React.RefAttributes<HTMLUListElement>>;
+//#endregion
+//#region src/components/List/ListItem.d.ts
+interface ListItemProps extends React.HTMLProps<HTMLLIElement> {
+  children: React.ReactNode;
+}
+declare const ListItem: React.ForwardRefExoticComponent<Omit<ListItemProps, "ref"> & React.RefAttributes<HTMLLIElement>>;
+//#endregion
+//#region src/components/LockedOverlay/LockedOverlay.d.ts
+type LockedOverlayAction = {
+  /**
+   * Label text for the button
+   */
+  label: string;
+  /**
+   * Icon identifier from @ttoss/react-icons
+   */
+  icon?: string;
+  /**
+   * Button variant
+   */
+  variant: 'primary' | 'accent' | 'secondary';
+  /**
+   * Click handler for the button
+   */
+  onClick: () => void;
+};
+type LockedOverlayProps = {
+  /**
+   * Controls the overlay visibility
+   */
+  isOpen: boolean;
+  /**
+   * Optional close handler. If not provided, overlay cannot be closed by user interaction
+   */
+  onRequestClose?: () => void;
+  /**
+   * Header configuration for the SpotlightCard
+   */
+  header: {
+    /**
+     * Icon identifier from @ttoss/react-icons
+     */
+    icon: string;
+    /**
+     * Title text for the header
+     */
+    title: string;
+    /**
+     * Description text for the header
+     */
+    description: string;
+    /**
+     * Visual variant for the SpotlightCard
+     * @default 'primary'
+     */
+    variant?: 'primary' | 'accent';
+  };
+  /**
+   * Optional first button to display in the SpotlightCard header
+   */
+  firstButton?: ButtonProps | React.ReactNode;
+  /**
+   * Optional second button to display in the SpotlightCard header
+   */
+  secondButton?: ButtonProps | React.ReactNode;
+  /**
+   * Content to be rendered in the overlay body
+   */
+  children: React.ReactNode;
+  /**
+   * Optional list of actions to render as buttons in the footer
+   */
+  actions?: LockedOverlayAction[];
+  /**
+   * Optional style overrides for the overlay and content container
+   */
+  sx?: ThemeUIStyleObject<Theme<object>>;
+  /**
+   * Optional z-index value to control overlay stacking order.
+   * The overlay will appear above the parent container content.
+   * @default 1
+   *
+   * zIndex hierarchy reference:
+   * - modal: 1400
+   * - overlay: 1300 (sidebar layouts use this value)
+   * - dropdown: 1000
+   * - sticky: 1100
+   * - banner: 1200
+   */
+  zIndex?: string | number;
+};
+/**
+ * LockedOverlay is a component for blocking and displaying locked features or restricted content
+ * within a specific container.
+ *
+ * This component renders as an absolutely positioned overlay that blocks the parent container's content.
+ * The parent container must have `position: relative` for proper positioning.
+ *
+ * Unlike a modal, this component blocks only its parent container, not the entire viewport,
+ * making it ideal for blocking specific sections like Layout.Main, Layout.Main.Body, etc.
+ *
+ * @example
+ * ```tsx
+ * // Parent container must have position: relative
+ * <Layout.Main sx={{ position: 'relative' }}>
+ *   <LockedOverlay
+ *     isOpen={isOpen}
+ *     onRequestClose={() => setIsOpen(false)}
+ *     header={{
+ *       icon: "fluent:lock-closed-24-filled",
+ *       title: "Premium Feature",
+ *       description: "Available in Pro plan only",
+ *       variant: "primary"
+ *     }}
+ *     actions={[
+ *       {
+ *         label: "Upgrade Now",
+ *         icon: "fluent-emoji-high-contrast:sparkles",
+ *         variant: "primary",
+ *         onClick: handleUpgrade
+ *       },
+ *       {
+ *         label: "Learn More",
+ *         icon: "fluent:arrow-right-16-regular",
+ *         variant: "accent",
+ *         onClick: handleLearnMore
+ *       }
+ *     ]}
+ *   >
+ *     <Text>This feature is only available for Pro users.</Text>
+ *   </LockedOverlay>
+ * </Layout.Main>
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Blocking a specific section with custom zIndex
+ * <Box sx={{ position: 'relative' }}>
+ *   <LockedOverlay
+ *     isOpen={isOpen}
+ *     zIndex={10}
+ *     header={{
+ *       icon: "fluent:lock-closed-24-filled",
+ *       title: "Feature Locked",
+ *       description: "Unlock this feature"
+ *     }}
+ *   >
+ *     <Text>Content here</Text>
+ *   </LockedOverlay>
+ * </Box>
+ * ```
+ */
+declare const LockedOverlay: ({
+  isOpen,
+  onRequestClose,
+  header,
+  firstButton,
+  secondButton,
+  children,
+  actions,
+  sx,
+  zIndex
+}: LockedOverlayProps) => import("react/jsx-runtime").JSX.Element | null;
+//#endregion
+//#region src/components/Markdown/Markdown.d.ts
+type MarkdownProps = Options & {
+  children: string;
+  sx?: FlexProps['sx'];
+};
+declare const Markdown: ({
+  children,
+  sx,
+  ...props
+}: MarkdownProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/Menu/Menu.d.ts
+type MenuProps = {
+  children: React.ReactNode;
+  sx?: Record<string, unknown>;
+  menuIcon?: string;
+};
+declare const Menu: ({
+  children,
+  sx,
+  menuIcon
+}: MenuProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/MetricCard/MetricCard.types.d.ts
+/**
+ * Base metric properties shared by all metric types.
+ */
+interface BaseMetric {
+  /**
+   * Label displayed above the metric value.
+   */
+  label: string;
+  /**
+   * Optional tooltip text or action handler for additional context.
+   * When a string is provided, it displays a simple tooltip.
+   * When a function is provided, it's called when the tooltip icon is clicked.
+   */
+  tooltip?: string | (() => void);
+  /**
+   * Icon to display alongside the metric.
+   */
+  icon?: IconType;
+  /**
+   * Optional click handler to make the metric card interactive.
+   */
+  onClick?: () => void;
+  /**
+   * Optional help article action handler.
+   */
+  helpArticleAction?: () => void;
+}
+/**
+ * Date-based metric for displaying dates like expiration or renewal.
+ */
+interface DateMetric extends BaseMetric {
+  type: 'date';
+  /**
+   * The date value to display.
+   */
+  date: string;
+  /**
+   * Optional message showing remaining days.
+   */
+  remainingDaysMessage?: string;
+  /**
+   * Whether to show a warning indicator.
+   */
+  isWarning?: boolean;
+}
+/**
+ * Percentage-based metric with progress bar.
+ */
+interface PercentageMetric extends BaseMetric {
+  type: 'percentage';
+  /**
+   * Current value.
+   */
+  current: number;
+  /**
+   * Maximum value. Use null for unlimited.
+   */
+  max: number | null;
+  /**
+   * Custom formatter for displaying values.
+   */
+  formatValue?: (value: number) => string;
+  /**
+   * Percentage threshold at which to show an alert.
+   */
+  showAlertThreshold?: number;
+}
+/**
+ * Number-based metric for displaying counts.
+ */
+interface NumberMetric extends BaseMetric {
+  type: 'number';
+  /**
+   * Current value.
+   */
+  current: number;
+  /**
+   * Maximum value. Use null for unlimited.
+   */
+  max: number | null;
+  /**
+   * Custom formatter for displaying values.
+   */
+  formatValue?: (value: number) => string;
+  /**
+   * Optional footer text below the metric.
+   */
+  footerText?: string;
+}
+/**
+ * Union type for all supported metric types.
+ */
+type Metric = DateMetric | PercentageMetric | NumberMetric;
+/**
+ * Props for the MetricCard component.
+ */
+interface MetricCardProps {
+  /**
+   * The metric configuration to display.
+   */
+  metric: Metric;
+  /**
+   * Whether the card is in loading state.
+   */
+  isLoading?: boolean;
+}
+//#endregion
+//#region src/components/MetricCard/MetricCard.d.ts
+/**
+ * MetricCard component displays a metric in a consistent card layout.
+ *
+ * It supports three metric types:
+ * - **date**: displays a date and optional remaining-days message
+ * - **percentage**: displays current/max values and a progress bar
+ * - **number**: displays current/max values and an optional footer text
+ *
+ * @example
+ * ```tsx
+ * <MetricCard
+ *   metric={{
+ *     type: 'date',
+ *     label: 'Renewal date',
+ *     date: '31/12/2025',
+ *     icon: 'fluent:calendar-24-regular',
+ *     remainingDaysMessage: '10 days remaining',
+ *   }}
+ * />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * <MetricCard
+ *   metric={{
+ *     type: 'percentage',
+ *     label: 'Plan usage',
+ *     current: 350,
+ *     max: 1000,
+ *     icon: 'fluent:gauge-24-regular',
+ *     showAlertThreshold: 80,
+ *   }}
+ * />
+ * ```
+ */
+declare const MetricCard: ({
+  metric,
+  isLoading
+}: MetricCardProps) => import("react/jsx-runtime").JSX.Element | null;
+//#endregion
+//#region src/components/Modal/Modal.d.ts
+type ModalProps = ReactModal.Props;
+declare const Modal: {
+  (props: ModalProps): import("react/jsx-runtime").JSX.Element;
+  setAppElement: typeof ReactModal.setAppElement;
+};
+//#endregion
+//#region src/components/NavList/NavList.d.ts
+type NavListItem = {
+  id?: string;
+  label: string;
+  href: string;
+  icon?: string;
+  disabled?: boolean;
+  active?: boolean;
+  onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
+  group?: string;
+  divider?: boolean;
+};
+type NavListGroup = {
+  id?: string;
+  label?: string;
+  items: NavListItem[];
+  divider?: boolean;
+};
+type LinkComponentProps = {
+  href: string;
+  onClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
+  children: React.ReactNode;
+  [key: string]: unknown;
+};
+type NavListProps = {
+  items?: NavListItem[];
+  groups?: NavListGroup[];
+  variant?: 'sidebar' | 'menu' | 'dropdown';
+  onItemClick?: (item: NavListItem) => void;
+  sx?: Record<string, unknown>;
+  iconSize?: number;
+  /**
+   * Custom Link component to use for rendering links.
+   * Useful for integrating with Next.js Link, React Router Link, etc.
+   *
+   * @example
+   * // Next.js
+   * import NextLink from 'next/link';
+   * <NavList LinkComponent={NextLink} ... />
+   *
+   * @example
+   * // React Router
+   * import { Link as RouterLink } from 'react-router-dom';
+   * <NavList LinkComponent={RouterLink} ... />
+   */
+  LinkComponent?: React.ComponentType<LinkComponentProps>;
+};
+declare const NavList: {
+  ({
+    items,
+    groups,
+    variant,
+    onItemClick,
+    sx,
+    iconSize,
+    LinkComponent
+  }: NavListProps): import("react/jsx-runtime").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//#region src/components/NotificationCard/NotificationCard.d.ts
+type NotificationType = 'success' | 'error' | 'warning' | 'info' | 'neutral';
+type NotificationAction = {
+  action?: 'open_url';
+  url?: string;
+  label?: string;
+};
+type NotificationCardProps = {
+  type: NotificationType;
+  title?: string | React.ReactNode;
+  message: string | React.ReactNode;
+  actions?: NotificationAction[];
+  caption?: string | React.ReactNode;
+  tags?: string[] | React.ReactNode;
+  onClose?: () => void;
+};
+declare const NotificationCard: (props: NotificationCardProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/NotificationsMenu/NotificationsMenu.d.ts
+type Notification = NotificationCardProps & {
+  id: string;
+  group?: string;
+};
+type Props = {
+  notifications: Notification[];
+  defaultOpen?: boolean;
+  hasMore?: boolean;
+  count: number;
+  onLoadMore?: () => void;
+  onOpenChange?: (isOpen: boolean) => void;
+  onClose?: () => void;
+  onClearAll?: () => void;
+};
+declare const NotificationsMenu: ({
+  notifications,
+  defaultOpen,
+  hasMore,
+  onLoadMore,
+  onOpenChange,
+  count,
+  onClose,
+  onClearAll
+}: Props) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/Search/Search.d.ts
+type SearchProps = Omit<InputProps, 'onChange'> & {
+  loading?: boolean;
+  debounce?: number;
+  onChange: (value?: InputProps['value']) => void;
+};
+declare const Search: ({
+  value,
+  defaultValue,
+  loading,
+  onChange,
+  ...props
+}: SearchProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+//#region src/components/SpotlightCard/SpotlightCard.d.ts
+type ButtonPropType = ButtonProps | React.ReactNode;
+type SpotlightCardProps = {
+  icon: IconType;
+  /**
+   * Title of the card. Pass a ReactNode for styling.
+   */
+  title: string | React.ReactNode;
+  /**
+   * Badge text. Renders as a badge/tag next to the title.
+   */
+  badge?: string | React.ReactNode;
+  description: string;
+  firstButton?: ButtonPropType;
+  secondButton?: ButtonPropType;
+  variant?: 'accent' | 'primary';
+};
+declare const SpotlightCard: {
+  ({
+    icon,
+    title,
+    badge,
+    description,
+    firstButton,
+    secondButton,
+    variant
+  }: SpotlightCardProps): import("react/jsx-runtime").JSX.Element;
+  displayName: string;
+};
+//#endregion
+//#region src/components/Table/Table.d.ts
+declare const Table: {
+  (props: BoxProps): import("react/jsx-runtime").JSX.Element;
+  Head: (props: BoxProps) => import("react/jsx-runtime").JSX.Element;
+  Body: (props: BoxProps) => import("react/jsx-runtime").JSX.Element;
+  Row: (props: BoxProps) => import("react/jsx-runtime").JSX.Element;
+  Cell: (props: BoxProps) => import("react/jsx-runtime").JSX.Element;
+  Header: (props: BoxProps) => import("react/jsx-runtime").JSX.Element;
+  Caption: (props: BoxProps) => import("react/jsx-runtime").JSX.Element;
+  Footer: (props: BoxProps) => import("react/jsx-runtime").JSX.Element;
+};
+//#endregion
+//#region src/components/Tabs/Tabs.d.ts
+declare const Tabs: {
+  (props: BoxProps & TabsProps): import("react/jsx-runtime").JSX.Element;
+  TabList: import("react").FunctionComponent<TabListProps>;
+  /**
+   * Tab default props
+   * https://github.com/reactjs/react-tabs/blob/main/src/components/Tab.js
+   */
+  Tab: import("react").FunctionComponent<TabProps>;
+  TabPanel: import("react").FunctionComponent<TabPanelProps>;
+};
+//#endregion
+//#region src/components/Toast/Toast.d.ts
+declare const ToastContainer: (props: ToastContainerProps) => import("react/jsx-runtime").JSX.Element;
+declare const toast: typeof toast$1;
+//#endregion
+export { Accordion, AccordionItem, AccordionProps, AccordionRenderItemProps, BaseMetric, DateMetric, DatePicker, DateRange, Drawer, DrawerProps, EnhancedTitle, EnhancedTitleBadge, EnhancedTitleProps, EnhancedTitleVariant, FileUploadState, FileUploader, FileUploaderProps, InstallPwa, InstallPwaUi, InstallPwaUiProps, JsonEditor, JsonView, type LinkComponentProps, List, ListItem, ListItemProps, ListProps, LockedOverlay, Markdown, MarkdownProps, Menu, MenuProps, Metric, MetricCard, MetricCardProps, Modal, ModalProps, NavList, type NavListGroup, type NavListItem, type NavListProps, Notification, NotificationAction, NotificationCard, NotificationCardProps, NotificationsMenu, NumberMetric, OnFilesChange, OnRemove, OnUpload, OnUploadComplete, OnUploadError, OnUploadProgress, OnUploadStart, PercentageMetric, Search, SearchProps, SpotlightCard, SpotlightCardProps, type TabListProps, type TabPanelProps, type TabProps, Table, Tabs, type TabsProps, ToastContainer, type ToastContainerProps, type ToastOptions, UploadResult, UploadedFile, createCell, createColumnHelper, flexRender, getCoreRowModel, toast, useReactTable };