Core Types

import type {
  ChakraComponent,
  HTMLChakraProps,
  JsxStyleProps,
  PolymorphicProps,
  InferRecipeProps,
  UnstyledProp,
  DataAttr,
} from "@chakra-ui/react";

// Chakra component type with styling capabilities
type ChakraComponent<
  T extends keyof JSX.IntrinsicElements,
  P = {}
> = React.ForwardRefExoticComponent<HTMLChakraProps<T> & P>;

// HTML props with Chakra style props
type HTMLChakraProps<T extends keyof JSX.IntrinsicElements> =
  JSX.IntrinsicElements[T] & JsxStyleProps & UnstyledProp & DataAttr;

// Style props available on all Chakra components
interface JsxStyleProps {
  css?: SystemStyleObject;
  // All CSS properties as props
  color?: ConditionalValue<string>;
  bg?: ConditionalValue<string>;
  backgroundColor?: ConditionalValue<string>;
  padding?: ConditionalValue<string | number>;
  p?: ConditionalValue<string | number>;
  paddingTop?: ConditionalValue<string | number>;
  pt?: ConditionalValue<string | number>;
  margin?: ConditionalValue<string | number>;
  m?: ConditionalValue<string | number>;
  // ... all style props
  _hover?: SystemStyleObject;
  _focus?: SystemStyleObject;
  _active?: SystemStyleObject;
  _disabled?: SystemStyleObject;
  _dark?: SystemStyleObject;
  // ... all conditional props
}

// Polymorphic component props (as prop)
interface PolymorphicProps<T extends React.ElementType = React.ElementType> {
  as?: T;
}

// Infer recipe props from recipe
type InferRecipeProps<T> = T extends RecipeFn<infer V> ? RecipeProps<V> : never;

// Unstyled prop to disable default styling
interface UnstyledProp {
  unstyled?: boolean;
}

// Data attributes helper
type DataAttr = {
  [key: `data-${string}`]: any;
};

import type {
  SystemStyleObject,
  GlobalStyleObject,
  ConditionalValue,
  CssKeyframes,
} from "@chakra-ui/react";

// Style object with token support
interface SystemStyleObject {
  [property: string]: ConditionalValue<any> | SystemStyleObject;
}

// Global CSS styles
interface GlobalStyleObject {
  [selector: string]: SystemStyleObject;
}

// Conditional/responsive value type
type ConditionalValue<T> =
  | T
  | T[]
  | {
      base?: T;
      sm?: T;
      md?: T;
      lg?: T;
      xl?: T;
      "2xl"?: T;
      _hover?: T;
      _focus?: T;
      _active?: T;
      _disabled?: T;
      _dark?: T;
      _light?: T;
      [condition: string]: T | undefined;
    };

// Keyframes definition
interface CssKeyframes {
  [keyframe: string]: SystemStyleObject;
}

import type {
  RecipeProps,
  SlotRecipeProps,
  SlotRecipeRecord,
  ConfigRecipeSlots,
  RecipeConfig,
  SlotRecipeConfig,
  RecipeFn,
  SlotRecipeFn,
  RecipeKey,
  SlotRecipeKey,
} from "@chakra-ui/react";

// Recipe props
interface RecipeProps<V = any> {
  [variant: string]: V;
}

// Slot recipe props
interface SlotRecipeProps<V = any> {
  [variant: string]: V;
}

// Slot recipe record
type SlotRecipeRecord<S extends string = string> = Record<
  S,
  SystemStyleObject
>;

// Config recipe slots
type ConfigRecipeSlots<T> = T extends { slots: infer S }
  ? S extends string[]
    ? S[number]
    : never
  : never;

// Recipe configuration
interface RecipeConfig {
  base?: SystemStyleObject;
  variants?: Record<string, Record<string, SystemStyleObject>>;
  compoundVariants?: Array<{
    [key: string]: any;
    css: SystemStyleObject;
  }>;
  defaultVariants?: Record<string, any>;
}

// Slot recipe configuration
interface SlotRecipeConfig {
  slots: string[];
  base?: Record<string, SystemStyleObject>;
  variants?: Record<string, Record<string, Record<string, SystemStyleObject>>>;
  compoundVariants?: Array<{
    [key: string]: any;
    css: Record<string, SystemStyleObject>;
  }>;
  defaultVariants?: Record<string, any>;
}

// Recipe function type
interface RecipeFn<V = any> {
  (props?: RecipeProps<V>): {
    className: string;
    css?: SystemStyleObject;
  };
  variantMap: Record<string, string[]>;
  variantKeys: string[];
}

// Slot recipe function type
interface SlotRecipeFn<S extends string = string, V = any> {
  (props?: SlotRecipeProps<V>): Record<
    S,
    {
      className: string;
      css?: SystemStyleObject;
    }
  >;
  slots: S[];
  variantMap: Record<string, string[]>;
  variantKeys: string[];
}

// Recipe keys (all recipe names)
type RecipeKey =
  | "badge"
  | "button"
  | "code"
  | "heading"
  | "input"
  | "kbd"
  | "link"
  | "mark"
  | "separator"
  | "skeleton"
  | "spinner"
  | "text"
  | "textarea";

// Slot recipe keys (all slot recipe names)
type SlotRecipeKey =
  | "accordion"
  | "actionBar"
  | "alert"
  | "avatar"
  | "blockquote"
  | "breadcrumb"
  | "card"
  | "checkbox"
  | "checkboxCard"
  | "clipboard"
  | "codeBlock"
  | "collapsible"
  | "colorPicker"
  | "combobox"
  | "dataList"
  | "dialog"
  | "drawer"
  | "editable"
  | "emptyState"
  | "field"
  | "fieldset"
  | "fileUpload"
  | "hoverCard"
  | "list"
  | "listbox"
  | "menu"
  | "nativeSelect"
  | "numberInput"
  | "pinInput"
  | "popover"
  | "progress"
  | "progressCircle"
  | "qrCode"
  | "radioCard"
  | "radioGroup"
  | "ratingGroup"
  | "scrollArea"
  | "segmentGroup"
  | "select"
  | "slider"
  | "stat"
  | "status"
  | "steps"
  | "switch"
  | "table"
  | "tabs"
  | "tag"
  | "timeline"
  | "toast"
  | "tooltip"
  | "treeView";

import type {
  WithProviderOptions,
  WithContextOptions,
  WithRootProviderOptions,
} from "@chakra-ui/react";

// Options for withProvider function
interface WithProviderOptions<P> extends JsxFactoryOptions<P> {
  wrapElement?(element: React.ReactElement, props: P): React.ReactElement;
}

// Options for withContext function
interface WithContextOptions<P> extends JsxFactoryOptions<P> {}

// Options for withRootProvider function
interface WithRootProviderOptions<P> {
  defaultProps?: Partial<P>;
  wrapElement?(element: React.ReactElement, props: P): React.ReactElement;
}

import type {
  TextStyle,
  TextStyles,
  LayerStyle,
  LayerStyles,
  AnimationStyle,
  AnimationStyles,
  CompositionStyles,
} from "@chakra-ui/react";

// Text style definition
interface TextStyle {
  fontSize?: string;
  fontWeight?: string;
  lineHeight?: string;
  letterSpacing?: string;
  textTransform?: string;
  fontFamily?: string;
}

// All text styles
type TextStyles = Record<string, TextStyle>;

// Layer style definition
type LayerStyle = SystemStyleObject;

// All layer styles
type LayerStyles = Record<string, LayerStyle>;

// Animation style definition
interface AnimationStyle {
  animationName: string;
  animationDuration: string;
  animationTimingFunction?: string;
  animationDelay?: string;
  animationIterationCount?: string | number;
  animationDirection?: string;
  animationFillMode?: string;
  animationPlayState?: string;
}

// All animation styles
type AnimationStyles = Record<string, AnimationStyle>;

// Composition styles
interface CompositionStyles {
  textStyles?: TextStyles;
  layerStyles?: LayerStyles;
  animationStyles?: AnimationStyles;
}

import type {
  Token,
  Tokens,
  TokenInterface,
  ColorPalette,
} from "@chakra-ui/react";

// Token definition
interface Token<T = any> {
  value: T;
  description?: string;
}

// All token categories
interface Tokens {
  colors?: Record<string, Token<string> | Record<string, Token<string>>>;
  spacing?: Record<string, Token<string>>;
  sizes?: Record<string, Token<string>>;
  fonts?: Record<string, Token<string>>;
  fontSizes?: Record<string, Token<string>>;
  fontWeights?: Record<string, Token<number>>;
  lineHeights?: Record<string, Token<string | number>>;
  letterSpacings?: Record<string, Token<string>>;
  radii?: Record<string, Token<string>>;
  shadows?: Record<string, Token<string>>;
  zIndex?: Record<string, Token<number>>;
  borders?: Record<string, Token<string>>;
  durations?: Record<string, Token<string>>;
  easings?: Record<string, Token<string>>;
  animations?: Record<string, Token<string>>;
  blurs?: Record<string, Token<string>>;
  breakpoints?: Record<string, Token<string>>;
  assets?: Record<string, Token<string>>;
  aspectRatios?: Record<string, Token<number>>;
  opacity?: Record<string, Token<number>>;
}

// Token interface for runtime access
interface TokenInterface {
  colors: Record<string, string>;
  spacing: Record<string, string>;
  sizes: Record<string, string>;
  fonts: Record<string, string>;
  fontSizes: Record<string, string>;
  fontWeights: Record<string, number>;
  lineHeights: Record<string, string | number>;
  letterSpacings: Record<string, string>;
  radii: Record<string, string>;
  shadows: Record<string, string>;
  zIndex: Record<string, number>;
  borders: Record<string, string>;
  durations: Record<string, string>;
  easings: Record<string, string>;
  animations: Record<string, string>;
  blurs: Record<string, string>;
  breakpoints: Record<string, string>;
  assets: Record<string, string>;
  aspectRatios: Record<string, number>;
  opacity: Record<string, number>;
}

// Color palette type
type ColorPalette =
  | "gray"
  | "red"
  | "orange"
  | "yellow"
  | "green"
  | "teal"
  | "blue"
  | "cyan"
  | "purple"
  | "pink"
  | "accent";

import type {
  SystemConfig,
  SystemContext,
  ThemingConfig,
} from "@chakra-ui/react";

// System configuration
interface SystemConfig {
  preflight?: boolean;
  cssVarsPrefix?: string;
  cssVarsRoot?: string;
  theme?: ThemingConfig;
  conditions?: Record<string, string>;
  utilities?: Record<string, UtilityConfig>;
}

// System context (runtime system instance)
interface SystemContext {
  getRecipe: (key: RecipeKey) => RecipeFn | undefined;
  getSlotRecipe: (key: SlotRecipeKey) => SlotRecipeFn | undefined;
  css: (styles: SystemStyleObject) => string;
  cva: (config: RecipeConfig) => RecipeFn;
  sva: (config: SlotRecipeConfig) => SlotRecipeFn;
  token: (path: string, fallback?: any) => any;
  breakpoints: Record<string, string>;
  conditions: Record<string, string>;
  config: SystemConfig;
}

// Theming configuration
interface ThemingConfig {
  tokens?: Tokens;
  semanticTokens?: SemanticTokens;
  breakpoints?: Record<string, string>;
  keyframes?: Record<string, CssKeyframes>;
  recipes?: Record<string, RecipeConfig>;
  slotRecipes?: Record<string, SlotRecipeConfig>;
  textStyles?: TextStyles;
  layerStyles?: LayerStyles;
  animationStyles?: AnimationStyles;
  globalCss?: GlobalStyleObject;
}

// Utility configuration
interface UtilityConfig {
  className?: string;
  values?: Record<string, any>;
  transform?: (value: any) => any;
}

import type {
  JsxFactory,
  JsxElement,
  JsxFactoryOptions,
  JsxHtmlProps,
  PatchHtmlProps,
  StyledFactoryFn,
  HtmlProp,
  HtmlProps,
} from "@chakra-ui/react";

// JSX factory type
type JsxFactory = <T extends keyof JSX.IntrinsicElements>(
  element: T,
  options?: JsxFactoryOptions<T>
) => ChakraComponent<T>;

// JSX element type
type JsxElement = React.ReactElement;

// JSX factory options
interface JsxFactoryOptions<T extends keyof JSX.IntrinsicElements> {
  shouldForwardProp?: (prop: string) => boolean;
  defaultProps?: Partial<HTMLChakraProps<T>>;
  label?: string;
}

// JSX HTML props
type JsxHtmlProps<T extends keyof JSX.IntrinsicElements> = JSX.IntrinsicElements[T];

// Patched HTML props
type PatchHtmlProps<T> = Omit<T, "color" | "width" | "height"> & JsxStyleProps;

// Styled factory function type
type StyledFactoryFn = JsxFactory;

// HTML prop type
type HtmlProp = React.HTMLAttributes<HTMLElement>;

// HTML props type
type HtmlProps<T extends keyof JSX.IntrinsicElements> = JSX.IntrinsicElements[T];

import type {
  CollectionItem,
  CollectionOptions,
  ListCollection,
  TreeCollection,
  TreeNode,
  FlatTreeNode,
  FilePathTreeNode,
  GridCollection,
} from "@chakra-ui/react";

// Collection item
interface CollectionItem {
  label: string;
  value: string;
  disabled?: boolean;
}

// Collection options
interface CollectionOptions<T> {
  items: T[];
  itemToString?: (item: T) => string;
  itemToValue?: (item: T) => string;
  itemToDisabled?: (item: T) => boolean;
}

// List collection
interface ListCollection<T> {
  items: T[];
  getItem: (value: string) => T | undefined;
  find: (value: string) => T | undefined;
  stringifyItem: (item: T) => string;
}

// Tree collection
interface TreeCollection {
  items: TreeNode[];
  getItem: (value: string) => TreeNode | undefined;
  // ... tree-specific methods
}

// Tree node
interface TreeNode {
  label: string;
  value: string;
  children?: TreeNode[];
}

// Flat tree node
interface FlatTreeNode {
  label: string;
  value: string;
  depth: number;
}

// File path tree node
interface FilePathTreeNode {
  path: string;
  type: "file" | "directory";
}

// Grid collection
interface GridCollection<T> {
  items: T[][];
  getItem: (row: number, col: number) => T | undefined;
}

interface SemanticTokens {
  colors?: Record<string, SemanticToken<string>>;
  spacing?: Record<string, SemanticToken<string>>;
  sizes?: Record<string, SemanticToken<string>>;
  // ... same structure as Tokens
}

interface SemanticToken<T = any> {
  value: T | ConditionalSemanticValue<T>;
  description?: string;
}

type ConditionalSemanticValue<T> = {
  base?: T;
  _light?: T;
  _dark?: T;
  [condition: string]: T | undefined;
};