API Reference
Sparkle Design System API / types/src
types/src
Section titled “types/src”Interfaces
Section titled “Interfaces”AnimationScale
Section titled “AnimationScale”Animation scale for durations, easing curves, and transitions
ApiResponse
Section titled “ApiResponse”Common API response types
Type Parameters
Section titled “Type Parameters”T = unknown
BaseProps
Section titled “BaseProps”Common component prop types
Extended by
Section titled “Extended by”BorderRadiusScale
Section titled “BorderRadiusScale”Border radius scale for consistent corner radius values
ColorScale
Section titled “ColorScale”Color scale definition for theme colors Supports both named colors and numeric scales (50, 100, 200, etc.)
FieldProps
Section titled “FieldProps”Common form field props
Extends
Section titled “Extends”Extended by
Section titled “Extended by”FormFieldProps
Section titled “FormFieldProps”Extended form field props for advanced form components
Extends
Section titled “Extends”Properties
Section titled “Properties”name:
string
Field name for form submission and validation
optionalsize:"sm"|"md"|"lg"
Size variant for the field
optionaltype:"text"|"email"|"password"|"textarea"|"select"
Field type for input elements
validationState?
Section titled “validationState?”
optionalvalidationState:"default"|"error"|"success"
Validation state of the field
FormMessageProps
Section titled “FormMessageProps”Form validation message props
Extends
Section titled “Extends”Properties
Section titled “Properties”match()?
Section titled “match()?”
optionalmatch: (value,formData) =>boolean|Promise<boolean>
Custom validation function
Parameters
Section titled “Parameters”string
formData
Section titled “formData”FormData
Returns
Section titled “Returns”boolean | Promise<boolean>
validationType?
Section titled “validationType?”
optionalvalidationType:"valueMissing"|"typeMismatch"|"patternMismatch"|"tooLong"|"tooShort"|"rangeUnderflow"|"rangeOverflow"|"stepMismatch"|"badInput"
Built-in validation type
PaginationParams
Section titled “PaginationParams”Common pagination parameters
ShadowScale
Section titled “ShadowScale”Shadow scale for box shadows and elevation
SpacingScale
Section titled “SpacingScale”Spacing scale for consistent spacing values
ThemeConfig
Section titled “ThemeConfig”Comprehensive theme configuration with design token system Compatible with both Tailwind CSS (web) and React Native StyleSheet (mobile)
Properties
Section titled “Properties”animation
Section titled “animation”animation:
AnimationScale
Animation system for durations, easing, and transitions
borderRadius
Section titled “borderRadius”borderRadius:
BorderRadiusScale
Border radius system for consistent corner treatments
colors
Section titled “colors”colors:
ColorScale
Color system with semantic and brand colors Supports nested scales (e.g., primary: { 50: ’#…’, 500: ’#…’ })
shadows
Section titled “shadows”shadows:
ShadowScale
Shadow system for elevation and depth
spacing
Section titled “spacing”spacing:
SpacingScale
Spacing scale for margins, padding, gaps, and layout
typography
Section titled “typography”typography:
TypographyScale
Typography system with fonts, sizes, weights, and spacing
TypographyScale
Section titled “TypographyScale”Typography scale with font families, sizes, weights, and line heights
Common user types