spotlibs-components 0.1.14 → 0.1.17

package/dist/types-BtwscYRX.d.mts

@@ -1,1310 +0,0 @@
-import * as React from 'react';
-import { ReactNode } from 'react';
-import { SxProps } from '@mui/material/styles';
-import { Control, RegisterOptions } from 'react-hook-form';
-
-interface BaseAlertProps {
-  /** Alert color variant */
-  variant?: "default" | "error" | "info" | "success" | "warning";
-  /** MUI Alert variant type */
-  type?: "standard" | "filled" | "outlined";
-  /** Alert title */
-  title?: string;
-  /** Alert content */
-  children?: React.ReactNode;
-  /** Icon element or component. If not provided, no icon is shown. */
-  icon?: React.ReactNode | React.ComponentType<any>;
-  /** Custom background color override */
-  color?: string;
-  /** MUI sx overrides */
-  sx?: SxProps;
-  /** Close handler. If provided, close button is shown. */
-  onClose?: () => void;
-  /** sx overrides for children wrapper */
-  childrenSx?: SxProps;
-  [key: string]: any;
-}
-
-declare function BaseAlert(props: BaseAlertProps): React.ReactElement;
-
-interface PrimitiveColorType {
-  color_overlay: string;
-
-  color_neutral_900: string;
-  color_neutral_700: string;
-  color_neutral_600: string;
-  color_neutral_500: string;
-  color_neutral_400: string;
-  color_neutral_300: string;
-  color_neutral_200: string;
-  color_neutral_100: string;
-  color_neutral_50: string;
-
-  color_blue_cakrawala_900: string;
-  color_blue_cakrawala_800: string;
-  color_blue_cakrawala_700: string;
-  color_blue_cakrawala_600: string;
-  color_blue_cakrawala_500: string;
-  color_blue_cakrawala_400: string;
-  color_blue_cakrawala_300: string;
-  color_blue_cakrawala_200: string;
-  color_blue_cakrawala_100: string;
-
-  color_blue_mentari_900: string;
-  color_blue_mentari_700: string;
-  color_blue_mentari_600: string;
-  color_blue_mentari_500: string;
-  color_blue_mentari_400: string;
-  color_blue_mentari_300: string;
-  color_blue_mentari_100: string;
-
-  color_blue_neon_900: string;
-  color_blue_neon_700: string;
-  color_blue_neon_600: string;
-  color_blue_neon_500: string;
-  color_blue_neon_400: string;
-  color_blue_neon_300: string;
-  color_blue_neon_100: string;
-
-  color_blue_sky_900: string;
-  color_blue_sky_700: string;
-  color_blue_sky_600: string;
-  color_blue_sky_500: string;
-  color_blue_sky_400: string;
-  color_blue_sky_300: string;
-  color_blue_sky_100: string;
-
-  color_green_900: string;
-  color_green_700: string;
-  color_green_600: string;
-  color_green_500: string;
-  color_green_400: string;
-  color_green_300: string;
-  color_green_100: string;
-
-  color_red_900: string;
-  color_red_700: string;
-  color_red_600: string;
-  color_red_500: string;
-  color_red_400: string;
-  color_red_300: string;
-  color_red_100: string;
-
-  color_yellow_900: string;
-  color_yellow_700: string;
-  color_yellow_600: string;
-  color_yellow_500: string;
-  color_yellow_400: string;
-  color_yellow_300: string;
-  color_yellow_100: string;
-
-  color_briva_900: string;
-  color_briva_700: string;
-  color_briva_600: string;
-  color_briva_500: string;
-  color_briva_400: string;
-  color_briva_300: string;
-  color_briva_100: string;
-
-  color_brizzi_900: string;
-  color_brizzi_700: string;
-  color_brizzi_600: string;
-  color_brizzi_500: string;
-  color_brizzi_400: string;
-  color_brizzi_300: string;
-  color_brizzi_100: string;
-
-  [key: string]: string;
-}
-
-declare const PrimitiveColor: PrimitiveColorType;
-
-interface DerivedColorType {
-  /* Background */
-  color_bg_page: string;
-  color_bg_surface: string;
-  color_bg_inverse: string;
-  color_bg_disabled: string;
-
-  color_bg_brand_primary_strong: string;
-  color_bg_brand_primary: string;
-  color_bg_brand_primary_subtle: string;
-  color_bg_brand_secondary_strong: string;
-  color_bg_brand_secondary: string;
-  color_bg_brand_secondary_subtle: string;
-
-  color_bg_success_strong: string;
-  color_bg_success: string;
-  color_bg_success_subtle: string;
-
-  color_bg_danger_strong: string;
-  color_bg_danger: string;
-  color_bg_danger_subtle: string;
-
-  color_bg_warning_strong: string;
-  color_bg_warning: string;
-  color_bg_warning_subtle: string;
-
-  /* Border */
-  color_border_default: string;
-  color_border_strong: string;
-  color_border_inverse: string;
-  color_border_brand_primary: string;
-  color_border_brand_secondary: string;
-  color_border_success: string;
-  color_border_danger: string;
-  color_border_warning: string;
-
-  /* Text */
-  color_text_default: string;
-  color_text_subtle: string;
-  color_text_disabled: string;
-  color_text_placeholder: string;
-  color_text_inverse: string;
-  color_text_brand_primary: string;
-  color_text_brand_secondary: string;
-  color_text_success: string;
-  color_text_danger: string;
-  color_text_warning: string;
-
-  /* Icon */
-  color_icon_subtle: string;
-  color_icon_strong: string;
-  color_icon_disabled: string;
-  color_icon_inverse: string;
-  color_icon_brand_primary: string;
-  color_icon_brand_secondary: string;
-  color_icon_success: string;
-  color_icon_danger: string;
-  color_icon_warning: string;
-}
-
-declare const DerivedColor: DerivedColorType;
-
-type TypographyVariant =
-  | "h1"
-  | "h2"
-  | "h3"
-  | "h4"
-  | "h5"
-  | "h6"
-  | "header1_regular"
-  | "header1_semibold"
-  | "header1_bold"
-  | "header2_regular"
-  | "header2_semibold"
-  | "header2_bold"
-  | "body1_regular"
-  | "body2_regular"
-  | "caption_regular";
-
-type TypographyColor =
-  | "default"
-  | "subtle"
-  | "disabled"
-  | "placeholder"
-  | "inverse"
-  | "primary"
-  | "secondary"
-  | "success"
-  | "danger"
-  | "warning";
-
-interface VariantStyleEntry {
-  fontSize: string;
-  fontWeight: number;
-}
-
-declare const VariantStyles: Record<TypographyVariant, VariantStyleEntry>;
-
-interface TypographyProps {
-  /** Format: "variant.color" e.g. "body1_regular.default" */
-  variant?: `${TypographyVariant}.${TypographyColor}` | TypographyVariant;
-  /** Content */
-  children?: React.ReactNode;
-  /** MUI sx overrides */
-  sx?: SxProps;
-  [key: string]: any;
-}
-
-declare function BaseTypography(props: TypographyProps): React.ReactElement | null;
-
-declare const SpacingToken: {
-  spacing0: string;
-  spacing1: string;
-  spacing2: string;
-  spacing3: string;
-  spacing4: string;
-  spacing5: string;
-  spacing6: string;
-  spacing7: string;
-  spacing8: string;
-  spacing9: string;
-  spacing10: string;
-};
-
-declare const CONTENT_SPACING_TOKENS: {
-  spacing_1: {
-    mobile: string;
-    tablet: string;
-    web: string;
-  };
-  spacing_2: {
-    mobile: string;
-    tablet: string;
-    web: string;
-  };
-  spacing_3: {
-    mobile: string;
-    tablet: string;
-    web: string;
-  };
-};
-
-interface ResponsiveSpacingValue {
-  mobile?: string;
-  tablet?: string;
-  web?: string;
-  [key: string]: string | undefined;
-}
-
-type SpacingSizeValue = keyof typeof SpacingToken | string | number;
-
-type ContentSpacingSizeValue =
-  | keyof typeof CONTENT_SPACING_TOKENS
-  | ResponsiveSpacingValue;
-
-interface SpacingProps {
-  size?: SpacingSizeValue;
-  axis?: "vertical" | "horizontal";
-  as?: React.ElementType;
-  className?: string;
-  style?: React.CSSProperties;
-  children?: React.ReactNode;
-  [key: string]: unknown;
-}
-
-interface ContentSpacingProps {
-  size?: ContentSpacingSizeValue;
-  breakpoint?: "mobile" | "tablet" | "web";
-  as?: React.ElementType;
-  className?: string;
-  style?: React.CSSProperties;
-  children?: React.ReactNode;
-  [key: string]: unknown;
-}
-
-declare const Spacing: React.FC<SpacingProps>;
-
-declare const ContentSpacing: React.FC<ContentSpacingProps>;
-
-interface ShadowElevation {
-  shadow: string;
-  surface: string;
-}
-
-interface ShadowMap {
-  elevation_0: ShadowElevation;
-  elevation_1: ShadowElevation;
-  elevation_2: ShadowElevation;
-  elevation_3: ShadowElevation;
-  elevation_4: ShadowElevation;
-}
-
-declare const Shadow: ShadowMap;
-
-type ShadowLevel = keyof ShadowMap;
-
-interface ShadowTokenProps {
-  /** Elevation level */
-  level?: ShadowLevel;
-  /** Content */
-  children?: React.ReactNode;
-  /** MUI sx overrides */
-  sx?: SxProps;
-  [key: string]: any;
-}
-
-declare function ShadowToken(props: ShadowTokenProps): React.ReactElement;
-
-interface RadiusMap {
-  radius_0: string;
-  radius_1: string;
-  radius_2: string;
-  radius_3: string;
-  radius_4: string;
-  radius_x: string;
-}
-
-declare const Radius: RadiusMap;
-
-type RadiusLevel = keyof RadiusMap;
-
-interface RadiusTokenProps {
-  /** Radius level */
-  radius?: RadiusLevel;
-  /** Content */
-  children?: React.ReactNode;
-  /** MUI sx overrides */
-  sx?: SxProps;
-  [key: string]: any;
-}
-
-declare function RadiusToken(props: RadiusTokenProps): React.ReactElement;
-
-interface BaseButtonProps {
-  /** Click handler */
-  onClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
-  /** Button content */
-  children?: React.ReactNode;
-  /** Visual style variant */
-  variant?: "fill" | "outline" | "text" | "fab" | "ellipse-fill" | "ellipse-outline";
-  /** Semantic color preset */
-  color?: "primary" | "secondary" | "success" | "warning" | "danger";
-  /** Custom color key from PrimitiveColor. Overrides `color` prop when set. */
-  customColor?: keyof typeof PrimitiveColor | null;
-  /** Button size */
-  size?: "large" | "small";
-  /** Disabled state */
-  disabled?: boolean;
-  /** Icon element rendered before children */
-  startIcon?: React.ReactNode;
-  /** Icon element rendered after children */
-  endIcon?: React.ReactNode;
-  /** Button width */
-  width?: string;
-  /** MUI sx overrides */
-  sx?: SxProps;
-  [key: string]: any;
-}
-
-declare function BaseButton(props: BaseButtonProps): React.ReactElement;
-
-interface BaseSkeletonProps {
-  /**
-   * Skeleton shape variant.
-   * - `text` — single line of text placeholder
-   * - `rectangular` — rectangle block placeholder
-   * - `rounded` — rectangle with border-radius
-   * - `circular` — circle placeholder (avatar, icon)
-   */
-  variant?: "text" | "rectangular" | "rounded" | "circular";
-  /**
-   * Animation type.
-   * - `pulse` — fading animation (default)
-   * - `wave` — wave sweep animation
-   * - `none` — no animation (static)
-   */
-  animation?: "pulse" | "wave" | "none";
-  /** Width of the skeleton. Accepts number (px) or string (e.g. "100%", "200px") */
-  width?: number | string;
-  /** Height of the skeleton. Accepts number (px) or string (e.g. "40px", "1.2em") */
-  height?: number | string;
-  /** Number of skeleton lines to render. If > 1, renders stacked skeletons. */
-  count?: number;
-  /** Gap between stacked skeletons when count > 1. Default is SpacingToken.spacing2 */
-  gap?: string | number;
-  /** MUI sx overrides */
-  sx?: SxProps;
-  [key: string]: any;
-}
-
-declare function BaseSkeleton(props: BaseSkeletonProps): React.ReactElement;
-
-interface BaseSwitchProps {
-  /** Current switch state */
-  status?: boolean;
-  /** Label text or element */
-  label?: React.ReactNode;
-  /** Label position relative to the switch */
-  labelPlacement?: "start" | "end" | "top" | "bottom";
-  /** Disabled state */
-  isDisabled?: boolean;
-  /** Change handler */
-  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-}
-
-declare function BaseSwitch(props: BaseSwitchProps): React.ReactElement;
-
-interface BaseCardProps {
-  /** Card variant type */
-  variant?: "default" | "with-header" | "with-header-footer";
-  /** Card body content */
-  children?: React.ReactNode;
-  /** Header background color preset */
-  color?: "primary" | "secondary" | "success" | "warning" | "danger";
-  /** Header title text */
-  title?: string;
-  /** Header subtitle text */
-  subtitle?: string;
-  /** Bold the title */
-  boldTitle?: boolean;
-  /** Bold the subtitle */
-  boldSubtitle?: boolean;
-  /** Show/hide subtitle */
-  showSubtitle?: boolean;
-  /** Enable collapse/expand on header click */
-  isCollapsible?: boolean;
-  /** Icon element before title in header */
-  startIcon?: React.ReactNode;
-  /** Icon element after title in header */
-  endIcon?: React.ReactNode;
-  /** Show/hide startIcon */
-  showStartIcon?: boolean;
-  /** Show/hide endIcon */
-  showEndIcon?: boolean;
-  /** Footer content (only for with-header-footer variant) */
-  footer?: React.ReactNode;
-  /** Enable watermark overlay on content area */
-  isWatermark?: boolean;
-  /** Watermark text (e.g. "12345678 / Brispot Web") */
-  watermarkText?: string;
-  /** MUI sx overrides */
-  sx?: SxProps;
-  [key: string]: any;
-}
-
-declare function BaseCard(props: BaseCardProps): React.ReactElement;
-
-interface BaseSnackbarPosition {
-  vertical: "top" | "bottom";
-  horizontal: "left" | "center" | "right";
-}
-
-interface BaseSnackbarProps {
-  /** Whether the snackbar is open */
-  open?: boolean;
-  /** Close handler */
-  onClose?: (event?: React.SyntheticEvent | Event, reason?: string) => void;
-  /** Snackbar message content */
-  message?: string;
-  /** Color variant */
-  variant?: "success" | "error" | "info" | "warning" | "default";
-  /** Auto hide duration in milliseconds */
-  duration?: number;
-  /** Anchor origin position */
-  position?: BaseSnackbarPosition;
-  /** Icon element or component. If not provided, no icon is shown. */
-  icon?: React.ReactNode | React.ComponentType<any>;
-  /** MUI sx overrides */
-  sx?: SxProps;
-  [key: string]: any;
-}
-
-declare function BaseSnackbar(props: BaseSnackbarProps): React.ReactElement;
-
-interface BaseCheckboxOption {
-  /** Label yang ditampilkan */
-  label: React.ReactNode;
-  /** Nilai opsi */
-  value: string;
-  /** Nonaktifkan opsi ini */
-  disabled?: boolean;
-  [key: string]: any;
-}
-
-interface BaseCheckboxSharedProps {
-  /** Daftar opsi checkbox (untuk mode group) */
-  options: BaseCheckboxOption[];
-  /** Label untuk mode single checkbox */
-  label?: React.ReactNode;
-  /** Nonaktifkan semua checkbox */
-  disabled?: boolean;
-  /** Posisi label relatif terhadap checkbox */
-  labelPlacement?: "top" | "bottom" | "start" | "end";
-  /** Tampilkan checkbox secara horizontal */
-  isHorizontal?: boolean;
-  /** Custom styles via MUI sx prop */
-  sx?: SxProps;
-  [key: string]: any;
-}
-
-interface BaseCheckboxSingleProps extends Omit<BaseCheckboxSharedProps, "options"> {
-  options?: undefined;
-  /** Nilai checked untuk single checkbox */
-  checked?: boolean;
-  /** Callback ketika nilai berubah (single mode) */
-  onChange?: (checked: boolean, event?: React.ChangeEvent<HTMLInputElement>) => void;
-}
-
-interface BaseCheckboxGroupProps extends BaseCheckboxSharedProps {
-  options: BaseCheckboxOption[];
-  /** Array nilai yang dipilih (group mode) */
-  checked?: string[];
-  /** Callback ketika nilai berubah (group mode) */
-  onChange?: (newValue: string[]) => void;
-}
-
-type BaseCheckboxProps =
-  | BaseCheckboxSingleProps
-  | BaseCheckboxGroupProps;
-
-declare function BaseCheckbox(
-  props: BaseCheckboxProps,
-): React.ReactElement | null;
-
-type BaseDatatableAlign =
-  | "left"
-  | "center"
-  | "right"
-  | "justify"
-  | "inherit"
-  | (string & {});
-
-interface BaseDatatableColumn<T = Record<string, any>> {
-  id?: string;
-  key?: string;
-  field?: string;
-  sortField?: string;
-  label?: ReactNode;
-  header?: ReactNode;
-  accessorKey?: string;
-  accessorFn?: (row: T) => any;
-  align?: BaseDatatableAlign;
-  headerAlign?: BaseDatatableAlign;
-  width?: number;
-  minWidth?: number;
-  sticky?: "left" | "right";
-  sortable?: boolean;
-  noWrap?: boolean;
-  cellBg?: string;
-  cellText?: string;
-  cellSx?: SxProps;
-  renderCell?: (context: {
-    value: any;
-    row: T;
-    rowIndex: number;
-    column: BaseDatatableColumn<T>;
-    columnIndex: number;
-    checked?: boolean;
-  }) => ReactNode;
-}
-
-interface BaseDatatableHeaderCell {
-  id?: string;
-  key?: string;
-  label: ReactNode;
-  align?: BaseDatatableAlign;
-  colSpan?: number;
-  rowSpan?: number;
-  colspan?: number;
-  rowspan?: number;
-  sortKey?: string;
-  width?: number;
-  minWidth?: number;
-  sticky?: "left" | "right";
-  sx?: SxProps;
-}
-
-interface BaseDatatableFeatures {
-  sorting?: boolean;
-  sortingMode?: "client" | "server";
-  defaultSort?: BaseDatatableSortState | null;
-  sortState?: BaseDatatableSortState | null;
-  resetPageOnSort?: boolean;
-  onSortChange?: (
-    payload: BaseDatatableSortPayload,
-    column: BaseDatatableColumn,
-    cell: BaseDatatableHeaderCell,
-  ) => void;
-  headerInteractive?: boolean;
-}
-
-interface BaseDatatableSortState {
-  key: string;
-  direction: "asc" | "desc";
-}
-
-interface BaseDatatableSortPayload {
-  orderBy: string;
-  order: "asc" | "desc";
-  page: number;
-  rowsPerPage: number;
-}
-
-interface BaseDatatableLayout {
-  stickyHeader?: boolean;
-  stickyOffset?: number;
-  freezeLeft?: number;
-  freezeRight?: number;
-  maxHeight?: number;
-}
-
-interface BaseDatatableSelection<T = Record<string, any>> {
-  enabled?: boolean;
-  position?: "left" | "right";
-  selectRowOnClick?: boolean;
-  selectedRowIds?: Array<string | number>;
-  defaultSelectedRowIds?: Array<string | number>;
-  onChange?: (selectedRowIds: Array<string | number>) => void;
-  isRowSelectable?: (row: T, rowIndex: number) => boolean;
-}
-
-interface BaseDatatablePagination {
-  enabled?: boolean;
-  serverSide?: boolean;
-  count?: number;
-  page?: number;
-  rowsPerPage?: number;
-  rowsPerPageOptions?: number[];
-  labelRowsPerPage?: ReactNode;
-  onPageChange?: (event: unknown, nextPage: number) => void;
-  onRowsPerPageChange?: (event: unknown, nextRowsPerPage: number) => void;
-}
-
-interface BaseDatatableCellOverrides {
-  rowSpan?: number;
-  colSpan?: number;
-  content?: ReactNode;
-  sx?: SxProps;
-}
-
-interface BaseDatatableRenderRowContext<T = Record<string, any>> {
-  row: T;
-  rowIndex: number;
-  rowId: string | number;
-  rowActive: boolean;
-  columns: BaseDatatableColumn<T>[];
-  dataColumns: BaseDatatableColumn<T>[];
-  selectedRowIds: Array<string | number>;
-  renderCell: (
-    column: BaseDatatableColumn<T>,
-    row: T,
-    rowIndex: number,
-    columnIndex: number,
-    rowId: string | number,
-    rowActive: boolean,
-    cellOverrides?: BaseDatatableCellOverrides,
-  ) => ReactNode;
-}
-
-interface BaseDatatableProps<T = Record<string, any>> {
-  columns?: Array<BaseDatatableColumn<T> | string>;
-  data?: T[];
-  header?: BaseDatatableHeaderCell[][];
-  features?: BaseDatatableFeatures;
-  layout?: BaseDatatableLayout;
-  selection?: BaseDatatableSelection<T>;
-  pagination?: BaseDatatablePagination;
-  renderRow?: (context: BaseDatatableRenderRowContext<T>) => ReactNode;
-  onRowClick?: (row: T, rowIndex: number) => void;
-  getRowId?: (row: T, rowIndex: number) => string | number;
-  emptyState?: ReactNode;
-  loading?: boolean;
-  loadingText?: ReactNode;
-  rowHover?: boolean;
-  activeRowId?: string | number | null;
-  containerSx?: SxProps;
-  tableSx?: SxProps;
-}
-
-declare function BaseDatatable<T = Record<string, any>>(
-  props: BaseDatatableProps<T>,
-): ReactNode;
-
-interface BaseDatePickerProps {
-  /** Picker mode */
-  type?: "single" | "day" | "datetime" | "range" | "month" | "year" | "time";
-  /** Field name for React Hook Form */
-  name: string;
-  /** Control object from react-hook-form */
-  control: any;
-  /** Default selected value */
-  defaultValue?: any;
-  /** Label title above input */
-  title?: string;
-  /** Optional subtitle */
-  subtitle?: string;
-  /** Input placeholder text */
-  placeholder?: string;
-  /** Minimum selectable date */
-  minDate?: Date | string;
-  /** Maximum selectable date */
-  maxDate?: Date | string;
-  /** Disable picker interaction */
-  isDisabled?: boolean;
-  /** Allow user to clear selected value */
-  clearable?: boolean;
-  /** Allow manual input editing (range only) */
-  editableDateInputs?: boolean;
-  /** Display format for value */
-  format?: string;
-  /** How the calendar popup is triggered */
-  openBy?: "field" | "icon" | "both";
-  /** MUI sx overrides for the wrapper */
-  sx?: SxProps;
-  /** Custom onChange handler */
-  onChange?: (value: any) => void;
-  [key: string]: any;
-}
-
-declare function BaseDatePicker(
-  props: BaseDatePickerProps,
-): React.ReactElement | null;
-
-interface DropdownOption {
-  label: string;
-  value: string;
-  disabled?: boolean;
-  [key: string]: any;
-}
-
-interface BaseDropdownProps {
-  /** Field name for react-hook-form */
-  name: string;
-  /** Control object from react-hook-form */
-  control: any;
-  /** Static options list */
-  options?: DropdownOption[];
-  /** Async options loader function */
-  loadOptions?: (inputValue: string) => Promise<DropdownOption[]>;
-  /** Enable multi select mode */
-  isMulti?: boolean;
-  /** Enable search input */
-  isSearchable?: boolean;
-  /** Show selected values as chips (multi only) */
-  showChip?: boolean;
-  /** Show Select All checkbox (multi only) */
-  showSelectAll?: boolean;
-  /** Label title */
-  title?: string;
-  /** Subtitle text */
-  subtitle?: string;
-  /** Default selected value */
-  defaultValue?: any;
-  /** Disable dropdown */
-  isDisabled?: boolean;
-  /** Allow clearing value */
-  isClearable?: boolean;
-  /** Limit max height with scroll */
-  preventOverflow?: boolean;
-  /** Colors for multi-value tags */
-  optionColors?: string[];
-  /** Dropdown variant */
-  variant?: "select" | "checkbox";
-  /** MUI sx overrides for wrapper */
-  sx?: SxProps;
-  /** Custom onChange handler */
-  onChange?: (value: any) => void;
-  [key: string]: any;
-}
-
-declare function BaseDropdown(
-  props: BaseDropdownProps,
-): React.ReactElement;
-
-interface BaseDropzoneSettings {
-  /** Ekstensi file yang diizinkan (format react-dropzone accept) */
-  allowedExtensions?: Record<string, string[]>;
-  /** Ukuran maksimal file dalam MB */
-  maxSize?: number;
-  /** Jumlah maksimal file yang dapat diupload */
-  maxFiles?: number;
-  /** Tampilkan preview gambar */
-  isImagePreview?: boolean;
-  /** Tipe tampilan preview */
-  previewType?: "grid" | "list";
-}
-
-interface BaseDropzoneLabels {
-  /** Label judul di atas dropzone */
-  title?: React.ReactNode;
-  /** Teks utama di dalam area dropzone */
-  dropzoneTitle?: string;
-  /** Label pada tombol pilih file */
-  titleButton?: string;
-  /** Teks keterangan format file yang diizinkan */
-  allowedFileLabel?: string;
-}
-
-interface BaseDropzoneCallbacks {
-  /** Callback ketika file berhasil diupload */
-  uploadFile?: (files: Array<{ source: string; originName: string; type: string; size: number }>) => void;
-  /** Callback ketika file dihapus */
-  removeFile?: (fileName: string) => void;
-  /** Pesan error kustom dari luar komponen */
-  customError?: string | null;
-}
-
-interface BaseDropzoneProps {
-  /** Upload otomatis setelah file dipilih */
-  autoUpload?: boolean;
-  /** Pengaturan dropzone */
-  settings?: BaseDropzoneSettings;
-  /** Label-label yang ditampilkan */
-  labels?: BaseDropzoneLabels;
-  /** Callback functions */
-  callbacks?: BaseDropzoneCallbacks;
-}
-
-declare function BaseDropzone(
-  props: BaseDropzoneProps,
-): React.ReactElement;
-
-interface BaseRadioOption {
-  label: React.ReactNode;
-  value: any;
-  isDisabled?: boolean;
-  [key: string]: any;
-}
-
-interface BaseRadioButtonProps {
-  /** Nama field untuk react-hook-form */
-  name?: string;
-  /** Control dari useForm() */
-  control?: any;
-  /** Nilai awal yang dipilih */
-  defaultValue?: any;
-  /** Label di atas radio group */
-  label?: React.ReactNode;
-  /** Daftar opsi radio */
-  options?: BaseRadioOption[];
-  /** Variant typography untuk label */
-  labelVariant?: string;
-  /** Variant typography untuk pesan error */
-  errorVariant?: string;
-  /** Orientasi layout radio group */
-  orientation?: "vertical" | "horizontal";
-  /** Token warna untuk radio yang dipilih */
-  radioColorToken?: string;
-  /** Nonaktifkan semua opsi */
-  isDisabled?: boolean;
-  /** Gunakan error state helper untuk nested field names */
-  useErrorStateHelper?: boolean;
-  /** Custom styles via MUI sx prop */
-  sx?: SxProps;
-
-  [key: string]: any;
-}
-
-declare function BaseRadioButton(
-  props: BaseRadioButtonProps,
-): React.ReactElement | null;
-
-interface BaseStepperSimpleStep {
-  /** Step status text (e.g. "Completed", "In Progress") */
-  status?: string;
-  /** Step label/description */
-  label?: string;
-}
-
-interface BaseStepperDashboardSublist {
-  sublist_title?: string;
-  is_done?: 0 | 1;
-}
-
-interface BaseStepperDashboardStep {
-  title?: string;
-  sublist?: BaseStepperDashboardSublist[];
-  is_done?: 0 | 1;
-}
-
-interface BaseStepperProps {
-  /** Array of step objects */
-  steps?: BaseStepperSimpleStep[] | BaseStepperDashboardStep[];
-  /** Currently active step index (for simple variant) */
-  activeStep?: number;
-  /** Layout orientation */
-  orientation?: "horizontal" | "vertical";
-  /** Stepper visual variant */
-  variant?: "simple" | "dashboard";
-  /** MUI sx overrides for wrapper */
-  sx?: SxProps;
-}
-
-declare function BaseStepper(props: BaseStepperProps): React.ReactElement;
-
-interface BaseTextFieldProps {
-  /** Field name for react-hook-form binding */
-  name: string;
-  /** Control object from react-hook-form */
-  control: any;
-  /** Default value for the field */
-  defaultValue?: any;
-  /** Label title displayed above the input */
-  title?: string;
-  /** Maximum character length */
-  maxLength?: number;
-  /** Show "Maksimal X Karakter" helper text */
-  showLength?: boolean;
-  /** Show character counter (e.g. 5/20) */
-  showCountHelper?: boolean;
-  /** Only allow numeric input (0-9) */
-  isNumericOnly?: boolean;
-  /** Only allow alphanumeric input (a-z, A-Z, 0-9) */
-  isAlphaNumericOnly?: boolean;
-  /** Only allow alphabetic input (a-z, A-Z) */
-  isAlphaOnly?: boolean;
-  /** Additional special characters to allow */
-  allowedSpecialCharacters?: string;
-  /** Special characters to disallow */
-  dontAllowedSpecialCharacters?: string;
-  /** Disable the input */
-  isDisabled?: boolean;
-  /** Prevent paste action */
-  isCantPaste?: boolean;
-  /** Result text shown below the input */
-  result?: React.ReactNode;
-  /** Color for the result text */
-  resultColor?: string;
-  /** Disallow spaces */
-  noSpaceAllowed?: boolean;
-  /** Input mask pattern (use 'x' for editable slots, e.g. "0xxx-xxxx-xxxx") */
-  textMask?: string;
-  /** MUI InputProps (startAdornment, endAdornment, sx, etc.) */
-  InputProps?: Record<string, any>;
-  /** Native input props (min, max, step, etc.) */
-  inputProps?: Record<string, any>;
-  /** MUI sx overrides for the wrapper Box */
-  sx?: SxProps;
-  /** Input placeholder text */
-  placeholder?: string;
-  /** Input type (text, password, email, etc.) */
-  type?: string;
-  [key: string]: any;
-}
-
-declare function BaseTextField(
-  props: BaseTextFieldProps,
-): React.ReactElement | null;
-
-interface TextFieldUploadProps {
-  /** Nama field untuk react-hook-form */
-  name?: string;
-  /** Control dari useForm() */
-  control?: any;
-  /** Nilai awal field */
-  defaultValue?: string;
-  /** Label di atas field */
-  title?: React.ReactNode;
-  /** Ekstensi file yang diterima (contoh: ".pdf,.jpg") */
-  accept?: string;
-  /** Ukuran maksimal file dalam MB */
-  maxSize?: number;
-  /** Nonaktifkan field */
-  isDisabled?: boolean;
-  /** Label pada tombol upload */
-  buttonLabel?: string;
-  /** Posisi tombol upload relatif terhadap input */
-  buttonPosition?: "start" | "end";
-  /** Callback ketika file dipilih */
-  uploadFile?: (fileName: string, file: File | null) => void;
-  /** Posisi ikon pada tombol upload */
-  iconPosition?: "start" | "end";
-}
-
-declare function TextFieldUpload(
-  props: TextFieldUploadProps,
-): React.ReactElement | null;
-
-interface TinyMCEInitConfig {
-  /** Placeholder text di area editor */
-  placeholder?: string;
-  /** Prefix URL untuk image upload */
-  prefixUrl?: string;
-  [key: string]: any;
-}
-
-interface BaseTextAreaProps {
-  /** Nama field untuk react-hook-form */
-  name?: string;
-  /** Control dari useForm() */
-  control?: Control<any>;
-  /** Nilai awal (bisa HTML string jika useRichText aktif) */
-  defaultValue?: string;
-  /** Teks bantuan di bawah field (tampil jika tidak ada error) */
-  helperText?: React.ReactNode;
-  /** Validasi rules react-hook-form */
-  rules?: RegisterOptions;
-  /** Harus tepat N karakter (override min/maxLength) */
-  exactLength?: number;
-  /** Batas maksimal karakter */
-  maxLength?: number;
-  /** Label di atas field */
-  title?: string;
-  /** Nonaktifkan field */
-  isDisabled?: boolean;
-  /** Aktifkan TinyMCE rich-text editor (default: plain MUI textarea) */
-  useRichText?: boolean;
-  /** Override konfigurasi TinyMCE (placeholder, prefixUrl, dll) */
-  init?: TinyMCEInitConfig;
-  /** Callback file_picker_callback untuk upload gambar di rich text mode */
-  handleImageUpload?: (
-    callback: (url: string, meta?: Record<string, string>) => void,
-    value: string,
-    meta: Record<string, string>,
-  ) => void;
-  /** Custom styles via MUI sx prop */
-  sx?: SxProps;
-
-  [key: string]: any;
-}
-
-declare function BaseTextArea(
-  props: BaseTextAreaProps,
-): React.ReactElement | null;
-
-interface BaseModalProps {
-  open?: boolean;
-
-  onClose?: () => void;
-  onConfirm?: () => void;
-  onCancel?: () => void;
-
-  icon?: React.ReactNode;
-
-  title?: React.ReactNode;
-  description?: React.ReactNode;
-
-  children?: React.ReactNode;
-  footer?: React.ReactNode;
-
-  showConfirm?: boolean;
-  showCancel?: boolean;
-
-  confirmLabel?: string;
-  cancelLabel?: string;
-
-  confirmVariant?: string;
-  cancelVariant?: string;
-
-  confirmColor?: string;
-  cancelColor?: string;
-
-  confirmSize?: string;
-  cancelSize?: string;
-
-  align?: "left" | "center" | "right";
-
-  modalWidth?: string;
-
-  showCloseIcon?: boolean;
-
-  [key: string]: any;
-}
-
-declare function BaseModal(
-  props: BaseModalProps,
-): React.ReactElement | null;
-
-interface BaseModalAlertShowOptions {
-  /** Icon type preset or custom image path */
-  icon?: "success" | "error" | "info" | "warning" | "confirm" | string;
-  /** Modal title text */
-  title?: string;
-  /** Modal description text */
-  description?: string;
-  /** Cancel button text. Default: "Batal" */
-  cancelBtnText?: string;
-  /** Confirm button text. Default: "Ya" */
-  confirmBtnText?: string;
-  /** Cancel button action. Default: closes modal. Can be custom function. */
-  cancelBtnProps?: () => void;
-  /** Confirm button action. Called on confirm click. */
-  confirmBtnProps?: () => void;
-  /** Show cancel button. Default: true */
-  showCancelBtn?: boolean;
-  /** Show confirm button. Default: true */
-  showConfirmBtn?: boolean;
-}
-
-interface BaseModalAlertDialogProps extends BaseModalAlertShowOptions {
-  /** Whether the modal is open */
-  open?: boolean;
-  /** Close handler */
-  onClose?: () => void;
-}
-
-/**
- * Imperative BaseModalAlert API.
- *
- * Usage:
- * ```jsx
- * import { BaseModalAlert } from 'spotlibs-components';
- *
- * BaseModalAlert.show({
- *   icon: 'success',
- *   title: 'Berhasil!',
- *   description: 'Data berhasil disimpan.',
- *   confirmBtnText: 'OK',
- *   showCancelBtn: false,
- *   confirmBtnProps: () => console.log('confirmed'),
- * });
- *
- * BaseModalAlert.hide();
- * ```
- */
-declare const BaseModalAlert: {
-  /** Show the modal alert with given options */
-  show: (options: BaseModalAlertShowOptions) => void;
-  /** Hide the modal alert */
-  hide: () => void;
-  /** Internal: set modal ref (used by BaseModalAlertProvider) */
-  setModalRef: (ref: React.RefObject<any>) => void;
-};
-
-/**
- * Provider component. Mount once at app root to enable BaseModalAlert.show()/hide().
- *
- * ```jsx
- * import { BaseModalAlertProvider } from 'spotlibs-components';
- *
- * function App() {
- *   return (
- *     <>
- *       <BaseModalAlertProvider />
- *       <YourApp />
- *     </>
- *   );
- * }
- * ```
- */
-declare function BaseModalAlertProvider(): React.ReactElement;
-
-/**
- * Controlled dialog component for direct usage without imperative API.
- */
-declare function BaseModalAlertDialog(props: BaseModalAlertDialogProps): React.ReactElement;
-
-interface BaseModalLoadingDialogProps {
-  /** Whether the loading modal is open */
-  open?: boolean;
-  /** Loading message text. Default: "Mohon tunggu..." */
-  message?: string;
-}
-
-/**
- * Imperative BaseModalLoading API.
- *
- * Usage:
- * ```jsx
- * import { BaseModalLoading } from 'spotlibs-components';
- *
- * BaseModalLoading.show(); // default message
- * BaseModalLoading.show("Sedang memproses data...");
- * BaseModalLoading.hide();
- * ```
- */
-declare const BaseModalLoading: {
-  /** Show the loading modal. Optionally pass a custom message. */
-  show: (message?: string) => void;
-  /** Hide the loading modal */
-  hide: () => void;
-  /** Internal: set modal ref (used by BaseModalLoadingProvider) */
-  setModalRef: (ref: React.RefObject<any>) => void;
-};
-
-/**
- * Provider component. Mount once at app root to enable BaseModalLoading.show()/hide().
- *
- * ```jsx
- * import { BaseModalLoadingProvider } from 'spotlibs-components';
- *
- * function App() {
- *   return (
- *     <>
- *       <BaseModalLoadingProvider />
- *       <YourApp />
- *     </>
- *   );
- * }
- * ```
- */
-declare function BaseModalLoadingProvider(): React.ReactElement;
-
-/**
- * Controlled loading dialog component for direct usage without imperative API.
- */
-declare function BaseModalLoadingDialog(props: BaseModalLoadingDialogProps): React.ReactElement;
-
-interface BaseModalPopupProps {
-  /** Whether the modal is open */
-  open?: boolean;
-  /** Close handler */
-  onClose?: () => void;
-  /** Modal variant type */
-  variant?: "default" | "with-header" | "with-header-footer";
-  /** Header background color preset */
-  color?: "primary" | "secondary" | "success" | "warning" | "danger";
-  /** Header title text */
-  title?: string;
-  /** Header subtitle text */
-  subtitle?: string;
-  /** Icon element before title in header */
-  startIcon?: React.ReactNode;
-  /** Modal body content */
-  children?: React.ReactNode;
-  /** Footer content (only for with-header-footer variant) */
-  footer?: React.ReactNode;
-  /** MUI Dialog maxWidth. Default: "sm" */
-  maxWidth?: "xs" | "sm" | "md" | "lg" | "xl" | false;
-  /** Whether dialog takes full width of maxWidth. Default: true */
-  fullWidth?: boolean;
-  /** Enable watermark overlay on content area */
-  isWatermark?: boolean;
-  /** Watermark text (e.g. "12345678 / Brispot Web") */
-  watermarkText?: string;
-  /** MUI sx overrides for Dialog */
-  sx?: SxProps;
-  [key: string]: any;
-}
-
-declare function BaseModalPopup(props: BaseModalPopupProps): React.ReactElement;
-
-interface BaseModalStepperStep {
-  label?: string;
-  description?: string;
-  responseCode?: string;
-  responseDesc?: string;
-  responseTime?: number;
-}
-
-interface BaseModalStepperProps {
-  open: boolean;
-
-  onClose: (event?: any, reason?: any) => void;
-
-  title?: string;
-
-  stepper?: BaseModalStepperStep[];
-
-  navState?: string | number | null;
-
-  lengthUpload?: number;
-
-  id_pengajuan?: number | null;
-
-  showFooter?: boolean;
-
-  children?: React.ReactNode;
-
-  modalWidth?: string;
-
-  [key: string]: any;
-}
-
-declare function BaseModalStepper(
-  props: BaseModalStepperProps,
-): React.ReactElement | null;
-
-interface BaseModalOTPProps {
-  isOpen?: boolean;
-
-  phone?: string;
-
-  setIsOpen?: (open: boolean) => void;
-
-  otpLength?: number;
-
-  onValidateOtp?: (otp: string) => void;
-
-  onRequestOtp?: () => void;
-
-  [key: string]: any;
-}
-
-declare function BaseModalOTP(
-  props: BaseModalOTPProps,
-): React.ReactElement | null;
-
-export { type BaseDatePickerProps as $, RadiusToken as A, BaseAlert as B, CONTENT_SPACING_TOKENS as C, DerivedColor as D, ShadowToken as E, Spacing as F, SpacingToken as G, type BaseAlertProps as H, type BaseButtonProps as I, type BaseCardProps as J, type BaseCheckboxOption as K, type BaseCheckboxProps as L, type BaseDatatableAlign as M, type BaseDatatableColumn as N, type BaseDatatableFeatures as O, PrimitiveColor as P, type BaseDatatableHeaderCell as Q, Radius as R, Shadow as S, TextFieldUpload as T, type BaseDatatableLayout as U, VariantStyles as V, type BaseDatatablePagination as W, type BaseDatatableProps as X, type BaseDatatableSelection as Y, type BaseDatatableSortPayload as Z, type BaseDatatableSortState as _, BaseButton as a, type BaseDropdownProps as a0, type BaseDropzoneProps as a1, type BaseModalAlertDialogProps as a2, type BaseModalAlertShowOptions as a3, type BaseModalLoadingDialogProps as a4, type BaseModalOTPProps as a5, type BaseModalPopupProps as a6, type BaseModalProps as a7, type BaseModalStepperProps as a8, type BaseModalStepperStep as a9, type BaseRadioButtonProps as aa, type BaseSkeletonProps as ab, type BaseSnackbarPosition as ac, type BaseSnackbarProps as ad, type BaseStepperDashboardStep as ae, type BaseStepperProps as af, type BaseStepperSimpleStep as ag, type BaseSwitchProps as ah, type BaseTextAreaProps as ai, type BaseTextFieldProps as aj, type ContentSpacingProps as ak, type DerivedColorType as al, type PrimitiveColorType as am, type RadiusLevel as an, type RadiusMap as ao, type RadiusTokenProps as ap, type ShadowElevation as aq, type ShadowLevel as ar, type ShadowMap as as, type ShadowTokenProps as at, type SpacingProps as au, type TextFieldUploadProps as av, type TypographyColor as aw, type TypographyProps as ax, type TypographyVariant as ay, BaseCard as b, BaseCheckbox as c, BaseDatatable as d, BaseDatePicker as e, BaseDropdown as f, BaseDropzone as g, BaseModal as h, BaseModalAlert as i, BaseModalAlertDialog as j, BaseModalAlertProvider as k, BaseModalLoading as l, BaseModalLoadingDialog as m, BaseModalLoadingProvider as n, BaseModalOTP as o, BaseModalPopup as p, BaseModalStepper as q, BaseRadioButton as r, BaseSkeleton as s, BaseSnackbar as t, BaseStepper as u, BaseSwitch as v, BaseTextArea as w, BaseTextField as x, BaseTypography as y, ContentSpacing as z };