@tree-ia/design-system 1.3.0

package/dist/index.d.mts

@@ -0,0 +1,1069 @@
+import React, { ReactNode } from "react";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/components/Button/index.d.ts
+interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  variant?: "primary" | "secondary" | "danger" | "ghost";
+  size?: "sm" | "md" | "lg";
+  isLoading?: boolean;
+  icon?: React.ReactNode;
+  iconPosition?: "left" | "right";
+}
+declare function Button({
+  children,
+  variant,
+  size,
+  isLoading,
+  icon,
+  iconPosition,
+  className,
+  disabled,
+  ...props
+}: ButtonProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Input/index.d.ts
+interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
+  label?: string;
+  error?: string;
+  children?: ReactNode;
+}
+declare const Input: React.ForwardRefExoticComponent<InputProps & React.RefAttributes<HTMLInputElement>>;
+//#endregion
+//#region src/components/Dropdown/index.d.ts
+interface DropdownOption {
+  value: string;
+  label: string;
+  color?: string;
+  backgroundColor?: string;
+}
+interface DropdownProps {
+  options: DropdownOption[];
+  value?: string;
+  onChange: (value: string) => void;
+  label?: string;
+  placeholder?: string;
+  disabled?: boolean;
+  className?: string;
+  containerClassName?: string;
+  fullWidth?: boolean;
+  size?: "small" | "medium" | "large";
+  error?: string;
+  variant?: "default" | "underline" | "simple" | "compact";
+  customDropdownHeight?: string;
+  icon?: React.ReactNode;
+  fitContent?: boolean;
+  isActive?: boolean;
+}
+declare function Dropdown({
+  options,
+  value,
+  onChange,
+  label,
+  placeholder,
+  disabled,
+  className,
+  containerClassName,
+  fullWidth,
+  size,
+  error,
+  variant,
+  customDropdownHeight,
+  icon,
+  fitContent,
+  isActive
+}: DropdownProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Table/index.d.ts
+interface TableColumn<T> {
+  key: string;
+  header: string;
+  render: (item: T) => ReactNode;
+  width?: string;
+  align?: "left" | "center" | "right";
+  sortable?: boolean;
+}
+interface TableProps<T> {
+  columns: TableColumn<T>[];
+  data: T[];
+  onRowClick?: (item: T) => void;
+  isLoading?: boolean;
+  emptyMessage?: string;
+  emptyIcon?: ReactNode;
+  loadingComponent?: ReactNode;
+  emptyComponent?: ReactNode;
+  keyExtractor: (item: T) => string;
+  className?: string;
+}
+declare function Table<T>({
+  columns,
+  data,
+  onRowClick,
+  isLoading,
+  emptyMessage,
+  emptyIcon,
+  loadingComponent,
+  emptyComponent,
+  keyExtractor,
+  className
+}: TableProps<T>): react_jsx_runtime0.JSX.Element;
+declare function TableHeader<T>({
+  columns
+}: {
+  columns: TableColumn<T>[];
+}): react_jsx_runtime0.JSX.Element;
+declare function TableBody<T>({
+  columns,
+  data,
+  onRowClick,
+  keyExtractor
+}: {
+  columns: TableColumn<T>[];
+  data: T[];
+  onRowClick?: (item: T) => void;
+  keyExtractor: (item: T) => string;
+}): react_jsx_runtime0.JSX.Element;
+declare function TableSkeleton(): react_jsx_runtime0.JSX.Element;
+declare function TableEmpty({
+  message,
+  icon
+}: {
+  message: string;
+  icon?: ReactNode;
+}): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Modal/index.d.ts
+interface ModalProps {
+  isOpen: boolean;
+  onClose: () => void;
+  onSave?: () => void;
+  title?: string;
+  children: React.ReactNode;
+  showFooter?: boolean;
+  saveButtonText?: string;
+  cancelButtonText?: string;
+  size?: "small" | "medium" | "large" | "extraLarge" | "largeXl";
+  disableSaveButton?: boolean;
+  saveButtonVariant?: "primary" | "secondary" | "danger" | "ghost";
+  closeOnEscape?: boolean;
+  closeOnOverlayClick?: boolean;
+}
+declare function Modal({
+  isOpen,
+  onClose,
+  onSave,
+  title,
+  children,
+  showFooter,
+  saveButtonText,
+  cancelButtonText,
+  size,
+  disableSaveButton,
+  saveButtonVariant,
+  closeOnEscape,
+  closeOnOverlayClick
+}: ModalProps): react_jsx_runtime0.JSX.Element | null;
+//#endregion
+//#region src/components/Card/index.d.ts
+interface CardProps {
+  children: React.ReactNode;
+  className?: string;
+  title?: string;
+  subtitle?: string;
+  icon?: React.ReactNode;
+  headerActions?: React.ReactNode;
+  showDivider?: boolean;
+}
+declare function Card({
+  children,
+  className,
+  title,
+  subtitle,
+  icon,
+  headerActions,
+  showDivider
+}: CardProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Toast/index.d.ts
+interface ToastProps {
+  title: string;
+  subtitle?: string;
+  type?: "success" | "error" | "warning" | "info";
+  duration?: number;
+  onClose: () => void;
+  showProgress?: boolean;
+}
+declare function Toast({
+  title,
+  subtitle,
+  type,
+  duration,
+  onClose,
+  showProgress
+}: ToastProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Loading/index.d.ts
+interface LoadingProps {
+  size?: "sm" | "md" | "lg";
+  className?: string;
+  text?: string;
+  textColor?: string;
+  color?: string;
+  variant?: "spinner" | "border";
+  fullscreen?: boolean;
+}
+declare function Loading({
+  size,
+  className,
+  text,
+  textColor,
+  color,
+  variant,
+  fullscreen
+}: LoadingProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Pagination/index.d.ts
+interface PaginationProps {
+  currentPage: number;
+  totalPages: number;
+  onPageChange: (page: number) => void;
+  itemsPerPage: number;
+  totalItems: number;
+  onItemsPerPageChange?: (itemsPerPage: number) => void;
+  itemsPerPageOptions?: number[];
+  showPageInfo?: boolean;
+  compact?: boolean;
+  className?: string;
+}
+declare function Pagination({
+  currentPage,
+  totalPages,
+  onPageChange,
+  itemsPerPage,
+  totalItems,
+  onItemsPerPageChange,
+  itemsPerPageOptions,
+  showPageInfo,
+  compact,
+  className
+}: PaginationProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/FormField/index.d.ts
+interface FormFieldProps {
+  label: string;
+  name: string;
+  type?: "text" | "email" | "password" | "number" | "tel";
+  value: string;
+  onChange: (value: string) => void;
+  error?: string;
+  required?: boolean;
+  placeholder?: string;
+  disabled?: boolean;
+  className?: string;
+}
+declare function FormField({
+  label,
+  name,
+  type,
+  value,
+  onChange,
+  error,
+  required,
+  placeholder,
+  disabled,
+  className
+}: FormFieldProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Tabs/index.d.ts
+interface Tab {
+  id: string;
+  label: string;
+  count?: number;
+  icon?: ReactNode;
+}
+interface TabsProps {
+  tabs: Tab[];
+  activeTab: string;
+  onChange: (tabId: string) => void;
+  /** Estilo visual das tabs. Default: "underline" */
+  variant?: "underline" | "pill";
+  className?: string;
+}
+declare function Tabs({
+  tabs,
+  activeTab,
+  onChange,
+  variant,
+  className
+}: TabsProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/DateRangePicker/index.d.ts
+type DateRange = {
+  start: Date | null;
+  end: Date | null;
+};
+interface DateRangePickerProps {
+  value: DateRange;
+  onChange: (range: DateRange) => void;
+  locale?: "pt" | "en";
+  className?: string;
+}
+declare function DateRangePicker({
+  value,
+  onChange,
+  locale,
+  className
+}: DateRangePickerProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Title/index.d.ts
+interface TitleProps extends React.HTMLAttributes<HTMLHeadingElement> {
+  level?: 1 | 2 | 3 | 4 | 5 | 6;
+  size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl";
+  weight?: "normal" | "medium" | "semibold" | "bold" | "extrabold";
+  align?: "left" | "center" | "right";
+  color?: string;
+}
+declare function Title({
+  children,
+  level,
+  size,
+  weight,
+  align,
+  color,
+  className,
+  ...props
+}: TitleProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/ToggleSwitch/index.d.ts
+interface ToggleSwitchProps {
+  enabled: boolean;
+  onChange: (enabled: boolean) => void;
+  disabled?: boolean;
+  size?: "sm" | "md" | "lg";
+  label?: string;
+  className?: string;
+}
+declare function ToggleSwitch({
+  enabled,
+  onChange,
+  disabled,
+  size,
+  label,
+  className
+}: ToggleSwitchProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/BadgeStatus/index.d.ts
+interface BadgeStatusProps {
+  label: string;
+  variant?: "success" | "warning" | "danger" | "info" | "neutral";
+  color?: string;
+  bgColor?: string;
+  size?: "sm" | "md";
+  className?: string;
+}
+declare function BadgeStatus({
+  label,
+  variant,
+  color,
+  bgColor,
+  size,
+  className
+}: BadgeStatusProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Sidebar/index.d.ts
+interface SidebarMenuItem {
+  id: string;
+  label: string;
+  href: string;
+  icon: React.ComponentType<{
+    size?: number;
+    className?: string;
+    style?: React.CSSProperties;
+  }>;
+}
+interface SidebarUser {
+  name: string;
+  email: string;
+  subtitle?: string;
+}
+interface SidebarProps {
+  menuItems: SidebarMenuItem[];
+  logo: ReactNode;
+  collapsedLogo?: ReactNode;
+  currentPath: string;
+  linkComponent?: React.ComponentType<{
+    href: string;
+    className?: string;
+    children: ReactNode;
+  }>;
+  isCollapsed?: boolean;
+  onToggleCollapse?: () => void;
+  user?: SidebarUser;
+  onUserClick?: () => void;
+  onLogout?: () => void;
+  logoutLabel?: string;
+  className?: string;
+}
+declare function Sidebar({
+  menuItems,
+  logo,
+  collapsedLogo,
+  currentPath,
+  linkComponent: LinkComponent,
+  isCollapsed,
+  onToggleCollapse,
+  user,
+  onUserClick,
+  onLogout,
+  logoutLabel,
+  className
+}: SidebarProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/ThemeSwitcher/index.d.ts
+interface ThemeSwitcherProps {
+  className?: string;
+}
+declare function ThemeSwitcher({
+  className
+}: ThemeSwitcherProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/KPICard/index.d.ts
+type KPIValueFormat = "currency" | "number" | "percentage" | "rating";
+interface KPICardProps {
+  title: string;
+  value: number;
+  variation: number;
+  trend: "up" | "down" | "stable";
+  format?: KPIValueFormat;
+  benchmark?: string;
+  isLoading?: boolean;
+  className?: string;
+}
+declare function KPICard({
+  title,
+  value,
+  variation,
+  trend,
+  format,
+  benchmark,
+  isLoading,
+  className
+}: KPICardProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/PageLayout/index.d.ts
+interface PageLayoutProps {
+  /** Titulo principal da pagina */
+  title: string;
+  /** Descricao opcional da pagina (aparece abaixo do titulo) */
+  description?: string;
+  /** Componentes de filtros ou acoes para o header (ex: PeriodFilter, botoes) */
+  headerActions?: ReactNode;
+  /** Conteudo principal da pagina */
+  children: ReactNode;
+  /** Se true, aplica padding no conteudo. Default: true */
+  contentPadding?: boolean;
+  /** Componente de sidebar a ser renderizado */
+  sidebar?: ReactNode;
+  /** Se a sidebar esta recolhida */
+  sidebarCollapsed?: boolean;
+  /** Largura da sidebar expandida em px. Default: 280 */
+  sidebarWidth?: number;
+  /** Largura da sidebar recolhida em px. Default: 109 */
+  sidebarCollapsedWidth?: number;
+  className?: string;
+}
+declare function PageLayout({
+  title,
+  description,
+  headerActions,
+  children,
+  contentPadding,
+  sidebar,
+  sidebarCollapsed,
+  sidebarWidth,
+  sidebarCollapsedWidth,
+  className
+}: PageLayoutProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/ComparisonLineChart/index.d.ts
+interface ComparisonLineChartProps {
+  /** Labels do eixo X (ex: datas) */
+  labels: string[];
+  /** Dados do periodo atual */
+  currentPeriodData: number[];
+  /** Dados do periodo anterior */
+  previousPeriodData: number[];
+  /** Label da legenda do periodo atual */
+  currentPeriodLabel?: string;
+  /** Label da legenda do periodo anterior */
+  previousPeriodLabel?: string;
+  /** Titulo do grafico */
+  title?: string;
+  /** Cor principal (default: --dashboard-primary) */
+  color?: string;
+  /** Altura do container do grafico em px. Default: 300 */
+  height?: number;
+  className?: string;
+}
+declare function ComparisonLineChart({
+  labels,
+  currentPeriodData,
+  previousPeriodData,
+  currentPeriodLabel,
+  previousPeriodLabel,
+  title,
+  color,
+  height,
+  className
+}: ComparisonLineChartProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/HorizontalBarChart/index.d.ts
+interface HorizontalBarChartTab {
+  id: string;
+  label: string;
+}
+interface HorizontalBarChartProps {
+  /** Labels do eixo Y (ex: horarios) */
+  labels: string[];
+  /** Dados por tab. Chave = tab.id, valor = array de numeros */
+  datasets: Record<string, number[]>;
+  /** Tabs para alternar entre datasets */
+  tabs?: HorizontalBarChartTab[];
+  /** Titulo do grafico */
+  title?: string;
+  /** Icone ao lado do titulo */
+  titleIcon?: React.ReactNode;
+  /** Cor das barras (default: --dashboard-primary) */
+  color?: string;
+  /** Label para tooltip (ex: "vendas", "pedidos") */
+  valueLabel?: string;
+  /** Label no singular (ex: "venda", "pedido") */
+  valueLabelSingular?: string;
+  /** Texto para melhor item (ex: "Melhor horário") */
+  bestItemLabel?: string;
+  className?: string;
+}
+declare function HorizontalBarChart({
+  labels,
+  datasets,
+  tabs,
+  title,
+  titleIcon,
+  color,
+  valueLabel,
+  valueLabelSingular,
+  bestItemLabel,
+  className
+}: HorizontalBarChartProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/VerticalBarChart/index.d.ts
+interface VerticalBarChartProps {
+  /** Labels do eixo X (ex: dias da semana) */
+  labels: string[];
+  /** Valores para cada label */
+  data: number[];
+  /** Titulo do grafico */
+  title?: string;
+  /** Icone ao lado do titulo */
+  titleIcon?: React.ReactNode;
+  /** Cor das barras (default: --dashboard-primary) */
+  color?: string;
+  /** Label do tooltip (ex: "vendas") */
+  valueLabel?: string;
+  /** Label no singular (ex: "venda") */
+  valueLabelSingular?: string;
+  /** Texto para melhor item (ex: "Melhor dia") */
+  bestItemLabel?: string;
+  /** Maximo de caracteres dos labels. Default: 3 */
+  labelMaxChars?: number;
+  className?: string;
+}
+declare function VerticalBarChart({
+  labels,
+  data: values,
+  title,
+  titleIcon,
+  color,
+  valueLabel,
+  valueLabelSingular,
+  bestItemLabel,
+  labelMaxChars,
+  className
+}: VerticalBarChartProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/ProgressBarList/index.d.ts
+interface ProgressBarListItem {
+  /** Label do item */
+  label: string;
+  /** Valor numerico */
+  value: number;
+  /** Icone opcional */
+  icon?: ReactNode;
+}
+interface ProgressBarListProps {
+  /** Itens da lista */
+  items: ProgressBarListItem[];
+  /** Titulo da lista */
+  title?: string;
+  /** Icone ao lado do titulo */
+  titleIcon?: ReactNode;
+  /** Cor da barra de progresso (default: --dashboard-primary) */
+  color?: string;
+  /** Label do valor (ex: "vendas") */
+  valueLabel?: string;
+  /** Label no singular (ex: "venda") */
+  valueLabelSingular?: string;
+  /** Ordenar automaticamente por valor desc. Default: true */
+  sortByValue?: boolean;
+  /** Formatar valor customizado */
+  formatValue?: (value: number) => string;
+  className?: string;
+}
+declare function ProgressBarList({
+  items,
+  title,
+  titleIcon,
+  color,
+  valueLabel,
+  valueLabelSingular,
+  sortByValue,
+  formatValue,
+  className
+}: ProgressBarListProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/MetricPanel/index.d.ts
+interface MetricPanelMetric {
+  /** Chave unica da metrica */
+  key: string;
+  /** Label exibida na tab e KPI */
+  label: string;
+  /** Icone da tab */
+  icon: React.ComponentType<{
+    className?: string;
+  }>;
+  /** Label da legenda do periodo atual */
+  currentLabel: string;
+  /** Label da legenda do periodo anterior */
+  previousLabel: string;
+  /** Formato do valor */
+  format: KPIValueFormat;
+  /** Unidade opcional (ex: "pedidos") */
+  unit?: string;
+  /** Valores do KPI */
+  kpiValue: {
+    current: number;
+    previous: number;
+    variation: number;
+    trend: "up" | "down" | "stable";
+  };
+}
+interface MetricPanelChartData {
+  labels: string[];
+  metrics: Record<string, {
+    currentPeriod: number[];
+    previousPeriod: number[];
+  }>;
+}
+interface MetricPanelProps {
+  /** Titulo do painel */
+  title: string;
+  /** Icone do titulo */
+  titleIcon: React.ComponentType<{
+    className?: string;
+  }>;
+  /** Configuracoes das metricas */
+  metrics: MetricPanelMetric[];
+  /** Dados do grafico */
+  chartData: MetricPanelChartData;
+  /** Cor principal */
+  color?: string;
+  /** Cor secundaria (periodo anterior) */
+  secondaryColor?: string;
+  /** Callback do botao de acao */
+  onActionClick?: () => void;
+  /** Label do botao de acao */
+  actionLabel?: string;
+  /** Estado de loading */
+  isLoading?: boolean;
+  className?: string;
+}
+declare function MetricPanel({
+  title,
+  titleIcon: TitleIcon,
+  metrics,
+  chartData,
+  color,
+  secondaryColor,
+  onActionClick,
+  actionLabel,
+  isLoading,
+  className
+}: MetricPanelProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/FilterBar/index.d.ts
+interface FilterBarProps {
+  /** Valor do campo de busca */
+  searchValue?: string;
+  /** Callback de mudanca do campo de busca */
+  onSearchChange?: (value: string) => void;
+  /** Placeholder do campo de busca */
+  searchPlaceholder?: string;
+  /** Slot para dropdowns, date pickers e outros filtros */
+  children?: ReactNode;
+  /** Slot para acoes extras (ex: botao de exportar) */
+  actions?: ReactNode;
+  className?: string;
+}
+declare function FilterBar({
+  searchValue,
+  onSearchChange,
+  searchPlaceholder,
+  children,
+  actions,
+  className
+}: FilterBarProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/AuthLayout/index.d.ts
+interface AuthField {
+  /** Unique name / id for the field */
+  name: string;
+  /** Label displayed above the input (omit for placeholder-only mode) */
+  label?: string;
+  /** HTML input type */
+  type?: "text" | "email" | "password" | "tel" | "number";
+  /** Placeholder text */
+  placeholder?: string;
+  /** Whether the field is required */
+  required?: boolean;
+  /** Minimum length for validation */
+  minLength?: number;
+  /** Field-level error message */
+  error?: string;
+}
+interface AuthLink {
+  /** Link text */
+  label: string;
+  /** URL or click handler */
+  href?: string;
+  /** Custom click handler (takes precedence over href) */
+  onClick?: () => void;
+}
+interface AuthCheckbox {
+  /** Checkbox name */
+  name: string;
+  /** Checkbox label */
+  label: string;
+  /** Whether checked */
+  checked?: boolean;
+  /** Change handler */
+  onChange?: (checked: boolean) => void;
+}
+interface AuthBackground {
+  /** Solid color, gradient, or CSS value for the page background */
+  color?: string;
+  /** Background image URL or element (for Next.js Image support) */
+  image?: string;
+  /** React element for the background (e.g., next/image with fill) */
+  imageElement?: ReactNode;
+  /** Overlay opacity (0-1) — rendered as bg-black/{opacity} */
+  overlayOpacity?: number;
+  /** Custom CSS for the background container */
+  style?: React.CSSProperties;
+}
+interface AuthHeadline {
+  /** Main headline text */
+  text: string;
+  /** Highlighted / accent portion (rendered on new line if not found inside text) */
+  highlight?: string;
+  /** Color of the main text (defaults to #faf3e1) */
+  color?: string;
+  /** Color of the highlighted text (defaults to primaryColor) */
+  highlightColor?: string;
+}
+interface AuthBranding {
+  /** Array of logo elements to render at the bottom-left */
+  logos: ReactNode[];
+}
+interface AuthCardStyle {
+  /** Card background color (defaults to #faf3e1) */
+  background?: string;
+  /** Card border radius in px (defaults to 16 = rounded-2xl) */
+  borderRadius?: number;
+  /** Card box shadow CSS */
+  shadow?: string;
+  /** Card max width in px (defaults to 420) */
+  maxWidth?: number;
+  /** Card padding in px (defaults to 32 = p-8) */
+  padding?: number;
+  /** Card border */
+  border?: string;
+}
+interface AuthLayoutProps {
+  /** Logo element displayed at top of card */
+  logo?: ReactNode;
+  /** Page title (e.g., "Painel de Controle") */
+  title: string;
+  /** Subtitle / description below the title (supports ReactNode for inline formatting) */
+  subtitle?: ReactNode;
+  /** Global error message displayed above the form */
+  error?: string;
+  /** Global success message displayed above the form */
+  success?: string;
+  /** Form field definitions */
+  fields: AuthField[];
+  /** Current field values keyed by field name */
+  values: Record<string, string>;
+  /** Callback when a field value changes */
+  onFieldChange: (name: string, value: string) => void;
+  /** Submit handler */
+  onSubmit: (values: Record<string, string>) => void;
+  /** Submit button label */
+  submitLabel?: string;
+  /** Loading label while submitting */
+  loadingLabel?: string;
+  /** Whether the form is currently submitting */
+  isLoading?: boolean;
+  /** Checkbox between fields and submit (e.g., "Lembrar conta") */
+  checkbox?: AuthCheckbox;
+  /** Primary link below the form */
+  primaryLink?: AuthLink;
+  /** Secondary link / text (e.g., "Ainda nao tem cadastro? Cadastre-se") */
+  secondaryLink?: AuthLink & {
+    prefix?: string;
+  };
+  /** Content rendered between the submit button and the links */
+  extraContent?: ReactNode;
+  /** Content rendered above the form (below title/subtitle) */
+  headerContent?: ReactNode;
+  /** Content rendered just above the submit button (e.g., resend code link) */
+  beforeSubmitContent?: ReactNode;
+  /** Content rendered at the very bottom of the card */
+  footerContent?: ReactNode;
+  /** Headline text displayed over the background (top-left, hidden on mobile) */
+  headline?: AuthHeadline;
+  /** Branding logos at the bottom-left over the background (hidden on mobile) */
+  branding?: AuthBranding;
+  /** Card horizontal position */
+  cardPosition?: "left" | "center" | "right";
+  /** Right padding for the card container on lg screens (defaults to 256 = pr-64) */
+  cardOffsetRight?: number;
+  /** Background configuration */
+  background?: AuthBackground;
+  /** Card styling overrides */
+  cardStyle?: AuthCardStyle;
+  /** Primary color (buttons, links, focus rings, checkbox). Defaults to #ff521d */
+  primaryColor?: string;
+  /** Text color for the title */
+  titleColor?: string;
+  /** Text alignment for the card header (title + subtitle). Defaults to "center" */
+  titleAlign?: "left" | "center" | "right";
+  /** Additional class name for the outermost container */
+  className?: string;
+}
+declare function AuthLayout({
+  logo,
+  title,
+  subtitle,
+  error,
+  success,
+  fields,
+  values,
+  onFieldChange,
+  onSubmit,
+  submitLabel,
+  loadingLabel,
+  isLoading,
+  checkbox,
+  primaryLink,
+  secondaryLink,
+  extraContent,
+  headerContent,
+  beforeSubmitContent,
+  footerContent,
+  headline,
+  branding,
+  cardPosition,
+  cardOffsetRight,
+  background,
+  cardStyle,
+  primaryColor,
+  titleColor,
+  titleAlign,
+  className
+}: AuthLayoutProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/CodeInput/index.d.ts
+interface CodeInputProps {
+  /** Number of digit boxes (defaults to 6) */
+  length?: number;
+  /** Current value as a string (e.g. "12" for the first two digits filled) */
+  value: string;
+  /** Called with the full string whenever a digit changes */
+  onChange: (value: string) => void;
+  /** Disable all inputs */
+  disabled?: boolean;
+  /** Show error styling */
+  error?: boolean;
+  /** Primary / accent color for focused box border */
+  primaryColor?: string;
+  /** Additional className on the container */
+  className?: string;
+}
+declare function CodeInput({
+  length,
+  value,
+  onChange,
+  disabled,
+  error,
+  primaryColor,
+  className
+}: CodeInputProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/components/Checkbox/index.d.ts
+interface CheckboxProps {
+  /** Input name */
+  name?: string;
+  /** Input id (defaults to name) */
+  id?: string;
+  /** Label text next to the checkbox */
+  label?: string;
+  /** Whether checked */
+  checked?: boolean;
+  /** Change handler */
+  onChange?: (checked: boolean) => void;
+  /** Disable the checkbox */
+  disabled?: boolean;
+  /** Size variant */
+  size?: "sm" | "md" | "lg";
+  /** Primary color override for checked state. Defaults to --dashboard-primary / #ff521d */
+  primaryColor?: string;
+  /** Additional className on the wrapper label */
+  className?: string;
+  /** Children rendered as label (takes precedence over label prop) */
+  children?: React.ReactNode;
+}
+declare function Checkbox({
+  name,
+  id,
+  label,
+  checked,
+  onChange,
+  disabled,
+  size,
+  primaryColor,
+  className,
+  children
+}: CheckboxProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/config/types.d.ts
+interface ThemeColors {
+  primary: string;
+  secondary: string;
+  background: string;
+  surface: string;
+  textPrimary: string;
+  textSecondary: string;
+  statusSuccess: string;
+  statusDanger: string;
+  statusWarning: string;
+  statusInfo: string;
+  statusNeutral: string;
+}
+interface ComponentsConfig {
+  modal: {
+    closeOnEscape: boolean;
+    closeOnOverlayClick: boolean;
+  };
+  toast: {
+    duration: number;
+    position: "top-right" | "top-left" | "bottom-right" | "bottom-left";
+  };
+  notification: {
+    duration: number;
+  };
+  pagination: {
+    itemsPerPageOptions: number[];
+    defaultItemsPerPage: number;
+  };
+}
+interface DashboardConfig {
+  name: string;
+  colors: ThemeColors;
+  components: ComponentsConfig;
+}
+//#endregion
+//#region src/providers/DashboardProvider.d.ts
+type DeepPartial$1<T> = { [P in keyof T]?: T[P] extends object ? DeepPartial$1<T[P]> : T[P] };
+interface DashboardProviderProps {
+  config?: DeepPartial$1<DashboardConfig>;
+  children: React.ReactNode;
+}
+declare function DashboardProvider({
+  config: configOverrides,
+  children
+}: DashboardProviderProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/providers/ThemeProvider.d.ts
+declare function ThemeProvider({
+  children
+}: {
+  children: React.ReactNode;
+}): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/providers/LoadingProvider.d.ts
+declare function LoadingProvider({
+  children
+}: {
+  children: React.ReactNode;
+}): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/providers/NotificationsProvider.d.ts
+declare function NotificationsProvider({
+  children
+}: {
+  children: React.ReactNode;
+}): react_jsx_runtime0.JSX.Element;
+//#endregion
+//#region src/hooks/useTheme.d.ts
+type Theme = "light" | "dark" | "system";
+interface ThemeContextType {
+  theme: Theme;
+  setTheme: (theme: Theme) => void;
+  resolvedTheme: "light" | "dark";
+}
+declare function useTheme(): ThemeContextType;
+//#endregion
+//#region src/hooks/useConfig.d.ts
+declare function useConfig(): DashboardConfig;
+//#endregion
+//#region src/hooks/useLoading.d.ts
+interface LoadingContextType {
+  isLoading: boolean;
+  showLoading: () => void;
+  hideLoading: () => void;
+}
+declare function useLoading(): LoadingContextType;
+//#endregion
+//#region src/hooks/useNotifications.d.ts
+interface Notification {
+  id: string;
+  title: string;
+  subtitle: string;
+  type: "success" | "error" | "warning" | "info";
+}
+interface NotificationsContextType {
+  notifications: Notification[];
+  addNotification: (notification: Omit<Notification, "id">) => void;
+  removeNotification: (id: string) => void;
+  clearNotifications: () => void;
+}
+declare function useNotifications(): NotificationsContextType;
+//#endregion
+//#region src/config/createConfig.d.ts
+type DeepPartial<T> = { [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P] };
+declare function createConfig(overrides?: DeepPartial<DashboardConfig>): DashboardConfig;
+//#endregion
+//#region src/config/defaults.d.ts
+declare const defaultConfig: DashboardConfig;
+//#endregion
+export { type AuthBackground, type AuthBranding, type AuthCardStyle, type AuthCheckbox, type AuthField, type AuthHeadline, AuthLayout, type AuthLayoutProps, type AuthLink, BadgeStatus, type BadgeStatusProps, Button, type ButtonProps, Card, type CardProps, Checkbox, type CheckboxProps, CodeInput, type CodeInputProps, ComparisonLineChart, type ComparisonLineChartProps, type ComponentsConfig, type DashboardConfig, DashboardProvider, type DateRange, DateRangePicker, type DateRangePickerProps, Dropdown, type DropdownOption, type DropdownProps, FilterBar, type FilterBarProps, FormField, type FormFieldProps, HorizontalBarChart, type HorizontalBarChartProps, type HorizontalBarChartTab, Input, type InputProps, KPICard, type KPICardProps, type KPIValueFormat, Loading, type LoadingContextType, type LoadingProps, LoadingProvider, MetricPanel, type MetricPanelChartData, type MetricPanelMetric, type MetricPanelProps, Modal, type ModalProps, type Notification, type NotificationsContextType, NotificationsProvider, PageLayout, type PageLayoutProps, Pagination, type PaginationProps, ProgressBarList, type ProgressBarListItem, type ProgressBarListProps, Sidebar, type SidebarMenuItem, type SidebarProps, type SidebarUser, type Tab, Table, TableBody, type TableColumn, TableEmpty, TableHeader, type TableProps, TableSkeleton, Tabs, type TabsProps, type Theme, type ThemeColors, type ThemeContextType, ThemeProvider, ThemeSwitcher, type ThemeSwitcherProps, Title, type TitleProps, Toast, type ToastProps, ToggleSwitch, type ToggleSwitchProps, VerticalBarChart, type VerticalBarChartProps, createConfig, defaultConfig, useConfig, useLoading, useNotifications, useTheme };
+//# sourceMappingURL=index.d.mts.map